You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
46 lines
810 B
46 lines
810 B
import React, { useState } from 'react';
|
|
import type { ComponentMeta } from '@storybook/react';
|
|
import { Tabs } from '@tih/ui';
|
|
|
|
export default {
|
|
argTypes: {
|
|
label: {
|
|
control: 'text',
|
|
},
|
|
},
|
|
component: Tabs,
|
|
title: 'Tabs',
|
|
} as ComponentMeta<typeof Tabs>;
|
|
|
|
export function Basic({
|
|
label,
|
|
}: Pick<React.ComponentProps<typeof Tabs>, 'label'>) {
|
|
const [value, setValue] = useState('apple');
|
|
|
|
return (
|
|
<Tabs
|
|
label={label}
|
|
tabs={[
|
|
{
|
|
label: 'Apple',
|
|
value: 'apple',
|
|
},
|
|
{
|
|
label: 'Banana',
|
|
value: 'banana',
|
|
},
|
|
{
|
|
label: 'Orange',
|
|
value: 'orange',
|
|
},
|
|
]}
|
|
value={value}
|
|
onChange={setValue}
|
|
/>
|
|
);
|
|
}
|
|
|
|
Basic.args = {
|
|
label: 'Fruits Navigation',
|
|
};
|