@mittwald/flow-react-components 0.2.0-alpha.997 → 0.2.0-alpha.998
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/CHANGELOG.md +4 -0
- package/dist/assets/doc-properties.json +5421 -5421
- package/dist/js/packages/components/src/components/AccentBox/AccentBox.mjs +0 -1
- package/dist/js/packages/components/src/components/AccentBox/AccentBox.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Accordion/Accordion.mjs +0 -1
- package/dist/js/packages/components/src/components/Accordion/Accordion.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Action/Action.mjs +0 -1
- package/dist/js/packages/components/src/components/Action/Action.mjs.map +1 -1
- package/dist/js/packages/components/src/components/ActionGroup/ActionGroup.mjs +0 -1
- package/dist/js/packages/components/src/components/ActionGroup/ActionGroup.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Alert/Alert.mjs +0 -1
- package/dist/js/packages/components/src/components/Alert/Alert.mjs.map +1 -1
- package/dist/js/packages/components/src/components/AlertText/AlertText.mjs +0 -1
- package/dist/js/packages/components/src/components/AlertText/AlertText.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Align/Align.mjs +0 -1
- package/dist/js/packages/components/src/components/Align/Align.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Autocomplete/Autocomplete.mjs +0 -1
- package/dist/js/packages/components/src/components/Autocomplete/Autocomplete.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Avatar/Avatar.mjs +0 -1
- package/dist/js/packages/components/src/components/Avatar/Avatar.mjs.map +1 -1
- package/dist/js/packages/components/src/components/AvatarStack/AvatarStack.mjs +0 -1
- package/dist/js/packages/components/src/components/AvatarStack/AvatarStack.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Badge/Badge.mjs +0 -1
- package/dist/js/packages/components/src/components/Badge/Badge.mjs.map +1 -1
- package/dist/js/packages/components/src/components/BigNumber/BigNumber.mjs +0 -1
- package/dist/js/packages/components/src/components/BigNumber/BigNumber.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Breadcrumb/Breadcrumb.mjs +0 -1
- package/dist/js/packages/components/src/components/Breadcrumb/Breadcrumb.mjs.map +1 -1
- package/dist/js/packages/components/src/components/BrowserOnly/BrowserOnly.mjs +0 -1
- package/dist/js/packages/components/src/components/BrowserOnly/BrowserOnly.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Button/Button.mjs +0 -1
- package/dist/js/packages/components/src/components/Button/Button.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Chat/Chat.mjs +0 -1
- package/dist/js/packages/components/src/components/Chat/Chat.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Checkbox/Checkbox.mjs +0 -1
- package/dist/js/packages/components/src/components/Checkbox/Checkbox.mjs.map +1 -1
- package/dist/js/packages/components/src/components/CheckboxButton/CheckboxButton.mjs +0 -1
- package/dist/js/packages/components/src/components/CheckboxButton/CheckboxButton.mjs.map +1 -1
- package/dist/js/packages/components/src/components/CheckboxGroup/CheckboxGroup.mjs +0 -1
- package/dist/js/packages/components/src/components/CheckboxGroup/CheckboxGroup.mjs.map +1 -1
- package/dist/js/packages/components/src/components/CodeEditor/CodeEditor.mjs +0 -1
- package/dist/js/packages/components/src/components/CodeEditor/CodeEditor.mjs.map +1 -1
- package/dist/js/packages/components/src/components/ColumnLayout/ColumnLayout.mjs +0 -1
- package/dist/js/packages/components/src/components/ColumnLayout/ColumnLayout.mjs.map +1 -1
- package/dist/js/packages/components/src/components/ComboBox/ComboBox.mjs +0 -1
- package/dist/js/packages/components/src/components/ComboBox/ComboBox.mjs.map +1 -1
- package/dist/js/packages/components/src/components/ContextMenu/ContextMenu.mjs +0 -1
- package/dist/js/packages/components/src/components/ContextMenu/ContextMenu.mjs.map +1 -1
- package/dist/js/packages/components/src/components/ContextMenu/components/ContextMenuSection/ContextMenuSection.mjs +0 -1
- package/dist/js/packages/components/src/components/ContextMenu/components/ContextMenuSection/ContextMenuSection.mjs.map +1 -1
- package/dist/js/packages/components/src/components/ContextualHelp/ContextualHelp.mjs +0 -1
- package/dist/js/packages/components/src/components/ContextualHelp/ContextualHelp.mjs.map +1 -1
- package/dist/js/packages/components/src/components/ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.mjs +0 -1
- package/dist/js/packages/components/src/components/ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.mjs.map +1 -1
- package/dist/js/packages/components/src/components/DatePicker/DatePicker.mjs +0 -1
- package/dist/js/packages/components/src/components/DatePicker/DatePicker.mjs.map +1 -1
- package/dist/js/packages/components/src/components/DateRangePicker/DateRangePicker.mjs +0 -1
- package/dist/js/packages/components/src/components/DateRangePicker/DateRangePicker.mjs.map +1 -1
- package/dist/js/packages/components/src/components/FileCard/FileCard.mjs +0 -1
- package/dist/js/packages/components/src/components/FileCard/FileCard.mjs.map +1 -1
- package/dist/js/packages/components/src/components/FileCardList/FileCardList.mjs +0 -1
- package/dist/js/packages/components/src/components/FileCardList/FileCardList.mjs.map +1 -1
- package/dist/js/packages/components/src/components/FileDropZone/FileDropZone.mjs +0 -1
- package/dist/js/packages/components/src/components/FileDropZone/FileDropZone.mjs.map +1 -1
- package/dist/js/packages/components/src/components/FileField/FileField.mjs +0 -1
- package/dist/js/packages/components/src/components/FileField/FileField.mjs.map +1 -1
- package/dist/js/packages/components/src/components/FileField/components/FileInput.mjs +0 -1
- package/dist/js/packages/components/src/components/FileField/components/FileInput.mjs.map +1 -1
- package/dist/js/packages/components/src/components/HeaderNavigation/HeaderNavigation.mjs +0 -1
- package/dist/js/packages/components/src/components/HeaderNavigation/HeaderNavigation.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Heading/Heading.mjs +0 -1
- package/dist/js/packages/components/src/components/Heading/Heading.mjs.map +1 -1
- package/dist/js/packages/components/src/components/IllustratedMessage/IllustratedMessage.mjs +0 -1
- package/dist/js/packages/components/src/components/IllustratedMessage/IllustratedMessage.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Label/Label.mjs +0 -1
- package/dist/js/packages/components/src/components/Label/Label.mjs.map +1 -1
- package/dist/js/packages/components/src/components/LabeledValue/LabeledValue.mjs +0 -1
- package/dist/js/packages/components/src/components/LabeledValue/LabeledValue.mjs.map +1 -1
- package/dist/js/packages/components/src/components/LayoutCard/LayoutCard.mjs +0 -1
- package/dist/js/packages/components/src/components/LayoutCard/LayoutCard.mjs.map +1 -1
- package/dist/js/packages/components/src/components/LightBox/LightBox.mjs +0 -1
- package/dist/js/packages/components/src/components/LightBox/LightBox.mjs.map +1 -1
- package/dist/js/packages/components/src/components/LightBox/components/LightBoxGalleryItem/LightBoxGalleryItem.mjs +0 -1
- package/dist/js/packages/components/src/components/LightBox/components/LightBoxGalleryItem/LightBoxGalleryItem.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Link/Link.mjs +0 -1
- package/dist/js/packages/components/src/components/Link/Link.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/List.mjs +0 -1
- package/dist/js/packages/components/src/components/List/List.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/Header/components/SearchField/SearchField.mjs +0 -1
- package/dist/js/packages/components/src/components/List/components/Header/components/SearchField/SearchField.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/Items/components/Item/hooks/useGridItemProps.mjs +0 -1
- package/dist/js/packages/components/src/components/List/components/Items/components/Item/hooks/useGridItemProps.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/ListItemView/ListItemView.mjs +0 -1
- package/dist/js/packages/components/src/components/List/components/ListItemView/ListItemView.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/ListItemView/components/ListItemViewContent/ListItemViewContent.mjs +0 -1
- package/dist/js/packages/components/src/components/List/components/ListItemView/components/ListItemViewContent/ListItemViewContent.mjs.map +1 -1
- package/dist/js/packages/components/src/components/MenuItem/components/MenuItemContent/MenuItemContent.mjs +0 -1
- package/dist/js/packages/components/src/components/MenuItem/components/MenuItemContent/MenuItemContent.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Message/Message.mjs +0 -1
- package/dist/js/packages/components/src/components/Message/Message.mjs.map +1 -1
- package/dist/js/packages/components/src/components/MessageThread/MessageThread.mjs +0 -1
- package/dist/js/packages/components/src/components/MessageThread/MessageThread.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Modal/Modal.mjs +0 -1
- package/dist/js/packages/components/src/components/Modal/Modal.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Navigation/Navigation.mjs +0 -1
- package/dist/js/packages/components/src/components/Navigation/Navigation.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Navigation/components/NavigationGroup/NavigationGroup.mjs +0 -1
- package/dist/js/packages/components/src/components/Navigation/components/NavigationGroup/NavigationGroup.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Notification/Notification.mjs +0 -1
- package/dist/js/packages/components/src/components/Notification/Notification.mjs.map +1 -1
- package/dist/js/packages/components/src/components/NumberField/NumberField.mjs +0 -1
- package/dist/js/packages/components/src/components/NumberField/NumberField.mjs.map +1 -1
- package/dist/js/packages/components/src/components/OverlayTrigger/OverlayTrigger.mjs +0 -1
- package/dist/js/packages/components/src/components/OverlayTrigger/OverlayTrigger.mjs.map +1 -1
- package/dist/js/packages/components/src/components/PasswordCreationField/PasswordCreationField.mjs +0 -1
- package/dist/js/packages/components/src/components/PasswordCreationField/PasswordCreationField.mjs.map +1 -1
- package/dist/js/packages/components/src/components/ProgressBar/ProgressBar.mjs +0 -1
- package/dist/js/packages/components/src/components/ProgressBar/ProgressBar.mjs.map +1 -1
- package/dist/js/packages/components/src/components/RadioGroup/RadioGroup.mjs +0 -1
- package/dist/js/packages/components/src/components/RadioGroup/RadioGroup.mjs.map +1 -1
- package/dist/js/packages/components/src/components/RadioGroup/components/RadioButton/RadioButton.mjs +0 -1
- package/dist/js/packages/components/src/components/RadioGroup/components/RadioButton/RadioButton.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Rating/Rating.mjs +0 -1
- package/dist/js/packages/components/src/components/Rating/Rating.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Rating/components/RatingSegment/EmptySegment.mjs +0 -1
- package/dist/js/packages/components/src/components/Rating/components/RatingSegment/EmptySegment.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Rating/components/RatingSegment/FilledSegment.mjs +0 -1
- package/dist/js/packages/components/src/components/Rating/components/RatingSegment/FilledSegment.mjs.map +1 -1
- package/dist/js/packages/components/src/components/SearchField/SearchField.mjs +0 -1
- package/dist/js/packages/components/src/components/SearchField/SearchField.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Section/Section.mjs +0 -1
- package/dist/js/packages/components/src/components/Section/Section.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Section/components/SectionHeader/SectionHeader.mjs +0 -1
- package/dist/js/packages/components/src/components/Section/components/SectionHeader/SectionHeader.mjs.map +1 -1
- package/dist/js/packages/components/src/components/SegmentedControl/SegmentedControl.mjs +0 -1
- package/dist/js/packages/components/src/components/SegmentedControl/SegmentedControl.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Select/Select.mjs +0 -1
- package/dist/js/packages/components/src/components/Select/Select.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Slider/Slider.mjs +0 -1
- package/dist/js/packages/components/src/components/Slider/Slider.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Switch/Switch.mjs +0 -1
- package/dist/js/packages/components/src/components/Switch/Switch.mjs.map +1 -1
- package/dist/js/packages/components/src/components/TabNavigation/TabNavigation.mjs +0 -1
- package/dist/js/packages/components/src/components/TabNavigation/TabNavigation.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Table/components/TableColumn/TableColumn.mjs +0 -1
- package/dist/js/packages/components/src/components/Table/components/TableColumn/TableColumn.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Tabs/components/Tab/Tab.mjs +0 -1
- package/dist/js/packages/components/src/components/Tabs/components/Tab/Tab.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Text/Text.mjs +0 -1
- package/dist/js/packages/components/src/components/Text/Text.mjs.map +1 -1
- package/dist/js/packages/components/src/components/TextArea/TextArea.mjs +0 -1
- package/dist/js/packages/components/src/components/TextArea/TextArea.mjs.map +1 -1
- package/dist/js/packages/components/src/components/TextField/TextField.mjs +0 -1
- package/dist/js/packages/components/src/components/TextField/TextField.mjs.map +1 -1
- package/dist/js/packages/components/src/components/TimeField/TimeField.mjs +0 -1
- package/dist/js/packages/components/src/components/TimeField/TimeField.mjs.map +1 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/Field/Field.mjs +0 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/Field/Field.mjs.map +1 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/FormAction/FormResetAction.mjs +0 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/FormAction/FormResetAction.mjs.map +1 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/FormAction/FormSubmitAction.mjs +0 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/FormAction/FormSubmitAction.mjs.map +1 -1
- package/dist/js/packages/components/src/lib/controller/overlay/useModalController.mjs +0 -1
- package/dist/js/packages/components/src/lib/controller/overlay/useModalController.mjs.map +1 -1
- package/dist/js/packages/components/src/lib/hooks/useFieldComponent.mjs +0 -1
- package/dist/js/packages/components/src/lib/hooks/useFieldComponent.mjs.map +1 -1
- package/dist/js/packages/components/src/lib/hooks/useFieldError.mjs +0 -1
- package/dist/js/packages/components/src/lib/hooks/useFieldError.mjs.map +1 -1
- package/package.json +6 -6
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.mjs","sources":["../../../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import {\n IconCheckboxChecked,\n IconCheckboxEmpty,\n IconCheckboxIndeterminate,\n} from \"@/components/Icon/components/icons\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport clsx from \"clsx\";\nimport type { PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./Checkbox.module.scss\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { useObjectRef } from \"react-aria\";\n\nexport interface CheckboxProps\n extends\n PropsWithChildren<\n Omit<Aria.CheckboxProps, \"children\" | \"ref\" | \"inputRef\">\n >,\n FlowComponentProps<HTMLInputElement> {\n inputClassName?: string;\n}\n\n/** @flr-generate all */\nexport const Checkbox = flowComponent(\"Checkbox\", (props) => {\n const { children, className, ref, inputClassName, ...rest } = props;\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldPropsContext,\n fieldProps,\n } = useFieldComponent(props, \"Checkbox\");\n\n const inputRef = useObjectRef(ref);\n\n return (\n <div\n {...fieldProps}\n className={clsx(styles.checkbox, className, fieldProps.className)}\n >\n <FieldErrorCaptureContext>\n <Aria.Checkbox\n {...rest}\n inputRef={inputRef}\n className={clsx(inputClassName, styles.input)}\n >\n {({ isSelected, isIndeterminate }) => (\n <PropsContextProvider props={fieldPropsContext}>\n {isSelected ? (\n <IconCheckboxChecked className={styles.icon} />\n ) : isIndeterminate ? (\n <IconCheckboxIndeterminate className={styles.icon} />\n ) : (\n <IconCheckboxEmpty className={styles.icon} />\n )}\n {children}\n </PropsContextProvider>\n )}\n </Aria.Checkbox>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </div>\n );\n});\n\nexport default Checkbox;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Checkbox.mjs","sources":["../../../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import {\n IconCheckboxChecked,\n IconCheckboxEmpty,\n IconCheckboxIndeterminate,\n} from \"@/components/Icon/components/icons\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport clsx from \"clsx\";\nimport type { PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./Checkbox.module.scss\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { useObjectRef } from \"react-aria\";\n\nexport interface CheckboxProps\n extends\n PropsWithChildren<\n Omit<Aria.CheckboxProps, \"children\" | \"ref\" | \"inputRef\">\n >,\n FlowComponentProps<HTMLInputElement> {\n inputClassName?: string;\n}\n\n/** @flr-generate all */\nexport const Checkbox = flowComponent(\"Checkbox\", (props) => {\n const { children, className, ref, inputClassName, ...rest } = props;\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldPropsContext,\n fieldProps,\n } = useFieldComponent(props, \"Checkbox\");\n\n const inputRef = useObjectRef(ref);\n\n return (\n <div\n {...fieldProps}\n className={clsx(styles.checkbox, className, fieldProps.className)}\n >\n <FieldErrorCaptureContext>\n <Aria.Checkbox\n {...rest}\n inputRef={inputRef}\n className={clsx(inputClassName, styles.input)}\n >\n {({ isSelected, isIndeterminate }) => (\n <PropsContextProvider props={fieldPropsContext}>\n {isSelected ? (\n <IconCheckboxChecked className={styles.icon} />\n ) : isIndeterminate ? (\n <IconCheckboxIndeterminate className={styles.icon} />\n ) : (\n <IconCheckboxEmpty className={styles.icon} />\n )}\n {children}\n </PropsContextProvider>\n )}\n </Aria.Checkbox>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </div>\n );\n});\n\nexport default Checkbox;\n"],"names":[],"mappings":";;;;;;;;;;;;AAyBO,MAAM,QAAA,GAAW,aAAA,CAAc,UAAA,EAAY,CAAC,KAAA,KAAU;AAC3D,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,KAAK,cAAA,EAAgB,GAAG,MAAK,GAAI,KAAA;AAE9D,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,wBAAA;AAAA,IACA,iBAAA;AAAA,IACA;AAAA,GACF,GAAI,iBAAA,CAAkB,KAAA,EAAO,UAAU,CAAA;AAEvC,EAAA,MAAM,QAAA,GAAW,aAAa,GAAG,CAAA;AAEjC,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,WAAW,IAAA,CAAK,MAAA,CAAO,QAAA,EAAU,SAAA,EAAW,WAAW,SAAS,CAAA;AAAA,MAEhE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,wBAAA,EAAA,EACC,QAAA,kBAAA,GAAA;AAAA,UAAC,IAAA,CAAK,QAAA;AAAA,UAAL;AAAA,YACE,GAAG,IAAA;AAAA,YACJ,QAAA;AAAA,YACA,SAAA,EAAW,IAAA,CAAK,cAAA,EAAgB,MAAA,CAAO,KAAK,CAAA;AAAA,YAE3C,QAAA,EAAA,CAAC,EAAE,UAAA,EAAY,eAAA,uBACd,IAAA,CAAC,oBAAA,EAAA,EAAqB,OAAO,iBAAA,EAC1B,QAAA,EAAA;AAAA,cAAA,UAAA,uBACE,mBAAA,EAAA,EAAoB,SAAA,EAAW,MAAA,CAAO,IAAA,EAAM,IAC3C,eAAA,mBACF,GAAA,CAAC,yBAAA,EAAA,EAA0B,SAAA,EAAW,OAAO,IAAA,EAAM,CAAA,uBAElD,iBAAA,EAAA,EAAkB,SAAA,EAAW,OAAO,IAAA,EAAM,CAAA;AAAA,cAE5C;AAAA,aAAA,EACH;AAAA;AAAA,SAEJ,EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA;AAAA;AAAA,GAClB;AAEJ,CAAC;;;;"}
|
|
@@ -3,7 +3,6 @@
|
|
|
3
3
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
4
4
|
import styles from './CheckboxButton.module.scss.mjs';
|
|
5
5
|
import clsx from 'clsx';
|
|
6
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
7
6
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
8
7
|
import { Checkbox } from '../Checkbox/Checkbox.mjs';
|
|
9
8
|
import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxButton.mjs","sources":["../../../../../../../src/components/CheckboxButton/CheckboxButton.tsx"],"sourcesContent":["import styles from \"./CheckboxButton.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { CheckboxProps } from \"@/components/Checkbox\";\nimport { Checkbox } from \"@/components/Checkbox\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\n\nexport interface CheckboxButtonProps\n extends CheckboxProps, FlowComponentProps<HTMLInputElement> {}\n\n/** @flr-generate all */\nexport const CheckboxButton = flowComponent(\"CheckboxButton\", (props) => {\n const { children, className, inputClassName, ...rest } = props;\n\n const {\n fieldPropsContext,\n fieldProps,\n FieldErrorView,\n FieldErrorCaptureContext,\n } = useFieldComponent(props, \"CheckboxButton\");\n\n const mergedPropsContext: PropsContext = {\n Text: {\n className: styles.label,\n },\n Content: {\n className: styles.content,\n },\n ...fieldPropsContext,\n };\n\n return (\n <div\n {...fieldProps}\n className={clsx(fieldProps.className, styles.checkboxButton, className)}\n >\n <FieldErrorCaptureContext>\n <Checkbox {...rest} inputClassName={clsx(inputClassName, styles.input)}>\n <PropsContextProvider props={mergedPropsContext}>\n {children}\n </PropsContextProvider>\n </Checkbox>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </div>\n );\n});\n\nexport default CheckboxButton;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CheckboxButton.mjs","sources":["../../../../../../../src/components/CheckboxButton/CheckboxButton.tsx"],"sourcesContent":["import styles from \"./CheckboxButton.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { CheckboxProps } from \"@/components/Checkbox\";\nimport { Checkbox } from \"@/components/Checkbox\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\n\nexport interface CheckboxButtonProps\n extends CheckboxProps, FlowComponentProps<HTMLInputElement> {}\n\n/** @flr-generate all */\nexport const CheckboxButton = flowComponent(\"CheckboxButton\", (props) => {\n const { children, className, inputClassName, ...rest } = props;\n\n const {\n fieldPropsContext,\n fieldProps,\n FieldErrorView,\n FieldErrorCaptureContext,\n } = useFieldComponent(props, \"CheckboxButton\");\n\n const mergedPropsContext: PropsContext = {\n Text: {\n className: styles.label,\n },\n Content: {\n className: styles.content,\n },\n ...fieldPropsContext,\n };\n\n return (\n <div\n {...fieldProps}\n className={clsx(fieldProps.className, styles.checkboxButton, className)}\n >\n <FieldErrorCaptureContext>\n <Checkbox {...rest} inputClassName={clsx(inputClassName, styles.input)}>\n <PropsContextProvider props={mergedPropsContext}>\n {children}\n </PropsContextProvider>\n </Checkbox>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </div>\n );\n});\n\nexport default CheckboxButton;\n"],"names":[],"mappings":";;;;;;;;AAcO,MAAM,cAAA,GAAiB,aAAA,CAAc,gBAAA,EAAkB,CAAC,KAAA,KAAU;AACvE,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,cAAA,EAAgB,GAAG,MAAK,GAAI,KAAA;AAEzD,EAAA,MAAM;AAAA,IACJ,iBAAA;AAAA,IACA,UAAA;AAAA,IACA,cAAA;AAAA,IACA;AAAA,GACF,GAAI,iBAAA,CAAkB,KAAA,EAAO,gBAAgB,CAAA;AAE7C,EAAA,MAAM,kBAAA,GAAmC;AAAA,IACvC,IAAA,EAAM;AAAA,MACJ,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,OAAA,EAAS;AAAA,MACP,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,GAAG;AAAA,GACL;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,WAAW,IAAA,CAAK,UAAA,CAAW,SAAA,EAAW,MAAA,CAAO,gBAAgB,SAAS,CAAA;AAAA,MAEtE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,4BACC,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAU,GAAG,IAAA,EAAM,gBAAgB,IAAA,CAAK,cAAA,EAAgB,MAAA,CAAO,KAAK,GACnE,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,OAAO,kBAAA,EAC1B,QAAA,EACH,GACF,CAAA,EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA;AAAA;AAAA,GAClB;AAEJ,CAAC;;;;"}
|
|
@@ -3,7 +3,6 @@
|
|
|
3
3
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
4
4
|
import { ColumnLayout } from '../ColumnLayout/ColumnLayout.mjs';
|
|
5
5
|
import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
|
|
6
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
7
6
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
8
7
|
import clsx from 'clsx';
|
|
9
8
|
import * as Aria from 'react-aria-components';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxGroup.mjs","sources":["../../../../../../../src/components/CheckboxGroup/CheckboxGroup.tsx"],"sourcesContent":["import type { ColumnLayoutProps } from \"@/components/ColumnLayout\";\nimport { ColumnLayout } from \"@/components/ColumnLayout\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport type { PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./CheckboxGroup.module.scss\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface CheckboxGroupProps\n extends\n PropsWithChildren<Omit<Aria.CheckboxGroupProps, \"children\">>,\n Pick<ColumnLayoutProps, \"s\" | \"m\" | \"l\">,\n FlowComponentProps {}\n\n/** @flr-generate all */\nexport const CheckboxGroup = flowComponent(\"CheckboxGroup\", (props) => {\n const { children, className, isInvalid, s, m, l, ref, ...rest } = props;\n\n const {\n FieldErrorView,\n fieldPropsContext,\n fieldProps,\n FieldErrorCaptureContext,\n } = useFieldComponent(props, \"CheckboxGroup\");\n\n const propsContext: PropsContext = {\n Checkbox: {\n isInvalid,\n className: styles.checkbox,\n tunnel: {\n id: \"checkboxes\",\n component: \"CheckboxGroup\",\n },\n },\n CheckboxButton: {\n isInvalid,\n className: styles.checkboxButton,\n tunnel: {\n id: \"checkboxButtons\",\n component: \"CheckboxGroup\",\n },\n },\n ...fieldPropsContext,\n };\n\n const objectRef = useObjectRef(ref);\n useMakeFocusable(objectRef);\n\n return (\n <Aria.CheckboxGroup\n {...rest}\n {...fieldProps}\n isInvalid={isInvalid}\n className={clsx(fieldProps.className, className)}\n ref={objectRef}\n >\n <FieldErrorCaptureContext>\n <PropsContextProvider props={propsContext}>\n {children}\n\n <ColumnLayout s={s} m={m} l={l} className={styles.checkboxGroup}>\n <UiComponentTunnelExit\n id=\"checkboxButtons\"\n component=\"CheckboxGroup\"\n />\n </ColumnLayout>\n\n <ColumnLayout\n s={s ?? [1]}\n m={m ?? [1]}\n l={l ?? [1]}\n rowGap=\"s\"\n className={styles.checkboxGroup}\n >\n <UiComponentTunnelExit id=\"checkboxes\" component=\"CheckboxGroup\" />\n </ColumnLayout>\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.CheckboxGroup>\n );\n});\n\nexport default CheckboxGroup;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CheckboxGroup.mjs","sources":["../../../../../../../src/components/CheckboxGroup/CheckboxGroup.tsx"],"sourcesContent":["import type { ColumnLayoutProps } from \"@/components/ColumnLayout\";\nimport { ColumnLayout } from \"@/components/ColumnLayout\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport type { PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./CheckboxGroup.module.scss\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface CheckboxGroupProps\n extends\n PropsWithChildren<Omit<Aria.CheckboxGroupProps, \"children\">>,\n Pick<ColumnLayoutProps, \"s\" | \"m\" | \"l\">,\n FlowComponentProps {}\n\n/** @flr-generate all */\nexport const CheckboxGroup = flowComponent(\"CheckboxGroup\", (props) => {\n const { children, className, isInvalid, s, m, l, ref, ...rest } = props;\n\n const {\n FieldErrorView,\n fieldPropsContext,\n fieldProps,\n FieldErrorCaptureContext,\n } = useFieldComponent(props, \"CheckboxGroup\");\n\n const propsContext: PropsContext = {\n Checkbox: {\n isInvalid,\n className: styles.checkbox,\n tunnel: {\n id: \"checkboxes\",\n component: \"CheckboxGroup\",\n },\n },\n CheckboxButton: {\n isInvalid,\n className: styles.checkboxButton,\n tunnel: {\n id: \"checkboxButtons\",\n component: \"CheckboxGroup\",\n },\n },\n ...fieldPropsContext,\n };\n\n const objectRef = useObjectRef(ref);\n useMakeFocusable(objectRef);\n\n return (\n <Aria.CheckboxGroup\n {...rest}\n {...fieldProps}\n isInvalid={isInvalid}\n className={clsx(fieldProps.className, className)}\n ref={objectRef}\n >\n <FieldErrorCaptureContext>\n <PropsContextProvider props={propsContext}>\n {children}\n\n <ColumnLayout s={s} m={m} l={l} className={styles.checkboxGroup}>\n <UiComponentTunnelExit\n id=\"checkboxButtons\"\n component=\"CheckboxGroup\"\n />\n </ColumnLayout>\n\n <ColumnLayout\n s={s ?? [1]}\n m={m ?? [1]}\n l={l ?? [1]}\n rowGap=\"s\"\n className={styles.checkboxGroup}\n >\n <UiComponentTunnelExit id=\"checkboxes\" component=\"CheckboxGroup\" />\n </ColumnLayout>\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.CheckboxGroup>\n );\n});\n\nexport default CheckboxGroup;\n"],"names":[],"mappings":";;;;;;;;;;;;AAsBO,MAAM,aAAA,GAAgB,aAAA,CAAc,eAAA,EAAiB,CAAC,KAAA,KAAU;AACrE,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,SAAA,EAAW,CAAA,EAAG,GAAG,CAAA,EAAG,GAAA,EAAK,GAAG,IAAA,EAAK,GAAI,KAAA;AAElE,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,iBAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,GACF,GAAI,iBAAA,CAAkB,KAAA,EAAO,eAAe,CAAA;AAE5C,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,QAAA,EAAU;AAAA,MACR,SAAA;AAAA,MACA,WAAW,MAAA,CAAO,QAAA;AAAA,MAClB,MAAA,EAAQ;AAAA,QACN,EAAA,EAAI,YAAA;AAAA,QACJ,SAAA,EAAW;AAAA;AACb,KACF;AAAA,IACA,cAAA,EAAgB;AAAA,MACd,SAAA;AAAA,MACA,WAAW,MAAA,CAAO,cAAA;AAAA,MAClB,MAAA,EAAQ;AAAA,QACN,EAAA,EAAI,iBAAA;AAAA,QACJ,SAAA,EAAW;AAAA;AACb,KACF;AAAA,IACA,GAAG;AAAA,GACL;AAEA,EAAA,MAAM,SAAA,GAAY,aAAa,GAAG,CAAA;AAClC,EAAA,gBAAA,CAAiB,SAAS,CAAA;AAE1B,EAAA,uBACE,IAAA;AAAA,IAAC,IAAA,CAAK,aAAA;AAAA,IAAL;AAAA,MACE,GAAG,IAAA;AAAA,MACH,GAAG,UAAA;AAAA,MACJ,SAAA;AAAA,MACA,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,SAAA,EAAW,SAAS,CAAA;AAAA,MAC/C,GAAA,EAAK,SAAA;AAAA,MAEL,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,wBAAA,EAAA,EACC,QAAA,kBAAA,IAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC1B,QAAA,EAAA;AAAA,UAAA,QAAA;AAAA,8BAEA,YAAA,EAAA,EAAa,CAAA,EAAM,GAAM,CAAA,EAAM,SAAA,EAAW,OAAO,aAAA,EAChD,QAAA,kBAAA,GAAA;AAAA,YAAC,qBAAA;AAAA,YAAA;AAAA,cACC,EAAA,EAAG,iBAAA;AAAA,cACH,SAAA,EAAU;AAAA;AAAA,WACZ,EACF,CAAA;AAAA,0BAEA,GAAA;AAAA,YAAC,YAAA;AAAA,YAAA;AAAA,cACC,CAAA,EAAG,CAAA,IAAK,CAAC,CAAC,CAAA;AAAA,cACV,CAAA,EAAG,CAAA,IAAK,CAAC,CAAC,CAAA;AAAA,cACV,CAAA,EAAG,CAAA,IAAK,CAAC,CAAC,CAAA;AAAA,cACV,MAAA,EAAO,GAAA;AAAA,cACP,WAAW,MAAA,CAAO,aAAA;AAAA,cAElB,QAAA,kBAAA,GAAA,CAAC,qBAAA,EAAA,EAAsB,EAAA,EAAG,YAAA,EAAa,WAAU,eAAA,EAAgB;AAAA;AAAA;AACnE,SAAA,EACF,CAAA,EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA;AAAA;AAAA,GAClB;AAEJ,CAAC;;;;"}
|
|
@@ -6,7 +6,6 @@ import { useId } from 'react';
|
|
|
6
6
|
import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
|
|
7
7
|
import { useControlledHostValueProps } from '../../lib/remote/useControlledHostValueProps.mjs';
|
|
8
8
|
import { useFieldComponent } from '../../lib/hooks/useFieldComponent.mjs';
|
|
9
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
10
9
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
11
10
|
import clsx from 'clsx';
|
|
12
11
|
import styles from './CodeEditor.module.scss.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeEditor.mjs","sources":["../../../../../../../src/components/CodeEditor/CodeEditor.tsx"],"sourcesContent":["import type { ReactCodeMirrorProps } from \"@uiw/react-codemirror\";\nimport CodeMirror, { EditorView } from \"@uiw/react-codemirror\";\nimport { useId } from \"react\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport styles from \"./CodeEditor.module.scss\";\nimport { type CodeEditorLanguage } from \"@/components/CodeEditor/languages\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\nimport { useObjectRef } from \"react-aria\";\nimport { defaultLightTheme } from \"@/components/CodeEditor/themes/defaultEditorTheme\";\nimport {\n type CodeEditorSetup,\n useCodeEditorExtensions,\n} from \"@/components/CodeEditor/hooks/useCodeEditorExtensions\";\nimport { CopyButton } from \"@/components/CopyButton\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface CodeEditorProps\n extends\n Omit<ReactCodeMirrorProps, \"theme\" | \"lang\" | \"basicSetup\" | \"readOnly\">,\n CodeEditorSetup,\n FlowComponentProps {\n defaultValue?: string;\n isReadOnly?: boolean;\n isInvalid?: boolean;\n className?: string;\n language?: CodeEditorLanguage;\n copyable?: boolean;\n isRequired?: boolean;\n validationBehavior?: unknown;\n}\n\n/**\n * @flr-generate all\n * @flowStatus new\n */\nexport const CodeEditor = flowComponent(\"CodeEditor\", (props) => {\n const {\n ref,\n children,\n className,\n language,\n extensions,\n isReadOnly,\n isInvalid,\n isRequired,\n validationBehavior: _ignoredValidationBehavior,\n value,\n showLineNumbers = true,\n showCodeFolding = true,\n showCodeIndentationMakers = true,\n showLinterMarkers = true,\n showActiveLineMarker = true,\n copyable = true,\n height,\n minHeight,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n ...rest\n } = useControlledHostValueProps(props);\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"CodeEditor\");\n\n const rootClassName = clsx(\n fieldProps.className,\n styles.codeEditor,\n className,\n );\n\n const labelId = useId();\n const descriptionId = useId();\n\n /**\n * The label and the field description are declared as children of the code\n * editor, but must be rendered outside of the editor itself. They are\n * tunneled out of the editor – just like the field error. Their ids are the\n * ones the editor references.\n */\n const propsContext: PropsContext = {\n ...fieldPropsContext,\n Label: {\n ...fieldPropsContext.Label,\n id: labelId,\n tunnel: { id: \"label\", component: \"CodeEditor\" },\n },\n FieldDescription: {\n ...fieldPropsContext.FieldDescription,\n id: descriptionId,\n tunnel: { id: \"fieldDescription\", component: \"CodeEditor\" },\n },\n };\n\n const enabledExtensions = useCodeEditorExtensions(language, extensions, {\n showLineNumbers: showLineNumbers,\n showCodeIndentationMakers: showCodeIndentationMakers,\n showCodeFolding: showCodeFolding,\n showLinterMarkers: showLinterMarkers,\n });\n\n /**\n * The editable element of CodeMirror is the `.cm-content` element – not the\n * root element the props are applied to. Its ARIA attributes are set through\n * the content attributes facet.\n *\n * The label reference only resolves when a label is given. Without one, an\n * `aria-label` names the editor instead – the name computation skips\n * references that point at nothing.\n */\n const labelledBy = [ariaLabelledBy, labelId].filter(Boolean).join(\" \");\n\n const describedBy =\n [descriptionId, fieldProps[\"aria-describedby\"]].filter(Boolean).join(\" \") ||\n undefined;\n\n const contentAttributes = EditorView.contentAttributes.of({\n \"aria-labelledby\": labelledBy,\n ...(ariaLabel ? { \"aria-label\": ariaLabel } : {}),\n ...(describedBy ? { \"aria-describedby\": describedBy } : {}),\n ...(isRequired ? { \"aria-required\": \"true\" } : {}),\n ...(isInvalid ? { \"aria-invalid\": \"true\" } : {}),\n });\n\n const localRef = useObjectRef(ref);\n\n useMakeFocusable(localRef);\n\n return (\n <div className={rootClassName}>\n <PropsContextProvider props={propsContext}>\n <UiComponentTunnelExit id=\"label\" component=\"CodeEditor\" />\n <FieldErrorCaptureContext>\n <CodeMirror\n {...rest}\n value={value}\n basicSetup={{\n highlightActiveLine: showActiveLineMarker,\n highlightActiveLineGutter: showActiveLineMarker,\n autocompletion: false,\n lineNumbers: false,\n foldGutter: false,\n highlightSelectionMatches: false,\n }}\n theme={defaultLightTheme}\n data-invalid={isInvalid || undefined}\n readOnly={isReadOnly}\n className={clsx(styles.codeMirror, isReadOnly && styles.readonly)}\n ref={(codeMirrorRef) => {\n if (codeMirrorRef?.editor) {\n localRef.current = codeMirrorRef.editor;\n }\n }}\n extensions={[...enabledExtensions, contentAttributes]}\n height={height ?? minHeight}\n >\n {copyable && (\n <CopyButton\n className={styles.copyButton}\n size=\"s\"\n variant=\"soft\"\n text={value}\n />\n )}\n {children}\n </CodeMirror>\n </FieldErrorCaptureContext>\n <UiComponentTunnelExit id=\"fieldDescription\" component=\"CodeEditor\" />\n <FieldErrorView />\n </PropsContextProvider>\n </div>\n );\n});\n\nexport default CodeEditor;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CodeEditor.mjs","sources":["../../../../../../../src/components/CodeEditor/CodeEditor.tsx"],"sourcesContent":["import type { ReactCodeMirrorProps } from \"@uiw/react-codemirror\";\nimport CodeMirror, { EditorView } from \"@uiw/react-codemirror\";\nimport { useId } from \"react\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport styles from \"./CodeEditor.module.scss\";\nimport { type CodeEditorLanguage } from \"@/components/CodeEditor/languages\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\nimport { useObjectRef } from \"react-aria\";\nimport { defaultLightTheme } from \"@/components/CodeEditor/themes/defaultEditorTheme\";\nimport {\n type CodeEditorSetup,\n useCodeEditorExtensions,\n} from \"@/components/CodeEditor/hooks/useCodeEditorExtensions\";\nimport { CopyButton } from \"@/components/CopyButton\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface CodeEditorProps\n extends\n Omit<ReactCodeMirrorProps, \"theme\" | \"lang\" | \"basicSetup\" | \"readOnly\">,\n CodeEditorSetup,\n FlowComponentProps {\n defaultValue?: string;\n isReadOnly?: boolean;\n isInvalid?: boolean;\n className?: string;\n language?: CodeEditorLanguage;\n copyable?: boolean;\n isRequired?: boolean;\n validationBehavior?: unknown;\n}\n\n/**\n * @flr-generate all\n * @flowStatus new\n */\nexport const CodeEditor = flowComponent(\"CodeEditor\", (props) => {\n const {\n ref,\n children,\n className,\n language,\n extensions,\n isReadOnly,\n isInvalid,\n isRequired,\n validationBehavior: _ignoredValidationBehavior,\n value,\n showLineNumbers = true,\n showCodeFolding = true,\n showCodeIndentationMakers = true,\n showLinterMarkers = true,\n showActiveLineMarker = true,\n copyable = true,\n height,\n minHeight,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n ...rest\n } = useControlledHostValueProps(props);\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"CodeEditor\");\n\n const rootClassName = clsx(\n fieldProps.className,\n styles.codeEditor,\n className,\n );\n\n const labelId = useId();\n const descriptionId = useId();\n\n /**\n * The label and the field description are declared as children of the code\n * editor, but must be rendered outside of the editor itself. They are\n * tunneled out of the editor – just like the field error. Their ids are the\n * ones the editor references.\n */\n const propsContext: PropsContext = {\n ...fieldPropsContext,\n Label: {\n ...fieldPropsContext.Label,\n id: labelId,\n tunnel: { id: \"label\", component: \"CodeEditor\" },\n },\n FieldDescription: {\n ...fieldPropsContext.FieldDescription,\n id: descriptionId,\n tunnel: { id: \"fieldDescription\", component: \"CodeEditor\" },\n },\n };\n\n const enabledExtensions = useCodeEditorExtensions(language, extensions, {\n showLineNumbers: showLineNumbers,\n showCodeIndentationMakers: showCodeIndentationMakers,\n showCodeFolding: showCodeFolding,\n showLinterMarkers: showLinterMarkers,\n });\n\n /**\n * The editable element of CodeMirror is the `.cm-content` element – not the\n * root element the props are applied to. Its ARIA attributes are set through\n * the content attributes facet.\n *\n * The label reference only resolves when a label is given. Without one, an\n * `aria-label` names the editor instead – the name computation skips\n * references that point at nothing.\n */\n const labelledBy = [ariaLabelledBy, labelId].filter(Boolean).join(\" \");\n\n const describedBy =\n [descriptionId, fieldProps[\"aria-describedby\"]].filter(Boolean).join(\" \") ||\n undefined;\n\n const contentAttributes = EditorView.contentAttributes.of({\n \"aria-labelledby\": labelledBy,\n ...(ariaLabel ? { \"aria-label\": ariaLabel } : {}),\n ...(describedBy ? { \"aria-describedby\": describedBy } : {}),\n ...(isRequired ? { \"aria-required\": \"true\" } : {}),\n ...(isInvalid ? { \"aria-invalid\": \"true\" } : {}),\n });\n\n const localRef = useObjectRef(ref);\n\n useMakeFocusable(localRef);\n\n return (\n <div className={rootClassName}>\n <PropsContextProvider props={propsContext}>\n <UiComponentTunnelExit id=\"label\" component=\"CodeEditor\" />\n <FieldErrorCaptureContext>\n <CodeMirror\n {...rest}\n value={value}\n basicSetup={{\n highlightActiveLine: showActiveLineMarker,\n highlightActiveLineGutter: showActiveLineMarker,\n autocompletion: false,\n lineNumbers: false,\n foldGutter: false,\n highlightSelectionMatches: false,\n }}\n theme={defaultLightTheme}\n data-invalid={isInvalid || undefined}\n readOnly={isReadOnly}\n className={clsx(styles.codeMirror, isReadOnly && styles.readonly)}\n ref={(codeMirrorRef) => {\n if (codeMirrorRef?.editor) {\n localRef.current = codeMirrorRef.editor;\n }\n }}\n extensions={[...enabledExtensions, contentAttributes]}\n height={height ?? minHeight}\n >\n {copyable && (\n <CopyButton\n className={styles.copyButton}\n size=\"s\"\n variant=\"soft\"\n text={value}\n />\n )}\n {children}\n </CodeMirror>\n </FieldErrorCaptureContext>\n <UiComponentTunnelExit id=\"fieldDescription\" component=\"CodeEditor\" />\n <FieldErrorView />\n </PropsContextProvider>\n </div>\n );\n});\n\nexport default CodeEditor;\n"],"names":[],"mappings":"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"}
|
|
@@ -4,7 +4,6 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
4
4
|
import styles from './ColumnLayout.module.scss.mjs';
|
|
5
5
|
import { getColumns } from './lib/getColumns.mjs';
|
|
6
6
|
import clsx from 'clsx';
|
|
7
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
8
7
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
9
8
|
import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
|
|
10
9
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColumnLayout.mjs","sources":["../../../../../../../src/components/ColumnLayout/ColumnLayout.tsx"],"sourcesContent":["import type { CSSProperties, PropsWithChildren } from \"react\";\nimport styles from \"./ColumnLayout.module.scss\";\nimport { getColumns } from \"./lib/getColumns\";\nimport clsx from \"clsx\";\nimport type {\n PropsWithClassName,\n PropsWithElementType,\n} from \"@/lib/types/props\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\n\ntype GapSize = \"s\" | \"m\" | \"l\" | \"xl\";\n\nexport interface ColumnLayoutProps<\n T extends keyof HTMLElementTagNameMap = \"div\" | \"ul\",\n>\n extends\n PropsWithChildren,\n PropsWithElementType<T>,\n PropsWithClassName,\n FlowComponentProps<HTMLElementTagNameMap[T]> {\n /** Column layout for container size s. */\n s?: (number | null)[];\n /** Column layout for container size m. */\n m?: (number | null)[];\n /** Column layout for container size l. */\n l?: (number | null)[];\n /**\n * Size of the row and column gap between the content blocks inside the column\n * layout.\n *\n * @default \"m\"\n */\n gap?: GapSize;\n /** Size of the row gap between the content blocks inside the column layout. */\n rowGap?: GapSize;\n /** Size of the column gap between the content blocks inside the column layout. */\n columnGap?: GapSize;\n}\n\n/** @flr-generate all */\nexport const ColumnLayout = flowComponent(\n \"ColumnLayout\",\n (props) => {\n const {\n children,\n className,\n s,\n m,\n l,\n gap = \"m\",\n rowGap = gap,\n columnGap = gap,\n elementType = \"div\",\n \"aria-label\": ariaLabel,\n ref,\n style: styleFromProps,\n } = props;\n\n let elementClassName = styles.columnLayout;\n\n s?.map((v, i) => {\n if (v === null) {\n elementClassName = clsx(elementClassName, styles[`hide-s-${i + 1}`]);\n }\n });\n m?.map((v, i) => {\n if (v === null) {\n elementClassName = clsx(elementClassName, styles[`hide-m-${i + 1}`]);\n }\n });\n l?.map((v, i) => {\n if (v === null) {\n elementClassName = clsx(elementClassName, styles[`hide-l-${i + 1}`]);\n }\n });\n\n const columnsS = s ? getColumns(s) : \"1fr\";\n const columnsM = m ? getColumns(m) : s ? columnsS : \"1fr 1fr\";\n const columnsL = l ? getColumns(l) : m || s ? columnsM : \"1fr 1fr 1fr\";\n\n const style = {\n ...styleFromProps,\n \"--column-layout--columns-s\": columnsS,\n \"--column-layout--columns-m\": columnsM,\n \"--column-layout--columns-l\": columnsL,\n \"--column-layout--row-gap\": `var(--column-layout--gap--${rowGap})`,\n \"--column-layout--column-gap\": `var(--column-layout--gap--${columnGap})`,\n } as CSSProperties;\n\n const rootClassName = clsx(styles.columnLayoutContainer, className);\n\n const Element = elementType;\n\n const propsContext: PropsContext = {\n Section: {\n hideSeparator: true,\n },\n };\n\n return (\n <div className={rootClassName} style={style}>\n <Element\n ref={ref as never}\n aria-label={ariaLabel}\n className={elementClassName}\n >\n <PropsContextProvider props={propsContext}>\n {children}\n </PropsContextProvider>\n </Element>\n </div>\n );\n },\n {\n type: \"layout\",\n },\n);\n\nexport default ColumnLayout;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ColumnLayout.mjs","sources":["../../../../../../../src/components/ColumnLayout/ColumnLayout.tsx"],"sourcesContent":["import type { CSSProperties, PropsWithChildren } from \"react\";\nimport styles from \"./ColumnLayout.module.scss\";\nimport { getColumns } from \"./lib/getColumns\";\nimport clsx from \"clsx\";\nimport type {\n PropsWithClassName,\n PropsWithElementType,\n} from \"@/lib/types/props\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\n\ntype GapSize = \"s\" | \"m\" | \"l\" | \"xl\";\n\nexport interface ColumnLayoutProps<\n T extends keyof HTMLElementTagNameMap = \"div\" | \"ul\",\n>\n extends\n PropsWithChildren,\n PropsWithElementType<T>,\n PropsWithClassName,\n FlowComponentProps<HTMLElementTagNameMap[T]> {\n /** Column layout for container size s. */\n s?: (number | null)[];\n /** Column layout for container size m. */\n m?: (number | null)[];\n /** Column layout for container size l. */\n l?: (number | null)[];\n /**\n * Size of the row and column gap between the content blocks inside the column\n * layout.\n *\n * @default \"m\"\n */\n gap?: GapSize;\n /** Size of the row gap between the content blocks inside the column layout. */\n rowGap?: GapSize;\n /** Size of the column gap between the content blocks inside the column layout. */\n columnGap?: GapSize;\n}\n\n/** @flr-generate all */\nexport const ColumnLayout = flowComponent(\n \"ColumnLayout\",\n (props) => {\n const {\n children,\n className,\n s,\n m,\n l,\n gap = \"m\",\n rowGap = gap,\n columnGap = gap,\n elementType = \"div\",\n \"aria-label\": ariaLabel,\n ref,\n style: styleFromProps,\n } = props;\n\n let elementClassName = styles.columnLayout;\n\n s?.map((v, i) => {\n if (v === null) {\n elementClassName = clsx(elementClassName, styles[`hide-s-${i + 1}`]);\n }\n });\n m?.map((v, i) => {\n if (v === null) {\n elementClassName = clsx(elementClassName, styles[`hide-m-${i + 1}`]);\n }\n });\n l?.map((v, i) => {\n if (v === null) {\n elementClassName = clsx(elementClassName, styles[`hide-l-${i + 1}`]);\n }\n });\n\n const columnsS = s ? getColumns(s) : \"1fr\";\n const columnsM = m ? getColumns(m) : s ? columnsS : \"1fr 1fr\";\n const columnsL = l ? getColumns(l) : m || s ? columnsM : \"1fr 1fr 1fr\";\n\n const style = {\n ...styleFromProps,\n \"--column-layout--columns-s\": columnsS,\n \"--column-layout--columns-m\": columnsM,\n \"--column-layout--columns-l\": columnsL,\n \"--column-layout--row-gap\": `var(--column-layout--gap--${rowGap})`,\n \"--column-layout--column-gap\": `var(--column-layout--gap--${columnGap})`,\n } as CSSProperties;\n\n const rootClassName = clsx(styles.columnLayoutContainer, className);\n\n const Element = elementType;\n\n const propsContext: PropsContext = {\n Section: {\n hideSeparator: true,\n },\n };\n\n return (\n <div className={rootClassName} style={style}>\n <Element\n ref={ref as never}\n aria-label={ariaLabel}\n className={elementClassName}\n >\n <PropsContextProvider props={propsContext}>\n {children}\n </PropsContextProvider>\n </Element>\n </div>\n );\n },\n {\n type: \"layout\",\n },\n);\n\nexport default ColumnLayout;\n"],"names":[],"mappings":";;;;;;;AA6CO,MAAM,YAAA,GAAe,aAAA;AAAA,EAC1B,cAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM;AAAA,MACJ,QAAA;AAAA,MACA,SAAA;AAAA,MACA,CAAA;AAAA,MACA,CAAA;AAAA,MACA,CAAA;AAAA,MACA,GAAA,GAAM,GAAA;AAAA,MACN,MAAA,GAAS,GAAA;AAAA,MACT,SAAA,GAAY,GAAA;AAAA,MACZ,WAAA,GAAc,KAAA;AAAA,MACd,YAAA,EAAc,SAAA;AAAA,MACd,GAAA;AAAA,MACA,KAAA,EAAO;AAAA,KACT,GAAI,KAAA;AAEJ,IAAA,IAAI,mBAAmB,MAAA,CAAO,YAAA;AAE9B,IAAA,CAAA,EAAG,GAAA,CAAI,CAAC,CAAA,EAAG,CAAA,KAAM;AACf,MAAA,IAAI,MAAM,IAAA,EAAM;AACd,QAAA,gBAAA,GAAmB,KAAK,gBAAA,EAAkB,MAAA,CAAO,UAAU,CAAA,GAAI,CAAC,EAAE,CAAC,CAAA;AAAA,MACrE;AAAA,IACF,CAAC,CAAA;AACD,IAAA,CAAA,EAAG,GAAA,CAAI,CAAC,CAAA,EAAG,CAAA,KAAM;AACf,MAAA,IAAI,MAAM,IAAA,EAAM;AACd,QAAA,gBAAA,GAAmB,KAAK,gBAAA,EAAkB,MAAA,CAAO,UAAU,CAAA,GAAI,CAAC,EAAE,CAAC,CAAA;AAAA,MACrE;AAAA,IACF,CAAC,CAAA;AACD,IAAA,CAAA,EAAG,GAAA,CAAI,CAAC,CAAA,EAAG,CAAA,KAAM;AACf,MAAA,IAAI,MAAM,IAAA,EAAM;AACd,QAAA,gBAAA,GAAmB,KAAK,gBAAA,EAAkB,MAAA,CAAO,UAAU,CAAA,GAAI,CAAC,EAAE,CAAC,CAAA;AAAA,MACrE;AAAA,IACF,CAAC,CAAA;AAED,IAAA,MAAM,QAAA,GAAW,CAAA,GAAI,UAAA,CAAW,CAAC,CAAA,GAAI,KAAA;AACrC,IAAA,MAAM,WAAW,CAAA,GAAI,UAAA,CAAW,CAAC,CAAA,GAAI,IAAI,QAAA,GAAW,SAAA;AACpD,IAAA,MAAM,WAAW,CAAA,GAAI,UAAA,CAAW,CAAC,CAAA,GAAI,CAAA,IAAK,IAAI,QAAA,GAAW,aAAA;AAEzD,IAAA,MAAM,KAAA,GAAQ;AAAA,MACZ,GAAG,cAAA;AAAA,MACH,4BAAA,EAA8B,QAAA;AAAA,MAC9B,4BAAA,EAA8B,QAAA;AAAA,MAC9B,4BAAA,EAA8B,QAAA;AAAA,MAC9B,0BAAA,EAA4B,6BAA6B,MAAM,CAAA,CAAA,CAAA;AAAA,MAC/D,6BAAA,EAA+B,6BAA6B,SAAS,CAAA,CAAA;AAAA,KACvE;AAEA,IAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,qBAAA,EAAuB,SAAS,CAAA;AAElE,IAAA,MAAM,OAAA,GAAU,WAAA;AAEhB,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,OAAA,EAAS;AAAA,QACP,aAAA,EAAe;AAAA;AACjB,KACF;AAEA,IAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,aAAA,EAAe,KAAA,EAC7B,QAAA,kBAAA,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,YAAA,EAAY,SAAA;AAAA,QACZ,SAAA,EAAW,gBAAA;AAAA,QAEX,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC1B,QAAA,EACH;AAAA;AAAA,KACF,EACF,CAAA;AAAA,EAEJ,CAAA;AAAA,EACA;AAAA,IACE,IAAA,EAAM;AAAA;AAEV;;;;"}
|
|
@@ -6,7 +6,6 @@ import * as Aria from 'react-aria-components';
|
|
|
6
6
|
import { Button } from '../Button/Button.mjs';
|
|
7
7
|
import { IconChevronDown } from '../Icon/components/icons/IconChevronDown.mjs';
|
|
8
8
|
import { Options } from '../Options/Options.mjs';
|
|
9
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
10
9
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
11
10
|
import clsx from 'clsx';
|
|
12
11
|
import styles from './ComboBox.module.scss.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboBox.mjs","sources":["../../../../../../../src/components/ComboBox/ComboBox.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport type { Key } from \"react-aria-components\";\nimport * as Aria from \"react-aria-components\";\nimport { Button } from \"@/components/Button\";\nimport { IconChevronDown } from \"@/components/Icon/components/icons\";\nimport { Options } from \"@/components/Options\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport styles from \"./ComboBox.module.scss\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport type { OptionsProps } from \"@/components/Options/Options\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface ComboBoxProps\n extends\n Omit<Aria.ComboBoxProps<never>, \"children\" | \"onChange\">,\n Pick<Aria.InputProps, \"placeholder\">,\n Pick<OptionsProps, \"renderEmptyState\">,\n PropsWithChildren,\n FlowComponentProps<HTMLInputElement> {\n onChange?: (value: string) => void;\n}\n\n/** @flr-generate all */\nexport const ComboBox = flowComponent(\"ComboBox\", (props) => {\n const {\n children,\n className,\n menuTrigger = \"focus\",\n onChange,\n onSelectionChange,\n placeholder,\n ref,\n renderEmptyState,\n ...rest\n } = props;\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"ComboBox\");\n\n const stringFormatter = useLocalizedStringFormatter(locales, \"ComboBox\");\n\n const rootClassName = clsx(fieldProps.className, styles.comboBox, className);\n\n const propsContext: PropsContext = {\n Option: {\n tunnel: {\n id: \"options\",\n component: \"ComboBox\",\n },\n },\n ...fieldPropsContext,\n };\n\n const handleSelectionChange = (key: Key | null) => {\n if (key === null) {\n return;\n }\n onChange?.(String(key));\n onSelectionChange?.(key);\n };\n\n const controller = useOverlayController(\"ComboBox\", {\n reuseControllerFromContext: false,\n });\n\n return (\n <Aria.ComboBox\n {...fieldProps}\n menuTrigger={menuTrigger}\n className={rootClassName}\n {...rest}\n onSelectionChange={handleSelectionChange}\n onOpenChange={(isOpen) => {\n controller.setOpen(isOpen);\n }}\n >\n <PropsContextProvider props={propsContext}>\n <FieldErrorCaptureContext>\n <div className={styles.input}>\n <Aria.Input placeholder={placeholder} ref={ref} />\n <Button\n className={styles.toggle}\n aria-label={stringFormatter.format(\"showOptions\")}\n variant=\"plain\"\n color=\"secondary\"\n >\n <IconChevronDown />\n </Button>\n </div>\n\n {children}\n\n <Options\n controller={controller}\n onOpenChange={() => {\n // cut-off to avoid double controller state changes\n }}\n renderEmptyState={renderEmptyState}\n >\n <UiComponentTunnelExit id=\"options\" component=\"ComboBox\" />\n </Options>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </PropsContextProvider>\n </Aria.ComboBox>\n );\n});\n\nexport default ComboBox;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ComboBox.mjs","sources":["../../../../../../../src/components/ComboBox/ComboBox.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport type { Key } from \"react-aria-components\";\nimport * as Aria from \"react-aria-components\";\nimport { Button } from \"@/components/Button\";\nimport { IconChevronDown } from \"@/components/Icon/components/icons\";\nimport { Options } from \"@/components/Options\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\nimport styles from \"./ComboBox.module.scss\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport type { OptionsProps } from \"@/components/Options/Options\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface ComboBoxProps\n extends\n Omit<Aria.ComboBoxProps<never>, \"children\" | \"onChange\">,\n Pick<Aria.InputProps, \"placeholder\">,\n Pick<OptionsProps, \"renderEmptyState\">,\n PropsWithChildren,\n FlowComponentProps<HTMLInputElement> {\n onChange?: (value: string) => void;\n}\n\n/** @flr-generate all */\nexport const ComboBox = flowComponent(\"ComboBox\", (props) => {\n const {\n children,\n className,\n menuTrigger = \"focus\",\n onChange,\n onSelectionChange,\n placeholder,\n ref,\n renderEmptyState,\n ...rest\n } = props;\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"ComboBox\");\n\n const stringFormatter = useLocalizedStringFormatter(locales, \"ComboBox\");\n\n const rootClassName = clsx(fieldProps.className, styles.comboBox, className);\n\n const propsContext: PropsContext = {\n Option: {\n tunnel: {\n id: \"options\",\n component: \"ComboBox\",\n },\n },\n ...fieldPropsContext,\n };\n\n const handleSelectionChange = (key: Key | null) => {\n if (key === null) {\n return;\n }\n onChange?.(String(key));\n onSelectionChange?.(key);\n };\n\n const controller = useOverlayController(\"ComboBox\", {\n reuseControllerFromContext: false,\n });\n\n return (\n <Aria.ComboBox\n {...fieldProps}\n menuTrigger={menuTrigger}\n className={rootClassName}\n {...rest}\n onSelectionChange={handleSelectionChange}\n onOpenChange={(isOpen) => {\n controller.setOpen(isOpen);\n }}\n >\n <PropsContextProvider props={propsContext}>\n <FieldErrorCaptureContext>\n <div className={styles.input}>\n <Aria.Input placeholder={placeholder} ref={ref} />\n <Button\n className={styles.toggle}\n aria-label={stringFormatter.format(\"showOptions\")}\n variant=\"plain\"\n color=\"secondary\"\n >\n <IconChevronDown />\n </Button>\n </div>\n\n {children}\n\n <Options\n controller={controller}\n onOpenChange={() => {\n // cut-off to avoid double controller state changes\n }}\n renderEmptyState={renderEmptyState}\n >\n <UiComponentTunnelExit id=\"options\" component=\"ComboBox\" />\n </Options>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </PropsContextProvider>\n </Aria.ComboBox>\n );\n});\n\nexport default ComboBox;\n"],"names":[],"mappings":"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"}
|
|
@@ -6,7 +6,6 @@ import { getCloseOverlayType, getAriaSelectionMode, getMenuItemSelectionVariant
|
|
|
6
6
|
import { Popover } from '../Popover/Popover.mjs';
|
|
7
7
|
import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
|
|
8
8
|
import { OverlayContextProvider } from '../../lib/controller/overlay/OverlayContextProvider.mjs';
|
|
9
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
10
9
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
11
10
|
import ContextMenuContentView from '../../views/ContextMenuContentView.mjs';
|
|
12
11
|
import styles from './ContextMenu.module.scss.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenu.mjs","sources":["../../../../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["import { Action } from \"@/components/Action\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n getAriaSelectionMode,\n getCloseOverlayType,\n getMenuItemSelectionVariant,\n} from \"@/components/ContextMenu/lib\";\nimport type { MenuItemProps } from \"@/components/MenuItem\";\nimport { Popover, type PopoverProps } from \"@/components/Popover/Popover\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport { OverlayContextProvider } from \"@/lib/controller/overlay/OverlayContextProvider\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport ContextMenuContentView from \"@/views/ContextMenuContentView\";\nimport type * as Aria from \"react-aria-components\";\nimport styles from \"./ContextMenu.module.scss\";\nimport { OverlayContentSuspendWatcher } from \"@/lib/controller/overlay/OverlayContentSuspendWatcher\";\n\nexport interface ContextMenuProps\n extends\n Omit<PopoverProps, \"withTip\">,\n Pick<\n Aria.MenuProps<MenuItemProps>,\n | \"onAction\"\n | \"selectedKeys\"\n | \"defaultSelectedKeys\"\n | \"onSelectionChange\"\n | \"disabledKeys\"\n | \"renderEmptyState\"\n >,\n FlowComponentProps {\n /** The type of selection that is allowed in the context menu. */\n selectionMode?: ContextMenuSelectionMode;\n /** Sets the context menu to a fixed width. */\n width?: string | number;\n}\n\n/** @flr-generate all */\nexport const ContextMenu = flowComponent(\"ContextMenu\", (props) => {\n const {\n children,\n onAction,\n selectionMode,\n selectedKeys,\n defaultSelectedKeys,\n disabledKeys,\n onSelectionChange,\n renderEmptyState,\n ref,\n controller: overlayControllerFromProps,\n ...rest\n } = props;\n\n const overlayControllerFromContext = useOverlayController(\"ContextMenu\", {\n reuseControllerFromContext: true,\n });\n\n const overlayController =\n overlayControllerFromProps ?? overlayControllerFromContext;\n\n const selectionVariant = getMenuItemSelectionVariant(selectionMode);\n\n const propsContext: PropsContext = {\n MenuItem: {\n selectionVariant,\n Avatar: {\n size: \"l\",\n },\n },\n\n Section: {\n MenuItem: {\n Avatar: {\n size: \"l\",\n },\n },\n renderContextMenuSection: true,\n },\n\n ContextMenuSection: {\n MenuItem: {\n Avatar: {\n size: \"l\",\n },\n },\n },\n };\n\n return (\n <OverlayContentSuspendWatcher overlayController={overlayController}>\n <Popover\n {...rest}\n className={styles.popover}\n controller={overlayController}\n isDialogContent={false}\n >\n <OverlayContextProvider\n type=\"ContextMenu\"\n controller={overlayController}\n >\n <ContextMenuContentView\n className={styles.contextMenu}\n onAction={onAction}\n selectionMode={getAriaSelectionMode(selectionMode)}\n selectedKeys={selectedKeys}\n defaultSelectedKeys={defaultSelectedKeys}\n disabledKeys={disabledKeys}\n onSelectionChange={onSelectionChange}\n renderEmptyState={renderEmptyState}\n ref={ref}\n >\n <PropsContextProvider props={propsContext}>\n <Action closeOverlay={getCloseOverlayType(selectionMode)}>\n {children}\n </Action>\n </PropsContextProvider>\n </ContextMenuContentView>\n </OverlayContextProvider>\n </Popover>\n </OverlayContentSuspendWatcher>\n );\n});\n\nexport default ContextMenu;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ContextMenu.mjs","sources":["../../../../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["import { Action } from \"@/components/Action\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n getAriaSelectionMode,\n getCloseOverlayType,\n getMenuItemSelectionVariant,\n} from \"@/components/ContextMenu/lib\";\nimport type { MenuItemProps } from \"@/components/MenuItem\";\nimport { Popover, type PopoverProps } from \"@/components/Popover/Popover\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport { OverlayContextProvider } from \"@/lib/controller/overlay/OverlayContextProvider\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport ContextMenuContentView from \"@/views/ContextMenuContentView\";\nimport type * as Aria from \"react-aria-components\";\nimport styles from \"./ContextMenu.module.scss\";\nimport { OverlayContentSuspendWatcher } from \"@/lib/controller/overlay/OverlayContentSuspendWatcher\";\n\nexport interface ContextMenuProps\n extends\n Omit<PopoverProps, \"withTip\">,\n Pick<\n Aria.MenuProps<MenuItemProps>,\n | \"onAction\"\n | \"selectedKeys\"\n | \"defaultSelectedKeys\"\n | \"onSelectionChange\"\n | \"disabledKeys\"\n | \"renderEmptyState\"\n >,\n FlowComponentProps {\n /** The type of selection that is allowed in the context menu. */\n selectionMode?: ContextMenuSelectionMode;\n /** Sets the context menu to a fixed width. */\n width?: string | number;\n}\n\n/** @flr-generate all */\nexport const ContextMenu = flowComponent(\"ContextMenu\", (props) => {\n const {\n children,\n onAction,\n selectionMode,\n selectedKeys,\n defaultSelectedKeys,\n disabledKeys,\n onSelectionChange,\n renderEmptyState,\n ref,\n controller: overlayControllerFromProps,\n ...rest\n } = props;\n\n const overlayControllerFromContext = useOverlayController(\"ContextMenu\", {\n reuseControllerFromContext: true,\n });\n\n const overlayController =\n overlayControllerFromProps ?? overlayControllerFromContext;\n\n const selectionVariant = getMenuItemSelectionVariant(selectionMode);\n\n const propsContext: PropsContext = {\n MenuItem: {\n selectionVariant,\n Avatar: {\n size: \"l\",\n },\n },\n\n Section: {\n MenuItem: {\n Avatar: {\n size: \"l\",\n },\n },\n renderContextMenuSection: true,\n },\n\n ContextMenuSection: {\n MenuItem: {\n Avatar: {\n size: \"l\",\n },\n },\n },\n };\n\n return (\n <OverlayContentSuspendWatcher overlayController={overlayController}>\n <Popover\n {...rest}\n className={styles.popover}\n controller={overlayController}\n isDialogContent={false}\n >\n <OverlayContextProvider\n type=\"ContextMenu\"\n controller={overlayController}\n >\n <ContextMenuContentView\n className={styles.contextMenu}\n onAction={onAction}\n selectionMode={getAriaSelectionMode(selectionMode)}\n selectedKeys={selectedKeys}\n defaultSelectedKeys={defaultSelectedKeys}\n disabledKeys={disabledKeys}\n onSelectionChange={onSelectionChange}\n renderEmptyState={renderEmptyState}\n ref={ref}\n >\n <PropsContextProvider props={propsContext}>\n <Action closeOverlay={getCloseOverlayType(selectionMode)}>\n {children}\n </Action>\n </PropsContextProvider>\n </ContextMenuContentView>\n </OverlayContextProvider>\n </Popover>\n </OverlayContentSuspendWatcher>\n );\n});\n\nexport default ContextMenu;\n"],"names":[],"mappings":";;;;;;;;;;;;AAwCO,MAAM,WAAA,GAAc,aAAA,CAAc,aAAA,EAAe,CAAC,KAAA,KAAU;AACjE,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,QAAA;AAAA,IACA,aAAA;AAAA,IACA,YAAA;AAAA,IACA,mBAAA;AAAA,IACA,YAAA;AAAA,IACA,iBAAA;AAAA,IACA,gBAAA;AAAA,IACA,GAAA;AAAA,IACA,UAAA,EAAY,0BAAA;AAAA,IACZ,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,4BAAA,GAA+B,qBAAqB,aAAA,EAAe;AAAA,IACvE,0BAAA,EAA4B;AAAA,GAC7B,CAAA;AAED,EAAA,MAAM,oBACJ,0BAAA,IAA8B,4BAAA;AAEhC,EAAA,MAAM,gBAAA,GAAmB,4BAA4B,aAAa,CAAA;AAElE,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,QAAA,EAAU;AAAA,MACR,gBAAA;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,IAAA,EAAM;AAAA;AACR,KACF;AAAA,IAEA,OAAA,EAAS;AAAA,MACP,QAAA,EAAU;AAAA,QACR,MAAA,EAAQ;AAAA,UACN,IAAA,EAAM;AAAA;AACR,OACF;AAAA,MACA,wBAAA,EAA0B;AAAA,KAC5B;AAAA,IAEA,kBAAA,EAAoB;AAAA,MAClB,QAAA,EAAU;AAAA,QACR,MAAA,EAAQ;AAAA,UACN,IAAA,EAAM;AAAA;AACR;AACF;AACF,GACF;AAEA,EAAA,uBACE,GAAA,CAAC,gCAA6B,iBAAA,EAC5B,QAAA,kBAAA,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,WAAW,MAAA,CAAO,OAAA;AAAA,MAClB,UAAA,EAAY,iBAAA;AAAA,MACZ,eAAA,EAAiB,KAAA;AAAA,MAEjB,QAAA,kBAAA,GAAA;AAAA,QAAC,sBAAA;AAAA,QAAA;AAAA,UACC,IAAA,EAAK,aAAA;AAAA,UACL,UAAA,EAAY,iBAAA;AAAA,UAEZ,QAAA,kBAAA,GAAA;AAAA,YAAC,sBAAA;AAAA,YAAA;AAAA,cACC,WAAW,MAAA,CAAO,WAAA;AAAA,cAClB,QAAA;AAAA,cACA,aAAA,EAAe,qBAAqB,aAAa,CAAA;AAAA,cACjD,YAAA;AAAA,cACA,mBAAA;AAAA,cACA,YAAA;AAAA,cACA,iBAAA;AAAA,cACA,gBAAA;AAAA,cACA,GAAA;AAAA,cAEA,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,YAAA,EAAc,mBAAA,CAAoB,aAAa,CAAA,EACpD,QAAA,EACH,CAAA,EACF;AAAA;AAAA;AACF;AAAA;AACF;AAAA,GACF,EACF,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -2,7 +2,6 @@
|
|
|
2
2
|
/* */
|
|
3
3
|
import { jsx } from 'react/jsx-runtime';
|
|
4
4
|
import * as Aria from 'react-aria-components';
|
|
5
|
-
import '../../../../lib/propsContext/propsContext.mjs';
|
|
6
5
|
import { PropsContextProvider } from '../../../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
7
6
|
import { flowComponent } from '../../../../lib/componentFactory/flowComponent.mjs';
|
|
8
7
|
import styles from '../../ContextMenu.module.scss.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenuSection.mjs","sources":["../../../../../../../../../src/components/ContextMenu/components/ContextMenuSection/ContextMenuSection.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { PropsWithChildren } from \"react\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport styles from \"../../ContextMenu.module.scss\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n getAriaSelectionMode,\n getCloseOverlayType,\n getMenuItemSelectionVariant,\n} from \"@/components/ContextMenu/lib\";\nimport { Action } from \"@/components/Action\";\nimport type { MenuItemProps } from \"@/components/MenuItem\";\n\nexport type ContextMenuSectionProps = PropsWithChildren &\n FlowComponentProps &\n Pick<\n Aria.MenuSectionProps<MenuItemProps>,\n \"defaultSelectedKeys\" | \"selectedKeys\"\n > & {\n selectionMode?: ContextMenuSelectionMode;\n };\n\n/** @flr-generate all */\nexport const ContextMenuSection = flowComponent(\n \"ContextMenuSection\",\n (props) => {\n const { children, selectionMode, ref, ...rest } = props;\n\n const selectionVariant = getMenuItemSelectionVariant(selectionMode);\n\n const propsContext: PropsContext = {\n Heading: {\n level: 5,\n wrapWith: <Aria.Header />,\n },\n MenuItem: {\n selectionVariant,\n },\n };\n\n return (\n <Aria.MenuSection\n ref={ref}\n {...rest}\n selectionMode={getAriaSelectionMode(selectionMode)}\n className={styles.section}\n >\n <PropsContextProvider props={propsContext}>\n <Action skip>\n <Action closeOverlay={getCloseOverlayType(selectionMode)}>\n {children}\n </Action>\n </Action>\n </PropsContextProvider>\n </Aria.MenuSection>\n );\n },\n { type: \"layout\" },\n);\n\nexport default ContextMenuSection;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ContextMenuSection.mjs","sources":["../../../../../../../../../src/components/ContextMenu/components/ContextMenuSection/ContextMenuSection.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { PropsWithChildren } from \"react\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport styles from \"../../ContextMenu.module.scss\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n getAriaSelectionMode,\n getCloseOverlayType,\n getMenuItemSelectionVariant,\n} from \"@/components/ContextMenu/lib\";\nimport { Action } from \"@/components/Action\";\nimport type { MenuItemProps } from \"@/components/MenuItem\";\n\nexport type ContextMenuSectionProps = PropsWithChildren &\n FlowComponentProps &\n Pick<\n Aria.MenuSectionProps<MenuItemProps>,\n \"defaultSelectedKeys\" | \"selectedKeys\"\n > & {\n selectionMode?: ContextMenuSelectionMode;\n };\n\n/** @flr-generate all */\nexport const ContextMenuSection = flowComponent(\n \"ContextMenuSection\",\n (props) => {\n const { children, selectionMode, ref, ...rest } = props;\n\n const selectionVariant = getMenuItemSelectionVariant(selectionMode);\n\n const propsContext: PropsContext = {\n Heading: {\n level: 5,\n wrapWith: <Aria.Header />,\n },\n MenuItem: {\n selectionVariant,\n },\n };\n\n return (\n <Aria.MenuSection\n ref={ref}\n {...rest}\n selectionMode={getAriaSelectionMode(selectionMode)}\n className={styles.section}\n >\n <PropsContextProvider props={propsContext}>\n <Action skip>\n <Action closeOverlay={getCloseOverlayType(selectionMode)}>\n {children}\n </Action>\n </Action>\n </PropsContextProvider>\n </Aria.MenuSection>\n );\n },\n { type: \"layout\" },\n);\n\nexport default ContextMenuSection;\n"],"names":[],"mappings":";;;;;;;;AA0BO,MAAM,kBAAA,GAAqB,aAAA;AAAA,EAChC,oBAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM,EAAE,QAAA,EAAU,aAAA,EAAe,GAAA,EAAK,GAAG,MAAK,GAAI,KAAA;AAElD,IAAA,MAAM,gBAAA,GAAmB,4BAA4B,aAAa,CAAA;AAElE,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,OAAA,EAAS;AAAA,QACP,KAAA,EAAO,CAAA;AAAA,QACP,QAAA,kBAAU,GAAA,CAAC,IAAA,CAAK,MAAA,EAAL,EAAY;AAAA,OACzB;AAAA,MACA,QAAA,EAAU;AAAA,QACR;AAAA;AACF,KACF;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,IAAA,CAAK,WAAA;AAAA,MAAL;AAAA,QACC,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QACJ,aAAA,EAAe,qBAAqB,aAAa,CAAA;AAAA,QACjD,WAAW,MAAA,CAAO,OAAA;AAAA,QAElB,8BAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,UAAO,IAAA,EAAI,IAAA,EACV,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,cAAc,mBAAA,CAAoB,aAAa,CAAA,EACpD,QAAA,EACH,GACF,CAAA,EACF;AAAA;AAAA,KACF;AAAA,EAEJ,CAAA;AAAA,EACA,EAAE,MAAM,QAAA;AACV;;;;"}
|
|
@@ -3,7 +3,6 @@
|
|
|
3
3
|
import { jsx } from 'react/jsx-runtime';
|
|
4
4
|
import { Popover } from '../Popover/Popover.mjs';
|
|
5
5
|
import styles from './ContextualHelp.module.scss.mjs';
|
|
6
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
7
6
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
8
7
|
import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
|
|
9
8
|
import { useOverlayController } from '../../lib/controller/overlay/useOverlayController.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextualHelp.mjs","sources":["../../../../../../../src/components/ContextualHelp/ContextualHelp.tsx"],"sourcesContent":["import type { PopoverProps } from \"@/components/Popover/Popover\";\nimport { Popover } from \"@/components/Popover/Popover\";\nimport styles from \"./ContextualHelp.module.scss\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useOverlayController } from \"@/lib/controller\";\n\nexport type ContextualHelpProps = Omit<PopoverProps, \"withTip\">;\n\n/** @flr-generate all */\nexport const ContextualHelp = flowComponent(\"ContextualHelp\", (props) => {\n const {\n children,\n controller: controllerFromProps,\n ref: ignoredRef,\n ...rest\n } = props;\n\n const controllerFromContext = useOverlayController(\"ContextualHelp\", {\n reuseControllerFromContext: true,\n });\n\n const controller = controllerFromProps ?? controllerFromContext;\n\n const propsContext: PropsContext = {\n // A contextual help holds a single, simple explanation — it does not need\n // its own heading structure. A heading is rendered as a bold text label\n // instead of an actual heading element.\n Heading: {\n level: 5,\n elementType: \"span\",\n },\n };\n\n return (\n <Popover withTip {...rest} controller={controller}>\n <PropsContextProvider props={propsContext}>\n <div className={styles.contextualHelp}>{children}</div>\n </PropsContextProvider>\n </Popover>\n );\n});\n\nexport default ContextualHelp;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ContextualHelp.mjs","sources":["../../../../../../../src/components/ContextualHelp/ContextualHelp.tsx"],"sourcesContent":["import type { PopoverProps } from \"@/components/Popover/Popover\";\nimport { Popover } from \"@/components/Popover/Popover\";\nimport styles from \"./ContextualHelp.module.scss\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useOverlayController } from \"@/lib/controller\";\n\nexport type ContextualHelpProps = Omit<PopoverProps, \"withTip\">;\n\n/** @flr-generate all */\nexport const ContextualHelp = flowComponent(\"ContextualHelp\", (props) => {\n const {\n children,\n controller: controllerFromProps,\n ref: ignoredRef,\n ...rest\n } = props;\n\n const controllerFromContext = useOverlayController(\"ContextualHelp\", {\n reuseControllerFromContext: true,\n });\n\n const controller = controllerFromProps ?? controllerFromContext;\n\n const propsContext: PropsContext = {\n // A contextual help holds a single, simple explanation — it does not need\n // its own heading structure. A heading is rendered as a bold text label\n // instead of an actual heading element.\n Heading: {\n level: 5,\n elementType: \"span\",\n },\n };\n\n return (\n <Popover withTip {...rest} controller={controller}>\n <PropsContextProvider props={propsContext}>\n <div className={styles.contextualHelp}>{children}</div>\n </PropsContextProvider>\n </Popover>\n );\n});\n\nexport default ContextualHelp;\n"],"names":[],"mappings":";;;;;;;AAWO,MAAM,cAAA,GAAiB,aAAA,CAAc,gBAAA,EAAkB,CAAC,KAAA,KAAU;AACvE,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,UAAA,EAAY,mBAAA;AAAA,IACZ,GAAA,EAAK,UAAA;AAAA,IACL,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,qBAAA,GAAwB,qBAAqB,gBAAA,EAAkB;AAAA,IACnE,0BAAA,EAA4B;AAAA,GAC7B,CAAA;AAED,EAAA,MAAM,aAAa,mBAAA,IAAuB,qBAAA;AAE1C,EAAA,MAAM,YAAA,GAA6B;AAAA;AAAA;AAAA;AAAA,IAIjC,OAAA,EAAS;AAAA,MACP,KAAA,EAAO,CAAA;AAAA,MACP,WAAA,EAAa;AAAA;AACf,GACF;AAEA,EAAA,2BACG,OAAA,EAAA,EAAQ,OAAA,EAAO,MAAE,GAAG,IAAA,EAAM,YACzB,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,8BAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAO,cAAA,EAAiB,QAAA,EAAS,GACnD,CAAA,EACF,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -3,7 +3,6 @@
|
|
|
3
3
|
import { jsx } from 'react/jsx-runtime';
|
|
4
4
|
import * as Aria from 'react-aria-components';
|
|
5
5
|
import { OverlayTrigger } from '../../../OverlayTrigger/OverlayTrigger.mjs';
|
|
6
|
-
import '../../../../lib/propsContext/propsContext.mjs';
|
|
7
6
|
import { PropsContextProvider } from '../../../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
8
7
|
import locales from '../../../../../../../_virtual/_.locale.json@df0c8534e2e4f7c6c3d4365218df7347.mjs';
|
|
9
8
|
import { useLocalizedStringFormatter } from '../../../TranslationProvider/useLocalizedStringFormatter.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextualHelpTrigger.mjs","sources":["../../../../../../../../../src/components/ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { OverlayTriggerProps } from \"@/components/OverlayTrigger\";\nimport { OverlayTrigger } from \"@/components/OverlayTrigger\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { IconInfo } from \"@/components/Icon/components/icons\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\n\nexport interface ContextualHelpTriggerProps extends OverlayTriggerProps {\n /**\n * The subject the contextual help is about — not a complete accessibility\n * label. It is inserted into the localized template \"More information about\n * {subject}\", which becomes the accessibility label of the trigger.\n */\n subject?: string;\n /**\n * A complete accessibility label for the trigger, replacing the label built\n * from `subject`. Prefer `subject`, which stays localized — reach for this\n * only when the template does not fit.\n */\n \"aria-label\"?: string;\n}\n\n/** @flr-generate all */\nexport const ContextualHelpTrigger = flowComponent(\n \"ContextualHelpTrigger\",\n (props) => {\n const {\n children,\n subject,\n \"aria-label\": ariaLabelFromProps,\n ...triggerProps\n } = props;\n const stringFormatter = useLocalizedStringFormatter(\n locales,\n \"ContextualHelpTrigger\",\n );\n\n const ariaLabel =\n ariaLabelFromProps ??\n (subject === undefined\n ? stringFormatter.format(\"moreInformation\")\n : stringFormatter.format(\"moreInformationAbout\", { subject }));\n\n const propsContext: PropsContext = {\n Button: {\n \"aria-label\": ariaLabel,\n children: <IconInfo />,\n size: \"s\",\n variant: \"plain\",\n ariaSlot: null,\n },\n };\n\n return (\n <OverlayTrigger\n overlayType=\"ContextualHelp\"\n {...triggerProps}\n component={Aria.DialogTrigger}\n >\n <PropsContextProvider props={propsContext}>\n {children}\n </PropsContextProvider>\n </OverlayTrigger>\n );\n },\n { type: \"provider\" },\n);\n\nexport default ContextualHelpTrigger;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ContextualHelpTrigger.mjs","sources":["../../../../../../../../../src/components/ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { OverlayTriggerProps } from \"@/components/OverlayTrigger\";\nimport { OverlayTrigger } from \"@/components/OverlayTrigger\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { IconInfo } from \"@/components/Icon/components/icons\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\n\nexport interface ContextualHelpTriggerProps extends OverlayTriggerProps {\n /**\n * The subject the contextual help is about — not a complete accessibility\n * label. It is inserted into the localized template \"More information about\n * {subject}\", which becomes the accessibility label of the trigger.\n */\n subject?: string;\n /**\n * A complete accessibility label for the trigger, replacing the label built\n * from `subject`. Prefer `subject`, which stays localized — reach for this\n * only when the template does not fit.\n */\n \"aria-label\"?: string;\n}\n\n/** @flr-generate all */\nexport const ContextualHelpTrigger = flowComponent(\n \"ContextualHelpTrigger\",\n (props) => {\n const {\n children,\n subject,\n \"aria-label\": ariaLabelFromProps,\n ...triggerProps\n } = props;\n const stringFormatter = useLocalizedStringFormatter(\n locales,\n \"ContextualHelpTrigger\",\n );\n\n const ariaLabel =\n ariaLabelFromProps ??\n (subject === undefined\n ? stringFormatter.format(\"moreInformation\")\n : stringFormatter.format(\"moreInformationAbout\", { subject }));\n\n const propsContext: PropsContext = {\n Button: {\n \"aria-label\": ariaLabel,\n children: <IconInfo />,\n size: \"s\",\n variant: \"plain\",\n ariaSlot: null,\n },\n };\n\n return (\n <OverlayTrigger\n overlayType=\"ContextualHelp\"\n {...triggerProps}\n component={Aria.DialogTrigger}\n >\n <PropsContextProvider props={propsContext}>\n {children}\n </PropsContextProvider>\n </OverlayTrigger>\n );\n },\n { type: \"provider\" },\n);\n\nexport default ContextualHelpTrigger;\n"],"names":[],"mappings":";;;;;;;;;AA0BO,MAAM,qBAAA,GAAwB,aAAA;AAAA,EACnC,uBAAA;AAAA,EACA,CAAC,KAAA,KAAU;AACT,IAAA,MAAM;AAAA,MACJ,QAAA;AAAA,MACA,OAAA;AAAA,MACA,YAAA,EAAc,kBAAA;AAAA,MACd,GAAG;AAAA,KACL,GAAI,KAAA;AACJ,IAAA,MAAM,eAAA,GAAkB,2BAAA;AAAA,MACtB,OAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,SAAA,GACJ,kBAAA,KACC,OAAA,KAAY,MAAA,GACT,eAAA,CAAgB,MAAA,CAAO,iBAAiB,CAAA,GACxC,eAAA,CAAgB,MAAA,CAAO,sBAAA,EAAwB,EAAE,SAAS,CAAA,CAAA;AAEhE,IAAA,MAAM,YAAA,GAA6B;AAAA,MACjC,MAAA,EAAQ;AAAA,QACN,YAAA,EAAc,SAAA;AAAA,QACd,QAAA,sBAAW,QAAA,EAAA,EAAS,CAAA;AAAA,QACpB,IAAA,EAAM,GAAA;AAAA,QACN,OAAA,EAAS,OAAA;AAAA,QACT,QAAA,EAAU;AAAA;AACZ,KACF;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,cAAA;AAAA,MAAA;AAAA,QACC,WAAA,EAAY,gBAAA;AAAA,QACX,GAAG,YAAA;AAAA,QACJ,WAAW,IAAA,CAAK,aAAA;AAAA,QAEhB,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC1B,QAAA,EACH;AAAA;AAAA,KACF;AAAA,EAEJ,CAAA;AAAA,EACA,EAAE,MAAM,UAAA;AACV;;;;"}
|
|
@@ -3,7 +3,6 @@
|
|
|
3
3
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
4
4
|
import 'react';
|
|
5
5
|
import clsx from 'clsx';
|
|
6
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
7
6
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
8
7
|
import * as Aria from 'react-aria-components';
|
|
9
8
|
import { Popover } from '../Popover/Popover.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePicker.mjs","sources":["../../../../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport * as Aria from \"react-aria-components\";\nimport { DateInput } from \"./components/DateInput\";\nimport { Popover } from \"@/components/Popover/Popover\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { Calendar } from \"@/components/Calendar\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport styles from \"./DatePicker.module.scss\";\n\nexport interface DatePickerProps<T extends Aria.DateValue = Aria.DateValue>\n extends\n PropsWithChildren<Omit<Aria.DatePickerProps<T>, \"children\" | \"ref\">>,\n FlowComponentProps<HTMLSpanElement> {}\n\n/** @flr-generate all */\nexport const DatePicker = flowComponent(\"DatePicker\", (props) => {\n const { children, className, onChange, ref, ...rest } = props;\n\n const popoverController = useOverlayController(\"Popover\");\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"DatePicker\");\n\n const rootClassName = clsx(fieldProps.className, className);\n\n return (\n <Aria.DatePicker\n {...rest}\n {...fieldProps}\n className={rootClassName}\n onOpenChange={(v) => popoverController.setOpen(v)}\n isOpen={popoverController.isOpen}\n onChange={(value) => {\n if (onChange) {\n onChange(value);\n }\n popoverController.close();\n }}\n >\n <FieldErrorCaptureContext>\n <DateInput isDisabled={props.isDisabled} ref={ref} />\n <PropsContextProvider props={fieldPropsContext}>\n {children}\n </PropsContextProvider>\n <Popover\n placement=\"bottom end\"\n isDialogContent\n controller={popoverController}\n >\n <Calendar className={styles.calendar} />\n </Popover>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.DatePicker>\n );\n});\n\nexport default DatePicker;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"DatePicker.mjs","sources":["../../../../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport * as Aria from \"react-aria-components\";\nimport { DateInput } from \"./components/DateInput\";\nimport { Popover } from \"@/components/Popover/Popover\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { Calendar } from \"@/components/Calendar\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport styles from \"./DatePicker.module.scss\";\n\nexport interface DatePickerProps<T extends Aria.DateValue = Aria.DateValue>\n extends\n PropsWithChildren<Omit<Aria.DatePickerProps<T>, \"children\" | \"ref\">>,\n FlowComponentProps<HTMLSpanElement> {}\n\n/** @flr-generate all */\nexport const DatePicker = flowComponent(\"DatePicker\", (props) => {\n const { children, className, onChange, ref, ...rest } = props;\n\n const popoverController = useOverlayController(\"Popover\");\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"DatePicker\");\n\n const rootClassName = clsx(fieldProps.className, className);\n\n return (\n <Aria.DatePicker\n {...rest}\n {...fieldProps}\n className={rootClassName}\n onOpenChange={(v) => popoverController.setOpen(v)}\n isOpen={popoverController.isOpen}\n onChange={(value) => {\n if (onChange) {\n onChange(value);\n }\n popoverController.close();\n }}\n >\n <FieldErrorCaptureContext>\n <DateInput isDisabled={props.isDisabled} ref={ref} />\n <PropsContextProvider props={fieldPropsContext}>\n {children}\n </PropsContextProvider>\n <Popover\n placement=\"bottom end\"\n isDialogContent\n controller={popoverController}\n >\n <Calendar className={styles.calendar} />\n </Popover>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.DatePicker>\n );\n});\n\nexport default DatePicker;\n"],"names":[],"mappings":";;;;;;;;;;;;;AAqBO,MAAM,UAAA,GAAa,aAAA,CAAc,YAAA,EAAc,CAAC,KAAA,KAAU;AAC/D,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,UAAU,GAAA,EAAK,GAAG,MAAK,GAAI,KAAA;AAExD,EAAA,MAAM,iBAAA,GAAoB,qBAAqB,SAAS,CAAA;AACxD,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,wBAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,GACF,GAAI,iBAAA,CAAkB,KAAA,EAAO,YAAY,CAAA;AAEzC,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,UAAA,CAAW,SAAA,EAAW,SAAS,CAAA;AAE1D,EAAA,uBACE,IAAA;AAAA,IAAC,IAAA,CAAK,UAAA;AAAA,IAAL;AAAA,MACE,GAAG,IAAA;AAAA,MACH,GAAG,UAAA;AAAA,MACJ,SAAA,EAAW,aAAA;AAAA,MACX,YAAA,EAAc,CAAC,CAAA,KAAM,iBAAA,CAAkB,QAAQ,CAAC,CAAA;AAAA,MAChD,QAAQ,iBAAA,CAAkB,MAAA;AAAA,MAC1B,QAAA,EAAU,CAAC,KAAA,KAAU;AACnB,QAAA,IAAI,QAAA,EAAU;AACZ,UAAA,QAAA,CAAS,KAAK,CAAA;AAAA,QAChB;AACA,QAAA,iBAAA,CAAkB,KAAA,EAAM;AAAA,MAC1B,CAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,wBAAA,EAAA,EACC,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,SAAA,EAAA,EAAU,UAAA,EAAY,KAAA,CAAM,UAAA,EAAY,GAAA,EAAU,CAAA;AAAA,0BACnD,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,iBAAA,EAC1B,QAAA,EACH,CAAA;AAAA,0BACA,GAAA;AAAA,YAAC,OAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAU,YAAA;AAAA,cACV,eAAA,EAAe,IAAA;AAAA,cACf,UAAA,EAAY,iBAAA;AAAA,cAEZ,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAW,MAAA,CAAO,QAAA,EAAU;AAAA;AAAA;AACxC,SAAA,EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA;AAAA;AAAA,GAClB;AAEJ,CAAC;;;;"}
|
|
@@ -2,7 +2,6 @@
|
|
|
2
2
|
/* */
|
|
3
3
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
4
4
|
import clsx from 'clsx';
|
|
5
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
6
5
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
7
6
|
import * as Aria from 'react-aria-components';
|
|
8
7
|
import { Popover } from '../Popover/Popover.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateRangePicker.mjs","sources":["../../../../../../../src/components/DateRangePicker/DateRangePicker.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport * as Aria from \"react-aria-components\";\nimport { Popover } from \"@/components/Popover\";\nimport { type DateRangePresets, RangeCalendar } from \"@/components/Calendar\";\nimport { DateRangeInput } from \"./components/DateRangeInput\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport type { RangeValue } from \"react-aria\";\nimport type { DateValue } from \"@internationalized/date\";\nimport styles from \"./DateRangePicker.module.scss\";\n\nexport interface DateRangePickerProps<T extends Aria.DateValue = Aria.DateValue>\n extends\n PropsWithChildren<Omit<Aria.DateRangePickerProps<T>, \"children\" | \"ref\">>,\n FlowComponentProps<HTMLSpanElement> {\n withDatePickerPresets?: boolean | DateRangePresets;\n}\n\n/** @flr-generate all */\nexport const DateRangePicker = flowComponent(\"DateRangePicker\", (props) => {\n const {\n children,\n className,\n onChange,\n ref,\n withDatePickerPresets = false,\n ...rest\n } = useControlledHostValueProps(props);\n\n const popoverController = useOverlayController(\"Popover\");\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"DateRangePicker\");\n\n const rootClassName = clsx(fieldProps.className, className);\n\n const onDatePickerChange = (value: RangeValue<DateValue> | null) => {\n if (onChange) {\n onChange(value);\n }\n popoverController.close();\n };\n\n return (\n <Aria.DateRangePicker\n {...rest}\n className={rootClassName}\n onOpenChange={(v) => popoverController.setOpen(v)}\n isOpen={popoverController.isOpen}\n onChange={onDatePickerChange}\n >\n <FieldErrorCaptureContext>\n <DateRangeInput isDisabled={props.isDisabled} ref={ref} />\n <PropsContextProvider props={fieldPropsContext}>\n {children}\n </PropsContextProvider>\n <Popover\n placement=\"bottom end\"\n isDialogContent\n controller={popoverController}\n >\n <RangeCalendar\n withDatePickerPresets={withDatePickerPresets}\n className={styles.calendar}\n />\n </Popover>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.DateRangePicker>\n );\n});\n\nexport default DateRangePicker;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"DateRangePicker.mjs","sources":["../../../../../../../src/components/DateRangePicker/DateRangePicker.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport * as Aria from \"react-aria-components\";\nimport { Popover } from \"@/components/Popover\";\nimport { type DateRangePresets, RangeCalendar } from \"@/components/Calendar\";\nimport { DateRangeInput } from \"./components/DateRangeInput\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport type { RangeValue } from \"react-aria\";\nimport type { DateValue } from \"@internationalized/date\";\nimport styles from \"./DateRangePicker.module.scss\";\n\nexport interface DateRangePickerProps<T extends Aria.DateValue = Aria.DateValue>\n extends\n PropsWithChildren<Omit<Aria.DateRangePickerProps<T>, \"children\" | \"ref\">>,\n FlowComponentProps<HTMLSpanElement> {\n withDatePickerPresets?: boolean | DateRangePresets;\n}\n\n/** @flr-generate all */\nexport const DateRangePicker = flowComponent(\"DateRangePicker\", (props) => {\n const {\n children,\n className,\n onChange,\n ref,\n withDatePickerPresets = false,\n ...rest\n } = useControlledHostValueProps(props);\n\n const popoverController = useOverlayController(\"Popover\");\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"DateRangePicker\");\n\n const rootClassName = clsx(fieldProps.className, className);\n\n const onDatePickerChange = (value: RangeValue<DateValue> | null) => {\n if (onChange) {\n onChange(value);\n }\n popoverController.close();\n };\n\n return (\n <Aria.DateRangePicker\n {...rest}\n className={rootClassName}\n onOpenChange={(v) => popoverController.setOpen(v)}\n isOpen={popoverController.isOpen}\n onChange={onDatePickerChange}\n >\n <FieldErrorCaptureContext>\n <DateRangeInput isDisabled={props.isDisabled} ref={ref} />\n <PropsContextProvider props={fieldPropsContext}>\n {children}\n </PropsContextProvider>\n <Popover\n placement=\"bottom end\"\n isDialogContent\n controller={popoverController}\n >\n <RangeCalendar\n withDatePickerPresets={withDatePickerPresets}\n className={styles.calendar}\n />\n </Popover>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.DateRangePicker>\n );\n});\n\nexport default DateRangePicker;\n"],"names":[],"mappings":";;;;;;;;;;;;;AA0BO,MAAM,eAAA,GAAkB,aAAA,CAAc,iBAAA,EAAmB,CAAC,KAAA,KAAU;AACzE,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,GAAA;AAAA,IACA,qBAAA,GAAwB,KAAA;AAAA,IACxB,GAAG;AAAA,GACL,GAAI,4BAA4B,KAAK,CAAA;AAErC,EAAA,MAAM,iBAAA,GAAoB,qBAAqB,SAAS,CAAA;AACxD,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,wBAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,GACF,GAAI,iBAAA,CAAkB,KAAA,EAAO,iBAAiB,CAAA;AAE9C,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,UAAA,CAAW,SAAA,EAAW,SAAS,CAAA;AAE1D,EAAA,MAAM,kBAAA,GAAqB,CAAC,KAAA,KAAwC;AAClE,IAAA,IAAI,QAAA,EAAU;AACZ,MAAA,QAAA,CAAS,KAAK,CAAA;AAAA,IAChB;AACA,IAAA,iBAAA,CAAkB,KAAA,EAAM;AAAA,EAC1B,CAAA;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,IAAA,CAAK,eAAA;AAAA,IAAL;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,SAAA,EAAW,aAAA;AAAA,MACX,YAAA,EAAc,CAAC,CAAA,KAAM,iBAAA,CAAkB,QAAQ,CAAC,CAAA;AAAA,MAChD,QAAQ,iBAAA,CAAkB,MAAA;AAAA,MAC1B,QAAA,EAAU,kBAAA;AAAA,MAEV,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,wBAAA,EAAA,EACC,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,cAAA,EAAA,EAAe,UAAA,EAAY,KAAA,CAAM,UAAA,EAAY,GAAA,EAAU,CAAA;AAAA,0BACxD,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,iBAAA,EAC1B,QAAA,EACH,CAAA;AAAA,0BACA,GAAA;AAAA,YAAC,OAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAU,YAAA;AAAA,cACV,eAAA,EAAe,IAAA;AAAA,cACf,UAAA,EAAY,iBAAA;AAAA,cAEZ,QAAA,kBAAA,GAAA;AAAA,gBAAC,aAAA;AAAA,gBAAA;AAAA,kBACC,qBAAA;AAAA,kBACA,WAAW,MAAA,CAAO;AAAA;AAAA;AACpB;AAAA;AACF,SAAA,EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA;AAAA;AAAA,GAClB;AAEJ,CAAC;;;;"}
|
|
@@ -9,7 +9,6 @@ import { FileSizeText } from './components/FileSizeText/FileSizeText.mjs';
|
|
|
9
9
|
import { Link } from '../Link/Link.mjs';
|
|
10
10
|
import { Wrap } from '../Wrap/Wrap.mjs';
|
|
11
11
|
import { DeleteButton } from './components/DeleteButton/DeleteButton.mjs';
|
|
12
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
13
12
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
14
13
|
import { OptionsButton } from '../List/components/Items/components/Item/components/OptionsButton/OptionsButton.mjs';
|
|
15
14
|
import { UiComponentTunnelExit } from '../UiComponentTunnel/UiComponentTunnelExit.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileCard.mjs","sources":["../../../../../../../src/components/FileCard/FileCard.tsx"],"sourcesContent":["import { Avatar } from \"./components/Avatar\";\nimport { Text } from \"@/components/Text\";\nimport type {\n PropsWithClassName,\n PropsWithElementType,\n} from \"@/lib/types/props\";\nimport styles from \"./FileCard.module.scss\";\nimport clsx from \"clsx\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { FileSizeText } from \"@/components/FileCard/components/FileSizeText\";\nimport { Link, type LinkProps } from \"@/components/Link\";\nimport Wrap from \"@/components/Wrap\";\nimport { DeleteButton } from \"@/components/FileCard/components/DeleteButton\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport { OptionsButton } from \"@/components/List/components/Items/components/Item/components/OptionsButton\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface FileCardProps\n extends\n FlowComponentProps<HTMLDivElement | HTMLLIElement>,\n PropsWithClassName,\n PropsWithElementType<\"div\" | \"li\">,\n Pick<LinkProps, \"onPress\" | \"href\" | \"target\" | \"download\"> {\n /** The name of the file. */\n name?: string;\n /** The type of the file. */\n type?: string;\n /** Handler that is called when the file cards delete button is clicked. */\n onDelete?: () => void;\n /** The size of the file in bytes. */\n sizeInBytes?: number;\n /** The source of an image file. */\n imageSrc?: string;\n /** Whether the file card is in a failed state. */\n isFailed?: boolean;\n}\n\n/** @flr-generate all */\nexport const FileCard = flowComponent(\"FileCard\", (props) => {\n const {\n ref,\n onDelete,\n type,\n sizeInBytes,\n name,\n className,\n elementType = \"div\",\n onPress,\n href,\n target,\n download,\n imageSrc,\n children,\n isFailed,\n } = props;\n\n const rootClassName = clsx(\n styles.fileCard,\n isFailed && styles[\"failed\"],\n className,\n );\n\n const propsContext: PropsContext = {\n ContextMenu: {\n wrapWith: <OptionsButton />,\n placement: \"bottom right\",\n },\n Text: {\n elementType: \"span\",\n className: styles.subTitle,\n tunnel: {\n id: \"subTitle\",\n component: \"FileCard\",\n },\n },\n ProgressBar: {\n size: \"s\",\n tunnel: {\n id: \"progressBar\",\n component: \"FileCard\",\n },\n },\n Button: { variant: \"plain\", color: \"secondary\" },\n };\n\n const Element = elementType;\n\n return (\n <PropsContextProvider props={propsContext}>\n <Element ref={ref as never} className={rootClassName}>\n <Wrap if={(href || onPress) && !isFailed}>\n <Link\n className={styles.link}\n unstyled\n href={href}\n onPress={onPress}\n target={target}\n download={download}\n >\n <Avatar type={type} imageSrc={imageSrc} isFailed={isFailed} />\n\n <span className={styles.text}>\n {name && (\n <Text className={styles.title}>\n <strong>{name}</strong>\n </Text>\n )}\n {sizeInBytes && <FileSizeText sizeInBytes={sizeInBytes} />}\n <UiComponentTunnelExit id=\"subTitle\" component=\"FileCard\" />\n <UiComponentTunnelExit id=\"progressBar\" component=\"FileCard\" />\n </span>\n </Link>\n </Wrap>\n {children}\n {onDelete && <DeleteButton onDelete={onDelete} />}\n </Element>\n </PropsContextProvider>\n );\n});\n\nexport default FileCard;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FileCard.mjs","sources":["../../../../../../../src/components/FileCard/FileCard.tsx"],"sourcesContent":["import { Avatar } from \"./components/Avatar\";\nimport { Text } from \"@/components/Text\";\nimport type {\n PropsWithClassName,\n PropsWithElementType,\n} from \"@/lib/types/props\";\nimport styles from \"./FileCard.module.scss\";\nimport clsx from \"clsx\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { FileSizeText } from \"@/components/FileCard/components/FileSizeText\";\nimport { Link, type LinkProps } from \"@/components/Link\";\nimport Wrap from \"@/components/Wrap\";\nimport { DeleteButton } from \"@/components/FileCard/components/DeleteButton\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport { OptionsButton } from \"@/components/List/components/Items/components/Item/components/OptionsButton\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface FileCardProps\n extends\n FlowComponentProps<HTMLDivElement | HTMLLIElement>,\n PropsWithClassName,\n PropsWithElementType<\"div\" | \"li\">,\n Pick<LinkProps, \"onPress\" | \"href\" | \"target\" | \"download\"> {\n /** The name of the file. */\n name?: string;\n /** The type of the file. */\n type?: string;\n /** Handler that is called when the file cards delete button is clicked. */\n onDelete?: () => void;\n /** The size of the file in bytes. */\n sizeInBytes?: number;\n /** The source of an image file. */\n imageSrc?: string;\n /** Whether the file card is in a failed state. */\n isFailed?: boolean;\n}\n\n/** @flr-generate all */\nexport const FileCard = flowComponent(\"FileCard\", (props) => {\n const {\n ref,\n onDelete,\n type,\n sizeInBytes,\n name,\n className,\n elementType = \"div\",\n onPress,\n href,\n target,\n download,\n imageSrc,\n children,\n isFailed,\n } = props;\n\n const rootClassName = clsx(\n styles.fileCard,\n isFailed && styles[\"failed\"],\n className,\n );\n\n const propsContext: PropsContext = {\n ContextMenu: {\n wrapWith: <OptionsButton />,\n placement: \"bottom right\",\n },\n Text: {\n elementType: \"span\",\n className: styles.subTitle,\n tunnel: {\n id: \"subTitle\",\n component: \"FileCard\",\n },\n },\n ProgressBar: {\n size: \"s\",\n tunnel: {\n id: \"progressBar\",\n component: \"FileCard\",\n },\n },\n Button: { variant: \"plain\", color: \"secondary\" },\n };\n\n const Element = elementType;\n\n return (\n <PropsContextProvider props={propsContext}>\n <Element ref={ref as never} className={rootClassName}>\n <Wrap if={(href || onPress) && !isFailed}>\n <Link\n className={styles.link}\n unstyled\n href={href}\n onPress={onPress}\n target={target}\n download={download}\n >\n <Avatar type={type} imageSrc={imageSrc} isFailed={isFailed} />\n\n <span className={styles.text}>\n {name && (\n <Text className={styles.title}>\n <strong>{name}</strong>\n </Text>\n )}\n {sizeInBytes && <FileSizeText sizeInBytes={sizeInBytes} />}\n <UiComponentTunnelExit id=\"subTitle\" component=\"FileCard\" />\n <UiComponentTunnelExit id=\"progressBar\" component=\"FileCard\" />\n </span>\n </Link>\n </Wrap>\n {children}\n {onDelete && <DeleteButton onDelete={onDelete} />}\n </Element>\n </PropsContextProvider>\n );\n});\n\nexport default FileCard;\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAyCO,MAAM,QAAA,GAAW,aAAA,CAAc,UAAA,EAAY,CAAC,KAAA,KAAU;AAC3D,EAAA,MAAM;AAAA,IACJ,GAAA;AAAA,IACA,QAAA;AAAA,IACA,IAAA;AAAA,IACA,WAAA;AAAA,IACA,IAAA;AAAA,IACA,SAAA;AAAA,IACA,WAAA,GAAc,KAAA;AAAA,IACd,OAAA;AAAA,IACA,IAAA;AAAA,IACA,MAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA;AAAA,GACF,GAAI,KAAA;AAEJ,EAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,IACpB,MAAA,CAAO,QAAA;AAAA,IACP,QAAA,IAAY,OAAO,QAAQ,CAAA;AAAA,IAC3B;AAAA,GACF;AAEA,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,WAAA,EAAa;AAAA,MACX,QAAA,sBAAW,aAAA,EAAA,EAAc,CAAA;AAAA,MACzB,SAAA,EAAW;AAAA,KACb;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,WAAA,EAAa,MAAA;AAAA,MACb,WAAW,MAAA,CAAO,QAAA;AAAA,MAClB,MAAA,EAAQ;AAAA,QACN,EAAA,EAAI,UAAA;AAAA,QACJ,SAAA,EAAW;AAAA;AACb,KACF;AAAA,IACA,WAAA,EAAa;AAAA,MACX,IAAA,EAAM,GAAA;AAAA,MACN,MAAA,EAAQ;AAAA,QACN,EAAA,EAAI,aAAA;AAAA,QACJ,SAAA,EAAW;AAAA;AACb,KACF;AAAA,IACA,MAAA,EAAQ,EAAE,OAAA,EAAS,OAAA,EAAS,OAAO,WAAA;AAAY,GACjD;AAEA,EAAA,MAAM,OAAA,GAAU,WAAA;AAEhB,EAAA,uBACE,GAAA,CAAC,wBAAqB,KAAA,EAAO,YAAA,EAC3B,+BAAC,OAAA,EAAA,EAAQ,GAAA,EAAmB,WAAW,aAAA,EACrC,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAA,CAAK,IAAA,IAAQ,OAAA,KAAY,CAAC,QAAA,EAC9B,QAAA,kBAAA,IAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,WAAW,MAAA,CAAO,IAAA;AAAA,QAClB,QAAA,EAAQ,IAAA;AAAA,QACR,IAAA;AAAA,QACA,OAAA;AAAA,QACA,MAAA;AAAA,QACA,QAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,MAAA,EAAA,EAAO,IAAA,EAAY,QAAA,EAAoB,QAAA,EAAoB,CAAA;AAAA,0BAE5D,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,IAAA,EACrB,QAAA,EAAA;AAAA,YAAA,IAAA,oBACC,GAAA,CAAC,QAAK,SAAA,EAAW,MAAA,CAAO,OACtB,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAQ,gBAAK,CAAA,EAChB,CAAA;AAAA,YAED,WAAA,oBAAe,GAAA,CAAC,YAAA,EAAA,EAAa,WAAA,EAA0B,CAAA;AAAA,4BACxD,GAAA,CAAC,qBAAA,EAAA,EAAsB,EAAA,EAAG,UAAA,EAAW,WAAU,UAAA,EAAW,CAAA;AAAA,4BAC1D,GAAA,CAAC,qBAAA,EAAA,EAAsB,EAAA,EAAG,aAAA,EAAc,WAAU,UAAA,EAAW;AAAA,WAAA,EAC/D;AAAA;AAAA;AAAA,KACF,EACF,CAAA;AAAA,IACC,QAAA;AAAA,IACA,QAAA,oBAAY,GAAA,CAAC,YAAA,EAAA,EAAa,QAAA,EAAoB;AAAA,GAAA,EACjD,CAAA,EACF,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -2,7 +2,6 @@
|
|
|
2
2
|
/* */
|
|
3
3
|
import { jsx } from 'react/jsx-runtime';
|
|
4
4
|
import { ColumnLayout } from '../ColumnLayout/ColumnLayout.mjs';
|
|
5
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
6
5
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
7
6
|
import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
|
|
8
7
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileCardList.mjs","sources":["../../../../../../../src/components/FileCardList/FileCardList.tsx"],"sourcesContent":["import type { ColumnLayoutProps } from \"@/components/ColumnLayout\";\nimport { ColumnLayout } from \"@/components/ColumnLayout\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\n\nexport type FileCardListProps = Omit<ColumnLayoutProps, \"elementType\"> &\n FlowComponentProps<HTMLUListElement>;\n\n/** @flr-generate all */\nexport const FileCardList = flowComponent(\"FileCardList\", (props) => {\n const { className, ref, children, ...rest } = props;\n\n const propsContext: PropsContext = {\n FileCard: { elementType: \"li\" },\n };\n\n return (\n <PropsContextProvider props={propsContext}>\n <ColumnLayout ref={ref} elementType=\"ul\" className={className} {...rest}>\n {children}\n </ColumnLayout>\n </PropsContextProvider>\n );\n});\n\nexport default FileCardList;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FileCardList.mjs","sources":["../../../../../../../src/components/FileCardList/FileCardList.tsx"],"sourcesContent":["import type { ColumnLayoutProps } from \"@/components/ColumnLayout\";\nimport { ColumnLayout } from \"@/components/ColumnLayout\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\n\nexport type FileCardListProps = Omit<ColumnLayoutProps, \"elementType\"> &\n FlowComponentProps<HTMLUListElement>;\n\n/** @flr-generate all */\nexport const FileCardList = flowComponent(\"FileCardList\", (props) => {\n const { className, ref, children, ...rest } = props;\n\n const propsContext: PropsContext = {\n FileCard: { elementType: \"li\" },\n };\n\n return (\n <PropsContextProvider props={propsContext}>\n <ColumnLayout ref={ref} elementType=\"ul\" className={className} {...rest}>\n {children}\n </ColumnLayout>\n </PropsContextProvider>\n );\n});\n\nexport default FileCardList;\n"],"names":[],"mappings":";;;;;AAaO,MAAM,YAAA,GAAe,aAAA,CAAc,cAAA,EAAgB,CAAC,KAAA,KAAU;AACnE,EAAA,MAAM,EAAE,SAAA,EAAW,GAAA,EAAK,QAAA,EAAU,GAAG,MAAK,GAAI,KAAA;AAE9C,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,QAAA,EAAU,EAAE,WAAA,EAAa,IAAA;AAAK,GAChC;AAEA,EAAA,uBACE,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,YAAA,EAAA,EAAa,GAAA,EAAU,WAAA,EAAY,IAAA,EAAK,SAAA,EAAuB,GAAG,IAAA,EAChE,UACH,CAAA,EACF,CAAA;AAEJ,CAAC;;;;"}
|
|
@@ -6,7 +6,6 @@ import * as Aria from 'react-aria-components';
|
|
|
6
6
|
import { IllustratedMessage } from '../IllustratedMessage/IllustratedMessage.mjs';
|
|
7
7
|
import styles from './FileDropZone.module.scss.mjs';
|
|
8
8
|
import clsx from 'clsx';
|
|
9
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
10
9
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
11
10
|
import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
|
|
12
11
|
import { useFieldComponent } from '../../lib/hooks/useFieldComponent.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileDropZone.mjs","sources":["../../../../../../../src/components/FileDropZone/FileDropZone.tsx"],"sourcesContent":["import { type FC, type PropsWithChildren, useRef } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport { IllustratedMessage } from \"@/components/IllustratedMessage\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport styles from \"./FileDropZone.module.scss\";\nimport clsx from \"clsx\";\nimport type { FileInputOnChangeHandler } from \"@/components/FileField/components/FileInput\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport type { DropEvent, FocusableElement } from \"@react-types/shared\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\n\nexport interface FileDropZoneProps\n extends\n PropsWithClassName,\n FlowComponentProps<FocusableElement>,\n PropsWithChildren,\n Pick<Aria.InputProps, \"accept\" | \"multiple\" | \"name\">,\n Pick<Aria.DropZoneProps, \"isDisabled\"> {\n onChange?: FileInputOnChangeHandler;\n /** Whether the component is read only. */\n isReadOnly?: boolean;\n}\n\n/** @flr-generate all */\nexport const FileDropZone: FC<FileDropZoneProps> = flowComponent(\n \"FileDropZone\",\n (props) => {\n const {\n multiple,\n accept,\n className,\n onChange: onChangeDropZone,\n children,\n name,\n isDisabled,\n isReadOnly,\n } = props;\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"FileDropZone\");\n\n const fileFieldRef = useRef<HTMLInputElement>(null);\n const rootClassName = clsx(\n styles.fileDropZone,\n isDisabled && styles.disabled,\n className,\n );\n\n const propsContext: PropsContext = {\n ...fieldPropsContext,\n IllustratedMessage: {\n FileField: {\n name,\n onChange: onChangeDropZone,\n ref: fileFieldRef,\n accept: accept,\n multiple: multiple,\n Button: { variant: \"outline\", color: \"dark\" },\n isDisabled,\n isReadOnly,\n },\n Heading: {\n className: styles.heading,\n },\n Icon: { className: styles.icon },\n Text: { className: styles.text },\n },\n };\n\n const onDropHandler = async (event: DropEvent) => {\n if (isReadOnly) {\n return;\n }\n\n const fileDropItems = event.items.filter(\n (file) => file.kind === \"file\",\n ) as Aria.FileDropItem[];\n\n const files = await Promise.all(\n fileDropItems\n .filter((f) => !accept || accept?.includes(f.type))\n .map(async (f) => await f.getFile()),\n );\n\n if (files.length > 0) {\n const fileTransfer = new DataTransfer();\n for (const file of multiple ? files : [files[0]]) {\n if (file) {\n fileTransfer.items.add(file);\n }\n }\n\n onChangeDropZone?.(fileTransfer.files);\n if (fileFieldRef.current) {\n fileFieldRef.current.files = fileTransfer.files;\n }\n }\n };\n\n return (\n <div {...fieldProps}>\n <FieldErrorCaptureContext>\n <PropsContextProvider props={propsContext}>\n <Aria.DropZone\n className={rootClassName}\n onDrop={onDropHandler}\n isDisabled={isDisabled}\n data-readonly={isReadOnly}\n >\n <IllustratedMessage color=\"dark\">{children}</IllustratedMessage>\n </Aria.DropZone>\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </div>\n );\n },\n);\n\nexport default FileDropZone;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FileDropZone.mjs","sources":["../../../../../../../src/components/FileDropZone/FileDropZone.tsx"],"sourcesContent":["import { type FC, type PropsWithChildren, useRef } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport { IllustratedMessage } from \"@/components/IllustratedMessage\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport styles from \"./FileDropZone.module.scss\";\nimport clsx from \"clsx\";\nimport type { FileInputOnChangeHandler } from \"@/components/FileField/components/FileInput\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport type { DropEvent, FocusableElement } from \"@react-types/shared\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\n\nexport interface FileDropZoneProps\n extends\n PropsWithClassName,\n FlowComponentProps<FocusableElement>,\n PropsWithChildren,\n Pick<Aria.InputProps, \"accept\" | \"multiple\" | \"name\">,\n Pick<Aria.DropZoneProps, \"isDisabled\"> {\n onChange?: FileInputOnChangeHandler;\n /** Whether the component is read only. */\n isReadOnly?: boolean;\n}\n\n/** @flr-generate all */\nexport const FileDropZone: FC<FileDropZoneProps> = flowComponent(\n \"FileDropZone\",\n (props) => {\n const {\n multiple,\n accept,\n className,\n onChange: onChangeDropZone,\n children,\n name,\n isDisabled,\n isReadOnly,\n } = props;\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"FileDropZone\");\n\n const fileFieldRef = useRef<HTMLInputElement>(null);\n const rootClassName = clsx(\n styles.fileDropZone,\n isDisabled && styles.disabled,\n className,\n );\n\n const propsContext: PropsContext = {\n ...fieldPropsContext,\n IllustratedMessage: {\n FileField: {\n name,\n onChange: onChangeDropZone,\n ref: fileFieldRef,\n accept: accept,\n multiple: multiple,\n Button: { variant: \"outline\", color: \"dark\" },\n isDisabled,\n isReadOnly,\n },\n Heading: {\n className: styles.heading,\n },\n Icon: { className: styles.icon },\n Text: { className: styles.text },\n },\n };\n\n const onDropHandler = async (event: DropEvent) => {\n if (isReadOnly) {\n return;\n }\n\n const fileDropItems = event.items.filter(\n (file) => file.kind === \"file\",\n ) as Aria.FileDropItem[];\n\n const files = await Promise.all(\n fileDropItems\n .filter((f) => !accept || accept?.includes(f.type))\n .map(async (f) => await f.getFile()),\n );\n\n if (files.length > 0) {\n const fileTransfer = new DataTransfer();\n for (const file of multiple ? files : [files[0]]) {\n if (file) {\n fileTransfer.items.add(file);\n }\n }\n\n onChangeDropZone?.(fileTransfer.files);\n if (fileFieldRef.current) {\n fileFieldRef.current.files = fileTransfer.files;\n }\n }\n };\n\n return (\n <div {...fieldProps}>\n <FieldErrorCaptureContext>\n <PropsContextProvider props={propsContext}>\n <Aria.DropZone\n className={rootClassName}\n onDrop={onDropHandler}\n isDisabled={isDisabled}\n data-readonly={isReadOnly}\n >\n <IllustratedMessage color=\"dark\">{children}</IllustratedMessage>\n </Aria.DropZone>\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </div>\n );\n },\n);\n\nexport default FileDropZone;\n"],"names":[],"mappings":"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"}
|
|
@@ -6,7 +6,6 @@ import { useFormValidationState } from '@react-stately/form';
|
|
|
6
6
|
import { FieldErrorContext } from 'react-aria-components';
|
|
7
7
|
import { FileInput } from './components/FileInput.mjs';
|
|
8
8
|
import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
|
|
9
|
-
import '../../lib/propsContext/propsContext.mjs';
|
|
10
9
|
import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
|
|
11
10
|
import { useObjectRef } from '@react-aria/utils';
|
|
12
11
|
import { useFieldComponent } from '../../lib/hooks/useFieldComponent.mjs';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileField.mjs","sources":["../../../../../../../src/components/FileField/FileField.tsx"],"sourcesContent":["import { useFormValidation } from \"@react-aria/form\";\nimport { useFormValidationState } from \"@react-stately/form\";\nimport type { PropsWithChildren } from \"react\";\nimport type * as Aria from \"react-aria-components\";\nimport { FieldErrorContext } from \"react-aria-components\";\nimport type { FileInputOnChangeHandler } from \"@/components/FileField/components/FileInput\";\nimport { FileInput } from \"@/components/FileField/components/FileInput\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport styles from \"./FileField.module.scss\";\nimport clsx from \"clsx\";\n\nexport interface FileFieldProps\n extends\n PropsWithChildren,\n FlowComponentProps<HTMLInputElement>,\n Pick<Aria.InputProps, \"accept\" | \"multiple\" | \"name\">,\n Pick<\n Aria.TextFieldProps,\n \"isRequired\" | \"isInvalid\" | \"validationBehavior\" | \"isDisabled\"\n > {\n /** Handler that is called when the file input changes. */\n onChange?: FileInputOnChangeHandler;\n /** Whether the component is read only. */\n isReadOnly?: boolean;\n}\n\n/** @flr-generate all */\nexport const FileField = flowComponent(\"FileField\", (props) => {\n const {\n children,\n ref,\n isRequired,\n isInvalid,\n isDisabled,\n validationBehavior,\n onChange,\n isReadOnly,\n ...restInputProps\n } = props;\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"FileField\");\n\n const inputRef = useObjectRef(ref);\n\n const formValidationState = useFormValidationState({\n value: undefined,\n validationBehavior,\n isInvalid,\n });\n\n useFormValidation({ validationBehavior }, formValidationState, inputRef);\n\n const inputProps = {\n ...restInputProps,\n \"aria-invalid\": formValidationState.displayValidation.isInvalid,\n value: undefined,\n };\n\n const handleChange: FileInputOnChangeHandler = (fileList) => {\n if (fileList && onChange) {\n onChange(fileList);\n }\n };\n\n return (\n <div\n {...fieldProps}\n className={clsx(fieldProps.className, styles.fileField)}\n >\n <FieldErrorContext.Provider value={formValidationState.displayValidation}>\n <FieldErrorCaptureContext>\n <PropsContextProvider props={fieldPropsContext}>\n <div\n data-readonly={isReadOnly}\n data-required={!!isRequired || undefined}\n data-invalid={\n formValidationState.displayValidation.isInvalid || undefined\n }\n >\n <FileInput\n ref={inputRef}\n isReadOnly={isReadOnly}\n onChange={isReadOnly ? undefined : handleChange}\n isDisabled={isDisabled}\n {...inputProps}\n >\n {children}\n </FileInput>\n </div>\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </FieldErrorContext.Provider>\n </div>\n );\n});\nexport default FileField;\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FileField.mjs","sources":["../../../../../../../src/components/FileField/FileField.tsx"],"sourcesContent":["import { useFormValidation } from \"@react-aria/form\";\nimport { useFormValidationState } from \"@react-stately/form\";\nimport type { PropsWithChildren } from \"react\";\nimport type * as Aria from \"react-aria-components\";\nimport { FieldErrorContext } from \"react-aria-components\";\nimport type { FileInputOnChangeHandler } from \"@/components/FileField/components/FileInput\";\nimport { FileInput } from \"@/components/FileField/components/FileInput\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport styles from \"./FileField.module.scss\";\nimport clsx from \"clsx\";\n\nexport interface FileFieldProps\n extends\n PropsWithChildren,\n FlowComponentProps<HTMLInputElement>,\n Pick<Aria.InputProps, \"accept\" | \"multiple\" | \"name\">,\n Pick<\n Aria.TextFieldProps,\n \"isRequired\" | \"isInvalid\" | \"validationBehavior\" | \"isDisabled\"\n > {\n /** Handler that is called when the file input changes. */\n onChange?: FileInputOnChangeHandler;\n /** Whether the component is read only. */\n isReadOnly?: boolean;\n}\n\n/** @flr-generate all */\nexport const FileField = flowComponent(\"FileField\", (props) => {\n const {\n children,\n ref,\n isRequired,\n isInvalid,\n isDisabled,\n validationBehavior,\n onChange,\n isReadOnly,\n ...restInputProps\n } = props;\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"FileField\");\n\n const inputRef = useObjectRef(ref);\n\n const formValidationState = useFormValidationState({\n value: undefined,\n validationBehavior,\n isInvalid,\n });\n\n useFormValidation({ validationBehavior }, formValidationState, inputRef);\n\n const inputProps = {\n ...restInputProps,\n \"aria-invalid\": formValidationState.displayValidation.isInvalid,\n value: undefined,\n };\n\n const handleChange: FileInputOnChangeHandler = (fileList) => {\n if (fileList && onChange) {\n onChange(fileList);\n }\n };\n\n return (\n <div\n {...fieldProps}\n className={clsx(fieldProps.className, styles.fileField)}\n >\n <FieldErrorContext.Provider value={formValidationState.displayValidation}>\n <FieldErrorCaptureContext>\n <PropsContextProvider props={fieldPropsContext}>\n <div\n data-readonly={isReadOnly}\n data-required={!!isRequired || undefined}\n data-invalid={\n formValidationState.displayValidation.isInvalid || undefined\n }\n >\n <FileInput\n ref={inputRef}\n isReadOnly={isReadOnly}\n onChange={isReadOnly ? undefined : handleChange}\n isDisabled={isDisabled}\n {...inputProps}\n >\n {children}\n </FileInput>\n </div>\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </FieldErrorContext.Provider>\n </div>\n );\n});\nexport default FileField;\n"],"names":[],"mappings":";;;;;;;;;;;;AA+BO,MAAM,SAAA,GAAY,aAAA,CAAc,WAAA,EAAa,CAAC,KAAA,KAAU;AAC7D,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,GAAA;AAAA,IACA,UAAA;AAAA,IACA,SAAA;AAAA,IACA,UAAA;AAAA,IACA,kBAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,wBAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,GACF,GAAI,iBAAA,CAAkB,KAAA,EAAO,WAAW,CAAA;AAExC,EAAA,MAAM,QAAA,GAAW,aAAa,GAAG,CAAA;AAEjC,EAAA,MAAM,sBAAsB,sBAAA,CAAuB;AAAA,IACjD,KAAA,EAAO,MAAA;AAAA,IACP,kBAAA;AAAA,IACA;AAAA,GACD,CAAA;AAED,EAAA,iBAAA,CAAkB,EAAE,kBAAA,EAAmB,EAAG,mBAAA,EAAqB,QAAQ,CAAA;AAEvE,EAAA,MAAM,UAAA,GAAa;AAAA,IACjB,GAAG,cAAA;AAAA,IACH,cAAA,EAAgB,oBAAoB,iBAAA,CAAkB,SAAA;AAAA,IACtD,KAAA,EAAO;AAAA,GACT;AAEA,EAAA,MAAM,YAAA,GAAyC,CAAC,QAAA,KAAa;AAC3D,IAAA,IAAI,YAAY,QAAA,EAAU;AACxB,MAAA,QAAA,CAAS,QAAQ,CAAA;AAAA,IACnB;AAAA,EACF,CAAA;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,SAAA,EAAW,IAAA,CAAK,UAAA,CAAW,SAAA,EAAW,OAAO,SAAS,CAAA;AAAA,MAEtD,+BAAC,iBAAA,CAAkB,QAAA,EAAlB,EAA2B,KAAA,EAAO,oBAAoB,iBAAA,EACrD,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,wBAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,iBAAA,EAC3B,QAAA,kBAAA,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,eAAA,EAAe,UAAA;AAAA,YACf,eAAA,EAAe,CAAC,CAAC,UAAA,IAAc,MAAA;AAAA,YAC/B,cAAA,EACE,mBAAA,CAAoB,iBAAA,CAAkB,SAAA,IAAa,MAAA;AAAA,YAGrD,QAAA,kBAAA,GAAA;AAAA,cAAC,SAAA;AAAA,cAAA;AAAA,gBACC,GAAA,EAAK,QAAA;AAAA,gBACL,UAAA;AAAA,gBACA,QAAA,EAAU,aAAa,MAAA,GAAY,YAAA;AAAA,gBACnC,UAAA;AAAA,gBACC,GAAG,UAAA;AAAA,gBAEH;AAAA;AAAA;AACH;AAAA,WAEJ,CAAA,EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA,OAAA,EAClB;AAAA;AAAA,GACF;AAEJ,CAAC;;;;"}
|