javascript - Kuinka kirjoittaa storybook lapselle, jonka tilan hallitsee vanhempi

Kirjoitan Storybookia lapsielementille, jossa vanhempi hallinnoi tilaa. Esimerkiksi value (merkkijono) ja onChange (funktio) välitetään propsien kautta. Minulla on molemmat propsit välitettynä, mutta en ole varma, miten päivittää tila storybook-tiedostossa.

tekstikenttä.tsx

import React, { FC, HTMLProps } from 'react';

type FirstNameTextFieldProps = HTMLProps<HTMLInputElement>

const FirstNameTextField: FC<FirstNameTextFieldProps> = ({
    ...restOfProps
}) => (
    <input
        type="text"
        id="fname"
        name="fname"
        {...restOfProps}
    />
);

export default FirstNameTextField;

Tarina-tiedosto

import React from 'react';
import { Story, Meta } from '@storybook/react/types-6-0';
import FirstNameTextField from './test';

export default {
    title: 'FirstNameTextField',
    component: FirstNameTextField,
    description: 'A First Name TextField.',
} as Meta;

const Template: Story = (args) => <FirstNameTextField {...args} />;

export const Default = Template.bind({});
Default.args = {
    value: 'Jason',
    onChange: () => Alert('value changed'),
};

Varsinainen komponenttini on monimutkaisempi, mutta halusin näyttää ongelman helpommin.