forked from Expensify/App
-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathAddressSearch.stories.tsx
46 lines (40 loc) · 1.52 KB
/
AddressSearch.stories.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
import type {Meta, StoryFn} from '@storybook/react';
import React, {useState} from 'react';
import type {AddressSearchProps} from '@components/AddressSearch';
import AddressSearch from '@components/AddressSearch';
import type {StreetValue} from '@components/AddressSearch/types';
import type {Address} from '@src/types/onyx/PrivatePersonalDetails';
type AddressSearchStory = StoryFn<typeof AddressSearch>;
/**
* We use the Component Story Format for writing stories. Follow the docs here:
*
* https://storybook.js.org/docs/react/writing-stories/introduction#component-story-format
*/
const story: Meta<typeof AddressSearch> = {
title: 'Components/AddressSearch',
component: AddressSearch,
args: {
label: 'Enter street',
errorText: '',
},
};
function Template(props: AddressSearchProps) {
const [value, setValue] = useState<string | number | Address | StreetValue>('');
return (
<AddressSearch
value={value as string}
onInputChange={(inputValue) => setValue(inputValue)}
// eslint-disable-next-line react/jsx-props-no-spreading
{...props}
/>
);
}
// Arguments can be passed to the component by binding
// See: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
const Default: AddressSearchStory = Template.bind({});
const ErrorStory: AddressSearchStory = Template.bind({});
ErrorStory.args = {
errorText: 'The street you are looking for does not exist',
};
export default story;
export {Default, ErrorStory};