Keskitaso📝 Dokumentointi

Storybook-storyn luonti

Luo Storybook-story komponentille.

Prompti

Luo Storybook-story seuraavalle komponentille.

Komponentti:
[KOODI]

Luo:
- Default story
- Eri variaatiot (koot, värit, tilat)
- Args ja argTypes
- Dokumentaatio (description, controls)
- Interaction tests tarvittaessa

Käytä CSF 3.0 -formaattia.

Suomenkieliset vinkit

Voit sekoittaa suomea ja englantia — teknisiä termejä ei tarvitse kääntää
Suomenkieliset promptit tuottavat suomenkielisiä koodikommentteja
Claude ymmärtää suomea erityisen hyvin muihin malleihin verrattuna

Muuttujat

Korvaa nämä hakasulkeissa olevat muuttujat omilla tiedoillasi:

[KOODI]

Esimerkki

Täytetty prompti

Luo Storybook-story seuraavalle komponentille.

Komponentti:
interface ButtonProps {
  variant: 'primary' | 'secondary' | 'danger';
  size: 'sm' | 'md' | 'lg';
  disabled?: boolean;
  loading?: boolean;
  children: React.ReactNode;
  onClick?: () => void;
}

function Button({ variant, size, disabled, loading, children, onClick }: ButtonProps) {
  // ... implementation
}

Luo Default, kaikki variantit, koot, disabled ja loading.