@transferwise/components 46.144.0 → 46.144.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/build/actionOption/ActionOption.js.map +1 -1
- package/build/actionOption/ActionOption.mjs.map +1 -1
- package/build/checkboxOption/CheckboxOption.js.map +1 -1
- package/build/checkboxOption/CheckboxOption.mjs.map +1 -1
- package/build/container/Container.js.map +1 -1
- package/build/container/Container.mjs.map +1 -1
- package/build/legacylistItem/LegacyListItem.js.map +1 -1
- package/build/legacylistItem/LegacyListItem.mjs.map +1 -1
- package/build/listItem/AvatarLayout/ListItemAvatarLayout.js.map +1 -1
- package/build/listItem/AvatarLayout/ListItemAvatarLayout.mjs.map +1 -1
- package/build/listItem/AvatarView/ListItemAvatarView.js.map +1 -1
- package/build/listItem/AvatarView/ListItemAvatarView.mjs.map +1 -1
- package/build/listItem/Button/ListItemButton.js.map +1 -1
- package/build/listItem/Button/ListItemButton.mjs.map +1 -1
- package/build/listItem/Checkbox/ListItemCheckbox.js.map +1 -1
- package/build/listItem/Checkbox/ListItemCheckbox.mjs.map +1 -1
- package/build/listItem/IconButton/ListItemIconButton.js.map +1 -1
- package/build/listItem/IconButton/ListItemIconButton.mjs.map +1 -1
- package/build/listItem/Image/ListItemImage.js.map +1 -1
- package/build/listItem/Image/ListItemImage.mjs.map +1 -1
- package/build/listItem/ListItem.js.map +1 -1
- package/build/listItem/ListItem.mjs.map +1 -1
- package/build/listItem/Navigation/ListItemNavigation.js.map +1 -1
- package/build/listItem/Navigation/ListItemNavigation.mjs.map +1 -1
- package/build/listItem/Prompt/ListItemPrompt.js.map +1 -1
- package/build/listItem/Prompt/ListItemPrompt.mjs.map +1 -1
- package/build/listItem/Radio/ListItemRadio.js.map +1 -1
- package/build/listItem/Radio/ListItemRadio.mjs.map +1 -1
- package/build/listItem/Switch/ListItemSwitch.js.map +1 -1
- package/build/listItem/Switch/ListItemSwitch.mjs.map +1 -1
- package/build/loader/Loader.js +1 -1
- package/build/loader/Loader.js.map +1 -1
- package/build/loader/Loader.mjs +1 -1
- package/build/loader/Loader.mjs.map +1 -1
- package/build/logo/Logo.js +1 -1
- package/build/logo/Logo.js.map +1 -1
- package/build/logo/Logo.mjs +1 -1
- package/build/logo/Logo.mjs.map +1 -1
- package/build/main.css +11 -11
- package/build/navigationOption/NavigationOption.js.map +1 -1
- package/build/navigationOption/NavigationOption.mjs.map +1 -1
- package/build/navigationOptionsList/NavigationOptionsList.js.map +1 -1
- package/build/navigationOptionsList/NavigationOptionsList.mjs.map +1 -1
- package/build/prompt/ActionPrompt/ActionPrompt.js.map +1 -1
- package/build/prompt/ActionPrompt/ActionPrompt.mjs.map +1 -1
- package/build/prompt/CriticalBanner/CriticalBanner.js.map +1 -1
- package/build/prompt/CriticalBanner/CriticalBanner.mjs.map +1 -1
- package/build/prompt/InfoPrompt/InfoPrompt.js.map +1 -1
- package/build/prompt/InfoPrompt/InfoPrompt.mjs.map +1 -1
- package/build/radioOption/RadioOption.js.map +1 -1
- package/build/radioOption/RadioOption.mjs.map +1 -1
- package/build/segmentedControl/SegmentedControl.js +1 -1
- package/build/segmentedControl/SegmentedControl.js.map +1 -1
- package/build/segmentedControl/SegmentedControl.mjs +1 -1
- package/build/segmentedControl/SegmentedControl.mjs.map +1 -1
- package/build/styles/css/neptune.css +11 -11
- package/build/styles/less/legacy-variables.less +1 -1
- package/build/styles/less/neptune-tokens.less +2 -2
- package/build/styles/main.css +11 -11
- package/build/styles/props/custom-media.css +1 -1
- package/build/styles/props/neptune-tokens.css +1 -1
- package/build/styles/styles/less/neptune.css +11 -11
- package/build/summary/Summary.js +1 -1
- package/build/summary/Summary.js.map +1 -1
- package/build/summary/Summary.mjs +1 -1
- package/build/summary/Summary.mjs.map +1 -1
- package/build/switchOption/SwitchOption.js +1 -1
- package/build/switchOption/SwitchOption.js.map +1 -1
- package/build/switchOption/SwitchOption.mjs +1 -1
- package/build/switchOption/SwitchOption.mjs.map +1 -1
- package/build/types/actionOption/ActionOption.d.ts +1 -1
- package/build/types/checkboxOption/CheckboxOption.d.ts +1 -1
- package/build/types/container/Container.d.ts +1 -1
- package/build/types/legacylistItem/LegacyListItem.d.ts +1 -1
- package/build/types/listItem/AvatarLayout/ListItemAvatarLayout.d.ts +1 -1
- package/build/types/listItem/AvatarView/ListItemAvatarView.d.ts +1 -1
- package/build/types/listItem/Button/ListItemButton.d.ts +1 -1
- package/build/types/listItem/Checkbox/ListItemCheckbox.d.ts +1 -1
- package/build/types/listItem/IconButton/ListItemIconButton.d.ts +1 -1
- package/build/types/listItem/Image/ListItemImage.d.ts +1 -1
- package/build/types/listItem/ListItem.d.ts +1 -1
- package/build/types/listItem/Navigation/ListItemNavigation.d.ts +1 -1
- package/build/types/listItem/Prompt/ListItemPrompt.d.ts +1 -1
- package/build/types/listItem/Radio/ListItemRadio.d.ts +1 -1
- package/build/types/listItem/Switch/ListItemSwitch.d.ts +1 -1
- package/build/types/logo/Logo.d.ts +1 -1
- package/build/types/navigationOption/NavigationOption.d.ts +1 -1
- package/build/types/navigationOptionsList/NavigationOptionsList.d.ts +1 -1
- package/build/types/prompt/ActionPrompt/ActionPrompt.d.ts +1 -1
- package/build/types/prompt/CriticalBanner/CriticalBanner.d.ts +1 -1
- package/build/types/prompt/InfoPrompt/InfoPrompt.d.ts +1 -1
- package/build/types/radioOption/RadioOption.d.ts +1 -1
- package/build/types/summary/Summary.d.ts +1 -1
- package/build/types/switchOption/SwitchOption.d.ts +1 -1
- package/package.json +20 -21
- package/src/actionButton/ActionButton.story.tsx +1 -1
- package/src/actionOption/ActionOption.tsx +1 -1
- package/src/button/_stories/Button.accessibility.docs.mdx +1 -1
- package/src/button/_stories/Button.story.tsx +6 -6
- package/src/checkboxButton/CheckboxButton.story.tsx +1 -1
- package/src/checkboxOption/CheckboxOption.tsx +1 -1
- package/src/chips/Chips.story.tsx +3 -3
- package/src/circularButton/CircularButton.story.tsx +4 -4
- package/src/container/Container.tsx +1 -1
- package/src/divider/Divider.story.tsx +2 -2
- package/src/header/Header.accessibility.docs.mdx +1 -1
- package/src/header/Header.story.tsx +1 -1
- package/src/iconButton/IconButton.story.tsx +4 -4
- package/src/legacylistItem/LegacyListItem.tsx +1 -1
- package/src/listItem/AdditionalInfo/ListItemAdditionalInfo.story.tsx +1 -1
- package/src/listItem/AvatarLayout/ListItemAvatarLayout.story.tsx +1 -1
- package/src/listItem/AvatarLayout/ListItemAvatarLayout.tsx +1 -1
- package/src/listItem/AvatarView/ListItemAvatarView.story.tsx +3 -3
- package/src/listItem/AvatarView/ListItemAvatarView.tsx +1 -1
- package/src/listItem/Button/ListItemButton.story.tsx +3 -3
- package/src/listItem/Button/ListItemButton.tsx +1 -1
- package/src/listItem/Checkbox/ListItemCheckbox.tsx +1 -1
- package/src/listItem/IconButton/ListItemIconButton.story.tsx +4 -4
- package/src/listItem/IconButton/ListItemIconButton.tsx +1 -1
- package/src/listItem/Image/ListItemImage.tsx +1 -1
- package/src/listItem/ListItem.tsx +1 -1
- package/src/listItem/Navigation/ListItemNavigation.tsx +1 -1
- package/src/listItem/Prompt/ListItemPrompt.tsx +1 -1
- package/src/listItem/Radio/ListItemRadio.tsx +1 -1
- package/src/listItem/Switch/ListItemSwitch.tsx +1 -1
- package/src/listItem/_stories/ListItem.disabled.story.tsx +1 -1
- package/src/listItem/_stories/ListItem.story.tsx +5 -5
- package/src/loader/Loader.tsx +1 -1
- package/src/logo/Logo.story.tsx +1 -1
- package/src/logo/Logo.tsx +1 -1
- package/src/main.css +11 -11
- package/src/navigationOption/NavigationOption.tsx +1 -1
- package/src/navigationOptionsList/NavigationOptionsList.tsx +1 -1
- package/src/prompt/ActionPrompt/ActionPrompt.story.tsx +1 -1
- package/src/prompt/ActionPrompt/ActionPrompt.tsx +1 -1
- package/src/prompt/CriticalBanner/CriticalBanner.story.tsx +1 -1
- package/src/prompt/CriticalBanner/CriticalBanner.tsx +1 -1
- package/src/prompt/InfoPrompt/InfoPrompt.story.tsx +1 -1
- package/src/prompt/InfoPrompt/InfoPrompt.tsx +1 -1
- package/src/radioOption/RadioOption.tsx +1 -1
- package/src/segmentedControl/SegmentedControl.test.tsx +1 -1
- package/src/segmentedControl/SegmentedControl.tsx +1 -1
- package/src/styles/less/neptune.css +11 -11
- package/src/summary/Summary.tsx +1 -1
- package/src/switch/Switch.story.tsx +1 -1
- package/src/switchOption/SwitchOption.tsx +1 -1
package/README.md
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
Neptune is the Design System built by and used at TransferWise. Neptune Web is the Neptune framework for Web. Neptune Web provides a way to build high quality, consistent user experiences on the web with ease.
|
|
6
6
|
|
|
7
|
-
This is the Neptune Web React component library. It
|
|
7
|
+
This is the Neptune Web React component library. It includes all necessary base CSS styles.
|
|
8
8
|
|
|
9
9
|
## Usage
|
|
10
10
|
|
|
@@ -23,7 +23,7 @@ npm install @transferwise/components react react-dom prop-types @wise/art
|
|
|
23
23
|
|
|
24
24
|
```js
|
|
25
25
|
// These CSS files should be imported once in your application
|
|
26
|
-
import '@transferwise/
|
|
26
|
+
import '@transferwise/components/build/styles/css/neptune.css';
|
|
27
27
|
import '@transferwise/components/build/main.css';
|
|
28
28
|
|
|
29
29
|
import en from '@transferwise/components/build/i18n/en.json';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionOption.js","sources":["../../src/actionOption/ActionOption.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport Button from '../button';\nimport {\n AriaLabelProperty,\n CommonProps,\n Priority,\n PriorityPrimary,\n PrioritySecondary,\n PriorityTertiary,\n} from '../common';\nimport Option from '../common/Option';\nimport { ButtonPriority } from '../button/Button.types';\n\ntype ActionOptionPriority =\n | PriorityPrimary\n | PrioritySecondary\n | PriorityTertiary\n | 'secondary-send';\n\nexport type ActionOptionProps = {\n complex?: boolean;\n content?: React.ReactNode;\n disabled?: boolean;\n media?: React.ReactNode;\n showMediaAtAllSizes?: boolean;\n onClick: () => void;\n title: React.ReactNode;\n additionalContent?: React.ReactNode;\n action: React.ReactNode;\n priority?: ActionOptionPriority;\n showMediaCircle?: boolean;\n isContainerAligned?: boolean;\n as?: React.ElementType;\n} & CommonProps &\n AriaLabelProperty;\n\n/**\n * @deprecated Use `<ListItem />` instead (run codemod to migrate: **`npx @wise/wds-codemods@latest list-item`**).\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst ActionOption = ({\n action,\n priority = Priority.PRIMARY,\n disabled,\n onClick,\n media,\n title,\n content,\n additionalContent,\n complex,\n className,\n showMediaAtAllSizes,\n showMediaCircle,\n isContainerAligned,\n as,\n 'aria-label': ariaLabel,\n}: ActionOptionProps) => {\n const sharedProps = {\n media,\n title,\n content,\n complex,\n disabled,\n showMediaAtAllSizes,\n showMediaCircle,\n className: clsx('tw-action-option', className),\n isContainerAligned,\n additionalContent,\n as,\n };\n\n const getAriaLabel = (): string | undefined => {\n if (ariaLabel) {\n return ariaLabel;\n }\n\n const generatedLabels: string[] = [];\n\n if (typeof title === 'string') {\n generatedLabels.push(title);\n }\n\n if (typeof action === 'string') {\n generatedLabels.push(action);\n }\n\n return generatedLabels.join(', ') || undefined;\n };\n\n const mapPriority = (priority: ActionOptionPriority): ButtonPriority => {\n switch (priority) {\n case 'primary':\n return 'primary';\n case 'secondary':\n return 'secondary-neutral';\n case 'tertiary':\n return 'tertiary';\n case 'secondary-send':\n return 'secondary';\n default:\n return 'primary';\n }\n };\n\n return (\n <Option\n {...sharedProps}\n button={\n <Button\n v2\n size=\"sm\"\n priority={mapPriority(priority)}\n disabled={disabled}\n aria-label={getAriaLabel()}\n onClick={onClick}\n >\n {action}\n </Button>\n }\n />\n );\n};\n\nexport default ActionOption;\n"],"names":["ActionOption","action","priority","Priority","PRIMARY","disabled","onClick","media","title","content","additionalContent","complex","className","showMediaAtAllSizes","showMediaCircle","isContainerAligned","as","ariaLabel","sharedProps","clsx","getAriaLabel","generatedLabels","push","join","undefined","mapPriority","_jsx","Option","button","Button","v2","size","children"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,MAAMA,YAAY,GAAGA,CAAC;EACpBC,MAAM;EACNC,QAAQ,GAAGC,gBAAQ,CAACC,OAAO;EAC3BC,QAAQ;EACRC,OAAO;EACPC,KAAK;EACLC,KAAK;EACLC,OAAO;EACPC,iBAAiB;EACjBC,OAAO;EACPC,SAAS;EACTC,mBAAmB;EACnBC,eAAe;EACfC,kBAAkB;EAClBC,EAAE;AACF,EAAA,YAAY,EAAEC;AAAS,CACL,KAAI;AACtB,EAAA,MAAMC,WAAW,GAAG;IAClBX,KAAK;IACLC,KAAK;IACLC,OAAO;IACPE,OAAO;IACPN,QAAQ;IACRQ,mBAAmB;IACnBC,eAAe;AACfF,IAAAA,SAAS,EAAEO,SAAI,CAAC,kBAAkB,EAAEP,SAAS,CAAC;IAC9CG,kBAAkB;IAClBL,iBAAiB;AACjBM,IAAAA;GACD;EAED,MAAMI,YAAY,GAAGA,MAAyB;AAC5C,IAAA,IAAIH,SAAS,EAAE;AACb,MAAA,OAAOA,SAAS;AAClB,IAAA;IAEA,MAAMI,eAAe,GAAa,EAAE;AAEpC,IAAA,IAAI,OAAOb,KAAK,KAAK,QAAQ,EAAE;AAC7Ba,MAAAA,eAAe,CAACC,IAAI,CAACd,KAAK,CAAC;AAC7B,IAAA;AAEA,IAAA,IAAI,OAAOP,MAAM,KAAK,QAAQ,EAAE;AAC9BoB,MAAAA,eAAe,CAACC,IAAI,CAACrB,MAAM,CAAC;AAC9B,IAAA;AAEA,IAAA,OAAOoB,eAAe,CAACE,IAAI,CAAC,IAAI,CAAC,IAAIC,SAAS;EAChD,CAAC;EAED,MAAMC,WAAW,GAAIvB,QAA8B,IAAoB;AACrE,IAAA,QAAQA,QAAQ;AACd,MAAA,KAAK,SAAS;AACZ,QAAA,OAAO,SAAS;AAClB,MAAA,KAAK,WAAW;AACd,QAAA,OAAO,mBAAmB;AAC5B,MAAA,KAAK,UAAU;AACb,QAAA,OAAO,UAAU;AACnB,MAAA,KAAK,gBAAgB;AACnB,QAAA,OAAO,WAAW;AACpB,MAAA;AACE,QAAA,OAAO,SAAS;AACpB;EACF,CAAC;EAED,oBACEwB,cAAA,CAACC,cAAM,EAAA;AAAA,IAAA,GACDT,WAAW;IACfU,MAAM,eACJF,cAAA,CAACG,uBAAM,EAAA;MACLC,EAAE,EAAA,IAAA;AACFC,MAAAA,IAAI,EAAC,IAAI;AACT7B,MAAAA,QAAQ,EAAEuB,WAAW,CAACvB,QAAQ,CAAE;AAChCG,MAAAA,QAAQ,EAAEA,QAAS;MACnB,YAAA,EAAYe,YAAY,EAAG;AAC3Bd,MAAAA,OAAO,EAAEA,OAAQ;AAAA0B,MAAAA,QAAA,EAEhB/B;KACK;AACT,GAAA,CACD;AAEN;;;;"}
|
|
1
|
+
{"version":3,"file":"ActionOption.js","sources":["../../src/actionOption/ActionOption.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport Button from '../button';\nimport {\n AriaLabelProperty,\n CommonProps,\n Priority,\n PriorityPrimary,\n PrioritySecondary,\n PriorityTertiary,\n} from '../common';\nimport Option from '../common/Option';\nimport { ButtonPriority } from '../button/Button.types';\n\ntype ActionOptionPriority =\n | PriorityPrimary\n | PrioritySecondary\n | PriorityTertiary\n | 'secondary-send';\n\nexport type ActionOptionProps = {\n complex?: boolean;\n content?: React.ReactNode;\n disabled?: boolean;\n media?: React.ReactNode;\n showMediaAtAllSizes?: boolean;\n onClick: () => void;\n title: React.ReactNode;\n additionalContent?: React.ReactNode;\n action: React.ReactNode;\n priority?: ActionOptionPriority;\n showMediaCircle?: boolean;\n isContainerAligned?: boolean;\n as?: React.ElementType;\n} & CommonProps &\n AriaLabelProperty;\n\n/**\n * @deprecated Use `<ListItem />` instead (run codemod to migrate: **`npx @wise/wds-codemods@latest list-item`**).\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://docs.wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst ActionOption = ({\n action,\n priority = Priority.PRIMARY,\n disabled,\n onClick,\n media,\n title,\n content,\n additionalContent,\n complex,\n className,\n showMediaAtAllSizes,\n showMediaCircle,\n isContainerAligned,\n as,\n 'aria-label': ariaLabel,\n}: ActionOptionProps) => {\n const sharedProps = {\n media,\n title,\n content,\n complex,\n disabled,\n showMediaAtAllSizes,\n showMediaCircle,\n className: clsx('tw-action-option', className),\n isContainerAligned,\n additionalContent,\n as,\n };\n\n const getAriaLabel = (): string | undefined => {\n if (ariaLabel) {\n return ariaLabel;\n }\n\n const generatedLabels: string[] = [];\n\n if (typeof title === 'string') {\n generatedLabels.push(title);\n }\n\n if (typeof action === 'string') {\n generatedLabels.push(action);\n }\n\n return generatedLabels.join(', ') || undefined;\n };\n\n const mapPriority = (priority: ActionOptionPriority): ButtonPriority => {\n switch (priority) {\n case 'primary':\n return 'primary';\n case 'secondary':\n return 'secondary-neutral';\n case 'tertiary':\n return 'tertiary';\n case 'secondary-send':\n return 'secondary';\n default:\n return 'primary';\n }\n };\n\n return (\n <Option\n {...sharedProps}\n button={\n <Button\n v2\n size=\"sm\"\n priority={mapPriority(priority)}\n disabled={disabled}\n aria-label={getAriaLabel()}\n onClick={onClick}\n >\n {action}\n </Button>\n }\n />\n );\n};\n\nexport default ActionOption;\n"],"names":["ActionOption","action","priority","Priority","PRIMARY","disabled","onClick","media","title","content","additionalContent","complex","className","showMediaAtAllSizes","showMediaCircle","isContainerAligned","as","ariaLabel","sharedProps","clsx","getAriaLabel","generatedLabels","push","join","undefined","mapPriority","_jsx","Option","button","Button","v2","size","children"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,MAAMA,YAAY,GAAGA,CAAC;EACpBC,MAAM;EACNC,QAAQ,GAAGC,gBAAQ,CAACC,OAAO;EAC3BC,QAAQ;EACRC,OAAO;EACPC,KAAK;EACLC,KAAK;EACLC,OAAO;EACPC,iBAAiB;EACjBC,OAAO;EACPC,SAAS;EACTC,mBAAmB;EACnBC,eAAe;EACfC,kBAAkB;EAClBC,EAAE;AACF,EAAA,YAAY,EAAEC;AAAS,CACL,KAAI;AACtB,EAAA,MAAMC,WAAW,GAAG;IAClBX,KAAK;IACLC,KAAK;IACLC,OAAO;IACPE,OAAO;IACPN,QAAQ;IACRQ,mBAAmB;IACnBC,eAAe;AACfF,IAAAA,SAAS,EAAEO,SAAI,CAAC,kBAAkB,EAAEP,SAAS,CAAC;IAC9CG,kBAAkB;IAClBL,iBAAiB;AACjBM,IAAAA;GACD;EAED,MAAMI,YAAY,GAAGA,MAAyB;AAC5C,IAAA,IAAIH,SAAS,EAAE;AACb,MAAA,OAAOA,SAAS;AAClB,IAAA;IAEA,MAAMI,eAAe,GAAa,EAAE;AAEpC,IAAA,IAAI,OAAOb,KAAK,KAAK,QAAQ,EAAE;AAC7Ba,MAAAA,eAAe,CAACC,IAAI,CAACd,KAAK,CAAC;AAC7B,IAAA;AAEA,IAAA,IAAI,OAAOP,MAAM,KAAK,QAAQ,EAAE;AAC9BoB,MAAAA,eAAe,CAACC,IAAI,CAACrB,MAAM,CAAC;AAC9B,IAAA;AAEA,IAAA,OAAOoB,eAAe,CAACE,IAAI,CAAC,IAAI,CAAC,IAAIC,SAAS;EAChD,CAAC;EAED,MAAMC,WAAW,GAAIvB,QAA8B,IAAoB;AACrE,IAAA,QAAQA,QAAQ;AACd,MAAA,KAAK,SAAS;AACZ,QAAA,OAAO,SAAS;AAClB,MAAA,KAAK,WAAW;AACd,QAAA,OAAO,mBAAmB;AAC5B,MAAA,KAAK,UAAU;AACb,QAAA,OAAO,UAAU;AACnB,MAAA,KAAK,gBAAgB;AACnB,QAAA,OAAO,WAAW;AACpB,MAAA;AACE,QAAA,OAAO,SAAS;AACpB;EACF,CAAC;EAED,oBACEwB,cAAA,CAACC,cAAM,EAAA;AAAA,IAAA,GACDT,WAAW;IACfU,MAAM,eACJF,cAAA,CAACG,uBAAM,EAAA;MACLC,EAAE,EAAA,IAAA;AACFC,MAAAA,IAAI,EAAC,IAAI;AACT7B,MAAAA,QAAQ,EAAEuB,WAAW,CAACvB,QAAQ,CAAE;AAChCG,MAAAA,QAAQ,EAAEA,QAAS;MACnB,YAAA,EAAYe,YAAY,EAAG;AAC3Bd,MAAAA,OAAO,EAAEA,OAAQ;AAAA0B,MAAAA,QAAA,EAEhB/B;KACK;AACT,GAAA,CACD;AAEN;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionOption.mjs","sources":["../../src/actionOption/ActionOption.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport Button from '../button';\nimport {\n AriaLabelProperty,\n CommonProps,\n Priority,\n PriorityPrimary,\n PrioritySecondary,\n PriorityTertiary,\n} from '../common';\nimport Option from '../common/Option';\nimport { ButtonPriority } from '../button/Button.types';\n\ntype ActionOptionPriority =\n | PriorityPrimary\n | PrioritySecondary\n | PriorityTertiary\n | 'secondary-send';\n\nexport type ActionOptionProps = {\n complex?: boolean;\n content?: React.ReactNode;\n disabled?: boolean;\n media?: React.ReactNode;\n showMediaAtAllSizes?: boolean;\n onClick: () => void;\n title: React.ReactNode;\n additionalContent?: React.ReactNode;\n action: React.ReactNode;\n priority?: ActionOptionPriority;\n showMediaCircle?: boolean;\n isContainerAligned?: boolean;\n as?: React.ElementType;\n} & CommonProps &\n AriaLabelProperty;\n\n/**\n * @deprecated Use `<ListItem />` instead (run codemod to migrate: **`npx @wise/wds-codemods@latest list-item`**).\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst ActionOption = ({\n action,\n priority = Priority.PRIMARY,\n disabled,\n onClick,\n media,\n title,\n content,\n additionalContent,\n complex,\n className,\n showMediaAtAllSizes,\n showMediaCircle,\n isContainerAligned,\n as,\n 'aria-label': ariaLabel,\n}: ActionOptionProps) => {\n const sharedProps = {\n media,\n title,\n content,\n complex,\n disabled,\n showMediaAtAllSizes,\n showMediaCircle,\n className: clsx('tw-action-option', className),\n isContainerAligned,\n additionalContent,\n as,\n };\n\n const getAriaLabel = (): string | undefined => {\n if (ariaLabel) {\n return ariaLabel;\n }\n\n const generatedLabels: string[] = [];\n\n if (typeof title === 'string') {\n generatedLabels.push(title);\n }\n\n if (typeof action === 'string') {\n generatedLabels.push(action);\n }\n\n return generatedLabels.join(', ') || undefined;\n };\n\n const mapPriority = (priority: ActionOptionPriority): ButtonPriority => {\n switch (priority) {\n case 'primary':\n return 'primary';\n case 'secondary':\n return 'secondary-neutral';\n case 'tertiary':\n return 'tertiary';\n case 'secondary-send':\n return 'secondary';\n default:\n return 'primary';\n }\n };\n\n return (\n <Option\n {...sharedProps}\n button={\n <Button\n v2\n size=\"sm\"\n priority={mapPriority(priority)}\n disabled={disabled}\n aria-label={getAriaLabel()}\n onClick={onClick}\n >\n {action}\n </Button>\n }\n />\n );\n};\n\nexport default ActionOption;\n"],"names":["ActionOption","action","priority","Priority","PRIMARY","disabled","onClick","media","title","content","additionalContent","complex","className","showMediaAtAllSizes","showMediaCircle","isContainerAligned","as","ariaLabel","sharedProps","clsx","getAriaLabel","generatedLabels","push","join","undefined","mapPriority","_jsx","Option","button","Button","v2","size","children"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,MAAMA,YAAY,GAAGA,CAAC;EACpBC,MAAM;EACNC,QAAQ,GAAGC,QAAQ,CAACC,OAAO;EAC3BC,QAAQ;EACRC,OAAO;EACPC,KAAK;EACLC,KAAK;EACLC,OAAO;EACPC,iBAAiB;EACjBC,OAAO;EACPC,SAAS;EACTC,mBAAmB;EACnBC,eAAe;EACfC,kBAAkB;EAClBC,EAAE;AACF,EAAA,YAAY,EAAEC;AAAS,CACL,KAAI;AACtB,EAAA,MAAMC,WAAW,GAAG;IAClBX,KAAK;IACLC,KAAK;IACLC,OAAO;IACPE,OAAO;IACPN,QAAQ;IACRQ,mBAAmB;IACnBC,eAAe;AACfF,IAAAA,SAAS,EAAEO,IAAI,CAAC,kBAAkB,EAAEP,SAAS,CAAC;IAC9CG,kBAAkB;IAClBL,iBAAiB;AACjBM,IAAAA;GACD;EAED,MAAMI,YAAY,GAAGA,MAAyB;AAC5C,IAAA,IAAIH,SAAS,EAAE;AACb,MAAA,OAAOA,SAAS;AAClB,IAAA;IAEA,MAAMI,eAAe,GAAa,EAAE;AAEpC,IAAA,IAAI,OAAOb,KAAK,KAAK,QAAQ,EAAE;AAC7Ba,MAAAA,eAAe,CAACC,IAAI,CAACd,KAAK,CAAC;AAC7B,IAAA;AAEA,IAAA,IAAI,OAAOP,MAAM,KAAK,QAAQ,EAAE;AAC9BoB,MAAAA,eAAe,CAACC,IAAI,CAACrB,MAAM,CAAC;AAC9B,IAAA;AAEA,IAAA,OAAOoB,eAAe,CAACE,IAAI,CAAC,IAAI,CAAC,IAAIC,SAAS;EAChD,CAAC;EAED,MAAMC,WAAW,GAAIvB,QAA8B,IAAoB;AACrE,IAAA,QAAQA,QAAQ;AACd,MAAA,KAAK,SAAS;AACZ,QAAA,OAAO,SAAS;AAClB,MAAA,KAAK,WAAW;AACd,QAAA,OAAO,mBAAmB;AAC5B,MAAA,KAAK,UAAU;AACb,QAAA,OAAO,UAAU;AACnB,MAAA,KAAK,gBAAgB;AACnB,QAAA,OAAO,WAAW;AACpB,MAAA;AACE,QAAA,OAAO,SAAS;AACpB;EACF,CAAC;EAED,oBACEwB,GAAA,CAACC,MAAM,EAAA;AAAA,IAAA,GACDT,WAAW;IACfU,MAAM,eACJF,GAAA,CAACG,MAAM,EAAA;MACLC,EAAE,EAAA,IAAA;AACFC,MAAAA,IAAI,EAAC,IAAI;AACT7B,MAAAA,QAAQ,EAAEuB,WAAW,CAACvB,QAAQ,CAAE;AAChCG,MAAAA,QAAQ,EAAEA,QAAS;MACnB,YAAA,EAAYe,YAAY,EAAG;AAC3Bd,MAAAA,OAAO,EAAEA,OAAQ;AAAA0B,MAAAA,QAAA,EAEhB/B;KACK;AACT,GAAA,CACD;AAEN;;;;"}
|
|
1
|
+
{"version":3,"file":"ActionOption.mjs","sources":["../../src/actionOption/ActionOption.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport Button from '../button';\nimport {\n AriaLabelProperty,\n CommonProps,\n Priority,\n PriorityPrimary,\n PrioritySecondary,\n PriorityTertiary,\n} from '../common';\nimport Option from '../common/Option';\nimport { ButtonPriority } from '../button/Button.types';\n\ntype ActionOptionPriority =\n | PriorityPrimary\n | PrioritySecondary\n | PriorityTertiary\n | 'secondary-send';\n\nexport type ActionOptionProps = {\n complex?: boolean;\n content?: React.ReactNode;\n disabled?: boolean;\n media?: React.ReactNode;\n showMediaAtAllSizes?: boolean;\n onClick: () => void;\n title: React.ReactNode;\n additionalContent?: React.ReactNode;\n action: React.ReactNode;\n priority?: ActionOptionPriority;\n showMediaCircle?: boolean;\n isContainerAligned?: boolean;\n as?: React.ElementType;\n} & CommonProps &\n AriaLabelProperty;\n\n/**\n * @deprecated Use `<ListItem />` instead (run codemod to migrate: **`npx @wise/wds-codemods@latest list-item`**).\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://docs.wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst ActionOption = ({\n action,\n priority = Priority.PRIMARY,\n disabled,\n onClick,\n media,\n title,\n content,\n additionalContent,\n complex,\n className,\n showMediaAtAllSizes,\n showMediaCircle,\n isContainerAligned,\n as,\n 'aria-label': ariaLabel,\n}: ActionOptionProps) => {\n const sharedProps = {\n media,\n title,\n content,\n complex,\n disabled,\n showMediaAtAllSizes,\n showMediaCircle,\n className: clsx('tw-action-option', className),\n isContainerAligned,\n additionalContent,\n as,\n };\n\n const getAriaLabel = (): string | undefined => {\n if (ariaLabel) {\n return ariaLabel;\n }\n\n const generatedLabels: string[] = [];\n\n if (typeof title === 'string') {\n generatedLabels.push(title);\n }\n\n if (typeof action === 'string') {\n generatedLabels.push(action);\n }\n\n return generatedLabels.join(', ') || undefined;\n };\n\n const mapPriority = (priority: ActionOptionPriority): ButtonPriority => {\n switch (priority) {\n case 'primary':\n return 'primary';\n case 'secondary':\n return 'secondary-neutral';\n case 'tertiary':\n return 'tertiary';\n case 'secondary-send':\n return 'secondary';\n default:\n return 'primary';\n }\n };\n\n return (\n <Option\n {...sharedProps}\n button={\n <Button\n v2\n size=\"sm\"\n priority={mapPriority(priority)}\n disabled={disabled}\n aria-label={getAriaLabel()}\n onClick={onClick}\n >\n {action}\n </Button>\n }\n />\n );\n};\n\nexport default ActionOption;\n"],"names":["ActionOption","action","priority","Priority","PRIMARY","disabled","onClick","media","title","content","additionalContent","complex","className","showMediaAtAllSizes","showMediaCircle","isContainerAligned","as","ariaLabel","sharedProps","clsx","getAriaLabel","generatedLabels","push","join","undefined","mapPriority","_jsx","Option","button","Button","v2","size","children"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,MAAMA,YAAY,GAAGA,CAAC;EACpBC,MAAM;EACNC,QAAQ,GAAGC,QAAQ,CAACC,OAAO;EAC3BC,QAAQ;EACRC,OAAO;EACPC,KAAK;EACLC,KAAK;EACLC,OAAO;EACPC,iBAAiB;EACjBC,OAAO;EACPC,SAAS;EACTC,mBAAmB;EACnBC,eAAe;EACfC,kBAAkB;EAClBC,EAAE;AACF,EAAA,YAAY,EAAEC;AAAS,CACL,KAAI;AACtB,EAAA,MAAMC,WAAW,GAAG;IAClBX,KAAK;IACLC,KAAK;IACLC,OAAO;IACPE,OAAO;IACPN,QAAQ;IACRQ,mBAAmB;IACnBC,eAAe;AACfF,IAAAA,SAAS,EAAEO,IAAI,CAAC,kBAAkB,EAAEP,SAAS,CAAC;IAC9CG,kBAAkB;IAClBL,iBAAiB;AACjBM,IAAAA;GACD;EAED,MAAMI,YAAY,GAAGA,MAAyB;AAC5C,IAAA,IAAIH,SAAS,EAAE;AACb,MAAA,OAAOA,SAAS;AAClB,IAAA;IAEA,MAAMI,eAAe,GAAa,EAAE;AAEpC,IAAA,IAAI,OAAOb,KAAK,KAAK,QAAQ,EAAE;AAC7Ba,MAAAA,eAAe,CAACC,IAAI,CAACd,KAAK,CAAC;AAC7B,IAAA;AAEA,IAAA,IAAI,OAAOP,MAAM,KAAK,QAAQ,EAAE;AAC9BoB,MAAAA,eAAe,CAACC,IAAI,CAACrB,MAAM,CAAC;AAC9B,IAAA;AAEA,IAAA,OAAOoB,eAAe,CAACE,IAAI,CAAC,IAAI,CAAC,IAAIC,SAAS;EAChD,CAAC;EAED,MAAMC,WAAW,GAAIvB,QAA8B,IAAoB;AACrE,IAAA,QAAQA,QAAQ;AACd,MAAA,KAAK,SAAS;AACZ,QAAA,OAAO,SAAS;AAClB,MAAA,KAAK,WAAW;AACd,QAAA,OAAO,mBAAmB;AAC5B,MAAA,KAAK,UAAU;AACb,QAAA,OAAO,UAAU;AACnB,MAAA,KAAK,gBAAgB;AACnB,QAAA,OAAO,WAAW;AACpB,MAAA;AACE,QAAA,OAAO,SAAS;AACpB;EACF,CAAC;EAED,oBACEwB,GAAA,CAACC,MAAM,EAAA;AAAA,IAAA,GACDT,WAAW;IACfU,MAAM,eACJF,GAAA,CAACG,MAAM,EAAA;MACLC,EAAE,EAAA,IAAA;AACFC,MAAAA,IAAI,EAAC,IAAI;AACT7B,MAAAA,QAAQ,EAAEuB,WAAW,CAACvB,QAAQ,CAAE;AAChCG,MAAAA,QAAQ,EAAEA,QAAS;MACnB,YAAA,EAAYe,YAAY,EAAG;AAC3Bd,MAAAA,OAAO,EAAEA,OAAQ;AAAA0B,MAAAA,QAAA,EAEhB/B;KACK;AACT,GAAA,CACD;AAEN;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOption.js","sources":["../../src/checkboxOption/CheckboxOption.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport CheckboxButton from '../checkboxButton';\nimport Option from '../common/Option';\nimport { ReferenceType, BaseOptionProps } from '../common/Option/Option';\n\nexport type CheckboxOptionProps = Omit<BaseOptionProps, 'onChange'> & {\n /**\n * The checked state of the checkbox.\n */\n checked?: boolean;\n /**\n * Function to call when the checkbox option is clicked\n */\n onChange?: (value: boolean) => void;\n};\n\n/**\n * @deprecated Use `<ListItem />` instead (run codemod to migrate: **`npx @wise/wds-codemods@latest list-item`**).\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst CheckboxOption = forwardRef<ReferenceType, CheckboxOptionProps>(\n ({ checked, disabled, onChange, ...rest }, reference) => {\n return (\n <Option\n {...rest}\n ref={reference}\n disabled={disabled}\n button={\n <CheckboxButton\n checked={checked}\n disabled={disabled}\n onChange={() => onChange?.(!checked)}\n />\n }\n />\n );\n },\n);\n\nexport default CheckboxOption;\n"],"names":["CheckboxOption","forwardRef","checked","disabled","onChange","rest","reference","_jsx","Option","ref","button","CheckboxButton"],"mappings":";;;;;;;;;AAyBA,MAAMA,cAAc,gBAAGC,gBAAU,CAC/B,CAAC;EAAEC,OAAO;EAAEC,QAAQ;EAAEC,QAAQ;EAAE,GAAGC;CAAM,EAAEC,SAAS,KAAI;EACtD,oBACEC,cAAA,CAACC,cAAM,EAAA;AAAA,IAAA,GACDH,IAAI;AACRI,IAAAA,GAAG,EAAEH,SAAU;AACfH,IAAAA,QAAQ,EAAEA,QAAS;IACnBO,MAAM,eACJH,cAAA,CAACI,sBAAc,EAAA;AACbT,MAAAA,OAAO,EAAEA,OAAQ;AACjBC,MAAAA,QAAQ,EAAEA,QAAS;AACnBC,MAAAA,QAAQ,EAAEA,MAAMA,QAAQ,GAAG,CAACF,OAAO;KAAE;AAExC,GAAA,CACD;AAEN,CAAC;;;;"}
|
|
1
|
+
{"version":3,"file":"CheckboxOption.js","sources":["../../src/checkboxOption/CheckboxOption.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport CheckboxButton from '../checkboxButton';\nimport Option from '../common/Option';\nimport { ReferenceType, BaseOptionProps } from '../common/Option/Option';\n\nexport type CheckboxOptionProps = Omit<BaseOptionProps, 'onChange'> & {\n /**\n * The checked state of the checkbox.\n */\n checked?: boolean;\n /**\n * Function to call when the checkbox option is clicked\n */\n onChange?: (value: boolean) => void;\n};\n\n/**\n * @deprecated Use `<ListItem />` instead (run codemod to migrate: **`npx @wise/wds-codemods@latest list-item`**).\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://docs.wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst CheckboxOption = forwardRef<ReferenceType, CheckboxOptionProps>(\n ({ checked, disabled, onChange, ...rest }, reference) => {\n return (\n <Option\n {...rest}\n ref={reference}\n disabled={disabled}\n button={\n <CheckboxButton\n checked={checked}\n disabled={disabled}\n onChange={() => onChange?.(!checked)}\n />\n }\n />\n );\n },\n);\n\nexport default CheckboxOption;\n"],"names":["CheckboxOption","forwardRef","checked","disabled","onChange","rest","reference","_jsx","Option","ref","button","CheckboxButton"],"mappings":";;;;;;;;;AAyBA,MAAMA,cAAc,gBAAGC,gBAAU,CAC/B,CAAC;EAAEC,OAAO;EAAEC,QAAQ;EAAEC,QAAQ;EAAE,GAAGC;CAAM,EAAEC,SAAS,KAAI;EACtD,oBACEC,cAAA,CAACC,cAAM,EAAA;AAAA,IAAA,GACDH,IAAI;AACRI,IAAAA,GAAG,EAAEH,SAAU;AACfH,IAAAA,QAAQ,EAAEA,QAAS;IACnBO,MAAM,eACJH,cAAA,CAACI,sBAAc,EAAA;AACbT,MAAAA,OAAO,EAAEA,OAAQ;AACjBC,MAAAA,QAAQ,EAAEA,QAAS;AACnBC,MAAAA,QAAQ,EAAEA,MAAMA,QAAQ,GAAG,CAACF,OAAO;KAAE;AAExC,GAAA,CACD;AAEN,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOption.mjs","sources":["../../src/checkboxOption/CheckboxOption.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport CheckboxButton from '../checkboxButton';\nimport Option from '../common/Option';\nimport { ReferenceType, BaseOptionProps } from '../common/Option/Option';\n\nexport type CheckboxOptionProps = Omit<BaseOptionProps, 'onChange'> & {\n /**\n * The checked state of the checkbox.\n */\n checked?: boolean;\n /**\n * Function to call when the checkbox option is clicked\n */\n onChange?: (value: boolean) => void;\n};\n\n/**\n * @deprecated Use `<ListItem />` instead (run codemod to migrate: **`npx @wise/wds-codemods@latest list-item`**).\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst CheckboxOption = forwardRef<ReferenceType, CheckboxOptionProps>(\n ({ checked, disabled, onChange, ...rest }, reference) => {\n return (\n <Option\n {...rest}\n ref={reference}\n disabled={disabled}\n button={\n <CheckboxButton\n checked={checked}\n disabled={disabled}\n onChange={() => onChange?.(!checked)}\n />\n }\n />\n );\n },\n);\n\nexport default CheckboxOption;\n"],"names":["CheckboxOption","forwardRef","checked","disabled","onChange","rest","reference","_jsx","Option","ref","button","CheckboxButton"],"mappings":";;;;;AAyBA,MAAMA,cAAc,gBAAGC,UAAU,CAC/B,CAAC;EAAEC,OAAO;EAAEC,QAAQ;EAAEC,QAAQ;EAAE,GAAGC;CAAM,EAAEC,SAAS,KAAI;EACtD,oBACEC,GAAA,CAACC,MAAM,EAAA;AAAA,IAAA,GACDH,IAAI;AACRI,IAAAA,GAAG,EAAEH,SAAU;AACfH,IAAAA,QAAQ,EAAEA,QAAS;IACnBO,MAAM,eACJH,GAAA,CAACI,cAAc,EAAA;AACbT,MAAAA,OAAO,EAAEA,OAAQ;AACjBC,MAAAA,QAAQ,EAAEA,QAAS;AACnBC,MAAAA,QAAQ,EAAEA,MAAMA,QAAQ,GAAG,CAACF,OAAO;KAAE;AAExC,GAAA,CACD;AAEN,CAAC;;;;"}
|
|
1
|
+
{"version":3,"file":"CheckboxOption.mjs","sources":["../../src/checkboxOption/CheckboxOption.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport CheckboxButton from '../checkboxButton';\nimport Option from '../common/Option';\nimport { ReferenceType, BaseOptionProps } from '../common/Option/Option';\n\nexport type CheckboxOptionProps = Omit<BaseOptionProps, 'onChange'> & {\n /**\n * The checked state of the checkbox.\n */\n checked?: boolean;\n /**\n * Function to call when the checkbox option is clicked\n */\n onChange?: (value: boolean) => void;\n};\n\n/**\n * @deprecated Use `<ListItem />` instead (run codemod to migrate: **`npx @wise/wds-codemods@latest list-item`**).\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://docs.wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst CheckboxOption = forwardRef<ReferenceType, CheckboxOptionProps>(\n ({ checked, disabled, onChange, ...rest }, reference) => {\n return (\n <Option\n {...rest}\n ref={reference}\n disabled={disabled}\n button={\n <CheckboxButton\n checked={checked}\n disabled={disabled}\n onChange={() => onChange?.(!checked)}\n />\n }\n />\n );\n },\n);\n\nexport default CheckboxOption;\n"],"names":["CheckboxOption","forwardRef","checked","disabled","onChange","rest","reference","_jsx","Option","ref","button","CheckboxButton"],"mappings":";;;;;AAyBA,MAAMA,cAAc,gBAAGC,UAAU,CAC/B,CAAC;EAAEC,OAAO;EAAEC,QAAQ;EAAEC,QAAQ;EAAE,GAAGC;CAAM,EAAEC,SAAS,KAAI;EACtD,oBACEC,GAAA,CAACC,MAAM,EAAA;AAAA,IAAA,GACDH,IAAI;AACRI,IAAAA,GAAG,EAAEH,SAAU;AACfH,IAAAA,QAAQ,EAAEA,QAAS;IACnBO,MAAM,eACJH,GAAA,CAACI,cAAc,EAAA;AACbT,MAAAA,OAAO,EAAEA,OAAQ;AACjBC,MAAAA,QAAQ,EAAEA,QAAS;AACnBC,MAAAA,QAAQ,EAAEA,MAAMA,QAAQ,GAAG,CAACF,OAAO;KAAE;AAExC,GAAA,CACD;AAEN,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Container.js","sources":["../../src/container/Container.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport type { ComponentPropsWithoutRef, ElementType, PropsWithChildren } from 'react';\n\nimport { CommonProps } from '../common';\n\ntype ContainerOwnProps<T extends ElementType> = CommonProps & {\n /** Controls the maximum width: `fluid` (100%), `standard` (1160px), `narrow` (840px), `compact` (600px). @default 'standard' */\n size?: 'fluid' | 'standard' | 'narrow' | 'compact';\n as?: T;\n};\n\nexport type ContainerProps<T extends ElementType = 'div'> = PropsWithChildren<\n ContainerOwnProps<T>\n> &\n Omit<ComponentPropsWithoutRef<T>, keyof ContainerOwnProps<T> | 'children'>;\n\n/**\n * Centers page content within a responsive max-width boundary, with automatic horizontal padding that adapts to the viewport size.\n *\n * **Design guidance**: <a href=\"https://wise.design/foundations/grid\" target=\"_blank\">wise.design/foundations/grid</a>\n */\nconst Container = <T extends ElementType = 'div'>({\n size = 'standard',\n as,\n className,\n children,\n ...otherProps\n}: ContainerProps<T>) => {\n const Element = as ?? 'div';\n return (\n <Element {...otherProps} className={clsx('wds-container', `wds-container--${size}`, className)}>\n {children}\n </Element>\n );\n};\n\nexport default Container;\n"],"names":["Container","size","as","className","children","otherProps","Element","_jsx","clsx"],"mappings":";;;;;;;AAqBA,MAAMA,SAAS,GAAGA,CAAgC;AAChDC,EAAAA,IAAI,GAAG,UAAU;EACjBC,EAAE;EACFC,SAAS;EACTC,QAAQ;EACR,GAAGC;AAAU,CACK,KAAI;AACtB,EAAA,MAAMC,OAAO,GAAGJ,EAAE,IAAI,KAAK;EAC3B,oBACEK,cAAA,CAACD,OAAO,EAAA;AAAA,IAAA,GAAKD,UAAU;IAAEF,SAAS,EAAEK,SAAI,CAAC,eAAe,EAAE,kBAAkBP,IAAI,CAAA,CAAE,EAAEE,SAAS,CAAE;AAAAC,IAAAA,QAAA,EAC5FA;AAAQ,GACF,CAAC;AAEd;;;;"}
|
|
1
|
+
{"version":3,"file":"Container.js","sources":["../../src/container/Container.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport type { ComponentPropsWithoutRef, ElementType, PropsWithChildren } from 'react';\n\nimport { CommonProps } from '../common';\n\ntype ContainerOwnProps<T extends ElementType> = CommonProps & {\n /** Controls the maximum width: `fluid` (100%), `standard` (1160px), `narrow` (840px), `compact` (600px). @default 'standard' */\n size?: 'fluid' | 'standard' | 'narrow' | 'compact';\n as?: T;\n};\n\nexport type ContainerProps<T extends ElementType = 'div'> = PropsWithChildren<\n ContainerOwnProps<T>\n> &\n Omit<ComponentPropsWithoutRef<T>, keyof ContainerOwnProps<T> | 'children'>;\n\n/**\n * Centers page content within a responsive max-width boundary, with automatic horizontal padding that adapts to the viewport size.\n *\n * **Design guidance**: <a href=\"https://docs.wise.design/foundations/grid\" target=\"_blank\">wise.design/foundations/grid</a>\n */\nconst Container = <T extends ElementType = 'div'>({\n size = 'standard',\n as,\n className,\n children,\n ...otherProps\n}: ContainerProps<T>) => {\n const Element = as ?? 'div';\n return (\n <Element {...otherProps} className={clsx('wds-container', `wds-container--${size}`, className)}>\n {children}\n </Element>\n );\n};\n\nexport default Container;\n"],"names":["Container","size","as","className","children","otherProps","Element","_jsx","clsx"],"mappings":";;;;;;;AAqBA,MAAMA,SAAS,GAAGA,CAAgC;AAChDC,EAAAA,IAAI,GAAG,UAAU;EACjBC,EAAE;EACFC,SAAS;EACTC,QAAQ;EACR,GAAGC;AAAU,CACK,KAAI;AACtB,EAAA,MAAMC,OAAO,GAAGJ,EAAE,IAAI,KAAK;EAC3B,oBACEK,cAAA,CAACD,OAAO,EAAA;AAAA,IAAA,GAAKD,UAAU;IAAEF,SAAS,EAAEK,SAAI,CAAC,eAAe,EAAE,kBAAkBP,IAAI,CAAA,CAAE,EAAEE,SAAS,CAAE;AAAAC,IAAAA,QAAA,EAC5FA;AAAQ,GACF,CAAC;AAEd;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Container.mjs","sources":["../../src/container/Container.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport type { ComponentPropsWithoutRef, ElementType, PropsWithChildren } from 'react';\n\nimport { CommonProps } from '../common';\n\ntype ContainerOwnProps<T extends ElementType> = CommonProps & {\n /** Controls the maximum width: `fluid` (100%), `standard` (1160px), `narrow` (840px), `compact` (600px). @default 'standard' */\n size?: 'fluid' | 'standard' | 'narrow' | 'compact';\n as?: T;\n};\n\nexport type ContainerProps<T extends ElementType = 'div'> = PropsWithChildren<\n ContainerOwnProps<T>\n> &\n Omit<ComponentPropsWithoutRef<T>, keyof ContainerOwnProps<T> | 'children'>;\n\n/**\n * Centers page content within a responsive max-width boundary, with automatic horizontal padding that adapts to the viewport size.\n *\n * **Design guidance**: <a href=\"https://wise.design/foundations/grid\" target=\"_blank\">wise.design/foundations/grid</a>\n */\nconst Container = <T extends ElementType = 'div'>({\n size = 'standard',\n as,\n className,\n children,\n ...otherProps\n}: ContainerProps<T>) => {\n const Element = as ?? 'div';\n return (\n <Element {...otherProps} className={clsx('wds-container', `wds-container--${size}`, className)}>\n {children}\n </Element>\n );\n};\n\nexport default Container;\n"],"names":["Container","size","as","className","children","otherProps","Element","_jsx","clsx"],"mappings":";;;AAqBA,MAAMA,SAAS,GAAGA,CAAgC;AAChDC,EAAAA,IAAI,GAAG,UAAU;EACjBC,EAAE;EACFC,SAAS;EACTC,QAAQ;EACR,GAAGC;AAAU,CACK,KAAI;AACtB,EAAA,MAAMC,OAAO,GAAGJ,EAAE,IAAI,KAAK;EAC3B,oBACEK,GAAA,CAACD,OAAO,EAAA;AAAA,IAAA,GAAKD,UAAU;IAAEF,SAAS,EAAEK,IAAI,CAAC,eAAe,EAAE,kBAAkBP,IAAI,CAAA,CAAE,EAAEE,SAAS,CAAE;AAAAC,IAAAA,QAAA,EAC5FA;AAAQ,GACF,CAAC;AAEd;;;;"}
|
|
1
|
+
{"version":3,"file":"Container.mjs","sources":["../../src/container/Container.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport type { ComponentPropsWithoutRef, ElementType, PropsWithChildren } from 'react';\n\nimport { CommonProps } from '../common';\n\ntype ContainerOwnProps<T extends ElementType> = CommonProps & {\n /** Controls the maximum width: `fluid` (100%), `standard` (1160px), `narrow` (840px), `compact` (600px). @default 'standard' */\n size?: 'fluid' | 'standard' | 'narrow' | 'compact';\n as?: T;\n};\n\nexport type ContainerProps<T extends ElementType = 'div'> = PropsWithChildren<\n ContainerOwnProps<T>\n> &\n Omit<ComponentPropsWithoutRef<T>, keyof ContainerOwnProps<T> | 'children'>;\n\n/**\n * Centers page content within a responsive max-width boundary, with automatic horizontal padding that adapts to the viewport size.\n *\n * **Design guidance**: <a href=\"https://docs.wise.design/foundations/grid\" target=\"_blank\">wise.design/foundations/grid</a>\n */\nconst Container = <T extends ElementType = 'div'>({\n size = 'standard',\n as,\n className,\n children,\n ...otherProps\n}: ContainerProps<T>) => {\n const Element = as ?? 'div';\n return (\n <Element {...otherProps} className={clsx('wds-container', `wds-container--${size}`, className)}>\n {children}\n </Element>\n );\n};\n\nexport default Container;\n"],"names":["Container","size","as","className","children","otherProps","Element","_jsx","clsx"],"mappings":";;;AAqBA,MAAMA,SAAS,GAAGA,CAAgC;AAChDC,EAAAA,IAAI,GAAG,UAAU;EACjBC,EAAE;EACFC,SAAS;EACTC,QAAQ;EACR,GAAGC;AAAU,CACK,KAAI;AACtB,EAAA,MAAMC,OAAO,GAAGJ,EAAE,IAAI,KAAK;EAC3B,oBACEK,GAAA,CAACD,OAAO,EAAA;AAAA,IAAA,GAAKD,UAAU;IAAEF,SAAS,EAAEK,IAAI,CAAC,eAAe,EAAE,kBAAkBP,IAAI,CAAA,CAAE,EAAEE,SAAS,CAAE;AAAAC,IAAAA,QAAA,EAC5FA;AAAQ,GACF,CAAC;AAEd;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LegacyListItem.js","sources":["../../src/legacylistItem/LegacyListItem.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ElementType, FC, ReactNode } from 'react';\n\nimport Body from '../body/Body';\n\nexport type LegacyListItemProps = {\n title: ReactNode;\n value: ReactNode;\n media?: ReactNode;\n action?: ReactNode;\n className?: string;\n isContainerAligned?: boolean;\n as?: ElementType;\n};\n\n/**\n * @deprecated Use `<ListItem />` instead (run codemod to migrate: **`npx @wise/wds-codemods@latest list-item`**).\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst LegacyListItem: FC<LegacyListItemProps> = ({\n media,\n action,\n className,\n title,\n value,\n isContainerAligned,\n as = 'li',\n ...rest\n}) => {\n const Element = as;\n\n return (\n <Element\n className={clsx('np-list-item d-flex align-items-center p-y-2', className, {\n 'p-x-2': !isContainerAligned,\n })}\n {...rest}\n >\n {media}\n\n <div className={clsx('d-flex flex-column', { 'p-l-2': !!media, 'p-r-2': !!action })}>\n <Body type=\"body-default\" className=\"text-secondary m-b-0\">\n {title}\n </Body>\n {value && (\n <Body type=\"body-large\" className=\"text-primary text-overflow-wrap m-b-0\">\n {value}\n </Body>\n )}\n </div>\n\n {action ? <div className=\"np-list-item__action m-l-auto\">{action}</div> : null}\n </Element>\n );\n};\n\nexport default LegacyListItem;\n"],"names":["LegacyListItem","media","action","className","title","value","isContainerAligned","as","rest","Element","_jsxs","clsx","children","_jsx","Body","type"],"mappings":";;;;;;;;AAuBA,MAAMA,cAAc,GAA4BA,CAAC;EAC/CC,KAAK;EACLC,MAAM;EACNC,SAAS;EACTC,KAAK;EACLC,KAAK;EACLC,kBAAkB;AAClBC,EAAAA,EAAE,GAAG,IAAI;EACT,GAAGC;AAAI,CACR,KAAI;EACH,MAAMC,OAAO,GAAGF,EAAE;EAElB,oBACEG,eAAA,CAACD,OAAO,EAAA;AACNN,IAAAA,SAAS,EAAEQ,SAAI,CAAC,8CAA8C,EAAER,SAAS,EAAE;AACzE,MAAA,OAAO,EAAE,CAACG;AACX,KAAA,CAAE;AAAA,IAAA,GACCE,IAAI;IAAAI,QAAA,EAAA,CAEPX,KAAK,eAENS,eAAA,CAAA,KAAA,EAAA;AAAKP,MAAAA,SAAS,EAAEQ,SAAI,CAAC,oBAAoB,EAAE;QAAE,OAAO,EAAE,CAAC,CAACV,KAAK;QAAE,OAAO,EAAE,CAAC,CAACC;AAAM,OAAE,CAAE;MAAAU,QAAA,EAAA,cAClFC,cAAA,CAACC,YAAI,EAAA;AAACC,QAAAA,IAAI,EAAC,cAAc;AAACZ,QAAAA,SAAS,EAAC,sBAAsB;AAAAS,QAAAA,QAAA,EACvDR;AAAK,OACF,CACN,EAACC,KAAK,iBACJQ,cAAA,CAACC,YAAI,EAAA;AAACC,QAAAA,IAAI,EAAC,YAAY;AAACZ,QAAAA,SAAS,EAAC,uCAAuC;AAAAS,QAAAA,QAAA,EACtEP;AAAK,OACF,CACP;AAAA,KACE,CAEL,EAACH,MAAM,gBAAGW,cAAA,CAAA,KAAA,EAAA;AAAKV,MAAAA,SAAS,EAAC,+BAA+B;AAAAS,MAAAA,QAAA,EAAEV;KAAY,CAAC,GAAG,IAAI;AAAA,GACvE,CAAC;AAEd;;;;"}
|
|
1
|
+
{"version":3,"file":"LegacyListItem.js","sources":["../../src/legacylistItem/LegacyListItem.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ElementType, FC, ReactNode } from 'react';\n\nimport Body from '../body/Body';\n\nexport type LegacyListItemProps = {\n title: ReactNode;\n value: ReactNode;\n media?: ReactNode;\n action?: ReactNode;\n className?: string;\n isContainerAligned?: boolean;\n as?: ElementType;\n};\n\n/**\n * @deprecated Use `<ListItem />` instead (run codemod to migrate: **`npx @wise/wds-codemods@latest list-item`**).\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://docs.wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst LegacyListItem: FC<LegacyListItemProps> = ({\n media,\n action,\n className,\n title,\n value,\n isContainerAligned,\n as = 'li',\n ...rest\n}) => {\n const Element = as;\n\n return (\n <Element\n className={clsx('np-list-item d-flex align-items-center p-y-2', className, {\n 'p-x-2': !isContainerAligned,\n })}\n {...rest}\n >\n {media}\n\n <div className={clsx('d-flex flex-column', { 'p-l-2': !!media, 'p-r-2': !!action })}>\n <Body type=\"body-default\" className=\"text-secondary m-b-0\">\n {title}\n </Body>\n {value && (\n <Body type=\"body-large\" className=\"text-primary text-overflow-wrap m-b-0\">\n {value}\n </Body>\n )}\n </div>\n\n {action ? <div className=\"np-list-item__action m-l-auto\">{action}</div> : null}\n </Element>\n );\n};\n\nexport default LegacyListItem;\n"],"names":["LegacyListItem","media","action","className","title","value","isContainerAligned","as","rest","Element","_jsxs","clsx","children","_jsx","Body","type"],"mappings":";;;;;;;;AAuBA,MAAMA,cAAc,GAA4BA,CAAC;EAC/CC,KAAK;EACLC,MAAM;EACNC,SAAS;EACTC,KAAK;EACLC,KAAK;EACLC,kBAAkB;AAClBC,EAAAA,EAAE,GAAG,IAAI;EACT,GAAGC;AAAI,CACR,KAAI;EACH,MAAMC,OAAO,GAAGF,EAAE;EAElB,oBACEG,eAAA,CAACD,OAAO,EAAA;AACNN,IAAAA,SAAS,EAAEQ,SAAI,CAAC,8CAA8C,EAAER,SAAS,EAAE;AACzE,MAAA,OAAO,EAAE,CAACG;AACX,KAAA,CAAE;AAAA,IAAA,GACCE,IAAI;IAAAI,QAAA,EAAA,CAEPX,KAAK,eAENS,eAAA,CAAA,KAAA,EAAA;AAAKP,MAAAA,SAAS,EAAEQ,SAAI,CAAC,oBAAoB,EAAE;QAAE,OAAO,EAAE,CAAC,CAACV,KAAK;QAAE,OAAO,EAAE,CAAC,CAACC;AAAM,OAAE,CAAE;MAAAU,QAAA,EAAA,cAClFC,cAAA,CAACC,YAAI,EAAA;AAACC,QAAAA,IAAI,EAAC,cAAc;AAACZ,QAAAA,SAAS,EAAC,sBAAsB;AAAAS,QAAAA,QAAA,EACvDR;AAAK,OACF,CACN,EAACC,KAAK,iBACJQ,cAAA,CAACC,YAAI,EAAA;AAACC,QAAAA,IAAI,EAAC,YAAY;AAACZ,QAAAA,SAAS,EAAC,uCAAuC;AAAAS,QAAAA,QAAA,EACtEP;AAAK,OACF,CACP;AAAA,KACE,CAEL,EAACH,MAAM,gBAAGW,cAAA,CAAA,KAAA,EAAA;AAAKV,MAAAA,SAAS,EAAC,+BAA+B;AAAAS,MAAAA,QAAA,EAAEV;KAAY,CAAC,GAAG,IAAI;AAAA,GACvE,CAAC;AAEd;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LegacyListItem.mjs","sources":["../../src/legacylistItem/LegacyListItem.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ElementType, FC, ReactNode } from 'react';\n\nimport Body from '../body/Body';\n\nexport type LegacyListItemProps = {\n title: ReactNode;\n value: ReactNode;\n media?: ReactNode;\n action?: ReactNode;\n className?: string;\n isContainerAligned?: boolean;\n as?: ElementType;\n};\n\n/**\n * @deprecated Use `<ListItem />` instead (run codemod to migrate: **`npx @wise/wds-codemods@latest list-item`**).\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst LegacyListItem: FC<LegacyListItemProps> = ({\n media,\n action,\n className,\n title,\n value,\n isContainerAligned,\n as = 'li',\n ...rest\n}) => {\n const Element = as;\n\n return (\n <Element\n className={clsx('np-list-item d-flex align-items-center p-y-2', className, {\n 'p-x-2': !isContainerAligned,\n })}\n {...rest}\n >\n {media}\n\n <div className={clsx('d-flex flex-column', { 'p-l-2': !!media, 'p-r-2': !!action })}>\n <Body type=\"body-default\" className=\"text-secondary m-b-0\">\n {title}\n </Body>\n {value && (\n <Body type=\"body-large\" className=\"text-primary text-overflow-wrap m-b-0\">\n {value}\n </Body>\n )}\n </div>\n\n {action ? <div className=\"np-list-item__action m-l-auto\">{action}</div> : null}\n </Element>\n );\n};\n\nexport default LegacyListItem;\n"],"names":["LegacyListItem","media","action","className","title","value","isContainerAligned","as","rest","Element","_jsxs","clsx","children","_jsx","Body","type"],"mappings":";;;;AAuBA,MAAMA,cAAc,GAA4BA,CAAC;EAC/CC,KAAK;EACLC,MAAM;EACNC,SAAS;EACTC,KAAK;EACLC,KAAK;EACLC,kBAAkB;AAClBC,EAAAA,EAAE,GAAG,IAAI;EACT,GAAGC;AAAI,CACR,KAAI;EACH,MAAMC,OAAO,GAAGF,EAAE;EAElB,oBACEG,IAAA,CAACD,OAAO,EAAA;AACNN,IAAAA,SAAS,EAAEQ,IAAI,CAAC,8CAA8C,EAAER,SAAS,EAAE;AACzE,MAAA,OAAO,EAAE,CAACG;AACX,KAAA,CAAE;AAAA,IAAA,GACCE,IAAI;IAAAI,QAAA,EAAA,CAEPX,KAAK,eAENS,IAAA,CAAA,KAAA,EAAA;AAAKP,MAAAA,SAAS,EAAEQ,IAAI,CAAC,oBAAoB,EAAE;QAAE,OAAO,EAAE,CAAC,CAACV,KAAK;QAAE,OAAO,EAAE,CAAC,CAACC;AAAM,OAAE,CAAE;MAAAU,QAAA,EAAA,cAClFC,GAAA,CAACC,IAAI,EAAA;AAACC,QAAAA,IAAI,EAAC,cAAc;AAACZ,QAAAA,SAAS,EAAC,sBAAsB;AAAAS,QAAAA,QAAA,EACvDR;AAAK,OACF,CACN,EAACC,KAAK,iBACJQ,GAAA,CAACC,IAAI,EAAA;AAACC,QAAAA,IAAI,EAAC,YAAY;AAACZ,QAAAA,SAAS,EAAC,uCAAuC;AAAAS,QAAAA,QAAA,EACtEP;AAAK,OACF,CACP;AAAA,KACE,CAEL,EAACH,MAAM,gBAAGW,GAAA,CAAA,KAAA,EAAA;AAAKV,MAAAA,SAAS,EAAC,+BAA+B;AAAAS,MAAAA,QAAA,EAAEV;KAAY,CAAC,GAAG,IAAI;AAAA,GACvE,CAAC;AAEd;;;;"}
|
|
1
|
+
{"version":3,"file":"LegacyListItem.mjs","sources":["../../src/legacylistItem/LegacyListItem.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ElementType, FC, ReactNode } from 'react';\n\nimport Body from '../body/Body';\n\nexport type LegacyListItemProps = {\n title: ReactNode;\n value: ReactNode;\n media?: ReactNode;\n action?: ReactNode;\n className?: string;\n isContainerAligned?: boolean;\n as?: ElementType;\n};\n\n/**\n * @deprecated Use `<ListItem />` instead (run codemod to migrate: **`npx @wise/wds-codemods@latest list-item`**).\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://docs.wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst LegacyListItem: FC<LegacyListItemProps> = ({\n media,\n action,\n className,\n title,\n value,\n isContainerAligned,\n as = 'li',\n ...rest\n}) => {\n const Element = as;\n\n return (\n <Element\n className={clsx('np-list-item d-flex align-items-center p-y-2', className, {\n 'p-x-2': !isContainerAligned,\n })}\n {...rest}\n >\n {media}\n\n <div className={clsx('d-flex flex-column', { 'p-l-2': !!media, 'p-r-2': !!action })}>\n <Body type=\"body-default\" className=\"text-secondary m-b-0\">\n {title}\n </Body>\n {value && (\n <Body type=\"body-large\" className=\"text-primary text-overflow-wrap m-b-0\">\n {value}\n </Body>\n )}\n </div>\n\n {action ? <div className=\"np-list-item__action m-l-auto\">{action}</div> : null}\n </Element>\n );\n};\n\nexport default LegacyListItem;\n"],"names":["LegacyListItem","media","action","className","title","value","isContainerAligned","as","rest","Element","_jsxs","clsx","children","_jsx","Body","type"],"mappings":";;;;AAuBA,MAAMA,cAAc,GAA4BA,CAAC;EAC/CC,KAAK;EACLC,MAAM;EACNC,SAAS;EACTC,KAAK;EACLC,KAAK;EACLC,kBAAkB;AAClBC,EAAAA,EAAE,GAAG,IAAI;EACT,GAAGC;AAAI,CACR,KAAI;EACH,MAAMC,OAAO,GAAGF,EAAE;EAElB,oBACEG,IAAA,CAACD,OAAO,EAAA;AACNN,IAAAA,SAAS,EAAEQ,IAAI,CAAC,8CAA8C,EAAER,SAAS,EAAE;AACzE,MAAA,OAAO,EAAE,CAACG;AACX,KAAA,CAAE;AAAA,IAAA,GACCE,IAAI;IAAAI,QAAA,EAAA,CAEPX,KAAK,eAENS,IAAA,CAAA,KAAA,EAAA;AAAKP,MAAAA,SAAS,EAAEQ,IAAI,CAAC,oBAAoB,EAAE;QAAE,OAAO,EAAE,CAAC,CAACV,KAAK;QAAE,OAAO,EAAE,CAAC,CAACC;AAAM,OAAE,CAAE;MAAAU,QAAA,EAAA,cAClFC,GAAA,CAACC,IAAI,EAAA;AAACC,QAAAA,IAAI,EAAC,cAAc;AAACZ,QAAAA,SAAS,EAAC,sBAAsB;AAAAS,QAAAA,QAAA,EACvDR;AAAK,OACF,CACN,EAACC,KAAK,iBACJQ,GAAA,CAACC,IAAI,EAAA;AAACC,QAAAA,IAAI,EAAC,YAAY;AAACZ,QAAAA,SAAS,EAAC,uCAAuC;AAAAS,QAAAA,QAAA,EACtEP;AAAK,OACF,CACP;AAAA,KACE,CAEL,EAACH,MAAM,gBAAGW,GAAA,CAAA,KAAA,EAAA;AAAKV,MAAAA,SAAS,EAAC,+BAA+B;AAAAS,MAAAA,QAAA,EAAEV;KAAY,CAAC,GAAG,IAAI;AAAA,GACvE,CAAC;AAEd;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemAvatarLayout.js","sources":["../../../src/listItem/AvatarLayout/ListItemAvatarLayout.tsx"],"sourcesContent":["import AvatarLayoutComp, { type AvatarLayoutProps } from '../../avatarLayout';\nimport { clsx } from 'clsx';\nimport { useListItemMedia } from '../useListItemMedia';\nimport { ListItemMediaSize } from '../ListItemContext';\n\nexport type ListItemAvatarLayoutProps = Omit<AvatarLayoutProps, 'size' | 'interactive'> & {\n size?: ListItemMediaSize;\n};\n\n/**\n * This component allows for rendering 2 avatars. It's a thin wrapper around the\n * [AvatarLayout component](https://storybook.wise.design/?path=/docs/content-avatarlayout--docs), but offers only\n * a subset of its sizes, and disallows interactive mode, in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item#avatar) for details.\n */\nexport const AvatarLayout = ({ className, size = 48, ...props }: ListItemAvatarLayoutProps) => {\n useListItemMedia(size);\n\n return (\n <AvatarLayoutComp\n {...props}\n size={size}\n className={clsx('wds-list-item-media-avatar-layout', className)}\n />\n );\n};\nAvatarLayout.displayName = 'ListItem.AvatarLayout';\n"],"names":["AvatarLayout","className","size","props","useListItemMedia","_jsx","AvatarLayoutComp","clsx","displayName"],"mappings":";;;;;;;AAgBO,MAAMA,YAAY,GAAGA,CAAC;EAAEC,SAAS;AAAEC,EAAAA,IAAI,GAAG,EAAE;EAAE,GAAGC;AAAK,CAA6B,KAAI;EAC5FC,iCAAgB,CAACF,IAAI,CAAC;EAEtB,oBACEG,cAAA,CAACC,sBAAgB,EAAA;AAAA,IAAA,GACXH,KAAK;AACTD,IAAAA,IAAI,EAAEA,IAAK;AACXD,IAAAA,SAAS,EAAEM,SAAI,CAAC,mCAAmC,EAAEN,SAAS;AAAE,GAAA,CAChE;AAEN;AACAD,YAAY,CAACQ,WAAW,GAAG,uBAAuB;;;;"}
|
|
1
|
+
{"version":3,"file":"ListItemAvatarLayout.js","sources":["../../../src/listItem/AvatarLayout/ListItemAvatarLayout.tsx"],"sourcesContent":["import AvatarLayoutComp, { type AvatarLayoutProps } from '../../avatarLayout';\nimport { clsx } from 'clsx';\nimport { useListItemMedia } from '../useListItemMedia';\nimport { ListItemMediaSize } from '../ListItemContext';\n\nexport type ListItemAvatarLayoutProps = Omit<AvatarLayoutProps, 'size' | 'interactive'> & {\n size?: ListItemMediaSize;\n};\n\n/**\n * This component allows for rendering 2 avatars. It's a thin wrapper around the\n * [AvatarLayout component](https://storybook.wise.design/?path=/docs/content-avatarlayout--docs), but offers only\n * a subset of its sizes, and disallows interactive mode, in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://docs.wise.design/components/list-item#avatar) for details.\n */\nexport const AvatarLayout = ({ className, size = 48, ...props }: ListItemAvatarLayoutProps) => {\n useListItemMedia(size);\n\n return (\n <AvatarLayoutComp\n {...props}\n size={size}\n className={clsx('wds-list-item-media-avatar-layout', className)}\n />\n );\n};\nAvatarLayout.displayName = 'ListItem.AvatarLayout';\n"],"names":["AvatarLayout","className","size","props","useListItemMedia","_jsx","AvatarLayoutComp","clsx","displayName"],"mappings":";;;;;;;AAgBO,MAAMA,YAAY,GAAGA,CAAC;EAAEC,SAAS;AAAEC,EAAAA,IAAI,GAAG,EAAE;EAAE,GAAGC;AAAK,CAA6B,KAAI;EAC5FC,iCAAgB,CAACF,IAAI,CAAC;EAEtB,oBACEG,cAAA,CAACC,sBAAgB,EAAA;AAAA,IAAA,GACXH,KAAK;AACTD,IAAAA,IAAI,EAAEA,IAAK;AACXD,IAAAA,SAAS,EAAEM,SAAI,CAAC,mCAAmC,EAAEN,SAAS;AAAE,GAAA,CAChE;AAEN;AACAD,YAAY,CAACQ,WAAW,GAAG,uBAAuB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemAvatarLayout.mjs","sources":["../../../src/listItem/AvatarLayout/ListItemAvatarLayout.tsx"],"sourcesContent":["import AvatarLayoutComp, { type AvatarLayoutProps } from '../../avatarLayout';\nimport { clsx } from 'clsx';\nimport { useListItemMedia } from '../useListItemMedia';\nimport { ListItemMediaSize } from '../ListItemContext';\n\nexport type ListItemAvatarLayoutProps = Omit<AvatarLayoutProps, 'size' | 'interactive'> & {\n size?: ListItemMediaSize;\n};\n\n/**\n * This component allows for rendering 2 avatars. It's a thin wrapper around the\n * [AvatarLayout component](https://storybook.wise.design/?path=/docs/content-avatarlayout--docs), but offers only\n * a subset of its sizes, and disallows interactive mode, in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item#avatar) for details.\n */\nexport const AvatarLayout = ({ className, size = 48, ...props }: ListItemAvatarLayoutProps) => {\n useListItemMedia(size);\n\n return (\n <AvatarLayoutComp\n {...props}\n size={size}\n className={clsx('wds-list-item-media-avatar-layout', className)}\n />\n );\n};\nAvatarLayout.displayName = 'ListItem.AvatarLayout';\n"],"names":["AvatarLayout","className","size","props","useListItemMedia","_jsx","AvatarLayoutComp","clsx","displayName"],"mappings":";;;;;AAgBO,MAAMA,YAAY,GAAGA,CAAC;EAAEC,SAAS;AAAEC,EAAAA,IAAI,GAAG,EAAE;EAAE,GAAGC;AAAK,CAA6B,KAAI;EAC5FC,gBAAgB,CAACF,IAAI,CAAC;EAEtB,oBACEG,GAAA,CAACC,cAAgB,EAAA;AAAA,IAAA,GACXH,KAAK;AACTD,IAAAA,IAAI,EAAEA,IAAK;AACXD,IAAAA,SAAS,EAAEM,IAAI,CAAC,mCAAmC,EAAEN,SAAS;AAAE,GAAA,CAChE;AAEN;AACAD,YAAY,CAACQ,WAAW,GAAG,uBAAuB;;;;"}
|
|
1
|
+
{"version":3,"file":"ListItemAvatarLayout.mjs","sources":["../../../src/listItem/AvatarLayout/ListItemAvatarLayout.tsx"],"sourcesContent":["import AvatarLayoutComp, { type AvatarLayoutProps } from '../../avatarLayout';\nimport { clsx } from 'clsx';\nimport { useListItemMedia } from '../useListItemMedia';\nimport { ListItemMediaSize } from '../ListItemContext';\n\nexport type ListItemAvatarLayoutProps = Omit<AvatarLayoutProps, 'size' | 'interactive'> & {\n size?: ListItemMediaSize;\n};\n\n/**\n * This component allows for rendering 2 avatars. It's a thin wrapper around the\n * [AvatarLayout component](https://storybook.wise.design/?path=/docs/content-avatarlayout--docs), but offers only\n * a subset of its sizes, and disallows interactive mode, in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://docs.wise.design/components/list-item#avatar) for details.\n */\nexport const AvatarLayout = ({ className, size = 48, ...props }: ListItemAvatarLayoutProps) => {\n useListItemMedia(size);\n\n return (\n <AvatarLayoutComp\n {...props}\n size={size}\n className={clsx('wds-list-item-media-avatar-layout', className)}\n />\n );\n};\nAvatarLayout.displayName = 'ListItem.AvatarLayout';\n"],"names":["AvatarLayout","className","size","props","useListItemMedia","_jsx","AvatarLayoutComp","clsx","displayName"],"mappings":";;;;;AAgBO,MAAMA,YAAY,GAAGA,CAAC;EAAEC,SAAS;AAAEC,EAAAA,IAAI,GAAG,EAAE;EAAE,GAAGC;AAAK,CAA6B,KAAI;EAC5FC,gBAAgB,CAACF,IAAI,CAAC;EAEtB,oBACEG,GAAA,CAACC,cAAgB,EAAA;AAAA,IAAA,GACXH,KAAK;AACTD,IAAAA,IAAI,EAAEA,IAAK;AACXD,IAAAA,SAAS,EAAEM,IAAI,CAAC,mCAAmC,EAAEN,SAAS;AAAE,GAAA,CAChE;AAEN;AACAD,YAAY,CAACQ,WAAW,GAAG,uBAAuB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemAvatarView.js","sources":["../../../src/listItem/AvatarView/ListItemAvatarView.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport AvatarViewComp, { type AvatarViewProps } from '../../avatarView';\nimport { useListItemMedia } from '../useListItemMedia';\nimport { ListItemMediaSize } from '../ListItemContext';\n\nexport type ListItemAvatarViewProps = Omit<AvatarViewProps, 'size' | 'interactive'> & {\n size?: ListItemMediaSize;\n};\n\n/**\n * This component renders a single avatar. It's a thin wrapper around the\n * [AvatarView component](https://storybook.wise.design/?path=/docs/content-avatarview--docs), but offers only\n * a subset of its sizes, in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item#avatar) for details.\n */\nexport const AvatarView = ({ className, size = 48, ...props }: ListItemAvatarViewProps) => {\n useListItemMedia(size);\n\n return (\n <AvatarViewComp\n {...props}\n size={size}\n className={clsx('wds-list-item-media-avatar-view', className)}\n />\n );\n};\nAvatarView.displayName = 'ListItem.AvatarView';\n"],"names":["AvatarView","className","size","props","useListItemMedia","_jsx","AvatarViewComp","clsx","displayName"],"mappings":";;;;;;;AAgBO,MAAMA,UAAU,GAAGA,CAAC;EAAEC,SAAS;AAAEC,EAAAA,IAAI,GAAG,EAAE;EAAE,GAAGC;AAAK,CAA2B,KAAI;EACxFC,iCAAgB,CAACF,IAAI,CAAC;EAEtB,oBACEG,cAAA,CAACC,oBAAc,EAAA;AAAA,IAAA,GACTH,KAAK;AACTD,IAAAA,IAAI,EAAEA,IAAK;AACXD,IAAAA,SAAS,EAAEM,SAAI,CAAC,iCAAiC,EAAEN,SAAS;AAAE,GAAA,CAC9D;AAEN;AACAD,UAAU,CAACQ,WAAW,GAAG,qBAAqB;;;;"}
|
|
1
|
+
{"version":3,"file":"ListItemAvatarView.js","sources":["../../../src/listItem/AvatarView/ListItemAvatarView.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport AvatarViewComp, { type AvatarViewProps } from '../../avatarView';\nimport { useListItemMedia } from '../useListItemMedia';\nimport { ListItemMediaSize } from '../ListItemContext';\n\nexport type ListItemAvatarViewProps = Omit<AvatarViewProps, 'size' | 'interactive'> & {\n size?: ListItemMediaSize;\n};\n\n/**\n * This component renders a single avatar. It's a thin wrapper around the\n * [AvatarView component](https://storybook.wise.design/?path=/docs/content-avatarview--docs), but offers only\n * a subset of its sizes, in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://docs.wise.design/components/list-item#avatar) for details.\n */\nexport const AvatarView = ({ className, size = 48, ...props }: ListItemAvatarViewProps) => {\n useListItemMedia(size);\n\n return (\n <AvatarViewComp\n {...props}\n size={size}\n className={clsx('wds-list-item-media-avatar-view', className)}\n />\n );\n};\nAvatarView.displayName = 'ListItem.AvatarView';\n"],"names":["AvatarView","className","size","props","useListItemMedia","_jsx","AvatarViewComp","clsx","displayName"],"mappings":";;;;;;;AAgBO,MAAMA,UAAU,GAAGA,CAAC;EAAEC,SAAS;AAAEC,EAAAA,IAAI,GAAG,EAAE;EAAE,GAAGC;AAAK,CAA2B,KAAI;EACxFC,iCAAgB,CAACF,IAAI,CAAC;EAEtB,oBACEG,cAAA,CAACC,oBAAc,EAAA;AAAA,IAAA,GACTH,KAAK;AACTD,IAAAA,IAAI,EAAEA,IAAK;AACXD,IAAAA,SAAS,EAAEM,SAAI,CAAC,iCAAiC,EAAEN,SAAS;AAAE,GAAA,CAC9D;AAEN;AACAD,UAAU,CAACQ,WAAW,GAAG,qBAAqB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemAvatarView.mjs","sources":["../../../src/listItem/AvatarView/ListItemAvatarView.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport AvatarViewComp, { type AvatarViewProps } from '../../avatarView';\nimport { useListItemMedia } from '../useListItemMedia';\nimport { ListItemMediaSize } from '../ListItemContext';\n\nexport type ListItemAvatarViewProps = Omit<AvatarViewProps, 'size' | 'interactive'> & {\n size?: ListItemMediaSize;\n};\n\n/**\n * This component renders a single avatar. It's a thin wrapper around the\n * [AvatarView component](https://storybook.wise.design/?path=/docs/content-avatarview--docs), but offers only\n * a subset of its sizes, in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item#avatar) for details.\n */\nexport const AvatarView = ({ className, size = 48, ...props }: ListItemAvatarViewProps) => {\n useListItemMedia(size);\n\n return (\n <AvatarViewComp\n {...props}\n size={size}\n className={clsx('wds-list-item-media-avatar-view', className)}\n />\n );\n};\nAvatarView.displayName = 'ListItem.AvatarView';\n"],"names":["AvatarView","className","size","props","useListItemMedia","_jsx","AvatarViewComp","clsx","displayName"],"mappings":";;;;;AAgBO,MAAMA,UAAU,GAAGA,CAAC;EAAEC,SAAS;AAAEC,EAAAA,IAAI,GAAG,EAAE;EAAE,GAAGC;AAAK,CAA2B,KAAI;EACxFC,gBAAgB,CAACF,IAAI,CAAC;EAEtB,oBACEG,GAAA,CAACC,YAAc,EAAA;AAAA,IAAA,GACTH,KAAK;AACTD,IAAAA,IAAI,EAAEA,IAAK;AACXD,IAAAA,SAAS,EAAEM,IAAI,CAAC,iCAAiC,EAAEN,SAAS;AAAE,GAAA,CAC9D;AAEN;AACAD,UAAU,CAACQ,WAAW,GAAG,qBAAqB;;;;"}
|
|
1
|
+
{"version":3,"file":"ListItemAvatarView.mjs","sources":["../../../src/listItem/AvatarView/ListItemAvatarView.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport AvatarViewComp, { type AvatarViewProps } from '../../avatarView';\nimport { useListItemMedia } from '../useListItemMedia';\nimport { ListItemMediaSize } from '../ListItemContext';\n\nexport type ListItemAvatarViewProps = Omit<AvatarViewProps, 'size' | 'interactive'> & {\n size?: ListItemMediaSize;\n};\n\n/**\n * This component renders a single avatar. It's a thin wrapper around the\n * [AvatarView component](https://storybook.wise.design/?path=/docs/content-avatarview--docs), but offers only\n * a subset of its sizes, in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://docs.wise.design/components/list-item#avatar) for details.\n */\nexport const AvatarView = ({ className, size = 48, ...props }: ListItemAvatarViewProps) => {\n useListItemMedia(size);\n\n return (\n <AvatarViewComp\n {...props}\n size={size}\n className={clsx('wds-list-item-media-avatar-view', className)}\n />\n );\n};\nAvatarView.displayName = 'ListItem.AvatarView';\n"],"names":["AvatarView","className","size","props","useListItemMedia","_jsx","AvatarViewComp","clsx","displayName"],"mappings":";;;;;AAgBO,MAAMA,UAAU,GAAGA,CAAC;EAAEC,SAAS;AAAEC,EAAAA,IAAI,GAAG,EAAE;EAAE,GAAGC;AAAK,CAA2B,KAAI;EACxFC,gBAAgB,CAACF,IAAI,CAAC;EAEtB,oBACEG,GAAA,CAACC,YAAc,EAAA;AAAA,IAAA,GACTH,KAAK;AACTD,IAAAA,IAAI,EAAEA,IAAK;AACXD,IAAAA,SAAS,EAAEM,IAAI,CAAC,iCAAiC,EAAEN,SAAS;AAAE,GAAA,CAC9D;AAEN;AACAD,UAAU,CAACQ,WAAW,GAAG,qBAAqB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemButton.js","sources":["../../../src/listItem/Button/ListItemButton.tsx"],"sourcesContent":["import { useContext, forwardRef } from 'react';\nimport { clsx } from 'clsx';\nimport ButtonComp, { type ButtonAddonIcon, type NewButtonProps } from '../../button';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemButtonProps = Omit<\n NewButtonProps,\n 'v2' | 'size' | 'disabled' | 'block' | 'addonStart'\n> & {\n /**\n * Toggles the [interactivity strategy](https://storybook.wise.design/?path=/docs/content-listitem--docs#interactivity) for the whole ListItem.\n */\n partiallyInteractive?: boolean;\n addonStart?: ButtonAddonIcon;\n /** @default 'secondary-neutral' */\n priority?: NewButtonProps['priority'];\n};\n\n/**\n * This component allows for rendering a Button control. It's a thin wrapper around the\n * [Button component](https://storybook.wise.design/?path=/docs/content-button--docs), but offers only\n * a subset of its features in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item---button) for details.\n */\nexport const Button = forwardRef<HTMLButtonElement, ListItemButtonProps>(\n (\n { priority = 'secondary-neutral', partiallyInteractive, ...props }: ListItemButtonProps,\n ref,\n ) => {\n const { baseItemProps } = useListItemControl('button', { partiallyInteractive, ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n const commonProps = {\n ...props,\n className: clsx(\n 'wds-list-item-control',\n !partiallyInteractive && props.href && 'wds-list-item-control_pseudo-element',\n ),\n id: ids.control,\n priority,\n v2: true,\n size: 'sm',\n disabled: baseItemProps.disabled,\n };\n\n const buttonContentId = props.href || partiallyInteractive ? '' : `${ids.control}_content`;\n\n return (\n <ButtonComp\n ref={ref}\n aria-describedby={`${buttonContentId} ${describedByIds}`}\n {...(commonProps as NewButtonProps)}\n />\n );\n },\n);\n\nButton.displayName = 'ListItem.Button';\n"],"names":["Button","forwardRef","priority","partiallyInteractive","props","ref","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","commonProps","className","clsx","href","id","control","v2","size","disabled","buttonContentId","_jsx","ButtonComp","displayName"],"mappings":";;;;;;;;;AA0BO,MAAMA,MAAM,gBAAGC,gBAAU,CAC9B,CACE;AAAEC,EAAAA,QAAQ,GAAG,mBAAmB;EAAEC,oBAAoB;EAAE,GAAGC;CAA4B,EACvFC,GAAG,KACD;EACF,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,qCAAkB,CAAC,QAAQ,EAAE;IAAEJ,oBAAoB;IAAE,GAAGC;AAAK,GAAE,CAAC;EAC1F,MAAM;IAAEI,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,gBAAU,CAACC,+BAAe,CAAC;AAE3D,EAAA,MAAMC,WAAW,GAAG;AAClB,IAAA,GAAGR,KAAK;AACRS,IAAAA,SAAS,EAAEC,SAAI,CACb,uBAAuB,EACvB,CAACX,oBAAoB,IAAIC,KAAK,CAACW,IAAI,IAAI,sCAAsC,CAC9E;IACDC,EAAE,EAAER,GAAG,CAACS,OAAO;IACff,QAAQ;AACRgB,IAAAA,EAAE,EAAE,IAAI;AACRC,IAAAA,IAAI,EAAE,IAAI;IACVC,QAAQ,EAAEd,aAAa,CAACc;GACzB;AAED,EAAA,MAAMC,eAAe,GAAGjB,KAAK,CAACW,IAAI,IAAIZ,oBAAoB,GAAG,EAAE,GAAG,CAAA,EAAGK,GAAG,CAACS,OAAO,CAAA,QAAA,CAAU;EAE1F,oBACEK,cAAA,CAACC,uBAAU,EAAA;AACTlB,IAAAA,GAAG,EAAEA,GAAI;AACT,IAAA,kBAAA,EAAkB,CAAA,EAAGgB,eAAe,CAAA,CAAA,EAAIZ,cAAc,CAAA,CAAG;IAAA,GACpDG;AAA8B,GAAC,CACpC;AAEN,CAAC;AAGHZ,MAAM,CAACwB,WAAW,GAAG,iBAAiB;;;;"}
|
|
1
|
+
{"version":3,"file":"ListItemButton.js","sources":["../../../src/listItem/Button/ListItemButton.tsx"],"sourcesContent":["import { useContext, forwardRef } from 'react';\nimport { clsx } from 'clsx';\nimport ButtonComp, { type ButtonAddonIcon, type NewButtonProps } from '../../button';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemButtonProps = Omit<\n NewButtonProps,\n 'v2' | 'size' | 'disabled' | 'block' | 'addonStart'\n> & {\n /**\n * Toggles the [interactivity strategy](https://storybook.wise.design/?path=/docs/content-listitem--docs#interactivity) for the whole ListItem.\n */\n partiallyInteractive?: boolean;\n addonStart?: ButtonAddonIcon;\n /** @default 'secondary-neutral' */\n priority?: NewButtonProps['priority'];\n};\n\n/**\n * This component allows for rendering a Button control. It's a thin wrapper around the\n * [Button component](https://storybook.wise.design/?path=/docs/content-button--docs), but offers only\n * a subset of its features in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://docs.wise.design/components/list-item---button) for details.\n */\nexport const Button = forwardRef<HTMLButtonElement, ListItemButtonProps>(\n (\n { priority = 'secondary-neutral', partiallyInteractive, ...props }: ListItemButtonProps,\n ref,\n ) => {\n const { baseItemProps } = useListItemControl('button', { partiallyInteractive, ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n const commonProps = {\n ...props,\n className: clsx(\n 'wds-list-item-control',\n !partiallyInteractive && props.href && 'wds-list-item-control_pseudo-element',\n ),\n id: ids.control,\n priority,\n v2: true,\n size: 'sm',\n disabled: baseItemProps.disabled,\n };\n\n const buttonContentId = props.href || partiallyInteractive ? '' : `${ids.control}_content`;\n\n return (\n <ButtonComp\n ref={ref}\n aria-describedby={`${buttonContentId} ${describedByIds}`}\n {...(commonProps as NewButtonProps)}\n />\n );\n },\n);\n\nButton.displayName = 'ListItem.Button';\n"],"names":["Button","forwardRef","priority","partiallyInteractive","props","ref","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","commonProps","className","clsx","href","id","control","v2","size","disabled","buttonContentId","_jsx","ButtonComp","displayName"],"mappings":";;;;;;;;;AA0BO,MAAMA,MAAM,gBAAGC,gBAAU,CAC9B,CACE;AAAEC,EAAAA,QAAQ,GAAG,mBAAmB;EAAEC,oBAAoB;EAAE,GAAGC;CAA4B,EACvFC,GAAG,KACD;EACF,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,qCAAkB,CAAC,QAAQ,EAAE;IAAEJ,oBAAoB;IAAE,GAAGC;AAAK,GAAE,CAAC;EAC1F,MAAM;IAAEI,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,gBAAU,CAACC,+BAAe,CAAC;AAE3D,EAAA,MAAMC,WAAW,GAAG;AAClB,IAAA,GAAGR,KAAK;AACRS,IAAAA,SAAS,EAAEC,SAAI,CACb,uBAAuB,EACvB,CAACX,oBAAoB,IAAIC,KAAK,CAACW,IAAI,IAAI,sCAAsC,CAC9E;IACDC,EAAE,EAAER,GAAG,CAACS,OAAO;IACff,QAAQ;AACRgB,IAAAA,EAAE,EAAE,IAAI;AACRC,IAAAA,IAAI,EAAE,IAAI;IACVC,QAAQ,EAAEd,aAAa,CAACc;GACzB;AAED,EAAA,MAAMC,eAAe,GAAGjB,KAAK,CAACW,IAAI,IAAIZ,oBAAoB,GAAG,EAAE,GAAG,CAAA,EAAGK,GAAG,CAACS,OAAO,CAAA,QAAA,CAAU;EAE1F,oBACEK,cAAA,CAACC,uBAAU,EAAA;AACTlB,IAAAA,GAAG,EAAEA,GAAI;AACT,IAAA,kBAAA,EAAkB,CAAA,EAAGgB,eAAe,CAAA,CAAA,EAAIZ,cAAc,CAAA,CAAG;IAAA,GACpDG;AAA8B,GAAC,CACpC;AAEN,CAAC;AAGHZ,MAAM,CAACwB,WAAW,GAAG,iBAAiB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemButton.mjs","sources":["../../../src/listItem/Button/ListItemButton.tsx"],"sourcesContent":["import { useContext, forwardRef } from 'react';\nimport { clsx } from 'clsx';\nimport ButtonComp, { type ButtonAddonIcon, type NewButtonProps } from '../../button';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemButtonProps = Omit<\n NewButtonProps,\n 'v2' | 'size' | 'disabled' | 'block' | 'addonStart'\n> & {\n /**\n * Toggles the [interactivity strategy](https://storybook.wise.design/?path=/docs/content-listitem--docs#interactivity) for the whole ListItem.\n */\n partiallyInteractive?: boolean;\n addonStart?: ButtonAddonIcon;\n /** @default 'secondary-neutral' */\n priority?: NewButtonProps['priority'];\n};\n\n/**\n * This component allows for rendering a Button control. It's a thin wrapper around the\n * [Button component](https://storybook.wise.design/?path=/docs/content-button--docs), but offers only\n * a subset of its features in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item---button) for details.\n */\nexport const Button = forwardRef<HTMLButtonElement, ListItemButtonProps>(\n (\n { priority = 'secondary-neutral', partiallyInteractive, ...props }: ListItemButtonProps,\n ref,\n ) => {\n const { baseItemProps } = useListItemControl('button', { partiallyInteractive, ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n const commonProps = {\n ...props,\n className: clsx(\n 'wds-list-item-control',\n !partiallyInteractive && props.href && 'wds-list-item-control_pseudo-element',\n ),\n id: ids.control,\n priority,\n v2: true,\n size: 'sm',\n disabled: baseItemProps.disabled,\n };\n\n const buttonContentId = props.href || partiallyInteractive ? '' : `${ids.control}_content`;\n\n return (\n <ButtonComp\n ref={ref}\n aria-describedby={`${buttonContentId} ${describedByIds}`}\n {...(commonProps as NewButtonProps)}\n />\n );\n },\n);\n\nButton.displayName = 'ListItem.Button';\n"],"names":["Button","forwardRef","priority","partiallyInteractive","props","ref","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","commonProps","className","clsx","href","id","control","v2","size","disabled","buttonContentId","_jsx","ButtonComp","displayName"],"mappings":";;;;;;;AA0BO,MAAMA,MAAM,gBAAGC,UAAU,CAC9B,CACE;AAAEC,EAAAA,QAAQ,GAAG,mBAAmB;EAAEC,oBAAoB;EAAE,GAAGC;CAA4B,EACvFC,GAAG,KACD;EACF,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,kBAAkB,CAAC,QAAQ,EAAE;IAAEJ,oBAAoB;IAAE,GAAGC;AAAK,GAAE,CAAC;EAC1F,MAAM;IAAEI,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,UAAU,CAACC,eAAe,CAAC;AAE3D,EAAA,MAAMC,WAAW,GAAG;AAClB,IAAA,GAAGR,KAAK;AACRS,IAAAA,SAAS,EAAEC,IAAI,CACb,uBAAuB,EACvB,CAACX,oBAAoB,IAAIC,KAAK,CAACW,IAAI,IAAI,sCAAsC,CAC9E;IACDC,EAAE,EAAER,GAAG,CAACS,OAAO;IACff,QAAQ;AACRgB,IAAAA,EAAE,EAAE,IAAI;AACRC,IAAAA,IAAI,EAAE,IAAI;IACVC,QAAQ,EAAEd,aAAa,CAACc;GACzB;AAED,EAAA,MAAMC,eAAe,GAAGjB,KAAK,CAACW,IAAI,IAAIZ,oBAAoB,GAAG,EAAE,GAAG,CAAA,EAAGK,GAAG,CAACS,OAAO,CAAA,QAAA,CAAU;EAE1F,oBACEK,GAAA,CAACC,QAAU,EAAA;AACTlB,IAAAA,GAAG,EAAEA,GAAI;AACT,IAAA,kBAAA,EAAkB,CAAA,EAAGgB,eAAe,CAAA,CAAA,EAAIZ,cAAc,CAAA,CAAG;IAAA,GACpDG;AAA8B,GAAC,CACpC;AAEN,CAAC;AAGHZ,MAAM,CAACwB,WAAW,GAAG,iBAAiB;;;;"}
|
|
1
|
+
{"version":3,"file":"ListItemButton.mjs","sources":["../../../src/listItem/Button/ListItemButton.tsx"],"sourcesContent":["import { useContext, forwardRef } from 'react';\nimport { clsx } from 'clsx';\nimport ButtonComp, { type ButtonAddonIcon, type NewButtonProps } from '../../button';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemButtonProps = Omit<\n NewButtonProps,\n 'v2' | 'size' | 'disabled' | 'block' | 'addonStart'\n> & {\n /**\n * Toggles the [interactivity strategy](https://storybook.wise.design/?path=/docs/content-listitem--docs#interactivity) for the whole ListItem.\n */\n partiallyInteractive?: boolean;\n addonStart?: ButtonAddonIcon;\n /** @default 'secondary-neutral' */\n priority?: NewButtonProps['priority'];\n};\n\n/**\n * This component allows for rendering a Button control. It's a thin wrapper around the\n * [Button component](https://storybook.wise.design/?path=/docs/content-button--docs), but offers only\n * a subset of its features in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://docs.wise.design/components/list-item---button) for details.\n */\nexport const Button = forwardRef<HTMLButtonElement, ListItemButtonProps>(\n (\n { priority = 'secondary-neutral', partiallyInteractive, ...props }: ListItemButtonProps,\n ref,\n ) => {\n const { baseItemProps } = useListItemControl('button', { partiallyInteractive, ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n const commonProps = {\n ...props,\n className: clsx(\n 'wds-list-item-control',\n !partiallyInteractive && props.href && 'wds-list-item-control_pseudo-element',\n ),\n id: ids.control,\n priority,\n v2: true,\n size: 'sm',\n disabled: baseItemProps.disabled,\n };\n\n const buttonContentId = props.href || partiallyInteractive ? '' : `${ids.control}_content`;\n\n return (\n <ButtonComp\n ref={ref}\n aria-describedby={`${buttonContentId} ${describedByIds}`}\n {...(commonProps as NewButtonProps)}\n />\n );\n },\n);\n\nButton.displayName = 'ListItem.Button';\n"],"names":["Button","forwardRef","priority","partiallyInteractive","props","ref","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","commonProps","className","clsx","href","id","control","v2","size","disabled","buttonContentId","_jsx","ButtonComp","displayName"],"mappings":";;;;;;;AA0BO,MAAMA,MAAM,gBAAGC,UAAU,CAC9B,CACE;AAAEC,EAAAA,QAAQ,GAAG,mBAAmB;EAAEC,oBAAoB;EAAE,GAAGC;CAA4B,EACvFC,GAAG,KACD;EACF,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,kBAAkB,CAAC,QAAQ,EAAE;IAAEJ,oBAAoB;IAAE,GAAGC;AAAK,GAAE,CAAC;EAC1F,MAAM;IAAEI,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,UAAU,CAACC,eAAe,CAAC;AAE3D,EAAA,MAAMC,WAAW,GAAG;AAClB,IAAA,GAAGR,KAAK;AACRS,IAAAA,SAAS,EAAEC,IAAI,CACb,uBAAuB,EACvB,CAACX,oBAAoB,IAAIC,KAAK,CAACW,IAAI,IAAI,sCAAsC,CAC9E;IACDC,EAAE,EAAER,GAAG,CAACS,OAAO;IACff,QAAQ;AACRgB,IAAAA,EAAE,EAAE,IAAI;AACRC,IAAAA,IAAI,EAAE,IAAI;IACVC,QAAQ,EAAEd,aAAa,CAACc;GACzB;AAED,EAAA,MAAMC,eAAe,GAAGjB,KAAK,CAACW,IAAI,IAAIZ,oBAAoB,GAAG,EAAE,GAAG,CAAA,EAAGK,GAAG,CAACS,OAAO,CAAA,QAAA,CAAU;EAE1F,oBACEK,GAAA,CAACC,QAAU,EAAA;AACTlB,IAAAA,GAAG,EAAEA,GAAI;AACT,IAAA,kBAAA,EAAkB,CAAA,EAAGgB,eAAe,CAAA,CAAA,EAAIZ,cAAc,CAAA,CAAG;IAAA,GACpDG;AAA8B,GAAC,CACpC;AAEN,CAAC;AAGHZ,MAAM,CAACwB,WAAW,GAAG,iBAAiB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemCheckbox.js","sources":["../../../src/listItem/Checkbox/ListItemCheckbox.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport CheckboxButton, { type CheckboxButtonProps } from '../../checkboxButton/CheckboxButton';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemCheckboxProps = Pick<\n CheckboxButtonProps,\n 'checked' | 'indeterminate' | 'onChange' | 'onBlur' | 'onFocus' | 'value' | 'name'\n>;\n\n/**\n * This component allows for rendering a checkbox control within a fully interactive ListItem. <br />It's a thin wrapper around the\n * [CheckboxButton component](https://storybook.wise.design/?path=/docs/actions-checkboxbutton--docs),\n * but offers only a subset of its features in line with the ListItem's constraints. <br />\n *\n * Please refer to the [Design documentation](https://wise.design/components/list-item---checkbox) for details.\n */\nexport const Checkbox = function (props: ListItemCheckboxProps) {\n const { baseItemProps } = useListItemControl('checkbox', { ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n return (\n <CheckboxButton\n {...props}\n className=\"wds-list-item-control\"\n disabled={baseItemProps.disabled}\n id={ids.control}\n aria-describedby={describedByIds}\n />\n );\n};\n\nCheckbox.displayName = 'ListItem.Checkbox';\n"],"names":["Checkbox","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","_jsx","CheckboxButton","className","disabled","id","control","displayName"],"mappings":";;;;;;;;MAiBaA,QAAQ,GAAG,UAAUC,KAA4B,EAAA;EAC5D,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,qCAAkB,CAAC,UAAU,EAAE;IAAE,GAAGF;AAAK,GAAE,CAAC;EACtE,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,gBAAU,CAACC,+BAAe,CAAC;EAE3D,oBACEC,cAAA,CAACC,sBAAc,EAAA;AAAA,IAAA,GACTR,KAAK;AACTS,IAAAA,SAAS,EAAC,uBAAuB;IACjCC,QAAQ,EAAET,aAAa,CAACS,QAAS;IACjCC,EAAE,EAAER,GAAG,CAACS,OAAQ;IAChB,kBAAA,EAAkBR;AAAe,GAAA,CACjC;AAEN;AAEAL,QAAQ,CAACc,WAAW,GAAG,mBAAmB;;;;"}
|
|
1
|
+
{"version":3,"file":"ListItemCheckbox.js","sources":["../../../src/listItem/Checkbox/ListItemCheckbox.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport CheckboxButton, { type CheckboxButtonProps } from '../../checkboxButton/CheckboxButton';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemCheckboxProps = Pick<\n CheckboxButtonProps,\n 'checked' | 'indeterminate' | 'onChange' | 'onBlur' | 'onFocus' | 'value' | 'name'\n>;\n\n/**\n * This component allows for rendering a checkbox control within a fully interactive ListItem. <br />It's a thin wrapper around the\n * [CheckboxButton component](https://storybook.wise.design/?path=/docs/actions-checkboxbutton--docs),\n * but offers only a subset of its features in line with the ListItem's constraints. <br />\n *\n * Please refer to the [Design documentation](https://docs.wise.design/components/list-item---checkbox) for details.\n */\nexport const Checkbox = function (props: ListItemCheckboxProps) {\n const { baseItemProps } = useListItemControl('checkbox', { ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n return (\n <CheckboxButton\n {...props}\n className=\"wds-list-item-control\"\n disabled={baseItemProps.disabled}\n id={ids.control}\n aria-describedby={describedByIds}\n />\n );\n};\n\nCheckbox.displayName = 'ListItem.Checkbox';\n"],"names":["Checkbox","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","_jsx","CheckboxButton","className","disabled","id","control","displayName"],"mappings":";;;;;;;;MAiBaA,QAAQ,GAAG,UAAUC,KAA4B,EAAA;EAC5D,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,qCAAkB,CAAC,UAAU,EAAE;IAAE,GAAGF;AAAK,GAAE,CAAC;EACtE,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,gBAAU,CAACC,+BAAe,CAAC;EAE3D,oBACEC,cAAA,CAACC,sBAAc,EAAA;AAAA,IAAA,GACTR,KAAK;AACTS,IAAAA,SAAS,EAAC,uBAAuB;IACjCC,QAAQ,EAAET,aAAa,CAACS,QAAS;IACjCC,EAAE,EAAER,GAAG,CAACS,OAAQ;IAChB,kBAAA,EAAkBR;AAAe,GAAA,CACjC;AAEN;AAEAL,QAAQ,CAACc,WAAW,GAAG,mBAAmB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemCheckbox.mjs","sources":["../../../src/listItem/Checkbox/ListItemCheckbox.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport CheckboxButton, { type CheckboxButtonProps } from '../../checkboxButton/CheckboxButton';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemCheckboxProps = Pick<\n CheckboxButtonProps,\n 'checked' | 'indeterminate' | 'onChange' | 'onBlur' | 'onFocus' | 'value' | 'name'\n>;\n\n/**\n * This component allows for rendering a checkbox control within a fully interactive ListItem. <br />It's a thin wrapper around the\n * [CheckboxButton component](https://storybook.wise.design/?path=/docs/actions-checkboxbutton--docs),\n * but offers only a subset of its features in line with the ListItem's constraints. <br />\n *\n * Please refer to the [Design documentation](https://wise.design/components/list-item---checkbox) for details.\n */\nexport const Checkbox = function (props: ListItemCheckboxProps) {\n const { baseItemProps } = useListItemControl('checkbox', { ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n return (\n <CheckboxButton\n {...props}\n className=\"wds-list-item-control\"\n disabled={baseItemProps.disabled}\n id={ids.control}\n aria-describedby={describedByIds}\n />\n );\n};\n\nCheckbox.displayName = 'ListItem.Checkbox';\n"],"names":["Checkbox","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","_jsx","CheckboxButton","className","disabled","id","control","displayName"],"mappings":";;;;;;MAiBaA,QAAQ,GAAG,UAAUC,KAA4B,EAAA;EAC5D,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,kBAAkB,CAAC,UAAU,EAAE;IAAE,GAAGF;AAAK,GAAE,CAAC;EACtE,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,UAAU,CAACC,eAAe,CAAC;EAE3D,oBACEC,GAAA,CAACC,cAAc,EAAA;AAAA,IAAA,GACTR,KAAK;AACTS,IAAAA,SAAS,EAAC,uBAAuB;IACjCC,QAAQ,EAAET,aAAa,CAACS,QAAS;IACjCC,EAAE,EAAER,GAAG,CAACS,OAAQ;IAChB,kBAAA,EAAkBR;AAAe,GAAA,CACjC;AAEN;AAEAL,QAAQ,CAACc,WAAW,GAAG,mBAAmB;;;;"}
|
|
1
|
+
{"version":3,"file":"ListItemCheckbox.mjs","sources":["../../../src/listItem/Checkbox/ListItemCheckbox.tsx"],"sourcesContent":["import { useContext } from 'react';\nimport CheckboxButton, { type CheckboxButtonProps } from '../../checkboxButton/CheckboxButton';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemCheckboxProps = Pick<\n CheckboxButtonProps,\n 'checked' | 'indeterminate' | 'onChange' | 'onBlur' | 'onFocus' | 'value' | 'name'\n>;\n\n/**\n * This component allows for rendering a checkbox control within a fully interactive ListItem. <br />It's a thin wrapper around the\n * [CheckboxButton component](https://storybook.wise.design/?path=/docs/actions-checkboxbutton--docs),\n * but offers only a subset of its features in line with the ListItem's constraints. <br />\n *\n * Please refer to the [Design documentation](https://docs.wise.design/components/list-item---checkbox) for details.\n */\nexport const Checkbox = function (props: ListItemCheckboxProps) {\n const { baseItemProps } = useListItemControl('checkbox', { ...props });\n const { ids, describedByIds } = useContext(ListItemContext);\n\n return (\n <CheckboxButton\n {...props}\n className=\"wds-list-item-control\"\n disabled={baseItemProps.disabled}\n id={ids.control}\n aria-describedby={describedByIds}\n />\n );\n};\n\nCheckbox.displayName = 'ListItem.Checkbox';\n"],"names":["Checkbox","props","baseItemProps","useListItemControl","ids","describedByIds","useContext","ListItemContext","_jsx","CheckboxButton","className","disabled","id","control","displayName"],"mappings":";;;;;;MAiBaA,QAAQ,GAAG,UAAUC,KAA4B,EAAA;EAC5D,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,kBAAkB,CAAC,UAAU,EAAE;IAAE,GAAGF;AAAK,GAAE,CAAC;EACtE,MAAM;IAAEG,GAAG;AAAEC,IAAAA;AAAc,GAAE,GAAGC,UAAU,CAACC,eAAe,CAAC;EAE3D,oBACEC,GAAA,CAACC,cAAc,EAAA;AAAA,IAAA,GACTR,KAAK;AACTS,IAAAA,SAAS,EAAC,uBAAuB;IACjCC,QAAQ,EAAET,aAAa,CAACS,QAAS;IACjCC,EAAE,EAAER,GAAG,CAACS,OAAQ;IAChB,kBAAA,EAAkBR;AAAe,GAAA,CACjC;AAEN;AAEAL,QAAQ,CAACc,WAAW,GAAG,mBAAmB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemIconButton.js","sources":["../../../src/listItem/IconButton/ListItemIconButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useContext, type ReactNode } from 'react';\nimport IconButtonComp, { type IconButtonProps } from '../../iconButton';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemIconButtonProps = Pick<\n IconButtonProps,\n 'type' | 'onClick' | 'href' | 'target' | 'aria-label'\n> & {\n children: ReactNode;\n partiallyInteractive?: boolean;\n /** @default 'minimal' */\n priority?: IconButtonProps['priority'];\n};\n\n/**\n * This component allows for rendering a IconButton control. It's a thin wrapper around the\n * [IconButton component](https://storybook.wise.design/?path=/docs/actions-iconbutton--docs), but offers only\n * a subset of its features in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item---icon-button) for details.\n */\nexport const IconButton = function ({\n priority = 'minimal',\n 'aria-label': ariaLabel,\n ...props\n}: ListItemIconButtonProps) {\n const { partiallyInteractive, ...restProps } = props;\n\n const { ids, props: itemProps } = useContext(ListItemContext);\n const { baseItemProps } = useListItemControl('icon-button', {\n partiallyInteractive,\n ...restProps,\n });\n\n const getAriaProps = () => {\n const labelIds = [\n itemProps.inverted ? ids.subtitle : ids.title,\n itemProps.inverted ? ids.title : ids.subtitle,\n itemProps.inverted ? ids.valueSubtitle : ids.valueTitle,\n itemProps.inverted ? ids.valueTitle : ids.valueSubtitle,\n ].join(' ');\n const descriptorIds = [ids.additionalInfo, ids.prompt].join(' ');\n\n if (ariaLabel) {\n return {\n 'aria-label': ariaLabel,\n 'aria-describedby': labelIds.concat(descriptorIds),\n };\n }\n\n return {\n 'aria-labelledby': labelIds,\n 'aria-describedby': descriptorIds,\n };\n };\n\n return (\n <IconButtonComp\n {...restProps}\n {...getAriaProps()}\n className={clsx(\n 'wds-list-item-control',\n !partiallyInteractive && props.href && 'wds-list-item-control_pseudo-element',\n )}\n id={ids.control}\n size={40}\n priority={priority}\n disabled={baseItemProps.disabled}\n />\n );\n};\n\nIconButton.displayName = 'ListItem.IconButton';\n"],"names":["IconButton","priority","ariaLabel","props","partiallyInteractive","restProps","ids","itemProps","useContext","ListItemContext","baseItemProps","useListItemControl","getAriaProps","labelIds","inverted","subtitle","title","valueSubtitle","valueTitle","join","descriptorIds","additionalInfo","prompt","concat","_jsx","IconButtonComp","className","clsx","href","id","control","size","disabled","displayName"],"mappings":";;;;;;;;;AAuBO,MAAMA,UAAU,GAAG,UAAU;AAClCC,EAAAA,QAAQ,GAAG,SAAS;AACpB,EAAA,YAAY,EAAEC,SAAS;EACvB,GAAGC;AAAK,CACgB,EAAA;EACxB,MAAM;IAAEC,oBAAoB;IAAE,GAAGC;AAAS,GAAE,GAAGF,KAAK;EAEpD,MAAM;IAAEG,GAAG;AAAEH,IAAAA,KAAK,EAAEI;AAAS,GAAE,GAAGC,gBAAU,CAACC,+BAAe,CAAC;EAC7D,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,qCAAkB,CAAC,aAAa,EAAE;IAC1DP,oBAAoB;IACpB,GAAGC;AACJ,GAAA,CAAC;EAEF,MAAMO,YAAY,GAAGA,MAAK;IACxB,MAAMC,QAAQ,GAAG,CACfN,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACS,QAAQ,GAAGT,GAAG,CAACU,KAAK,EAC7CT,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACU,KAAK,GAAGV,GAAG,CAACS,QAAQ,EAC7CR,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACW,aAAa,GAAGX,GAAG,CAACY,UAAU,EACvDX,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACY,UAAU,GAAGZ,GAAG,CAACW,aAAa,CACxD,CAACE,IAAI,CAAC,GAAG,CAAC;AACX,IAAA,MAAMC,aAAa,GAAG,CAACd,GAAG,CAACe,cAAc,EAAEf,GAAG,CAACgB,MAAM,CAAC,CAACH,IAAI,CAAC,GAAG,CAAC;AAEhE,IAAA,IAAIjB,SAAS,EAAE;MACb,OAAO;AACL,QAAA,YAAY,EAAEA,SAAS;AACvB,QAAA,kBAAkB,EAAEW,QAAQ,CAACU,MAAM,CAACH,aAAa;OAClD;AACH,IAAA;IAEA,OAAO;AACL,MAAA,iBAAiB,EAAEP,QAAQ;AAC3B,MAAA,kBAAkB,EAAEO;KACrB;EACH,CAAC;EAED,oBACEI,cAAA,CAACC,oBAAc,EAAA;AAAA,IAAA,GACTpB,SAAS;IAAA,GACTO,YAAY,EAAE;AAClBc,IAAAA,SAAS,EAAEC,SAAI,CACb,uBAAuB,EACvB,CAACvB,oBAAoB,IAAID,KAAK,CAACyB,IAAI,IAAI,sCAAsC,CAC7E;IACFC,EAAE,EAAEvB,GAAG,CAACwB,OAAQ;AAChBC,IAAAA,IAAI,EAAE,EAAG;AACT9B,IAAAA,QAAQ,EAAEA,QAAS;IACnB+B,QAAQ,EAAEtB,aAAa,CAACsB;AAAS,GAAA,CACjC;AAEN;AAEAhC,UAAU,CAACiC,WAAW,GAAG,qBAAqB;;;;"}
|
|
1
|
+
{"version":3,"file":"ListItemIconButton.js","sources":["../../../src/listItem/IconButton/ListItemIconButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useContext, type ReactNode } from 'react';\nimport IconButtonComp, { type IconButtonProps } from '../../iconButton';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemIconButtonProps = Pick<\n IconButtonProps,\n 'type' | 'onClick' | 'href' | 'target' | 'aria-label'\n> & {\n children: ReactNode;\n partiallyInteractive?: boolean;\n /** @default 'minimal' */\n priority?: IconButtonProps['priority'];\n};\n\n/**\n * This component allows for rendering a IconButton control. It's a thin wrapper around the\n * [IconButton component](https://storybook.wise.design/?path=/docs/actions-iconbutton--docs), but offers only\n * a subset of its features in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://docs.wise.design/components/list-item---icon-button) for details.\n */\nexport const IconButton = function ({\n priority = 'minimal',\n 'aria-label': ariaLabel,\n ...props\n}: ListItemIconButtonProps) {\n const { partiallyInteractive, ...restProps } = props;\n\n const { ids, props: itemProps } = useContext(ListItemContext);\n const { baseItemProps } = useListItemControl('icon-button', {\n partiallyInteractive,\n ...restProps,\n });\n\n const getAriaProps = () => {\n const labelIds = [\n itemProps.inverted ? ids.subtitle : ids.title,\n itemProps.inverted ? ids.title : ids.subtitle,\n itemProps.inverted ? ids.valueSubtitle : ids.valueTitle,\n itemProps.inverted ? ids.valueTitle : ids.valueSubtitle,\n ].join(' ');\n const descriptorIds = [ids.additionalInfo, ids.prompt].join(' ');\n\n if (ariaLabel) {\n return {\n 'aria-label': ariaLabel,\n 'aria-describedby': labelIds.concat(descriptorIds),\n };\n }\n\n return {\n 'aria-labelledby': labelIds,\n 'aria-describedby': descriptorIds,\n };\n };\n\n return (\n <IconButtonComp\n {...restProps}\n {...getAriaProps()}\n className={clsx(\n 'wds-list-item-control',\n !partiallyInteractive && props.href && 'wds-list-item-control_pseudo-element',\n )}\n id={ids.control}\n size={40}\n priority={priority}\n disabled={baseItemProps.disabled}\n />\n );\n};\n\nIconButton.displayName = 'ListItem.IconButton';\n"],"names":["IconButton","priority","ariaLabel","props","partiallyInteractive","restProps","ids","itemProps","useContext","ListItemContext","baseItemProps","useListItemControl","getAriaProps","labelIds","inverted","subtitle","title","valueSubtitle","valueTitle","join","descriptorIds","additionalInfo","prompt","concat","_jsx","IconButtonComp","className","clsx","href","id","control","size","disabled","displayName"],"mappings":";;;;;;;;;AAuBO,MAAMA,UAAU,GAAG,UAAU;AAClCC,EAAAA,QAAQ,GAAG,SAAS;AACpB,EAAA,YAAY,EAAEC,SAAS;EACvB,GAAGC;AAAK,CACgB,EAAA;EACxB,MAAM;IAAEC,oBAAoB;IAAE,GAAGC;AAAS,GAAE,GAAGF,KAAK;EAEpD,MAAM;IAAEG,GAAG;AAAEH,IAAAA,KAAK,EAAEI;AAAS,GAAE,GAAGC,gBAAU,CAACC,+BAAe,CAAC;EAC7D,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,qCAAkB,CAAC,aAAa,EAAE;IAC1DP,oBAAoB;IACpB,GAAGC;AACJ,GAAA,CAAC;EAEF,MAAMO,YAAY,GAAGA,MAAK;IACxB,MAAMC,QAAQ,GAAG,CACfN,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACS,QAAQ,GAAGT,GAAG,CAACU,KAAK,EAC7CT,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACU,KAAK,GAAGV,GAAG,CAACS,QAAQ,EAC7CR,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACW,aAAa,GAAGX,GAAG,CAACY,UAAU,EACvDX,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACY,UAAU,GAAGZ,GAAG,CAACW,aAAa,CACxD,CAACE,IAAI,CAAC,GAAG,CAAC;AACX,IAAA,MAAMC,aAAa,GAAG,CAACd,GAAG,CAACe,cAAc,EAAEf,GAAG,CAACgB,MAAM,CAAC,CAACH,IAAI,CAAC,GAAG,CAAC;AAEhE,IAAA,IAAIjB,SAAS,EAAE;MACb,OAAO;AACL,QAAA,YAAY,EAAEA,SAAS;AACvB,QAAA,kBAAkB,EAAEW,QAAQ,CAACU,MAAM,CAACH,aAAa;OAClD;AACH,IAAA;IAEA,OAAO;AACL,MAAA,iBAAiB,EAAEP,QAAQ;AAC3B,MAAA,kBAAkB,EAAEO;KACrB;EACH,CAAC;EAED,oBACEI,cAAA,CAACC,oBAAc,EAAA;AAAA,IAAA,GACTpB,SAAS;IAAA,GACTO,YAAY,EAAE;AAClBc,IAAAA,SAAS,EAAEC,SAAI,CACb,uBAAuB,EACvB,CAACvB,oBAAoB,IAAID,KAAK,CAACyB,IAAI,IAAI,sCAAsC,CAC7E;IACFC,EAAE,EAAEvB,GAAG,CAACwB,OAAQ;AAChBC,IAAAA,IAAI,EAAE,EAAG;AACT9B,IAAAA,QAAQ,EAAEA,QAAS;IACnB+B,QAAQ,EAAEtB,aAAa,CAACsB;AAAS,GAAA,CACjC;AAEN;AAEAhC,UAAU,CAACiC,WAAW,GAAG,qBAAqB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemIconButton.mjs","sources":["../../../src/listItem/IconButton/ListItemIconButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useContext, type ReactNode } from 'react';\nimport IconButtonComp, { type IconButtonProps } from '../../iconButton';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemIconButtonProps = Pick<\n IconButtonProps,\n 'type' | 'onClick' | 'href' | 'target' | 'aria-label'\n> & {\n children: ReactNode;\n partiallyInteractive?: boolean;\n /** @default 'minimal' */\n priority?: IconButtonProps['priority'];\n};\n\n/**\n * This component allows for rendering a IconButton control. It's a thin wrapper around the\n * [IconButton component](https://storybook.wise.design/?path=/docs/actions-iconbutton--docs), but offers only\n * a subset of its features in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://wise.design/components/list-item---icon-button) for details.\n */\nexport const IconButton = function ({\n priority = 'minimal',\n 'aria-label': ariaLabel,\n ...props\n}: ListItemIconButtonProps) {\n const { partiallyInteractive, ...restProps } = props;\n\n const { ids, props: itemProps } = useContext(ListItemContext);\n const { baseItemProps } = useListItemControl('icon-button', {\n partiallyInteractive,\n ...restProps,\n });\n\n const getAriaProps = () => {\n const labelIds = [\n itemProps.inverted ? ids.subtitle : ids.title,\n itemProps.inverted ? ids.title : ids.subtitle,\n itemProps.inverted ? ids.valueSubtitle : ids.valueTitle,\n itemProps.inverted ? ids.valueTitle : ids.valueSubtitle,\n ].join(' ');\n const descriptorIds = [ids.additionalInfo, ids.prompt].join(' ');\n\n if (ariaLabel) {\n return {\n 'aria-label': ariaLabel,\n 'aria-describedby': labelIds.concat(descriptorIds),\n };\n }\n\n return {\n 'aria-labelledby': labelIds,\n 'aria-describedby': descriptorIds,\n };\n };\n\n return (\n <IconButtonComp\n {...restProps}\n {...getAriaProps()}\n className={clsx(\n 'wds-list-item-control',\n !partiallyInteractive && props.href && 'wds-list-item-control_pseudo-element',\n )}\n id={ids.control}\n size={40}\n priority={priority}\n disabled={baseItemProps.disabled}\n />\n );\n};\n\nIconButton.displayName = 'ListItem.IconButton';\n"],"names":["IconButton","priority","ariaLabel","props","partiallyInteractive","restProps","ids","itemProps","useContext","ListItemContext","baseItemProps","useListItemControl","getAriaProps","labelIds","inverted","subtitle","title","valueSubtitle","valueTitle","join","descriptorIds","additionalInfo","prompt","concat","_jsx","IconButtonComp","className","clsx","href","id","control","size","disabled","displayName"],"mappings":";;;;;;;AAuBO,MAAMA,UAAU,GAAG,UAAU;AAClCC,EAAAA,QAAQ,GAAG,SAAS;AACpB,EAAA,YAAY,EAAEC,SAAS;EACvB,GAAGC;AAAK,CACgB,EAAA;EACxB,MAAM;IAAEC,oBAAoB;IAAE,GAAGC;AAAS,GAAE,GAAGF,KAAK;EAEpD,MAAM;IAAEG,GAAG;AAAEH,IAAAA,KAAK,EAAEI;AAAS,GAAE,GAAGC,UAAU,CAACC,eAAe,CAAC;EAC7D,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,kBAAkB,CAAC,aAAa,EAAE;IAC1DP,oBAAoB;IACpB,GAAGC;AACJ,GAAA,CAAC;EAEF,MAAMO,YAAY,GAAGA,MAAK;IACxB,MAAMC,QAAQ,GAAG,CACfN,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACS,QAAQ,GAAGT,GAAG,CAACU,KAAK,EAC7CT,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACU,KAAK,GAAGV,GAAG,CAACS,QAAQ,EAC7CR,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACW,aAAa,GAAGX,GAAG,CAACY,UAAU,EACvDX,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACY,UAAU,GAAGZ,GAAG,CAACW,aAAa,CACxD,CAACE,IAAI,CAAC,GAAG,CAAC;AACX,IAAA,MAAMC,aAAa,GAAG,CAACd,GAAG,CAACe,cAAc,EAAEf,GAAG,CAACgB,MAAM,CAAC,CAACH,IAAI,CAAC,GAAG,CAAC;AAEhE,IAAA,IAAIjB,SAAS,EAAE;MACb,OAAO;AACL,QAAA,YAAY,EAAEA,SAAS;AACvB,QAAA,kBAAkB,EAAEW,QAAQ,CAACU,MAAM,CAACH,aAAa;OAClD;AACH,IAAA;IAEA,OAAO;AACL,MAAA,iBAAiB,EAAEP,QAAQ;AAC3B,MAAA,kBAAkB,EAAEO;KACrB;EACH,CAAC;EAED,oBACEI,GAAA,CAACC,YAAc,EAAA;AAAA,IAAA,GACTpB,SAAS;IAAA,GACTO,YAAY,EAAE;AAClBc,IAAAA,SAAS,EAAEC,IAAI,CACb,uBAAuB,EACvB,CAACvB,oBAAoB,IAAID,KAAK,CAACyB,IAAI,IAAI,sCAAsC,CAC7E;IACFC,EAAE,EAAEvB,GAAG,CAACwB,OAAQ;AAChBC,IAAAA,IAAI,EAAE,EAAG;AACT9B,IAAAA,QAAQ,EAAEA,QAAS;IACnB+B,QAAQ,EAAEtB,aAAa,CAACsB;AAAS,GAAA,CACjC;AAEN;AAEAhC,UAAU,CAACiC,WAAW,GAAG,qBAAqB;;;;"}
|
|
1
|
+
{"version":3,"file":"ListItemIconButton.mjs","sources":["../../../src/listItem/IconButton/ListItemIconButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useContext, type ReactNode } from 'react';\nimport IconButtonComp, { type IconButtonProps } from '../../iconButton';\nimport { useListItemControl } from '../useListItemControl';\nimport { ListItemContext } from '../ListItemContext';\n\nexport type ListItemIconButtonProps = Pick<\n IconButtonProps,\n 'type' | 'onClick' | 'href' | 'target' | 'aria-label'\n> & {\n children: ReactNode;\n partiallyInteractive?: boolean;\n /** @default 'minimal' */\n priority?: IconButtonProps['priority'];\n};\n\n/**\n * This component allows for rendering a IconButton control. It's a thin wrapper around the\n * [IconButton component](https://storybook.wise.design/?path=/docs/actions-iconbutton--docs), but offers only\n * a subset of its features in line with the ListItem's constraints. <br />\n * <br />\n * Please refer to the [Design documentation](https://docs.wise.design/components/list-item---icon-button) for details.\n */\nexport const IconButton = function ({\n priority = 'minimal',\n 'aria-label': ariaLabel,\n ...props\n}: ListItemIconButtonProps) {\n const { partiallyInteractive, ...restProps } = props;\n\n const { ids, props: itemProps } = useContext(ListItemContext);\n const { baseItemProps } = useListItemControl('icon-button', {\n partiallyInteractive,\n ...restProps,\n });\n\n const getAriaProps = () => {\n const labelIds = [\n itemProps.inverted ? ids.subtitle : ids.title,\n itemProps.inverted ? ids.title : ids.subtitle,\n itemProps.inverted ? ids.valueSubtitle : ids.valueTitle,\n itemProps.inverted ? ids.valueTitle : ids.valueSubtitle,\n ].join(' ');\n const descriptorIds = [ids.additionalInfo, ids.prompt].join(' ');\n\n if (ariaLabel) {\n return {\n 'aria-label': ariaLabel,\n 'aria-describedby': labelIds.concat(descriptorIds),\n };\n }\n\n return {\n 'aria-labelledby': labelIds,\n 'aria-describedby': descriptorIds,\n };\n };\n\n return (\n <IconButtonComp\n {...restProps}\n {...getAriaProps()}\n className={clsx(\n 'wds-list-item-control',\n !partiallyInteractive && props.href && 'wds-list-item-control_pseudo-element',\n )}\n id={ids.control}\n size={40}\n priority={priority}\n disabled={baseItemProps.disabled}\n />\n );\n};\n\nIconButton.displayName = 'ListItem.IconButton';\n"],"names":["IconButton","priority","ariaLabel","props","partiallyInteractive","restProps","ids","itemProps","useContext","ListItemContext","baseItemProps","useListItemControl","getAriaProps","labelIds","inverted","subtitle","title","valueSubtitle","valueTitle","join","descriptorIds","additionalInfo","prompt","concat","_jsx","IconButtonComp","className","clsx","href","id","control","size","disabled","displayName"],"mappings":";;;;;;;AAuBO,MAAMA,UAAU,GAAG,UAAU;AAClCC,EAAAA,QAAQ,GAAG,SAAS;AACpB,EAAA,YAAY,EAAEC,SAAS;EACvB,GAAGC;AAAK,CACgB,EAAA;EACxB,MAAM;IAAEC,oBAAoB;IAAE,GAAGC;AAAS,GAAE,GAAGF,KAAK;EAEpD,MAAM;IAAEG,GAAG;AAAEH,IAAAA,KAAK,EAAEI;AAAS,GAAE,GAAGC,UAAU,CAACC,eAAe,CAAC;EAC7D,MAAM;AAAEC,IAAAA;AAAa,GAAE,GAAGC,kBAAkB,CAAC,aAAa,EAAE;IAC1DP,oBAAoB;IACpB,GAAGC;AACJ,GAAA,CAAC;EAEF,MAAMO,YAAY,GAAGA,MAAK;IACxB,MAAMC,QAAQ,GAAG,CACfN,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACS,QAAQ,GAAGT,GAAG,CAACU,KAAK,EAC7CT,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACU,KAAK,GAAGV,GAAG,CAACS,QAAQ,EAC7CR,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACW,aAAa,GAAGX,GAAG,CAACY,UAAU,EACvDX,SAAS,CAACO,QAAQ,GAAGR,GAAG,CAACY,UAAU,GAAGZ,GAAG,CAACW,aAAa,CACxD,CAACE,IAAI,CAAC,GAAG,CAAC;AACX,IAAA,MAAMC,aAAa,GAAG,CAACd,GAAG,CAACe,cAAc,EAAEf,GAAG,CAACgB,MAAM,CAAC,CAACH,IAAI,CAAC,GAAG,CAAC;AAEhE,IAAA,IAAIjB,SAAS,EAAE;MACb,OAAO;AACL,QAAA,YAAY,EAAEA,SAAS;AACvB,QAAA,kBAAkB,EAAEW,QAAQ,CAACU,MAAM,CAACH,aAAa;OAClD;AACH,IAAA;IAEA,OAAO;AACL,MAAA,iBAAiB,EAAEP,QAAQ;AAC3B,MAAA,kBAAkB,EAAEO;KACrB;EACH,CAAC;EAED,oBACEI,GAAA,CAACC,YAAc,EAAA;AAAA,IAAA,GACTpB,SAAS;IAAA,GACTO,YAAY,EAAE;AAClBc,IAAAA,SAAS,EAAEC,IAAI,CACb,uBAAuB,EACvB,CAACvB,oBAAoB,IAAID,KAAK,CAACyB,IAAI,IAAI,sCAAsC,CAC7E;IACFC,EAAE,EAAEvB,GAAG,CAACwB,OAAQ;AAChBC,IAAAA,IAAI,EAAE,EAAG;AACT9B,IAAAA,QAAQ,EAAEA,QAAS;IACnB+B,QAAQ,EAAEtB,aAAa,CAACsB;AAAS,GAAA,CACjC;AAEN;AAEAhC,UAAU,CAACiC,WAAW,GAAG,qBAAqB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemImage.js","sources":["../../../src/listItem/Image/ListItemImage.tsx"],"sourcesContent":["import ImageComp, { type ImageProps } from '../../image';\nimport { clsx } from 'clsx';\nimport { useListItemMedia } from '../useListItemMedia';\nimport { ListItemMediaSize } from '../ListItemContext';\n\nexport type ListItemImageProps = Omit<ImageProps, 'stretch' | 'shrink' | 'id' | 'alt' | 'role'> & {\n /**\n * The size of square container for the image, matching available avatar sizes.\n * @default 48\n */\n size?: ListItemMediaSize;\n /**\n * When unset, it will force `role=\"presentation\"` on the image. Otherwise, the image will use its implicit img role.\n * @default ''\n */\n alt?: string;\n};\n\n/**\n * This component should be used as a last resort, for rare cases when `<ListItem.AvatarView />`\n * or `<ListItem.AvatarLayout />` are insufficient.\n * It's a wrapper around the\n * [Image component](https://storybook.wise.design/?path=/docs/content-image--docs), but offers only\n * a subset of its props, in line with the ListItem's constraints.\n *\n * > **NB**: This component is [not intended for use with illustrations](https://wise.design/foundations/illustration#scale).\n */\nexport const Image = ({ alt = '', size = 48, className, ...props }: ListItemImageProps) => {\n useListItemMedia(size);\n\n return (\n <div\n className={clsx('wds-list-item-media-image-wrapper')}\n style={\n {\n '--wds-list-item-media-size': `${size}px`,\n } as React.CSSProperties\n }\n >\n <ImageComp\n {...props}\n className={clsx(className, 'wds-list-item-media-image')}\n alt={alt}\n role={alt ? undefined : 'presentation'}\n />\n </div>\n );\n};\nImage.displayName = 'ListItem.Image';\n"],"names":["Image","alt","size","className","props","useListItemMedia","_jsx","clsx","style","children","ImageComp","role","undefined","displayName"],"mappings":";;;;;;;AA2BO,MAAMA,KAAK,GAAGA,CAAC;AAAEC,EAAAA,GAAG,GAAG,EAAE;AAAEC,EAAAA,IAAI,GAAG,EAAE;EAAEC,SAAS;EAAE,GAAGC;AAAK,CAAsB,KAAI;EACxFC,iCAAgB,CAACH,IAAI,CAAC;AAEtB,EAAA,oBACEI,cAAA,CAAA,KAAA,EAAA;AACEH,IAAAA,SAAS,EAAEI,SAAI,CAAC,mCAAmC,CAAE;AACrDC,IAAAA,KAAK,EACH;MACE,4BAA4B,EAAE,GAAGN,IAAI,CAAA,EAAA;KAExC;IAAAO,QAAA,eAEDH,cAAA,CAACI,eAAS,EAAA;AAAA,MAAA,GACJN,KAAK;AACTD,MAAAA,SAAS,EAAEI,SAAI,CAACJ,SAAS,EAAE,2BAA2B,CAAE;AACxDF,MAAAA,GAAG,EAAEA,GAAI;AACTU,MAAAA,IAAI,EAAEV,GAAG,GAAGW,SAAS,GAAG;KAAe;AAE3C,GAAK,CAAC;AAEV;AACAZ,KAAK,CAACa,WAAW,GAAG,gBAAgB;;;;"}
|
|
1
|
+
{"version":3,"file":"ListItemImage.js","sources":["../../../src/listItem/Image/ListItemImage.tsx"],"sourcesContent":["import ImageComp, { type ImageProps } from '../../image';\nimport { clsx } from 'clsx';\nimport { useListItemMedia } from '../useListItemMedia';\nimport { ListItemMediaSize } from '../ListItemContext';\n\nexport type ListItemImageProps = Omit<ImageProps, 'stretch' | 'shrink' | 'id' | 'alt' | 'role'> & {\n /**\n * The size of square container for the image, matching available avatar sizes.\n * @default 48\n */\n size?: ListItemMediaSize;\n /**\n * When unset, it will force `role=\"presentation\"` on the image. Otherwise, the image will use its implicit img role.\n * @default ''\n */\n alt?: string;\n};\n\n/**\n * This component should be used as a last resort, for rare cases when `<ListItem.AvatarView />`\n * or `<ListItem.AvatarLayout />` are insufficient.\n * It's a wrapper around the\n * [Image component](https://storybook.wise.design/?path=/docs/content-image--docs), but offers only\n * a subset of its props, in line with the ListItem's constraints.\n *\n * > **NB**: This component is [not intended for use with illustrations](https://docs.wise.design/foundations/illustration#scale).\n */\nexport const Image = ({ alt = '', size = 48, className, ...props }: ListItemImageProps) => {\n useListItemMedia(size);\n\n return (\n <div\n className={clsx('wds-list-item-media-image-wrapper')}\n style={\n {\n '--wds-list-item-media-size': `${size}px`,\n } as React.CSSProperties\n }\n >\n <ImageComp\n {...props}\n className={clsx(className, 'wds-list-item-media-image')}\n alt={alt}\n role={alt ? undefined : 'presentation'}\n />\n </div>\n );\n};\nImage.displayName = 'ListItem.Image';\n"],"names":["Image","alt","size","className","props","useListItemMedia","_jsx","clsx","style","children","ImageComp","role","undefined","displayName"],"mappings":";;;;;;;AA2BO,MAAMA,KAAK,GAAGA,CAAC;AAAEC,EAAAA,GAAG,GAAG,EAAE;AAAEC,EAAAA,IAAI,GAAG,EAAE;EAAEC,SAAS;EAAE,GAAGC;AAAK,CAAsB,KAAI;EACxFC,iCAAgB,CAACH,IAAI,CAAC;AAEtB,EAAA,oBACEI,cAAA,CAAA,KAAA,EAAA;AACEH,IAAAA,SAAS,EAAEI,SAAI,CAAC,mCAAmC,CAAE;AACrDC,IAAAA,KAAK,EACH;MACE,4BAA4B,EAAE,GAAGN,IAAI,CAAA,EAAA;KAExC;IAAAO,QAAA,eAEDH,cAAA,CAACI,eAAS,EAAA;AAAA,MAAA,GACJN,KAAK;AACTD,MAAAA,SAAS,EAAEI,SAAI,CAACJ,SAAS,EAAE,2BAA2B,CAAE;AACxDF,MAAAA,GAAG,EAAEA,GAAI;AACTU,MAAAA,IAAI,EAAEV,GAAG,GAAGW,SAAS,GAAG;KAAe;AAE3C,GAAK,CAAC;AAEV;AACAZ,KAAK,CAACa,WAAW,GAAG,gBAAgB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItemImage.mjs","sources":["../../../src/listItem/Image/ListItemImage.tsx"],"sourcesContent":["import ImageComp, { type ImageProps } from '../../image';\nimport { clsx } from 'clsx';\nimport { useListItemMedia } from '../useListItemMedia';\nimport { ListItemMediaSize } from '../ListItemContext';\n\nexport type ListItemImageProps = Omit<ImageProps, 'stretch' | 'shrink' | 'id' | 'alt' | 'role'> & {\n /**\n * The size of square container for the image, matching available avatar sizes.\n * @default 48\n */\n size?: ListItemMediaSize;\n /**\n * When unset, it will force `role=\"presentation\"` on the image. Otherwise, the image will use its implicit img role.\n * @default ''\n */\n alt?: string;\n};\n\n/**\n * This component should be used as a last resort, for rare cases when `<ListItem.AvatarView />`\n * or `<ListItem.AvatarLayout />` are insufficient.\n * It's a wrapper around the\n * [Image component](https://storybook.wise.design/?path=/docs/content-image--docs), but offers only\n * a subset of its props, in line with the ListItem's constraints.\n *\n * > **NB**: This component is [not intended for use with illustrations](https://wise.design/foundations/illustration#scale).\n */\nexport const Image = ({ alt = '', size = 48, className, ...props }: ListItemImageProps) => {\n useListItemMedia(size);\n\n return (\n <div\n className={clsx('wds-list-item-media-image-wrapper')}\n style={\n {\n '--wds-list-item-media-size': `${size}px`,\n } as React.CSSProperties\n }\n >\n <ImageComp\n {...props}\n className={clsx(className, 'wds-list-item-media-image')}\n alt={alt}\n role={alt ? undefined : 'presentation'}\n />\n </div>\n );\n};\nImage.displayName = 'ListItem.Image';\n"],"names":["Image","alt","size","className","props","useListItemMedia","_jsx","clsx","style","children","ImageComp","role","undefined","displayName"],"mappings":";;;;;AA2BO,MAAMA,KAAK,GAAGA,CAAC;AAAEC,EAAAA,GAAG,GAAG,EAAE;AAAEC,EAAAA,IAAI,GAAG,EAAE;EAAEC,SAAS;EAAE,GAAGC;AAAK,CAAsB,KAAI;EACxFC,gBAAgB,CAACH,IAAI,CAAC;AAEtB,EAAA,oBACEI,GAAA,CAAA,KAAA,EAAA;AACEH,IAAAA,SAAS,EAAEI,IAAI,CAAC,mCAAmC,CAAE;AACrDC,IAAAA,KAAK,EACH;MACE,4BAA4B,EAAE,GAAGN,IAAI,CAAA,EAAA;KAExC;IAAAO,QAAA,eAEDH,GAAA,CAACI,OAAS,EAAA;AAAA,MAAA,GACJN,KAAK;AACTD,MAAAA,SAAS,EAAEI,IAAI,CAACJ,SAAS,EAAE,2BAA2B,CAAE;AACxDF,MAAAA,GAAG,EAAEA,GAAI;AACTU,MAAAA,IAAI,EAAEV,GAAG,GAAGW,SAAS,GAAG;KAAe;AAE3C,GAAK,CAAC;AAEV;AACAZ,KAAK,CAACa,WAAW,GAAG,gBAAgB;;;;"}
|
|
1
|
+
{"version":3,"file":"ListItemImage.mjs","sources":["../../../src/listItem/Image/ListItemImage.tsx"],"sourcesContent":["import ImageComp, { type ImageProps } from '../../image';\nimport { clsx } from 'clsx';\nimport { useListItemMedia } from '../useListItemMedia';\nimport { ListItemMediaSize } from '../ListItemContext';\n\nexport type ListItemImageProps = Omit<ImageProps, 'stretch' | 'shrink' | 'id' | 'alt' | 'role'> & {\n /**\n * The size of square container for the image, matching available avatar sizes.\n * @default 48\n */\n size?: ListItemMediaSize;\n /**\n * When unset, it will force `role=\"presentation\"` on the image. Otherwise, the image will use its implicit img role.\n * @default ''\n */\n alt?: string;\n};\n\n/**\n * This component should be used as a last resort, for rare cases when `<ListItem.AvatarView />`\n * or `<ListItem.AvatarLayout />` are insufficient.\n * It's a wrapper around the\n * [Image component](https://storybook.wise.design/?path=/docs/content-image--docs), but offers only\n * a subset of its props, in line with the ListItem's constraints.\n *\n * > **NB**: This component is [not intended for use with illustrations](https://docs.wise.design/foundations/illustration#scale).\n */\nexport const Image = ({ alt = '', size = 48, className, ...props }: ListItemImageProps) => {\n useListItemMedia(size);\n\n return (\n <div\n className={clsx('wds-list-item-media-image-wrapper')}\n style={\n {\n '--wds-list-item-media-size': `${size}px`,\n } as React.CSSProperties\n }\n >\n <ImageComp\n {...props}\n className={clsx(className, 'wds-list-item-media-image')}\n alt={alt}\n role={alt ? undefined : 'presentation'}\n />\n </div>\n );\n};\nImage.displayName = 'ListItem.Image';\n"],"names":["Image","alt","size","className","props","useListItemMedia","_jsx","clsx","style","children","ImageComp","role","undefined","displayName"],"mappings":";;;;;AA2BO,MAAMA,KAAK,GAAGA,CAAC;AAAEC,EAAAA,GAAG,GAAG,EAAE;AAAEC,EAAAA,IAAI,GAAG,EAAE;EAAEC,SAAS;EAAE,GAAGC;AAAK,CAAsB,KAAI;EACxFC,gBAAgB,CAACH,IAAI,CAAC;AAEtB,EAAA,oBACEI,GAAA,CAAA,KAAA,EAAA;AACEH,IAAAA,SAAS,EAAEI,IAAI,CAAC,mCAAmC,CAAE;AACrDC,IAAAA,KAAK,EACH;MACE,4BAA4B,EAAE,GAAGN,IAAI,CAAA,EAAA;KAExC;IAAAO,QAAA,eAEDH,GAAA,CAACI,OAAS,EAAA;AAAA,MAAA,GACJN,KAAK;AACTD,MAAAA,SAAS,EAAEI,IAAI,CAACJ,SAAS,EAAE,2BAA2B,CAAE;AACxDF,MAAAA,GAAG,EAAEA,GAAI;AACTU,MAAAA,IAAI,EAAEV,GAAG,GAAGW,SAAS,GAAG;KAAe;AAE3C,GAAK,CAAC;AAEV;AACAZ,KAAK,CAACa,WAAW,GAAG,gBAAgB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItem.js","sources":["../../src/listItem/ListItem.tsx"],"sourcesContent":["import {\n useContext,\n useId,\n useMemo,\n useState,\n type PropsWithChildren,\n type ReactNode,\n} from 'react';\nimport { Sentiment, Typography } from '../common';\nimport Body from '../body';\nimport { AdditionalInfo } from './AdditionalInfo';\nimport { IconButton, type ListItemIconButtonProps } from './IconButton';\nimport { Checkbox, type ListItemCheckboxProps } from './Checkbox';\nimport { Navigation, type ListItemNavigationProps } from './Navigation';\nimport { clsx } from 'clsx';\nimport { Button, type ListItemButtonProps } from './Button';\nimport { Radio, type ListItemRadioProps } from './Radio';\nimport { Switch, type ListItemSwitchProps } from './Switch';\nimport { AvatarLayout } from './AvatarLayout';\nimport { AvatarView } from './AvatarView';\nimport { Image } from './Image';\nimport { Prompt } from './Prompt';\nimport { PrimitiveAnchor, type PrimitiveAnchorProps } from '../primitives';\nimport {\n ListItemContext,\n type ListItemContextData,\n type ListItemMediaSize,\n} from './ListItemContext';\n\nexport type ListItemTypes =\n | 'non-interactive'\n | 'navigation'\n | 'radio'\n | 'checkbox'\n | 'switch'\n | 'button'\n | 'icon-button';\n\nexport type ListItemControlProps =\n | ListItemNavigationProps\n | ListItemCheckboxProps\n | ListItemButtonProps\n | ListItemIconButtonProps\n | ListItemRadioProps\n | ListItemSwitchProps;\n\nexport type ListItemProps = {\n /** @default 'li' */\n as?: 'li' | 'div';\n /**\n * Swaps vertical hierarchy of title and subtitle and their corresponding right values.\n */\n inverted?: boolean;\n /**\n * Disables the control and renders the ListItem in greyscale and with slightly decreased opacity.\n */\n disabled?: boolean;\n /**\n * If set, it'll extend the `disabled` state, overriding existing or injecting uniquely styled prompt with the message provided via this prop. <br />\n * **NB:** This message cannot house more than **1** link or inline button.<br />\n * **NB:** It must be used together with `disabled` prop and will be disregarded otherwise.\n */\n disabledPromptMessage?: ReactNode;\n /**\n * Highlights the list item as an action to be taken or already taken. <br />\n */\n spotlight?: 'active' | 'inactive';\n title: ReactNode;\n subtitle?: ReactNode;\n /**\n * Requires `<ListItem.AdditionalInfo />` component as a sole child. <br />\n * Can be only rendered if `subtitle` is also provided.\n */\n additionalInfo?: ReactNode;\n valueTitle?: ReactNode;\n valueSubtitle?: ReactNode;\n /**\n * Requires one of the following as a sole child: <br />\n * `<ListItem.AvatarView />`,\n * `<ListItem.AvatarLayout />` or\n * `<ListItem.Image />`\n */\n media?: ReactNode;\n /**\n * Requires one of the following as a sole child: <br/>\n * `<ListItem.Button />`, <br/>\n * `<ListItem.Checkbox />`, <br/>\n * `<ListItem.IconButton />`, <br/>\n * `<ListItem.Navigation />`, <br/>\n * `<ListItem.Radio />`, or\n * `<ListItem.Switch />`\n * @default null\n */\n control?: ReactNode;\n /**\n * Requires `<ListItem.Prompt />` component as a sole child.\n */\n prompt?: ReactNode;\n className?: string;\n /**\n * A number between `0–100` which resolves to a `fr` value of a `grid-template-columns` declaration. E.g. `valueColumnWidth={25}` will result in a `75fr 25fr`. <br />\n * Controls the width ratio of left side content (title and subtitle) to the right side content.\n */\n valueColumnWidth?: number;\n id?: string;\n};\n\n/**\n * @see [Design documentation](https://wise.design/components/list-item)\n * @see [Storybook documentation](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n */\nexport const ListItem = ({\n as: ListItemElement = 'li',\n title,\n subtitle,\n additionalInfo,\n prompt,\n inverted,\n media,\n spotlight,\n valueTitle,\n valueSubtitle,\n control = null,\n disabled,\n disabledPromptMessage,\n className,\n valueColumnWidth,\n id,\n}: ListItemProps) => {\n const idPrefix = useId();\n const [controlProps, setControlProps] = useState<ListItemControlProps>({});\n const [controlType, setControlType] = useState<ListItemTypes>('non-interactive');\n const [mediaSize, setMediaSize] = useState<ListItemMediaSize | undefined>();\n\n const ids: ListItemContextData['ids'] = {\n title: `${idPrefix}_title`,\n ...(subtitle ? { subtitle: `${idPrefix}_subtitle` } : {}),\n ...(valueTitle ? { valueTitle: `${idPrefix}_value-title` } : {}),\n ...(valueSubtitle ? { valueSubtitle: `${idPrefix}_value-subtitle` } : {}),\n control: `${idPrefix}_control`,\n ...(prompt || (disabled && disabledPromptMessage) ? { prompt: `${idPrefix}_prompt` } : {}),\n ...(additionalInfo ? { additionalInfo: `${idPrefix}_additional-info` } : {}),\n };\n\n const isPartiallyInteractive = Boolean(\n (controlType === 'button' || controlType === 'icon-button') &&\n (controlProps as ListItemButtonProps | ListItemIconButtonProps)?.partiallyInteractive,\n );\n const isFullyInteractive = controlType !== 'non-interactive' && !isPartiallyInteractive;\n const isButtonAsLink =\n (controlType === 'button' || controlType === 'icon-button') &&\n Boolean((controlProps as ListItemButtonProps | ListItemIconButtonProps)?.href);\n\n const titlesAndValues = [\n inverted ? ids.subtitle : ids.title,\n inverted ? ids.title : ids.subtitle,\n inverted ? ids.valueSubtitle : ids.valueTitle,\n inverted ? ids.valueTitle : ids.valueSubtitle,\n ].join(' ');\n const additionalInfoPrompt = [ids.additionalInfo, ids.prompt].filter(Boolean).join(' ');\n\n const describedByIds = useMemo(() => {\n return isFullyInteractive && !isButtonAsLink\n ? additionalInfoPrompt\n : `${titlesAndValues} ${additionalInfoPrompt}`;\n }, [additionalInfoPrompt, isButtonAsLink, isFullyInteractive, titlesAndValues]);\n const listItemContext = useMemo(\n () => ({\n setControlType,\n setControlProps,\n setMediaSize,\n ids,\n props: { disabled, inverted, disabledPromptMessage },\n mediaSize,\n isPartiallyInteractive,\n describedByIds,\n }),\n [describedByIds, mediaSize, disabled, inverted, disabledPromptMessage, isPartiallyInteractive],\n );\n const gridColumnsStyle = {\n '--wds-list-item-body-left': valueColumnWidth ? `${100 - valueColumnWidth}fr` : '50fr',\n '--wds-list-item-body-right': valueColumnWidth ? `${valueColumnWidth}fr` : '50fr',\n } as React.CSSProperties;\n\n const getFeatureClassName = () => {\n const partials = [];\n const hasMedia = Boolean(media);\n const hasControl = Boolean(control);\n const hasInfo = Boolean(additionalInfo);\n const hasPrompt = Boolean(prompt) || (disabled && Boolean(disabledPromptMessage));\n\n /* eslint-disable functional/immutable-data */\n if (hasMedia && hasControl) {\n partials.push('wds-list-item-hasMedia-hasControl');\n }\n\n if (hasMedia && !hasControl) {\n partials.push('wds-list-item-hasMedia-noControl');\n }\n\n if (!hasMedia && hasControl) {\n partials.push('wds-list-item-noMedia-hasControl');\n }\n\n if (!hasMedia && !hasControl) {\n partials.push('wds-list-item-noMedia-noControl');\n }\n\n if (hasInfo && hasPrompt) {\n partials.push('wds-list-item-hasInfo-hasPrompt');\n }\n if (hasInfo && !hasPrompt) {\n partials.push('wds-list-item-hasInfo-noPrompt');\n }\n if (!hasInfo && hasPrompt) {\n partials.push('wds-list-item-noInfo-hasPrompt');\n }\n if (!hasInfo && !hasPrompt) {\n partials.push('wds-list-item-noInfo-noPrompt');\n }\n /* eslint-enable functional/immutable-data */\n\n return partials.join(' ');\n };\n\n return (\n <ListItemContext.Provider value={listItemContext}>\n <ListItemElement\n className={clsx(\n 'wds-list-item',\n `wds-list-item-${controlType}`,\n getFeatureClassName(),\n {\n 'wds-list-item-interactive': isFullyInteractive,\n 'wds-list-item-partially-interactive': isPartiallyInteractive,\n [`wds-list-item-spotlight wds-list-item-spotlight-${spotlight}`]:\n isFullyInteractive && !!spotlight,\n disabled: disabled && !isPartiallyInteractive,\n 'disabled--has-prompt-reason':\n !disabledPromptMessage && disabled && !isPartiallyInteractive,\n },\n className,\n )}\n id={id}\n aria-disabled={disabled}\n style={\n {\n '--wds-list-item-value-min-height': mediaSize ? `${mediaSize}px` : undefined,\n } as React.CSSProperties\n }\n >\n {isFullyInteractive && spotlight === 'inactive' && (\n <svg aria-hidden=\"true\" className=\"wds-list-item-spotlight__border\">\n <rect />\n </svg>\n )}\n\n <View\n {...{\n isPartiallyInteractive,\n subtitle,\n additionalInfo,\n disabled,\n disabledPromptMessage,\n prompt,\n controlType,\n controlProps,\n }}\n className={getFeatureClassName()}\n >\n {media && <div className=\"wds-list-item-media\">{media}</div>}\n\n {/* Title + Subtitle + Values - Group */}\n <div\n className=\"wds-list-item-body\"\n style={valueColumnWidth ? gridColumnsStyle : undefined}\n >\n {/* Title + Subtitle + Values - Group */}\n <span className=\"wds-list-item-titles\">\n {(() => {\n const titles = [\n <Body\n key={ids.title}\n id={ids.title}\n type={Typography.BODY_LARGE_BOLD}\n className=\"wds-list-item-title\"\n >\n {title}\n </Body>,\n ];\n if (subtitle) {\n titles.push(\n <Body key={ids.subtitle} id={ids.subtitle} className=\"wds-list-item-subtitle\">\n {subtitle}\n </Body>,\n );\n }\n return inverted ? [...titles].reverse() : titles;\n })()}\n </span>\n\n {(valueTitle || valueSubtitle) && (\n <span\n className={clsx('wds-list-item-value', {\n 'flex-column': valueTitle !== undefined || valueSubtitle !== undefined,\n })}\n >\n {(() => {\n const values = [];\n if (valueTitle) {\n values.push(\n <Body\n key={ids.valueTitle}\n id={ids.valueTitle}\n type={Typography.BODY_LARGE_BOLD}\n className=\"wds-list-item-title-value\"\n >\n {valueTitle}\n </Body>,\n );\n }\n if (valueSubtitle) {\n values.push(\n <Body\n key={ids.valueSubtitle}\n id={ids.valueSubtitle}\n className=\"wds-list-item-subtitle-value\"\n >\n {valueSubtitle}\n </Body>,\n );\n }\n return inverted ? [...values].reverse() : values;\n })()}\n </span>\n )}\n </div>\n\n {control === null ? null : (\n <Body\n className={clsx('wds-list-item-control-wrapper', {\n 'wds-list-item-button-control': controlType === 'button',\n 'wds-list-item-button-control--hasPrompt':\n controlType === 'button' && Boolean(prompt),\n })}\n style={\n {\n '--wds-list-item-control-wrapper-height': mediaSize ? `${mediaSize}px` : 'auto',\n } as React.CSSProperties\n }\n >\n {control}\n </Body>\n )}\n </View>\n </ListItemElement>\n </ListItemContext.Provider>\n );\n};\n\ntype ViewProps = PropsWithChildren<{\n isPartiallyInteractive: boolean;\n controlType?: ListItemTypes;\n controlProps?: ListItemControlProps;\n}> &\n Pick<\n ListItemProps,\n 'subtitle' | 'additionalInfo' | 'prompt' | 'disabled' | 'disabledPromptMessage' | 'className'\n >;\n\nfunction View({\n children,\n additionalInfo,\n prompt,\n disabled,\n disabledPromptMessage,\n isPartiallyInteractive,\n controlType = 'non-interactive',\n controlProps,\n className = '',\n}: ViewProps) {\n const { ids, describedByIds } = useContext<ListItemContextData>(ListItemContext);\n const isLinkControl = ['navigation'].includes(controlType);\n\n const isHrefProvided = isLinkControl && !!(controlProps as ListItemNavigationProps)?.href;\n\n const renderExtras = () => {\n const resolvedPrompt =\n disabled && disabledPromptMessage && !prompt ? (\n <Prompt sentiment={Sentiment.NEUTRAL}>{disabledPromptMessage}</Prompt>\n ) : (\n prompt\n );\n\n return (\n <>\n {additionalInfo}\n {resolvedPrompt}\n </>\n );\n };\n\n if (isLinkControl && isHrefProvided) {\n return (\n // for link instances of .Navigation, .IconButton, .Button\n <div className={clsx('wds-list-item-gridWrapper', className)}>\n <PrimitiveAnchor\n aria-describedby={describedByIds}\n href={(controlProps as ListItemNavigationProps)?.href}\n target={(controlProps as ListItemNavigationProps)?.target}\n className={clsx('wds-list-item-view', {\n 'wds-list-item-control': controlType === 'navigation',\n fullyInteractive: !isPartiallyInteractive,\n })}\n disabled={disabled}\n onClick={(controlProps as PrimitiveAnchorProps | undefined)?.onClick}\n >\n {children}\n </PrimitiveAnchor>\n\n {renderExtras()}\n </div>\n );\n }\n\n if (isPartiallyInteractive || controlType === 'non-interactive') {\n return (\n <div className={clsx('wds-list-item-gridWrapper', className)}>\n <div className=\"wds-list-item-view\">{children}</div>\n\n {renderExtras()}\n </div>\n );\n }\n\n // for form control instances of .Radio, .Checkbox, .Switch, .Button, .Navigation etc\n // Radio cannot be wrapped in a <fieldset> element to announce it as a group.\n const InputWrapper = controlType === 'radio' ? 'div' : 'fieldset';\n return (\n <InputWrapper className={clsx('wds-list-item-gridWrapper', className)}>\n <label\n htmlFor={ids.control}\n className={clsx('wds-list-item-view', {\n clickable: !disabled,\n fullyInteractive: !isPartiallyInteractive,\n })}\n >\n {children}\n </label>\n\n {renderExtras()}\n </InputWrapper>\n );\n}\n\nListItem.Image = Image;\nListItem.AvatarView = AvatarView;\nListItem.AvatarLayout = AvatarLayout;\nListItem.AdditionalInfo = AdditionalInfo;\nListItem.Checkbox = Checkbox;\nListItem.Radio = Radio;\nListItem.IconButton = IconButton;\nListItem.Navigation = Navigation;\nListItem.Button = Button;\nListItem.Switch = Switch;\nListItem.Prompt = Prompt;\n\nexport default ListItem;\n"],"names":["ListItem","as","ListItemElement","title","subtitle","additionalInfo","prompt","inverted","media","spotlight","valueTitle","valueSubtitle","control","disabled","disabledPromptMessage","className","valueColumnWidth","id","idPrefix","useId","controlProps","setControlProps","useState","controlType","setControlType","mediaSize","setMediaSize","ids","isPartiallyInteractive","Boolean","partiallyInteractive","isFullyInteractive","isButtonAsLink","href","titlesAndValues","join","additionalInfoPrompt","filter","describedByIds","useMemo","listItemContext","props","gridColumnsStyle","getFeatureClassName","partials","hasMedia","hasControl","hasInfo","hasPrompt","push","_jsx","ListItemContext","Provider","value","children","_jsxs","clsx","style","undefined","View","titles","Body","type","Typography","BODY_LARGE_BOLD","reverse","values","useContext","isLinkControl","includes","isHrefProvided","renderExtras","resolvedPrompt","Prompt","sentiment","Sentiment","NEUTRAL","_Fragment","PrimitiveAnchor","target","fullyInteractive","onClick","InputWrapper","htmlFor","clickable","Image","AvatarView","AvatarLayout","AdditionalInfo","Checkbox","Radio","IconButton","Navigation","Button","Switch"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ListItem.js","sources":["../../src/listItem/ListItem.tsx"],"sourcesContent":["import {\n useContext,\n useId,\n useMemo,\n useState,\n type PropsWithChildren,\n type ReactNode,\n} from 'react';\nimport { Sentiment, Typography } from '../common';\nimport Body from '../body';\nimport { AdditionalInfo } from './AdditionalInfo';\nimport { IconButton, type ListItemIconButtonProps } from './IconButton';\nimport { Checkbox, type ListItemCheckboxProps } from './Checkbox';\nimport { Navigation, type ListItemNavigationProps } from './Navigation';\nimport { clsx } from 'clsx';\nimport { Button, type ListItemButtonProps } from './Button';\nimport { Radio, type ListItemRadioProps } from './Radio';\nimport { Switch, type ListItemSwitchProps } from './Switch';\nimport { AvatarLayout } from './AvatarLayout';\nimport { AvatarView } from './AvatarView';\nimport { Image } from './Image';\nimport { Prompt } from './Prompt';\nimport { PrimitiveAnchor, type PrimitiveAnchorProps } from '../primitives';\nimport {\n ListItemContext,\n type ListItemContextData,\n type ListItemMediaSize,\n} from './ListItemContext';\n\nexport type ListItemTypes =\n | 'non-interactive'\n | 'navigation'\n | 'radio'\n | 'checkbox'\n | 'switch'\n | 'button'\n | 'icon-button';\n\nexport type ListItemControlProps =\n | ListItemNavigationProps\n | ListItemCheckboxProps\n | ListItemButtonProps\n | ListItemIconButtonProps\n | ListItemRadioProps\n | ListItemSwitchProps;\n\nexport type ListItemProps = {\n /** @default 'li' */\n as?: 'li' | 'div';\n /**\n * Swaps vertical hierarchy of title and subtitle and their corresponding right values.\n */\n inverted?: boolean;\n /**\n * Disables the control and renders the ListItem in greyscale and with slightly decreased opacity.\n */\n disabled?: boolean;\n /**\n * If set, it'll extend the `disabled` state, overriding existing or injecting uniquely styled prompt with the message provided via this prop. <br />\n * **NB:** This message cannot house more than **1** link or inline button.<br />\n * **NB:** It must be used together with `disabled` prop and will be disregarded otherwise.\n */\n disabledPromptMessage?: ReactNode;\n /**\n * Highlights the list item as an action to be taken or already taken. <br />\n */\n spotlight?: 'active' | 'inactive';\n title: ReactNode;\n subtitle?: ReactNode;\n /**\n * Requires `<ListItem.AdditionalInfo />` component as a sole child. <br />\n * Can be only rendered if `subtitle` is also provided.\n */\n additionalInfo?: ReactNode;\n valueTitle?: ReactNode;\n valueSubtitle?: ReactNode;\n /**\n * Requires one of the following as a sole child: <br />\n * `<ListItem.AvatarView />`,\n * `<ListItem.AvatarLayout />` or\n * `<ListItem.Image />`\n */\n media?: ReactNode;\n /**\n * Requires one of the following as a sole child: <br/>\n * `<ListItem.Button />`, <br/>\n * `<ListItem.Checkbox />`, <br/>\n * `<ListItem.IconButton />`, <br/>\n * `<ListItem.Navigation />`, <br/>\n * `<ListItem.Radio />`, or\n * `<ListItem.Switch />`\n * @default null\n */\n control?: ReactNode;\n /**\n * Requires `<ListItem.Prompt />` component as a sole child.\n */\n prompt?: ReactNode;\n className?: string;\n /**\n * A number between `0–100` which resolves to a `fr` value of a `grid-template-columns` declaration. E.g. `valueColumnWidth={25}` will result in a `75fr 25fr`. <br />\n * Controls the width ratio of left side content (title and subtitle) to the right side content.\n */\n valueColumnWidth?: number;\n id?: string;\n};\n\n/**\n * @see [Design documentation](https://docs.wise.design/components/list-item)\n * @see [Storybook documentation](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n */\nexport const ListItem = ({\n as: ListItemElement = 'li',\n title,\n subtitle,\n additionalInfo,\n prompt,\n inverted,\n media,\n spotlight,\n valueTitle,\n valueSubtitle,\n control = null,\n disabled,\n disabledPromptMessage,\n className,\n valueColumnWidth,\n id,\n}: ListItemProps) => {\n const idPrefix = useId();\n const [controlProps, setControlProps] = useState<ListItemControlProps>({});\n const [controlType, setControlType] = useState<ListItemTypes>('non-interactive');\n const [mediaSize, setMediaSize] = useState<ListItemMediaSize | undefined>();\n\n const ids: ListItemContextData['ids'] = {\n title: `${idPrefix}_title`,\n ...(subtitle ? { subtitle: `${idPrefix}_subtitle` } : {}),\n ...(valueTitle ? { valueTitle: `${idPrefix}_value-title` } : {}),\n ...(valueSubtitle ? { valueSubtitle: `${idPrefix}_value-subtitle` } : {}),\n control: `${idPrefix}_control`,\n ...(prompt || (disabled && disabledPromptMessage) ? { prompt: `${idPrefix}_prompt` } : {}),\n ...(additionalInfo ? { additionalInfo: `${idPrefix}_additional-info` } : {}),\n };\n\n const isPartiallyInteractive = Boolean(\n (controlType === 'button' || controlType === 'icon-button') &&\n (controlProps as ListItemButtonProps | ListItemIconButtonProps)?.partiallyInteractive,\n );\n const isFullyInteractive = controlType !== 'non-interactive' && !isPartiallyInteractive;\n const isButtonAsLink =\n (controlType === 'button' || controlType === 'icon-button') &&\n Boolean((controlProps as ListItemButtonProps | ListItemIconButtonProps)?.href);\n\n const titlesAndValues = [\n inverted ? ids.subtitle : ids.title,\n inverted ? ids.title : ids.subtitle,\n inverted ? ids.valueSubtitle : ids.valueTitle,\n inverted ? ids.valueTitle : ids.valueSubtitle,\n ].join(' ');\n const additionalInfoPrompt = [ids.additionalInfo, ids.prompt].filter(Boolean).join(' ');\n\n const describedByIds = useMemo(() => {\n return isFullyInteractive && !isButtonAsLink\n ? additionalInfoPrompt\n : `${titlesAndValues} ${additionalInfoPrompt}`;\n }, [additionalInfoPrompt, isButtonAsLink, isFullyInteractive, titlesAndValues]);\n const listItemContext = useMemo(\n () => ({\n setControlType,\n setControlProps,\n setMediaSize,\n ids,\n props: { disabled, inverted, disabledPromptMessage },\n mediaSize,\n isPartiallyInteractive,\n describedByIds,\n }),\n [describedByIds, mediaSize, disabled, inverted, disabledPromptMessage, isPartiallyInteractive],\n );\n const gridColumnsStyle = {\n '--wds-list-item-body-left': valueColumnWidth ? `${100 - valueColumnWidth}fr` : '50fr',\n '--wds-list-item-body-right': valueColumnWidth ? `${valueColumnWidth}fr` : '50fr',\n } as React.CSSProperties;\n\n const getFeatureClassName = () => {\n const partials = [];\n const hasMedia = Boolean(media);\n const hasControl = Boolean(control);\n const hasInfo = Boolean(additionalInfo);\n const hasPrompt = Boolean(prompt) || (disabled && Boolean(disabledPromptMessage));\n\n /* eslint-disable functional/immutable-data */\n if (hasMedia && hasControl) {\n partials.push('wds-list-item-hasMedia-hasControl');\n }\n\n if (hasMedia && !hasControl) {\n partials.push('wds-list-item-hasMedia-noControl');\n }\n\n if (!hasMedia && hasControl) {\n partials.push('wds-list-item-noMedia-hasControl');\n }\n\n if (!hasMedia && !hasControl) {\n partials.push('wds-list-item-noMedia-noControl');\n }\n\n if (hasInfo && hasPrompt) {\n partials.push('wds-list-item-hasInfo-hasPrompt');\n }\n if (hasInfo && !hasPrompt) {\n partials.push('wds-list-item-hasInfo-noPrompt');\n }\n if (!hasInfo && hasPrompt) {\n partials.push('wds-list-item-noInfo-hasPrompt');\n }\n if (!hasInfo && !hasPrompt) {\n partials.push('wds-list-item-noInfo-noPrompt');\n }\n /* eslint-enable functional/immutable-data */\n\n return partials.join(' ');\n };\n\n return (\n <ListItemContext.Provider value={listItemContext}>\n <ListItemElement\n className={clsx(\n 'wds-list-item',\n `wds-list-item-${controlType}`,\n getFeatureClassName(),\n {\n 'wds-list-item-interactive': isFullyInteractive,\n 'wds-list-item-partially-interactive': isPartiallyInteractive,\n [`wds-list-item-spotlight wds-list-item-spotlight-${spotlight}`]:\n isFullyInteractive && !!spotlight,\n disabled: disabled && !isPartiallyInteractive,\n 'disabled--has-prompt-reason':\n !disabledPromptMessage && disabled && !isPartiallyInteractive,\n },\n className,\n )}\n id={id}\n aria-disabled={disabled}\n style={\n {\n '--wds-list-item-value-min-height': mediaSize ? `${mediaSize}px` : undefined,\n } as React.CSSProperties\n }\n >\n {isFullyInteractive && spotlight === 'inactive' && (\n <svg aria-hidden=\"true\" className=\"wds-list-item-spotlight__border\">\n <rect />\n </svg>\n )}\n\n <View\n {...{\n isPartiallyInteractive,\n subtitle,\n additionalInfo,\n disabled,\n disabledPromptMessage,\n prompt,\n controlType,\n controlProps,\n }}\n className={getFeatureClassName()}\n >\n {media && <div className=\"wds-list-item-media\">{media}</div>}\n\n {/* Title + Subtitle + Values - Group */}\n <div\n className=\"wds-list-item-body\"\n style={valueColumnWidth ? gridColumnsStyle : undefined}\n >\n {/* Title + Subtitle + Values - Group */}\n <span className=\"wds-list-item-titles\">\n {(() => {\n const titles = [\n <Body\n key={ids.title}\n id={ids.title}\n type={Typography.BODY_LARGE_BOLD}\n className=\"wds-list-item-title\"\n >\n {title}\n </Body>,\n ];\n if (subtitle) {\n titles.push(\n <Body key={ids.subtitle} id={ids.subtitle} className=\"wds-list-item-subtitle\">\n {subtitle}\n </Body>,\n );\n }\n return inverted ? [...titles].reverse() : titles;\n })()}\n </span>\n\n {(valueTitle || valueSubtitle) && (\n <span\n className={clsx('wds-list-item-value', {\n 'flex-column': valueTitle !== undefined || valueSubtitle !== undefined,\n })}\n >\n {(() => {\n const values = [];\n if (valueTitle) {\n values.push(\n <Body\n key={ids.valueTitle}\n id={ids.valueTitle}\n type={Typography.BODY_LARGE_BOLD}\n className=\"wds-list-item-title-value\"\n >\n {valueTitle}\n </Body>,\n );\n }\n if (valueSubtitle) {\n values.push(\n <Body\n key={ids.valueSubtitle}\n id={ids.valueSubtitle}\n className=\"wds-list-item-subtitle-value\"\n >\n {valueSubtitle}\n </Body>,\n );\n }\n return inverted ? [...values].reverse() : values;\n })()}\n </span>\n )}\n </div>\n\n {control === null ? null : (\n <Body\n className={clsx('wds-list-item-control-wrapper', {\n 'wds-list-item-button-control': controlType === 'button',\n 'wds-list-item-button-control--hasPrompt':\n controlType === 'button' && Boolean(prompt),\n })}\n style={\n {\n '--wds-list-item-control-wrapper-height': mediaSize ? `${mediaSize}px` : 'auto',\n } as React.CSSProperties\n }\n >\n {control}\n </Body>\n )}\n </View>\n </ListItemElement>\n </ListItemContext.Provider>\n );\n};\n\ntype ViewProps = PropsWithChildren<{\n isPartiallyInteractive: boolean;\n controlType?: ListItemTypes;\n controlProps?: ListItemControlProps;\n}> &\n Pick<\n ListItemProps,\n 'subtitle' | 'additionalInfo' | 'prompt' | 'disabled' | 'disabledPromptMessage' | 'className'\n >;\n\nfunction View({\n children,\n additionalInfo,\n prompt,\n disabled,\n disabledPromptMessage,\n isPartiallyInteractive,\n controlType = 'non-interactive',\n controlProps,\n className = '',\n}: ViewProps) {\n const { ids, describedByIds } = useContext<ListItemContextData>(ListItemContext);\n const isLinkControl = ['navigation'].includes(controlType);\n\n const isHrefProvided = isLinkControl && !!(controlProps as ListItemNavigationProps)?.href;\n\n const renderExtras = () => {\n const resolvedPrompt =\n disabled && disabledPromptMessage && !prompt ? (\n <Prompt sentiment={Sentiment.NEUTRAL}>{disabledPromptMessage}</Prompt>\n ) : (\n prompt\n );\n\n return (\n <>\n {additionalInfo}\n {resolvedPrompt}\n </>\n );\n };\n\n if (isLinkControl && isHrefProvided) {\n return (\n // for link instances of .Navigation, .IconButton, .Button\n <div className={clsx('wds-list-item-gridWrapper', className)}>\n <PrimitiveAnchor\n aria-describedby={describedByIds}\n href={(controlProps as ListItemNavigationProps)?.href}\n target={(controlProps as ListItemNavigationProps)?.target}\n className={clsx('wds-list-item-view', {\n 'wds-list-item-control': controlType === 'navigation',\n fullyInteractive: !isPartiallyInteractive,\n })}\n disabled={disabled}\n onClick={(controlProps as PrimitiveAnchorProps | undefined)?.onClick}\n >\n {children}\n </PrimitiveAnchor>\n\n {renderExtras()}\n </div>\n );\n }\n\n if (isPartiallyInteractive || controlType === 'non-interactive') {\n return (\n <div className={clsx('wds-list-item-gridWrapper', className)}>\n <div className=\"wds-list-item-view\">{children}</div>\n\n {renderExtras()}\n </div>\n );\n }\n\n // for form control instances of .Radio, .Checkbox, .Switch, .Button, .Navigation etc\n // Radio cannot be wrapped in a <fieldset> element to announce it as a group.\n const InputWrapper = controlType === 'radio' ? 'div' : 'fieldset';\n return (\n <InputWrapper className={clsx('wds-list-item-gridWrapper', className)}>\n <label\n htmlFor={ids.control}\n className={clsx('wds-list-item-view', {\n clickable: !disabled,\n fullyInteractive: !isPartiallyInteractive,\n })}\n >\n {children}\n </label>\n\n {renderExtras()}\n </InputWrapper>\n );\n}\n\nListItem.Image = Image;\nListItem.AvatarView = AvatarView;\nListItem.AvatarLayout = AvatarLayout;\nListItem.AdditionalInfo = AdditionalInfo;\nListItem.Checkbox = Checkbox;\nListItem.Radio = Radio;\nListItem.IconButton = IconButton;\nListItem.Navigation = Navigation;\nListItem.Button = Button;\nListItem.Switch = Switch;\nListItem.Prompt = Prompt;\n\nexport default ListItem;\n"],"names":["ListItem","as","ListItemElement","title","subtitle","additionalInfo","prompt","inverted","media","spotlight","valueTitle","valueSubtitle","control","disabled","disabledPromptMessage","className","valueColumnWidth","id","idPrefix","useId","controlProps","setControlProps","useState","controlType","setControlType","mediaSize","setMediaSize","ids","isPartiallyInteractive","Boolean","partiallyInteractive","isFullyInteractive","isButtonAsLink","href","titlesAndValues","join","additionalInfoPrompt","filter","describedByIds","useMemo","listItemContext","props","gridColumnsStyle","getFeatureClassName","partials","hasMedia","hasControl","hasInfo","hasPrompt","push","_jsx","ListItemContext","Provider","value","children","_jsxs","clsx","style","undefined","View","titles","Body","type","Typography","BODY_LARGE_BOLD","reverse","values","useContext","isLinkControl","includes","isHrefProvided","renderExtras","resolvedPrompt","Prompt","sentiment","Sentiment","NEUTRAL","_Fragment","PrimitiveAnchor","target","fullyInteractive","onClick","InputWrapper","htmlFor","clickable","Image","AvatarView","AvatarLayout","AdditionalInfo","Checkbox","Radio","IconButton","Navigation","Button","Switch"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+GO,MAAMA,QAAQ,GAAGA,CAAC;EACvBC,EAAE,EAAEC,eAAe,GAAG,IAAI;EAC1BC,KAAK;EACLC,QAAQ;EACRC,cAAc;EACdC,MAAM;EACNC,QAAQ;EACRC,KAAK;EACLC,SAAS;EACTC,UAAU;EACVC,aAAa;AACbC,EAAAA,OAAO,GAAG,IAAI;EACdC,QAAQ;EACRC,qBAAqB;EACrBC,SAAS;EACTC,gBAAgB;AAChBC,EAAAA;AAAE,CACY,KAAI;AAClB,EAAA,MAAMC,QAAQ,GAAGC,WAAK,EAAE;EACxB,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGC,cAAQ,CAAuB,EAAE,CAAC;EAC1E,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGF,cAAQ,CAAgB,iBAAiB,CAAC;EAChF,MAAM,CAACG,SAAS,EAAEC,YAAY,CAAC,GAAGJ,cAAQ,EAAiC;AAE3E,EAAA,MAAMK,GAAG,GAA+B;IACtCxB,KAAK,EAAE,CAAA,EAAGe,QAAQ,CAAA,MAAA,CAAQ;AAC1B,IAAA,IAAId,QAAQ,GAAG;MAAEA,QAAQ,EAAE,GAAGc,QAAQ,CAAA,SAAA;KAAa,GAAG,EAAE,CAAC;AACzD,IAAA,IAAIR,UAAU,GAAG;MAAEA,UAAU,EAAE,GAAGQ,QAAQ,CAAA,YAAA;KAAgB,GAAG,EAAE,CAAC;AAChE,IAAA,IAAIP,aAAa,GAAG;MAAEA,aAAa,EAAE,GAAGO,QAAQ,CAAA,eAAA;KAAmB,GAAG,EAAE,CAAC;IACzEN,OAAO,EAAE,CAAA,EAAGM,QAAQ,CAAA,QAAA,CAAU;AAC9B,IAAA,IAAIZ,MAAM,IAAKO,QAAQ,IAAIC,qBAAsB,GAAG;MAAER,MAAM,EAAE,GAAGY,QAAQ,CAAA,OAAA;KAAW,GAAG,EAAE,CAAC;AAC1F,IAAA,IAAIb,cAAc,GAAG;MAAEA,cAAc,EAAE,GAAGa,QAAQ,CAAA,gBAAA;KAAoB,GAAG,EAAE;GAC5E;AAED,EAAA,MAAMU,sBAAsB,GAAGC,OAAO,CACpC,CAACN,WAAW,KAAK,QAAQ,IAAIA,WAAW,KAAK,aAAa,KACzDH,YAA8D,EAAEU,oBAAoB,CACtF;AACD,EAAA,MAAMC,kBAAkB,GAAGR,WAAW,KAAK,iBAAiB,IAAI,CAACK,sBAAsB;AACvF,EAAA,MAAMI,cAAc,GAClB,CAACT,WAAW,KAAK,QAAQ,IAAIA,WAAW,KAAK,aAAa,KAC1DM,OAAO,CAAET,YAA8D,EAAEa,IAAI,CAAC;EAEhF,MAAMC,eAAe,GAAG,CACtB3B,QAAQ,GAAGoB,GAAG,CAACvB,QAAQ,GAAGuB,GAAG,CAACxB,KAAK,EACnCI,QAAQ,GAAGoB,GAAG,CAACxB,KAAK,GAAGwB,GAAG,CAACvB,QAAQ,EACnCG,QAAQ,GAAGoB,GAAG,CAAChB,aAAa,GAAGgB,GAAG,CAACjB,UAAU,EAC7CH,QAAQ,GAAGoB,GAAG,CAACjB,UAAU,GAAGiB,GAAG,CAAChB,aAAa,CAC9C,CAACwB,IAAI,CAAC,GAAG,CAAC;EACX,MAAMC,oBAAoB,GAAG,CAACT,GAAG,CAACtB,cAAc,EAAEsB,GAAG,CAACrB,MAAM,CAAC,CAAC+B,MAAM,CAACR,OAAO,CAAC,CAACM,IAAI,CAAC,GAAG,CAAC;AAEvF,EAAA,MAAMG,cAAc,GAAGC,aAAO,CAAC,MAAK;IAClC,OAAOR,kBAAkB,IAAI,CAACC,cAAc,GACxCI,oBAAoB,GACpB,CAAA,EAAGF,eAAe,CAAA,CAAA,EAAIE,oBAAoB,CAAA,CAAE;EAClD,CAAC,EAAE,CAACA,oBAAoB,EAAEJ,cAAc,EAAED,kBAAkB,EAAEG,eAAe,CAAC,CAAC;AAC/E,EAAA,MAAMM,eAAe,GAAGD,aAAO,CAC7B,OAAO;IACLf,cAAc;IACdH,eAAe;IACfK,YAAY;IACZC,GAAG;AACHc,IAAAA,KAAK,EAAE;MAAE5B,QAAQ;MAAEN,QAAQ;AAAEO,MAAAA;KAAuB;IACpDW,SAAS;IACTG,sBAAsB;AACtBU,IAAAA;AACD,GAAA,CAAC,EACF,CAACA,cAAc,EAAEb,SAAS,EAAEZ,QAAQ,EAAEN,QAAQ,EAAEO,qBAAqB,EAAEc,sBAAsB,CAAC,CAC/F;AACD,EAAA,MAAMc,gBAAgB,GAAG;IACvB,2BAA2B,EAAE1B,gBAAgB,GAAG,CAAA,EAAG,GAAG,GAAGA,gBAAgB,CAAA,EAAA,CAAI,GAAG,MAAM;AACtF,IAAA,4BAA4B,EAAEA,gBAAgB,GAAG,CAAA,EAAGA,gBAAgB,IAAI,GAAG;GACrD;EAExB,MAAM2B,mBAAmB,GAAGA,MAAK;IAC/B,MAAMC,QAAQ,GAAG,EAAE;AACnB,IAAA,MAAMC,QAAQ,GAAGhB,OAAO,CAACrB,KAAK,CAAC;AAC/B,IAAA,MAAMsC,UAAU,GAAGjB,OAAO,CAACjB,OAAO,CAAC;AACnC,IAAA,MAAMmC,OAAO,GAAGlB,OAAO,CAACxB,cAAc,CAAC;AACvC,IAAA,MAAM2C,SAAS,GAAGnB,OAAO,CAACvB,MAAM,CAAC,IAAKO,QAAQ,IAAIgB,OAAO,CAACf,qBAAqB,CAAE;AAEjF;IACA,IAAI+B,QAAQ,IAAIC,UAAU,EAAE;AAC1BF,MAAAA,QAAQ,CAACK,IAAI,CAAC,mCAAmC,CAAC;AACpD,IAAA;AAEA,IAAA,IAAIJ,QAAQ,IAAI,CAACC,UAAU,EAAE;AAC3BF,MAAAA,QAAQ,CAACK,IAAI,CAAC,kCAAkC,CAAC;AACnD,IAAA;AAEA,IAAA,IAAI,CAACJ,QAAQ,IAAIC,UAAU,EAAE;AAC3BF,MAAAA,QAAQ,CAACK,IAAI,CAAC,kCAAkC,CAAC;AACnD,IAAA;AAEA,IAAA,IAAI,CAACJ,QAAQ,IAAI,CAACC,UAAU,EAAE;AAC5BF,MAAAA,QAAQ,CAACK,IAAI,CAAC,iCAAiC,CAAC;AAClD,IAAA;IAEA,IAAIF,OAAO,IAAIC,SAAS,EAAE;AACxBJ,MAAAA,QAAQ,CAACK,IAAI,CAAC,iCAAiC,CAAC;AAClD,IAAA;AACA,IAAA,IAAIF,OAAO,IAAI,CAACC,SAAS,EAAE;AACzBJ,MAAAA,QAAQ,CAACK,IAAI,CAAC,gCAAgC,CAAC;AACjD,IAAA;AACA,IAAA,IAAI,CAACF,OAAO,IAAIC,SAAS,EAAE;AACzBJ,MAAAA,QAAQ,CAACK,IAAI,CAAC,gCAAgC,CAAC;AACjD,IAAA;AACA,IAAA,IAAI,CAACF,OAAO,IAAI,CAACC,SAAS,EAAE;AAC1BJ,MAAAA,QAAQ,CAACK,IAAI,CAAC,+BAA+B,CAAC;AAChD,IAAA;AACA;AAEA,IAAA,OAAOL,QAAQ,CAACT,IAAI,CAAC,GAAG,CAAC;EAC3B,CAAC;AAED,EAAA,oBACEe,cAAA,CAACC,+BAAe,CAACC,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAEb,eAAgB;IAAAc,QAAA,eAC/CC,eAAA,CAACrD,eAAe,EAAA;AACda,MAAAA,SAAS,EAAEyC,SAAI,CACb,eAAe,EACf,CAAA,cAAA,EAAiBjC,WAAW,CAAA,CAAE,EAC9BoB,mBAAmB,EAAE,EACrB;AACE,QAAA,2BAA2B,EAAEZ,kBAAkB;AAC/C,QAAA,qCAAqC,EAAEH,sBAAsB;QAC7D,CAAC,CAAA,gDAAA,EAAmDnB,SAAS,CAAA,CAAE,GAC7DsB,kBAAkB,IAAI,CAAC,CAACtB,SAAS;AACnCI,QAAAA,QAAQ,EAAEA,QAAQ,IAAI,CAACe,sBAAsB;AAC7C,QAAA,6BAA6B,EAC3B,CAACd,qBAAqB,IAAID,QAAQ,IAAI,CAACe;OAC1C,EACDb,SAAS,CACT;AACFE,MAAAA,EAAE,EAAEA,EAAG;AACP,MAAA,eAAA,EAAeJ,QAAS;AACxB4C,MAAAA,KAAK,EACH;AACE,QAAA,kCAAkC,EAAEhC,SAAS,GAAG,CAAA,EAAGA,SAAS,IAAI,GAAGiC;OAEtE;AAAAJ,MAAAA,QAAA,GAEAvB,kBAAkB,IAAItB,SAAS,KAAK,UAAU,iBAC7CyC,cAAA,CAAA,KAAA,EAAA;AAAK,QAAA,aAAA,EAAY,MAAM;AAACnC,QAAAA,SAAS,EAAC,iCAAiC;QAAAuC,QAAA,eACjEJ,cAAA,CAAA,MAAA,EAAA,EAAK;AACP,OAAK,CACN,eAEDK,eAAA,CAACI,IAAI,EAAA;QAED/B,sBAAsB;QACtBxB,QAAQ;QACRC,cAAc;QACdQ,QAAQ;QACRC,qBAAqB;QACrBR,MAAM;QACNiB,WAAW;QACXH,YAAY;QAEdL,SAAS,EAAE4B,mBAAmB,EAAG;QAAAW,QAAA,EAAA,CAEhC9C,KAAK,iBAAI0C,cAAA,CAAA,KAAA,EAAA;AAAKnC,UAAAA,SAAS,EAAC,qBAAqB;AAAAuC,UAAAA,QAAA,EAAE9C;SAAW,CAAC,eAG5D+C,eAAA,CAAA,KAAA,EAAA;AACExC,UAAAA,SAAS,EAAC,oBAAoB;AAC9B0C,UAAAA,KAAK,EAAEzC,gBAAgB,GAAG0B,gBAAgB,GAAGgB,SAAU;AAAAJ,UAAAA,QAAA,gBAGvDJ,cAAA,CAAA,MAAA,EAAA;AAAMnC,YAAAA,SAAS,EAAC,sBAAsB;YAAAuC,QAAA,EACnC,CAAC,MAAK;AACL,cAAA,MAAMM,MAAM,GAAG,cACbV,cAAA,CAACW,YAAI,EAAA;gBAEH5C,EAAE,EAAEU,GAAG,CAACxB,KAAM;gBACd2D,IAAI,EAAEC,qBAAU,CAACC,eAAgB;AACjCjD,gBAAAA,SAAS,EAAC,qBAAqB;AAAAuC,gBAAAA,QAAA,EAE9BnD;AAAK,eAAA,EALDwB,GAAG,CAACxB,KAML,CAAC,CACR;AACD,cAAA,IAAIC,QAAQ,EAAE;AACZwD,gBAAAA,MAAM,CAACX,IAAI,cACTC,cAAA,CAACW,YAAI,EAAA;kBAAoB5C,EAAE,EAAEU,GAAG,CAACvB,QAAS;AAACW,kBAAAA,SAAS,EAAC,wBAAwB;AAAAuC,kBAAAA,QAAA,EAC1ElD;AAAQ,iBAAA,EADAuB,GAAG,CAACvB,QAET,CAAC,CACR;AACH,cAAA;cACA,OAAOG,QAAQ,GAAG,CAAC,GAAGqD,MAAM,CAAC,CAACK,OAAO,EAAE,GAAGL,MAAM;AAClD,YAAA,CAAC;AAAG,WACA,CAEN,EAAC,CAAClD,UAAU,IAAIC,aAAa,kBAC3BuC,cAAA,CAAA,MAAA,EAAA;AACEnC,YAAAA,SAAS,EAAEyC,SAAI,CAAC,qBAAqB,EAAE;AACrC,cAAA,aAAa,EAAE9C,UAAU,KAAKgD,SAAS,IAAI/C,aAAa,KAAK+C;AAC9D,aAAA,CAAE;YAAAJ,QAAA,EAEF,CAAC,MAAK;cACL,MAAMY,MAAM,GAAG,EAAE;AACjB,cAAA,IAAIxD,UAAU,EAAE;AACdwD,gBAAAA,MAAM,CAACjB,IAAI,cACTC,cAAA,CAACW,YAAI,EAAA;kBAEH5C,EAAE,EAAEU,GAAG,CAACjB,UAAW;kBACnBoD,IAAI,EAAEC,qBAAU,CAACC,eAAgB;AACjCjD,kBAAAA,SAAS,EAAC,2BAA2B;AAAAuC,kBAAAA,QAAA,EAEpC5C;AAAU,iBAAA,EALNiB,GAAG,CAACjB,UAML,CAAC,CACR;AACH,cAAA;AACA,cAAA,IAAIC,aAAa,EAAE;AACjBuD,gBAAAA,MAAM,CAACjB,IAAI,cACTC,cAAA,CAACW,YAAI,EAAA;kBAEH5C,EAAE,EAAEU,GAAG,CAAChB,aAAc;AACtBI,kBAAAA,SAAS,EAAC,8BAA8B;AAAAuC,kBAAAA,QAAA,EAEvC3C;AAAa,iBAAA,EAJTgB,GAAG,CAAChB,aAKL,CAAC,CACR;AACH,cAAA;cACA,OAAOJ,QAAQ,GAAG,CAAC,GAAG2D,MAAM,CAAC,CAACD,OAAO,EAAE,GAAGC,MAAM;AAClD,YAAA,CAAC;AAAG,WACA,CACP;SACE,CAEL,EAACtD,OAAO,KAAK,IAAI,GAAG,IAAI,gBACtBsC,cAAA,CAACW,YAAI,EAAA;AACH9C,UAAAA,SAAS,EAAEyC,SAAI,CAAC,+BAA+B,EAAE;YAC/C,8BAA8B,EAAEjC,WAAW,KAAK,QAAQ;AACxD,YAAA,yCAAyC,EACvCA,WAAW,KAAK,QAAQ,IAAIM,OAAO,CAACvB,MAAM;AAC7C,WAAA,CAAE;AACHmD,UAAAA,KAAK,EACH;AACE,YAAA,wCAAwC,EAAEhC,SAAS,GAAG,CAAA,EAAGA,SAAS,IAAI,GAAG;WAE5E;AAAA6B,UAAAA,QAAA,EAEA1C;AAAO,SACJ,CACP;AAAA,OACG,CACR;KAAiB;AACnB,GAA0B,CAAC;AAE/B;AAYA,SAAS+C,IAAIA,CAAC;EACZL,QAAQ;EACRjD,cAAc;EACdC,MAAM;EACNO,QAAQ;EACRC,qBAAqB;EACrBc,sBAAsB;AACtBL,EAAAA,WAAW,GAAG,iBAAiB;EAC/BH,YAAY;AACZL,EAAAA,SAAS,GAAG;AAAE,CACJ,EAAA;EACV,MAAM;IAAEY,GAAG;AAAEW,IAAAA;AAAc,GAAE,GAAG6B,gBAAU,CAAsBhB,+BAAe,CAAC;EAChF,MAAMiB,aAAa,GAAG,CAAC,YAAY,CAAC,CAACC,QAAQ,CAAC9C,WAAW,CAAC;EAE1D,MAAM+C,cAAc,GAAGF,aAAa,IAAI,CAAC,CAAEhD,YAAwC,EAAEa,IAAI;EAEzF,MAAMsC,YAAY,GAAGA,MAAK;IACxB,MAAMC,cAAc,GAClB3D,QAAQ,IAAIC,qBAAqB,IAAI,CAACR,MAAM,gBAC1C4C,cAAA,CAACuB,qBAAM,EAAA;MAACC,SAAS,EAAEC,mBAAS,CAACC,OAAQ;AAAAtB,MAAAA,QAAA,EAAExC;KAA8B,CAAC,GAEtER,MACD;IAEH,oBACEiD,eAAA,CAAAsB,mBAAA,EAAA;MAAAvB,QAAA,EAAA,CACGjD,cAAc,EACdmE,cAAc;AAAA,KACjB,CAAG;EAEP,CAAC;EAED,IAAIJ,aAAa,IAAIE,cAAc,EAAE;AACnC,IAAA;AAAA;AACE;MACAf,eAAA,CAAA,KAAA,EAAA;AAAKxC,QAAAA,SAAS,EAAEyC,SAAI,CAAC,2BAA2B,EAAEzC,SAAS,CAAE;QAAAuC,QAAA,EAAA,cAC3DJ,cAAA,CAAC4B,uBAAe,EAAA;AACd,UAAA,kBAAA,EAAkBxC,cAAe;UACjCL,IAAI,EAAGb,YAAwC,EAAEa,IAAK;UACtD8C,MAAM,EAAG3D,YAAwC,EAAE2D,MAAO;AAC1DhE,UAAAA,SAAS,EAAEyC,SAAI,CAAC,oBAAoB,EAAE;YACpC,uBAAuB,EAAEjC,WAAW,KAAK,YAAY;AACrDyD,YAAAA,gBAAgB,EAAE,CAACpD;AACpB,WAAA,CAAE;AACHf,UAAAA,QAAQ,EAAEA,QAAS;UACnBoE,OAAO,EAAG7D,YAAiD,EAAE6D,OAAQ;AAAA3B,UAAAA,QAAA,EAEpEA;AAAQ,SACM,CAEjB,EAACiB,YAAY,EAAE;OACZ;AAAC;AAEV,EAAA;AAEA,EAAA,IAAI3C,sBAAsB,IAAIL,WAAW,KAAK,iBAAiB,EAAE;AAC/D,IAAA,oBACEgC,eAAA,CAAA,KAAA,EAAA;AAAKxC,MAAAA,SAAS,EAAEyC,SAAI,CAAC,2BAA2B,EAAEzC,SAAS,CAAE;AAAAuC,MAAAA,QAAA,gBAC3DJ,cAAA,CAAA,KAAA,EAAA;AAAKnC,QAAAA,SAAS,EAAC,oBAAoB;AAAAuC,QAAAA,QAAA,EAAEA;AAAQ,OAAM,CAEnD,EAACiB,YAAY,EAAE;AAAA,KACZ,CAAC;AAEV,EAAA;AAEA;AACA;EACA,MAAMW,YAAY,GAAG3D,WAAW,KAAK,OAAO,GAAG,KAAK,GAAG,UAAU;EACjE,oBACEgC,eAAA,CAAC2B,YAAY,EAAA;AAACnE,IAAAA,SAAS,EAAEyC,SAAI,CAAC,2BAA2B,EAAEzC,SAAS,CAAE;AAAAuC,IAAAA,QAAA,gBACpEJ,cAAA,CAAA,OAAA,EAAA;MACEiC,OAAO,EAAExD,GAAG,CAACf,OAAQ;AACrBG,MAAAA,SAAS,EAAEyC,SAAI,CAAC,oBAAoB,EAAE;QACpC4B,SAAS,EAAE,CAACvE,QAAQ;AACpBmE,QAAAA,gBAAgB,EAAE,CAACpD;AACpB,OAAA,CAAE;AAAA0B,MAAAA,QAAA,EAEFA;AAAQ,KACJ,CAEP,EAACiB,YAAY,EAAE;AAAA,GACH,CAAC;AAEnB;AAEAvE,QAAQ,CAACqF,KAAK,GAAGA,mBAAK;AACtBrF,QAAQ,CAACsF,UAAU,GAAGA,6BAAU;AAChCtF,QAAQ,CAACuF,YAAY,GAAGA,iCAAY;AACpCvF,QAAQ,CAACwF,cAAc,GAAGA,qCAAc;AACxCxF,QAAQ,CAACyF,QAAQ,GAAGA,yBAAQ;AAC5BzF,QAAQ,CAAC0F,KAAK,GAAGA,mBAAK;AACtB1F,QAAQ,CAAC2F,UAAU,GAAGA,6BAAU;AAChC3F,QAAQ,CAAC4F,UAAU,GAAGA,6BAAU;AAChC5F,QAAQ,CAAC6F,MAAM,GAAGA,qBAAM;AACxB7F,QAAQ,CAAC8F,MAAM,GAAGA,qBAAM;AACxB9F,QAAQ,CAACyE,MAAM,GAAGA,qBAAM;;;;;"}
|