import { Fragment } from 'react';
import { FieldValueList } from '@pega/cosmos-react-core';
import { StyledDemoContainer } from './FieldValueList.styles';
import { mockData, mockNumericData } from './FieldValueList.mocks';
export default {
    title: 'Core/FieldValueList',
    component: FieldValueList
};
export const FieldValueListDemo = (args) => {
    const Wrapper = args.inContentContainer ? StyledDemoContainer : Fragment;
    const data = mockData.concat([
        {
            id: 'dynamic',
            name: args.name,
            value: args.value
        }
    ]);
    return (<Wrapper>
      <FieldValueList variant={args.variant} fields={args.variant === 'value-comparison' ? mockNumericData : data}/>
    </Wrapper>);
};
FieldValueListDemo.args = {
    variant: 'inline',
    inContentContainer: true,
    name: 'Name',
    value: 'Value'
};
FieldValueListDemo.argTypes = {
    variant: {
        options: ['inline', 'stacked', 'value-comparison'],
        control: { type: 'select' }
    },
    inContentContainer: { control: { type: 'boolean' } },
    name: { control: { type: 'text' } },
    value: { control: { type: 'text' } }
};
//# sourceMappingURL=FieldValueList.stories.jsx.map