{"version":3,"file":"Checkbox.stories.jsx","sourceRoot":"","sources":["../../../src/core/Checkbox/Checkbox.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\n\nimport {\n  Checkbox,\n  ThemeOverride,\n  CheckboxCard as CheckboxCardComp,\n  Link,\n  Flex\n} from '@pega/cosmos-react-core';\nimport type {\n  RadioCheckProps,\n  ImagePlacement,\n  ImageSize,\n  CheckboxCardProps\n} from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Checkbox',\n  component: Checkbox,\n  excludeStories: ['ConfigurableCheckbox'],\n  args: {\n    status: undefined,\n    label: 'Check me, please',\n    required: false,\n    disabled: false,\n    readOnly: false,\n    showAdditionalInfo: false\n  },\n  argTypes: {\n    status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },\n    label: { control: { type: 'text' } },\n    required: { control: { type: 'boolean' } },\n    disabled: { control: { type: 'boolean' } },\n    readOnly: { control: { type: 'boolean' } },\n    showAdditionalInfo: { control: { type: 'boolean' } }\n  }\n} as Meta;\n\ninterface CheckboxStoryProps extends RadioCheckProps {\n  showAdditionalInfo: boolean;\n}\n\nexport const DefaultCheckbox: StoryFn<CheckboxStoryProps> = (args: CheckboxStoryProps) => {\n  return (\n    <Checkbox\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              content: 'Some additional info'\n            }\n          : undefined\n      }\n      info={args.info}\n      status={args.status}\n      label={args.label}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n      indeterminate={args.indeterminate}\n    />\n  );\n};\n\nDefaultCheckbox.args = {\n  info: 'You must check this',\n  indeterminate: false\n};\n\nDefaultCheckbox.argTypes = {\n  info: { control: { type: 'text', label: 'Helper text' } },\n  indeterminate: { control: { type: 'boolean' } }\n};\n\ninterface CheckboxCardDemoProps extends CheckboxCardProps {\n  imagePlacement?: ImagePlacement;\n  imageSize?: ImageSize;\n  imageUrl: string;\n  noOfFields: number;\n  showAdditionalInfo: boolean;\n  showActions: boolean;\n  removeFieldLabels: boolean;\n}\n\nexport const CheckboxCard: StoryFn<CheckboxCardDemoProps> = (args: CheckboxCardDemoProps) => {\n  const imgAltText = 'The image alternative text';\n  return (\n    <Flex container={{ gap: 1, direction: 'column' }}>\n      <CheckboxCardComp\n        required={args.required}\n        label={args.label}\n        disabled={args.disabled}\n        readOnly={args.readOnly}\n        additionalInfo={args.showAdditionalInfo ? { content: 'Some additional info' } : undefined}\n        actions={\n          args.showActions\n            ? [\n                {\n                  id: 'id',\n                  text: 'First action',\n                  onClick: () => {}\n                }\n              ]\n            : undefined\n        }\n        image={\n          args.imageUrl\n            ? {\n                src: args.imageUrl,\n                size: args.imageSize,\n                alt: imgAltText,\n                placement: args.imagePlacement\n              }\n            : undefined\n        }\n        fields={\n          args.noOfFields > 0\n            ? [\n                { id: 'service', name: 'Service length', value: '1 year' },\n                {\n                  id: 'monthly-cost',\n                  name: 'Monthly cost',\n                  value: <Link href='https://www.pega.com/'>https://www.pega.com/</Link>\n                },\n                { id: 'total-cost', name: 'Total cost', value: '$2,160.00' },\n                {\n                  id: 'text',\n                  name: 'Text',\n                  value:\n                    'Lorem ipsum is a dummy or placeholder text commonly used in graphic design, publishing, and web development to fill empty spaces in a layout that does not yet have content.'\n                },\n                {\n                  id: 'phone',\n                  name: 'Phone',\n                  value: '1-800-123-456'\n                }\n              ]\n                .slice(0, args.noOfFields)\n                .map(field =>\n                  args.removeFieldLabels ? { id: field.id, value: field.value } : field\n                )\n            : undefined\n        }\n      />\n    </Flex>\n  );\n};\n\nCheckboxCard.args = {\n  imagePlacement: 'inline-start',\n  imageSize: 'flexible',\n  imageUrl:\n    'https://www.pega.com/sites/default/files/styles/640/public/media/images/2024-01/pega-hp-streamline-ops-card-img-v2.jpg?itok=WO_wAay2',\n  noOfFields: 5,\n  showActions: false,\n  status: undefined,\n  label: 'Creativity',\n  removeFieldLabels: false\n};\n\nCheckboxCard.argTypes = {\n  imagePlacement: {\n    options: ['inline-start', 'inline-end', 'block-start'],\n    control: { type: 'select' }\n  },\n  imageSize: { options: ['large', 'small', 'flexible'], control: { type: 'select' } },\n  noOfFields: { control: { type: 'number' } },\n  imageUrl: { control: { type: 'text' } },\n  status: { table: { disable: true } },\n  label: { control: { type: 'text' } },\n  showActions: { control: { type: 'boolean' } },\n  removeFieldLabels: { control: { type: 'boolean' } }\n};\n\ninterface ConfigurableCheckboxProps extends Omit<RadioCheckProps, 'size'> {\n  size?: string;\n  backgroundColor?: string;\n  borderColor?: string;\n  borderWidth?: string;\n  borderRadius?: string;\n  labelColor?: string;\n  labelFontWeight?: string;\n  checkedBackgroundColor?: string;\n  checkedBorderColor?: string;\n  showAdditionalInfo?: boolean;\n}\n\nexport const ConfigurableCheckbox: StoryFn<ConfigurableCheckboxProps> = (\n  args: ConfigurableCheckboxProps\n) => {\n  return (\n    <ThemeOverride\n      theme={{\n        components: {\n          checkbox: {\n            'border-radius': args.borderRadius\n          },\n          'radio-check': {\n            'border-color': args.borderColor,\n            'border-width': args.borderWidth,\n            'background-color': args.backgroundColor,\n            label: {\n              color: args.labelColor,\n              'font-weight': args.labelFontWeight\n            },\n            size: args.size,\n            ':checked': {\n              'background-color': args.checkedBackgroundColor,\n              'border-color': args.checkedBorderColor\n            }\n          }\n        }\n      }}\n    >\n      <Checkbox\n        additionalInfo={\n          args.showAdditionalInfo\n            ? {\n                content: 'Some additional info'\n              }\n            : undefined\n        }\n        label='Configurable Checkbox'\n      />\n    </ThemeOverride>\n  );\n};\n\nConfigurableCheckbox.args = {\n  size: '1.25rem',\n  backgroundColor: '#ffffff',\n  borderColor: '#939393',\n  borderWidth: '0.0625rem',\n  borderRadius: '0.5',\n  labelColor: '#939393',\n  labelFontWeight: '400',\n  checkedBackgroundColor: '#076bc9',\n  checkedBorderColor: '#076bc9',\n  indeterminate: false,\n  showAdditionalInfo: false\n};\n\nConfigurableCheckbox.argTypes = {\n  size: { control: { type: 'text' } },\n  backgroundColor: { control: { type: 'color' } },\n  borderColor: { control: { type: 'color' } },\n  borderWidth: { control: { type: 'text' } },\n  borderRadius: { control: { type: 'text' } },\n  labelColor: { control: { type: 'color' } },\n  labelFontWeight: { control: { type: 'text' } },\n  checkedBackgroundColor: { control: { type: 'color' } },\n  checkedBorderColor: { control: { type: 'color' } },\n  status: { table: { disable: true } },\n  label: { table: { disable: true } },\n  required: { table: { disable: true } },\n  disabled: { table: { disable: true } },\n  readOnly: { table: { disable: true } },\n  indeterminate: { table: { disable: true } },\n  showAdditionalInfo: { control: { type: 'boolean' } }\n};\n"]}