@mantine/core 9.3.2 → 9.4.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 +1 -0
- package/cjs/components/Accordion/Accordion.cjs.map +1 -1
- package/cjs/components/Accordion/Accordion.context.cjs.map +1 -1
- package/cjs/components/Accordion/AccordionChevron.cjs.map +1 -1
- package/cjs/components/Accordion/AccordionControl/AccordionControl.cjs.map +1 -1
- package/cjs/components/Accordion/AccordionItem/AccordionItem.cjs.map +1 -1
- package/cjs/components/Accordion/AccordionItem.context.cjs.map +1 -1
- package/cjs/components/Accordion/AccordionPanel/AccordionPanel.cjs.map +1 -1
- package/cjs/components/ActionIcon/ActionIcon.cjs +1 -0
- package/cjs/components/ActionIcon/ActionIcon.cjs.map +1 -1
- package/cjs/components/ActionIcon/ActionIconGroup/ActionIconGroup.cjs +1 -1
- package/cjs/components/ActionIcon/ActionIconGroup/ActionIconGroup.cjs.map +1 -1
- package/cjs/components/ActionIcon/ActionIconGroupSection/ActionIconGroupSection.cjs.map +1 -1
- package/cjs/components/Affix/Affix.cjs.map +1 -1
- package/cjs/components/Alert/Alert.cjs.map +1 -1
- package/cjs/components/Anchor/Anchor.cjs.map +1 -1
- package/cjs/components/AngleSlider/AngleSlider.cjs.map +1 -1
- package/cjs/components/AppShell/AppShell.cjs.map +1 -1
- package/cjs/components/AppShell/AppShell.context.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellAside/AppShellAside.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellFooter/AppShellFooter.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellHeader/AppShellHeader.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellMain/AppShellMain.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellMediaStyles/AppShellMediaStyles.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellMediaStyles/assign-aside-variables/assign-aside-variables.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellMediaStyles/assign-footer-variables/assign-footer-variables.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellMediaStyles/assign-header-variables/assign-header-variables.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellMediaStyles/assign-navbar-variables/assign-navbar-variables.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellMediaStyles/assign-padding-variables/assign-padding-variables.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellMediaStyles/get-variables/get-variables.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellMediaStyles/is-primitive-size/is-primitive-size.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellMediaStyles/is-responsive-size/is-responsive-size.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellNavbar/AppShellNavbar.cjs.map +1 -1
- package/cjs/components/AppShell/AppShellSection/AppShellSection.cjs.map +1 -1
- package/cjs/components/AppShell/use-resizing/use-resizing.cjs.map +1 -1
- package/cjs/components/AspectRatio/AspectRatio.cjs.map +1 -1
- package/cjs/components/Autocomplete/Autocomplete.cjs.map +1 -1
- package/cjs/components/Avatar/Avatar.cjs.map +1 -1
- package/cjs/components/Avatar/AvatarGroup/AvatarGroup.cjs.map +1 -1
- package/cjs/components/Avatar/AvatarPlaceholderIcon.cjs.map +1 -1
- package/cjs/components/Avatar/get-initials/get-initials.cjs.map +1 -1
- package/cjs/components/BackgroundImage/BackgroundImage.cjs.map +1 -1
- package/cjs/components/Badge/Badge.cjs.map +1 -1
- package/cjs/components/Blockquote/Blockquote.cjs.map +1 -1
- package/cjs/components/Breadcrumbs/Breadcrumbs.cjs.map +1 -1
- package/cjs/components/Burger/Burger.cjs.map +1 -1
- package/cjs/components/Button/Button.cjs.map +1 -1
- package/cjs/components/Button/ButtonGroup/ButtonGroup.cjs.map +1 -1
- package/cjs/components/Button/ButtonGroupSection/ButtonGroupSection.cjs.map +1 -1
- package/cjs/components/Card/Card.cjs.map +1 -1
- package/cjs/components/Card/Card.context.cjs.map +1 -1
- package/cjs/components/Card/CardSection/CardSection.cjs.map +1 -1
- package/cjs/components/Center/Center.cjs.map +1 -1
- package/cjs/components/Checkbox/CheckIcon.cjs.map +1 -1
- package/cjs/components/Checkbox/Checkbox.cjs.map +1 -1
- package/cjs/components/Checkbox/CheckboxCard/CheckboxCard.cjs.map +1 -1
- package/cjs/components/Checkbox/CheckboxGroup/CheckboxGroup.cjs.map +1 -1
- package/cjs/components/Checkbox/CheckboxIndicator/CheckboxIndicator.cjs.map +1 -1
- package/cjs/components/Chip/Chip.cjs.map +1 -1
- package/cjs/components/Chip/ChipGroup/ChipGroup.cjs.map +1 -1
- package/cjs/components/CloseButton/CloseButton.cjs.map +1 -1
- package/cjs/components/CloseButton/CloseIcon.cjs.map +1 -1
- package/cjs/components/Code/Code.cjs.map +1 -1
- package/cjs/components/Collapse/Collapse.cjs +4 -0
- package/cjs/components/Collapse/Collapse.cjs.map +1 -1
- package/cjs/components/ColorInput/ColorInput.cjs.map +1 -1
- package/cjs/components/ColorInput/EyeDropperIcon.cjs.map +1 -1
- package/cjs/components/ColorPicker/AlphaSlider/AlphaSlider.cjs.map +1 -1
- package/cjs/components/ColorPicker/ColorPicker.cjs.map +1 -1
- package/cjs/components/ColorPicker/ColorPicker.context.cjs.map +1 -1
- package/cjs/components/ColorPicker/ColorSlider/ColorSlider.cjs.map +1 -1
- package/cjs/components/ColorPicker/HueSlider/HueSlider.cjs.map +1 -1
- package/cjs/components/ColorPicker/Saturation/Saturation.cjs.map +1 -1
- package/cjs/components/ColorPicker/Swatches/Swatches.cjs.map +1 -1
- package/cjs/components/ColorPicker/Thumb/Thumb.cjs.map +1 -1
- package/cjs/components/ColorPicker/converters/converters.cjs.map +1 -1
- package/cjs/components/ColorPicker/converters/parsers.cjs.map +1 -1
- package/cjs/components/ColorSwatch/ColorSwatch.cjs.map +1 -1
- package/cjs/components/Combobox/Combobox.cjs.map +1 -1
- package/cjs/components/Combobox/Combobox.context.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxChevron/ComboboxChevron.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxClearButton/ComboboxClearButton.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxDropdown/ComboboxDropdown.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxDropdownTarget/ComboboxDropdownTarget.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxEmpty/ComboboxEmpty.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxEventsTarget/ComboboxEventsTarget.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxFooter/ComboboxFooter.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxGroup/ComboboxGroup.cjs +3 -2
- package/cjs/components/Combobox/ComboboxGroup/ComboboxGroup.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxHeader/ComboboxHeader.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxHiddenInput/ComboboxHiddenInput.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxOption/ComboboxOption.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxOptions/ComboboxOptions.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxSearch/ComboboxSearch.cjs.map +1 -1
- package/cjs/components/Combobox/ComboboxTarget/ComboboxTarget.cjs.map +1 -1
- package/cjs/components/Combobox/OptionsDropdown/OptionsDropdown.cjs +2 -2
- package/cjs/components/Combobox/OptionsDropdown/OptionsDropdown.cjs.map +1 -1
- package/cjs/components/Combobox/OptionsDropdown/default-options-filter.cjs.map +1 -1
- package/cjs/components/Combobox/use-combobox/get-index/get-index.cjs.map +1 -1
- package/cjs/components/Combobox/use-combobox/use-combobox.cjs.map +1 -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.map +1 -1
- package/cjs/components/Combobox/use-pills-reorder/use-pills-reorder.cjs.map +1 -1
- package/cjs/components/ComboboxPopover/ComboboxPopover.cjs +218 -0
- package/cjs/components/ComboboxPopover/ComboboxPopover.cjs.map +1 -0
- package/cjs/components/ComboboxPopover/ComboboxPopoverTarget.cjs +45 -0
- package/cjs/components/ComboboxPopover/ComboboxPopoverTarget.cjs.map +1 -0
- package/cjs/components/Container/Container.cjs.map +1 -1
- package/cjs/components/CopyButton/CopyButton.cjs.map +1 -1
- package/cjs/components/DataList/DataList.cjs +61 -0
- package/cjs/components/DataList/DataList.cjs.map +1 -0
- package/cjs/components/DataList/DataList.context.cjs +8 -0
- package/cjs/components/DataList/DataList.context.cjs.map +1 -0
- package/cjs/components/DataList/DataList.module.cjs +12 -0
- package/cjs/components/DataList/DataList.module.cjs.map +1 -0
- package/cjs/components/DataList/DataListItem/DataListItem.cjs +32 -0
- package/cjs/components/DataList/DataListItem/DataListItem.cjs.map +1 -0
- package/cjs/components/DataList/DataListItemLabel/DataListItemLabel.cjs +33 -0
- package/cjs/components/DataList/DataListItemLabel/DataListItemLabel.cjs.map +1 -0
- package/cjs/components/DataList/DataListItemValue/DataListItemValue.cjs +33 -0
- package/cjs/components/DataList/DataListItemValue/DataListItemValue.cjs.map +1 -0
- package/cjs/components/Dialog/Dialog.cjs.map +1 -1
- package/cjs/components/Divider/Divider.cjs.map +1 -1
- package/cjs/components/Drawer/Drawer.cjs.map +1 -1
- package/cjs/components/Drawer/Drawer.context.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerBody.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerCloseButton.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerContent.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerHeader.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerOverlay.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerRoot.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerStack.cjs.map +1 -1
- package/cjs/components/Drawer/DrawerTitle.cjs.map +1 -1
- package/cjs/components/EmptyState/EmptyState.cjs +102 -0
- package/cjs/components/EmptyState/EmptyState.cjs.map +1 -0
- package/cjs/components/EmptyState/EmptyState.context.cjs +8 -0
- package/cjs/components/EmptyState/EmptyState.context.cjs.map +1 -0
- package/cjs/components/EmptyState/EmptyState.module.cjs +14 -0
- package/cjs/components/EmptyState/EmptyState.module.cjs.map +1 -0
- package/cjs/components/EmptyState/EmptyStateActions/EmptyStateActions.cjs +28 -0
- package/cjs/components/EmptyState/EmptyStateActions/EmptyStateActions.cjs.map +1 -0
- package/cjs/components/EmptyState/EmptyStateDescription/EmptyStateDescription.cjs +29 -0
- package/cjs/components/EmptyState/EmptyStateDescription/EmptyStateDescription.cjs.map +1 -0
- package/cjs/components/EmptyState/EmptyStateIndicator/EmptyStateIndicator.cjs +29 -0
- package/cjs/components/EmptyState/EmptyStateIndicator/EmptyStateIndicator.cjs.map +1 -0
- package/cjs/components/EmptyState/EmptyStateTitle/EmptyStateTitle.cjs +30 -0
- package/cjs/components/EmptyState/EmptyStateTitle/EmptyStateTitle.cjs.map +1 -0
- package/cjs/components/Fieldset/Fieldset.cjs.map +1 -1
- package/cjs/components/FileButton/FileButton.cjs.map +1 -1
- package/cjs/components/FileInput/FileInput.cjs.map +1 -1
- package/cjs/components/Flex/Flex.cjs.map +1 -1
- package/cjs/components/FloatingIndicator/FloatingIndicator.cjs.map +1 -1
- package/cjs/components/FloatingIndicator/use-floating-indicator.cjs.map +1 -1
- package/cjs/components/FloatingWindow/FloatingWindow.cjs.map +1 -1
- package/cjs/components/FocusTrap/FocusTrap.cjs.map +1 -1
- package/cjs/components/Grid/Grid.cjs.map +1 -1
- package/cjs/components/Grid/Grid.context.cjs.map +1 -1
- package/cjs/components/Grid/GridCol/GridCol.cjs.map +1 -1
- package/cjs/components/Grid/GridCol/GridColVariables.cjs.map +1 -1
- package/cjs/components/Grid/GridVariables.cjs.map +1 -1
- package/cjs/components/Group/Group.cjs.map +1 -1
- package/cjs/components/Group/filter-falsy-children/filter-falsy-children.cjs.map +1 -1
- package/cjs/components/Highlight/Highlight.cjs.map +1 -1
- package/cjs/components/Highlight/highlighter/highlighter.cjs.map +1 -1
- package/cjs/components/HoverCard/HoverCard.cjs.map +1 -1
- package/cjs/components/HoverCard/HoverCard.context.cjs.map +1 -1
- package/cjs/components/HoverCard/HoverCardDropdown/HoverCardDropdown.cjs.map +1 -1
- package/cjs/components/HoverCard/HoverCardGroup/HoverCardGroup.cjs.map +1 -1
- package/cjs/components/HoverCard/HoverCardTarget/HoverCardTarget.cjs.map +1 -1
- package/cjs/components/HoverCard/use-hover-card.cjs.map +1 -1
- package/cjs/components/Image/Image.cjs.map +1 -1
- package/cjs/components/Indicator/Indicator.cjs.map +1 -1
- package/cjs/components/Input/Input.cjs +7 -2
- package/cjs/components/Input/Input.cjs.map +1 -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.map +1 -1
- package/cjs/components/Input/InputClearSection/InputClearSection.cjs.map +1 -1
- package/cjs/components/Input/InputDescription/InputDescription.cjs.map +1 -1
- package/cjs/components/Input/InputError/InputError.cjs.map +1 -1
- package/cjs/components/Input/InputLabel/InputLabel.cjs.map +1 -1
- package/cjs/components/Input/InputPlaceholder/InputPlaceholder.cjs.map +1 -1
- package/cjs/components/Input/InputSuccess/InputSuccess.cjs +48 -0
- package/cjs/components/Input/InputSuccess/InputSuccess.cjs.map +1 -0
- package/cjs/components/Input/InputWrapper/InputWrapper.cjs +22 -5
- package/cjs/components/Input/InputWrapper/InputWrapper.cjs.map +1 -1
- package/cjs/components/Input/InputWrapper.context.cjs.map +1 -1
- package/cjs/components/Input/use-input-props.cjs +4 -1
- package/cjs/components/Input/use-input-props.cjs.map +1 -1
- package/cjs/components/InputBase/InputBase.cjs.map +1 -1
- package/cjs/components/JsonInput/JsonInput.cjs.map +1 -1
- package/cjs/components/JsonInput/validate-json/validate-json.cjs.map +1 -1
- package/cjs/components/Kbd/Kbd.cjs.map +1 -1
- package/cjs/components/List/List.cjs.map +1 -1
- package/cjs/components/List/List.context.cjs.map +1 -1
- package/cjs/components/List/ListItem/ListItem.cjs.map +1 -1
- package/cjs/components/Loader/Loader.cjs.map +1 -1
- package/cjs/components/Loader/loaders/Bars.cjs.map +1 -1
- package/cjs/components/Loader/loaders/Dots.cjs.map +1 -1
- package/cjs/components/Loader/loaders/Oval.cjs.map +1 -1
- package/cjs/components/LoadingOverlay/LoadingOverlay.cjs.map +1 -1
- package/cjs/components/Mark/Mark.cjs.map +1 -1
- package/cjs/components/Marquee/Marquee.cjs.map +1 -1
- package/cjs/components/MaskInput/MaskInput.cjs.map +1 -1
- package/cjs/components/MaskInput/use-mask-input-props.cjs.map +1 -1
- package/cjs/components/Menu/Menu.cjs.map +1 -1
- package/cjs/components/Menu/Menu.context.cjs.map +1 -1
- package/cjs/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.cjs.map +1 -1
- package/cjs/components/Menu/MenuCheckboxGroup/MenuCheckboxGroup.context.cjs.map +1 -1
- package/cjs/components/Menu/MenuCheckboxItem/MenuCheckboxItem.cjs.map +1 -1
- package/cjs/components/Menu/MenuContextMenu/MenuContextMenu.cjs.map +1 -1
- package/cjs/components/Menu/MenuDivider/MenuDivider.cjs.map +1 -1
- package/cjs/components/Menu/MenuDropdown/MenuDropdown.cjs +1 -0
- package/cjs/components/Menu/MenuDropdown/MenuDropdown.cjs.map +1 -1
- package/cjs/components/Menu/MenuItem/MenuItem.cjs.map +1 -1
- package/cjs/components/Menu/MenuLabel/MenuLabel.cjs.map +1 -1
- package/cjs/components/Menu/MenuRadioGroup/MenuRadioGroup.cjs.map +1 -1
- package/cjs/components/Menu/MenuRadioGroup/MenuRadioGroup.context.cjs.map +1 -1
- package/cjs/components/Menu/MenuRadioItem/MenuRadioItem.cjs.map +1 -1
- package/cjs/components/Menu/MenuSearch/MenuSearch.cjs.map +1 -1
- package/cjs/components/Menu/MenuSelectableItem/MenuSelectableItem.cjs.map +1 -1
- package/cjs/components/Menu/MenuSub/MenuSub.cjs.map +1 -1
- package/cjs/components/Menu/MenuSub/MenuSub.context.cjs.map +1 -1
- package/cjs/components/Menu/MenuSubDropdown/MenuSubDropdown.cjs.map +1 -1
- package/cjs/components/Menu/MenuSubItem/MenuSubItem.cjs.map +1 -1
- package/cjs/components/Menu/MenuSubTarget/MenuSubTarget.cjs.map +1 -1
- package/cjs/components/Menu/MenuTarget/MenuTarget.cjs.map +1 -1
- package/cjs/components/Menu/use-menu-type-ahead.cjs.map +1 -1
- package/cjs/components/Menubar/Menubar.cjs +146 -0
- package/cjs/components/Menubar/Menubar.cjs.map +1 -0
- package/cjs/components/Menubar/Menubar.context.cjs +12 -0
- package/cjs/components/Menubar/Menubar.context.cjs.map +1 -0
- package/cjs/components/Menubar/Menubar.module.cjs +10 -0
- package/cjs/components/Menubar/Menubar.module.cjs.map +1 -0
- package/cjs/components/Menubar/MenubarDropdown/MenubarDropdown.cjs +61 -0
- package/cjs/components/Menubar/MenubarDropdown/MenubarDropdown.cjs.map +1 -0
- package/cjs/components/Menubar/MenubarMenu/MenubarMenu.cjs +59 -0
- package/cjs/components/Menubar/MenubarMenu/MenubarMenu.cjs.map +1 -0
- package/cjs/components/Menubar/MenubarTarget/MenubarTarget.cjs +143 -0
- package/cjs/components/Menubar/MenubarTarget/MenubarTarget.cjs.map +1 -0
- package/cjs/components/Modal/Modal.cjs.map +1 -1
- package/cjs/components/Modal/Modal.context.cjs.map +1 -1
- package/cjs/components/Modal/ModalBody.cjs.map +1 -1
- package/cjs/components/Modal/ModalCloseButton.cjs.map +1 -1
- package/cjs/components/Modal/ModalContent.cjs.map +1 -1
- package/cjs/components/Modal/ModalHeader.cjs.map +1 -1
- package/cjs/components/Modal/ModalOverlay.cjs.map +1 -1
- package/cjs/components/Modal/ModalRoot.cjs.map +1 -1
- package/cjs/components/Modal/ModalStack.cjs.map +1 -1
- package/cjs/components/Modal/ModalTitle.cjs.map +1 -1
- package/cjs/components/Modal/use-modals-stack.cjs.map +1 -1
- package/cjs/components/ModalBase/ModalBase.cjs.map +1 -1
- package/cjs/components/ModalBase/ModalBase.context.cjs.map +1 -1
- package/cjs/components/ModalBase/ModalBaseBody.cjs.map +1 -1
- package/cjs/components/ModalBase/ModalBaseCloseButton.cjs.map +1 -1
- package/cjs/components/ModalBase/ModalBaseContent.cjs.map +1 -1
- package/cjs/components/ModalBase/ModalBaseHeader.cjs.map +1 -1
- package/cjs/components/ModalBase/ModalBaseOverlay.cjs.map +1 -1
- package/cjs/components/ModalBase/ModalBaseTitle.cjs.map +1 -1
- package/cjs/components/ModalBase/NativeScrollArea.cjs.map +1 -1
- package/cjs/components/ModalBase/use-lock-scroll.cjs.map +1 -1
- package/cjs/components/ModalBase/use-modal-body-id.cjs.map +1 -1
- package/cjs/components/ModalBase/use-modal-title-id.cjs.map +1 -1
- package/cjs/components/ModalBase/use-modal.cjs.map +1 -1
- package/cjs/components/MultiSelect/MultiSelect.cjs +4 -1
- package/cjs/components/MultiSelect/MultiSelect.cjs.map +1 -1
- package/cjs/components/MultiSelect/filter-picked-values.cjs.map +1 -1
- package/cjs/components/NativeSelect/NativeSelect.cjs.map +1 -1
- package/cjs/components/NativeSelect/NativeSelectOption.cjs.map +1 -1
- package/cjs/components/NavLink/NavLink.cjs.map +1 -1
- package/cjs/components/Notification/Notification.cjs.map +1 -1
- package/cjs/components/NumberFormatter/NumberFormatter.cjs.map +1 -1
- package/cjs/components/NumberInput/NumberInput.cjs.map +1 -1
- package/cjs/components/NumberInput/NumberInputChevron.cjs.map +1 -1
- package/cjs/components/OverflowList/OverflowList.cjs.map +1 -1
- package/cjs/components/OverflowList/get-row-position-data.cjs.map +1 -1
- package/cjs/components/OverflowList/use-dimensions.cjs.map +1 -1
- package/cjs/components/Overlay/Overlay.cjs.map +1 -1
- package/cjs/components/Pagination/Pagination.cjs.map +1 -1
- package/cjs/components/Pagination/Pagination.context.cjs.map +1 -1
- package/cjs/components/Pagination/Pagination.icons.cjs.map +1 -1
- package/cjs/components/Pagination/PaginationControl/PaginationControl.cjs.map +1 -1
- package/cjs/components/Pagination/PaginationDots/PaginationDots.cjs.map +1 -1
- package/cjs/components/Pagination/PaginationEdges/PaginationEdges.cjs.map +1 -1
- package/cjs/components/Pagination/PaginationItems/PaginationItems.cjs.map +1 -1
- package/cjs/components/Pagination/PaginationLabel/PaginationLabel.cjs.map +1 -1
- package/cjs/components/Pagination/PaginationRoot/PaginationRoot.cjs.map +1 -1
- package/cjs/components/Paper/Paper.cjs.map +1 -1
- package/cjs/components/PasswordInput/PasswordInput.cjs +11 -2
- package/cjs/components/PasswordInput/PasswordInput.cjs.map +1 -1
- package/cjs/components/PasswordInput/PasswordToggleIcon.cjs.map +1 -1
- package/cjs/components/Pill/Pill.cjs.map +1 -1
- package/cjs/components/Pill/PillGroup/PillGroup.cjs.map +1 -1
- package/cjs/components/PillsInput/PillsInput.cjs.map +1 -1
- package/cjs/components/PillsInput/PillsInput.context.cjs.map +1 -1
- package/cjs/components/PillsInput/PillsInputField/PillsInputField.cjs.map +1 -1
- package/cjs/components/PinInput/PinInput.cjs +2 -1
- package/cjs/components/PinInput/PinInput.cjs.map +1 -1
- package/cjs/components/PinInput/create-pin-array/create-pin-array.cjs.map +1 -1
- package/cjs/components/Popover/Popover.cjs.map +1 -1
- package/cjs/components/Popover/Popover.context.cjs.map +1 -1
- package/cjs/components/Popover/PopoverContextMenu/PopoverContextMenu.cjs.map +1 -1
- package/cjs/components/Popover/PopoverDropdown/PopoverDropdown.cjs.map +1 -1
- package/cjs/components/Popover/PopoverTarget/PopoverTarget.cjs.map +1 -1
- package/cjs/components/Popover/use-popover.cjs.map +1 -1
- package/cjs/components/Portal/OptionalPortal.cjs.map +1 -1
- package/cjs/components/Portal/Portal.cjs.map +1 -1
- package/cjs/components/Progress/Progress.cjs.map +1 -1
- package/cjs/components/Progress/Progress.context.cjs.map +1 -1
- package/cjs/components/Progress/ProgressLabel/ProgressLabel.cjs.map +1 -1
- package/cjs/components/Progress/ProgressRoot/ProgressRoot.cjs.map +1 -1
- package/cjs/components/Progress/ProgressSection/ProgressSection.cjs.map +1 -1
- package/cjs/components/Radio/Radio.cjs.map +1 -1
- package/cjs/components/Radio/RadioCard/RadioCard.cjs.map +1 -1
- package/cjs/components/Radio/RadioGroup/RadioGroup.cjs.map +1 -1
- package/cjs/components/Radio/RadioIcon.cjs.map +1 -1
- package/cjs/components/Radio/RadioIndicator/RadioIndicator.cjs.map +1 -1
- package/cjs/components/Rating/Rating.cjs.map +1 -1
- package/cjs/components/Rating/Rating.context.cjs.map +1 -1
- package/cjs/components/Rating/RatingItem/RatingItem.cjs.map +1 -1
- package/cjs/components/Rating/StarSymbol/StarIcon.cjs.map +1 -1
- package/cjs/components/Rating/StarSymbol/StarSymbol.cjs.map +1 -1
- package/cjs/components/RingProgress/Curve/Curve.cjs.map +1 -1
- package/cjs/components/RingProgress/RingProgress.cjs.map +1 -1
- package/cjs/components/RingProgress/get-curves/get-curves.cjs.map +1 -1
- package/cjs/components/RollingNumber/DigitColumn.cjs.map +1 -1
- package/cjs/components/RollingNumber/RollingNumber.cjs.map +1 -1
- package/cjs/components/RollingNumber/get-digit-parts.cjs +2 -1
- package/cjs/components/RollingNumber/get-digit-parts.cjs.map +1 -1
- package/cjs/components/RollingNumber/get-render-slots.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollArea.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollArea.context.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaCorner/ScrollAreaCorner.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaRoot/ScrollAreaRoot.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbar.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarAuto.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarHover.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarScroll.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollAreaScrollbarVisible.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/Scrollbar.context.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollbarX.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaScrollbar/ScrollbarY.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaThumb/ScrollAreaThumb.cjs.map +1 -1
- package/cjs/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.cjs +1 -0
- package/cjs/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.cjs.map +1 -1
- package/cjs/components/ScrollArea/use-resize-observer.cjs.map +1 -1
- package/cjs/components/ScrollArea/utils/add-unlinked-scroll-listener.cjs.map +1 -1
- package/cjs/components/ScrollArea/utils/get-scroll-position-from-pointer.cjs.map +1 -1
- package/cjs/components/ScrollArea/utils/get-thumb-offset-from-scroll.cjs.map +1 -1
- package/cjs/components/Scroller/Scroller.cjs.map +1 -1
- package/cjs/components/SegmentedControl/SegmentedControl.cjs.map +1 -1
- package/cjs/components/Select/Select.cjs.map +1 -1
- package/cjs/components/SemiCircleProgress/SemiCircleProgress.cjs +4 -1
- package/cjs/components/SemiCircleProgress/SemiCircleProgress.cjs.map +1 -1
- package/cjs/components/SemiCircleProgress/SemiCircleProgress.module.cjs.map +1 -1
- package/cjs/components/SimpleGrid/SimpleGrid.cjs.map +1 -1
- package/cjs/components/SimpleGrid/SimpleGridVariables.cjs.map +1 -1
- package/cjs/components/Skeleton/Skeleton.cjs.map +1 -1
- package/cjs/components/Slider/Marks/Marks.cjs.map +1 -1
- package/cjs/components/Slider/RangeSlider/RangeSlider.cjs.map +1 -1
- package/cjs/components/Slider/Slider/Slider.cjs.map +1 -1
- package/cjs/components/Slider/Slider.context.cjs.map +1 -1
- package/cjs/components/Slider/Slider.module.cjs.map +1 -1
- package/cjs/components/Slider/SliderRoot/SliderRoot.cjs.map +1 -1
- package/cjs/components/Slider/Thumb/Thumb.cjs.map +1 -1
- package/cjs/components/Slider/Track/Track.cjs.map +1 -1
- package/cjs/components/Slider/utils/get-precision/get-precision.cjs.map +1 -1
- package/cjs/components/Slider/utils/get-step-mark-value/get-step-mark-value.cjs.map +1 -1
- package/cjs/components/Space/Space.cjs.map +1 -1
- package/cjs/components/Splitter/GripIcon.cjs.map +1 -1
- package/cjs/components/Splitter/Splitter.cjs +22 -1
- package/cjs/components/Splitter/Splitter.cjs.map +1 -1
- package/cjs/components/Splitter/Splitter.context.cjs.map +1 -1
- package/cjs/components/Splitter/SplitterPane/SplitterPane.cjs +1 -2
- package/cjs/components/Splitter/SplitterPane/SplitterPane.cjs.map +1 -1
- package/cjs/components/Spoiler/Spoiler.cjs.map +1 -1
- package/cjs/components/Stack/Stack.cjs.map +1 -1
- package/cjs/components/Stepper/Stepper.cjs.map +1 -1
- package/cjs/components/Stepper/Stepper.context.cjs.map +1 -1
- package/cjs/components/Stepper/StepperStep/StepperStep.cjs.map +1 -1
- package/cjs/components/Switch/Switch.cjs.map +1 -1
- package/cjs/components/Switch/SwitchGroup/SwitchGroup.cjs.map +1 -1
- package/cjs/components/Table/Table.cjs.map +1 -1
- package/cjs/components/Table/Table.components.cjs.map +1 -1
- package/cjs/components/Table/Table.context.cjs.map +1 -1
- package/cjs/components/Table/TableDataRenderer.cjs.map +1 -1
- package/cjs/components/Table/TableScrollContainer.cjs.map +1 -1
- package/cjs/components/TableOfContents/TableOfContents.cjs.map +1 -1
- package/cjs/components/Tabs/Tabs.cjs +16 -1
- package/cjs/components/Tabs/Tabs.cjs.map +1 -1
- package/cjs/components/Tabs/Tabs.context.cjs.map +1 -1
- package/cjs/components/Tabs/TabsList/TabsList.cjs.map +1 -1
- package/cjs/components/Tabs/TabsPanel/TabsPanel.cjs +6 -0
- package/cjs/components/Tabs/TabsPanel/TabsPanel.cjs.map +1 -1
- package/cjs/components/Tabs/TabsTab/TabsTab.cjs +1 -1
- package/cjs/components/Tabs/TabsTab/TabsTab.cjs.map +1 -1
- package/cjs/components/TagsInput/TagsInput.cjs +4 -1
- package/cjs/components/TagsInput/TagsInput.cjs.map +1 -1
- package/cjs/components/TagsInput/filter-picked-tags.cjs.map +1 -1
- package/cjs/components/TagsInput/get-splitted-tags.cjs.map +1 -1
- package/cjs/components/Text/Text.cjs.map +1 -1
- package/cjs/components/TextInput/TextInput.cjs.map +1 -1
- package/cjs/components/Textarea/Autosize.cjs +1 -0
- package/cjs/components/Textarea/Autosize.cjs.map +1 -1
- package/cjs/components/Textarea/Textarea.cjs.map +1 -1
- package/cjs/components/ThemeIcon/ThemeIcon.cjs.map +1 -1
- package/cjs/components/Timeline/Timeline.cjs.map +1 -1
- package/cjs/components/Timeline/Timeline.context.cjs.map +1 -1
- package/cjs/components/Timeline/TimelineItem/TimelineItem.cjs.map +1 -1
- package/cjs/components/Title/Title.cjs.map +1 -1
- package/cjs/components/Tooltip/Tooltip.cjs.map +1 -1
- package/cjs/components/Tooltip/TooltipFloating/TooltipFloating.cjs.map +1 -1
- package/cjs/components/Tooltip/TooltipFloating/use-floating-tooltip.cjs.map +1 -1
- package/cjs/components/Tooltip/TooltipGroup/TooltipGroup.cjs.map +1 -1
- package/cjs/components/Tooltip/use-tooltip.cjs.map +1 -1
- package/cjs/components/Transition/Transition.cjs.map +1 -1
- package/cjs/components/Transition/get-transition-styles/get-transition-styles.cjs.map +1 -1
- package/cjs/components/Transition/use-transition.cjs.map +1 -1
- package/cjs/components/Tree/FlatTreeNode.cjs.map +1 -1
- package/cjs/components/Tree/Tree.cjs.map +1 -1
- package/cjs/components/Tree/TreeNode.cjs.map +1 -1
- package/cjs/components/Tree/filter-tree-data/filter-tree-data.cjs.map +1 -1
- package/cjs/components/Tree/is-node-checked/is-node-checked.cjs.map +1 -1
- package/cjs/components/Tree/is-node-indeterminate/is-node-indeterminate.cjs.map +1 -1
- package/cjs/components/Tree/use-tree-node-drag-drop.cjs.map +1 -1
- package/cjs/components/Tree/use-tree.cjs.map +1 -1
- package/cjs/components/TreeSelect/TreeSelect.cjs +7 -1
- package/cjs/components/TreeSelect/TreeSelect.cjs.map +1 -1
- package/cjs/components/TreeSelect/TreeSelectOption.cjs.map +1 -1
- package/cjs/components/TreeSelect/get-checked-values-by-strategy.cjs.map +1 -1
- package/cjs/components/Typography/Typography.cjs.map +1 -1
- package/cjs/components/UnstyledButton/UnstyledButton.cjs.map +1 -1
- package/cjs/components/VisuallyHidden/VisuallyHidden.cjs.map +1 -1
- package/cjs/core/Box/Box.cjs.map +1 -1
- package/cjs/core/Box/get-box-mod/get-box-mod.cjs.map +1 -1
- package/cjs/core/Box/get-box-style/get-box-style.cjs.map +1 -1
- package/cjs/core/Box/get-style-object/get-style-object.cjs.map +1 -1
- package/cjs/core/Box/style-props/parse-style-props/parse-style-props.cjs.map +1 -1
- package/cjs/core/Box/style-props/parse-style-props/sort-media-queries.cjs.map +1 -1
- package/cjs/core/Box/style-props/resolvers/border-resolver/border-resolver.cjs.map +1 -1
- package/cjs/core/Box/use-random-classname/use-random-classname.cjs.map +1 -1
- package/cjs/core/DirectionProvider/DirectionProvider.cjs.map +1 -1
- package/cjs/core/InlineStyles/InlineStyles.cjs.map +1 -1
- package/cjs/core/InlineStyles/css-object-to-string/css-object-to-string.cjs.map +1 -1
- package/cjs/core/InlineStyles/hash-styles.cjs.map +1 -1
- package/cjs/core/MantineProvider/ColorSchemeScript/ColorSchemeScript.cjs.map +1 -1
- package/cjs/core/MantineProvider/Mantine.context.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineClasses/MantineClasses.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineCssVariables/MantineCssVariables.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineCssVariables/default-css-variables-resolver.cjs +5 -1
- package/cjs/core/MantineProvider/MantineCssVariables/default-css-variables-resolver.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineCssVariables/get-css-color-variables.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineCssVariables/remove-default-variables.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineCssVariables/v8-css-variables-resolver.cjs +3 -1
- package/cjs/core/MantineProvider/MantineCssVariables/v8-css-variables-resolver.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineCssVariables/virtual-color/virtual-color.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineProvider.cjs.map +1 -1
- package/cjs/core/MantineProvider/MantineThemeProvider/MantineThemeProvider.cjs.map +1 -1
- package/cjs/core/MantineProvider/color-functions/colors-tuple/colors-tuple.cjs.map +1 -1
- package/cjs/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.cjs +3 -1
- package/cjs/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.cjs.map +1 -1
- package/cjs/core/MantineProvider/color-functions/get-contrast-color/get-contrast-color.cjs +19 -3
- package/cjs/core/MantineProvider/color-functions/get-contrast-color/get-contrast-color.cjs.map +1 -1
- package/cjs/core/MantineProvider/color-functions/parse-theme-color/parse-theme-color.cjs.map +1 -1
- package/cjs/core/MantineProvider/color-functions/to-rgba/to-rgba.cjs.map +1 -1
- package/cjs/core/MantineProvider/convert-css-variables/convert-css-variables.cjs.map +1 -1
- package/cjs/core/MantineProvider/convert-css-variables/css-variables-object-to-string.cjs.map +1 -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.map +1 -1
- package/cjs/core/MantineProvider/use-mantine-color-scheme/use-provider-color-scheme.cjs.map +1 -1
- package/cjs/core/MantineProvider/use-props/use-props.cjs.map +1 -1
- package/cjs/core/MantineProvider/use-respect-reduce-motion/use-respect-reduce-motion.cjs.map +1 -1
- package/cjs/core/factory/factory.cjs.map +1 -1
- package/cjs/core/factory/polymorphic-factory.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-class-name/get-class-name.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-class-name/get-global-class-names/get-global-class-names.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-class-name/get-options-class-names/get-options-class-names.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-class-name/get-resolved-class-names/get-resolved-class-names.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-class-name/resolve-class-names/resolve-class-names.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-style/get-style.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/get-style/resolve-vars/merge-vars.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/use-styles.cjs.map +1 -1
- package/cjs/core/styles-api/use-styles/use-transformed-styles.cjs.map +1 -1
- package/cjs/core/utils/create-safe-context/create-safe-context.cjs.map +1 -1
- package/cjs/core/utils/create-scoped-keydown-handler/create-scoped-keydown-handler.cjs +3 -5
- package/cjs/core/utils/create-scoped-keydown-handler/create-scoped-keydown-handler.cjs.map +1 -1
- package/cjs/core/utils/create-use-external-events/create-use-external-events.cjs.map +1 -1
- package/cjs/core/utils/deep-merge/deep-merge.cjs.map +1 -1
- package/cjs/core/utils/filter-props/filter-props.cjs.map +1 -1
- package/cjs/core/utils/get-context-item-index/get-context-item-index.cjs.map +1 -1
- package/cjs/core/utils/get-safe-id/get-safe-id.cjs.map +1 -1
- package/cjs/core/utils/is-number-like/is-number-like.cjs.map +1 -1
- package/cjs/core/utils/units-converters/px.cjs.map +1 -1
- package/cjs/core/utils/units-converters/rem.cjs.map +1 -1
- package/cjs/core/utils/use-hovered/use-hovered.cjs.map +1 -1
- package/cjs/index.cjs +42 -2
- package/cjs/utils/Floating/FloatingArrow/FloatingArrow.cjs +1 -0
- package/cjs/utils/Floating/FloatingArrow/FloatingArrow.cjs.map +1 -1
- package/cjs/utils/Floating/use-context-menu-handlers.cjs.map +1 -1
- package/cjs/utils/Floating/use-delayed-hover.cjs.map +1 -1
- package/cjs/utils/InlineInput/InlineInput.cjs.map +1 -1
- package/cjs/utils/InputsGroupFieldset/InputsGroupFieldset.cjs.map +1 -1
- package/esm/components/Accordion/Accordion.mjs +1 -0
- package/esm/components/Accordion/Accordion.mjs.map +1 -1
- package/esm/components/ActionIcon/ActionIcon.mjs +1 -0
- package/esm/components/ActionIcon/ActionIcon.mjs.map +1 -1
- package/esm/components/ActionIcon/ActionIconGroup/ActionIconGroup.mjs +1 -1
- package/esm/components/ActionIcon/ActionIconGroup/ActionIconGroup.mjs.map +1 -1
- package/esm/components/ActionIcon/ActionIconGroupSection/ActionIconGroupSection.mjs.map +1 -1
- package/esm/components/AppShell/AppShellFooter/AppShellFooter.mjs.map +1 -1
- package/esm/components/AppShell/AppShellHeader/AppShellHeader.mjs.map +1 -1
- package/esm/components/AppShell/AppShellMain/AppShellMain.mjs.map +1 -1
- package/esm/components/AppShell/AppShellMediaStyles/assign-aside-variables/assign-aside-variables.mjs.map +1 -1
- package/esm/components/AppShell/AppShellMediaStyles/assign-footer-variables/assign-footer-variables.mjs.map +1 -1
- package/esm/components/AppShell/AppShellMediaStyles/assign-header-variables/assign-header-variables.mjs.map +1 -1
- package/esm/components/AppShell/AppShellMediaStyles/assign-navbar-variables/assign-navbar-variables.mjs.map +1 -1
- package/esm/components/AppShell/AppShellMediaStyles/assign-padding-variables/assign-padding-variables.mjs.map +1 -1
- package/esm/components/AppShell/AppShellMediaStyles/get-variables/get-variables.mjs.map +1 -1
- package/esm/components/AppShell/AppShellMediaStyles/is-primitive-size/is-primitive-size.mjs.map +1 -1
- package/esm/components/AppShell/AppShellMediaStyles/is-responsive-size/is-responsive-size.mjs.map +1 -1
- package/esm/components/AspectRatio/AspectRatio.mjs.map +1 -1
- package/esm/components/Autocomplete/Autocomplete.mjs.map +1 -1
- package/esm/components/Avatar/AvatarGroup/AvatarGroup.mjs.map +1 -1
- package/esm/components/Avatar/get-initials/get-initials.mjs.map +1 -1
- package/esm/components/BackgroundImage/BackgroundImage.mjs.map +1 -1
- package/esm/components/Blockquote/Blockquote.mjs.map +1 -1
- package/esm/components/Breadcrumbs/Breadcrumbs.mjs.map +1 -1
- package/esm/components/Button/ButtonGroup/ButtonGroup.mjs.map +1 -1
- package/esm/components/Button/ButtonGroupSection/ButtonGroupSection.mjs.map +1 -1
- package/esm/components/Checkbox/Checkbox.mjs.map +1 -1
- package/esm/components/Collapse/Collapse.mjs +4 -0
- package/esm/components/Collapse/Collapse.mjs.map +1 -1
- package/esm/components/ColorInput/ColorInput.mjs.map +1 -1
- package/esm/components/ColorPicker/ColorSlider/ColorSlider.mjs.map +1 -1
- package/esm/components/ColorPicker/converters/converters.mjs.map +1 -1
- package/esm/components/ColorPicker/converters/parsers.mjs.map +1 -1
- package/esm/components/Combobox/ComboboxEmpty/ComboboxEmpty.mjs.map +1 -1
- package/esm/components/Combobox/ComboboxFooter/ComboboxFooter.mjs.map +1 -1
- package/esm/components/Combobox/ComboboxGroup/ComboboxGroup.mjs +3 -2
- package/esm/components/Combobox/ComboboxGroup/ComboboxGroup.mjs.map +1 -1
- package/esm/components/Combobox/ComboboxHeader/ComboboxHeader.mjs.map +1 -1
- package/esm/components/Combobox/OptionsDropdown/OptionsDropdown.mjs +2 -2
- package/esm/components/Combobox/OptionsDropdown/OptionsDropdown.mjs.map +1 -1
- package/esm/components/Combobox/OptionsDropdown/default-options-filter.mjs.map +1 -1
- package/esm/components/Combobox/use-combobox/get-index/get-index.mjs.map +1 -1
- package/esm/components/Combobox/use-combobox/use-combobox.mjs.map +1 -1
- package/esm/components/Combobox/use-pills-reorder/use-pills-reorder.mjs.map +1 -1
- package/esm/components/ComboboxPopover/ComboboxPopover.mjs +216 -0
- package/esm/components/ComboboxPopover/ComboboxPopover.mjs.map +1 -0
- package/esm/components/ComboboxPopover/ComboboxPopoverTarget.mjs +45 -0
- package/esm/components/ComboboxPopover/ComboboxPopoverTarget.mjs.map +1 -0
- package/esm/components/DataList/DataList.context.mjs +8 -0
- package/esm/components/DataList/DataList.context.mjs.map +1 -0
- package/esm/components/DataList/DataList.mjs +61 -0
- package/esm/components/DataList/DataList.mjs.map +1 -0
- package/esm/components/DataList/DataList.module.mjs +12 -0
- package/esm/components/DataList/DataList.module.mjs.map +1 -0
- package/esm/components/DataList/DataListItem/DataListItem.mjs +32 -0
- package/esm/components/DataList/DataListItem/DataListItem.mjs.map +1 -0
- package/esm/components/DataList/DataListItemLabel/DataListItemLabel.mjs +33 -0
- package/esm/components/DataList/DataListItemLabel/DataListItemLabel.mjs.map +1 -0
- package/esm/components/DataList/DataListItemValue/DataListItemValue.mjs +33 -0
- package/esm/components/DataList/DataListItemValue/DataListItemValue.mjs.map +1 -0
- package/esm/components/Drawer/DrawerBody.mjs.map +1 -1
- package/esm/components/Drawer/DrawerCloseButton.mjs.map +1 -1
- package/esm/components/Drawer/DrawerHeader.mjs.map +1 -1
- package/esm/components/Drawer/DrawerOverlay.mjs.map +1 -1
- package/esm/components/Drawer/DrawerRoot.mjs.map +1 -1
- package/esm/components/Drawer/DrawerTitle.mjs.map +1 -1
- package/esm/components/EmptyState/EmptyState.context.mjs +8 -0
- package/esm/components/EmptyState/EmptyState.context.mjs.map +1 -0
- package/esm/components/EmptyState/EmptyState.mjs +102 -0
- package/esm/components/EmptyState/EmptyState.mjs.map +1 -0
- package/esm/components/EmptyState/EmptyState.module.mjs +14 -0
- package/esm/components/EmptyState/EmptyState.module.mjs.map +1 -0
- package/esm/components/EmptyState/EmptyStateActions/EmptyStateActions.mjs +28 -0
- package/esm/components/EmptyState/EmptyStateActions/EmptyStateActions.mjs.map +1 -0
- package/esm/components/EmptyState/EmptyStateDescription/EmptyStateDescription.mjs +29 -0
- package/esm/components/EmptyState/EmptyStateDescription/EmptyStateDescription.mjs.map +1 -0
- package/esm/components/EmptyState/EmptyStateIndicator/EmptyStateIndicator.mjs +29 -0
- package/esm/components/EmptyState/EmptyStateIndicator/EmptyStateIndicator.mjs.map +1 -0
- package/esm/components/EmptyState/EmptyStateTitle/EmptyStateTitle.mjs +30 -0
- package/esm/components/EmptyState/EmptyStateTitle/EmptyStateTitle.mjs.map +1 -0
- package/esm/components/FileInput/FileInput.mjs.map +1 -1
- package/esm/components/Grid/GridCol/GridColVariables.mjs.map +1 -1
- package/esm/components/Grid/GridVariables.mjs.map +1 -1
- package/esm/components/Group/Group.mjs.map +1 -1
- package/esm/components/Group/filter-falsy-children/filter-falsy-children.mjs.map +1 -1
- package/esm/components/Highlight/highlighter/highlighter.mjs.map +1 -1
- package/esm/components/HoverCard/HoverCardDropdown/HoverCardDropdown.mjs.map +1 -1
- package/esm/components/HoverCard/use-hover-card.mjs.map +1 -1
- package/esm/components/Input/Input.mjs +7 -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/Input/InputDescription/InputDescription.mjs.map +1 -1
- package/esm/components/Input/InputError/InputError.mjs.map +1 -1
- package/esm/components/Input/InputPlaceholder/InputPlaceholder.mjs.map +1 -1
- package/esm/components/Input/InputSuccess/InputSuccess.mjs +48 -0
- package/esm/components/Input/InputSuccess/InputSuccess.mjs.map +1 -0
- package/esm/components/Input/InputWrapper/InputWrapper.mjs +22 -5
- package/esm/components/Input/InputWrapper/InputWrapper.mjs.map +1 -1
- package/esm/components/Input/use-input-props.mjs +4 -1
- package/esm/components/Input/use-input-props.mjs.map +1 -1
- package/esm/components/JsonInput/validate-json/validate-json.mjs.map +1 -1
- package/esm/components/Kbd/Kbd.mjs.map +1 -1
- package/esm/components/Mark/Mark.mjs.map +1 -1
- package/esm/components/Marquee/Marquee.mjs.map +1 -1
- package/esm/components/Menu/MenuDivider/MenuDivider.mjs.map +1 -1
- package/esm/components/Menu/MenuDropdown/MenuDropdown.mjs +1 -0
- package/esm/components/Menu/MenuDropdown/MenuDropdown.mjs.map +1 -1
- package/esm/components/Menu/MenuItem/MenuItem.mjs.map +1 -1
- package/esm/components/Menu/MenuLabel/MenuLabel.mjs.map +1 -1
- package/esm/components/Menu/MenuSearch/MenuSearch.mjs.map +1 -1
- package/esm/components/Menu/MenuSelectableItem/MenuSelectableItem.mjs.map +1 -1
- package/esm/components/Menu/MenuSub/MenuSub.mjs.map +1 -1
- package/esm/components/Menu/MenuSubItem/MenuSubItem.mjs.map +1 -1
- package/esm/components/Menu/use-menu-type-ahead.mjs.map +1 -1
- package/esm/components/Menubar/Menubar.context.mjs +9 -0
- package/esm/components/Menubar/Menubar.context.mjs.map +1 -0
- package/esm/components/Menubar/Menubar.mjs +146 -0
- package/esm/components/Menubar/Menubar.mjs.map +1 -0
- package/esm/components/Menubar/Menubar.module.mjs +10 -0
- package/esm/components/Menubar/Menubar.module.mjs.map +1 -0
- package/esm/components/Menubar/MenubarDropdown/MenubarDropdown.mjs +61 -0
- package/esm/components/Menubar/MenubarDropdown/MenubarDropdown.mjs.map +1 -0
- package/esm/components/Menubar/MenubarMenu/MenubarMenu.mjs +59 -0
- package/esm/components/Menubar/MenubarMenu/MenubarMenu.mjs.map +1 -0
- package/esm/components/Menubar/MenubarTarget/MenubarTarget.mjs +143 -0
- package/esm/components/Menubar/MenubarTarget/MenubarTarget.mjs.map +1 -0
- package/esm/components/Modal/ModalBody.mjs.map +1 -1
- package/esm/components/Modal/ModalCloseButton.mjs.map +1 -1
- package/esm/components/Modal/ModalHeader.mjs.map +1 -1
- package/esm/components/Modal/ModalOverlay.mjs.map +1 -1
- package/esm/components/Modal/ModalTitle.mjs.map +1 -1
- package/esm/components/ModalBase/ModalBase.mjs.map +1 -1
- package/esm/components/MultiSelect/MultiSelect.mjs +4 -1
- package/esm/components/MultiSelect/MultiSelect.mjs.map +1 -1
- package/esm/components/MultiSelect/filter-picked-values.mjs.map +1 -1
- package/esm/components/NativeSelect/NativeSelect.mjs.map +1 -1
- package/esm/components/NativeSelect/NativeSelectOption.mjs.map +1 -1
- package/esm/components/NumberInput/NumberInput.mjs.map +1 -1
- package/esm/components/OverflowList/OverflowList.mjs.map +1 -1
- package/esm/components/OverflowList/get-row-position-data.mjs.map +1 -1
- package/esm/components/OverflowList/use-dimensions.mjs.map +1 -1
- package/esm/components/Overlay/Overlay.mjs.map +1 -1
- package/esm/components/Pagination/Pagination.mjs.map +1 -1
- package/esm/components/Pagination/PaginationDots/PaginationDots.mjs.map +1 -1
- package/esm/components/Pagination/PaginationItems/PaginationItems.mjs.map +1 -1
- package/esm/components/PasswordInput/PasswordInput.mjs +11 -2
- package/esm/components/PasswordInput/PasswordInput.mjs.map +1 -1
- package/esm/components/Pill/PillGroup/PillGroup.mjs.map +1 -1
- package/esm/components/PillsInput/PillsInput.mjs.map +1 -1
- package/esm/components/PinInput/PinInput.mjs +2 -1
- package/esm/components/PinInput/PinInput.mjs.map +1 -1
- package/esm/components/PinInput/create-pin-array/create-pin-array.mjs.map +1 -1
- package/esm/components/Popover/use-popover.mjs.map +1 -1
- package/esm/components/Portal/Portal.mjs.map +1 -1
- package/esm/components/Progress/ProgressLabel/ProgressLabel.mjs.map +1 -1
- package/esm/components/Radio/Radio.mjs.map +1 -1
- package/esm/components/Radio/RadioCard/RadioCard.mjs.map +1 -1
- package/esm/components/Rating/Rating.mjs.map +1 -1
- package/esm/components/Rating/RatingItem/RatingItem.mjs.map +1 -1
- package/esm/components/Rating/StarSymbol/StarSymbol.mjs.map +1 -1
- package/esm/components/RingProgress/RingProgress.mjs.map +1 -1
- package/esm/components/RingProgress/get-curves/get-curves.mjs.map +1 -1
- package/esm/components/RollingNumber/get-digit-parts.mjs +2 -1
- package/esm/components/RollingNumber/get-digit-parts.mjs.map +1 -1
- package/esm/components/RollingNumber/get-render-slots.mjs.map +1 -1
- package/esm/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.mjs +1 -0
- package/esm/components/ScrollArea/ScrollAreaViewport/ScrollAreaViewport.mjs.map +1 -1
- package/esm/components/ScrollArea/utils/add-unlinked-scroll-listener.mjs.map +1 -1
- package/esm/components/ScrollArea/utils/get-scroll-position-from-pointer.mjs.map +1 -1
- package/esm/components/ScrollArea/utils/get-thumb-offset-from-scroll.mjs.map +1 -1
- package/esm/components/SegmentedControl/SegmentedControl.mjs.map +1 -1
- package/esm/components/Select/Select.mjs.map +1 -1
- package/esm/components/SemiCircleProgress/SemiCircleProgress.mjs +4 -1
- package/esm/components/SemiCircleProgress/SemiCircleProgress.mjs.map +1 -1
- package/esm/components/SemiCircleProgress/SemiCircleProgress.module.mjs.map +1 -1
- package/esm/components/SimpleGrid/SimpleGridVariables.mjs.map +1 -1
- package/esm/components/Skeleton/Skeleton.mjs.map +1 -1
- package/esm/components/Slider/RangeSlider/RangeSlider.mjs.map +1 -1
- package/esm/components/Slider/Slider.module.mjs.map +1 -1
- package/esm/components/Slider/utils/get-precision/get-precision.mjs.map +1 -1
- package/esm/components/Slider/utils/get-step-mark-value/get-step-mark-value.mjs.map +1 -1
- package/esm/components/Splitter/Splitter.context.mjs.map +1 -1
- package/esm/components/Splitter/Splitter.mjs +22 -1
- package/esm/components/Splitter/Splitter.mjs.map +1 -1
- package/esm/components/Splitter/SplitterPane/SplitterPane.mjs +1 -2
- package/esm/components/Splitter/SplitterPane/SplitterPane.mjs.map +1 -1
- package/esm/components/Stack/Stack.mjs.map +1 -1
- package/esm/components/Stepper/Stepper.mjs.map +1 -1
- package/esm/components/Switch/Switch.mjs.map +1 -1
- package/esm/components/Table/Table.components.mjs.map +1 -1
- package/esm/components/TableOfContents/TableOfContents.mjs.map +1 -1
- package/esm/components/Tabs/Tabs.context.mjs.map +1 -1
- package/esm/components/Tabs/Tabs.mjs +18 -3
- package/esm/components/Tabs/Tabs.mjs.map +1 -1
- package/esm/components/Tabs/TabsPanel/TabsPanel.mjs +7 -1
- package/esm/components/Tabs/TabsPanel/TabsPanel.mjs.map +1 -1
- package/esm/components/Tabs/TabsTab/TabsTab.mjs +1 -1
- package/esm/components/Tabs/TabsTab/TabsTab.mjs.map +1 -1
- package/esm/components/TagsInput/TagsInput.mjs +4 -1
- package/esm/components/TagsInput/TagsInput.mjs.map +1 -1
- package/esm/components/TagsInput/filter-picked-tags.mjs.map +1 -1
- package/esm/components/TagsInput/get-splitted-tags.mjs.map +1 -1
- package/esm/components/Text/Text.mjs.map +1 -1
- package/esm/components/Textarea/Autosize.mjs +1 -0
- package/esm/components/Textarea/Autosize.mjs.map +1 -1
- package/esm/components/ThemeIcon/ThemeIcon.mjs.map +1 -1
- package/esm/components/Title/Title.mjs.map +1 -1
- package/esm/components/Tooltip/Tooltip.mjs.map +1 -1
- package/esm/components/Tooltip/use-tooltip.mjs.map +1 -1
- package/esm/components/Transition/get-transition-styles/get-transition-styles.mjs.map +1 -1
- package/esm/components/Tree/FlatTreeNode.mjs.map +1 -1
- package/esm/components/Tree/TreeNode.mjs.map +1 -1
- package/esm/components/Tree/filter-tree-data/filter-tree-data.mjs.map +1 -1
- package/esm/components/Tree/is-node-checked/is-node-checked.mjs.map +1 -1
- package/esm/components/Tree/is-node-indeterminate/is-node-indeterminate.mjs.map +1 -1
- package/esm/components/Tree/use-tree.mjs.map +1 -1
- package/esm/components/TreeSelect/TreeSelect.mjs +7 -1
- package/esm/components/TreeSelect/TreeSelect.mjs.map +1 -1
- package/esm/components/TreeSelect/get-checked-values-by-strategy.mjs.map +1 -1
- package/esm/components/Typography/Typography.mjs.map +1 -1
- package/esm/components/UnstyledButton/UnstyledButton.mjs.map +1 -1
- package/esm/components/VisuallyHidden/VisuallyHidden.mjs.map +1 -1
- package/esm/core/Box/Box.mjs.map +1 -1
- package/esm/core/Box/get-box-mod/get-box-mod.mjs.map +1 -1
- package/esm/core/Box/get-box-style/get-box-style.mjs.map +1 -1
- package/esm/core/Box/get-style-object/get-style-object.mjs.map +1 -1
- package/esm/core/Box/style-props/parse-style-props/parse-style-props.mjs.map +1 -1
- package/esm/core/Box/style-props/parse-style-props/sort-media-queries.mjs.map +1 -1
- package/esm/core/Box/style-props/resolvers/border-resolver/border-resolver.mjs.map +1 -1
- package/esm/core/Box/use-random-classname/use-random-classname.mjs.map +1 -1
- package/esm/core/InlineStyles/InlineStyles.mjs.map +1 -1
- package/esm/core/InlineStyles/css-object-to-string/css-object-to-string.mjs.map +1 -1
- package/esm/core/InlineStyles/hash-styles.mjs.map +1 -1
- package/esm/core/MantineProvider/ColorSchemeScript/ColorSchemeScript.mjs.map +1 -1
- package/esm/core/MantineProvider/Mantine.context.mjs.map +1 -1
- package/esm/core/MantineProvider/MantineClasses/MantineClasses.mjs.map +1 -1
- package/esm/core/MantineProvider/MantineCssVariables/default-css-variables-resolver.mjs +6 -2
- package/esm/core/MantineProvider/MantineCssVariables/default-css-variables-resolver.mjs.map +1 -1
- package/esm/core/MantineProvider/MantineCssVariables/get-css-color-variables.mjs.map +1 -1
- package/esm/core/MantineProvider/MantineCssVariables/remove-default-variables.mjs.map +1 -1
- package/esm/core/MantineProvider/MantineCssVariables/v8-css-variables-resolver.mjs +3 -1
- package/esm/core/MantineProvider/MantineCssVariables/v8-css-variables-resolver.mjs.map +1 -1
- package/esm/core/MantineProvider/MantineCssVariables/virtual-color/virtual-color.mjs.map +1 -1
- package/esm/core/MantineProvider/color-functions/colors-tuple/colors-tuple.mjs.map +1 -1
- package/esm/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.mjs +3 -1
- package/esm/core/MantineProvider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.mjs.map +1 -1
- package/esm/core/MantineProvider/color-functions/get-contrast-color/get-contrast-color.mjs +19 -4
- package/esm/core/MantineProvider/color-functions/get-contrast-color/get-contrast-color.mjs.map +1 -1
- package/esm/core/MantineProvider/color-functions/parse-theme-color/parse-theme-color.mjs.map +1 -1
- package/esm/core/MantineProvider/color-functions/to-rgba/to-rgba.mjs.map +1 -1
- package/esm/core/MantineProvider/convert-css-variables/convert-css-variables.mjs.map +1 -1
- package/esm/core/MantineProvider/convert-css-variables/css-variables-object-to-string.mjs.map +1 -1
- package/esm/core/MantineProvider/use-mantine-color-scheme/use-mantine-color-scheme.mjs.map +1 -1
- package/esm/core/MantineProvider/use-mantine-color-scheme/use-provider-color-scheme.mjs.map +1 -1
- package/esm/core/MantineProvider/use-props/use-props.mjs.map +1 -1
- package/esm/core/MantineProvider/use-respect-reduce-motion/use-respect-reduce-motion.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/get-class-name/get-options-class-names/get-options-class-names.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/get-class-name/get-resolved-class-names/get-resolved-class-names.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/get-class-name/resolve-class-names/resolve-class-names.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/get-style/get-style.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/get-style/resolve-vars/merge-vars.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/use-styles.mjs.map +1 -1
- package/esm/core/styles-api/use-styles/use-transformed-styles.mjs.map +1 -1
- package/esm/core/utils/create-scoped-keydown-handler/create-scoped-keydown-handler.mjs +3 -5
- package/esm/core/utils/create-scoped-keydown-handler/create-scoped-keydown-handler.mjs.map +1 -1
- package/esm/core/utils/create-use-external-events/create-use-external-events.mjs.map +1 -1
- package/esm/core/utils/deep-merge/deep-merge.mjs.map +1 -1
- package/esm/core/utils/filter-props/filter-props.mjs.map +1 -1
- package/esm/core/utils/get-context-item-index/get-context-item-index.mjs.map +1 -1
- package/esm/core/utils/get-safe-id/get-safe-id.mjs.map +1 -1
- package/esm/core/utils/is-number-like/is-number-like.mjs.map +1 -1
- package/esm/core/utils/units-converters/px.mjs.map +1 -1
- package/esm/core/utils/units-converters/rem.mjs.map +1 -1
- package/esm/index.mjs +23 -4
- package/esm/utils/Floating/FloatingArrow/FloatingArrow.mjs +1 -0
- package/esm/utils/Floating/FloatingArrow/FloatingArrow.mjs.map +1 -1
- package/lib/components/Accordion/Accordion.d.ts +4 -4
- package/lib/components/ActionIcon/ActionIcon.d.ts +3 -3
- package/lib/components/Combobox/Combobox.types.d.ts +4 -3
- package/lib/components/Combobox/OptionsDropdown/OptionsDropdown.d.ts +1 -1
- package/lib/components/Combobox/index.d.ts +1 -1
- package/lib/components/ComboboxPopover/ComboboxPopover.d.ts +110 -0
- package/lib/components/ComboboxPopover/ComboboxPopover.types.d.ts +2 -0
- package/lib/components/ComboboxPopover/ComboboxPopoverTarget.d.ts +16 -0
- package/lib/components/ComboboxPopover/index.d.ts +14 -0
- package/lib/components/DataList/DataList.context.d.ts +6 -0
- package/lib/components/DataList/DataList.d.ts +44 -0
- package/lib/components/DataList/DataListItem/DataListItem.d.ts +18 -0
- package/lib/components/DataList/DataListItemLabel/DataListItemLabel.d.ts +18 -0
- package/lib/components/DataList/DataListItemValue/DataListItemValue.d.ts +18 -0
- package/lib/components/DataList/index.d.ts +32 -0
- package/lib/components/EmptyState/EmptyState.context.d.ts +8 -0
- package/lib/components/EmptyState/EmptyState.d.ts +83 -0
- package/lib/components/EmptyState/EmptyStateActions/EmptyStateActions.d.ts +18 -0
- package/lib/components/EmptyState/EmptyStateDescription/EmptyStateDescription.d.ts +18 -0
- package/lib/components/EmptyState/EmptyStateIndicator/EmptyStateIndicator.d.ts +18 -0
- package/lib/components/EmptyState/EmptyStateTitle/EmptyStateTitle.d.ts +20 -0
- package/lib/components/EmptyState/index.d.ts +13 -0
- package/lib/components/Input/Input.d.ts +11 -0
- package/lib/components/Input/InputSuccess/InputSuccess.d.ts +23 -0
- package/lib/components/Input/InputWrapper/InputWrapper.d.ts +7 -2
- package/lib/components/Input/index.d.ts +3 -1
- package/lib/components/Input/use-input-props.d.ts +5 -2
- package/lib/components/MaskInput/use-mask-input-props.d.ts +5 -1
- package/lib/components/Menubar/Menubar.context.d.ts +51 -0
- package/lib/components/Menubar/Menubar.d.ts +56 -0
- package/lib/components/Menubar/MenubarDropdown/MenubarDropdown.d.ts +7 -0
- package/lib/components/Menubar/MenubarMenu/MenubarMenu.d.ts +9 -0
- package/lib/components/Menubar/MenubarTarget/MenubarTarget.d.ts +14 -0
- package/lib/components/Menubar/index.d.ts +11 -0
- package/lib/components/MultiSelect/MultiSelect.d.ts +1 -1
- package/lib/components/NativeSelect/NativeSelect.d.ts +2 -2
- package/lib/components/PinInput/PinInput.d.ts +2 -0
- package/lib/components/Splitter/Splitter.context.d.ts +3 -1
- package/lib/components/Splitter/Splitter.d.ts +10 -10
- package/lib/components/Splitter/SplitterPane/SplitterPane.d.ts +9 -8
- package/lib/components/Tabs/Tabs.context.d.ts +2 -0
- package/lib/components/index.d.ts +4 -0
- package/lib/core/MantineProvider/color-functions/get-contrast-color/get-contrast-color.d.ts +7 -2
- package/lib/core/MantineProvider/color-functions/index.d.ts +1 -1
- package/package.json +5 -5
- package/styles/DataList.css +54 -0
- package/styles/DataList.layer.css +55 -0
- package/styles/EmptyState.css +121 -0
- package/styles/EmptyState.layer.css +122 -0
- package/styles/Input.css +21 -2
- package/styles/Input.layer.css +21 -2
- package/styles/Menubar.css +29 -0
- package/styles/Menubar.layer.css +30 -0
- package/styles/SemiCircleProgress.css +1 -0
- package/styles/SemiCircleProgress.layer.css +1 -0
- package/styles/Slider.css +4 -0
- package/styles/Slider.layer.css +4 -0
- package/styles/default-css-variables.css +2 -0
- package/styles/default-css-variables.layer.css +2 -0
- package/styles.css +235 -2
- package/styles.layer.css +235 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"assign-padding-variables.mjs","names":[],"sources":["../../../../../src/components/AppShell/AppShellMediaStyles/assign-padding-variables/assign-padding-variables.ts"],"sourcesContent":["import { keys } from '../../../../core';\nimport type { AppShellProps } from '../../AppShell';\nimport { getBaseSize } from '../get-base-size/get-base-size';\nimport { getPaddingValue } from '../get-padding-value/get-padding-value';\nimport type { CSSVariables, MediaQueryVariables } from '../get-variables/get-variables';\nimport { isPrimitiveSize } from '../is-primitive-size/is-primitive-size';\nimport { isResponsiveSize } from '../is-responsive-size/is-responsive-size';\n\ninterface AssignPaddingVariablesInput {\n baseStyles: CSSVariables;\n minMediaStyles: MediaQueryVariables;\n padding: AppShellProps['padding'] | undefined;\n}\n\nexport function assignPaddingVariables({\n padding,\n baseStyles,\n minMediaStyles,\n}: AssignPaddingVariablesInput) {\n if (isPrimitiveSize(padding)) {\n baseStyles['--app-shell-padding'] = getPaddingValue(getBaseSize(padding));\n }\n\n if (isResponsiveSize(padding)) {\n if (padding.base) {\n baseStyles['--app-shell-padding'] = getPaddingValue(padding.base);\n }\n\n keys(padding).forEach((key) => {\n if (key !== 'base') {\n minMediaStyles[key] = minMediaStyles[key] || {};\n minMediaStyles[key]['--app-shell-padding'] = getPaddingValue(padding![key]);\n }\n });\n }\n}\n"],"mappings":";;;;;;;AAcA,SAAgB,uBAAuB,EACrC,SACA,YACA,kBAC8B;CAC9B,IAAI,gBAAgB,OAAO,GACzB,WAAW,yBAAyB,gBAAgB,YAAY,OAAO,CAAC;CAG1E,IAAI,iBAAiB,OAAO,GAAG;EAC7B,IAAI,QAAQ,MACV,WAAW,yBAAyB,gBAAgB,QAAQ,IAAI;EAGlE,KAAK,OAAO,
|
|
1
|
+
{"version":3,"file":"assign-padding-variables.mjs","names":[],"sources":["../../../../../src/components/AppShell/AppShellMediaStyles/assign-padding-variables/assign-padding-variables.ts"],"sourcesContent":["import { keys } from '../../../../core';\nimport type { AppShellProps } from '../../AppShell';\nimport { getBaseSize } from '../get-base-size/get-base-size';\nimport { getPaddingValue } from '../get-padding-value/get-padding-value';\nimport type { CSSVariables, MediaQueryVariables } from '../get-variables/get-variables';\nimport { isPrimitiveSize } from '../is-primitive-size/is-primitive-size';\nimport { isResponsiveSize } from '../is-responsive-size/is-responsive-size';\n\ninterface AssignPaddingVariablesInput {\n baseStyles: CSSVariables;\n minMediaStyles: MediaQueryVariables;\n padding: AppShellProps['padding'] | undefined;\n}\n\nexport function assignPaddingVariables({\n padding,\n baseStyles,\n minMediaStyles,\n}: AssignPaddingVariablesInput) {\n if (isPrimitiveSize(padding)) {\n baseStyles['--app-shell-padding'] = getPaddingValue(getBaseSize(padding));\n }\n\n if (isResponsiveSize(padding)) {\n if (padding.base) {\n baseStyles['--app-shell-padding'] = getPaddingValue(padding.base);\n }\n\n keys(padding).forEach((key) => {\n if (key !== 'base') {\n minMediaStyles[key] = minMediaStyles[key] || {};\n minMediaStyles[key]['--app-shell-padding'] = getPaddingValue(padding![key]);\n }\n });\n }\n}\n"],"mappings":";;;;;;;AAcA,SAAgB,uBAAuB,EACrC,SACA,YACA,kBAC8B;CAC9B,IAAI,gBAAgB,OAAO,GACzB,WAAW,yBAAyB,gBAAgB,YAAY,OAAO,CAAC;CAG1E,IAAI,iBAAiB,OAAO,GAAG;EAC7B,IAAI,QAAQ,MACV,WAAW,yBAAyB,gBAAgB,QAAQ,IAAI;EAGlE,KAAK,OAAO,CAAC,CAAC,SAAS,QAAQ;GAC7B,IAAI,QAAQ,QAAQ;IAClB,eAAe,OAAO,eAAe,QAAQ,CAAC;IAC9C,eAAe,IAAI,CAAC,yBAAyB,gBAAgB,QAAS,IAAI;GAC5E;EACF,CAAC;CACH;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-variables.mjs","names":[],"sources":["../../../../../src/components/AppShell/AppShellMediaStyles/get-variables/get-variables.ts"],"sourcesContent":["import { em, getSortedBreakpoints, keys, MantineTheme } from '../../../../core';\nimport type { AppShellProps } from '../../AppShell';\nimport { assignAsideVariables } from '../assign-aside-variables/assign-aside-variables';\nimport { assignFooterVariables } from '../assign-footer-variables/assign-footer-variables';\nimport { assignHeaderVariables } from '../assign-header-variables/assign-header-variables';\nimport { assignNavbarVariables } from '../assign-navbar-variables/assign-navbar-variables';\nimport { assignPaddingVariables } from '../assign-padding-variables/assign-padding-variables';\n\nexport type CSSVariables = Record<`--${string}`, string | undefined>;\nexport type MediaQueryVariables = Record<string, Record<`--${string}`, string | undefined>>;\n\ninterface GetVariablesInput {\n navbar: AppShellProps['navbar'] | undefined;\n header: AppShellProps['header'] | undefined;\n footer: AppShellProps['footer'] | undefined;\n aside: AppShellProps['aside'] | undefined;\n padding: AppShellProps['padding'] | undefined;\n theme: MantineTheme;\n mode: 'fixed' | 'static';\n}\n\nexport function getVariables({\n navbar,\n header,\n footer,\n aside,\n padding,\n theme,\n mode,\n}: GetVariablesInput) {\n const minMediaStyles: MediaQueryVariables = {};\n const maxMediaStyles: MediaQueryVariables = {};\n const baseStyles: CSSVariables = {};\n\n // Set default main grid position in static mode\n if (mode === 'static') {\n baseStyles['--app-shell-main-grid-column'] = '1 / -1';\n baseStyles['--app-shell-main-grid-row'] = '2';\n }\n\n assignNavbarVariables({\n baseStyles,\n minMediaStyles,\n maxMediaStyles,\n navbar,\n theme,\n mode,\n });\n\n assignAsideVariables({\n baseStyles,\n minMediaStyles,\n maxMediaStyles,\n aside,\n theme,\n mode,\n });\n\n assignHeaderVariables({ baseStyles, minMediaStyles, header, mode });\n assignFooterVariables({ baseStyles, minMediaStyles, footer, mode });\n assignPaddingVariables({ baseStyles, minMediaStyles, padding });\n\n const minMedia = getSortedBreakpoints(keys(minMediaStyles), theme.breakpoints).map(\n (breakpoint) => ({\n query: `(min-width: ${em(breakpoint.px)})`,\n styles: minMediaStyles[breakpoint.value],\n })\n );\n\n const maxMedia = getSortedBreakpoints(keys(maxMediaStyles), theme.breakpoints).map(\n (breakpoint) => ({\n query: `(max-width: ${em(breakpoint.px)})`,\n styles: maxMediaStyles[breakpoint.value],\n })\n );\n\n const media = [...minMedia, ...maxMedia];\n\n return { baseStyles, media };\n}\n"],"mappings":";;;;;;;;;;AAqBA,SAAgB,aAAa,EAC3B,QACA,QACA,QACA,OACA,SACA,OACA,QACoB;CACpB,MAAM,iBAAsC,CAAC;CAC7C,MAAM,iBAAsC,CAAC;CAC7C,MAAM,aAA2B,CAAC;CAGlC,IAAI,SAAS,UAAU;EACrB,WAAW,kCAAkC;EAC7C,WAAW,+BAA+B;CAC5C;CAEA,sBAAsB;EACpB;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,qBAAqB;EACnB;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,sBAAsB;EAAE;EAAY;EAAgB;EAAQ;CAAK,CAAC;CAClE,sBAAsB;EAAE;EAAY;EAAgB;EAAQ;CAAK,CAAC;CAClE,uBAAuB;EAAE;EAAY;EAAgB;CAAQ,CAAC;CAE9D,MAAM,WAAW,qBAAqB,KAAK,cAAc,GAAG,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"get-variables.mjs","names":[],"sources":["../../../../../src/components/AppShell/AppShellMediaStyles/get-variables/get-variables.ts"],"sourcesContent":["import { em, getSortedBreakpoints, keys, MantineTheme } from '../../../../core';\nimport type { AppShellProps } from '../../AppShell';\nimport { assignAsideVariables } from '../assign-aside-variables/assign-aside-variables';\nimport { assignFooterVariables } from '../assign-footer-variables/assign-footer-variables';\nimport { assignHeaderVariables } from '../assign-header-variables/assign-header-variables';\nimport { assignNavbarVariables } from '../assign-navbar-variables/assign-navbar-variables';\nimport { assignPaddingVariables } from '../assign-padding-variables/assign-padding-variables';\n\nexport type CSSVariables = Record<`--${string}`, string | undefined>;\nexport type MediaQueryVariables = Record<string, Record<`--${string}`, string | undefined>>;\n\ninterface GetVariablesInput {\n navbar: AppShellProps['navbar'] | undefined;\n header: AppShellProps['header'] | undefined;\n footer: AppShellProps['footer'] | undefined;\n aside: AppShellProps['aside'] | undefined;\n padding: AppShellProps['padding'] | undefined;\n theme: MantineTheme;\n mode: 'fixed' | 'static';\n}\n\nexport function getVariables({\n navbar,\n header,\n footer,\n aside,\n padding,\n theme,\n mode,\n}: GetVariablesInput) {\n const minMediaStyles: MediaQueryVariables = {};\n const maxMediaStyles: MediaQueryVariables = {};\n const baseStyles: CSSVariables = {};\n\n // Set default main grid position in static mode\n if (mode === 'static') {\n baseStyles['--app-shell-main-grid-column'] = '1 / -1';\n baseStyles['--app-shell-main-grid-row'] = '2';\n }\n\n assignNavbarVariables({\n baseStyles,\n minMediaStyles,\n maxMediaStyles,\n navbar,\n theme,\n mode,\n });\n\n assignAsideVariables({\n baseStyles,\n minMediaStyles,\n maxMediaStyles,\n aside,\n theme,\n mode,\n });\n\n assignHeaderVariables({ baseStyles, minMediaStyles, header, mode });\n assignFooterVariables({ baseStyles, minMediaStyles, footer, mode });\n assignPaddingVariables({ baseStyles, minMediaStyles, padding });\n\n const minMedia = getSortedBreakpoints(keys(minMediaStyles), theme.breakpoints).map(\n (breakpoint) => ({\n query: `(min-width: ${em(breakpoint.px)})`,\n styles: minMediaStyles[breakpoint.value],\n })\n );\n\n const maxMedia = getSortedBreakpoints(keys(maxMediaStyles), theme.breakpoints).map(\n (breakpoint) => ({\n query: `(max-width: ${em(breakpoint.px)})`,\n styles: maxMediaStyles[breakpoint.value],\n })\n );\n\n const media = [...minMedia, ...maxMedia];\n\n return { baseStyles, media };\n}\n"],"mappings":";;;;;;;;;;AAqBA,SAAgB,aAAa,EAC3B,QACA,QACA,QACA,OACA,SACA,OACA,QACoB;CACpB,MAAM,iBAAsC,CAAC;CAC7C,MAAM,iBAAsC,CAAC;CAC7C,MAAM,aAA2B,CAAC;CAGlC,IAAI,SAAS,UAAU;EACrB,WAAW,kCAAkC;EAC7C,WAAW,+BAA+B;CAC5C;CAEA,sBAAsB;EACpB;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,qBAAqB;EACnB;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,sBAAsB;EAAE;EAAY;EAAgB;EAAQ;CAAK,CAAC;CAClE,sBAAsB;EAAE;EAAY;EAAgB;EAAQ;CAAK,CAAC;CAClE,uBAAuB;EAAE;EAAY;EAAgB;CAAQ,CAAC;CAE9D,MAAM,WAAW,qBAAqB,KAAK,cAAc,GAAG,MAAM,WAAW,CAAC,CAAC,KAC5E,gBAAgB;EACf,OAAO,eAAe,GAAG,WAAW,EAAE,EAAE;EACxC,QAAQ,eAAe,WAAW;CACpC,EACF;CAEA,MAAM,WAAW,qBAAqB,KAAK,cAAc,GAAG,MAAM,WAAW,CAAC,CAAC,KAC5E,gBAAgB;EACf,OAAO,eAAe,GAAG,WAAW,EAAE,EAAE;EACxC,QAAQ,eAAe,WAAW;CACpC,EACF;CAIA,OAAO;EAAE;EAAY,OAAA,CAFN,GAAG,UAAU,GAAG,QAEN;CAAE;AAC7B"}
|
package/esm/components/AppShell/AppShellMediaStyles/is-primitive-size/is-primitive-size.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"is-primitive-size.mjs","names":[],"sources":["../../../../../src/components/AppShell/AppShellMediaStyles/is-primitive-size/is-primitive-size.ts"],"sourcesContent":["import type { AppShellResponsiveSize, AppShellSize } from '../../AppShell.types';\n\nexport function isPrimitiveSize(\n size: AppShellSize | AppShellResponsiveSize | undefined\n): size is AppShellSize | AppShellResponsiveSize {\n const isBaseSize =\n typeof size === 'object' &&\n size !== null &&\n typeof size.base !== 'undefined' &&\n Object.keys(size).length === 1;\n return typeof size === 'number' || typeof size === 'string' || isBaseSize;\n}\n"],"mappings":";;AAEA,SAAgB,gBACd,MAC+C;CAC/C,MAAM,aACJ,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,SAAS,eACrB,OAAO,KAAK,IAAI,
|
|
1
|
+
{"version":3,"file":"is-primitive-size.mjs","names":[],"sources":["../../../../../src/components/AppShell/AppShellMediaStyles/is-primitive-size/is-primitive-size.ts"],"sourcesContent":["import type { AppShellResponsiveSize, AppShellSize } from '../../AppShell.types';\n\nexport function isPrimitiveSize(\n size: AppShellSize | AppShellResponsiveSize | undefined\n): size is AppShellSize | AppShellResponsiveSize {\n const isBaseSize =\n typeof size === 'object' &&\n size !== null &&\n typeof size.base !== 'undefined' &&\n Object.keys(size).length === 1;\n return typeof size === 'number' || typeof size === 'string' || isBaseSize;\n}\n"],"mappings":";;AAEA,SAAgB,gBACd,MAC+C;CAC/C,MAAM,aACJ,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,SAAS,eACrB,OAAO,KAAK,IAAI,CAAC,CAAC,WAAW;CAC/B,OAAO,OAAO,SAAS,YAAY,OAAO,SAAS,YAAY;AACjE"}
|
package/esm/components/AppShell/AppShellMediaStyles/is-responsive-size/is-responsive-size.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"is-responsive-size.mjs","names":[],"sources":["../../../../../src/components/AppShell/AppShellMediaStyles/is-responsive-size/is-responsive-size.ts"],"sourcesContent":["import type { AppShellResponsiveSize, AppShellSize } from '../../AppShell.types';\n\nexport function isResponsiveSize(\n size: AppShellSize | AppShellResponsiveSize | undefined\n): size is AppShellResponsiveSize {\n if (typeof size !== 'object' || size === null) {\n return false;\n }\n\n if (Object.keys(size as object).length === 1 && 'base' in (size as object)) {\n return false;\n }\n\n return true;\n}\n"],"mappings":";;AAEA,SAAgB,iBACd,MACgC;CAChC,IAAI,OAAO,SAAS,YAAY,SAAS,MACvC,OAAO;CAGT,IAAI,OAAO,KAAK,IAAc,
|
|
1
|
+
{"version":3,"file":"is-responsive-size.mjs","names":[],"sources":["../../../../../src/components/AppShell/AppShellMediaStyles/is-responsive-size/is-responsive-size.ts"],"sourcesContent":["import type { AppShellResponsiveSize, AppShellSize } from '../../AppShell.types';\n\nexport function isResponsiveSize(\n size: AppShellSize | AppShellResponsiveSize | undefined\n): size is AppShellResponsiveSize {\n if (typeof size !== 'object' || size === null) {\n return false;\n }\n\n if (Object.keys(size as object).length === 1 && 'base' in (size as object)) {\n return false;\n }\n\n return true;\n}\n"],"mappings":";;AAEA,SAAgB,iBACd,MACgC;CAChC,IAAI,OAAO,SAAS,YAAY,SAAS,MACvC,OAAO;CAGT,IAAI,OAAO,KAAK,IAAc,CAAC,CAAC,WAAW,KAAK,UAAW,MACzD,OAAO;CAGT,OAAO;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AspectRatio.mjs","names":["classes"],"sources":["../../../src/components/AspectRatio/AspectRatio.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './AspectRatio.module.css';\n\nexport type AspectRatioStylesNames = 'root';\nexport type AspectRatioCssVariables = {\n root: '--ar-ratio';\n};\n\nexport interface AspectRatioProps\n extends BoxProps, StylesApiProps<AspectRatioFactory>, ElementProps<'div'> {\n /** Aspect ratio, for example, `16 / 9`, `4 / 3`, `1920 / 1080` @default 1 */\n ratio?: number;\n}\n\nexport type AspectRatioFactory = Factory<{\n props: AspectRatioProps;\n ref: HTMLDivElement;\n stylesNames: AspectRatioStylesNames;\n vars: AspectRatioCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<AspectRatioFactory>((_, { ratio }) => ({\n root: {\n '--ar-ratio': ratio?.toString(),\n },\n}));\n\nexport const AspectRatio = factory<AspectRatioFactory>((_props) => {\n const props = useProps('AspectRatio', null, _props);\n const { classNames, className, style, styles, unstyled, vars, ratio, attributes, ...others } =\n props;\n\n const getStyles = useStyles<AspectRatioFactory>({\n name: 'AspectRatio',\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')} {...others} />;\n});\n\nAspectRatio.classes = classes;\nAspectRatio.varsResolver = varsResolver;\nAspectRatio.displayName = '@mantine/core/AspectRatio';\n\nexport namespace AspectRatio {\n export type Props = AspectRatioProps;\n export type StylesNames = AspectRatioStylesNames;\n export type CssVariables = AspectRatioCssVariables;\n export type Factory = AspectRatioFactory;\n}\n"],"mappings":";;;;;;;;;AA+BA,MAAM,eAAe,oBAAwC,GAAG,EAAE,aAAa,EAC7E,MAAM,EACJ,cAAc,OAAO,SAAS,EAChC,EACF,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,MAAM,MAAM;CAClD,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,UAAU,MAAM,OAAO,YAAY,GAAG,WAClF;CAgBF,OAAO,oBAAC,KAAD;EAAK,GAdM,UAA8B;GAC9C,MAAM;GACN,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAEwB,
|
|
1
|
+
{"version":3,"file":"AspectRatio.mjs","names":["classes"],"sources":["../../../src/components/AspectRatio/AspectRatio.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './AspectRatio.module.css';\n\nexport type AspectRatioStylesNames = 'root';\nexport type AspectRatioCssVariables = {\n root: '--ar-ratio';\n};\n\nexport interface AspectRatioProps\n extends BoxProps, StylesApiProps<AspectRatioFactory>, ElementProps<'div'> {\n /** Aspect ratio, for example, `16 / 9`, `4 / 3`, `1920 / 1080` @default 1 */\n ratio?: number;\n}\n\nexport type AspectRatioFactory = Factory<{\n props: AspectRatioProps;\n ref: HTMLDivElement;\n stylesNames: AspectRatioStylesNames;\n vars: AspectRatioCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<AspectRatioFactory>((_, { ratio }) => ({\n root: {\n '--ar-ratio': ratio?.toString(),\n },\n}));\n\nexport const AspectRatio = factory<AspectRatioFactory>((_props) => {\n const props = useProps('AspectRatio', null, _props);\n const { classNames, className, style, styles, unstyled, vars, ratio, attributes, ...others } =\n props;\n\n const getStyles = useStyles<AspectRatioFactory>({\n name: 'AspectRatio',\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')} {...others} />;\n});\n\nAspectRatio.classes = classes;\nAspectRatio.varsResolver = varsResolver;\nAspectRatio.displayName = '@mantine/core/AspectRatio';\n\nexport namespace AspectRatio {\n export type Props = AspectRatioProps;\n export type StylesNames = AspectRatioStylesNames;\n export type CssVariables = AspectRatioCssVariables;\n export type Factory = AspectRatioFactory;\n}\n"],"mappings":";;;;;;;;;AA+BA,MAAM,eAAe,oBAAwC,GAAG,EAAE,aAAa,EAC7E,MAAM,EACJ,cAAc,OAAO,SAAS,EAChC,EACF,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,MAAM,MAAM;CAClD,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,UAAU,MAAM,OAAO,YAAY,GAAG,WAClF;CAgBF,OAAO,oBAAC,KAAD;EAAK,GAdM,UAA8B;GAC9C,MAAM;GACN,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAEwB,CAAC,CAAC,MAAM;EAAG,GAAI;CAAS,CAAA;AAClD,CAAC;AAED,YAAY,UAAUA;AACtB,YAAY,eAAe;AAC3B,YAAY,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Autocomplete.mjs","names":["useId"],"sources":["../../../src/components/Autocomplete/Autocomplete.tsx"],"sourcesContent":["import { useEffect } from 'react';\nimport { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n factory,\n Factory,\n Primitive,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n} from '../../core';\nimport {\n Combobox,\n ComboboxGenericData,\n ComboboxGenericItem,\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 RenderAutocompleteOption = (\n input: ComboboxLikeRenderOptionInput<ComboboxGenericItem>\n) => React.ReactNode;\n\nexport type AutocompleteStylesNames = __InputStylesNames | ComboboxLikeStylesNames;\n\nexport interface AutocompleteProps\n extends\n BoxProps,\n Omit<__BaseInputProps, 'pointer'>,\n Omit<ComboboxLikeProps, 'data'>,\n StylesApiProps<AutocompleteFactory>,\n ElementProps<'input', 'onChange' | 'size'> {\n /** Data used to display options. Values must be unique. */\n data?: ComboboxGenericData;\n\n /** Controlled component value */\n value?: string;\n\n /** Default value for uncontrolled component */\n defaultValue?: string;\n\n /** Called when value changes */\n onChange?: (value: string) => void;\n\n /** Function to render custom option content */\n renderOption?: RenderAutocompleteOption;\n\n /** Props passed to the underlying `ScrollArea` component in the dropdown */\n scrollAreaProps?: ScrollAreaProps;\n\n /** Called when the clear button is clicked */\n onClear?: () => void;\n\n /** Props passed down to the clear button */\n clearButtonProps?: InputClearButtonProps;\n\n /** If set, the clear button is displayed when the component has a value @default false */\n clearable?: boolean;\n\n /** Determines how the clear button and rightSection are rendered @default 'both' */\n clearSectionMode?: ClearSectionMode;\n\n /** If set, the highlighted option is selected when the input loses focus @default false */\n autoSelectOnBlur?: boolean;\n\n /** If set, the dropdown opens when the input receives focus @default true */\n openOnFocus?: boolean;\n}\n\nexport type AutocompleteFactory = Factory<{\n props: AutocompleteProps;\n ref: HTMLInputElement;\n stylesNames: AutocompleteStylesNames;\n variant: InputVariant;\n}>;\n\nexport const Autocomplete = factory<AutocompleteFactory>((_props) => {\n const props = useProps(\n ['Input', 'InputWrapper', 'Autocomplete'],\n { size: 'sm' } satisfies Partial<AutocompleteProps>,\n _props\n );\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 id,\n renderOption,\n autoComplete,\n scrollAreaProps,\n onClear,\n clearButtonProps,\n error,\n clearable,\n clearSectionMode,\n rightSection,\n autoSelectOnBlur,\n openOnFocus = true,\n attributes,\n ...others\n } = props;\n\n const _id = useId(id);\n const parsedData = getParsedComboboxData(data);\n const optionsLockup = getOptionsLockup(parsedData);\n\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: '',\n onChange,\n });\n\n const combobox = useCombobox({\n opened: dropdownOpened,\n defaultOpened: defaultDropdownOpened,\n onDropdownOpen: () => {\n onDropdownOpen?.();\n if (selectFirstOptionOnDropdownOpen) {\n combobox.selectFirstOption();\n }\n },\n onDropdownClose: () => {\n onDropdownClose?.();\n // Required for autoSelectOnBlur to work correctly\n setTimeout(combobox.resetSelectedOption, 0);\n },\n });\n\n const handleValueChange = (value: string) => {\n setValue(value);\n combobox.resetSelectedOption();\n };\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<AutocompleteFactory>({\n props,\n styles,\n classNames,\n });\n\n useEffect(() => {\n if (selectFirstOptionOnChange) {\n combobox.selectFirstOption();\n }\n }, [selectFirstOptionOnChange, _value]);\n\n const clearButton = (\n <Combobox.ClearButton\n {...clearButtonProps}\n onClear={() => {\n handleValueChange('');\n onClear?.();\n }}\n />\n );\n\n return (\n <Combobox\n store={combobox}\n __staticSelector=\"Autocomplete\"\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);\n handleValueChange(optionsLockup[val].label);\n combobox.closeDropdown();\n }}\n {...comboboxProps}\n >\n <Combobox.Target autoComplete={autoComplete} withExpandedAttribute>\n <InputBase\n {...others}\n size={size}\n __staticSelector=\"Autocomplete\"\n __clearSection={clearButton}\n __clearable={clearable && !!_value && !disabled && !readOnly}\n __clearSectionMode={clearSectionMode}\n rightSection={rightSection}\n disabled={disabled}\n readOnly={readOnly}\n value={_value}\n error={error}\n onChange={(event) => {\n handleValueChange(event.currentTarget.value);\n combobox.openDropdown();\n selectFirstOptionOnChange && combobox.selectFirstOption();\n }}\n onFocus={(event) => {\n openOnFocus && combobox.openDropdown();\n onFocus?.(event);\n }}\n onBlur={(event) => {\n if (autoSelectOnBlur) {\n combobox.clickSelectedOption();\n }\n\n combobox.closeDropdown();\n onBlur?.(event);\n }}\n onClick={(event) => {\n combobox.openDropdown();\n onClick?.(event);\n }}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n attributes={attributes}\n id={_id}\n />\n </Combobox.Target>\n <OptionsDropdown\n data={parsedData}\n hidden={readOnly || disabled}\n filter={filter as OptionsFilter<Primitive> | undefined}\n search={_value}\n limit={limit}\n hiddenWhenEmpty\n withScrollArea={withScrollArea}\n maxDropdownHeight={maxDropdownHeight}\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 );\n});\n\nAutocomplete.classes = { ...InputBase.classes, ...Combobox.classes };\nAutocomplete.displayName = '@mantine/core/Autocomplete';\n\nexport namespace Autocomplete {\n export type Props = AutocompleteProps;\n export type StylesNames = AutocompleteStylesNames;\n export type RenderOption = RenderAutocompleteOption;\n export type Factory = AutocompleteFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;AA4FA,MAAa,eAAe,SAA8B,WAAW;CACnE,MAAM,QAAQ,SACZ;EAAC;EAAS;EAAgB;CAAc,GACxC,EAAE,MAAM,KAAK,GACb,MACF;CACA,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,IACA,cACA,cACA,iBACA,SACA,kBACA,OACA,WACA,kBACA,cACA,kBACA,cAAc,MACd,YACA,GAAG,WACD;CAEJ,MAAM,MAAMA,QAAM,EAAE;CACpB,MAAM,aAAa,sBAAsB,IAAI;CAC7C,MAAM,gBAAgB,iBAAiB,UAAU;CAEjD,MAAM,CAAC,QAAQ,YAAY,gBAAgB;EACzC;EACA;EACA,YAAY;EACZ;CACF,CAAC;CAED,MAAM,WAAW,YAAY;EAC3B,QAAQ;EACR,eAAe;EACf,sBAAsB;GACpB,iBAAiB;GACjB,IAAI,iCACF,SAAS,kBAAkB;EAE/B;EACA,uBAAuB;GACrB,kBAAkB;GAElB,WAAW,SAAS,qBAAqB,CAAC;EAC5C;CACF,CAAC;CAED,MAAM,qBAAqB,UAAkB;EAC3C,SAAS,KAAK;EACd,SAAS,oBAAoB;CAC/B;CAEA,MAAM,EAAE,oBAAoB,mBAAmB,qBAA0C;EACvF;EACA;EACA;CACF,CAAC;CAED,gBAAgB;EACd,IAAI,2BACF,SAAS,kBAAkB;CAE/B,GAAG,CAAC,2BAA2B,MAAM,CAAC;CAEtC,MAAM,cACJ,oBAAC,SAAS,aAAV;EACE,GAAI;EACJ,eAAe;GACb,kBAAkB,EAAE;GACpB,UAAU;EACZ;CACD,CAAA;CAGH,OACE,qBAAC,UAAD;EACE,OAAO;EACP,kBAAiB;EACjB,YAAY;EACZ,QAAQ;EACE;EACA;EACJ;EACM;EACI;EAChB,aAAa;EACb,iBAAiB,QAAQ;GACvB,iBAAiB,GAAG;GACpB,kBAAkB,cAAc,
|
|
1
|
+
{"version":3,"file":"Autocomplete.mjs","names":["useId"],"sources":["../../../src/components/Autocomplete/Autocomplete.tsx"],"sourcesContent":["import { useEffect } from 'react';\nimport { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n factory,\n Factory,\n Primitive,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n} from '../../core';\nimport {\n Combobox,\n ComboboxGenericData,\n ComboboxGenericItem,\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 RenderAutocompleteOption = (\n input: ComboboxLikeRenderOptionInput<ComboboxGenericItem>\n) => React.ReactNode;\n\nexport type AutocompleteStylesNames = __InputStylesNames | ComboboxLikeStylesNames;\n\nexport interface AutocompleteProps\n extends\n BoxProps,\n Omit<__BaseInputProps, 'pointer'>,\n Omit<ComboboxLikeProps, 'data'>,\n StylesApiProps<AutocompleteFactory>,\n ElementProps<'input', 'onChange' | 'size'> {\n /** Data used to display options. Values must be unique. */\n data?: ComboboxGenericData;\n\n /** Controlled component value */\n value?: string;\n\n /** Default value for uncontrolled component */\n defaultValue?: string;\n\n /** Called when value changes */\n onChange?: (value: string) => void;\n\n /** Function to render custom option content */\n renderOption?: RenderAutocompleteOption;\n\n /** Props passed to the underlying `ScrollArea` component in the dropdown */\n scrollAreaProps?: ScrollAreaProps;\n\n /** Called when the clear button is clicked */\n onClear?: () => void;\n\n /** Props passed down to the clear button */\n clearButtonProps?: InputClearButtonProps;\n\n /** If set, the clear button is displayed when the component has a value @default false */\n clearable?: boolean;\n\n /** Determines how the clear button and rightSection are rendered @default 'both' */\n clearSectionMode?: ClearSectionMode;\n\n /** If set, the highlighted option is selected when the input loses focus @default false */\n autoSelectOnBlur?: boolean;\n\n /** If set, the dropdown opens when the input receives focus @default true */\n openOnFocus?: boolean;\n}\n\nexport type AutocompleteFactory = Factory<{\n props: AutocompleteProps;\n ref: HTMLInputElement;\n stylesNames: AutocompleteStylesNames;\n variant: InputVariant;\n}>;\n\nexport const Autocomplete = factory<AutocompleteFactory>((_props) => {\n const props = useProps(\n ['Input', 'InputWrapper', 'Autocomplete'],\n { size: 'sm' } satisfies Partial<AutocompleteProps>,\n _props\n );\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 id,\n renderOption,\n autoComplete,\n scrollAreaProps,\n onClear,\n clearButtonProps,\n error,\n clearable,\n clearSectionMode,\n rightSection,\n autoSelectOnBlur,\n openOnFocus = true,\n attributes,\n ...others\n } = props;\n\n const _id = useId(id);\n const parsedData = getParsedComboboxData(data);\n const optionsLockup = getOptionsLockup(parsedData);\n\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: '',\n onChange,\n });\n\n const combobox = useCombobox({\n opened: dropdownOpened,\n defaultOpened: defaultDropdownOpened,\n onDropdownOpen: () => {\n onDropdownOpen?.();\n if (selectFirstOptionOnDropdownOpen) {\n combobox.selectFirstOption();\n }\n },\n onDropdownClose: () => {\n onDropdownClose?.();\n // Required for autoSelectOnBlur to work correctly\n setTimeout(combobox.resetSelectedOption, 0);\n },\n });\n\n const handleValueChange = (value: string) => {\n setValue(value);\n combobox.resetSelectedOption();\n };\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<AutocompleteFactory>({\n props,\n styles,\n classNames,\n });\n\n useEffect(() => {\n if (selectFirstOptionOnChange) {\n combobox.selectFirstOption();\n }\n }, [selectFirstOptionOnChange, _value]);\n\n const clearButton = (\n <Combobox.ClearButton\n {...clearButtonProps}\n onClear={() => {\n handleValueChange('');\n onClear?.();\n }}\n />\n );\n\n return (\n <Combobox\n store={combobox}\n __staticSelector=\"Autocomplete\"\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);\n handleValueChange(optionsLockup[val].label);\n combobox.closeDropdown();\n }}\n {...comboboxProps}\n >\n <Combobox.Target autoComplete={autoComplete} withExpandedAttribute>\n <InputBase\n {...others}\n size={size}\n __staticSelector=\"Autocomplete\"\n __clearSection={clearButton}\n __clearable={clearable && !!_value && !disabled && !readOnly}\n __clearSectionMode={clearSectionMode}\n rightSection={rightSection}\n disabled={disabled}\n readOnly={readOnly}\n value={_value}\n error={error}\n onChange={(event) => {\n handleValueChange(event.currentTarget.value);\n combobox.openDropdown();\n selectFirstOptionOnChange && combobox.selectFirstOption();\n }}\n onFocus={(event) => {\n openOnFocus && combobox.openDropdown();\n onFocus?.(event);\n }}\n onBlur={(event) => {\n if (autoSelectOnBlur) {\n combobox.clickSelectedOption();\n }\n\n combobox.closeDropdown();\n onBlur?.(event);\n }}\n onClick={(event) => {\n combobox.openDropdown();\n onClick?.(event);\n }}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n attributes={attributes}\n id={_id}\n />\n </Combobox.Target>\n <OptionsDropdown\n data={parsedData}\n hidden={readOnly || disabled}\n filter={filter as OptionsFilter<Primitive> | undefined}\n search={_value}\n limit={limit}\n hiddenWhenEmpty\n withScrollArea={withScrollArea}\n maxDropdownHeight={maxDropdownHeight}\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 );\n});\n\nAutocomplete.classes = { ...InputBase.classes, ...Combobox.classes };\nAutocomplete.displayName = '@mantine/core/Autocomplete';\n\nexport namespace Autocomplete {\n export type Props = AutocompleteProps;\n export type StylesNames = AutocompleteStylesNames;\n export type RenderOption = RenderAutocompleteOption;\n export type Factory = AutocompleteFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;AA4FA,MAAa,eAAe,SAA8B,WAAW;CACnE,MAAM,QAAQ,SACZ;EAAC;EAAS;EAAgB;CAAc,GACxC,EAAE,MAAM,KAAK,GACb,MACF;CACA,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,IACA,cACA,cACA,iBACA,SACA,kBACA,OACA,WACA,kBACA,cACA,kBACA,cAAc,MACd,YACA,GAAG,WACD;CAEJ,MAAM,MAAMA,QAAM,EAAE;CACpB,MAAM,aAAa,sBAAsB,IAAI;CAC7C,MAAM,gBAAgB,iBAAiB,UAAU;CAEjD,MAAM,CAAC,QAAQ,YAAY,gBAAgB;EACzC;EACA;EACA,YAAY;EACZ;CACF,CAAC;CAED,MAAM,WAAW,YAAY;EAC3B,QAAQ;EACR,eAAe;EACf,sBAAsB;GACpB,iBAAiB;GACjB,IAAI,iCACF,SAAS,kBAAkB;EAE/B;EACA,uBAAuB;GACrB,kBAAkB;GAElB,WAAW,SAAS,qBAAqB,CAAC;EAC5C;CACF,CAAC;CAED,MAAM,qBAAqB,UAAkB;EAC3C,SAAS,KAAK;EACd,SAAS,oBAAoB;CAC/B;CAEA,MAAM,EAAE,oBAAoB,mBAAmB,qBAA0C;EACvF;EACA;EACA;CACF,CAAC;CAED,gBAAgB;EACd,IAAI,2BACF,SAAS,kBAAkB;CAE/B,GAAG,CAAC,2BAA2B,MAAM,CAAC;CAEtC,MAAM,cACJ,oBAAC,SAAS,aAAV;EACE,GAAI;EACJ,eAAe;GACb,kBAAkB,EAAE;GACpB,UAAU;EACZ;CACD,CAAA;CAGH,OACE,qBAAC,UAAD;EACE,OAAO;EACP,kBAAiB;EACjB,YAAY;EACZ,QAAQ;EACE;EACA;EACJ;EACM;EACI;EAChB,aAAa;EACb,iBAAiB,QAAQ;GACvB,iBAAiB,GAAG;GACpB,kBAAkB,cAAc,IAAI,CAAC,KAAK;GAC1C,SAAS,cAAc;EACzB;EACA,GAAI;YAhBN,CAkBE,oBAAC,SAAS,QAAV;GAA+B;GAAc,uBAAA;aAC3C,oBAAC,WAAD;IACE,GAAI;IACE;IACN,kBAAiB;IACjB,gBAAgB;IAChB,aAAa,aAAa,CAAC,CAAC,UAAU,CAAC,YAAY,CAAC;IACpD,oBAAoB;IACN;IACJ;IACA;IACV,OAAO;IACA;IACP,WAAW,UAAU;KACnB,kBAAkB,MAAM,cAAc,KAAK;KAC3C,SAAS,aAAa;KACtB,6BAA6B,SAAS,kBAAkB;IAC1D;IACA,UAAU,UAAU;KAClB,eAAe,SAAS,aAAa;KACrC,UAAU,KAAK;IACjB;IACA,SAAS,UAAU;KACjB,IAAI,kBACF,SAAS,oBAAoB;KAG/B,SAAS,cAAc;KACvB,SAAS,KAAK;IAChB;IACA,UAAU,UAAU;KAClB,SAAS,aAAa;KACtB,UAAU,KAAK;IACjB;IACA,YAAY;IACZ,QAAQ;IACE;IACE;IACZ,IAAI;GACL,CAAA;EACc,CAAA,GACjB,oBAAC,iBAAD;GACE,MAAM;GACN,QAAQ,YAAY;GACZ;GACR,QAAQ;GACD;GACP,iBAAA;GACgB;GACG;GACT;GACV,SAAS,OAAO,QAAQ,GAAG,IAAI,UAAU,KAAA;GACzC,cAAY,OAAO,QAAQ,KAAA,IAAY,OAAO;GAChC;GACG;EAClB,CAAA,CACO;;AAEd,CAAC;AAED,aAAa,UAAU;CAAE,GAAG,UAAU;CAAS,GAAG,SAAS;AAAQ;AACnE,aAAa,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarGroup.mjs","names":["classes"],"sources":["../../../../src/components/Avatar/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import { createContext } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport classes from '../Avatar.module.css';\n\nexport interface AvatarGroupContextValue {\n withinGroup: boolean;\n}\n\nexport const AvatarGroupContext = createContext<AvatarGroupContextValue>({ withinGroup: false });\n\nexport type AvatarGroupStylesNames = 'group';\nexport type AvatarGroupCssVariables = {\n group: '--ag-spacing';\n};\n\nexport interface AvatarGroupProps\n extends BoxProps, StylesApiProps<AvatarGroupFactory>, ElementProps<'div'> {\n /** Negative space between Avatar components @default 'sm' */\n spacing?: MantineSpacing;\n}\n\nexport type AvatarGroupFactory = Factory<{\n props: AvatarGroupProps;\n ref: HTMLDivElement;\n stylesNames: AvatarGroupStylesNames;\n vars: AvatarGroupCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<AvatarGroupFactory>((_, { spacing }) => ({\n group: {\n '--ag-spacing': getSpacing(spacing),\n },\n}));\n\nexport const AvatarGroup = factory<AvatarGroupFactory>((_props) => {\n const props = useProps('AvatarGroup', null, _props);\n const { classNames, className, style, styles, unstyled, vars, spacing, attributes, ...others } =\n props;\n\n const getStyles = useStyles<AvatarGroupFactory>({\n name: 'AvatarGroup',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'group',\n });\n\n return (\n <AvatarGroupContext value={{ withinGroup: true }}>\n <Box {...getStyles('group')} {...others} />\n </AvatarGroupContext>\n );\n});\n\nAvatarGroup.classes = classes;\nAvatarGroup.varsResolver = varsResolver;\nAvatarGroup.displayName = '@mantine/core/AvatarGroup';\n"],"mappings":";;;;;;;;;;;AAoBA,MAAa,qBAAqB,cAAuC,EAAE,aAAa,MAAM,CAAC;AAoB/F,MAAM,eAAe,oBAAwC,GAAG,EAAE,eAAe,EAC/E,OAAO,EACL,gBAAgB,WAAW,OAAO,EACpC,EACF,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,MAAM,MAAM;CAClD,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,UAAU,MAAM,SAAS,YAAY,GAAG,WACpF;CAiBF,OACE,oBAAC,oBAAD;EAAoB,OAAO,EAAE,aAAa,KAAK;YAC7C,oBAAC,KAAD;GAAK,GAjBS,UAA8B;IAC9C,MAAM;IACN,SAAA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA,cAAc;GAChB,CAIqB,
|
|
1
|
+
{"version":3,"file":"AvatarGroup.mjs","names":["classes"],"sources":["../../../../src/components/Avatar/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import { createContext } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport classes from '../Avatar.module.css';\n\nexport interface AvatarGroupContextValue {\n withinGroup: boolean;\n}\n\nexport const AvatarGroupContext = createContext<AvatarGroupContextValue>({ withinGroup: false });\n\nexport type AvatarGroupStylesNames = 'group';\nexport type AvatarGroupCssVariables = {\n group: '--ag-spacing';\n};\n\nexport interface AvatarGroupProps\n extends BoxProps, StylesApiProps<AvatarGroupFactory>, ElementProps<'div'> {\n /** Negative space between Avatar components @default 'sm' */\n spacing?: MantineSpacing;\n}\n\nexport type AvatarGroupFactory = Factory<{\n props: AvatarGroupProps;\n ref: HTMLDivElement;\n stylesNames: AvatarGroupStylesNames;\n vars: AvatarGroupCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<AvatarGroupFactory>((_, { spacing }) => ({\n group: {\n '--ag-spacing': getSpacing(spacing),\n },\n}));\n\nexport const AvatarGroup = factory<AvatarGroupFactory>((_props) => {\n const props = useProps('AvatarGroup', null, _props);\n const { classNames, className, style, styles, unstyled, vars, spacing, attributes, ...others } =\n props;\n\n const getStyles = useStyles<AvatarGroupFactory>({\n name: 'AvatarGroup',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'group',\n });\n\n return (\n <AvatarGroupContext value={{ withinGroup: true }}>\n <Box {...getStyles('group')} {...others} />\n </AvatarGroupContext>\n );\n});\n\nAvatarGroup.classes = classes;\nAvatarGroup.varsResolver = varsResolver;\nAvatarGroup.displayName = '@mantine/core/AvatarGroup';\n"],"mappings":";;;;;;;;;;;AAoBA,MAAa,qBAAqB,cAAuC,EAAE,aAAa,MAAM,CAAC;AAoB/F,MAAM,eAAe,oBAAwC,GAAG,EAAE,eAAe,EAC/E,OAAO,EACL,gBAAgB,WAAW,OAAO,EACpC,EACF,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,MAAM,MAAM;CAClD,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,UAAU,MAAM,SAAS,YAAY,GAAG,WACpF;CAiBF,OACE,oBAAC,oBAAD;EAAoB,OAAO,EAAE,aAAa,KAAK;YAC7C,oBAAC,KAAD;GAAK,GAjBS,UAA8B;IAC9C,MAAM;IACN,SAAA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA,cAAc;GAChB,CAIqB,CAAC,CAAC,OAAO;GAAG,GAAI;EAAS,CAAA;CACxB,CAAA;AAExB,CAAC;AAED,YAAY,UAAUA;AACtB,YAAY,eAAe;AAC3B,YAAY,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-initials.mjs","names":[],"sources":["../../../../src/components/Avatar/get-initials/get-initials.ts"],"sourcesContent":["export function getInitials(name: string, limit = 2) {\n const splitted = name.split(' ');\n\n if (splitted.length === 1) {\n return name.slice(0, limit).toUpperCase();\n }\n\n return splitted\n .map((word) => word[0])\n .slice(0, limit)\n .join('')\n .toUpperCase();\n}\n"],"mappings":";;AAAA,SAAgB,YAAY,MAAc,QAAQ,GAAG;CACnD,MAAM,WAAW,KAAK,MAAM,GAAG;CAE/B,IAAI,SAAS,WAAW,GACtB,OAAO,KAAK,MAAM,GAAG,KAAK,
|
|
1
|
+
{"version":3,"file":"get-initials.mjs","names":[],"sources":["../../../../src/components/Avatar/get-initials/get-initials.ts"],"sourcesContent":["export function getInitials(name: string, limit = 2) {\n const splitted = name.split(' ');\n\n if (splitted.length === 1) {\n return name.slice(0, limit).toUpperCase();\n }\n\n return splitted\n .map((word) => word[0])\n .slice(0, limit)\n .join('')\n .toUpperCase();\n}\n"],"mappings":";;AAAA,SAAgB,YAAY,MAAc,QAAQ,GAAG;CACnD,MAAM,WAAW,KAAK,MAAM,GAAG;CAE/B,IAAI,SAAS,WAAW,GACtB,OAAO,KAAK,MAAM,GAAG,KAAK,CAAC,CAAC,YAAY;CAG1C,OAAO,SACJ,KAAK,SAAS,KAAK,EAAE,CAAC,CACtB,MAAM,GAAG,KAAK,CAAC,CACf,KAAK,EAAE,CAAC,CACR,YAAY;AACjB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BackgroundImage.mjs","names":["classes"],"sources":["../../../src/components/BackgroundImage/BackgroundImage.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n getRadius,\n MantineRadius,\n polymorphicFactory,\n PolymorphicFactory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './BackgroundImage.module.css';\n\nexport type BackgroundImageStylesNames = 'root';\nexport type BackgroundImageCssVariables = {\n root: '--bi-radius';\n};\n\nexport interface BackgroundImageProps extends BoxProps, StylesApiProps<BackgroundImageFactory> {\n /** Key of `theme.radius` or any valid CSS value to set border-radius, numbers are converted to rem @default 0 */\n radius?: MantineRadius;\n\n /** Image url */\n src: string;\n}\n\nexport type BackgroundImageFactory = PolymorphicFactory<{\n props: BackgroundImageProps;\n defaultRef: HTMLDivElement;\n defaultComponent: 'div';\n stylesNames: BackgroundImageStylesNames;\n vars: BackgroundImageCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<BackgroundImageFactory>((_, { radius }) => ({\n root: { '--bi-radius': radius === undefined ? undefined : getRadius(radius) },\n}));\n\nexport const BackgroundImage = polymorphicFactory<BackgroundImageFactory>((_props) => {\n const props = useProps('BackgroundImage', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n radius,\n src,\n variant,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<BackgroundImageFactory>({\n name: 'BackgroundImage',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Box\n variant={variant}\n {...getStyles('root', { style: { backgroundImage: `url(${src})` } })}\n {...others}\n />\n );\n});\n\nBackgroundImage.classes = classes;\nBackgroundImage.varsResolver = varsResolver;\nBackgroundImage.displayName = '@mantine/core/BackgroundImage';\n\nexport namespace BackgroundImage {\n export type Props = BackgroundImageProps;\n export type CssVariables = BackgroundImageCssVariables;\n export type Factory = BackgroundImageFactory;\n export type StylesNames = BackgroundImageStylesNames;\n}\n"],"mappings":";;;;;;;;;;AAmCA,MAAM,eAAe,oBAA4C,GAAG,EAAE,cAAc,EAClF,MAAM,EAAE,eAAe,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM,EAAE,EAC9E,EAAE;AAEF,MAAa,kBAAkB,oBAA4C,WAAW;CACpF,MAAM,QAAQ,SAAS,mBAAmB,MAAM,MAAM;CACtD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,QACA,KACA,SACA,YACA,GAAG,WACD;CAgBJ,OACE,oBAAC,KAAD;EACW;EACT,GAjBc,UAAkC;GAClD,MAAM;GACN;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAKgB,
|
|
1
|
+
{"version":3,"file":"BackgroundImage.mjs","names":["classes"],"sources":["../../../src/components/BackgroundImage/BackgroundImage.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n getRadius,\n MantineRadius,\n polymorphicFactory,\n PolymorphicFactory,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './BackgroundImage.module.css';\n\nexport type BackgroundImageStylesNames = 'root';\nexport type BackgroundImageCssVariables = {\n root: '--bi-radius';\n};\n\nexport interface BackgroundImageProps extends BoxProps, StylesApiProps<BackgroundImageFactory> {\n /** Key of `theme.radius` or any valid CSS value to set border-radius, numbers are converted to rem @default 0 */\n radius?: MantineRadius;\n\n /** Image url */\n src: string;\n}\n\nexport type BackgroundImageFactory = PolymorphicFactory<{\n props: BackgroundImageProps;\n defaultRef: HTMLDivElement;\n defaultComponent: 'div';\n stylesNames: BackgroundImageStylesNames;\n vars: BackgroundImageCssVariables;\n}>;\n\nconst varsResolver = createVarsResolver<BackgroundImageFactory>((_, { radius }) => ({\n root: { '--bi-radius': radius === undefined ? undefined : getRadius(radius) },\n}));\n\nexport const BackgroundImage = polymorphicFactory<BackgroundImageFactory>((_props) => {\n const props = useProps('BackgroundImage', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n radius,\n src,\n variant,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<BackgroundImageFactory>({\n name: 'BackgroundImage',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Box\n variant={variant}\n {...getStyles('root', { style: { backgroundImage: `url(${src})` } })}\n {...others}\n />\n );\n});\n\nBackgroundImage.classes = classes;\nBackgroundImage.varsResolver = varsResolver;\nBackgroundImage.displayName = '@mantine/core/BackgroundImage';\n\nexport namespace BackgroundImage {\n export type Props = BackgroundImageProps;\n export type CssVariables = BackgroundImageCssVariables;\n export type Factory = BackgroundImageFactory;\n export type StylesNames = BackgroundImageStylesNames;\n}\n"],"mappings":";;;;;;;;;;AAmCA,MAAM,eAAe,oBAA4C,GAAG,EAAE,cAAc,EAClF,MAAM,EAAE,eAAe,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM,EAAE,EAC9E,EAAE;AAEF,MAAa,kBAAkB,oBAA4C,WAAW;CACpF,MAAM,QAAQ,SAAS,mBAAmB,MAAM,MAAM;CACtD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,QACA,KACA,SACA,YACA,GAAG,WACD;CAgBJ,OACE,oBAAC,KAAD;EACW;EACT,GAjBc,UAAkC;GAClD,MAAM;GACN;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,CAKgB,CAAC,CAAC,QAAQ,EAAE,OAAO,EAAE,iBAAiB,OAAO,IAAI,GAAG,EAAE,CAAC;EACnE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,gBAAgB,UAAUA;AAC1B,gBAAgB,eAAe;AAC/B,gBAAgB,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Blockquote.mjs","names":["classes"],"sources":["../../../src/components/Blockquote/Blockquote.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n parseThemeColor,\n rem,\n rgba,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Blockquote.module.css';\n\nexport type BlockquoteStylesNames = 'root' | 'icon' | 'cite';\nexport type BlockquoteCssVariables = {\n root:\n | '--bq-bg-light'\n | '--bq-bg-dark'\n | '--bq-bd'\n | '--bq-icon-size'\n | '--bq-radius'\n | '--bq-text-wrap';\n};\n\nexport interface BlockquoteProps\n extends BoxProps, StylesApiProps<BlockquoteFactory>, ElementProps<'blockquote', 'cite'> {\n /** Blockquote icon, displayed at the top left side */\n icon?: React.ReactNode;\n\n /** Controls icon `width` and `height`, numbers are converted to rem @default 40 */\n iconSize?: number | string;\n\n /** Key of `theme.colors` or any valid CSS color @default theme.primaryColor */\n color?: MantineColor;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Reference to a cited quote */\n cite?: React.ReactNode;\n\n /** Controls `text-wrap` CSS property */\n textWrap?: 'wrap' | 'nowrap' | 'balance' | 'pretty' | 'stable';\n}\n\nexport type BlockquoteFactory = Factory<{\n props: BlockquoteProps;\n ref: HTMLQuoteElement;\n stylesNames: BlockquoteStylesNames;\n vars: BlockquoteCssVariables;\n}>;\n\nconst defaultProps = {\n iconSize: 48,\n} satisfies Partial<BlockquoteProps>;\n\nconst varsResolver = createVarsResolver<BlockquoteFactory>(\n (theme, { color, iconSize, radius, textWrap }) => {\n const darkParsed = parseThemeColor({\n color: color || theme.primaryColor,\n theme,\n colorScheme: 'dark',\n });\n\n const lightParsed = parseThemeColor({\n color: color || theme.primaryColor,\n theme,\n colorScheme: 'light',\n });\n\n return {\n root: {\n '--bq-bg-light': rgba(lightParsed.value, 0.07),\n '--bq-bg-dark': rgba(darkParsed.value, 0.06),\n '--bq-bd': getThemeColor(color, theme),\n '--bq-icon-size': rem(iconSize),\n '--bq-radius': getRadius(radius),\n '--bq-text-wrap': textWrap,\n },\n };\n }\n);\n\nexport const Blockquote = factory<BlockquoteFactory>((_props) => {\n const props = useProps('Blockquote', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n icon,\n iconSize,\n cite,\n textWrap,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<BlockquoteFactory>({\n name: 'Blockquote',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Box component=\"blockquote\" {...getStyles('root')} {...others}>\n {icon && <span {...getStyles('icon')}>{icon}</span>}\n {children}\n {cite && <cite {...getStyles('cite')}>{cite}</cite>}\n </Box>\n );\n});\n\nBlockquote.classes = classes;\nBlockquote.varsResolver = varsResolver;\nBlockquote.displayName = '@mantine/core/Blockquote';\n\nexport namespace Blockquote {\n export type Props = BlockquoteProps;\n export type StylesNames = BlockquoteStylesNames;\n export type CssVariables = BlockquoteCssVariables;\n export type Factory = BlockquoteFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;AA2DA,MAAM,eAAe,EACnB,UAAU,GACZ;AAEA,MAAM,eAAe,oBAClB,OAAO,EAAE,OAAO,UAAU,QAAQ,eAAe;CAChD,MAAM,aAAa,gBAAgB;EACjC,OAAO,SAAS,MAAM;EACtB;EACA,aAAa;CACf,CAAC;CAQD,OAAO,EACL,MAAM;EACJ,iBAAiB,KARD,gBAAgB;GAClC,OAAO,SAAS,MAAM;GACtB;GACA,aAAa;EACf,CAIoC,
|
|
1
|
+
{"version":3,"file":"Blockquote.mjs","names":["classes"],"sources":["../../../src/components/Blockquote/Blockquote.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getRadius,\n getThemeColor,\n MantineColor,\n MantineRadius,\n parseThemeColor,\n rem,\n rgba,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Blockquote.module.css';\n\nexport type BlockquoteStylesNames = 'root' | 'icon' | 'cite';\nexport type BlockquoteCssVariables = {\n root:\n | '--bq-bg-light'\n | '--bq-bg-dark'\n | '--bq-bd'\n | '--bq-icon-size'\n | '--bq-radius'\n | '--bq-text-wrap';\n};\n\nexport interface BlockquoteProps\n extends BoxProps, StylesApiProps<BlockquoteFactory>, ElementProps<'blockquote', 'cite'> {\n /** Blockquote icon, displayed at the top left side */\n icon?: React.ReactNode;\n\n /** Controls icon `width` and `height`, numbers are converted to rem @default 40 */\n iconSize?: number | string;\n\n /** Key of `theme.colors` or any valid CSS color @default theme.primaryColor */\n color?: MantineColor;\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Reference to a cited quote */\n cite?: React.ReactNode;\n\n /** Controls `text-wrap` CSS property */\n textWrap?: 'wrap' | 'nowrap' | 'balance' | 'pretty' | 'stable';\n}\n\nexport type BlockquoteFactory = Factory<{\n props: BlockquoteProps;\n ref: HTMLQuoteElement;\n stylesNames: BlockquoteStylesNames;\n vars: BlockquoteCssVariables;\n}>;\n\nconst defaultProps = {\n iconSize: 48,\n} satisfies Partial<BlockquoteProps>;\n\nconst varsResolver = createVarsResolver<BlockquoteFactory>(\n (theme, { color, iconSize, radius, textWrap }) => {\n const darkParsed = parseThemeColor({\n color: color || theme.primaryColor,\n theme,\n colorScheme: 'dark',\n });\n\n const lightParsed = parseThemeColor({\n color: color || theme.primaryColor,\n theme,\n colorScheme: 'light',\n });\n\n return {\n root: {\n '--bq-bg-light': rgba(lightParsed.value, 0.07),\n '--bq-bg-dark': rgba(darkParsed.value, 0.06),\n '--bq-bd': getThemeColor(color, theme),\n '--bq-icon-size': rem(iconSize),\n '--bq-radius': getRadius(radius),\n '--bq-text-wrap': textWrap,\n },\n };\n }\n);\n\nexport const Blockquote = factory<BlockquoteFactory>((_props) => {\n const props = useProps('Blockquote', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n icon,\n iconSize,\n cite,\n textWrap,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<BlockquoteFactory>({\n name: 'Blockquote',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <Box component=\"blockquote\" {...getStyles('root')} {...others}>\n {icon && <span {...getStyles('icon')}>{icon}</span>}\n {children}\n {cite && <cite {...getStyles('cite')}>{cite}</cite>}\n </Box>\n );\n});\n\nBlockquote.classes = classes;\nBlockquote.varsResolver = varsResolver;\nBlockquote.displayName = '@mantine/core/Blockquote';\n\nexport namespace Blockquote {\n export type Props = BlockquoteProps;\n export type StylesNames = BlockquoteStylesNames;\n export type CssVariables = BlockquoteCssVariables;\n export type Factory = BlockquoteFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;AA2DA,MAAM,eAAe,EACnB,UAAU,GACZ;AAEA,MAAM,eAAe,oBAClB,OAAO,EAAE,OAAO,UAAU,QAAQ,eAAe;CAChD,MAAM,aAAa,gBAAgB;EACjC,OAAO,SAAS,MAAM;EACtB;EACA,aAAa;CACf,CAAC;CAQD,OAAO,EACL,MAAM;EACJ,iBAAiB,KARD,gBAAgB;GAClC,OAAO,SAAS,MAAM;GACtB;GACA,aAAa;EACf,CAIoC,CAAC,CAAC,OAAO,GAAI;EAC7C,gBAAgB,KAAK,WAAW,OAAO,GAAI;EAC3C,WAAW,cAAc,OAAO,KAAK;EACrC,kBAAkB,IAAI,QAAQ;EAC9B,eAAe,UAAU,MAAM;EAC/B,kBAAkB;CACpB,EACF;AACF,CACF;AAEA,MAAa,aAAa,SAA4B,WAAW;CAC/D,MAAM,QAAQ,SAAS,cAAc,cAAc,MAAM;CACzD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,MACA,UACA,MACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA6B;EAC7C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,qBAAC,KAAD;EAAK,WAAU;EAAa,GAAI,UAAU,MAAM;EAAG,GAAI;YAAvD;GACG,QAAQ,oBAAC,QAAD;IAAM,GAAI,UAAU,MAAM;cAAI;GAAW,CAAA;GACjD;GACA,QAAQ,oBAAC,QAAD;IAAM,GAAI,UAAU,MAAM;cAAI;GAAW,CAAA;EAC/C;;AAET,CAAC;AAED,WAAW,UAAUA;AACrB,WAAW,eAAe;AAC1B,WAAW,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Breadcrumbs.mjs","names":["classes"],"sources":["../../../src/components/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import { Children, cloneElement } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n isElement,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Breadcrumbs.module.css';\n\nexport type BreadcrumbsStylesNames = 'root' | 'separator' | 'breadcrumb';\nexport type BreadcrumbsCssVariables = {\n root: '--bc-separator-margin';\n};\n\nexport interface BreadcrumbsProps\n extends BoxProps, StylesApiProps<BreadcrumbsFactory>, ElementProps<'div'> {\n /** Separator between children @default '/' */\n separator?: React.ReactNode;\n\n /** Controls spacing between separator and breadcrumb @default 'xs' */\n separatorMargin?: MantineSpacing;\n\n /** React nodes that should be separated with `separator` */\n children: React.ReactNode;\n}\n\nexport type BreadcrumbsFactory = Factory<{\n props: BreadcrumbsProps;\n ref: HTMLDivElement;\n stylesNames: BreadcrumbsStylesNames;\n vars: BreadcrumbsCssVariables;\n}>;\n\nconst defaultProps = {\n separator: '/',\n} satisfies Partial<BreadcrumbsProps>;\n\nconst varsResolver = createVarsResolver<BreadcrumbsFactory>((_, { separatorMargin }) => ({\n root: {\n '--bc-separator-margin': getSpacing(separatorMargin),\n },\n}));\n\nexport const Breadcrumbs = factory<BreadcrumbsFactory>((_props) => {\n const props = useProps('Breadcrumbs', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n separator,\n separatorMargin,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<BreadcrumbsFactory>({\n name: 'Breadcrumbs',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const items = Children.toArray(children).reduce<React.ReactNode[]>((acc, child, index, array) => {\n const item = isElement(child) ? (\n cloneElement(child, {\n ...getStyles('breadcrumb', { className: (child.props as any)?.className }),\n key: index,\n })\n ) : (\n <div {...getStyles('breadcrumb')} key={index}>\n {child}\n </div>\n );\n\n acc.push(item);\n\n if (index !== array.length - 1) {\n acc.push(\n <Box {...getStyles('separator')} key={`separator-${index}`}>\n {separator}\n </Box>\n );\n }\n\n return acc;\n }, []);\n\n return (\n <Box {...getStyles('root')} {...others}>\n {items}\n </Box>\n );\n});\n\nBreadcrumbs.classes = classes;\nBreadcrumbs.varsResolver = varsResolver;\nBreadcrumbs.displayName = '@mantine/core/Breadcrumbs';\n\nexport namespace Breadcrumbs {\n export type Props = BreadcrumbsProps;\n export type StylesNames = BreadcrumbsStylesNames;\n export type CssVariables = BreadcrumbsCssVariables;\n export type Factory = BreadcrumbsFactory;\n}\n"],"mappings":";;;;;;;;;;;;AAyCA,MAAM,eAAe,EACnB,WAAW,IACb;AAEA,MAAM,eAAe,oBAAwC,GAAG,EAAE,uBAAuB,EACvF,MAAM,EACJ,yBAAyB,WAAW,eAAe,EACrD,EACF,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,MAAM;CAC1D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,WACA,iBACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,QAAQ,SAAS,QAAQ,QAAQ,
|
|
1
|
+
{"version":3,"file":"Breadcrumbs.mjs","names":["classes"],"sources":["../../../src/components/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import { Children, cloneElement } from 'react';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSpacing,\n isElement,\n MantineSpacing,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport classes from './Breadcrumbs.module.css';\n\nexport type BreadcrumbsStylesNames = 'root' | 'separator' | 'breadcrumb';\nexport type BreadcrumbsCssVariables = {\n root: '--bc-separator-margin';\n};\n\nexport interface BreadcrumbsProps\n extends BoxProps, StylesApiProps<BreadcrumbsFactory>, ElementProps<'div'> {\n /** Separator between children @default '/' */\n separator?: React.ReactNode;\n\n /** Controls spacing between separator and breadcrumb @default 'xs' */\n separatorMargin?: MantineSpacing;\n\n /** React nodes that should be separated with `separator` */\n children: React.ReactNode;\n}\n\nexport type BreadcrumbsFactory = Factory<{\n props: BreadcrumbsProps;\n ref: HTMLDivElement;\n stylesNames: BreadcrumbsStylesNames;\n vars: BreadcrumbsCssVariables;\n}>;\n\nconst defaultProps = {\n separator: '/',\n} satisfies Partial<BreadcrumbsProps>;\n\nconst varsResolver = createVarsResolver<BreadcrumbsFactory>((_, { separatorMargin }) => ({\n root: {\n '--bc-separator-margin': getSpacing(separatorMargin),\n },\n}));\n\nexport const Breadcrumbs = factory<BreadcrumbsFactory>((_props) => {\n const props = useProps('Breadcrumbs', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n separator,\n separatorMargin,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<BreadcrumbsFactory>({\n name: 'Breadcrumbs',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const items = Children.toArray(children).reduce<React.ReactNode[]>((acc, child, index, array) => {\n const item = isElement(child) ? (\n cloneElement(child, {\n ...getStyles('breadcrumb', { className: (child.props as any)?.className }),\n key: index,\n })\n ) : (\n <div {...getStyles('breadcrumb')} key={index}>\n {child}\n </div>\n );\n\n acc.push(item);\n\n if (index !== array.length - 1) {\n acc.push(\n <Box {...getStyles('separator')} key={`separator-${index}`}>\n {separator}\n </Box>\n );\n }\n\n return acc;\n }, []);\n\n return (\n <Box {...getStyles('root')} {...others}>\n {items}\n </Box>\n );\n});\n\nBreadcrumbs.classes = classes;\nBreadcrumbs.varsResolver = varsResolver;\nBreadcrumbs.displayName = '@mantine/core/Breadcrumbs';\n\nexport namespace Breadcrumbs {\n export type Props = BreadcrumbsProps;\n export type StylesNames = BreadcrumbsStylesNames;\n export type CssVariables = BreadcrumbsCssVariables;\n export type Factory = BreadcrumbsFactory;\n}\n"],"mappings":";;;;;;;;;;;;AAyCA,MAAM,eAAe,EACnB,WAAW,IACb;AAEA,MAAM,eAAe,oBAAwC,GAAG,EAAE,uBAAuB,EACvF,MAAM,EACJ,yBAAyB,WAAW,eAAe,EACrD,EACF,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,MAAM;CAC1D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,WACA,iBACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,QAAQ,SAAS,QAAQ,QAAQ,CAAC,CAAC,QAA2B,KAAK,OAAO,OAAO,UAAU;EAC/F,MAAM,OAAO,UAAU,KAAK,IAC1B,aAAa,OAAO;GAClB,GAAG,UAAU,cAAc,EAAE,WAAY,MAAM,OAAe,UAAU,CAAC;GACzE,KAAK;EACP,CAAC,IAED,8BAAC,OAAD;GAAK,GAAI,UAAU,YAAY;GAAG,KAAK;EAElC,GADF,KACE;EAGP,IAAI,KAAK,IAAI;EAEb,IAAI,UAAU,MAAM,SAAS,GAC3B,IAAI,KACF,8BAAC,KAAD;GAAK,GAAI,UAAU,WAAW;GAAG,KAAK,aAAa;EAE9C,GADF,SACE,CACP;EAGF,OAAO;CACT,GAAG,CAAC,CAAC;CAEL,OACE,oBAAC,KAAD;EAAK,GAAI,UAAU,MAAM;EAAG,GAAI;YAC7B;CACE,CAAA;AAET,CAAC;AAED,YAAY,UAAUA;AACtB,YAAY,eAAe;AAC3B,YAAY,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonGroup.mjs","names":["classes"],"sources":["../../../../src/components/Button/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n factory,\n Factory,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport classes from '../Button.module.css';\n\nexport type ButtonGroupStylesNames = 'group';\nexport type ButtonGroupCssVariables = {\n group: '--button-border-width';\n};\n\nexport interface ButtonGroupProps extends BoxProps, StylesApiProps<ButtonGroupFactory> {\n /** `Button` components */\n children?: React.ReactNode;\n\n /** Orientation of the group @default horizontal */\n orientation?: 'horizontal' | 'vertical';\n\n /** `border-width` of the child `Button` components. Numbers are converted to rem. @default 1 */\n borderWidth?: number | string;\n}\n\nexport type ButtonGroupFactory = Factory<{\n props: ButtonGroupProps;\n ref: HTMLDivElement;\n stylesNames: ButtonGroupStylesNames;\n vars: ButtonGroupCssVariables;\n}>;\n\nconst defaultProps = {\n orientation: 'horizontal',\n} satisfies Partial<ButtonGroupProps>;\n\nconst varsResolver = createVarsResolver<ButtonGroupFactory>((_, { borderWidth }) => ({\n group: { '--button-border-width': rem(borderWidth) },\n}));\n\nexport const ButtonGroup = factory<ButtonGroupFactory>((_props) => {\n const props = useProps('ButtonGroup', defaultProps, _props);\n const {\n className,\n style,\n classNames,\n styles,\n unstyled,\n orientation,\n vars,\n borderWidth,\n mod,\n attributes,\n ...others\n } = useProps('ButtonGroup', defaultProps, _props);\n\n const getStyles = useStyles<ButtonGroupFactory>({\n name: 'ButtonGroup',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'group',\n });\n\n return (\n <Box\n {...getStyles('group')}\n mod={[{ 'data-orientation': orientation }, mod]}\n role=\"group\"\n {...others}\n />\n );\n});\n\nButtonGroup.classes = classes;\nButtonGroup.varsResolver = varsResolver;\nButtonGroup.displayName = '@mantine/core/ButtonGroup';\n"],"mappings":";;;;;;;;;;AAoCA,MAAM,eAAe,EACnB,aAAa,aACf;AAEA,MAAM,eAAe,oBAAwC,GAAG,EAAE,mBAAmB,EACnF,OAAO,EAAE,yBAAyB,IAAI,WAAW,EAAE,EACrD,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,MAAM;CAC1D,MAAM,EACJ,WACA,OACA,YACA,QACA,UACA,aACA,MACA,aACA,KACA,YACA,GAAG,WACD,SAAS,eAAe,cAAc,MAAM;CAiBhD,OACE,oBAAC,KAAD;EACE,GAjBc,UAA8B;GAC9C,MAAM;GACN;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;EAChB,CAIgB,
|
|
1
|
+
{"version":3,"file":"ButtonGroup.mjs","names":["classes"],"sources":["../../../../src/components/Button/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n factory,\n Factory,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport classes from '../Button.module.css';\n\nexport type ButtonGroupStylesNames = 'group';\nexport type ButtonGroupCssVariables = {\n group: '--button-border-width';\n};\n\nexport interface ButtonGroupProps extends BoxProps, StylesApiProps<ButtonGroupFactory> {\n /** `Button` components */\n children?: React.ReactNode;\n\n /** Orientation of the group @default horizontal */\n orientation?: 'horizontal' | 'vertical';\n\n /** `border-width` of the child `Button` components. Numbers are converted to rem. @default 1 */\n borderWidth?: number | string;\n}\n\nexport type ButtonGroupFactory = Factory<{\n props: ButtonGroupProps;\n ref: HTMLDivElement;\n stylesNames: ButtonGroupStylesNames;\n vars: ButtonGroupCssVariables;\n}>;\n\nconst defaultProps = {\n orientation: 'horizontal',\n} satisfies Partial<ButtonGroupProps>;\n\nconst varsResolver = createVarsResolver<ButtonGroupFactory>((_, { borderWidth }) => ({\n group: { '--button-border-width': rem(borderWidth) },\n}));\n\nexport const ButtonGroup = factory<ButtonGroupFactory>((_props) => {\n const props = useProps('ButtonGroup', defaultProps, _props);\n const {\n className,\n style,\n classNames,\n styles,\n unstyled,\n orientation,\n vars,\n borderWidth,\n mod,\n attributes,\n ...others\n } = useProps('ButtonGroup', defaultProps, _props);\n\n const getStyles = useStyles<ButtonGroupFactory>({\n name: 'ButtonGroup',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'group',\n });\n\n return (\n <Box\n {...getStyles('group')}\n mod={[{ 'data-orientation': orientation }, mod]}\n role=\"group\"\n {...others}\n />\n );\n});\n\nButtonGroup.classes = classes;\nButtonGroup.varsResolver = varsResolver;\nButtonGroup.displayName = '@mantine/core/ButtonGroup';\n"],"mappings":";;;;;;;;;;AAoCA,MAAM,eAAe,EACnB,aAAa,aACf;AAEA,MAAM,eAAe,oBAAwC,GAAG,EAAE,mBAAmB,EACnF,OAAO,EAAE,yBAAyB,IAAI,WAAW,EAAE,EACrD,EAAE;AAEF,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,cAAc,MAAM;CAC1D,MAAM,EACJ,WACA,OACA,YACA,QACA,UACA,aACA,MACA,aACA,KACA,YACA,GAAG,WACD,SAAS,eAAe,cAAc,MAAM;CAiBhD,OACE,oBAAC,KAAD;EACE,GAjBc,UAA8B;GAC9C,MAAM;GACN;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;EAChB,CAIgB,CAAC,CAAC,OAAO;EACrB,KAAK,CAAC,EAAE,oBAAoB,YAAY,GAAG,GAAG;EAC9C,MAAK;EACL,GAAI;CACL,CAAA;AAEL,CAAC;AAED,YAAY,UAAUA;AACtB,YAAY,eAAe;AAC3B,YAAY,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonGroupSection.mjs","names":["classes"],"sources":["../../../../src/components/Button/ButtonGroupSection/ButtonGroupSection.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getFontSize,\n getRadius,\n getSize,\n MantineGradient,\n MantineRadius,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport type { ButtonSize, ButtonVariant } from '../Button';\nimport classes from '../Button.module.css';\n\nexport type ButtonGroupSectionStylesNames = 'groupSection';\nexport type ButtonGroupSectionCssVariables = {\n groupSection:\n | '--section-radius'\n | '--section-bg'\n | '--section-color'\n | '--section-bd'\n | '--section-height'\n | '--section-padding-x'\n | '--section-fz';\n};\n\nexport interface ButtonGroupSectionProps\n extends BoxProps, StylesApiProps<ButtonGroupSectionFactory>, ElementProps<'div'> {\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Gradient configuration used when `variant=\"gradient\"` @default theme.defaultGradient */\n gradient?: MantineGradient;\n\n /** If set, adjusts text color based on background color for `filled` variant */\n autoContrast?: boolean;\n\n /** Controls section `height`, `font-size` and horizontal `padding` @default 'sm' */\n size?: ButtonSize;\n}\n\nexport type ButtonGroupSectionFactory = Factory<{\n props: ButtonGroupSectionProps;\n ref: HTMLDivElement;\n stylesNames: ButtonGroupSectionStylesNames;\n vars: ButtonGroupSectionCssVariables;\n variant: ButtonVariant;\n}>;\n\nconst varsResolver = createVarsResolver<ButtonGroupSectionFactory>(\n (theme, { radius, color, gradient, variant, autoContrast, size }) => {\n const colors = theme.variantColorResolver({\n color: color || theme.primaryColor,\n theme,\n gradient,\n variant: variant || 'filled',\n autoContrast,\n });\n\n return {\n groupSection: {\n '--section-height': getSize(size, 'section-height'),\n '--section-padding-x': getSize(size, 'section-padding-x'),\n '--section-fz': size?.includes('compact')\n ? getFontSize(size.replace('compact-', ''))\n : getFontSize(size),\n '--section-radius': radius === undefined ? undefined : getRadius(radius),\n '--section-bg': color || variant ? colors.background : undefined,\n '--section-color': colors.color,\n '--section-bd': color || variant ? colors.border : undefined,\n },\n };\n }\n);\n\nexport const ButtonGroupSection = factory<ButtonGroupSectionFactory>((_props) => {\n const props = useProps('ButtonGroupSection', null, _props);\n const {\n className,\n style,\n classNames,\n styles,\n unstyled,\n vars,\n gradient,\n radius,\n autoContrast,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<ButtonGroupSectionFactory>({\n name: 'ButtonGroupSection',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'groupSection',\n });\n\n return <Box {...getStyles('groupSection')} {...others} />;\n});\n\nButtonGroupSection.classes = classes;\nButtonGroupSection.varsResolver = varsResolver;\nButtonGroupSection.displayName = '@mantine/core/ButtonGroupSection';\n"],"mappings":";;;;;;;;;;AAsDA,MAAM,eAAe,oBAClB,OAAO,EAAE,QAAQ,OAAO,UAAU,SAAS,cAAc,WAAW;CACnE,MAAM,SAAS,MAAM,qBAAqB;EACxC,OAAO,SAAS,MAAM;EACtB;EACA;EACA,SAAS,WAAW;EACpB;CACF,CAAC;CAED,OAAO,EACL,cAAc;EACZ,oBAAoB,QAAQ,MAAM,gBAAgB;EAClD,uBAAuB,QAAQ,MAAM,mBAAmB;EACxD,gBAAgB,MAAM,SAAS,SAAS,IACpC,YAAY,KAAK,QAAQ,YAAY,EAAE,CAAC,IACxC,YAAY,IAAI;EACpB,oBAAoB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM;EACvE,gBAAgB,SAAS,UAAU,OAAO,aAAa,KAAA;EACvD,mBAAmB,OAAO;EAC1B,gBAAgB,SAAS,UAAU,OAAO,SAAS,KAAA;CACrD,EACF;AACF,CACF;AAEA,MAAa,qBAAqB,SAAoC,WAAW;CAC/E,MAAM,QAAQ,SAAS,sBAAsB,MAAM,MAAM;CACzD,MAAM,EACJ,WACA,OACA,YACA,QACA,UACA,MACA,UACA,QACA,cACA,YACA,GAAG,WACD;CAiBJ,OAAO,oBAAC,KAAD;EAAK,GAfM,UAAqC;GACrD,MAAM;GACN;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;EAChB,CAEwB,
|
|
1
|
+
{"version":3,"file":"ButtonGroupSection.mjs","names":["classes"],"sources":["../../../../src/components/Button/ButtonGroupSection/ButtonGroupSection.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getFontSize,\n getRadius,\n getSize,\n MantineGradient,\n MantineRadius,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport type { ButtonSize, ButtonVariant } from '../Button';\nimport classes from '../Button.module.css';\n\nexport type ButtonGroupSectionStylesNames = 'groupSection';\nexport type ButtonGroupSectionCssVariables = {\n groupSection:\n | '--section-radius'\n | '--section-bg'\n | '--section-color'\n | '--section-bd'\n | '--section-height'\n | '--section-padding-x'\n | '--section-fz';\n};\n\nexport interface ButtonGroupSectionProps\n extends BoxProps, StylesApiProps<ButtonGroupSectionFactory>, ElementProps<'div'> {\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Gradient configuration used when `variant=\"gradient\"` @default theme.defaultGradient */\n gradient?: MantineGradient;\n\n /** If set, adjusts text color based on background color for `filled` variant */\n autoContrast?: boolean;\n\n /** Controls section `height`, `font-size` and horizontal `padding` @default 'sm' */\n size?: ButtonSize;\n}\n\nexport type ButtonGroupSectionFactory = Factory<{\n props: ButtonGroupSectionProps;\n ref: HTMLDivElement;\n stylesNames: ButtonGroupSectionStylesNames;\n vars: ButtonGroupSectionCssVariables;\n variant: ButtonVariant;\n}>;\n\nconst varsResolver = createVarsResolver<ButtonGroupSectionFactory>(\n (theme, { radius, color, gradient, variant, autoContrast, size }) => {\n const colors = theme.variantColorResolver({\n color: color || theme.primaryColor,\n theme,\n gradient,\n variant: variant || 'filled',\n autoContrast,\n });\n\n return {\n groupSection: {\n '--section-height': getSize(size, 'section-height'),\n '--section-padding-x': getSize(size, 'section-padding-x'),\n '--section-fz': size?.includes('compact')\n ? getFontSize(size.replace('compact-', ''))\n : getFontSize(size),\n '--section-radius': radius === undefined ? undefined : getRadius(radius),\n '--section-bg': color || variant ? colors.background : undefined,\n '--section-color': colors.color,\n '--section-bd': color || variant ? colors.border : undefined,\n },\n };\n }\n);\n\nexport const ButtonGroupSection = factory<ButtonGroupSectionFactory>((_props) => {\n const props = useProps('ButtonGroupSection', null, _props);\n const {\n className,\n style,\n classNames,\n styles,\n unstyled,\n vars,\n gradient,\n radius,\n autoContrast,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<ButtonGroupSectionFactory>({\n name: 'ButtonGroupSection',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n rootSelector: 'groupSection',\n });\n\n return <Box {...getStyles('groupSection')} {...others} />;\n});\n\nButtonGroupSection.classes = classes;\nButtonGroupSection.varsResolver = varsResolver;\nButtonGroupSection.displayName = '@mantine/core/ButtonGroupSection';\n"],"mappings":";;;;;;;;;;AAsDA,MAAM,eAAe,oBAClB,OAAO,EAAE,QAAQ,OAAO,UAAU,SAAS,cAAc,WAAW;CACnE,MAAM,SAAS,MAAM,qBAAqB;EACxC,OAAO,SAAS,MAAM;EACtB;EACA;EACA,SAAS,WAAW;EACpB;CACF,CAAC;CAED,OAAO,EACL,cAAc;EACZ,oBAAoB,QAAQ,MAAM,gBAAgB;EAClD,uBAAuB,QAAQ,MAAM,mBAAmB;EACxD,gBAAgB,MAAM,SAAS,SAAS,IACpC,YAAY,KAAK,QAAQ,YAAY,EAAE,CAAC,IACxC,YAAY,IAAI;EACpB,oBAAoB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM;EACvE,gBAAgB,SAAS,UAAU,OAAO,aAAa,KAAA;EACvD,mBAAmB,OAAO;EAC1B,gBAAgB,SAAS,UAAU,OAAO,SAAS,KAAA;CACrD,EACF;AACF,CACF;AAEA,MAAa,qBAAqB,SAAoC,WAAW;CAC/E,MAAM,QAAQ,SAAS,sBAAsB,MAAM,MAAM;CACzD,MAAM,EACJ,WACA,OACA,YACA,QACA,UACA,MACA,UACA,QACA,cACA,YACA,GAAG,WACD;CAiBJ,OAAO,oBAAC,KAAD;EAAK,GAfM,UAAqC;GACrD,MAAM;GACN;GACA,SAAA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,cAAc;EAChB,CAEwB,CAAC,CAAC,cAAc;EAAG,GAAI;CAAS,CAAA;AAC1D,CAAC;AAED,mBAAmB,UAAUA;AAC7B,mBAAmB,eAAe;AAClC,mBAAmB,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.mjs","names":["useId","classes"],"sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import { use, useEffect, useRef } from 'react';\nimport { useId, useMergedRef } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n extractStyleProps,\n factory,\n Factory,\n getAutoContrastValue,\n getContrastColor,\n getRadius,\n getSize,\n getThemeColor,\n MantineColor,\n MantineRadius,\n MantineSize,\n parseThemeColor,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { InlineInput, InlineInputClasses, InlineInputStylesNames } from '../../utils/InlineInput';\nimport {\n CheckboxCard,\n type CheckboxCardProps,\n type CheckboxCardStylesNames,\n type CheckboxCardCssVariables,\n type CheckboxCardFactory,\n} from './CheckboxCard/CheckboxCard';\nimport {\n CheckboxGroup,\n CheckboxGroupContext,\n type CheckboxGroupProps,\n type CheckboxGroupStylesNames,\n type CheckboxGroupFactory,\n} from './CheckboxGroup/CheckboxGroup';\nimport {\n CheckboxIndicator,\n type CheckboxIndicatorProps,\n type CheckboxIndicatorStylesNames,\n type CheckboxIndicatorCssVariables,\n type CheckboxIndicatorFactory,\n type CheckboxIndicatorVariant,\n} from './CheckboxIndicator/CheckboxIndicator';\nimport { CheckboxIcon } from './CheckIcon';\nimport classes from './Checkbox.module.css';\nexport type CheckboxVariant = 'filled' | 'outline';\nexport type CheckboxStylesNames = 'icon' | 'inner' | 'input' | InlineInputStylesNames;\nexport type CheckboxCssVariables = {\n root: '--checkbox-size' | '--checkbox-radius' | '--checkbox-color' | '--checkbox-icon-color';\n};\n\nexport type CheckboxIconComponent = React.FC<{\n indeterminate: boolean | undefined;\n className: string;\n}>;\n\nexport interface CheckboxProps\n extends BoxProps, StylesApiProps<CheckboxFactory>, ElementProps<'input', 'size' | 'children'> {\n /** Unique input id */\n id?: string;\n\n /** `label` associated with the checkbox */\n label?: React.ReactNode;\n\n /** Key of `theme.colors` or any valid CSS color to set input background color in checked state @default theme.primaryColor */\n color?: MantineColor;\n\n /** Controls size of the component @default 'sm' */\n size?: MantineSize | (string & {});\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Props passed down to the root element */\n wrapperProps?: React.ComponentProps<'div'> & DataAttributes;\n\n /** Position of the label relative to the input @default 'right' */\n labelPosition?: 'left' | 'right';\n\n /** Description below the label */\n description?: React.ReactNode;\n\n /** Error message below the label */\n error?: React.ReactNode;\n\n /** Indeterminate state of the checkbox. If set, `checked` prop is dismissed. */\n indeterminate?: boolean;\n\n /** Icon for checked or indeterminate state */\n icon?: CheckboxIconComponent;\n\n /** Root element ref */\n rootRef?: React.Ref<HTMLDivElement>;\n\n /** Key of `theme.colors` or any valid CSS color to set icon color. By default, depends on `theme.autoContrast`. */\n iconColor?: MantineColor;\n\n /** If set, adjusts icon color based on background color for `filled` variant */\n autoContrast?: boolean;\n\n /** If set, applies error styles to the checkbox when `error` prop is set @default true */\n withErrorStyles?: boolean;\n}\n\nexport type CheckboxFactory = Factory<{\n props: CheckboxProps;\n ref: HTMLInputElement;\n stylesNames: CheckboxStylesNames;\n vars: CheckboxCssVariables;\n variant: CheckboxVariant;\n staticComponents: {\n Group: typeof CheckboxGroup;\n Indicator: typeof CheckboxIndicator;\n Card: typeof CheckboxCard;\n };\n}>;\n\nconst defaultProps = {\n labelPosition: 'right',\n icon: CheckboxIcon,\n withErrorStyles: true,\n variant: 'filled',\n radius: 'sm',\n} satisfies Partial<CheckboxProps>;\n\nconst varsResolver = createVarsResolver<CheckboxFactory>(\n (theme, { radius, color, size, iconColor, variant, autoContrast }) => {\n const parsedColor = parseThemeColor({ color: color || theme.primaryColor, theme });\n const outlineColor =\n parsedColor.isThemeColor && parsedColor.shade === undefined\n ? `var(--mantine-color-${parsedColor.color}-outline)`\n : parsedColor.color;\n\n return {\n root: {\n '--checkbox-size': getSize(size, 'checkbox-size'),\n '--checkbox-radius': radius === undefined ? undefined : getRadius(radius),\n '--checkbox-color': variant === 'outline' ? outlineColor : getThemeColor(color, theme),\n '--checkbox-icon-color': iconColor\n ? getThemeColor(iconColor, theme)\n : getAutoContrastValue(autoContrast, theme)\n ? getContrastColor({ color, theme, autoContrast })\n : undefined,\n },\n };\n }\n);\n\nexport const Checkbox = factory<CheckboxFactory>((_props) => {\n const props = useProps('Checkbox', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n color,\n label,\n id,\n size,\n radius,\n wrapperProps,\n checked,\n labelPosition,\n description,\n error,\n disabled,\n variant,\n indeterminate,\n icon: Icon,\n rootRef,\n iconColor,\n onChange,\n autoContrast,\n mod,\n attributes,\n readOnly,\n onClick,\n withErrorStyles,\n ref,\n ...others\n } = props;\n\n const inputRef = useRef<HTMLInputElement>(null);\n const ctx = use(CheckboxGroupContext);\n const _size = size || ctx?.size;\n\n const getStyles = useStyles<CheckboxFactory>({\n name: 'Checkbox',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const { styleProps, rest } = extractStyleProps(others);\n const uuid = useId(id);\n const descriptionId = description ? `${uuid}-description` : undefined;\n const errorId = error && typeof error !== 'boolean' ? `${uuid}-error` : undefined;\n const describedBy =\n [descriptionId, errorId, rest['aria-describedby']].filter(Boolean).join(' ') || undefined;\n\n const withContextProps = {\n checked: ctx?.value.includes(rest.value as string) ?? checked,\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => {\n if (readOnly) {\n return;\n }\n\n ctx?.onChange(event);\n onChange?.(event);\n },\n };\n\n const isDisabledByGroup = ctx?.isDisabled?.(rest.value as string) ?? false;\n const finalDisabled = disabled || isDisabledByGroup;\n\n useEffect(() => {\n if (inputRef.current) {\n inputRef.current.indeterminate = indeterminate || false;\n\n if (indeterminate) {\n inputRef.current.setAttribute('data-indeterminate', 'true');\n } else {\n inputRef.current.removeAttribute('data-indeterminate');\n }\n }\n }, [indeterminate]);\n\n return (\n <InlineInput\n {...getStyles('root')}\n __staticSelector=\"Checkbox\"\n __stylesApiProps={props}\n id={uuid}\n size={_size}\n labelPosition={labelPosition}\n label={label}\n description={description}\n error={error}\n disabled={finalDisabled}\n classNames={classNames}\n styles={styles}\n unstyled={unstyled}\n data-checked={withContextProps.checked || checked || undefined}\n variant={variant}\n ref={rootRef}\n mod={mod}\n attributes={attributes}\n inert={rest.inert}\n {...styleProps}\n {...wrapperProps}\n >\n <Box {...getStyles('inner')} mod={{ 'data-label-position': labelPosition }}>\n <Box\n component=\"input\"\n id={uuid}\n ref={useMergedRef(inputRef, ref)}\n mod={{ error: !!error, 'with-error-styles': withErrorStyles }}\n {...getStyles('input', { focusable: true, variant })}\n {...rest}\n {...withContextProps}\n aria-describedby={describedBy}\n disabled={finalDisabled}\n inert={rest.inert}\n type=\"checkbox\"\n onClick={(event) => {\n if (readOnly && withContextProps.checked === undefined) {\n event.preventDefault();\n }\n\n onClick?.(event);\n }}\n />\n\n <Icon indeterminate={indeterminate} {...getStyles('icon')} />\n </Box>\n </InlineInput>\n );\n});\n\nCheckbox.classes = { ...classes, ...InlineInputClasses };\nCheckbox.varsResolver = varsResolver;\nCheckbox.displayName = '@mantine/core/Checkbox';\nCheckbox.Group = CheckboxGroup;\nCheckbox.Indicator = CheckboxIndicator;\nCheckbox.Card = CheckboxCard;\n\nexport namespace Checkbox {\n export type Props = CheckboxProps;\n export type StylesNames = CheckboxStylesNames;\n export type CssVariables = CheckboxCssVariables;\n export type Factory = CheckboxFactory;\n export type Variant = CheckboxVariant;\n export type IconComponent = CheckboxIconComponent;\n\n export namespace Group {\n export type Props = CheckboxGroupProps;\n export type StylesNames = CheckboxGroupStylesNames;\n export type Factory = CheckboxGroupFactory;\n }\n\n export namespace Indicator {\n export type Props = CheckboxIndicatorProps;\n export type StylesNames = CheckboxIndicatorStylesNames;\n export type CssVariables = CheckboxIndicatorCssVariables;\n export type Factory = CheckboxIndicatorFactory;\n export type Variant = CheckboxIndicatorVariant;\n }\n\n export namespace Card {\n export type Props = CheckboxCardProps;\n export type StylesNames = CheckboxCardStylesNames;\n export type CssVariables = CheckboxCardCssVariables;\n export type Factory = CheckboxCardFactory;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAyHA,MAAM,eAAe;CACnB,eAAe;CACf,MAAM;CACN,iBAAiB;CACjB,SAAS;CACT,QAAQ;AACV;AAEA,MAAM,eAAe,oBAClB,OAAO,EAAE,QAAQ,OAAO,MAAM,WAAW,SAAS,mBAAmB;CACpE,MAAM,cAAc,gBAAgB;EAAE,OAAO,SAAS,MAAM;EAAc;CAAM,CAAC;CACjF,MAAM,eACJ,YAAY,gBAAgB,YAAY,UAAU,KAAA,IAC9C,uBAAuB,YAAY,MAAM,aACzC,YAAY;CAElB,OAAO,EACL,MAAM;EACJ,mBAAmB,QAAQ,MAAM,eAAe;EAChD,qBAAqB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM;EACxE,oBAAoB,YAAY,YAAY,eAAe,cAAc,OAAO,KAAK;EACrF,yBAAyB,YACrB,cAAc,WAAW,KAAK,IAC9B,qBAAqB,cAAc,KAAK,IACtC,iBAAiB;GAAE;GAAO;GAAO;EAAa,CAAC,IAC/C,KAAA;CACR,EACF;AACF,CACF;AAEA,MAAa,WAAW,SAA0B,WAAW;CAC3D,MAAM,QAAQ,SAAS,YAAY,cAAc,MAAM;CACvD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,OACA,OACA,IACA,MACA,QACA,cACA,SACA,eACA,aACA,OACA,UACA,SACA,eACA,MAAM,MACN,SACA,WACA,UACA,cACA,KACA,YACA,UACA,SACA,iBACA,KACA,GAAG,WACD;CAEJ,MAAM,WAAW,OAAyB,IAAI;CAC9C,MAAM,MAAM,IAAI,oBAAoB;CACpC,MAAM,QAAQ,QAAQ,KAAK;CAE3B,MAAM,YAAY,UAA2B;EAC3C,MAAM;EACN;EACA,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,EAAE,YAAY,SAAS,kBAAkB,MAAM;CACrD,MAAM,OAAOA,QAAM,EAAE;CAGrB,MAAM,cACJ;EAHoB,cAAc,GAAG,KAAK,gBAAgB,KAAA;EAC5C,SAAS,OAAO,UAAU,YAAY,GAAG,KAAK,UAAU,KAAA;EAE7C,KAAK;CAAmB,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,KAAK,KAAA;CAElF,MAAM,mBAAmB;EACvB,SAAS,KAAK,MAAM,SAAS,KAAK,KAAe,KAAK;EACtD,WAAW,UAA+C;GACxD,IAAI,UACF;GAGF,KAAK,SAAS,KAAK;GACnB,WAAW,KAAK;EAClB;CACF;CAEA,MAAM,oBAAoB,KAAK,aAAa,KAAK,KAAe,KAAK;CACrE,MAAM,gBAAgB,YAAY;CAElC,gBAAgB;EACd,IAAI,SAAS,SAAS;GACpB,SAAS,QAAQ,gBAAgB,iBAAiB;GAElD,IAAI,eACF,SAAS,QAAQ,aAAa,sBAAsB,MAAM;QAE1D,SAAS,QAAQ,gBAAgB,oBAAoB;EAEzD;CACF,GAAG,CAAC,aAAa,CAAC;CAElB,OACE,oBAAC,aAAD;EACE,GAAI,UAAU,MAAM;EACpB,kBAAiB;EACjB,kBAAkB;EAClB,IAAI;EACJ,MAAM;EACS;EACR;EACM;EACN;EACP,UAAU;EACE;EACJ;EACE;EACV,gBAAc,iBAAiB,WAAW,WAAW,KAAA;EAC5C;EACT,KAAK;EACA;EACO;EACZ,OAAO,KAAK;EACZ,GAAI;EACJ,GAAI;YAEJ,qBAAC,KAAD;GAAK,GAAI,UAAU,OAAO;GAAG,KAAK,EAAE,uBAAuB,cAAc;aAAzE,CACE,oBAAC,KAAD;IACE,WAAU;IACV,IAAI;IACJ,KAAK,aAAa,UAAU,GAAG;IAC/B,KAAK;KAAE,OAAO,CAAC,CAAC;KAAO,qBAAqB;IAAgB;IAC5D,GAAI,UAAU,SAAS;KAAE,WAAW;KAAM;IAAQ,CAAC;IACnD,GAAI;IACJ,GAAI;IACJ,oBAAkB;IAClB,UAAU;IACV,OAAO,KAAK;IACZ,MAAK;IACL,UAAU,UAAU;KAClB,IAAI,YAAY,iBAAiB,YAAY,KAAA,GAC3C,MAAM,eAAe;KAGvB,UAAU,KAAK;IACjB;GACD,CAAA,GAED,oBAAC,MAAD;IAAqB;IAAe,GAAI,UAAU,MAAM;GAAI,CAAA,CACzD;;CACM,CAAA;AAEjB,CAAC;AAED,SAAS,UAAU;CAAE,GAAGC;CAAS,GAAG;AAAmB;AACvD,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,SAAS,QAAQ;AACjB,SAAS,YAAY;AACrB,SAAS,OAAO"}
|
|
1
|
+
{"version":3,"file":"Checkbox.mjs","names":["useId","classes"],"sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import { use, useEffect, useRef } from 'react';\nimport { useId, useMergedRef } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n createVarsResolver,\n DataAttributes,\n ElementProps,\n extractStyleProps,\n factory,\n Factory,\n getAutoContrastValue,\n getContrastColor,\n getRadius,\n getSize,\n getThemeColor,\n MantineColor,\n MantineRadius,\n MantineSize,\n parseThemeColor,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { InlineInput, InlineInputClasses, InlineInputStylesNames } from '../../utils/InlineInput';\nimport {\n CheckboxCard,\n type CheckboxCardProps,\n type CheckboxCardStylesNames,\n type CheckboxCardCssVariables,\n type CheckboxCardFactory,\n} from './CheckboxCard/CheckboxCard';\nimport {\n CheckboxGroup,\n CheckboxGroupContext,\n type CheckboxGroupProps,\n type CheckboxGroupStylesNames,\n type CheckboxGroupFactory,\n} from './CheckboxGroup/CheckboxGroup';\nimport {\n CheckboxIndicator,\n type CheckboxIndicatorProps,\n type CheckboxIndicatorStylesNames,\n type CheckboxIndicatorCssVariables,\n type CheckboxIndicatorFactory,\n type CheckboxIndicatorVariant,\n} from './CheckboxIndicator/CheckboxIndicator';\nimport { CheckboxIcon } from './CheckIcon';\nimport classes from './Checkbox.module.css';\nexport type CheckboxVariant = 'filled' | 'outline';\nexport type CheckboxStylesNames = 'icon' | 'inner' | 'input' | InlineInputStylesNames;\nexport type CheckboxCssVariables = {\n root: '--checkbox-size' | '--checkbox-radius' | '--checkbox-color' | '--checkbox-icon-color';\n};\n\nexport type CheckboxIconComponent = React.FC<{\n indeterminate: boolean | undefined;\n className: string;\n}>;\n\nexport interface CheckboxProps\n extends BoxProps, StylesApiProps<CheckboxFactory>, ElementProps<'input', 'size' | 'children'> {\n /** Unique input id */\n id?: string;\n\n /** `label` associated with the checkbox */\n label?: React.ReactNode;\n\n /** Key of `theme.colors` or any valid CSS color to set input background color in checked state @default theme.primaryColor */\n color?: MantineColor;\n\n /** Controls size of the component @default 'sm' */\n size?: MantineSize | (string & {});\n\n /** Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius */\n radius?: MantineRadius;\n\n /** Props passed down to the root element */\n wrapperProps?: React.ComponentProps<'div'> & DataAttributes;\n\n /** Position of the label relative to the input @default 'right' */\n labelPosition?: 'left' | 'right';\n\n /** Description below the label */\n description?: React.ReactNode;\n\n /** Error message below the label */\n error?: React.ReactNode;\n\n /** Indeterminate state of the checkbox. If set, `checked` prop is dismissed. */\n indeterminate?: boolean;\n\n /** Icon for checked or indeterminate state */\n icon?: CheckboxIconComponent;\n\n /** Root element ref */\n rootRef?: React.Ref<HTMLDivElement>;\n\n /** Key of `theme.colors` or any valid CSS color to set icon color. By default, depends on `theme.autoContrast`. */\n iconColor?: MantineColor;\n\n /** If set, adjusts icon color based on background color for `filled` variant */\n autoContrast?: boolean;\n\n /** If set, applies error styles to the checkbox when `error` prop is set @default true */\n withErrorStyles?: boolean;\n}\n\nexport type CheckboxFactory = Factory<{\n props: CheckboxProps;\n ref: HTMLInputElement;\n stylesNames: CheckboxStylesNames;\n vars: CheckboxCssVariables;\n variant: CheckboxVariant;\n staticComponents: {\n Group: typeof CheckboxGroup;\n Indicator: typeof CheckboxIndicator;\n Card: typeof CheckboxCard;\n };\n}>;\n\nconst defaultProps = {\n labelPosition: 'right',\n icon: CheckboxIcon,\n withErrorStyles: true,\n variant: 'filled',\n radius: 'sm',\n} satisfies Partial<CheckboxProps>;\n\nconst varsResolver = createVarsResolver<CheckboxFactory>(\n (theme, { radius, color, size, iconColor, variant, autoContrast }) => {\n const parsedColor = parseThemeColor({ color: color || theme.primaryColor, theme });\n const outlineColor =\n parsedColor.isThemeColor && parsedColor.shade === undefined\n ? `var(--mantine-color-${parsedColor.color}-outline)`\n : parsedColor.color;\n\n return {\n root: {\n '--checkbox-size': getSize(size, 'checkbox-size'),\n '--checkbox-radius': radius === undefined ? undefined : getRadius(radius),\n '--checkbox-color': variant === 'outline' ? outlineColor : getThemeColor(color, theme),\n '--checkbox-icon-color': iconColor\n ? getThemeColor(iconColor, theme)\n : getAutoContrastValue(autoContrast, theme)\n ? getContrastColor({ color, theme, autoContrast })\n : undefined,\n },\n };\n }\n);\n\nexport const Checkbox = factory<CheckboxFactory>((_props) => {\n const props = useProps('Checkbox', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n color,\n label,\n id,\n size,\n radius,\n wrapperProps,\n checked,\n labelPosition,\n description,\n error,\n disabled,\n variant,\n indeterminate,\n icon: Icon,\n rootRef,\n iconColor,\n onChange,\n autoContrast,\n mod,\n attributes,\n readOnly,\n onClick,\n withErrorStyles,\n ref,\n ...others\n } = props;\n\n const inputRef = useRef<HTMLInputElement>(null);\n const ctx = use(CheckboxGroupContext);\n const _size = size || ctx?.size;\n\n const getStyles = useStyles<CheckboxFactory>({\n name: 'Checkbox',\n props,\n classes,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n const { styleProps, rest } = extractStyleProps(others);\n const uuid = useId(id);\n const descriptionId = description ? `${uuid}-description` : undefined;\n const errorId = error && typeof error !== 'boolean' ? `${uuid}-error` : undefined;\n const describedBy =\n [descriptionId, errorId, rest['aria-describedby']].filter(Boolean).join(' ') || undefined;\n\n const withContextProps = {\n checked: ctx?.value.includes(rest.value as string) ?? checked,\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => {\n if (readOnly) {\n return;\n }\n\n ctx?.onChange(event);\n onChange?.(event);\n },\n };\n\n const isDisabledByGroup = ctx?.isDisabled?.(rest.value as string) ?? false;\n const finalDisabled = disabled || isDisabledByGroup;\n\n useEffect(() => {\n if (inputRef.current) {\n inputRef.current.indeterminate = indeterminate || false;\n\n if (indeterminate) {\n inputRef.current.setAttribute('data-indeterminate', 'true');\n } else {\n inputRef.current.removeAttribute('data-indeterminate');\n }\n }\n }, [indeterminate]);\n\n return (\n <InlineInput\n {...getStyles('root')}\n __staticSelector=\"Checkbox\"\n __stylesApiProps={props}\n id={uuid}\n size={_size}\n labelPosition={labelPosition}\n label={label}\n description={description}\n error={error}\n disabled={finalDisabled}\n classNames={classNames}\n styles={styles}\n unstyled={unstyled}\n data-checked={withContextProps.checked || checked || undefined}\n variant={variant}\n ref={rootRef}\n mod={mod}\n attributes={attributes}\n inert={rest.inert}\n {...styleProps}\n {...wrapperProps}\n >\n <Box {...getStyles('inner')} mod={{ 'data-label-position': labelPosition }}>\n <Box\n component=\"input\"\n id={uuid}\n ref={useMergedRef(inputRef, ref)}\n mod={{ error: !!error, 'with-error-styles': withErrorStyles }}\n {...getStyles('input', { focusable: true, variant })}\n {...rest}\n {...withContextProps}\n aria-describedby={describedBy}\n disabled={finalDisabled}\n inert={rest.inert}\n type=\"checkbox\"\n onClick={(event) => {\n if (readOnly && withContextProps.checked === undefined) {\n event.preventDefault();\n }\n\n onClick?.(event);\n }}\n />\n\n <Icon indeterminate={indeterminate} {...getStyles('icon')} />\n </Box>\n </InlineInput>\n );\n});\n\nCheckbox.classes = { ...classes, ...InlineInputClasses };\nCheckbox.varsResolver = varsResolver;\nCheckbox.displayName = '@mantine/core/Checkbox';\nCheckbox.Group = CheckboxGroup;\nCheckbox.Indicator = CheckboxIndicator;\nCheckbox.Card = CheckboxCard;\n\nexport namespace Checkbox {\n export type Props = CheckboxProps;\n export type StylesNames = CheckboxStylesNames;\n export type CssVariables = CheckboxCssVariables;\n export type Factory = CheckboxFactory;\n export type Variant = CheckboxVariant;\n export type IconComponent = CheckboxIconComponent;\n\n export namespace Group {\n export type Props = CheckboxGroupProps;\n export type StylesNames = CheckboxGroupStylesNames;\n export type Factory = CheckboxGroupFactory;\n }\n\n export namespace Indicator {\n export type Props = CheckboxIndicatorProps;\n export type StylesNames = CheckboxIndicatorStylesNames;\n export type CssVariables = CheckboxIndicatorCssVariables;\n export type Factory = CheckboxIndicatorFactory;\n export type Variant = CheckboxIndicatorVariant;\n }\n\n export namespace Card {\n export type Props = CheckboxCardProps;\n export type StylesNames = CheckboxCardStylesNames;\n export type CssVariables = CheckboxCardCssVariables;\n export type Factory = CheckboxCardFactory;\n }\n}\n"],"mappings":"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"}
|
|
@@ -35,11 +35,15 @@ const Collapse = factory((props) => {
|
|
|
35
35
|
mode: expanded ? "visible" : "hidden",
|
|
36
36
|
children: /* @__PURE__ */ jsx(Box, {
|
|
37
37
|
...others,
|
|
38
|
+
style,
|
|
39
|
+
ref,
|
|
38
40
|
children
|
|
39
41
|
})
|
|
40
42
|
});
|
|
41
43
|
return expanded ? /* @__PURE__ */ jsx(Box, {
|
|
42
44
|
...others,
|
|
45
|
+
style,
|
|
46
|
+
ref,
|
|
43
47
|
children
|
|
44
48
|
}) : null;
|
|
45
49
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Collapse.mjs","names":[],"sources":["../../../src/components/Collapse/Collapse.tsx"],"sourcesContent":["import { Activity } from 'react';\nimport { useCollapse, useHorizontalCollapse, useReducedMotion } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n Factory,\n factory,\n getStyleObject,\n useMantineEnv,\n useMantineTheme,\n useProps,\n} from '../../core';\n\nexport interface CollapseProps extends BoxProps, Omit<React.ComponentProps<'div'>, keyof BoxProps> {\n /** Collapse orientation @default 'vertical' */\n orientation?: 'vertical' | 'horizontal';\n\n /** Expanded state */\n expanded: boolean;\n\n /** Called when the transition ends */\n onTransitionEnd?: () => void;\n\n /** Called when transition starts */\n onTransitionStart?: () => void;\n\n /** Transition duration in ms @default 200 */\n transitionDuration?: number;\n\n /** Transition timing function @default ease */\n transitionTimingFunction?: string;\n\n /** Determines whether the opacity is animated @default true */\n animateOpacity?: boolean;\n\n /** If set, the element is kept in the DOM when collapsed. When `true`, React 19 `Activity` is used to preserve state while collapsed. When `false`, the element is unmounted after the exit animation. @default true */\n keepMounted?: boolean;\n}\n\nexport type CollapseFactory = Factory<{\n props: CollapseProps;\n ref: HTMLDivElement;\n}>;\n\nconst defaultProps = {\n transitionDuration: 200,\n transitionTimingFunction: 'ease',\n animateOpacity: true,\n orientation: 'vertical',\n keepMounted: true,\n} satisfies Partial<CollapseProps>;\n\nexport const Collapse = factory<CollapseFactory>((props) => {\n const {\n children,\n expanded,\n transitionDuration,\n transitionTimingFunction,\n style,\n onTransitionEnd,\n onTransitionStart,\n animateOpacity,\n keepMounted,\n ref,\n orientation,\n ...others\n } = useProps('Collapse', defaultProps, props);\n\n const env = useMantineEnv();\n const theme = useMantineTheme();\n const shouldReduceMotion = useReducedMotion();\n const reduceMotion = theme.respectReducedMotion ? shouldReduceMotion : false;\n const duration = reduceMotion ? 0 : transitionDuration;\n const hook = orientation === 'horizontal' ? useHorizontalCollapse : useCollapse;\n\n const collapse = hook({\n expanded,\n transitionDuration: duration,\n transitionTimingFunction,\n onTransitionEnd,\n onTransitionStart,\n keepMounted: false,\n });\n\n if (duration === 0) {\n if (keepMounted === true && env !== 'test') {\n return (\n <Activity mode={expanded ? 'visible' : 'hidden'}>\n <Box {...others}
|
|
1
|
+
{"version":3,"file":"Collapse.mjs","names":[],"sources":["../../../src/components/Collapse/Collapse.tsx"],"sourcesContent":["import { Activity } from 'react';\nimport { useCollapse, useHorizontalCollapse, useReducedMotion } from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n Factory,\n factory,\n getStyleObject,\n useMantineEnv,\n useMantineTheme,\n useProps,\n} from '../../core';\n\nexport interface CollapseProps extends BoxProps, Omit<React.ComponentProps<'div'>, keyof BoxProps> {\n /** Collapse orientation @default 'vertical' */\n orientation?: 'vertical' | 'horizontal';\n\n /** Expanded state */\n expanded: boolean;\n\n /** Called when the transition ends */\n onTransitionEnd?: () => void;\n\n /** Called when transition starts */\n onTransitionStart?: () => void;\n\n /** Transition duration in ms @default 200 */\n transitionDuration?: number;\n\n /** Transition timing function @default ease */\n transitionTimingFunction?: string;\n\n /** Determines whether the opacity is animated @default true */\n animateOpacity?: boolean;\n\n /** If set, the element is kept in the DOM when collapsed. When `true`, React 19 `Activity` is used to preserve state while collapsed. When `false`, the element is unmounted after the exit animation. @default true */\n keepMounted?: boolean;\n}\n\nexport type CollapseFactory = Factory<{\n props: CollapseProps;\n ref: HTMLDivElement;\n}>;\n\nconst defaultProps = {\n transitionDuration: 200,\n transitionTimingFunction: 'ease',\n animateOpacity: true,\n orientation: 'vertical',\n keepMounted: true,\n} satisfies Partial<CollapseProps>;\n\nexport const Collapse = factory<CollapseFactory>((props) => {\n const {\n children,\n expanded,\n transitionDuration,\n transitionTimingFunction,\n style,\n onTransitionEnd,\n onTransitionStart,\n animateOpacity,\n keepMounted,\n ref,\n orientation,\n ...others\n } = useProps('Collapse', defaultProps, props);\n\n const env = useMantineEnv();\n const theme = useMantineTheme();\n const shouldReduceMotion = useReducedMotion();\n const reduceMotion = theme.respectReducedMotion ? shouldReduceMotion : false;\n const duration = reduceMotion ? 0 : transitionDuration;\n const hook = orientation === 'horizontal' ? useHorizontalCollapse : useCollapse;\n\n const collapse = hook({\n expanded,\n transitionDuration: duration,\n transitionTimingFunction,\n onTransitionEnd,\n onTransitionStart,\n keepMounted: false,\n });\n\n if (duration === 0) {\n if (keepMounted === true && env !== 'test') {\n return (\n <Activity mode={expanded ? 'visible' : 'hidden'}>\n <Box {...others} style={style} ref={ref}>\n {children}\n </Box>\n </Activity>\n );\n }\n\n return expanded ? (\n <Box {...others} style={style} ref={ref}>\n {children}\n </Box>\n ) : null;\n }\n\n const isExited = collapse.state === 'exited';\n\n let content: React.ReactNode;\n if (keepMounted === false) {\n content = isExited ? null : children;\n } else if (keepMounted === true) {\n content = <Activity mode={isExited ? 'hidden' : 'visible'}>{children}</Activity>;\n } else {\n content = children;\n }\n\n return (\n <Box\n {...others}\n {...collapse.getCollapseProps({\n style: {\n opacity: expanded || !animateOpacity ? 1 : 0,\n transition: animateOpacity ? `opacity ${duration}ms ${transitionTimingFunction}` : 'none',\n ...getStyleObject(style, theme),\n },\n ref,\n })}\n >\n {content}\n </Box>\n );\n});\n\nCollapse.displayName = '@mantine/core/Collapse';\n\nexport namespace Collapse {\n export type Props = CollapseProps;\n export type Factory = CollapseFactory;\n}\n"],"mappings":";;;;;;;;;;;AA4CA,MAAM,eAAe;CACnB,oBAAoB;CACpB,0BAA0B;CAC1B,gBAAgB;CAChB,aAAa;CACb,aAAa;AACf;AAEA,MAAa,WAAW,SAA0B,UAAU;CAC1D,MAAM,EACJ,UACA,UACA,oBACA,0BACA,OACA,iBACA,mBACA,gBACA,aACA,KACA,aACA,GAAG,WACD,SAAS,YAAY,cAAc,KAAK;CAE5C,MAAM,MAAM,cAAc;CAC1B,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,qBAAqB,iBAAiB;CAE5C,MAAM,YADe,MAAM,uBAAuB,qBAAqB,SACvC,IAAI;CAGpC,MAAM,YAFO,gBAAgB,eAAe,wBAAwB,YAAA,CAE9C;EACpB;EACA,oBAAoB;EACpB;EACA;EACA;EACA,aAAa;CACf,CAAC;CAED,IAAI,aAAa,GAAG;EAClB,IAAI,gBAAgB,QAAQ,QAAQ,QAClC,OACE,oBAAC,UAAD;GAAU,MAAM,WAAW,YAAY;aACrC,oBAAC,KAAD;IAAK,GAAI;IAAe;IAAY;IACjC;GACE,CAAA;EACG,CAAA;EAId,OAAO,WACL,oBAAC,KAAD;GAAK,GAAI;GAAe;GAAY;GACjC;EACE,CAAA,IACH;CACN;CAEA,MAAM,WAAW,SAAS,UAAU;CAEpC,IAAI;CACJ,IAAI,gBAAgB,OAClB,UAAU,WAAW,OAAO;MACvB,IAAI,gBAAgB,MACzB,UAAU,oBAAC,UAAD;EAAU,MAAM,WAAW,WAAW;EAAY;CAAmB,CAAA;MAE/E,UAAU;CAGZ,OACE,oBAAC,KAAD;EACE,GAAI;EACJ,GAAI,SAAS,iBAAiB;GAC5B,OAAO;IACL,SAAS,YAAY,CAAC,iBAAiB,IAAI;IAC3C,YAAY,iBAAiB,WAAW,SAAS,KAAK,6BAA6B;IACnF,GAAG,eAAe,OAAO,KAAK;GAChC;GACA;EACF,CAAC;YAEA;CACE,CAAA;AAET,CAAC;AAED,SAAS,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColorInput.mjs","names":["classes"],"sources":["../../../src/components/ColorInput/ColorInput.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { useDidUpdate, useEyeDropper, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport { ActionIcon } from '../ActionIcon';\nimport {\n __ColorPickerProps,\n ColorPicker,\n ColorPickerStylesNames,\n convertHsvaTo,\n isColorValid,\n parseColor,\n} from '../ColorPicker';\nimport { ColorSwatch } from '../ColorSwatch';\nimport { __BaseInputProps, __InputStylesNames, Input, InputVariant, useInputProps } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { Popover, PopoverProps } from '../Popover';\nimport { EyeDropperIcon } from './EyeDropperIcon';\nimport classes from './ColorInput.module.css';\n\nexport type ColorInputStylesNames =\n | 'dropdown'\n | 'eyeDropperButton'\n | 'eyeDropperIcon'\n | 'colorPreview'\n | ColorPickerStylesNames\n | __InputStylesNames;\n\nexport type ColorInputCssVariables = {\n eyeDropperIcon: '--ci-eye-dropper-icon-size';\n eyeDropperButton: '--ci-button-size';\n colorPreview: '--ci-preview-size';\n};\n\nexport interface ColorInputProps\n extends\n BoxProps,\n __BaseInputProps,\n __ColorPickerProps,\n StylesApiProps<ColorInputFactory>,\n ElementProps<'input', 'size' | 'onChange' | 'value' | 'defaultValue'> {\n /** If input is not allowed, the user can only pick value with color picker and swatches */\n disallowInput?: boolean;\n\n /** If set, the input value resets to the last known valid value when the input loses focus @default true */\n fixOnBlur?: boolean;\n\n /** Props passed down to the `Popover` component */\n popoverProps?: PopoverProps;\n\n /** If set, the preview color swatch is displayed in the left section of the input @default true */\n withPreview?: boolean;\n\n /** If set, the eye dropper button is displayed in the right section @default true */\n withEyeDropper?: boolean;\n\n /** An icon to replace the default eye dropper icon */\n eyeDropperIcon?: React.ReactNode;\n\n /** If set, the dropdown is closed when one of the color swatches is clicked @default false */\n closeOnColorSwatchClick?: boolean;\n\n /** Props passed down to the eye dropper button */\n eyeDropperButtonProps?: Record<string, any>;\n}\n\nexport type ColorInputFactory = Factory<{\n props: ColorInputProps;\n ref: HTMLInputElement;\n stylesNames: ColorInputStylesNames;\n vars: ColorInputCssVariables;\n variant: InputVariant;\n}>;\n\nconst defaultProps = {\n format: 'hex',\n fixOnBlur: true,\n withPreview: true,\n swatchesPerRow: 7,\n withPicker: true,\n popoverProps: { transitionProps: { transition: 'fade', duration: 0 } },\n withEyeDropper: true,\n size: 'sm',\n leftSectionPointerEvents: 'none',\n} satisfies Partial<ColorInputProps>;\n\nconst varsResolver = createVarsResolver<ColorInputFactory>((_, { size }) => ({\n eyeDropperIcon: {\n '--ci-eye-dropper-icon-size': getSize(size, 'ci-eye-dropper-icon-size'),\n },\n\n eyeDropperButton: {\n '--ci-button-size': getSize(size, 'ci-button-size'),\n },\n\n colorPreview: {\n '--ci-preview-size': getSize(size, 'ci-preview-size'),\n },\n}));\n\nexport const ColorInput = factory<ColorInputFactory>((_props) => {\n const props = useProps(['Input', 'InputWrapper', 'ColorInput'], defaultProps, _props);\n const {\n classNames,\n styles,\n unstyled,\n disallowInput,\n fixOnBlur,\n popoverProps,\n withPreview,\n withEyeDropper,\n eyeDropperIcon,\n closeOnColorSwatchClick,\n eyeDropperButtonProps,\n value,\n defaultValue,\n onChange,\n onChangeEnd,\n onClick,\n onFocus,\n onBlur,\n inputProps,\n format = 'hex',\n wrapperProps,\n readOnly,\n withPicker,\n swatches,\n disabled,\n leftSection,\n rightSection,\n swatchesPerRow,\n ...others\n } = useInputProps('ColorInput', defaultProps, _props);\n\n const getStyles = useStyles<ColorInputFactory>({\n name: 'ColorInput',\n props,\n classes,\n classNames,\n styles,\n unstyled,\n rootSelector: 'wrapper',\n vars: props.vars,\n varsResolver,\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<ColorInputFactory>({\n classNames,\n styles,\n props,\n });\n\n const [dropdownOpened, setDropdownOpened] = useState(false);\n const [lastValidValue, setLastValidValue] = useState('');\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: '',\n onChange,\n });\n\n const { supported: eyeDropperSupported, open: openEyeDropper } = useEyeDropper();\n\n const eyeDropper = (\n <ActionIcon\n {...eyeDropperButtonProps}\n {...getStyles('eyeDropperButton', {\n className: eyeDropperButtonProps?.className,\n style: eyeDropperButtonProps?.style,\n })}\n variant=\"subtle\"\n color=\"gray\"\n unstyled={unstyled}\n onClick={() =>\n openEyeDropper()\n .then((payload) => {\n if (payload?.sRGBHex) {\n const color = convertHsvaTo(format, parseColor(payload.sRGBHex));\n setValue(color);\n onChangeEnd?.(color);\n }\n })\n .catch(() => {})\n }\n >\n {eyeDropperIcon || <EyeDropperIcon {...getStyles('eyeDropperIcon')} />}\n </ActionIcon>\n );\n\n const handleInputFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n onFocus?.(event);\n setDropdownOpened(true);\n };\n\n const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n fixOnBlur && setValue(lastValidValue);\n onBlur?.(event);\n setDropdownOpened(false);\n };\n\n const handleInputClick = (event: React.MouseEvent<HTMLInputElement>) => {\n onClick?.(event);\n setDropdownOpened(true);\n };\n\n useEffect(() => {\n if (isColorValid(_value) || _value.trim() === '') {\n setLastValidValue(_value);\n }\n }, [_value]);\n\n useDidUpdate(() => {\n if (isColorValid(_value)) {\n setValue(convertHsvaTo(format, parseColor(_value)));\n }\n }, [format]);\n\n return (\n <Input.Wrapper\n {...wrapperProps}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n __staticSelector=\"ColorInput\"\n >\n <Popover\n __staticSelector=\"ColorInput\"\n position=\"bottom-start\"\n offset={5}\n opened={dropdownOpened}\n {...popoverProps}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n withRoles={false}\n disabled={\n readOnly || (withPicker === false && (!Array.isArray(swatches) || swatches.length === 0))\n }\n >\n <Popover.Target>\n <Input<'input'>\n autoComplete=\"off\"\n {...others}\n {...inputProps}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n disabled={disabled}\n __staticSelector=\"ColorInput\"\n onFocus={handleInputFocus}\n onBlur={handleInputBlur}\n onClick={handleInputClick}\n spellCheck={false}\n value={_value}\n onChange={(event) => {\n const inputValue = event.currentTarget.value;\n setValue(inputValue);\n if (isColorValid(inputValue)) {\n onChangeEnd?.(convertHsvaTo(format, parseColor(inputValue)));\n }\n }}\n leftSection={\n leftSection ||\n (withPreview ? (\n <ColorSwatch\n color={isColorValid(_value) ? _value : '#fff'}\n size=\"var(--ci-preview-size)\"\n {...getStyles('colorPreview')}\n />\n ) : null)\n }\n readOnly={disallowInput || readOnly}\n pointer={disallowInput}\n unstyled={unstyled}\n rightSection={\n rightSection ||\n (withEyeDropper && !disabled && !readOnly && eyeDropperSupported ? eyeDropper : null)\n }\n />\n </Popover.Target>\n\n <Popover.Dropdown\n onMouseDown={(event) => event.preventDefault()}\n className={classes.dropdown}\n >\n <ColorPicker\n __staticSelector=\"ColorInput\"\n value={_value}\n onChange={setValue}\n onChangeEnd={onChangeEnd}\n format={format}\n swatches={swatches}\n swatchesPerRow={swatchesPerRow}\n withPicker={withPicker}\n size={inputProps.size}\n focusable={false}\n unstyled={unstyled}\n styles={resolvedStyles}\n classNames={resolvedClassNames}\n onColorSwatchClick={() => closeOnColorSwatchClick && setDropdownOpened(false)}\n attributes={wrapperProps.attributes}\n />\n </Popover.Dropdown>\n </Popover>\n </Input.Wrapper>\n );\n});\n\nColorInput.classes = InputBase.classes;\nColorInput.varsResolver = varsResolver;\nColorInput.displayName = '@mantine/core/ColorInput';\n\nexport namespace ColorInput {\n export type Props = ColorInputProps;\n export type StylesNames = ColorInputStylesNames;\n export type CssVariables = ColorInputCssVariables;\n export type Factory = ColorInputFactory;\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ColorInput.mjs","names":["classes"],"sources":["../../../src/components/ColorInput/ColorInput.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { useDidUpdate, useEyeDropper, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getSize,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport { ActionIcon } from '../ActionIcon';\nimport {\n __ColorPickerProps,\n ColorPicker,\n ColorPickerStylesNames,\n convertHsvaTo,\n isColorValid,\n parseColor,\n} from '../ColorPicker';\nimport { ColorSwatch } from '../ColorSwatch';\nimport { __BaseInputProps, __InputStylesNames, Input, InputVariant, useInputProps } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { Popover, PopoverProps } from '../Popover';\nimport { EyeDropperIcon } from './EyeDropperIcon';\nimport classes from './ColorInput.module.css';\n\nexport type ColorInputStylesNames =\n | 'dropdown'\n | 'eyeDropperButton'\n | 'eyeDropperIcon'\n | 'colorPreview'\n | ColorPickerStylesNames\n | __InputStylesNames;\n\nexport type ColorInputCssVariables = {\n eyeDropperIcon: '--ci-eye-dropper-icon-size';\n eyeDropperButton: '--ci-button-size';\n colorPreview: '--ci-preview-size';\n};\n\nexport interface ColorInputProps\n extends\n BoxProps,\n __BaseInputProps,\n __ColorPickerProps,\n StylesApiProps<ColorInputFactory>,\n ElementProps<'input', 'size' | 'onChange' | 'value' | 'defaultValue'> {\n /** If input is not allowed, the user can only pick value with color picker and swatches */\n disallowInput?: boolean;\n\n /** If set, the input value resets to the last known valid value when the input loses focus @default true */\n fixOnBlur?: boolean;\n\n /** Props passed down to the `Popover` component */\n popoverProps?: PopoverProps;\n\n /** If set, the preview color swatch is displayed in the left section of the input @default true */\n withPreview?: boolean;\n\n /** If set, the eye dropper button is displayed in the right section @default true */\n withEyeDropper?: boolean;\n\n /** An icon to replace the default eye dropper icon */\n eyeDropperIcon?: React.ReactNode;\n\n /** If set, the dropdown is closed when one of the color swatches is clicked @default false */\n closeOnColorSwatchClick?: boolean;\n\n /** Props passed down to the eye dropper button */\n eyeDropperButtonProps?: Record<string, any>;\n}\n\nexport type ColorInputFactory = Factory<{\n props: ColorInputProps;\n ref: HTMLInputElement;\n stylesNames: ColorInputStylesNames;\n vars: ColorInputCssVariables;\n variant: InputVariant;\n}>;\n\nconst defaultProps = {\n format: 'hex',\n fixOnBlur: true,\n withPreview: true,\n swatchesPerRow: 7,\n withPicker: true,\n popoverProps: { transitionProps: { transition: 'fade', duration: 0 } },\n withEyeDropper: true,\n size: 'sm',\n leftSectionPointerEvents: 'none',\n} satisfies Partial<ColorInputProps>;\n\nconst varsResolver = createVarsResolver<ColorInputFactory>((_, { size }) => ({\n eyeDropperIcon: {\n '--ci-eye-dropper-icon-size': getSize(size, 'ci-eye-dropper-icon-size'),\n },\n\n eyeDropperButton: {\n '--ci-button-size': getSize(size, 'ci-button-size'),\n },\n\n colorPreview: {\n '--ci-preview-size': getSize(size, 'ci-preview-size'),\n },\n}));\n\nexport const ColorInput = factory<ColorInputFactory>((_props) => {\n const props = useProps(['Input', 'InputWrapper', 'ColorInput'], defaultProps, _props);\n const {\n classNames,\n styles,\n unstyled,\n disallowInput,\n fixOnBlur,\n popoverProps,\n withPreview,\n withEyeDropper,\n eyeDropperIcon,\n closeOnColorSwatchClick,\n eyeDropperButtonProps,\n value,\n defaultValue,\n onChange,\n onChangeEnd,\n onClick,\n onFocus,\n onBlur,\n inputProps,\n format = 'hex',\n wrapperProps,\n readOnly,\n withPicker,\n swatches,\n disabled,\n leftSection,\n rightSection,\n swatchesPerRow,\n ...others\n } = useInputProps('ColorInput', defaultProps, _props);\n\n const getStyles = useStyles<ColorInputFactory>({\n name: 'ColorInput',\n props,\n classes,\n classNames,\n styles,\n unstyled,\n rootSelector: 'wrapper',\n vars: props.vars,\n varsResolver,\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<ColorInputFactory>({\n classNames,\n styles,\n props,\n });\n\n const [dropdownOpened, setDropdownOpened] = useState(false);\n const [lastValidValue, setLastValidValue] = useState('');\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: '',\n onChange,\n });\n\n const { supported: eyeDropperSupported, open: openEyeDropper } = useEyeDropper();\n\n const eyeDropper = (\n <ActionIcon\n {...eyeDropperButtonProps}\n {...getStyles('eyeDropperButton', {\n className: eyeDropperButtonProps?.className,\n style: eyeDropperButtonProps?.style,\n })}\n variant=\"subtle\"\n color=\"gray\"\n unstyled={unstyled}\n onClick={() =>\n openEyeDropper()\n .then((payload) => {\n if (payload?.sRGBHex) {\n const color = convertHsvaTo(format, parseColor(payload.sRGBHex));\n setValue(color);\n onChangeEnd?.(color);\n }\n })\n .catch(() => {})\n }\n >\n {eyeDropperIcon || <EyeDropperIcon {...getStyles('eyeDropperIcon')} />}\n </ActionIcon>\n );\n\n const handleInputFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n onFocus?.(event);\n setDropdownOpened(true);\n };\n\n const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n fixOnBlur && setValue(lastValidValue);\n onBlur?.(event);\n setDropdownOpened(false);\n };\n\n const handleInputClick = (event: React.MouseEvent<HTMLInputElement>) => {\n onClick?.(event);\n setDropdownOpened(true);\n };\n\n useEffect(() => {\n if (isColorValid(_value) || _value.trim() === '') {\n setLastValidValue(_value);\n }\n }, [_value]);\n\n useDidUpdate(() => {\n if (isColorValid(_value)) {\n setValue(convertHsvaTo(format, parseColor(_value)));\n }\n }, [format]);\n\n return (\n <Input.Wrapper\n {...wrapperProps}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n __staticSelector=\"ColorInput\"\n >\n <Popover\n __staticSelector=\"ColorInput\"\n position=\"bottom-start\"\n offset={5}\n opened={dropdownOpened}\n {...popoverProps}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n withRoles={false}\n disabled={\n readOnly || (withPicker === false && (!Array.isArray(swatches) || swatches.length === 0))\n }\n >\n <Popover.Target>\n <Input<'input'>\n autoComplete=\"off\"\n {...others}\n {...inputProps}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n disabled={disabled}\n __staticSelector=\"ColorInput\"\n onFocus={handleInputFocus}\n onBlur={handleInputBlur}\n onClick={handleInputClick}\n spellCheck={false}\n value={_value}\n onChange={(event) => {\n const inputValue = event.currentTarget.value;\n setValue(inputValue);\n if (isColorValid(inputValue)) {\n onChangeEnd?.(convertHsvaTo(format, parseColor(inputValue)));\n }\n }}\n leftSection={\n leftSection ||\n (withPreview ? (\n <ColorSwatch\n color={isColorValid(_value) ? _value : '#fff'}\n size=\"var(--ci-preview-size)\"\n {...getStyles('colorPreview')}\n />\n ) : null)\n }\n readOnly={disallowInput || readOnly}\n pointer={disallowInput}\n unstyled={unstyled}\n rightSection={\n rightSection ||\n (withEyeDropper && !disabled && !readOnly && eyeDropperSupported ? eyeDropper : null)\n }\n />\n </Popover.Target>\n\n <Popover.Dropdown\n onMouseDown={(event) => event.preventDefault()}\n className={classes.dropdown}\n >\n <ColorPicker\n __staticSelector=\"ColorInput\"\n value={_value}\n onChange={setValue}\n onChangeEnd={onChangeEnd}\n format={format}\n swatches={swatches}\n swatchesPerRow={swatchesPerRow}\n withPicker={withPicker}\n size={inputProps.size}\n focusable={false}\n unstyled={unstyled}\n styles={resolvedStyles}\n classNames={resolvedClassNames}\n onColorSwatchClick={() => closeOnColorSwatchClick && setDropdownOpened(false)}\n attributes={wrapperProps.attributes}\n />\n </Popover.Dropdown>\n </Popover>\n </Input.Wrapper>\n );\n});\n\nColorInput.classes = InputBase.classes;\nColorInput.varsResolver = varsResolver;\nColorInput.displayName = '@mantine/core/ColorInput';\n\nexport namespace ColorInput {\n export type Props = ColorInputProps;\n export type StylesNames = ColorInputStylesNames;\n export type CssVariables = ColorInputCssVariables;\n export type Factory = ColorInputFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAoFA,MAAM,eAAe;CACnB,QAAQ;CACR,WAAW;CACX,aAAa;CACb,gBAAgB;CAChB,YAAY;CACZ,cAAc,EAAE,iBAAiB;EAAE,YAAY;EAAQ,UAAU;CAAE,EAAE;CACrE,gBAAgB;CAChB,MAAM;CACN,0BAA0B;AAC5B;AAEA,MAAM,eAAe,oBAAuC,GAAG,EAAE,YAAY;CAC3E,gBAAgB,EACd,8BAA8B,QAAQ,MAAM,0BAA0B,EACxE;CAEA,kBAAkB,EAChB,oBAAoB,QAAQ,MAAM,gBAAgB,EACpD;CAEA,cAAc,EACZ,qBAAqB,QAAQ,MAAM,iBAAiB,EACtD;AACF,EAAE;AAEF,MAAa,aAAa,SAA4B,WAAW;CAC/D,MAAM,QAAQ,SAAS;EAAC;EAAS;EAAgB;CAAY,GAAG,cAAc,MAAM;CACpF,MAAM,EACJ,YACA,QACA,UACA,eACA,WACA,cACA,aACA,gBACA,gBACA,yBACA,uBACA,OACA,cACA,UACA,aACA,SACA,SACA,QACA,YACA,SAAS,OACT,cACA,UACA,YACA,UACA,UACA,aACA,cACA,gBACA,GAAG,WACD,cAAc,cAAc,cAAc,MAAM;CAEpD,MAAM,YAAY,UAA6B;EAC7C,MAAM;EACN;EACA,SAAA;EACA;EACA;EACA;EACA,cAAc;EACd,MAAM,MAAM;EACZ;CACF,CAAC;CAED,MAAM,EAAE,oBAAoB,mBAAmB,qBAAwC;EACrF;EACA;EACA;CACF,CAAC;CAED,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,KAAK;CAC1D,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,EAAE;CACvD,MAAM,CAAC,QAAQ,YAAY,gBAAgB;EACzC;EACA;EACA,YAAY;EACZ;CACF,CAAC;CAED,MAAM,EAAE,WAAW,qBAAqB,MAAM,mBAAmB,cAAc;CAE/E,MAAM,aACJ,oBAAC,YAAD;EACE,GAAI;EACJ,GAAI,UAAU,oBAAoB;GAChC,WAAW,uBAAuB;GAClC,OAAO,uBAAuB;EAChC,CAAC;EACD,SAAQ;EACR,OAAM;EACI;EACV,eACE,eAAe,CAAC,CACb,MAAM,YAAY;GACjB,IAAI,SAAS,SAAS;IACpB,MAAM,QAAQ,cAAc,QAAQ,WAAW,QAAQ,OAAO,CAAC;IAC/D,SAAS,KAAK;IACd,cAAc,KAAK;GACrB;EACF,CAAC,CAAC,CACD,YAAY,CAAC,CAAC;YAGlB,kBAAkB,oBAAC,gBAAD,EAAgB,GAAI,UAAU,gBAAgB,EAAI,CAAA;CAC3D,CAAA;CAGd,MAAM,oBAAoB,UAA8C;EACtE,UAAU,KAAK;EACf,kBAAkB,IAAI;CACxB;CAEA,MAAM,mBAAmB,UAA8C;EACrE,aAAa,SAAS,cAAc;EACpC,SAAS,KAAK;EACd,kBAAkB,KAAK;CACzB;CAEA,MAAM,oBAAoB,UAA8C;EACtE,UAAU,KAAK;EACf,kBAAkB,IAAI;CACxB;CAEA,gBAAgB;EACd,IAAI,aAAa,MAAM,KAAK,OAAO,KAAK,MAAM,IAC5C,kBAAkB,MAAM;CAE5B,GAAG,CAAC,MAAM,CAAC;CAEX,mBAAmB;EACjB,IAAI,aAAa,MAAM,GACrB,SAAS,cAAc,QAAQ,WAAW,MAAM,CAAC,CAAC;CAEtD,GAAG,CAAC,MAAM,CAAC;CAEX,OACE,oBAAC,MAAM,SAAP;EACE,GAAI;EACJ,YAAY;EACZ,QAAQ;EACR,kBAAiB;YAEjB,qBAAC,SAAD;GACE,kBAAiB;GACjB,UAAS;GACT,QAAQ;GACR,QAAQ;GACR,GAAI;GACJ,YAAY;GACZ,QAAQ;GACE;GACV,WAAW;GACX,UACE,YAAa,eAAe,UAAU,CAAC,MAAM,QAAQ,QAAQ,KAAK,SAAS,WAAW;aAX1F,CAcE,oBAAC,QAAQ,QAAT,EAAA,UACE,oBAAC,OAAD;IACE,cAAa;IACb,GAAI;IACJ,GAAI;IACJ,YAAY;IACZ,QAAQ;IACE;IACV,kBAAiB;IACjB,SAAS;IACT,QAAQ;IACR,SAAS;IACT,YAAY;IACZ,OAAO;IACP,WAAW,UAAU;KACnB,MAAM,aAAa,MAAM,cAAc;KACvC,SAAS,UAAU;KACnB,IAAI,aAAa,UAAU,GACzB,cAAc,cAAc,QAAQ,WAAW,UAAU,CAAC,CAAC;IAE/D;IACA,aACE,gBACC,cACC,oBAAC,aAAD;KACE,OAAO,aAAa,MAAM,IAAI,SAAS;KACvC,MAAK;KACL,GAAI,UAAU,cAAc;IAC7B,CAAA,IACC;IAEN,UAAU,iBAAiB;IAC3B,SAAS;IACC;IACV,cACE,iBACC,kBAAkB,CAAC,YAAY,CAAC,YAAY,sBAAsB,aAAa;GAEnF,CAAA,EACa,CAAA,GAEhB,oBAAC,QAAQ,UAAT;IACE,cAAc,UAAU,MAAM,eAAe;IAC7C,WAAWA,0BAAQ;cAEnB,oBAAC,aAAD;KACE,kBAAiB;KACjB,OAAO;KACP,UAAU;KACG;KACL;KACE;KACM;KACJ;KACZ,MAAM,WAAW;KACjB,WAAW;KACD;KACV,QAAQ;KACR,YAAY;KACZ,0BAA0B,2BAA2B,kBAAkB,KAAK;KAC5E,YAAY,aAAa;IAC1B,CAAA;GACe,CAAA,CACX;;CACI,CAAA;AAEnB,CAAC;AAED,WAAW,UAAU,UAAU;AAC/B,WAAW,eAAe;AAC1B,WAAW,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColorSlider.mjs","names":["classes"],"sources":["../../../../src/components/ColorPicker/ColorSlider/ColorSlider.tsx"],"sourcesContent":["import { use, useRef, useState } from 'react';\nimport {\n clampUseMovePosition,\n useDidUpdate,\n useMergedRef,\n useMove,\n UseMovePosition,\n} from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n ElementProps,\n factory,\n Factory,\n MantineSize,\n rem,\n StylesApiProps,\n useMantineTheme,\n useProps,\n useStyles,\n} from '../../../core';\nimport { ColorPickerContext } from '../ColorPicker.context';\nimport { Thumb } from '../Thumb/Thumb';\nimport classes from '../ColorPicker.module.css';\n\nexport type ColorSliderStylesNames = 'slider' | 'sliderOverlay' | 'thumb';\n\nexport interface __ColorSliderProps extends ElementProps<'div', 'onChange'> {\n /** Controlled component value */\n value: number;\n\n /** Called when value changes */\n onChange?: (value: number) => void;\n\n /** Called when user stops dragging the slider or uses keyboard to change value */\n onChangeEnd?: (value: number) => void;\n\n /** Called when user starts dragging the slider */\n onScrubStart?: () => void;\n\n /** Called when user stops dragging the slider */\n onScrubEnd?: () => void;\n\n /** Slider size @default 'md' */\n size?: MantineSize | (string & {});\n\n /** If set, slider thumb can be focused @default true */\n focusable?: boolean;\n}\n\nexport interface ColorSliderProps\n extends\n BoxProps,\n StylesApiProps<ColorSliderFactory>,\n __ColorSliderProps,\n ElementProps<'div', 'onChange'> {\n __staticSelector?: string;\n maxValue: number;\n overlays: React.CSSProperties[];\n round: boolean;\n thumbColor?: string;\n}\n\nexport type ColorSliderOptions = Omit<\n ColorSliderProps,\n 'maxValue' | 'overlays' | 'round' | 'thumbColor'\n>;\n\nexport type ColorSliderFactory = Factory<{\n props: ColorSliderProps;\n ref: HTMLDivElement;\n stylesNames: ColorSliderStylesNames;\n}>;\n\nexport const ColorSlider = factory<ColorSliderFactory>((_props) => {\n const props = useProps('ColorSlider', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n onChange,\n onChangeEnd,\n maxValue,\n round,\n size = 'md',\n focusable = true,\n value,\n overlays,\n thumbColor = 'transparent',\n onScrubStart,\n onScrubEnd,\n __staticSelector = 'ColorPicker',\n attributes,\n ref,\n ...others\n } = props;\n\n const _getStyles = useStyles<ColorSliderFactory>({\n name: __staticSelector,\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n rootSelector: 'slider',\n });\n\n const ctxGetStyles = use(ColorPickerContext)?.getStyles;\n const getStyles = ctxGetStyles || _getStyles;\n\n const theme = useMantineTheme();\n const [position, setPosition] = useState({ y: 0, x: value / maxValue });\n const positionRef = useRef(position);\n const getChangeValue = (val: number) => (round ? Math.round(val * maxValue) : val * maxValue);\n const { ref: sliderRef } = useMove(\n ({ x, y }) => {\n positionRef.current = { x, y };\n onChange?.(getChangeValue(x));\n },\n {\n onScrubEnd: () => {\n const { x } = positionRef.current;\n onChangeEnd?.(getChangeValue(x));\n onScrubEnd?.();\n },\n onScrubStart,\n }\n );\n\n useDidUpdate(() => {\n setPosition({ y: 0, x: value / maxValue });\n }, [value]);\n\n const handleArrow = (event: React.KeyboardEvent<HTMLDivElement>, pos: UseMovePosition) => {\n event.preventDefault();\n const _position = clampUseMovePosition(pos);\n onChange?.(getChangeValue(_position.x));\n onChangeEnd?.(getChangeValue(_position.x));\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n switch (event.key) {\n case 'ArrowRight': {\n handleArrow(event, { x: position.x + 0.05, y: position.y });\n break;\n }\n\n case 'ArrowLeft': {\n handleArrow(event, { x: position.x - 0.05, y: position.y });\n break;\n }\n }\n };\n\n const layers = overlays.map((overlay, index) => (\n <div {...getStyles('sliderOverlay')} style={overlay} key={index} />\n ));\n\n return (\n <Box\n {...others}\n ref={useMergedRef(sliderRef, ref)}\n {...getStyles('slider')}\n size={size}\n role=\"slider\"\n aria-valuenow={value}\n aria-valuemax={maxValue}\n aria-valuemin={0}\n tabIndex={focusable ? 0 : -1}\n onKeyDown={handleKeyDown}\n data-focus-ring={theme.focusRing}\n __vars={{\n '--cp-thumb-size': `var(--cp-thumb-size-${size})`,\n }}\n >\n {layers}\n\n <Thumb\n position={position}\n {...getStyles('thumb', { style: { top: rem(1), background: thumbColor } })}\n />\n </Box>\n );\n});\n\nColorSlider.displayName = '@mantine/core/ColorSlider';\nColorSlider.classes = classes;\n"],"mappings":";;;;;;;;;;;;;;AA0EA,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,MAAM,MAAM;CAClD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,aACA,UACA,OACA,OAAO,MACP,YAAY,MACZ,OACA,UACA,aAAa,eACb,cACA,YACA,mBAAmB,eACnB,YACA,KACA,GAAG,WACD;CAEJ,MAAM,aAAa,UAA8B;EAC/C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAGD,MAAM,YADe,IAAI,kBAAkB,
|
|
1
|
+
{"version":3,"file":"ColorSlider.mjs","names":["classes"],"sources":["../../../../src/components/ColorPicker/ColorSlider/ColorSlider.tsx"],"sourcesContent":["import { use, useRef, useState } from 'react';\nimport {\n clampUseMovePosition,\n useDidUpdate,\n useMergedRef,\n useMove,\n UseMovePosition,\n} from '@mantine/hooks';\nimport {\n Box,\n BoxProps,\n ElementProps,\n factory,\n Factory,\n MantineSize,\n rem,\n StylesApiProps,\n useMantineTheme,\n useProps,\n useStyles,\n} from '../../../core';\nimport { ColorPickerContext } from '../ColorPicker.context';\nimport { Thumb } from '../Thumb/Thumb';\nimport classes from '../ColorPicker.module.css';\n\nexport type ColorSliderStylesNames = 'slider' | 'sliderOverlay' | 'thumb';\n\nexport interface __ColorSliderProps extends ElementProps<'div', 'onChange'> {\n /** Controlled component value */\n value: number;\n\n /** Called when value changes */\n onChange?: (value: number) => void;\n\n /** Called when user stops dragging the slider or uses keyboard to change value */\n onChangeEnd?: (value: number) => void;\n\n /** Called when user starts dragging the slider */\n onScrubStart?: () => void;\n\n /** Called when user stops dragging the slider */\n onScrubEnd?: () => void;\n\n /** Slider size @default 'md' */\n size?: MantineSize | (string & {});\n\n /** If set, slider thumb can be focused @default true */\n focusable?: boolean;\n}\n\nexport interface ColorSliderProps\n extends\n BoxProps,\n StylesApiProps<ColorSliderFactory>,\n __ColorSliderProps,\n ElementProps<'div', 'onChange'> {\n __staticSelector?: string;\n maxValue: number;\n overlays: React.CSSProperties[];\n round: boolean;\n thumbColor?: string;\n}\n\nexport type ColorSliderOptions = Omit<\n ColorSliderProps,\n 'maxValue' | 'overlays' | 'round' | 'thumbColor'\n>;\n\nexport type ColorSliderFactory = Factory<{\n props: ColorSliderProps;\n ref: HTMLDivElement;\n stylesNames: ColorSliderStylesNames;\n}>;\n\nexport const ColorSlider = factory<ColorSliderFactory>((_props) => {\n const props = useProps('ColorSlider', null, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n onChange,\n onChangeEnd,\n maxValue,\n round,\n size = 'md',\n focusable = true,\n value,\n overlays,\n thumbColor = 'transparent',\n onScrubStart,\n onScrubEnd,\n __staticSelector = 'ColorPicker',\n attributes,\n ref,\n ...others\n } = props;\n\n const _getStyles = useStyles<ColorSliderFactory>({\n name: __staticSelector,\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n rootSelector: 'slider',\n });\n\n const ctxGetStyles = use(ColorPickerContext)?.getStyles;\n const getStyles = ctxGetStyles || _getStyles;\n\n const theme = useMantineTheme();\n const [position, setPosition] = useState({ y: 0, x: value / maxValue });\n const positionRef = useRef(position);\n const getChangeValue = (val: number) => (round ? Math.round(val * maxValue) : val * maxValue);\n const { ref: sliderRef } = useMove(\n ({ x, y }) => {\n positionRef.current = { x, y };\n onChange?.(getChangeValue(x));\n },\n {\n onScrubEnd: () => {\n const { x } = positionRef.current;\n onChangeEnd?.(getChangeValue(x));\n onScrubEnd?.();\n },\n onScrubStart,\n }\n );\n\n useDidUpdate(() => {\n setPosition({ y: 0, x: value / maxValue });\n }, [value]);\n\n const handleArrow = (event: React.KeyboardEvent<HTMLDivElement>, pos: UseMovePosition) => {\n event.preventDefault();\n const _position = clampUseMovePosition(pos);\n onChange?.(getChangeValue(_position.x));\n onChangeEnd?.(getChangeValue(_position.x));\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n switch (event.key) {\n case 'ArrowRight': {\n handleArrow(event, { x: position.x + 0.05, y: position.y });\n break;\n }\n\n case 'ArrowLeft': {\n handleArrow(event, { x: position.x - 0.05, y: position.y });\n break;\n }\n }\n };\n\n const layers = overlays.map((overlay, index) => (\n <div {...getStyles('sliderOverlay')} style={overlay} key={index} />\n ));\n\n return (\n <Box\n {...others}\n ref={useMergedRef(sliderRef, ref)}\n {...getStyles('slider')}\n size={size}\n role=\"slider\"\n aria-valuenow={value}\n aria-valuemax={maxValue}\n aria-valuemin={0}\n tabIndex={focusable ? 0 : -1}\n onKeyDown={handleKeyDown}\n data-focus-ring={theme.focusRing}\n __vars={{\n '--cp-thumb-size': `var(--cp-thumb-size-${size})`,\n }}\n >\n {layers}\n\n <Thumb\n position={position}\n {...getStyles('thumb', { style: { top: rem(1), background: thumbColor } })}\n />\n </Box>\n );\n});\n\nColorSlider.displayName = '@mantine/core/ColorSlider';\nColorSlider.classes = classes;\n"],"mappings":";;;;;;;;;;;;;;AA0EA,MAAa,cAAc,SAA6B,WAAW;CACjE,MAAM,QAAQ,SAAS,eAAe,MAAM,MAAM;CAClD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,UACA,aACA,UACA,OACA,OAAO,MACP,YAAY,MACZ,OACA,UACA,aAAa,eACb,cACA,YACA,mBAAmB,eACnB,YACA,KACA,GAAG,WACD;CAEJ,MAAM,aAAa,UAA8B;EAC/C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;CAChB,CAAC;CAGD,MAAM,YADe,IAAI,kBAAkB,CAAC,EAAE,aACZ;CAElC,MAAM,QAAQ,gBAAgB;CAC9B,MAAM,CAAC,UAAU,eAAe,SAAS;EAAE,GAAG;EAAG,GAAG,QAAQ;CAAS,CAAC;CACtE,MAAM,cAAc,OAAO,QAAQ;CACnC,MAAM,kBAAkB,QAAiB,QAAQ,KAAK,MAAM,MAAM,QAAQ,IAAI,MAAM;CACpF,MAAM,EAAE,KAAK,cAAc,SACxB,EAAE,GAAG,QAAQ;EACZ,YAAY,UAAU;GAAE;GAAG;EAAE;EAC7B,WAAW,eAAe,CAAC,CAAC;CAC9B,GACA;EACE,kBAAkB;GAChB,MAAM,EAAE,MAAM,YAAY;GAC1B,cAAc,eAAe,CAAC,CAAC;GAC/B,aAAa;EACf;EACA;CACF,CACF;CAEA,mBAAmB;EACjB,YAAY;GAAE,GAAG;GAAG,GAAG,QAAQ;EAAS,CAAC;CAC3C,GAAG,CAAC,KAAK,CAAC;CAEV,MAAM,eAAe,OAA4C,QAAyB;EACxF,MAAM,eAAe;EACrB,MAAM,YAAY,qBAAqB,GAAG;EAC1C,WAAW,eAAe,UAAU,CAAC,CAAC;EACtC,cAAc,eAAe,UAAU,CAAC,CAAC;CAC3C;CAEA,MAAM,iBAAiB,UAA+C;EACpE,QAAQ,MAAM,KAAd;GACE,KAAK;IACH,YAAY,OAAO;KAAE,GAAG,SAAS,IAAI;KAAM,GAAG,SAAS;IAAE,CAAC;IAC1D;GAGF,KAAK;IACH,YAAY,OAAO;KAAE,GAAG,SAAS,IAAI;KAAM,GAAG,SAAS;IAAE,CAAC;IAC1D;EAEJ;CACF;CAEA,MAAM,SAAS,SAAS,KAAK,SAAS,UACpC,8BAAC,OAAD;EAAK,GAAI,UAAU,eAAe;EAAG,OAAO;EAAS,KAAK;CAAQ,CAAA,CACnE;CAED,OACE,qBAAC,KAAD;EACE,GAAI;EACJ,KAAK,aAAa,WAAW,GAAG;EAChC,GAAI,UAAU,QAAQ;EAChB;EACN,MAAK;EACL,iBAAe;EACf,iBAAe;EACf,iBAAe;EACf,UAAU,YAAY,IAAI;EAC1B,WAAW;EACX,mBAAiB,MAAM;EACvB,QAAQ,EACN,mBAAmB,uBAAuB,KAAK,GACjD;YAdF,CAgBG,QAED,oBAAC,OAAD;GACY;GACV,GAAI,UAAU,SAAS,EAAE,OAAO;IAAE,KAAK,IAAI,CAAC;IAAG,YAAY;GAAW,EAAE,CAAC;EAC1E,CAAA,CACE;;AAET,CAAC;AAED,YAAY,cAAc;AAC1B,YAAY,UAAUA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"converters.mjs","names":[],"sources":["../../../../src/components/ColorPicker/converters/converters.ts"],"sourcesContent":["import { ColorFormat, HsvaColor, RgbaColor } from '../ColorPicker.types';\nimport { round } from './parsers';\n\nexport function hsvaToRgbaObject({ h, s, v, a }: HsvaColor): RgbaColor {\n const _h = (h / 360) * 6;\n const _s = s / 100;\n const _v = v / 100;\n\n const hh = Math.floor(_h);\n const l = _v * (1 - _s);\n const c = _v * (1 - (_h - hh) * _s);\n const d = _v * (1 - (1 - _h + hh) * _s);\n const module = hh % 6;\n\n return {\n r: round([_v, c, l, l, d, _v][module] * 255),\n g: round([d, _v, _v, c, l, l][module] * 255),\n b: round([l, l, d, _v, _v, c][module] * 255),\n a: round(a, 2),\n };\n}\n\nexport function hsvaToRgba(color: HsvaColor, includeAlpha: boolean) {\n const { r, g, b, a } = hsvaToRgbaObject(color);\n\n if (!includeAlpha) {\n return `rgb(${r}, ${g}, ${b})`;\n }\n\n return `rgba(${r}, ${g}, ${b}, ${round(a, 2)})`;\n}\n\nexport function hsvaToHsl({ h, s, v, a }: HsvaColor, includeAlpha: boolean) {\n const hh = ((200 - s) * v) / 100;\n\n const result = {\n h: Math.round(h),\n s: Math.round(hh > 0 && hh < 200 ? ((s * v) / 100 / (hh <= 100 ? hh : 200 - hh)) * 100 : 0),\n l: Math.round(hh / 2),\n };\n\n if (!includeAlpha) {\n return `hsl(${result.h}, ${result.s}%, ${result.l}%)`;\n }\n\n return `hsla(${result.h}, ${result.s}%, ${result.l}%, ${round(a, 2)})`;\n}\n\nfunction formatHexPart(number: number) {\n const hex = number.toString(16);\n return hex.length < 2 ? `0${hex}` : hex;\n}\n\nexport function hsvaToHex(color: HsvaColor) {\n const { r, g, b } = hsvaToRgbaObject(color);\n return `#${formatHexPart(r)}${formatHexPart(g)}${formatHexPart(b)}`;\n}\n\nexport function hsvaToHexa(color: HsvaColor) {\n const a = Math.round(color.a * 255);\n\n return `${hsvaToHex(color)}${formatHexPart(a)}`;\n}\n\nconst CONVERTERS: Record<ColorFormat, (color: HsvaColor) => string> = {\n hex: hsvaToHex,\n hexa: (color) => hsvaToHexa(color),\n rgb: (color) => hsvaToRgba(color, false),\n rgba: (color) => hsvaToRgba(color, true),\n hsl: (color) => hsvaToHsl(color, false),\n hsla: (color) => hsvaToHsl(color, true),\n};\n\nexport function convertHsvaTo(format: ColorFormat, color: HsvaColor) {\n if (!color) {\n return '#000000';\n }\n\n if (!(format in CONVERTERS)) {\n return CONVERTERS.hex(color);\n }\n\n return CONVERTERS[format](color);\n}\n"],"mappings":";;;AAGA,SAAgB,iBAAiB,EAAE,GAAG,GAAG,GAAG,KAA2B;CACrE,MAAM,KAAM,IAAI,MAAO;CACvB,MAAM,KAAK,IAAI;CACf,MAAM,KAAK,IAAI;CAEf,MAAM,KAAK,KAAK,MAAM,EAAE;CACxB,MAAM,IAAI,MAAM,IAAI;CACpB,MAAM,IAAI,MAAM,KAAK,KAAK,MAAM;CAChC,MAAM,IAAI,MAAM,KAAK,IAAI,KAAK,MAAM;CACpC,MAAM,SAAS,KAAK;CAEpB,OAAO;EACL,GAAG,MAAM;GAAC;GAAI;GAAG;GAAG;GAAG;GAAG;EAAE,
|
|
1
|
+
{"version":3,"file":"converters.mjs","names":[],"sources":["../../../../src/components/ColorPicker/converters/converters.ts"],"sourcesContent":["import { ColorFormat, HsvaColor, RgbaColor } from '../ColorPicker.types';\nimport { round } from './parsers';\n\nexport function hsvaToRgbaObject({ h, s, v, a }: HsvaColor): RgbaColor {\n const _h = (h / 360) * 6;\n const _s = s / 100;\n const _v = v / 100;\n\n const hh = Math.floor(_h);\n const l = _v * (1 - _s);\n const c = _v * (1 - (_h - hh) * _s);\n const d = _v * (1 - (1 - _h + hh) * _s);\n const module = hh % 6;\n\n return {\n r: round([_v, c, l, l, d, _v][module] * 255),\n g: round([d, _v, _v, c, l, l][module] * 255),\n b: round([l, l, d, _v, _v, c][module] * 255),\n a: round(a, 2),\n };\n}\n\nexport function hsvaToRgba(color: HsvaColor, includeAlpha: boolean) {\n const { r, g, b, a } = hsvaToRgbaObject(color);\n\n if (!includeAlpha) {\n return `rgb(${r}, ${g}, ${b})`;\n }\n\n return `rgba(${r}, ${g}, ${b}, ${round(a, 2)})`;\n}\n\nexport function hsvaToHsl({ h, s, v, a }: HsvaColor, includeAlpha: boolean) {\n const hh = ((200 - s) * v) / 100;\n\n const result = {\n h: Math.round(h),\n s: Math.round(hh > 0 && hh < 200 ? ((s * v) / 100 / (hh <= 100 ? hh : 200 - hh)) * 100 : 0),\n l: Math.round(hh / 2),\n };\n\n if (!includeAlpha) {\n return `hsl(${result.h}, ${result.s}%, ${result.l}%)`;\n }\n\n return `hsla(${result.h}, ${result.s}%, ${result.l}%, ${round(a, 2)})`;\n}\n\nfunction formatHexPart(number: number) {\n const hex = number.toString(16);\n return hex.length < 2 ? `0${hex}` : hex;\n}\n\nexport function hsvaToHex(color: HsvaColor) {\n const { r, g, b } = hsvaToRgbaObject(color);\n return `#${formatHexPart(r)}${formatHexPart(g)}${formatHexPart(b)}`;\n}\n\nexport function hsvaToHexa(color: HsvaColor) {\n const a = Math.round(color.a * 255);\n\n return `${hsvaToHex(color)}${formatHexPart(a)}`;\n}\n\nconst CONVERTERS: Record<ColorFormat, (color: HsvaColor) => string> = {\n hex: hsvaToHex,\n hexa: (color) => hsvaToHexa(color),\n rgb: (color) => hsvaToRgba(color, false),\n rgba: (color) => hsvaToRgba(color, true),\n hsl: (color) => hsvaToHsl(color, false),\n hsla: (color) => hsvaToHsl(color, true),\n};\n\nexport function convertHsvaTo(format: ColorFormat, color: HsvaColor) {\n if (!color) {\n return '#000000';\n }\n\n if (!(format in CONVERTERS)) {\n return CONVERTERS.hex(color);\n }\n\n return CONVERTERS[format](color);\n}\n"],"mappings":";;;AAGA,SAAgB,iBAAiB,EAAE,GAAG,GAAG,GAAG,KAA2B;CACrE,MAAM,KAAM,IAAI,MAAO;CACvB,MAAM,KAAK,IAAI;CACf,MAAM,KAAK,IAAI;CAEf,MAAM,KAAK,KAAK,MAAM,EAAE;CACxB,MAAM,IAAI,MAAM,IAAI;CACpB,MAAM,IAAI,MAAM,KAAK,KAAK,MAAM;CAChC,MAAM,IAAI,MAAM,KAAK,IAAI,KAAK,MAAM;CACpC,MAAM,SAAS,KAAK;CAEpB,OAAO;EACL,GAAG,MAAM;GAAC;GAAI;GAAG;GAAG;GAAG;GAAG;EAAE,CAAC,CAAC,UAAU,GAAG;EAC3C,GAAG,MAAM;GAAC;GAAG;GAAI;GAAI;GAAG;GAAG;EAAC,CAAC,CAAC,UAAU,GAAG;EAC3C,GAAG,MAAM;GAAC;GAAG;GAAG;GAAG;GAAI;GAAI;EAAC,CAAC,CAAC,UAAU,GAAG;EAC3C,GAAG,MAAM,GAAG,CAAC;CACf;AACF;AAEA,SAAgB,WAAW,OAAkB,cAAuB;CAClE,MAAM,EAAE,GAAG,GAAG,GAAG,MAAM,iBAAiB,KAAK;CAE7C,IAAI,CAAC,cACH,OAAO,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE;CAG9B,OAAO,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,MAAM,GAAG,CAAC,EAAE;AAC/C;AAEA,SAAgB,UAAU,EAAE,GAAG,GAAG,GAAG,KAAgB,cAAuB;CAC1E,MAAM,MAAO,MAAM,KAAK,IAAK;CAE7B,MAAM,SAAS;EACb,GAAG,KAAK,MAAM,CAAC;EACf,GAAG,KAAK,MAAM,KAAK,KAAK,KAAK,MAAQ,IAAI,IAAK,OAAO,MAAM,MAAM,KAAK,MAAM,MAAO,MAAM,CAAC;EAC1F,GAAG,KAAK,MAAM,KAAK,CAAC;CACtB;CAEA,IAAI,CAAC,cACH,OAAO,OAAO,OAAO,EAAE,IAAI,OAAO,EAAE,KAAK,OAAO,EAAE;CAGpD,OAAO,QAAQ,OAAO,EAAE,IAAI,OAAO,EAAE,KAAK,OAAO,EAAE,KAAK,MAAM,GAAG,CAAC,EAAE;AACtE;AAEA,SAAS,cAAc,QAAgB;CACrC,MAAM,MAAM,OAAO,SAAS,EAAE;CAC9B,OAAO,IAAI,SAAS,IAAI,IAAI,QAAQ;AACtC;AAEA,SAAgB,UAAU,OAAkB;CAC1C,MAAM,EAAE,GAAG,GAAG,MAAM,iBAAiB,KAAK;CAC1C,OAAO,IAAI,cAAc,CAAC,IAAI,cAAc,CAAC,IAAI,cAAc,CAAC;AAClE;AAEA,SAAgB,WAAW,OAAkB;CAC3C,MAAM,IAAI,KAAK,MAAM,MAAM,IAAI,GAAG;CAElC,OAAO,GAAG,UAAU,KAAK,IAAI,cAAc,CAAC;AAC9C;AAEA,MAAM,aAAgE;CACpE,KAAK;CACL,OAAO,UAAU,WAAW,KAAK;CACjC,MAAM,UAAU,WAAW,OAAO,KAAK;CACvC,OAAO,UAAU,WAAW,OAAO,IAAI;CACvC,MAAM,UAAU,UAAU,OAAO,KAAK;CACtC,OAAO,UAAU,UAAU,OAAO,IAAI;AACxC;AAEA,SAAgB,cAAc,QAAqB,OAAkB;CACnE,IAAI,CAAC,OACH,OAAO;CAGT,IAAI,EAAE,UAAU,aACd,OAAO,WAAW,IAAI,KAAK;CAG7B,OAAO,WAAW,OAAO,CAAC,KAAK;AACjC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"parsers.mjs","names":[],"sources":["../../../../src/components/ColorPicker/converters/parsers.ts"],"sourcesContent":["import { ColorFormat, HslaColor, HsvaColor, RgbaColor } from '../ColorPicker.types';\n\nexport function round(number: number, digits = 0, base = 10 ** digits) {\n return Math.round(base * number) / base;\n}\n\nfunction hslaToHsva({ h, s, l, a }: HslaColor): HsvaColor {\n const ss = s * ((l < 50 ? l : 100 - l) / 100);\n\n return {\n h,\n s: ss > 0 ? ((2 * ss) / (l + ss)) * 100 : 0,\n v: l + ss,\n a,\n };\n}\n\nconst angleUnits: Record<string, number> = {\n grad: 360 / 400,\n turn: 360,\n rad: 360 / (Math.PI * 2),\n};\n\nexport function parseHue(value: string, unit = 'deg') {\n return Number(value) * (angleUnits[unit] || 1);\n}\n\nconst HSL_REGEXP =\n /hsla?\\(?\\s*(-?\\d*\\.?\\d+)(deg|rad|grad|turn)?[,\\s]+(-?\\d*\\.?\\d+)%?[,\\s]+(-?\\d*\\.?\\d+)%?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n\nexport function parseHsla(color: string): HsvaColor {\n const match = HSL_REGEXP.exec(color);\n\n if (!match) {\n return { h: 0, s: 0, v: 0, a: 1 };\n }\n\n return hslaToHsva({\n h: parseHue(match[1], match[2]),\n s: Number(match[3]),\n l: Number(match[4]),\n a: match[5] === undefined ? 1 : Number(match[5]) / (match[6] ? 100 : 1),\n });\n}\n\nfunction rgbaToHsva({ r, g, b, a }: RgbaColor): HsvaColor {\n const max = Math.max(r, g, b);\n const delta = max - Math.min(r, g, b);\n\n const hh = delta\n ? max === r\n ? (g - b) / delta\n : max === g\n ? 2 + (b - r) / delta\n : 4 + (r - g) / delta\n : 0;\n\n return {\n h: round(60 * (hh < 0 ? hh + 6 : hh), 3),\n s: round(max ? (delta / max) * 100 : 0, 3),\n v: round((max / 255) * 100, 3),\n a,\n };\n}\n\nexport function parseHex(color: string): HsvaColor {\n const hex = color[0] === '#' ? color.slice(1) : color;\n\n if (hex.length === 3) {\n return rgbaToHsva({\n r: parseInt(hex[0] + hex[0], 16),\n g: parseInt(hex[1] + hex[1], 16),\n b: parseInt(hex[2] + hex[2], 16),\n a: 1,\n });\n }\n\n return rgbaToHsva({\n r: parseInt(hex.slice(0, 2), 16),\n g: parseInt(hex.slice(2, 4), 16),\n b: parseInt(hex.slice(4, 6), 16),\n a: 1,\n });\n}\n\nexport function parseHexa(color: string): HsvaColor {\n const hex = color[0] === '#' ? color.slice(1) : color;\n\n const roundA = (a: string) => round(parseInt(a, 16) / 255, 3);\n if (hex.length === 4) {\n const withoutOpacity = hex.slice(0, 3);\n const a = roundA(hex[3] + hex[3]);\n\n const hsvaColor: HsvaColor = { ...parseHex(withoutOpacity), a };\n return hsvaColor;\n }\n\n const withoutOpacity = hex.slice(0, 6);\n const a = roundA(hex.slice(6, 8));\n const hsvaColor: HsvaColor = { ...parseHex(withoutOpacity), a };\n return hsvaColor;\n}\n\nconst RGB_REGEXP =\n /rgba?\\(?\\s*(-?\\d*\\.?\\d+)(%)?[,\\s]+(-?\\d*\\.?\\d+)(%)?[,\\s]+(-?\\d*\\.?\\d+)(%)?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n\nexport function parseRgba(color: string): HsvaColor {\n const match = RGB_REGEXP.exec(color);\n\n if (!match) {\n return { h: 0, s: 0, v: 0, a: 1 };\n }\n\n return rgbaToHsva({\n r: Number(match[1]) / (match[2] ? 100 / 255 : 1),\n g: Number(match[3]) / (match[4] ? 100 / 255 : 1),\n b: Number(match[5]) / (match[6] ? 100 / 255 : 1),\n a: match[7] === undefined ? 1 : Number(match[7]) / (match[8] ? 100 : 1),\n });\n}\n\nconst VALIDATION_REGEXP: Record<ColorFormat, RegExp> = {\n hex: /^#?([0-9A-F]{3}){1,2}$/i,\n hexa: /^#?([0-9A-F]{4}){1,2}$/i,\n rgb: /^rgb\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*(\\d+(?:\\.\\d+)?))?\\)$/i,\n rgba: /^rgba\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*(\\d+(?:\\.\\d+)?))?\\)$/i,\n hsl: /hsl\\(\\s*(\\d+)\\s*,\\s*(\\d+(?:\\.\\d+)?%)\\s*,\\s*(\\d+(?:\\.\\d+)?%)\\)/i,\n hsla: /^hsla\\((\\d+),\\s*([\\d.]+)%,\\s*([\\d.]+)%,\\s*(\\d*(?:\\.\\d+)?)\\)$/i,\n};\n\nconst CONVERTERS: Record<ColorFormat, (color: string) => HsvaColor> = {\n hex: parseHex,\n hexa: parseHexa,\n rgb: parseRgba,\n rgba: parseRgba,\n hsl: parseHsla,\n hsla: parseHsla,\n};\n\nexport function isColorValid(color: string) {\n for (const [, regexp] of Object.entries(VALIDATION_REGEXP)) {\n if (regexp.test(color)) {\n return true;\n }\n }\n\n return false;\n}\n\nexport function parseColor(color: string): HsvaColor {\n if (typeof color !== 'string') {\n return { h: 0, s: 0, v: 0, a: 1 };\n }\n\n if (color === 'transparent') {\n return { h: 0, s: 0, v: 0, a: 0 };\n }\n\n const trimmed = color.trim();\n\n for (const [rule, regexp] of Object.entries(VALIDATION_REGEXP)) {\n if (regexp.test(trimmed)) {\n return CONVERTERS[rule as keyof typeof CONVERTERS](trimmed);\n }\n }\n\n return { h: 0, s: 0, v: 0, a: 1 };\n}\n"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"parsers.mjs","names":[],"sources":["../../../../src/components/ColorPicker/converters/parsers.ts"],"sourcesContent":["import { ColorFormat, HslaColor, HsvaColor, RgbaColor } from '../ColorPicker.types';\n\nexport function round(number: number, digits = 0, base = 10 ** digits) {\n return Math.round(base * number) / base;\n}\n\nfunction hslaToHsva({ h, s, l, a }: HslaColor): HsvaColor {\n const ss = s * ((l < 50 ? l : 100 - l) / 100);\n\n return {\n h,\n s: ss > 0 ? ((2 * ss) / (l + ss)) * 100 : 0,\n v: l + ss,\n a,\n };\n}\n\nconst angleUnits: Record<string, number> = {\n grad: 360 / 400,\n turn: 360,\n rad: 360 / (Math.PI * 2),\n};\n\nexport function parseHue(value: string, unit = 'deg') {\n return Number(value) * (angleUnits[unit] || 1);\n}\n\nconst HSL_REGEXP =\n /hsla?\\(?\\s*(-?\\d*\\.?\\d+)(deg|rad|grad|turn)?[,\\s]+(-?\\d*\\.?\\d+)%?[,\\s]+(-?\\d*\\.?\\d+)%?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n\nexport function parseHsla(color: string): HsvaColor {\n const match = HSL_REGEXP.exec(color);\n\n if (!match) {\n return { h: 0, s: 0, v: 0, a: 1 };\n }\n\n return hslaToHsva({\n h: parseHue(match[1], match[2]),\n s: Number(match[3]),\n l: Number(match[4]),\n a: match[5] === undefined ? 1 : Number(match[5]) / (match[6] ? 100 : 1),\n });\n}\n\nfunction rgbaToHsva({ r, g, b, a }: RgbaColor): HsvaColor {\n const max = Math.max(r, g, b);\n const delta = max - Math.min(r, g, b);\n\n const hh = delta\n ? max === r\n ? (g - b) / delta\n : max === g\n ? 2 + (b - r) / delta\n : 4 + (r - g) / delta\n : 0;\n\n return {\n h: round(60 * (hh < 0 ? hh + 6 : hh), 3),\n s: round(max ? (delta / max) * 100 : 0, 3),\n v: round((max / 255) * 100, 3),\n a,\n };\n}\n\nexport function parseHex(color: string): HsvaColor {\n const hex = color[0] === '#' ? color.slice(1) : color;\n\n if (hex.length === 3) {\n return rgbaToHsva({\n r: parseInt(hex[0] + hex[0], 16),\n g: parseInt(hex[1] + hex[1], 16),\n b: parseInt(hex[2] + hex[2], 16),\n a: 1,\n });\n }\n\n return rgbaToHsva({\n r: parseInt(hex.slice(0, 2), 16),\n g: parseInt(hex.slice(2, 4), 16),\n b: parseInt(hex.slice(4, 6), 16),\n a: 1,\n });\n}\n\nexport function parseHexa(color: string): HsvaColor {\n const hex = color[0] === '#' ? color.slice(1) : color;\n\n const roundA = (a: string) => round(parseInt(a, 16) / 255, 3);\n if (hex.length === 4) {\n const withoutOpacity = hex.slice(0, 3);\n const a = roundA(hex[3] + hex[3]);\n\n const hsvaColor: HsvaColor = { ...parseHex(withoutOpacity), a };\n return hsvaColor;\n }\n\n const withoutOpacity = hex.slice(0, 6);\n const a = roundA(hex.slice(6, 8));\n const hsvaColor: HsvaColor = { ...parseHex(withoutOpacity), a };\n return hsvaColor;\n}\n\nconst RGB_REGEXP =\n /rgba?\\(?\\s*(-?\\d*\\.?\\d+)(%)?[,\\s]+(-?\\d*\\.?\\d+)(%)?[,\\s]+(-?\\d*\\.?\\d+)(%)?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n\nexport function parseRgba(color: string): HsvaColor {\n const match = RGB_REGEXP.exec(color);\n\n if (!match) {\n return { h: 0, s: 0, v: 0, a: 1 };\n }\n\n return rgbaToHsva({\n r: Number(match[1]) / (match[2] ? 100 / 255 : 1),\n g: Number(match[3]) / (match[4] ? 100 / 255 : 1),\n b: Number(match[5]) / (match[6] ? 100 / 255 : 1),\n a: match[7] === undefined ? 1 : Number(match[7]) / (match[8] ? 100 : 1),\n });\n}\n\nconst VALIDATION_REGEXP: Record<ColorFormat, RegExp> = {\n hex: /^#?([0-9A-F]{3}){1,2}$/i,\n hexa: /^#?([0-9A-F]{4}){1,2}$/i,\n rgb: /^rgb\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*(\\d+(?:\\.\\d+)?))?\\)$/i,\n rgba: /^rgba\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*(\\d+(?:\\.\\d+)?))?\\)$/i,\n hsl: /hsl\\(\\s*(\\d+)\\s*,\\s*(\\d+(?:\\.\\d+)?%)\\s*,\\s*(\\d+(?:\\.\\d+)?%)\\)/i,\n hsla: /^hsla\\((\\d+),\\s*([\\d.]+)%,\\s*([\\d.]+)%,\\s*(\\d*(?:\\.\\d+)?)\\)$/i,\n};\n\nconst CONVERTERS: Record<ColorFormat, (color: string) => HsvaColor> = {\n hex: parseHex,\n hexa: parseHexa,\n rgb: parseRgba,\n rgba: parseRgba,\n hsl: parseHsla,\n hsla: parseHsla,\n};\n\nexport function isColorValid(color: string) {\n for (const [, regexp] of Object.entries(VALIDATION_REGEXP)) {\n if (regexp.test(color)) {\n return true;\n }\n }\n\n return false;\n}\n\nexport function parseColor(color: string): HsvaColor {\n if (typeof color !== 'string') {\n return { h: 0, s: 0, v: 0, a: 1 };\n }\n\n if (color === 'transparent') {\n return { h: 0, s: 0, v: 0, a: 0 };\n }\n\n const trimmed = color.trim();\n\n for (const [rule, regexp] of Object.entries(VALIDATION_REGEXP)) {\n if (regexp.test(trimmed)) {\n return CONVERTERS[rule as keyof typeof CONVERTERS](trimmed);\n }\n }\n\n return { h: 0, s: 0, v: 0, a: 1 };\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxEmpty.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxEmpty/ComboboxEmpty.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n useProps,\n} from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxEmptyStylesNames = 'empty';\n\nexport interface ComboboxEmptyProps\n extends BoxProps, CompoundStylesApiProps<ComboboxEmptyFactory>, ElementProps<'div'> {}\n\nexport type ComboboxEmptyFactory = Factory<{\n props: ComboboxEmptyProps;\n ref: HTMLDivElement;\n stylesNames: ComboboxEmptyStylesNames;\n compound: true;\n}>;\n\nexport const ComboboxEmpty = factory<ComboboxEmptyFactory>((props) => {\n const { classNames, className, style, styles, vars, ...others } = useProps(\n 'ComboboxEmpty',\n null,\n props\n );\n\n const ctx = useComboboxContext();\n\n return <Box {...ctx.getStyles('empty', { className, classNames, styles, style })} {...others} />;\n});\n\nComboboxEmpty.classes = classes;\nComboboxEmpty.displayName = '@mantine/core/ComboboxEmpty';\n"],"mappings":";;;;;;;;AAwBA,MAAa,gBAAgB,SAA+B,UAAU;CACpE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WAAW,SAChE,iBACA,MACA,KACF;CAIA,OAAO,oBAAC,KAAD;EAAK,GAFA,mBAEM,
|
|
1
|
+
{"version":3,"file":"ComboboxEmpty.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxEmpty/ComboboxEmpty.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n useProps,\n} from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxEmptyStylesNames = 'empty';\n\nexport interface ComboboxEmptyProps\n extends BoxProps, CompoundStylesApiProps<ComboboxEmptyFactory>, ElementProps<'div'> {}\n\nexport type ComboboxEmptyFactory = Factory<{\n props: ComboboxEmptyProps;\n ref: HTMLDivElement;\n stylesNames: ComboboxEmptyStylesNames;\n compound: true;\n}>;\n\nexport const ComboboxEmpty = factory<ComboboxEmptyFactory>((props) => {\n const { classNames, className, style, styles, vars, ...others } = useProps(\n 'ComboboxEmpty',\n null,\n props\n );\n\n const ctx = useComboboxContext();\n\n return <Box {...ctx.getStyles('empty', { className, classNames, styles, style })} {...others} />;\n});\n\nComboboxEmpty.classes = classes;\nComboboxEmpty.displayName = '@mantine/core/ComboboxEmpty';\n"],"mappings":";;;;;;;;AAwBA,MAAa,gBAAgB,SAA+B,UAAU;CACpE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WAAW,SAChE,iBACA,MACA,KACF;CAIA,OAAO,oBAAC,KAAD;EAAK,GAFA,mBAEM,CAAC,CAAC,UAAU,SAAS;GAAE;GAAW;GAAY;GAAQ;EAAM,CAAC;EAAG,GAAI;CAAS,CAAA;AACjG,CAAC;AAED,cAAc,UAAUA;AACxB,cAAc,cAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxFooter.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxFooter/ComboboxFooter.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n useProps,\n} from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxFooterStylesNames = 'footer';\n\nexport interface ComboboxFooterProps\n extends BoxProps, CompoundStylesApiProps<ComboboxFooterFactory>, ElementProps<'div'> {}\n\nexport type ComboboxFooterFactory = Factory<{\n props: ComboboxFooterProps;\n ref: HTMLDivElement;\n stylesNames: ComboboxFooterStylesNames;\n compound: true;\n}>;\n\nexport const ComboboxFooter = factory<ComboboxFooterFactory>((props) => {\n const { classNames, className, style, styles, vars, ...others } = useProps(\n 'ComboboxFooter',\n null,\n props\n );\n\n const ctx = useComboboxContext();\n\n return (\n <Box\n {...ctx.getStyles('footer', { className, classNames, style, styles })}\n {...others}\n onMouseDown={(event) => {\n event.preventDefault();\n }}\n />\n );\n});\n\nComboboxFooter.classes = classes;\nComboboxFooter.displayName = '@mantine/core/ComboboxFooter';\n"],"mappings":";;;;;;;;AAwBA,MAAa,iBAAiB,SAAgC,UAAU;CACtE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WAAW,SAChE,kBACA,MACA,KACF;CAIA,OACE,oBAAC,KAAD;EACE,GAJQ,mBAIF,
|
|
1
|
+
{"version":3,"file":"ComboboxFooter.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxFooter/ComboboxFooter.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n CompoundStylesApiProps,\n ElementProps,\n factory,\n Factory,\n useProps,\n} from '../../../core';\nimport { useComboboxContext } from '../Combobox.context';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxFooterStylesNames = 'footer';\n\nexport interface ComboboxFooterProps\n extends BoxProps, CompoundStylesApiProps<ComboboxFooterFactory>, ElementProps<'div'> {}\n\nexport type ComboboxFooterFactory = Factory<{\n props: ComboboxFooterProps;\n ref: HTMLDivElement;\n stylesNames: ComboboxFooterStylesNames;\n compound: true;\n}>;\n\nexport const ComboboxFooter = factory<ComboboxFooterFactory>((props) => {\n const { classNames, className, style, styles, vars, ...others } = useProps(\n 'ComboboxFooter',\n null,\n props\n );\n\n const ctx = useComboboxContext();\n\n return (\n <Box\n {...ctx.getStyles('footer', { className, classNames, style, styles })}\n {...others}\n onMouseDown={(event) => {\n event.preventDefault();\n }}\n />\n );\n});\n\nComboboxFooter.classes = classes;\nComboboxFooter.displayName = '@mantine/core/ComboboxFooter';\n"],"mappings":";;;;;;;;AAwBA,MAAa,iBAAiB,SAAgC,UAAU;CACtE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WAAW,SAChE,kBACA,MACA,KACF;CAIA,OACE,oBAAC,KAAD;EACE,GAJQ,mBAIF,CAAC,CAAC,UAAU,UAAU;GAAE;GAAW;GAAY;GAAO;EAAO,CAAC;EACpE,GAAI;EACJ,cAAc,UAAU;GACtB,MAAM,eAAe;EACvB;CACD,CAAA;AAEL,CAAC;AAED,eAAe,UAAUA;AACzB,eAAe,cAAc"}
|
|
@@ -11,9 +11,10 @@ const ComboboxGroup = factory((props) => {
|
|
|
11
11
|
const { classNames, className, style, styles, vars, children, label, id, ...others } = useProps("ComboboxGroup", null, props);
|
|
12
12
|
const ctx = useComboboxContext();
|
|
13
13
|
const _id = useId(id);
|
|
14
|
+
const hasLabel = label !== void 0 && label !== null && label !== false && label !== "";
|
|
14
15
|
return /* @__PURE__ */ jsxs(Box, {
|
|
15
16
|
role: "group",
|
|
16
|
-
"aria-labelledby":
|
|
17
|
+
"aria-labelledby": hasLabel ? _id : void 0,
|
|
17
18
|
...ctx.getStyles("group", {
|
|
18
19
|
className,
|
|
19
20
|
classNames,
|
|
@@ -21,7 +22,7 @@ const ComboboxGroup = factory((props) => {
|
|
|
21
22
|
styles
|
|
22
23
|
}),
|
|
23
24
|
...others,
|
|
24
|
-
children: [
|
|
25
|
+
children: [hasLabel && /* @__PURE__ */ jsx("div", {
|
|
25
26
|
id: _id,
|
|
26
27
|
...ctx.getStyles("groupLabel", {
|
|
27
28
|
classNames,
|