@mantine/core 9.2.2 → 9.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/components/Accordion/Accordion.cjs +0 -1
- package/cjs/components/Accordion/Accordion.cjs.map +1 -1
- package/cjs/components/Accordion/AccordionChevron.cjs +0 -1
- package/cjs/components/Accordion/AccordionChevron.cjs.map +1 -1
- package/cjs/components/Accordion/AccordionControl/AccordionControl.cjs +0 -1
- package/cjs/components/Accordion/AccordionControl/AccordionControl.cjs.map +1 -1
- package/cjs/components/Accordion/AccordionItem/AccordionItem.cjs +0 -1
- package/cjs/components/Accordion/AccordionItem/AccordionItem.cjs.map +1 -1
- package/cjs/components/Accordion/AccordionPanel/AccordionPanel.cjs +0 -1
- package/cjs/components/Accordion/AccordionPanel/AccordionPanel.cjs.map +1 -1
- package/cjs/components/ActionIcon/ActionIcon.cjs +0 -1
- package/cjs/components/ActionIcon/ActionIcon.cjs.map +1 -1
- package/cjs/components/ActionIcon/ActionIconGroup/ActionIconGroup.cjs +0 -1
- package/cjs/components/ActionIcon/ActionIconGroup/ActionIconGroup.cjs.map +1 -1
- package/cjs/components/ActionIcon/ActionIconGroupSection/ActionIconGroupSection.cjs +0 -1
- package/cjs/components/ActionIcon/ActionIconGroupSection/ActionIconGroupSection.cjs.map +1 -1
- package/cjs/components/Affix/Affix.cjs +0 -1
- package/cjs/components/Affix/Affix.cjs.map +1 -1
- package/cjs/components/Alert/Alert.cjs +0 -1
- package/cjs/components/Alert/Alert.cjs.map +1 -1
- package/cjs/components/AngleSlider/AngleSlider.cjs +0 -1
- package/cjs/components/AngleSlider/AngleSlider.cjs.map +1 -1
- package/cjs/components/AppShell/AppShell.cjs +0 -1
- package/cjs/components/AppShell/AppShell.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellMain/AppShellMain.cjs +0 -1
- package/cjs/components/AppShell/AppShellMain/AppShellMain.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellMediaStyles/AppShellMediaStyles.cjs +0 -1
- package/cjs/components/AppShell/AppShellMediaStyles/AppShellMediaStyles.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellSection/AppShellSection.cjs +0 -1
- package/cjs/components/AppShell/AppShellSection/AppShellSection.cjs.map +1 -1
- package/cjs/components/AppShell/use-resizing/use-resizing.cjs +0 -1
- package/cjs/components/AppShell/use-resizing/use-resizing.cjs.map +1 -1
- package/cjs/components/AspectRatio/AspectRatio.cjs +0 -1
- package/cjs/components/AspectRatio/AspectRatio.cjs.map +1 -1
- package/cjs/components/Autocomplete/Autocomplete.cjs +2 -2
- package/cjs/components/Autocomplete/Autocomplete.cjs.map +1 -1
- package/cjs/components/Avatar/Avatar.cjs +0 -1
- package/cjs/components/Avatar/Avatar.cjs.map +1 -1
- package/cjs/components/Avatar/AvatarGroup/AvatarGroup.cjs +0 -1
- package/cjs/components/Avatar/AvatarGroup/AvatarGroup.cjs.map +1 -1
- package/cjs/components/Avatar/AvatarPlaceholderIcon.cjs +0 -1
- package/cjs/components/Avatar/AvatarPlaceholderIcon.cjs.map +1 -1
- package/cjs/components/BackgroundImage/BackgroundImage.cjs +0 -1
- package/cjs/components/BackgroundImage/BackgroundImage.cjs.map +1 -1
- package/cjs/components/Badge/Badge.cjs +0 -1
- package/cjs/components/Badge/Badge.cjs.map +1 -1
- package/cjs/components/Blockquote/Blockquote.cjs +4 -4
- package/cjs/components/Blockquote/Blockquote.cjs.map +1 -1
- package/cjs/components/Blockquote/Blockquote.module.cjs.map +1 -1
- package/cjs/components/Breadcrumbs/Breadcrumbs.cjs +0 -1
- package/cjs/components/Breadcrumbs/Breadcrumbs.cjs.map +1 -1
- package/cjs/components/Burger/Burger.cjs +0 -1
- package/cjs/components/Burger/Burger.cjs.map +1 -1
- package/cjs/components/Button/Button.cjs +0 -1
- package/cjs/components/Button/Button.cjs.map +1 -1
- package/cjs/components/Button/ButtonGroup/ButtonGroup.cjs +0 -1
- package/cjs/components/Button/ButtonGroup/ButtonGroup.cjs.map +1 -1
- package/cjs/components/Button/ButtonGroupSection/ButtonGroupSection.cjs +0 -1
- package/cjs/components/Button/ButtonGroupSection/ButtonGroupSection.cjs.map +1 -1
- package/cjs/components/Card/Card.cjs +0 -1
- package/cjs/components/Card/Card.cjs.map +1 -1
- package/cjs/components/Card/CardSection/CardSection.cjs +0 -1
- package/cjs/components/Card/CardSection/CardSection.cjs.map +1 -1
- package/cjs/components/Center/Center.cjs +0 -1
- package/cjs/components/Center/Center.cjs.map +1 -1
- package/cjs/components/Checkbox/CheckIcon.cjs +0 -1
- package/cjs/components/Checkbox/CheckIcon.cjs.map +1 -1
- package/cjs/components/Checkbox/Checkbox.cjs +0 -1
- package/cjs/components/Checkbox/Checkbox.cjs.map +1 -1
- package/cjs/components/Checkbox/CheckboxCard/CheckboxCard.cjs +0 -1
- package/cjs/components/Checkbox/CheckboxCard/CheckboxCard.cjs.map +1 -1
- package/cjs/components/Checkbox/CheckboxGroup/CheckboxGroup.cjs +0 -1
- package/cjs/components/Checkbox/CheckboxGroup/CheckboxGroup.cjs.map +1 -1
- package/cjs/components/Checkbox/CheckboxIndicator/CheckboxIndicator.cjs +0 -1
- package/cjs/components/Checkbox/CheckboxIndicator/CheckboxIndicator.cjs.map +1 -1
- package/cjs/components/Chip/Chip.cjs +0 -1
- package/cjs/components/Chip/Chip.cjs.map +1 -1
- package/cjs/components/Chip/ChipGroup/ChipGroup.cjs +0 -1
- package/cjs/components/Chip/ChipGroup/ChipGroup.cjs.map +1 -1
- package/cjs/components/CloseButton/CloseButton.cjs +0 -1
- package/cjs/components/CloseButton/CloseButton.cjs.map +1 -1
- package/cjs/components/Code/Code.cjs +0 -1
- package/cjs/components/Code/Code.cjs.map +1 -1
- package/cjs/components/Collapse/Collapse.cjs +2 -2
- package/cjs/components/Collapse/Collapse.cjs.map +1 -1
- package/cjs/components/ColorInput/ColorInput.cjs +0 -1
- package/cjs/components/ColorInput/ColorInput.cjs.map +1 -1
- package/cjs/components/ColorInput/EyeDropperIcon.cjs +0 -1
- package/cjs/components/ColorInput/EyeDropperIcon.cjs.map +1 -1
- package/cjs/components/ColorPicker/AlphaSlider/AlphaSlider.cjs +0 -1
- package/cjs/components/ColorPicker/AlphaSlider/AlphaSlider.cjs.map +1 -1
- package/cjs/components/ColorPicker/ColorPicker.cjs +0 -1
- package/cjs/components/ColorPicker/ColorPicker.cjs.map +1 -1
- package/cjs/components/ColorPicker/ColorPicker.context.cjs +0 -1
- package/cjs/components/ColorPicker/ColorPicker.context.cjs.map +1 -1
- package/cjs/components/ColorPicker/ColorSlider/ColorSlider.cjs +0 -1
- package/cjs/components/ColorPicker/ColorSlider/ColorSlider.cjs.map +1 -1
- package/cjs/components/ColorPicker/HueSlider/HueSlider.cjs +0 -1
- package/cjs/components/ColorPicker/HueSlider/HueSlider.cjs.map +1 -1
- package/cjs/components/ColorPicker/Saturation/Saturation.cjs +0 -1
- package/cjs/components/ColorPicker/Saturation/Saturation.cjs.map +1 -1
- package/cjs/components/ColorPicker/Swatches/Swatches.cjs +0 -1
- package/cjs/components/ColorPicker/Swatches/Swatches.cjs.map +1 -1
- package/cjs/components/ColorPicker/Thumb/Thumb.cjs +0 -1
- package/cjs/components/ColorPicker/Thumb/Thumb.cjs.map +1 -1
- package/cjs/components/ColorSwatch/ColorSwatch.cjs +0 -1
- package/cjs/components/ColorSwatch/ColorSwatch.cjs.map +1 -1
- package/cjs/components/Combobox/Combobox.cjs +26 -4
- package/cjs/components/Combobox/Combobox.cjs.map +1 -1
- package/cjs/components/Combobox/Combobox.context.cjs.map +1 -1
- package/cjs/components/Combobox/Combobox.module.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxChevron/ComboboxChevron.cjs +0 -1
- package/cjs/components/Combobox/ComboboxChevron/ComboboxChevron.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxClearButton/ComboboxClearButton.cjs +0 -1
- package/cjs/components/Combobox/ComboboxClearButton/ComboboxClearButton.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxDropdown/ComboboxDropdown.cjs +1 -1
- package/cjs/components/Combobox/ComboboxDropdown/ComboboxDropdown.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.cjs +0 -1
- package/cjs/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxEmpty/ComboboxEmpty.cjs +0 -1
- package/cjs/components/Combobox/ComboboxEmpty/ComboboxEmpty.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.cjs +0 -1
- package/cjs/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxFooter/ComboboxFooter.cjs +0 -1
- package/cjs/components/Combobox/ComboboxFooter/ComboboxFooter.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxGroup/ComboboxGroup.cjs +0 -1
- package/cjs/components/Combobox/ComboboxGroup/ComboboxGroup.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxHeader/ComboboxHeader.cjs +0 -1
- package/cjs/components/Combobox/ComboboxHeader/ComboboxHeader.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxHiddenInput/ComboboxHiddenInput.cjs +0 -1
- package/cjs/components/Combobox/ComboboxHiddenInput/ComboboxHiddenInput.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxOption/ComboboxOption.cjs +0 -1
- package/cjs/components/Combobox/ComboboxOption/ComboboxOption.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxOptions/ComboboxOptions.cjs +0 -1
- package/cjs/components/Combobox/ComboboxOptions/ComboboxOptions.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxSearch/ComboboxSearch.cjs +0 -1
- package/cjs/components/Combobox/ComboboxSearch/ComboboxSearch.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxTarget/ComboboxTarget.cjs +0 -1
- package/cjs/components/Combobox/ComboboxTarget/ComboboxTarget.cjs.map +1 -1
- package/cjs/components/Combobox/OptionsDropdown/OptionsDropdown.cjs +4 -2
- package/cjs/components/Combobox/OptionsDropdown/OptionsDropdown.cjs.map +1 -1
- package/cjs/components/Combobox/use-combobox/use-combobox.cjs +0 -1
- package/cjs/components/Combobox/use-combobox/use-combobox.cjs.map +1 -1
- package/cjs/components/Combobox/use-combobox/use-virtualized-combobox.cjs +0 -1
- package/cjs/components/Combobox/use-combobox/use-virtualized-combobox.cjs.map +1 -1
- package/cjs/components/Combobox/use-combobox-target-props/use-combobox-target-props.cjs +0 -1
- package/cjs/components/Combobox/use-combobox-target-props/use-combobox-target-props.cjs.map +1 -1
- package/cjs/components/Combobox/use-pills-reorder/use-pills-reorder.cjs +0 -1
- package/cjs/components/Combobox/use-pills-reorder/use-pills-reorder.cjs.map +1 -1
- package/cjs/components/Container/Container.cjs +0 -1
- package/cjs/components/Container/Container.cjs.map +1 -1
- package/cjs/components/CopyButton/CopyButton.cjs +0 -1
- package/cjs/components/CopyButton/CopyButton.cjs.map +1 -1
- package/cjs/components/Dialog/Dialog.cjs +0 -1
- package/cjs/components/Dialog/Dialog.cjs.map +1 -1
- package/cjs/components/Divider/Divider.cjs +0 -1
- package/cjs/components/Divider/Divider.cjs.map +1 -1
- package/cjs/components/Drawer/Drawer.cjs +0 -1
- package/cjs/components/Drawer/Drawer.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerBody.cjs +0 -1
- package/cjs/components/Drawer/DrawerBody.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerCloseButton.cjs +0 -1
- package/cjs/components/Drawer/DrawerCloseButton.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerContent.cjs +0 -1
- package/cjs/components/Drawer/DrawerContent.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerHeader.cjs +0 -1
- package/cjs/components/Drawer/DrawerHeader.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerOverlay.cjs +0 -1
- package/cjs/components/Drawer/DrawerOverlay.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerRoot.cjs +0 -1
- package/cjs/components/Drawer/DrawerRoot.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerStack.cjs +0 -1
- package/cjs/components/Drawer/DrawerStack.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerTitle.cjs +0 -1
- package/cjs/components/Drawer/DrawerTitle.cjs.map +1 -1
- package/cjs/components/Fieldset/Fieldset.cjs +0 -1
- package/cjs/components/Fieldset/Fieldset.cjs.map +1 -1
- package/cjs/components/FileInput/FileInput.cjs +0 -1
- package/cjs/components/FileInput/FileInput.cjs.map +1 -1
- package/cjs/components/Flex/Flex.cjs +0 -1
- package/cjs/components/Flex/Flex.cjs.map +1 -1
- package/cjs/components/FloatingIndicator/FloatingIndicator.cjs +0 -1
- package/cjs/components/FloatingIndicator/FloatingIndicator.cjs.map +1 -1
- package/cjs/components/FloatingIndicator/use-floating-indicator.cjs +0 -1
- package/cjs/components/FloatingIndicator/use-floating-indicator.cjs.map +1 -1
- package/cjs/components/FloatingWindow/FloatingWindow.cjs +0 -1
- package/cjs/components/FloatingWindow/FloatingWindow.cjs.map +1 -1
- package/cjs/components/FocusTrap/FocusTrap.cjs +0 -1
- package/cjs/components/FocusTrap/FocusTrap.cjs.map +1 -1
- package/cjs/components/Grid/Grid.cjs +0 -1
- package/cjs/components/Grid/Grid.cjs.map +1 -1
- package/cjs/components/Grid/GridCol/GridColVariables.cjs +0 -1
- package/cjs/components/Grid/GridCol/GridColVariables.cjs.map +1 -1
- package/cjs/components/Grid/GridVariables.cjs +0 -1
- package/cjs/components/Grid/GridVariables.cjs.map +1 -1
- package/cjs/components/Group/Group.cjs +0 -1
- package/cjs/components/Group/Group.cjs.map +1 -1
- package/cjs/components/Group/filter-falsy-children/filter-falsy-children.cjs +0 -1
- package/cjs/components/Group/filter-falsy-children/filter-falsy-children.cjs.map +1 -1
- package/cjs/components/Highlight/Highlight.cjs +0 -1
- package/cjs/components/Highlight/Highlight.cjs.map +1 -1
- package/cjs/components/HoverCard/HoverCard.cjs +0 -1
- package/cjs/components/HoverCard/HoverCard.cjs.map +1 -1
- package/cjs/components/HoverCard/HoverCardDropdown/HoverCardDropdown.cjs +0 -1
- package/cjs/components/HoverCard/HoverCardDropdown/HoverCardDropdown.cjs.map +1 -1
- package/cjs/components/HoverCard/HoverCardGroup/HoverCardGroup.cjs +0 -1
- package/cjs/components/HoverCard/HoverCardGroup/HoverCardGroup.cjs.map +1 -1
- package/cjs/components/HoverCard/HoverCardTarget/HoverCardTarget.cjs +0 -1
- package/cjs/components/HoverCard/HoverCardTarget/HoverCardTarget.cjs.map +1 -1
- package/cjs/components/HoverCard/use-hover-card.cjs +0 -1
- package/cjs/components/HoverCard/use-hover-card.cjs.map +1 -1
- package/cjs/components/Image/Image.cjs +0 -1
- package/cjs/components/Image/Image.cjs.map +1 -1
- package/cjs/components/Indicator/Indicator.cjs +0 -1
- package/cjs/components/Indicator/Indicator.cjs.map +1 -1
- package/cjs/components/Input/Input.cjs +11 -3
- package/cjs/components/Input/Input.cjs.map +1 -1
- package/cjs/components/Input/Input.context.cjs +0 -1
- package/cjs/components/Input/Input.context.cjs.map +1 -1
- package/cjs/components/Input/Input.module.cjs +1 -0
- package/cjs/components/Input/Input.module.cjs.map +1 -1
- package/cjs/components/Input/InputClearButton/InputClearButton.cjs +0 -1
- package/cjs/components/Input/InputClearButton/InputClearButton.cjs.map +1 -1
- package/cjs/components/Input/InputClearSection/InputClearSection.cjs +0 -1
- package/cjs/components/Input/InputClearSection/InputClearSection.cjs.map +1 -1
- package/cjs/components/Input/InputDescription/InputDescription.cjs +0 -1
- package/cjs/components/Input/InputDescription/InputDescription.cjs.map +1 -1
- package/cjs/components/Input/InputError/InputError.cjs +0 -1
- package/cjs/components/Input/InputError/InputError.cjs.map +1 -1
- package/cjs/components/Input/InputLabel/InputLabel.cjs +0 -1
- package/cjs/components/Input/InputLabel/InputLabel.cjs.map +1 -1
- package/cjs/components/Input/InputPlaceholder/InputPlaceholder.cjs +0 -1
- package/cjs/components/Input/InputPlaceholder/InputPlaceholder.cjs.map +1 -1
- package/cjs/components/Input/InputWrapper/InputWrapper.cjs +0 -1
- package/cjs/components/Input/InputWrapper/InputWrapper.cjs.map +1 -1
- package/cjs/components/Input/InputWrapper.context.cjs +0 -1
- package/cjs/components/Input/InputWrapper.context.cjs.map +1 -1
- package/cjs/components/InputBase/InputBase.cjs +0 -1
- package/cjs/components/InputBase/InputBase.cjs.map +1 -1
- package/cjs/components/JsonInput/JsonInput.cjs +0 -1
- package/cjs/components/JsonInput/JsonInput.cjs.map +1 -1
- package/cjs/components/Kbd/Kbd.cjs +0 -1
- package/cjs/components/Kbd/Kbd.cjs.map +1 -1
- package/cjs/components/List/List.cjs +0 -1
- package/cjs/components/List/List.cjs.map +1 -1
- package/cjs/components/List/ListItem/ListItem.cjs +0 -1
- package/cjs/components/List/ListItem/ListItem.cjs.map +1 -1
- package/cjs/components/Loader/Loader.cjs +0 -1
- package/cjs/components/Loader/Loader.cjs.map +1 -1
- package/cjs/components/LoadingOverlay/LoadingOverlay.cjs +0 -1
- package/cjs/components/LoadingOverlay/LoadingOverlay.cjs.map +1 -1
- package/cjs/components/Mark/Mark.cjs +0 -1
- package/cjs/components/Mark/Mark.cjs.map +1 -1
- package/cjs/components/Marquee/Marquee.cjs +0 -1
- package/cjs/components/Marquee/Marquee.cjs.map +1 -1
- package/cjs/components/MaskInput/MaskInput.cjs +0 -1
- package/cjs/components/MaskInput/MaskInput.cjs.map +1 -1
- package/cjs/components/MaskInput/use-mask-input-props.cjs +0 -1
- package/cjs/components/MaskInput/use-mask-input-props.cjs.map +1 -1
- package/cjs/components/Menu/Menu.cjs +37 -4
- package/cjs/components/Menu/Menu.cjs.map +1 -1
- package/cjs/components/Menu/Menu.context.cjs.map +1 -1
- package/cjs/components/Menu/Menu.module.cjs +2 -0
- package/cjs/components/Menu/Menu.module.cjs.map +1 -1
- package/cjs/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.cjs +30 -0
- package/cjs/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.cjs.map +1 -0
- package/cjs/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.context.cjs +7 -0
- package/cjs/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.context.cjs.map +1 -0
- package/cjs/components/Menu/MenuCheckboxItem/MenuCheckboxItem.cjs +52 -0
- package/cjs/components/Menu/MenuCheckboxItem/MenuCheckboxItem.cjs.map +1 -0
- package/cjs/components/Menu/MenuContextMenu/MenuContextMenu.cjs +28 -0
- package/cjs/components/Menu/MenuContextMenu/MenuContextMenu.cjs.map +1 -0
- package/cjs/components/Menu/MenuDivider/MenuDivider.cjs +0 -1
- package/cjs/components/Menu/MenuDivider/MenuDivider.cjs.map +1 -1
- package/cjs/components/Menu/MenuDropdown/MenuDropdown.cjs +9 -2
- package/cjs/components/Menu/MenuDropdown/MenuDropdown.cjs.map +1 -1
- package/cjs/components/Menu/MenuItem/MenuItem.cjs +18 -2
- package/cjs/components/Menu/MenuItem/MenuItem.cjs.map +1 -1
- package/cjs/components/Menu/MenuLabel/MenuLabel.cjs +0 -1
- package/cjs/components/Menu/MenuLabel/MenuLabel.cjs.map +1 -1
- package/cjs/components/Menu/MenuRadioGroup/MenuRadioGroup.cjs +27 -0
- package/cjs/components/Menu/MenuRadioGroup/MenuRadioGroup.cjs.map +1 -0
- package/cjs/components/Menu/MenuRadioGroup/MenuRadioGroup.context.cjs +7 -0
- package/cjs/components/Menu/MenuRadioGroup/MenuRadioGroup.context.cjs.map +1 -0
- package/cjs/components/Menu/MenuRadioItem/MenuRadioItem.cjs +46 -0
- package/cjs/components/Menu/MenuRadioItem/MenuRadioItem.cjs.map +1 -0
- package/cjs/components/Menu/MenuSearch/MenuSearch.cjs +115 -0
- package/cjs/components/Menu/MenuSearch/MenuSearch.cjs.map +1 -0
- package/cjs/components/Menu/MenuSelectableItem/MenuSelectableItem.cjs +114 -0
- package/cjs/components/Menu/MenuSelectableItem/MenuSelectableItem.cjs.map +1 -0
- package/cjs/components/Menu/MenuSub/MenuSub.cjs +16 -14
- package/cjs/components/Menu/MenuSub/MenuSub.cjs.map +1 -1
- package/cjs/components/Menu/MenuSub/MenuSub.context.cjs +0 -1
- package/cjs/components/Menu/MenuSub/MenuSub.context.cjs.map +1 -1
- package/cjs/components/Menu/MenuSubDropdown/MenuSubDropdown.cjs +13 -2
- package/cjs/components/Menu/MenuSubDropdown/MenuSubDropdown.cjs.map +1 -1
- package/cjs/components/Menu/MenuSubItem/MenuSubItem.cjs +18 -2
- package/cjs/components/Menu/MenuSubItem/MenuSubItem.cjs.map +1 -1
- package/cjs/components/Menu/MenuSubTarget/MenuSubTarget.cjs +0 -1
- package/cjs/components/Menu/MenuSubTarget/MenuSubTarget.cjs.map +1 -1
- package/cjs/components/Menu/MenuTarget/MenuTarget.cjs +0 -1
- package/cjs/components/Menu/MenuTarget/MenuTarget.cjs.map +1 -1
- package/cjs/components/Menu/use-menu-type-ahead.cjs +72 -0
- package/cjs/components/Menu/use-menu-type-ahead.cjs.map +1 -0
- package/cjs/components/Modal/Modal.cjs +0 -1
- package/cjs/components/Modal/Modal.cjs.map +1 -1
- package/cjs/components/Modal/ModalBody.cjs +0 -1
- package/cjs/components/Modal/ModalBody.cjs.map +1 -1
- package/cjs/components/Modal/ModalCloseButton.cjs +0 -1
- package/cjs/components/Modal/ModalCloseButton.cjs.map +1 -1
- package/cjs/components/Modal/ModalContent.cjs +0 -1
- package/cjs/components/Modal/ModalContent.cjs.map +1 -1
- package/cjs/components/Modal/ModalHeader.cjs +0 -1
- package/cjs/components/Modal/ModalHeader.cjs.map +1 -1
- package/cjs/components/Modal/ModalOverlay.cjs +0 -1
- package/cjs/components/Modal/ModalOverlay.cjs.map +1 -1
- package/cjs/components/Modal/ModalRoot.cjs +0 -1
- package/cjs/components/Modal/ModalRoot.cjs.map +1 -1
- package/cjs/components/Modal/ModalStack.cjs +0 -1
- package/cjs/components/Modal/ModalStack.cjs.map +1 -1
- package/cjs/components/Modal/ModalTitle.cjs +0 -1
- package/cjs/components/Modal/ModalTitle.cjs.map +1 -1
- package/cjs/components/Modal/use-modals-stack.cjs +0 -1
- package/cjs/components/Modal/use-modals-stack.cjs.map +1 -1
- package/cjs/components/ModalBase/ModalBase.cjs +0 -1
- package/cjs/components/ModalBase/ModalBase.cjs.map +1 -1
- package/cjs/components/ModalBase/ModalBaseOverlay.cjs +0 -1
- package/cjs/components/ModalBase/ModalBaseOverlay.cjs.map +1 -1
- package/cjs/components/ModalBase/NativeScrollArea.cjs +0 -1
- package/cjs/components/ModalBase/NativeScrollArea.cjs.map +1 -1
- package/cjs/components/ModalBase/use-lock-scroll.cjs +0 -1
- package/cjs/components/ModalBase/use-lock-scroll.cjs.map +1 -1
- package/cjs/components/ModalBase/use-modal-body-id.cjs +0 -1
- package/cjs/components/ModalBase/use-modal-body-id.cjs.map +1 -1
- package/cjs/components/ModalBase/use-modal-title-id.cjs +0 -1
- package/cjs/components/ModalBase/use-modal-title-id.cjs.map +1 -1
- package/cjs/components/ModalBase/use-modal.cjs +0 -1
- package/cjs/components/ModalBase/use-modal.cjs.map +1 -1
- package/cjs/components/MultiSelect/MultiSelect.cjs +2 -2
- package/cjs/components/MultiSelect/MultiSelect.cjs.map +1 -1
- package/cjs/components/NativeSelect/NativeSelect.cjs +0 -1
- package/cjs/components/NativeSelect/NativeSelect.cjs.map +1 -1
- package/cjs/components/NativeSelect/NativeSelectOption.cjs +0 -1
- package/cjs/components/NativeSelect/NativeSelectOption.cjs.map +1 -1
- package/cjs/components/NavLink/NavLink.cjs +0 -1
- package/cjs/components/NavLink/NavLink.cjs.map +1 -1
- package/cjs/components/Notification/Notification.cjs +0 -1
- package/cjs/components/Notification/Notification.cjs.map +1 -1
- package/cjs/components/NumberFormatter/NumberFormatter.cjs +0 -1
- package/cjs/components/NumberFormatter/NumberFormatter.cjs.map +1 -1
- package/cjs/components/NumberInput/NumberInputChevron.cjs +0 -1
- package/cjs/components/NumberInput/NumberInputChevron.cjs.map +1 -1
- package/cjs/components/OverflowList/OverflowList.cjs +68 -10
- package/cjs/components/OverflowList/OverflowList.cjs.map +1 -1
- package/cjs/components/OverflowList/use-dimensions.cjs +0 -1
- package/cjs/components/OverflowList/use-dimensions.cjs.map +1 -1
- package/cjs/components/Overlay/Overlay.cjs +0 -1
- package/cjs/components/Overlay/Overlay.cjs.map +1 -1
- package/cjs/components/Pagination/Pagination.cjs +14 -3
- package/cjs/components/Pagination/Pagination.cjs.map +1 -1
- package/cjs/components/Pagination/Pagination.context.cjs.map +1 -1
- package/cjs/components/Pagination/Pagination.icons.cjs +0 -1
- package/cjs/components/Pagination/Pagination.icons.cjs.map +1 -1
- package/cjs/components/Pagination/Pagination.module.cjs +3 -1
- package/cjs/components/Pagination/Pagination.module.cjs.map +1 -1
- package/cjs/components/Pagination/PaginationControl/PaginationControl.cjs +0 -1
- package/cjs/components/Pagination/PaginationControl/PaginationControl.cjs.map +1 -1
- package/cjs/components/Pagination/PaginationDots/PaginationDots.cjs +0 -1
- package/cjs/components/Pagination/PaginationDots/PaginationDots.cjs.map +1 -1
- package/cjs/components/Pagination/PaginationEdges/PaginationEdges.cjs +0 -1
- package/cjs/components/Pagination/PaginationEdges/PaginationEdges.cjs.map +1 -1
- package/cjs/components/Pagination/PaginationItems/PaginationItems.cjs +0 -1
- package/cjs/components/Pagination/PaginationItems/PaginationItems.cjs.map +1 -1
- package/cjs/components/Pagination/PaginationLabel/PaginationLabel.cjs +32 -0
- package/cjs/components/Pagination/PaginationLabel/PaginationLabel.cjs.map +1 -0
- package/cjs/components/Pagination/PaginationRoot/PaginationRoot.cjs +3 -2
- package/cjs/components/Pagination/PaginationRoot/PaginationRoot.cjs.map +1 -1
- package/cjs/components/Paper/Paper.cjs +0 -1
- package/cjs/components/Paper/Paper.cjs.map +1 -1
- package/cjs/components/PasswordInput/PasswordToggleIcon.cjs +0 -1
- package/cjs/components/PasswordInput/PasswordToggleIcon.cjs.map +1 -1
- package/cjs/components/Pill/Pill.cjs +0 -1
- package/cjs/components/Pill/Pill.cjs.map +1 -1
- package/cjs/components/Pill/PillGroup/PillGroup.cjs +0 -1
- package/cjs/components/Pill/PillGroup/PillGroup.cjs.map +1 -1
- package/cjs/components/PillsInput/PillsInput.cjs +0 -1
- package/cjs/components/PillsInput/PillsInput.cjs.map +1 -1
- package/cjs/components/PillsInput/PillsInput.context.cjs +0 -1
- package/cjs/components/PillsInput/PillsInput.context.cjs.map +1 -1
- package/cjs/components/PillsInput/PillsInputField/PillsInputField.cjs +0 -1
- package/cjs/components/PillsInput/PillsInputField/PillsInputField.cjs.map +1 -1
- package/cjs/components/PinInput/PinInput.cjs +0 -1
- package/cjs/components/PinInput/PinInput.cjs.map +1 -1
- package/cjs/components/Popover/Popover.cjs +5 -10
- package/cjs/components/Popover/Popover.cjs.map +1 -1
- package/cjs/components/Popover/PopoverContextMenu/PopoverContextMenu.cjs +28 -0
- package/cjs/components/Popover/PopoverContextMenu/PopoverContextMenu.cjs.map +1 -0
- package/cjs/components/Popover/PopoverDropdown/PopoverDropdown.cjs +8 -1
- package/cjs/components/Popover/PopoverDropdown/PopoverDropdown.cjs.map +1 -1
- package/cjs/components/Popover/use-popover.cjs +52 -20
- package/cjs/components/Popover/use-popover.cjs.map +1 -1
- package/cjs/components/Portal/OptionalPortal.cjs +0 -1
- package/cjs/components/Portal/OptionalPortal.cjs.map +1 -1
- package/cjs/components/Portal/Portal.cjs +0 -1
- package/cjs/components/Portal/Portal.cjs.map +1 -1
- package/cjs/components/Progress/Progress.cjs +0 -1
- package/cjs/components/Progress/Progress.cjs.map +1 -1
- package/cjs/components/Progress/ProgressLabel/ProgressLabel.cjs +0 -1
- package/cjs/components/Progress/ProgressLabel/ProgressLabel.cjs.map +1 -1
- package/cjs/components/Progress/ProgressRoot/ProgressRoot.cjs +0 -1
- package/cjs/components/Progress/ProgressRoot/ProgressRoot.cjs.map +1 -1
- package/cjs/components/Progress/ProgressSection/ProgressSection.cjs +0 -1
- package/cjs/components/Progress/ProgressSection/ProgressSection.cjs.map +1 -1
- package/cjs/components/Radio/Radio.cjs +1 -2
- package/cjs/components/Radio/Radio.cjs.map +1 -1
- package/cjs/components/Radio/RadioCard/RadioCard.cjs +0 -1
- package/cjs/components/Radio/RadioCard/RadioCard.cjs.map +1 -1
- package/cjs/components/Radio/RadioGroup/RadioGroup.cjs +0 -1
- package/cjs/components/Radio/RadioGroup/RadioGroup.cjs.map +1 -1
- package/cjs/components/Radio/RadioIcon.cjs +0 -1
- package/cjs/components/Radio/RadioIcon.cjs.map +1 -1
- package/cjs/components/Radio/RadioIndicator/RadioIndicator.cjs +2 -3
- package/cjs/components/Radio/RadioIndicator/RadioIndicator.cjs.map +1 -1
- package/cjs/components/Rating/Rating.cjs +0 -1
- package/cjs/components/Rating/Rating.cjs.map +1 -1
- package/cjs/components/Rating/RatingItem/RatingItem.cjs +0 -1
- package/cjs/components/Rating/RatingItem/RatingItem.cjs.map +1 -1
- package/cjs/components/Rating/StarSymbol/StarIcon.cjs +0 -1
- package/cjs/components/Rating/StarSymbol/StarIcon.cjs.map +1 -1
- package/cjs/components/Rating/StarSymbol/StarSymbol.cjs +0 -1
- package/cjs/components/Rating/StarSymbol/StarSymbol.cjs.map +1 -1
- package/cjs/components/RingProgress/Curve/Curve.cjs +0 -1
- package/cjs/components/RingProgress/Curve/Curve.cjs.map +1 -1
- package/cjs/components/RingProgress/RingProgress.cjs +0 -1
- package/cjs/components/RingProgress/RingProgress.cjs.map +1 -1
- package/cjs/components/RollingNumber/DigitColumn.cjs +0 -1
- package/cjs/components/RollingNumber/DigitColumn.cjs.map +1 -1
- package/cjs/components/RollingNumber/RollingNumber.cjs +0 -1
- package/cjs/components/RollingNumber/RollingNumber.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollArea.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollArea.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaCorner/ScrollAreaCorner.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollAreaCorner/ScrollAreaCorner.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbar.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbar.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarHover.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarHover.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarScroll.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarScroll.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarVisible.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarVisible.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollbarX.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollbarX.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollbarY.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollbarY.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaThumb/ScrollAreaThumb.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollAreaThumb/ScrollAreaThumb.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.cjs +0 -1
- package/cjs/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.cjs.map +1 -1
- package/cjs/components/ScrollArea/use-resize-observer.cjs +0 -1
- package/cjs/components/ScrollArea/use-resize-observer.cjs.map +1 -1
- package/cjs/components/Scroller/Scroller.cjs +0 -1
- package/cjs/components/Scroller/Scroller.cjs.map +1 -1
- package/cjs/components/SegmentedControl/SegmentedControl.cjs +0 -1
- package/cjs/components/SegmentedControl/SegmentedControl.cjs.map +1 -1
- package/cjs/components/SegmentedControl/SegmentedControl.module.cjs.map +1 -1
- package/cjs/components/Select/Select.cjs +2 -2
- package/cjs/components/Select/Select.cjs.map +1 -1
- package/cjs/components/SemiCircleProgress/SemiCircleProgress.cjs +0 -1
- package/cjs/components/SemiCircleProgress/SemiCircleProgress.cjs.map +1 -1
- package/cjs/components/SimpleGrid/SimpleGrid.cjs +0 -1
- package/cjs/components/SimpleGrid/SimpleGrid.cjs.map +1 -1
- package/cjs/components/SimpleGrid/SimpleGridVariables.cjs +0 -1
- package/cjs/components/SimpleGrid/SimpleGridVariables.cjs.map +1 -1
- package/cjs/components/Skeleton/Skeleton.cjs +0 -1
- package/cjs/components/Skeleton/Skeleton.cjs.map +1 -1
- package/cjs/components/Slider/Marks/Marks.cjs +0 -1
- package/cjs/components/Slider/Marks/Marks.cjs.map +1 -1
- package/cjs/components/Slider/RangeSlider/RangeSlider.cjs +0 -1
- package/cjs/components/Slider/RangeSlider/RangeSlider.cjs.map +1 -1
- package/cjs/components/Slider/Slider/Slider.cjs +0 -1
- package/cjs/components/Slider/Slider/Slider.cjs.map +1 -1
- package/cjs/components/Slider/SliderRoot/SliderRoot.cjs +0 -1
- package/cjs/components/Slider/SliderRoot/SliderRoot.cjs.map +1 -1
- package/cjs/components/Slider/Thumb/Thumb.cjs +0 -1
- package/cjs/components/Slider/Thumb/Thumb.cjs.map +1 -1
- package/cjs/components/Slider/Track/Track.cjs +0 -1
- package/cjs/components/Slider/Track/Track.cjs.map +1 -1
- package/cjs/components/Space/Space.cjs +0 -1
- package/cjs/components/Space/Space.cjs.map +1 -1
- package/cjs/components/Splitter/GripIcon.cjs +55 -0
- package/cjs/components/Splitter/GripIcon.cjs.map +1 -0
- package/cjs/components/Splitter/Splitter.cjs +111 -0
- package/cjs/components/Splitter/Splitter.cjs.map +1 -0
- package/cjs/components/Splitter/Splitter.context.cjs +8 -0
- package/cjs/components/Splitter/Splitter.context.cjs.map +1 -0
- package/cjs/components/Splitter/Splitter.module.cjs +12 -0
- package/cjs/components/Splitter/Splitter.module.cjs.map +1 -0
- package/cjs/components/Splitter/SplitterPane/SplitterPane.cjs +34 -0
- package/cjs/components/Splitter/SplitterPane/SplitterPane.cjs.map +1 -0
- package/cjs/components/Spoiler/Spoiler.cjs +0 -1
- package/cjs/components/Spoiler/Spoiler.cjs.map +1 -1
- package/cjs/components/Stack/Stack.cjs +0 -1
- package/cjs/components/Stack/Stack.cjs.map +1 -1
- package/cjs/components/Stepper/Stepper.cjs +0 -1
- package/cjs/components/Stepper/Stepper.cjs.map +1 -1
- package/cjs/components/Stepper/Stepper.module.cjs.map +1 -1
- package/cjs/components/Stepper/StepperStep/StepperStep.cjs +0 -1
- package/cjs/components/Stepper/StepperStep/StepperStep.cjs.map +1 -1
- package/cjs/components/Switch/Switch.cjs +0 -1
- package/cjs/components/Switch/Switch.cjs.map +1 -1
- package/cjs/components/Switch/SwitchGroup/SwitchGroup.cjs +0 -1
- package/cjs/components/Switch/SwitchGroup/SwitchGroup.cjs.map +1 -1
- package/cjs/components/Table/Table.cjs +0 -1
- package/cjs/components/Table/Table.cjs.map +1 -1
- package/cjs/components/Table/Table.components.cjs +0 -1
- package/cjs/components/Table/Table.components.cjs.map +1 -1
- package/cjs/components/Table/Table.module.cjs.map +1 -1
- package/cjs/components/Table/TableDataRenderer.cjs +0 -1
- package/cjs/components/Table/TableDataRenderer.cjs.map +1 -1
- package/cjs/components/Table/TableScrollContainer.cjs +0 -1
- package/cjs/components/Table/TableScrollContainer.cjs.map +1 -1
- package/cjs/components/TableOfContents/TableOfContents.cjs +0 -1
- package/cjs/components/TableOfContents/TableOfContents.cjs.map +1 -1
- package/cjs/components/Tabs/Tabs.cjs +0 -1
- package/cjs/components/Tabs/Tabs.cjs.map +1 -1
- package/cjs/components/Tabs/Tabs.module.cjs.map +1 -1
- package/cjs/components/Tabs/TabsList/TabsList.cjs +0 -1
- package/cjs/components/Tabs/TabsList/TabsList.cjs.map +1 -1
- package/cjs/components/Tabs/TabsPanel/TabsPanel.cjs +0 -1
- package/cjs/components/Tabs/TabsPanel/TabsPanel.cjs.map +1 -1
- package/cjs/components/Tabs/TabsTab/TabsTab.cjs +0 -1
- package/cjs/components/Tabs/TabsTab/TabsTab.cjs.map +1 -1
- package/cjs/components/TagsInput/TagsInput.cjs +2 -2
- package/cjs/components/TagsInput/TagsInput.cjs.map +1 -1
- package/cjs/components/Text/Text.cjs +4 -4
- package/cjs/components/Text/Text.cjs.map +1 -1
- package/cjs/components/Text/Text.module.cjs.map +1 -1
- package/cjs/components/TextInput/TextInput.cjs +0 -1
- package/cjs/components/TextInput/TextInput.cjs.map +1 -1
- package/cjs/components/Textarea/Textarea.cjs +3 -2
- package/cjs/components/Textarea/Textarea.cjs.map +1 -1
- package/cjs/components/ThemeIcon/ThemeIcon.cjs +0 -1
- package/cjs/components/ThemeIcon/ThemeIcon.cjs.map +1 -1
- package/cjs/components/Timeline/Timeline.cjs +0 -1
- package/cjs/components/Timeline/Timeline.cjs.map +1 -1
- package/cjs/components/Timeline/Timeline.module.cjs.map +1 -1
- package/cjs/components/Timeline/TimelineItem/TimelineItem.cjs +0 -1
- package/cjs/components/Timeline/TimelineItem/TimelineItem.cjs.map +1 -1
- package/cjs/components/Title/Title.cjs +0 -1
- package/cjs/components/Title/Title.cjs.map +1 -1
- package/cjs/components/Tooltip/Tooltip.cjs +7 -0
- package/cjs/components/Tooltip/Tooltip.cjs.map +1 -1
- package/cjs/components/Tooltip/TooltipFloating/TooltipFloating.cjs +0 -1
- package/cjs/components/Tooltip/TooltipFloating/TooltipFloating.cjs.map +1 -1
- package/cjs/components/Tooltip/TooltipFloating/use-floating-tooltip.cjs +0 -1
- package/cjs/components/Tooltip/TooltipFloating/use-floating-tooltip.cjs.map +1 -1
- package/cjs/components/Tooltip/TooltipGroup/TooltipGroup.cjs +0 -1
- package/cjs/components/Tooltip/TooltipGroup/TooltipGroup.cjs.map +1 -1
- package/cjs/components/Tooltip/use-tooltip.cjs +6 -3
- package/cjs/components/Tooltip/use-tooltip.cjs.map +1 -1
- package/cjs/components/Transition/Transition.cjs +0 -1
- package/cjs/components/Transition/Transition.cjs.map +1 -1
- package/cjs/components/Tree/FlatTreeNode.cjs +13 -5
- package/cjs/components/Tree/FlatTreeNode.cjs.map +1 -1
- package/cjs/components/Tree/Tree.cjs +0 -1
- package/cjs/components/Tree/Tree.cjs.map +1 -1
- package/cjs/components/Tree/Tree.module.cjs +3 -1
- package/cjs/components/Tree/Tree.module.cjs.map +1 -1
- package/cjs/components/Tree/TreeNode.cjs +14 -3
- package/cjs/components/Tree/TreeNode.cjs.map +1 -1
- package/cjs/components/Tree/flatten-tree-data/flatten-tree-data.cjs +9 -4
- package/cjs/components/Tree/flatten-tree-data/flatten-tree-data.cjs.map +1 -1
- package/cjs/components/Tree/use-tree-node-drag-drop.cjs +13 -5
- package/cjs/components/Tree/use-tree-node-drag-drop.cjs.map +1 -1
- package/cjs/components/Tree/use-tree.cjs +0 -1
- package/cjs/components/Tree/use-tree.cjs.map +1 -1
- package/cjs/components/TreeSelect/TreeSelect.cjs +0 -1
- package/cjs/components/TreeSelect/TreeSelect.cjs.map +1 -1
- package/cjs/components/TreeSelect/TreeSelectOption.cjs +0 -1
- package/cjs/components/TreeSelect/TreeSelectOption.cjs.map +1 -1
- package/cjs/components/Typography/Typography.cjs +0 -1
- package/cjs/components/Typography/Typography.cjs.map +1 -1
- package/cjs/components/Typography/Typography.module.cjs.map +1 -1
- package/cjs/components/UnstyledButton/UnstyledButton.cjs +0 -1
- package/cjs/components/UnstyledButton/UnstyledButton.cjs.map +1 -1
- package/cjs/components/UnstyledButton/UnstyledButton.module.cjs.map +1 -1
- package/cjs/components/VisuallyHidden/VisuallyHidden.cjs +0 -1
- package/cjs/components/VisuallyHidden/VisuallyHidden.cjs.map +1 -1
- package/cjs/core/Box/use-random-classname/use-random-classname.cjs +0 -1
- package/cjs/core/Box/use-random-classname/use-random-classname.cjs.map +1 -1
- package/cjs/core/DirectionProvider/DirectionProvider.cjs +0 -1
- package/cjs/core/DirectionProvider/DirectionProvider.cjs.map +1 -1
- package/cjs/core/InlineStyles/InlineStyles.cjs +0 -1
- package/cjs/core/InlineStyles/InlineStyles.cjs.map +1 -1
- package/cjs/core/MantineProvider/ColorSchemeScript/ColorSchemeScript.cjs +0 -1
- package/cjs/core/MantineProvider/ColorSchemeScript/ColorSchemeScript.cjs.map +1 -1
- package/cjs/core/MantineProvider/Mantine.context.cjs +0 -1
- package/cjs/core/MantineProvider/Mantine.context.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineClasses/MantineClasses.cjs +0 -1
- package/cjs/core/MantineProvider/MantineClasses/MantineClasses.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineCssVariables/MantineCssVariables.cjs +0 -1
- package/cjs/core/MantineProvider/MantineCssVariables/MantineCssVariables.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineProvider.cjs +0 -1
- package/cjs/core/MantineProvider/MantineProvider.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineThemeProvider/MantineThemeProvider.cjs +0 -1
- package/cjs/core/MantineProvider/MantineThemeProvider/MantineThemeProvider.cjs.map +1 -1
- package/cjs/core/MantineProvider/use-mantine-color-scheme/use-computed-color-scheme.cjs +0 -1
- package/cjs/core/MantineProvider/use-mantine-color-scheme/use-computed-color-scheme.cjs.map +1 -1
- package/cjs/core/MantineProvider/use-mantine-color-scheme/use-mantine-color-scheme.cjs +0 -1
- package/cjs/core/MantineProvider/use-mantine-color-scheme/use-mantine-color-scheme.cjs.map +1 -1
- package/cjs/core/MantineProvider/use-mantine-color-scheme/use-provider-color-scheme.cjs +0 -1
- package/cjs/core/MantineProvider/use-mantine-color-scheme/use-provider-color-scheme.cjs.map +1 -1
- package/cjs/core/MantineProvider/use-matches/use-matches.cjs +0 -1
- package/cjs/core/MantineProvider/use-matches/use-matches.cjs.map +1 -1
- package/cjs/core/MantineProvider/use-respect-reduce-motion/use-respect-reduce-motion.cjs +0 -1
- package/cjs/core/MantineProvider/use-respect-reduce-motion/use-respect-reduce-motion.cjs.map +1 -1
- package/cjs/core/factory/factory.cjs +0 -1
- package/cjs/core/factory/factory.cjs.map +1 -1
- package/cjs/core/factory/polymorphic-factory.cjs +0 -1
- package/cjs/core/factory/polymorphic-factory.cjs.map +1 -1
- package/cjs/core/utils/create-safe-context/create-safe-context.cjs +0 -1
- package/cjs/core/utils/create-safe-context/create-safe-context.cjs.map +1 -1
- package/cjs/core/utils/create-use-external-events/create-use-external-events.cjs +0 -1
- package/cjs/core/utils/create-use-external-events/create-use-external-events.cjs.map +1 -1
- package/cjs/core/utils/get-single-element-child/get-single-element-child.cjs +0 -1
- package/cjs/core/utils/get-single-element-child/get-single-element-child.cjs.map +1 -1
- package/cjs/core/utils/is-element/is-element.cjs +0 -1
- package/cjs/core/utils/is-element/is-element.cjs.map +1 -1
- package/cjs/core/utils/use-hovered/use-hovered.cjs +0 -1
- package/cjs/core/utils/use-hovered/use-hovered.cjs.map +1 -1
- package/cjs/index.cjs +25 -2
- package/cjs/utils/Floating/FloatingArrow/FloatingArrow.cjs +0 -1
- package/cjs/utils/Floating/FloatingArrow/FloatingArrow.cjs.map +1 -1
- package/cjs/utils/Floating/FloatingArrow/get-arrow-position-styles.cjs +59 -0
- package/cjs/utils/Floating/FloatingArrow/get-arrow-position-styles.cjs.map +1 -1
- package/cjs/utils/Floating/use-context-menu-handlers.cjs +85 -0
- package/cjs/utils/Floating/use-context-menu-handlers.cjs.map +1 -0
- package/cjs/utils/Floating/use-delayed-hover.cjs +0 -1
- package/cjs/utils/Floating/use-delayed-hover.cjs.map +1 -1
- package/cjs/utils/InlineInput/InlineInput.cjs +0 -1
- package/cjs/utils/InlineInput/InlineInput.cjs.map +1 -1
- package/cjs/utils/InputsGroupFieldset/InputsGroupFieldset.cjs +0 -1
- package/cjs/utils/InputsGroupFieldset/InputsGroupFieldset.cjs.map +1 -1
- package/esm/components/Autocomplete/Autocomplete.mjs +2 -1
- package/esm/components/Autocomplete/Autocomplete.mjs.map +1 -1
- package/esm/components/Blockquote/Blockquote.mjs +4 -3
- package/esm/components/Blockquote/Blockquote.mjs.map +1 -1
- package/esm/components/Blockquote/Blockquote.module.mjs.map +1 -1
- package/esm/components/Checkbox/CheckboxIndicator/CheckboxIndicator.mjs.map +1 -1
- package/esm/components/Collapse/Collapse.mjs +2 -1
- package/esm/components/Collapse/Collapse.mjs.map +1 -1
- package/esm/components/Combobox/Combobox.context.mjs.map +1 -1
- package/esm/components/Combobox/Combobox.mjs +26 -3
- package/esm/components/Combobox/Combobox.mjs.map +1 -1
- package/esm/components/Combobox/Combobox.module.mjs.map +1 -1
- package/esm/components/Combobox/ComboboxDropdown/ComboboxDropdown.mjs +1 -0
- package/esm/components/Combobox/ComboboxDropdown/ComboboxDropdown.mjs.map +1 -1
- package/esm/components/Combobox/OptionsDropdown/OptionsDropdown.mjs +4 -2
- package/esm/components/Combobox/OptionsDropdown/OptionsDropdown.mjs.map +1 -1
- package/esm/components/Dialog/Dialog.mjs.map +1 -1
- package/esm/components/Input/Input.mjs +11 -2
- package/esm/components/Input/Input.mjs.map +1 -1
- package/esm/components/Input/Input.module.mjs +1 -0
- package/esm/components/Input/Input.module.mjs.map +1 -1
- package/esm/components/Menu/Menu.context.mjs.map +1 -1
- package/esm/components/Menu/Menu.mjs +37 -3
- package/esm/components/Menu/Menu.mjs.map +1 -1
- package/esm/components/Menu/Menu.module.mjs +2 -0
- package/esm/components/Menu/Menu.module.mjs.map +1 -1
- package/esm/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.context.mjs +8 -0
- package/esm/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.context.mjs.map +1 -0
- package/esm/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.mjs +30 -0
- package/esm/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.mjs.map +1 -0
- package/esm/components/Menu/MenuCheckboxItem/MenuCheckboxItem.mjs +52 -0
- package/esm/components/Menu/MenuCheckboxItem/MenuCheckboxItem.mjs.map +1 -0
- package/esm/components/Menu/MenuContextMenu/MenuContextMenu.mjs +28 -0
- package/esm/components/Menu/MenuContextMenu/MenuContextMenu.mjs.map +1 -0
- package/esm/components/Menu/MenuDropdown/MenuDropdown.mjs +9 -1
- package/esm/components/Menu/MenuDropdown/MenuDropdown.mjs.map +1 -1
- package/esm/components/Menu/MenuItem/MenuItem.mjs +18 -1
- package/esm/components/Menu/MenuItem/MenuItem.mjs.map +1 -1
- package/esm/components/Menu/MenuRadioGroup/MenuRadioGroup.context.mjs +8 -0
- package/esm/components/Menu/MenuRadioGroup/MenuRadioGroup.context.mjs.map +1 -0
- package/esm/components/Menu/MenuRadioGroup/MenuRadioGroup.mjs +27 -0
- package/esm/components/Menu/MenuRadioGroup/MenuRadioGroup.mjs.map +1 -0
- package/esm/components/Menu/MenuRadioItem/MenuRadioItem.mjs +46 -0
- package/esm/components/Menu/MenuRadioItem/MenuRadioItem.mjs.map +1 -0
- package/esm/components/Menu/MenuSearch/MenuSearch.mjs +115 -0
- package/esm/components/Menu/MenuSearch/MenuSearch.mjs.map +1 -0
- package/esm/components/Menu/MenuSelectableItem/MenuSelectableItem.mjs +114 -0
- package/esm/components/Menu/MenuSelectableItem/MenuSelectableItem.mjs.map +1 -0
- package/esm/components/Menu/MenuSub/MenuSub.mjs +18 -15
- package/esm/components/Menu/MenuSub/MenuSub.mjs.map +1 -1
- package/esm/components/Menu/MenuSubDropdown/MenuSubDropdown.mjs +13 -1
- package/esm/components/Menu/MenuSubDropdown/MenuSubDropdown.mjs.map +1 -1
- package/esm/components/Menu/MenuSubItem/MenuSubItem.mjs +18 -1
- package/esm/components/Menu/MenuSubItem/MenuSubItem.mjs.map +1 -1
- package/esm/components/Menu/use-menu-type-ahead.mjs +72 -0
- package/esm/components/Menu/use-menu-type-ahead.mjs.map +1 -0
- package/esm/components/MultiSelect/MultiSelect.mjs +2 -1
- package/esm/components/MultiSelect/MultiSelect.mjs.map +1 -1
- package/esm/components/OverflowList/OverflowList.mjs +69 -10
- package/esm/components/OverflowList/OverflowList.mjs.map +1 -1
- package/esm/components/Pagination/Pagination.context.mjs.map +1 -1
- package/esm/components/Pagination/Pagination.mjs +15 -3
- package/esm/components/Pagination/Pagination.mjs.map +1 -1
- package/esm/components/Pagination/Pagination.module.mjs +3 -1
- package/esm/components/Pagination/Pagination.module.mjs.map +1 -1
- package/esm/components/Pagination/PaginationLabel/PaginationLabel.mjs +32 -0
- package/esm/components/Pagination/PaginationLabel/PaginationLabel.mjs.map +1 -0
- package/esm/components/Pagination/PaginationRoot/PaginationRoot.mjs +3 -1
- package/esm/components/Pagination/PaginationRoot/PaginationRoot.mjs.map +1 -1
- package/esm/components/Popover/Popover.mjs +5 -9
- package/esm/components/Popover/Popover.mjs.map +1 -1
- package/esm/components/Popover/PopoverContextMenu/PopoverContextMenu.mjs +28 -0
- package/esm/components/Popover/PopoverContextMenu/PopoverContextMenu.mjs.map +1 -0
- package/esm/components/Popover/PopoverDropdown/PopoverDropdown.mjs +8 -0
- package/esm/components/Popover/PopoverDropdown/PopoverDropdown.mjs.map +1 -1
- package/esm/components/Popover/use-popover.mjs +53 -20
- package/esm/components/Popover/use-popover.mjs.map +1 -1
- package/esm/components/Radio/Radio.mjs +1 -1
- package/esm/components/Radio/RadioIndicator/RadioIndicator.mjs +2 -2
- package/esm/components/Radio/RadioIndicator/RadioIndicator.mjs.map +1 -1
- package/esm/components/SegmentedControl/SegmentedControl.module.mjs.map +1 -1
- package/esm/components/Select/Select.mjs +2 -1
- package/esm/components/Select/Select.mjs.map +1 -1
- package/esm/components/Splitter/GripIcon.mjs +52 -0
- package/esm/components/Splitter/GripIcon.mjs.map +1 -0
- package/esm/components/Splitter/Splitter.context.mjs +8 -0
- package/esm/components/Splitter/Splitter.context.mjs.map +1 -0
- package/esm/components/Splitter/Splitter.mjs +111 -0
- package/esm/components/Splitter/Splitter.mjs.map +1 -0
- package/esm/components/Splitter/Splitter.module.mjs +12 -0
- package/esm/components/Splitter/Splitter.module.mjs.map +1 -0
- package/esm/components/Splitter/SplitterPane/SplitterPane.mjs +34 -0
- package/esm/components/Splitter/SplitterPane/SplitterPane.mjs.map +1 -0
- package/esm/components/Stepper/Stepper.module.mjs.map +1 -1
- package/esm/components/Table/Table.module.mjs.map +1 -1
- package/esm/components/Tabs/Tabs.module.mjs.map +1 -1
- package/esm/components/TagsInput/TagsInput.mjs +2 -1
- package/esm/components/TagsInput/TagsInput.mjs.map +1 -1
- package/esm/components/Text/Text.mjs +4 -3
- package/esm/components/Text/Text.mjs.map +1 -1
- package/esm/components/Text/Text.module.mjs.map +1 -1
- package/esm/components/Textarea/Textarea.mjs +3 -1
- package/esm/components/Textarea/Textarea.mjs.map +1 -1
- package/esm/components/Timeline/Timeline.module.mjs.map +1 -1
- package/esm/components/Tooltip/Tooltip.mjs +7 -0
- package/esm/components/Tooltip/Tooltip.mjs.map +1 -1
- package/esm/components/Tooltip/use-tooltip.mjs +8 -4
- package/esm/components/Tooltip/use-tooltip.mjs.map +1 -1
- package/esm/components/Tree/FlatTreeNode.mjs +14 -5
- package/esm/components/Tree/FlatTreeNode.mjs.map +1 -1
- package/esm/components/Tree/Tree.mjs.map +1 -1
- package/esm/components/Tree/Tree.module.mjs +3 -1
- package/esm/components/Tree/Tree.module.mjs.map +1 -1
- package/esm/components/Tree/TreeNode.mjs +14 -2
- package/esm/components/Tree/TreeNode.mjs.map +1 -1
- package/esm/components/Tree/flatten-tree-data/flatten-tree-data.mjs +9 -4
- package/esm/components/Tree/flatten-tree-data/flatten-tree-data.mjs.map +1 -1
- package/esm/components/Tree/use-tree-node-drag-drop.mjs +13 -4
- package/esm/components/Tree/use-tree-node-drag-drop.mjs.map +1 -1
- package/esm/components/Typography/Typography.module.mjs.map +1 -1
- package/esm/components/UnstyledButton/UnstyledButton.module.mjs.map +1 -1
- package/esm/index.mjs +14 -2
- package/esm/utils/Floating/FloatingArrow/get-arrow-position-styles.mjs +59 -1
- package/esm/utils/Floating/FloatingArrow/get-arrow-position-styles.mjs.map +1 -1
- package/esm/utils/Floating/use-context-menu-handlers.mjs +85 -0
- package/esm/utils/Floating/use-context-menu-handlers.mjs.map +1 -0
- package/lib/components/Blockquote/Blockquote.d.ts +3 -1
- package/lib/components/Checkbox/CheckboxIndicator/CheckboxIndicator.d.ts +1 -1
- package/lib/components/Collapse/Collapse.d.ts +1 -1
- package/lib/components/Combobox/Combobox.context.d.ts +1 -0
- package/lib/components/Combobox/Combobox.d.ts +2 -0
- package/lib/components/Combobox/Combobox.types.d.ts +2 -0
- package/lib/components/Combobox/OptionsDropdown/OptionsDropdown.d.ts +3 -1
- package/lib/components/Dialog/Dialog.d.ts +1 -1
- package/lib/components/Input/Input.d.ts +5 -1
- package/lib/components/MaskInput/use-mask-input-props.d.ts +3 -0
- package/lib/components/Menu/Menu.context.d.ts +5 -0
- package/lib/components/Menu/Menu.d.ts +41 -1
- package/lib/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.context.d.ts +5 -0
- package/lib/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.d.ts +14 -0
- package/lib/components/Menu/MenuCheckboxItem/MenuCheckboxItem.d.ts +37 -0
- package/lib/components/Menu/MenuContextMenu/MenuContextMenu.d.ts +12 -0
- package/lib/components/Menu/MenuItem/MenuItem.d.ts +1 -1
- package/lib/components/Menu/MenuRadioGroup/MenuRadioGroup.context.d.ts +5 -0
- package/lib/components/Menu/MenuRadioGroup/MenuRadioGroup.d.ts +14 -0
- package/lib/components/Menu/MenuRadioItem/MenuRadioItem.d.ts +35 -0
- package/lib/components/Menu/MenuSearch/MenuSearch.d.ts +19 -0
- package/lib/components/Menu/MenuSelectableItem/MenuSelectableItem.d.ts +20 -0
- package/lib/components/Menu/MenuSub/MenuSub.d.ts +2 -0
- package/lib/components/Menu/MenuSubItem/MenuSubItem.d.ts +1 -1
- package/lib/components/Menu/index.d.ts +13 -1
- package/lib/components/Menu/use-menu-type-ahead.d.ts +7 -0
- package/lib/components/OverflowList/OverflowList.d.ts +7 -2
- package/lib/components/Pagination/Pagination.context.d.ts +1 -0
- package/lib/components/Pagination/Pagination.d.ts +8 -0
- package/lib/components/Pagination/PaginationLabel/PaginationLabel.d.ts +22 -0
- package/lib/components/Pagination/PaginationRoot/PaginationRoot.d.ts +3 -1
- package/lib/components/Pagination/index.d.ts +3 -1
- package/lib/components/Popover/Popover.d.ts +6 -1
- package/lib/components/Popover/PopoverContextMenu/PopoverContextMenu.d.ts +12 -0
- package/lib/components/Popover/index.d.ts +3 -1
- package/lib/components/Popover/use-popover.d.ts +1 -3
- package/lib/components/Radio/RadioIndicator/RadioIndicator.d.ts +1 -1
- package/lib/components/Splitter/GripIcon.d.ts +3 -0
- package/lib/components/Splitter/Splitter.context.d.ts +9 -0
- package/lib/components/Splitter/Splitter.d.ts +57 -0
- package/lib/components/Splitter/SplitterPane/SplitterPane.d.ts +30 -0
- package/lib/components/Splitter/index.d.ts +18 -0
- package/lib/components/Text/Text.d.ts +3 -1
- package/lib/components/Textarea/Textarea.d.ts +4 -0
- package/lib/components/Tree/FlatTreeNode.d.ts +5 -1
- package/lib/components/Tree/Tree.d.ts +2 -0
- package/lib/components/Tree/flatten-tree-data/flatten-tree-data.d.ts +10 -0
- package/lib/components/Tree/index.d.ts +1 -1
- package/lib/components/Tree/use-tree-node-drag-drop.d.ts +2 -1
- package/lib/components/index.d.ts +1 -0
- package/lib/utils/Floating/FloatingArrow/get-arrow-position-styles.d.ts +4 -0
- package/lib/utils/Floating/index.d.ts +1 -0
- package/lib/utils/Floating/types.d.ts +1 -1
- package/lib/utils/Floating/use-context-menu-handlers.d.ts +25 -0
- package/package.json +2 -2
- package/styles/Blockquote.css +1 -0
- package/styles/Blockquote.layer.css +1 -0
- package/styles/Combobox.css +8 -0
- package/styles/Combobox.layer.css +8 -0
- package/styles/Input.css +25 -4
- package/styles/Input.layer.css +25 -4
- package/styles/Menu.css +41 -2
- package/styles/Menu.layer.css +41 -2
- package/styles/Pagination.css +33 -0
- package/styles/Pagination.layer.css +33 -0
- package/styles/SegmentedControl.css +4 -1
- package/styles/SegmentedControl.layer.css +4 -1
- package/styles/Splitter.css +76 -0
- package/styles/Splitter.layer.css +77 -0
- package/styles/Stepper.css +1 -5
- package/styles/Stepper.layer.css +1 -5
- package/styles/Table.css +1 -5
- package/styles/Table.layer.css +1 -5
- package/styles/Tabs.css +13 -28
- package/styles/Tabs.layer.css +13 -28
- package/styles/Text.css +3 -2
- package/styles/Text.layer.css +3 -2
- package/styles/Timeline.css +14 -42
- package/styles/Timeline.layer.css +14 -42
- package/styles/Tree.css +55 -11
- package/styles/Tree.layer.css +55 -11
- package/styles/Typography.css +1 -1
- package/styles/Typography.layer.css +1 -1
- package/styles/UnstyledButton.css +1 -5
- package/styles/UnstyledButton.layer.css +1 -5
- package/styles.css +278 -106
- package/styles.layer.css +278 -106
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControl.cjs","names":["createVarsResolver","getRadius","getThemeColor","getSize","getFontSize","genericFactory","useProps","useStyles","useMantineTheme","isPrimitive","Box","getContrastColor","FloatingIndicator","classes"],"sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n randomId,\n useId,\n useMergedRef,\n useMounted,\n useShallowEffect,\n useUncontrolled,\n} from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n Factory,\n genericFactory,\n getContrastColor,\n getFontSize,\n getRadius,\n getSize,\n getThemeColor,\n isPrimitive,\n MantineColor,\n MantineRadius,\n MantineSize,\n Primitive,\n StylesApiProps,\n useMantineTheme,\n useProps,\n useStyles,\n} from '../../core';\nimport { FloatingIndicator } from '../FloatingIndicator';\nimport classes from './SegmentedControl.module.css';\n\nexport type SegmentedControlStylesNames =\n | 'root'\n | 'input'\n | 'label'\n | 'control'\n | 'indicator'\n | 'innerLabel';\nexport type SegmentedControlCssVariables = {\n root:\n | '--sc-radius'\n | '--sc-color'\n | '--sc-font-size'\n | '--sc-padding'\n | '--sc-shadow'\n | '--sc-transition-duration'\n | '--sc-transition-timing-function';\n};\n\nexport interface SegmentedControlItem<Value = string> {\n value: Value;\n label: React.ReactNode;\n disabled?: boolean;\n}\n\nexport interface SegmentedControlProps<Value extends Primitive = string>\n extends\n BoxProps,\n StylesApiProps<SegmentedControlFactory>,\n ElementProps<'div', 'onChange' | 'value' | 'defaultValue'> {\n /** Data based on which controls are rendered */\n data: (Value | SegmentedControlItem<Value>)[];\n\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 /** Determines whether the component is disabled */\n disabled?: boolean;\n\n /** Name attribute for the radio group. A random name is auto-generated if not provided */\n name?: string;\n\n /** Determines whether the component should take 100% width of its parent @default false */\n fullWidth?: boolean;\n\n /** Key of `theme.colors` or any valid CSS color, changes indicator background color. By default, uses white in light mode and dark.5 in dark mode */\n color?: MantineColor;\n\n /** Controls `font-size`, `padding` and `height` properties @default 'sm' */\n size?: MantineSize | (string & {});\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Indicator `transition-duration` in ms, set `0` to turn off transitions @default 200 */\n transitionDuration?: number;\n\n /** Indicator `transition-timing-function` property @default ease */\n transitionTimingFunction?: string;\n\n /** Component orientation @default 'horizontal' */\n orientation?: 'vertical' | 'horizontal';\n\n /** If set to `false`, prevents changing the value */\n readOnly?: boolean;\n\n /** If set, automatically adjusts label text color for optimal contrast against the indicator background color */\n autoContrast?: boolean;\n\n /** Determines whether there should be borders between items @default true */\n withItemsBorders?: boolean;\n}\n\nexport type SegmentedControlFactory = Factory<{\n props: SegmentedControlProps;\n ref: HTMLDivElement;\n stylesNames: SegmentedControlStylesNames;\n vars: SegmentedControlCssVariables;\n signature: <Value extends Primitive = string>(\n props: SegmentedControlProps<Value>\n ) => React.JSX.Element | null;\n}>;\n\nconst defaultProps = {\n withItemsBorders: true,\n} satisfies Partial<SegmentedControlProps>;\n\nconst varsResolver = createVarsResolver<SegmentedControlFactory>(\n (theme, { radius, color, transitionDuration, size, transitionTimingFunction }) => ({\n root: {\n '--sc-radius': radius === undefined ? undefined : getRadius(radius),\n '--sc-color': color ? getThemeColor(color, theme) : undefined,\n '--sc-shadow': color ? undefined : 'var(--mantine-shadow-xs)',\n '--sc-transition-duration':\n transitionDuration === undefined ? undefined : `${transitionDuration}ms`,\n '--sc-transition-timing-function': transitionTimingFunction,\n '--sc-padding': getSize(size, 'sc-padding'),\n '--sc-font-size': getFontSize(size),\n },\n })\n);\n\nexport const SegmentedControl = genericFactory<SegmentedControlFactory>((_props) => {\n const props = useProps('SegmentedControl', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n data,\n value,\n defaultValue,\n onChange,\n size,\n name,\n disabled,\n readOnly,\n fullWidth,\n orientation,\n radius,\n color,\n transitionDuration,\n transitionTimingFunction,\n variant,\n autoContrast,\n withItemsBorders,\n mod,\n attributes,\n ref,\n ...others\n } = props;\n\n const getStyles = useStyles<SegmentedControlFactory>({\n name: 'SegmentedControl',\n props: props as any,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const theme = useMantineTheme();\n\n const _data = data.map((item) => (isPrimitive(item) ? { label: `${item}`, value: item } : item));\n\n const initialized = useMounted();\n const [key, setKey] = useState(randomId());\n const [parent, setParent] = useState<HTMLElement | null>(null);\n const [refs, setRefs] = useState<Record<string, HTMLElement | null>>({});\n const setElementRef = (element: HTMLElement | null, val: string) => {\n refs[val] = element;\n setRefs(refs);\n };\n\n const [_value, handleValueChange] = useUncontrolled({\n value,\n defaultValue,\n finalValue: Array.isArray(data)\n ? (_data.find((item) => !item.disabled)?.value ?? (data[0] as any)?.value ?? null)\n : null,\n onChange,\n });\n\n const uuid = useId(name);\n\n const controls = _data.map((item) => (\n <Box\n {...getStyles('control')}\n mod={{ active: _value === item.value, orientation }}\n key={`${item.value}`}\n >\n <input\n {...getStyles('input')}\n disabled={disabled || item.disabled}\n type=\"radio\"\n name={uuid}\n value={`${item.value}`}\n id={`${uuid}-${item.value}`}\n checked={_value === item.value}\n onChange={() => !readOnly && handleValueChange(item.value)}\n data-focus-ring={theme.focusRing}\n key={`${item.value}-input`}\n />\n\n <Box\n component=\"label\"\n {...getStyles('label')}\n mod={{\n active: _value === item.value && !(disabled || item.disabled),\n disabled: disabled || item.disabled,\n 'read-only': readOnly,\n }}\n htmlFor={`${uuid}-${item.value}`}\n ref={(node) => setElementRef(node, `${item.value}`)}\n __vars={{\n '--sc-label-color':\n color !== undefined ? getContrastColor({ color, theme, autoContrast }) : undefined,\n }}\n key={`${item.value}-label`}\n >\n <span {...getStyles('innerLabel')}>{item.label}</span>\n </Box>\n </Box>\n ));\n\n const mergedRef = useMergedRef(ref, setParent);\n\n useShallowEffect(() => {\n setKey(randomId());\n }, [data.length]);\n\n if (data.length === 0) {\n return null;\n }\n\n return (\n <Box\n {...getStyles('root')}\n variant={variant}\n size={size}\n ref={mergedRef}\n mod={[\n {\n 'full-width': fullWidth,\n orientation,\n initialized,\n 'with-items-borders': withItemsBorders,\n },\n mod,\n ]}\n {...others}\n role=\"radiogroup\"\n data-disabled={disabled}\n >\n {typeof _value !== 'undefined' && (\n <FloatingIndicator\n target={refs[`${_value}`]}\n parent={parent}\n component=\"span\"\n transitionDuration=\"var(--sc-transition-duration)\"\n key={key}\n {...getStyles('indicator')}\n />\n )}\n\n {controls}\n </Box>\n );\n});\n\nSegmentedControl.classes = classes;\nSegmentedControl.varsResolver = varsResolver;\nSegmentedControl.displayName = '@mantine/core/SegmentedControl';\n\nexport namespace SegmentedControl {\n export type CssVariables = SegmentedControlCssVariables;\n export type Factory = SegmentedControlFactory;\n export type Item<Value extends Primitive = string> = SegmentedControlItem<Value>;\n export type Props<Value extends Primitive = string> = SegmentedControlProps<Value>;\n export type StylesNames = SegmentedControlStylesNames;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AA0HA,MAAM,eAAe,EACnB,kBAAkB,KACpB;AAEA,MAAM,eAAeA,6BAAAA,oBAClB,OAAO,EAAE,QAAQ,OAAO,oBAAoB,MAAM,gCAAgC,EACjF,MAAM;CACJ,eAAe,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,MAAM;CAClE,cAAc,QAAQC,wBAAAA,cAAc,OAAO,KAAK,IAAI,KAAA;CACpD,eAAe,QAAQ,KAAA,IAAY;CACnC,4BACE,uBAAuB,KAAA,IAAY,KAAA,IAAY,GAAG,mBAAmB;CACvE,mCAAmC;CACnC,gBAAgBC,iBAAAA,QAAQ,MAAM,YAAY;CAC1C,kBAAkBC,iBAAAA,YAAY,IAAI;AACpC,EACF,EACF;AAEA,MAAa,mBAAmBC,gBAAAA,gBAAyC,WAAW;CAClF,MAAM,QAAQC,kBAAAA,SAAS,oBAAoB,cAAc,MAAM;CAC/D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,OACA,cACA,UACA,MACA,MACA,UACA,UACA,WACA,aACA,QACA,OACA,oBACA,0BACA,SACA,cACA,kBACA,KACA,YACA,KACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAmC;EACnD,MAAM;EACC;EACP,SAAA,gCAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,QAAQC,6BAAAA,gBAAgB;CAE9B,MAAM,QAAQ,KAAK,KAAK,SAAUC,kBAAAA,YAAY,IAAI,IAAI;EAAE,OAAO,GAAG;EAAQ,OAAO;CAAK,IAAI,IAAK;CAE/F,MAAM,eAAA,GAAA,eAAA,YAAyB;CAC/B,MAAM,CAAC,KAAK,WAAA,GAAA,MAAA,WAAA,GAAA,eAAA,UAA4B,CAAC;CACzC,MAAM,CAAC,QAAQ,cAAA,GAAA,MAAA,UAA0C,IAAI;CAC7D,MAAM,CAAC,MAAM,YAAA,GAAA,MAAA,UAAwD,CAAC,CAAC;CACvE,MAAM,iBAAiB,SAA6B,QAAgB;EAClE,KAAK,OAAO;EACZ,QAAQ,IAAI;CACd;CAEA,MAAM,CAAC,QAAQ,sBAAA,GAAA,eAAA,iBAAqC;EAClD;EACA;EACA,YAAY,MAAM,QAAQ,IAAI,IACzB,MAAM,MAAM,SAAS,CAAC,KAAK,QAAQ,GAAG,SAAU,KAAK,IAAY,SAAS,OAC3E;EACJ;CACF,CAAC;CAED,MAAM,QAAA,GAAA,eAAA,OAAa,IAAI;CAEvB,MAAM,WAAW,MAAM,KAAK,SAC1B,iBAAA,GAAA,MAAA,eAACC,YAAAA,KAAD;EACE,GAAI,UAAU,SAAS;EACvB,KAAK;GAAE,QAAQ,WAAW,KAAK;GAAO;EAAY;EAClD,KAAK,GAAG,KAAK;CAiCV,GA/BH,iBAAA,GAAA,MAAA,eAAC,SAAD;EACE,GAAI,UAAU,OAAO;EACrB,UAAU,YAAY,KAAK;EAC3B,MAAK;EACL,MAAM;EACN,OAAO,GAAG,KAAK;EACf,IAAI,GAAG,KAAK,GAAG,KAAK;EACpB,SAAS,WAAW,KAAK;EACzB,gBAAgB,CAAC,YAAY,kBAAkB,KAAK,KAAK;EACzD,mBAAiB,MAAM;EACvB,KAAK,GAAG,KAAK,MAAM;CACpB,CAAA,GAED,iBAAA,GAAA,MAAA,eAACA,YAAAA,KAAD;EACE,WAAU;EACV,GAAI,UAAU,OAAO;EACrB,KAAK;GACH,QAAQ,WAAW,KAAK,SAAS,EAAE,YAAY,KAAK;GACpD,UAAU,YAAY,KAAK;GAC3B,aAAa;EACf;EACA,SAAS,GAAG,KAAK,GAAG,KAAK;EACzB,MAAM,SAAS,cAAc,MAAM,GAAG,KAAK,OAAO;EAClD,QAAQ,EACN,oBACE,UAAU,KAAA,IAAYC,2BAAAA,iBAAiB;GAAE;GAAO;GAAO;EAAa,CAAC,IAAI,KAAA,EAC7E;EACA,KAAK,GAAG,KAAK,MAAM;CAGhB,GADH,iBAAA,GAAA,kBAAA,KAAC,QAAD;EAAM,GAAI,UAAU,YAAY;YAAI,KAAK;CAAY,CAAA,CAClD,CACF,CACN;CAED,MAAM,aAAA,GAAA,eAAA,cAAyB,KAAK,SAAS;CAE7C,CAAA,GAAA,eAAA,wBAAuB;EACrB,QAAA,GAAA,eAAA,UAAgB,CAAC;CACnB,GAAG,CAAC,KAAK,MAAM,CAAC;CAEhB,IAAI,KAAK,WAAW,GAClB,OAAO;CAGT,OACE,iBAAA,GAAA,kBAAA,MAACD,YAAAA,KAAD;EACE,GAAI,UAAU,MAAM;EACX;EACH;EACN,KAAK;EACL,KAAK,CACH;GACE,cAAc;GACd;GACA;GACA,sBAAsB;EACxB,GACA,GACF;EACA,GAAI;EACJ,MAAK;EACL,iBAAe;YAhBjB,CAkBG,OAAO,WAAW,eACjB,iBAAA,GAAA,kBAAA,KAACE,0BAAAA,mBAAD;GACE,QAAQ,KAAK,GAAG;GACR;GACR,WAAU;GACV,oBAAmB;GAEnB,GAAI,UAAU,WAAW;EAC1B,GAFM,GAEN,GAGF,QACE;;AAET,CAAC;AAED,iBAAiB,UAAUC,gCAAAA;AAC3B,iBAAiB,eAAe;AAChC,iBAAiB,cAAc"}
|
|
1
|
+
{"version":3,"file":"SegmentedControl.cjs","names":["createVarsResolver","getRadius","getThemeColor","getSize","getFontSize","genericFactory","useProps","useStyles","useMantineTheme","isPrimitive","Box","getContrastColor","FloatingIndicator","classes"],"sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n randomId,\n useId,\n useMergedRef,\n useMounted,\n useShallowEffect,\n useUncontrolled,\n} from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n Factory,\n genericFactory,\n getContrastColor,\n getFontSize,\n getRadius,\n getSize,\n getThemeColor,\n isPrimitive,\n MantineColor,\n MantineRadius,\n MantineSize,\n Primitive,\n StylesApiProps,\n useMantineTheme,\n useProps,\n useStyles,\n} from '../../core';\nimport { FloatingIndicator } from '../FloatingIndicator';\nimport classes from './SegmentedControl.module.css';\n\nexport type SegmentedControlStylesNames =\n | 'root'\n | 'input'\n | 'label'\n | 'control'\n | 'indicator'\n | 'innerLabel';\nexport type SegmentedControlCssVariables = {\n root:\n | '--sc-radius'\n | '--sc-color'\n | '--sc-font-size'\n | '--sc-padding'\n | '--sc-shadow'\n | '--sc-transition-duration'\n | '--sc-transition-timing-function';\n};\n\nexport interface SegmentedControlItem<Value = string> {\n value: Value;\n label: React.ReactNode;\n disabled?: boolean;\n}\n\nexport interface SegmentedControlProps<Value extends Primitive = string>\n extends\n BoxProps,\n StylesApiProps<SegmentedControlFactory>,\n ElementProps<'div', 'onChange' | 'value' | 'defaultValue'> {\n /** Data based on which controls are rendered */\n data: (Value | SegmentedControlItem<Value>)[];\n\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 /** Determines whether the component is disabled */\n disabled?: boolean;\n\n /** Name attribute for the radio group. A random name is auto-generated if not provided */\n name?: string;\n\n /** Determines whether the component should take 100% width of its parent @default false */\n fullWidth?: boolean;\n\n /** Key of `theme.colors` or any valid CSS color, changes indicator background color. By default, uses white in light mode and dark.5 in dark mode */\n color?: MantineColor;\n\n /** Controls `font-size`, `padding` and `height` properties @default 'sm' */\n size?: MantineSize | (string & {});\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Indicator `transition-duration` in ms, set `0` to turn off transitions @default 200 */\n transitionDuration?: number;\n\n /** Indicator `transition-timing-function` property @default ease */\n transitionTimingFunction?: string;\n\n /** Component orientation @default 'horizontal' */\n orientation?: 'vertical' | 'horizontal';\n\n /** If set to `false`, prevents changing the value */\n readOnly?: boolean;\n\n /** If set, automatically adjusts label text color for optimal contrast against the indicator background color */\n autoContrast?: boolean;\n\n /** Determines whether there should be borders between items @default true */\n withItemsBorders?: boolean;\n}\n\nexport type SegmentedControlFactory = Factory<{\n props: SegmentedControlProps;\n ref: HTMLDivElement;\n stylesNames: SegmentedControlStylesNames;\n vars: SegmentedControlCssVariables;\n signature: <Value extends Primitive = string>(\n props: SegmentedControlProps<Value>\n ) => React.JSX.Element | null;\n}>;\n\nconst defaultProps = {\n withItemsBorders: true,\n} satisfies Partial<SegmentedControlProps>;\n\nconst varsResolver = createVarsResolver<SegmentedControlFactory>(\n (theme, { radius, color, transitionDuration, size, transitionTimingFunction }) => ({\n root: {\n '--sc-radius': radius === undefined ? undefined : getRadius(radius),\n '--sc-color': color ? getThemeColor(color, theme) : undefined,\n '--sc-shadow': color ? undefined : 'var(--mantine-shadow-xs)',\n '--sc-transition-duration':\n transitionDuration === undefined ? undefined : `${transitionDuration}ms`,\n '--sc-transition-timing-function': transitionTimingFunction,\n '--sc-padding': getSize(size, 'sc-padding'),\n '--sc-font-size': getFontSize(size),\n },\n })\n);\n\nexport const SegmentedControl = genericFactory<SegmentedControlFactory>((_props) => {\n const props = useProps('SegmentedControl', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n data,\n value,\n defaultValue,\n onChange,\n size,\n name,\n disabled,\n readOnly,\n fullWidth,\n orientation,\n radius,\n color,\n transitionDuration,\n transitionTimingFunction,\n variant,\n autoContrast,\n withItemsBorders,\n mod,\n attributes,\n ref,\n ...others\n } = props;\n\n const getStyles = useStyles<SegmentedControlFactory>({\n name: 'SegmentedControl',\n props: props as any,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const theme = useMantineTheme();\n\n const _data = data.map((item) => (isPrimitive(item) ? { label: `${item}`, value: item } : item));\n\n const initialized = useMounted();\n const [key, setKey] = useState(randomId());\n const [parent, setParent] = useState<HTMLElement | null>(null);\n const [refs, setRefs] = useState<Record<string, HTMLElement | null>>({});\n const setElementRef = (element: HTMLElement | null, val: string) => {\n refs[val] = element;\n setRefs(refs);\n };\n\n const [_value, handleValueChange] = useUncontrolled({\n value,\n defaultValue,\n finalValue: Array.isArray(data)\n ? (_data.find((item) => !item.disabled)?.value ?? (data[0] as any)?.value ?? null)\n : null,\n onChange,\n });\n\n const uuid = useId(name);\n\n const controls = _data.map((item) => (\n <Box\n {...getStyles('control')}\n mod={{ active: _value === item.value, orientation }}\n key={`${item.value}`}\n >\n <input\n {...getStyles('input')}\n disabled={disabled || item.disabled}\n type=\"radio\"\n name={uuid}\n value={`${item.value}`}\n id={`${uuid}-${item.value}`}\n checked={_value === item.value}\n onChange={() => !readOnly && handleValueChange(item.value)}\n data-focus-ring={theme.focusRing}\n key={`${item.value}-input`}\n />\n\n <Box\n component=\"label\"\n {...getStyles('label')}\n mod={{\n active: _value === item.value && !(disabled || item.disabled),\n disabled: disabled || item.disabled,\n 'read-only': readOnly,\n }}\n htmlFor={`${uuid}-${item.value}`}\n ref={(node) => setElementRef(node, `${item.value}`)}\n __vars={{\n '--sc-label-color':\n color !== undefined ? getContrastColor({ color, theme, autoContrast }) : undefined,\n }}\n key={`${item.value}-label`}\n >\n <span {...getStyles('innerLabel')}>{item.label}</span>\n </Box>\n </Box>\n ));\n\n const mergedRef = useMergedRef(ref, setParent);\n\n useShallowEffect(() => {\n setKey(randomId());\n }, [data.length]);\n\n if (data.length === 0) {\n return null;\n }\n\n return (\n <Box\n {...getStyles('root')}\n variant={variant}\n size={size}\n ref={mergedRef}\n mod={[\n {\n 'full-width': fullWidth,\n orientation,\n initialized,\n 'with-items-borders': withItemsBorders,\n },\n mod,\n ]}\n {...others}\n role=\"radiogroup\"\n data-disabled={disabled}\n >\n {typeof _value !== 'undefined' && (\n <FloatingIndicator\n target={refs[`${_value}`]}\n parent={parent}\n component=\"span\"\n transitionDuration=\"var(--sc-transition-duration)\"\n key={key}\n {...getStyles('indicator')}\n />\n )}\n\n {controls}\n </Box>\n );\n});\n\nSegmentedControl.classes = classes;\nSegmentedControl.varsResolver = varsResolver;\nSegmentedControl.displayName = '@mantine/core/SegmentedControl';\n\nexport namespace SegmentedControl {\n export type CssVariables = SegmentedControlCssVariables;\n export type Factory = SegmentedControlFactory;\n export type Item<Value extends Primitive = string> = SegmentedControlItem<Value>;\n export type Props<Value extends Primitive = string> = SegmentedControlProps<Value>;\n export type StylesNames = SegmentedControlStylesNames;\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SegmentedControl.module.cjs","names":[],"sources":["../../../src/components/SegmentedControl/SegmentedControl.module.css"],"sourcesContent":[".root {\n --sc-padding-xs: 2px 6px;\n --sc-padding-sm: 3px 10px;\n --sc-padding-md: 4px 14px;\n --sc-padding-lg: 7px 16px;\n --sc-padding-xl: 10px 20px;\n\n --sc-transition-duration: 200ms;\n --sc-padding: var(--sc-padding-sm);\n --sc-transition-timing-function: ease;\n --sc-font-size: var(--mantine-font-size-sm);\n\n position: relative;\n display: inline-flex;\n flex-direction: row;\n width: auto;\n border-radius: var(--sc-radius, var(--mantine-radius-default));\n overflow: hidden;\n padding: 4px;\n\n &:where([data-full-width]) {\n display: flex;\n }\n\n &:where([data-orientation='vertical']) {\n display: flex;\n flex-direction: column;\n width: max-content;\n\n &:where([data-full-width]) {\n width: auto;\n }\n }\n\n @mixin where-light {\n background-color: var(--mantine-color-gray-1);\n }\n\n @mixin where-dark {\n background-color: var(--mantine-color-dark-8);\n }\n}\n\n.indicator {\n position: absolute;\n display: block;\n z-index: 1;\n border-radius: calc(var(--sc-radius, var(--mantine-radius-default)) - 4px);\n\n @mixin where-light {\n box-shadow: var(--sc-shadow, none);\n background-color: var(--sc-color, var(--mantine-color-white));\n }\n\n @mixin where-dark {\n box-shadow: none;\n background-color: var(--sc-color, var(--mantine-color-dark-5));\n }\n}\n\n.label {\n -webkit-tap-highlight-color: transparent;\n font-weight: var(--mantine-font-weight-medium);\n display: block;\n text-align: center;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n user-select: none;\n border-radius: calc(var(--sc-radius, var(--mantine-radius-default)) - 4px);\n font-size: var(--sc-font-size);\n padding: var(--sc-padding);\n transition: color var(--sc-transition-duration) var(--sc-transition-timing-function);\n cursor: pointer;\n\n /* outline is controlled by .input */\n outline: var(--segmented-control-outline, none);\n\n @mixin where-light {\n color: var(--mantine-color-gray-7);\n }\n\n @mixin where-dark {\n color: var(--mantine-color-dark-1);\n }\n\n &:where([data-read-only]) {\n cursor: default;\n }\n\n fieldset:disabled &,\n &:where([data-disabled]) {\n cursor: not-allowed;\n color: var(--mantine-color-disabled-color);\n }\n\n &:where([data-active]) {\n @mixin where-light {\n color: var(--sc-label-color, var(--mantine-color-black));\n }\n\n @mixin where-dark {\n color: var(--sc-label-color, var(--mantine-color-white));\n }\n\n &::before {\n .root:where([data-initialized]) & {\n display: none;\n }\n content: '';\n inset: 0;\n z-index: 0;\n position: absolute;\n border-radius: calc(var(--sc-radius, var(--mantine-radius-default)) - 4px);\n\n @mixin where-light {\n box-shadow: var(--sc-shadow, none);\n background-color: var(--sc-color, var(--mantine-color-white));\n }\n\n @mixin where-dark {\n box-shadow: none;\n background-color: var(--sc-color, var(--mantine-color-dark-5));\n }\n }\n }\n\n &:where(:not([data-disabled], [data-active], [data-read-only])) {\n @mixin hover {\n @mixin where-light {\n color: var(--mantine-color-black);\n }\n\n @mixin where-dark {\n color: var(--mantine-color-white);\n }\n }\n }\n\n fieldset:disabled & {\n @mixin hover {\n color: var(--mantine-color-disabled-color) !important;\n }\n }\n}\n\n.input {\n height: 0;\n width: 0;\n position: absolute;\n overflow: hidden;\n white-space: nowrap;\n opacity: 0;\n\n &[data-focus-ring='auto'] {\n &:focus:focus-visible {\n & + .label {\n --segmented-control-outline: 2px solid var(--mantine-primary-color-filled);\n }\n }\n }\n\n &[data-focus-ring='always'] {\n &:focus {\n & + .label {\n --segmented-control-outline: 2px solid var(--mantine-primary-color-filled);\n }\n }\n }\n}\n\n.control {\n position: relative;\n flex: 1;\n z-index: 2;\n transition: border-color var(--sc-transition-duration) var(--sc-transition-timing-function);\n\n .root[data-with-items-borders] :where(&)::before {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n inset-inline-start: 0;\n background-color: var(--separator-color);\n width: 1px;\n transition: background-color var(--sc-transition-duration) var(--sc-transition-timing-function);\n }\n\n &[data-orientation='vertical'] {\n &::before {\n top: 0;\n inset-inline: 0;\n bottom: auto;\n height: 1px;\n width: auto;\n }\n }\n\n @mixin where-light {\n --separator-color: var(--mantine-color-gray-3);\n }\n\n @mixin where-dark {\n --separator-color: var(--mantine-color-dark-4);\n }\n\n &:first-of-type {\n &::before {\n --separator-color: transparent;\n }\n }\n\n &[data-active] {\n [data-mantine-color-scheme] & {\n &,\n & + .control {\n &::before {\n --separator-color: transparent;\n }\n }\n }\n }\n}\n\n.innerLabel {\n position: relative;\n z-index: 2;\n}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"SegmentedControl.module.cjs","names":[],"sources":["../../../src/components/SegmentedControl/SegmentedControl.module.css"],"sourcesContent":[".root {\n --sc-padding-xs: 2px 6px;\n --sc-padding-sm: 3px 10px;\n --sc-padding-md: 4px 14px;\n --sc-padding-lg: 7px 16px;\n --sc-padding-xl: 10px 20px;\n\n --sc-transition-duration: 200ms;\n --sc-padding: var(--sc-padding-sm);\n --sc-transition-timing-function: ease;\n --sc-font-size: var(--mantine-font-size-sm);\n\n position: relative;\n display: inline-flex;\n flex-direction: row;\n width: auto;\n border-radius: var(--sc-radius, var(--mantine-radius-default));\n overflow: hidden;\n padding: 4px;\n\n &:where([data-full-width]) {\n display: flex;\n }\n\n &:where([data-orientation='vertical']) {\n display: flex;\n flex-direction: column;\n width: max-content;\n\n &:where([data-full-width]) {\n width: auto;\n }\n }\n\n @mixin where-light {\n background-color: var(--mantine-color-gray-1);\n }\n\n @mixin where-dark {\n background-color: var(--mantine-color-dark-8);\n }\n}\n\n.indicator {\n position: absolute;\n display: block;\n z-index: 1;\n border-radius: max(\n calc(var(--sc-radius, var(--mantine-radius-default)) - 4px),\n calc(var(--sc-radius, var(--mantine-radius-default)) / 4)\n );\n\n @mixin where-light {\n box-shadow: var(--sc-shadow, none);\n background-color: var(--sc-color, var(--mantine-color-white));\n }\n\n @mixin where-dark {\n box-shadow: none;\n background-color: var(--sc-color, var(--mantine-color-dark-5));\n }\n}\n\n.label {\n -webkit-tap-highlight-color: transparent;\n font-weight: var(--mantine-font-weight-medium);\n display: block;\n text-align: center;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n user-select: none;\n border-radius: calc(var(--sc-radius, var(--mantine-radius-default)) - 4px);\n font-size: var(--sc-font-size);\n padding: var(--sc-padding);\n transition: color var(--sc-transition-duration) var(--sc-transition-timing-function);\n cursor: pointer;\n\n /* outline is controlled by .input */\n outline: var(--segmented-control-outline, none);\n\n @mixin where-light {\n color: var(--mantine-color-gray-7);\n }\n\n @mixin where-dark {\n color: var(--mantine-color-dark-1);\n }\n\n &:where([data-read-only]) {\n cursor: default;\n }\n\n fieldset:disabled &,\n &:where([data-disabled]) {\n cursor: not-allowed;\n color: var(--mantine-color-disabled-color);\n }\n\n &:where([data-active]) {\n @mixin where-light {\n color: var(--sc-label-color, var(--mantine-color-black));\n }\n\n @mixin where-dark {\n color: var(--sc-label-color, var(--mantine-color-white));\n }\n\n &::before {\n .root:where([data-initialized]) & {\n display: none;\n }\n content: '';\n inset: 0;\n z-index: 0;\n position: absolute;\n border-radius: calc(var(--sc-radius, var(--mantine-radius-default)) - 4px);\n\n @mixin where-light {\n box-shadow: var(--sc-shadow, none);\n background-color: var(--sc-color, var(--mantine-color-white));\n }\n\n @mixin where-dark {\n box-shadow: none;\n background-color: var(--sc-color, var(--mantine-color-dark-5));\n }\n }\n }\n\n &:where(:not([data-disabled], [data-active], [data-read-only])) {\n @mixin hover {\n @mixin where-light {\n color: var(--mantine-color-black);\n }\n\n @mixin where-dark {\n color: var(--mantine-color-white);\n }\n }\n }\n\n fieldset:disabled & {\n @mixin hover {\n color: var(--mantine-color-disabled-color) !important;\n }\n }\n}\n\n.input {\n height: 0;\n width: 0;\n position: absolute;\n overflow: hidden;\n white-space: nowrap;\n opacity: 0;\n\n &[data-focus-ring='auto'] {\n &:focus:focus-visible {\n & + .label {\n --segmented-control-outline: 2px solid var(--mantine-primary-color-filled);\n }\n }\n }\n\n &[data-focus-ring='always'] {\n &:focus {\n & + .label {\n --segmented-control-outline: 2px solid var(--mantine-primary-color-filled);\n }\n }\n }\n}\n\n.control {\n position: relative;\n flex: 1;\n z-index: 2;\n transition: border-color var(--sc-transition-duration) var(--sc-transition-timing-function);\n\n .root[data-with-items-borders] :where(&)::before {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n inset-inline-start: 0;\n background-color: var(--separator-color);\n width: 1px;\n transition: background-color var(--sc-transition-duration) var(--sc-transition-timing-function);\n }\n\n &[data-orientation='vertical'] {\n &::before {\n top: 0;\n inset-inline: 0;\n bottom: auto;\n height: 1px;\n width: auto;\n }\n }\n\n @mixin where-light {\n --separator-color: var(--mantine-color-gray-3);\n }\n\n @mixin where-dark {\n --separator-color: var(--mantine-color-dark-4);\n }\n\n &:first-of-type {\n &::before {\n --separator-color: transparent;\n }\n }\n\n &[data-active] {\n [data-mantine-color-scheme] & {\n &,\n & + .control {\n &::before {\n --separator-color: transparent;\n }\n }\n }\n }\n}\n\n.innerLabel {\n position: relative;\n z-index: 2;\n}\n"],"mappings":""}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
require("../../_virtual/_rolldown/runtime.cjs");
|
|
3
2
|
const require_use_props = require("../../core/MantineProvider/use-props/use-props.cjs");
|
|
4
3
|
const require_use_resolved_styles_api = require("../../core/styles-api/use-resolved-styles-api/use-resolved-styles-api.cjs");
|
|
5
4
|
const require_factory = require("../../core/factory/factory.cjs");
|
|
@@ -26,7 +25,7 @@ const Select = require_factory.genericFactory((_props) => {
|
|
|
26
25
|
"InputWrapper",
|
|
27
26
|
"Select"
|
|
28
27
|
], defaultProps, _props);
|
|
29
|
-
const { classNames, styles, unstyled, vars, dropdownOpened, defaultDropdownOpened, onDropdownClose, onDropdownOpen, onFocus, onBlur, onClick, onChange, data, value, defaultValue, selectFirstOptionOnChange, selectFirstOptionOnDropdownOpen, onOptionSubmit, comboboxProps, readOnly, disabled, filter, limit, withScrollArea, maxDropdownHeight, size, searchable, rightSection, checkIconPosition, withCheckIcon, withAlignedLabels, nothingFoundMessage, name, form, searchValue, defaultSearchValue, onSearchChange, allowDeselect, error, rightSectionPointerEvents, id, clearable, clearSectionMode, clearButtonProps, hiddenInputProps, renderOption, onClear, autoComplete, scrollAreaProps, __defaultRightSection, __clearSection, __clearable, chevronColor, autoSelectOnBlur, openOnFocus, attributes, ...others } = props;
|
|
28
|
+
const { classNames, styles, unstyled, vars, dropdownOpened, defaultDropdownOpened, onDropdownClose, onDropdownOpen, onFocus, onBlur, onClick, onChange, data, value, defaultValue, selectFirstOptionOnChange, selectFirstOptionOnDropdownOpen, onOptionSubmit, comboboxProps, readOnly, disabled, filter, limit, withScrollArea, maxDropdownHeight, floatingHeight, size, searchable, rightSection, checkIconPosition, withCheckIcon, withAlignedLabels, nothingFoundMessage, name, form, searchValue, defaultSearchValue, onSearchChange, allowDeselect, error, rightSectionPointerEvents, id, clearable, clearSectionMode, clearButtonProps, hiddenInputProps, renderOption, onClear, autoComplete, scrollAreaProps, __defaultRightSection, __clearSection, __clearable, chevronColor, autoSelectOnBlur, openOnFocus, attributes, ...others } = props;
|
|
30
29
|
const parsedData = (0, react.useMemo)(() => require_get_parsed_combobox_data.getParsedComboboxData(data), [data]);
|
|
31
30
|
const retainedSelectedOptions = (0, react.useRef)({});
|
|
32
31
|
const optionsLockup = (0, react.useMemo)(() => require_get_options_lockup.getOptionsLockup(parsedData), [parsedData]);
|
|
@@ -100,6 +99,7 @@ const Select = require_factory.genericFactory((_props) => {
|
|
|
100
99
|
readOnly,
|
|
101
100
|
size,
|
|
102
101
|
attributes,
|
|
102
|
+
floatingHeight,
|
|
103
103
|
keepMounted: autoSelectOnBlur,
|
|
104
104
|
onOptionSubmit: (val) => {
|
|
105
105
|
onOptionSubmit?.(val);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.cjs","names":["genericFactory","useProps","getParsedComboboxData","getOptionsLockup","useCombobox","useResolvedStylesApi","Combobox","InputBase","OptionsDropdown"],"sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef } from 'react';\nimport { useId, usePrevious, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n Factory,\n genericFactory,\n MantineColor,\n Primitive,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n} from '../../core';\nimport {\n Combobox,\n ComboboxItem,\n ComboboxLikeProps,\n ComboboxLikeRenderOptionInput,\n ComboboxLikeStylesNames,\n getOptionsLockup,\n getParsedComboboxData,\n OptionsDropdown,\n OptionsFilter,\n useCombobox,\n} from '../Combobox';\nimport {\n __BaseInputProps,\n __InputStylesNames,\n ClearSectionMode,\n InputClearButtonProps,\n InputVariant,\n} from '../Input';\nimport { InputBase } from '../InputBase';\nimport { ScrollAreaProps } from '../ScrollArea';\n\nexport type SelectStylesNames = __InputStylesNames | ComboboxLikeStylesNames;\n\nexport interface SelectProps<Value extends Primitive = string>\n extends\n BoxProps,\n __BaseInputProps,\n ComboboxLikeProps<Value>,\n StylesApiProps<SelectFactory>,\n ElementProps<'input', 'onChange' | 'size' | 'value' | 'defaultValue'> {\n /** Controlled component value */\n value?: Value | null;\n\n /** Uncontrolled component default value */\n defaultValue?: Value | null;\n\n /** Called when value changes */\n onChange?: (value: Value | null, option: ComboboxItem<Value>) => void;\n\n /** Called when the clear button is clicked */\n onClear?: () => void;\n\n /** Determines whether the select should be searchable @default false */\n searchable?: boolean;\n\n /** Displays check icon near the selected option label @default true */\n withCheckIcon?: boolean;\n\n /** Aligns unchecked labels with the checked one @default false */\n withAlignedLabels?: boolean;\n\n /** Position of the check icon relative to the option label @default 'left' */\n checkIconPosition?: 'left' | 'right';\n\n /** Message displayed when no options match the search query or when there is no data */\n nothingFoundMessage?: React.ReactNode;\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 /** Allows deselecting the selected option by clicking it @default true */\n allowDeselect?: boolean;\n\n /** Displays clear button in the right section when component has value @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 /** A function to render content of the option, replaces the default content of the option */\n renderOption?: (item: ComboboxLikeRenderOptionInput<ComboboxItem<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, by default depends on the color scheme */\n chevronColor?: MantineColor;\n\n /** Automatically selects the highlighted option when input loses focus @default false */\n autoSelectOnBlur?: boolean;\n\n /** Opens dropdown when input receives focus (requires searchable={true}) @default true */\n openOnFocus?: boolean;\n}\n\nexport type SelectFactory = Factory<{\n props: SelectProps;\n ref: HTMLInputElement;\n stylesNames: SelectStylesNames;\n variant: InputVariant;\n signature: <Value extends Primitive = string>(props: SelectProps<Value>) => React.JSX.Element;\n}>;\n\nconst defaultProps = {\n size: 'sm',\n withCheckIcon: true,\n allowDeselect: true,\n checkIconPosition: 'left',\n openOnFocus: true,\n} satisfies Partial<SelectProps>;\n\nexport const Select = genericFactory<SelectFactory>((_props) => {\n const props = useProps(['Input', 'InputWrapper', 'Select'], defaultProps, _props);\n const {\n classNames,\n styles,\n unstyled,\n vars,\n dropdownOpened,\n defaultDropdownOpened,\n onDropdownClose,\n onDropdownOpen,\n onFocus,\n onBlur,\n onClick,\n onChange,\n data,\n value,\n defaultValue,\n selectFirstOptionOnChange,\n selectFirstOptionOnDropdownOpen,\n onOptionSubmit,\n comboboxProps,\n readOnly,\n disabled,\n filter,\n limit,\n withScrollArea,\n maxDropdownHeight,\n size,\n searchable,\n rightSection,\n checkIconPosition,\n withCheckIcon,\n withAlignedLabels,\n nothingFoundMessage,\n name,\n form,\n searchValue,\n defaultSearchValue,\n onSearchChange,\n allowDeselect,\n error,\n rightSectionPointerEvents,\n id,\n clearable,\n clearSectionMode,\n clearButtonProps,\n hiddenInputProps,\n renderOption,\n onClear,\n autoComplete,\n scrollAreaProps,\n __defaultRightSection,\n __clearSection,\n __clearable,\n chevronColor,\n autoSelectOnBlur,\n openOnFocus,\n attributes,\n ...others\n } = props;\n\n const parsedData = useMemo(() => getParsedComboboxData(data), [data]);\n const retainedSelectedOptions = useRef<Record<string, ComboboxItem<Primitive>>>({});\n const optionsLockup = useMemo(() => getOptionsLockup(parsedData), [parsedData]);\n const _id = useId(id);\n\n const [_value, setValue, controlled] = useUncontrolled({\n value,\n defaultValue,\n finalValue: null,\n onChange,\n });\n\n const selectedOption =\n _value != null\n ? `${_value}` in optionsLockup\n ? optionsLockup[`${_value}`]\n : retainedSelectedOptions.current[`${_value}`]\n : undefined;\n const previousSelectedOption = usePrevious(selectedOption);\n\n const [search, setSearch, searchControlled] = useUncontrolled({\n value: searchValue,\n defaultValue: defaultSearchValue,\n finalValue: selectedOption ? selectedOption.label : '',\n onChange: onSearchChange,\n });\n\n const combobox = useCombobox({\n opened: dropdownOpened,\n defaultOpened: defaultDropdownOpened,\n onDropdownOpen: () => {\n onDropdownOpen?.();\n if (selectFirstOptionOnDropdownOpen) {\n combobox.selectFirstOption();\n } else {\n combobox.updateSelectedOptionIndex('active', { scrollIntoView: true });\n }\n },\n onDropdownClose: () => {\n onDropdownClose?.();\n // Required for autoSelectOnBlur to work correctly\n setTimeout(combobox.resetSelectedOption, 0);\n },\n });\n\n const handleSearchChange = (value: string) => {\n setSearch(value);\n combobox.resetSelectedOption();\n };\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<SelectFactory>({\n props,\n styles,\n classNames,\n });\n\n useEffect(() => {\n if (selectFirstOptionOnChange) {\n combobox.selectFirstOption();\n }\n }, [selectFirstOptionOnChange, search]);\n\n useEffect(() => {\n if (value === null) {\n handleSearchChange('');\n }\n\n if (\n value != null &&\n selectedOption &&\n (previousSelectedOption?.value !== selectedOption.value ||\n previousSelectedOption?.label !== selectedOption.label)\n ) {\n handleSearchChange(selectedOption.label);\n }\n }, [value, selectedOption]);\n\n useEffect(() => {\n if (!controlled && !searchControlled) {\n handleSearchChange(\n _value != null\n ? `${_value}` in optionsLockup\n ? optionsLockup[`${_value}`]?.label\n : retainedSelectedOptions.current[`${_value}`]?.label || ''\n : ''\n );\n }\n }, [optionsLockup, _value]);\n\n useEffect(() => {\n if (_value) {\n if (`${_value}` in optionsLockup) {\n retainedSelectedOptions.current[`${_value}`] = optionsLockup[`${_value}`];\n }\n }\n }, [optionsLockup, _value]);\n\n const clearButton = (\n <Combobox.ClearButton\n {...clearButtonProps}\n onClear={() => {\n setValue(null, null);\n handleSearchChange('');\n onClear?.();\n }}\n />\n );\n\n const _clearable = clearable && _value != null && !disabled && !readOnly;\n\n return (\n <>\n <Combobox\n store={combobox}\n __staticSelector=\"Select\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n readOnly={readOnly}\n size={size}\n attributes={attributes}\n keepMounted={autoSelectOnBlur}\n onOptionSubmit={(val) => {\n onOptionSubmit?.(val as any);\n const optionLockup = allowDeselect\n ? `${optionsLockup[val].value}` === `${_value}`\n ? null\n : optionsLockup[val]\n : optionsLockup[val];\n\n const nextValue = optionLockup ? optionLockup.value : null;\n\n nextValue !== _value && setValue(nextValue as any, optionLockup);\n !controlled && handleSearchChange(nextValue != null ? optionLockup?.label || '' : '');\n combobox.closeDropdown();\n }}\n {...comboboxProps}\n >\n <Combobox.Target\n targetType={searchable ? 'input' : 'button'}\n autoComplete={autoComplete}\n withExpandedAttribute\n >\n <InputBase\n id={_id}\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 {...others}\n size={size}\n __staticSelector=\"Select\"\n disabled={disabled}\n readOnly={readOnly || !searchable}\n value={search}\n onChange={(event) => {\n handleSearchChange(event.currentTarget.value);\n combobox.openDropdown();\n selectFirstOptionOnChange && combobox.selectFirstOption();\n }}\n onFocus={(event) => {\n openOnFocus && !!searchable && combobox.openDropdown();\n onFocus?.(event);\n }}\n onBlur={(event) => {\n if (autoSelectOnBlur) {\n combobox.clickSelectedOption();\n }\n\n !!searchable && combobox.closeDropdown();\n const optionLockup =\n _value != null &&\n (`${_value}` in optionsLockup\n ? optionsLockup[`${_value}`]\n : retainedSelectedOptions.current[`${_value}`]);\n handleSearchChange(optionLockup ? optionLockup.label || '' : '');\n onBlur?.(event);\n }}\n onClick={(event) => {\n searchable ? combobox.openDropdown() : combobox.toggleDropdown();\n onClick?.(event);\n }}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n pointer={!searchable}\n error={error}\n attributes={attributes}\n />\n </Combobox.Target>\n <OptionsDropdown\n data={parsedData as any}\n hidden={readOnly || disabled}\n filter={filter as OptionsFilter<Primitive> | undefined}\n search={search}\n limit={limit}\n hiddenWhenEmpty={!nothingFoundMessage}\n withScrollArea={withScrollArea}\n maxDropdownHeight={maxDropdownHeight}\n filterOptions={!!searchable && selectedOption?.label !== search}\n value={_value}\n checkIconPosition={checkIconPosition}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n nothingFoundMessage={nothingFoundMessage}\n unstyled={unstyled}\n labelId={others.label ? `${_id}-label` : undefined}\n aria-label={others.label ? undefined : others['aria-label']}\n renderOption={renderOption}\n scrollAreaProps={scrollAreaProps}\n />\n </Combobox>\n <Combobox.HiddenInput\n value={_value}\n name={name}\n form={form}\n disabled={disabled}\n {...hiddenInputProps}\n />\n </>\n );\n});\n\nSelect.classes = { ...InputBase.classes, ...Combobox.classes };\nSelect.displayName = '@mantine/core/Select';\n\nexport namespace Select {\n export type Props<Value extends Primitive = string> = SelectProps<Value>;\n export type StylesNames = SelectStylesNames;\n export type Factory = SelectFactory;\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Select.cjs","names":["genericFactory","useProps","getParsedComboboxData","getOptionsLockup","useCombobox","useResolvedStylesApi","Combobox","InputBase","OptionsDropdown"],"sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef } from 'react';\nimport { useId, usePrevious, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n Factory,\n genericFactory,\n MantineColor,\n Primitive,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n} from '../../core';\nimport {\n Combobox,\n ComboboxItem,\n ComboboxLikeProps,\n ComboboxLikeRenderOptionInput,\n ComboboxLikeStylesNames,\n getOptionsLockup,\n getParsedComboboxData,\n OptionsDropdown,\n OptionsFilter,\n useCombobox,\n} from '../Combobox';\nimport {\n __BaseInputProps,\n __InputStylesNames,\n ClearSectionMode,\n InputClearButtonProps,\n InputVariant,\n} from '../Input';\nimport { InputBase } from '../InputBase';\nimport { ScrollAreaProps } from '../ScrollArea';\n\nexport type SelectStylesNames = __InputStylesNames | ComboboxLikeStylesNames;\n\nexport interface SelectProps<Value extends Primitive = string>\n extends\n BoxProps,\n __BaseInputProps,\n ComboboxLikeProps<Value>,\n StylesApiProps<SelectFactory>,\n ElementProps<'input', 'onChange' | 'size' | 'value' | 'defaultValue'> {\n /** Controlled component value */\n value?: Value | null;\n\n /** Uncontrolled component default value */\n defaultValue?: Value | null;\n\n /** Called when value changes */\n onChange?: (value: Value | null, option: ComboboxItem<Value>) => void;\n\n /** Called when the clear button is clicked */\n onClear?: () => void;\n\n /** Determines whether the select should be searchable @default false */\n searchable?: boolean;\n\n /** Displays check icon near the selected option label @default true */\n withCheckIcon?: boolean;\n\n /** Aligns unchecked labels with the checked one @default false */\n withAlignedLabels?: boolean;\n\n /** Position of the check icon relative to the option label @default 'left' */\n checkIconPosition?: 'left' | 'right';\n\n /** Message displayed when no options match the search query or when there is no data */\n nothingFoundMessage?: React.ReactNode;\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 /** Allows deselecting the selected option by clicking it @default true */\n allowDeselect?: boolean;\n\n /** Displays clear button in the right section when component has value @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 /** A function to render content of the option, replaces the default content of the option */\n renderOption?: (item: ComboboxLikeRenderOptionInput<ComboboxItem<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, by default depends on the color scheme */\n chevronColor?: MantineColor;\n\n /** Automatically selects the highlighted option when input loses focus @default false */\n autoSelectOnBlur?: boolean;\n\n /** Opens dropdown when input receives focus (requires searchable={true}) @default true */\n openOnFocus?: boolean;\n}\n\nexport type SelectFactory = Factory<{\n props: SelectProps;\n ref: HTMLInputElement;\n stylesNames: SelectStylesNames;\n variant: InputVariant;\n signature: <Value extends Primitive = string>(props: SelectProps<Value>) => React.JSX.Element;\n}>;\n\nconst defaultProps = {\n size: 'sm',\n withCheckIcon: true,\n allowDeselect: true,\n checkIconPosition: 'left',\n openOnFocus: true,\n} satisfies Partial<SelectProps>;\n\nexport const Select = genericFactory<SelectFactory>((_props) => {\n const props = useProps(['Input', 'InputWrapper', 'Select'], defaultProps, _props);\n const {\n classNames,\n styles,\n unstyled,\n vars,\n dropdownOpened,\n defaultDropdownOpened,\n onDropdownClose,\n onDropdownOpen,\n onFocus,\n onBlur,\n onClick,\n onChange,\n data,\n value,\n defaultValue,\n selectFirstOptionOnChange,\n selectFirstOptionOnDropdownOpen,\n onOptionSubmit,\n comboboxProps,\n readOnly,\n disabled,\n filter,\n limit,\n withScrollArea,\n maxDropdownHeight,\n floatingHeight,\n size,\n searchable,\n rightSection,\n checkIconPosition,\n withCheckIcon,\n withAlignedLabels,\n nothingFoundMessage,\n name,\n form,\n searchValue,\n defaultSearchValue,\n onSearchChange,\n allowDeselect,\n error,\n rightSectionPointerEvents,\n id,\n clearable,\n clearSectionMode,\n clearButtonProps,\n hiddenInputProps,\n renderOption,\n onClear,\n autoComplete,\n scrollAreaProps,\n __defaultRightSection,\n __clearSection,\n __clearable,\n chevronColor,\n autoSelectOnBlur,\n openOnFocus,\n attributes,\n ...others\n } = props;\n\n const parsedData = useMemo(() => getParsedComboboxData(data), [data]);\n const retainedSelectedOptions = useRef<Record<string, ComboboxItem<Primitive>>>({});\n const optionsLockup = useMemo(() => getOptionsLockup(parsedData), [parsedData]);\n const _id = useId(id);\n\n const [_value, setValue, controlled] = useUncontrolled({\n value,\n defaultValue,\n finalValue: null,\n onChange,\n });\n\n const selectedOption =\n _value != null\n ? `${_value}` in optionsLockup\n ? optionsLockup[`${_value}`]\n : retainedSelectedOptions.current[`${_value}`]\n : undefined;\n const previousSelectedOption = usePrevious(selectedOption);\n\n const [search, setSearch, searchControlled] = useUncontrolled({\n value: searchValue,\n defaultValue: defaultSearchValue,\n finalValue: selectedOption ? selectedOption.label : '',\n onChange: onSearchChange,\n });\n\n const combobox = useCombobox({\n opened: dropdownOpened,\n defaultOpened: defaultDropdownOpened,\n onDropdownOpen: () => {\n onDropdownOpen?.();\n if (selectFirstOptionOnDropdownOpen) {\n combobox.selectFirstOption();\n } else {\n combobox.updateSelectedOptionIndex('active', { scrollIntoView: true });\n }\n },\n onDropdownClose: () => {\n onDropdownClose?.();\n // Required for autoSelectOnBlur to work correctly\n setTimeout(combobox.resetSelectedOption, 0);\n },\n });\n\n const handleSearchChange = (value: string) => {\n setSearch(value);\n combobox.resetSelectedOption();\n };\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<SelectFactory>({\n props,\n styles,\n classNames,\n });\n\n useEffect(() => {\n if (selectFirstOptionOnChange) {\n combobox.selectFirstOption();\n }\n }, [selectFirstOptionOnChange, search]);\n\n useEffect(() => {\n if (value === null) {\n handleSearchChange('');\n }\n\n if (\n value != null &&\n selectedOption &&\n (previousSelectedOption?.value !== selectedOption.value ||\n previousSelectedOption?.label !== selectedOption.label)\n ) {\n handleSearchChange(selectedOption.label);\n }\n }, [value, selectedOption]);\n\n useEffect(() => {\n if (!controlled && !searchControlled) {\n handleSearchChange(\n _value != null\n ? `${_value}` in optionsLockup\n ? optionsLockup[`${_value}`]?.label\n : retainedSelectedOptions.current[`${_value}`]?.label || ''\n : ''\n );\n }\n }, [optionsLockup, _value]);\n\n useEffect(() => {\n if (_value) {\n if (`${_value}` in optionsLockup) {\n retainedSelectedOptions.current[`${_value}`] = optionsLockup[`${_value}`];\n }\n }\n }, [optionsLockup, _value]);\n\n const clearButton = (\n <Combobox.ClearButton\n {...clearButtonProps}\n onClear={() => {\n setValue(null, null);\n handleSearchChange('');\n onClear?.();\n }}\n />\n );\n\n const _clearable = clearable && _value != null && !disabled && !readOnly;\n\n return (\n <>\n <Combobox\n store={combobox}\n __staticSelector=\"Select\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n readOnly={readOnly}\n size={size}\n attributes={attributes}\n floatingHeight={floatingHeight}\n keepMounted={autoSelectOnBlur}\n onOptionSubmit={(val) => {\n onOptionSubmit?.(val as any);\n const optionLockup = allowDeselect\n ? `${optionsLockup[val].value}` === `${_value}`\n ? null\n : optionsLockup[val]\n : optionsLockup[val];\n\n const nextValue = optionLockup ? optionLockup.value : null;\n\n nextValue !== _value && setValue(nextValue as any, optionLockup);\n !controlled && handleSearchChange(nextValue != null ? optionLockup?.label || '' : '');\n combobox.closeDropdown();\n }}\n {...comboboxProps}\n >\n <Combobox.Target\n targetType={searchable ? 'input' : 'button'}\n autoComplete={autoComplete}\n withExpandedAttribute\n >\n <InputBase\n id={_id}\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 {...others}\n size={size}\n __staticSelector=\"Select\"\n disabled={disabled}\n readOnly={readOnly || !searchable}\n value={search}\n onChange={(event) => {\n handleSearchChange(event.currentTarget.value);\n combobox.openDropdown();\n selectFirstOptionOnChange && combobox.selectFirstOption();\n }}\n onFocus={(event) => {\n openOnFocus && !!searchable && combobox.openDropdown();\n onFocus?.(event);\n }}\n onBlur={(event) => {\n if (autoSelectOnBlur) {\n combobox.clickSelectedOption();\n }\n\n !!searchable && combobox.closeDropdown();\n const optionLockup =\n _value != null &&\n (`${_value}` in optionsLockup\n ? optionsLockup[`${_value}`]\n : retainedSelectedOptions.current[`${_value}`]);\n handleSearchChange(optionLockup ? optionLockup.label || '' : '');\n onBlur?.(event);\n }}\n onClick={(event) => {\n searchable ? combobox.openDropdown() : combobox.toggleDropdown();\n onClick?.(event);\n }}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n pointer={!searchable}\n error={error}\n attributes={attributes}\n />\n </Combobox.Target>\n <OptionsDropdown\n data={parsedData as any}\n hidden={readOnly || disabled}\n filter={filter as OptionsFilter<Primitive> | undefined}\n search={search}\n limit={limit}\n hiddenWhenEmpty={!nothingFoundMessage}\n withScrollArea={withScrollArea}\n maxDropdownHeight={maxDropdownHeight}\n filterOptions={!!searchable && selectedOption?.label !== search}\n value={_value}\n checkIconPosition={checkIconPosition}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n nothingFoundMessage={nothingFoundMessage}\n unstyled={unstyled}\n labelId={others.label ? `${_id}-label` : undefined}\n aria-label={others.label ? undefined : others['aria-label']}\n renderOption={renderOption}\n scrollAreaProps={scrollAreaProps}\n />\n </Combobox>\n <Combobox.HiddenInput\n value={_value}\n name={name}\n form={form}\n disabled={disabled}\n {...hiddenInputProps}\n />\n </>\n );\n});\n\nSelect.classes = { ...InputBase.classes, ...Combobox.classes };\nSelect.displayName = '@mantine/core/Select';\n\nexport namespace Select {\n export type Props<Value extends Primitive = string> = SelectProps<Value>;\n export type StylesNames = SelectStylesNames;\n export type Factory = SelectFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;AAuHA,MAAM,eAAe;CACnB,MAAM;CACN,eAAe;CACf,eAAe;CACf,mBAAmB;CACnB,aAAa;AACf;AAEA,MAAa,SAASA,gBAAAA,gBAA+B,WAAW;CAC9D,MAAM,QAAQC,kBAAAA,SAAS;EAAC;EAAS;EAAgB;CAAQ,GAAG,cAAc,MAAM;CAChF,MAAM,EACJ,YACA,QACA,UACA,MACA,gBACA,uBACA,iBACA,gBACA,SACA,QACA,SACA,UACA,MACA,OACA,cACA,2BACA,iCACA,gBACA,eACA,UACA,UACA,QACA,OACA,gBACA,mBACA,gBACA,MACA,YACA,cACA,mBACA,eACA,mBACA,qBACA,MACA,MACA,aACA,oBACA,gBACA,eACA,OACA,2BACA,IACA,WACA,kBACA,kBACA,kBACA,cACA,SACA,cACA,iBACA,uBACA,gBACA,aACA,cACA,kBACA,aACA,YACA,GAAG,WACD;CAEJ,MAAM,cAAA,GAAA,MAAA,eAA2BC,iCAAAA,sBAAsB,IAAI,GAAG,CAAC,IAAI,CAAC;CACpE,MAAM,2BAAA,GAAA,MAAA,QAA0E,CAAC,CAAC;CAClF,MAAM,iBAAA,GAAA,MAAA,eAA8BC,2BAAAA,iBAAiB,UAAU,GAAG,CAAC,UAAU,CAAC;CAC9E,MAAM,OAAA,GAAA,eAAA,OAAY,EAAE;CAEpB,MAAM,CAAC,QAAQ,UAAU,eAAA,GAAA,eAAA,iBAA8B;EACrD;EACA;EACA,YAAY;EACZ;CACF,CAAC;CAED,MAAM,iBACJ,UAAU,OACN,GAAG,YAAY,gBACb,cAAc,GAAG,YACjB,wBAAwB,QAAQ,GAAG,YACrC,KAAA;CACN,MAAM,0BAAA,GAAA,eAAA,aAAqC,cAAc;CAEzD,MAAM,CAAC,QAAQ,WAAW,qBAAA,GAAA,eAAA,iBAAoC;EAC5D,OAAO;EACP,cAAc;EACd,YAAY,iBAAiB,eAAe,QAAQ;EACpD,UAAU;CACZ,CAAC;CAED,MAAM,WAAWC,qBAAAA,YAAY;EAC3B,QAAQ;EACR,eAAe;EACf,sBAAsB;GACpB,iBAAiB;GACjB,IAAI,iCACF,SAAS,kBAAkB;QAE3B,SAAS,0BAA0B,UAAU,EAAE,gBAAgB,KAAK,CAAC;EAEzE;EACA,uBAAuB;GACrB,kBAAkB;GAElB,WAAW,SAAS,qBAAqB,CAAC;EAC5C;CACF,CAAC;CAED,MAAM,sBAAsB,UAAkB;EAC5C,UAAU,KAAK;EACf,SAAS,oBAAoB;CAC/B;CAEA,MAAM,EAAE,oBAAoB,mBAAmBC,gCAAAA,qBAAoC;EACjF;EACA;EACA;CACF,CAAC;CAED,CAAA,GAAA,MAAA,iBAAgB;EACd,IAAI,2BACF,SAAS,kBAAkB;CAE/B,GAAG,CAAC,2BAA2B,MAAM,CAAC;CAEtC,CAAA,GAAA,MAAA,iBAAgB;EACd,IAAI,UAAU,MACZ,mBAAmB,EAAE;EAGvB,IACE,SAAS,QACT,mBACC,wBAAwB,UAAU,eAAe,SAChD,wBAAwB,UAAU,eAAe,QAEnD,mBAAmB,eAAe,KAAK;CAE3C,GAAG,CAAC,OAAO,cAAc,CAAC;CAE1B,CAAA,GAAA,MAAA,iBAAgB;EACd,IAAI,CAAC,cAAc,CAAC,kBAClB,mBACE,UAAU,OACN,GAAG,YAAY,gBACb,cAAc,GAAG,WAAW,QAC5B,wBAAwB,QAAQ,GAAG,WAAW,SAAS,KACzD,EACN;CAEJ,GAAG,CAAC,eAAe,MAAM,CAAC;CAE1B,CAAA,GAAA,MAAA,iBAAgB;EACd,IAAI;OACE,GAAG,YAAY,eACjB,wBAAwB,QAAQ,GAAG,YAAY,cAAc,GAAG;EAAA;CAGtE,GAAG,CAAC,eAAe,MAAM,CAAC;CAE1B,MAAM,cACJ,iBAAA,GAAA,kBAAA,KAACC,iBAAAA,SAAS,aAAV;EACE,GAAI;EACJ,eAAe;GACb,SAAS,MAAM,IAAI;GACnB,mBAAmB,EAAE;GACrB,UAAU;EACZ;CACD,CAAA;CAGH,MAAM,aAAa,aAAa,UAAU,QAAQ,CAAC,YAAY,CAAC;CAEhE,OACE,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,MAACA,iBAAAA,UAAD;EACE,OAAO;EACP,kBAAiB;EACjB,YAAY;EACZ,QAAQ;EACE;EACA;EACJ;EACM;EACI;EAChB,aAAa;EACb,iBAAiB,QAAQ;GACvB,iBAAiB,GAAU;GAC3B,MAAM,eAAe,gBACjB,GAAG,cAAc,KAAK,YAAY,GAAG,WACnC,OACA,cAAc,OAChB,cAAc;GAElB,MAAM,YAAY,eAAe,aAAa,QAAQ;GAEtD,cAAc,UAAU,SAAS,WAAkB,YAAY;GAC/D,CAAC,cAAc,mBAAmB,aAAa,OAAO,cAAc,SAAS,KAAK,EAAE;GACpF,SAAS,cAAc;EACzB;EACA,GAAI;YAzBN,CA2BE,iBAAA,GAAA,kBAAA,KAACA,iBAAAA,SAAS,QAAV;GACE,YAAY,aAAa,UAAU;GACrB;GACd,uBAAA;aAEA,iBAAA,GAAA,kBAAA,KAACC,kBAAAA,WAAD;IACE,IAAI;IACJ,uBACE,iBAAA,GAAA,kBAAA,KAACD,iBAAAA,SAAS,SAAV;KACQ;KACC;KACG;KACV,OAAO;IACR,CAAA;IAEH,gBAAgB;IAChB,aAAa;IACb,oBAAoB;IACN;IACd,2BAA2B,6BAA6B;IACxD,GAAI;IACE;IACN,kBAAiB;IACP;IACV,UAAU,YAAY,CAAC;IACvB,OAAO;IACP,WAAW,UAAU;KACnB,mBAAmB,MAAM,cAAc,KAAK;KAC5C,SAAS,aAAa;KACtB,6BAA6B,SAAS,kBAAkB;IAC1D;IACA,UAAU,UAAU;KAClB,eAAiB,cAAc,SAAS,aAAa;KACrD,UAAU,KAAK;IACjB;IACA,SAAS,UAAU;KACjB,IAAI,kBACF,SAAS,oBAAoB;KAG/B,cAAgB,SAAS,cAAc;KACvC,MAAM,eACJ,UAAU,SACT,GAAG,YAAY,gBACZ,cAAc,GAAG,YACjB,wBAAwB,QAAQ,GAAG;KACzC,mBAAmB,eAAe,aAAa,SAAS,KAAK,EAAE;KAC/D,SAAS,KAAK;IAChB;IACA,UAAU,UAAU;KAClB,aAAa,SAAS,aAAa,IAAI,SAAS,eAAe;KAC/D,UAAU,KAAK;IACjB;IACA,YAAY;IACZ,QAAQ;IACE;IACV,SAAS,CAAC;IACH;IACK;GACb,CAAA;EACc,CAAA,GACjB,iBAAA,GAAA,kBAAA,KAACE,wBAAAA,iBAAD;GACE,MAAM;GACN,QAAQ,YAAY;GACZ;GACA;GACD;GACP,iBAAiB,CAAC;GACF;GACG;GACnB,eAAe,CAAC,CAAC,cAAc,gBAAgB,UAAU;GACzD,OAAO;GACY;GACJ;GACI;GACE;GACX;GACV,SAAS,OAAO,QAAQ,GAAG,IAAI,UAAU,KAAA;GACzC,cAAY,OAAO,QAAQ,KAAA,IAAY,OAAO;GAChC;GACG;EAClB,CAAA,CACO;KACV,iBAAA,GAAA,kBAAA,KAACF,iBAAAA,SAAS,aAAV;EACE,OAAO;EACD;EACA;EACI;EACV,GAAI;CACL,CAAA,CACD,EAAA,CAAA;AAEN,CAAC;AAED,OAAO,UAAU;CAAE,GAAGC,kBAAAA,UAAU;CAAS,GAAGD,iBAAAA,SAAS;AAAQ;AAC7D,OAAO,cAAc"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
require("../../_virtual/_rolldown/runtime.cjs");
|
|
3
2
|
const require_rem = require("../../core/utils/units-converters/rem.cjs");
|
|
4
3
|
const require_create_vars_resolver = require("../../core/styles-api/create-vars-resolver/create-vars-resolver.cjs");
|
|
5
4
|
const require_get_theme_color = require("../../core/MantineProvider/color-functions/get-theme-color/get-theme-color.cjs");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SemiCircleProgress.cjs","names":["createVarsResolver","getThemeColor","rem","factory","useProps","useStyles","Box","classes"],"sources":["../../../src/components/SemiCircleProgress/SemiCircleProgress.tsx"],"sourcesContent":["import { clamp } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getThemeColor,\n MantineColor,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './SemiCircleProgress.module.css';\n\nexport type SemiCircleProgressStylesNames =\n | 'root'\n | 'svg'\n | 'emptySegment'\n | 'filledSegment'\n | 'label';\n\nexport type SemiCircleProgressCssVariables = {\n root:\n | '--scp-filled-segment-color'\n | '--scp-empty-segment-color'\n | '--scp-rotation'\n | '--scp-transition-duration'\n | '--scp-thickness';\n};\n\nexport interface SemiCircleProgressProps\n extends BoxProps, StylesApiProps<SemiCircleProgressFactory>, ElementProps<'div'> {\n /** Progress value from `0` to `100` */\n value: number;\n\n /** Width of the component and diameter of the full circle in px. The visible SVG height will be size/2 @default 200 */\n size?: number;\n\n /** Stroke width of the circle segments in px @default 12 */\n thickness?: number;\n\n /** Orientation of the circle @default 'up' */\n orientation?: 'up' | 'down';\n\n /** Direction from which the circle is filled @default 'left-to-right' */\n fillDirection?: 'right-to-left' | 'left-to-right';\n\n /** Key of `theme.colors` or any valid CSS color value @default theme.primaryColor */\n filledSegmentColor?: MantineColor;\n\n /** Key of `theme.colors` or any valid CSS color value @default 'gray.2' in light mode, 'dark.4' in dark mode */\n emptySegmentColor?: MantineColor;\n\n /** Transition duration for the filled segment progress changes in ms. Does not affect color transitions @default 0 */\n transitionDuration?: number;\n\n /** Label rendered inside the circle */\n label?: React.ReactNode;\n\n /** Label position relative to the circle center @default 'bottom' */\n labelPosition?: 'center' | 'bottom';\n}\n\nexport type SemiCircleProgressFactory = Factory<{\n props: SemiCircleProgressProps;\n ref: HTMLDivElement;\n stylesNames: SemiCircleProgressStylesNames;\n vars: SemiCircleProgressCssVariables;\n}>;\n\nconst defaultProps = {\n size: 200,\n thickness: 12,\n orientation: 'up',\n fillDirection: 'left-to-right',\n labelPosition: 'bottom',\n} satisfies Partial<SemiCircleProgressProps>;\n\nfunction getRotation({\n orientation,\n fillDirection,\n}: Pick<SemiCircleProgressProps, 'orientation' | 'fillDirection'>) {\n if (orientation === 'down') {\n if (fillDirection === 'right-to-left') {\n return 'rotate(180deg) rotateY(180deg)';\n }\n return 'rotate(180deg)';\n }\n if (fillDirection === 'left-to-right') {\n return 'rotateY(180deg)';\n }\n\n return undefined;\n}\n\nconst varsResolver = createVarsResolver<SemiCircleProgressFactory>(\n (\n theme,\n {\n filledSegmentColor,\n emptySegmentColor,\n orientation,\n fillDirection,\n transitionDuration,\n thickness,\n }\n ) => ({\n root: {\n '--scp-filled-segment-color': filledSegmentColor\n ? getThemeColor(filledSegmentColor, theme)\n : undefined,\n '--scp-empty-segment-color': emptySegmentColor\n ? getThemeColor(emptySegmentColor, theme)\n : undefined,\n '--scp-rotation': getRotation({ orientation, fillDirection }),\n '--scp-transition-duration': transitionDuration ? `${transitionDuration}ms` : undefined,\n '--scp-thickness': rem(thickness),\n },\n })\n);\n\nexport const SemiCircleProgress = factory<SemiCircleProgressFactory>((_props) => {\n const props = useProps('SemiCircleProgress', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n size,\n thickness,\n value,\n orientation,\n fillDirection,\n filledSegmentColor,\n emptySegmentColor,\n transitionDuration,\n label,\n labelPosition,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<SemiCircleProgressFactory>({\n name: 'SemiCircleProgress',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const coordinateForCircle = size / 2;\n const radius = (size - 2 * thickness) / 2;\n const circumference = Math.PI * radius;\n const semiCirclePercentage = clamp(value, 0, 100) * (circumference / 100);\n\n return (\n <Box size={size} {...getStyles('root')} {...others}>\n {label && (\n <div {...getStyles('label')} data-position={labelPosition} data-orientation={orientation}>\n {label}\n </div>\n )}\n\n <svg width={size} height={size / 2} viewBox={`0 0 ${size} ${size / 2}`} {...getStyles('svg')}>\n <circle\n cx={coordinateForCircle}\n cy={coordinateForCircle}\n r={radius}\n fill=\"none\"\n stroke=\"var(--scp-empty-segment-color)\"\n strokeWidth={thickness}\n strokeDasharray={circumference}\n {...getStyles('emptySegment', { style: { strokeDashoffset: circumference } })}\n />\n\n <circle\n cx={coordinateForCircle}\n cy={coordinateForCircle}\n r={radius}\n fill=\"none\"\n stroke=\"var(--scp-filled-segment-color)\"\n strokeWidth={thickness}\n strokeDasharray={circumference}\n {...getStyles('filledSegment', { style: { strokeDashoffset: semiCirclePercentage } })}\n />\n </svg>\n </Box>\n );\n});\n\nSemiCircleProgress.displayName = '@mantine/core/SemiCircleProgress';\nSemiCircleProgress.classes = classes;\nSemiCircleProgress.varsResolver = varsResolver;\n\nexport namespace SemiCircleProgress {\n export type Props = SemiCircleProgressProps;\n export type StylesNames = SemiCircleProgressStylesNames;\n export type CssVariables = SemiCircleProgressCssVariables;\n export type Factory = SemiCircleProgressFactory;\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"SemiCircleProgress.cjs","names":["createVarsResolver","getThemeColor","rem","factory","useProps","useStyles","Box","classes"],"sources":["../../../src/components/SemiCircleProgress/SemiCircleProgress.tsx"],"sourcesContent":["import { clamp } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getThemeColor,\n MantineColor,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './SemiCircleProgress.module.css';\n\nexport type SemiCircleProgressStylesNames =\n | 'root'\n | 'svg'\n | 'emptySegment'\n | 'filledSegment'\n | 'label';\n\nexport type SemiCircleProgressCssVariables = {\n root:\n | '--scp-filled-segment-color'\n | '--scp-empty-segment-color'\n | '--scp-rotation'\n | '--scp-transition-duration'\n | '--scp-thickness';\n};\n\nexport interface SemiCircleProgressProps\n extends BoxProps, StylesApiProps<SemiCircleProgressFactory>, ElementProps<'div'> {\n /** Progress value from `0` to `100` */\n value: number;\n\n /** Width of the component and diameter of the full circle in px. The visible SVG height will be size/2 @default 200 */\n size?: number;\n\n /** Stroke width of the circle segments in px @default 12 */\n thickness?: number;\n\n /** Orientation of the circle @default 'up' */\n orientation?: 'up' | 'down';\n\n /** Direction from which the circle is filled @default 'left-to-right' */\n fillDirection?: 'right-to-left' | 'left-to-right';\n\n /** Key of `theme.colors` or any valid CSS color value @default theme.primaryColor */\n filledSegmentColor?: MantineColor;\n\n /** Key of `theme.colors` or any valid CSS color value @default 'gray.2' in light mode, 'dark.4' in dark mode */\n emptySegmentColor?: MantineColor;\n\n /** Transition duration for the filled segment progress changes in ms. Does not affect color transitions @default 0 */\n transitionDuration?: number;\n\n /** Label rendered inside the circle */\n label?: React.ReactNode;\n\n /** Label position relative to the circle center @default 'bottom' */\n labelPosition?: 'center' | 'bottom';\n}\n\nexport type SemiCircleProgressFactory = Factory<{\n props: SemiCircleProgressProps;\n ref: HTMLDivElement;\n stylesNames: SemiCircleProgressStylesNames;\n vars: SemiCircleProgressCssVariables;\n}>;\n\nconst defaultProps = {\n size: 200,\n thickness: 12,\n orientation: 'up',\n fillDirection: 'left-to-right',\n labelPosition: 'bottom',\n} satisfies Partial<SemiCircleProgressProps>;\n\nfunction getRotation({\n orientation,\n fillDirection,\n}: Pick<SemiCircleProgressProps, 'orientation' | 'fillDirection'>) {\n if (orientation === 'down') {\n if (fillDirection === 'right-to-left') {\n return 'rotate(180deg) rotateY(180deg)';\n }\n return 'rotate(180deg)';\n }\n if (fillDirection === 'left-to-right') {\n return 'rotateY(180deg)';\n }\n\n return undefined;\n}\n\nconst varsResolver = createVarsResolver<SemiCircleProgressFactory>(\n (\n theme,\n {\n filledSegmentColor,\n emptySegmentColor,\n orientation,\n fillDirection,\n transitionDuration,\n thickness,\n }\n ) => ({\n root: {\n '--scp-filled-segment-color': filledSegmentColor\n ? getThemeColor(filledSegmentColor, theme)\n : undefined,\n '--scp-empty-segment-color': emptySegmentColor\n ? getThemeColor(emptySegmentColor, theme)\n : undefined,\n '--scp-rotation': getRotation({ orientation, fillDirection }),\n '--scp-transition-duration': transitionDuration ? `${transitionDuration}ms` : undefined,\n '--scp-thickness': rem(thickness),\n },\n })\n);\n\nexport const SemiCircleProgress = factory<SemiCircleProgressFactory>((_props) => {\n const props = useProps('SemiCircleProgress', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n size,\n thickness,\n value,\n orientation,\n fillDirection,\n filledSegmentColor,\n emptySegmentColor,\n transitionDuration,\n label,\n labelPosition,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<SemiCircleProgressFactory>({\n name: 'SemiCircleProgress',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const coordinateForCircle = size / 2;\n const radius = (size - 2 * thickness) / 2;\n const circumference = Math.PI * radius;\n const semiCirclePercentage = clamp(value, 0, 100) * (circumference / 100);\n\n return (\n <Box size={size} {...getStyles('root')} {...others}>\n {label && (\n <div {...getStyles('label')} data-position={labelPosition} data-orientation={orientation}>\n {label}\n </div>\n )}\n\n <svg width={size} height={size / 2} viewBox={`0 0 ${size} ${size / 2}`} {...getStyles('svg')}>\n <circle\n cx={coordinateForCircle}\n cy={coordinateForCircle}\n r={radius}\n fill=\"none\"\n stroke=\"var(--scp-empty-segment-color)\"\n strokeWidth={thickness}\n strokeDasharray={circumference}\n {...getStyles('emptySegment', { style: { strokeDashoffset: circumference } })}\n />\n\n <circle\n cx={coordinateForCircle}\n cy={coordinateForCircle}\n r={radius}\n fill=\"none\"\n stroke=\"var(--scp-filled-segment-color)\"\n strokeWidth={thickness}\n strokeDasharray={circumference}\n {...getStyles('filledSegment', { style: { strokeDashoffset: semiCirclePercentage } })}\n />\n </svg>\n </Box>\n );\n});\n\nSemiCircleProgress.displayName = '@mantine/core/SemiCircleProgress';\nSemiCircleProgress.classes = classes;\nSemiCircleProgress.varsResolver = varsResolver;\n\nexport namespace SemiCircleProgress {\n export type Props = SemiCircleProgressProps;\n export type StylesNames = SemiCircleProgressStylesNames;\n export type CssVariables = SemiCircleProgressCssVariables;\n export type Factory = SemiCircleProgressFactory;\n}\n"],"mappings":";;;;;;;;;;;;AAyEA,MAAM,eAAe;CACnB,MAAM;CACN,WAAW;CACX,aAAa;CACb,eAAe;CACf,eAAe;AACjB;AAEA,SAAS,YAAY,EACnB,aACA,iBACiE;CACjE,IAAI,gBAAgB,QAAQ;EAC1B,IAAI,kBAAkB,iBACpB,OAAO;EAET,OAAO;CACT;CACA,IAAI,kBAAkB,iBACpB,OAAO;AAIX;AAEA,MAAM,eAAeA,6BAAAA,oBAEjB,OACA,EACE,oBACA,mBACA,aACA,eACA,oBACA,iBAEE,EACJ,MAAM;CACJ,8BAA8B,qBAC1BC,wBAAAA,cAAc,oBAAoB,KAAK,IACvC,KAAA;CACJ,6BAA6B,oBACzBA,wBAAAA,cAAc,mBAAmB,KAAK,IACtC,KAAA;CACJ,kBAAkB,YAAY;EAAE;EAAa;CAAc,CAAC;CAC5D,6BAA6B,qBAAqB,GAAG,mBAAmB,MAAM,KAAA;CAC9E,mBAAmBC,YAAAA,IAAI,SAAS;AAClC,EACF,EACF;AAEA,MAAa,qBAAqBC,gBAAAA,SAAoC,WAAW;CAC/E,MAAM,QAAQC,kBAAAA,SAAS,sBAAsB,cAAc,MAAM;CACjE,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,WACA,OACA,aACA,eACA,oBACA,mBACA,oBACA,OACA,eACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAqC;EACrD,MAAM;EACN,SAAA,kCAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,sBAAsB,OAAO;CACnC,MAAM,UAAU,OAAO,IAAI,aAAa;CACxC,MAAM,gBAAgB,KAAK,KAAK;CAChC,MAAM,wBAAA,GAAA,eAAA,OAA6B,OAAO,GAAG,GAAG,KAAK,gBAAgB;CAErE,OACE,iBAAA,GAAA,kBAAA,MAACC,YAAAA,KAAD;EAAW;EAAM,GAAI,UAAU,MAAM;EAAG,GAAI;YAA5C,CACG,SACC,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,GAAI,UAAU,OAAO;GAAG,iBAAe;GAAe,oBAAkB;aAC1E;EACE,CAAA,GAGP,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAK,OAAO;GAAM,QAAQ,OAAO;GAAG,SAAS,OAAO,KAAK,GAAG,OAAO;GAAK,GAAI,UAAU,KAAK;aAA3F,CACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;IACE,IAAI;IACJ,IAAI;IACJ,GAAG;IACH,MAAK;IACL,QAAO;IACP,aAAa;IACb,iBAAiB;IACjB,GAAI,UAAU,gBAAgB,EAAE,OAAO,EAAE,kBAAkB,cAAc,EAAE,CAAC;GAC7E,CAAA,GAED,iBAAA,GAAA,kBAAA,KAAC,UAAD;IACE,IAAI;IACJ,IAAI;IACJ,GAAG;IACH,MAAK;IACL,QAAO;IACP,aAAa;IACb,iBAAiB;IACjB,GAAI,UAAU,iBAAiB,EAAE,OAAO,EAAE,kBAAkB,qBAAqB,EAAE,CAAC;GACrF,CAAA,CACE;IACF;;AAET,CAAC;AAED,mBAAmB,cAAc;AACjC,mBAAmB,UAAUC,kCAAAA;AAC7B,mBAAmB,eAAe"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
require("../../_virtual/_rolldown/runtime.cjs");
|
|
3
2
|
const require_use_props = require("../../core/MantineProvider/use-props/use-props.cjs");
|
|
4
3
|
const require_use_styles = require("../../core/styles-api/use-styles/use-styles.cjs");
|
|
5
4
|
const require_use_random_classname = require("../../core/Box/use-random-classname/use-random-classname.cjs");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SimpleGrid.cjs","names":["factory","useProps","useStyles","useRandomClassName","SimpleGridContainerVariables","Box","SimpleGridMediaVariables","classes"],"sources":["../../../src/components/SimpleGrid/SimpleGrid.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n ElementProps,\n Factory,\n factory,\n MantineSpacing,\n StyleProp,\n StylesApiProps,\n useProps,\n useRandomClassName,\n useStyles,\n} from '../../core';\nimport { SimpleGridContainerVariables, SimpleGridMediaVariables } from './SimpleGridVariables';\nimport classes from './SimpleGrid.module.css';\n\nexport type SimpleGridStylesNames = 'root' | 'container';\n\nexport interface SimpleGridProps\n extends BoxProps, StylesApiProps<SimpleGridFactory>, ElementProps<'div'> {\n /** Number of columns @default 1 */\n cols?: StyleProp<number>;\n\n /** Spacing between columns @default 'md' */\n spacing?: StyleProp<MantineSpacing>;\n\n /** Spacing between rows. When not set, falls back to spacing value @default undefined */\n verticalSpacing?: StyleProp<MantineSpacing>;\n\n /** Determines type of queries that are used for responsive styles @default 'media' */\n type?: 'media' | 'container';\n\n /** Minimum column width when using auto-fit/auto-fill. When set, cols prop is ignored */\n minColWidth?: string | number;\n\n /** Grid repeat type when minColWidth is set @default 'auto-fill' */\n autoFlow?: 'auto-fit' | 'auto-fill';\n\n /** Sets the size of implicitly created grid rows */\n autoRows?: string;\n}\n\nexport type SimpleGridFactory = Factory<{\n props: SimpleGridProps;\n ref: HTMLDivElement;\n stylesNames: SimpleGridStylesNames;\n}>;\n\nconst defaultProps = {\n cols: 1,\n spacing: 'md',\n type: 'media',\n} satisfies Partial<SimpleGridProps>;\n\nexport const SimpleGrid = factory<SimpleGridFactory>((_props) => {\n const props = useProps('SimpleGrid', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n cols,\n verticalSpacing,\n spacing,\n type,\n minColWidth,\n autoFlow,\n autoRows,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<SimpleGridFactory>({\n name: 'SimpleGrid',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n });\n\n const responsiveClassName = useRandomClassName();\n\n const autoColsAttr = minColWidth !== undefined ? autoFlow || 'auto-fill' : undefined;\n\n if (type === 'container') {\n return (\n <>\n <SimpleGridContainerVariables {...props} selector={`.${responsiveClassName}`} />\n <div {...getStyles('container')}>\n <Box\n {...getStyles('root', { className: responsiveClassName })}\n {...others}\n data-auto-cols={autoColsAttr}\n />\n </div>\n </>\n );\n }\n\n return (\n <>\n <SimpleGridMediaVariables {...props} selector={`.${responsiveClassName}`} />\n <Box\n {...getStyles('root', { className: responsiveClassName })}\n {...others}\n data-auto-cols={autoColsAttr}\n />\n </>\n );\n});\n\nSimpleGrid.classes = classes;\nSimpleGrid.displayName = '@mantine/core/SimpleGrid';\n\nexport namespace SimpleGrid {\n export type Props = SimpleGridProps;\n export type StylesNames = SimpleGridStylesNames;\n export type Factory = SimpleGridFactory;\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"SimpleGrid.cjs","names":["factory","useProps","useStyles","useRandomClassName","SimpleGridContainerVariables","Box","SimpleGridMediaVariables","classes"],"sources":["../../../src/components/SimpleGrid/SimpleGrid.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n ElementProps,\n Factory,\n factory,\n MantineSpacing,\n StyleProp,\n StylesApiProps,\n useProps,\n useRandomClassName,\n useStyles,\n} from '../../core';\nimport { SimpleGridContainerVariables, SimpleGridMediaVariables } from './SimpleGridVariables';\nimport classes from './SimpleGrid.module.css';\n\nexport type SimpleGridStylesNames = 'root' | 'container';\n\nexport interface SimpleGridProps\n extends BoxProps, StylesApiProps<SimpleGridFactory>, ElementProps<'div'> {\n /** Number of columns @default 1 */\n cols?: StyleProp<number>;\n\n /** Spacing between columns @default 'md' */\n spacing?: StyleProp<MantineSpacing>;\n\n /** Spacing between rows. When not set, falls back to spacing value @default undefined */\n verticalSpacing?: StyleProp<MantineSpacing>;\n\n /** Determines type of queries that are used for responsive styles @default 'media' */\n type?: 'media' | 'container';\n\n /** Minimum column width when using auto-fit/auto-fill. When set, cols prop is ignored */\n minColWidth?: string | number;\n\n /** Grid repeat type when minColWidth is set @default 'auto-fill' */\n autoFlow?: 'auto-fit' | 'auto-fill';\n\n /** Sets the size of implicitly created grid rows */\n autoRows?: string;\n}\n\nexport type SimpleGridFactory = Factory<{\n props: SimpleGridProps;\n ref: HTMLDivElement;\n stylesNames: SimpleGridStylesNames;\n}>;\n\nconst defaultProps = {\n cols: 1,\n spacing: 'md',\n type: 'media',\n} satisfies Partial<SimpleGridProps>;\n\nexport const SimpleGrid = factory<SimpleGridFactory>((_props) => {\n const props = useProps('SimpleGrid', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n cols,\n verticalSpacing,\n spacing,\n type,\n minColWidth,\n autoFlow,\n autoRows,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<SimpleGridFactory>({\n name: 'SimpleGrid',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n });\n\n const responsiveClassName = useRandomClassName();\n\n const autoColsAttr = minColWidth !== undefined ? autoFlow || 'auto-fill' : undefined;\n\n if (type === 'container') {\n return (\n <>\n <SimpleGridContainerVariables {...props} selector={`.${responsiveClassName}`} />\n <div {...getStyles('container')}>\n <Box\n {...getStyles('root', { className: responsiveClassName })}\n {...others}\n data-auto-cols={autoColsAttr}\n />\n </div>\n </>\n );\n }\n\n return (\n <>\n <SimpleGridMediaVariables {...props} selector={`.${responsiveClassName}`} />\n <Box\n {...getStyles('root', { className: responsiveClassName })}\n {...others}\n data-auto-cols={autoColsAttr}\n />\n </>\n );\n});\n\nSimpleGrid.classes = classes;\nSimpleGrid.displayName = '@mantine/core/SimpleGrid';\n\nexport namespace SimpleGrid {\n export type Props = SimpleGridProps;\n export type StylesNames = SimpleGridStylesNames;\n export type Factory = SimpleGridFactory;\n}\n"],"mappings":";;;;;;;;;;AAgDA,MAAM,eAAe;CACnB,MAAM;CACN,SAAS;CACT,MAAM;AACR;AAEA,MAAa,aAAaA,gBAAAA,SAA4B,WAAW;CAC/D,MAAM,QAAQC,kBAAAA,SAAS,cAAc,cAAc,MAAM;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,iBACA,SACA,MACA,aACA,UACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAA6B;EAC7C,MAAM;EACN,SAAA,0BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,sBAAsBC,6BAAAA,mBAAmB;CAE/C,MAAM,eAAe,gBAAgB,KAAA,IAAY,YAAY,cAAc,KAAA;CAE3E,IAAI,SAAS,aACX,OACE,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,KAACC,4BAAAA,8BAAD;EAA8B,GAAI;EAAO,UAAU,IAAI;CAAwB,CAAA,GAC/E,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,GAAI,UAAU,WAAW;YAC5B,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;GACE,GAAI,UAAU,QAAQ,EAAE,WAAW,oBAAoB,CAAC;GACxD,GAAI;GACJ,kBAAgB;EACjB,CAAA;CACE,CAAA,CACL,EAAA,CAAA;CAIN,OACE,iBAAA,GAAA,kBAAA,MAAA,kBAAA,UAAA,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,KAACC,4BAAAA,0BAAD;EAA0B,GAAI;EAAO,UAAU,IAAI;CAAwB,CAAA,GAC3E,iBAAA,GAAA,kBAAA,KAACD,YAAAA,KAAD;EACE,GAAI,UAAU,QAAQ,EAAE,WAAW,oBAAoB,CAAC;EACxD,GAAI;EACJ,kBAAgB;CACjB,CAAA,CACD,EAAA,CAAA;AAEN,CAAC;AAED,WAAW,UAAUE,0BAAAA;AACrB,WAAW,cAAc"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
require("../../_virtual/_rolldown/runtime.cjs");
|
|
3
2
|
const require_keys = require("../../core/utils/keys/keys.cjs");
|
|
4
3
|
const require_px = require("../../core/utils/units-converters/px.cjs");
|
|
5
4
|
const require_rem = require("../../core/utils/units-converters/rem.cjs");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SimpleGridVariables.cjs","names":["rem","useMantineTheme","filterProps","getSpacing","getBaseValue","keys","InlineStyles","getSortedBreakpoints","px"],"sources":["../../../src/components/SimpleGrid/SimpleGridVariables.tsx"],"sourcesContent":["import {\n filterProps,\n getBaseValue,\n getSortedBreakpoints,\n getSpacing,\n InlineStyles,\n keys,\n MantineBreakpoint,\n px,\n rem,\n useMantineTheme,\n} from '../../core';\nimport type { SimpleGridProps } from './SimpleGrid';\n\ninterface SimpleGridVariablesProps extends SimpleGridProps {\n selector: string;\n}\n\nfunction getMinColWidthValue(value: string | number | undefined): string | undefined {\n if (value === undefined) {\n return undefined;\n }\n\n if (typeof value === 'number') {\n return rem(value);\n }\n\n return value;\n}\n\nexport function SimpleGridMediaVariables({\n spacing,\n verticalSpacing,\n cols,\n minColWidth,\n autoRows,\n selector,\n}: SimpleGridVariablesProps) {\n const theme = useMantineTheme();\n const _verticalSpacing = verticalSpacing === undefined ? spacing : verticalSpacing;\n const useAutoColumns = minColWidth !== undefined;\n\n const baseStyles: Record<string, string | undefined> = filterProps({\n '--sg-spacing-x': getSpacing(getBaseValue(spacing)),\n '--sg-spacing-y': getSpacing(getBaseValue(_verticalSpacing)),\n '--sg-auto-rows': autoRows,\n ...(useAutoColumns\n ? { '--sg-min-col-width': getMinColWidthValue(minColWidth) }\n : { '--sg-cols': getBaseValue(cols)?.toString() }),\n });\n\n const queries = keys(theme.breakpoints).reduce<Record<string, Record<string, any>>>(\n (acc, breakpoint) => {\n if (!acc[breakpoint]) {\n acc[breakpoint] = {};\n }\n\n if (typeof spacing === 'object' && spacing[breakpoint] !== undefined) {\n acc[breakpoint]['--sg-spacing-x'] = getSpacing(spacing[breakpoint]);\n }\n\n if (typeof _verticalSpacing === 'object' && _verticalSpacing[breakpoint] !== undefined) {\n acc[breakpoint]['--sg-spacing-y'] = getSpacing(_verticalSpacing[breakpoint]);\n }\n\n if (!useAutoColumns && typeof cols === 'object' && cols[breakpoint] !== undefined) {\n acc[breakpoint]['--sg-cols'] = cols[breakpoint];\n }\n\n return acc;\n },\n {}\n );\n\n const sortedBreakpoints = getSortedBreakpoints(keys(queries), theme.breakpoints).filter(\n (breakpoint) => keys(queries[breakpoint.value]).length > 0\n );\n\n const media = sortedBreakpoints.map((breakpoint) => ({\n query: `(min-width: ${theme.breakpoints[breakpoint.value as MantineBreakpoint]})`,\n styles: queries[breakpoint.value],\n }));\n\n return <InlineStyles styles={baseStyles} media={media} selector={selector} />;\n}\n\nfunction getBreakpoints(values: unknown) {\n if (typeof values === 'object' && values !== null) {\n return keys(values);\n }\n\n return [];\n}\n\nfunction sortBreakpoints(breakpoints: string[]) {\n return breakpoints.sort((a, b) => (px(a) as number) - (px(b) as number));\n}\n\nfunction getUniqueBreakpoints({\n spacing,\n verticalSpacing,\n cols,\n minColWidth,\n}: Omit<SimpleGridVariablesProps, 'selector'>) {\n const breakpoints = Array.from(\n new Set([\n ...getBreakpoints(spacing),\n ...getBreakpoints(verticalSpacing),\n ...(minColWidth !== undefined ? [] : getBreakpoints(cols)),\n ])\n );\n\n return sortBreakpoints(breakpoints);\n}\n\nexport function SimpleGridContainerVariables({\n spacing,\n verticalSpacing,\n cols,\n minColWidth,\n autoRows,\n selector,\n}: SimpleGridVariablesProps) {\n const _verticalSpacing = verticalSpacing === undefined ? spacing : verticalSpacing;\n const useAutoColumns = minColWidth !== undefined;\n\n const baseStyles: Record<string, string | undefined> = filterProps({\n '--sg-spacing-x': getSpacing(getBaseValue(spacing)),\n '--sg-spacing-y': getSpacing(getBaseValue(_verticalSpacing)),\n '--sg-auto-rows': autoRows,\n ...(useAutoColumns\n ? { '--sg-min-col-width': getMinColWidthValue(minColWidth) }\n : { '--sg-cols': getBaseValue(cols)?.toString() }),\n });\n\n const uniqueBreakpoints = getUniqueBreakpoints({ spacing, verticalSpacing, cols, minColWidth });\n\n const queries = uniqueBreakpoints.reduce<Record<string, Record<string, any>>>(\n (acc, breakpoint) => {\n if (!acc[breakpoint]) {\n acc[breakpoint] = {};\n }\n\n if (typeof spacing === 'object' && spacing[breakpoint] !== undefined) {\n acc[breakpoint]['--sg-spacing-x'] = getSpacing(spacing[breakpoint]);\n }\n\n if (typeof _verticalSpacing === 'object' && _verticalSpacing[breakpoint] !== undefined) {\n acc[breakpoint]['--sg-spacing-y'] = getSpacing(_verticalSpacing[breakpoint]);\n }\n\n if (!useAutoColumns && typeof cols === 'object' && cols[breakpoint] !== undefined) {\n acc[breakpoint]['--sg-cols'] = cols[breakpoint];\n }\n\n return acc;\n },\n {}\n );\n\n const media = uniqueBreakpoints.map((breakpoint) => ({\n query: `simple-grid (min-width: ${breakpoint})`,\n styles: queries[breakpoint],\n }));\n\n return <InlineStyles styles={baseStyles} container={media} selector={selector} />;\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"SimpleGridVariables.cjs","names":["rem","useMantineTheme","filterProps","getSpacing","getBaseValue","keys","InlineStyles","getSortedBreakpoints","px"],"sources":["../../../src/components/SimpleGrid/SimpleGridVariables.tsx"],"sourcesContent":["import {\n filterProps,\n getBaseValue,\n getSortedBreakpoints,\n getSpacing,\n InlineStyles,\n keys,\n MantineBreakpoint,\n px,\n rem,\n useMantineTheme,\n} from '../../core';\nimport type { SimpleGridProps } from './SimpleGrid';\n\ninterface SimpleGridVariablesProps extends SimpleGridProps {\n selector: string;\n}\n\nfunction getMinColWidthValue(value: string | number | undefined): string | undefined {\n if (value === undefined) {\n return undefined;\n }\n\n if (typeof value === 'number') {\n return rem(value);\n }\n\n return value;\n}\n\nexport function SimpleGridMediaVariables({\n spacing,\n verticalSpacing,\n cols,\n minColWidth,\n autoRows,\n selector,\n}: SimpleGridVariablesProps) {\n const theme = useMantineTheme();\n const _verticalSpacing = verticalSpacing === undefined ? spacing : verticalSpacing;\n const useAutoColumns = minColWidth !== undefined;\n\n const baseStyles: Record<string, string | undefined> = filterProps({\n '--sg-spacing-x': getSpacing(getBaseValue(spacing)),\n '--sg-spacing-y': getSpacing(getBaseValue(_verticalSpacing)),\n '--sg-auto-rows': autoRows,\n ...(useAutoColumns\n ? { '--sg-min-col-width': getMinColWidthValue(minColWidth) }\n : { '--sg-cols': getBaseValue(cols)?.toString() }),\n });\n\n const queries = keys(theme.breakpoints).reduce<Record<string, Record<string, any>>>(\n (acc, breakpoint) => {\n if (!acc[breakpoint]) {\n acc[breakpoint] = {};\n }\n\n if (typeof spacing === 'object' && spacing[breakpoint] !== undefined) {\n acc[breakpoint]['--sg-spacing-x'] = getSpacing(spacing[breakpoint]);\n }\n\n if (typeof _verticalSpacing === 'object' && _verticalSpacing[breakpoint] !== undefined) {\n acc[breakpoint]['--sg-spacing-y'] = getSpacing(_verticalSpacing[breakpoint]);\n }\n\n if (!useAutoColumns && typeof cols === 'object' && cols[breakpoint] !== undefined) {\n acc[breakpoint]['--sg-cols'] = cols[breakpoint];\n }\n\n return acc;\n },\n {}\n );\n\n const sortedBreakpoints = getSortedBreakpoints(keys(queries), theme.breakpoints).filter(\n (breakpoint) => keys(queries[breakpoint.value]).length > 0\n );\n\n const media = sortedBreakpoints.map((breakpoint) => ({\n query: `(min-width: ${theme.breakpoints[breakpoint.value as MantineBreakpoint]})`,\n styles: queries[breakpoint.value],\n }));\n\n return <InlineStyles styles={baseStyles} media={media} selector={selector} />;\n}\n\nfunction getBreakpoints(values: unknown) {\n if (typeof values === 'object' && values !== null) {\n return keys(values);\n }\n\n return [];\n}\n\nfunction sortBreakpoints(breakpoints: string[]) {\n return breakpoints.sort((a, b) => (px(a) as number) - (px(b) as number));\n}\n\nfunction getUniqueBreakpoints({\n spacing,\n verticalSpacing,\n cols,\n minColWidth,\n}: Omit<SimpleGridVariablesProps, 'selector'>) {\n const breakpoints = Array.from(\n new Set([\n ...getBreakpoints(spacing),\n ...getBreakpoints(verticalSpacing),\n ...(minColWidth !== undefined ? [] : getBreakpoints(cols)),\n ])\n );\n\n return sortBreakpoints(breakpoints);\n}\n\nexport function SimpleGridContainerVariables({\n spacing,\n verticalSpacing,\n cols,\n minColWidth,\n autoRows,\n selector,\n}: SimpleGridVariablesProps) {\n const _verticalSpacing = verticalSpacing === undefined ? spacing : verticalSpacing;\n const useAutoColumns = minColWidth !== undefined;\n\n const baseStyles: Record<string, string | undefined> = filterProps({\n '--sg-spacing-x': getSpacing(getBaseValue(spacing)),\n '--sg-spacing-y': getSpacing(getBaseValue(_verticalSpacing)),\n '--sg-auto-rows': autoRows,\n ...(useAutoColumns\n ? { '--sg-min-col-width': getMinColWidthValue(minColWidth) }\n : { '--sg-cols': getBaseValue(cols)?.toString() }),\n });\n\n const uniqueBreakpoints = getUniqueBreakpoints({ spacing, verticalSpacing, cols, minColWidth });\n\n const queries = uniqueBreakpoints.reduce<Record<string, Record<string, any>>>(\n (acc, breakpoint) => {\n if (!acc[breakpoint]) {\n acc[breakpoint] = {};\n }\n\n if (typeof spacing === 'object' && spacing[breakpoint] !== undefined) {\n acc[breakpoint]['--sg-spacing-x'] = getSpacing(spacing[breakpoint]);\n }\n\n if (typeof _verticalSpacing === 'object' && _verticalSpacing[breakpoint] !== undefined) {\n acc[breakpoint]['--sg-spacing-y'] = getSpacing(_verticalSpacing[breakpoint]);\n }\n\n if (!useAutoColumns && typeof cols === 'object' && cols[breakpoint] !== undefined) {\n acc[breakpoint]['--sg-cols'] = cols[breakpoint];\n }\n\n return acc;\n },\n {}\n );\n\n const media = uniqueBreakpoints.map((breakpoint) => ({\n query: `simple-grid (min-width: ${breakpoint})`,\n styles: queries[breakpoint],\n }));\n\n return <InlineStyles styles={baseStyles} container={media} selector={selector} />;\n}\n"],"mappings":"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"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
require("../../_virtual/_rolldown/runtime.cjs");
|
|
3
2
|
const require_rem = require("../../core/utils/units-converters/rem.cjs");
|
|
4
3
|
const require_get_size = require("../../core/utils/get-size/get-size.cjs");
|
|
5
4
|
const require_create_vars_resolver = require("../../core/styles-api/create-vars-resolver/create-vars-resolver.cjs");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Skeleton.cjs","names":["createVarsResolver","rem","getRadius","factory","useProps","Box","useStyles","classes"],"sources":["../../../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getRadius,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Skeleton.module.css';\n\nexport type SkeletonStylesNames = 'root';\nexport type SkeletonCssVariables = {\n root: '--skeleton-width' | '--skeleton-height' | '--skeleton-radius';\n};\n\nexport interface SkeletonProps\n extends BoxProps, StylesApiProps<SkeletonFactory>, ElementProps<'div'> {\n /** Determines whether Skeleton overlay should be displayed @default true */\n visible?: boolean;\n\n /** Skeleton `height`, numbers are converted to rem @default auto */\n height?: React.CSSProperties['height'];\n\n /** Skeleton `width`, numbers are converted to rem, ignored when `circle` prop is set. @default 100% */\n width?: React.CSSProperties['width'];\n\n /** If set, Skeleton `width` and `border-radius` are equal to its `height` @default false */\n circle?: boolean;\n\n /** Key of `theme.radius` or any valid CSS value to set border-radius. Numbers are converted to rem. @default theme.defaultRadius */\n radius?: React.CSSProperties['borderRadius'];\n\n /** Enables animation @default true */\n animate?: boolean;\n}\n\nexport type SkeletonFactory = Factory<{\n props: SkeletonProps;\n ref: HTMLDivElement;\n stylesNames: SkeletonStylesNames;\n vars: SkeletonCssVariables;\n}>;\n\nconst defaultProps = {\n visible: true,\n animate: true,\n} satisfies Partial<SkeletonProps>;\n\nconst varsResolver = createVarsResolver<SkeletonFactory>(\n (_, { width, height, radius, circle }) => ({\n root: {\n '--skeleton-height': rem(height),\n '--skeleton-width': circle ? rem(height) : rem(width),\n '--skeleton-radius': circle ? '1000px' : radius === undefined ? undefined : getRadius(radius),\n },\n })\n);\n\nexport const Skeleton = factory<SkeletonFactory>((_props) => {\n const props = useProps('Skeleton', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n width,\n height,\n circle,\n visible,\n radius,\n animate,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<SkeletonFactory>({\n name: 'Skeleton',\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 {...getStyles('root')} mod={[{ visible, animate }, mod]} {...others} />;\n});\n\nSkeleton.classes = classes;\nSkeleton.varsResolver = varsResolver;\nSkeleton.displayName = '@mantine/core/Skeleton';\n\nexport namespace Skeleton {\n export type Props = SkeletonProps;\n export type StylesNames = SkeletonStylesNames;\n export type CssVariables = SkeletonCssVariables;\n export type Factory = SkeletonFactory;\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Skeleton.cjs","names":["createVarsResolver","rem","getRadius","factory","useProps","Box","useStyles","classes"],"sources":["../../../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getRadius,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Skeleton.module.css';\n\nexport type SkeletonStylesNames = 'root';\nexport type SkeletonCssVariables = {\n root: '--skeleton-width' | '--skeleton-height' | '--skeleton-radius';\n};\n\nexport interface SkeletonProps\n extends BoxProps, StylesApiProps<SkeletonFactory>, ElementProps<'div'> {\n /** Determines whether Skeleton overlay should be displayed @default true */\n visible?: boolean;\n\n /** Skeleton `height`, numbers are converted to rem @default auto */\n height?: React.CSSProperties['height'];\n\n /** Skeleton `width`, numbers are converted to rem, ignored when `circle` prop is set. @default 100% */\n width?: React.CSSProperties['width'];\n\n /** If set, Skeleton `width` and `border-radius` are equal to its `height` @default false */\n circle?: boolean;\n\n /** Key of `theme.radius` or any valid CSS value to set border-radius. Numbers are converted to rem. @default theme.defaultRadius */\n radius?: React.CSSProperties['borderRadius'];\n\n /** Enables animation @default true */\n animate?: boolean;\n}\n\nexport type SkeletonFactory = Factory<{\n props: SkeletonProps;\n ref: HTMLDivElement;\n stylesNames: SkeletonStylesNames;\n vars: SkeletonCssVariables;\n}>;\n\nconst defaultProps = {\n visible: true,\n animate: true,\n} satisfies Partial<SkeletonProps>;\n\nconst varsResolver = createVarsResolver<SkeletonFactory>(\n (_, { width, height, radius, circle }) => ({\n root: {\n '--skeleton-height': rem(height),\n '--skeleton-width': circle ? rem(height) : rem(width),\n '--skeleton-radius': circle ? '1000px' : radius === undefined ? undefined : getRadius(radius),\n },\n })\n);\n\nexport const Skeleton = factory<SkeletonFactory>((_props) => {\n const props = useProps('Skeleton', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n width,\n height,\n circle,\n visible,\n radius,\n animate,\n mod,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<SkeletonFactory>({\n name: 'Skeleton',\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 {...getStyles('root')} mod={[{ visible, animate }, mod]} {...others} />;\n});\n\nSkeleton.classes = classes;\nSkeleton.varsResolver = varsResolver;\nSkeleton.displayName = '@mantine/core/Skeleton';\n\nexport namespace Skeleton {\n export type Props = SkeletonProps;\n export type StylesNames = SkeletonStylesNames;\n export type CssVariables = SkeletonCssVariables;\n export type Factory = SkeletonFactory;\n}\n"],"mappings":";;;;;;;;;;;AAgDA,MAAM,eAAe;CACnB,SAAS;CACT,SAAS;AACX;AAEA,MAAM,eAAeA,6BAAAA,oBAClB,GAAG,EAAE,OAAO,QAAQ,QAAQ,cAAc,EACzC,MAAM;CACJ,qBAAqBC,YAAAA,IAAI,MAAM;CAC/B,oBAAoB,SAASA,YAAAA,IAAI,MAAM,IAAIA,YAAAA,IAAI,KAAK;CACpD,qBAAqB,SAAS,WAAW,WAAW,KAAA,IAAY,KAAA,IAAYC,iBAAAA,UAAU,MAAM;AAC9F,EACF,EACF;AAEA,MAAa,WAAWC,gBAAAA,SAA0B,WAAW;CAC3D,MAAM,QAAQC,kBAAAA,SAAS,YAAY,cAAc,MAAM;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,QACA,QACA,SACA,QACA,SACA,KACA,YACA,GAAG,WACD;CAgBJ,OAAO,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;EAAK,GAdMC,mBAAAA,UAA2B;GAC3C,MAAM;GACN,SAAA,wBAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAEwB,EAAE,MAAM;EAAG,KAAK,CAAC;GAAE;GAAS;EAAQ,GAAG,GAAG;EAAG,GAAI;CAAS,CAAA;AACpF,CAAC;AAED,SAAS,UAAUC,wBAAAA;AACnB,SAAS,eAAe;AACxB,SAAS,cAAc"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
require("../../../_virtual/_rolldown/runtime.cjs");
|
|
3
2
|
const require_Box = require("../../../core/Box/Box.cjs");
|
|
4
3
|
const require_Slider_context = require("../Slider.context.cjs");
|
|
5
4
|
const require_get_position = require("../utils/get-position/get-position.cjs");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Marks.cjs","names":["useSliderContext","Box","getPosition","isMarkFilled"],"sources":["../../../../src/components/Slider/Marks/Marks.tsx"],"sourcesContent":["import { Box } from '../../../core';\nimport { useSliderContext } from '../Slider.context';\nimport { SliderMark } from '../SliderMark';\nimport { getPosition } from '../utils/get-position/get-position';\nimport { isMarkFilled } from './is-mark-filled';\n\nexport interface MarksProps {\n marks: SliderMark[] | undefined;\n min: number;\n max: number;\n value: number;\n offset: number | undefined;\n disabled: boolean | undefined;\n inverted: boolean | undefined;\n startPointValue?: number;\n}\n\nexport function Marks({\n marks,\n min,\n max,\n disabled,\n value,\n offset,\n inverted,\n startPointValue,\n}: MarksProps) {\n const { getStyles } = useSliderContext();\n\n if (!marks) {\n return null;\n }\n\n const items = marks.map((mark, index) => {\n if (mark.hidden) {\n return null;\n }\n\n return (\n <Box\n {...getStyles('markWrapper')}\n __vars={{ '--mark-offset': `${getPosition({ value: mark.value, min, max })}%` }}\n key={index}\n >\n <Box\n {...getStyles('mark')}\n mod={{\n filled: isMarkFilled({ mark, value, offset, inverted, startPointValue }),\n disabled,\n }}\n />\n {mark.label && <div {...getStyles('markLabel')}>{mark.label}</div>}\n </Box>\n );\n });\n\n return <div>{items}</div>;\n}\n\nMarks.displayName = '@mantine/core/SliderMarks';\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Marks.cjs","names":["useSliderContext","Box","getPosition","isMarkFilled"],"sources":["../../../../src/components/Slider/Marks/Marks.tsx"],"sourcesContent":["import { Box } from '../../../core';\nimport { useSliderContext } from '../Slider.context';\nimport { SliderMark } from '../SliderMark';\nimport { getPosition } from '../utils/get-position/get-position';\nimport { isMarkFilled } from './is-mark-filled';\n\nexport interface MarksProps {\n marks: SliderMark[] | undefined;\n min: number;\n max: number;\n value: number;\n offset: number | undefined;\n disabled: boolean | undefined;\n inverted: boolean | undefined;\n startPointValue?: number;\n}\n\nexport function Marks({\n marks,\n min,\n max,\n disabled,\n value,\n offset,\n inverted,\n startPointValue,\n}: MarksProps) {\n const { getStyles } = useSliderContext();\n\n if (!marks) {\n return null;\n }\n\n const items = marks.map((mark, index) => {\n if (mark.hidden) {\n return null;\n }\n\n return (\n <Box\n {...getStyles('markWrapper')}\n __vars={{ '--mark-offset': `${getPosition({ value: mark.value, min, max })}%` }}\n key={index}\n >\n <Box\n {...getStyles('mark')}\n mod={{\n filled: isMarkFilled({ mark, value, offset, inverted, startPointValue }),\n disabled,\n }}\n />\n {mark.label && <div {...getStyles('markLabel')}>{mark.label}</div>}\n </Box>\n );\n });\n\n return <div>{items}</div>;\n}\n\nMarks.displayName = '@mantine/core/SliderMarks';\n"],"mappings":";;;;;;;;AAiBA,SAAgB,MAAM,EACpB,OACA,KACA,KACA,UACA,OACA,QACA,UACA,mBACa;CACb,MAAM,EAAE,cAAcA,uBAAAA,iBAAiB;CAEvC,IAAI,CAAC,OACH,OAAO;CA0BT,OAAO,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAAA,UAvBO,MAAM,KAAK,MAAM,UAAU;EACvC,IAAI,KAAK,QACP,OAAO;EAGT,OACE,iBAAA,GAAA,MAAA,eAACC,YAAAA,KAAD;GACE,GAAI,UAAU,aAAa;GAC3B,QAAQ,EAAE,iBAAiB,GAAGC,qBAAAA,YAAY;IAAE,OAAO,KAAK;IAAO;IAAK;GAAI,CAAC,EAAE,GAAG;GAC9E,KAAK;EAUF,GARH,iBAAA,GAAA,kBAAA,KAACD,YAAAA,KAAD;GACE,GAAI,UAAU,MAAM;GACpB,KAAK;IACH,QAAQE,uBAAAA,aAAa;KAAE;KAAM;KAAO;KAAQ;KAAU;IAAgB,CAAC;IACvE;GACF;EACD,CAAA,GACA,KAAK,SAAS,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,GAAI,UAAU,WAAW;aAAI,KAAK;EAAW,CAAA,CAC9D;CAET,CAEiB,EAAO,CAAA;AAC1B;AAEA,MAAM,cAAc"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
require("../../../_virtual/_rolldown/runtime.cjs");
|
|
3
2
|
const require_rem = require("../../../core/utils/units-converters/rem.cjs");
|
|
4
3
|
const require_get_size = require("../../../core/utils/get-size/get-size.cjs");
|
|
5
4
|
const require_find_closest_number = require("../../../core/utils/find-closest-number/find-closest-number.cjs");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RangeSlider.cjs","names":["createVarsResolver","getSize","getThemeColor","getRadius","rem","factory","useProps","useStyles","useDirection","getPosition","getPrecision","findClosestNumber","getLastMarkValue","getFirstMarkValue","getPreviousMarkValue","getNextMarkValue","getFloatingValue","getChangeValue","getClientPosition","SliderProvider","SliderRoot","Track","Thumb","classes"],"sources":["../../../../src/components/Slider/RangeSlider/RangeSlider.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { clamp, useMergedRef, useMove, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n findClosestNumber,\n getRadius,\n getSize,\n getThemeColor,\n MantineColor,\n MantineRadius,\n MantineSize,\n rem,\n StylesApiProps,\n useDirection,\n useProps,\n useStyles,\n} from '../../../core';\nimport { TransitionOverride } from '../../Transition';\nimport { SliderCssVariables, SliderProvider, SliderStylesNames } from '../Slider.context';\nimport { SliderMark } from '../SliderMark';\nimport { SliderRoot } from '../SliderRoot/SliderRoot';\nimport { Thumb } from '../Thumb/Thumb';\nimport { Track } from '../Track/Track';\nimport { getChangeValue } from '../utils/get-change-value/get-change-value';\nimport { getClientPosition } from '../utils/get-client-position/get-client-position';\nimport { getFloatingValue } from '../utils/get-floating-value/get-floating-value';\nimport { getPosition } from '../utils/get-position/get-position';\nimport { getPrecision } from '../utils/get-precision/get-precision';\nimport {\n getFirstMarkValue,\n getLastMarkValue,\n getNextMarkValue,\n getPreviousMarkValue,\n} from '../utils/get-step-mark-value/get-step-mark-value';\nimport classes from '../Slider.module.css';\n\nexport type RangeSliderValue = [number, number];\n\nexport interface RangeSliderProps\n extends\n BoxProps,\n StylesApiProps<RangeSliderFactory>,\n ElementProps<'div', 'onChange' | 'value' | 'defaultValue'> {\n /** Key of `theme.colors` or any valid CSS color, controls color of track and thumb @default theme.primaryColor */\n color?: MantineColor;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default 'xl' */\n radius?: MantineRadius;\n\n /** Controls size of the track @default 'md' */\n size?: MantineSize | (string & {}) | number;\n\n /** Minimal possible value @default 0 */\n min?: number;\n\n /** Maximum possible value @default 100 */\n max?: number;\n\n /** Domain of the slider, defines the selectable value range independently of min/max. Useful when you want to display a wider track range (min/max) but restrict actual selection to a subset (domain). @default [min, max] */\n domain?: [number, number];\n\n /** Number by which value will be incremented/decremented with thumb drag and arrows @default 1 */\n step?: number;\n\n /** Number of significant digits after the decimal point */\n precision?: number;\n\n /** Controlled component value */\n value?: RangeSliderValue;\n\n /** Uncontrolled component default value */\n defaultValue?: RangeSliderValue;\n\n /** Called when value changes */\n onChange?: (value: RangeSliderValue) => void;\n\n /** Called when user stops dragging slider or changes value with arrows */\n onChangeEnd?: (value: RangeSliderValue) => void;\n\n /** Hidden input name, use with uncontrolled component */\n name?: string;\n\n /** Marks displayed on the track */\n marks?: SliderMark[];\n\n /** Function to generate label or any react node to render instead, set to null to disable label */\n label?: React.ReactNode | ((value: number) => React.ReactNode);\n\n /** Props passed down to the `Transition` component @default { transition: 'fade', duration: 0 } */\n labelTransitionProps?: TransitionOverride;\n\n /** Determines whether the label should be visible when the slider is not being dragged or hovered @default false */\n labelAlwaysOn?: boolean;\n\n /** Determines whether the label should be displayed when the slider is hovered @default true */\n showLabelOnHover?: boolean;\n\n /** Content rendered inside thumb */\n thumbChildren?: React.ReactNode;\n\n /** Disables slider */\n disabled?: boolean;\n\n /** Thumb `width` and `height`, by default value is computed based on `size` prop */\n thumbSize?: number | string;\n\n /** A transformation function to change the scale of the slider */\n scale?: (value: number) => number;\n\n /** Determines whether track values representation should be inverted @default false */\n inverted?: boolean;\n\n /** Slider orientation @default 'horizontal' */\n orientation?: 'horizontal' | 'vertical';\n\n /** Minimal range interval between the two thumbs. Consider this value relative to the total range (max - min). @default 10 */\n minRange?: number;\n\n /** Maximum range interval @default Infinity */\n maxRange?: number;\n\n /** `aria-label` for both thumbs (overridden by thumbFromLabel/thumbToLabel if provided) */\n thumbLabel?: string;\n\n /** `aria-valuetext` for both thumbs. When a function is provided, it receives the scaled value. */\n thumbValueText?: string | ((value: number) => string);\n\n /** First thumb `aria-label` */\n thumbFromLabel?: string;\n\n /** Second thumb `aria-label` */\n thumbToLabel?: string;\n\n /** Props passed down to the hidden input */\n hiddenInputProps?: React.ComponentProps<'input'>;\n\n /** Determines whether the selection should be only allowed from the given marks array @default false */\n restrictToMarks?: boolean;\n\n /** Props passed down to thumb element based on the thumb index */\n thumbProps?: (index: 0 | 1) => React.ComponentProps<'div'>;\n\n /** Determines whether the other thumb should be pushed by the current thumb dragging when `minRange`/`maxRange` is reached @default true */\n pushOnOverlap?: boolean;\n}\n\nexport type RangeSliderFactory = Factory<{\n props: RangeSliderProps;\n ref: HTMLDivElement;\n stylesNames: SliderStylesNames;\n vars: SliderCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<RangeSliderFactory>(\n (theme, { size, color, thumbSize, radius }) => ({\n root: {\n '--slider-size': getSize(size, 'slider-size'),\n '--slider-color': color ? getThemeColor(color, theme) : undefined,\n '--slider-radius': radius === undefined ? undefined : getRadius(radius),\n '--slider-thumb-size':\n thumbSize !== undefined ? rem(thumbSize) : 'calc(var(--slider-size) * 2)',\n },\n })\n);\n\nconst defaultProps = {\n min: 0,\n max: 100,\n minRange: 10,\n step: 1,\n marks: [],\n label: (f) => f,\n labelTransitionProps: { transition: 'fade', duration: 0 },\n labelAlwaysOn: false,\n showLabelOnHover: true,\n disabled: false,\n pushOnOverlap: true,\n scale: (v) => v,\n size: 'md',\n maxRange: Infinity,\n} satisfies Partial<RangeSliderProps>;\n\nexport const RangeSlider = factory<RangeSliderFactory>((_props) => {\n const props = useProps('RangeSlider', defaultProps, _props);\n const {\n classNames,\n styles,\n value,\n onChange,\n onChangeEnd,\n size,\n min,\n max,\n domain,\n minRange,\n maxRange,\n step,\n precision: _precision,\n defaultValue,\n name,\n marks,\n label,\n labelTransitionProps,\n labelAlwaysOn,\n thumbFromLabel,\n thumbToLabel,\n thumbValueText,\n showLabelOnHover,\n thumbChildren,\n disabled,\n unstyled,\n scale,\n inverted,\n orientation,\n className,\n style,\n vars,\n hiddenInputProps,\n restrictToMarks,\n thumbProps,\n pushOnOverlap,\n attributes,\n ref,\n ...others\n } = props;\n\n const getStyles = useStyles<RangeSliderFactory>({\n name: 'RangeSlider',\n props,\n classes,\n classNames,\n className,\n styles,\n style,\n attributes,\n vars,\n varsResolver,\n unstyled,\n });\n\n const containerRef = useRef<HTMLDivElement | null>(null);\n const { dir } = useDirection();\n const [focused, setFocused] = useState(-1);\n const [hovered, setHovered] = useState(false);\n const [_value, setValue] = useUncontrolled<RangeSliderValue>({\n value,\n defaultValue,\n finalValue: [min, max],\n onChange,\n });\n const valueRef = useRef(_value);\n const thumbs = useRef<HTMLDivElement[]>([]);\n const root = useRef<HTMLDivElement>(null);\n const thumbIndex = useRef<number | undefined>(undefined);\n const [domainMin, domainMax] = domain || [min!, max!];\n const positions = [\n getPosition({ value: _value[0], min: domainMin, max: domainMax }),\n getPosition({ value: _value[1], min: domainMin, max: domainMax }),\n ];\n\n const precision = _precision ?? getPrecision(step);\n\n const _setValue = (val: RangeSliderValue) => {\n setValue(val);\n valueRef.current = val;\n };\n\n useEffect(\n () => {\n if (Array.isArray(value)) {\n valueRef.current = value;\n }\n },\n Array.isArray(value) ? [value[0], value[1]] : [null, null]\n );\n\n const setRangedValue = (val: number, index: number, triggerChangeEnd: boolean) => {\n if (index === -1) {\n return;\n }\n\n const clone: RangeSliderValue = [...valueRef.current];\n\n if (restrictToMarks && marks) {\n const closest = findClosestNumber(\n val,\n marks.map((m) => m.value)\n );\n\n const current = clone[index];\n clone[index] = closest;\n const otherIndex = index === 0 ? 1 : 0;\n\n const lastMarkValue = getLastMarkValue(marks);\n const firstMarkValue = getFirstMarkValue(marks);\n\n if (closest === lastMarkValue && clone[otherIndex] === lastMarkValue) {\n clone[index] = current;\n } else if (closest === firstMarkValue && clone[otherIndex] === firstMarkValue) {\n clone[index] = current;\n } else if (closest === clone[otherIndex]) {\n if (current > clone[otherIndex]) {\n clone[otherIndex] = getPreviousMarkValue(closest, marks);\n } else {\n clone[otherIndex] = getNextMarkValue(closest, marks);\n }\n }\n } else {\n const clampedVal = clamp(val, min!, max!);\n clone[index] = clampedVal;\n\n if (index === 0) {\n if (clampedVal > clone[1] - (minRange - 0.000000001)) {\n if (pushOnOverlap) {\n clone[1] = Math.min(val + minRange, max);\n } else {\n clone[index] = valueRef.current[index];\n }\n }\n\n if (clampedVal > (max - (minRange - 0.000000001) || min)) {\n clone[index] = valueRef.current[index];\n }\n\n if (clone[1] - val > maxRange) {\n if (pushOnOverlap) {\n clone[1] = val + maxRange;\n } else {\n clone[index] = valueRef.current[index];\n }\n }\n }\n\n if (index === 1) {\n if (clampedVal < clone[0] + minRange) {\n if (pushOnOverlap) {\n clone[0] = Math.max(val - minRange, min);\n } else {\n clone[index] = valueRef.current[index];\n }\n }\n\n if (clampedVal < clone[0] + minRange) {\n clone[index] = valueRef.current[index];\n }\n\n if (clampedVal - clone[0] > maxRange) {\n if (pushOnOverlap) {\n clone[0] = val - maxRange;\n } else {\n clone[index] = valueRef.current[index];\n }\n }\n }\n }\n\n clone[0] = getFloatingValue(clone[0], precision);\n clone[1] = getFloatingValue(clone[1], precision);\n\n if (clone[0] > clone[1]) {\n const temp = clone[0];\n clone[0] = clone[1];\n clone[1] = temp;\n }\n\n _setValue(clone);\n\n if (triggerChangeEnd) {\n onChangeEnd?.(valueRef.current);\n }\n };\n\n const handleChange = (val: number) => {\n if (!disabled && thumbIndex.current !== undefined) {\n const nextValue = getChangeValue({\n value: val,\n min: domainMin,\n max: domainMax,\n step,\n precision,\n });\n setRangedValue(nextValue, thumbIndex.current, false);\n }\n };\n\n const { ref: useMoveRef, active } = useMove(\n ({ x, y }) => handleChange(orientation === 'vertical' ? 1 - y : x),\n { onScrubEnd: () => !disabled && onChangeEnd?.(valueRef.current) },\n dir\n );\n\n function handleThumbMouseDown(index: number) {\n thumbIndex.current = index;\n }\n\n const handleTrackMouseDownCapture = (\n event: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>\n ) => {\n if (containerRef.current) {\n containerRef.current.focus();\n const rect = containerRef.current.getBoundingClientRect();\n const changePosition = getClientPosition(event.nativeEvent, orientation);\n\n const changeValue =\n orientation === 'vertical'\n ? getChangeValue({\n value: rect.bottom - changePosition,\n max,\n min,\n step,\n containerWidth: rect.height,\n })\n : getChangeValue({\n value: changePosition - rect.left,\n max,\n min,\n step,\n containerWidth: rect.width,\n });\n\n const nearestHandle =\n Math.abs(_value[0] - changeValue) > Math.abs(_value[1] - changeValue) ? 1 : 0;\n const _nearestHandle =\n orientation === 'vertical'\n ? nearestHandle\n : dir === 'ltr'\n ? nearestHandle\n : nearestHandle === 1\n ? 0\n : 1;\n\n thumbIndex.current = _nearestHandle;\n }\n };\n\n const getFocusedThumbIndex = () => {\n if (focused !== 1 && focused !== 0) {\n setFocused(0);\n return 0;\n }\n\n return focused;\n };\n\n const handleTrackKeydownCapture = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (!disabled) {\n switch (event.key) {\n case 'ArrowUp': {\n event.preventDefault();\n const focusedIndex = getFocusedThumbIndex();\n thumbs.current[focusedIndex].focus();\n const nextValue =\n restrictToMarks && marks\n ? getNextMarkValue(valueRef.current[focusedIndex], marks)\n : Math.min(Math.max(valueRef.current[focusedIndex] + step, domainMin), domainMax);\n setRangedValue(getFloatingValue(nextValue, precision), focusedIndex, true);\n break;\n }\n\n case 'ArrowRight': {\n event.preventDefault();\n const focusedIndex = getFocusedThumbIndex();\n thumbs.current[focusedIndex].focus();\n\n const nextValue =\n restrictToMarks && marks\n ? (dir === 'rtl' ? getPreviousMarkValue : getNextMarkValue)(\n valueRef.current[focusedIndex],\n marks\n )\n : Math.min(\n Math.max(\n dir === 'rtl'\n ? valueRef.current[focusedIndex] - step\n : valueRef.current[focusedIndex] + step,\n domainMin\n ),\n domainMax\n );\n\n setRangedValue(getFloatingValue(nextValue, precision), focusedIndex, true);\n break;\n }\n\n case 'ArrowDown': {\n event.preventDefault();\n const focusedIndex = getFocusedThumbIndex();\n thumbs.current[focusedIndex].focus();\n const nextValue =\n restrictToMarks && marks\n ? getPreviousMarkValue(valueRef.current[focusedIndex], marks)\n : Math.min(Math.max(valueRef.current[focusedIndex] - step, domainMin), domainMax);\n setRangedValue(getFloatingValue(nextValue, precision), focusedIndex, true);\n break;\n }\n\n case 'ArrowLeft': {\n event.preventDefault();\n const focusedIndex = getFocusedThumbIndex();\n thumbs.current[focusedIndex].focus();\n\n const nextValue =\n restrictToMarks && marks\n ? (dir === 'rtl' ? getNextMarkValue : getPreviousMarkValue)(\n valueRef.current[focusedIndex],\n marks\n )\n : Math.min(\n Math.max(\n dir === 'rtl'\n ? valueRef.current[focusedIndex] + step\n : valueRef.current[focusedIndex] - step,\n domainMin\n ),\n domainMax\n );\n\n setRangedValue(getFloatingValue(nextValue, precision), focusedIndex, true);\n break;\n }\n\n default: {\n break;\n }\n }\n }\n };\n\n const sharedThumbProps = {\n max,\n min,\n size,\n labelTransitionProps,\n labelAlwaysOn,\n orientation,\n onBlur: () => setFocused(-1),\n };\n\n const hasArrayThumbChildren = Array.isArray(thumbChildren);\n\n return (\n <SliderProvider value={{ getStyles }}>\n <SliderRoot\n {...others}\n size={size}\n ref={useMergedRef(ref, root)}\n disabled={disabled}\n orientation={orientation}\n onMouseDownCapture={() => root.current?.focus()}\n onKeyDownCapture={() => {\n if (thumbs.current[0]?.parentElement?.contains(document.activeElement)) {\n return;\n }\n thumbs.current[0]?.focus();\n }}\n >\n <Track\n offset={positions[0]}\n marksOffset={_value[0]}\n filled={positions[1] - positions[0]}\n marks={marks}\n inverted={inverted}\n min={domainMin}\n max={domainMax}\n value={_value[1]}\n disabled={disabled}\n containerProps={{\n ref: useMergedRef(containerRef, useMoveRef) as any,\n onMouseEnter: showLabelOnHover ? () => setHovered(true) : undefined,\n onMouseLeave: showLabelOnHover ? () => setHovered(false) : undefined,\n onTouchStartCapture: handleTrackMouseDownCapture,\n onTouchEndCapture: () => {\n thumbIndex.current = -1;\n },\n onMouseDownCapture: handleTrackMouseDownCapture,\n onMouseUpCapture: () => {\n thumbIndex.current = -1;\n },\n onKeyDownCapture: handleTrackKeydownCapture,\n }}\n >\n <Thumb\n {...sharedThumbProps}\n value={scale(_value[0])}\n position={positions[0]}\n dragging={active}\n label={\n typeof label === 'function'\n ? label(getFloatingValue(scale(_value[0]), precision))\n : label\n }\n ref={(node) => {\n if (node) {\n thumbs.current[0] = node;\n }\n }}\n thumbLabel={thumbFromLabel}\n thumbValueText={thumbValueText}\n onMouseDown={() => handleThumbMouseDown(0)}\n onFocus={() => setFocused(0)}\n showLabelOnHover={showLabelOnHover}\n isHovered={hovered}\n disabled={disabled}\n {...thumbProps?.(0)}\n >\n {hasArrayThumbChildren ? thumbChildren[0] : thumbChildren}\n </Thumb>\n\n <Thumb\n {...sharedThumbProps}\n thumbLabel={thumbToLabel}\n value={scale(_value[1])}\n position={positions[1]}\n dragging={active}\n label={\n typeof label === 'function'\n ? label(getFloatingValue(scale(_value[1]), precision))\n : label\n }\n ref={(node) => {\n if (node) {\n thumbs.current[1] = node;\n }\n }}\n thumbValueText={thumbValueText}\n onMouseDown={() => handleThumbMouseDown(1)}\n onFocus={() => setFocused(1)}\n showLabelOnHover={showLabelOnHover}\n isHovered={hovered}\n disabled={disabled}\n {...thumbProps?.(1)}\n >\n {hasArrayThumbChildren ? thumbChildren[1] : thumbChildren}\n </Thumb>\n </Track>\n\n <input type=\"hidden\" name={`${name}_from`} value={_value[0]} {...hiddenInputProps} />\n <input type=\"hidden\" name={`${name}_to`} value={_value[1]} {...hiddenInputProps} />\n </SliderRoot>\n </SliderProvider>\n );\n});\n\nRangeSlider.classes = classes;\nRangeSlider.varsResolver = varsResolver;\nRangeSlider.displayName = '@mantine/core/RangeSlider';\n\nexport namespace RangeSlider {\n export type Props = RangeSliderProps;\n export type Value = RangeSliderValue;\n export type Factory = RangeSliderFactory;\n export type StylesNames = SliderStylesNames;\n export type CssVariables = SliderCssVariables;\n export type Mark = SliderMark;\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"RangeSlider.cjs","names":["createVarsResolver","getSize","getThemeColor","getRadius","rem","factory","useProps","useStyles","useDirection","getPosition","getPrecision","findClosestNumber","getLastMarkValue","getFirstMarkValue","getPreviousMarkValue","getNextMarkValue","getFloatingValue","getChangeValue","getClientPosition","SliderProvider","SliderRoot","Track","Thumb","classes"],"sources":["../../../../src/components/Slider/RangeSlider/RangeSlider.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { clamp, useMergedRef, useMove, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n findClosestNumber,\n getRadius,\n getSize,\n getThemeColor,\n MantineColor,\n MantineRadius,\n MantineSize,\n rem,\n StylesApiProps,\n useDirection,\n useProps,\n useStyles,\n} from '../../../core';\nimport { TransitionOverride } from '../../Transition';\nimport { SliderCssVariables, SliderProvider, SliderStylesNames } from '../Slider.context';\nimport { SliderMark } from '../SliderMark';\nimport { SliderRoot } from '../SliderRoot/SliderRoot';\nimport { Thumb } from '../Thumb/Thumb';\nimport { Track } from '../Track/Track';\nimport { getChangeValue } from '../utils/get-change-value/get-change-value';\nimport { getClientPosition } from '../utils/get-client-position/get-client-position';\nimport { getFloatingValue } from '../utils/get-floating-value/get-floating-value';\nimport { getPosition } from '../utils/get-position/get-position';\nimport { getPrecision } from '../utils/get-precision/get-precision';\nimport {\n getFirstMarkValue,\n getLastMarkValue,\n getNextMarkValue,\n getPreviousMarkValue,\n} from '../utils/get-step-mark-value/get-step-mark-value';\nimport classes from '../Slider.module.css';\n\nexport type RangeSliderValue = [number, number];\n\nexport interface RangeSliderProps\n extends\n BoxProps,\n StylesApiProps<RangeSliderFactory>,\n ElementProps<'div', 'onChange' | 'value' | 'defaultValue'> {\n /** Key of `theme.colors` or any valid CSS color, controls color of track and thumb @default theme.primaryColor */\n color?: MantineColor;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem @default 'xl' */\n radius?: MantineRadius;\n\n /** Controls size of the track @default 'md' */\n size?: MantineSize | (string & {}) | number;\n\n /** Minimal possible value @default 0 */\n min?: number;\n\n /** Maximum possible value @default 100 */\n max?: number;\n\n /** Domain of the slider, defines the selectable value range independently of min/max. Useful when you want to display a wider track range (min/max) but restrict actual selection to a subset (domain). @default [min, max] */\n domain?: [number, number];\n\n /** Number by which value will be incremented/decremented with thumb drag and arrows @default 1 */\n step?: number;\n\n /** Number of significant digits after the decimal point */\n precision?: number;\n\n /** Controlled component value */\n value?: RangeSliderValue;\n\n /** Uncontrolled component default value */\n defaultValue?: RangeSliderValue;\n\n /** Called when value changes */\n onChange?: (value: RangeSliderValue) => void;\n\n /** Called when user stops dragging slider or changes value with arrows */\n onChangeEnd?: (value: RangeSliderValue) => void;\n\n /** Hidden input name, use with uncontrolled component */\n name?: string;\n\n /** Marks displayed on the track */\n marks?: SliderMark[];\n\n /** Function to generate label or any react node to render instead, set to null to disable label */\n label?: React.ReactNode | ((value: number) => React.ReactNode);\n\n /** Props passed down to the `Transition` component @default { transition: 'fade', duration: 0 } */\n labelTransitionProps?: TransitionOverride;\n\n /** Determines whether the label should be visible when the slider is not being dragged or hovered @default false */\n labelAlwaysOn?: boolean;\n\n /** Determines whether the label should be displayed when the slider is hovered @default true */\n showLabelOnHover?: boolean;\n\n /** Content rendered inside thumb */\n thumbChildren?: React.ReactNode;\n\n /** Disables slider */\n disabled?: boolean;\n\n /** Thumb `width` and `height`, by default value is computed based on `size` prop */\n thumbSize?: number | string;\n\n /** A transformation function to change the scale of the slider */\n scale?: (value: number) => number;\n\n /** Determines whether track values representation should be inverted @default false */\n inverted?: boolean;\n\n /** Slider orientation @default 'horizontal' */\n orientation?: 'horizontal' | 'vertical';\n\n /** Minimal range interval between the two thumbs. Consider this value relative to the total range (max - min). @default 10 */\n minRange?: number;\n\n /** Maximum range interval @default Infinity */\n maxRange?: number;\n\n /** `aria-label` for both thumbs (overridden by thumbFromLabel/thumbToLabel if provided) */\n thumbLabel?: string;\n\n /** `aria-valuetext` for both thumbs. When a function is provided, it receives the scaled value. */\n thumbValueText?: string | ((value: number) => string);\n\n /** First thumb `aria-label` */\n thumbFromLabel?: string;\n\n /** Second thumb `aria-label` */\n thumbToLabel?: string;\n\n /** Props passed down to the hidden input */\n hiddenInputProps?: React.ComponentProps<'input'>;\n\n /** Determines whether the selection should be only allowed from the given marks array @default false */\n restrictToMarks?: boolean;\n\n /** Props passed down to thumb element based on the thumb index */\n thumbProps?: (index: 0 | 1) => React.ComponentProps<'div'>;\n\n /** Determines whether the other thumb should be pushed by the current thumb dragging when `minRange`/`maxRange` is reached @default true */\n pushOnOverlap?: boolean;\n}\n\nexport type RangeSliderFactory = Factory<{\n props: RangeSliderProps;\n ref: HTMLDivElement;\n stylesNames: SliderStylesNames;\n vars: SliderCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<RangeSliderFactory>(\n (theme, { size, color, thumbSize, radius }) => ({\n root: {\n '--slider-size': getSize(size, 'slider-size'),\n '--slider-color': color ? getThemeColor(color, theme) : undefined,\n '--slider-radius': radius === undefined ? undefined : getRadius(radius),\n '--slider-thumb-size':\n thumbSize !== undefined ? rem(thumbSize) : 'calc(var(--slider-size) * 2)',\n },\n })\n);\n\nconst defaultProps = {\n min: 0,\n max: 100,\n minRange: 10,\n step: 1,\n marks: [],\n label: (f) => f,\n labelTransitionProps: { transition: 'fade', duration: 0 },\n labelAlwaysOn: false,\n showLabelOnHover: true,\n disabled: false,\n pushOnOverlap: true,\n scale: (v) => v,\n size: 'md',\n maxRange: Infinity,\n} satisfies Partial<RangeSliderProps>;\n\nexport const RangeSlider = factory<RangeSliderFactory>((_props) => {\n const props = useProps('RangeSlider', defaultProps, _props);\n const {\n classNames,\n styles,\n value,\n onChange,\n onChangeEnd,\n size,\n min,\n max,\n domain,\n minRange,\n maxRange,\n step,\n precision: _precision,\n defaultValue,\n name,\n marks,\n label,\n labelTransitionProps,\n labelAlwaysOn,\n thumbFromLabel,\n thumbToLabel,\n thumbValueText,\n showLabelOnHover,\n thumbChildren,\n disabled,\n unstyled,\n scale,\n inverted,\n orientation,\n className,\n style,\n vars,\n hiddenInputProps,\n restrictToMarks,\n thumbProps,\n pushOnOverlap,\n attributes,\n ref,\n ...others\n } = props;\n\n const getStyles = useStyles<RangeSliderFactory>({\n name: 'RangeSlider',\n props,\n classes,\n classNames,\n className,\n styles,\n style,\n attributes,\n vars,\n varsResolver,\n unstyled,\n });\n\n const containerRef = useRef<HTMLDivElement | null>(null);\n const { dir } = useDirection();\n const [focused, setFocused] = useState(-1);\n const [hovered, setHovered] = useState(false);\n const [_value, setValue] = useUncontrolled<RangeSliderValue>({\n value,\n defaultValue,\n finalValue: [min, max],\n onChange,\n });\n const valueRef = useRef(_value);\n const thumbs = useRef<HTMLDivElement[]>([]);\n const root = useRef<HTMLDivElement>(null);\n const thumbIndex = useRef<number | undefined>(undefined);\n const [domainMin, domainMax] = domain || [min!, max!];\n const positions = [\n getPosition({ value: _value[0], min: domainMin, max: domainMax }),\n getPosition({ value: _value[1], min: domainMin, max: domainMax }),\n ];\n\n const precision = _precision ?? getPrecision(step);\n\n const _setValue = (val: RangeSliderValue) => {\n setValue(val);\n valueRef.current = val;\n };\n\n useEffect(\n () => {\n if (Array.isArray(value)) {\n valueRef.current = value;\n }\n },\n Array.isArray(value) ? [value[0], value[1]] : [null, null]\n );\n\n const setRangedValue = (val: number, index: number, triggerChangeEnd: boolean) => {\n if (index === -1) {\n return;\n }\n\n const clone: RangeSliderValue = [...valueRef.current];\n\n if (restrictToMarks && marks) {\n const closest = findClosestNumber(\n val,\n marks.map((m) => m.value)\n );\n\n const current = clone[index];\n clone[index] = closest;\n const otherIndex = index === 0 ? 1 : 0;\n\n const lastMarkValue = getLastMarkValue(marks);\n const firstMarkValue = getFirstMarkValue(marks);\n\n if (closest === lastMarkValue && clone[otherIndex] === lastMarkValue) {\n clone[index] = current;\n } else if (closest === firstMarkValue && clone[otherIndex] === firstMarkValue) {\n clone[index] = current;\n } else if (closest === clone[otherIndex]) {\n if (current > clone[otherIndex]) {\n clone[otherIndex] = getPreviousMarkValue(closest, marks);\n } else {\n clone[otherIndex] = getNextMarkValue(closest, marks);\n }\n }\n } else {\n const clampedVal = clamp(val, min!, max!);\n clone[index] = clampedVal;\n\n if (index === 0) {\n if (clampedVal > clone[1] - (minRange - 0.000000001)) {\n if (pushOnOverlap) {\n clone[1] = Math.min(val + minRange, max);\n } else {\n clone[index] = valueRef.current[index];\n }\n }\n\n if (clampedVal > (max - (minRange - 0.000000001) || min)) {\n clone[index] = valueRef.current[index];\n }\n\n if (clone[1] - val > maxRange) {\n if (pushOnOverlap) {\n clone[1] = val + maxRange;\n } else {\n clone[index] = valueRef.current[index];\n }\n }\n }\n\n if (index === 1) {\n if (clampedVal < clone[0] + minRange) {\n if (pushOnOverlap) {\n clone[0] = Math.max(val - minRange, min);\n } else {\n clone[index] = valueRef.current[index];\n }\n }\n\n if (clampedVal < clone[0] + minRange) {\n clone[index] = valueRef.current[index];\n }\n\n if (clampedVal - clone[0] > maxRange) {\n if (pushOnOverlap) {\n clone[0] = val - maxRange;\n } else {\n clone[index] = valueRef.current[index];\n }\n }\n }\n }\n\n clone[0] = getFloatingValue(clone[0], precision);\n clone[1] = getFloatingValue(clone[1], precision);\n\n if (clone[0] > clone[1]) {\n const temp = clone[0];\n clone[0] = clone[1];\n clone[1] = temp;\n }\n\n _setValue(clone);\n\n if (triggerChangeEnd) {\n onChangeEnd?.(valueRef.current);\n }\n };\n\n const handleChange = (val: number) => {\n if (!disabled && thumbIndex.current !== undefined) {\n const nextValue = getChangeValue({\n value: val,\n min: domainMin,\n max: domainMax,\n step,\n precision,\n });\n setRangedValue(nextValue, thumbIndex.current, false);\n }\n };\n\n const { ref: useMoveRef, active } = useMove(\n ({ x, y }) => handleChange(orientation === 'vertical' ? 1 - y : x),\n { onScrubEnd: () => !disabled && onChangeEnd?.(valueRef.current) },\n dir\n );\n\n function handleThumbMouseDown(index: number) {\n thumbIndex.current = index;\n }\n\n const handleTrackMouseDownCapture = (\n event: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>\n ) => {\n if (containerRef.current) {\n containerRef.current.focus();\n const rect = containerRef.current.getBoundingClientRect();\n const changePosition = getClientPosition(event.nativeEvent, orientation);\n\n const changeValue =\n orientation === 'vertical'\n ? getChangeValue({\n value: rect.bottom - changePosition,\n max,\n min,\n step,\n containerWidth: rect.height,\n })\n : getChangeValue({\n value: changePosition - rect.left,\n max,\n min,\n step,\n containerWidth: rect.width,\n });\n\n const nearestHandle =\n Math.abs(_value[0] - changeValue) > Math.abs(_value[1] - changeValue) ? 1 : 0;\n const _nearestHandle =\n orientation === 'vertical'\n ? nearestHandle\n : dir === 'ltr'\n ? nearestHandle\n : nearestHandle === 1\n ? 0\n : 1;\n\n thumbIndex.current = _nearestHandle;\n }\n };\n\n const getFocusedThumbIndex = () => {\n if (focused !== 1 && focused !== 0) {\n setFocused(0);\n return 0;\n }\n\n return focused;\n };\n\n const handleTrackKeydownCapture = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (!disabled) {\n switch (event.key) {\n case 'ArrowUp': {\n event.preventDefault();\n const focusedIndex = getFocusedThumbIndex();\n thumbs.current[focusedIndex].focus();\n const nextValue =\n restrictToMarks && marks\n ? getNextMarkValue(valueRef.current[focusedIndex], marks)\n : Math.min(Math.max(valueRef.current[focusedIndex] + step, domainMin), domainMax);\n setRangedValue(getFloatingValue(nextValue, precision), focusedIndex, true);\n break;\n }\n\n case 'ArrowRight': {\n event.preventDefault();\n const focusedIndex = getFocusedThumbIndex();\n thumbs.current[focusedIndex].focus();\n\n const nextValue =\n restrictToMarks && marks\n ? (dir === 'rtl' ? getPreviousMarkValue : getNextMarkValue)(\n valueRef.current[focusedIndex],\n marks\n )\n : Math.min(\n Math.max(\n dir === 'rtl'\n ? valueRef.current[focusedIndex] - step\n : valueRef.current[focusedIndex] + step,\n domainMin\n ),\n domainMax\n );\n\n setRangedValue(getFloatingValue(nextValue, precision), focusedIndex, true);\n break;\n }\n\n case 'ArrowDown': {\n event.preventDefault();\n const focusedIndex = getFocusedThumbIndex();\n thumbs.current[focusedIndex].focus();\n const nextValue =\n restrictToMarks && marks\n ? getPreviousMarkValue(valueRef.current[focusedIndex], marks)\n : Math.min(Math.max(valueRef.current[focusedIndex] - step, domainMin), domainMax);\n setRangedValue(getFloatingValue(nextValue, precision), focusedIndex, true);\n break;\n }\n\n case 'ArrowLeft': {\n event.preventDefault();\n const focusedIndex = getFocusedThumbIndex();\n thumbs.current[focusedIndex].focus();\n\n const nextValue =\n restrictToMarks && marks\n ? (dir === 'rtl' ? getNextMarkValue : getPreviousMarkValue)(\n valueRef.current[focusedIndex],\n marks\n )\n : Math.min(\n Math.max(\n dir === 'rtl'\n ? valueRef.current[focusedIndex] + step\n : valueRef.current[focusedIndex] - step,\n domainMin\n ),\n domainMax\n );\n\n setRangedValue(getFloatingValue(nextValue, precision), focusedIndex, true);\n break;\n }\n\n default: {\n break;\n }\n }\n }\n };\n\n const sharedThumbProps = {\n max,\n min,\n size,\n labelTransitionProps,\n labelAlwaysOn,\n orientation,\n onBlur: () => setFocused(-1),\n };\n\n const hasArrayThumbChildren = Array.isArray(thumbChildren);\n\n return (\n <SliderProvider value={{ getStyles }}>\n <SliderRoot\n {...others}\n size={size}\n ref={useMergedRef(ref, root)}\n disabled={disabled}\n orientation={orientation}\n onMouseDownCapture={() => root.current?.focus()}\n onKeyDownCapture={() => {\n if (thumbs.current[0]?.parentElement?.contains(document.activeElement)) {\n return;\n }\n thumbs.current[0]?.focus();\n }}\n >\n <Track\n offset={positions[0]}\n marksOffset={_value[0]}\n filled={positions[1] - positions[0]}\n marks={marks}\n inverted={inverted}\n min={domainMin}\n max={domainMax}\n value={_value[1]}\n disabled={disabled}\n containerProps={{\n ref: useMergedRef(containerRef, useMoveRef) as any,\n onMouseEnter: showLabelOnHover ? () => setHovered(true) : undefined,\n onMouseLeave: showLabelOnHover ? () => setHovered(false) : undefined,\n onTouchStartCapture: handleTrackMouseDownCapture,\n onTouchEndCapture: () => {\n thumbIndex.current = -1;\n },\n onMouseDownCapture: handleTrackMouseDownCapture,\n onMouseUpCapture: () => {\n thumbIndex.current = -1;\n },\n onKeyDownCapture: handleTrackKeydownCapture,\n }}\n >\n <Thumb\n {...sharedThumbProps}\n value={scale(_value[0])}\n position={positions[0]}\n dragging={active}\n label={\n typeof label === 'function'\n ? label(getFloatingValue(scale(_value[0]), precision))\n : label\n }\n ref={(node) => {\n if (node) {\n thumbs.current[0] = node;\n }\n }}\n thumbLabel={thumbFromLabel}\n thumbValueText={thumbValueText}\n onMouseDown={() => handleThumbMouseDown(0)}\n onFocus={() => setFocused(0)}\n showLabelOnHover={showLabelOnHover}\n isHovered={hovered}\n disabled={disabled}\n {...thumbProps?.(0)}\n >\n {hasArrayThumbChildren ? thumbChildren[0] : thumbChildren}\n </Thumb>\n\n <Thumb\n {...sharedThumbProps}\n thumbLabel={thumbToLabel}\n value={scale(_value[1])}\n position={positions[1]}\n dragging={active}\n label={\n typeof label === 'function'\n ? label(getFloatingValue(scale(_value[1]), precision))\n : label\n }\n ref={(node) => {\n if (node) {\n thumbs.current[1] = node;\n }\n }}\n thumbValueText={thumbValueText}\n onMouseDown={() => handleThumbMouseDown(1)}\n onFocus={() => setFocused(1)}\n showLabelOnHover={showLabelOnHover}\n isHovered={hovered}\n disabled={disabled}\n {...thumbProps?.(1)}\n >\n {hasArrayThumbChildren ? thumbChildren[1] : thumbChildren}\n </Thumb>\n </Track>\n\n <input type=\"hidden\" name={`${name}_from`} value={_value[0]} {...hiddenInputProps} />\n <input type=\"hidden\" name={`${name}_to`} value={_value[1]} {...hiddenInputProps} />\n </SliderRoot>\n </SliderProvider>\n );\n});\n\nRangeSlider.classes = classes;\nRangeSlider.varsResolver = varsResolver;\nRangeSlider.displayName = '@mantine/core/RangeSlider';\n\nexport namespace RangeSlider {\n export type Props = RangeSliderProps;\n export type Value = RangeSliderValue;\n export type Factory = RangeSliderFactory;\n export type StylesNames = SliderStylesNames;\n export type CssVariables = SliderCssVariables;\n export type Mark = SliderMark;\n}\n"],"mappings":"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"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
require("../../../_virtual/_rolldown/runtime.cjs");
|
|
3
2
|
const require_rem = require("../../../core/utils/units-converters/rem.cjs");
|
|
4
3
|
const require_get_size = require("../../../core/utils/get-size/get-size.cjs");
|
|
5
4
|
const require_find_closest_number = require("../../../core/utils/find-closest-number/find-closest-number.cjs");
|