@mantine/core 9.0.0 → 9.0.2
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/cjs/components/Accordion/Accordion.cjs.map +1 -1
- package/cjs/components/Accordion/Accordion.module.cjs.map +1 -1
- package/cjs/components/ActionIcon/ActionIcon.cjs.map +1 -1
- package/cjs/components/Affix/Affix.cjs.map +1 -1
- package/cjs/components/Alert/Alert.cjs.map +1 -1
- package/cjs/components/Anchor/Anchor.cjs.map +1 -1
- package/cjs/components/AngleSlider/AngleSlider.cjs.map +1 -1
- package/cjs/components/AppShell/AppShell.cjs.map +1 -1
- package/cjs/components/AspectRatio/AspectRatio.cjs.map +1 -1
- package/cjs/components/Autocomplete/Autocomplete.cjs +1 -1
- package/cjs/components/Autocomplete/Autocomplete.cjs.map +1 -1
- package/cjs/components/Avatar/Avatar.cjs.map +1 -1
- package/cjs/components/BackgroundImage/BackgroundImage.cjs.map +1 -1
- package/cjs/components/Badge/Badge.cjs.map +1 -1
- package/cjs/components/Badge/Badge.module.cjs.map +1 -1
- package/cjs/components/Blockquote/Blockquote.cjs.map +1 -1
- package/cjs/components/Breadcrumbs/Breadcrumbs.cjs.map +1 -1
- package/cjs/components/Burger/Burger.cjs.map +1 -1
- package/cjs/components/Button/Button.cjs.map +1 -1
- package/cjs/components/Card/Card.cjs.map +1 -1
- package/cjs/components/Center/Center.cjs.map +1 -1
- package/cjs/components/Checkbox/Checkbox.cjs.map +1 -1
- package/cjs/components/Checkbox/CheckboxGroup/CheckboxGroup.cjs.map +1 -1
- package/cjs/components/Chip/Chip.cjs.map +1 -1
- package/cjs/components/Chip/ChipGroup/ChipGroup.cjs.map +1 -1
- package/cjs/components/CloseButton/CloseButton.cjs.map +1 -1
- package/cjs/components/Code/Code.cjs.map +1 -1
- package/cjs/components/Collapse/Collapse.cjs.map +1 -1
- package/cjs/components/ColorInput/ColorInput.cjs.map +1 -1
- package/cjs/components/ColorPicker/AlphaSlider/AlphaSlider.cjs.map +1 -1
- package/cjs/components/ColorPicker/ColorPicker.cjs.map +1 -1
- package/cjs/components/ColorPicker/HueSlider/HueSlider.cjs.map +1 -1
- package/cjs/components/ColorSwatch/ColorSwatch.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxTarget/ComboboxTarget.cjs +1 -0
- package/cjs/components/Combobox/ComboboxTarget/ComboboxTarget.cjs.map +1 -1
- package/cjs/components/Combobox/use-combobox-target-props/use-combobox-target-props.cjs.map +1 -1
- package/cjs/components/Container/Container.cjs.map +1 -1
- package/cjs/components/Dialog/Dialog.cjs.map +1 -1
- package/cjs/components/Divider/Divider.cjs.map +1 -1
- package/cjs/components/Fieldset/Fieldset.cjs.map +1 -1
- package/cjs/components/FileButton/FileButton.cjs.map +1 -1
- package/cjs/components/FileInput/FileInput.cjs.map +1 -1
- package/cjs/components/Flex/Flex.cjs.map +1 -1
- package/cjs/components/FloatingIndicator/FloatingIndicator.cjs.map +1 -1
- package/cjs/components/FloatingWindow/FloatingWindow.cjs.map +1 -1
- package/cjs/components/Grid/Grid.cjs.map +1 -1
- package/cjs/components/Group/Group.cjs.map +1 -1
- package/cjs/components/Highlight/Highlight.cjs.map +1 -1
- package/cjs/components/Image/Image.cjs.map +1 -1
- package/cjs/components/Indicator/Indicator.cjs.map +1 -1
- package/cjs/components/Input/Input.cjs +3 -2
- package/cjs/components/Input/Input.cjs.map +1 -1
- package/cjs/components/InputBase/InputBase.cjs.map +1 -1
- package/cjs/components/JsonInput/JsonInput.cjs.map +1 -1
- package/cjs/components/Kbd/Kbd.cjs.map +1 -1
- package/cjs/components/List/List.cjs.map +1 -1
- package/cjs/components/Loader/Loader.cjs.map +1 -1
- package/cjs/components/LoadingOverlay/LoadingOverlay.cjs +1 -0
- package/cjs/components/LoadingOverlay/LoadingOverlay.cjs.map +1 -1
- package/cjs/components/Mark/Mark.cjs.map +1 -1
- package/cjs/components/Marquee/Marquee.cjs.map +1 -1
- package/cjs/components/Menu/Menu.cjs.map +1 -1
- package/cjs/components/Modal/Modal.cjs.map +1 -1
- package/cjs/components/MultiSelect/MultiSelect.cjs +3 -1
- package/cjs/components/MultiSelect/MultiSelect.cjs.map +1 -1
- package/cjs/components/NativeSelect/NativeSelect.cjs +4 -1
- package/cjs/components/NativeSelect/NativeSelect.cjs.map +1 -1
- package/cjs/components/NavLink/NavLink.cjs.map +1 -1
- package/cjs/components/Notification/Notification.cjs.map +1 -1
- package/cjs/components/NumberInput/NumberInput.cjs +1 -0
- package/cjs/components/NumberInput/NumberInput.cjs.map +1 -1
- package/cjs/components/OverflowList/OverflowList.cjs.map +1 -1
- package/cjs/components/Overlay/Overlay.cjs.map +1 -1
- package/cjs/components/Pagination/Pagination.cjs.map +1 -1
- package/cjs/components/Paper/Paper.cjs.map +1 -1
- package/cjs/components/PasswordInput/PasswordInput.cjs +4 -1
- package/cjs/components/PasswordInput/PasswordInput.cjs.map +1 -1
- package/cjs/components/Pill/Pill.cjs.map +1 -1
- package/cjs/components/PillsInput/PillsInput.cjs.map +1 -1
- package/cjs/components/PinInput/PinInput.cjs.map +1 -1
- package/cjs/components/Popover/Popover.cjs +9 -0
- package/cjs/components/Popover/Popover.cjs.map +1 -1
- package/cjs/components/Portal/OptionalPortal.cjs.map +1 -1
- package/cjs/components/Portal/Portal.cjs.map +1 -1
- package/cjs/components/Progress/Progress.cjs.map +1 -1
- package/cjs/components/Radio/Radio.cjs.map +1 -1
- package/cjs/components/Radio/RadioGroup/RadioGroup.cjs.map +1 -1
- package/cjs/components/Rating/Rating.cjs.map +1 -1
- package/cjs/components/RingProgress/RingProgress.cjs +1 -0
- package/cjs/components/RingProgress/RingProgress.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollArea.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.cjs.map +1 -1
- package/cjs/components/Scroller/Scroller.cjs.map +1 -1
- package/cjs/components/SegmentedControl/SegmentedControl.cjs.map +1 -1
- package/cjs/components/Select/Select.cjs +1 -0
- package/cjs/components/Select/Select.cjs.map +1 -1
- package/cjs/components/SemiCircleProgress/SemiCircleProgress.cjs +1 -2
- package/cjs/components/SemiCircleProgress/SemiCircleProgress.cjs.map +1 -1
- package/cjs/components/SimpleGrid/SimpleGrid.cjs.map +1 -1
- package/cjs/components/Skeleton/Skeleton.cjs.map +1 -1
- package/cjs/components/Slider/RangeSlider/RangeSlider.cjs.map +1 -1
- package/cjs/components/Slider/Slider/Slider.cjs.map +1 -1
- package/cjs/components/Slider/Slider.module.cjs.map +1 -1
- package/cjs/components/Space/Space.cjs.map +1 -1
- package/cjs/components/Spoiler/Spoiler.cjs.map +1 -1
- package/cjs/components/Stack/Stack.cjs.map +1 -1
- package/cjs/components/Stepper/Stepper.cjs.map +1 -1
- package/cjs/components/Switch/Switch.cjs.map +1 -1
- package/cjs/components/Switch/SwitchGroup/SwitchGroup.cjs.map +1 -1
- package/cjs/components/Table/Table.cjs.map +1 -1
- package/cjs/components/TableOfContents/TableOfContents.cjs.map +1 -1
- package/cjs/components/Tabs/Tabs.cjs.map +1 -1
- package/cjs/components/TagsInput/TagsInput.cjs +3 -1
- package/cjs/components/TagsInput/TagsInput.cjs.map +1 -1
- package/cjs/components/Text/Text.cjs.map +1 -1
- package/cjs/components/TextInput/TextInput.cjs.map +1 -1
- package/cjs/components/Textarea/Autosize.cjs +1 -0
- package/cjs/components/Textarea/Autosize.cjs.map +1 -1
- package/cjs/components/Textarea/Textarea.cjs.map +1 -1
- package/cjs/components/ThemeIcon/ThemeIcon.cjs.map +1 -1
- package/cjs/components/Timeline/Timeline.cjs.map +1 -1
- package/cjs/components/Title/Title.cjs.map +1 -1
- package/cjs/components/Tooltip/Tooltip.cjs.map +1 -1
- package/cjs/components/Tree/Tree.cjs.map +1 -1
- package/cjs/components/Typography/Typography.cjs.map +1 -1
- package/cjs/components/UnstyledButton/UnstyledButton.cjs.map +1 -1
- package/cjs/components/VisuallyHidden/VisuallyHidden.cjs.map +1 -1
- package/cjs/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.cjs +3 -4
- package/cjs/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.cjs.map +1 -1
- package/cjs/core/MantineProvider/color-scheme-managers/local-storage-manager.cjs.map +1 -1
- package/cjs/core/utils/find-element-ancestor/find-element-ancestor.cjs.map +1 -1
- package/esm/components/Accordion/Accordion.mjs.map +1 -1
- package/esm/components/Accordion/Accordion.module.mjs.map +1 -1
- package/esm/components/ActionIcon/ActionIcon.mjs.map +1 -1
- package/esm/components/Affix/Affix.mjs.map +1 -1
- package/esm/components/Alert/Alert.mjs.map +1 -1
- package/esm/components/Anchor/Anchor.mjs.map +1 -1
- package/esm/components/AngleSlider/AngleSlider.mjs.map +1 -1
- package/esm/components/AppShell/AppShell.mjs.map +1 -1
- package/esm/components/AspectRatio/AspectRatio.mjs.map +1 -1
- package/esm/components/Autocomplete/Autocomplete.mjs +1 -1
- package/esm/components/Autocomplete/Autocomplete.mjs.map +1 -1
- package/esm/components/Avatar/Avatar.mjs.map +1 -1
- package/esm/components/BackgroundImage/BackgroundImage.mjs.map +1 -1
- package/esm/components/Badge/Badge.mjs.map +1 -1
- package/esm/components/Badge/Badge.module.mjs.map +1 -1
- package/esm/components/Blockquote/Blockquote.mjs.map +1 -1
- package/esm/components/Breadcrumbs/Breadcrumbs.mjs.map +1 -1
- package/esm/components/Burger/Burger.mjs.map +1 -1
- package/esm/components/Button/Button.mjs.map +1 -1
- package/esm/components/Card/Card.mjs.map +1 -1
- package/esm/components/Center/Center.mjs.map +1 -1
- package/esm/components/Checkbox/Checkbox.mjs.map +1 -1
- package/esm/components/Checkbox/CheckboxGroup/CheckboxGroup.mjs.map +1 -1
- package/esm/components/Chip/Chip.mjs.map +1 -1
- package/esm/components/Chip/ChipGroup/ChipGroup.mjs.map +1 -1
- package/esm/components/CloseButton/CloseButton.mjs.map +1 -1
- package/esm/components/Code/Code.mjs.map +1 -1
- package/esm/components/Collapse/Collapse.mjs.map +1 -1
- package/esm/components/ColorInput/ColorInput.mjs.map +1 -1
- package/esm/components/ColorPicker/AlphaSlider/AlphaSlider.mjs.map +1 -1
- package/esm/components/ColorPicker/ColorPicker.mjs.map +1 -1
- package/esm/components/ColorPicker/HueSlider/HueSlider.mjs.map +1 -1
- package/esm/components/ColorSwatch/ColorSwatch.mjs.map +1 -1
- package/esm/components/Combobox/ComboboxTarget/ComboboxTarget.mjs +1 -0
- package/esm/components/Combobox/ComboboxTarget/ComboboxTarget.mjs.map +1 -1
- package/esm/components/Combobox/use-combobox-target-props/use-combobox-target-props.mjs.map +1 -1
- package/esm/components/Container/Container.mjs.map +1 -1
- package/esm/components/Dialog/Dialog.mjs.map +1 -1
- package/esm/components/Divider/Divider.mjs.map +1 -1
- package/esm/components/Fieldset/Fieldset.mjs.map +1 -1
- package/esm/components/FileButton/FileButton.mjs.map +1 -1
- package/esm/components/FileInput/FileInput.mjs.map +1 -1
- package/esm/components/Flex/Flex.mjs.map +1 -1
- package/esm/components/FloatingIndicator/FloatingIndicator.mjs.map +1 -1
- package/esm/components/FloatingWindow/FloatingWindow.mjs.map +1 -1
- package/esm/components/Grid/Grid.mjs.map +1 -1
- package/esm/components/Group/Group.mjs.map +1 -1
- package/esm/components/Highlight/Highlight.mjs.map +1 -1
- package/esm/components/Image/Image.mjs.map +1 -1
- package/esm/components/Indicator/Indicator.mjs.map +1 -1
- package/esm/components/Input/Input.mjs +3 -2
- package/esm/components/Input/Input.mjs.map +1 -1
- package/esm/components/InputBase/InputBase.mjs.map +1 -1
- package/esm/components/JsonInput/JsonInput.mjs.map +1 -1
- package/esm/components/Kbd/Kbd.mjs.map +1 -1
- package/esm/components/List/List.mjs.map +1 -1
- package/esm/components/Loader/Loader.mjs.map +1 -1
- package/esm/components/LoadingOverlay/LoadingOverlay.mjs +1 -0
- package/esm/components/LoadingOverlay/LoadingOverlay.mjs.map +1 -1
- package/esm/components/Mark/Mark.mjs.map +1 -1
- package/esm/components/Marquee/Marquee.mjs.map +1 -1
- package/esm/components/Menu/Menu.mjs.map +1 -1
- package/esm/components/Modal/Modal.mjs.map +1 -1
- package/esm/components/MultiSelect/MultiSelect.mjs +3 -1
- package/esm/components/MultiSelect/MultiSelect.mjs.map +1 -1
- package/esm/components/NativeSelect/NativeSelect.mjs +4 -1
- package/esm/components/NativeSelect/NativeSelect.mjs.map +1 -1
- package/esm/components/NavLink/NavLink.mjs.map +1 -1
- package/esm/components/Notification/Notification.mjs.map +1 -1
- package/esm/components/NumberInput/NumberInput.mjs +1 -0
- package/esm/components/NumberInput/NumberInput.mjs.map +1 -1
- package/esm/components/OverflowList/OverflowList.mjs.map +1 -1
- package/esm/components/Overlay/Overlay.mjs.map +1 -1
- package/esm/components/Pagination/Pagination.mjs.map +1 -1
- package/esm/components/Paper/Paper.mjs.map +1 -1
- package/esm/components/PasswordInput/PasswordInput.mjs +4 -1
- package/esm/components/PasswordInput/PasswordInput.mjs.map +1 -1
- package/esm/components/Pill/Pill.mjs.map +1 -1
- package/esm/components/PillsInput/PillsInput.mjs.map +1 -1
- package/esm/components/PinInput/PinInput.mjs.map +1 -1
- package/esm/components/Popover/Popover.mjs +9 -0
- package/esm/components/Popover/Popover.mjs.map +1 -1
- package/esm/components/Portal/OptionalPortal.mjs.map +1 -1
- package/esm/components/Portal/Portal.mjs.map +1 -1
- package/esm/components/Progress/Progress.mjs.map +1 -1
- package/esm/components/Radio/Radio.mjs.map +1 -1
- package/esm/components/Radio/RadioGroup/RadioGroup.mjs.map +1 -1
- package/esm/components/Rating/Rating.mjs.map +1 -1
- package/esm/components/RingProgress/RingProgress.mjs +1 -0
- package/esm/components/RingProgress/RingProgress.mjs.map +1 -1
- package/esm/components/ScrollArea/ScrollArea.mjs.map +1 -1
- package/esm/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.mjs.map +1 -1
- package/esm/components/Scroller/Scroller.mjs.map +1 -1
- package/esm/components/SegmentedControl/SegmentedControl.mjs.map +1 -1
- package/esm/components/Select/Select.mjs +1 -0
- package/esm/components/Select/Select.mjs.map +1 -1
- package/esm/components/SemiCircleProgress/SemiCircleProgress.mjs +1 -2
- package/esm/components/SemiCircleProgress/SemiCircleProgress.mjs.map +1 -1
- package/esm/components/SimpleGrid/SimpleGrid.mjs.map +1 -1
- package/esm/components/Skeleton/Skeleton.mjs.map +1 -1
- package/esm/components/Slider/RangeSlider/RangeSlider.mjs.map +1 -1
- package/esm/components/Slider/Slider/Slider.mjs.map +1 -1
- package/esm/components/Slider/Slider.module.mjs.map +1 -1
- package/esm/components/Space/Space.mjs.map +1 -1
- package/esm/components/Spoiler/Spoiler.mjs.map +1 -1
- package/esm/components/Stack/Stack.mjs.map +1 -1
- package/esm/components/Stepper/Stepper.mjs.map +1 -1
- package/esm/components/Switch/Switch.mjs.map +1 -1
- package/esm/components/Switch/SwitchGroup/SwitchGroup.mjs.map +1 -1
- package/esm/components/Table/Table.mjs.map +1 -1
- package/esm/components/TableOfContents/TableOfContents.mjs.map +1 -1
- package/esm/components/Tabs/Tabs.mjs.map +1 -1
- package/esm/components/TagsInput/TagsInput.mjs +3 -1
- package/esm/components/TagsInput/TagsInput.mjs.map +1 -1
- package/esm/components/Text/Text.mjs.map +1 -1
- package/esm/components/TextInput/TextInput.mjs.map +1 -1
- package/esm/components/Textarea/Autosize.mjs +1 -0
- package/esm/components/Textarea/Autosize.mjs.map +1 -1
- package/esm/components/Textarea/Textarea.mjs.map +1 -1
- package/esm/components/ThemeIcon/ThemeIcon.mjs.map +1 -1
- package/esm/components/Timeline/Timeline.mjs.map +1 -1
- package/esm/components/Title/Title.mjs.map +1 -1
- package/esm/components/Tooltip/Tooltip.mjs.map +1 -1
- package/esm/components/Tree/Tree.mjs.map +1 -1
- package/esm/components/Typography/Typography.mjs.map +1 -1
- package/esm/components/UnstyledButton/UnstyledButton.mjs.map +1 -1
- package/esm/components/VisuallyHidden/VisuallyHidden.mjs.map +1 -1
- package/esm/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.mjs +3 -4
- package/esm/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.mjs.map +1 -1
- package/esm/core/MantineProvider/color-scheme-managers/local-storage-manager.mjs.map +1 -1
- package/esm/core/utils/find-element-ancestor/find-element-ancestor.mjs.map +1 -1
- package/lib/components/Accordion/Accordion.d.ts +21 -3
- package/lib/components/Accordion/index.d.ts +0 -17
- package/lib/components/ActionIcon/ActionIcon.d.ts +20 -2
- package/lib/components/ActionIcon/index.d.ts +0 -18
- package/lib/components/Affix/Affix.d.ts +6 -0
- package/lib/components/Affix/index.d.ts +0 -6
- package/lib/components/Alert/Alert.d.ts +6 -0
- package/lib/components/Alert/index.d.ts +0 -6
- package/lib/components/Anchor/Anchor.d.ts +7 -0
- package/lib/components/Anchor/index.d.ts +0 -8
- package/lib/components/AngleSlider/AngleSlider.d.ts +6 -0
- package/lib/components/AngleSlider/index.d.ts +0 -6
- package/lib/components/AppShell/AppShell.d.ts +30 -6
- package/lib/components/AppShell/index.d.ts +0 -24
- package/lib/components/AspectRatio/AspectRatio.d.ts +6 -0
- package/lib/components/AspectRatio/index.d.ts +0 -6
- package/lib/components/Autocomplete/Autocomplete.d.ts +6 -0
- package/lib/components/Autocomplete/index.d.ts +0 -6
- package/lib/components/Avatar/Avatar.d.ts +15 -1
- package/lib/components/Avatar/index.d.ts +0 -14
- package/lib/components/BackgroundImage/BackgroundImage.d.ts +6 -0
- package/lib/components/BackgroundImage/index.d.ts +0 -6
- package/lib/components/Badge/Badge.d.ts +7 -0
- package/lib/components/Badge/index.d.ts +0 -7
- package/lib/components/Blockquote/Blockquote.d.ts +6 -0
- package/lib/components/Blockquote/index.d.ts +0 -6
- package/lib/components/Breadcrumbs/Breadcrumbs.d.ts +6 -0
- package/lib/components/Breadcrumbs/index.d.ts +0 -7
- package/lib/components/Burger/Burger.d.ts +6 -0
- package/lib/components/Burger/index.d.ts +0 -6
- package/lib/components/Button/Button.d.ts +22 -2
- package/lib/components/Button/index.d.ts +0 -20
- package/lib/components/Card/Card.d.ts +11 -1
- package/lib/components/Card/index.d.ts +0 -10
- package/lib/components/Center/Center.d.ts +5 -0
- package/lib/components/Center/index.d.ts +0 -5
- package/lib/components/Checkbox/Checkbox.d.ts +29 -3
- package/lib/components/Checkbox/CheckboxGroup/CheckboxGroup.d.ts +8 -8
- package/lib/components/Checkbox/index.d.ts +0 -26
- package/lib/components/Chip/Chip.d.ts +12 -1
- package/lib/components/Chip/ChipGroup/ChipGroup.d.ts +8 -8
- package/lib/components/Chip/index.d.ts +0 -11
- package/lib/components/CloseButton/CloseButton.d.ts +7 -0
- package/lib/components/CloseButton/index.d.ts +0 -7
- package/lib/components/Code/Code.d.ts +6 -0
- package/lib/components/Code/index.d.ts +0 -6
- package/lib/components/Collapse/Collapse.d.ts +4 -0
- package/lib/components/Collapse/index.d.ts +0 -4
- package/lib/components/ColorInput/ColorInput.d.ts +6 -0
- package/lib/components/ColorInput/index.d.ts +0 -6
- package/lib/components/ColorPicker/AlphaSlider/AlphaSlider.d.ts +4 -0
- package/lib/components/ColorPicker/ColorPicker.d.ts +6 -0
- package/lib/components/ColorPicker/HueSlider/HueSlider.d.ts +4 -0
- package/lib/components/ColorPicker/index.d.ts +0 -14
- package/lib/components/ColorSwatch/ColorSwatch.d.ts +6 -0
- package/lib/components/ColorSwatch/index.d.ts +0 -6
- package/lib/components/Container/Container.d.ts +6 -0
- package/lib/components/Container/index.d.ts +0 -6
- package/lib/components/Dialog/Dialog.d.ts +6 -0
- package/lib/components/Dialog/index.d.ts +0 -6
- package/lib/components/Divider/Divider.d.ts +7 -0
- package/lib/components/Divider/index.d.ts +0 -7
- package/lib/components/Fieldset/Fieldset.d.ts +6 -0
- package/lib/components/Fieldset/index.d.ts +0 -6
- package/lib/components/FileButton/FileButton.d.ts +4 -0
- package/lib/components/FileButton/index.d.ts +0 -4
- package/lib/components/FileInput/FileInput.d.ts +4 -0
- package/lib/components/FileInput/index.d.ts +0 -4
- package/lib/components/Flex/Flex.d.ts +5 -0
- package/lib/components/Flex/index.d.ts +0 -5
- package/lib/components/FloatingIndicator/FloatingIndicator.d.ts +6 -0
- package/lib/components/FloatingIndicator/index.d.ts +0 -6
- package/lib/components/FloatingWindow/FloatingWindow.d.ts +5 -0
- package/lib/components/FloatingWindow/index.d.ts +0 -5
- package/lib/components/Grid/Grid.d.ts +13 -2
- package/lib/components/Grid/index.d.ts +0 -11
- package/lib/components/Group/Group.d.ts +7 -0
- package/lib/components/Group/index.d.ts +0 -7
- package/lib/components/Highlight/Highlight.d.ts +5 -0
- package/lib/components/Highlight/index.d.ts +0 -5
- package/lib/components/Image/Image.d.ts +6 -0
- package/lib/components/Image/index.d.ts +0 -6
- package/lib/components/Indicator/Indicator.d.ts +6 -0
- package/lib/components/Indicator/index.d.ts +0 -6
- package/lib/components/Input/Input.d.ts +51 -7
- package/lib/components/Input/index.d.ts +0 -42
- package/lib/components/InputBase/InputBase.d.ts +4 -0
- package/lib/components/InputBase/index.d.ts +0 -4
- package/lib/components/JsonInput/JsonInput.d.ts +4 -0
- package/lib/components/JsonInput/index.d.ts +0 -4
- package/lib/components/Kbd/Kbd.d.ts +6 -0
- package/lib/components/Kbd/index.d.ts +0 -6
- package/lib/components/List/List.d.ts +12 -1
- package/lib/components/List/index.d.ts +0 -11
- package/lib/components/Loader/Loader.d.ts +6 -0
- package/lib/components/Loader/index.d.ts +0 -6
- package/lib/components/LoadingOverlay/LoadingOverlay.d.ts +6 -0
- package/lib/components/LoadingOverlay/index.d.ts +0 -6
- package/lib/components/Mark/Mark.d.ts +6 -0
- package/lib/components/Mark/index.d.ts +0 -6
- package/lib/components/Marquee/Marquee.d.ts +6 -0
- package/lib/components/Marquee/index.d.ts +0 -6
- package/lib/components/Menu/Menu.d.ts +43 -6
- package/lib/components/Menu/index.d.ts +0 -33
- package/lib/components/Modal/Modal.d.ts +37 -7
- package/lib/components/Modal/index.d.ts +0 -30
- package/lib/components/MultiSelect/MultiSelect.d.ts +5 -0
- package/lib/components/MultiSelect/index.d.ts +0 -6
- package/lib/components/NativeSelect/NativeSelect.d.ts +5 -0
- package/lib/components/NativeSelect/index.d.ts +0 -6
- package/lib/components/NavLink/NavLink.d.ts +7 -0
- package/lib/components/NavLink/index.d.ts +0 -7
- package/lib/components/Notification/Notification.d.ts +6 -0
- package/lib/components/Notification/index.d.ts +0 -6
- package/lib/components/NumberInput/NumberInput.d.ts +7 -0
- package/lib/components/NumberInput/index.d.ts +0 -7
- package/lib/components/OverflowList/OverflowList.d.ts +6 -0
- package/lib/components/OverflowList/index.d.ts +0 -6
- package/lib/components/Overlay/Overlay.d.ts +6 -0
- package/lib/components/Overlay/index.d.ts +0 -6
- package/lib/components/Pagination/Pagination.d.ts +25 -4
- package/lib/components/Pagination/index.d.ts +0 -21
- package/lib/components/Paper/Paper.d.ts +7 -0
- package/lib/components/Paper/index.d.ts +0 -7
- package/lib/components/PasswordInput/PasswordInput.d.ts +6 -0
- package/lib/components/PasswordInput/index.d.ts +0 -6
- package/lib/components/Pill/Pill.d.ts +14 -1
- package/lib/components/Pill/index.d.ts +0 -13
- package/lib/components/PillsInput/PillsInput.d.ts +12 -1
- package/lib/components/PillsInput/index.d.ts +0 -10
- package/lib/components/PinInput/PinInput.d.ts +5 -0
- package/lib/components/PinInput/index.d.ts +0 -5
- package/lib/components/Popover/Popover.d.ts +9 -0
- package/lib/components/Portal/OptionalPortal.d.ts +3 -0
- package/lib/components/Portal/Portal.d.ts +3 -0
- package/lib/components/Portal/index.d.ts +0 -6
- package/lib/components/Progress/Progress.d.ts +19 -3
- package/lib/components/Progress/index.d.ts +0 -15
- package/lib/components/Radio/Radio.d.ts +29 -3
- package/lib/components/Radio/RadioGroup/RadioGroup.d.ts +8 -8
- package/lib/components/Radio/index.d.ts +0 -26
- package/lib/components/Rating/Rating.d.ts +5 -0
- package/lib/components/Rating/index.d.ts +0 -5
- package/lib/components/RingProgress/RingProgress.d.ts +7 -0
- package/lib/components/RingProgress/index.d.ts +0 -7
- package/lib/components/ScrollArea/ScrollArea.d.ts +10 -0
- package/lib/components/ScrollArea/index.d.ts +0 -10
- package/lib/components/Scroller/Scroller.d.ts +6 -0
- package/lib/components/Scroller/index.d.ts +0 -6
- package/lib/components/SegmentedControl/SegmentedControl.d.ts +7 -0
- package/lib/components/SegmentedControl/index.d.ts +0 -8
- package/lib/components/Select/Select.d.ts +5 -0
- package/lib/components/Select/index.d.ts +0 -6
- package/lib/components/SemiCircleProgress/SemiCircleProgress.d.ts +6 -0
- package/lib/components/SemiCircleProgress/index.d.ts +0 -6
- package/lib/components/SimpleGrid/SimpleGrid.d.ts +5 -0
- package/lib/components/SimpleGrid/index.d.ts +0 -5
- package/lib/components/Skeleton/Skeleton.d.ts +6 -0
- package/lib/components/Skeleton/index.d.ts +0 -6
- package/lib/components/Slider/RangeSlider/RangeSlider.d.ts +8 -0
- package/lib/components/Slider/Slider/Slider.d.ts +7 -0
- package/lib/components/Slider/index.d.ts +0 -15
- package/lib/components/Space/Space.d.ts +4 -0
- package/lib/components/Space/index.d.ts +0 -5
- package/lib/components/Spoiler/Spoiler.d.ts +6 -0
- package/lib/components/Spoiler/index.d.ts +0 -6
- package/lib/components/Stack/Stack.d.ts +6 -0
- package/lib/components/Stack/index.d.ts +0 -6
- package/lib/components/Stepper/Stepper.d.ts +17 -2
- package/lib/components/Stepper/index.d.ts +0 -14
- package/lib/components/Switch/Switch.d.ts +13 -1
- package/lib/components/Switch/SwitchGroup/SwitchGroup.d.ts +8 -8
- package/lib/components/Switch/index.d.ts +0 -12
- package/lib/components/Table/Table.d.ts +35 -2
- package/lib/components/Table/index.d.ts +0 -32
- package/lib/components/TableOfContents/TableOfContents.d.ts +7 -0
- package/lib/components/TableOfContents/index.d.ts +0 -7
- package/lib/components/Tabs/Tabs.d.ts +24 -3
- package/lib/components/Tabs/index.d.ts +0 -20
- package/lib/components/TagsInput/TagsInput.d.ts +5 -0
- package/lib/components/TagsInput/index.d.ts +0 -5
- package/lib/components/Text/Text.d.ts +7 -0
- package/lib/components/Text/index.d.ts +0 -7
- package/lib/components/TextInput/TextInput.d.ts +4 -0
- package/lib/components/TextInput/index.d.ts +0 -4
- package/lib/components/Textarea/Textarea.d.ts +4 -0
- package/lib/components/Textarea/index.d.ts +0 -4
- package/lib/components/ThemeIcon/ThemeIcon.d.ts +7 -0
- package/lib/components/ThemeIcon/index.d.ts +0 -7
- package/lib/components/Timeline/Timeline.d.ts +12 -1
- package/lib/components/Timeline/index.d.ts +0 -11
- package/lib/components/Title/Title.d.ts +8 -0
- package/lib/components/Title/index.d.ts +0 -8
- package/lib/components/Tooltip/Tooltip.d.ts +15 -2
- package/lib/components/Tooltip/index.d.ts +0 -13
- package/lib/components/Tree/Tree.d.ts +7 -0
- package/lib/components/Tree/index.d.ts +0 -7
- package/lib/components/Typography/Typography.d.ts +5 -0
- package/lib/components/Typography/index.d.ts +0 -5
- package/lib/components/UnstyledButton/UnstyledButton.d.ts +5 -0
- package/lib/components/UnstyledButton/index.d.ts +0 -5
- package/lib/components/VisuallyHidden/VisuallyHidden.d.ts +3 -0
- package/lib/components/VisuallyHidden/index.d.ts +0 -3
- package/package.json +2 -2
- package/styles/Accordion.css +0 -4
- package/styles/Accordion.layer.css +0 -4
- package/styles/Badge.css +0 -2
- package/styles/Badge.layer.css +0 -2
- package/styles/Slider.css +10 -10
- package/styles/Slider.layer.css +10 -10
- package/styles.css +10 -16
- package/styles.layer.css +10 -16
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Kbd.cjs","names":["createVarsResolver","getSize","factory","useProps","Box","useStyles","classes"],"sources":["../../../src/components/Kbd/Kbd.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Kbd.module.css';\n\nexport type KbdStylesNames = 'root';\nexport type KbdCssVariables = {\n root: '--kbd-fz';\n};\n\nexport interface KbdProps extends BoxProps, StylesApiProps<KbdFactory>, ElementProps<'kbd'> {\n /** Controls `font-size` and `padding` @default 'sm' */\n size?: MantineSize | number | (string & {});\n}\n\nexport type KbdFactory = Factory<{\n props: KbdProps;\n ref: HTMLElement;\n stylesNames: KbdStylesNames;\n vars: KbdCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<KbdFactory>((_, { size }) => ({\n root: { '--kbd-fz': getSize(size, 'kbd-fz') },\n}));\n\nexport const Kbd = factory<KbdFactory>((_props) => {\n const props = useProps('Kbd', null, _props);\n const { classNames, className, style, styles, unstyled, vars, attributes, ...others } = props;\n\n const getStyles = useStyles<KbdFactory>({\n name: 'Kbd',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return <Box component=\"kbd\" {...getStyles('root')} {...others} />;\n});\n\nKbd.classes = classes;\nKbd.varsResolver = varsResolver;\nKbd.displayName = '@mantine/core/Kbd';\n"],"mappings":";;;;;;;;;;;AAgCA,MAAM,eAAeA,6BAAAA,oBAAgC,GAAG,EAAE,YAAY,EACpE,MAAM,EAAE,YAAYC,iBAAAA,QAAQ,MAAM,SAAS,EAAE,EAC9C,EAAE;AAEH,MAAa,MAAMC,gBAAAA,SAAqB,WAAW;CACjD,MAAM,QAAQC,kBAAAA,SAAS,OAAO,MAAM,OAAO;CAC3C,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,UAAU,MAAM,YAAY,GAAG,WAAW;AAgBxF,QAAO,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,WAAU;EAAM,GAdVC,mBAAAA,UAAsB;GACtC,MAAM;GACN,SAAA,mBAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,CAEwC,OAAO;EAAE,GAAI;EAAU,CAAA;EACjE;AAEF,IAAI,UAAUC,mBAAAA;AACd,IAAI,eAAe;AACnB,IAAI,cAAc"}
|
|
1
|
+
{"version":3,"file":"Kbd.cjs","names":["createVarsResolver","getSize","factory","useProps","Box","useStyles","classes"],"sources":["../../../src/components/Kbd/Kbd.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Kbd.module.css';\n\nexport type KbdStylesNames = 'root';\nexport type KbdCssVariables = {\n root: '--kbd-fz';\n};\n\nexport interface KbdProps extends BoxProps, StylesApiProps<KbdFactory>, ElementProps<'kbd'> {\n /** Controls `font-size` and `padding` @default 'sm' */\n size?: MantineSize | number | (string & {});\n}\n\nexport type KbdFactory = Factory<{\n props: KbdProps;\n ref: HTMLElement;\n stylesNames: KbdStylesNames;\n vars: KbdCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<KbdFactory>((_, { size }) => ({\n root: { '--kbd-fz': getSize(size, 'kbd-fz') },\n}));\n\nexport const Kbd = factory<KbdFactory>((_props) => {\n const props = useProps('Kbd', null, _props);\n const { classNames, className, style, styles, unstyled, vars, attributes, ...others } = props;\n\n const getStyles = useStyles<KbdFactory>({\n name: 'Kbd',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return <Box component=\"kbd\" {...getStyles('root')} {...others} />;\n});\n\nKbd.classes = classes;\nKbd.varsResolver = varsResolver;\nKbd.displayName = '@mantine/core/Kbd';\n\nexport namespace Kbd {\n export type Props = KbdProps;\n export type StylesNames = KbdStylesNames;\n export type CssVariables = KbdCssVariables;\n export type Factory = KbdFactory;\n}\n"],"mappings":";;;;;;;;;;;AAgCA,MAAM,eAAeA,6BAAAA,oBAAgC,GAAG,EAAE,YAAY,EACpE,MAAM,EAAE,YAAYC,iBAAAA,QAAQ,MAAM,SAAS,EAAE,EAC9C,EAAE;AAEH,MAAa,MAAMC,gBAAAA,SAAqB,WAAW;CACjD,MAAM,QAAQC,kBAAAA,SAAS,OAAO,MAAM,OAAO;CAC3C,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,UAAU,MAAM,YAAY,GAAG,WAAW;AAgBxF,QAAO,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,WAAU;EAAM,GAdVC,mBAAAA,UAAsB;GACtC,MAAM;GACN,SAAA,mBAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,CAEwC,OAAO;EAAE,GAAI;EAAU,CAAA;EACjE;AAEF,IAAI,UAAUC,mBAAAA;AACd,IAAI,eAAe;AACnB,IAAI,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.cjs","names":["createVarsResolver","getFontSize","getLineHeight","getSpacing","factory","useProps","useStyles","ListProvider","Box","classes","ListItem"],"sources":["../../../src/components/List/List.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getFontSize,\n getLineHeight,\n getSpacing,\n MantineSize,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { ListProvider } from './List.context';\nimport {
|
|
1
|
+
{"version":3,"file":"List.cjs","names":["createVarsResolver","getFontSize","getLineHeight","getSpacing","factory","useProps","useStyles","ListProvider","Box","classes","ListItem"],"sources":["../../../src/components/List/List.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getFontSize,\n getLineHeight,\n getSpacing,\n MantineSize,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { ListProvider } from './List.context';\nimport {\n ListItem,\n ListItemStylesNames,\n type ListItemProps,\n type ListItemFactory,\n} from './ListItem/ListItem';\nimport classes from './List.module.css';\nexport type ListStylesNames = 'root' | ListItemStylesNames;\nexport type ListCssVariables = {\n root: '--list-fz' | '--list-lh' | '--list-spacing';\n};\n\nexport interface ListProps\n extends BoxProps, StylesApiProps<ListFactory>, ElementProps<'ol', 'type'> {\n /** `List.Item` components */\n children?: React.ReactNode;\n\n /** List type @default 'unordered' */\n type?: 'ordered' | 'unordered';\n\n /** Adds extra horizontal padding to the list, useful for nested lists @default false */\n withPadding?: boolean;\n\n /** Controls `font-size` and `line-height` @default 'md' */\n size?: MantineSize;\n\n /** Icon to replace default list markers. Applied to all items unless overridden on individual List.Item components */\n icon?: React.ReactNode;\n\n /** Key of `theme.spacing` or any valid CSS value to set spacing between items @default 0 */\n spacing?: MantineSpacing;\n\n /** Vertically centers list items with their icons @default false */\n center?: boolean;\n\n /** Controls CSS `list-style-type` property. Overrides the default list marker style based on list type */\n listStyleType?: React.CSSProperties['listStyleType'];\n\n /** Starting value for ordered list numbering (only works with type=\"ordered\") */\n start?: number;\n\n /** Reverses the order of list items (only works with type=\"ordered\") */\n reversed?: boolean;\n}\n\nexport type ListFactory = Factory<{\n props: ListProps;\n ref: HTMLUListElement;\n stylesNames: ListStylesNames;\n vars: ListCssVariables;\n staticComponents: {\n Item: typeof ListItem;\n };\n}>;\n\nconst defaultProps = {\n type: 'unordered',\n} satisfies Partial<ListProps>;\n\nconst varsResolver = createVarsResolver<ListFactory>((_, { size, spacing }) => ({\n root: {\n '--list-fz': getFontSize(size),\n '--list-lh': getLineHeight(size),\n '--list-spacing': getSpacing(spacing),\n },\n}));\n\nexport const List = factory<ListFactory>((_props) => {\n const props = useProps('List', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n type,\n withPadding,\n icon,\n spacing,\n center,\n listStyleType,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<ListFactory>({\n name: 'List',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <ListProvider value={{ center, icon, getStyles }}>\n <Box<any>\n {...getStyles('root', { style: { listStyleType } })}\n component={type === 'unordered' ? 'ul' : 'ol'}\n mod={[{ 'with-padding': withPadding, type: icon ? 'none' : listStyleType }, mod]}\n {...others}\n >\n {children}\n </Box>\n </ListProvider>\n );\n});\n\nList.classes = classes;\nList.varsResolver = varsResolver;\nList.displayName = '@mantine/core/List';\nList.Item = ListItem;\n\nexport namespace List {\n export type Props = ListProps;\n export type StylesNames = ListStylesNames;\n export type CssVariables = ListCssVariables;\n export type Factory = ListFactory;\n\n export namespace Item {\n export type Props = ListItemProps;\n export type StylesNames = ListItemStylesNames;\n export type Factory = ListItemFactory;\n }\n}\n"],"mappings":";;;;;;;;;;;;;AAwEA,MAAM,eAAe,EACnB,MAAM,aACP;AAED,MAAM,eAAeA,6BAAAA,oBAAiC,GAAG,EAAE,MAAM,eAAe,EAC9E,MAAM;CACJ,aAAaC,iBAAAA,YAAY,KAAK;CAC9B,aAAaC,iBAAAA,cAAc,KAAK;CAChC,kBAAkBC,iBAAAA,WAAW,QAAQ;CACtC,EACF,EAAE;AAEH,MAAa,OAAOC,gBAAAA,SAAsB,WAAW;CACnD,MAAM,QAAQC,kBAAAA,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,MACA,aACA,MACA,SACA,QACA,eACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAuB;EACvC,MAAM;EACN,SAAA,oBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,qBAAAA,cAAD;EAAc,OAAO;GAAE;GAAQ;GAAM;GAAW;YAC9C,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;GACE,GAAI,UAAU,QAAQ,EAAE,OAAO,EAAE,eAAe,EAAE,CAAC;GACnD,WAAW,SAAS,cAAc,OAAO;GACzC,KAAK,CAAC;IAAE,gBAAgB;IAAa,MAAM,OAAO,SAAS;IAAe,EAAE,IAAI;GAChF,GAAI;GAEH;GACG,CAAA;EACO,CAAA;EAEjB;AAEF,KAAK,UAAUC,oBAAAA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc;AACnB,KAAK,OAAOC,iBAAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Loader.cjs","names":["Bars","Oval","Dots","createVarsResolver","getSize","getThemeColor","factory","useProps","useStyles","Box","classes"],"sources":["../../../src/components/Loader/Loader.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n getThemeColor,\n MantineColor,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport type { MantineLoader, MantineLoadersRecord } from './Loader.types';\nimport { Bars } from './loaders/Bars';\nimport { Dots } from './loaders/Dots';\nimport { Oval } from './loaders/Oval';\nimport classes from './Loader.module.css';\n\nexport type LoaderStylesNames = 'root';\nexport type LoaderCssVariables = {\n root: '--loader-size' | '--loader-color';\n};\n\nexport interface LoaderProps\n extends BoxProps, StylesApiProps<LoaderFactory>, ElementProps<'svg', 'display' | 'opacity'> {\n /** Controls `width` and `height` of the loader. `Loader` has predefined `xs`-`xl` values. Numbers are converted to rem. @default 'md' */\n size?: MantineSize | (string & {}) | number;\n\n /** Key of `theme.colors` or any valid CSS color @default theme.primaryColor */\n color?: MantineColor;\n\n /** Loader type, key of `loaders` prop @default 'oval' */\n type?: MantineLoader;\n\n /** Object of loaders components, can be customized via default props or inline. */\n loaders?: MantineLoadersRecord;\n\n /** Overrides default loader with given content */\n children?: React.ReactNode;\n}\n\nexport type LoaderFactory = Factory<{\n props: LoaderProps;\n ref: SVGSVGElement;\n stylesNames: LoaderStylesNames;\n vars: LoaderCssVariables;\n staticComponents: {\n defaultLoaders: typeof defaultLoaders;\n };\n}>;\n\nexport const defaultLoaders: MantineLoadersRecord = {\n bars: Bars,\n oval: Oval,\n dots: Dots,\n};\n\nconst defaultProps = {\n loaders: defaultLoaders,\n type: 'oval',\n} satisfies Partial<LoaderProps>;\n\nconst varsResolver = createVarsResolver<LoaderFactory>((theme, { size, color }) => ({\n root: {\n '--loader-size': getSize(size, 'loader-size'),\n '--loader-color': color ? getThemeColor(color, theme) : undefined,\n },\n}));\n\nexport const Loader = factory<LoaderFactory>((_props) => {\n const props = useProps('Loader', defaultProps, _props);\n const {\n size,\n color,\n type,\n vars,\n className,\n style,\n classNames,\n styles,\n unstyled,\n loaders,\n variant,\n children,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<LoaderFactory>({\n name: 'Loader',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n if (children) {\n return (\n <Box {...getStyles('root')} {...(others as any)}>\n {children}\n </Box>\n );\n }\n\n return (\n <Box\n {...getStyles('root')}\n component={loaders[type]}\n variant={variant}\n size={size}\n {...others}\n />\n );\n});\n\nLoader.defaultLoaders = defaultLoaders;\nLoader.classes = classes;\nLoader.varsResolver = varsResolver;\nLoader.displayName = '@mantine/core/Loader';\n"],"mappings":";;;;;;;;;;;;;;;AAsDA,MAAa,iBAAuC;CAClD,MAAMA,aAAAA;CACN,MAAMC,aAAAA;CACN,MAAMC,aAAAA;CACP;AAED,MAAM,eAAe;CACnB,SAAS;CACT,MAAM;CACP;AAED,MAAM,eAAeC,6BAAAA,oBAAmC,OAAO,EAAE,MAAM,aAAa,EAClF,MAAM;CACJ,iBAAiBC,iBAAAA,QAAQ,MAAM,cAAc;CAC7C,kBAAkB,QAAQC,wBAAAA,cAAc,OAAO,MAAM,GAAG,KAAA;CACzD,EACF,EAAE;AAEH,MAAa,SAASC,gBAAAA,SAAwB,WAAW;CACvD,MAAM,QAAQC,kBAAAA,SAAS,UAAU,cAAc,OAAO;CACtD,MAAM,EACJ,MACA,OACA,MACA,MACA,WACA,OACA,YACA,QACA,UACA,SACA,SACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAyB;EACzC,MAAM;EACN;EACA,SAAA,sBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,KAAI,SACF,QACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,GAAI,UAAU,OAAO;EAAE,GAAK;EAC9B;EACG,CAAA;AAIV,QACE,iBAAA,GAAA,kBAAA,KAACA,YAAAA,KAAD;EACE,GAAI,UAAU,OAAO;EACrB,WAAW,QAAQ;EACV;EACH;EACN,GAAI;EACJ,CAAA;EAEJ;AAEF,OAAO,iBAAiB;AACxB,OAAO,UAAUC,sBAAAA;AACjB,OAAO,eAAe;AACtB,OAAO,cAAc"}
|
|
1
|
+
{"version":3,"file":"Loader.cjs","names":["Bars","Oval","Dots","createVarsResolver","getSize","getThemeColor","factory","useProps","useStyles","Box","classes"],"sources":["../../../src/components/Loader/Loader.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n getThemeColor,\n MantineColor,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport type { MantineLoader, MantineLoadersRecord } from './Loader.types';\nimport { Bars } from './loaders/Bars';\nimport { Dots } from './loaders/Dots';\nimport { Oval } from './loaders/Oval';\nimport classes from './Loader.module.css';\n\nexport type LoaderStylesNames = 'root';\nexport type LoaderCssVariables = {\n root: '--loader-size' | '--loader-color';\n};\n\nexport interface LoaderProps\n extends BoxProps, StylesApiProps<LoaderFactory>, ElementProps<'svg', 'display' | 'opacity'> {\n /** Controls `width` and `height` of the loader. `Loader` has predefined `xs`-`xl` values. Numbers are converted to rem. @default 'md' */\n size?: MantineSize | (string & {}) | number;\n\n /** Key of `theme.colors` or any valid CSS color @default theme.primaryColor */\n color?: MantineColor;\n\n /** Loader type, key of `loaders` prop @default 'oval' */\n type?: MantineLoader;\n\n /** Object of loaders components, can be customized via default props or inline. */\n loaders?: MantineLoadersRecord;\n\n /** Overrides default loader with given content */\n children?: React.ReactNode;\n}\n\nexport type LoaderFactory = Factory<{\n props: LoaderProps;\n ref: SVGSVGElement;\n stylesNames: LoaderStylesNames;\n vars: LoaderCssVariables;\n staticComponents: {\n defaultLoaders: typeof defaultLoaders;\n };\n}>;\n\nexport const defaultLoaders: MantineLoadersRecord = {\n bars: Bars,\n oval: Oval,\n dots: Dots,\n};\n\nconst defaultProps = {\n loaders: defaultLoaders,\n type: 'oval',\n} satisfies Partial<LoaderProps>;\n\nconst varsResolver = createVarsResolver<LoaderFactory>((theme, { size, color }) => ({\n root: {\n '--loader-size': getSize(size, 'loader-size'),\n '--loader-color': color ? getThemeColor(color, theme) : undefined,\n },\n}));\n\nexport const Loader = factory<LoaderFactory>((_props) => {\n const props = useProps('Loader', defaultProps, _props);\n const {\n size,\n color,\n type,\n vars,\n className,\n style,\n classNames,\n styles,\n unstyled,\n loaders,\n variant,\n children,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<LoaderFactory>({\n name: 'Loader',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n if (children) {\n return (\n <Box {...getStyles('root')} {...(others as any)}>\n {children}\n </Box>\n );\n }\n\n return (\n <Box\n {...getStyles('root')}\n component={loaders[type]}\n variant={variant}\n size={size}\n {...others}\n />\n );\n});\n\nLoader.defaultLoaders = defaultLoaders;\nLoader.classes = classes;\nLoader.varsResolver = varsResolver;\nLoader.displayName = '@mantine/core/Loader';\n\nexport namespace Loader {\n export type Props = LoaderProps;\n export type StylesNames = LoaderStylesNames;\n export type CssVariables = LoaderCssVariables;\n export type Factory = LoaderFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;;AAsDA,MAAa,iBAAuC;CAClD,MAAMA,aAAAA;CACN,MAAMC,aAAAA;CACN,MAAMC,aAAAA;CACP;AAED,MAAM,eAAe;CACnB,SAAS;CACT,MAAM;CACP;AAED,MAAM,eAAeC,6BAAAA,oBAAmC,OAAO,EAAE,MAAM,aAAa,EAClF,MAAM;CACJ,iBAAiBC,iBAAAA,QAAQ,MAAM,cAAc;CAC7C,kBAAkB,QAAQC,wBAAAA,cAAc,OAAO,MAAM,GAAG,KAAA;CACzD,EACF,EAAE;AAEH,MAAa,SAASC,gBAAAA,SAAwB,WAAW;CACvD,MAAM,QAAQC,kBAAAA,SAAS,UAAU,cAAc,OAAO;CACtD,MAAM,EACJ,MACA,OACA,MACA,MACA,WACA,OACA,YACA,QACA,UACA,SACA,SACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAyB;EACzC,MAAM;EACN;EACA,SAAA,sBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,KAAI,SACF,QACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,GAAI,UAAU,OAAO;EAAE,GAAK;EAC9B;EACG,CAAA;AAIV,QACE,iBAAA,GAAA,kBAAA,KAACA,YAAAA,KAAD;EACE,GAAI,UAAU,OAAO;EACrB,WAAW,QAAQ;EACV;EACH;EACN,GAAI;EACJ,CAAA;EAEJ;AAEF,OAAO,iBAAiB;AACxB,OAAO,UAAUC,sBAAAA;AACjB,OAAO,eAAe;AACtB,OAAO,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoadingOverlay.cjs","names":["getDefaultZIndex","createVarsResolver","factory","useProps","useMantineTheme","useStyles","Transition","Box","Loader","Overlay","classes"],"sources":["../../../src/components/LoadingOverlay/LoadingOverlay.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getDefaultZIndex,\n StylesApiProps,\n useMantineTheme,\n useProps,\n useStyles,\n} from '../../core';\nimport { Loader, LoaderProps } from '../Loader';\nimport { Overlay, OverlayProps } from '../Overlay';\nimport { Transition, TransitionOverride } from '../Transition';\nimport classes from './LoadingOverlay.module.css';\n\nexport type LoadingOverlayStylesNames = 'root' | 'loader' | 'overlay';\nexport type LoadingOverlayCssVariables = {\n root: '--lo-z-index';\n};\n\nexport interface LoadingOverlayProps\n extends BoxProps, StylesApiProps<LoadingOverlayFactory>, ElementProps<'div'> {\n /** Props passed down to `Transition` component. Set `duration` to create custom transition or override default transition. */\n transitionProps?: TransitionOverride;\n\n /** Props passed down to `Loader` component */\n loaderProps?: LoaderProps;\n\n /** Props passed down to `Overlay` component. Use to customizing blur, opacity, color and other properties. */\n overlayProps?: OverlayProps;\n\n /** Controls overlay visibility. Typically used with state (useState, useDisclosure). @default false */\n visible?: boolean;\n\n /** Controls `z-index` of both the overlay and loader. The loader receives `z-index + 1`. @default 400 */\n zIndex?: string | number;\n\n /** Called when transition starts */\n onEnter?: () => void;\n\n /** Called when transition ends */\n onEntered?: () => void;\n\n /** Called when exit transition starts */\n onExit?: () => void;\n\n /** Called when exit transition ends */\n onExited?: () => void;\n}\n\nexport type LoadingOverlayFactory = Factory<{\n props: LoadingOverlayProps;\n ref: HTMLDivElement;\n stylesNames: LoadingOverlayStylesNames;\n vars: LoadingOverlayCssVariables;\n}>;\n\nconst defaultProps = {\n transitionProps: { transition: 'fade', duration: 0 },\n overlayProps: { backgroundOpacity: 0.75 },\n zIndex: getDefaultZIndex('overlay'),\n} satisfies Partial<LoadingOverlayProps>;\n\nconst varsResolver = createVarsResolver<LoadingOverlayFactory>((_, { zIndex }) => ({\n root: {\n '--lo-z-index': zIndex?.toString(),\n },\n}));\n\nexport const LoadingOverlay = factory<LoadingOverlayFactory>((_props) => {\n const props = useProps('LoadingOverlay', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n transitionProps,\n loaderProps,\n overlayProps,\n visible,\n zIndex,\n attributes,\n onEnter,\n onEntered,\n onExit,\n onExited,\n ...others\n } = props;\n\n const theme = useMantineTheme();\n\n const getStyles = useStyles<LoadingOverlayFactory>({\n name: 'LoadingOverlay',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const _overlayProps = { ...defaultProps.overlayProps, ...overlayProps };\n\n return (\n <Transition\n transition=\"fade\"\n {...transitionProps}\n mounted={!!visible}\n onEnter={onEnter}\n onEntered={onEntered}\n onExit={onExit}\n onExited={onExited}\n >\n {(transitionStyles) => (\n <Box {...getStyles('root', { style: transitionStyles })} {...others}>\n <Loader\n unstyled={unstyled}\n {...loaderProps}\n {...getStyles('loader', {\n className: loaderProps?.className,\n style: loaderProps?.style,\n })}\n />\n\n <Overlay\n {..._overlayProps}\n {...getStyles('overlay', {\n className: _overlayProps?.className,\n style: _overlayProps?.style,\n })}\n unstyled={unstyled}\n color={overlayProps?.color || theme.white}\n />\n\n <Overlay\n {..._overlayProps}\n {...getStyles('overlay', {\n className: _overlayProps?.className,\n style: _overlayProps?.style,\n })}\n lightHidden\n unstyled={unstyled}\n color={overlayProps?.color || theme.colors.dark[5]}\n />\n </Box>\n )}\n </Transition>\n );\n});\n\nLoadingOverlay.classes = classes;\nLoadingOverlay.varsResolver = varsResolver;\nLoadingOverlay.displayName = '@mantine/core/LoadingOverlay';\n"],"mappings":";;;;;;;;;;;;;;;AA4DA,MAAM,eAAe;CACnB,iBAAiB;EAAE,YAAY;EAAQ,UAAU;EAAG;CACpD,cAAc,EAAE,mBAAmB,KAAM;CACzC,QAAQA,4BAAAA,iBAAiB,UAAU;CACpC;AAED,MAAM,eAAeC,6BAAAA,oBAA2C,GAAG,EAAE,cAAc,EACjF,MAAM,EACJ,gBAAgB,QAAQ,UAAU,EACnC,EACF,EAAE;AAEH,MAAa,iBAAiBC,gBAAAA,SAAgC,WAAW;CACvE,MAAM,QAAQC,kBAAAA,SAAS,kBAAkB,cAAc,OAAO;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,iBACA,aACA,cACA,SACA,QACA,YACA,SACA,WACA,QACA,UACA,GAAG,WACD;CAEJ,MAAM,QAAQC,6BAAAA,iBAAiB;CAE/B,MAAM,YAAYC,mBAAAA,UAAiC;EACjD,MAAM;EACN,SAAA,8BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,gBAAgB;EAAE,GAAG,aAAa;EAAc,GAAG;EAAc;AAEvE,QACE,iBAAA,GAAA,kBAAA,KAACC,mBAAAA,YAAD;EACE,YAAW;EACX,GAAI;EACJ,SAAS,CAAC,CAAC;EACF;EACE;EACH;EACE;aAER,qBACA,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;GAAK,GAAI,UAAU,QAAQ,EAAE,OAAO,kBAAkB,CAAC;GAAE,GAAI;aAA7D;IACE,iBAAA,GAAA,kBAAA,KAACC,eAAAA,QAAD;KACY;KACV,GAAI;KACJ,GAAI,UAAU,UAAU;MACtB,WAAW,aAAa;MACxB,OAAO,aAAa;MACrB,CAAC;KACF,CAAA;IAEF,iBAAA,GAAA,kBAAA,KAACC,gBAAAA,SAAD;KACE,GAAI;KACJ,GAAI,UAAU,WAAW;MACvB,WAAW,eAAe;MAC1B,OAAO,eAAe;MACvB,CAAC;
|
|
1
|
+
{"version":3,"file":"LoadingOverlay.cjs","names":["getDefaultZIndex","createVarsResolver","factory","useProps","useMantineTheme","useStyles","Transition","Box","Loader","Overlay","classes"],"sources":["../../../src/components/LoadingOverlay/LoadingOverlay.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getDefaultZIndex,\n StylesApiProps,\n useMantineTheme,\n useProps,\n useStyles,\n} from '../../core';\nimport { Loader, LoaderProps } from '../Loader';\nimport { Overlay, OverlayProps } from '../Overlay';\nimport { Transition, TransitionOverride } from '../Transition';\nimport classes from './LoadingOverlay.module.css';\n\nexport type LoadingOverlayStylesNames = 'root' | 'loader' | 'overlay';\nexport type LoadingOverlayCssVariables = {\n root: '--lo-z-index';\n};\n\nexport interface LoadingOverlayProps\n extends BoxProps, StylesApiProps<LoadingOverlayFactory>, ElementProps<'div'> {\n /** Props passed down to `Transition` component. Set `duration` to create custom transition or override default transition. */\n transitionProps?: TransitionOverride;\n\n /** Props passed down to `Loader` component */\n loaderProps?: LoaderProps;\n\n /** Props passed down to `Overlay` component. Use to customizing blur, opacity, color and other properties. */\n overlayProps?: OverlayProps;\n\n /** Controls overlay visibility. Typically used with state (useState, useDisclosure). @default false */\n visible?: boolean;\n\n /** Controls `z-index` of both the overlay and loader. The loader receives `z-index + 1`. @default 400 */\n zIndex?: string | number;\n\n /** Called when transition starts */\n onEnter?: () => void;\n\n /** Called when transition ends */\n onEntered?: () => void;\n\n /** Called when exit transition starts */\n onExit?: () => void;\n\n /** Called when exit transition ends */\n onExited?: () => void;\n}\n\nexport type LoadingOverlayFactory = Factory<{\n props: LoadingOverlayProps;\n ref: HTMLDivElement;\n stylesNames: LoadingOverlayStylesNames;\n vars: LoadingOverlayCssVariables;\n}>;\n\nconst defaultProps = {\n transitionProps: { transition: 'fade', duration: 0 },\n overlayProps: { backgroundOpacity: 0.75 },\n zIndex: getDefaultZIndex('overlay'),\n} satisfies Partial<LoadingOverlayProps>;\n\nconst varsResolver = createVarsResolver<LoadingOverlayFactory>((_, { zIndex }) => ({\n root: {\n '--lo-z-index': zIndex?.toString(),\n },\n}));\n\nexport const LoadingOverlay = factory<LoadingOverlayFactory>((_props) => {\n const props = useProps('LoadingOverlay', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n transitionProps,\n loaderProps,\n overlayProps,\n visible,\n zIndex,\n attributes,\n onEnter,\n onEntered,\n onExit,\n onExited,\n ...others\n } = props;\n\n const theme = useMantineTheme();\n\n const getStyles = useStyles<LoadingOverlayFactory>({\n name: 'LoadingOverlay',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const _overlayProps = { ...defaultProps.overlayProps, ...overlayProps };\n\n return (\n <Transition\n transition=\"fade\"\n {...transitionProps}\n mounted={!!visible}\n onEnter={onEnter}\n onEntered={onEntered}\n onExit={onExit}\n onExited={onExited}\n >\n {(transitionStyles) => (\n <Box {...getStyles('root', { style: transitionStyles })} {...others}>\n <Loader\n unstyled={unstyled}\n {...loaderProps}\n {...getStyles('loader', {\n className: loaderProps?.className,\n style: loaderProps?.style,\n })}\n />\n\n <Overlay\n {..._overlayProps}\n {...getStyles('overlay', {\n className: _overlayProps?.className,\n style: _overlayProps?.style,\n })}\n darkHidden\n unstyled={unstyled}\n color={overlayProps?.color || theme.white}\n />\n\n <Overlay\n {..._overlayProps}\n {...getStyles('overlay', {\n className: _overlayProps?.className,\n style: _overlayProps?.style,\n })}\n lightHidden\n unstyled={unstyled}\n color={overlayProps?.color || theme.colors.dark[5]}\n />\n </Box>\n )}\n </Transition>\n );\n});\n\nLoadingOverlay.classes = classes;\nLoadingOverlay.varsResolver = varsResolver;\nLoadingOverlay.displayName = '@mantine/core/LoadingOverlay';\n\nexport namespace LoadingOverlay {\n export type Props = LoadingOverlayProps;\n export type StylesNames = LoadingOverlayStylesNames;\n export type CssVariables = LoadingOverlayCssVariables;\n export type Factory = LoadingOverlayFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;;AA4DA,MAAM,eAAe;CACnB,iBAAiB;EAAE,YAAY;EAAQ,UAAU;EAAG;CACpD,cAAc,EAAE,mBAAmB,KAAM;CACzC,QAAQA,4BAAAA,iBAAiB,UAAU;CACpC;AAED,MAAM,eAAeC,6BAAAA,oBAA2C,GAAG,EAAE,cAAc,EACjF,MAAM,EACJ,gBAAgB,QAAQ,UAAU,EACnC,EACF,EAAE;AAEH,MAAa,iBAAiBC,gBAAAA,SAAgC,WAAW;CACvE,MAAM,QAAQC,kBAAAA,SAAS,kBAAkB,cAAc,OAAO;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,iBACA,aACA,cACA,SACA,QACA,YACA,SACA,WACA,QACA,UACA,GAAG,WACD;CAEJ,MAAM,QAAQC,6BAAAA,iBAAiB;CAE/B,MAAM,YAAYC,mBAAAA,UAAiC;EACjD,MAAM;EACN,SAAA,8BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,gBAAgB;EAAE,GAAG,aAAa;EAAc,GAAG;EAAc;AAEvE,QACE,iBAAA,GAAA,kBAAA,KAACC,mBAAAA,YAAD;EACE,YAAW;EACX,GAAI;EACJ,SAAS,CAAC,CAAC;EACF;EACE;EACH;EACE;aAER,qBACA,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;GAAK,GAAI,UAAU,QAAQ,EAAE,OAAO,kBAAkB,CAAC;GAAE,GAAI;aAA7D;IACE,iBAAA,GAAA,kBAAA,KAACC,eAAAA,QAAD;KACY;KACV,GAAI;KACJ,GAAI,UAAU,UAAU;MACtB,WAAW,aAAa;MACxB,OAAO,aAAa;MACrB,CAAC;KACF,CAAA;IAEF,iBAAA,GAAA,kBAAA,KAACC,gBAAAA,SAAD;KACE,GAAI;KACJ,GAAI,UAAU,WAAW;MACvB,WAAW,eAAe;MAC1B,OAAO,eAAe;MACvB,CAAC;KACF,YAAA;KACU;KACV,OAAO,cAAc,SAAS,MAAM;KACpC,CAAA;IAEF,iBAAA,GAAA,kBAAA,KAACA,gBAAAA,SAAD;KACE,GAAI;KACJ,GAAI,UAAU,WAAW;MACvB,WAAW,eAAe;MAC1B,OAAO,eAAe;MACvB,CAAC;KACF,aAAA;KACU;KACV,OAAO,cAAc,SAAS,MAAM,OAAO,KAAK;KAChD,CAAA;IACE;;EAEG,CAAA;EAEf;AAEF,eAAe,UAAUC,8BAAAA;AACzB,eAAe,eAAe;AAC9B,eAAe,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Mark.cjs","names":["createVarsResolver","getMarkColor","factory","useProps","Box","useStyles","classes"],"sources":["../../../src/components/Mark/Mark.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n MantineColor,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { getMarkColor } from './get-mark-color';\nimport classes from './Mark.module.css';\n\nexport type MarkStylesNames = 'root';\nexport type MarkCssVariables = {\n root: '--mark-bg-dark' | '--mark-bg-light';\n};\n\nexport interface MarkProps extends BoxProps, StylesApiProps<MarkFactory>, ElementProps<'mark'> {\n /** Key of `theme.colors` or any valid CSS color @default yellow */\n color?: MantineColor;\n}\n\nexport type MarkFactory = Factory<{\n props: MarkProps;\n ref: HTMLElement;\n stylesNames: MarkStylesNames;\n vars: MarkCssVariables;\n}>;\n\nconst defaultProps = {\n color: 'yellow',\n} satisfies Partial<MarkProps>;\n\nconst varsResolver = createVarsResolver<MarkFactory>((theme, { color }) => ({\n root: {\n '--mark-bg-dark': getMarkColor({ color, theme, defaultShade: 5 }),\n '--mark-bg-light': getMarkColor({ color, theme, defaultShade: 2 }),\n },\n}));\n\nexport const Mark = factory<MarkFactory>((_props) => {\n const props = useProps('Mark', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n color,\n variant,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<MarkFactory>({\n name: 'Mark',\n props,\n className,\n style,\n classes,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return <Box component=\"mark\" variant={variant} {...getStyles('root')} {...others} />;\n});\n\nMark.classes = classes;\nMark.varsResolver = varsResolver;\nMark.displayName = '@mantine/core/Mark';\n"],"mappings":";;;;;;;;;;;AAgCA,MAAM,eAAe,EACnB,OAAO,UACR;AAED,MAAM,eAAeA,6BAAAA,oBAAiC,OAAO,EAAE,aAAa,EAC1E,MAAM;CACJ,kBAAkBC,uBAAAA,aAAa;EAAE;EAAO;EAAO,cAAc;EAAG,CAAC;CACjE,mBAAmBA,uBAAAA,aAAa;EAAE;EAAO;EAAO,cAAc;EAAG,CAAC;CACnE,EACF,EAAE;AAEH,MAAa,OAAOC,gBAAAA,SAAsB,WAAW;CACnD,MAAM,QAAQC,kBAAAA,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,SACA,YACA,GAAG,WACD;AAgBJ,QAAO,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,WAAU;EAAgB;EAAS,GAd7BC,mBAAAA,UAAuB;GACvC,MAAM;GACN;GACA;GACA;GACA,SAAA,oBAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,CAE2D,OAAO;EAAE,GAAI;EAAU,CAAA;EACpF;AAEF,KAAK,UAAUC,oBAAAA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc"}
|
|
1
|
+
{"version":3,"file":"Mark.cjs","names":["createVarsResolver","getMarkColor","factory","useProps","Box","useStyles","classes"],"sources":["../../../src/components/Mark/Mark.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n MantineColor,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { getMarkColor } from './get-mark-color';\nimport classes from './Mark.module.css';\n\nexport type MarkStylesNames = 'root';\nexport type MarkCssVariables = {\n root: '--mark-bg-dark' | '--mark-bg-light';\n};\n\nexport interface MarkProps extends BoxProps, StylesApiProps<MarkFactory>, ElementProps<'mark'> {\n /** Key of `theme.colors` or any valid CSS color @default yellow */\n color?: MantineColor;\n}\n\nexport type MarkFactory = Factory<{\n props: MarkProps;\n ref: HTMLElement;\n stylesNames: MarkStylesNames;\n vars: MarkCssVariables;\n}>;\n\nconst defaultProps = {\n color: 'yellow',\n} satisfies Partial<MarkProps>;\n\nconst varsResolver = createVarsResolver<MarkFactory>((theme, { color }) => ({\n root: {\n '--mark-bg-dark': getMarkColor({ color, theme, defaultShade: 5 }),\n '--mark-bg-light': getMarkColor({ color, theme, defaultShade: 2 }),\n },\n}));\n\nexport const Mark = factory<MarkFactory>((_props) => {\n const props = useProps('Mark', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n color,\n variant,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<MarkFactory>({\n name: 'Mark',\n props,\n className,\n style,\n classes,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return <Box component=\"mark\" variant={variant} {...getStyles('root')} {...others} />;\n});\n\nMark.classes = classes;\nMark.varsResolver = varsResolver;\nMark.displayName = '@mantine/core/Mark';\n\nexport namespace Mark {\n export type Props = MarkProps;\n export type StylesNames = MarkStylesNames;\n export type CssVariables = MarkCssVariables;\n export type Factory = MarkFactory;\n}\n"],"mappings":";;;;;;;;;;;AAgCA,MAAM,eAAe,EACnB,OAAO,UACR;AAED,MAAM,eAAeA,6BAAAA,oBAAiC,OAAO,EAAE,aAAa,EAC1E,MAAM;CACJ,kBAAkBC,uBAAAA,aAAa;EAAE;EAAO;EAAO,cAAc;EAAG,CAAC;CACjE,mBAAmBA,uBAAAA,aAAa;EAAE;EAAO;EAAO,cAAc;EAAG,CAAC;CACnE,EACF,EAAE;AAEH,MAAa,OAAOC,gBAAAA,SAAsB,WAAW;CACnD,MAAM,QAAQC,kBAAAA,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,SACA,YACA,GAAG,WACD;AAgBJ,QAAO,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,WAAU;EAAgB;EAAS,GAd7BC,mBAAAA,UAAuB;GACvC,MAAM;GACN;GACA;GACA;GACA,SAAA,oBAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,CAE2D,OAAO;EAAE,GAAI;EAAU,CAAA;EACpF;AAEF,KAAK,UAAUC,oBAAAA;AACf,KAAK,eAAe;AACpB,KAAK,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Marquee.cjs","names":["createVarsResolver","getSpacing","factory","useProps","useStyles","Box","classes"],"sources":["../../../src/components/Marquee/Marquee.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Marquee.module.css';\n\nexport type MarqueeStylesNames = 'root' | 'content' | 'group';\nexport type MarqueeCssVariables = {\n root:\n | '--marquee-duration'\n | '--marquee-gap'\n | '--marquee-repeat'\n | '--marquee-fade-color'\n | '--marquee-fade-size';\n};\n\nexport interface MarqueeProps\n extends BoxProps, StylesApiProps<MarqueeFactory>, ElementProps<'div'> {\n /** Reverses animation direction @default false */\n reverse?: boolean;\n\n /** Pauses animation on hover @default false */\n pauseOnHover?: boolean;\n\n /** Content to scroll */\n children: React.ReactNode;\n\n /** Scroll orientation @default 'horizontal' */\n orientation?: 'horizontal' | 'vertical';\n\n /** Number of times children are repeated inline for seamless scrolling @default 4 */\n repeat?: number;\n\n /** Animation duration in ms @default 40000 */\n duration?: number;\n\n /** Gap between repeated children, key of `theme.spacing` or any valid CSS value @default 'md' */\n gap?: MantineSpacing;\n\n /** Whether to show gradient fade on edges, @default true */\n fadeEdges?: boolean;\n\n /** Color of the fade gradient, @default 'var(--mantine-color-body)' */\n fadeEdgeColor?: string;\n\n /** Size of the fade gradient, @default '5%' */\n fadeEdgeSize?: string;\n}\n\nexport type MarqueeFactory = Factory<{\n props: MarqueeProps;\n ref: HTMLDivElement;\n stylesNames: MarqueeStylesNames;\n vars: MarqueeCssVariables;\n}>;\n\nconst defaultProps = {\n repeat: 4,\n duration: 100_000,\n orientation: 'horizontal',\n fadeEdges: true,\n} satisfies Partial<MarqueeProps>;\n\nconst varsResolver = createVarsResolver<MarqueeFactory>(\n (_, { duration, gap, repeat, fadeEdgeColor, fadeEdgeSize }) => ({\n root: {\n '--marquee-duration': `${duration}ms`,\n '--marquee-gap': getSpacing(gap),\n '--marquee-repeat': (repeat ?? 4).toString(),\n '--marquee-fade-color': fadeEdgeColor,\n '--marquee-fade-size': fadeEdgeSize,\n },\n })\n);\n\nexport const Marquee = factory<MarqueeFactory>((_props) => {\n const props = useProps('Marquee', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n reverse,\n pauseOnHover,\n orientation,\n repeat,\n duration,\n gap,\n fadeEdges,\n fadeEdgeColor,\n fadeEdgeSize,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<MarqueeFactory>({\n name: 'Marquee',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const repeatedChildren = Array(repeat)\n .fill(0)\n .map((_, index) => (\n <div key={index} {...getStyles('group')}>\n {children}\n </div>\n ));\n\n return (\n <Box\n {...getStyles('root')}\n mod={[{ orientation, reverse, pauseOnHover, 'fade-edges': fadeEdges }, mod]}\n {...others}\n >\n <div {...getStyles('content')}>{repeatedChildren}</div>\n </Box>\n );\n});\n\nMarquee.classes = classes;\nMarquee.varsResolver = varsResolver;\nMarquee.displayName = '@mantine/core/Marquee';\n"],"mappings":";;;;;;;;;;;AAiEA,MAAM,eAAe;CACnB,QAAQ;CACR,UAAU;CACV,aAAa;CACb,WAAW;CACZ;AAED,MAAM,eAAeA,6BAAAA,oBAClB,GAAG,EAAE,UAAU,KAAK,QAAQ,eAAe,oBAAoB,EAC9D,MAAM;CACJ,sBAAsB,GAAG,SAAS;CAClC,iBAAiBC,iBAAAA,WAAW,IAAI;CAChC,qBAAqB,UAAU,GAAG,UAAU;CAC5C,wBAAwB;CACxB,uBAAuB;CACxB,EACF,EACF;AAED,MAAa,UAAUC,gBAAAA,SAAyB,WAAW;CACzD,MAAM,QAAQC,kBAAAA,SAAS,WAAW,cAAc,OAAO;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,SACA,cACA,aACA,QACA,UACA,KACA,WACA,eACA,cACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAA0B;EAC1C,MAAM;EACN,SAAA,uBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,mBAAmB,MAAM,OAAO,CACnC,KAAK,EAAE,CACP,KAAK,GAAG,UACP,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAiB,GAAI,UAAU,QAAQ;EACpC;EACG,EAFI,MAEJ,CACN;AAEJ,QACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EACE,GAAI,UAAU,OAAO;EACrB,KAAK,CAAC;GAAE;GAAa;GAAS;GAAc,cAAc;GAAW,EAAE,IAAI;EAC3E,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,GAAI,UAAU,UAAU;aAAG;GAAuB,CAAA;EACnD,CAAA;EAER;AAEF,QAAQ,UAAUC,uBAAAA;AAClB,QAAQ,eAAe;AACvB,QAAQ,cAAc"}
|
|
1
|
+
{"version":3,"file":"Marquee.cjs","names":["createVarsResolver","getSpacing","factory","useProps","useStyles","Box","classes"],"sources":["../../../src/components/Marquee/Marquee.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Marquee.module.css';\n\nexport type MarqueeStylesNames = 'root' | 'content' | 'group';\nexport type MarqueeCssVariables = {\n root:\n | '--marquee-duration'\n | '--marquee-gap'\n | '--marquee-repeat'\n | '--marquee-fade-color'\n | '--marquee-fade-size';\n};\n\nexport interface MarqueeProps\n extends BoxProps, StylesApiProps<MarqueeFactory>, ElementProps<'div'> {\n /** Reverses animation direction @default false */\n reverse?: boolean;\n\n /** Pauses animation on hover @default false */\n pauseOnHover?: boolean;\n\n /** Content to scroll */\n children: React.ReactNode;\n\n /** Scroll orientation @default 'horizontal' */\n orientation?: 'horizontal' | 'vertical';\n\n /** Number of times children are repeated inline for seamless scrolling @default 4 */\n repeat?: number;\n\n /** Animation duration in ms @default 40000 */\n duration?: number;\n\n /** Gap between repeated children, key of `theme.spacing` or any valid CSS value @default 'md' */\n gap?: MantineSpacing;\n\n /** Whether to show gradient fade on edges, @default true */\n fadeEdges?: boolean;\n\n /** Color of the fade gradient, @default 'var(--mantine-color-body)' */\n fadeEdgeColor?: string;\n\n /** Size of the fade gradient, @default '5%' */\n fadeEdgeSize?: string;\n}\n\nexport type MarqueeFactory = Factory<{\n props: MarqueeProps;\n ref: HTMLDivElement;\n stylesNames: MarqueeStylesNames;\n vars: MarqueeCssVariables;\n}>;\n\nconst defaultProps = {\n repeat: 4,\n duration: 100_000,\n orientation: 'horizontal',\n fadeEdges: true,\n} satisfies Partial<MarqueeProps>;\n\nconst varsResolver = createVarsResolver<MarqueeFactory>(\n (_, { duration, gap, repeat, fadeEdgeColor, fadeEdgeSize }) => ({\n root: {\n '--marquee-duration': `${duration}ms`,\n '--marquee-gap': getSpacing(gap),\n '--marquee-repeat': (repeat ?? 4).toString(),\n '--marquee-fade-color': fadeEdgeColor,\n '--marquee-fade-size': fadeEdgeSize,\n },\n })\n);\n\nexport const Marquee = factory<MarqueeFactory>((_props) => {\n const props = useProps('Marquee', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n reverse,\n pauseOnHover,\n orientation,\n repeat,\n duration,\n gap,\n fadeEdges,\n fadeEdgeColor,\n fadeEdgeSize,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<MarqueeFactory>({\n name: 'Marquee',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const repeatedChildren = Array(repeat)\n .fill(0)\n .map((_, index) => (\n <div key={index} {...getStyles('group')}>\n {children}\n </div>\n ));\n\n return (\n <Box\n {...getStyles('root')}\n mod={[{ orientation, reverse, pauseOnHover, 'fade-edges': fadeEdges }, mod]}\n {...others}\n >\n <div {...getStyles('content')}>{repeatedChildren}</div>\n </Box>\n );\n});\n\nMarquee.classes = classes;\nMarquee.varsResolver = varsResolver;\nMarquee.displayName = '@mantine/core/Marquee';\n\nexport namespace Marquee {\n export type Props = MarqueeProps;\n export type StylesNames = MarqueeStylesNames;\n export type CssVariables = MarqueeCssVariables;\n export type Factory = MarqueeFactory;\n}\n"],"mappings":";;;;;;;;;;;AAiEA,MAAM,eAAe;CACnB,QAAQ;CACR,UAAU;CACV,aAAa;CACb,WAAW;CACZ;AAED,MAAM,eAAeA,6BAAAA,oBAClB,GAAG,EAAE,UAAU,KAAK,QAAQ,eAAe,oBAAoB,EAC9D,MAAM;CACJ,sBAAsB,GAAG,SAAS;CAClC,iBAAiBC,iBAAAA,WAAW,IAAI;CAChC,qBAAqB,UAAU,GAAG,UAAU;CAC5C,wBAAwB;CACxB,uBAAuB;CACxB,EACF,EACF;AAED,MAAa,UAAUC,gBAAAA,SAAyB,WAAW;CACzD,MAAM,QAAQC,kBAAAA,SAAS,WAAW,cAAc,OAAO;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,SACA,cACA,aACA,QACA,UACA,KACA,WACA,eACA,cACA,KACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAA0B;EAC1C,MAAM;EACN,SAAA,uBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,mBAAmB,MAAM,OAAO,CACnC,KAAK,EAAE,CACP,KAAK,GAAG,UACP,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAiB,GAAI,UAAU,QAAQ;EACpC;EACG,EAFI,MAEJ,CACN;AAEJ,QACE,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EACE,GAAI,UAAU,OAAO;EACrB,KAAK,CAAC;GAAE;GAAa;GAAS;GAAc,cAAc;GAAW,EAAE,IAAI;EAC3E,GAAI;YAEJ,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,GAAI,UAAU,UAAU;aAAG;GAAuB,CAAA;EACnD,CAAA;EAER;AAEF,QAAQ,UAAUC,uBAAAA;AAClB,QAAQ,eAAe;AACvB,QAAQ,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Menu.cjs","names":["factory","useProps","useStyles","useDelayedHover","getContextItemIndex","useResolvedStylesApi","MenuContextProvider","Popover","classes","MenuItem","MenuLabel","MenuDropdown","MenuTarget","MenuDivider","MenuSub"],"sources":["../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n factory,\n Factory,\n getContextItemIndex,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport { useDelayedHover } from '../../utils/Floating';\nimport { __PopoverProps, Popover, PopoverStylesNames } from '../Popover';\nimport { MenuContextProvider } from './Menu.context';\nimport { MenuDivider } from './MenuDivider/MenuDivider';\nimport { MenuDropdown } from './MenuDropdown/MenuDropdown';\nimport { MenuItem } from './MenuItem/MenuItem';\nimport { MenuLabel } from './MenuLabel/MenuLabel';\nimport { MenuSub } from './MenuSub/MenuSub';\nimport { MenuTarget } from './MenuTarget/MenuTarget';\nimport classes from './Menu.module.css';\n\nexport type MenuStylesNames =\n | 'item'\n | 'itemLabel'\n | 'itemSection'\n | 'label'\n | 'divider'\n | 'chevron'\n | PopoverStylesNames;\n\nexport type MenuFactory = Factory<{\n props: MenuProps;\n stylesNames: MenuStylesNames;\n staticComponents: {\n Item: typeof MenuItem;\n Label: typeof MenuLabel;\n Dropdown: typeof MenuDropdown;\n Target: typeof MenuTarget;\n Divider: typeof MenuDivider;\n Sub: typeof MenuSub;\n };\n}>;\n\nexport interface MenuProps extends __PopoverProps, StylesApiProps<MenuFactory> {\n variant?: string;\n\n /** Menu children */\n children?: React.ReactNode;\n\n /** Controlled menu opened state */\n opened?: boolean;\n\n /** Uncontrolled menu initial opened state */\n defaultOpened?: boolean;\n\n /** If set, focus is trapped within the menu dropdown when it is opened */\n trapFocus?: boolean;\n\n /** Called when menu opened state changes */\n onChange?: (opened: boolean) => void;\n\n /** Called when Menu is opened */\n onOpen?: () => void;\n\n /** Called when Menu is closed */\n onClose?: () => void;\n\n /** If set, the Menu is closed when one of the items is clicked. Can be overridden per item with `closeMenuOnClick` prop */\n closeOnItemClick?: boolean;\n\n /** If set, arrow key presses wrap around from last item to first and vice versa */\n loop?: boolean;\n\n /** If set, the dropdown is closed when the `Escape` key is pressed @default true */\n closeOnEscape?: boolean;\n\n /** Event trigger to open menu. Note: 'hover' is not keyboard accessible; prefer 'click-hover' for accessible hover menus */\n trigger?: 'click' | 'hover' | 'click-hover';\n\n /** Open delay in ms, applicable only to `trigger=\"hover\"` variant */\n openDelay?: number;\n\n /** Close delay in ms, applicable only to `trigger=\"hover\"` variant */\n closeDelay?: number;\n\n /** If set, the dropdown is closed on outside clicks */\n closeOnClickOutside?: boolean;\n\n /** Events that trigger outside click detection. Includes mousedown for desktop clicks, touchstart for mobile, and keydown for Escape key handling @default ['mousedown', 'touchstart', 'keydown'] */\n clickOutsideEvents?: string[];\n\n /** Id base to create accessibility connections */\n id?: string;\n\n /** Set the `tabindex` on all menu items. Use `0` to allow Tab key navigation through menu items (required for navigation menus following WAI-ARIA disclosure pattern). @default -1 */\n menuItemTabIndex?: -1 | 0;\n\n /** Adds a hidden focusable element at the start of the dropdown to prevent unexpected focus jumps when opening with keyboard. Set to false if you need custom focus management. @default true */\n withInitialFocusPlaceholder?: boolean;\n\n /** Determines whether focus should be automatically returned to control when dropdown closes @default `true` */\n returnFocus?: boolean;\n}\n\nconst defaultProps = {\n trapFocus: true,\n closeOnItemClick: true,\n withInitialFocusPlaceholder: true,\n clickOutsideEvents: ['mousedown', 'touchstart', 'keydown'],\n loop: true,\n trigger: 'click',\n openDelay: 0,\n closeDelay: 100,\n menuItemTabIndex: -1,\n} satisfies Partial<MenuProps>;\n\nexport const Menu = factory<MenuFactory>((_props) => {\n const props = useProps('Menu', defaultProps, _props);\n const {\n children,\n onOpen,\n onClose,\n opened,\n defaultOpened,\n trapFocus,\n onChange,\n closeOnItemClick,\n loop,\n closeOnEscape,\n trigger,\n openDelay,\n closeDelay,\n classNames,\n styles,\n unstyled,\n variant,\n vars,\n menuItemTabIndex,\n keepMounted,\n withInitialFocusPlaceholder,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<MenuFactory>({\n name: 'Menu',\n classes,\n props,\n classNames,\n styles,\n unstyled,\n attributes,\n });\n\n const [_opened, setOpened] = useUncontrolled({\n value: opened,\n defaultValue: defaultOpened,\n finalValue: false,\n onChange,\n });\n const [openedViaClick, setOpenedViaClick] = useState(false);\n\n const close = () => {\n setOpened(false);\n setOpenedViaClick(false);\n _opened && onClose?.();\n };\n\n const open = () => {\n setOpened(true);\n !_opened && onOpen?.();\n };\n\n const toggleDropdown = () => {\n _opened ? close() : open();\n };\n\n const { openDropdown, closeDropdown } = useDelayedHover({ open, close, closeDelay, openDelay });\n\n const getItemIndex = (node: HTMLButtonElement) =>\n getContextItemIndex('[data-menu-item]', '[data-menu-dropdown]', node);\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MenuFactory>({\n classNames,\n styles,\n props,\n });\n\n return (\n <MenuContextProvider\n value={{\n getStyles,\n opened: _opened,\n toggleDropdown,\n getItemIndex,\n openedViaClick,\n setOpenedViaClick,\n closeOnItemClick,\n closeDropdown: trigger === 'click' ? close : closeDropdown,\n openDropdown: trigger === 'click' ? open : openDropdown,\n closeDropdownImmediately: close,\n loop,\n trigger,\n unstyled,\n menuItemTabIndex,\n withInitialFocusPlaceholder,\n }}\n >\n <Popover\n returnFocus\n {...others}\n opened={_opened}\n onChange={toggleDropdown}\n defaultOpened={defaultOpened}\n trapFocus={keepMounted ? false : trapFocus}\n closeOnEscape={closeOnEscape}\n __staticSelector=\"Menu\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n variant={variant}\n keepMounted={keepMounted}\n >\n {children}\n </Popover>\n </MenuContextProvider>\n );\n});\n\nMenu.displayName = '@mantine/core/Menu';\nMenu.classes = classes;\nMenu.Item = MenuItem;\nMenu.Label = MenuLabel;\nMenu.Dropdown = MenuDropdown;\nMenu.Target = MenuTarget;\nMenu.Divider = MenuDivider;\nMenu.Sub = MenuSub;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"Menu.cjs","names":["factory","useProps","useStyles","useDelayedHover","getContextItemIndex","useResolvedStylesApi","MenuContextProvider","Popover","classes","MenuItem","MenuLabel","MenuDropdown","MenuTarget","MenuDivider","MenuSub"],"sources":["../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n factory,\n Factory,\n getContextItemIndex,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport { useDelayedHover } from '../../utils/Floating';\nimport { __PopoverProps, Popover, PopoverStylesNames } from '../Popover';\nimport { MenuContextProvider, type MenuContextValue } from './Menu.context';\nimport { MenuDivider, type MenuDividerProps } from './MenuDivider/MenuDivider';\nimport { MenuDropdown, type MenuDropdownProps } from './MenuDropdown/MenuDropdown';\nimport { MenuItem, type MenuItemProps } from './MenuItem/MenuItem';\nimport { MenuLabel, type MenuLabelProps } from './MenuLabel/MenuLabel';\nimport { MenuSub, type MenuSubProps } from './MenuSub/MenuSub';\nimport { MenuTarget, type MenuTargetProps } from './MenuTarget/MenuTarget';\nimport classes from './Menu.module.css';\nimport type { MenuSubDropdownProps } from './MenuSubDropdown/MenuSubDropdown';\nimport type { MenuSubItemProps } from './MenuSubItem/MenuSubItem';\nimport type { MenuSubTargetProps } from './MenuSubTarget/MenuSubTarget';\n\nexport type MenuStylesNames =\n | 'item'\n | 'itemLabel'\n | 'itemSection'\n | 'label'\n | 'divider'\n | 'chevron'\n | PopoverStylesNames;\n\nexport type MenuFactory = Factory<{\n props: MenuProps;\n stylesNames: MenuStylesNames;\n staticComponents: {\n Item: typeof MenuItem;\n Label: typeof MenuLabel;\n Dropdown: typeof MenuDropdown;\n Target: typeof MenuTarget;\n Divider: typeof MenuDivider;\n Sub: typeof MenuSub;\n };\n}>;\n\nexport interface MenuProps extends __PopoverProps, StylesApiProps<MenuFactory> {\n variant?: string;\n\n /** Menu children */\n children?: React.ReactNode;\n\n /** Controlled menu opened state */\n opened?: boolean;\n\n /** Uncontrolled menu initial opened state */\n defaultOpened?: boolean;\n\n /** If set, focus is trapped within the menu dropdown when it is opened */\n trapFocus?: boolean;\n\n /** Called when menu opened state changes */\n onChange?: (opened: boolean) => void;\n\n /** Called when Menu is opened */\n onOpen?: () => void;\n\n /** Called when Menu is closed */\n onClose?: () => void;\n\n /** If set, the Menu is closed when one of the items is clicked. Can be overridden per item with `closeMenuOnClick` prop */\n closeOnItemClick?: boolean;\n\n /** If set, arrow key presses wrap around from last item to first and vice versa */\n loop?: boolean;\n\n /** If set, the dropdown is closed when the `Escape` key is pressed @default true */\n closeOnEscape?: boolean;\n\n /** Event trigger to open menu. Note: 'hover' is not keyboard accessible; prefer 'click-hover' for accessible hover menus */\n trigger?: 'click' | 'hover' | 'click-hover';\n\n /** Open delay in ms, applicable only to `trigger=\"hover\"` variant */\n openDelay?: number;\n\n /** Close delay in ms, applicable only to `trigger=\"hover\"` variant */\n closeDelay?: number;\n\n /** If set, the dropdown is closed on outside clicks */\n closeOnClickOutside?: boolean;\n\n /** Events that trigger outside click detection. Includes mousedown for desktop clicks, touchstart for mobile, and keydown for Escape key handling @default ['mousedown', 'touchstart', 'keydown'] */\n clickOutsideEvents?: string[];\n\n /** Id base to create accessibility connections */\n id?: string;\n\n /** Set the `tabindex` on all menu items. Use `0` to allow Tab key navigation through menu items (required for navigation menus following WAI-ARIA disclosure pattern). @default -1 */\n menuItemTabIndex?: -1 | 0;\n\n /** Adds a hidden focusable element at the start of the dropdown to prevent unexpected focus jumps when opening with keyboard. Set to false if you need custom focus management. @default true */\n withInitialFocusPlaceholder?: boolean;\n\n /** Determines whether focus should be automatically returned to control when dropdown closes @default `true` */\n returnFocus?: boolean;\n}\n\nconst defaultProps = {\n trapFocus: true,\n closeOnItemClick: true,\n withInitialFocusPlaceholder: true,\n clickOutsideEvents: ['mousedown', 'touchstart', 'keydown'],\n loop: true,\n trigger: 'click',\n openDelay: 0,\n closeDelay: 100,\n menuItemTabIndex: -1,\n} satisfies Partial<MenuProps>;\n\nexport const Menu = factory<MenuFactory>((_props) => {\n const props = useProps('Menu', defaultProps, _props);\n const {\n children,\n onOpen,\n onClose,\n opened,\n defaultOpened,\n trapFocus,\n onChange,\n closeOnItemClick,\n loop,\n closeOnEscape,\n trigger,\n openDelay,\n closeDelay,\n classNames,\n styles,\n unstyled,\n variant,\n vars,\n menuItemTabIndex,\n keepMounted,\n withInitialFocusPlaceholder,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<MenuFactory>({\n name: 'Menu',\n classes,\n props,\n classNames,\n styles,\n unstyled,\n attributes,\n });\n\n const [_opened, setOpened] = useUncontrolled({\n value: opened,\n defaultValue: defaultOpened,\n finalValue: false,\n onChange,\n });\n const [openedViaClick, setOpenedViaClick] = useState(false);\n\n const close = () => {\n setOpened(false);\n setOpenedViaClick(false);\n _opened && onClose?.();\n };\n\n const open = () => {\n setOpened(true);\n !_opened && onOpen?.();\n };\n\n const toggleDropdown = () => {\n _opened ? close() : open();\n };\n\n const { openDropdown, closeDropdown } = useDelayedHover({ open, close, closeDelay, openDelay });\n\n const getItemIndex = (node: HTMLButtonElement) =>\n getContextItemIndex('[data-menu-item]', '[data-menu-dropdown]', node);\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MenuFactory>({\n classNames,\n styles,\n props,\n });\n\n return (\n <MenuContextProvider\n value={{\n getStyles,\n opened: _opened,\n toggleDropdown,\n getItemIndex,\n openedViaClick,\n setOpenedViaClick,\n closeOnItemClick,\n closeDropdown: trigger === 'click' ? close : closeDropdown,\n openDropdown: trigger === 'click' ? open : openDropdown,\n closeDropdownImmediately: close,\n loop,\n trigger,\n unstyled,\n menuItemTabIndex,\n withInitialFocusPlaceholder,\n }}\n >\n <Popover\n returnFocus\n {...others}\n opened={_opened}\n onChange={toggleDropdown}\n defaultOpened={defaultOpened}\n trapFocus={keepMounted ? false : trapFocus}\n closeOnEscape={closeOnEscape}\n __staticSelector=\"Menu\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n variant={variant}\n keepMounted={keepMounted}\n >\n {children}\n </Popover>\n </MenuContextProvider>\n );\n});\n\nMenu.displayName = '@mantine/core/Menu';\nMenu.classes = classes;\nMenu.Item = MenuItem;\nMenu.Label = MenuLabel;\nMenu.Dropdown = MenuDropdown;\nMenu.Target = MenuTarget;\nMenu.Divider = MenuDivider;\nMenu.Sub = MenuSub;\n\nexport namespace Menu {\n export type Props = MenuProps;\n export type StylesNames = MenuStylesNames;\n export type Factory = MenuFactory;\n export type ContextValue = MenuContextValue;\n\n export namespace Item {\n export type Props = MenuItemProps;\n }\n\n export namespace Label {\n export type Props = MenuLabelProps;\n }\n\n export namespace Divider {\n export type Props = MenuDividerProps;\n }\n\n export namespace Dropdown {\n export type Props = MenuDropdownProps;\n }\n\n export namespace Target {\n export type Props = MenuTargetProps;\n }\n\n export namespace Sub {\n export type Props = MenuSubProps;\n }\n\n export namespace SubDropdown {\n export type Props = MenuSubDropdownProps;\n }\n\n export namespace SubItem {\n export type Props = MenuSubItemProps;\n }\n\n export namespace SubTarget {\n export type Props = MenuSubTargetProps;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA4GA,MAAM,eAAe;CACnB,WAAW;CACX,kBAAkB;CAClB,6BAA6B;CAC7B,oBAAoB;EAAC;EAAa;EAAc;EAAU;CAC1D,MAAM;CACN,SAAS;CACT,WAAW;CACX,YAAY;CACZ,kBAAkB;CACnB;AAED,MAAa,OAAOA,gBAAAA,SAAsB,WAAW;CACnD,MAAM,QAAQC,kBAAAA,SAAS,QAAQ,cAAc,OAAO;CACpD,MAAM,EACJ,UACA,QACA,SACA,QACA,eACA,WACA,UACA,kBACA,MACA,eACA,SACA,WACA,YACA,YACA,QACA,UACA,SACA,MACA,kBACA,aACA,6BACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAuB;EACvC,MAAM;EACN,SAAA,oBAAA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,CAAC,SAAS,cAAA,GAAA,eAAA,iBAA6B;EAC3C,OAAO;EACP,cAAc;EACd,YAAY;EACZ;EACD,CAAC;CACF,MAAM,CAAC,gBAAgB,sBAAA,GAAA,MAAA,UAA8B,MAAM;CAE3D,MAAM,cAAc;AAClB,YAAU,MAAM;AAChB,oBAAkB,MAAM;AACxB,aAAW,WAAW;;CAGxB,MAAM,aAAa;AACjB,YAAU,KAAK;AACf,GAAC,WAAW,UAAU;;CAGxB,MAAM,uBAAuB;AAC3B,YAAU,OAAO,GAAG,MAAM;;CAG5B,MAAM,EAAE,cAAc,kBAAkBC,0BAAAA,gBAAgB;EAAE;EAAM;EAAO;EAAY;EAAW,CAAC;CAE/F,MAAM,gBAAgB,SACpBC,+BAAAA,oBAAoB,oBAAoB,wBAAwB,KAAK;CAEvE,MAAM,EAAE,oBAAoB,mBAAmBC,gCAAAA,qBAAkC;EAC/E;EACA;EACA;EACD,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,qBAAAA,qBAAD;EACE,OAAO;GACL;GACA,QAAQ;GACR;GACA;GACA;GACA;GACA;GACA,eAAe,YAAY,UAAU,QAAQ;GAC7C,cAAc,YAAY,UAAU,OAAO;GAC3C,0BAA0B;GAC1B;GACA;GACA;GACA;GACA;GACD;YAED,iBAAA,GAAA,kBAAA,KAACC,gBAAAA,SAAD;GACE,aAAA;GACA,GAAI;GACJ,QAAQ;GACR,UAAU;GACK;GACf,WAAW,cAAc,QAAQ;GAClB;GACf,kBAAiB;GACjB,YAAY;GACZ,QAAQ;GACE;GACD;GACI;GAEZ;GACO,CAAA;EACU,CAAA;EAExB;AAEF,KAAK,cAAc;AACnB,KAAK,UAAUC,oBAAAA;AACf,KAAK,OAAOC,iBAAAA;AACZ,KAAK,QAAQC,kBAAAA;AACb,KAAK,WAAWC,qBAAAA;AAChB,KAAK,SAASC,mBAAAA;AACd,KAAK,UAAUC,oBAAAA;AACf,KAAK,MAAMC,gBAAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.cjs","names":["getDefaultZIndex","factory","useProps","ModalStackContext","ModalRoot","ModalOverlay","ModalContent","ModalHeader","ModalTitle","ModalCloseButton","ModalBody","classes","ModalStack"],"sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import { use, useEffect } from 'react';\nimport { factory, Factory, getDefaultZIndex, useProps } from '../../core';\nimport { ModalBaseCloseButtonProps, ModalBaseOverlayProps } from '../ModalBase';\nimport { ModalBody } from './ModalBody';\nimport { ModalCloseButton } from './ModalCloseButton';\nimport { ModalContent } from './ModalContent';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalOverlay } from './ModalOverlay';\nimport {\n ModalRoot,\n ModalRootCssVariables,\n ModalRootProps,\n ModalRootStylesNames,\n} from './ModalRoot';\nimport { ModalStack, ModalStackContext } from './ModalStack';\nimport { ModalTitle } from './ModalTitle';\nimport classes from './Modal.module.css';\
|
|
1
|
+
{"version":3,"file":"Modal.cjs","names":["getDefaultZIndex","factory","useProps","ModalStackContext","ModalRoot","ModalOverlay","ModalContent","ModalHeader","ModalTitle","ModalCloseButton","ModalBody","classes","ModalStack"],"sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import { use, useEffect } from 'react';\nimport { factory, Factory, getDefaultZIndex, useProps } from '../../core';\nimport { ModalBaseCloseButtonProps, ModalBaseOverlayProps } from '../ModalBase';\nimport { ModalBody, type ModalBodyProps } from './ModalBody';\nimport { ModalCloseButton, type ModalCloseButtonProps } from './ModalCloseButton';\nimport { ModalContent, type ModalContentProps } from './ModalContent';\nimport { ModalHeader, type ModalHeaderProps } from './ModalHeader';\nimport { ModalOverlay, type ModalOverlayProps } from './ModalOverlay';\nimport {\n ModalRoot,\n ModalRootCssVariables,\n ModalRootProps,\n ModalRootStylesNames,\n} from './ModalRoot';\nimport { ModalStack, ModalStackContext, type ModalStackProps } from './ModalStack';\nimport { ModalTitle, type ModalTitleProps } from './ModalTitle';\nimport classes from './Modal.module.css';\nexport type ModalStylesNames = ModalRootStylesNames;\nexport type ModalCssVariables = ModalRootCssVariables;\n\nexport interface ModalProps extends ModalRootProps {\n __staticSelector?: string;\n\n /** Modal title */\n title?: React.ReactNode;\n\n /** If set, the overlay is rendered @default true */\n withOverlay?: boolean;\n\n /** Props passed down to the `Overlay` component, use to configure opacity, `background-color`, styles and other properties */\n overlayProps?: ModalBaseOverlayProps;\n\n /** Modal content */\n children?: React.ReactNode;\n\n /** If set, the close button is rendered @default true */\n withCloseButton?: boolean;\n\n /** Props passed down to the close button */\n closeButtonProps?: ModalBaseCloseButtonProps;\n\n /** Id of the modal in the `Modal.Stack` */\n stackId?: string;\n}\n\nexport type ModalFactory = Factory<{\n props: ModalProps;\n ref: HTMLDivElement;\n stylesNames: ModalStylesNames;\n vars: ModalCssVariables;\n staticComponents: {\n Root: typeof ModalRoot;\n Overlay: typeof ModalOverlay;\n Content: typeof ModalContent;\n Body: typeof ModalBody;\n Header: typeof ModalHeader;\n Title: typeof ModalTitle;\n CloseButton: typeof ModalCloseButton;\n Stack: typeof ModalStack;\n };\n}>;\n\nconst defaultProps = {\n closeOnClickOutside: true,\n withinPortal: true,\n lockScroll: true,\n trapFocus: true,\n returnFocus: true,\n closeOnEscape: true,\n keepMounted: false,\n zIndex: getDefaultZIndex('modal'),\n transitionProps: { duration: 200, transition: 'fade-down' },\n withOverlay: true,\n withCloseButton: true,\n} satisfies Partial<ModalProps>;\n\nexport const Modal = factory<ModalFactory>((_props) => {\n const {\n title,\n withOverlay,\n overlayProps,\n withCloseButton,\n closeButtonProps,\n children,\n radius,\n opened,\n stackId,\n zIndex,\n ...others\n } = useProps('Modal', defaultProps, _props);\n const ctx = use(ModalStackContext);\n const hasHeader = !!title || withCloseButton;\n const stackProps =\n ctx && stackId\n ? {\n closeOnEscape: ctx.currentId === stackId,\n trapFocus: ctx.currentId === stackId,\n zIndex: ctx.getZIndex(stackId),\n }\n : {};\n\n const overlayVisible =\n withOverlay === false ? false : stackId && ctx ? ctx.currentId === stackId : opened;\n\n useEffect(() => {\n if (ctx && stackId) {\n opened\n ? ctx.addModal(stackId, zIndex || getDefaultZIndex('modal'))\n : ctx.removeModal(stackId);\n }\n }, [opened, stackId, zIndex]);\n\n return (\n <ModalRoot\n radius={radius}\n opened={opened}\n zIndex={ctx && stackId ? ctx.getZIndex(stackId) : zIndex}\n {...others}\n {...stackProps}\n >\n {withOverlay && (\n <ModalOverlay\n visible={overlayVisible}\n transitionProps={ctx && stackId ? { duration: 0 } : undefined}\n {...overlayProps}\n />\n )}\n <ModalContent\n radius={radius}\n __hidden={ctx && stackId && opened ? stackId !== ctx.currentId : false}\n >\n {hasHeader && (\n <ModalHeader>\n {title && <ModalTitle>{title}</ModalTitle>}\n {withCloseButton && <ModalCloseButton {...closeButtonProps} />}\n </ModalHeader>\n )}\n\n <ModalBody>{children}</ModalBody>\n </ModalContent>\n </ModalRoot>\n );\n});\n\nModal.classes = classes;\nModal.displayName = '@mantine/core/Modal';\nModal.Root = ModalRoot;\nModal.Overlay = ModalOverlay;\nModal.Content = ModalContent;\nModal.Body = ModalBody;\nModal.Header = ModalHeader;\nModal.Title = ModalTitle;\nModal.CloseButton = ModalCloseButton;\nModal.Stack = ModalStack;\n\nexport namespace Modal {\n export type Props = ModalProps;\n export type StylesNames = ModalStylesNames;\n export type CssVariables = ModalCssVariables;\n export type Factory = ModalFactory;\n\n export namespace Root {\n export type Props = ModalRootProps;\n }\n\n export namespace Body {\n export type Props = ModalBodyProps;\n }\n\n export namespace CloseButton {\n export type Props = ModalCloseButtonProps;\n }\n\n export namespace Content {\n export type Props = ModalContentProps;\n }\n\n export namespace Header {\n export type Props = ModalHeaderProps;\n }\n\n export namespace Overlay {\n export type Props = ModalOverlayProps;\n }\n\n export namespace Title {\n export type Props = ModalTitleProps;\n }\n\n export namespace Stack {\n export type Props = ModalStackProps;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AA8DA,MAAM,eAAe;CACnB,qBAAqB;CACrB,cAAc;CACd,YAAY;CACZ,WAAW;CACX,aAAa;CACb,eAAe;CACf,aAAa;CACb,QAAQA,4BAAAA,iBAAiB,QAAQ;CACjC,iBAAiB;EAAE,UAAU;EAAK,YAAY;EAAa;CAC3D,aAAa;CACb,iBAAiB;CAClB;AAED,MAAa,QAAQC,gBAAAA,SAAuB,WAAW;CACrD,MAAM,EACJ,OACA,aACA,cACA,iBACA,kBACA,UACA,QACA,QACA,SACA,QACA,GAAG,WACDC,kBAAAA,SAAS,SAAS,cAAc,OAAO;CAC3C,MAAM,OAAA,GAAA,MAAA,KAAUC,mBAAAA,kBAAkB;CAClC,MAAM,YAAY,CAAC,CAAC,SAAS;CAC7B,MAAM,aACJ,OAAO,UACH;EACE,eAAe,IAAI,cAAc;EACjC,WAAW,IAAI,cAAc;EAC7B,QAAQ,IAAI,UAAU,QAAQ;EAC/B,GACD,EAAE;CAER,MAAM,iBACJ,gBAAgB,QAAQ,QAAQ,WAAW,MAAM,IAAI,cAAc,UAAU;AAE/E,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,OAAO,QACT,UACI,IAAI,SAAS,SAAS,UAAUH,4BAAAA,iBAAiB,QAAQ,CAAC,GAC1D,IAAI,YAAY,QAAQ;IAE7B;EAAC;EAAQ;EAAS;EAAO,CAAC;AAE7B,QACE,iBAAA,GAAA,kBAAA,MAACI,kBAAAA,WAAD;EACU;EACA;EACR,QAAQ,OAAO,UAAU,IAAI,UAAU,QAAQ,GAAG;EAClD,GAAI;EACJ,GAAI;YALN,CAOG,eACC,iBAAA,GAAA,kBAAA,KAACC,qBAAAA,cAAD;GACE,SAAS;GACT,iBAAiB,OAAO,UAAU,EAAE,UAAU,GAAG,GAAG,KAAA;GACpD,GAAI;GACJ,CAAA,EAEJ,iBAAA,GAAA,kBAAA,MAACC,qBAAAA,cAAD;GACU;GACR,UAAU,OAAO,WAAW,SAAS,YAAY,IAAI,YAAY;aAFnE,CAIG,aACC,iBAAA,GAAA,kBAAA,MAACC,oBAAAA,aAAD,EAAA,UAAA,CACG,SAAS,iBAAA,GAAA,kBAAA,KAACC,mBAAAA,YAAD,EAAA,UAAa,OAAmB,CAAA,EACzC,mBAAmB,iBAAA,GAAA,kBAAA,KAACC,yBAAAA,kBAAD,EAAkB,GAAI,kBAAoB,CAAA,CAClD,EAAA,CAAA,EAGhB,iBAAA,GAAA,kBAAA,KAACC,kBAAAA,WAAD,EAAY,UAAqB,CAAA,CACpB;KACL;;EAEd;AAEF,MAAM,UAAUC,qBAAAA;AAChB,MAAM,cAAc;AACpB,MAAM,OAAOP,kBAAAA;AACb,MAAM,UAAUC,qBAAAA;AAChB,MAAM,UAAUC,qBAAAA;AAChB,MAAM,OAAOI,kBAAAA;AACb,MAAM,SAASH,oBAAAA;AACf,MAAM,QAAQC,mBAAAA;AACd,MAAM,cAAcC,yBAAAA;AACpB,MAAM,QAAQG,mBAAAA"}
|
|
@@ -36,7 +36,7 @@ const defaultProps = {
|
|
|
36
36
|
};
|
|
37
37
|
const MultiSelect = require_factory.genericFactory((_props) => {
|
|
38
38
|
const props = require_use_props.useProps("MultiSelect", defaultProps, _props);
|
|
39
|
-
const { classNames, className, style, styles, unstyled, vars, size, value, defaultValue, onChange, onKeyDown, variant, data, dropdownOpened, defaultDropdownOpened, onDropdownOpen, onDropdownClose, selectFirstOptionOnChange, selectFirstOptionOnDropdownOpen, onOptionSubmit, comboboxProps, filter, limit, withScrollArea, maxDropdownHeight, searchValue, defaultSearchValue, onSearchChange, readOnly, disabled, onFocus, onBlur, radius, rightSection, rightSectionWidth, rightSectionPointerEvents, rightSectionProps, leftSection, leftSectionWidth, leftSectionPointerEvents, leftSectionProps, inputContainer, inputWrapperOrder, withAsterisk, labelProps, descriptionProps, errorProps, wrapperProps, description, label, error, maxValues, searchable, nothingFoundMessage, withCheckIcon, withAlignedLabels, checkIconPosition, hidePickedOptions, withErrorStyles, name, form, id, clearable, clearSectionMode, clearButtonProps, hiddenInputProps, placeholder, hiddenInputValuesDivider, required, mod, renderOption, renderPill, onRemove, onClear, onMaxValues, scrollAreaProps, chevronColor, attributes, clearSearchOnChange, openOnFocus, ...others } = props;
|
|
39
|
+
const { classNames, className, style, styles, unstyled, vars, size, value, defaultValue, onChange, onKeyDown, variant, data, dropdownOpened, defaultDropdownOpened, onDropdownOpen, onDropdownClose, selectFirstOptionOnChange, selectFirstOptionOnDropdownOpen, onOptionSubmit, comboboxProps, filter, limit, withScrollArea, maxDropdownHeight, searchValue, defaultSearchValue, onSearchChange, readOnly, disabled, onFocus, onBlur, radius, rightSection, rightSectionWidth, rightSectionPointerEvents, rightSectionProps, leftSection, leftSectionWidth, leftSectionPointerEvents, leftSectionProps, inputContainer, inputWrapperOrder, withAsterisk, labelProps, descriptionProps, errorProps, wrapperProps, description, label, error, maxValues, searchable, nothingFoundMessage, withCheckIcon, withAlignedLabels, checkIconPosition, hidePickedOptions, withErrorStyles, name, form, id, clearable, clearSectionMode, clearButtonProps, hiddenInputProps, placeholder, hiddenInputValuesDivider, required, mod, renderOption, renderPill, onRemove, onClear, onMaxValues, scrollAreaProps, chevronColor, attributes, clearSearchOnChange, openOnFocus, loading, loadingPosition, ...others } = props;
|
|
40
40
|
const _id = (0, _mantine_hooks.useId)(id);
|
|
41
41
|
const parsedData = require_get_parsed_combobox_data.getParsedComboboxData(data);
|
|
42
42
|
const optionsLockup = require_get_options_lockup.getOptionsLockup(parsedData);
|
|
@@ -189,6 +189,8 @@ const MultiSelect = require_factory.genericFactory((_props) => {
|
|
|
189
189
|
leftSectionWidth,
|
|
190
190
|
leftSectionPointerEvents,
|
|
191
191
|
leftSectionProps,
|
|
192
|
+
loading,
|
|
193
|
+
loadingPosition,
|
|
192
194
|
inputContainer,
|
|
193
195
|
inputWrapperOrder,
|
|
194
196
|
withAsterisk,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelect.cjs","names":["genericFactory","useProps","getParsedComboboxData","getOptionsLockup","useCombobox","extractStyleProps","useStyles","useResolvedStylesApi","Fragment","Pill","Combobox","filterPickedValues","PillsInput","OptionsDropdown","InputBase"],"sources":["../../../src/components/MultiSelect/MultiSelect.tsx"],"sourcesContent":["import { Fragment, useEffect, useRef } from 'react';\nimport { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n extractStyleProps,\n Factory,\n genericFactory,\n MantineColor,\n Primitive,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport {\n Combobox,\n ComboboxItem,\n ComboboxLikeProps,\n ComboboxLikeRenderOptionInput,\n ComboboxLikeStylesNames,\n ComboboxRenderPillInput,\n getOptionsLockup,\n getParsedComboboxData,\n OptionsDropdown,\n OptionsFilter,\n useCombobox,\n} from '../Combobox';\nimport {\n __BaseInputProps,\n __InputStylesNames,\n ClearSectionMode,\n InputClearButtonProps,\n} from '../Input';\nimport { InputBase } from '../InputBase';\nimport { Pill } from '../Pill';\nimport { PillsInput } from '../PillsInput';\nimport { ScrollAreaProps } from '../ScrollArea';\nimport { filterPickedValues } from './filter-picked-values';\n\nconst clearSectionOffset: Record<string, number> = {\n xs: 41,\n sm: 50,\n md: 60,\n lg: 72,\n xl: 89,\n};\n\nexport type MultiSelectStylesNames =\n | __InputStylesNames\n | ComboboxLikeStylesNames\n | 'pill'\n | 'pillsList'\n | 'inputField';\n\nexport interface MultiSelectProps<Value extends Primitive = string>\n extends\n BoxProps,\n __BaseInputProps,\n ComboboxLikeProps<Value>,\n StylesApiProps<MultiSelectFactory>,\n ElementProps<'input', 'size' | 'value' | 'defaultValue' | 'onChange'> {\n /** Controlled component value */\n value?: Value[];\n\n /** Uncontrolled component default value */\n defaultValue?: Value[];\n\n /** Called when value changes */\n onChange?: (value: Value[]) => void;\n\n /** Called with `value` of the removed item */\n onRemove?: (value: Value) => void;\n\n /** Called when the clear button is clicked */\n onClear?: () => void;\n\n /** Called when user attemps to select more values than allowed */\n onMaxValues?: () => void;\n\n /** Controlled search value */\n searchValue?: string;\n\n /** Default search value */\n defaultSearchValue?: string;\n\n /** Called when search changes */\n onSearchChange?: (value: string) => void;\n\n /** Maximum number of values, no limit if not set */\n maxValues?: number;\n\n /** Allows searching through options by user input @default false */\n searchable?: boolean;\n\n /** Message displayed when no options match the search query (when searchable is enabled) or when the data array is empty. If not set, the dropdown will be hidden instead. */\n nothingFoundMessage?: React.ReactNode;\n\n /** If set, the check icon is displayed near the selected option label @default true */\n withCheckIcon?: boolean;\n\n /** If set, unchecked labels are aligned with checked ones @default false */\n withAlignedLabels?: boolean;\n\n /** Position of the checkmark icon shown next to selected options in the dropdown @default 'left' */\n checkIconPosition?: 'left' | 'right';\n\n /** When enabled, selected options are hidden from the dropdown list @default false */\n hidePickedOptions?: boolean;\n\n /** When enabled, displays a clear button to remove all selected values (hidden when component is empty, disabled, or read-only) @default false */\n clearable?: boolean;\n\n /** Determines how the clear button and rightSection are rendered @default 'both' */\n clearSectionMode?: ClearSectionMode;\n\n /** Props passed down to the clear button */\n clearButtonProps?: InputClearButtonProps;\n\n /** Props passed down to the hidden input */\n hiddenInputProps?: Omit<React.ComponentProps<'input'>, 'value'>;\n\n /** Divider used to separate values in the hidden input `value` attribute @default ',' */\n hiddenInputValuesDivider?: string;\n\n /** A function to render content of the option, replaces the default content of the option */\n renderOption?: (item: ComboboxLikeRenderOptionInput<ComboboxItem>) => React.ReactNode;\n\n /** A function to render content of the pill */\n renderPill?: (props: ComboboxRenderPillInput<Value>) => React.ReactNode;\n\n /** Props passed down to the underlying `ScrollArea` component in the dropdown */\n scrollAreaProps?: ScrollAreaProps;\n\n /** Controls color of the default chevron */\n chevronColor?: MantineColor;\n\n /** Clear search value when item is selected @default true */\n clearSearchOnChange?: boolean;\n\n /** Controls whether dropdown opens when the input receives focus @default true */\n openOnFocus?: boolean;\n}\n\nexport type MultiSelectFactory = Factory<{\n props: MultiSelectProps;\n ref: HTMLInputElement;\n stylesNames: MultiSelectStylesNames;\n signature: <Value extends Primitive = string>(\n props: MultiSelectProps<Value>\n ) => React.JSX.Element;\n}>;\n\nconst defaultProps = {\n maxValues: Infinity,\n withCheckIcon: true,\n checkIconPosition: 'left',\n hiddenInputValuesDivider: ',',\n clearSearchOnChange: true,\n openOnFocus: true,\n size: 'sm',\n} satisfies Partial<MultiSelectProps>;\n\nexport const MultiSelect = genericFactory<MultiSelectFactory>((_props) => {\n const props = useProps('MultiSelect', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n size,\n value,\n defaultValue,\n onChange,\n onKeyDown,\n variant,\n data,\n dropdownOpened,\n defaultDropdownOpened,\n onDropdownOpen,\n onDropdownClose,\n selectFirstOptionOnChange,\n selectFirstOptionOnDropdownOpen,\n onOptionSubmit,\n comboboxProps,\n filter,\n limit,\n withScrollArea,\n maxDropdownHeight,\n searchValue,\n defaultSearchValue,\n onSearchChange,\n readOnly,\n disabled,\n onFocus,\n onBlur,\n radius,\n rightSection,\n rightSectionWidth,\n rightSectionPointerEvents,\n rightSectionProps,\n leftSection,\n leftSectionWidth,\n leftSectionPointerEvents,\n leftSectionProps,\n inputContainer,\n inputWrapperOrder,\n withAsterisk,\n labelProps,\n descriptionProps,\n errorProps,\n wrapperProps,\n description,\n label,\n error,\n maxValues,\n searchable,\n nothingFoundMessage,\n withCheckIcon,\n withAlignedLabels,\n checkIconPosition,\n hidePickedOptions,\n withErrorStyles,\n name,\n form,\n id,\n clearable,\n clearSectionMode,\n clearButtonProps,\n hiddenInputProps,\n placeholder,\n hiddenInputValuesDivider,\n required,\n mod,\n renderOption,\n renderPill,\n onRemove,\n onClear,\n onMaxValues,\n scrollAreaProps,\n chevronColor,\n attributes,\n clearSearchOnChange,\n openOnFocus,\n ...others\n } = props;\n\n const _id = useId(id);\n const parsedData = getParsedComboboxData(data);\n const optionsLockup = getOptionsLockup(parsedData);\n const retainedSelectedOptions = useRef<Record<string, ComboboxItem<Primitive>>>({});\n\n const combobox = useCombobox({\n opened: dropdownOpened,\n defaultOpened: defaultDropdownOpened,\n onDropdownOpen: () => {\n onDropdownOpen?.();\n if (selectFirstOptionOnDropdownOpen) {\n combobox.selectFirstOption();\n }\n },\n onDropdownClose: () => {\n onDropdownClose?.();\n combobox.resetSelectedOption();\n },\n });\n\n const {\n styleProps,\n rest: { type, autoComplete, ...rest },\n } = extractStyleProps(others);\n\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: [],\n onChange,\n });\n\n const [_searchValue, setSearchValue] = useUncontrolled({\n value: searchValue,\n defaultValue: defaultSearchValue,\n finalValue: '',\n onChange: onSearchChange,\n });\n\n const handleSearchChange = (value: string) => {\n setSearchValue(value);\n combobox.resetSelectedOption();\n };\n\n const getStyles = useStyles<MultiSelectFactory>({\n name: 'MultiSelect',\n classes: {} as any,\n props: props as any,\n classNames,\n styles,\n unstyled,\n attributes,\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MultiSelectFactory>({\n props,\n styles,\n classNames,\n });\n\n const handleInputKeydown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n\n if (event.key === ' ' && !searchable) {\n event.preventDefault();\n combobox.toggleDropdown();\n }\n\n if (event.key === 'Backspace' && _searchValue.length === 0 && _value.length > 0) {\n onRemove?.(_value[_value.length - 1]);\n setValue(_value.slice(0, _value.length - 1));\n }\n };\n\n const values = _value.map((item, index) => {\n const optionData = optionsLockup[`${item}`] || retainedSelectedOptions.current[`${item}`];\n\n if (renderPill) {\n return (\n <Fragment key={`${item}-${index}`}>\n {renderPill({\n option: optionData,\n value: item,\n onRemove: () => {\n setValue(_value.filter((i) => item !== i));\n onRemove?.(item);\n },\n disabled,\n })}\n </Fragment>\n );\n }\n\n return (\n <Pill\n key={`${item}-${index}`}\n withRemoveButton={!readOnly && !optionsLockup[`${item}`]?.disabled}\n onRemove={() => {\n setValue(_value.filter((i) => item !== i));\n onRemove?.(item);\n }}\n unstyled={unstyled}\n disabled={disabled}\n {...getStyles('pill')}\n >\n {optionData?.label || item}\n </Pill>\n );\n });\n\n useEffect(() => {\n if (selectFirstOptionOnChange) {\n combobox.selectFirstOption();\n }\n }, [selectFirstOptionOnChange, _searchValue]);\n\n useEffect(() => {\n _value.forEach((val) => {\n if (`${val}` in optionsLockup) {\n retainedSelectedOptions.current[`${val}`] = optionsLockup[`${val}`];\n }\n });\n }, [optionsLockup, _value]);\n\n const clearButton = (\n <Combobox.ClearButton\n {...clearButtonProps}\n onClear={() => {\n onClear?.();\n setValue([]);\n handleSearchChange('');\n }}\n />\n );\n\n const filteredData = filterPickedValues({ data: parsedData, value: _value });\n const _clearable = clearable && _value.length > 0 && !disabled && !readOnly;\n const pillsListStyle = _clearable\n ? { paddingInlineEnd: clearSectionOffset[size] ?? clearSectionOffset.sm }\n : undefined;\n\n return (\n <>\n <Combobox\n store={combobox}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n size={size}\n readOnly={readOnly}\n __staticSelector=\"MultiSelect\"\n attributes={attributes}\n onOptionSubmit={(val) => {\n onOptionSubmit?.(val as any);\n if (clearSearchOnChange) {\n handleSearchChange('');\n }\n combobox.updateSelectedOptionIndex('selected');\n\n if (_value.includes(optionsLockup[`${val}`].value as any)) {\n setValue(_value.filter((v) => v !== optionsLockup[`${val}`].value));\n onRemove?.(optionsLockup[`${val}`].value as any);\n } else if (_value.length < maxValues) {\n setValue([..._value, optionsLockup[`${val}`].value] as any);\n } else {\n onMaxValues?.();\n }\n }}\n {...comboboxProps}\n >\n <Combobox.DropdownTarget>\n <PillsInput\n {...styleProps}\n __staticSelector=\"MultiSelect\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n size={size}\n className={className}\n style={style}\n variant={variant}\n disabled={disabled}\n radius={radius}\n __defaultRightSection={\n <Combobox.Chevron\n size={size}\n error={error}\n unstyled={unstyled}\n color={chevronColor}\n />\n }\n __clearSection={clearButton}\n __clearable={_clearable}\n __clearSectionMode={clearSectionMode}\n rightSection={rightSection}\n rightSectionPointerEvents={rightSectionPointerEvents || 'none'}\n rightSectionWidth={rightSectionWidth}\n rightSectionProps={rightSectionProps}\n leftSection={leftSection}\n leftSectionWidth={leftSectionWidth}\n leftSectionPointerEvents={leftSectionPointerEvents}\n leftSectionProps={leftSectionProps}\n inputContainer={inputContainer}\n inputWrapperOrder={inputWrapperOrder}\n withAsterisk={withAsterisk}\n labelProps={labelProps}\n descriptionProps={descriptionProps}\n errorProps={errorProps}\n wrapperProps={wrapperProps}\n description={description}\n label={label}\n error={error}\n withErrorStyles={withErrorStyles}\n __stylesApiProps={{\n ...props,\n rightSectionPointerEvents: rightSectionPointerEvents || 'none',\n multiline: true,\n }}\n pointer={!searchable}\n onClick={() => (searchable ? combobox.openDropdown() : combobox.toggleDropdown())}\n data-expanded={combobox.dropdownOpened || undefined}\n id={_id}\n required={required}\n mod={mod}\n attributes={attributes}\n >\n <Pill.Group\n attributes={attributes}\n disabled={disabled}\n unstyled={unstyled}\n {...getStyles('pillsList', { style: pillsListStyle })}\n >\n {values}\n <Combobox.EventsTarget autoComplete={autoComplete} withExpandedAttribute>\n <PillsInput.Field\n {...rest}\n id={_id}\n placeholder={placeholder}\n type={!searchable && !placeholder ? 'hidden' : 'visible'}\n {...getStyles('inputField')}\n unstyled={unstyled}\n onFocus={(event) => {\n onFocus?.(event);\n openOnFocus && searchable && combobox.openDropdown();\n }}\n onBlur={(event) => {\n onBlur?.(event);\n combobox.closeDropdown();\n handleSearchChange('');\n }}\n onKeyDown={handleInputKeydown}\n value={_searchValue}\n onChange={(event) => {\n handleSearchChange(event.currentTarget.value);\n searchable && combobox.openDropdown();\n selectFirstOptionOnChange && combobox.selectFirstOption();\n }}\n disabled={disabled}\n readOnly={readOnly || !searchable}\n pointer={!searchable}\n />\n </Combobox.EventsTarget>\n </Pill.Group>\n </PillsInput>\n </Combobox.DropdownTarget>\n\n <OptionsDropdown\n data={hidePickedOptions ? filteredData : parsedData}\n hidden={readOnly || disabled}\n filter={filter as OptionsFilter<Primitive> | undefined}\n search={_searchValue}\n limit={limit}\n hiddenWhenEmpty={!nothingFoundMessage}\n withScrollArea={withScrollArea}\n maxDropdownHeight={maxDropdownHeight}\n filterOptions={searchable}\n value={_value}\n checkIconPosition={checkIconPosition}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n nothingFoundMessage={nothingFoundMessage}\n unstyled={unstyled}\n labelId={label ? `${_id}-label` : undefined}\n aria-label={label ? undefined : others['aria-label']}\n renderOption={renderOption}\n scrollAreaProps={scrollAreaProps}\n />\n </Combobox>\n <Combobox.HiddenInput\n name={name}\n valuesDivider={hiddenInputValuesDivider}\n value={_value}\n form={form}\n disabled={disabled}\n {...hiddenInputProps}\n />\n </>\n );\n});\n\nMultiSelect.classes = { ...InputBase.classes, ...Combobox.classes };\nMultiSelect.displayName = '@mantine/core/MultiSelect';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAwCA,MAAM,qBAA6C;CACjD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AA2GD,MAAM,eAAe;CACnB,WAAW;CACX,eAAe;CACf,mBAAmB;CACnB,0BAA0B;CAC1B,qBAAqB;CACrB,aAAa;CACb,MAAM;CACP;AAED,MAAa,cAAcA,gBAAAA,gBAAoC,WAAW;CACxE,MAAM,QAAQC,kBAAAA,SAAS,eAAe,cAAc,OAAO;CAC3D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,OACA,cACA,UACA,WACA,SACA,MACA,gBACA,uBACA,gBACA,iBACA,2BACA,iCACA,gBACA,eACA,QACA,OACA,gBACA,mBACA,aACA,oBACA,gBACA,UACA,UACA,SACA,QACA,QACA,cACA,mBACA,2BACA,mBACA,aACA,kBACA,0BACA,kBACA,gBACA,mBACA,cACA,YACA,kBACA,YACA,cACA,aACA,OACA,OACA,WACA,YACA,qBACA,eACA,mBACA,mBACA,mBACA,iBACA,MACA,MACA,IACA,WACA,kBACA,kBACA,kBACA,aACA,0BACA,UACA,KACA,cACA,YACA,UACA,SACA,aACA,iBACA,cACA,YACA,qBACA,aACA,GAAG,WACD;CAEJ,MAAM,OAAA,GAAA,eAAA,OAAY,GAAG;CACrB,MAAM,aAAaC,iCAAAA,sBAAsB,KAAK;CAC9C,MAAM,gBAAgBC,2BAAAA,iBAAiB,WAAW;CAClD,MAAM,2BAAA,GAAA,MAAA,QAA0E,EAAE,CAAC;CAEnF,MAAM,WAAWC,qBAAAA,YAAY;EAC3B,QAAQ;EACR,eAAe;EACf,sBAAsB;AACpB,qBAAkB;AAClB,OAAI,gCACF,UAAS,mBAAmB;;EAGhC,uBAAuB;AACrB,sBAAmB;AACnB,YAAS,qBAAqB;;EAEjC,CAAC;CAEF,MAAM,EACJ,YACA,MAAM,EAAE,MAAM,cAAc,GAAG,WAC7BC,4BAAAA,kBAAkB,OAAO;CAE7B,MAAM,CAAC,QAAQ,aAAA,GAAA,eAAA,iBAA4B;EACzC;EACA;EACA,YAAY,EAAE;EACd;EACD,CAAC;CAEF,MAAM,CAAC,cAAc,mBAAA,GAAA,eAAA,iBAAkC;EACrD,OAAO;EACP,cAAc;EACd,YAAY;EACZ,UAAU;EACX,CAAC;CAEF,MAAM,sBAAsB,UAAkB;AAC5C,iBAAe,MAAM;AACrB,WAAS,qBAAqB;;CAGhC,MAAM,YAAYC,mBAAAA,UAA8B;EAC9C,MAAM;EACN,SAAS,EAAE;EACJ;EACP;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,EAAE,oBAAoB,mBAAmBC,gCAAAA,qBAAyC;EACtF;EACA;EACA;EACD,CAAC;CAEF,MAAM,sBAAsB,UAAiD;AAC3E,cAAY,MAAM;AAElB,MAAI,MAAM,QAAQ,OAAO,CAAC,YAAY;AACpC,SAAM,gBAAgB;AACtB,YAAS,gBAAgB;;AAG3B,MAAI,MAAM,QAAQ,eAAe,aAAa,WAAW,KAAK,OAAO,SAAS,GAAG;AAC/E,cAAW,OAAO,OAAO,SAAS,GAAG;AACrC,YAAS,OAAO,MAAM,GAAG,OAAO,SAAS,EAAE,CAAC;;;CAIhD,MAAM,SAAS,OAAO,KAAK,MAAM,UAAU;EACzC,MAAM,aAAa,cAAc,GAAG,WAAW,wBAAwB,QAAQ,GAAG;AAElF,MAAI,WACF,QACE,iBAAA,GAAA,kBAAA,KAACC,MAAAA,UAAD,EAAA,UACG,WAAW;GACV,QAAQ;GACR,OAAO;GACP,gBAAgB;AACd,aAAS,OAAO,QAAQ,MAAM,SAAS,EAAE,CAAC;AAC1C,eAAW,KAAK;;GAElB;GACD,CAAC,EACO,EAVI,GAAG,KAAK,GAAG,QAUf;AAIf,SACE,iBAAA,GAAA,kBAAA,KAACC,aAAAA,MAAD;GAEE,kBAAkB,CAAC,YAAY,CAAC,cAAc,GAAG,SAAS;GAC1D,gBAAgB;AACd,aAAS,OAAO,QAAQ,MAAM,SAAS,EAAE,CAAC;AAC1C,eAAW,KAAK;;GAER;GACA;GACV,GAAI,UAAU,OAAO;aAEpB,YAAY,SAAS;GACjB,EAXA,GAAG,KAAK,GAAG,QAWX;GAET;AAEF,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,0BACF,UAAS,mBAAmB;IAE7B,CAAC,2BAA2B,aAAa,CAAC;AAE7C,EAAA,GAAA,MAAA,iBAAgB;AACd,SAAO,SAAS,QAAQ;AACtB,OAAI,GAAG,SAAS,cACd,yBAAwB,QAAQ,GAAG,SAAS,cAAc,GAAG;IAE/D;IACD,CAAC,eAAe,OAAO,CAAC;CAE3B,MAAM,cACJ,iBAAA,GAAA,kBAAA,KAACC,iBAAAA,SAAS,aAAV;EACE,GAAI;EACJ,eAAe;AACb,cAAW;AACX,YAAS,EAAE,CAAC;AACZ,sBAAmB,GAAG;;EAExB,CAAA;CAGJ,MAAM,eAAeC,6BAAAA,mBAAmB;EAAE,MAAM;EAAY,OAAO;EAAQ,CAAC;CAC5E,MAAM,aAAa,aAAa,OAAO,SAAS,KAAK,CAAC,YAAY,CAAC;CACnE,MAAM,iBAAiB,aACnB,EAAE,kBAAkB,mBAAmB,SAAS,mBAAmB,IAAI,GACvE,KAAA;AAEJ,QACE,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,MAACD,iBAAAA,UAAD;EACE,OAAO;EACP,YAAY;EACZ,QAAQ;EACE;EACJ;EACI;EACV,kBAAiB;EACL;EACZ,iBAAiB,QAAQ;AACvB,oBAAiB,IAAW;AAC5B,OAAI,oBACF,oBAAmB,GAAG;AAExB,YAAS,0BAA0B,WAAW;AAE9C,OAAI,OAAO,SAAS,cAAc,GAAG,OAAO,MAAa,EAAE;AACzD,aAAS,OAAO,QAAQ,MAAM,MAAM,cAAc,GAAG,OAAO,MAAM,CAAC;AACnE,eAAW,cAAc,GAAG,OAAO,MAAa;cACvC,OAAO,SAAS,UACzB,UAAS,CAAC,GAAG,QAAQ,cAAc,GAAG,OAAO,MAAM,CAAQ;OAE3D,gBAAe;;EAGnB,GAAI;YAzBN,CA2BE,iBAAA,GAAA,kBAAA,KAACA,iBAAAA,SAAS,gBAAV,EAAA,UACE,iBAAA,GAAA,kBAAA,KAACE,mBAAAA,YAAD;GACE,GAAI;GACJ,kBAAiB;GACjB,YAAY;GACZ,QAAQ;GACE;GACJ;GACK;GACJ;GACE;GACC;GACF;GACR,uBACE,iBAAA,GAAA,kBAAA,KAACF,iBAAAA,SAAS,SAAV;IACQ;IACC;IACG;IACV,OAAO;IACP,CAAA;GAEJ,gBAAgB;GAChB,aAAa;GACb,oBAAoB;GACN;GACd,2BAA2B,6BAA6B;GACrC;GACA;GACN;GACK;GACQ;GACR;GACF;GACG;GACL;GACF;GACM;GACN;GACE;GACD;GACN;GACA;GACU;GACjB,kBAAkB;IAChB,GAAG;IACH,2BAA2B,6BAA6B;IACxD,WAAW;IACZ;GACD,SAAS,CAAC;GACV,eAAgB,aAAa,SAAS,cAAc,GAAG,SAAS,gBAAgB;GAChF,iBAAe,SAAS,kBAAkB,KAAA;GAC1C,IAAI;GACM;GACL;GACO;aAEZ,iBAAA,GAAA,kBAAA,MAACD,aAAAA,KAAK,OAAN;IACc;IACF;IACA;IACV,GAAI,UAAU,aAAa,EAAE,OAAO,gBAAgB,CAAC;cAJvD,CAMG,QACD,iBAAA,GAAA,kBAAA,KAACC,iBAAAA,SAAS,cAAV;KAAqC;KAAc,uBAAA;eACjD,iBAAA,GAAA,kBAAA,KAACE,mBAAAA,WAAW,OAAZ;MACE,GAAI;MACJ,IAAI;MACS;MACb,MAAM,CAAC,cAAc,CAAC,cAAc,WAAW;MAC/C,GAAI,UAAU,aAAa;MACjB;MACV,UAAU,UAAU;AAClB,iBAAU,MAAM;AAChB,sBAAe,cAAc,SAAS,cAAc;;MAEtD,SAAS,UAAU;AACjB,gBAAS,MAAM;AACf,gBAAS,eAAe;AACxB,0BAAmB,GAAG;;MAExB,WAAW;MACX,OAAO;MACP,WAAW,UAAU;AACnB,0BAAmB,MAAM,cAAc,MAAM;AAC7C,qBAAc,SAAS,cAAc;AACrC,oCAA6B,SAAS,mBAAmB;;MAEjD;MACV,UAAU,YAAY,CAAC;MACvB,SAAS,CAAC;MACV,CAAA;KACoB,CAAA,CACb;;GACF,CAAA,EACW,CAAA,EAE1B,iBAAA,GAAA,kBAAA,KAACC,wBAAAA,iBAAD;GACE,MAAM,oBAAoB,eAAe;GACzC,QAAQ,YAAY;GACZ;GACR,QAAQ;GACD;GACP,iBAAiB,CAAC;GACF;GACG;GACnB,eAAe;GACf,OAAO;GACY;GACJ;GACI;GACE;GACX;GACV,SAAS,QAAQ,GAAG,IAAI,UAAU,KAAA;GAClC,cAAY,QAAQ,KAAA,IAAY,OAAO;GACzB;GACG;GACjB,CAAA,CACO;KACX,iBAAA,GAAA,kBAAA,KAACH,iBAAAA,SAAS,aAAV;EACQ;EACN,eAAe;EACf,OAAO;EACD;EACI;EACV,GAAI;EACJ,CAAA,CACD,EAAA,CAAA;EAEL;AAEF,YAAY,UAAU;CAAE,GAAGI,kBAAAA,UAAU;CAAS,GAAGJ,iBAAAA,SAAS;CAAS;AACnE,YAAY,cAAc"}
|
|
1
|
+
{"version":3,"file":"MultiSelect.cjs","names":["genericFactory","useProps","getParsedComboboxData","getOptionsLockup","useCombobox","extractStyleProps","useStyles","useResolvedStylesApi","Fragment","Pill","Combobox","filterPickedValues","PillsInput","OptionsDropdown","InputBase"],"sources":["../../../src/components/MultiSelect/MultiSelect.tsx"],"sourcesContent":["import { Fragment, useEffect, useRef } from 'react';\nimport { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n extractStyleProps,\n Factory,\n genericFactory,\n MantineColor,\n Primitive,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport {\n Combobox,\n ComboboxItem,\n ComboboxLikeProps,\n ComboboxLikeRenderOptionInput,\n ComboboxLikeStylesNames,\n ComboboxRenderPillInput,\n getOptionsLockup,\n getParsedComboboxData,\n OptionsDropdown,\n OptionsFilter,\n useCombobox,\n} from '../Combobox';\nimport {\n __BaseInputProps,\n __InputStylesNames,\n ClearSectionMode,\n InputClearButtonProps,\n} from '../Input';\nimport { InputBase } from '../InputBase';\nimport { Pill } from '../Pill';\nimport { PillsInput } from '../PillsInput';\nimport { ScrollAreaProps } from '../ScrollArea';\nimport { filterPickedValues } from './filter-picked-values';\n\nconst clearSectionOffset: Record<string, number> = {\n xs: 41,\n sm: 50,\n md: 60,\n lg: 72,\n xl: 89,\n};\n\nexport type MultiSelectStylesNames =\n | __InputStylesNames\n | ComboboxLikeStylesNames\n | 'pill'\n | 'pillsList'\n | 'inputField';\n\nexport interface MultiSelectProps<Value extends Primitive = string>\n extends\n BoxProps,\n __BaseInputProps,\n ComboboxLikeProps<Value>,\n StylesApiProps<MultiSelectFactory>,\n ElementProps<'input', 'size' | 'value' | 'defaultValue' | 'onChange'> {\n /** Controlled component value */\n value?: Value[];\n\n /** Uncontrolled component default value */\n defaultValue?: Value[];\n\n /** Called when value changes */\n onChange?: (value: Value[]) => void;\n\n /** Called with `value` of the removed item */\n onRemove?: (value: Value) => void;\n\n /** Called when the clear button is clicked */\n onClear?: () => void;\n\n /** Called when user attemps to select more values than allowed */\n onMaxValues?: () => void;\n\n /** Controlled search value */\n searchValue?: string;\n\n /** Default search value */\n defaultSearchValue?: string;\n\n /** Called when search changes */\n onSearchChange?: (value: string) => void;\n\n /** Maximum number of values, no limit if not set */\n maxValues?: number;\n\n /** Allows searching through options by user input @default false */\n searchable?: boolean;\n\n /** Message displayed when no options match the search query (when searchable is enabled) or when the data array is empty. If not set, the dropdown will be hidden instead. */\n nothingFoundMessage?: React.ReactNode;\n\n /** If set, the check icon is displayed near the selected option label @default true */\n withCheckIcon?: boolean;\n\n /** If set, unchecked labels are aligned with checked ones @default false */\n withAlignedLabels?: boolean;\n\n /** Position of the checkmark icon shown next to selected options in the dropdown @default 'left' */\n checkIconPosition?: 'left' | 'right';\n\n /** When enabled, selected options are hidden from the dropdown list @default false */\n hidePickedOptions?: boolean;\n\n /** When enabled, displays a clear button to remove all selected values (hidden when component is empty, disabled, or read-only) @default false */\n clearable?: boolean;\n\n /** Determines how the clear button and rightSection are rendered @default 'both' */\n clearSectionMode?: ClearSectionMode;\n\n /** Props passed down to the clear button */\n clearButtonProps?: InputClearButtonProps;\n\n /** Props passed down to the hidden input */\n hiddenInputProps?: Omit<React.ComponentProps<'input'>, 'value'>;\n\n /** Divider used to separate values in the hidden input `value` attribute @default ',' */\n hiddenInputValuesDivider?: string;\n\n /** A function to render content of the option, replaces the default content of the option */\n renderOption?: (item: ComboboxLikeRenderOptionInput<ComboboxItem>) => React.ReactNode;\n\n /** A function to render content of the pill */\n renderPill?: (props: ComboboxRenderPillInput<Value>) => React.ReactNode;\n\n /** Props passed down to the underlying `ScrollArea` component in the dropdown */\n scrollAreaProps?: ScrollAreaProps;\n\n /** Controls color of the default chevron */\n chevronColor?: MantineColor;\n\n /** Clear search value when item is selected @default true */\n clearSearchOnChange?: boolean;\n\n /** Controls whether dropdown opens when the input receives focus @default true */\n openOnFocus?: boolean;\n}\n\nexport type MultiSelectFactory = Factory<{\n props: MultiSelectProps;\n ref: HTMLInputElement;\n stylesNames: MultiSelectStylesNames;\n signature: <Value extends Primitive = string>(\n props: MultiSelectProps<Value>\n ) => React.JSX.Element;\n}>;\n\nconst defaultProps = {\n maxValues: Infinity,\n withCheckIcon: true,\n checkIconPosition: 'left',\n hiddenInputValuesDivider: ',',\n clearSearchOnChange: true,\n openOnFocus: true,\n size: 'sm',\n} satisfies Partial<MultiSelectProps>;\n\nexport const MultiSelect = genericFactory<MultiSelectFactory>((_props) => {\n const props = useProps('MultiSelect', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n size,\n value,\n defaultValue,\n onChange,\n onKeyDown,\n variant,\n data,\n dropdownOpened,\n defaultDropdownOpened,\n onDropdownOpen,\n onDropdownClose,\n selectFirstOptionOnChange,\n selectFirstOptionOnDropdownOpen,\n onOptionSubmit,\n comboboxProps,\n filter,\n limit,\n withScrollArea,\n maxDropdownHeight,\n searchValue,\n defaultSearchValue,\n onSearchChange,\n readOnly,\n disabled,\n onFocus,\n onBlur,\n radius,\n rightSection,\n rightSectionWidth,\n rightSectionPointerEvents,\n rightSectionProps,\n leftSection,\n leftSectionWidth,\n leftSectionPointerEvents,\n leftSectionProps,\n inputContainer,\n inputWrapperOrder,\n withAsterisk,\n labelProps,\n descriptionProps,\n errorProps,\n wrapperProps,\n description,\n label,\n error,\n maxValues,\n searchable,\n nothingFoundMessage,\n withCheckIcon,\n withAlignedLabels,\n checkIconPosition,\n hidePickedOptions,\n withErrorStyles,\n name,\n form,\n id,\n clearable,\n clearSectionMode,\n clearButtonProps,\n hiddenInputProps,\n placeholder,\n hiddenInputValuesDivider,\n required,\n mod,\n renderOption,\n renderPill,\n onRemove,\n onClear,\n onMaxValues,\n scrollAreaProps,\n chevronColor,\n attributes,\n clearSearchOnChange,\n openOnFocus,\n loading,\n loadingPosition,\n ...others\n } = props;\n\n const _id = useId(id);\n const parsedData = getParsedComboboxData(data);\n const optionsLockup = getOptionsLockup(parsedData);\n const retainedSelectedOptions = useRef<Record<string, ComboboxItem<Primitive>>>({});\n\n const combobox = useCombobox({\n opened: dropdownOpened,\n defaultOpened: defaultDropdownOpened,\n onDropdownOpen: () => {\n onDropdownOpen?.();\n if (selectFirstOptionOnDropdownOpen) {\n combobox.selectFirstOption();\n }\n },\n onDropdownClose: () => {\n onDropdownClose?.();\n combobox.resetSelectedOption();\n },\n });\n\n const {\n styleProps,\n rest: { type, autoComplete, ...rest },\n } = extractStyleProps(others);\n\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: [],\n onChange,\n });\n\n const [_searchValue, setSearchValue] = useUncontrolled({\n value: searchValue,\n defaultValue: defaultSearchValue,\n finalValue: '',\n onChange: onSearchChange,\n });\n\n const handleSearchChange = (value: string) => {\n setSearchValue(value);\n combobox.resetSelectedOption();\n };\n\n const getStyles = useStyles<MultiSelectFactory>({\n name: 'MultiSelect',\n classes: {} as any,\n props: props as any,\n classNames,\n styles,\n unstyled,\n attributes,\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MultiSelectFactory>({\n props,\n styles,\n classNames,\n });\n\n const handleInputKeydown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n\n if (event.key === ' ' && !searchable) {\n event.preventDefault();\n combobox.toggleDropdown();\n }\n\n if (event.key === 'Backspace' && _searchValue.length === 0 && _value.length > 0) {\n onRemove?.(_value[_value.length - 1]);\n setValue(_value.slice(0, _value.length - 1));\n }\n };\n\n const values = _value.map((item, index) => {\n const optionData = optionsLockup[`${item}`] || retainedSelectedOptions.current[`${item}`];\n\n if (renderPill) {\n return (\n <Fragment key={`${item}-${index}`}>\n {renderPill({\n option: optionData,\n value: item,\n onRemove: () => {\n setValue(_value.filter((i) => item !== i));\n onRemove?.(item);\n },\n disabled,\n })}\n </Fragment>\n );\n }\n\n return (\n <Pill\n key={`${item}-${index}`}\n withRemoveButton={!readOnly && !optionsLockup[`${item}`]?.disabled}\n onRemove={() => {\n setValue(_value.filter((i) => item !== i));\n onRemove?.(item);\n }}\n unstyled={unstyled}\n disabled={disabled}\n {...getStyles('pill')}\n >\n {optionData?.label || item}\n </Pill>\n );\n });\n\n useEffect(() => {\n if (selectFirstOptionOnChange) {\n combobox.selectFirstOption();\n }\n }, [selectFirstOptionOnChange, _searchValue]);\n\n useEffect(() => {\n _value.forEach((val) => {\n if (`${val}` in optionsLockup) {\n retainedSelectedOptions.current[`${val}`] = optionsLockup[`${val}`];\n }\n });\n }, [optionsLockup, _value]);\n\n const clearButton = (\n <Combobox.ClearButton\n {...clearButtonProps}\n onClear={() => {\n onClear?.();\n setValue([]);\n handleSearchChange('');\n }}\n />\n );\n\n const filteredData = filterPickedValues({ data: parsedData, value: _value });\n const _clearable = clearable && _value.length > 0 && !disabled && !readOnly;\n const pillsListStyle = _clearable\n ? { paddingInlineEnd: clearSectionOffset[size] ?? clearSectionOffset.sm }\n : undefined;\n\n return (\n <>\n <Combobox\n store={combobox}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n size={size}\n readOnly={readOnly}\n __staticSelector=\"MultiSelect\"\n attributes={attributes}\n onOptionSubmit={(val) => {\n onOptionSubmit?.(val as any);\n if (clearSearchOnChange) {\n handleSearchChange('');\n }\n combobox.updateSelectedOptionIndex('selected');\n\n if (_value.includes(optionsLockup[`${val}`].value as any)) {\n setValue(_value.filter((v) => v !== optionsLockup[`${val}`].value));\n onRemove?.(optionsLockup[`${val}`].value as any);\n } else if (_value.length < maxValues) {\n setValue([..._value, optionsLockup[`${val}`].value] as any);\n } else {\n onMaxValues?.();\n }\n }}\n {...comboboxProps}\n >\n <Combobox.DropdownTarget>\n <PillsInput\n {...styleProps}\n __staticSelector=\"MultiSelect\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n size={size}\n className={className}\n style={style}\n variant={variant}\n disabled={disabled}\n radius={radius}\n __defaultRightSection={\n <Combobox.Chevron\n size={size}\n error={error}\n unstyled={unstyled}\n color={chevronColor}\n />\n }\n __clearSection={clearButton}\n __clearable={_clearable}\n __clearSectionMode={clearSectionMode}\n rightSection={rightSection}\n rightSectionPointerEvents={rightSectionPointerEvents || 'none'}\n rightSectionWidth={rightSectionWidth}\n rightSectionProps={rightSectionProps}\n leftSection={leftSection}\n leftSectionWidth={leftSectionWidth}\n leftSectionPointerEvents={leftSectionPointerEvents}\n leftSectionProps={leftSectionProps}\n loading={loading}\n loadingPosition={loadingPosition}\n inputContainer={inputContainer}\n inputWrapperOrder={inputWrapperOrder}\n withAsterisk={withAsterisk}\n labelProps={labelProps}\n descriptionProps={descriptionProps}\n errorProps={errorProps}\n wrapperProps={wrapperProps}\n description={description}\n label={label}\n error={error}\n withErrorStyles={withErrorStyles}\n __stylesApiProps={{\n ...props,\n rightSectionPointerEvents: rightSectionPointerEvents || 'none',\n multiline: true,\n }}\n pointer={!searchable}\n onClick={() => (searchable ? combobox.openDropdown() : combobox.toggleDropdown())}\n data-expanded={combobox.dropdownOpened || undefined}\n id={_id}\n required={required}\n mod={mod}\n attributes={attributes}\n >\n <Pill.Group\n attributes={attributes}\n disabled={disabled}\n unstyled={unstyled}\n {...getStyles('pillsList', { style: pillsListStyle })}\n >\n {values}\n <Combobox.EventsTarget autoComplete={autoComplete} withExpandedAttribute>\n <PillsInput.Field\n {...rest}\n id={_id}\n placeholder={placeholder}\n type={!searchable && !placeholder ? 'hidden' : 'visible'}\n {...getStyles('inputField')}\n unstyled={unstyled}\n onFocus={(event) => {\n onFocus?.(event);\n openOnFocus && searchable && combobox.openDropdown();\n }}\n onBlur={(event) => {\n onBlur?.(event);\n combobox.closeDropdown();\n handleSearchChange('');\n }}\n onKeyDown={handleInputKeydown}\n value={_searchValue}\n onChange={(event) => {\n handleSearchChange(event.currentTarget.value);\n searchable && combobox.openDropdown();\n selectFirstOptionOnChange && combobox.selectFirstOption();\n }}\n disabled={disabled}\n readOnly={readOnly || !searchable}\n pointer={!searchable}\n />\n </Combobox.EventsTarget>\n </Pill.Group>\n </PillsInput>\n </Combobox.DropdownTarget>\n\n <OptionsDropdown\n data={hidePickedOptions ? filteredData : parsedData}\n hidden={readOnly || disabled}\n filter={filter as OptionsFilter<Primitive> | undefined}\n search={_searchValue}\n limit={limit}\n hiddenWhenEmpty={!nothingFoundMessage}\n withScrollArea={withScrollArea}\n maxDropdownHeight={maxDropdownHeight}\n filterOptions={searchable}\n value={_value}\n checkIconPosition={checkIconPosition}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n nothingFoundMessage={nothingFoundMessage}\n unstyled={unstyled}\n labelId={label ? `${_id}-label` : undefined}\n aria-label={label ? undefined : others['aria-label']}\n renderOption={renderOption}\n scrollAreaProps={scrollAreaProps}\n />\n </Combobox>\n <Combobox.HiddenInput\n name={name}\n valuesDivider={hiddenInputValuesDivider}\n value={_value}\n form={form}\n disabled={disabled}\n {...hiddenInputProps}\n />\n </>\n );\n});\n\nMultiSelect.classes = { ...InputBase.classes, ...Combobox.classes };\nMultiSelect.displayName = '@mantine/core/MultiSelect';\n\nexport namespace MultiSelect {\n export type Props<Value extends Primitive = string> = MultiSelectProps<Value>;\n export type StylesNames = MultiSelectStylesNames;\n export type Factory = MultiSelectFactory;\n}\n"],"mappings":"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"}
|
|
@@ -8,7 +8,10 @@ const require_ComboboxChevron = require("../Combobox/ComboboxChevron/ComboboxChe
|
|
|
8
8
|
const require_NativeSelectOption = require("./NativeSelectOption.cjs");
|
|
9
9
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
10
10
|
//#region packages/@mantine/core/src/components/NativeSelect/NativeSelect.tsx
|
|
11
|
-
const defaultProps = {
|
|
11
|
+
const defaultProps = {
|
|
12
|
+
size: "sm",
|
|
13
|
+
rightSectionPointerEvents: "none"
|
|
14
|
+
};
|
|
12
15
|
const NativeSelect = require_factory.factory((props) => {
|
|
13
16
|
const { data, children, size, error, rightSection, unstyled, ...others } = require_use_props.useProps("NativeSelect", defaultProps, props);
|
|
14
17
|
const options = require_get_parsed_combobox_data.getParsedComboboxData(data).map((item, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_NativeSelectOption.NativeSelectOption, { data: item }, index));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NativeSelect.cjs","names":["factory","useProps","getParsedComboboxData","NativeSelectOption","InputBase","ComboboxChevron"],"sources":["../../../src/components/NativeSelect/NativeSelect.tsx"],"sourcesContent":["import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core';\nimport { ComboboxChevron, ComboboxData, getParsedComboboxData } from '../Combobox';\nimport { __BaseInputProps, __InputStylesNames } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { NativeSelectOption } from './NativeSelectOption';\n\nexport interface NativeSelectProps\n extends\n BoxProps,\n Omit<__BaseInputProps, 'pointer'>,\n StylesApiProps<NativeSelectFactory>,\n ElementProps<'select', 'size'> {\n /**\n * Data used to render options. Accepts strings, objects with label/value,\n * or grouped options. If `children` prop is provided, `data` will be ignored.\n */\n data?: ComboboxData;\n}\n\nexport type NativeSelectFactory = Factory<{\n props: NativeSelectProps;\n ref: HTMLSelectElement;\n stylesNames: __InputStylesNames;\n}>;\n\nconst defaultProps = {\n rightSectionPointerEvents: 'none',\n} satisfies Partial<NativeSelectProps>;\n\nexport const NativeSelect = factory<NativeSelectFactory>((props) => {\n const { data, children, size, error, rightSection, unstyled, ...others } = useProps(\n 'NativeSelect',\n defaultProps,\n props\n );\n\n const options = getParsedComboboxData<string>(data).map((item, index) => (\n <NativeSelectOption key={index} data={item} />\n ));\n\n return (\n <InputBase\n component=\"select\"\n {...others}\n __staticSelector=\"NativeSelect\"\n size={size}\n pointer\n error={error}\n unstyled={unstyled}\n rightSection={\n rightSection || <ComboboxChevron size={size} error={error} unstyled={unstyled} />\n }\n >\n {children || options}\n </InputBase>\n );\n});\n\nNativeSelect.classes = InputBase.classes;\nNativeSelect.displayName = '@mantine/core/NativeSelect';\n"],"mappings":";;;;;;;;;;AAyBA,MAAM,eAAe,
|
|
1
|
+
{"version":3,"file":"NativeSelect.cjs","names":["factory","useProps","getParsedComboboxData","NativeSelectOption","InputBase","ComboboxChevron"],"sources":["../../../src/components/NativeSelect/NativeSelect.tsx"],"sourcesContent":["import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core';\nimport { ComboboxChevron, ComboboxData, getParsedComboboxData } from '../Combobox';\nimport { __BaseInputProps, __InputStylesNames } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { NativeSelectOption } from './NativeSelectOption';\n\nexport interface NativeSelectProps\n extends\n BoxProps,\n Omit<__BaseInputProps, 'pointer'>,\n StylesApiProps<NativeSelectFactory>,\n ElementProps<'select', 'size'> {\n /**\n * Data used to render options. Accepts strings, objects with label/value,\n * or grouped options. If `children` prop is provided, `data` will be ignored.\n */\n data?: ComboboxData;\n}\n\nexport type NativeSelectFactory = Factory<{\n props: NativeSelectProps;\n ref: HTMLSelectElement;\n stylesNames: __InputStylesNames;\n}>;\n\nconst defaultProps = {\n size: 'sm',\n rightSectionPointerEvents: 'none',\n} satisfies Partial<NativeSelectProps>;\n\nexport const NativeSelect = factory<NativeSelectFactory>((props) => {\n const { data, children, size, error, rightSection, unstyled, ...others } = useProps(\n 'NativeSelect',\n defaultProps,\n props\n );\n\n const options = getParsedComboboxData<string>(data).map((item, index) => (\n <NativeSelectOption key={index} data={item} />\n ));\n\n return (\n <InputBase\n component=\"select\"\n {...others}\n __staticSelector=\"NativeSelect\"\n size={size}\n pointer\n error={error}\n unstyled={unstyled}\n rightSection={\n rightSection || <ComboboxChevron size={size} error={error} unstyled={unstyled} />\n }\n >\n {children || options}\n </InputBase>\n );\n});\n\nNativeSelect.classes = InputBase.classes;\nNativeSelect.displayName = '@mantine/core/NativeSelect';\n\nexport namespace NativeSelect {\n export type Props = NativeSelectProps;\n export type Factory = NativeSelectFactory;\n export type StylesNames = __InputStylesNames;\n}\n"],"mappings":";;;;;;;;;;AAyBA,MAAM,eAAe;CACnB,MAAM;CACN,2BAA2B;CAC5B;AAED,MAAa,eAAeA,gBAAAA,SAA8B,UAAU;CAClE,MAAM,EAAE,MAAM,UAAU,MAAM,OAAO,cAAc,UAAU,GAAG,WAAWC,kBAAAA,SACzE,gBACA,cACA,MACD;CAED,MAAM,UAAUC,iCAAAA,sBAA8B,KAAK,CAAC,KAAK,MAAM,UAC7D,iBAAA,GAAA,kBAAA,KAACC,2BAAAA,oBAAD,EAAgC,MAAM,MAAQ,EAArB,MAAqB,CAC9C;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,kBAAAA,WAAD;EACE,WAAU;EACV,GAAI;EACJ,kBAAiB;EACX;EACN,SAAA;EACO;EACG;EACV,cACE,gBAAgB,iBAAA,GAAA,kBAAA,KAACC,wBAAAA,iBAAD;GAAuB;GAAa;GAAiB;GAAY,CAAA;YAGlF,YAAY;EACH,CAAA;EAEd;AAEF,aAAa,UAAUD,kBAAAA,UAAU;AACjC,aAAa,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavLink.cjs","names":["createVarsResolver","getSpacing","polymorphicFactory","useProps","useStyles","UnstyledButton","Box","AccordionChevron","Collapse","classes"],"sources":["../../../src/components/NavLink/NavLink.tsx"],"sourcesContent":["import { useUncontrolled } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n getSpacing,\n MantineColor,\n MantineSpacing,\n polymorphicFactory,\n PolymorphicFactory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { AccordionChevron } from '../Accordion';\nimport { Collapse } from '../Collapse';\nimport { UnstyledButton } from '../UnstyledButton';\nimport classes from './NavLink.module.css';\n\nexport type NavLinkStylesNames =\n | 'root'\n | 'section'\n | 'body'\n | 'label'\n | 'description'\n | 'chevron'\n | 'collapse'\n | 'children';\nexport type NavLinkVariant = 'filled' | 'light' | 'subtle';\nexport type NavLinkCssVariables = {\n root: '--nl-color' | '--nl-bg' | '--nl-hover';\n children: '--nl-offset';\n};\n\nexport interface NavLinkProps extends BoxProps, StylesApiProps<NavLinkFactory> {\n /** Main link label */\n label?: React.ReactNode;\n\n /** Link description, displayed below the label */\n description?: React.ReactNode;\n\n /** Section displayed on the left side of the label */\n leftSection?: React.ReactNode;\n\n /** Section displayed on the right side of the label */\n rightSection?: React.ReactNode;\n\n /** Determines whether the link should have active styles @default false */\n active?: boolean;\n\n /** Key of `theme.colors` or any valid CSS color to control active styles @default theme.primaryColor */\n color?: MantineColor;\n\n /** If set, label and description are truncated with ellipsis instead of wrapping @default false */\n noWrap?: boolean;\n\n /** Child `NavLink` components */\n children?: React.ReactNode;\n\n /** Controlled nested items collapse state */\n opened?: boolean;\n\n /** Uncontrolled nested items collapse initial state */\n defaultOpened?: boolean;\n\n /** Called when open state changes */\n onChange?: (opened: boolean) => void;\n\n /** If set, right section will not be rotated when collapse is opened @default false */\n disableRightSectionRotation?: boolean;\n\n /** Controls indentation of nested NavLink components, key of `theme.spacing` or any valid CSS value @default 'lg' */\n childrenOffset?: MantineSpacing;\n\n /** If set, disabled styles will be added to the root element @default false */\n disabled?: boolean;\n\n /** If set, adjusts text color based on background color for `filled` variant */\n autoContrast?: boolean;\n\n /** Called when the root element is clicked */\n onClick?: React.MouseEventHandler<HTMLElement>;\n\n /** Called on keydown of the root element */\n onKeyDown?: React.KeyboardEventHandler<HTMLElement>;\n\n /** If set to `false`, child `NavLinks` are unmounted when collapsed */\n keepMounted?: boolean;\n}\n\nexport type NavLinkFactory = PolymorphicFactory<{\n props: NavLinkProps;\n defaultRef: HTMLAnchorElement;\n defaultComponent: 'a';\n stylesNames: NavLinkStylesNames;\n vars: NavLinkCssVariables;\n variant: NavLinkVariant;\n}>;\n\nconst varsResolver = createVarsResolver<NavLinkFactory>(\n (theme, { variant, color, childrenOffset, autoContrast }) => {\n const colors = theme.variantColorResolver({\n color: color || theme.primaryColor,\n theme,\n variant: variant || 'light',\n autoContrast,\n });\n\n return {\n root: {\n '--nl-bg': color || variant ? colors.background : undefined,\n '--nl-hover': color || variant ? colors.hover : undefined,\n '--nl-color': color || variant ? colors.color : undefined,\n },\n\n children: {\n '--nl-offset': getSpacing(childrenOffset),\n },\n };\n }\n);\n\nexport const NavLink = polymorphicFactory<NavLinkFactory>((_props) => {\n const props = useProps('NavLink', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n opened,\n defaultOpened,\n onChange,\n children,\n active,\n disabled,\n leftSection,\n rightSection,\n label,\n description,\n disableRightSectionRotation,\n noWrap,\n childrenOffset,\n autoContrast,\n mod,\n attributes,\n onClick,\n onKeyDown,\n keepMounted,\n ...others\n } = props;\n\n const getStyles = useStyles<NavLinkFactory>({\n name: 'NavLink',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const [_opened, setOpened] = useUncontrolled({\n value: opened,\n defaultValue: defaultOpened,\n finalValue: false,\n onChange,\n });\n\n const withChildren = !!children;\n\n const handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {\n onClick?.(event);\n\n if (withChildren) {\n event.preventDefault();\n setOpened(!_opened);\n }\n };\n\n return (\n <>\n <UnstyledButton\n {...getStyles('root')}\n component=\"a\"\n onClick={handleClick}\n onKeyDown={(event) => {\n onKeyDown?.(event);\n\n if (event.nativeEvent.code === 'Space' && withChildren) {\n event.preventDefault();\n setOpened(!_opened);\n }\n }}\n unstyled={unstyled}\n mod={[{ disabled, active, expanded: _opened }, mod]}\n {...others}\n >\n {leftSection && (\n <Box component=\"span\" {...getStyles('section')} mod={{ position: 'left' }}>\n {leftSection}\n </Box>\n )}\n <Box {...getStyles('body')} mod={{ 'no-wrap': noWrap }}>\n <Box component=\"span\" {...getStyles('label')}>\n {label}\n </Box>\n <Box component=\"span\" mod={{ active }} {...getStyles('description')}>\n {description}\n </Box>\n </Box>\n {(withChildren || rightSection !== undefined) && (\n <Box\n {...getStyles('section')}\n component=\"span\"\n mod={{ rotate: _opened && !disableRightSectionRotation, position: 'right' }}\n >\n {withChildren ? (\n rightSection !== undefined ? (\n rightSection\n ) : (\n <AccordionChevron {...getStyles('chevron')} />\n )\n ) : (\n rightSection\n )}\n </Box>\n )}\n </UnstyledButton>\n {withChildren && (\n <Collapse expanded={_opened} keepMounted={keepMounted} {...getStyles('collapse')}>\n <div {...getStyles('children')}>{children}</div>\n </Collapse>\n )}\n </>\n );\n});\n\nNavLink.classes = classes;\nNavLink.varsResolver = varsResolver;\nNavLink.displayName = '@mantine/core/NavLink';\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"NavLink.cjs","names":["createVarsResolver","getSpacing","polymorphicFactory","useProps","useStyles","UnstyledButton","Box","AccordionChevron","Collapse","classes"],"sources":["../../../src/components/NavLink/NavLink.tsx"],"sourcesContent":["import { useUncontrolled } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n getSpacing,\n MantineColor,\n MantineSpacing,\n polymorphicFactory,\n PolymorphicFactory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { AccordionChevron } from '../Accordion';\nimport { Collapse } from '../Collapse';\nimport { UnstyledButton } from '../UnstyledButton';\nimport classes from './NavLink.module.css';\n\nexport type NavLinkStylesNames =\n | 'root'\n | 'section'\n | 'body'\n | 'label'\n | 'description'\n | 'chevron'\n | 'collapse'\n | 'children';\nexport type NavLinkVariant = 'filled' | 'light' | 'subtle';\nexport type NavLinkCssVariables = {\n root: '--nl-color' | '--nl-bg' | '--nl-hover';\n children: '--nl-offset';\n};\n\nexport interface NavLinkProps extends BoxProps, StylesApiProps<NavLinkFactory> {\n /** Main link label */\n label?: React.ReactNode;\n\n /** Link description, displayed below the label */\n description?: React.ReactNode;\n\n /** Section displayed on the left side of the label */\n leftSection?: React.ReactNode;\n\n /** Section displayed on the right side of the label */\n rightSection?: React.ReactNode;\n\n /** Determines whether the link should have active styles @default false */\n active?: boolean;\n\n /** Key of `theme.colors` or any valid CSS color to control active styles @default theme.primaryColor */\n color?: MantineColor;\n\n /** If set, label and description are truncated with ellipsis instead of wrapping @default false */\n noWrap?: boolean;\n\n /** Child `NavLink` components */\n children?: React.ReactNode;\n\n /** Controlled nested items collapse state */\n opened?: boolean;\n\n /** Uncontrolled nested items collapse initial state */\n defaultOpened?: boolean;\n\n /** Called when open state changes */\n onChange?: (opened: boolean) => void;\n\n /** If set, right section will not be rotated when collapse is opened @default false */\n disableRightSectionRotation?: boolean;\n\n /** Controls indentation of nested NavLink components, key of `theme.spacing` or any valid CSS value @default 'lg' */\n childrenOffset?: MantineSpacing;\n\n /** If set, disabled styles will be added to the root element @default false */\n disabled?: boolean;\n\n /** If set, adjusts text color based on background color for `filled` variant */\n autoContrast?: boolean;\n\n /** Called when the root element is clicked */\n onClick?: React.MouseEventHandler<HTMLElement>;\n\n /** Called on keydown of the root element */\n onKeyDown?: React.KeyboardEventHandler<HTMLElement>;\n\n /** If set to `false`, child `NavLinks` are unmounted when collapsed */\n keepMounted?: boolean;\n}\n\nexport type NavLinkFactory = PolymorphicFactory<{\n props: NavLinkProps;\n defaultRef: HTMLAnchorElement;\n defaultComponent: 'a';\n stylesNames: NavLinkStylesNames;\n vars: NavLinkCssVariables;\n variant: NavLinkVariant;\n}>;\n\nconst varsResolver = createVarsResolver<NavLinkFactory>(\n (theme, { variant, color, childrenOffset, autoContrast }) => {\n const colors = theme.variantColorResolver({\n color: color || theme.primaryColor,\n theme,\n variant: variant || 'light',\n autoContrast,\n });\n\n return {\n root: {\n '--nl-bg': color || variant ? colors.background : undefined,\n '--nl-hover': color || variant ? colors.hover : undefined,\n '--nl-color': color || variant ? colors.color : undefined,\n },\n\n children: {\n '--nl-offset': getSpacing(childrenOffset),\n },\n };\n }\n);\n\nexport const NavLink = polymorphicFactory<NavLinkFactory>((_props) => {\n const props = useProps('NavLink', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n opened,\n defaultOpened,\n onChange,\n children,\n active,\n disabled,\n leftSection,\n rightSection,\n label,\n description,\n disableRightSectionRotation,\n noWrap,\n childrenOffset,\n autoContrast,\n mod,\n attributes,\n onClick,\n onKeyDown,\n keepMounted,\n ...others\n } = props;\n\n const getStyles = useStyles<NavLinkFactory>({\n name: 'NavLink',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const [_opened, setOpened] = useUncontrolled({\n value: opened,\n defaultValue: defaultOpened,\n finalValue: false,\n onChange,\n });\n\n const withChildren = !!children;\n\n const handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {\n onClick?.(event);\n\n if (withChildren) {\n event.preventDefault();\n setOpened(!_opened);\n }\n };\n\n return (\n <>\n <UnstyledButton\n {...getStyles('root')}\n component=\"a\"\n onClick={handleClick}\n onKeyDown={(event) => {\n onKeyDown?.(event);\n\n if (event.nativeEvent.code === 'Space' && withChildren) {\n event.preventDefault();\n setOpened(!_opened);\n }\n }}\n unstyled={unstyled}\n mod={[{ disabled, active, expanded: _opened }, mod]}\n {...others}\n >\n {leftSection && (\n <Box component=\"span\" {...getStyles('section')} mod={{ position: 'left' }}>\n {leftSection}\n </Box>\n )}\n <Box {...getStyles('body')} mod={{ 'no-wrap': noWrap }}>\n <Box component=\"span\" {...getStyles('label')}>\n {label}\n </Box>\n <Box component=\"span\" mod={{ active }} {...getStyles('description')}>\n {description}\n </Box>\n </Box>\n {(withChildren || rightSection !== undefined) && (\n <Box\n {...getStyles('section')}\n component=\"span\"\n mod={{ rotate: _opened && !disableRightSectionRotation, position: 'right' }}\n >\n {withChildren ? (\n rightSection !== undefined ? (\n rightSection\n ) : (\n <AccordionChevron {...getStyles('chevron')} />\n )\n ) : (\n rightSection\n )}\n </Box>\n )}\n </UnstyledButton>\n {withChildren && (\n <Collapse expanded={_opened} keepMounted={keepMounted} {...getStyles('collapse')}>\n <div {...getStyles('children')}>{children}</div>\n </Collapse>\n )}\n </>\n );\n});\n\nNavLink.classes = classes;\nNavLink.varsResolver = varsResolver;\nNavLink.displayName = '@mantine/core/NavLink';\n\nexport namespace NavLink {\n export type Props = NavLinkProps;\n export type StylesNames = NavLinkStylesNames;\n export type CssVariables = NavLinkCssVariables;\n export type Factory = NavLinkFactory;\n export type Variant = NavLinkVariant;\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Notification.cjs","names":["createVarsResolver","getRadius","getThemeColor","factory","useProps","useStyles","Box","Loader","CloseButton","classes"],"sources":["../../../src/components/Notification/Notification.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n factory,\n Factory,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { CloseButton } from '../CloseButton';\nimport { Loader, LoaderProps } from '../Loader';\nimport classes from './Notification.module.css';\n\nexport type NotificationStylesNames =\n | 'root'\n | 'icon'\n | 'loader'\n | 'body'\n | 'title'\n | 'description'\n | 'closeButton';\nexport type NotificationCssVariables = {\n root: '--notification-radius' | '--notification-color';\n};\n\nexport interface NotificationProps\n extends BoxProps, StylesApiProps<NotificationFactory>, ElementProps<'div', 'title'> {\n /** Called when the close button is clicked */\n onClose?: () => void;\n\n /** Controls icon background color or notification accent line color, key of `theme.colors` or any valid CSS color. When `icon` is provided, sets the icon background color. When no icon is provided, sets the colored accent line on the left. @default theme.primaryColor */\n color?: MantineColor;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Notification icon, replaces color line */\n icon?: React.ReactNode;\n\n /** Notification title, displayed above the message body */\n title?: React.ReactNode;\n\n /** Notification description, displayed below the title. When no title is provided, this serves as the main message. */\n children?: React.ReactNode;\n\n /** If set, displays a `Loader` component instead of the icon. Takes precedence over the `icon` prop if both are provided. */\n loading?: boolean;\n\n /** Adds border to the root element */\n withBorder?: boolean;\n\n /** If set, the close button is visible @default true */\n withCloseButton?: boolean;\n\n /** Props passed down to the close button */\n closeButtonProps?: ElementProps<'button'> & DataAttributes;\n\n /** Props passed down to the `Loader` component */\n loaderProps?: LoaderProps;\n}\n\nexport type NotificationFactory = Factory<{\n props: NotificationProps;\n ref: HTMLDivElement;\n stylesNames: NotificationStylesNames;\n vars: NotificationCssVariables;\n}>;\n\nconst defaultProps = {\n withCloseButton: true,\n} satisfies Partial<NotificationProps>;\n\nconst varsResolver = createVarsResolver<NotificationFactory>((theme, { radius, color }) => ({\n root: {\n '--notification-radius': radius === undefined ? undefined : getRadius(radius),\n '--notification-color': color ? getThemeColor(color, theme) : undefined,\n },\n}));\n\nexport const Notification = factory<NotificationFactory>((_props) => {\n const props = useProps('Notification', defaultProps, _props);\n const {\n className,\n color,\n radius,\n loading,\n withCloseButton,\n withBorder,\n title,\n icon,\n children,\n onClose,\n closeButtonProps,\n classNames,\n style,\n styles,\n unstyled,\n vars,\n mod,\n loaderProps,\n role,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<NotificationFactory>({\n name: 'Notification',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Box\n {...getStyles('root')}\n mod={[{ 'data-with-icon': !!icon || loading, 'data-with-border': withBorder }, mod]}\n role={role || 'alert'}\n {...others}\n >\n {icon && !loading && <div {...getStyles('icon')}>{icon}</div>}\n {loading && <Loader size={28} color={color} {...getStyles('loader')} {...loaderProps} />}\n\n <div {...getStyles('body')}>\n {title && <div {...getStyles('title')}>{title}</div>}\n\n <Box {...getStyles('description')} mod={{ 'data-with-title': !!title }}>\n {children}\n </Box>\n </div>\n\n {withCloseButton && (\n <CloseButton\n iconSize={16}\n color=\"gray\"\n {...closeButtonProps}\n unstyled={unstyled}\n onClick={(event) => {\n closeButtonProps?.onClick?.(event);\n onClose?.();\n }}\n {...getStyles('closeButton')}\n />\n )}\n </Box>\n );\n});\n\nNotification.classes = classes;\nNotification.varsResolver = varsResolver;\nNotification.displayName = '@mantine/core/Notification';\n"],"mappings":";;;;;;;;;;;;;;AA2EA,MAAM,eAAe,EACnB,iBAAiB,MAClB;AAED,MAAM,eAAeA,6BAAAA,oBAAyC,OAAO,EAAE,QAAQ,aAAa,EAC1F,MAAM;CACJ,yBAAyB,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,OAAO;CAC7E,wBAAwB,QAAQC,wBAAAA,cAAc,OAAO,MAAM,GAAG,KAAA;CAC/D,EACF,EAAE;AAEH,MAAa,eAAeC,gBAAAA,SAA8B,WAAW;CACnE,MAAM,QAAQC,kBAAAA,SAAS,gBAAgB,cAAc,OAAO;CAC5D,MAAM,EACJ,WACA,OACA,QACA,SACA,iBACA,YACA,OACA,MACA,UACA,SACA,kBACA,YACA,OACA,QACA,UACA,MACA,KACA,aACA,MACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAA+B;EAC/C,MAAM;EACN,SAAA,4BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;EACE,GAAI,UAAU,OAAO;EACrB,KAAK,CAAC;GAAE,kBAAkB,CAAC,CAAC,QAAQ;GAAS,oBAAoB;GAAY,EAAE,IAAI;EACnF,MAAM,QAAQ;EACd,GAAI;YAJN;GAMG,QAAQ,CAAC,WAAW,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,GAAI,UAAU,OAAO;cAAG;IAAW,CAAA;GAC5D,WAAW,iBAAA,GAAA,kBAAA,KAACC,eAAAA,QAAD;IAAQ,MAAM;IAAW;IAAO,GAAI,UAAU,SAAS;IAAE,GAAI;IAAe,CAAA;GAExF,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,GAAI,UAAU,OAAO;cAA1B,CACG,SAAS,iBAAA,GAAA,kBAAA,KAAC,OAAD;KAAK,GAAI,UAAU,QAAQ;eAAG;KAAY,CAAA,EAEpD,iBAAA,GAAA,kBAAA,KAACD,YAAAA,KAAD;KAAK,GAAI,UAAU,cAAc;KAAE,KAAK,EAAE,mBAAmB,CAAC,CAAC,OAAO;KACnE;KACG,CAAA,CACF;;GAEL,mBACC,iBAAA,GAAA,kBAAA,KAACE,oBAAAA,aAAD;IACE,UAAU;IACV,OAAM;IACN,GAAI;IACM;IACV,UAAU,UAAU;AAClB,uBAAkB,UAAU,MAAM;AAClC,gBAAW;;IAEb,GAAI,UAAU,cAAc;IAC5B,CAAA;GAEA;;EAER;AAEF,aAAa,UAAUC,4BAAAA;AACvB,aAAa,eAAe;AAC5B,aAAa,cAAc"}
|
|
1
|
+
{"version":3,"file":"Notification.cjs","names":["createVarsResolver","getRadius","getThemeColor","factory","useProps","useStyles","Box","Loader","CloseButton","classes"],"sources":["../../../src/components/Notification/Notification.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n factory,\n Factory,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { CloseButton } from '../CloseButton';\nimport { Loader, LoaderProps } from '../Loader';\nimport classes from './Notification.module.css';\n\nexport type NotificationStylesNames =\n | 'root'\n | 'icon'\n | 'loader'\n | 'body'\n | 'title'\n | 'description'\n | 'closeButton';\nexport type NotificationCssVariables = {\n root: '--notification-radius' | '--notification-color';\n};\n\nexport interface NotificationProps\n extends BoxProps, StylesApiProps<NotificationFactory>, ElementProps<'div', 'title'> {\n /** Called when the close button is clicked */\n onClose?: () => void;\n\n /** Controls icon background color or notification accent line color, key of `theme.colors` or any valid CSS color. When `icon` is provided, sets the icon background color. When no icon is provided, sets the colored accent line on the left. @default theme.primaryColor */\n color?: MantineColor;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Notification icon, replaces color line */\n icon?: React.ReactNode;\n\n /** Notification title, displayed above the message body */\n title?: React.ReactNode;\n\n /** Notification description, displayed below the title. When no title is provided, this serves as the main message. */\n children?: React.ReactNode;\n\n /** If set, displays a `Loader` component instead of the icon. Takes precedence over the `icon` prop if both are provided. */\n loading?: boolean;\n\n /** Adds border to the root element */\n withBorder?: boolean;\n\n /** If set, the close button is visible @default true */\n withCloseButton?: boolean;\n\n /** Props passed down to the close button */\n closeButtonProps?: ElementProps<'button'> & DataAttributes;\n\n /** Props passed down to the `Loader` component */\n loaderProps?: LoaderProps;\n}\n\nexport type NotificationFactory = Factory<{\n props: NotificationProps;\n ref: HTMLDivElement;\n stylesNames: NotificationStylesNames;\n vars: NotificationCssVariables;\n}>;\n\nconst defaultProps = {\n withCloseButton: true,\n} satisfies Partial<NotificationProps>;\n\nconst varsResolver = createVarsResolver<NotificationFactory>((theme, { radius, color }) => ({\n root: {\n '--notification-radius': radius === undefined ? undefined : getRadius(radius),\n '--notification-color': color ? getThemeColor(color, theme) : undefined,\n },\n}));\n\nexport const Notification = factory<NotificationFactory>((_props) => {\n const props = useProps('Notification', defaultProps, _props);\n const {\n className,\n color,\n radius,\n loading,\n withCloseButton,\n withBorder,\n title,\n icon,\n children,\n onClose,\n closeButtonProps,\n classNames,\n style,\n styles,\n unstyled,\n vars,\n mod,\n loaderProps,\n role,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<NotificationFactory>({\n name: 'Notification',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Box\n {...getStyles('root')}\n mod={[{ 'data-with-icon': !!icon || loading, 'data-with-border': withBorder }, mod]}\n role={role || 'alert'}\n {...others}\n >\n {icon && !loading && <div {...getStyles('icon')}>{icon}</div>}\n {loading && <Loader size={28} color={color} {...getStyles('loader')} {...loaderProps} />}\n\n <div {...getStyles('body')}>\n {title && <div {...getStyles('title')}>{title}</div>}\n\n <Box {...getStyles('description')} mod={{ 'data-with-title': !!title }}>\n {children}\n </Box>\n </div>\n\n {withCloseButton && (\n <CloseButton\n iconSize={16}\n color=\"gray\"\n {...closeButtonProps}\n unstyled={unstyled}\n onClick={(event) => {\n closeButtonProps?.onClick?.(event);\n onClose?.();\n }}\n {...getStyles('closeButton')}\n />\n )}\n </Box>\n );\n});\n\nNotification.classes = classes;\nNotification.varsResolver = varsResolver;\nNotification.displayName = '@mantine/core/Notification';\n\nexport namespace Notification {\n export type Props = NotificationProps;\n export type StylesNames = NotificationStylesNames;\n export type Factory = NotificationFactory;\n export type CssVariables = NotificationCssVariables;\n}\n"],"mappings":";;;;;;;;;;;;;;AA2EA,MAAM,eAAe,EACnB,iBAAiB,MAClB;AAED,MAAM,eAAeA,6BAAAA,oBAAyC,OAAO,EAAE,QAAQ,aAAa,EAC1F,MAAM;CACJ,yBAAyB,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,OAAO;CAC7E,wBAAwB,QAAQC,wBAAAA,cAAc,OAAO,MAAM,GAAG,KAAA;CAC/D,EACF,EAAE;AAEH,MAAa,eAAeC,gBAAAA,SAA8B,WAAW;CACnE,MAAM,QAAQC,kBAAAA,SAAS,gBAAgB,cAAc,OAAO;CAC5D,MAAM,EACJ,WACA,OACA,QACA,SACA,iBACA,YACA,OACA,MACA,UACA,SACA,kBACA,YACA,OACA,QACA,UACA,MACA,KACA,aACA,MACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAA+B;EAC/C,MAAM;EACN,SAAA,4BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;EACE,GAAI,UAAU,OAAO;EACrB,KAAK,CAAC;GAAE,kBAAkB,CAAC,CAAC,QAAQ;GAAS,oBAAoB;GAAY,EAAE,IAAI;EACnF,MAAM,QAAQ;EACd,GAAI;YAJN;GAMG,QAAQ,CAAC,WAAW,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,GAAI,UAAU,OAAO;cAAG;IAAW,CAAA;GAC5D,WAAW,iBAAA,GAAA,kBAAA,KAACC,eAAAA,QAAD;IAAQ,MAAM;IAAW;IAAO,GAAI,UAAU,SAAS;IAAE,GAAI;IAAe,CAAA;GAExF,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,GAAI,UAAU,OAAO;cAA1B,CACG,SAAS,iBAAA,GAAA,kBAAA,KAAC,OAAD;KAAK,GAAI,UAAU,QAAQ;eAAG;KAAY,CAAA,EAEpD,iBAAA,GAAA,kBAAA,KAACD,YAAAA,KAAD;KAAK,GAAI,UAAU,cAAc;KAAE,KAAK,EAAE,mBAAmB,CAAC,CAAC,OAAO;KACnE;KACG,CAAA,CACF;;GAEL,mBACC,iBAAA,GAAA,kBAAA,KAACE,oBAAAA,aAAD;IACE,UAAU;IACV,OAAM;IACN,GAAI;IACM;IACV,UAAU,UAAU;AAClB,uBAAkB,UAAU,MAAM;AAClC,gBAAW;;IAEb,GAAI,UAAU,cAAc;IAC5B,CAAA;GAEA;;EAER;AAEF,aAAa,UAAUC,4BAAAA;AACvB,aAAa,eAAe;AAC5B,aAAa,cAAc"}
|