{"version":3,"file":"FieldGroup.stories.jsx","sourceRoot":"","sources":["../../../src/core/FieldGroup/FieldGroup.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\n\nimport {\n  DateInput,\n  FieldGroup,\n  Grid,\n  Input,\n  Select,\n  Option,\n  TextArea\n} from '@pega/cosmos-react-core';\nimport type { FieldGroupProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/FieldGroup',\n  component: FieldGroup\n} as Meta;\n\ninterface FieldGroupStoryProps {\n  firstGroupName?: string;\n  firstGroupHeadingTag?: FieldGroupProps['headingTag'];\n  showfirstGroupHeadingTag?: boolean;\n  firstGroupCollapsible?: boolean;\n  firstGroupDescription?: string;\n  showFirstAdditionalInfo?: boolean;\n  secondGroupName?: string;\n  secondGroupHeadingTag?: FieldGroupProps['headingTag'];\n  showsecondGroupHeadingTag?: boolean;\n  secondGroupCollapsible?: boolean;\n  secondGroupDescription?: string;\n  showSecondAdditionalInfo?: boolean;\n}\n\nexport const FieldGroupDemo: StoryFn<FieldGroupStoryProps> = (args: FieldGroupStoryProps) => {\n  const [firstGroupCollapsed, setFirstGroupCollapsed] = useState(false);\n  const [secondGroupCollapsed, setSecondGroupCollapsed] = useState(false);\n  return (\n    <Grid container={{ rowGap: 2 }}>\n      <FieldGroup\n        name={args.firstGroupName!}\n        headingTag={args.showfirstGroupHeadingTag ? args.firstGroupHeadingTag : undefined}\n        description={args.firstGroupDescription}\n        collapsed={args.firstGroupCollapsible ? firstGroupCollapsed : undefined}\n        onToggleCollapsed={\n          args.firstGroupCollapsible\n            ? () => {\n                setFirstGroupCollapsed(state => !state);\n              }\n            : undefined\n        }\n        additionalInfo={\n          args.showFirstAdditionalInfo\n            ? {\n                content: 'This is a field group'\n              }\n            : undefined\n        }\n        variant='form-group'\n      >\n        <Grid container={{ gap: 1, cols: 'repeat(auto-fit, minmax(min(40ch, 100%), 1fr))' }}>\n          <Input type='text' label='Text 1' />\n          <Select label='Select 1'>\n            <Option value='A'>Option 1A</Option>\n            <Option value='B'>Option 1B</Option>\n          </Select>\n          <DateInput label='Date 1' />\n          <Grid item={{ colStart: '1', colEnd: '-1' }}>\n            <TextArea label='TextArea 1' />\n          </Grid>\n          <Input required type='text' label='Required 1' />\n          <Input disabled type='text' label='Disabled 1' />\n        </Grid>\n      </FieldGroup>\n\n      <FieldGroup\n        name={args.secondGroupName!}\n        headingTag={args.showsecondGroupHeadingTag ? args.secondGroupHeadingTag : undefined}\n        description={args.secondGroupDescription}\n        collapsed={args.secondGroupCollapsible ? secondGroupCollapsed : undefined}\n        onToggleCollapsed={\n          args.secondGroupCollapsible\n            ? () => {\n                setSecondGroupCollapsed(state => !state);\n              }\n            : undefined\n        }\n        additionalInfo={\n          args.showSecondAdditionalInfo\n            ? {\n                content: 'This is another field group'\n              }\n            : undefined\n        }\n        variant='form-group'\n      >\n        <Grid container={{ gap: 1, cols: 'repeat(auto-fill, minmax(min(40ch, 100%), 1fr))' }}>\n          <Input type='text' label='Text 2' />\n          <Select label='Select 2'>\n            <Option value='A'>Option 2A</Option>\n            <Option value='B'>Option 2B</Option>\n          </Select>\n          <DateInput label='Date 2' />\n          <Grid item={{ colStart: '1', colEnd: '-1' }}>\n            <TextArea label='TextArea 2' />\n          </Grid>\n          <Input required type='text' label='Required 2' />\n          <Input disabled type='text' label='Disabled 2' />\n        </Grid>\n      </FieldGroup>\n    </Grid>\n  );\n};\n\nFieldGroupDemo.args = {\n  firstGroupName: 'Field group 1',\n  firstGroupHeadingTag: undefined,\n  showfirstGroupHeadingTag: true,\n  firstGroupCollapsible: true,\n  firstGroupDescription: '',\n  showFirstAdditionalInfo: true,\n  secondGroupName: 'Field group 2',\n  secondGroupHeadingTag: undefined,\n  showsecondGroupHeadingTag: true,\n  secondGroupCollapsible: true,\n  secondGroupDescription: '',\n  showSecondAdditionalInfo: true\n};\n\nFieldGroupDemo.argTypes = {\n  firstGroupName: { control: { type: 'text' } },\n  firstGroupHeadingTag: {\n    options: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'],\n    control: { type: 'select' }\n  },\n  showfirstGroupHeadingTag: { control: { type: 'boolean' } },\n  firstGroupCollapsible: { control: { type: 'boolean' } },\n  firstGroupDescription: { control: { type: 'text' } },\n  showFirstAdditionalInfo: { control: { type: 'boolean' } },\n  secondGroupName: { control: { type: 'text' } },\n  secondGroupHeadingTag: {\n    options: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'],\n    control: { type: 'select' }\n  },\n  showsecondGroupHeadingTag: { control: { type: 'boolean' } },\n  secondGroupCollapsible: { control: { type: 'boolean' } },\n  secondGroupDescription: { control: { type: 'text' } },\n  showSecondAdditionalInfo: { control: { type: 'boolean' } }\n};\n"]}