@uva-glass/component-library 1.64.7 → 2.0.0
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/dist/Column-BUyVh2Oo.js.map +1 -1
- package/dist/MultiSelectItem-D9PxdX43.js.map +1 -1
- package/dist/SortableProvider-BUsvniX7.js.map +1 -1
- package/dist/{TablePlugin-BbiBRjod.js → TablePlugin-ByeOn0Zf.js} +5 -6
- package/dist/{TablePlugin-BbiBRjod.js.map → TablePlugin-ByeOn0Zf.js.map} +1 -1
- package/dist/assets/Label.css +1 -1
- package/dist/chunk-7R3XDUXW-C-tvzxWq.js +1685 -0
- package/dist/chunk-7R3XDUXW-C-tvzxWq.js.map +1 -0
- package/dist/components/Accordion/Accordion.js.map +1 -1
- package/dist/components/Accordion/Accordion.stories.js.map +1 -1
- package/dist/components/AccordionCard/AccordionCard.js.map +1 -1
- package/dist/components/AccordionCard/AccordionCard.stories.js.map +1 -1
- package/dist/components/ActionList/ActionList.js.map +1 -1
- package/dist/components/ActionList/ActionList.stories.js.map +1 -1
- package/dist/components/AppStatusBar/AppStatusBar.stories.js.map +1 -1
- package/dist/components/Attention/Attention.stories.js.map +1 -1
- package/dist/components/Backdrop/Backdrop.stories.js.map +1 -1
- package/dist/components/ButtonGroup/ButtonGroup.stories.js.map +1 -1
- package/dist/components/Buttons/Button.js.map +1 -1
- package/dist/components/Buttons/Button.stories.js +1 -1
- package/dist/components/Buttons/Button.stories.js.map +1 -1
- package/dist/components/Buttons/LinkButton.d.ts +1 -1
- package/dist/components/Buttons/LinkButton.js +1 -1
- package/dist/components/Buttons/LinkButton.js.map +1 -1
- package/dist/components/Buttons/LinkButton.stories.js +5 -5
- package/dist/components/Buttons/LinkButton.stories.js.map +1 -1
- package/dist/components/Buttons/MenuButton.js.map +1 -1
- package/dist/components/Buttons/MenuButton.stories.js +1 -1
- package/dist/components/Buttons/MenuButton.stories.js.map +1 -1
- package/dist/components/Card/Card.stories.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.stories.js +1 -1
- package/dist/components/Checkbox/Checkbox.stories.js.map +1 -1
- package/dist/components/CheckboxButton/CheckboxButton.js.map +1 -1
- package/dist/components/CheckboxButton/CheckboxButton.stories.js +1 -1
- package/dist/components/CheckboxButton/CheckboxButton.stories.js.map +1 -1
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.js.map +1 -1
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.stories.js +1 -1
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.stories.js.map +1 -1
- package/dist/components/CheckboxTree/CheckboxTree.js +6 -7
- package/dist/components/CheckboxTree/CheckboxTree.js.map +1 -1
- package/dist/components/CheckboxTree/CheckboxTree.stories.js +1 -1
- package/dist/components/CheckboxTree/CheckboxTree.stories.js.map +1 -1
- package/dist/components/Drawer/Drawer.js.map +1 -1
- package/dist/components/Drawer/Drawer.stories.js +1 -1
- package/dist/components/Drawer/Drawer.stories.js.map +1 -1
- package/dist/components/EmptyStateDataDisplay/EmptyStateDataDisplay.js.map +1 -1
- package/dist/components/EmptyStateDataDisplay/EmptyStateDataDisplay.stories.js.map +1 -1
- package/dist/components/FeedbackBox/FeedbackBox.stories.js.map +1 -1
- package/dist/components/FieldHint/FieldHint.js.map +1 -1
- package/dist/components/FieldHint/FieldHint.stories.js.map +1 -1
- package/dist/components/Fieldset/Fieldset.stories.js.map +1 -1
- package/dist/components/FormField/FormField.stories.js.map +1 -1
- package/dist/components/FormInput/FormInput.d.ts +3 -1
- package/dist/components/FormInput/FormInput.js +24 -24
- package/dist/components/FormInput/FormInput.js.map +1 -1
- package/dist/components/FormInput/FormInput.stories.js +1 -1
- package/dist/components/FormInput/FormInput.stories.js.map +1 -1
- package/dist/components/GridRow/GridRow.js.map +1 -1
- package/dist/components/GridRow/GridRow.stories.js.map +1 -1
- package/dist/components/HorizontalList/HorizontalList.js.map +1 -1
- package/dist/components/HorizontalList/HorizontalList.stories.js.map +1 -1
- package/dist/components/Icon/Icon.stories.js.map +1 -1
- package/dist/components/Icon/icons/index.js.map +1 -1
- package/dist/components/IconButton/IconButton.js.map +1 -1
- package/dist/components/IconButton/IconButton.stories.js +1 -1
- package/dist/components/IconButton/IconButton.stories.js.map +1 -1
- package/dist/components/InfoMessage/InfoMessage.stories.js.map +1 -1
- package/dist/components/Input/Input.js.map +1 -1
- package/dist/components/Input/Input.stories.js.map +1 -1
- package/dist/components/InputField/InputField.js.map +1 -1
- package/dist/components/InputField/InputField.stories.js +4 -5
- package/dist/components/InputField/InputField.stories.js.map +1 -1
- package/dist/components/Label/Label.d.ts +3 -1
- package/dist/components/Label/Label.js +14 -12
- package/dist/components/Label/Label.js.map +1 -1
- package/dist/components/Label/Label.stories.js.map +1 -1
- package/dist/components/MenuLink/MenuLink.d.ts +1 -1
- package/dist/components/MenuLink/MenuLink.js +5 -5
- package/dist/components/MenuLink/MenuLink.js.map +1 -1
- package/dist/components/MenuLink/MenuLink.stories.d.ts +1 -1
- package/dist/components/MenuLink/MenuLink.stories.js +1 -1
- package/dist/components/MenuLink/MenuLink.stories.js.map +1 -1
- package/dist/components/MetaDataList/MetaDataList.js.map +1 -1
- package/dist/components/MetaDataList/MetaDataList.stories.js.map +1 -1
- package/dist/components/ModalDialog/ModalDialog.js.map +1 -1
- package/dist/components/ModalDialog/ModalDialog.stories.js +1 -1
- package/dist/components/ModalDialog/ModalDialog.stories.js.map +1 -1
- package/dist/components/MultiSelect/MultiSelect.js +1 -1
- package/dist/components/MultiSelect/MultiSelect.stories.js +2 -2
- package/dist/components/MultiSelect/MultiSelect.stories.js.map +1 -1
- package/dist/components/MultiSelect/components/MultiSelectHeader.js +2 -3
- package/dist/components/MultiSelect/components/MultiSelectHeader.js.map +1 -1
- package/dist/components/MultiSelect/index.js +1 -1
- package/dist/components/OverlayCloseButton/OverlayCloseButton.js.map +1 -1
- package/dist/components/OverlayCloseButton/OverlayCloseButton.stories.js +1 -1
- package/dist/components/OverlayCloseButton/OverlayCloseButton.stories.js.map +1 -1
- package/dist/components/PageOverlay/PageOverlay.js.map +1 -1
- package/dist/components/PageOverlay/PageOverlay.stories.js.map +1 -1
- package/dist/components/PeriodSelector/PeriodSelector.js +3 -4
- package/dist/components/PeriodSelector/PeriodSelector.js.map +1 -1
- package/dist/components/PeriodSelector/PeriodSelector.stories.js +1 -1
- package/dist/components/PeriodSelector/PeriodSelector.stories.js.map +1 -1
- package/dist/components/Periods/Periods.js.map +1 -1
- package/dist/components/Periods/Periods.stories.js.map +1 -1
- package/dist/components/ProgrammeCard/ProgrammeCard.js.map +1 -1
- package/dist/components/ProgrammeCard/ProgrammeCard.stories.js +4 -5
- package/dist/components/ProgrammeCard/ProgrammeCard.stories.js.map +1 -1
- package/dist/components/RadioButton/RadioButton.stories.js.map +1 -1
- package/dist/components/Repeater/Repeater.js.map +1 -1
- package/dist/components/Repeater/Repeater.stories.js.map +1 -1
- package/dist/components/RteEditor/EditorHeader/EditorHeader.js +3 -4
- package/dist/components/RteEditor/EditorHeader/EditorHeader.js.map +1 -1
- package/dist/components/RteEditor/Plugins/BlockFormatPlugin/BlockFormatPlugin.js.map +1 -1
- package/dist/components/RteEditor/Plugins/HistoryPlugin/HistoryPlugin.js +3 -4
- package/dist/components/RteEditor/Plugins/HistoryPlugin/HistoryPlugin.js.map +1 -1
- package/dist/components/RteEditor/Plugins/LinkPlugin/AddLinkForm/AddLinkFrom.js +2 -3
- package/dist/components/RteEditor/Plugins/LinkPlugin/AddLinkForm/AddLinkFrom.js.map +1 -1
- package/dist/components/RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js.map +1 -1
- package/dist/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.js +3 -4
- package/dist/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.js.map +1 -1
- package/dist/components/RteEditor/Plugins/ListPlugin/ListPlugin.js.map +1 -1
- package/dist/components/RteEditor/Plugins/PasteHandlerPlugin/PasteHandlerPlugin.js.map +1 -1
- package/dist/components/RteEditor/Plugins/TablePlugin/AddTableFrom.js +2 -3
- package/dist/components/RteEditor/Plugins/TablePlugin/AddTableFrom.js.map +1 -1
- package/dist/components/RteEditor/Plugins/TablePlugin/TableCellContextMenu/TableCellContextMenu.js.map +1 -1
- package/dist/components/RteEditor/Plugins/TablePlugin/TablePlugin.js +2 -3
- package/dist/components/RteEditor/Plugins/TablePlugin/TablePlugin.js.map +1 -1
- package/dist/components/RteEditor/Plugins/TablePlugin/helpers.js.map +1 -1
- package/dist/components/RteEditor/Plugins/TablePlugin/index.js +1 -1
- package/dist/components/RteEditor/Plugins/ToolbarPlugin/ToolbarPlugin.js +1 -1
- package/dist/components/RteEditor/Plugins/ToolbarPlugin/ToolbarPlugin.js.map +1 -1
- package/dist/components/RteEditor/Plugins/index.js +1 -1
- package/dist/components/RteEditor/Providers/LanguageProvider.js.map +1 -1
- package/dist/components/RteEditor/RteEditor.js +3 -4
- package/dist/components/RteEditor/RteEditor.js.map +1 -1
- package/dist/components/RteEditor/RteEditor.stories.js.map +1 -1
- package/dist/components/RteEditor/helpers.js.map +1 -1
- package/dist/components/RteEditor/hooks/components/Flyout.js.map +1 -1
- package/dist/components/RteEditor/hooks/useFlyout.js.map +1 -1
- package/dist/components/RteEditor/hooks/useTranslation.js.map +1 -1
- package/dist/components/RteEditor/translations.js.map +1 -1
- package/dist/components/SectionNotification/SectionNotification.stories.js.map +1 -1
- package/dist/components/SelectListbox/SelectListBox.stories.js +1 -1
- package/dist/components/SelectListbox/SelectListBox.stories.js.map +1 -1
- package/dist/components/SelectListbox/SelectListbox.js.map +1 -1
- package/dist/components/SelectListbox/SelectProvider.js.map +1 -1
- package/dist/components/SelectListbox/components/SelectButton.js.map +1 -1
- package/dist/components/SelectListbox/components/SelectContainer.js.map +1 -1
- package/dist/components/SelectListbox/components/SelectOption.js.map +1 -1
- package/dist/components/SelectListbox/components/SelectOptionBox.js.map +1 -1
- package/dist/components/Sortable/Sortable.js.map +1 -1
- package/dist/components/Sortable/Sortable.stories.js +1 -1
- package/dist/components/Sortable/Sortable.stories.js.map +1 -1
- package/dist/components/Sortable/actions.js.map +1 -1
- package/dist/components/Sortable/components/SortableHandle.js.map +1 -1
- package/dist/components/Sortable/components/SortableItem.js.map +1 -1
- package/dist/components/Sortable/sortableReducer.js.map +1 -1
- package/dist/components/Spinner/Spinner.js.map +1 -1
- package/dist/components/Spinner/Spinner.stories.js.map +1 -1
- package/dist/components/StatusPill/StatusPill.js.map +1 -1
- package/dist/components/StatusPill/StatusPill.stories.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.stories.js.map +1 -1
- package/dist/components/hooks/useDebounce.js.map +1 -1
- package/dist/components/hooks/useOnClickOutside.js.map +1 -1
- package/dist/components/hooks/usePositionedFloaters.js.map +1 -1
- package/dist/components/hooks/useResponsive.js.map +1 -1
- package/dist/components/index.js +1 -1
- package/dist/index-0wq-B7do.js.map +1 -1
- package/dist/index-2mUSc_Ki.js.map +1 -1
- package/dist/index-B9BWML6P.js.map +1 -1
- package/dist/{index-DQyNeMuh.js → index-DWzkl4aY.js} +7 -7
- package/dist/{index-DQyNeMuh.js.map → index-DWzkl4aY.js.map} +1 -1
- package/dist/index.js +1 -1
- package/dist/react-18-BIqxBxbW.js.map +1 -1
- package/dist/storyComponents/ClipboardButton/ClipboardButton.js.map +1 -1
- package/dist/storyComponents/Container/Container.js.map +1 -1
- package/dist/storybook__react.d.js.map +1 -1
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.js","sources":["../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { forwardRef } from 'react';\n\nimport type { ButtonHTMLAttributes } from 'react';\n\nimport styles from './IconButton.module.css';\n\nexport interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'style'> {\n /** The value of the aria-label. */\n 'aria-label': string;\n /** The variant of the button. */\n variant?: 'destructive';\n /** true if the button should be rendered without a border; otherwise, false. The default is false. */\n noBorder?: boolean;\n /** true to render the button a bit wider; otherwise, false. The default is false. */\n wide?: boolean;\n}\n\n/** Represents a component for a button with an icon. */\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n ({ children, type = 'button', variant, noBorder, wide, ...restProps }: IconButtonProps, forwardedRef) => (\n <button\n {...restProps}\n className={clsx(styles['icon-button'], {\n [styles['icon-button--destructive']]: variant === 'destructive',\n [styles['icon-button--no-border']]: noBorder,\n [styles['icon-button--wide']]: wide,\n })}\n ref={forwardedRef}\n type={type}\n >\n {children}\n </button>\n )\n);\n"],"names":["IconButton","forwardRef","children","type","variant","noBorder","wide","restProps","forwardedRef","jsx","clsx","styles"],"mappings":";;;;;;;;GAmBaA,IAAaC;AAAA,EACxB,CAAC,EAAE,UAAAC,GAAU,MAAAC,IAAO,UAAU,SAAAC,GAAS,UAAAC,GAAU,MAAAC,GAAM,GAAGC,KAA8BC,MACtF,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,WAAWG,EAAKC,EAAO,aAAa,GAAG;AAAA,QACrC,CAACA,EAAO,0BAA0B,CAAC,GAAGP,MAAY;AAAA,QAClD,CAACO,EAAO,wBAAwB,CAAC,GAAGN;AAAA,QACpC,CAACM,EAAO,mBAAmB,CAAC,GAAGL;AAAA,MAAA,CAChC;AAAA,MACD,KAAKE;AAAA,MACL,MAAAL;AAAA,MAEC,UAAAD;AAAA,IAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"IconButton.js","sources":["../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { forwardRef } from 'react';\n\nimport type { ButtonHTMLAttributes } from 'react';\n\nimport styles from './IconButton.module.css';\n\nexport interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'style'> {\n /** The value of the aria-label. */\n 'aria-label': string;\n /** The variant of the button. */\n variant?: 'destructive';\n /** true if the button should be rendered without a border; otherwise, false. The default is false. */\n noBorder?: boolean;\n /** true to render the button a bit wider; otherwise, false. The default is false. */\n wide?: boolean;\n}\n\n/** Represents a component for a button with an icon. */\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n ({ children, type = 'button', variant, noBorder, wide, ...restProps }: IconButtonProps, forwardedRef) => (\n <button\n {...restProps}\n className={clsx(styles['icon-button'], {\n [styles['icon-button--destructive']]: variant === 'destructive',\n [styles['icon-button--no-border']]: noBorder,\n [styles['icon-button--wide']]: wide,\n })}\n ref={forwardedRef}\n type={type}\n >\n {children}\n </button>\n )\n);\n"],"names":["IconButton","forwardRef","children","type","variant","noBorder","wide","restProps","forwardedRef","jsx","clsx","styles"],"mappings":";;;;;;;;GAmBaA,IAAaC;AAAA,EACxB,CAAC,EAAE,UAAAC,GAAU,MAAAC,IAAO,UAAU,SAAAC,GAAS,UAAAC,GAAU,MAAAC,GAAM,GAAGC,KAA8BC,MACtF,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,WAAWG,EAAKC,EAAO,aAAa,GAAG;AAAA,QACrC,CAACA,EAAO,0BAA0B,CAAC,GAAGP,MAAY;AAAA,QAClD,CAACO,EAAO,wBAAwB,CAAC,GAAGN;AAAA,QACpC,CAACM,EAAO,mBAAmB,CAAC,GAAGL;AAAA,MAAA,CAChC;AAAA,MACD,KAAKE;AAAA,MACL,MAAAL;AAAA,MAEC,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as n } from "react/jsx-runtime";
|
|
2
|
-
import { fn as r } from "../../index-
|
|
2
|
+
import { fn as r } from "../../index-DWzkl4aY.js";
|
|
3
3
|
import { IconButton as t } from "./IconButton.js";
|
|
4
4
|
import { Icon as i } from "../Icon/Icon.js";
|
|
5
5
|
const l = `<IconButton variant={variant} aria-label={aria-label} onClick={onClickFunction}>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.stories.js","sources":["../../../src/components/IconButton/IconButton.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { IconButtonProps } from 'components/IconButton';\n\nimport { IconButton } from 'components/IconButton';\nimport { Icon } from 'components/Icon';\n\nconst codeString = `<IconButton variant={variant} aria-label={aria-label} onClick={onClickFunction}>\n <Icon name={iconName} size={size} />\n </IconButton>`;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/IconButton',\n component: IconButton,\n argTypes: {\n variant: {\n options: ['destructive'],\n control: { type: 'check' },\n },\n noBorder: {\n control: 'boolean',\n default: false,\n },\n wide: {\n control: 'boolean',\n default: false,\n },\n 'aria-label': {\n table: {\n disable: true,\n },\n },\n type: {\n options: ['button', 'submit', 'reset'],\n control: { type: 'select' },\n },\n children: {\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n inspectComponent: IconButton,\n codeString: codeString,\n },\n} as Meta<IconButtonProps>;\n\nconst Template: StoryFn<IconButtonProps> = (args) => {\n // args.variant is provided as an array because the control type is set to a checkbox. So this transforms the selected value into its proper value: a string\n const variantArray = (args.variant as unknown as string[]) ?? [];\n const iconButtonArgs = { ...args, ...{ variant: variantArray.toString() } } as IconButtonProps;\n\n return <IconButton {...iconButtonArgs} />;\n};\n\nexport const IconButtonExample = Template.bind({});\nIconButtonExample.args = {\n 'aria-label': 'Trash',\n variant: 'destructive',\n noBorder: false,\n wide: false,\n disabled: false,\n children: <Icon name=\"Trash\" />,\n onClick: fn(),\n};\n"],"names":["codeString","IconButton_stories","IconButton","Template","args","variantArray","iconButtonArgs","jsx","IconButtonExample","Icon","fn"],"mappings":";;;;AAQA,MAAMA,IAAa;AAAA;AAAA,kBAKJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS,CAAC,aAAa;AAAA,MACvB,SAAS,EAAE,MAAM,QAAQ;AAAA,IAC3B;AAAA,IACA,UAAU;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,cAAc;AAAA,MACZ,OAAO;AAAA,QACL,SAAS;AAAA,
|
|
1
|
+
{"version":3,"file":"IconButton.stories.js","sources":["../../../src/components/IconButton/IconButton.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { IconButtonProps } from 'components/IconButton';\n\nimport { IconButton } from 'components/IconButton';\nimport { Icon } from 'components/Icon';\n\nconst codeString = `<IconButton variant={variant} aria-label={aria-label} onClick={onClickFunction}>\n <Icon name={iconName} size={size} />\n </IconButton>`;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/IconButton',\n component: IconButton,\n argTypes: {\n variant: {\n options: ['destructive'],\n control: { type: 'check' },\n },\n noBorder: {\n control: 'boolean',\n default: false,\n },\n wide: {\n control: 'boolean',\n default: false,\n },\n 'aria-label': {\n table: {\n disable: true,\n },\n },\n type: {\n options: ['button', 'submit', 'reset'],\n control: { type: 'select' },\n },\n children: {\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n inspectComponent: IconButton,\n codeString: codeString,\n },\n} as Meta<IconButtonProps>;\n\nconst Template: StoryFn<IconButtonProps> = (args) => {\n // args.variant is provided as an array because the control type is set to a checkbox. So this transforms the selected value into its proper value: a string\n const variantArray = (args.variant as unknown as string[]) ?? [];\n const iconButtonArgs = { ...args, ...{ variant: variantArray.toString() } } as IconButtonProps;\n\n return <IconButton {...iconButtonArgs} />;\n};\n\nexport const IconButtonExample = Template.bind({});\nIconButtonExample.args = {\n 'aria-label': 'Trash',\n variant: 'destructive',\n noBorder: false,\n wide: false,\n disabled: false,\n children: <Icon name=\"Trash\" />,\n onClick: fn(),\n};\n"],"names":["codeString","IconButton_stories","IconButton","Template","args","variantArray","iconButtonArgs","jsx","IconButtonExample","Icon","fn"],"mappings":";;;;AAQA,MAAMA,IAAa;AAAA;AAAA,kBAKJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS,CAAC,aAAa;AAAA,MACvB,SAAS,EAAE,MAAM,QAAQ;AAAA,IAC3B;AAAA,IACA,UAAU;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,cAAc;AAAA,MACZ,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IAEb;AAAA,IACA,MAAM;AAAA,MACJ,SAAS,CAAC,UAAU,UAAU,OAAO;AAAA,MACrC,SAAS,EAAE,MAAM,SAAS;AAAA,IAC5B;AAAA,IACA,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,EAEJ;AAAA,EACA,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAqC,CAACC,MAAS;AAE7C,QAAAC,IAAgBD,EAAK,WAAmC,CAAC,GACzDE,IAAiB,EAAE,GAAGF,GAAW,SAASC,EAAa,SAAS,EAAI;AAEnE,SAAA,gBAAAE,EAACL,GAAY,EAAA,GAAGI,EAAgB,CAAA;AACzC,GAEaE,IAAoBL,EAAS,KAAK,CAAE,CAAA;AACjDK,EAAkB,OAAO;AAAA,EACvB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,UAAU;AAAA,EACV,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU,gBAAAD,EAACE,GAAK,EAAA,MAAK,QAAQ,CAAA;AAAA,EAC7B,SAASC,EAAG;AACd;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InfoMessage.stories.js","sources":["../../../src/components/InfoMessage/InfoMessage.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { InfoMessageProps } from './InfoMessage';\n\nimport { InfoMessage } from './InfoMessage';\n\nconst codeString = '<InfoMessage message={message} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/InfoMessage',\n component: InfoMessage,\n argTypes: {\n message: {\n control: 'text',\n },\n hasOwnContainer: {\n control: 'boolean',\n },\n },\n parameters: {\n inspectComponent: InfoMessage,\n codeString: codeString,\n },\n} as Meta<InfoMessageProps>;\n\nconst Template: StoryFn<InfoMessageProps> = (args) => <InfoMessage {...args} />;\n\nexport const InfoMessageExample = Template.bind({});\nInfoMessageExample.args = {\n message: 'This is an example info message',\n hasOwnContainer: false,\n};\n"],"names":["codeString","InfoMessage_stories","InfoMessage","Template","args","jsx","InfoMessageExample"],"mappings":";;AAKA,MAAMA,IAAa,qCAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,IACX;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,
|
|
1
|
+
{"version":3,"file":"InfoMessage.stories.js","sources":["../../../src/components/InfoMessage/InfoMessage.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { InfoMessageProps } from './InfoMessage';\n\nimport { InfoMessage } from './InfoMessage';\n\nconst codeString = '<InfoMessage message={message} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/InfoMessage',\n component: InfoMessage,\n argTypes: {\n message: {\n control: 'text',\n },\n hasOwnContainer: {\n control: 'boolean',\n },\n },\n parameters: {\n inspectComponent: InfoMessage,\n codeString: codeString,\n },\n} as Meta<InfoMessageProps>;\n\nconst Template: StoryFn<InfoMessageProps> = (args) => <InfoMessage {...args} />;\n\nexport const InfoMessageExample = Template.bind({});\nInfoMessageExample.args = {\n message: 'This is an example info message',\n hasOwnContainer: false,\n};\n"],"names":["codeString","InfoMessage_stories","InfoMessage","Template","args","jsx","InfoMessageExample"],"mappings":";;AAKA,MAAMA,IAAa,qCAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,IACX;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,IAAA;AAAA,EAEb;AAAA,EACA,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAsC,CAACC,MAAU,gBAAAC,EAAAH,GAAA,EAAa,GAAGE,GAAM,GAEhEE,IAAqBH,EAAS,KAAK,CAAE,CAAA;AAClDG,EAAmB,OAAO;AAAA,EACxB,SAAS;AAAA,EACT,iBAAiB;AACnB;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","sources":["../../../src/components/Input/Input.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport { clsx } from 'clsx';\n\nimport type { InputHTMLAttributes } from 'react';\n\nimport styles from './Input.module.css';\n\nexport interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'style'> {\n /** The appearance of the element. Possible values: `error`. */\n appearance?: 'error';\n /** The type of the input element. */\n type?: 'text' | 'search' | 'password' | 'email' | 'file';\n /** `true` if the element should render at full width of its container; otherwise, `false`. The default is `false`. */\n fullWidth?: boolean;\n /** The id of the element. */\n id: string;\n /** `true` if the element is used for numeric values; otherwise, `false`. The default is `false`. */\n isNumeric?: boolean;\n}\n\n/** Represents a component for an input element. */\nexport const Input = forwardRef<HTMLInputElement, InputProps>(function Input(\n { id, appearance, type = 'text', isNumeric, fullWidth, ...restProps }: InputProps,\n forwardedRef\n) {\n return (\n <input\n {...restProps}\n ref={forwardedRef}\n id={id}\n className={clsx(styles['input'], {\n [styles['input--error']]: appearance === 'error',\n [styles['input--full-with']]: fullWidth,\n [styles['input--numeric']]: isNumeric,\n })}\n type={type}\n />\n );\n});\n"],"names":["Input","forwardRef","id","appearance","type","isNumeric","fullWidth","restProps","forwardedRef","jsx","clsx","styles"],"mappings":";;;;;;;;GAqBaA,IAAQC,EAAyC,SAC5D,EAAE,IAAAC,GAAI,YAAAC,GAAY,MAAAC,IAAO,QAAQ,WAAAC,GAAW,WAAAC,GAAW,GAAGC,EAAA,GAC1DC,GACA;AAEE,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,KAAKC;AAAA,MACL,IAAAN;AAAA,MACA,WAAWQ,EAAKC,EAAO,OAAU;AAAA,QAC/B,CAACA,EAAO,cAAc,CAAC,GAAGR,MAAe;AAAA,QACzC,CAACQ,EAAO,kBAAkB,CAAC,GAAGL;AAAA,QAC9B,CAACK,EAAO,gBAAgB,CAAC,GAAGN;AAAA,MAAA,CAC7B;AAAA,MACD,MAAAD;AAAA,IAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"Input.js","sources":["../../../src/components/Input/Input.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport { clsx } from 'clsx';\n\nimport type { InputHTMLAttributes } from 'react';\n\nimport styles from './Input.module.css';\n\nexport interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'style'> {\n /** The appearance of the element. Possible values: `error`. */\n appearance?: 'error';\n /** The type of the input element. */\n type?: 'text' | 'search' | 'password' | 'email' | 'file';\n /** `true` if the element should render at full width of its container; otherwise, `false`. The default is `false`. */\n fullWidth?: boolean;\n /** The id of the element. */\n id: string;\n /** `true` if the element is used for numeric values; otherwise, `false`. The default is `false`. */\n isNumeric?: boolean;\n}\n\n/** Represents a component for an input element. */\nexport const Input = forwardRef<HTMLInputElement, InputProps>(function Input(\n { id, appearance, type = 'text', isNumeric, fullWidth, ...restProps }: InputProps,\n forwardedRef\n) {\n return (\n <input\n {...restProps}\n ref={forwardedRef}\n id={id}\n className={clsx(styles['input'], {\n [styles['input--error']]: appearance === 'error',\n [styles['input--full-with']]: fullWidth,\n [styles['input--numeric']]: isNumeric,\n })}\n type={type}\n />\n );\n});\n"],"names":["Input","forwardRef","id","appearance","type","isNumeric","fullWidth","restProps","forwardedRef","jsx","clsx","styles"],"mappings":";;;;;;;;GAqBaA,IAAQC,EAAyC,SAC5D,EAAE,IAAAC,GAAI,YAAAC,GAAY,MAAAC,IAAO,QAAQ,WAAAC,GAAW,WAAAC,GAAW,GAAGC,EAAA,GAC1DC,GACA;AAEE,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,KAAKC;AAAA,MACL,IAAAN;AAAA,MACA,WAAWQ,EAAKC,EAAO,OAAU;AAAA,QAC/B,CAACA,EAAO,cAAc,CAAC,GAAGR,MAAe;AAAA,QACzC,CAACQ,EAAO,kBAAkB,CAAC,GAAGL;AAAA,QAC9B,CAACK,EAAO,gBAAgB,CAAC,GAAGN;AAAA,MAAA,CAC7B;AAAA,MACD,MAAAD;AAAA,IAAA;AAAA,EACF;AAEJ,CAAC;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.stories.js","sources":["../../../src/components/Input/Input.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { InputProps } from './Input';\n\nimport { Input } from './Input';\n\nconst codeString = `\n// Has all HTMLInputElement props available except \"className\" and \"style\" \n<Input id={id} type={type} aria-label={aria-label} onChange={onChangeFunction} value={value}/>\n`;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Input',\n component: Input,\n argTypes: {\n appearance: {\n table: {\n disable: true,\n },\n },\n type: {\n control: 'inline-radio',\n },\n },\n args: {\n id: '30daa7c7',\n type: 'text',\n },\n parameters: {\n inspectComponent: Input,\n codeString: codeString,\n },\n} as Meta<InputProps>;\n\nconst Template: StoryFn<InputProps> = (args) => {\n return <Input {...args} />;\n};\n\nexport const InputExample = Template.bind({});\nInputExample.args = {};\n\nexport const FullWidth = Template.bind({});\nFullWidth.args = {\n fullWidth: true,\n};\n\nexport const Numeric = Template.bind({});\nNumeric.args = {\n isNumeric: true,\n};\n\nexport const WithErrorAppearance = Template.bind({});\nWithErrorAppearance.args = {\n appearance: 'error',\n};\n"],"names":["codeString","Input_stories","Input","Template","args","jsx","InputExample","FullWidth","Numeric","WithErrorAppearance"],"mappings":";;AAKA,MAAMA,IAAa;AAAA;AAAA;AAAA,GAMJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,YAAY;AAAA,MACV,OAAO;AAAA,QACL,SAAS;AAAA,
|
|
1
|
+
{"version":3,"file":"Input.stories.js","sources":["../../../src/components/Input/Input.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { InputProps } from './Input';\n\nimport { Input } from './Input';\n\nconst codeString = `\n// Has all HTMLInputElement props available except \"className\" and \"style\" \n<Input id={id} type={type} aria-label={aria-label} onChange={onChangeFunction} value={value}/>\n`;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Input',\n component: Input,\n argTypes: {\n appearance: {\n table: {\n disable: true,\n },\n },\n type: {\n control: 'inline-radio',\n },\n },\n args: {\n id: '30daa7c7',\n type: 'text',\n },\n parameters: {\n inspectComponent: Input,\n codeString: codeString,\n },\n} as Meta<InputProps>;\n\nconst Template: StoryFn<InputProps> = (args) => {\n return <Input {...args} />;\n};\n\nexport const InputExample = Template.bind({});\nInputExample.args = {};\n\nexport const FullWidth = Template.bind({});\nFullWidth.args = {\n fullWidth: true,\n};\n\nexport const Numeric = Template.bind({});\nNumeric.args = {\n isNumeric: true,\n};\n\nexport const WithErrorAppearance = Template.bind({});\nWithErrorAppearance.args = {\n appearance: 'error',\n};\n"],"names":["codeString","Input_stories","Input","Template","args","jsx","InputExample","FullWidth","Numeric","WithErrorAppearance"],"mappings":";;AAKA,MAAMA,IAAa;AAAA;AAAA;AAAA,GAMJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,YAAY;AAAA,MACV,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IAEb;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,IAAA;AAAA,EAEb;AAAA,EACA,MAAM;AAAA,IACJ,IAAI;AAAA,IACJ,MAAM;AAAA,EACR;AAAA,EACA,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAgC,CAACC,MAC9B,gBAAAC,EAACH,GAAO,EAAA,GAAGE,EAAM,CAAA,GAGbE,IAAeH,EAAS,KAAK,CAAE,CAAA;AAC5CG,EAAa,OAAO,CAAC;AAEd,MAAMC,IAAYJ,EAAS,KAAK,CAAE,CAAA;AACzCI,EAAU,OAAO;AAAA,EACf,WAAW;AACb;AAEO,MAAMC,IAAUL,EAAS,KAAK,CAAE,CAAA;AACvCK,EAAQ,OAAO;AAAA,EACb,WAAW;AACb;AAEO,MAAMC,IAAsBN,EAAS,KAAK,CAAE,CAAA;AACnDM,EAAoB,OAAO;AAAA,EACzB,YAAY;AACd;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputField.js","sources":["../../../src/components/InputField/InputField.tsx"],"sourcesContent":["import { forwardRef, useEffect, useRef, useState } from 'react';\nimport { clsx } from 'clsx';\n\nimport type { InputHTMLAttributes, ReactNode } from 'react';\n\nimport styles from './InputField.module.css';\n\nexport interface InputFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'style'> {\n /** The variant to render. Possible values: `undefined`, `large`. The default is `undefined`. */\n variant?: 'large';\n /** The type of the input element. */\n type?: 'text' | 'password' | 'email';\n /** The id of the input element. */\n id: string;\n /** An element that represents a clear button. */\n clearTrigger?: ReactNode;\n /** The callback that is invoked when the clear button is triggered. */\n onClear?: () => void;\n}\n\n/** Represents a component that renders an input field which can have a clear button. */\nexport const InputField = forwardRef<HTMLInputElement, InputFieldProps>(\n (\n { autoComplete = 'off', id, value, variant, type = 'text', clearTrigger, onClear, ...restProps }: InputFieldProps,\n forwardedRef\n ) => {\n const [clearButtonWidth, setClearButtonWidth] = useState<number>(0);\n const clearButtonRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (clearButtonRef.current) {\n setClearButtonWidth(clearButtonRef.current.offsetWidth);\n }\n }, [value]);\n\n const handleClearTriggerClick = () => {\n if (onClear && forwardedRef && 'current' in forwardedRef && forwardedRef.current) {\n onClear();\n forwardedRef.current.focus();\n }\n };\n\n return (\n <div className={styles['input-field-wrapper']}>\n <input\n {...restProps}\n autoComplete={autoComplete}\n ref={forwardedRef}\n id={id}\n className={clsx(styles['input-field'], {\n [styles['input-field--large']]: variant === 'large',\n })}\n type={type}\n value={value}\n style={{ paddingRight: value && clearTrigger ? clearButtonWidth : undefined }}\n />\n {value && clearTrigger && (\n <button\n type=\"button\"\n className={styles['input-field__clear-button']}\n onClick={handleClearTriggerClick}\n ref={clearButtonRef}\n aria-label={`clear trigger for ${id}`}\n >\n {clearTrigger}\n </button>\n )}\n </div>\n );\n }\n);\n"],"names":["InputField","forwardRef","autoComplete","id","value","variant","type","clearTrigger","onClear","restProps","forwardedRef","clearButtonWidth","setClearButtonWidth","useState","clearButtonRef","useRef","useEffect","handleClearTriggerClick","jsxs","styles","jsx","clsx"],"mappings":";;;;;;;;GAqBaA,IAAaC;AAAA,EACxB,CACE,EAAE,cAAAC,IAAe,OAAO,IAAAC,GAAI,OAAAC,GAAO,SAAAC,GAAS,MAAAC,IAAO,QAAQ,cAAAC,GAAc,SAAAC,GAAS,GAAGC,EAAA,GACrFC,MACG;AACH,UAAM,CAACC,GAAkBC,CAAmB,IAAIC,EAAiB,CAAC,GAC5DC,IAAiBC,EAA0B,IAAI;AAErD,IAAAC,EAAU,MAAM;AACd,MAAIF,EAAe,WACGF,EAAAE,EAAe,QAAQ,WAAW;AAAA,IACxD,GACC,CAACV,CAAK,CAAC;AAEV,UAAMa,IAA0B,MAAM;AACpC,MAAIT,KAAWE,KAAgB,aAAaA,KAAgBA,EAAa,YAC/DF,
|
|
1
|
+
{"version":3,"file":"InputField.js","sources":["../../../src/components/InputField/InputField.tsx"],"sourcesContent":["import { forwardRef, useEffect, useRef, useState } from 'react';\nimport { clsx } from 'clsx';\n\nimport type { InputHTMLAttributes, ReactNode } from 'react';\n\nimport styles from './InputField.module.css';\n\nexport interface InputFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'style'> {\n /** The variant to render. Possible values: `undefined`, `large`. The default is `undefined`. */\n variant?: 'large';\n /** The type of the input element. */\n type?: 'text' | 'password' | 'email';\n /** The id of the input element. */\n id: string;\n /** An element that represents a clear button. */\n clearTrigger?: ReactNode;\n /** The callback that is invoked when the clear button is triggered. */\n onClear?: () => void;\n}\n\n/** Represents a component that renders an input field which can have a clear button. */\nexport const InputField = forwardRef<HTMLInputElement, InputFieldProps>(\n (\n { autoComplete = 'off', id, value, variant, type = 'text', clearTrigger, onClear, ...restProps }: InputFieldProps,\n forwardedRef\n ) => {\n const [clearButtonWidth, setClearButtonWidth] = useState<number>(0);\n const clearButtonRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (clearButtonRef.current) {\n setClearButtonWidth(clearButtonRef.current.offsetWidth);\n }\n }, [value]);\n\n const handleClearTriggerClick = () => {\n if (onClear && forwardedRef && 'current' in forwardedRef && forwardedRef.current) {\n onClear();\n forwardedRef.current.focus();\n }\n };\n\n return (\n <div className={styles['input-field-wrapper']}>\n <input\n {...restProps}\n autoComplete={autoComplete}\n ref={forwardedRef}\n id={id}\n className={clsx(styles['input-field'], {\n [styles['input-field--large']]: variant === 'large',\n })}\n type={type}\n value={value}\n style={{ paddingRight: value && clearTrigger ? clearButtonWidth : undefined }}\n />\n {value && clearTrigger && (\n <button\n type=\"button\"\n className={styles['input-field__clear-button']}\n onClick={handleClearTriggerClick}\n ref={clearButtonRef}\n aria-label={`clear trigger for ${id}`}\n >\n {clearTrigger}\n </button>\n )}\n </div>\n );\n }\n);\n"],"names":["InputField","forwardRef","autoComplete","id","value","variant","type","clearTrigger","onClear","restProps","forwardedRef","clearButtonWidth","setClearButtonWidth","useState","clearButtonRef","useRef","useEffect","handleClearTriggerClick","jsxs","styles","jsx","clsx"],"mappings":";;;;;;;;GAqBaA,IAAaC;AAAA,EACxB,CACE,EAAE,cAAAC,IAAe,OAAO,IAAAC,GAAI,OAAAC,GAAO,SAAAC,GAAS,MAAAC,IAAO,QAAQ,cAAAC,GAAc,SAAAC,GAAS,GAAGC,EAAA,GACrFC,MACG;AACH,UAAM,CAACC,GAAkBC,CAAmB,IAAIC,EAAiB,CAAC,GAC5DC,IAAiBC,EAA0B,IAAI;AAErD,IAAAC,EAAU,MAAM;AACd,MAAIF,EAAe,WACGF,EAAAE,EAAe,QAAQ,WAAW;AAAA,IACxD,GACC,CAACV,CAAK,CAAC;AAEV,UAAMa,IAA0B,MAAM;AACpC,MAAIT,KAAWE,KAAgB,aAAaA,KAAgBA,EAAa,YAC/DF,EAAA,GACRE,EAAa,QAAQ,MAAM;AAAA,IAE/B;AAEA,WACG,gBAAAQ,EAAA,OAAA,EAAI,WAAWC,EAAO,qBAAqB,GAC1C,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UACE,GAAGX;AAAA,UACJ,cAAAP;AAAA,UACA,KAAKQ;AAAA,UACL,IAAAP;AAAA,UACA,WAAWkB,EAAKF,EAAO,aAAa,GAAG;AAAA,YACrC,CAACA,EAAO,oBAAoB,CAAC,GAAGd,MAAY;AAAA,UAAA,CAC7C;AAAA,UACD,MAAAC;AAAA,UACA,OAAAF;AAAA,UACA,OAAO,EAAE,cAAcA,KAASG,IAAeI,IAAmB,OAAU;AAAA,QAAA;AAAA,MAC9E;AAAA,MACCP,KAASG,KACR,gBAAAa;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAWD,EAAO,2BAA2B;AAAA,UAC7C,SAASF;AAAA,UACT,KAAKH;AAAA,UACL,cAAY,qBAAqBX,CAAE;AAAA,UAElC,UAAAI;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,GAEJ;AAAA,EAAA;AAGN;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as e } from "react/jsx-runtime";
|
|
2
2
|
import { useState as d, useRef as g } from "react";
|
|
3
|
-
import { fn as l } from "../../index-
|
|
3
|
+
import { fn as l } from "../../index-DWzkl4aY.js";
|
|
4
4
|
import { InputField as o } from "./InputField.js";
|
|
5
5
|
import { Container as u } from "../../storyComponents/Container/Container.js";
|
|
6
6
|
import { Icon as f } from "../Icon/Icon.js";
|
|
@@ -14,8 +14,7 @@ import "../OverlayCloseButton/OverlayCloseButton.js";
|
|
|
14
14
|
import "../GridRow/GridRow.js";
|
|
15
15
|
import "../IconButton/IconButton.js";
|
|
16
16
|
import "../Input/Input.js";
|
|
17
|
-
import "
|
|
18
|
-
import "../../TablePlugin-BbiBRjod.js";
|
|
17
|
+
import "../../TablePlugin-ByeOn0Zf.js";
|
|
19
18
|
import "../RteEditor/Providers/LanguageProvider.js";
|
|
20
19
|
import "../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
|
|
21
20
|
import "../RteEditor/hooks/components/Flyout.js";
|
|
@@ -31,7 +30,7 @@ const C = `
|
|
|
31
30
|
`, h = (t) => {
|
|
32
31
|
const r = t.variant ?? [];
|
|
33
32
|
return { ...t, variant: r.toString() };
|
|
34
|
-
},
|
|
33
|
+
}, O = {
|
|
35
34
|
title: "Atoms/InputField",
|
|
36
35
|
component: o,
|
|
37
36
|
argTypes: {
|
|
@@ -94,6 +93,6 @@ export {
|
|
|
94
93
|
v as InputFieldExample,
|
|
95
94
|
y as WithIconClearTrigger,
|
|
96
95
|
b as WithStringClearTrigger,
|
|
97
|
-
|
|
96
|
+
O as default
|
|
98
97
|
};
|
|
99
98
|
//# sourceMappingURL=InputField.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputField.stories.js","sources":["../../../src/components/InputField/InputField.stories.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { fn } from '@storybook/test';\n\nimport type { ChangeEvent } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { InputFieldProps } from './InputField';\n\nimport { InputField } from './InputField';\n\nimport { Container } from 'storyComponents/Container';\nimport { Icon } from 'components';\n\nconst codeString = `\n// Has all HTMLInputElement props available except \"className\" and \"style\" \n<InputField aria-labelledby={aria-labelledby} id={id} onChange={onChangeFunction}\n value={value} type={type} clearTrigger={clearTrigger} />\n`;\n\nconst transformArgs = (args: InputFieldProps) => {\n // args.variant is provided as an array because the control type is set to a checkbox. So this transforms the selected value into its proper value: a string\n const variantArray = (args.variant as unknown as string[]) ?? [];\n return { ...args, ...{ variant: variantArray.toString() } } as InputFieldProps;\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/InputField',\n component: InputField,\n argTypes: {\n variant: {\n options: ['large'],\n control: 'check',\n },\n type: {\n control: 'radio',\n options: ['text', 'password', 'email'],\n },\n id: {\n control: 'text',\n },\n autoComplete: {\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n inspectComponent: InputField,\n codeString: codeString,\n },\n} as Meta<InputFieldProps>;\n\nconst Template: StoryFn<InputFieldProps> = (args) => {\n const [inputValue, setInputValue] = useState<InputFieldProps['value']>('');\n const inputRef = useRef<HTMLInputElement>(null);\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n setInputValue(event.target.value);\n fn()('handleChange');\n };\n\n const handleClear = () => {\n setInputValue('');\n fn()('handleClear');\n };\n\n return (\n <Container>\n <InputField\n {...transformArgs(args)}\n value={inputValue}\n onChange={handleChange}\n onClear={handleClear}\n ref={inputRef}\n />\n </Container>\n );\n};\n\nconst defaultArgs: Partial<InputFieldProps> = {\n type: 'text',\n variant: undefined,\n id: '4f9ca77d',\n};\n\nexport const InputFieldExample = Template.bind({});\nInputFieldExample.args = {\n ...defaultArgs,\n};\n\nexport const WithStringClearTrigger = Template.bind({});\nWithStringClearTrigger.args = {\n ...defaultArgs,\n clearTrigger: 'Clear',\n};\n\nexport const WithIconClearTrigger = Template.bind({});\nWithIconClearTrigger.args = {\n ...defaultArgs,\n clearTrigger: <Icon name=\"Cross\" />,\n};\n"],"names":["codeString","transformArgs","args","variantArray","InputField_stories","InputField","Template","inputValue","setInputValue","useState","inputRef","useRef","handleChange","event","fn","handleClear","Container","jsx","defaultArgs","InputFieldExample","WithStringClearTrigger","WithIconClearTrigger","Icon"],"mappings":"
|
|
1
|
+
{"version":3,"file":"InputField.stories.js","sources":["../../../src/components/InputField/InputField.stories.tsx"],"sourcesContent":["import { useRef, useState } from 'react';\nimport { fn } from '@storybook/test';\n\nimport type { ChangeEvent } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { InputFieldProps } from './InputField';\n\nimport { InputField } from './InputField';\n\nimport { Container } from 'storyComponents/Container';\nimport { Icon } from 'components';\n\nconst codeString = `\n// Has all HTMLInputElement props available except \"className\" and \"style\" \n<InputField aria-labelledby={aria-labelledby} id={id} onChange={onChangeFunction}\n value={value} type={type} clearTrigger={clearTrigger} />\n`;\n\nconst transformArgs = (args: InputFieldProps) => {\n // args.variant is provided as an array because the control type is set to a checkbox. So this transforms the selected value into its proper value: a string\n const variantArray = (args.variant as unknown as string[]) ?? [];\n return { ...args, ...{ variant: variantArray.toString() } } as InputFieldProps;\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/InputField',\n component: InputField,\n argTypes: {\n variant: {\n options: ['large'],\n control: 'check',\n },\n type: {\n control: 'radio',\n options: ['text', 'password', 'email'],\n },\n id: {\n control: 'text',\n },\n autoComplete: {\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n inspectComponent: InputField,\n codeString: codeString,\n },\n} as Meta<InputFieldProps>;\n\nconst Template: StoryFn<InputFieldProps> = (args) => {\n const [inputValue, setInputValue] = useState<InputFieldProps['value']>('');\n const inputRef = useRef<HTMLInputElement>(null);\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n setInputValue(event.target.value);\n fn()('handleChange');\n };\n\n const handleClear = () => {\n setInputValue('');\n fn()('handleClear');\n };\n\n return (\n <Container>\n <InputField\n {...transformArgs(args)}\n value={inputValue}\n onChange={handleChange}\n onClear={handleClear}\n ref={inputRef}\n />\n </Container>\n );\n};\n\nconst defaultArgs: Partial<InputFieldProps> = {\n type: 'text',\n variant: undefined,\n id: '4f9ca77d',\n};\n\nexport const InputFieldExample = Template.bind({});\nInputFieldExample.args = {\n ...defaultArgs,\n};\n\nexport const WithStringClearTrigger = Template.bind({});\nWithStringClearTrigger.args = {\n ...defaultArgs,\n clearTrigger: 'Clear',\n};\n\nexport const WithIconClearTrigger = Template.bind({});\nWithIconClearTrigger.args = {\n ...defaultArgs,\n clearTrigger: <Icon name=\"Cross\" />,\n};\n"],"names":["codeString","transformArgs","args","variantArray","InputField_stories","InputField","Template","inputValue","setInputValue","useState","inputRef","useRef","handleChange","event","fn","handleClear","Container","jsx","defaultArgs","InputFieldExample","WithStringClearTrigger","WithIconClearTrigger","Icon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAMA,IAAa;AAAA;AAAA;AAAA;AAAA,GAMbC,IAAgB,CAACC,MAA0B;AAEzC,QAAAC,IAAgBD,EAAK,WAAmC,CAAC;AACxD,SAAA,EAAE,GAAGA,GAAW,SAASC,EAAa,SAAS,EAAI;AAC5D,GAGeC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS,CAAC,OAAO;AAAA,MACjB,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,SAAS,CAAC,QAAQ,YAAY,OAAO;AAAA,IACvC;AAAA,IACA,IAAI;AAAA,MACF,SAAS;AAAA,IACX;AAAA,IACA,cAAc;AAAA,MACZ,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,EAEJ;AAAA,EACA,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAL;AAAA,EAAA;AAEJ,GAEMM,IAAqC,CAACJ,MAAS;AACnD,QAAM,CAACK,GAAYC,CAAa,IAAIC,EAAmC,EAAE,GACnEC,IAAWC,EAAyB,IAAI,GAExCC,IAAe,CAACC,MAAyC;AAC/C,IAAAL,EAAAK,EAAM,OAAO,KAAK,GAChCC,EAAA,EAAK,cAAc;AAAA,EACrB,GAEMC,IAAc,MAAM;AACxB,IAAAP,EAAc,EAAE,GAChBM,EAAA,EAAK,aAAa;AAAA,EACpB;AAEA,2BACGE,GACC,EAAA,UAAA,gBAAAC;AAAA,IAACZ;AAAA,IAAA;AAAA,MACE,GAAGJ,EAAcC,CAAI;AAAA,MACtB,OAAOK;AAAA,MACP,UAAUK;AAAA,MACV,SAASG;AAAA,MACT,KAAKL;AAAA,IAAA;AAAA,EAAA,GAET;AAEJ,GAEMQ,IAAwC;AAAA,EAC5C,MAAM;AAAA,EACN,SAAS;AAAA,EACT,IAAI;AACN,GAEaC,IAAoBb,EAAS,KAAK,CAAE,CAAA;AACjDa,EAAkB,OAAO;AAAA,EACvB,GAAGD;AACL;AAEO,MAAME,IAAyBd,EAAS,KAAK,CAAE,CAAA;AACtDc,EAAuB,OAAO;AAAA,EAC5B,GAAGF;AAAA,EACH,cAAc;AAChB;AAEO,MAAMG,IAAuBf,EAAS,KAAK,CAAE,CAAA;AACpDe,EAAqB,OAAO;AAAA,EAC1B,GAAGH;AAAA,EACH,cAAc,gBAAAD,EAACK,GAAK,EAAA,MAAK,QAAQ,CAAA;AACnC;"}
|
|
@@ -6,6 +6,8 @@ export interface LabelProps extends Omit<LabelHTMLAttributes<HTMLLabelElement>,
|
|
|
6
6
|
noFontWeight?: boolean;
|
|
7
7
|
/** `true` to show an asterisk to indicate an item is required; otherwise, `false`. */
|
|
8
8
|
required?: boolean;
|
|
9
|
+
/** `true` to align text right; otherwise, `false`. */
|
|
10
|
+
alignRight?: boolean;
|
|
9
11
|
}
|
|
10
12
|
/** Represents a component that renders a label for an input element. */
|
|
11
|
-
export declare const Label: ({ children, htmlFor, noFontWeight, required, ...restProps }: LabelProps) => import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export declare const Label: ({ children, htmlFor, noFontWeight, required, alignRight, ...restProps }: LabelProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,19 +1,21 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { c as
|
|
3
|
-
import '../../assets/Label.css';const n = "
|
|
1
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { c as g } from "../../clsx-OuTLNxxd.js";
|
|
3
|
+
import '../../assets/Label.css';const n = "_label_16gis_1", l = {
|
|
4
4
|
label: n,
|
|
5
|
-
"label--required": "_label--
|
|
6
|
-
"label--unset-font-weight": "_label--unset-font-
|
|
7
|
-
|
|
5
|
+
"label--required": "_label--required_16gis_6",
|
|
6
|
+
"label--unset-font-weight": "_label--unset-font-weight_16gis_14",
|
|
7
|
+
"label--align-right": "_label--align-right_16gis_18"
|
|
8
|
+
}, c = ({ children: e, htmlFor: a, noFontWeight: t, required: i = !1, alignRight: s, ...b }) => /* @__PURE__ */ r(
|
|
8
9
|
"label",
|
|
9
10
|
{
|
|
10
|
-
...
|
|
11
|
-
htmlFor:
|
|
12
|
-
className:
|
|
13
|
-
[
|
|
14
|
-
[
|
|
11
|
+
...b,
|
|
12
|
+
htmlFor: a,
|
|
13
|
+
className: g(l.label, {
|
|
14
|
+
[l["label--unset-font-weight"]]: t,
|
|
15
|
+
[l["label--required"]]: i,
|
|
16
|
+
[l["label--align-right"]]: s
|
|
15
17
|
}),
|
|
16
|
-
children:
|
|
18
|
+
children: e
|
|
17
19
|
}
|
|
18
20
|
);
|
|
19
21
|
export {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Label.js","sources":["../../../src/components/Label/Label.tsx"],"sourcesContent":["import clsx from 'clsx';\n\nimport type { LabelHTMLAttributes } from 'react';\n\nimport styles from './Label.module.css';\n\nexport interface LabelProps extends Omit<LabelHTMLAttributes<HTMLLabelElement>, 'className' | 'style'> {\n /** The id of the element for which the label is intended. */\n htmlFor: string;\n /** `true` if the font-weight needs to be unset; otherwise, `false`. The default is `false`. */\n noFontWeight?: boolean;\n /** `true` to show an asterisk to indicate an item is required; otherwise, `false`. */\n required?: boolean;\n}\n\n/** Represents a component that renders a label for an input element. */\nexport const Label = ({ children, htmlFor, noFontWeight, required = false, ...restProps }: LabelProps) => (\n <label\n {...restProps}\n htmlFor={htmlFor}\n className={clsx(styles['label'], {\n [styles['label--unset-font-weight']]: noFontWeight,\n [styles['label--required']]: required,\n })}\n >\n {children}\n </label>\n);\n"],"names":["Label","children","htmlFor","noFontWeight","required","restProps","jsx","clsx","styles"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Label.js","sources":["../../../src/components/Label/Label.tsx"],"sourcesContent":["import clsx from 'clsx';\n\nimport type { LabelHTMLAttributes } from 'react';\n\nimport styles from './Label.module.css';\n\nexport interface LabelProps extends Omit<LabelHTMLAttributes<HTMLLabelElement>, 'className' | 'style'> {\n /** The id of the element for which the label is intended. */\n htmlFor: string;\n /** `true` if the font-weight needs to be unset; otherwise, `false`. The default is `false`. */\n noFontWeight?: boolean;\n /** `true` to show an asterisk to indicate an item is required; otherwise, `false`. */\n required?: boolean;\n /** `true` to align text right; otherwise, `false`. */\n alignRight?: boolean;\n}\n\n/** Represents a component that renders a label for an input element. */\nexport const Label = ({ children, htmlFor, noFontWeight, required = false, alignRight, ...restProps }: LabelProps) => (\n <label\n {...restProps}\n htmlFor={htmlFor}\n className={clsx(styles['label'], {\n [styles['label--unset-font-weight']]: noFontWeight,\n [styles['label--required']]: required,\n [styles['label--align-right']]: alignRight,\n })}\n >\n {children}\n </label>\n);\n"],"names":["Label","children","htmlFor","noFontWeight","required","alignRight","restProps","jsx","clsx","styles"],"mappings":";;;;;;;GAkBaA,IAAQ,CAAC,EAAE,UAAAC,GAAU,SAAAC,GAAS,cAAAC,GAAc,UAAAC,IAAW,IAAO,YAAAC,GAAY,GAAGC,EAAA,MACxF,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACE,GAAGD;AAAA,IACJ,SAAAJ;AAAA,IACA,WAAWM,EAAKC,EAAO,OAAU;AAAA,MAC/B,CAACA,EAAO,0BAA0B,CAAC,GAAGN;AAAA,MACtC,CAACM,EAAO,iBAAiB,CAAC,GAAGL;AAAA,MAC7B,CAACK,EAAO,oBAAoB,CAAC,GAAGJ;AAAA,IAAA,CACjC;AAAA,IAEA,UAAAJ;AAAA,EAAA;AACH;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Label.stories.js","sources":["../../../src/components/Label/Label.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { LabelProps } from './Label';\n\nimport { Label } from './Label';\n\nconst codeString = `\n// Has all LabelHTMLAttributes props available except \"className\" and \"style\" \n <Label htmlFor={htmlFor}>{children}</Label>\n`;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Label',\n component: Label,\n argTypes: {\n htmlFor: {\n control: 'text',\n },\n children: {\n control: 'text',\n },\n },\n parameters: {\n inspectComponent: Label,\n codeString: codeString,\n },\n} as Meta<LabelProps>;\n\nconst Template: StoryFn<LabelProps> = (args) => <Label {...args} />;\n\nconst defaultArgs: Partial<LabelProps> = {\n children: 'Lorem Ipsum',\n htmlFor: 'bd79f7ec',\n};\n\nexport const LabelExample = Template.bind({});\nLabelExample.args = {\n ...defaultArgs,\n};\n\nexport const WithNoFontWeight = Template.bind({});\nWithNoFontWeight.args = {\n ...defaultArgs,\n noFontWeight: true,\n};\n"],"names":["codeString","Label_stories","Label","Template","args","jsx","defaultArgs","LabelExample","WithNoFontWeight"],"mappings":";;AAKA,MAAMA,IAAa;AAAA;AAAA;AAAA,GAMJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,IACX;AAAA,IACA,UAAU;AAAA,MACR,SAAS;AAAA,
|
|
1
|
+
{"version":3,"file":"Label.stories.js","sources":["../../../src/components/Label/Label.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { LabelProps } from './Label';\n\nimport { Label } from './Label';\n\nconst codeString = `\n// Has all LabelHTMLAttributes props available except \"className\" and \"style\" \n <Label htmlFor={htmlFor}>{children}</Label>\n`;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Label',\n component: Label,\n argTypes: {\n htmlFor: {\n control: 'text',\n },\n children: {\n control: 'text',\n },\n },\n parameters: {\n inspectComponent: Label,\n codeString: codeString,\n },\n} as Meta<LabelProps>;\n\nconst Template: StoryFn<LabelProps> = (args) => <Label {...args} />;\n\nconst defaultArgs: Partial<LabelProps> = {\n children: 'Lorem Ipsum',\n htmlFor: 'bd79f7ec',\n};\n\nexport const LabelExample = Template.bind({});\nLabelExample.args = {\n ...defaultArgs,\n};\n\nexport const WithNoFontWeight = Template.bind({});\nWithNoFontWeight.args = {\n ...defaultArgs,\n noFontWeight: true,\n};\n"],"names":["codeString","Label_stories","Label","Template","args","jsx","defaultArgs","LabelExample","WithNoFontWeight"],"mappings":";;AAKA,MAAMA,IAAa;AAAA;AAAA;AAAA,GAMJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,IACX;AAAA,IACA,UAAU;AAAA,MACR,SAAS;AAAA,IAAA;AAAA,EAEb;AAAA,EACA,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAgC,CAACC,MAAU,gBAAAC,EAAAH,GAAA,EAAO,GAAGE,GAAM,GAE3DE,IAAmC;AAAA,EACvC,UAAU;AAAA,EACV,SAAS;AACX,GAEaC,IAAeJ,EAAS,KAAK,CAAE,CAAA;AAC5CI,EAAa,OAAO;AAAA,EAClB,GAAGD;AACL;AAEO,MAAME,IAAmBL,EAAS,KAAK,CAAE,CAAA;AAChDK,EAAiB,OAAO;AAAA,EACtB,GAAGF;AAAA,EACH,cAAc;AAChB;"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { NavLinkProps } from 'react-router
|
|
1
|
+
import { NavLinkProps } from 'react-router';
|
|
2
2
|
/** Represents a component for a [NavLink](https://reactrouter.com/en/main/components/nav-link) with styling. */
|
|
3
3
|
export declare const MenuLink: (props: Omit<NavLinkProps, "style">) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import { jsx as m } from "react/jsx-runtime";
|
|
2
2
|
import { c as u } from "../../clsx-OuTLNxxd.js";
|
|
3
|
-
import {
|
|
3
|
+
import { u as k, N as h } from "../../chunk-7R3XDUXW-C-tvzxWq.js";
|
|
4
4
|
import '../../assets/MenuLink.css';const i = {
|
|
5
5
|
"menu-link": "_menu-link_8gjhh_1",
|
|
6
6
|
"menu-link--active": "_menu-link--active_8gjhh_8"
|
|
7
7
|
}, f = (t) => {
|
|
8
|
-
const
|
|
9
|
-
const
|
|
10
|
-
return
|
|
8
|
+
const s = k(), e = (n) => n.replace(/s$/, ""), o = (n) => {
|
|
9
|
+
const a = s.pathname.split("/").filter(Boolean), l = n.split("/").filter(Boolean).slice(-1)[0], c = e(l);
|
|
10
|
+
return a.some((r) => e(r) === c);
|
|
11
11
|
};
|
|
12
12
|
return /* @__PURE__ */ m(
|
|
13
13
|
h,
|
|
14
14
|
{
|
|
15
15
|
...t,
|
|
16
16
|
className: ({ isActive: n }) => u(i["menu-link"], {
|
|
17
|
-
[i["menu-link--active"]]: n ||
|
|
17
|
+
[i["menu-link--active"]]: n || o(t.to)
|
|
18
18
|
})
|
|
19
19
|
}
|
|
20
20
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuLink.js","sources":["../../../src/components/MenuLink/MenuLink.tsx"],"sourcesContent":["import classNames from 'clsx';\nimport { NavLink, useLocation } from 'react-router
|
|
1
|
+
{"version":3,"file":"MenuLink.js","sources":["../../../src/components/MenuLink/MenuLink.tsx"],"sourcesContent":["import classNames from 'clsx';\nimport { NavLink, useLocation } from 'react-router';\n\nimport type { NavLinkProps } from 'react-router';\n\nimport styles from './MenuLink.module.css';\n\n/** Represents a component for a [NavLink](https://reactrouter.com/en/main/components/nav-link) with styling. */\n// Omit style so it cannot be accidentally used\nexport const MenuLink = (props: Omit<NavLinkProps, 'style'>) => {\n const location = useLocation();\n\n // Helper function to remove trailing 's' from a string\n const singularize = (str: string) => str.replace(/s$/, '');\n\n // Check if 'to' path (singular version) matches any segment (singular version)\n const isActiveSingular = (to: string) => {\n const currentSegments = location.pathname.split('/').filter(Boolean);\n const latestToPath = to.split('/').filter(Boolean).slice(-1)[0]; // return only lates path removing any prepend path\n const singularizedToPath = singularize(latestToPath);\n\n return currentSegments.some((segment) => singularize(segment) === singularizedToPath);\n };\n\n return (\n <NavLink\n {...props}\n className={({ isActive }) =>\n classNames(styles['menu-link'], {\n [styles['menu-link--active']]: isActive || isActiveSingular(props.to as string),\n })\n }\n />\n );\n};\n"],"names":["MenuLink","props","location","useLocation","singularize","str","isActiveSingular","to","currentSegments","latestToPath","singularizedToPath","segment","jsx","NavLink","isActive","classNames","styles"],"mappings":";;;;;;GASaA,IAAW,CAACC,MAAuC;AAC9D,QAAMC,IAAWC,EAAY,GAGvBC,IAAc,CAACC,MAAgBA,EAAI,QAAQ,MAAM,EAAE,GAGnDC,IAAmB,CAACC,MAAe;AACvC,UAAMC,IAAkBN,EAAS,SAAS,MAAM,GAAG,EAAE,OAAO,OAAO,GAC7DO,IAAeF,EAAG,MAAM,GAAG,EAAE,OAAO,OAAO,EAAE,MAAM,EAAE,EAAE,CAAC,GACxDG,IAAqBN,EAAYK,CAAY;AAEnD,WAAOD,EAAgB,KAAK,CAACG,MAAYP,EAAYO,CAAO,MAAMD,CAAkB;AAAA,EACtF;AAGE,SAAA,gBAAAE;AAAA,IAACC;AAAA,IAAA;AAAA,MACE,GAAGZ;AAAA,MACJ,WAAW,CAAC,EAAE,UAAAa,EAAA,MACZC,EAAWC,EAAO,WAAW,GAAG;AAAA,QAC9B,CAACA,EAAO,mBAAmB,CAAC,GAAGF,KAAYR,EAAiBL,EAAM,EAAY;AAAA,MAC/E,CAAA;AAAA,IAAA;AAAA,EAEL;AAEJ;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
2
|
+
import { M as o } from "../../chunk-7R3XDUXW-C-tvzxWq.js";
|
|
3
3
|
import { MenuLink as t } from "./MenuLink.js";
|
|
4
4
|
import '../../assets/MenuLink2.css';const r = `
|
|
5
5
|
// Can only be used wrapped in a 'react-router-dom' <MemoryRouter />
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuLink.stories.js","sources":["../../../src/components/MenuLink/MenuLink.stories.tsx"],"sourcesContent":["import { MemoryRouter, type NavLinkProps } from 'react-router
|
|
1
|
+
{"version":3,"file":"MenuLink.stories.js","sources":["../../../src/components/MenuLink/MenuLink.stories.tsx"],"sourcesContent":["import { MemoryRouter, type NavLinkProps } from 'react-router';\n\nimport type { Meta, StoryFn } from '@storybook/react';\n\nimport { MenuLink } from './MenuLink';\n\nimport './MenuLink.stories.css';\n\nconst codeString = `\n// Can only be used wrapped in a 'react-router-dom' <MemoryRouter />\n <MenuLink to={linkUrl}>{children}</MenuLink>\n`;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/MenuLink',\n component: MenuLink,\n parameters: {\n inspectComponent: MenuLink,\n codeString: codeString,\n },\n} as Meta<Omit<NavLinkProps, 'style'>>;\n\nconst menuLinks = [\n { to: '/menu-link-1', title: 'Menu Link One' },\n { to: '/menu-link-2', title: 'Menu Link Two' },\n { to: '/menu-link-3', title: 'Menu Link Three' },\n];\n\nconst Template: StoryFn<Omit<NavLinkProps, 'style'>> = () => {\n return (\n <MemoryRouter initialEntries={menuLinks.map((link) => link.to)} initialIndex={0}>\n <nav className=\"navbar\">\n {menuLinks.map((link) => (\n <MenuLink key={link.to} to={link.to}>\n {link.title}\n </MenuLink>\n ))}\n </nav>\n </MemoryRouter>\n );\n};\n\nexport const MenuLinkExample = Template.bind({});\n"],"names":["codeString","MenuLink_stories","MenuLink","menuLinks","Template","jsx","MemoryRouter","link","MenuLinkExample"],"mappings":";;;AAQA,MAAMA,IAAa;AAAA;AAAA;AAAA,GAMJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAY;AAAA,EAChB,EAAE,IAAI,gBAAgB,OAAO,gBAAgB;AAAA,EAC7C,EAAE,IAAI,gBAAgB,OAAO,gBAAgB;AAAA,EAC7C,EAAE,IAAI,gBAAgB,OAAO,kBAAkB;AACjD,GAEMC,IAAiD,MAElD,gBAAAC,EAAAC,GAAA,EAAa,gBAAgBH,EAAU,IAAI,CAACI,MAASA,EAAK,EAAE,GAAG,cAAc,GAC5E,4BAAC,OAAI,EAAA,WAAU,UACZ,UAAAJ,EAAU,IAAI,CAACI,MACd,gBAAAF,EAACH,KAAuB,IAAIK,EAAK,IAC9B,UAAAA,EAAK,MADO,GAAAA,EAAK,EAEpB,CACD,EACH,CAAA,GACF,GAISC,IAAkBJ,EAAS,KAAK,CAAE,CAAA;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MetaDataList.js","sources":["../../../src/components/MetaDataList/MetaDataList.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport styles from './MetaDataList.module.css';\n\nexport interface MetaDataListProps {\n /** A list of key value pairs to display. The value is be a [ReactNode](https://reactnative.dev/docs/react-node). */\n items: Record<string, ReactNode>;\n}\n\n/** Represents a component of a list of key value pairs. */\nexport const MetaDataList = ({ items }: MetaDataListProps) => (\n <dl className={styles['meta-data-list']}>\n {Object.entries(items).map(([term, description]) => (\n <div key={term} className={styles['meta-data-list__item']}>\n <dt className={styles['meta-data-list__term']}>{term}</dt>\n <dd className={styles['meta-data-list__description']}>{description}</dd>\n </div>\n ))}\n </dl>\n);\n"],"names":["MetaDataList","items","jsx","styles","term","description","jsxs"],"mappings":";;;;;;GAUaA,IAAe,CAAC,EAAE,OAAAC,EAAM,MAClC,gBAAAC,EAAA,MAAA,EAAG,WAAWC,EAAO,gBAAgB,GACnC,UAAO,OAAA,QAAQF,CAAK,EAAE,IAAI,CAAC,CAACG,GAAMC,CAAW,MAC5C,gBAAAC,EAAC,OAAe,EAAA,WAAWH,EAAO,sBAAsB,GACtD,UAAA;AAAA,EAAA,gBAAAD,EAAC,MAAG,EAAA,WAAWC,EAAO,sBAAsB,GAAI,UAAKC,GAAA;AAAA,oBACpD,MAAG,EAAA,WAAWD,EAAO,6BAA6B,GAAI,UAAYE,
|
|
1
|
+
{"version":3,"file":"MetaDataList.js","sources":["../../../src/components/MetaDataList/MetaDataList.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport styles from './MetaDataList.module.css';\n\nexport interface MetaDataListProps {\n /** A list of key value pairs to display. The value is be a [ReactNode](https://reactnative.dev/docs/react-node). */\n items: Record<string, ReactNode>;\n}\n\n/** Represents a component of a list of key value pairs. */\nexport const MetaDataList = ({ items }: MetaDataListProps) => (\n <dl className={styles['meta-data-list']}>\n {Object.entries(items).map(([term, description]) => (\n <div key={term} className={styles['meta-data-list__item']}>\n <dt className={styles['meta-data-list__term']}>{term}</dt>\n <dd className={styles['meta-data-list__description']}>{description}</dd>\n </div>\n ))}\n </dl>\n);\n"],"names":["MetaDataList","items","jsx","styles","term","description","jsxs"],"mappings":";;;;;;GAUaA,IAAe,CAAC,EAAE,OAAAC,EAAM,MAClC,gBAAAC,EAAA,MAAA,EAAG,WAAWC,EAAO,gBAAgB,GACnC,UAAO,OAAA,QAAQF,CAAK,EAAE,IAAI,CAAC,CAACG,GAAMC,CAAW,MAC5C,gBAAAC,EAAC,OAAe,EAAA,WAAWH,EAAO,sBAAsB,GACtD,UAAA;AAAA,EAAA,gBAAAD,EAAC,MAAG,EAAA,WAAWC,EAAO,sBAAsB,GAAI,UAAKC,GAAA;AAAA,oBACpD,MAAG,EAAA,WAAWD,EAAO,6BAA6B,GAAI,UAAYE,EAAA,CAAA;AAAA,EAF3D,GAAAD,CAGV,CACD,EACH,CAAA;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MetaDataList.stories.js","sources":["../../../src/components/MetaDataList/MetaDataList.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { MetaDataListProps } from './MetaDataList';\n\nimport { MetaDataList } from './MetaDataList';\n\nimport { Container } from 'storyComponents/Container/';\n\nconst codeString = '<MetaDataList items={items} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/MetaDataList',\n component: MetaDataList,\n parameters: {\n inspectComponent: MetaDataList,\n codeString: codeString,\n },\n} as Meta<MetaDataListProps>;\n\nconst Template: StoryFn<MetaDataListProps> = (args) => (\n <Container>\n <MetaDataList {...args} />\n </Container>\n);\n\nexport const MetaDataListExample = Template.bind({});\nMetaDataListExample.args = {\n items: {\n 'item one': 'foo',\n 'item two': 'bar',\n 'item three': 'baz',\n },\n};\n"],"names":["codeString","MetaDataList_stories","MetaDataList","Template","args","jsx","Container","MetaDataListExample"],"mappings":";;;AAOA,MAAMA,IAAa,kCAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,
|
|
1
|
+
{"version":3,"file":"MetaDataList.stories.js","sources":["../../../src/components/MetaDataList/MetaDataList.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { MetaDataListProps } from './MetaDataList';\n\nimport { MetaDataList } from './MetaDataList';\n\nimport { Container } from 'storyComponents/Container/';\n\nconst codeString = '<MetaDataList items={items} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/MetaDataList',\n component: MetaDataList,\n parameters: {\n inspectComponent: MetaDataList,\n codeString: codeString,\n },\n} as Meta<MetaDataListProps>;\n\nconst Template: StoryFn<MetaDataListProps> = (args) => (\n <Container>\n <MetaDataList {...args} />\n </Container>\n);\n\nexport const MetaDataListExample = Template.bind({});\nMetaDataListExample.args = {\n items: {\n 'item one': 'foo',\n 'item two': 'bar',\n 'item three': 'baz',\n },\n};\n"],"names":["codeString","MetaDataList_stories","MetaDataList","Template","args","jsx","Container","MetaDataListExample"],"mappings":";;;AAOA,MAAMA,IAAa,kCAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAuC,CAACC,MAC5C,gBAAAC,EAACC,KACC,UAAC,gBAAAD,EAAAH,GAAA,EAAc,GAAGE,EAAA,CAAM,EAC1B,CAAA,GAGWG,IAAsBJ,EAAS,KAAK,CAAE,CAAA;AACnDI,EAAoB,OAAO;AAAA,EACzB,OAAO;AAAA,IACL,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,cAAc;AAAA,EAAA;AAElB;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModalDialog.js","sources":["../../../src/components/ModalDialog/ModalDialog.tsx"],"sourcesContent":["import { useDialog } from '@react-aria/dialog';\nimport { FocusScope } from '@react-aria/focus';\nimport { OverlayContainer, useModal, useOverlay, usePreventScroll } from '@react-aria/overlays';\nimport classNames from 'clsx';\nimport { useEffect, useRef, useState } from 'react';\n\nimport type { FormHTMLAttributes, KeyboardEvent, PropsWithChildren, ReactNode } from 'react';\nimport type { AriaDialogProps } from '@react-types/dialog';\n\nimport styles from './ModalDialog.module.css';\n\nimport { Backdrop } from 'components/Backdrop';\nimport { OverlayCloseButton } from 'components/OverlayCloseButton';\nimport { Spinner } from 'components/Spinner';\n\nexport interface ModalDialogProps {\n /** The buttons of the dialog. */\n buttons?: ReactNode;\n /** `true` if the dialog can be closed by clicking outside of it; otherwise, `false`. The default is `false`. */\n isDismissable?: boolean;\n /** `true` to disable closing the dialog with the keyboard; otherwise, `false`. The default is `false`. */\n isKeyboardDismissDisabled?: boolean;\n /** `true` to show a spinner, if the contents of the dialog is lazy loaded; otherwise, `false`. The default is `false`. */\n isLoading?: boolean;\n /** The `aria-valuetext` value of the [Spinner](/story/atoms-spinner--spinner-example) component. The default is `'Loading'` Used together with `isLoading`. */\n spinnerAriaValueText?: string;\n /** The `aria-label` value of the [OverlayCloseButton](/story/atoms-overlayclosebutton--overlay-close-button-example) component. The default is `'Close'` */\n closeButtonAriaValueText?: string;\n /** `true` to render the dialog opened; otherwise, `false`. The default is `false`. */\n isOpen: boolean;\n /** `true` to disable form validation; otherwise, `false`. The default is `false`. */\n noValidate?: boolean;\n /** The callback function that is invoked when the dialog is closed. */\n onClose?(): void;\n /** The callback function that is invoked when the form is submitted. */\n onSubmit?: FormHTMLAttributes<HTMLFormElement>['onSubmit'];\n /** The `aria-role` value of the dialog. Possible values are `'dialog'`, `'alertdialog'`. The default is `'dialog'`. */\n role?: AriaDialogProps['role'];\n /** The title of the dialog. */\n title?: string;\n /** The contents of the dialog header. */\n headerContent?: ReactNode;\n /** The variant of the dialog. */\n variant?: 'confirm' | 'dialog';\n /** `true` to add padding to the dialog; otherwise, `false`. The default is `false`. */\n padded?: boolean;\n /** `true` to display the dialog in a slimmer form; otherwise, `false`. The default is `false`. */\n slim?: boolean;\n /** `true` to display the dialog in a wider form; otherwise, `false`. The default is `false`. */\n wide?: boolean;\n /** `true` to show a border between the main content of the dialog and the buttons; otherwise, `false`. The default is `false`. */\n noButtonBorder?: boolean;\n}\n\n/** Represents a component for a modal dialog. */\nexport function ModalDialog(props: PropsWithChildren<ModalDialogProps>) {\n const {\n buttons,\n children,\n isDismissable = true,\n isKeyboardDismissDisabled = !isDismissable,\n isLoading,\n spinnerAriaValueText = 'Loading',\n closeButtonAriaValueText = 'Close',\n isOpen,\n noValidate = false,\n onClose,\n onSubmit,\n role = 'dialog',\n title,\n headerContent,\n variant = 'dialog',\n padded,\n slim,\n wide,\n noButtonBorder = false,\n } = props;\n\n const ref = useRef<HTMLDivElement>(null);\n const formRef = useRef<HTMLFormElement>(null);\n const [isScrollable, setIsScrollable] = useState(false);\n const [isScrolledToBottom, setIsScrolledToBottom] = useState(false);\n\n const { dialogProps, titleProps } = useDialog({ role }, ref);\n const { modalProps } = useModal({ isDisabled: !isOpen });\n const { overlayProps, underlayProps } = useOverlay(\n { isDismissable, isKeyboardDismissDisabled, isOpen, onClose },\n ref\n );\n\n usePreventScroll({ isDisabled: !isOpen });\n\n useEffect(() => {\n const formElement = formRef.current;\n\n function checkScrollable() {\n if (formElement) {\n const scrollHeight = formElement.scrollHeight;\n const clientHeight = formElement.clientHeight;\n const scrollTop = formElement.scrollTop;\n\n setIsScrollable(scrollHeight > clientHeight);\n setIsScrolledToBottom(scrollTop + clientHeight >= scrollHeight);\n }\n }\n\n function handleScrollAndResize() {\n checkScrollable();\n }\n\n if (formElement) {\n formElement.addEventListener('scroll', handleScrollAndResize);\n window.addEventListener('resize', handleScrollAndResize);\n }\n\n const timeoutId = setTimeout(() => {\n checkScrollable();\n }, 0);\n\n return () => {\n if (formElement) {\n formElement.removeEventListener('scroll', handleScrollAndResize);\n }\n window.removeEventListener('resize', handleScrollAndResize);\n clearTimeout(timeoutId);\n };\n }, [isOpen, headerContent]);\n\n function onKeyUp(event: KeyboardEvent) {\n event.stopPropagation();\n }\n\n if (!isOpen) return null;\n\n return (\n <OverlayContainer>\n <Backdrop {...underlayProps}>\n {isLoading ? (\n <Spinner ariaValueText={spinnerAriaValueText} />\n ) : (\n <>\n {/* eslint-disable-next-line jsx-a11y/no-autofocus */}\n <FocusScope autoFocus contain restoreFocus>\n <div\n {...dialogProps}\n {...modalProps}\n {...overlayProps}\n className={classNames(styles['modal-dialog'], {\n [styles['modal-dialog--confirm']]: variant === 'confirm',\n [styles['modal-dialog--padded']]: padded,\n [styles['modal-dialog--slim']]: slim,\n [styles['modal-dialog--wide']]: wide,\n })}\n onKeyUp={onKeyUp}\n role=\"presentation\"\n ref={ref}\n >\n {(title || headerContent) && variant === 'dialog' && (\n <>\n {title && (\n <h1 {...titleProps} className={styles['modal-dialog__title']}>\n {title}\n </h1>\n )}\n {headerContent}\n {variant === 'dialog' && (\n <span className={styles['modal-dialog__close']}>\n <OverlayCloseButton\n aria-label={closeButtonAriaValueText}\n onClick={onClose}\n paddedModal={padded}\n />\n </span>\n )}\n </>\n )}\n <form\n className={classNames(styles['modal-dialog__content'], {\n [styles['modal-dialog--content-with-buttons']]: buttons,\n })}\n onSubmit={onSubmit}\n noValidate={noValidate}\n ref={formRef}\n >\n <div className={classNames({ [styles['modal-dialog__children']]: !noButtonBorder })}>{children}</div>\n {buttons && (\n <div\n className={classNames(styles['modal-dialog__buttons'], {\n [styles['modal-dialog__buttons--border']]: !noButtonBorder,\n [styles['modal-dialog__buttons--shadow']]: isScrollable && !isScrolledToBottom,\n })}\n >\n {buttons}\n </div>\n )}\n </form>\n </div>\n </FocusScope>\n </>\n )}\n </Backdrop>\n </OverlayContainer>\n );\n}\n"],"names":["ModalDialog","props","buttons","children","isDismissable","isKeyboardDismissDisabled","isLoading","spinnerAriaValueText","closeButtonAriaValueText","isOpen","noValidate","onClose","onSubmit","role","title","headerContent","variant","padded","slim","wide","noButtonBorder","ref","useRef","formRef","isScrollable","setIsScrollable","useState","isScrolledToBottom","setIsScrolledToBottom","dialogProps","titleProps","useDialog","modalProps","useModal","overlayProps","underlayProps","useOverlay","usePreventScroll","useEffect","formElement","checkScrollable","scrollHeight","clientHeight","scrollTop","handleScrollAndResize","timeoutId","onKeyUp","event","jsx","OverlayContainer","Backdrop","Spinner","Fragment","FocusScope","jsxs","classNames","styles","OverlayCloseButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAuDO,SAASA,GAAYC,GAA4C;AAChE,QAAA;AAAA,IACJ,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,eAAAC,IAAgB;AAAA,IAChB,2BAAAC,IAA4B,CAACD;AAAA,IAC7B,WAAAE;AAAA,IACA,sBAAAC,IAAuB;AAAA,IACvB,0BAAAC,IAA2B;AAAA,IAC3B,QAAAC;AAAA,IACA,YAAAC,IAAa;AAAA,IACb,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,OAAAC;AAAA,IACA,eAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,QAAAC;AAAA,IACA,MAAAC;AAAA,IACA,MAAAC;AAAA,IACA,gBAAAC,IAAiB;AAAA,EACf,IAAAnB,GAEEoB,IAAMC,EAAuB,IAAI,GACjCC,IAAUD,EAAwB,IAAI,GACtC,CAACE,GAAcC,CAAe,IAAIC,EAAS,EAAK,GAChD,CAACC,GAAoBC,CAAqB,IAAIF,EAAS,EAAK,GAE5D,EAAE,aAAAG,GAAa,YAAAC,EAAW,IAAIC,EAAU,EAAE,MAAAlB,EAAA,GAAQQ,CAAG,GACrD,EAAE,YAAAW,MAAeC,EAAS,EAAE,YAAY,CAACxB,GAAQ,GACjD,EAAE,cAAAyB,GAAc,eAAAC,EAAA,IAAkBC;AAAA,IACtC,EAAE,eAAAhC,GAAe,2BAAAC,GAA2B,QAAAI,GAAQ,SAAAE,EAAQ;AAAA,IAC5DU;AAAA,EAAA;AAGF,EAAAgB,EAAiB,EAAE,YAAY,CAAC5B,EAAQ,CAAA,GAExC6B,EAAU,MAAM;AACd,UAAMC,IAAchB,EAAQ;AAE5B,aAASiB,IAAkB;AACzB,UAAID,GAAa;AACf,cAAME,IAAeF,EAAY,cAC3BG,IAAeH,EAAY,cAC3BI,IAAYJ,EAAY;AAE9B,QAAAd,EAAgBgB,IAAeC,CAAY,GACrBd,EAAAe,IAAYD,KAAgBD,CAAY;AAAA,MAChE;AAAA,IACF;AAEA,aAASG,IAAwB;AACf,MAAAJ;IAClB;AAEA,IAAID,MACUA,EAAA,iBAAiB,UAAUK,CAAqB,GACrD,OAAA,iBAAiB,UAAUA,CAAqB;AAGnD,UAAAC,IAAY,WAAW,MAAM;AACjB,MAAAL;OACf,CAAC;AAEJ,WAAO,MAAM;AACX,MAAID,KACUA,EAAA,oBAAoB,UAAUK,CAAqB,GAE1D,OAAA,oBAAoB,UAAUA,CAAqB,GAC1D,aAAaC,CAAS;AAAA,IAAA;AAAA,EACxB,GACC,CAACpC,GAAQM,CAAa,CAAC;AAE1B,WAAS+B,EAAQC,GAAsB;AACrC,IAAAA,EAAM,gBAAgB;AAAA,EACxB;AAEI,SAACtC,IAGH,gBAAAuC,EAACC,KACC,UAAC,gBAAAD,EAAAE,GAAA,EAAU,GAAGf,GACX,UAAA7B,sBACE6C,IAAQ,EAAA,eAAe5C,GAAsB,IAE9C,gBAAAyC,EAAAI,GAAA,EAEE,4BAACC,GAAW,EAAA,WAAS,IAAC,SAAO,IAAC,cAAY,IACxC,UAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGzB;AAAA,MACH,GAAGG;AAAA,MACH,GAAGE;AAAA,MACJ,WAAWqB,EAAWC,EAAO,cAAc,GAAG;AAAA,QAC5C,CAACA,EAAO,uBAAuB,CAAC,GAAGxC,MAAY;AAAA,QAC/C,CAACwC,EAAO,sBAAsB,CAAC,GAAGvC;AAAA,QAClC,CAACuC,EAAO,oBAAoB,CAAC,GAAGtC;AAAA,QAChC,CAACsC,EAAO,oBAAoB,CAAC,GAAGrC;AAAA,MAAA,CACjC;AAAA,MACD,SAAA2B;AAAA,MACA,MAAK;AAAA,MACL,KAAAzB;AAAA,MAEE,UAAA;AAAA,SAASP,KAAAC,MAAkBC,MAAY,YAEpC,gBAAAsC,EAAAF,GAAA,EAAA,UAAA;AAAA,UACCtC,KAAA,gBAAAkC,EAAC,QAAI,GAAGlB,GAAY,WAAW0B,EAAO,qBAAqB,GACxD,UACH1C,EAAA,CAAA;AAAA,UAEDC;AAAA,UACAC,MAAY,YACX,gBAAAgC,EAAC,UAAK,WAAWQ,EAAO,qBAAqB,GAC3C,UAAA,gBAAAR;AAAA,YAACS;AAAA,YAAA;AAAA,cACC,cAAYjD;AAAA,cACZ,SAASG;AAAA,cACT,aAAaM;AAAA,YAAA;AAAA,UAAA,GAEjB;AAAA,QAAA,GAEJ;AAAA,QAEF,gBAAAqC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWC,EAAWC,EAAO,uBAAuB,GAAG;AAAA,cACrD,CAACA,EAAO,oCAAoC,CAAC,GAAGtD;AAAA,YAAA,CACjD;AAAA,YACD,UAAAU;AAAA,YACA,YAAAF;AAAA,YACA,KAAKa;AAAA,YAEL,UAAA;AAAA,cAAA,gBAAAyB,EAAC,OAAI,EAAA,WAAWO,EAAW,EAAE,CAACC,EAAO,wBAAwB,CAAC,GAAG,CAACpC,GAAgB,GAAI,UAAAjB,EAAS,CAAA;AAAA,cAC9FD,KACC,gBAAA8C;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAWO,EAAWC,EAAO,uBAAuB,GAAG;AAAA,oBACrD,CAACA,EAAO,+BAA+B,CAAC,GAAG,CAACpC;AAAA,oBAC5C,CAACoC,EAAO,+BAA+B,CAAC,GAAGhC,KAAgB,CAACG;AAAA,kBAAA,CAC7D;AAAA,kBAEA,UAAAzB;AAAA,gBAAA;AAAA,cACH;AAAA,YAAA;AAAA,UAAA;AAAA,QAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,EAAA,CACF,EACF,CAAA,GAEJ,EACF,CAAA,IArEkB;AAuEtB;"}
|
|
1
|
+
{"version":3,"file":"ModalDialog.js","sources":["../../../src/components/ModalDialog/ModalDialog.tsx"],"sourcesContent":["import { useDialog } from '@react-aria/dialog';\nimport { FocusScope } from '@react-aria/focus';\nimport { OverlayContainer, useModal, useOverlay, usePreventScroll } from '@react-aria/overlays';\nimport classNames from 'clsx';\nimport { useEffect, useRef, useState } from 'react';\n\nimport type { FormHTMLAttributes, KeyboardEvent, PropsWithChildren, ReactNode } from 'react';\nimport type { AriaDialogProps } from '@react-types/dialog';\n\nimport styles from './ModalDialog.module.css';\n\nimport { Backdrop } from 'components/Backdrop';\nimport { OverlayCloseButton } from 'components/OverlayCloseButton';\nimport { Spinner } from 'components/Spinner';\n\nexport interface ModalDialogProps {\n /** The buttons of the dialog. */\n buttons?: ReactNode;\n /** `true` if the dialog can be closed by clicking outside of it; otherwise, `false`. The default is `false`. */\n isDismissable?: boolean;\n /** `true` to disable closing the dialog with the keyboard; otherwise, `false`. The default is `false`. */\n isKeyboardDismissDisabled?: boolean;\n /** `true` to show a spinner, if the contents of the dialog is lazy loaded; otherwise, `false`. The default is `false`. */\n isLoading?: boolean;\n /** The `aria-valuetext` value of the [Spinner](/story/atoms-spinner--spinner-example) component. The default is `'Loading'` Used together with `isLoading`. */\n spinnerAriaValueText?: string;\n /** The `aria-label` value of the [OverlayCloseButton](/story/atoms-overlayclosebutton--overlay-close-button-example) component. The default is `'Close'` */\n closeButtonAriaValueText?: string;\n /** `true` to render the dialog opened; otherwise, `false`. The default is `false`. */\n isOpen: boolean;\n /** `true` to disable form validation; otherwise, `false`. The default is `false`. */\n noValidate?: boolean;\n /** The callback function that is invoked when the dialog is closed. */\n onClose?(): void;\n /** The callback function that is invoked when the form is submitted. */\n onSubmit?: FormHTMLAttributes<HTMLFormElement>['onSubmit'];\n /** The `aria-role` value of the dialog. Possible values are `'dialog'`, `'alertdialog'`. The default is `'dialog'`. */\n role?: AriaDialogProps['role'];\n /** The title of the dialog. */\n title?: string;\n /** The contents of the dialog header. */\n headerContent?: ReactNode;\n /** The variant of the dialog. */\n variant?: 'confirm' | 'dialog';\n /** `true` to add padding to the dialog; otherwise, `false`. The default is `false`. */\n padded?: boolean;\n /** `true` to display the dialog in a slimmer form; otherwise, `false`. The default is `false`. */\n slim?: boolean;\n /** `true` to display the dialog in a wider form; otherwise, `false`. The default is `false`. */\n wide?: boolean;\n /** `true` to show a border between the main content of the dialog and the buttons; otherwise, `false`. The default is `false`. */\n noButtonBorder?: boolean;\n}\n\n/** Represents a component for a modal dialog. */\nexport function ModalDialog(props: PropsWithChildren<ModalDialogProps>) {\n const {\n buttons,\n children,\n isDismissable = true,\n isKeyboardDismissDisabled = !isDismissable,\n isLoading,\n spinnerAriaValueText = 'Loading',\n closeButtonAriaValueText = 'Close',\n isOpen,\n noValidate = false,\n onClose,\n onSubmit,\n role = 'dialog',\n title,\n headerContent,\n variant = 'dialog',\n padded,\n slim,\n wide,\n noButtonBorder = false,\n } = props;\n\n const ref = useRef<HTMLDivElement>(null);\n const formRef = useRef<HTMLFormElement>(null);\n const [isScrollable, setIsScrollable] = useState(false);\n const [isScrolledToBottom, setIsScrolledToBottom] = useState(false);\n\n const { dialogProps, titleProps } = useDialog({ role }, ref);\n const { modalProps } = useModal({ isDisabled: !isOpen });\n const { overlayProps, underlayProps } = useOverlay(\n { isDismissable, isKeyboardDismissDisabled, isOpen, onClose },\n ref\n );\n\n usePreventScroll({ isDisabled: !isOpen });\n\n useEffect(() => {\n const formElement = formRef.current;\n\n function checkScrollable() {\n if (formElement) {\n const scrollHeight = formElement.scrollHeight;\n const clientHeight = formElement.clientHeight;\n const scrollTop = formElement.scrollTop;\n\n setIsScrollable(scrollHeight > clientHeight);\n setIsScrolledToBottom(scrollTop + clientHeight >= scrollHeight);\n }\n }\n\n function handleScrollAndResize() {\n checkScrollable();\n }\n\n if (formElement) {\n formElement.addEventListener('scroll', handleScrollAndResize);\n window.addEventListener('resize', handleScrollAndResize);\n }\n\n const timeoutId = setTimeout(() => {\n checkScrollable();\n }, 0);\n\n return () => {\n if (formElement) {\n formElement.removeEventListener('scroll', handleScrollAndResize);\n }\n window.removeEventListener('resize', handleScrollAndResize);\n clearTimeout(timeoutId);\n };\n }, [isOpen, headerContent]);\n\n function onKeyUp(event: KeyboardEvent) {\n event.stopPropagation();\n }\n\n if (!isOpen) return null;\n\n return (\n <OverlayContainer>\n <Backdrop {...underlayProps}>\n {isLoading ? (\n <Spinner ariaValueText={spinnerAriaValueText} />\n ) : (\n <>\n {/* eslint-disable-next-line jsx-a11y/no-autofocus */}\n <FocusScope autoFocus contain restoreFocus>\n <div\n {...dialogProps}\n {...modalProps}\n {...overlayProps}\n className={classNames(styles['modal-dialog'], {\n [styles['modal-dialog--confirm']]: variant === 'confirm',\n [styles['modal-dialog--padded']]: padded,\n [styles['modal-dialog--slim']]: slim,\n [styles['modal-dialog--wide']]: wide,\n })}\n onKeyUp={onKeyUp}\n role=\"presentation\"\n ref={ref}\n >\n {(title || headerContent) && variant === 'dialog' && (\n <>\n {title && (\n <h1 {...titleProps} className={styles['modal-dialog__title']}>\n {title}\n </h1>\n )}\n {headerContent}\n {variant === 'dialog' && (\n <span className={styles['modal-dialog__close']}>\n <OverlayCloseButton\n aria-label={closeButtonAriaValueText}\n onClick={onClose}\n paddedModal={padded}\n />\n </span>\n )}\n </>\n )}\n <form\n className={classNames(styles['modal-dialog__content'], {\n [styles['modal-dialog--content-with-buttons']]: buttons,\n })}\n onSubmit={onSubmit}\n noValidate={noValidate}\n ref={formRef}\n >\n <div className={classNames({ [styles['modal-dialog__children']]: !noButtonBorder })}>{children}</div>\n {buttons && (\n <div\n className={classNames(styles['modal-dialog__buttons'], {\n [styles['modal-dialog__buttons--border']]: !noButtonBorder,\n [styles['modal-dialog__buttons--shadow']]: isScrollable && !isScrolledToBottom,\n })}\n >\n {buttons}\n </div>\n )}\n </form>\n </div>\n </FocusScope>\n </>\n )}\n </Backdrop>\n </OverlayContainer>\n );\n}\n"],"names":["ModalDialog","props","buttons","children","isDismissable","isKeyboardDismissDisabled","isLoading","spinnerAriaValueText","closeButtonAriaValueText","isOpen","noValidate","onClose","onSubmit","role","title","headerContent","variant","padded","slim","wide","noButtonBorder","ref","useRef","formRef","isScrollable","setIsScrollable","useState","isScrolledToBottom","setIsScrolledToBottom","dialogProps","titleProps","useDialog","modalProps","useModal","overlayProps","underlayProps","useOverlay","usePreventScroll","useEffect","formElement","checkScrollable","scrollHeight","clientHeight","scrollTop","handleScrollAndResize","timeoutId","onKeyUp","event","jsx","OverlayContainer","Backdrop","Spinner","Fragment","FocusScope","jsxs","classNames","styles","OverlayCloseButton"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsxs as a, jsx as e } from "react/jsx-runtime";
|
|
2
2
|
import { ModalProvider as l } from "@react-aria/overlays";
|
|
3
|
-
import { fn as i } from "../../index-
|
|
3
|
+
import { fn as i } from "../../index-DWzkl4aY.js";
|
|
4
4
|
import { ModalDialog as t } from "./ModalDialog.js";
|
|
5
5
|
import { Button as n } from "../Buttons/Button.js";
|
|
6
6
|
import "../Buttons/LinkButton.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModalDialog.stories.js","sources":["../../../src/components/ModalDialog/ModalDialog.stories.tsx"],"sourcesContent":["import { ModalProvider } from '@react-aria/overlays';\nimport { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { ModalDialogProps } from './ModalDialog';\n\nimport { ModalDialog } from './ModalDialog';\n\nimport { Button } from 'components/Buttons';\nimport { ButtonGroup } from 'components/ButtonGroup';\nimport { FormField } from 'components/FormField';\nimport { InputField } from 'components/InputField';\nimport { Label } from 'components/Label';\n\nconst codeString = `\n/* ModalDialog has more styling props (see Info-tab).\n Code example is made with the most commonly used props. **/\n <ModalDialog isOpen={isOpen} title={title} onClose={onCloseFunction}\n onSubmit={onSubmitFunction} buttons={buttons}> {children} </ModalDialog>\n`;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Molecules/ModalDialog',\n component: ModalDialog,\n argTypes: {\n isOpen: {\n table: {\n disable: true,\n },\n },\n noValidate: {\n control: 'boolean',\n },\n role: {\n control: 'radio',\n options: ['dialog', 'alertdialog'],\n },\n onSubmit: {\n table: {\n disable: true,\n },\n },\n onClose: {\n table: {\n disable: true,\n },\n },\n buttons: {\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n inspectComponent: ModalDialog,\n codeString: codeString,\n },\n} as Meta<ModalDialogProps>;\n\nconst Template: StoryFn<ModalDialogProps> = (args: ModalDialogProps) => (\n <ModalProvider>\n <ModalDialog {...args}>\n <FormField outerSpace>\n <Label htmlFor=\"text-field\">Example Text Field</Label>\n <InputField id=\"text-field\" />\n </FormField>\n </ModalDialog>\n </ModalProvider>\n);\n\nconst defaultArgs: Partial<ModalDialogProps> = {\n padded: false,\n slim: false,\n wide: false,\n noButtonBorder: false,\n variant: 'dialog',\n role: 'dialog',\n title: 'Example Title',\n closeButtonAriaValueText: 'Close',\n noValidate: false,\n onSubmit: fn(),\n onClose: fn(),\n buttons: (\n <ButtonGroup reversed>\n <Button variant=\"primary\" onClick={fn()}>\n OK\n </Button>\n <Button variant=\"secondary\" onClick={fn()}>\n Cancel\n </Button>\n </ButtonGroup>\n ),\n isOpen: true,\n};\n\nexport const ModalDialogExample = Template.bind({});\nModalDialogExample.args = {\n ...defaultArgs,\n};\n\nexport const Loading = Template.bind({});\nLoading.args = {\n ...defaultArgs,\n isLoading: true,\n spinnerAriaValueText: 'Loading',\n};\n\nconst LongContentTemplate: StoryFn<ModalDialogProps> = (args: ModalDialogProps) => (\n <ModalProvider>\n <ModalDialog {...args}>\n <FormField outerSpace>\n <div>\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac dui et nibh eleifend ultricies a id nulla.\n Pellentesque eleifend sem a tellus dictum tempus. Proin non leo id risus placerat vulputate at ac erat. Ut\n fringilla imperdiet sollicitudin. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere\n cubilia curae; Cras molestie ante ac magna ornare rhoncus non at quam. Mauris elementum luctus euismod.\n Pellentesque molestie malesuada purus, sed egestas lacus interdum sit amet. Morbi blandit lacus sit amet\n dictum pulvinar. Ut semper nunc ac enim imperdiet, non interdum diam gravida. In nunc tortor, mollis ac\n molestie dignissim, elementum sed quam. Suspendisse mollis venenatis libero, pellentesque vestibulum elit\n consequat et. Aliquam fringilla tellus id libero tempus, sit amet suscipit augue tristique. Quisque cursus\n neque vel justo tristique, eget semper turpis elementum. Etiam venenatis mattis sapien ac mattis. Mauris vitae\n ultrices erat.\n </div>\n <div>\n Aliquam facilisis massa sed justo rhoncus bibendum. Sed lobortis urna orci, vitae porta leo placerat nec. Nam\n porta porttitor ornare. Suspendisse vehicula nunc nec egestas finibus. Aliquam non luctus risus. Phasellus ac\n diam tincidunt, bibendum sem eget, sollicitudin neque. Curabitur mauris risus, feugiat ac euismod non,\n vulputate ac justo. Curabitur pretium vehicula augue, blandit porta odio rutrum sit amet. Proin semper enim ut\n sapien tempor, a ornare ipsum faucibus.\n </div>\n </FormField>\n </ModalDialog>\n </ModalProvider>\n);\n\nexport const WithLongContentAndNoBorder = LongContentTemplate.bind({});\nWithLongContentAndNoBorder.args = {\n ...defaultArgs,\n noButtonBorder: true,\n};\n"],"names":["codeString","ModalDialog_stories","ModalDialog","Template","args","jsx","ModalProvider","jsxs","FormField","Label","InputField","defaultArgs","fn","ButtonGroup","Button","ModalDialogExample","Loading","LongContentTemplate","WithLongContentAndNoBorder"],"mappings":";;;;;;;;;;;AAcA,MAAMA,IAAa;AAAA;AAAA;AAAA;AAAA;AAAA,GAQJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,QAAQ;AAAA,MACN,OAAO;AAAA,QACL,SAAS;AAAA,
|
|
1
|
+
{"version":3,"file":"ModalDialog.stories.js","sources":["../../../src/components/ModalDialog/ModalDialog.stories.tsx"],"sourcesContent":["import { ModalProvider } from '@react-aria/overlays';\nimport { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { ModalDialogProps } from './ModalDialog';\n\nimport { ModalDialog } from './ModalDialog';\n\nimport { Button } from 'components/Buttons';\nimport { ButtonGroup } from 'components/ButtonGroup';\nimport { FormField } from 'components/FormField';\nimport { InputField } from 'components/InputField';\nimport { Label } from 'components/Label';\n\nconst codeString = `\n/* ModalDialog has more styling props (see Info-tab).\n Code example is made with the most commonly used props. **/\n <ModalDialog isOpen={isOpen} title={title} onClose={onCloseFunction}\n onSubmit={onSubmitFunction} buttons={buttons}> {children} </ModalDialog>\n`;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Molecules/ModalDialog',\n component: ModalDialog,\n argTypes: {\n isOpen: {\n table: {\n disable: true,\n },\n },\n noValidate: {\n control: 'boolean',\n },\n role: {\n control: 'radio',\n options: ['dialog', 'alertdialog'],\n },\n onSubmit: {\n table: {\n disable: true,\n },\n },\n onClose: {\n table: {\n disable: true,\n },\n },\n buttons: {\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n inspectComponent: ModalDialog,\n codeString: codeString,\n },\n} as Meta<ModalDialogProps>;\n\nconst Template: StoryFn<ModalDialogProps> = (args: ModalDialogProps) => (\n <ModalProvider>\n <ModalDialog {...args}>\n <FormField outerSpace>\n <Label htmlFor=\"text-field\">Example Text Field</Label>\n <InputField id=\"text-field\" />\n </FormField>\n </ModalDialog>\n </ModalProvider>\n);\n\nconst defaultArgs: Partial<ModalDialogProps> = {\n padded: false,\n slim: false,\n wide: false,\n noButtonBorder: false,\n variant: 'dialog',\n role: 'dialog',\n title: 'Example Title',\n closeButtonAriaValueText: 'Close',\n noValidate: false,\n onSubmit: fn(),\n onClose: fn(),\n buttons: (\n <ButtonGroup reversed>\n <Button variant=\"primary\" onClick={fn()}>\n OK\n </Button>\n <Button variant=\"secondary\" onClick={fn()}>\n Cancel\n </Button>\n </ButtonGroup>\n ),\n isOpen: true,\n};\n\nexport const ModalDialogExample = Template.bind({});\nModalDialogExample.args = {\n ...defaultArgs,\n};\n\nexport const Loading = Template.bind({});\nLoading.args = {\n ...defaultArgs,\n isLoading: true,\n spinnerAriaValueText: 'Loading',\n};\n\nconst LongContentTemplate: StoryFn<ModalDialogProps> = (args: ModalDialogProps) => (\n <ModalProvider>\n <ModalDialog {...args}>\n <FormField outerSpace>\n <div>\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac dui et nibh eleifend ultricies a id nulla.\n Pellentesque eleifend sem a tellus dictum tempus. Proin non leo id risus placerat vulputate at ac erat. Ut\n fringilla imperdiet sollicitudin. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere\n cubilia curae; Cras molestie ante ac magna ornare rhoncus non at quam. Mauris elementum luctus euismod.\n Pellentesque molestie malesuada purus, sed egestas lacus interdum sit amet. Morbi blandit lacus sit amet\n dictum pulvinar. Ut semper nunc ac enim imperdiet, non interdum diam gravida. In nunc tortor, mollis ac\n molestie dignissim, elementum sed quam. Suspendisse mollis venenatis libero, pellentesque vestibulum elit\n consequat et. Aliquam fringilla tellus id libero tempus, sit amet suscipit augue tristique. Quisque cursus\n neque vel justo tristique, eget semper turpis elementum. Etiam venenatis mattis sapien ac mattis. Mauris vitae\n ultrices erat.\n </div>\n <div>\n Aliquam facilisis massa sed justo rhoncus bibendum. Sed lobortis urna orci, vitae porta leo placerat nec. Nam\n porta porttitor ornare. Suspendisse vehicula nunc nec egestas finibus. Aliquam non luctus risus. Phasellus ac\n diam tincidunt, bibendum sem eget, sollicitudin neque. Curabitur mauris risus, feugiat ac euismod non,\n vulputate ac justo. Curabitur pretium vehicula augue, blandit porta odio rutrum sit amet. Proin semper enim ut\n sapien tempor, a ornare ipsum faucibus.\n </div>\n </FormField>\n </ModalDialog>\n </ModalProvider>\n);\n\nexport const WithLongContentAndNoBorder = LongContentTemplate.bind({});\nWithLongContentAndNoBorder.args = {\n ...defaultArgs,\n noButtonBorder: true,\n};\n"],"names":["codeString","ModalDialog_stories","ModalDialog","Template","args","jsx","ModalProvider","jsxs","FormField","Label","InputField","defaultArgs","fn","ButtonGroup","Button","ModalDialogExample","Loading","LongContentTemplate","WithLongContentAndNoBorder"],"mappings":";;;;;;;;;;;AAcA,MAAMA,IAAa;AAAA;AAAA;AAAA;AAAA;AAAA,GAQJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,QAAQ;AAAA,MACN,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IAEb;AAAA,IACA,YAAY;AAAA,MACV,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,SAAS,CAAC,UAAU,aAAa;AAAA,IACnC;AAAA,IACA,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IAEb;AAAA,IACA,SAAS;AAAA,MACP,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IAEb;AAAA,IACA,SAAS;AAAA,MACP,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,EAEJ;AAAA,EACA,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAsC,CAACC,MAC3C,gBAAAC,EAACC,GACC,EAAA,UAAA,gBAAAD,EAACH,GAAa,EAAA,GAAGE,GACf,UAAA,gBAAAG,EAACC,GAAU,EAAA,YAAU,IACnB,UAAA;AAAA,EAAC,gBAAAH,EAAAI,GAAA,EAAM,SAAQ,cAAa,UAAkB,sBAAA;AAAA,EAC9C,gBAAAJ,EAACK,GAAW,EAAA,IAAG,aAAa,CAAA;AAAA,EAC9B,CAAA,EACF,CAAA,GACF,GAGIC,IAAyC;AAAA,EAC7C,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,MAAM;AAAA,EACN,gBAAgB;AAAA,EAChB,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO;AAAA,EACP,0BAA0B;AAAA,EAC1B,YAAY;AAAA,EACZ,UAAUC,EAAG;AAAA,EACb,SAASA,EAAG;AAAA,EACZ,SACE,gBAAAL,EAACM,GAAY,EAAA,UAAQ,IACnB,UAAA;AAAA,IAAA,gBAAAR,EAACS,KAAO,SAAQ,WAAU,SAASF,KAAM,UAEzC,MAAA;AAAA,sBACCE,GAAO,EAAA,SAAQ,aAAY,SAASF,EAAA,GAAM,UAE3C,SAAA,CAAA;AAAA,EAAA,GACF;AAAA,EAEF,QAAQ;AACV,GAEaG,IAAqBZ,EAAS,KAAK,CAAE,CAAA;AAClDY,EAAmB,OAAO;AAAA,EACxB,GAAGJ;AACL;AAEO,MAAMK,IAAUb,EAAS,KAAK,CAAE,CAAA;AACvCa,EAAQ,OAAO;AAAA,EACb,GAAGL;AAAA,EACH,WAAW;AAAA,EACX,sBAAsB;AACxB;AAEA,MAAMM,IAAiD,CAACb,MACtD,gBAAAC,EAACC,GACC,EAAA,UAAA,gBAAAD,EAACH,GAAa,EAAA,GAAGE,GACf,UAAA,gBAAAG,EAACC,GAAU,EAAA,YAAU,IACnB,UAAA;AAAA,EAAA,gBAAAH,EAAC,SAAI,UAWL,88BAAA,CAAA;AAAA,EACA,gBAAAA,EAAC,SAAI,UAML,4dAAA,CAAA;AAAA,EACF,CAAA,EACF,CAAA,GACF,GAGWa,IAA6BD,EAAoB,KAAK,CAAE,CAAA;AACrEC,EAA2B,OAAO;AAAA,EAChC,GAAGP;AAAA,EACH,gBAAgB;AAClB;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsxs as S, jsx as r } from "react/jsx-runtime";
|
|
2
|
-
import { fn as d } from "../../index-
|
|
2
|
+
import { fn as d } from "../../index-DWzkl4aY.js";
|
|
3
3
|
import { useState as p } from "react";
|
|
4
|
-
import { M as e } from "../../TablePlugin-
|
|
4
|
+
import { M as e } from "../../TablePlugin-ByeOn0Zf.js";
|
|
5
5
|
import { Container as M } from "../../storyComponents/Container/Container.js";
|
|
6
6
|
const C = `
|
|
7
7
|
// MultiSelectHeader can be added optionally
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelect.stories.js","sources":["../../../src/components/MultiSelect/MultiSelect.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\nimport { useState } from 'react';\n\nimport type { ChangeEvent, PropsWithChildren } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { MultiSelectProps } from './MultiSelect';\n\nimport { MultiSelect } from './MultiSelect';\n\nimport { Container } from 'storyComponents/Container';\n\nconst codeString = `\n // MultiSelectHeader can be added optionally\n <MultiSelect.MultiSelectHeader label={label} clearTrigger={clearTrigger} onClear={handleClear} />\n <MultiSelect noBorder={noBorder} scrollable={scrollable}>\n {mockItems.map(({ itemName, itemValue, disabled }) => (\n <MultiSelect.MultiSelectItem key={itemName} label={itemName} value={itemValue}\n checked={stateItems.includes(itemValue)} onChange={handleChange} disabled={disabled} />\n ))}\n </MultiSelect>\n `;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Organisms/MultiSelect',\n component: MultiSelect,\n argTypes: {\n header: {\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n inspectComponent: MultiSelect,\n codeString: codeString,\n },\n} as Meta<PropsWithChildren<MultiSelectProps>>;\n\nconst Template: StoryFn<PropsWithChildren<MultiSelectProps>> = (args) => {\n const [items, setItems] = useState<string[]>([]);\n\n const mockItems = [\n { itemName: 'AItem 1', itemValue: '1', disabled: true },\n { itemName: 'BItem 2', itemValue: '2' },\n { itemName: 'Multi line Item 3 Item 3 Item 3 Item 3 Item 3 Item 3 Item 3 Item 3 Item 3 Item 3', itemValue: '3' },\n { itemName: 'CItem 4', itemValue: '4' },\n { itemName: 'DItem 5', itemValue: '5' },\n { itemName: 'EItem 6', itemValue: '6' },\n ];\n\n const handleClear = () => {\n setItems([]);\n fn()();\n };\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { checked, value } = event.target;\n setItems((prevState) => {\n const newItems = checked ? [...prevState, value] : prevState.filter((itemValue) => itemValue !== value);\n fn()(newItems);\n return newItems;\n });\n };\n\n return (\n <Container>\n {/* header added under separate boolean arg here for storybook purpose, \n it should be added as direct arg to MultiSelect when used in application */}\n {args.header && (\n <MultiSelect.MultiSelectHeader\n label=\"Item list\"\n clearTrigger={items.length > 0 ? 'Clear Selection' : ''}\n onClear={handleClear}\n />\n )}\n <MultiSelect {...args}>\n {mockItems.map(({ itemName, itemValue, disabled }) => (\n <MultiSelect.MultiSelectItem\n key={itemName}\n label={itemName}\n value={itemValue}\n checked={items.includes(itemValue)}\n onChange={handleChange}\n disabled={disabled}\n />\n ))}\n </MultiSelect>\n </Container>\n );\n};\n\nconst defaultArgs: Partial<MultiSelectProps> = {\n scrollable: true,\n noBorder: false,\n};\n\nexport const MultiSelectExample = Template.bind({});\nMultiSelectExample.args = {\n ...defaultArgs,\n};\n\nexport const WithHeader = Template.bind({});\nWithHeader.args = {\n ...defaultArgs,\n // boolean is not normal way of adding header but if added after template the rerender logic of\n // storybook would not correctly clear the checkboxes\n header: true,\n};\n\nexport const WithheaderAndWithoutScrollContainerAndBorder = Template.bind({});\nWithheaderAndWithoutScrollContainerAndBorder.args = {\n scrollable: false,\n noBorder: true,\n // boolean is not normal way of adding header but if added after template the rerender logic of\n // storybook would not correctly clear the checkboxes\n header: true,\n};\n"],"names":["codeString","MultiSelect_stories","MultiSelect","Template","args","items","setItems","useState","mockItems","handleClear","fn","handleChange","event","checked","value","prevState","newItems","itemValue","Container","jsx","itemName","disabled","defaultArgs","MultiSelectExample","WithHeader","WithheaderAndWithoutScrollContainerAndBorder"],"mappings":";;;;;AAWA,MAAMA,IAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAYJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,QAAQ;AAAA,MACN,OAAO;AAAA,QACL,SAAS;AAAA,
|
|
1
|
+
{"version":3,"file":"MultiSelect.stories.js","sources":["../../../src/components/MultiSelect/MultiSelect.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\nimport { useState } from 'react';\n\nimport type { ChangeEvent, PropsWithChildren } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { MultiSelectProps } from './MultiSelect';\n\nimport { MultiSelect } from './MultiSelect';\n\nimport { Container } from 'storyComponents/Container';\n\nconst codeString = `\n // MultiSelectHeader can be added optionally\n <MultiSelect.MultiSelectHeader label={label} clearTrigger={clearTrigger} onClear={handleClear} />\n <MultiSelect noBorder={noBorder} scrollable={scrollable}>\n {mockItems.map(({ itemName, itemValue, disabled }) => (\n <MultiSelect.MultiSelectItem key={itemName} label={itemName} value={itemValue}\n checked={stateItems.includes(itemValue)} onChange={handleChange} disabled={disabled} />\n ))}\n </MultiSelect>\n `;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Organisms/MultiSelect',\n component: MultiSelect,\n argTypes: {\n header: {\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n inspectComponent: MultiSelect,\n codeString: codeString,\n },\n} as Meta<PropsWithChildren<MultiSelectProps>>;\n\nconst Template: StoryFn<PropsWithChildren<MultiSelectProps>> = (args) => {\n const [items, setItems] = useState<string[]>([]);\n\n const mockItems = [\n { itemName: 'AItem 1', itemValue: '1', disabled: true },\n { itemName: 'BItem 2', itemValue: '2' },\n { itemName: 'Multi line Item 3 Item 3 Item 3 Item 3 Item 3 Item 3 Item 3 Item 3 Item 3 Item 3', itemValue: '3' },\n { itemName: 'CItem 4', itemValue: '4' },\n { itemName: 'DItem 5', itemValue: '5' },\n { itemName: 'EItem 6', itemValue: '6' },\n ];\n\n const handleClear = () => {\n setItems([]);\n fn()();\n };\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n const { checked, value } = event.target;\n setItems((prevState) => {\n const newItems = checked ? [...prevState, value] : prevState.filter((itemValue) => itemValue !== value);\n fn()(newItems);\n return newItems;\n });\n };\n\n return (\n <Container>\n {/* header added under separate boolean arg here for storybook purpose, \n it should be added as direct arg to MultiSelect when used in application */}\n {args.header && (\n <MultiSelect.MultiSelectHeader\n label=\"Item list\"\n clearTrigger={items.length > 0 ? 'Clear Selection' : ''}\n onClear={handleClear}\n />\n )}\n <MultiSelect {...args}>\n {mockItems.map(({ itemName, itemValue, disabled }) => (\n <MultiSelect.MultiSelectItem\n key={itemName}\n label={itemName}\n value={itemValue}\n checked={items.includes(itemValue)}\n onChange={handleChange}\n disabled={disabled}\n />\n ))}\n </MultiSelect>\n </Container>\n );\n};\n\nconst defaultArgs: Partial<MultiSelectProps> = {\n scrollable: true,\n noBorder: false,\n};\n\nexport const MultiSelectExample = Template.bind({});\nMultiSelectExample.args = {\n ...defaultArgs,\n};\n\nexport const WithHeader = Template.bind({});\nWithHeader.args = {\n ...defaultArgs,\n // boolean is not normal way of adding header but if added after template the rerender logic of\n // storybook would not correctly clear the checkboxes\n header: true,\n};\n\nexport const WithheaderAndWithoutScrollContainerAndBorder = Template.bind({});\nWithheaderAndWithoutScrollContainerAndBorder.args = {\n scrollable: false,\n noBorder: true,\n // boolean is not normal way of adding header but if added after template the rerender logic of\n // storybook would not correctly clear the checkboxes\n header: true,\n};\n"],"names":["codeString","MultiSelect_stories","MultiSelect","Template","args","items","setItems","useState","mockItems","handleClear","fn","handleChange","event","checked","value","prevState","newItems","itemValue","Container","jsx","itemName","disabled","defaultArgs","MultiSelectExample","WithHeader","WithheaderAndWithoutScrollContainerAndBorder"],"mappings":";;;;;AAWA,MAAMA,IAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAYJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,QAAQ;AAAA,MACN,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,EAEJ;AAAA,EACA,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAyD,CAACC,MAAS;AACvE,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAmB,CAAA,CAAE,GAEzCC,IAAY;AAAA,IAChB,EAAE,UAAU,WAAW,WAAW,KAAK,UAAU,GAAK;AAAA,IACtD,EAAE,UAAU,WAAW,WAAW,IAAI;AAAA,IACtC,EAAE,UAAU,oFAAoF,WAAW,IAAI;AAAA,IAC/G,EAAE,UAAU,WAAW,WAAW,IAAI;AAAA,IACtC,EAAE,UAAU,WAAW,WAAW,IAAI;AAAA,IACtC,EAAE,UAAU,WAAW,WAAW,IAAI;AAAA,EACxC,GAEMC,IAAc,MAAM;AACxB,IAAAH,EAAS,CAAA,CAAE,GACXI,IAAK;AAAA,EACP,GAEMC,IAAe,CAACC,MAAyC;AAC7D,UAAM,EAAE,SAAAC,GAAS,OAAAC,EAAM,IAAIF,EAAM;AACjC,IAAAN,EAAS,CAACS,MAAc;AACtB,YAAMC,IAAWH,IAAU,CAAC,GAAGE,GAAWD,CAAK,IAAIC,EAAU,OAAO,CAACE,MAAcA,MAAcH,CAAK;AACtGJ,aAAAA,EAAA,EAAKM,CAAQ,GACNA;AAAA,IAAA,CACR;AAAA,EACH;AAEA,2BACGE,GAGE,EAAA,UAAA;AAAA,IAAAd,EAAK,UACJ,gBAAAe;AAAA,MAACjB,EAAY;AAAA,MAAZ;AAAA,QACC,OAAM;AAAA,QACN,cAAcG,EAAM,SAAS,IAAI,oBAAoB;AAAA,QACrD,SAASI;AAAA,MAAA;AAAA,IACX;AAAA,IAEF,gBAAAU,EAACjB,GAAa,EAAA,GAAGE,GACd,UAAAI,EAAU,IAAI,CAAC,EAAE,UAAAY,GAAU,WAAAH,GAAW,UAAAI,EACrC,MAAA,gBAAAF;AAAA,MAACjB,EAAY;AAAA,MAAZ;AAAA,QAEC,OAAOkB;AAAA,QACP,OAAOH;AAAA,QACP,SAASZ,EAAM,SAASY,CAAS;AAAA,QACjC,UAAUN;AAAA,QACV,UAAAU;AAAA,MAAA;AAAA,MALKD;AAAA,IAAA,CAOR,EACH,CAAA;AAAA,EAAA,GACF;AAEJ,GAEME,IAAyC;AAAA,EAC7C,YAAY;AAAA,EACZ,UAAU;AACZ,GAEaC,IAAqBpB,EAAS,KAAK,CAAE,CAAA;AAClDoB,EAAmB,OAAO;AAAA,EACxB,GAAGD;AACL;AAEO,MAAME,IAAarB,EAAS,KAAK,CAAE,CAAA;AAC1CqB,EAAW,OAAO;AAAA,EAChB,GAAGF;AAAA;AAAA;AAAA,EAGH,QAAQ;AACV;AAEO,MAAMG,IAA+CtB,EAAS,KAAK,CAAE,CAAA;AAC5EsB,EAA6C,OAAO;AAAA,EAClD,YAAY;AAAA,EACZ,UAAU;AAAA;AAAA;AAAA,EAGV,QAAQ;AACV;"}
|
|
@@ -13,8 +13,7 @@ import "../../GridRow/GridRow.js";
|
|
|
13
13
|
import "../../IconButton/IconButton.js";
|
|
14
14
|
import "../../Input/Input.js";
|
|
15
15
|
import "../../InputField/InputField.js";
|
|
16
|
-
import "
|
|
17
|
-
import { a as w } from "../../../TablePlugin-BbiBRjod.js";
|
|
16
|
+
import { a as v } from "../../../TablePlugin-ByeOn0Zf.js";
|
|
18
17
|
import "../../RteEditor/Providers/LanguageProvider.js";
|
|
19
18
|
import "../../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
|
|
20
19
|
import "../../RteEditor/hooks/components/Flyout.js";
|
|
@@ -24,6 +23,6 @@ import "../../SelectListbox/SelectProvider.js";
|
|
|
24
23
|
import "../../Sortable/components/SortableItem.js";
|
|
25
24
|
import "../../../SortableProvider-BUsvniX7.js";
|
|
26
25
|
export {
|
|
27
|
-
|
|
26
|
+
v as MultiSelectHeader
|
|
28
27
|
};
|
|
29
28
|
//# sourceMappingURL=MultiSelectHeader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelectHeader.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"MultiSelectHeader.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverlayCloseButton.js","sources":["../../../src/components/OverlayCloseButton/OverlayCloseButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { forwardRef } from 'react';\n\nimport type { ButtonHTMLAttributes } from 'react';\n\nimport styles from './OverlayCloseButton.module.css';\n\nimport { Icon } from 'components/Icon';\n\nexport interface OverlayCloseButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'style'> {\n /** The `aria-label` value of the button. */\n 'aria-label': string; // mandatory\n /** `true` to add padding around the button; otherwise, `false`. The default is `false`. */\n paddedModal?: boolean;\n}\n\n/** Represents a component to render a close button in the top right corner of a container. */\nexport const OverlayCloseButton = forwardRef<HTMLButtonElement, OverlayCloseButtonProps>(\n ({ paddedModal, ...restProps }, forwardedRef) => (\n <button\n {...restProps}\n type=\"button\"\n ref={forwardedRef}\n className={clsx(styles['overlay-close-button'], {\n [styles['overlay-close-button--padded']]: paddedModal,\n })}\n >\n <Icon name=\"Cross\" size={24} />\n </button>\n )\n);\n"],"names":["OverlayCloseButton","forwardRef","paddedModal","restProps","forwardedRef","jsx","clsx","styles","Icon"],"mappings":";;;;;;;GAiBaA,IAAqBC;AAAA,EAChC,CAAC,EAAE,aAAAC,GAAa,GAAGC,KAAaC,MAC9B,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,MAAK;AAAA,MACL,KAAKC;AAAA,MACL,WAAWE,EAAKC,EAAO,sBAAsB,GAAG;AAAA,QAC9C,CAACA,EAAO,8BAA8B,CAAC,GAAGL;AAAA,MAAA,CAC3C;AAAA,MAED,UAAC,gBAAAG,EAAAG,GAAA,EAAK,MAAK,SAAQ,MAAM,
|
|
1
|
+
{"version":3,"file":"OverlayCloseButton.js","sources":["../../../src/components/OverlayCloseButton/OverlayCloseButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { forwardRef } from 'react';\n\nimport type { ButtonHTMLAttributes } from 'react';\n\nimport styles from './OverlayCloseButton.module.css';\n\nimport { Icon } from 'components/Icon';\n\nexport interface OverlayCloseButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'style'> {\n /** The `aria-label` value of the button. */\n 'aria-label': string; // mandatory\n /** `true` to add padding around the button; otherwise, `false`. The default is `false`. */\n paddedModal?: boolean;\n}\n\n/** Represents a component to render a close button in the top right corner of a container. */\nexport const OverlayCloseButton = forwardRef<HTMLButtonElement, OverlayCloseButtonProps>(\n ({ paddedModal, ...restProps }, forwardedRef) => (\n <button\n {...restProps}\n type=\"button\"\n ref={forwardedRef}\n className={clsx(styles['overlay-close-button'], {\n [styles['overlay-close-button--padded']]: paddedModal,\n })}\n >\n <Icon name=\"Cross\" size={24} />\n </button>\n )\n);\n"],"names":["OverlayCloseButton","forwardRef","paddedModal","restProps","forwardedRef","jsx","clsx","styles","Icon"],"mappings":";;;;;;;GAiBaA,IAAqBC;AAAA,EAChC,CAAC,EAAE,aAAAC,GAAa,GAAGC,KAAaC,MAC9B,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGF;AAAA,MACJ,MAAK;AAAA,MACL,KAAKC;AAAA,MACL,WAAWE,EAAKC,EAAO,sBAAsB,GAAG;AAAA,QAC9C,CAACA,EAAO,8BAA8B,CAAC,GAAGL;AAAA,MAAA,CAC3C;AAAA,MAED,UAAC,gBAAAG,EAAAG,GAAA,EAAK,MAAK,SAAQ,MAAM,GAAI,CAAA;AAAA,IAAA;AAAA,EAAA;AAGnC;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
-
import { fn as a } from "../../index-
|
|
2
|
+
import { fn as a } from "../../index-DWzkl4aY.js";
|
|
3
3
|
import { OverlayCloseButton as o } from "./OverlayCloseButton.js";
|
|
4
4
|
import { Container as l } from "../../storyComponents/Container/Container.js";
|
|
5
5
|
const n = "<OverlayCloseButton aria-label={aria-label} onClick={onClickFunction} />", c = {
|