@mittwald/flow-react-components 1.6.0-next.4 → 1.6.0-next.41
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/AGENTS.md +132 -88
- package/USAGE.md +7 -2
- package/dist/assets/component-index.json +1 -1
- package/dist/assets/doc-properties.json +1 -1
- package/dist/css/all-layered.css +1 -1
- package/dist/css/all.css +1 -1
- package/dist/js/_virtual/_18.locale.mjs +14 -0
- package/dist/js/default.mjs +4 -3
- package/dist/js/flr-universal.mjs +2 -1
- package/dist/js/node_modules/.pnpm/{@lezer_lr@1.4.10 → @lezer_lr@1.4.11}/node_modules/@lezer/lr/dist/index.mjs +40 -28
- package/dist/js/node_modules/.pnpm/@lezer_lr@1.4.11/node_modules/@lezer/lr/dist/index.mjs.map +1 -0
- package/dist/js/packages/components/src/components/AccentBox/AccentBox.mjs +3 -2
- package/dist/js/packages/components/src/components/AccentBox/AccentBox.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Accordion/Accordion.mjs +3 -2
- package/dist/js/packages/components/src/components/Accordion/Accordion.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Action/models/ActionState.mjs +2 -2
- package/dist/js/packages/components/src/components/ActionGroup/ActionGroup.mjs +3 -3
- package/dist/js/packages/components/src/components/ActionGroup/ActionGroup.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Activity/Activity.mjs +1 -1
- package/dist/js/packages/components/src/components/Activity/Activity.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Alert/Alert.mjs +3 -2
- package/dist/js/packages/components/src/components/Alert/Alert.mjs.map +1 -1
- package/dist/js/packages/components/src/components/AlertBadge/AlertBadge.mjs +1 -1
- package/dist/js/packages/components/src/components/AlertBadge/AlertBadge.mjs.map +1 -1
- package/dist/js/packages/components/src/components/AlertBadge/AlertBadge.module.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Badge/Badge.mjs +2 -2
- package/dist/js/packages/components/src/components/Badge/Badge.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Badge/Badge.module.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Calendar/components/RangeCalendar/helpers/useCalendarDateRangePresets.mjs +1 -1
- package/dist/js/packages/components/src/components/CartesianChart/CartesianChart.mjs +6 -8
- package/dist/js/packages/components/src/components/CartesianChart/CartesianChart.mjs.map +1 -1
- package/dist/js/packages/components/src/components/CartesianChart/components/YAxis/YAxis.mjs +23 -5
- package/dist/js/packages/components/src/components/CartesianChart/components/YAxis/YAxis.mjs.map +1 -1
- package/dist/js/packages/components/src/components/CartesianChart/hooks/useTickLabelWidth.mjs +67 -0
- package/dist/js/packages/components/src/components/CartesianChart/hooks/useTickLabelWidth.mjs.map +1 -0
- package/dist/js/packages/components/src/components/Checkbox/Checkbox.mjs +2 -2
- package/dist/js/packages/components/src/components/Checkbox/Checkbox.mjs.map +1 -1
- package/dist/js/packages/components/src/components/CodeBlock/CodeBlock.mjs +3 -3
- package/dist/js/packages/components/src/components/CodeBlock/CodeBlock.mjs.map +1 -1
- package/dist/js/packages/components/src/components/CodeEditor/CodeEditor.mjs +41 -12
- package/dist/js/packages/components/src/components/CodeEditor/CodeEditor.mjs.map +1 -1
- package/dist/js/packages/components/src/components/CodeEditor/hooks/useCodeEditorExtensions.mjs +29 -16
- package/dist/js/packages/components/src/components/CodeEditor/hooks/useCodeEditorExtensions.mjs.map +1 -1
- package/dist/js/packages/components/src/components/CodeEditor/languages/dotEnv/dotEnv.mjs +1 -1
- package/dist/js/packages/components/src/components/ComboBox/ComboBox.mjs +3 -2
- package/dist/js/packages/components/src/components/ComboBox/ComboBox.mjs.map +1 -1
- package/dist/js/packages/components/src/components/ContextMenu/ContextMenu.mjs +3 -2
- package/dist/js/packages/components/src/components/ContextMenu/ContextMenu.mjs.map +1 -1
- package/dist/js/packages/components/src/components/CountryOptions/CountryOptions.mjs +5 -1
- package/dist/js/packages/components/src/components/CountryOptions/CountryOptions.mjs.map +1 -1
- package/dist/js/packages/components/src/components/DatePicker/DatePicker.mjs +2 -1
- package/dist/js/packages/components/src/components/DatePicker/DatePicker.mjs.map +1 -1
- package/dist/js/packages/components/src/components/DateRangePicker/DateRangePicker.mjs +2 -1
- package/dist/js/packages/components/src/components/DateRangePicker/DateRangePicker.mjs.map +1 -1
- package/dist/js/packages/components/src/components/DeprecationWarningProvider/DeprecationWarningProvider.mjs +40 -8
- package/dist/js/packages/components/src/components/DeprecationWarningProvider/DeprecationWarningProvider.mjs.map +1 -1
- package/dist/js/packages/components/src/components/DonutChart/DonutChart.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Heading/Heading.mjs +2 -0
- package/dist/js/packages/components/src/components/Heading/Heading.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Icon/Icon.module.mjs.map +1 -1
- package/dist/js/packages/components/src/components/IllustratedMessage/IllustratedMessage.mjs +3 -2
- package/dist/js/packages/components/src/components/IllustratedMessage/IllustratedMessage.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Label/Label.mjs +0 -4
- package/dist/js/packages/components/src/components/Label/Label.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Link/Link.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/Header/components/ActiveFilters/ActiveFilters.mjs +5 -2
- package/dist/js/packages/components/src/components/List/components/Header/components/ActiveFilters/ActiveFilters.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/Header/components/AllFiltersModal/AllFiltersModal.mjs +2 -2
- package/dist/js/packages/components/src/components/List/components/Header/components/AllFiltersModal/AllFiltersModal.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/Header/components/AllFiltersModal/FilterAccordionDateRange.mjs +5 -3
- package/dist/js/packages/components/src/components/List/components/Header/components/AllFiltersModal/FilterAccordionDateRange.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/Header/components/DateTimeRangeFields/DateTimeRangeFields.mjs +101 -0
- package/dist/js/packages/components/src/components/List/components/Header/components/DateTimeRangeFields/DateTimeRangeFields.mjs.map +1 -0
- package/dist/js/packages/components/src/components/List/components/Header/components/DateTimeRangeFields/DateTimeRangeFields.module.mjs +13 -0
- package/dist/js/packages/components/src/components/List/components/Header/components/DateTimeRangeFields/DateTimeRangeFields.module.mjs.map +1 -0
- package/dist/js/packages/components/src/components/List/components/Header/components/FilterContextMenu/DateRangeFilterPopover.mjs +16 -9
- package/dist/js/packages/components/src/components/List/components/Header/components/FilterContextMenu/DateRangeFilterPopover.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/Header/components/FilterContextMenu/FilterContextMenus.module.mjs +6 -2
- package/dist/js/packages/components/src/components/List/components/Header/components/FilterContextMenu/FilterContextMenus.module.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/Header/components/SearchField/SearchField.mjs +4 -2
- 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/Items.mjs +3 -0
- package/dist/js/packages/components/src/components/List/components/Items/Items.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/Items/components/Item/Item.mjs +1 -1
- package/dist/js/packages/components/src/components/List/components/Items/components/Item/Item.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/Items/components/Item/hooks/useGridItemProps.mjs +1 -2
- 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/Items/views/GridList/GridList.mjs +3 -0
- package/dist/js/packages/components/src/components/List/components/Items/views/GridList/GridList.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/ListSummary/ListSummary.mjs +5 -9
- package/dist/js/packages/components/src/components/List/components/ListSummary/ListSummary.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/Table/Table.mjs +8 -12
- package/dist/js/packages/components/src/components/List/components/Table/Table.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/components/Table/components/Row.mjs +31 -0
- package/dist/js/packages/components/src/components/List/components/Table/components/Row.mjs.map +1 -0
- package/dist/js/packages/components/src/components/List/hooks/useLatestOnAction.mjs +21 -0
- package/dist/js/packages/components/src/components/List/hooks/useLatestOnAction.mjs.map +1 -0
- package/dist/js/packages/components/src/components/List/model/List.mjs +1 -0
- package/dist/js/packages/components/src/components/List/model/List.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/model/ListViewMode.mjs +2 -2
- package/dist/js/packages/components/src/components/List/model/ReactTable.mjs +2 -2
- package/dist/js/packages/components/src/components/List/model/filter/DateRangeFilter.mjs +15 -2
- package/dist/js/packages/components/src/components/List/model/filter/DateRangeFilter.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/model/filter/resolveDateRangeFilterValue.mjs +16 -0
- package/dist/js/packages/components/src/components/List/model/filter/resolveDateRangeFilterValue.mjs.map +1 -0
- package/dist/js/packages/components/src/components/List/model/item/ItemView.mjs +20 -7
- package/dist/js/packages/components/src/components/List/model/item/ItemView.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/model/loading/IncrementalLoaderState.mjs +2 -2
- package/dist/js/packages/components/src/components/List/model/table/TableCell.mjs +1 -1
- package/dist/js/packages/components/src/components/List/model/table/TableCell.mjs.map +1 -1
- package/dist/js/packages/components/src/components/List/model/table/TableRow.mjs +28 -1
- package/dist/js/packages/components/src/components/List/model/table/TableRow.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Markdown/Markdown.mjs +25 -7
- package/dist/js/packages/components/src/components/Markdown/Markdown.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Markdown/components/SkeletonBlocks.mjs +1 -1
- package/dist/js/packages/components/src/components/Markdown/components/SkeletonBlocks.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Markdown/lib/isExternalHref.mjs +8 -0
- package/dist/js/packages/components/src/components/Markdown/lib/isExternalHref.mjs.map +1 -0
- package/dist/js/packages/components/src/components/MenuItem/MenuItem.mjs +32 -3
- package/dist/js/packages/components/src/components/MenuItem/MenuItem.mjs.map +1 -1
- package/dist/js/packages/components/src/components/MenuItem/MenuItem.module.mjs +1 -3
- package/dist/js/packages/components/src/components/MessageThread/MessageThread.mjs +1 -1
- package/dist/js/packages/components/src/components/MessageThread/MessageThread.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Modal/Modal.mjs +9 -2
- package/dist/js/packages/components/src/components/Modal/Modal.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Navigation/Navigation.module.mjs +1 -3
- package/dist/js/packages/components/src/components/NumberField/NumberField.mjs +2 -3
- package/dist/js/packages/components/src/components/NumberField/NumberField.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Option/Option.module.mjs +1 -3
- package/dist/js/packages/components/src/components/Overlay/components/OverlayContent.mjs +2 -1
- package/dist/js/packages/components/src/components/Overlay/components/OverlayContent.mjs.map +1 -1
- package/dist/js/packages/components/src/components/PasswordCreationField/PasswordCreationField.mjs +1 -1
- package/dist/js/packages/components/src/components/PasswordCreationField/PasswordCreationField.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Popover/components/NonModalPopoverContent/NonModalPopoverContent.mjs +1 -1
- package/dist/js/packages/components/src/components/Popover/components/NonModalPopoverContent/NonModalPopoverContent.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Popover/components/PopoverContent/PopoverContent.mjs +4 -2
- package/dist/js/packages/components/src/components/Popover/components/PopoverContent/PopoverContent.mjs.map +1 -1
- package/dist/js/packages/components/src/components/ProgressBar/ProgressBar.mjs.map +1 -1
- package/dist/js/packages/components/src/components/ProgressBar/components/ProgressBarLegend.mjs +5 -4
- package/dist/js/packages/components/src/components/ProgressBar/components/ProgressBarLegend.mjs.map +1 -1
- package/dist/js/packages/components/src/components/RadioGroup/RadioGroup.mjs +2 -3
- package/dist/js/packages/components/src/components/RadioGroup/RadioGroup.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Rating/Rating.mjs +12 -11
- package/dist/js/packages/components/src/components/Rating/Rating.mjs.map +1 -1
- package/dist/js/packages/components/src/components/SearchField/SearchField.mjs +2 -3
- package/dist/js/packages/components/src/components/SearchField/SearchField.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Section/Section.mjs +10 -6
- 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 -4
- package/dist/js/packages/components/src/components/Section/components/SectionHeader/SectionHeader.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Section/context.mjs +47 -0
- package/dist/js/packages/components/src/components/Section/context.mjs.map +1 -0
- package/dist/js/packages/components/src/components/SegmentedControl/SegmentedControl.mjs +2 -3
- package/dist/js/packages/components/src/components/SegmentedControl/SegmentedControl.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Select/Select.mjs +2 -3
- package/dist/js/packages/components/src/components/Select/Select.mjs.map +1 -1
- package/dist/js/packages/components/src/components/SkeletonText/SkeletonText.mjs +4 -3
- package/dist/js/packages/components/src/components/SkeletonText/SkeletonText.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Slider/Slider.mjs +47 -41
- package/dist/js/packages/components/src/components/Slider/Slider.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Table/Table.mjs +3 -0
- package/dist/js/packages/components/src/components/Table/Table.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Table/Table.module.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Table/components/TableCell/TableCell.mjs +5 -12
- package/dist/js/packages/components/src/components/Table/components/TableCell/TableCell.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Table/components/TableColumn/TableColumn.mjs +4 -2
- package/dist/js/packages/components/src/components/Table/components/TableColumn/TableColumn.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Table/components/TableHeader/TableHeader.mjs +7 -1
- package/dist/js/packages/components/src/components/Table/components/TableHeader/TableHeader.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Table/components/TableHeader/context.mjs +14 -0
- package/dist/js/packages/components/src/components/Table/components/TableHeader/context.mjs.map +1 -0
- package/dist/js/packages/components/src/components/Tabs/Tabs.mjs +6 -8
- package/dist/js/packages/components/src/components/Tabs/Tabs.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Tabs/Tabs.module.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Tabs/components/TabTitle/TabTitle.module.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Text/Text.module.mjs.map +1 -1
- package/dist/js/packages/components/src/components/TextField/TextField.mjs +11 -8
- package/dist/js/packages/components/src/components/TextField/TextField.mjs.map +1 -1
- package/dist/js/packages/components/src/components/TimeField/TimeField.mjs +4 -2
- package/dist/js/packages/components/src/components/TimeField/TimeField.mjs.map +1 -1
- package/dist/js/packages/components/src/components/TranslationProvider/useLocalizedStringFormatter.mjs +15 -2
- package/dist/js/packages/components/src/components/TranslationProvider/useLocalizedStringFormatter.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Wrap/Wrap.mjs.map +1 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/Field/Field.mjs +1 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/Form/Form.mjs +4 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/Form/Form.mjs.map +1 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/FormRootError/FormRootError.mjs +1 -1
- package/dist/js/packages/components/src/integrations/react-hook-form/components/FormSettingsProvider/FormSettingsProvider.mjs.map +1 -1
- package/dist/js/packages/components/src/lib/controller/overlay/OverlayController.mjs +10 -158
- package/dist/js/packages/components/src/lib/controller/overlay/OverlayController.mjs.map +1 -1
- package/dist/js/packages/components/src/lib/controller/overlay/useCloseOverlayConfirmationController.mjs +1 -0
- package/dist/js/packages/components/src/lib/controller/overlay/useCloseOverlayConfirmationController.mjs.map +1 -1
- package/dist/js/packages/components/src/lib/hooks/dom/useVirtualKeyboardVisible.mjs +8 -4
- package/dist/js/packages/components/src/lib/hooks/dom/useVirtualKeyboardVisible.mjs.map +1 -1
- package/dist/js/packages/components/src/views/DatePickerView.mjs +16 -0
- package/dist/js/packages/components/src/views/DatePickerView.mjs.map +1 -0
- package/dist/js/packages/components/src/views/LabelView.mjs +16 -0
- package/dist/js/packages/components/src/views/LabelView.mjs.map +1 -0
- package/dist/js/packages/components/src/views/TimeFieldView.mjs +16 -0
- package/dist/js/packages/components/src/views/TimeFieldView.mjs.map +1 -0
- package/dist/js/packages/components-base/src/index.mjs +5 -2
- package/dist/js/packages/components-base/src/list/filter/ListDateRangeFilter.mjs +1 -0
- package/dist/js/packages/components-base/src/list/filter/ListDateRangeFilter.mjs.map +1 -1
- package/dist/js/packages/components-base/src/list/filter/ListFilter.mjs +4 -1
- package/dist/js/packages/components-base/src/list/filter/ListFilter.mjs.map +1 -1
- package/dist/js/packages/components-base/src/list/filter/dateRange.mjs +37 -13
- package/dist/js/packages/components-base/src/list/filter/dateRange.mjs.map +1 -1
- package/dist/js/packages/components-base/src/list/filter/dateTimeRangeFields.mjs +55 -0
- package/dist/js/packages/components-base/src/list/filter/dateTimeRangeFields.mjs.map +1 -0
- package/dist/js/packages/components-base/src/list/filter/formatDateRange.mjs +27 -0
- package/dist/js/packages/components-base/src/list/filter/formatDateRange.mjs.map +1 -0
- package/dist/js/packages/components-base/src/overlay/OverlayState.mjs +196 -0
- package/dist/js/packages/components-base/src/overlay/OverlayState.mjs.map +1 -0
- package/dist/types/_bundled/flow-components-base/index.d.ts +4 -1
- package/dist/types/_bundled/flow-components-base/list/filter/ListFilter.d.ts +2 -0
- package/dist/types/_bundled/flow-components-base/list/filter/dateRange.d.ts +24 -1
- package/dist/types/_bundled/flow-components-base/list/filter/dateTimeRangeFields.d.ts +34 -0
- package/dist/types/_bundled/flow-components-base/list/filter/formatDateRange.d.ts +7 -0
- package/dist/types/_bundled/flow-components-base/overlay/OverlayState.d.ts +94 -0
- package/dist/types/components/AlertBadge/AlertBadge.d.ts +2 -2
- package/dist/types/components/Badge/Badge.d.ts +2 -2
- package/dist/types/components/CartesianChart/hooks/useTickLabelWidth.d.ts +1 -0
- package/dist/types/components/CodeBlock/CodeBlock.d.ts +1 -1
- package/dist/types/components/DonutChart/DonutChart.d.ts +1 -4
- package/dist/types/components/Link/Link.d.ts +1 -1
- package/dist/types/components/List/components/Header/components/DateTimeRangeFields/DateTimeRangeFields.d.ts +8 -0
- package/dist/types/components/List/components/Items/components/Item/Item.d.ts +2 -0
- package/dist/types/components/List/components/Items/components/Item/hooks/useGridItemProps.d.ts +1 -0
- package/dist/types/components/List/components/ListSummary/ListSummary.d.ts +3 -2
- package/dist/types/components/List/components/Table/components/Row.d.ts +13 -0
- package/dist/types/components/List/hooks/useLatestOnAction.d.ts +7 -0
- package/dist/types/components/List/index.d.ts +2 -0
- package/dist/types/components/List/model/filter/DateRangeFilter.d.ts +15 -8
- package/dist/types/components/List/model/filter/resolveDateRangeFilterValue.d.ts +11 -0
- package/dist/types/components/List/model/filter/types.d.ts +23 -1
- package/dist/types/components/List/model/item/ItemView.d.ts +34 -11
- package/dist/types/components/List/model/table/TableRow.d.ts +14 -0
- package/dist/types/components/List/model/table/types.d.ts +17 -1
- package/dist/types/components/List/typedList.d.ts +1 -0
- package/dist/types/components/Markdown/lib/isExternalHref.d.ts +1 -0
- package/dist/types/components/ProgressBar/ProgressBar.d.ts +1 -4
- package/dist/types/components/Rating/Rating.d.ts +5 -5
- package/dist/types/components/Section/context.d.ts +28 -0
- package/dist/types/components/Table/components/TableCell/TableCell.d.ts +4 -1
- package/dist/types/components/Table/components/TableHeader/context.d.ts +6 -0
- package/dist/types/components/Wrap/Wrap.d.ts +5 -0
- package/dist/types/index/flr-universal.d.ts +1 -1
- package/dist/types/integrations/react-hook-form/components/FormSettingsProvider/FormSettingsProvider.d.ts +7 -1
- package/dist/types/lib/controller/overlay/OverlayController.d.ts +8 -74
- package/dist/types/lib/dev/hydrateServerMarkup.d.ts +2 -0
- package/dist/types/lib/hooks/dom/useVirtualKeyboardVisible.d.ts +4 -1
- package/package.json +12 -12
- package/dist/js/node_modules/.pnpm/@lezer_lr@1.4.10/node_modules/@lezer/lr/dist/index.mjs.map +0 -1
- package/dist/js/packages/components/src/lib/date/transformDateValueToFormattedDate.mjs +0 -10
- package/dist/js/packages/components/src/lib/date/transformDateValueToFormattedDate.mjs.map +0 -1
- package/dist/types/lib/date/transformDateValueToDateTime.d.ts +0 -3
- package/dist/types/lib/date/transformDateValueToFormattedDate.d.ts +0 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioGroup.mjs","names":["
|
|
1
|
+
{"version":3,"file":"RadioGroup.mjs","names":["styles"],"sources":["../../../../../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport styles from \"./RadioGroup.module.scss\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { ColumnLayoutProps } from \"@/components/ColumnLayout\";\nimport { ColumnLayout } from \"@/components/ColumnLayout\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\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 RadioGroupProps\n extends\n PropsWithChildren<Omit<Aria.RadioGroupProps, \"children\">>,\n FlowComponentProps,\n Pick<ColumnLayoutProps, \"s\" | \"m\" | \"l\"> {}\n\n/** @flr-generate all */\nexport const RadioGroup = flowComponent(\"RadioGroup\", (props) => {\n const { children, className, s, m, l, ref, ...rest } = props;\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n wrapperProps,\n controlProps,\n fieldPropsContext,\n skeletonProps,\n } = useFieldComponent(props, \"RadioGroup\");\n\n const rootClassName = clsx(wrapperProps.className, className);\n const propsContext: PropsContext = {\n RadioButton: {\n tunnel: {\n id: \"radioButtons\",\n component: \"RadioGroup\",\n },\n },\n Radio: {\n tunnel: {\n id: \"radios\",\n component: \"RadioGroup\",\n },\n },\n ...fieldPropsContext,\n };\n\n const localRadioRef = useObjectRef(ref);\n useMakeFocusable(localRadioRef);\n\n return (\n <Aria.RadioGroup\n {...rest}\n {...skeletonProps}\n aria-describedby={controlProps[\"aria-describedby\"]}\n className={rootClassName}\n ref={localRadioRef}\n >\n <FieldErrorCaptureContext>\n <PropsContextProvider props={propsContext}>\n <ColumnLayout s={s} m={m} l={l} className={styles.radioGroup}>\n <UiComponentTunnelExit id=\"radioButtons\" component=\"RadioGroup\" />\n </ColumnLayout>\n\n <ColumnLayout\n s={s ?? [1]}\n m={m ?? [1]}\n l={l ?? [1]}\n rowGap=\"s\"\n className={styles.radioGroup}\n >\n <UiComponentTunnelExit id=\"radios\" component=\"RadioGroup\" />\n </ColumnLayout>\n\n {children}\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.RadioGroup>\n );\n});\n\nexport default RadioGroup;\n"],"mappings":";;;;;;;;;;;;;;;AAsBA,IAAa,aAAa,cAAc,eAAe,UAAU;CAC/D,MAAM,EAAE,UAAU,WAAW,GAAG,GAAG,GAAG,KAAK,GAAG,SAAS;CAEvD,MAAM,EACJ,gBACA,0BACA,cACA,cACA,mBACA,kBACE,kBAAkB,OAAO,YAAY;CAEzC,MAAM,gBAAgB,KAAK,aAAa,WAAW,SAAS;CAC5D,MAAM,eAA6B;EACjC,aAAa,EACX,QAAQ;GACN,IAAI;GACJ,WAAW;EACb,EACF;EACA,OAAO,EACL,QAAQ;GACN,IAAI;GACJ,WAAW;EACb,EACF;EACA,GAAG;CACL;CAEA,MAAM,gBAAgB,aAAa,GAAG;CACtC,iBAAiB,aAAa;CAE9B,OACE,qBAAC,KAAK,YAAN;EACE,GAAI;EACJ,GAAI;EACJ,oBAAkB,aAAa;EAC/B,WAAW;EACX,KAAK;EALP,UAAA,CAOE,oBAAC,0BAAD,EAAA,UACE,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA;IACE,oBAAC,cAAD;KAAiB;KAAM;KAAM;KAAG,WAAWA,0BAAO;KAChD,UAAA,oBAAC,uBAAD;MAAuB,IAAG;MAAe,WAAU;KAAc,CAAA;IACrD,CAAA;IAEd,oBAAC,cAAD;KACE,GAAG,KAAK,CAAC,CAAC;KACV,GAAG,KAAK,CAAC,CAAC;KACV,GAAG,KAAK,CAAC,CAAC;KACV,QAAO;KACP,WAAWA,0BAAO;KAElB,UAAA,oBAAC,uBAAD;MAAuB,IAAG;MAAS,WAAU;KAAc,CAAA;IAC/C,CAAA;IAEb;GACmB;EACE,CAAA,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACF;;AAErB,CAAC"}
|
|
@@ -44,6 +44,17 @@ var Rating = flowComponent("Rating", (props) => {
|
|
|
44
44
|
}
|
|
45
45
|
};
|
|
46
46
|
const defaultSegments = Array.from({ length: maxValue }, (_, index) => /* @__PURE__ */ jsx(RatingSegment, { ...segmentProps }, index));
|
|
47
|
+
const renderSegments = (tunnelChildren) => {
|
|
48
|
+
const tunneledSegments = Children.toArray(tunnelChildren);
|
|
49
|
+
const segments = tunneledSegments.length > 0 ? tunneledSegments : defaultSegments;
|
|
50
|
+
return segments.map((segment, index) => /* @__PURE__ */ jsx(RatingSegmentContextProvider, {
|
|
51
|
+
value: {
|
|
52
|
+
value: index + 1,
|
|
53
|
+
count: segments.length
|
|
54
|
+
},
|
|
55
|
+
children: segment
|
|
56
|
+
}, index));
|
|
57
|
+
};
|
|
47
58
|
return /* @__PURE__ */ jsxs(Aria.RadioGroup, {
|
|
48
59
|
...rest,
|
|
49
60
|
"aria-describedby": controlProps["aria-describedby"],
|
|
@@ -65,17 +76,7 @@ var Rating = flowComponent("Rating", (props) => {
|
|
|
65
76
|
children: /* @__PURE__ */ jsx(SkeletonModeReset, { children: /* @__PURE__ */ jsx(UiComponentTunnelExit, {
|
|
66
77
|
id: segmentsTunnelId,
|
|
67
78
|
component: "Rating",
|
|
68
|
-
children:
|
|
69
|
-
const tunneledSegments = Children.toArray(tunnelChildren);
|
|
70
|
-
const segments = tunneledSegments.length > 0 ? tunneledSegments : defaultSegments;
|
|
71
|
-
return segments.map((segment, index) => /* @__PURE__ */ jsx(RatingSegmentContextProvider, {
|
|
72
|
-
value: {
|
|
73
|
-
value: index + 1,
|
|
74
|
-
count: segments.length
|
|
75
|
-
},
|
|
76
|
-
children: segment
|
|
77
|
-
}, index));
|
|
78
|
-
}
|
|
79
|
+
children: renderSegments
|
|
79
80
|
}) })
|
|
80
81
|
})] }), /* @__PURE__ */ jsx(FieldErrorView, {})]
|
|
81
82
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Rating.mjs","names":["styles"],"sources":["../../../../../../../src/components/Rating/Rating.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"Rating.mjs","names":["styles"],"sources":["../../../../../../../src/components/Rating/Rating.tsx"],"sourcesContent":["import {\n Children,\n type PropsWithChildren,\n type ReactElement,\n type ReactNode,\n} from \"react\";\nimport styles from \"./Rating.module.scss\";\nimport clsx from \"clsx\";\nimport * as Aria from \"react-aria-components\";\nimport { RatingSegment } from \"@/components/Rating/components/RatingSegment\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\nimport { RatingSegmentContextProvider } from \"@/components/Rating/context\";\nimport {\n SkeletonModeReset,\n useSkeletonMode,\n} from \"@/components/SkeletonMode/skeletonModeContext\";\n\nexport interface RatingProps\n extends\n FlowComponentProps,\n PropsWithChildren,\n Omit<Aria.RadioGroupProps, \"children\" | \"value\" | \"defaultValue\"> {\n /**\n * The value sets the amount of filled stars. Decimals are rounded to the\n * nearest whole star. @default 0\n */\n value?: number;\n /**\n * The defaultValue sets the amount of default filled stars. Decimals are\n * rounded to the nearest whole star. @default 0\n */\n defaultValue?: number;\n /** The size of the component. @default \"m\" */\n size?: \"s\" | \"m\";\n /**\n * The number of segments the rating consists of. Ignored when the rating has\n * `RatingSegment` children — those define the number of segments themselves.\n *\n * @default 5\n */\n maxValue?: number;\n /**\n * How the segments are filled. `cumulative` fills every segment up to the\n * value, `single` fills only the selected segment.\n *\n * @default \"cumulative\"\n */\n fill?: \"cumulative\" | \"single\";\n /** An alternative icon for the empty state */\n iconEmpty?: ReactElement;\n /** An alternative icon for the filled state */\n iconFilled?: ReactElement;\n}\n\nconst segmentsTunnelId = \"segments\";\n\n// Segment values are whole numbers, so a decimal would match no segment.\nconst toSegmentValue = (value?: number) =>\n value === undefined ? undefined : Math.round(value).toString();\n\n/**\n * @flr-generate all\n * @flr-slot-props iconEmpty, iconFilled\n */\nexport const Rating = flowComponent(\"Rating\", (props) => {\n const {\n value,\n defaultValue,\n size = \"m\",\n maxValue = 5,\n fill = \"cumulative\",\n className,\n children,\n ref,\n iconEmpty,\n iconFilled,\n ...rest\n } = props;\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n wrapperProps,\n controlProps,\n fieldPropsContext,\n } = useFieldComponent(props, \"Rating\");\n\n const isSkeleton = useSkeletonMode();\n\n const rootClassName = clsx(\n styles.rating,\n styles[`size-${size}`],\n styles[`fill-${fill}`],\n isSkeleton && styles.skeleton,\n wrapperProps.className,\n className,\n );\n\n const localRef = useObjectRef(ref);\n\n useMakeFocusable(localRef);\n\n const segmentProps = { size, iconEmpty, iconFilled };\n\n const propsContext: PropsContext = {\n ...fieldPropsContext,\n RatingSegment: {\n ...segmentProps,\n tunnel: { id: segmentsTunnelId, component: \"Rating\" },\n },\n };\n\n const defaultSegments = Array.from({ length: maxValue }, (_, index) => (\n <RatingSegment key={index} {...segmentProps} />\n ));\n\n const renderSegments = (tunnelChildren: ReactNode) => {\n const tunneledSegments = Children.toArray(tunnelChildren);\n const segments =\n tunneledSegments.length > 0 ? tunneledSegments : defaultSegments;\n\n return segments.map((segment, index) => (\n <RatingSegmentContextProvider\n key={index}\n value={{ value: index + 1, count: segments.length }}\n >\n {segment}\n </RatingSegmentContextProvider>\n ));\n };\n\n return (\n <Aria.RadioGroup\n {...rest}\n aria-describedby={controlProps[\"aria-describedby\"]}\n className={rootClassName}\n value={toSegmentValue(value)}\n defaultValue={toSegmentValue(defaultValue)}\n ref={localRef}\n inert={isSkeleton || undefined}\n >\n <FieldErrorCaptureContext>\n <PropsContextProvider\n props={propsContext}\n dependencies={[size, iconEmpty, iconFilled]}\n >\n {children}\n </PropsContextProvider>\n <div className={styles.ratingSegments}>\n <SkeletonModeReset>\n <UiComponentTunnelExit id={segmentsTunnelId} component=\"Rating\">\n {renderSegments}\n </UiComponentTunnelExit>\n </SkeletonModeReset>\n </div>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.RadioGroup>\n );\n});\n\nexport default Rating;\n"],"mappings":";;;;;;;;;;;;;;;;;AA8DA,IAAM,mBAAmB;AAGzB,IAAM,kBAAkB,UACtB,UAAU,KAAA,IAAY,KAAA,IAAY,KAAK,MAAM,KAAK,CAAC,CAAC,SAAS;;;;;AAM/D,IAAa,SAAS,cAAc,WAAW,UAAU;CACvD,MAAM,EACJ,OACA,cACA,OAAO,KACP,WAAW,GACX,OAAO,cACP,WACA,UACA,KACA,WACA,YACA,GAAG,SACD;CAEJ,MAAM,EACJ,gBACA,0BACA,cACA,cACA,sBACE,kBAAkB,OAAO,QAAQ;CAErC,MAAM,aAAa,gBAAgB;CAEnC,MAAM,gBAAgB,KACpBA,sBAAO,QACPA,sBAAO,QAAQ,SACfA,sBAAO,QAAQ,SACf,cAAcA,sBAAO,UACrB,aAAa,WACb,SACF;CAEA,MAAM,WAAW,aAAa,GAAG;CAEjC,iBAAiB,QAAQ;CAEzB,MAAM,eAAe;EAAE;EAAM;EAAW;CAAW;CAEnD,MAAM,eAA6B;EACjC,GAAG;EACH,eAAe;GACb,GAAG;GACH,QAAQ;IAAE,IAAI;IAAkB,WAAW;GAAS;EACtD;CACF;CAEA,MAAM,kBAAkB,MAAM,KAAK,EAAE,QAAQ,SAAS,IAAI,GAAG,UAC3D,oBAAC,eAAD,EAA2B,GAAI,aAAe,GAA1B,KAA0B,CAC/C;CAED,MAAM,kBAAkB,mBAA8B;EACpD,MAAM,mBAAmB,SAAS,QAAQ,cAAc;EACxD,MAAM,WACJ,iBAAiB,SAAS,IAAI,mBAAmB;EAEnD,OAAO,SAAS,KAAK,SAAS,UAC5B,oBAAC,8BAAD;GAEE,OAAO;IAAE,OAAO,QAAQ;IAAG,OAAO,SAAS;GAAO;GAEjD,UAAA;EAC2B,GAJvB,KAIuB,CAC/B;CACH;CAEA,OACE,qBAAC,KAAK,YAAN;EACE,GAAI;EACJ,oBAAkB,aAAa;EAC/B,WAAW;EACX,OAAO,eAAe,KAAK;EAC3B,cAAc,eAAe,YAAY;EACzC,KAAK;EACL,OAAO,cAAc,KAAA;EAPvB,UAAA,CASE,qBAAC,0BAAD,EAAA,UAAA,CACE,oBAAC,sBAAD;GACE,OAAO;GACP,cAAc;IAAC;IAAM;IAAW;GAAU;GAEzC;EACmB,CAAA,GACtB,oBAAC,OAAD;GAAK,WAAWA,sBAAO;GACrB,UAAA,oBAAC,mBAAD,EAAA,UACE,oBAAC,uBAAD;IAAuB,IAAI;IAAkB,WAAU;IACpD,UAAA;GACoB,CAAA,EACN,CAAA;EAChB,CAAA,CACmB,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACF;;AAErB,CAAC"}
|
|
@@ -7,7 +7,6 @@ import { IconSearch } from "../Icon/components/icons/IconSearch.mjs";
|
|
|
7
7
|
import { useLocalizedStringFormatter } from "../TranslationProvider/useLocalizedStringFormatter.mjs";
|
|
8
8
|
import { Button } from "../Button/Button.mjs";
|
|
9
9
|
import { UiComponentTunnelExit } from "../UiComponentTunnel/UiComponentTunnelExit.mjs";
|
|
10
|
-
import FormField_module_default from "../FormField/FormField.module.mjs";
|
|
11
10
|
import { useFieldComponent } from "../../lib/hooks/useFieldComponent.mjs";
|
|
12
11
|
import { useControlledHostValueProps } from "../../lib/remote/useControlledHostValueProps.mjs";
|
|
13
12
|
import SearchField_module_default from "./SearchField.module.mjs";
|
|
@@ -20,7 +19,7 @@ import * as Aria from "react-aria-components";
|
|
|
20
19
|
var SearchField = flowComponent("SearchField", (props) => {
|
|
21
20
|
const { children, className, ref, ...rest } = useControlledHostValueProps(props, "");
|
|
22
21
|
const { FieldErrorView, FieldErrorCaptureContext, wrapperProps, controlProps, fieldPropsContext, skeletonProps } = useFieldComponent(props, "SearchField");
|
|
23
|
-
const rootClassName = clsx(
|
|
22
|
+
const rootClassName = clsx(wrapperProps.className, SearchField_module_default.searchField, className);
|
|
24
23
|
const searchText = useLocalizedStringFormatter(__locale_default, "SearchField").format(`search`);
|
|
25
24
|
const propsContext = {
|
|
26
25
|
Kbd: {
|
|
@@ -38,7 +37,7 @@ var SearchField = flowComponent("SearchField", (props) => {
|
|
|
38
37
|
...controlProps,
|
|
39
38
|
...skeletonProps,
|
|
40
39
|
"aria-label": searchText,
|
|
41
|
-
className:
|
|
40
|
+
className: rootClassName,
|
|
42
41
|
children: [/* @__PURE__ */ jsxs(PropsContextProvider, {
|
|
43
42
|
props: propsContext,
|
|
44
43
|
children: [/* @__PURE__ */ jsx(FieldErrorCaptureContext, { children }), /* @__PURE__ */ jsxs("div", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchField.mjs","names":["
|
|
1
|
+
{"version":3,"file":"SearchField.mjs","names":["styles","locales"],"sources":["../../../../../../../src/components/SearchField/SearchField.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./SearchField.module.scss\";\nimport clsx from \"clsx\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Button } from \"@/components/Button\";\nimport { IconClose, IconSearch } from \"@/components/Icon/components/icons\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { useControlledHostValueProps } from \"@/lib/remote/useControlledHostValueProps\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport interface SearchFieldProps\n extends\n PropsWithChildren<Omit<Aria.SearchFieldProps, \"children\">>,\n FlowComponentProps<HTMLInputElement> {}\n\n/** @flr-generate all */\nexport const SearchField = flowComponent(\"SearchField\", (props) => {\n const { children, className, ref, ...rest } = useControlledHostValueProps(\n props,\n \"\",\n );\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n wrapperProps,\n controlProps,\n fieldPropsContext,\n skeletonProps,\n } = useFieldComponent(props, \"SearchField\");\n\n const rootClassName = clsx(\n wrapperProps.className,\n styles.searchField,\n className,\n );\n\n const stringFormatter = useLocalizedStringFormatter(locales, \"SearchField\");\n const searchText = stringFormatter.format(`search`);\n\n const propsContext: PropsContext = {\n Kbd: {\n isDisabled: props.isDisabled,\n tunnel: {\n id: \"kbd\",\n component: \"SearchField\",\n },\n className: styles.kbd,\n },\n ...fieldPropsContext,\n };\n\n return (\n <Aria.SearchField\n {...rest}\n {...controlProps}\n {...skeletonProps}\n aria-label={searchText}\n className={rootClassName}\n >\n <PropsContextProvider props={propsContext}>\n <FieldErrorCaptureContext>{children}</FieldErrorCaptureContext>\n\n <div className={styles.inputContainer}>\n <IconSearch className={styles.searchIcon} />\n <Aria.Input\n placeholder={searchText}\n className={styles.input}\n ref={ref}\n />\n <UiComponentTunnelExit id=\"kbd\" component=\"SearchField\" />\n <Button\n className={styles.clearButton}\n variant=\"plain\"\n color=\"secondary\"\n >\n <IconClose />\n </Button>\n </div>\n </PropsContextProvider>\n <FieldErrorView />\n </Aria.SearchField>\n );\n});\n\nexport default SearchField;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAqBA,IAAa,cAAc,cAAc,gBAAgB,UAAU;CACjE,MAAM,EAAE,UAAU,WAAW,KAAK,GAAG,SAAS,4BAC5C,OACA,EACF;CAEA,MAAM,EACJ,gBACA,0BACA,cACA,cACA,mBACA,kBACE,kBAAkB,OAAO,aAAa;CAE1C,MAAM,gBAAgB,KACpB,aAAa,WACbA,2BAAO,aACP,SACF;CAGA,MAAM,aADkB,4BAA4BC,kBAAS,aAC1C,CAAA,CAAgB,OAAO,QAAQ;CAElD,MAAM,eAA6B;EACjC,KAAK;GACH,YAAY,MAAM;GAClB,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,WAAWD,2BAAO;EACpB;EACA,GAAG;CACL;CAEA,OACE,qBAAC,KAAK,aAAN;EACE,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,cAAY;EACZ,WAAW;EALb,UAAA,CAOE,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACE,oBAAC,0BAAD,EAA2B,SAAmC,CAAA,GAE9D,qBAAC,OAAD;IAAK,WAAWA,2BAAO;IAAvB,UAAA;KACE,oBAAC,YAAD,EAAY,WAAWA,2BAAO,WAAa,CAAA;KAC3C,oBAAC,KAAK,OAAN;MACE,aAAa;MACb,WAAWA,2BAAO;MACb;KACN,CAAA;KACD,oBAAC,uBAAD;MAAuB,IAAG;MAAM,WAAU;KAAe,CAAA;KACzD,oBAAC,QAAD;MACE,WAAWA,2BAAO;MAClB,SAAQ;MACR,OAAM;MAEN,UAAA,oBAAC,WAAD,CAAY,CAAA;KACN,CAAA;IACL;GACe,CAAA,CAAA;EACtB,CAAA,GAAA,oBAAC,gBAAD,CAAiB,CAAA,CACD;;AAEtB,CAAC"}
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
/* */
|
|
3
3
|
import { PropsContextProvider } from "../../lib/propsContext/components/PropsContextProvider.mjs";
|
|
4
4
|
import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
|
|
5
|
+
import { SectionHeadingProvider, useSectionHeading } from "./context.mjs";
|
|
5
6
|
import Section_module_default from "./Section.module.mjs";
|
|
6
7
|
import ContextMenuSectionView from "../../views/ContextMenuSectionView.mjs";
|
|
7
8
|
import clsx from "clsx";
|
|
@@ -11,29 +12,32 @@ import { jsx } from "react/jsx-runtime";
|
|
|
11
12
|
/** @flr-generate all */
|
|
12
13
|
var Section = flowComponent("Section", (props) => {
|
|
13
14
|
const { children, className, ref, renderContextMenuSection, hideSeparator, ...rest } = props;
|
|
15
|
+
const headingId = useId();
|
|
16
|
+
const sectionHeading = useSectionHeading(headingId);
|
|
14
17
|
if (!children) return null;
|
|
15
18
|
if (renderContextMenuSection) return /* @__PURE__ */ jsx(ContextMenuSectionView, {
|
|
16
19
|
ref,
|
|
17
20
|
children
|
|
18
21
|
});
|
|
19
22
|
const rootClassName = clsx(Section_module_default.section, hideSeparator && Section_module_default.hideSeparator, className);
|
|
20
|
-
const headingId = useId();
|
|
21
23
|
const propsContext = {
|
|
22
24
|
Heading: {
|
|
23
25
|
level: 2,
|
|
24
26
|
id: headingId,
|
|
25
27
|
className: Section_module_default.heading
|
|
26
28
|
},
|
|
27
|
-
Header: { renderSectionHeader: true }
|
|
28
|
-
List: { "aria-labelledby": headingId }
|
|
29
|
+
Header: { renderSectionHeader: true }
|
|
29
30
|
};
|
|
30
31
|
return /* @__PURE__ */ jsx("section", {
|
|
31
32
|
...rest,
|
|
32
33
|
className: rootClassName,
|
|
33
34
|
ref,
|
|
34
|
-
children: /* @__PURE__ */ jsx(
|
|
35
|
-
|
|
36
|
-
children
|
|
35
|
+
children: /* @__PURE__ */ jsx(SectionHeadingProvider, {
|
|
36
|
+
value: sectionHeading,
|
|
37
|
+
children: /* @__PURE__ */ jsx(PropsContextProvider, {
|
|
38
|
+
props: propsContext,
|
|
39
|
+
children
|
|
40
|
+
})
|
|
37
41
|
})
|
|
38
42
|
});
|
|
39
43
|
}, { type: "layout" });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Section.mjs","names":["styles"],"sources":["../../../../../../../src/components/Section/Section.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren } from \"react\";\nimport { useId } from \"react\";\nimport styles from \"./Section.module.scss\";\nimport clsx from \"clsx\";\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 ContextMenuSectionView from \"@/views/ContextMenuSectionView\";\n\nexport interface SectionProps\n extends\n PropsWithChildren<ComponentProps<\"section\">>,\n FlowComponentProps<HTMLElement> {\n /** @internal */\n renderContextMenuSection?: boolean;\n /** @internal */\n hideSeparator?: boolean;\n}\n\n/** @flr-generate all */\nexport const Section = flowComponent(\n \"Section\",\n (props) => {\n const {\n children,\n className,\n ref,\n renderContextMenuSection,\n hideSeparator,\n ...rest\n } = props;\n\n if (!children) {\n return null;\n }\n\n if (renderContextMenuSection) {\n return (\n <ContextMenuSectionView ref={ref as never}>\n {children}\n </ContextMenuSectionView>\n );\n }\n\n const rootClassName = clsx(\n styles.section,\n hideSeparator && styles.hideSeparator,\n className,\n );\n\n const
|
|
1
|
+
{"version":3,"file":"Section.mjs","names":["styles"],"sources":["../../../../../../../src/components/Section/Section.tsx"],"sourcesContent":["import type { ComponentProps, PropsWithChildren } from \"react\";\nimport { useId } from \"react\";\nimport styles from \"./Section.module.scss\";\nimport clsx from \"clsx\";\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 ContextMenuSectionView from \"@/views/ContextMenuSectionView\";\nimport { SectionHeadingProvider, useSectionHeading } from \"./context\";\n\nexport interface SectionProps\n extends\n PropsWithChildren<ComponentProps<\"section\">>,\n FlowComponentProps<HTMLElement> {\n /** @internal */\n renderContextMenuSection?: boolean;\n /** @internal */\n hideSeparator?: boolean;\n}\n\n/** @flr-generate all */\nexport const Section = flowComponent(\n \"Section\",\n (props) => {\n const {\n children,\n className,\n ref,\n renderContextMenuSection,\n hideSeparator,\n ...rest\n } = props;\n\n const headingId = useId();\n const sectionHeading = useSectionHeading(headingId);\n\n if (!children) {\n return null;\n }\n\n if (renderContextMenuSection) {\n return (\n <ContextMenuSectionView ref={ref as never}>\n {children}\n </ContextMenuSectionView>\n );\n }\n\n const rootClassName = clsx(\n styles.section,\n hideSeparator && styles.hideSeparator,\n className,\n );\n\n const propsContext: PropsContext = {\n Heading: {\n level: 2,\n id: headingId,\n className: styles.heading,\n },\n Header: {\n renderSectionHeader: true,\n },\n };\n\n return (\n <section {...rest} className={rootClassName} ref={ref}>\n <SectionHeadingProvider value={sectionHeading}>\n <PropsContextProvider props={propsContext}>\n {children}\n </PropsContextProvider>\n </SectionHeadingProvider>\n </section>\n );\n },\n {\n type: \"layout\",\n },\n);\n\nexport default Section;\n"],"mappings":";;;;;;;;;;;;AAsBA,IAAa,UAAU,cACrB,YACC,UAAU;CACT,MAAM,EACJ,UACA,WACA,KACA,0BACA,eACA,GAAG,SACD;CAEJ,MAAM,YAAY,MAAM;CACxB,MAAM,iBAAiB,kBAAkB,SAAS;CAElD,IAAI,CAAC,UACH,OAAO;CAGT,IAAI,0BACF,OACE,oBAAC,wBAAD;EAA6B;EAC1B;CACqB,CAAA;CAI5B,MAAM,gBAAgB,KACpBA,uBAAO,SACP,iBAAiBA,uBAAO,eACxB,SACF;CAEA,MAAM,eAA6B;EACjC,SAAS;GACP,OAAO;GACP,IAAI;GACJ,WAAWA,uBAAO;EACpB;EACA,QAAQ,EACN,qBAAqB,KACvB;CACF;CAEA,OACE,oBAAC,WAAD;EAAS,GAAI;EAAM,WAAW;EAAoB;EAChD,UAAA,oBAAC,wBAAD;GAAwB,OAAO;GAC7B,UAAA,oBAAC,sBAAD;IAAsB,OAAO;IAC1B;GACmB,CAAA;EACA,CAAA;CACjB,CAAA;AAEb,GACA,EACE,MAAM,SACR,CACF"}
|
|
@@ -40,10 +40,6 @@ var SectionHeader = flowComponent("SectionHeader", (props) => {
|
|
|
40
40
|
tunnel: actionsTunnel,
|
|
41
41
|
Button: { size: "s" }
|
|
42
42
|
},
|
|
43
|
-
Action: {
|
|
44
|
-
tunnel: actionsTunnel,
|
|
45
|
-
Button: { tunnel: null }
|
|
46
|
-
},
|
|
47
43
|
Heading: { level: 2 },
|
|
48
44
|
Link: { tunnel: actionsTunnel }
|
|
49
45
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SectionHeader.mjs","names":["styles"],"sources":["../../../../../../../../../src/components/Section/components/SectionHeader/SectionHeader.tsx"],"sourcesContent":["import type { FC, PropsWithChildren, RefAttributes } from \"react\";\nimport styles from \"./SectionHeader.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport {\n overlayTriggersTunneledTo,\n PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport type SectionHeaderProps = PropsWithChildren &\n PropsWithClassName &\n RefAttributes<HTMLHeadingElement>;\n\nexport const SectionHeader: FC<SectionHeaderProps> = flowComponent(\n \"SectionHeader\",\n (props) => {\n const { children, className, ref } = props;\n\n const rootClassName = clsx(styles.sectionHeader, className);\n\n const actionsTunnel = {\n id: \"actions\",\n component: \"SectionHeader\",\n } as const;\n\n const propsContext: PropsContext = {\n ...overlayTriggersTunneledTo(actionsTunnel),\n Switch: {\n labelPosition: \"leading\",\n tunnel: actionsTunnel,\n },\n Button: {\n size: \"s\",\n tunnel: actionsTunnel,\n },\n ActionGroup: {\n preserveOrder: true,\n size: \"s\",\n tunnel: actionsTunnel,\n Button: {\n tunnel: null,\n },\n Switch: {\n tunnel: null,\n },\n Link: {\n size: \"m\",\n tunnel: null,\n },\n },\n FileField: {\n tunnel: actionsTunnel,\n Button: { size: \"s\" },\n },\n
|
|
1
|
+
{"version":3,"file":"SectionHeader.mjs","names":["styles"],"sources":["../../../../../../../../../src/components/Section/components/SectionHeader/SectionHeader.tsx"],"sourcesContent":["import type { FC, PropsWithChildren, RefAttributes } from \"react\";\nimport styles from \"./SectionHeader.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport {\n overlayTriggersTunneledTo,\n PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\n\nexport type SectionHeaderProps = PropsWithChildren &\n PropsWithClassName &\n RefAttributes<HTMLHeadingElement>;\n\nexport const SectionHeader: FC<SectionHeaderProps> = flowComponent(\n \"SectionHeader\",\n (props) => {\n const { children, className, ref } = props;\n\n const rootClassName = clsx(styles.sectionHeader, className);\n\n const actionsTunnel = {\n id: \"actions\",\n component: \"SectionHeader\",\n } as const;\n\n const propsContext: PropsContext = {\n ...overlayTriggersTunneledTo(actionsTunnel),\n Switch: {\n labelPosition: \"leading\",\n tunnel: actionsTunnel,\n },\n Button: {\n size: \"s\",\n tunnel: actionsTunnel,\n },\n ActionGroup: {\n preserveOrder: true,\n size: \"s\",\n tunnel: actionsTunnel,\n Button: {\n tunnel: null,\n },\n Switch: {\n tunnel: null,\n },\n Link: {\n size: \"m\",\n tunnel: null,\n },\n },\n FileField: {\n tunnel: actionsTunnel,\n Button: { size: \"s\" },\n },\n Heading: {\n level: 2,\n },\n Link: {\n tunnel: actionsTunnel,\n },\n };\n\n return (\n <header ref={ref} className={rootClassName}>\n <PropsContextProvider props={propsContext}>\n {children}\n <div className={styles.actions}>\n <UiComponentTunnelExit id=\"actions\" component=\"SectionHeader\" />\n </div>\n </PropsContextProvider>\n </header>\n );\n },\n {\n type: \"layout\",\n },\n);\n\nexport default SectionHeader;\n"],"mappings":";;;;;;;;;;AAgBA,IAAa,gBAAwC,cACnD,kBACC,UAAU;CACT,MAAM,EAAE,UAAU,WAAW,QAAQ;CAErC,MAAM,gBAAgB,KAAKA,6BAAO,eAAe,SAAS;CAE1D,MAAM,gBAAgB;EACpB,IAAI;EACJ,WAAW;CACb;CAEA,MAAM,eAA6B;EACjC,GAAG,0BAA0B,aAAa;EAC1C,QAAQ;GACN,eAAe;GACf,QAAQ;EACV;EACA,QAAQ;GACN,MAAM;GACN,QAAQ;EACV;EACA,aAAa;GACX,eAAe;GACf,MAAM;GACN,QAAQ;GACR,QAAQ,EACN,QAAQ,KACV;GACA,QAAQ,EACN,QAAQ,KACV;GACA,MAAM;IACJ,MAAM;IACN,QAAQ;GACV;EACF;EACA,WAAW;GACT,QAAQ;GACR,QAAQ,EAAE,MAAM,IAAI;EACtB;EACA,SAAS,EACP,OAAO,EACT;EACA,MAAM,EACJ,QAAQ,cACV;CACF;CAEA,OACE,oBAAC,UAAD;EAAa;EAAK,WAAW;EAC3B,UAAA,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA,CACG,UACD,oBAAC,OAAD;IAAK,WAAWA,6BAAO;IACrB,UAAA,oBAAC,uBAAD;KAAuB,IAAG;KAAU,WAAU;IAAiB,CAAA;GAC5D,CAAA,CACe;;CAChB,CAAA;AAEZ,GACA,EACE,MAAM,SACR,CACF"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
/* */
|
|
3
|
+
import { createContext, createElement, useCallback, useContext, useLayoutEffect, useMemo, useState } from "react";
|
|
4
|
+
//#region src/components/Section/context.ts
|
|
5
|
+
var sectionHeadingContext = createContext(void 0);
|
|
6
|
+
/** The heading state a `Section` provides for the given heading id. */
|
|
7
|
+
var useSectionHeading = (id) => {
|
|
8
|
+
const [renderedCount, setRenderedCount] = useState(0);
|
|
9
|
+
const register = useCallback(() => {
|
|
10
|
+
setRenderedCount((count) => count + 1);
|
|
11
|
+
return () => setRenderedCount((count) => count - 1);
|
|
12
|
+
}, []);
|
|
13
|
+
return useMemo(() => ({
|
|
14
|
+
id,
|
|
15
|
+
isRendered: renderedCount > 0,
|
|
16
|
+
register
|
|
17
|
+
}), [
|
|
18
|
+
id,
|
|
19
|
+
renderedCount,
|
|
20
|
+
register
|
|
21
|
+
]);
|
|
22
|
+
};
|
|
23
|
+
var SectionHeadingProvider = sectionHeadingContext.Provider;
|
|
24
|
+
/**
|
|
25
|
+
* Ends the surrounding `Section`'s heading scope, for content that has a
|
|
26
|
+
* heading of its own (`Accordion`, `Alert`, an overlay, …).
|
|
27
|
+
*/
|
|
28
|
+
var SectionHeadingReset = ({ children }) => createElement(sectionHeadingContext.Provider, { value: void 0 }, children);
|
|
29
|
+
/** Marks the section heading as rendered while a heading carries its id. */
|
|
30
|
+
var useRegisterSectionHeading = (id) => {
|
|
31
|
+
const sectionHeading = useContext(sectionHeadingContext);
|
|
32
|
+
const register = sectionHeading && id === sectionHeading.id ? sectionHeading.register : void 0;
|
|
33
|
+
useLayoutEffect(() => register?.(), [register]);
|
|
34
|
+
};
|
|
35
|
+
/**
|
|
36
|
+
* The `aria-labelledby` of a grid or table: its own label, else the heading of
|
|
37
|
+
* the surrounding `Section` once that heading renders.
|
|
38
|
+
*/
|
|
39
|
+
var useLabelledBySectionHeading = (props) => {
|
|
40
|
+
const sectionHeading = useContext(sectionHeadingContext);
|
|
41
|
+
if (props["aria-labelledby"] || props["aria-label"]) return props["aria-labelledby"];
|
|
42
|
+
return sectionHeading?.isRendered ? sectionHeading.id : void 0;
|
|
43
|
+
};
|
|
44
|
+
//#endregion
|
|
45
|
+
export { SectionHeadingProvider, SectionHeadingReset, useLabelledBySectionHeading, useRegisterSectionHeading, useSectionHeading };
|
|
46
|
+
|
|
47
|
+
//# sourceMappingURL=context.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"context.mjs","names":[],"sources":["../../../../../../../src/components/Section/context.ts"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport {\n createContext,\n createElement,\n useCallback,\n useContext,\n useLayoutEffect,\n useMemo,\n useState,\n} from \"react\";\n\ninterface SectionHeading {\n /** The id the surrounding `Section` gives its heading. */\n id: string;\n /** Whether a heading currently renders with that id. */\n isRendered: boolean;\n /** Called by a heading that renders with the id; returns the cleanup. */\n register: () => () => void;\n}\n\nconst sectionHeadingContext = createContext<SectionHeading | undefined>(\n undefined,\n);\n\n/** The heading state a `Section` provides for the given heading id. */\nexport const useSectionHeading = (id: string): SectionHeading => {\n const [renderedCount, setRenderedCount] = useState(0);\n\n const register = useCallback(() => {\n setRenderedCount((count) => count + 1);\n return () => setRenderedCount((count) => count - 1);\n }, []);\n\n return useMemo(\n () => ({ id, isRendered: renderedCount > 0, register }),\n [id, renderedCount, register],\n );\n};\n\nexport const SectionHeadingProvider = sectionHeadingContext.Provider;\n\n/**\n * Ends the surrounding `Section`'s heading scope, for content that has a\n * heading of its own (`Accordion`, `Alert`, an overlay, …).\n */\nexport const SectionHeadingReset: FC<PropsWithChildren> = ({ children }) =>\n createElement(sectionHeadingContext.Provider, { value: undefined }, children);\n\n/** Marks the section heading as rendered while a heading carries its id. */\nexport const useRegisterSectionHeading = (id: string | undefined) => {\n const sectionHeading = useContext(sectionHeadingContext);\n const register =\n sectionHeading && id === sectionHeading.id\n ? sectionHeading.register\n : undefined;\n\n useLayoutEffect(() => register?.(), [register]);\n};\n\n/**\n * The `aria-labelledby` of a grid or table: its own label, else the heading of\n * the surrounding `Section` once that heading renders.\n */\nexport const useLabelledBySectionHeading = (props: {\n \"aria-label\"?: string;\n \"aria-labelledby\"?: string;\n}): string | undefined => {\n const sectionHeading = useContext(sectionHeadingContext);\n\n if (props[\"aria-labelledby\"] || props[\"aria-label\"]) {\n return props[\"aria-labelledby\"];\n }\n\n return sectionHeading?.isRendered ? sectionHeading.id : undefined;\n};\n"],"mappings":";;;;AAoBA,IAAM,wBAAwB,cAC5B,KAAA,CACF;;AAGA,IAAa,qBAAqB,OAA+B;CAC/D,MAAM,CAAC,eAAe,oBAAoB,SAAS,CAAC;CAEpD,MAAM,WAAW,kBAAkB;EACjC,kBAAkB,UAAU,QAAQ,CAAC;EACrC,aAAa,kBAAkB,UAAU,QAAQ,CAAC;CACpD,GAAG,CAAC,CAAC;CAEL,OAAO,eACE;EAAE;EAAI,YAAY,gBAAgB;EAAG;CAAS,IACrD;EAAC;EAAI;EAAe;CAAQ,CAC9B;AACF;AAEA,IAAa,yBAAyB,sBAAsB;;;;;AAM5D,IAAa,uBAA8C,EAAE,eAC3D,cAAc,sBAAsB,UAAU,EAAE,OAAO,KAAA,EAAU,GAAG,QAAQ;;AAG9E,IAAa,6BAA6B,OAA2B;CACnE,MAAM,iBAAiB,WAAW,qBAAqB;CACvD,MAAM,WACJ,kBAAkB,OAAO,eAAe,KACpC,eAAe,WACf,KAAA;CAEN,sBAAsB,WAAW,GAAG,CAAC,QAAQ,CAAC;AAChD;;;;;AAMA,IAAa,+BAA+B,UAGlB;CACxB,MAAM,iBAAiB,WAAW,qBAAqB;CAEvD,IAAI,MAAM,sBAAsB,MAAM,eACpC,OAAO,MAAM;CAGf,OAAO,gBAAgB,aAAa,eAAe,KAAK,KAAA;AAC1D"}
|
|
@@ -4,7 +4,6 @@ import { PropsContextProvider } from "../../lib/propsContext/components/PropsCon
|
|
|
4
4
|
import { flowComponent } from "../../lib/componentFactory/flowComponent.mjs";
|
|
5
5
|
import { useWarnDeprecation } from "../DeprecationWarningProvider/DeprecationWarningProvider.mjs";
|
|
6
6
|
import { UiComponentTunnelExit } from "../UiComponentTunnel/UiComponentTunnelExit.mjs";
|
|
7
|
-
import FormField_module_default from "../FormField/FormField.module.mjs";
|
|
8
7
|
import { useFieldComponent } from "../../lib/hooks/useFieldComponent.mjs";
|
|
9
8
|
import { useMakeFocusable } from "../../lib/hooks/dom/useMakeFocusable.mjs";
|
|
10
9
|
import SegmentedControl_module_default from "./SegmentedControl.module.mjs";
|
|
@@ -23,7 +22,7 @@ var SegmentedControl = flowComponent("SegmentedControl", (props) => {
|
|
|
23
22
|
useWarnDeprecation()("The 'SegmentedControl' component is deprecated and will be removed in a future release. Use 'Tabs' instead when it switches content, or 'RadioGroup' instead when it sets a value.");
|
|
24
23
|
const { children, className, containerBreakpointSize = "m", ref, ...rest } = props;
|
|
25
24
|
const { FieldErrorView, fieldPropsContext, wrapperProps, controlProps, FieldErrorCaptureContext, skeletonProps } = useFieldComponent(props, "SegmentedControl");
|
|
26
|
-
const rootClassName = clsx(
|
|
25
|
+
const rootClassName = clsx(wrapperProps.className, SegmentedControl_module_default.segmentedControlContainer, SegmentedControl_module_default[getContainerBreakpointSizeClassName(containerBreakpointSize)], className);
|
|
27
26
|
const propsContext = {
|
|
28
27
|
Segment: {
|
|
29
28
|
tunnel: {
|
|
@@ -40,7 +39,7 @@ var SegmentedControl = flowComponent("SegmentedControl", (props) => {
|
|
|
40
39
|
...rest,
|
|
41
40
|
...skeletonProps,
|
|
42
41
|
"aria-describedby": controlProps["aria-describedby"],
|
|
43
|
-
className:
|
|
42
|
+
className: rootClassName,
|
|
44
43
|
ref: objectRef,
|
|
45
44
|
children: [/* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsxs(PropsContextProvider, {
|
|
46
45
|
dependencies: ["segment"],
|
package/dist/js/packages/components/src/components/SegmentedControl/SegmentedControl.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControl.mjs","names":["
|
|
1
|
+
{"version":3,"file":"SegmentedControl.mjs","names":["styles"],"sources":["../../../../../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport type { PropsWithContainerBreakpointSize } from \"@/lib/types/props\";\nimport { type PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./SegmentedControl.module.scss\";\nimport { getContainerBreakpointSizeClassName } from \"@/lib/getContainerBreakpointSizeClassName\";\nimport { type PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport clsx from \"clsx\";\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\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\nexport interface SegmentedControlProps\n extends\n PropsWithChildren<Omit<Aria.RadioGroupProps, \"children\" | \"ref\">>,\n FlowComponentProps<HTMLDivElement>,\n PropsWithContainerBreakpointSize {}\n\n/**\n * @deprecated Use `Tabs` to switch content, or `RadioGroup` to select a value.\n * @flr-generate all\n */\nexport const SegmentedControl = flowComponent(\"SegmentedControl\", (props) => {\n const warnDeprecation = useWarnDeprecation();\n warnDeprecation(\n \"The 'SegmentedControl' component is deprecated and will be removed in a future release. Use 'Tabs' instead when it switches content, or 'RadioGroup' instead when it sets a value.\",\n );\n\n const {\n children,\n className,\n containerBreakpointSize = \"m\",\n ref,\n ...rest\n } = props;\n\n const {\n FieldErrorView,\n fieldPropsContext,\n wrapperProps,\n controlProps,\n FieldErrorCaptureContext,\n skeletonProps,\n } = useFieldComponent(props, \"SegmentedControl\");\n\n const rootClassName = clsx(\n wrapperProps.className,\n styles.segmentedControlContainer,\n styles[getContainerBreakpointSizeClassName(containerBreakpointSize)],\n className,\n );\n\n const propsContext: PropsContext = {\n Segment: {\n tunnel: {\n id: \"segments\",\n component: \"SegmentedControl\",\n },\n className: styles.segment,\n },\n ...fieldPropsContext,\n };\n\n const objectRef = useObjectRef(ref);\n useMakeFocusable(objectRef);\n\n return (\n <Aria.RadioGroup\n {...rest}\n {...skeletonProps}\n aria-describedby={controlProps[\"aria-describedby\"]}\n className={rootClassName}\n ref={objectRef}\n >\n <FieldErrorCaptureContext>\n <PropsContextProvider dependencies={[\"segment\"]} props={propsContext}>\n <div className={styles.segmentedControl}>\n <div className={styles.segments}>\n <UiComponentTunnelExit\n id=\"segments\"\n component=\"SegmentedControl\"\n />\n </div>\n </div>\n {children}\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.RadioGroup>\n );\n});\n\nexport default SegmentedControl;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AA4BA,IAAa,mBAAmB,cAAc,qBAAqB,UAAU;CAE3E,mBAAA,CAAA,CACE,oLACF;CAEA,MAAM,EACJ,UACA,WACA,0BAA0B,KAC1B,KACA,GAAG,SACD;CAEJ,MAAM,EACJ,gBACA,mBACA,cACA,cACA,0BACA,kBACE,kBAAkB,OAAO,kBAAkB;CAE/C,MAAM,gBAAgB,KACpB,aAAa,WACbA,gCAAO,2BACPA,gCAAO,oCAAoC,uBAAuB,IAClE,SACF;CAEA,MAAM,eAA6B;EACjC,SAAS;GACP,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,WAAWA,gCAAO;EACpB;EACA,GAAG;CACL;CAEA,MAAM,YAAY,aAAa,GAAG;CAClC,iBAAiB,SAAS;CAE1B,OACE,qBAAC,KAAK,YAAN;EACE,GAAI;EACJ,GAAI;EACJ,oBAAkB,aAAa;EAC/B,WAAW;EACX,KAAK;EALP,UAAA,CAOE,oBAAC,0BAAD,EAAA,UACE,qBAAC,sBAAD;GAAsB,cAAc,CAAC,SAAS;GAAG,OAAO;GAAxD,UAAA,CACE,oBAAC,OAAD;IAAK,WAAWA,gCAAO;IACrB,UAAA,oBAAC,OAAD;KAAK,WAAWA,gCAAO;KACrB,UAAA,oBAAC,uBAAD;MACE,IAAG;MACH,WAAU;KACX,CAAA;IACE,CAAA;GACF,CAAA,GACJ,QACmB;EACE,CAAA,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACF;;AAErB,CAAC"}
|
|
@@ -8,7 +8,6 @@ import { UiComponentTunnelExit } from "../UiComponentTunnel/UiComponentTunnelExi
|
|
|
8
8
|
import { useOverlayController } from "../../lib/controller/overlay/useOverlayController.mjs";
|
|
9
9
|
import { getOptionsTunnelProps } from "../Option/optionsTunnel.mjs";
|
|
10
10
|
import { Options } from "../Options/Options.mjs";
|
|
11
|
-
import FormField_module_default from "../FormField/FormField.module.mjs";
|
|
12
11
|
import { useFieldComponent } from "../../lib/hooks/useFieldComponent.mjs";
|
|
13
12
|
import Select_module_default from "./Select.module.mjs";
|
|
14
13
|
import clsx from "clsx";
|
|
@@ -22,7 +21,7 @@ var Select = flowComponent("Select", (props) => {
|
|
|
22
21
|
const warnDeprecation = useWarnDeprecation();
|
|
23
22
|
if (onSelectionChange !== void 0) warnDeprecation("The 'onSelectionChange' prop is deprecated and will be removed in a future release. Use 'onChange' instead.");
|
|
24
23
|
const { FieldErrorView, fieldPropsContext, wrapperProps, controlProps, FieldErrorCaptureContext, skeletonProps } = useFieldComponent(props, "Select");
|
|
25
|
-
const rootClassName = clsx(
|
|
24
|
+
const rootClassName = clsx(wrapperProps.className, Select_module_default.select, className);
|
|
26
25
|
const propsContext = {
|
|
27
26
|
Option: { tunnel: getOptionsTunnelProps("Select") },
|
|
28
27
|
...fieldPropsContext
|
|
@@ -33,7 +32,7 @@ var Select = flowComponent("Select", (props) => {
|
|
|
33
32
|
...rest,
|
|
34
33
|
...controlProps,
|
|
35
34
|
...skeletonProps,
|
|
36
|
-
className:
|
|
35
|
+
className: rootClassName,
|
|
37
36
|
onChange: (value) => {
|
|
38
37
|
if (!isReadOnly) {
|
|
39
38
|
onChange?.(value);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.mjs","names":["styles"
|
|
1
|
+
{"version":3,"file":"Select.mjs","names":["styles"],"sources":["../../../../../../../src/components/Select/Select.tsx"],"sourcesContent":["import { type PropsWithChildren } from \"react\";\nimport type { Key } from \"react-aria-components\";\nimport * as Aria from \"react-aria-components\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport styles from \"./Select.module.scss\";\nimport clsx from \"clsx\";\nimport { IconChevronDown } from \"@/components/Icon/components/icons\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Options } from \"@/components/Options\";\nimport { getOptionsTunnelProps } from \"@/components/Option/optionsTunnel\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\n\nexport interface SelectProps\n extends\n PropsWithChildren<\n Omit<\n Aria.SelectProps<string, \"single\" | \"multiple\">,\n \"children\" | \"className\" | \"ref\"\n >\n >,\n FlowComponentProps<HTMLButtonElement>,\n PropsWithClassName {\n /** Handler that is called when the selected value changes. */\n onChange?: (value: Key | Key[] | null) => void;\n /** @deprecated Use `onChange` instead. */\n onSelectionChange?: (value: Key | Key[] | null) => void;\n /** Whether the component is read only. */\n isReadOnly?: boolean;\n}\n\n/** @flr-generate all */\nexport const Select = flowComponent(\"Select\", (props) => {\n const {\n children,\n className,\n onChange,\n onSelectionChange,\n isReadOnly,\n ref,\n ...rest\n } = props;\n\n const warnDeprecation = useWarnDeprecation();\n if (onSelectionChange !== undefined) {\n warnDeprecation(\n \"The 'onSelectionChange' prop is deprecated and will be removed in a future release. Use 'onChange' instead.\",\n );\n }\n\n const {\n FieldErrorView,\n fieldPropsContext,\n wrapperProps,\n controlProps,\n FieldErrorCaptureContext,\n skeletonProps,\n } = useFieldComponent(props, \"Select\");\n\n const rootClassName = clsx(wrapperProps.className, styles.select, className);\n\n const propsContext: PropsContext = {\n Option: {\n tunnel: getOptionsTunnelProps(\"Select\"),\n },\n ...fieldPropsContext,\n };\n\n const controller = useOverlayController(\"Select\", {\n reuseControllerFromContext: false,\n });\n const isOpen = controller.useIsOpen();\n\n return (\n <Aria.Select\n {...rest}\n {...controlProps}\n {...skeletonProps}\n className={rootClassName}\n onChange={(value) => {\n if (!isReadOnly) {\n onChange?.(value);\n onSelectionChange?.(value);\n }\n }}\n onOpenChange={(isOpen) => !isReadOnly && controller.setOpen(isOpen)}\n isOpen={isOpen}\n data-readonly={isReadOnly}\n >\n <FieldErrorCaptureContext>\n <PropsContextProvider props={propsContext}>\n <Aria.Button\n data-readonly={isReadOnly}\n className={styles.toggle}\n ref={ref}\n >\n <Aria.SelectValue>\n {({ selectedText, isPlaceholder }) =>\n isPlaceholder || !selectedText ? undefined : selectedText\n }\n </Aria.SelectValue>\n <IconChevronDown />\n </Aria.Button>\n {children}\n <Options controller={controller}>\n <UiComponentTunnelExit id=\"options\" component=\"Select\" />\n </Options>\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </Aria.Select>\n );\n});\n\nexport default Select;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAqCA,IAAa,SAAS,cAAc,WAAW,UAAU;CACvD,MAAM,EACJ,UACA,WACA,UACA,mBACA,YACA,KACA,GAAG,SACD;CAEJ,MAAM,kBAAkB,mBAAmB;CAC3C,IAAI,sBAAsB,KAAA,GACxB,gBACE,6GACF;CAGF,MAAM,EACJ,gBACA,mBACA,cACA,cACA,0BACA,kBACE,kBAAkB,OAAO,QAAQ;CAErC,MAAM,gBAAgB,KAAK,aAAa,WAAWA,sBAAO,QAAQ,SAAS;CAE3E,MAAM,eAA6B;EACjC,QAAQ,EACN,QAAQ,sBAAsB,QAAQ,EACxC;EACA,GAAG;CACL;CAEA,MAAM,aAAa,qBAAqB,UAAU,EAChD,4BAA4B,MAC9B,CAAC;CACD,MAAM,SAAS,WAAW,UAAU;CAEpC,OACE,qBAAC,KAAK,QAAN;EACE,GAAI;EACJ,GAAI;EACJ,GAAI;EACJ,WAAW;EACX,WAAW,UAAU;GACnB,IAAI,CAAC,YAAY;IACf,WAAW,KAAK;IAChB,oBAAoB,KAAK;GAC3B;EACF;EACA,eAAe,WAAW,CAAC,cAAc,WAAW,QAAQ,MAAM;EAC1D;EACR,iBAAe;EAbjB,UAAA,CAeE,oBAAC,0BAAD,EAAA,UACE,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA;IACE,qBAAC,KAAK,QAAN;KACE,iBAAe;KACf,WAAWA,sBAAO;KACb;KAHP,UAAA,CAKE,oBAAC,KAAK,aAAN,EAAA,WACI,EAAE,cAAc,oBAChB,iBAAiB,CAAC,eAAe,KAAA,IAAY,aAE/B,CAAA,GAClB,oBAAC,iBAAD,CAAkB,CAAA,CACP;;IACZ;IACD,oBAAC,SAAD;KAAqB;KACnB,UAAA,oBAAC,uBAAD;MAAuB,IAAG;MAAU,WAAU;KAAU,CAAA;IACjD,CAAA;GACW;EACE,CAAA,EAAA,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACN;;AAEjB,CAAC"}
|
|
@@ -1,19 +1,20 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
3
|
import SkeletonText_module_default from "./SkeletonText.module.mjs";
|
|
4
|
+
import clsx from "clsx";
|
|
4
5
|
import { jsx } from "react/jsx-runtime";
|
|
5
6
|
//#region src/components/SkeletonText/SkeletonText.tsx
|
|
6
7
|
/** @flr-generate all */
|
|
7
8
|
var SkeletonText = (props) => {
|
|
8
|
-
const { width, style = {}, ...rest } = props;
|
|
9
|
+
const { width, style = {}, className, ...rest } = props;
|
|
9
10
|
return /* @__PURE__ */ jsx("span", {
|
|
10
11
|
"aria-hidden": true,
|
|
11
|
-
className: SkeletonText_module_default.skeletonText,
|
|
12
12
|
style: {
|
|
13
13
|
width,
|
|
14
14
|
...style
|
|
15
15
|
},
|
|
16
|
-
...rest
|
|
16
|
+
...rest,
|
|
17
|
+
className: clsx(SkeletonText_module_default.skeletonText, className)
|
|
17
18
|
});
|
|
18
19
|
};
|
|
19
20
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SkeletonText.mjs","names":["styles"],"sources":["../../../../../../../src/components/SkeletonText/SkeletonText.tsx"],"sourcesContent":["import type { ComponentProps, CSSProperties, FC } from \"react\";\nimport styles from \"./SkeletonText.module.scss\";\n\nexport interface SkeletonTextProps extends ComponentProps<\"span\"> {\n /** The width of the skeleton text. */\n width?: CSSProperties[\"width\"];\n}\n\n/** @flr-generate all */\nexport const SkeletonText: FC<SkeletonTextProps> = (props) => {\n const { width, style = {}, ...rest } = props;\n return (\n <span\n aria-hidden\n
|
|
1
|
+
{"version":3,"file":"SkeletonText.mjs","names":["styles"],"sources":["../../../../../../../src/components/SkeletonText/SkeletonText.tsx"],"sourcesContent":["import type { ComponentProps, CSSProperties, FC } from \"react\";\nimport clsx from \"clsx\";\nimport styles from \"./SkeletonText.module.scss\";\n\nexport interface SkeletonTextProps extends ComponentProps<\"span\"> {\n /** The width of the skeleton text. */\n width?: CSSProperties[\"width\"];\n}\n\n/** @flr-generate all */\nexport const SkeletonText: FC<SkeletonTextProps> = (props) => {\n const { width, style = {}, className, ...rest } = props;\n return (\n <span\n aria-hidden\n style={{ width, ...style }}\n {...rest}\n className={clsx(styles.skeletonText, className)}\n />\n );\n};\n\nexport default SkeletonText;\n"],"mappings":";;;;;;;AAUA,IAAa,gBAAuC,UAAU;CAC5D,MAAM,EAAE,OAAO,QAAQ,CAAC,GAAG,WAAW,GAAG,SAAS;CAClD,OACE,oBAAC,QAAD;EACE,eAAA;EACA,OAAO;GAAE;GAAO,GAAG;EAAM;EACzB,GAAI;EACJ,WAAW,KAAKA,4BAAO,cAAc,SAAS;CAC/C,CAAA;AAEL"}
|
|
@@ -34,6 +34,52 @@ var Slider = flowComponent("Slider", (props) => {
|
|
|
34
34
|
className: Slider_module_default.label
|
|
35
35
|
}
|
|
36
36
|
};
|
|
37
|
+
const trackPropsContext = { Button: {
|
|
38
|
+
isPending: false,
|
|
39
|
+
isFailed: false,
|
|
40
|
+
isSucceeded: false,
|
|
41
|
+
isReadOnly,
|
|
42
|
+
excludeFromTabOrder: true,
|
|
43
|
+
isDisabled,
|
|
44
|
+
variant: "plain",
|
|
45
|
+
color: "secondary",
|
|
46
|
+
size: "s"
|
|
47
|
+
} };
|
|
48
|
+
const renderTrack = ({ state }) => {
|
|
49
|
+
const stepButtons = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Button, {
|
|
50
|
+
onPress: () => state.decrementThumb(0, step),
|
|
51
|
+
"aria-label": stringFormatter.format("decrement"),
|
|
52
|
+
className: Slider_module_default.decrement,
|
|
53
|
+
children: /* @__PURE__ */ jsx(IconMinus, {})
|
|
54
|
+
}), /* @__PURE__ */ jsx(Button, {
|
|
55
|
+
onPress: () => state.incrementThumb(0, step),
|
|
56
|
+
"aria-label": stringFormatter.format("increment"),
|
|
57
|
+
className: Slider_module_default.increment,
|
|
58
|
+
children: /* @__PURE__ */ jsx(IconPlus, {})
|
|
59
|
+
})] });
|
|
60
|
+
const initialMarker = showInitialMarker && typeof defaultValue === "number" && /* @__PURE__ */ jsx("div", {
|
|
61
|
+
className: Slider_module_default.initialMarker,
|
|
62
|
+
style: { "--slider--initial-value": state.getValuePercent(defaultValue) }
|
|
63
|
+
});
|
|
64
|
+
return /* @__PURE__ */ jsxs(PropsContextProvider, {
|
|
65
|
+
props: trackPropsContext,
|
|
66
|
+
children: [
|
|
67
|
+
!sliderOnly && stepButtons,
|
|
68
|
+
/* @__PURE__ */ jsx("div", {
|
|
69
|
+
className: Slider_module_default.fill,
|
|
70
|
+
style: { "--slider--value": state.getThumbPercent(0) }
|
|
71
|
+
}),
|
|
72
|
+
initialMarker,
|
|
73
|
+
/* @__PURE__ */ jsx(Aria.SliderThumb, {
|
|
74
|
+
inputRef: objectRef,
|
|
75
|
+
"aria-describedby": controlProps["aria-describedby"],
|
|
76
|
+
name,
|
|
77
|
+
className: Slider_module_default.handle,
|
|
78
|
+
isDisabled: isReadOnly
|
|
79
|
+
})
|
|
80
|
+
]
|
|
81
|
+
});
|
|
82
|
+
};
|
|
37
83
|
return /* @__PURE__ */ jsx("div", {
|
|
38
84
|
...skeletonProps,
|
|
39
85
|
className: wrapperProps.className,
|
|
@@ -66,47 +112,7 @@ var Slider = flowComponent("Slider", (props) => {
|
|
|
66
112
|
}),
|
|
67
113
|
/* @__PURE__ */ jsx(Aria.SliderTrack, {
|
|
68
114
|
className: Slider_module_default.track,
|
|
69
|
-
children:
|
|
70
|
-
props: { Button: {
|
|
71
|
-
isPending: false,
|
|
72
|
-
isFailed: false,
|
|
73
|
-
isSucceeded: false,
|
|
74
|
-
isReadOnly,
|
|
75
|
-
excludeFromTabOrder: true,
|
|
76
|
-
isDisabled,
|
|
77
|
-
variant: "plain",
|
|
78
|
-
color: "secondary",
|
|
79
|
-
size: "s"
|
|
80
|
-
} },
|
|
81
|
-
children: [
|
|
82
|
-
!sliderOnly && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Button, {
|
|
83
|
-
onPress: () => state.decrementThumb(0, step),
|
|
84
|
-
"aria-label": stringFormatter.format("decrement"),
|
|
85
|
-
className: Slider_module_default.decrement,
|
|
86
|
-
children: /* @__PURE__ */ jsx(IconMinus, {})
|
|
87
|
-
}), /* @__PURE__ */ jsx(Button, {
|
|
88
|
-
onPress: () => state.incrementThumb(0, step),
|
|
89
|
-
"aria-label": stringFormatter.format("increment"),
|
|
90
|
-
className: Slider_module_default.increment,
|
|
91
|
-
children: /* @__PURE__ */ jsx(IconPlus, {})
|
|
92
|
-
})] }),
|
|
93
|
-
/* @__PURE__ */ jsx("div", {
|
|
94
|
-
className: Slider_module_default.fill,
|
|
95
|
-
style: { "--slider--value": state.getThumbPercent(0) }
|
|
96
|
-
}),
|
|
97
|
-
showInitialMarker && defaultValue && typeof defaultValue === "number" && /* @__PURE__ */ jsx("div", {
|
|
98
|
-
className: Slider_module_default.initialMarker,
|
|
99
|
-
style: { "--slider--initial-value": state.getValuePercent(defaultValue) }
|
|
100
|
-
}),
|
|
101
|
-
/* @__PURE__ */ jsx(Aria.SliderThumb, {
|
|
102
|
-
inputRef: objectRef,
|
|
103
|
-
"aria-describedby": controlProps["aria-describedby"],
|
|
104
|
-
name,
|
|
105
|
-
className: Slider_module_default.handle,
|
|
106
|
-
isDisabled: isReadOnly
|
|
107
|
-
})
|
|
108
|
-
]
|
|
109
|
-
})
|
|
115
|
+
children: renderTrack
|
|
110
116
|
}),
|
|
111
117
|
/* @__PURE__ */ jsx(FieldErrorView, {})
|
|
112
118
|
]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slider.mjs","names":["styles","locales","_Fragment"],"sources":["../../../../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport styles from \"./Slider.module.scss\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { Button } from \"@/components/Button\";\nimport { IconMinus, IconPlus } from \"@/components/Icon/components/icons\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\nimport { SkeletonTextContent } from \"@/components/SkeletonMode/components/SkeletonTextContent\";\n\nexport interface SliderProps\n extends\n FlowComponentProps<HTMLInputElement>,\n PropsWithChildren<Aria.SliderProps>,\n Pick<Aria.SliderThumbProps, \"name\"> {\n /** Whether the marker for the initial value should be visible */\n showInitialMarker?: boolean;\n /** Whether the component is read only. */\n isReadOnly?: boolean;\n /** Whether the component is invalid. */\n isInvalid?: boolean;\n /** Hide Buttons, Label and Value */\n sliderOnly?: boolean;\n}\n\n/** @flr-generate all */\nexport const Slider = flowComponent(\"Slider\", (props) => {\n const {\n className,\n children,\n name,\n isDisabled,\n defaultValue,\n showInitialMarker,\n isReadOnly,\n ref,\n step,\n sliderOnly,\n // Reaches the thumb through `controlProps` – react-aria would add it a\n // second time from the slider.\n \"aria-describedby\": ignoredAriaDescribedBy,\n ...rest\n } = props;\n\n const rootClassName = clsx(\n styles.slider,\n isDisabled && styles.disabled,\n className,\n );\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldPropsContext,\n wrapperProps,\n controlProps,\n skeletonProps,\n } = useFieldComponent(props, \"Slider\");\n\n const stringFormatter = useLocalizedStringFormatter(locales, \"Slider\");\n\n const objectRef = useObjectRef(ref);\n\n const propsContext: PropsContext = {\n ...fieldPropsContext,\n Label: {\n tunnel: {\n id: \"label\",\n component: \"Slider\",\n },\n ...fieldPropsContext.Label,\n className: styles.label,\n },\n };\n\n
|
|
1
|
+
{"version":3,"file":"Slider.mjs","names":["styles","locales","_Fragment"],"sources":["../../../../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport styles from \"./Slider.module.scss\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { Button } from \"@/components/Button\";\nimport { IconMinus, IconPlus } from \"@/components/Icon/components/icons\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\nimport { SkeletonTextContent } from \"@/components/SkeletonMode/components/SkeletonTextContent\";\n\nexport interface SliderProps\n extends\n FlowComponentProps<HTMLInputElement>,\n PropsWithChildren<Aria.SliderProps>,\n Pick<Aria.SliderThumbProps, \"name\"> {\n /** Whether the marker for the initial value should be visible */\n showInitialMarker?: boolean;\n /** Whether the component is read only. */\n isReadOnly?: boolean;\n /** Whether the component is invalid. */\n isInvalid?: boolean;\n /** Hide Buttons, Label and Value */\n sliderOnly?: boolean;\n}\n\n/** @flr-generate all */\nexport const Slider = flowComponent(\"Slider\", (props) => {\n const {\n className,\n children,\n name,\n isDisabled,\n defaultValue,\n showInitialMarker,\n isReadOnly,\n ref,\n step,\n sliderOnly,\n // Reaches the thumb through `controlProps` – react-aria would add it a\n // second time from the slider.\n \"aria-describedby\": ignoredAriaDescribedBy,\n ...rest\n } = props;\n\n const rootClassName = clsx(\n styles.slider,\n isDisabled && styles.disabled,\n className,\n );\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldPropsContext,\n wrapperProps,\n controlProps,\n skeletonProps,\n } = useFieldComponent(props, \"Slider\");\n\n const stringFormatter = useLocalizedStringFormatter(locales, \"Slider\");\n\n const objectRef = useObjectRef(ref);\n\n const propsContext: PropsContext = {\n ...fieldPropsContext,\n Label: {\n tunnel: {\n id: \"label\",\n component: \"Slider\",\n },\n ...fieldPropsContext.Label,\n className: styles.label,\n },\n };\n\n const trackPropsContext: PropsContext = {\n Button: {\n isPending: false,\n isFailed: false,\n isSucceeded: false,\n isReadOnly: isReadOnly,\n excludeFromTabOrder: true,\n isDisabled,\n variant: \"plain\",\n color: \"secondary\",\n size: \"s\",\n },\n };\n\n const renderTrack = ({ state }: Aria.SliderTrackRenderProps) => {\n const stepButtons = (\n <>\n <Button\n onPress={() => state.decrementThumb(0, step)}\n aria-label={stringFormatter.format(\"decrement\")}\n className={styles.decrement}\n >\n <IconMinus />\n </Button>\n <Button\n onPress={() => state.incrementThumb(0, step)}\n aria-label={stringFormatter.format(\"increment\")}\n className={styles.increment}\n >\n <IconPlus />\n </Button>\n </>\n );\n\n const initialMarker = showInitialMarker &&\n typeof defaultValue === \"number\" && (\n <div\n className={styles.initialMarker}\n style={{\n \"--slider--initial-value\": state.getValuePercent(defaultValue),\n }}\n />\n );\n\n return (\n <PropsContextProvider props={trackPropsContext}>\n {!sliderOnly && stepButtons}\n\n <div\n className={styles.fill}\n style={{\n \"--slider--value\": state.getThumbPercent(0),\n }}\n />\n\n {initialMarker}\n <Aria.SliderThumb\n inputRef={objectRef}\n aria-describedby={controlProps[\"aria-describedby\"]}\n name={name}\n className={styles.handle}\n isDisabled={isReadOnly}\n />\n </PropsContextProvider>\n );\n };\n\n return (\n <div {...skeletonProps} className={wrapperProps.className}>\n <Aria.Slider\n {...rest}\n className={rootClassName}\n isDisabled={isDisabled}\n defaultValue={defaultValue}\n step={step}\n >\n <PropsContextProvider props={propsContext}>\n <FieldErrorCaptureContext>{children}</FieldErrorCaptureContext>\n\n {!sliderOnly && (\n <div className={styles.text}>\n <Aria.SliderOutput className={styles.value}>\n {({ defaultChildren }) => (\n <SkeletonTextContent defaultWidth=\"2em\">\n {defaultChildren}\n </SkeletonTextContent>\n )}\n </Aria.SliderOutput>{\" \"}\n <UiComponentTunnelExit id=\"label\" component=\"Slider\" />\n </div>\n )}\n\n <Aria.SliderTrack className={styles.track}>\n {renderTrack}\n </Aria.SliderTrack>\n <FieldErrorView />\n </PropsContextProvider>\n </Aria.Slider>\n </div>\n );\n});\n\nexport default Slider;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAiCA,IAAa,SAAS,cAAc,WAAW,UAAU;CACvD,MAAM,EACJ,WACA,UACA,MACA,YACA,cACA,mBACA,YACA,KACA,MACA,YAGA,oBAAoB,wBACpB,GAAG,SACD;CAEJ,MAAM,gBAAgB,KACpBA,sBAAO,QACP,cAAcA,sBAAO,UACrB,SACF;CAEA,MAAM,EACJ,gBACA,0BACA,mBACA,cACA,cACA,kBACE,kBAAkB,OAAO,QAAQ;CAErC,MAAM,kBAAkB,4BAA4BC,kBAAS,QAAQ;CAErE,MAAM,YAAY,aAAa,GAAG;CAElC,MAAM,eAA6B;EACjC,GAAG;EACH,OAAO;GACL,QAAQ;IACN,IAAI;IACJ,WAAW;GACb;GACA,GAAG,kBAAkB;GACrB,WAAWD,sBAAO;EACpB;CACF;CAEA,MAAM,oBAAkC,EACtC,QAAQ;EACN,WAAW;EACX,UAAU;EACV,aAAa;EACD;EACZ,qBAAqB;EACrB;EACA,SAAS;EACT,OAAO;EACP,MAAM;CACR,EACF;CAEA,MAAM,eAAe,EAAE,YAAyC;EAC9D,MAAM,cACJ,qBAAAE,UAAA,EAAA,UAAA,CACE,oBAAC,QAAD;GACE,eAAe,MAAM,eAAe,GAAG,IAAI;GAC3C,cAAY,gBAAgB,OAAO,WAAW;GAC9C,WAAWF,sBAAO;GAElB,UAAA,oBAAC,WAAD,CAAY,CAAA;EACN,CAAA,GACR,oBAAC,QAAD;GACE,eAAe,MAAM,eAAe,GAAG,IAAI;GAC3C,cAAY,gBAAgB,OAAO,WAAW;GAC9C,WAAWA,sBAAO;GAElB,UAAA,oBAAC,UAAD,CAAW,CAAA;EACL,CAAA,CACR,EAAA,CAAA;EAGJ,MAAM,gBAAgB,qBACpB,OAAO,iBAAiB,YACtB,oBAAC,OAAD;GACE,WAAWA,sBAAO;GAClB,OAAO,EACL,2BAA2B,MAAM,gBAAgB,YAAY,EAC/D;EACD,CAAA;EAGL,OACE,qBAAC,sBAAD;GAAsB,OAAO;GAA7B,UAAA;IACG,CAAC,cAAc;IAEhB,oBAAC,OAAD;KACE,WAAWA,sBAAO;KAClB,OAAO,EACL,mBAAmB,MAAM,gBAAgB,CAAC,EAC5C;IACD,CAAA;IAEA;IACD,oBAAC,KAAK,aAAN;KACE,UAAU;KACV,oBAAkB,aAAa;KACzB;KACN,WAAWA,sBAAO;KAClB,YAAY;IACb,CAAA;GACmB;;CAE1B;CAEA,OACE,oBAAC,OAAD;EAAK,GAAI;EAAe,WAAW,aAAa;EAC9C,UAAA,oBAAC,KAAK,QAAN;GACE,GAAI;GACJ,WAAW;GACC;GACE;GACR;GAEN,UAAA,qBAAC,sBAAD;IAAsB,OAAO;IAA7B,UAAA;KACE,oBAAC,0BAAD,EAA2B,SAAmC,CAAA;KAE7D,CAAC,cACA,qBAAC,OAAD;MAAK,WAAWA,sBAAO;MAAvB,UAAA;OACE,oBAAC,KAAK,cAAN;QAAmB,WAAWA,sBAAO;QACjC,WAAA,EAAE,sBACF,oBAAC,qBAAD;SAAqB,cAAa;SAC/B,UAAA;QACkB,CAAA;OAEN,CAAA;OAAE;OACrB,oBAAC,uBAAD;QAAuB,IAAG;QAAQ,WAAU;OAAU,CAAA;MACnD;;KAGP,oBAAC,KAAK,aAAN;MAAkB,WAAWA,sBAAO;MACjC,UAAA;KACe,CAAA;KAClB,oBAAC,gBAAD,CAAiB,CAAA;IACG;;EACX,CAAA;CACV,CAAA;AAET,CAAC"}
|