npm - @mantine/core - Versions diffs - 9.5.1 → 9.6.0 - Mend

@mantine/core 9.5.1 → 9.6.0

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.

Files changed (904) hide show

package/esm/components/Menubar/MenubarMenu/MenubarMenu.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenubarMenu.mjs","names":["useId"],"sources":["../../../../src/components/Menubar/MenubarMenu/MenubarMenu.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { useId, useIsomorphicEffect } from '@mantine/hooks';\nimport { Menu, MenuProps } from '../../Menu';\nimport { MenubarMenuContextProvider, useMenubarContext } from '../Menubar.context';\n\nexport interface MenubarMenuProps extends Omit<\n MenuProps,\n 'opened' \| 'defaultOpened' \| 'onChange' \| 'onOpen' \| 'onClose' \| 'trigger' \| 'returnFocus'\n> {\n /** `Menubar.Target` and `Menubar.Dropdown` components */\n children?: React.ReactNode;\n}\n\nconst DEFAULT_TRANSITION_DURATION = 150;\n\nexport function MenubarMenu({ children, transitionProps, ...others }: MenubarMenuProps) {\n const ctx = useMenubarContext();\n const id = useId();\n const [index, setIndex] = useState(-1);\n\n useIsomorphicEffect(() => {\n const next = ctx.getMenuIndex(id);\n setIndex((current) => (current === next ? current : next));\n });\n\n const opened = ctx.openIndex !== null && index !== -1 && ctx.openIndex === index;\n\n const handleChange = (value: boolean) => {\n if (value) {\n ctx.openMenu(index, 'click');\n ctx.setActiveIndex(index);\n } else {\n ctx.closeMenu();\n }\n };\n\n // Transitions should only play when the whole bar opens or closes, not when\n // switching between sibling menus while one is already open.\n const baseDuration = transitionProps?.duration ?? DEFAULT_TRANSITION_DURATION;\n const baseExitDuration = transitionProps?.exitDuration ?? baseDuration;\n const animateEnter = ctx.getPreviousOpenIndex() === null;\n const animateExit = ctx.openIndex === null;\n const resolvedTransitionProps = {\n ...transitionProps,\n duration: animateEnter ? baseDuration : 0,\n exitDuration: animateExit ? baseExitDuration : 0,\n };\n\n return (\n <MenubarMenuContextProvider value={{ id, index, opened }}>\n <Menu\n position={ctx.position}\n loop={ctx.loop}\n unstyled={ctx.unstyled}\n menuItemTabIndex={-1}\n trapFocus={false}\n {...others}\n transitionProps={resolvedTransitionProps}\n opened={opened}\n onChange={handleChange}\n trigger=\"click\"\n returnFocus={false}\n >\n {children}\n </Menu>\n </MenubarMenuContextProvider>\n );\n}\n\nMenubarMenu.displayName = '@mantine/core/MenubarMenu';\n"],"mappings":";;;;;;;AAaA,MAAM,8BAA8B;AAEpC,SAAgB,YAAY,EAAE,UAAU,iBAAiB,GAAG,UAA4B;CACtF,MAAM,MAAM,kBAAkB;CAC9B,MAAM,KAAKA,QAAM;CACjB,MAAM,CAAC,OAAO,YAAY,SAAS,EAAE;CAErC,0BAA0B;EACxB,MAAM,OAAO,IAAI,aAAa,EAAE;EAChC,UAAU,YAAa,YAAY,OAAO,UAAU,IAAK;CAC3D,CAAC;CAED,MAAM,SAAS,IAAI,cAAc,QAAQ,UAAU,MAAM,IAAI,cAAc;CAE3E,MAAM,gBAAgB,UAAmB;EACvC,IAAI,OAAO;GACT,IAAI,SAAS,OAAO,OAAO;GAC3B,IAAI,eAAe,KAAK;EAC1B,OACE,IAAI,UAAU;CAElB;CAIA,MAAM,eAAe,iBAAiB,YAAY;CAClD,MAAM,mBAAmB,iBAAiB,gBAAgB;CAC1D,MAAM,eAAe,IAAI,qBAAqB,MAAM;CACpD,MAAM,cAAc,IAAI,cAAc;CACtC,MAAM,0BAA0B;EAC9B,GAAG;EACH,UAAU,eAAe,eAAe;EACxC,cAAc,cAAc,mBAAmB;CACjD;CAEA,OACE,oBAAC,4BAAD;EAA4B,OAAO;GAAE;GAAI;GAAO;EAAO;~~YACrD~~,oBAAC,MAAD;GACE,UAAU,IAAI;GACd,MAAM,IAAI;GACV,UAAU,IAAI;GACd,kBAAkB;GAClB,WAAW;GACX,GAAI;GACJ,iBAAiB;GACT;GACR,UAAU;GACV,SAAQ;GACR,aAAa;GAEZ;EACG,CAAA;CACoB,CAAA;AAEhC;AAEA,YAAY,cAAc"}
1	+ {"version":3,"file":"MenubarMenu.mjs","names":["useId"],"sources":["../../../../src/components/Menubar/MenubarMenu/MenubarMenu.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { useId, useIsomorphicEffect } from '@mantine/hooks';\nimport { Menu, MenuProps } from '../../Menu';\nimport { MenubarMenuContextProvider, useMenubarContext } from '../Menubar.context';\n\nexport interface MenubarMenuProps extends Omit<\n MenuProps,\n 'opened' \| 'defaultOpened' \| 'onChange' \| 'onOpen' \| 'onClose' \| 'trigger' \| 'returnFocus'\n> {\n /** `Menubar.Target` and `Menubar.Dropdown` components */\n children?: React.ReactNode;\n}\n\nconst DEFAULT_TRANSITION_DURATION = 150;\n\nexport function MenubarMenu({ children, transitionProps, ...others }: MenubarMenuProps) {\n const ctx = useMenubarContext();\n const id = useId();\n const [index, setIndex] = useState(-1);\n\n useIsomorphicEffect(() => {\n const next = ctx.getMenuIndex(id);\n setIndex((current) => (current === next ? current : next));\n });\n\n const opened = ctx.openIndex !== null && index !== -1 && ctx.openIndex === index;\n\n const handleChange = (value: boolean) => {\n if (value) {\n ctx.openMenu(index, 'click');\n ctx.setActiveIndex(index);\n } else {\n ctx.closeMenu();\n }\n };\n\n // Transitions should only play when the whole bar opens or closes, not when\n // switching between sibling menus while one is already open.\n const baseDuration = transitionProps?.duration ?? DEFAULT_TRANSITION_DURATION;\n const baseExitDuration = transitionProps?.exitDuration ?? baseDuration;\n const animateEnter = ctx.getPreviousOpenIndex() === null;\n const animateExit = ctx.openIndex === null;\n const resolvedTransitionProps = {\n ...transitionProps,\n duration: animateEnter ? baseDuration : 0,\n exitDuration: animateExit ? baseExitDuration : 0,\n };\n\n return (\n <MenubarMenuContextProvider value={{ id, index, opened }}>\n <Menu\n position={ctx.position}\n loop={ctx.loop}\n unstyled={ctx.unstyled}\n menuItemTabIndex={-1}\n trapFocus={false}\n {...others}\n transitionProps={resolvedTransitionProps}\n opened={opened}\n onChange={handleChange}\n trigger=\"click\"\n returnFocus={false}\n >\n {children}\n </Menu>\n </MenubarMenuContextProvider>\n );\n}\n\nMenubarMenu.displayName = '@mantine/core/MenubarMenu';\n"],"mappings":";;;;;;;AAaA,MAAM,8BAA8B;AAEpC,SAAgB,YAAY,EAAE,UAAU,iBAAiB,GAAG,UAA4B;CACtF,MAAM,MAAM,kBAAkB;CAC9B,MAAM,KAAKA,QAAM;CACjB,MAAM,CAAC,OAAO,YAAY,SAAS,EAAE;CAErC,0BAA0B;EACxB,MAAM,OAAO,IAAI,aAAa,EAAE;EAChC,UAAU,YAAa,YAAY,OAAO,UAAU,IAAK;CAC3D,CAAC;CAED,MAAM,SAAS,IAAI,cAAc,QAAQ,UAAU,MAAM,IAAI,cAAc;CAE3E,MAAM,gBAAgB,UAAmB;EACvC,IAAI,OAAO;GACT,IAAI,SAAS,OAAO,OAAO;GAC3B,IAAI,eAAe,KAAK;EAC1B,OACE,IAAI,UAAU;CAElB;CAIA,MAAM,eAAe,iBAAiB,YAAY;CAClD,MAAM,mBAAmB,iBAAiB,gBAAgB;CAC1D,MAAM,eAAe,IAAI,qBAAqB,MAAM;CACpD,MAAM,cAAc,IAAI,cAAc;CACtC,MAAM,0BAA0B;EAC9B,GAAG;EACH,UAAU,eAAe,eAAe;EACxC,cAAc,cAAc,mBAAmB;CACjD;CAEA,OACE,oBAAC,4BAAD;EAA4B,OAAO;GAAE;GAAI;GAAO;EAAO;EACrD,UAAA,oBAAC,MAAD;GACE,UAAU,IAAI;GACd,MAAM,IAAI;GACV,UAAU,IAAI;GACd,kBAAkB;GAClB,WAAW;GACX,GAAI;GACJ,iBAAiB;GACT;GACR,UAAU;GACV,SAAQ;GACR,aAAa;GAEZ;EACG,CAAA;CACoB,CAAA;AAEhC;AAEA,YAAY,cAAc"}

package/esm/components/Menubar/MenubarTarget/MenubarTarget.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenubarTarget.mjs","names":[],"sources":["../../../../src/components/Menubar/MenubarTarget/MenubarTarget.tsx"],"sourcesContent":["import {\n createEventHandler,\n ElementProps,\n MantineStyleProp,\n useDirection,\n useProps,\n} from '../../../core';\nimport { Popover } from '../../Popover';\nimport { UnstyledButton } from '../../UnstyledButton';\nimport { useMenubarContext, useMenubarMenuContext } from '../Menubar.context';\n\nexport interface MenubarTargetProps extends ElementProps<'button'> {\n 'data-disabled'?: boolean;\n\n /** Target label /\n children: React.ReactNode;\n\n /* Inline styles applied to the target button /\n style?: MantineStyleProp;\n\n /* Key of the prop used to get element ref, useful for forwarding refs to custom components @default 'ref' */\n refProp?: string;\n}\n\nconst defaultProps = {\n refProp: 'ref',\n} satisfies Partial<MenubarTargetProps>;\n\nfunction isPrintableKey(event: React.KeyboardEvent) {\n return (\n event.key.length === 1 && event.key !== ' ' && !event.ctrlKey && !event.metaKey && !event.altKey\n );\n}\n\nfunction getTargetLabel(node: HTMLElement) {\n return (node.textContent ?? '').trim().toLowerCase();\n}\n\nexport function MenubarTarget(props: MenubarTargetProps) {\n const {\n children,\n refProp,\n className,\n style,\n disabled,\n 'data-disabled': dataDisabled,\n onClick,\n onMouseEnter,\n onMouseLeave,\n onFocus,\n onKeyDown,\n ...others\n } = useProps('MenubarTarget', defaultProps, props);\n\n const ctx = useMenubarContext();\n const menuCtx = useMenubarMenuContext();\n const { dir } = useDirection();\n\n const isDisabled = disabled \|\| dataDisabled;\n const isActive = ctx.activeIndex === menuCtx.index;\n\n // Before the menu indexes resolve from the DOM (first render / SSR HTML), every target\n // would otherwise compute `tabIndex={-1}`, leaving the menubar with no tab stop until\n // effects run. Keep unresolved targets focusable so keyboard users can enter the menubar.\n const isUnresolvedTabStop = menuCtx.index === -1 && !isDisabled;\n\n const moveToAdjacent = (direction: 1 \| -1) => {\n const nextIndex = ctx.getAdjacentIndex(menuCtx.index, direction);\n ctx.setActiveIndex(nextIndex);\n ctx.focusTarget(nextIndex);\n if (ctx.openIndex !== null) {\n ctx.openMenu(nextIndex, 'click');\n }\n };\n\n const openAndFocusItem = (itemPosition: 'first' \| 'last') => {\n ctx.openMenu(menuCtx.index, 'click');\n ctx.setActiveIndex(menuCtx.index);\n ctx.focusMenuItem(menuCtx.index, itemPosition);\n };\n\n const typeAhead = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n const targets = ctx.getTargets();\n if (targets.length === 0) {\n return;\n }\n\n const char = event.key.toLowerCase();\n for (let offset = 1; offset <= targets.length; offset += 1) {\n const index = (menuCtx.index + offset) % targets.length;\n const node = targets[index];\n if (\n node &&\n !node.disabled &&\n !node.hasAttribute('data-disabled') &&\n getTargetLabel(node).startsWith(char)\n ) {\n event.preventDefault();\n ctx.setActiveIndex(index);\n node.focus();\n if (ctx.openIndex !== null) {\n ctx.openMenu(index, 'click');\n }\n break;\n }\n }\n };\n\n const handleClick = createEventHandler<any>(onClick, () => {\n if (isDisabled) {\n return;\n }\n if (ctx.openIndex === menuCtx.index && ctx.getOpenSource() !== 'hover') {\n ctx.closeMenu();\n } else {\n ctx.openMenu(menuCtx.index, 'click');\n ctx.setActiveIndex(menuCtx.index);\n }\n });\n\n const handleMouseEnter = createEventHandler<any>(onMouseEnter, () => {\n if (isDisabled) {\n return;\n }\n ctx.cancelClose();\n if (ctx.trigger === 'hover') {\n ctx.openMenu(menuCtx.index, 'hover');\n ctx.setActiveIndex(menuCtx.index);\n } else if (ctx.openIndex !== null && ctx.openIndex !== menuCtx.index) {\n // Hover-switching with trigger=\"click\" continues a click-driven interaction:\n // keep 'click' as the open source so that the next click on the target\n // closes the menu, same as a click-opened menu (desktop application pattern)\n ctx.openMenu(menuCtx.index, 'click');\n ctx.setActiveIndex(menuCtx.index);\n }\n });\n\n const handleMouseLeave = createEventHandler<any>(onMouseLeave, () => {\n if (ctx.trigger === 'hover') {\n ctx.scheduleClose();\n }\n });\n\n const handleFocus = createEventHandler<any>(onFocus, () => ctx.setActiveIndex(menuCtx.index));\n\n const handleKeyDown = createEventHandler<any>(onKeyDown, (event) => {\n if (isDisabled) {\n return;\n }\n const forwardKey = dir === 'rtl' ? 'ArrowLeft' : 'ArrowRight';\n const backKey = dir === 'rtl' ? 'ArrowRight' : 'ArrowLeft';\n\n if (event.key === forwardKey) {\n event.preventDefault();\n moveToAdjacent(1);\n } else if (event.key === backKey) {\n event.preventDefault();\n moveToAdjacent(-1);\n } else if (event.key === 'ArrowDown' \|\| event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n openAndFocusItem('first');\n } else if (event.key === 'ArrowUp') {\n event.preventDefault();\n openAndFocusItem('last');\n } else if (event.key === 'Home') {\n event.preventDefault();\n const enabled = ctx.getEnabledIndexes();\n if (enabled.length > 0) {\n ctx.setActiveIndex(enabled[0]);\n ctx.focusTarget(enabled[0]);\n }\n } else if (event.key === 'End') {\n event.preventDefault();\n const enabled = ctx.getEnabledIndexes();\n if (enabled.length > 0) {\n const last = enabled[enabled.length - 1];\n ctx.setActiveIndex(last);\n ctx.focusTarget(last);\n }\n } else if (event.key === 'Escape') {\n if (menuCtx.opened) {\n ctx.closeMenu();\n }\n } else if (event.key === 'Tab') {\n if (menuCtx.opened) {\n ctx.closeMenu();\n }\n } else if (isPrintableKey(event)) {\n typeAhead(event);\n }\n });\n\n return (\n <Popover.Target refProp={refProp} popupType=\"menu\">\n <UnstyledButton\n {...others}\n unstyled={ctx.unstyled}\n role=\"menuitem\"\n tabIndex={isActive \|\| isUnresolvedTabStop ? 0 : -1}\n disabled={disabled}\n data-menubar-target\n data-menubar-id={menuCtx.id}\n data-disabled={dataDisabled \|\| undefined}\n data-expanded={menuCtx.opened \|\| undefined}\n data-mantine-stop-propagation={menuCtx.opened \|\| undefined}\n {...ctx.getStyles('target', { className, style })}\n onClick={handleClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onFocus={handleFocus}\n onKeyDown={handleKeyDown}\n >\n {children}\n </UnstyledButton>\n </Popover.Target>\n );\n}\n\nMenubarTarget.displayName = '@mantine/core/MenubarTarget';\n"],"mappings":"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"}
1	+ {"version":3,"file":"MenubarTarget.mjs","names":[],"sources":["../../../../src/components/Menubar/MenubarTarget/MenubarTarget.tsx"],"sourcesContent":["import {\n createEventHandler,\n ElementProps,\n MantineStyleProp,\n useDirection,\n useProps,\n} from '../../../core';\nimport { Popover } from '../../Popover';\nimport { UnstyledButton } from '../../UnstyledButton';\nimport { useMenubarContext, useMenubarMenuContext } from '../Menubar.context';\n\nexport interface MenubarTargetProps extends ElementProps<'button'> {\n 'data-disabled'?: boolean;\n\n /** Target label /\n children: React.ReactNode;\n\n /* Inline styles applied to the target button /\n style?: MantineStyleProp;\n\n /* Key of the prop used to get element ref, useful for forwarding refs to custom components @default 'ref' */\n refProp?: string;\n}\n\nconst defaultProps = {\n refProp: 'ref',\n} satisfies Partial<MenubarTargetProps>;\n\nfunction isPrintableKey(event: React.KeyboardEvent) {\n return (\n event.key.length === 1 && event.key !== ' ' && !event.ctrlKey && !event.metaKey && !event.altKey\n );\n}\n\nfunction getTargetLabel(node: HTMLElement) {\n return (node.textContent ?? '').trim().toLowerCase();\n}\n\nexport function MenubarTarget(props: MenubarTargetProps) {\n const {\n children,\n refProp,\n className,\n style,\n disabled,\n 'data-disabled': dataDisabled,\n onClick,\n onMouseEnter,\n onMouseLeave,\n onFocus,\n onKeyDown,\n ...others\n } = useProps('MenubarTarget', defaultProps, props);\n\n const ctx = useMenubarContext();\n const menuCtx = useMenubarMenuContext();\n const { dir } = useDirection();\n\n const isDisabled = disabled \|\| dataDisabled;\n const isActive = ctx.activeIndex === menuCtx.index;\n\n // Before the menu indexes resolve from the DOM (first render / SSR HTML), every target\n // would otherwise compute `tabIndex={-1}`, leaving the menubar with no tab stop until\n // effects run. Keep unresolved targets focusable so keyboard users can enter the menubar.\n const isUnresolvedTabStop = menuCtx.index === -1 && !isDisabled;\n\n const moveToAdjacent = (direction: 1 \| -1) => {\n const nextIndex = ctx.getAdjacentIndex(menuCtx.index, direction);\n ctx.setActiveIndex(nextIndex);\n ctx.focusTarget(nextIndex);\n if (ctx.openIndex !== null) {\n ctx.openMenu(nextIndex, 'click');\n }\n };\n\n const openAndFocusItem = (itemPosition: 'first' \| 'last') => {\n ctx.openMenu(menuCtx.index, 'click');\n ctx.setActiveIndex(menuCtx.index);\n ctx.focusMenuItem(menuCtx.index, itemPosition);\n };\n\n const typeAhead = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n const targets = ctx.getTargets();\n if (targets.length === 0) {\n return;\n }\n\n const char = event.key.toLowerCase();\n for (let offset = 1; offset <= targets.length; offset += 1) {\n const index = (menuCtx.index + offset) % targets.length;\n const node = targets[index];\n if (\n node &&\n !node.disabled &&\n !node.hasAttribute('data-disabled') &&\n getTargetLabel(node).startsWith(char)\n ) {\n event.preventDefault();\n ctx.setActiveIndex(index);\n node.focus();\n if (ctx.openIndex !== null) {\n ctx.openMenu(index, 'click');\n }\n break;\n }\n }\n };\n\n const handleClick = createEventHandler<any>(onClick, () => {\n if (isDisabled) {\n return;\n }\n if (ctx.openIndex === menuCtx.index && ctx.getOpenSource() !== 'hover') {\n ctx.closeMenu();\n } else {\n ctx.openMenu(menuCtx.index, 'click');\n ctx.setActiveIndex(menuCtx.index);\n }\n });\n\n const handleMouseEnter = createEventHandler<any>(onMouseEnter, () => {\n if (isDisabled) {\n return;\n }\n ctx.cancelClose();\n if (ctx.trigger === 'hover') {\n ctx.openMenu(menuCtx.index, 'hover');\n ctx.setActiveIndex(menuCtx.index);\n } else if (ctx.openIndex !== null && ctx.openIndex !== menuCtx.index) {\n // Hover-switching with trigger=\"click\" continues a click-driven interaction:\n // keep 'click' as the open source so that the next click on the target\n // closes the menu, same as a click-opened menu (desktop application pattern)\n ctx.openMenu(menuCtx.index, 'click');\n ctx.setActiveIndex(menuCtx.index);\n }\n });\n\n const handleMouseLeave = createEventHandler<any>(onMouseLeave, () => {\n if (ctx.trigger === 'hover') {\n ctx.scheduleClose();\n }\n });\n\n const handleFocus = createEventHandler<any>(onFocus, () => ctx.setActiveIndex(menuCtx.index));\n\n const handleKeyDown = createEventHandler<any>(onKeyDown, (event) => {\n if (isDisabled) {\n return;\n }\n const forwardKey = dir === 'rtl' ? 'ArrowLeft' : 'ArrowRight';\n const backKey = dir === 'rtl' ? 'ArrowRight' : 'ArrowLeft';\n\n if (event.key === forwardKey) {\n event.preventDefault();\n moveToAdjacent(1);\n } else if (event.key === backKey) {\n event.preventDefault();\n moveToAdjacent(-1);\n } else if (event.key === 'ArrowDown' \|\| event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n openAndFocusItem('first');\n } else if (event.key === 'ArrowUp') {\n event.preventDefault();\n openAndFocusItem('last');\n } else if (event.key === 'Home') {\n event.preventDefault();\n const enabled = ctx.getEnabledIndexes();\n if (enabled.length > 0) {\n ctx.setActiveIndex(enabled[0]);\n ctx.focusTarget(enabled[0]);\n }\n } else if (event.key === 'End') {\n event.preventDefault();\n const enabled = ctx.getEnabledIndexes();\n if (enabled.length > 0) {\n const last = enabled[enabled.length - 1];\n ctx.setActiveIndex(last);\n ctx.focusTarget(last);\n }\n } else if (event.key === 'Escape') {\n if (menuCtx.opened) {\n ctx.closeMenu();\n }\n } else if (event.key === 'Tab') {\n if (menuCtx.opened) {\n ctx.closeMenu();\n }\n } else if (isPrintableKey(event)) {\n typeAhead(event);\n }\n });\n\n return (\n <Popover.Target refProp={refProp} popupType=\"menu\">\n <UnstyledButton\n {...others}\n unstyled={ctx.unstyled}\n role=\"menuitem\"\n tabIndex={isActive \|\| isUnresolvedTabStop ? 0 : -1}\n disabled={disabled}\n data-menubar-target\n data-menubar-id={menuCtx.id}\n data-disabled={dataDisabled \|\| undefined}\n data-expanded={menuCtx.opened \|\| undefined}\n data-mantine-stop-propagation={menuCtx.opened \|\| undefined}\n {...ctx.getStyles('target', { className, style })}\n onClick={handleClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onFocus={handleFocus}\n onKeyDown={handleKeyDown}\n >\n {children}\n </UnstyledButton>\n </Popover.Target>\n );\n}\n\nMenubarTarget.displayName = '@mantine/core/MenubarTarget';\n"],"mappings":"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"}

package/esm/components/Modal/Modal.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.mjs","names":["classes"],"sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import { use, useEffect } from 'react';\nimport { factory, Factory, getDefaultZIndex, useProps } from '../../core';\nimport { ModalBaseCloseButtonProps, ModalBaseOverlayProps } from '../ModalBase';\nimport { ModalBody, type ModalBodyProps } from './ModalBody';\nimport { ModalCloseButton, type ModalCloseButtonProps } from './ModalCloseButton';\nimport { ModalContent, type ModalContentProps } from './ModalContent';\nimport { ModalHeader, type ModalHeaderProps } from './ModalHeader';\nimport { ModalOverlay, type ModalOverlayProps } from './ModalOverlay';\nimport {\n ModalRoot,\n ModalRootCssVariables,\n ModalRootProps,\n ModalRootStylesNames,\n} from './ModalRoot';\nimport { ModalStack, ModalStackContext, type ModalStackProps } from './ModalStack';\nimport { ModalTitle, type ModalTitleProps } from './ModalTitle';\nimport classes from './Modal.module.css';\nexport type ModalStylesNames = ModalRootStylesNames;\nexport type ModalCssVariables = ModalRootCssVariables;\n\nexport interface ModalProps extends ModalRootProps {\n __staticSelector?: string;\n\n /** Modal title /\n title?: React.ReactNode;\n\n /* If set, the overlay is rendered @default true /\n withOverlay?: boolean;\n\n /* Props passed down to the `Overlay` component, use to configure opacity, `background-color`, styles and other properties /\n overlayProps?: ModalBaseOverlayProps;\n\n /* Modal content /\n children?: React.ReactNode;\n\n /* If set, the close button is rendered @default true /\n withCloseButton?: boolean;\n\n /* Props passed down to the close button /\n closeButtonProps?: ModalBaseCloseButtonProps;\n\n /* Id of the modal in the `Modal.Stack` */\n stackId?: string;\n}\n\nexport type ModalFactory = Factory<{\n props: ModalProps;\n ref: HTMLDivElement;\n stylesNames: ModalStylesNames;\n vars: ModalCssVariables;\n staticComponents: {\n Root: typeof ModalRoot;\n Overlay: typeof ModalOverlay;\n Content: typeof ModalContent;\n Body: typeof ModalBody;\n Header: typeof ModalHeader;\n Title: typeof ModalTitle;\n CloseButton: typeof ModalCloseButton;\n Stack: typeof ModalStack;\n };\n}>;\n\nconst defaultProps = {\n closeOnClickOutside: true,\n withinPortal: true,\n lockScroll: true,\n trapFocus: true,\n returnFocus: true,\n closeOnEscape: true,\n keepMounted: false,\n zIndex: getDefaultZIndex('modal'),\n transitionProps: { duration: 200, transition: 'fade-down' },\n withOverlay: true,\n withCloseButton: true,\n} satisfies Partial<ModalProps>;\n\nexport const Modal = factory<ModalFactory>((_props) => {\n const {\n title,\n withOverlay,\n overlayProps,\n withCloseButton,\n closeButtonProps,\n children,\n radius,\n opened,\n stackId,\n zIndex,\n ...others\n } = useProps('Modal', defaultProps, _props);\n const ctx = use(ModalStackContext);\n const hasHeader = !!title \|\| withCloseButton;\n const stackProps =\n ctx && stackId\n ? {\n closeOnEscape: ctx.currentId === stackId,\n trapFocus: ctx.currentId === stackId,\n zIndex: ctx.getZIndex(stackId),\n }\n : {};\n\n const overlayVisible =\n withOverlay === false ? false : stackId && ctx ? ctx.currentId === stackId : opened;\n\n useEffect(() => {\n if (ctx && stackId) {\n opened\n ? ctx.addModal(stackId, zIndex \|\| getDefaultZIndex('modal'))\n : ctx.removeModal(stackId);\n }\n }, [opened, stackId, zIndex]);\n\n return (\n <ModalRoot\n radius={radius}\n opened={opened}\n zIndex={ctx && stackId ? ctx.getZIndex(stackId) : zIndex}\n {...others}\n {...stackProps}\n >\n {withOverlay && (\n <ModalOverlay\n visible={overlayVisible}\n transitionProps={ctx && stackId ? { duration: 0 } : undefined}\n {...overlayProps}\n />\n )}\n <ModalContent\n radius={radius}\n __hidden={ctx && stackId && opened ? stackId !== ctx.currentId : false}\n >\n {hasHeader && (\n <ModalHeader>\n {title && <ModalTitle>{title}</ModalTitle>}\n {withCloseButton && <ModalCloseButton {...closeButtonProps} />}\n </ModalHeader>\n )}\n\n <ModalBody>{children}</ModalBody>\n </ModalContent>\n </ModalRoot>\n );\n});\n\nModal.classes = classes;\nModal.displayName = '@mantine/core/Modal';\nModal.Root = ModalRoot;\nModal.Overlay = ModalOverlay;\nModal.Content = ModalContent;\nModal.Body = ModalBody;\nModal.Header = ModalHeader;\nModal.Title = ModalTitle;\nModal.CloseButton = ModalCloseButton;\nModal.Stack = ModalStack;\n\nexport namespace Modal {\n export type Props = ModalProps;\n export type StylesNames = ModalStylesNames;\n export type CssVariables = ModalCssVariables;\n export type Factory = ModalFactory;\n\n export namespace Root {\n export type Props = ModalRootProps;\n }\n\n export namespace Body {\n export type Props = ModalBodyProps;\n }\n\n export namespace CloseButton {\n export type Props = ModalCloseButtonProps;\n }\n\n export namespace Content {\n export type Props = ModalContentProps;\n }\n\n export namespace Header {\n export type Props = ModalHeaderProps;\n }\n\n export namespace Overlay {\n export type Props = ModalOverlayProps;\n }\n\n export namespace Title {\n export type Props = ModalTitleProps;\n }\n\n export namespace Stack {\n export type Props = ModalStackProps;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;AA8DA,MAAM,eAAe;CACnB,qBAAqB;CACrB,cAAc;CACd,YAAY;CACZ,WAAW;CACX,aAAa;CACb,eAAe;CACf,aAAa;CACb,QAAQ,iBAAiB,OAAO;CAChC,iBAAiB;EAAE,UAAU;EAAK,YAAY;CAAY;CAC1D,aAAa;CACb,iBAAiB;AACnB;AAEA,MAAa,QAAQ,SAAuB,WAAW;CACrD,MAAM,EACJ,OACA,aACA,cACA,iBACA,kBACA,UACA,QACA,QACA,SACA,QACA,GAAG,WACD,SAAS,SAAS,cAAc,MAAM;CAC1C,MAAM,MAAM,IAAI,iBAAiB;CACjC,MAAM,YAAY,CAAC,CAAC,SAAS;CAC7B,MAAM,aACJ,OAAO,UACH;EACE,eAAe,IAAI,cAAc;EACjC,WAAW,IAAI,cAAc;EAC7B,QAAQ,IAAI,UAAU,OAAO;CAC/B,IACA,CAAC;CAEP,MAAM,iBACJ,gBAAgB,QAAQ,QAAQ,WAAW,MAAM,IAAI,cAAc,UAAU;CAE/E,gBAAgB;EACd,IAAI,OAAO,SACT,SACI,IAAI,SAAS,SAAS,UAAU,iBAAiB,OAAO,CAAC,IACzD,IAAI,YAAY,OAAO;CAE/B,GAAG;EAAC;EAAQ;EAAS;CAAM,CAAC;CAE5B,OACE,qBAAC,WAAD;EACU;EACA;EACR,QAAQ,OAAO,UAAU,IAAI,UAAU,OAAO,IAAI;EAClD,GAAI;EACJ,GAAI;~~YALN~~,CAOG,eACC,oBAAC,cAAD;GACE,SAAS;GACT,iBAAiB,OAAO,UAAU,EAAE,UAAU,EAAE,IAAI,KAAA;GACpD,GAAI;EACL,CAAA,GAEH,qBAAC,cAAD;GACU;GACR,UAAU,OAAO,WAAW,SAAS,YAAY,IAAI,YAAY;~~aAFnE~~,CAIG,aACC,qBAAC,aAAD,EAAA,UAAA,CACG,SAAS,oBAAC,YAAD,EAAA,UAAa,MAAkB,CAAA,GACxC,mBAAmB,oBAAC,kBAAD,EAAkB,GAAI,iBAAmB,CAAA,CAClD,EAAA,CAAA,GAGf,oBAAC,WAAD,EAAY,SAAoB,CAAA,CACpB;~~IACL~~;;AAEf,CAAC;AAED,MAAM,UAAUA;AAChB,MAAM,cAAc;AACpB,MAAM,OAAO;AACb,MAAM,UAAU;AAChB,MAAM,UAAU;AAChB,MAAM,OAAO;AACb,MAAM,SAAS;AACf,MAAM,QAAQ;AACd,MAAM,cAAc;AACpB,MAAM,QAAQ"}
1	+ {"version":3,"file":"Modal.mjs","names":["classes"],"sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import { use, useEffect } from 'react';\nimport { factory, Factory, getDefaultZIndex, useProps } from '../../core';\nimport { ModalBaseCloseButtonProps, ModalBaseOverlayProps } from '../ModalBase';\nimport { ModalBody, type ModalBodyProps } from './ModalBody';\nimport { ModalCloseButton, type ModalCloseButtonProps } from './ModalCloseButton';\nimport { ModalContent, type ModalContentProps } from './ModalContent';\nimport { ModalHeader, type ModalHeaderProps } from './ModalHeader';\nimport { ModalOverlay, type ModalOverlayProps } from './ModalOverlay';\nimport {\n ModalRoot,\n ModalRootCssVariables,\n ModalRootProps,\n ModalRootStylesNames,\n} from './ModalRoot';\nimport { ModalStack, ModalStackContext, type ModalStackProps } from './ModalStack';\nimport { ModalTitle, type ModalTitleProps } from './ModalTitle';\nimport classes from './Modal.module.css';\nexport type ModalStylesNames = ModalRootStylesNames;\nexport type ModalCssVariables = ModalRootCssVariables;\n\nexport interface ModalProps extends ModalRootProps {\n __staticSelector?: string;\n\n /** Modal title /\n title?: React.ReactNode;\n\n /* If set, the overlay is rendered @default true /\n withOverlay?: boolean;\n\n /* Props passed down to the `Overlay` component, use to configure opacity, `background-color`, styles and other properties /\n overlayProps?: ModalBaseOverlayProps;\n\n /* Modal content /\n children?: React.ReactNode;\n\n /* If set, the close button is rendered @default true /\n withCloseButton?: boolean;\n\n /* Props passed down to the close button /\n closeButtonProps?: ModalBaseCloseButtonProps;\n\n /* Id of the modal in the `Modal.Stack` */\n stackId?: string;\n}\n\nexport type ModalFactory = Factory<{\n props: ModalProps;\n ref: HTMLDivElement;\n stylesNames: ModalStylesNames;\n vars: ModalCssVariables;\n staticComponents: {\n Root: typeof ModalRoot;\n Overlay: typeof ModalOverlay;\n Content: typeof ModalContent;\n Body: typeof ModalBody;\n Header: typeof ModalHeader;\n Title: typeof ModalTitle;\n CloseButton: typeof ModalCloseButton;\n Stack: typeof ModalStack;\n };\n}>;\n\nconst defaultProps = {\n closeOnClickOutside: true,\n withinPortal: true,\n lockScroll: true,\n trapFocus: true,\n returnFocus: true,\n closeOnEscape: true,\n keepMounted: false,\n zIndex: getDefaultZIndex('modal'),\n transitionProps: { duration: 200, transition: 'fade-down' },\n withOverlay: true,\n withCloseButton: true,\n} satisfies Partial<ModalProps>;\n\nexport const Modal = factory<ModalFactory>((_props) => {\n const {\n title,\n withOverlay,\n overlayProps,\n withCloseButton,\n closeButtonProps,\n children,\n radius,\n opened,\n stackId,\n zIndex,\n ...others\n } = useProps('Modal', defaultProps, _props);\n const ctx = use(ModalStackContext);\n const hasHeader = !!title \|\| withCloseButton;\n const stackProps =\n ctx && stackId\n ? {\n closeOnEscape: ctx.currentId === stackId,\n trapFocus: ctx.currentId === stackId,\n zIndex: ctx.getZIndex(stackId),\n }\n : {};\n\n const overlayVisible =\n withOverlay === false ? false : stackId && ctx ? ctx.currentId === stackId : opened;\n\n useEffect(() => {\n if (ctx && stackId) {\n opened\n ? ctx.addModal(stackId, zIndex \|\| getDefaultZIndex('modal'))\n : ctx.removeModal(stackId);\n }\n }, [opened, stackId, zIndex]);\n\n return (\n <ModalRoot\n radius={radius}\n opened={opened}\n zIndex={ctx && stackId ? ctx.getZIndex(stackId) : zIndex}\n {...others}\n {...stackProps}\n >\n {withOverlay && (\n <ModalOverlay\n visible={overlayVisible}\n transitionProps={ctx && stackId ? { duration: 0 } : undefined}\n {...overlayProps}\n />\n )}\n <ModalContent\n radius={radius}\n __hidden={ctx && stackId && opened ? stackId !== ctx.currentId : false}\n >\n {hasHeader && (\n <ModalHeader>\n {title && <ModalTitle>{title}</ModalTitle>}\n {withCloseButton && <ModalCloseButton {...closeButtonProps} />}\n </ModalHeader>\n )}\n\n <ModalBody>{children}</ModalBody>\n </ModalContent>\n </ModalRoot>\n );\n});\n\nModal.classes = classes;\nModal.displayName = '@mantine/core/Modal';\nModal.Root = ModalRoot;\nModal.Overlay = ModalOverlay;\nModal.Content = ModalContent;\nModal.Body = ModalBody;\nModal.Header = ModalHeader;\nModal.Title = ModalTitle;\nModal.CloseButton = ModalCloseButton;\nModal.Stack = ModalStack;\n\nexport namespace Modal {\n export type Props = ModalProps;\n export type StylesNames = ModalStylesNames;\n export type CssVariables = ModalCssVariables;\n export type Factory = ModalFactory;\n\n export namespace Root {\n export type Props = ModalRootProps;\n }\n\n export namespace Body {\n export type Props = ModalBodyProps;\n }\n\n export namespace CloseButton {\n export type Props = ModalCloseButtonProps;\n }\n\n export namespace Content {\n export type Props = ModalContentProps;\n }\n\n export namespace Header {\n export type Props = ModalHeaderProps;\n }\n\n export namespace Overlay {\n export type Props = ModalOverlayProps;\n }\n\n export namespace Title {\n export type Props = ModalTitleProps;\n }\n\n export namespace Stack {\n export type Props = ModalStackProps;\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;AA8DA,MAAM,eAAe;CACnB,qBAAqB;CACrB,cAAc;CACd,YAAY;CACZ,WAAW;CACX,aAAa;CACb,eAAe;CACf,aAAa;CACb,QAAQ,iBAAiB,OAAO;CAChC,iBAAiB;EAAE,UAAU;EAAK,YAAY;CAAY;CAC1D,aAAa;CACb,iBAAiB;AACnB;AAEA,MAAa,QAAQ,SAAuB,WAAW;CACrD,MAAM,EACJ,OACA,aACA,cACA,iBACA,kBACA,UACA,QACA,QACA,SACA,QACA,GAAG,WACD,SAAS,SAAS,cAAc,MAAM;CAC1C,MAAM,MAAM,IAAI,iBAAiB;CACjC,MAAM,YAAY,CAAC,CAAC,SAAS;CAC7B,MAAM,aACJ,OAAO,UACH;EACE,eAAe,IAAI,cAAc;EACjC,WAAW,IAAI,cAAc;EAC7B,QAAQ,IAAI,UAAU,OAAO;CAC/B,IACA,CAAC;CAEP,MAAM,iBACJ,gBAAgB,QAAQ,QAAQ,WAAW,MAAM,IAAI,cAAc,UAAU;CAE/E,gBAAgB;EACd,IAAI,OAAO,SACT,SACI,IAAI,SAAS,SAAS,UAAU,iBAAiB,OAAO,CAAC,IACzD,IAAI,YAAY,OAAO;CAE/B,GAAG;EAAC;EAAQ;EAAS;CAAM,CAAC;CAE5B,OACE,qBAAC,WAAD;EACU;EACA;EACR,QAAQ,OAAO,UAAU,IAAI,UAAU,OAAO,IAAI;EAClD,GAAI;EACJ,GAAI;EALN,UAAA,CAOG,eACC,oBAAC,cAAD;GACE,SAAS;GACT,iBAAiB,OAAO,UAAU,EAAE,UAAU,EAAE,IAAI,KAAA;GACpD,GAAI;EACL,CAAA,GAEH,qBAAC,cAAD;GACU;GACR,UAAU,OAAO,WAAW,SAAS,YAAY,IAAI,YAAY;GAFnE,UAAA,CAIG,aACC,qBAAC,aAAD,EAAA,UAAA,CACG,SAAS,oBAAC,YAAD,EAAA,UAAa,MAAkB,CAAA,GACxC,mBAAmB,oBAAC,kBAAD,EAAkB,GAAI,iBAAmB,CAAA,CAClD,EAAA,CAAA,GAGf,oBAAC,WAAD,EAAY,SAAoB,CAAA,CACpB;EACL,CAAA,CAAA;;AAEf,CAAC;AAED,MAAM,UAAUA;AAChB,MAAM,cAAc;AACpB,MAAM,OAAO;AACb,MAAM,UAAU;AAChB,MAAM,UAAU;AAChB,MAAM,OAAO;AACb,MAAM,SAAS;AACf,MAAM,QAAQ;AACd,MAAM,cAAc;AACpB,MAAM,QAAQ"}

package/esm/components/Modal/ModalBody.mjs CHANGED Viewed

@@ -8,8 +8,9 @@ import { jsx } from "react/jsx-runtime";
 //#region packages/@mantine/core/src/components/Modal/ModalBody.tsx
 const ModalBody = factory((_props) => {
 	const { classNames, className, style, styles, vars, ...others } = useProps("ModalBody", null, _props);
+	const ctx = useModalContext();
 	return /* @__PURE__ */ jsx(ModalBaseBody, {
-		...useModalContext().getStyles("body", {
+		...ctx.getStyles("body", {
 			classNames,
 			style,
 			styles,

package/esm/components/Modal/ModalBody.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalBody.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalBody.tsx"],"sourcesContent":["import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core';\nimport { ModalBaseBody, ModalBaseBodyProps } from '../ModalBase';\nimport { useModalContext } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalBodyStylesNames = 'body';\n\nexport interface ModalBodyProps\n extends ModalBaseBodyProps, CompoundStylesApiProps<ModalBodyFactory> {}\n\nexport type ModalBodyFactory = Factory<{\n props: ModalBodyProps;\n ref: HTMLDivElement;\n stylesNames: ModalBodyStylesNames;\n compound: true;\n}>;\n\nexport const ModalBody = factory<ModalBodyFactory>((_props) => {\n const props = useProps('ModalBody', null, _props);\n const { classNames, className, style, styles, vars, ...others } = props;\n\n const ctx = useModalContext();\n\n return (\n <ModalBaseBody\n {...ctx.getStyles('body', { classNames, style, styles, className })}\n {...others}\n />\n );\n});\n\nModalBody.classes = classes;\nModalBody.displayName = '@mantine/core/ModalBody';\n"],"mappings":";;;;;;;;AAiBA,MAAa,YAAY,SAA2B,WAAW;CAE7D,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WADzC,SAAS,aAAa,MAAM,MAC4B;~~CAItE~~,OACE,oBAAC,eAAD;EACE,~~GAJQ~~,~~gBAIF~~,~~CAAC,CAAC,~~UAAU,QAAQ;GAAE;GAAY;GAAO;GAAQ;EAAU,CAAC;EAClE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,UAAU,UAAUA;AACpB,UAAU,cAAc"}
1	+ {"version":3,"file":"ModalBody.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalBody.tsx"],"sourcesContent":["import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core';\nimport { ModalBaseBody, ModalBaseBodyProps } from '../ModalBase';\nimport { useModalContext } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalBodyStylesNames = 'body';\n\nexport interface ModalBodyProps\n extends ModalBaseBodyProps, CompoundStylesApiProps<ModalBodyFactory> {}\n\nexport type ModalBodyFactory = Factory<{\n props: ModalBodyProps;\n ref: HTMLDivElement;\n stylesNames: ModalBodyStylesNames;\n compound: true;\n}>;\n\nexport const ModalBody = factory<ModalBodyFactory>((_props) => {\n const props = useProps('ModalBody', null, _props);\n const { classNames, className, style, styles, vars, ...others } = props;\n\n const ctx = useModalContext();\n\n return (\n <ModalBaseBody\n {...ctx.getStyles('body', { classNames, style, styles, className })}\n {...others}\n />\n );\n});\n\nModalBody.classes = classes;\nModalBody.displayName = '@mantine/core/ModalBody';\n"],"mappings":";;;;;;;;AAiBA,MAAa,YAAY,SAA2B,WAAW;CAE7D,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WADzC,SAAS,aAAa,MAAM,MAC4B;CAEtE,MAAM,MAAM,gBAAgB;CAE5B,OACE,oBAAC,eAAD;EACE,GAAI,IAAI,UAAU,QAAQ;GAAE;GAAY;GAAO;GAAQ;EAAU,CAAC;EAClE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,UAAU,UAAUA;AACpB,UAAU,cAAc"}

package/esm/components/Modal/ModalCloseButton.mjs CHANGED Viewed

@@ -8,8 +8,9 @@ import { jsx } from "react/jsx-runtime";
 //#region packages/@mantine/core/src/components/Modal/ModalCloseButton.tsx
 const ModalCloseButton = factory((_props) => {
 	const { classNames, className, style, styles, vars, ...others } = useProps("ModalCloseButton", null, _props);
+	const ctx = useModalContext();
 	return /* @__PURE__ */ jsx(ModalBaseCloseButton, {
-		...useModalContext().getStyles("close", {
+		...ctx.getStyles("close", {
 			classNames,
 			style,
 			styles,

package/esm/components/Modal/ModalCloseButton.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalCloseButton.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalCloseButton.tsx"],"sourcesContent":["import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core';\nimport { ModalBaseCloseButton, ModalBaseCloseButtonProps } from '../ModalBase';\nimport { useModalContext } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalCloseButtonStylesNames = 'close';\n\nexport interface ModalCloseButtonProps\n extends ModalBaseCloseButtonProps, CompoundStylesApiProps<ModalCloseButtonFactory> {}\n\nexport type ModalCloseButtonFactory = Factory<{\n props: ModalCloseButtonProps;\n ref: HTMLButtonElement;\n stylesNames: ModalCloseButtonStylesNames;\n compound: true;\n}>;\n\nexport const ModalCloseButton = factory<ModalCloseButtonFactory>((_props) => {\n const props = useProps('ModalCloseButton', null, _props);\n const { classNames, className, style, styles, vars, ...others } = props;\n\n const ctx = useModalContext();\n\n return (\n <ModalBaseCloseButton\n {...ctx.getStyles('close', { classNames, style, styles, className })}\n {...others}\n />\n );\n});\n\nModalCloseButton.classes = classes;\nModalCloseButton.displayName = '@mantine/core/ModalCloseButton';\n"],"mappings":";;;;;;;;AAiBA,MAAa,mBAAmB,SAAkC,WAAW;CAE3E,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WADzC,SAAS,oBAAoB,MAAM,MACqB;~~CAItE~~,OACE,oBAAC,sBAAD;EACE,~~GAJQ~~,~~gBAIF~~,~~CAAC,CAAC,~~UAAU,SAAS;GAAE;GAAY;GAAO;GAAQ;EAAU,CAAC;EACnE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,iBAAiB,UAAUA;AAC3B,iBAAiB,cAAc"}
1	+ {"version":3,"file":"ModalCloseButton.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalCloseButton.tsx"],"sourcesContent":["import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core';\nimport { ModalBaseCloseButton, ModalBaseCloseButtonProps } from '../ModalBase';\nimport { useModalContext } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalCloseButtonStylesNames = 'close';\n\nexport interface ModalCloseButtonProps\n extends ModalBaseCloseButtonProps, CompoundStylesApiProps<ModalCloseButtonFactory> {}\n\nexport type ModalCloseButtonFactory = Factory<{\n props: ModalCloseButtonProps;\n ref: HTMLButtonElement;\n stylesNames: ModalCloseButtonStylesNames;\n compound: true;\n}>;\n\nexport const ModalCloseButton = factory<ModalCloseButtonFactory>((_props) => {\n const props = useProps('ModalCloseButton', null, _props);\n const { classNames, className, style, styles, vars, ...others } = props;\n\n const ctx = useModalContext();\n\n return (\n <ModalBaseCloseButton\n {...ctx.getStyles('close', { classNames, style, styles, className })}\n {...others}\n />\n );\n});\n\nModalCloseButton.classes = classes;\nModalCloseButton.displayName = '@mantine/core/ModalCloseButton';\n"],"mappings":";;;;;;;;AAiBA,MAAa,mBAAmB,SAAkC,WAAW;CAE3E,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WADzC,SAAS,oBAAoB,MAAM,MACqB;CAEtE,MAAM,MAAM,gBAAgB;CAE5B,OACE,oBAAC,sBAAD;EACE,GAAI,IAAI,UAAU,SAAS;GAAE;GAAY;GAAO;GAAQ;EAAU,CAAC;EACnE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,iBAAiB,UAAUA;AAC3B,iBAAiB,cAAc"}

package/esm/components/Modal/ModalContent.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalContent.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalContent.tsx"],"sourcesContent":["import { CompoundStylesApiProps, factory, Factory, rem, useProps } from '../../core';\nimport { ModalBaseContent, ModalBaseContentProps, NativeScrollArea } from '../ModalBase';\nimport { useModalContext } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalContentStylesNames = 'content' \| 'inner';\n\nexport interface ModalContentProps\n extends ModalBaseContentProps, CompoundStylesApiProps<ModalContentFactory> {\n __hidden?: boolean;\n}\n\nexport type ModalContentFactory = Factory<{\n props: ModalContentProps;\n ref: HTMLDivElement;\n stylesNames: ModalContentStylesNames;\n compound: true;\n}>;\n\nexport const ModalContent = factory<ModalContentFactory>((_props) => {\n const props = useProps('ModalContent', null, _props);\n const { classNames, className, style, styles, vars, children, __hidden, ...others } = props;\n\n const ctx = useModalContext();\n const Scroll: React.FC<any> = ctx.scrollAreaComponent \|\| NativeScrollArea;\n\n return (\n <ModalBaseContent\n {...ctx.getStyles('content', { className, style, styles, classNames })}\n innerProps={ctx.getStyles('inner', { className, style, styles, classNames })}\n data-full-screen={ctx.fullScreen \|\| undefined}\n data-modal-content\n data-hidden={__hidden \|\| undefined}\n {...others}\n >\n <Scroll\n style={{\n maxHeight: ctx.fullScreen ? '100dvh' : `calc(100dvh - (${rem(ctx.yOffset)} * 2))`,\n }}\n >\n {children}\n </Scroll>\n </ModalBaseContent>\n );\n});\n\nModalContent.classes = classes;\nModalContent.displayName = '@mantine/core/ModalContent';\n"],"mappings":";;;;;;;;;;AAmBA,MAAa,eAAe,SAA8B,WAAW;CAEnE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,UAAU,UAAU,GAAG,WAD7D,SAAS,gBAAgB,MAAM,MAC6C;CAE1F,MAAM,MAAM,gBAAgB;CAC5B,MAAM,SAAwB,IAAI,uBAAuB;CAEzD,OACE,oBAAC,kBAAD;EACE,GAAI,IAAI,UAAU,WAAW;GAAE;GAAW;GAAO;GAAQ;EAAW,CAAC;EACrE,YAAY,IAAI,UAAU,SAAS;GAAE;GAAW;GAAO;GAAQ;EAAW,CAAC;EAC3E,oBAAkB,IAAI,cAAc,KAAA;EACpC,sBAAA;EACA,eAAa,YAAY,KAAA;EACzB,GAAI;~~YAEJ~~,oBAAC,QAAD;GACE,OAAO,EACL,WAAW,IAAI,aAAa,WAAW,kBAAkB,IAAI,IAAI,OAAO,EAAE,QAC5E;GAEC;EACK,CAAA;CACQ,CAAA;AAEtB,CAAC;AAED,aAAa,UAAUA;AACvB,aAAa,cAAc"}
1	+ {"version":3,"file":"ModalContent.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalContent.tsx"],"sourcesContent":["import { CompoundStylesApiProps, factory, Factory, rem, useProps } from '../../core';\nimport { ModalBaseContent, ModalBaseContentProps, NativeScrollArea } from '../ModalBase';\nimport { useModalContext } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalContentStylesNames = 'content' \| 'inner';\n\nexport interface ModalContentProps\n extends ModalBaseContentProps, CompoundStylesApiProps<ModalContentFactory> {\n __hidden?: boolean;\n}\n\nexport type ModalContentFactory = Factory<{\n props: ModalContentProps;\n ref: HTMLDivElement;\n stylesNames: ModalContentStylesNames;\n compound: true;\n}>;\n\nexport const ModalContent = factory<ModalContentFactory>((_props) => {\n const props = useProps('ModalContent', null, _props);\n const { classNames, className, style, styles, vars, children, __hidden, ...others } = props;\n\n const ctx = useModalContext();\n const Scroll: React.FC<any> = ctx.scrollAreaComponent \|\| NativeScrollArea;\n\n return (\n <ModalBaseContent\n {...ctx.getStyles('content', { className, style, styles, classNames })}\n innerProps={ctx.getStyles('inner', { className, style, styles, classNames })}\n data-full-screen={ctx.fullScreen \|\| undefined}\n data-modal-content\n data-hidden={__hidden \|\| undefined}\n {...others}\n >\n <Scroll\n style={{\n maxHeight: ctx.fullScreen ? '100dvh' : `calc(100dvh - (${rem(ctx.yOffset)} * 2))`,\n }}\n >\n {children}\n </Scroll>\n </ModalBaseContent>\n );\n});\n\nModalContent.classes = classes;\nModalContent.displayName = '@mantine/core/ModalContent';\n"],"mappings":";;;;;;;;;;AAmBA,MAAa,eAAe,SAA8B,WAAW;CAEnE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,UAAU,UAAU,GAAG,WAD7D,SAAS,gBAAgB,MAAM,MAC6C;CAE1F,MAAM,MAAM,gBAAgB;CAC5B,MAAM,SAAwB,IAAI,uBAAuB;CAEzD,OACE,oBAAC,kBAAD;EACE,GAAI,IAAI,UAAU,WAAW;GAAE;GAAW;GAAO;GAAQ;EAAW,CAAC;EACrE,YAAY,IAAI,UAAU,SAAS;GAAE;GAAW;GAAO;GAAQ;EAAW,CAAC;EAC3E,oBAAkB,IAAI,cAAc,KAAA;EACpC,sBAAA;EACA,eAAa,YAAY,KAAA;EACzB,GAAI;EAEJ,UAAA,oBAAC,QAAD;GACE,OAAO,EACL,WAAW,IAAI,aAAa,WAAW,kBAAkB,IAAI,IAAI,OAAO,EAAE,QAC5E;GAEC;EACK,CAAA;CACQ,CAAA;AAEtB,CAAC;AAED,aAAa,UAAUA;AACvB,aAAa,cAAc"}

package/esm/components/Modal/ModalHeader.mjs CHANGED Viewed

@@ -8,8 +8,9 @@ import { jsx } from "react/jsx-runtime";
 //#region packages/@mantine/core/src/components/Modal/ModalHeader.tsx
 const ModalHeader = factory((_props) => {
 	const { classNames, className, style, styles, vars, ...others } = useProps("ModalHeader", null, _props);
+	const ctx = useModalContext();
 	return /* @__PURE__ */ jsx(ModalBaseHeader, {
-		...useModalContext().getStyles("header", {
+		...ctx.getStyles("header", {
 			classNames,
 			style,
 			styles,

package/esm/components/Modal/ModalHeader.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalHeader.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalHeader.tsx"],"sourcesContent":["import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core';\nimport { ModalBaseHeader, ModalBaseHeaderProps } from '../ModalBase';\nimport { useModalContext } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalHeaderStylesNames = 'header';\n\nexport interface ModalHeaderProps\n extends ModalBaseHeaderProps, CompoundStylesApiProps<ModalHeaderFactory> {}\n\nexport type ModalHeaderFactory = Factory<{\n props: ModalHeaderProps;\n ref: HTMLElement;\n stylesNames: ModalHeaderStylesNames;\n compound: true;\n}>;\n\nexport const ModalHeader = factory<ModalHeaderFactory>((_props) => {\n const props = useProps('ModalHeader', null, _props);\n const { classNames, className, style, styles, vars, ...others } = props;\n\n const ctx = useModalContext();\n\n return (\n <ModalBaseHeader\n {...ctx.getStyles('header', { classNames, style, styles, className })}\n {...others}\n />\n );\n});\n\nModalHeader.classes = classes;\nModalHeader.displayName = '@mantine/core/ModalHeader';\n"],"mappings":";;;;;;;;AAiBA,MAAa,cAAc,SAA6B,WAAW;CAEjE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WADzC,SAAS,eAAe,MAAM,MAC0B;~~CAItE~~,OACE,oBAAC,iBAAD;EACE,~~GAJQ~~,~~gBAIF~~,~~CAAC,CAAC,~~UAAU,UAAU;GAAE;GAAY;GAAO;GAAQ;EAAU,CAAC;EACpE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,YAAY,UAAUA;AACtB,YAAY,cAAc"}
1	+ {"version":3,"file":"ModalHeader.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalHeader.tsx"],"sourcesContent":["import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core';\nimport { ModalBaseHeader, ModalBaseHeaderProps } from '../ModalBase';\nimport { useModalContext } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalHeaderStylesNames = 'header';\n\nexport interface ModalHeaderProps\n extends ModalBaseHeaderProps, CompoundStylesApiProps<ModalHeaderFactory> {}\n\nexport type ModalHeaderFactory = Factory<{\n props: ModalHeaderProps;\n ref: HTMLElement;\n stylesNames: ModalHeaderStylesNames;\n compound: true;\n}>;\n\nexport const ModalHeader = factory<ModalHeaderFactory>((_props) => {\n const props = useProps('ModalHeader', null, _props);\n const { classNames, className, style, styles, vars, ...others } = props;\n\n const ctx = useModalContext();\n\n return (\n <ModalBaseHeader\n {...ctx.getStyles('header', { classNames, style, styles, className })}\n {...others}\n />\n );\n});\n\nModalHeader.classes = classes;\nModalHeader.displayName = '@mantine/core/ModalHeader';\n"],"mappings":";;;;;;;;AAiBA,MAAa,cAAc,SAA6B,WAAW;CAEjE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WADzC,SAAS,eAAe,MAAM,MAC0B;CAEtE,MAAM,MAAM,gBAAgB;CAE5B,OACE,oBAAC,iBAAD;EACE,GAAI,IAAI,UAAU,UAAU;GAAE;GAAY;GAAO;GAAQ;EAAU,CAAC;EACpE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,YAAY,UAAUA;AACtB,YAAY,cAAc"}

package/esm/components/Modal/ModalOverlay.mjs CHANGED Viewed

@@ -8,8 +8,9 @@ import { jsx } from "react/jsx-runtime";
 //#region packages/@mantine/core/src/components/Modal/ModalOverlay.tsx
 const ModalOverlay = factory((_props) => {
 	const { classNames, className, style, styles, vars, ...others } = useProps("ModalOverlay", null, _props);
+	const ctx = useModalContext();
 	return /* @__PURE__ */ jsx(ModalBaseOverlay, {
-		...useModalContext().getStyles("overlay", {
+		...ctx.getStyles("overlay", {
 			classNames,
 			style,
 			styles,

package/esm/components/Modal/ModalOverlay.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalOverlay.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalOverlay.tsx"],"sourcesContent":["import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core';\nimport { ModalBaseOverlay, ModalBaseOverlayProps } from '../ModalBase';\nimport { useModalContext } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalOverlayStylesNames = 'overlay';\n\nexport interface ModalOverlayProps\n extends ModalBaseOverlayProps, CompoundStylesApiProps<ModalOverlayFactory> {}\n\nexport type ModalOverlayFactory = Factory<{\n props: ModalOverlayProps;\n ref: HTMLDivElement;\n stylesNames: ModalOverlayStylesNames;\n compound: true;\n}>;\n\nexport const ModalOverlay = factory<ModalOverlayFactory>((_props) => {\n const props = useProps('ModalOverlay', null, _props);\n const { classNames, className, style, styles, vars, ...others } = props;\n\n const ctx = useModalContext();\n\n return (\n <ModalBaseOverlay\n {...ctx.getStyles('overlay', { classNames, style, styles, className })}\n {...others}\n />\n );\n});\n\nModalOverlay.classes = classes;\nModalOverlay.displayName = '@mantine/core/ModalOverlay';\n"],"mappings":";;;;;;;;AAiBA,MAAa,eAAe,SAA8B,WAAW;CAEnE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WADzC,SAAS,gBAAgB,MAAM,MACyB;~~CAItE~~,OACE,oBAAC,kBAAD;EACE,~~GAJQ~~,~~gBAIF~~,~~CAAC,CAAC,~~UAAU,WAAW;GAAE;GAAY;GAAO;GAAQ;EAAU,CAAC;EACrE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,aAAa,UAAUA;AACvB,aAAa,cAAc"}
1	+ {"version":3,"file":"ModalOverlay.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalOverlay.tsx"],"sourcesContent":["import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core';\nimport { ModalBaseOverlay, ModalBaseOverlayProps } from '../ModalBase';\nimport { useModalContext } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalOverlayStylesNames = 'overlay';\n\nexport interface ModalOverlayProps\n extends ModalBaseOverlayProps, CompoundStylesApiProps<ModalOverlayFactory> {}\n\nexport type ModalOverlayFactory = Factory<{\n props: ModalOverlayProps;\n ref: HTMLDivElement;\n stylesNames: ModalOverlayStylesNames;\n compound: true;\n}>;\n\nexport const ModalOverlay = factory<ModalOverlayFactory>((_props) => {\n const props = useProps('ModalOverlay', null, _props);\n const { classNames, className, style, styles, vars, ...others } = props;\n\n const ctx = useModalContext();\n\n return (\n <ModalBaseOverlay\n {...ctx.getStyles('overlay', { classNames, style, styles, className })}\n {...others}\n />\n );\n});\n\nModalOverlay.classes = classes;\nModalOverlay.displayName = '@mantine/core/ModalOverlay';\n"],"mappings":";;;;;;;;AAiBA,MAAa,eAAe,SAA8B,WAAW;CAEnE,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WADzC,SAAS,gBAAgB,MAAM,MACyB;CAEtE,MAAM,MAAM,gBAAgB;CAE5B,OACE,oBAAC,kBAAD;EACE,GAAI,IAAI,UAAU,WAAW;GAAE;GAAY;GAAO;GAAQ;EAAU,CAAC;EACrE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,aAAa,UAAUA;AACvB,aAAa,cAAc"}

package/esm/components/Modal/ModalRoot.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalRoot.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalRoot.tsx"],"sourcesContent":["import {\n createVarsResolver,\n factory,\n Factory,\n getDefaultZIndex,\n getRadius,\n getSize,\n MantineRadius,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { ModalBase, ModalBaseProps, ModalBaseStylesNames } from '../ModalBase';\nimport { ScrollArea } from '../ScrollArea';\nimport { ModalProvider, ScrollAreaComponent } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalRootStylesNames = ModalBaseStylesNames;\nexport type ModalRootCssVariables = {\n root: '--modal-radius' \| '--modal-size' \| '--modal-y-offset' \| '--modal-x-offset';\n};\n\nexport interface ModalRootProps extends StylesApiProps<ModalRootFactory>, ModalBaseProps {\n __staticSelector?: string;\n\n /** Top/bottom modal offset @default 5dvh /\n yOffset?: React.CSSProperties['marginTop'];\n\n /* Left/right modal offset @default 5vw /\n xOffset?: React.CSSProperties['marginLeft'];\n\n /* Scroll area component @default 'div' /\n scrollAreaComponent?: ScrollAreaComponent;\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius /\n radius?: MantineRadius;\n\n /* If set, the modal is centered vertically @default false /\n centered?: boolean;\n\n /* If set, the modal takes the entire screen @default false */\n fullScreen?: boolean;\n}\n\nexport type ModalRootFactory = Factory<{\n props: ModalRootProps;\n ref: HTMLDivElement;\n stylesNames: ModalRootStylesNames;\n vars: ModalRootCssVariables;\n}>;\n\nconst defaultProps = {\n __staticSelector: 'Modal',\n closeOnClickOutside: true,\n withinPortal: true,\n lockScroll: true,\n trapFocus: true,\n returnFocus: true,\n closeOnEscape: true,\n keepMounted: false,\n zIndex: getDefaultZIndex('modal'),\n transitionProps: { duration: 200, transition: 'fade-down' },\n yOffset: '5dvh',\n} satisfies Partial<ModalRootProps>;\n\nconst varsResolver = createVarsResolver<ModalRootFactory>(\n (_, { radius, size, yOffset, xOffset }) => ({\n root: {\n '--modal-radius': radius === undefined ? undefined : getRadius(radius),\n '--modal-size': getSize(size, 'modal-size'),\n '--modal-y-offset': rem(yOffset),\n '--modal-x-offset': rem(xOffset),\n },\n })\n);\n\nexport const ModalRoot = factory<ModalRootFactory>((_props) => {\n const props = useProps('ModalRoot', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n yOffset,\n scrollAreaComponent,\n radius,\n fullScreen,\n centered,\n xOffset,\n __staticSelector,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<ModalRootFactory>({\n name: __staticSelector,\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 <ModalProvider value={{ yOffset, scrollAreaComponent, getStyles, fullScreen }}>\n <ModalBase\n {...getStyles('root')}\n data-full-screen={fullScreen \|\| undefined}\n data-centered={centered \|\| undefined}\n data-offset-scrollbars={scrollAreaComponent === ScrollArea.Autosize \|\| undefined}\n unstyled={unstyled}\n {...others}\n />\n </ModalProvider>\n );\n});\n\nModalRoot.classes = classes;\nModalRoot.varsResolver = varsResolver;\nModalRoot.displayName = '@mantine/core/ModalRoot';\n"],"mappings":";;;;;;;;;;;;;;AAoDA,MAAM,eAAe;CACnB,kBAAkB;CAClB,qBAAqB;CACrB,cAAc;CACd,YAAY;CACZ,WAAW;CACX,aAAa;CACb,eAAe;CACf,aAAa;CACb,QAAQ,iBAAiB,OAAO;CAChC,iBAAiB;EAAE,UAAU;EAAK,YAAY;CAAY;CAC1D,SAAS;AACX;AAEA,MAAM,eAAe,oBAClB,GAAG,EAAE,QAAQ,MAAM,SAAS,eAAe,EAC1C,MAAM;CACJ,kBAAkB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM;CACrE,gBAAgB,QAAQ,MAAM,YAAY;CAC1C,oBAAoB,IAAI,OAAO;CAC/B,oBAAoB,IAAI,OAAO;AACjC,EACF,EACF;AAEA,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,cAAc,MAAM;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SACA,qBACA,QACA,YACA,UACA,SACA,kBACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA4B;EAC5C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,oBAAC,eAAD;EAAe,OAAO;GAAE;GAAS;GAAqB;GAAW;EAAW;~~YAC1E~~,oBAAC,WAAD;GACE,GAAI,UAAU,MAAM;GACpB,oBAAkB,cAAc,KAAA;GAChC,iBAAe,YAAY,KAAA;GAC3B,0BAAwB,wBAAwB,WAAW,YAAY,KAAA;GAC7D;GACV,GAAI;EACL,CAAA;CACY,CAAA;AAEnB,CAAC;AAED,UAAU,UAAUA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}
1	+ {"version":3,"file":"ModalRoot.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalRoot.tsx"],"sourcesContent":["import {\n createVarsResolver,\n factory,\n Factory,\n getDefaultZIndex,\n getRadius,\n getSize,\n MantineRadius,\n rem,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { ModalBase, ModalBaseProps, ModalBaseStylesNames } from '../ModalBase';\nimport { ScrollArea } from '../ScrollArea';\nimport { ModalProvider, ScrollAreaComponent } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalRootStylesNames = ModalBaseStylesNames;\nexport type ModalRootCssVariables = {\n root: '--modal-radius' \| '--modal-size' \| '--modal-y-offset' \| '--modal-x-offset';\n};\n\nexport interface ModalRootProps extends StylesApiProps<ModalRootFactory>, ModalBaseProps {\n __staticSelector?: string;\n\n /** Top/bottom modal offset @default 5dvh /\n yOffset?: React.CSSProperties['marginTop'];\n\n /* Left/right modal offset @default 5vw /\n xOffset?: React.CSSProperties['marginLeft'];\n\n /* Scroll area component @default 'div' /\n scrollAreaComponent?: ScrollAreaComponent;\n\n /* Key of `theme.radius` or any valid CSS value to set `border-radius` @default theme.defaultRadius /\n radius?: MantineRadius;\n\n /* If set, the modal is centered vertically @default false /\n centered?: boolean;\n\n /* If set, the modal takes the entire screen @default false */\n fullScreen?: boolean;\n}\n\nexport type ModalRootFactory = Factory<{\n props: ModalRootProps;\n ref: HTMLDivElement;\n stylesNames: ModalRootStylesNames;\n vars: ModalRootCssVariables;\n}>;\n\nconst defaultProps = {\n __staticSelector: 'Modal',\n closeOnClickOutside: true,\n withinPortal: true,\n lockScroll: true,\n trapFocus: true,\n returnFocus: true,\n closeOnEscape: true,\n keepMounted: false,\n zIndex: getDefaultZIndex('modal'),\n transitionProps: { duration: 200, transition: 'fade-down' },\n yOffset: '5dvh',\n} satisfies Partial<ModalRootProps>;\n\nconst varsResolver = createVarsResolver<ModalRootFactory>(\n (_, { radius, size, yOffset, xOffset }) => ({\n root: {\n '--modal-radius': radius === undefined ? undefined : getRadius(radius),\n '--modal-size': getSize(size, 'modal-size'),\n '--modal-y-offset': rem(yOffset),\n '--modal-x-offset': rem(xOffset),\n },\n })\n);\n\nexport const ModalRoot = factory<ModalRootFactory>((_props) => {\n const props = useProps('ModalRoot', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n yOffset,\n scrollAreaComponent,\n radius,\n fullScreen,\n centered,\n xOffset,\n __staticSelector,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<ModalRootFactory>({\n name: __staticSelector,\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 <ModalProvider value={{ yOffset, scrollAreaComponent, getStyles, fullScreen }}>\n <ModalBase\n {...getStyles('root')}\n data-full-screen={fullScreen \|\| undefined}\n data-centered={centered \|\| undefined}\n data-offset-scrollbars={scrollAreaComponent === ScrollArea.Autosize \|\| undefined}\n unstyled={unstyled}\n {...others}\n />\n </ModalProvider>\n );\n});\n\nModalRoot.classes = classes;\nModalRoot.varsResolver = varsResolver;\nModalRoot.displayName = '@mantine/core/ModalRoot';\n"],"mappings":";;;;;;;;;;;;;;AAoDA,MAAM,eAAe;CACnB,kBAAkB;CAClB,qBAAqB;CACrB,cAAc;CACd,YAAY;CACZ,WAAW;CACX,aAAa;CACb,eAAe;CACf,aAAa;CACb,QAAQ,iBAAiB,OAAO;CAChC,iBAAiB;EAAE,UAAU;EAAK,YAAY;CAAY;CAC1D,SAAS;AACX;AAEA,MAAM,eAAe,oBAClB,GAAG,EAAE,QAAQ,MAAM,SAAS,eAAe,EAC1C,MAAM;CACJ,kBAAkB,WAAW,KAAA,IAAY,KAAA,IAAY,UAAU,MAAM;CACrE,gBAAgB,QAAQ,MAAM,YAAY;CAC1C,oBAAoB,IAAI,OAAO;CAC/B,oBAAoB,IAAI,OAAO;AACjC,EACF,EACF;AAEA,MAAa,YAAY,SAA2B,WAAW;CAC7D,MAAM,QAAQ,SAAS,aAAa,cAAc,MAAM;CACxD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,SACA,qBACA,QACA,YACA,UACA,SACA,kBACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAA4B;EAC5C,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,oBAAC,eAAD;EAAe,OAAO;GAAE;GAAS;GAAqB;GAAW;EAAW;EAC1E,UAAA,oBAAC,WAAD;GACE,GAAI,UAAU,MAAM;GACpB,oBAAkB,cAAc,KAAA;GAChC,iBAAe,YAAY,KAAA;GAC3B,0BAAwB,wBAAwB,WAAW,YAAY,KAAA;GAC7D;GACV,GAAI;EACL,CAAA;CACY,CAAA;AAEnB,CAAC;AAED,UAAU,UAAUA;AACpB,UAAU,eAAe;AACzB,UAAU,cAAc"}

package/esm/components/Modal/ModalTitle.mjs CHANGED Viewed

@@ -8,8 +8,9 @@ import { jsx } from "react/jsx-runtime";
 //#region packages/@mantine/core/src/components/Modal/ModalTitle.tsx
 const ModalTitle = factory((_props) => {
 	const { classNames, className, style, styles, vars, ...others } = useProps("ModalTitle", null, _props);
+	const ctx = useModalContext();
 	return /* @__PURE__ */ jsx(ModalBaseTitle, {
-		...useModalContext().getStyles("title", {
+		...ctx.getStyles("title", {
 			classNames,
 			style,
 			styles,

package/esm/components/Modal/ModalTitle.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalTitle.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalTitle.tsx"],"sourcesContent":["import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core';\nimport { ModalBaseTitle, ModalBaseTitleProps } from '../ModalBase';\nimport { useModalContext } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalTitleStylesNames = 'title';\n\nexport interface ModalTitleProps\n extends ModalBaseTitleProps, CompoundStylesApiProps<ModalTitleFactory> {}\n\nexport type ModalTitleFactory = Factory<{\n props: ModalTitleProps;\n ref: HTMLHeadingElement;\n stylesNames: ModalTitleStylesNames;\n compound: true;\n}>;\n\nexport const ModalTitle = factory<ModalTitleFactory>((_props) => {\n const props = useProps('ModalTitle', null, _props);\n const { classNames, className, style, styles, vars, ...others } = props;\n\n const ctx = useModalContext();\n\n return (\n <ModalBaseTitle\n {...ctx.getStyles('title', { classNames, style, styles, className })}\n {...others}\n />\n );\n});\n\nModalTitle.classes = classes;\nModalTitle.displayName = '@mantine/core/ModalTitle';\n"],"mappings":";;;;;;;;AAiBA,MAAa,aAAa,SAA4B,WAAW;CAE/D,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WADzC,SAAS,cAAc,MAAM,MAC2B;~~CAItE~~,OACE,oBAAC,gBAAD;EACE,~~GAJQ~~,~~gBAIF~~,~~CAAC,CAAC,~~UAAU,SAAS;GAAE;GAAY;GAAO;GAAQ;EAAU,CAAC;EACnE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,WAAW,UAAUA;AACrB,WAAW,cAAc"}
1	+ {"version":3,"file":"ModalTitle.mjs","names":["classes"],"sources":["../../../src/components/Modal/ModalTitle.tsx"],"sourcesContent":["import { CompoundStylesApiProps, factory, Factory, useProps } from '../../core';\nimport { ModalBaseTitle, ModalBaseTitleProps } from '../ModalBase';\nimport { useModalContext } from './Modal.context';\nimport classes from './Modal.module.css';\n\nexport type ModalTitleStylesNames = 'title';\n\nexport interface ModalTitleProps\n extends ModalBaseTitleProps, CompoundStylesApiProps<ModalTitleFactory> {}\n\nexport type ModalTitleFactory = Factory<{\n props: ModalTitleProps;\n ref: HTMLHeadingElement;\n stylesNames: ModalTitleStylesNames;\n compound: true;\n}>;\n\nexport const ModalTitle = factory<ModalTitleFactory>((_props) => {\n const props = useProps('ModalTitle', null, _props);\n const { classNames, className, style, styles, vars, ...others } = props;\n\n const ctx = useModalContext();\n\n return (\n <ModalBaseTitle\n {...ctx.getStyles('title', { classNames, style, styles, className })}\n {...others}\n />\n );\n});\n\nModalTitle.classes = classes;\nModalTitle.displayName = '@mantine/core/ModalTitle';\n"],"mappings":";;;;;;;;AAiBA,MAAa,aAAa,SAA4B,WAAW;CAE/D,MAAM,EAAE,YAAY,WAAW,OAAO,QAAQ,MAAM,GAAG,WADzC,SAAS,cAAc,MAAM,MAC2B;CAEtE,MAAM,MAAM,gBAAgB;CAE5B,OACE,oBAAC,gBAAD;EACE,GAAI,IAAI,UAAU,SAAS;GAAE;GAAY;GAAO;GAAQ;EAAU,CAAC;EACnE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,WAAW,UAAUA;AACrB,WAAW,cAAc"}

package/esm/components/ModalBase/ModalBase.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalBase.mjs","names":[],"sources":["../../../src/components/ModalBase/ModalBase.tsx"],"sourcesContent":["import { RemoveScroll } from 'react-remove-scroll';\nimport {\n Box,\n BoxProps,\n ElementProps,\n getDefaultZIndex,\n getShadow,\n getSpacing,\n MantineShadow,\n MantineSize,\n MantineSpacing,\n} from '../../core';\nimport { BasePortalProps, OptionalPortal } from '../Portal';\nimport { TransitionOverride } from '../Transition';\nimport { ModalBaseProvider } from './ModalBase.context';\nimport { useModal } from './use-modal';\n\ntype RemoveScrollProps = Omit<React.ComponentProps<typeof RemoveScroll>, 'children'>;\n\nexport interface ModalBaseProps extends BoxProps, ElementProps<'div', 'title'> {\n unstyled?: boolean;\n\n /** If set modal/drawer is not unmounted from the DOM when hidden. `display: none` styles are applied instead. @default false /\n keepMounted?: boolean;\n\n /* Controls how the modal/drawer is hidden when `keepMounted` is set:\n * `'activity'` - hidden with React 19 `Activity` component,\n * `'display-none'` - hidden with `display: none` styles\n * @default 'activity'\n /\n keepMountedMode?: 'activity' \| 'display-none';\n\n /* Controls opened state /\n opened: boolean;\n\n /* Called when modal/drawer is closed /\n onClose: () => void;\n\n /* Id used to connect modal/drawer with body and title /\n id?: string;\n\n /* If set, scroll is locked when `opened={true}` @default true /\n lockScroll?: boolean;\n\n /* If set, focus is trapped within the modal/drawer @default true /\n trapFocus?: boolean;\n\n /* If set, the component is rendered inside `Portal` @default true /\n withinPortal?: boolean;\n\n /* Props passed down to the Portal component when `withinPortal` is set /\n portalProps?: BasePortalProps;\n\n /* Modal/drawer content /\n children?: React.ReactNode;\n\n /* If set, the modal/drawer is closed when user clicks on the overlay @default true /\n closeOnClickOutside?: boolean;\n\n /* Props added to the `Transition` component that used to animate overlay and body, use to configure duration and animation type, `{ duration: 200, transition: 'fade-down' }` by default /\n transitionProps?: TransitionOverride;\n\n /* Called when exit transition ends /\n onExitTransitionEnd?: () => void;\n\n /* Called when enter transition ends /\n onEnterTransitionEnd?: () => void;\n\n /* If set, `onClose` is called when user presses the escape key @default true /\n closeOnEscape?: boolean;\n\n /* If set, focus is returned to the last active element when `onClose` is called @default true /\n returnFocus?: boolean;\n\n /* `z-index` CSS property of the root element @default 200 /\n zIndex?: string \| number;\n\n /* Key of `theme.shadows` or any valid CSS box-shadow value @default 'xl' /\n shadow?: MantineShadow;\n\n /* Key of `theme.spacing` or any valid CSS value to set content, header and footer padding @default 'md' /\n padding?: MantineSpacing;\n\n /* Controls width of the content area @default 'md' /\n size?: MantineSize \| (string & {}) \| number;\n\n /* Props passed down to react-remove-scroll, can be used to customize scroll lock behavior */\n removeScrollProps?: RemoveScrollProps;\n}\n\nexport function ModalBase({\n keepMounted,\n keepMountedMode = 'activity',\n opened,\n onClose,\n id,\n transitionProps,\n onExitTransitionEnd,\n onEnterTransitionEnd,\n trapFocus,\n closeOnEscape,\n returnFocus,\n closeOnClickOutside,\n withinPortal,\n portalProps,\n lockScroll,\n children,\n zIndex,\n shadow,\n padding,\n __vars,\n unstyled,\n removeScrollProps,\n ...others\n}: ModalBaseProps) {\n const { _id, titleMounted, bodyMounted, shouldLockScroll, setTitleMounted, setBodyMounted } =\n useModal({ id, transitionProps, opened, trapFocus, closeOnEscape, onClose, returnFocus });\n\n const { key: removeScrollKey, ...otherRemoveScrollProps } = removeScrollProps \|\| {};\n\n return (\n <OptionalPortal {...portalProps} withinPortal={withinPortal}>\n <ModalBaseProvider\n value={{\n opened,\n onClose,\n closeOnClickOutside,\n onExitTransitionEnd,\n onEnterTransitionEnd,\n transitionProps: { ...transitionProps, keepMounted, keepMountedMode },\n getTitleId: () => `${_id}-title`,\n getBodyId: () => `${_id}-body`,\n titleMounted,\n bodyMounted,\n setTitleMounted,\n setBodyMounted,\n trapFocus,\n closeOnEscape,\n zIndex,\n unstyled,\n }}\n >\n <RemoveScroll\n enabled={shouldLockScroll && lockScroll}\n key={removeScrollKey}\n {...otherRemoveScrollProps}\n >\n <Box\n {...others}\n id={_id}\n __vars={{\n ...__vars,\n '--mb-z-index': (zIndex \|\| getDefaultZIndex('modal')).toString(),\n '--mb-shadow': getShadow(shadow),\n '--mb-padding': getSpacing(padding),\n }}\n >\n {children}\n </Box>\n </RemoveScroll>\n </ModalBaseProvider>\n </OptionalPortal>\n );\n}\n\nModalBase.displayName = '@mantine/core/ModalBase';\n"],"mappings":";;;;;;;;;;AA0FA,SAAgB,UAAU,EACxB,aACA,kBAAkB,YAClB,QACA,SACA,IACA,iBACA,qBACA,sBACA,WACA,eACA,aACA,qBACA,cACA,aACA,YACA,UACA,QACA,QACA,SACA,QACA,UACA,mBACA,GAAG,UACc;CACjB,MAAM,EAAE,KAAK,cAAc,aAAa,kBAAkB,iBAAiB,mBACzE,SAAS;EAAE;EAAI;EAAiB;EAAQ;EAAW;EAAe;EAAS;CAAY,CAAC;CAE1F,MAAM,EAAE,KAAK,iBAAiB,GAAG,2BAA2B,qBAAqB,CAAC;CAElF,OACE,oBAAC,gBAAD;EAAgB,GAAI;EAA2B;~~YAC7C~~,oBAAC,mBAAD;GACE,OAAO;IACL;IACA;IACA;IACA;IACA;IACA,iBAAiB;KAAE,GAAG;KAAiB;KAAa;IAAgB;IACpE,kBAAkB,GAAG,IAAI;IACzB,iBAAiB,GAAG,IAAI;IACxB;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF;~~aAEA~~,oBAAC,cAAD;IACE,SAAS,oBAAoB;IAE7B,GAAI;~~cAEJ~~,oBAAC,KAAD;KACE,GAAI;KACJ,IAAI;KACJ,QAAQ;MACN,GAAG;MACH,iBAAiB,UAAU,iBAAiB,OAAO,EAAA,CAAG,SAAS;MAC/D,eAAe,UAAU,MAAM;MAC/B,gBAAgB,WAAW,OAAO;KACpC;KAEC;IACE,CAAA;GACO,GAfP,eAeO;EACG,CAAA;CACL,CAAA;AAEpB;AAEA,UAAU,cAAc"}
1	+ {"version":3,"file":"ModalBase.mjs","names":[],"sources":["../../../src/components/ModalBase/ModalBase.tsx"],"sourcesContent":["import { RemoveScroll } from 'react-remove-scroll';\nimport {\n Box,\n BoxProps,\n ElementProps,\n getDefaultZIndex,\n getShadow,\n getSpacing,\n MantineShadow,\n MantineSize,\n MantineSpacing,\n} from '../../core';\nimport { BasePortalProps, OptionalPortal } from '../Portal';\nimport { TransitionOverride } from '../Transition';\nimport { ModalBaseProvider } from './ModalBase.context';\nimport { useModal } from './use-modal';\n\ntype RemoveScrollProps = Omit<React.ComponentProps<typeof RemoveScroll>, 'children'>;\n\nexport interface ModalBaseProps extends BoxProps, ElementProps<'div', 'title'> {\n unstyled?: boolean;\n\n /** If set modal/drawer is not unmounted from the DOM when hidden. `display: none` styles are applied instead. @default false /\n keepMounted?: boolean;\n\n /* Controls how the modal/drawer is hidden when `keepMounted` is set:\n * `'activity'` - hidden with React 19 `Activity` component,\n * `'display-none'` - hidden with `display: none` styles\n * @default 'activity'\n /\n keepMountedMode?: 'activity' \| 'display-none';\n\n /* Controls opened state /\n opened: boolean;\n\n /* Called when modal/drawer is closed /\n onClose: () => void;\n\n /* Id used to connect modal/drawer with body and title /\n id?: string;\n\n /* If set, scroll is locked when `opened={true}` @default true /\n lockScroll?: boolean;\n\n /* If set, focus is trapped within the modal/drawer @default true /\n trapFocus?: boolean;\n\n /* If set, the component is rendered inside `Portal` @default true /\n withinPortal?: boolean;\n\n /* Props passed down to the Portal component when `withinPortal` is set /\n portalProps?: BasePortalProps;\n\n /* Modal/drawer content /\n children?: React.ReactNode;\n\n /* If set, the modal/drawer is closed when user clicks on the overlay @default true /\n closeOnClickOutside?: boolean;\n\n /* Props added to the `Transition` component that used to animate overlay and body, use to configure duration and animation type, `{ duration: 200, transition: 'fade-down' }` by default /\n transitionProps?: TransitionOverride;\n\n /* Called when exit transition ends /\n onExitTransitionEnd?: () => void;\n\n /* Called when enter transition ends /\n onEnterTransitionEnd?: () => void;\n\n /* If set, `onClose` is called when user presses the escape key @default true /\n closeOnEscape?: boolean;\n\n /* If set, focus is returned to the last active element when `onClose` is called @default true /\n returnFocus?: boolean;\n\n /* `z-index` CSS property of the root element @default 200 /\n zIndex?: string \| number;\n\n /* Key of `theme.shadows` or any valid CSS box-shadow value @default 'xl' /\n shadow?: MantineShadow;\n\n /* Key of `theme.spacing` or any valid CSS value to set content, header and footer padding @default 'md' /\n padding?: MantineSpacing;\n\n /* Controls width of the content area @default 'md' /\n size?: MantineSize \| (string & {}) \| number;\n\n /* Props passed down to react-remove-scroll, can be used to customize scroll lock behavior */\n removeScrollProps?: RemoveScrollProps;\n}\n\nexport function ModalBase({\n keepMounted,\n keepMountedMode = 'activity',\n opened,\n onClose,\n id,\n transitionProps,\n onExitTransitionEnd,\n onEnterTransitionEnd,\n trapFocus,\n closeOnEscape,\n returnFocus,\n closeOnClickOutside,\n withinPortal,\n portalProps,\n lockScroll,\n children,\n zIndex,\n shadow,\n padding,\n __vars,\n unstyled,\n removeScrollProps,\n ...others\n}: ModalBaseProps) {\n const { _id, titleMounted, bodyMounted, shouldLockScroll, setTitleMounted, setBodyMounted } =\n useModal({ id, transitionProps, opened, trapFocus, closeOnEscape, onClose, returnFocus });\n\n const { key: removeScrollKey, ...otherRemoveScrollProps } = removeScrollProps \|\| {};\n\n return (\n <OptionalPortal {...portalProps} withinPortal={withinPortal}>\n <ModalBaseProvider\n value={{\n opened,\n onClose,\n closeOnClickOutside,\n onExitTransitionEnd,\n onEnterTransitionEnd,\n transitionProps: { ...transitionProps, keepMounted, keepMountedMode },\n getTitleId: () => `${_id}-title`,\n getBodyId: () => `${_id}-body`,\n titleMounted,\n bodyMounted,\n setTitleMounted,\n setBodyMounted,\n trapFocus,\n closeOnEscape,\n zIndex,\n unstyled,\n }}\n >\n <RemoveScroll\n enabled={shouldLockScroll && lockScroll}\n key={removeScrollKey}\n {...otherRemoveScrollProps}\n >\n <Box\n {...others}\n id={_id}\n __vars={{\n ...__vars,\n '--mb-z-index': (zIndex \|\| getDefaultZIndex('modal')).toString(),\n '--mb-shadow': getShadow(shadow),\n '--mb-padding': getSpacing(padding),\n }}\n >\n {children}\n </Box>\n </RemoveScroll>\n </ModalBaseProvider>\n </OptionalPortal>\n );\n}\n\nModalBase.displayName = '@mantine/core/ModalBase';\n"],"mappings":";;;;;;;;;;AA0FA,SAAgB,UAAU,EACxB,aACA,kBAAkB,YAClB,QACA,SACA,IACA,iBACA,qBACA,sBACA,WACA,eACA,aACA,qBACA,cACA,aACA,YACA,UACA,QACA,QACA,SACA,QACA,UACA,mBACA,GAAG,UACc;CACjB,MAAM,EAAE,KAAK,cAAc,aAAa,kBAAkB,iBAAiB,mBACzE,SAAS;EAAE;EAAI;EAAiB;EAAQ;EAAW;EAAe;EAAS;CAAY,CAAC;CAE1F,MAAM,EAAE,KAAK,iBAAiB,GAAG,2BAA2B,qBAAqB,CAAC;CAElF,OACE,oBAAC,gBAAD;EAAgB,GAAI;EAA2B;EAC7C,UAAA,oBAAC,mBAAD;GACE,OAAO;IACL;IACA;IACA;IACA;IACA;IACA,iBAAiB;KAAE,GAAG;KAAiB;KAAa;IAAgB;IACpE,kBAAkB,GAAG,IAAI;IACzB,iBAAiB,GAAG,IAAI;IACxB;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GAEA,UAAA,oBAAC,cAAD;IACE,SAAS,oBAAoB;IAE7B,GAAI;IAEJ,UAAA,oBAAC,KAAD;KACE,GAAI;KACJ,IAAI;KACJ,QAAQ;MACN,GAAG;MACH,iBAAiB,UAAU,iBAAiB,OAAO,EAAA,CAAG,SAAS;MAC/D,eAAe,UAAU,MAAM;MAC/B,gBAAgB,WAAW,OAAO;KACpC;KAEC;IACE,CAAA;GACO,GAfP,eAeO;EACG,CAAA;CACL,CAAA;AAEpB;AAEA,UAAU,cAAc"}

package/esm/components/ModalBase/ModalBaseContent.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalBaseContent.mjs","names":["classes"],"sources":["../../../src/components/ModalBase/ModalBaseContent.tsx"],"sourcesContent":["import cx from 'clsx';\nimport { BoxProps, ElementProps, MantineRadius, MantineShadow } from '../../core';\nimport { FocusTrap } from '../FocusTrap';\nimport { Paper } from '../Paper';\nimport { Transition, TransitionOverride } from '../Transition';\nimport { useModalBaseContext } from './ModalBase.context';\nimport classes from './ModalBase.module.css';\n\nexport interface ModalBaseContentProps extends BoxProps, ElementProps<'div'> {\n /** Props passed down to the `Transition` component /\n transitionProps?: TransitionOverride;\n\n /* Key of `theme.shadows` or any valid CSS value to set `box-shadow` /\n shadow?: MantineShadow;\n\n /* Key of `theme.radius` or any valid CSS value to set border-radius, numbers are converted to rem @default theme.defaultRadius */\n radius?: MantineRadius;\n}\n\ninterface _ModalBaseContentProps extends ModalBaseContentProps {\n innerProps: React.ComponentProps<'div'>;\n}\n\nexport function ModalBaseContent({\n transitionProps,\n className,\n innerProps,\n onKeyDown,\n style,\n ref,\n ...others\n}: _ModalBaseContentProps) {\n const ctx = useModalBaseContext();\n\n return (\n <Transition\n mounted={ctx.opened}\n transition=\"pop\"\n {...ctx.transitionProps}\n onExited={() => {\n ctx.onExitTransitionEnd?.();\n ctx.transitionProps?.onExited?.();\n }}\n onEntered={() => {\n ctx.onEnterTransitionEnd?.();\n ctx.transitionProps?.onEntered?.();\n }}\n {...transitionProps}\n >\n {(transitionStyles) => (\n <div\n {...innerProps}\n className={cx({ [classes.inner]: !ctx.unstyled }, innerProps.className)}\n >\n <FocusTrap active={ctx.opened && ctx.trapFocus} innerRef={ref}>\n <Paper\n {...others}\n component=\"section\"\n role=\"dialog\"\n tabIndex={-1}\n aria-modal\n aria-describedby={ctx.bodyMounted ? ctx.getBodyId() : undefined}\n aria-labelledby={ctx.titleMounted ? ctx.getTitleId() : undefined}\n style={[style, transitionStyles]}\n className={cx({ [classes.content]: !ctx.unstyled }, className)}\n unstyled={ctx.unstyled}\n >\n {others.children}\n </Paper>\n </FocusTrap>\n </div>\n )}\n </Transition>\n );\n}\n\nModalBaseContent.displayName = '@mantine/core/ModalBaseContent';\n"],"mappings":";;;;;;;;;AAuBA,SAAgB,iBAAiB,EAC/B,iBACA,WACA,YACA,WACA,OACA,KACA,GAAG,UACsB;CACzB,MAAM,MAAM,oBAAoB;CAEhC,OACE,oBAAC,YAAD;EACE,SAAS,IAAI;EACb,YAAW;EACX,GAAI,IAAI;EACR,gBAAgB;GACd,IAAI,sBAAsB;GAC1B,IAAI,iBAAiB,WAAW;EAClC;EACA,iBAAiB;GACf,IAAI,uBAAuB;GAC3B,IAAI,iBAAiB,YAAY;EACnC;EACA,GAAI;~~aAEF~~,qBACA,oBAAC,OAAD;GACE,GAAI;GACJ,WAAW,GAAG,GAAGA,yBAAQ,QAAQ,CAAC,IAAI,SAAS,GAAG,WAAW,SAAS;~~aAEtE~~,oBAAC,WAAD;IAAW,QAAQ,IAAI,UAAU,IAAI;IAAW,UAAU;~~cACxD~~,oBAAC,OAAD;KACE,GAAI;KACJ,WAAU;KACV,MAAK;KACL,UAAU;KACV,cAAA;KACA,oBAAkB,IAAI,cAAc,IAAI,UAAU,IAAI,KAAA;KACtD,mBAAiB,IAAI,eAAe,IAAI,WAAW,IAAI,KAAA;KACvD,OAAO,CAAC,OAAO,gBAAgB;KAC/B,WAAW,GAAG,GAAGA,yBAAQ,UAAU,CAAC,IAAI,SAAS,GAAG,SAAS;KAC7D,UAAU,IAAI;~~eAEb~~,OAAO;IACH,CAAA;GACE,CAAA;EACR,CAAA;CAEG,CAAA;AAEhB;AAEA,iBAAiB,cAAc"}
1	+ {"version":3,"file":"ModalBaseContent.mjs","names":["classes"],"sources":["../../../src/components/ModalBase/ModalBaseContent.tsx"],"sourcesContent":["import cx from 'clsx';\nimport { BoxProps, ElementProps, MantineRadius, MantineShadow } from '../../core';\nimport { FocusTrap } from '../FocusTrap';\nimport { Paper } from '../Paper';\nimport { Transition, TransitionOverride } from '../Transition';\nimport { useModalBaseContext } from './ModalBase.context';\nimport classes from './ModalBase.module.css';\n\nexport interface ModalBaseContentProps extends BoxProps, ElementProps<'div'> {\n /** Props passed down to the `Transition` component /\n transitionProps?: TransitionOverride;\n\n /* Key of `theme.shadows` or any valid CSS value to set `box-shadow` /\n shadow?: MantineShadow;\n\n /* Key of `theme.radius` or any valid CSS value to set border-radius, numbers are converted to rem @default theme.defaultRadius */\n radius?: MantineRadius;\n}\n\ninterface _ModalBaseContentProps extends ModalBaseContentProps {\n innerProps: React.ComponentProps<'div'>;\n}\n\nexport function ModalBaseContent({\n transitionProps,\n className,\n innerProps,\n onKeyDown,\n style,\n ref,\n ...others\n}: _ModalBaseContentProps) {\n const ctx = useModalBaseContext();\n\n return (\n <Transition\n mounted={ctx.opened}\n transition=\"pop\"\n {...ctx.transitionProps}\n onExited={() => {\n ctx.onExitTransitionEnd?.();\n ctx.transitionProps?.onExited?.();\n }}\n onEntered={() => {\n ctx.onEnterTransitionEnd?.();\n ctx.transitionProps?.onEntered?.();\n }}\n {...transitionProps}\n >\n {(transitionStyles) => (\n <div\n {...innerProps}\n className={cx({ [classes.inner]: !ctx.unstyled }, innerProps.className)}\n >\n <FocusTrap active={ctx.opened && ctx.trapFocus} innerRef={ref}>\n <Paper\n {...others}\n component=\"section\"\n role=\"dialog\"\n tabIndex={-1}\n aria-modal\n aria-describedby={ctx.bodyMounted ? ctx.getBodyId() : undefined}\n aria-labelledby={ctx.titleMounted ? ctx.getTitleId() : undefined}\n style={[style, transitionStyles]}\n className={cx({ [classes.content]: !ctx.unstyled }, className)}\n unstyled={ctx.unstyled}\n >\n {others.children}\n </Paper>\n </FocusTrap>\n </div>\n )}\n </Transition>\n );\n}\n\nModalBaseContent.displayName = '@mantine/core/ModalBaseContent';\n"],"mappings":";;;;;;;;;AAuBA,SAAgB,iBAAiB,EAC/B,iBACA,WACA,YACA,WACA,OACA,KACA,GAAG,UACsB;CACzB,MAAM,MAAM,oBAAoB;CAEhC,OACE,oBAAC,YAAD;EACE,SAAS,IAAI;EACb,YAAW;EACX,GAAI,IAAI;EACR,gBAAgB;GACd,IAAI,sBAAsB;GAC1B,IAAI,iBAAiB,WAAW;EAClC;EACA,iBAAiB;GACf,IAAI,uBAAuB;GAC3B,IAAI,iBAAiB,YAAY;EACnC;EACA,GAAI;EAEF,WAAA,qBACA,oBAAC,OAAD;GACE,GAAI;GACJ,WAAW,GAAG,GAAGA,yBAAQ,QAAQ,CAAC,IAAI,SAAS,GAAG,WAAW,SAAS;GAEtE,UAAA,oBAAC,WAAD;IAAW,QAAQ,IAAI,UAAU,IAAI;IAAW,UAAU;IACxD,UAAA,oBAAC,OAAD;KACE,GAAI;KACJ,WAAU;KACV,MAAK;KACL,UAAU;KACV,cAAA;KACA,oBAAkB,IAAI,cAAc,IAAI,UAAU,IAAI,KAAA;KACtD,mBAAiB,IAAI,eAAe,IAAI,WAAW,IAAI,KAAA;KACvD,OAAO,CAAC,OAAO,gBAAgB;KAC/B,WAAW,GAAG,GAAGA,yBAAQ,UAAU,CAAC,IAAI,SAAS,GAAG,SAAS;KAC7D,UAAU,IAAI;KAEb,UAAA,OAAO;IACH,CAAA;GACE,CAAA;EACR,CAAA;CAEG,CAAA;AAEhB;AAEA,iBAAiB,cAAc"}

package/esm/components/ModalBase/ModalBaseOverlay.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalBaseOverlay.mjs","names":[],"sources":["../../../src/components/ModalBase/ModalBaseOverlay.tsx"],"sourcesContent":["import { ElementProps } from '../../core';\nimport { Overlay, OverlayProps } from '../Overlay';\nimport { Transition, TransitionOverride } from '../Transition';\nimport { useModalBaseContext } from './ModalBase.context';\nimport { useModalTransition } from './use-modal-transition';\n\nexport interface ModalBaseOverlayProps\n extends\n Omit<OverlayProps, 'styles' \| 'classNames' \| 'variant' \| 'vars'>,\n ElementProps<'div', 'color'> {\n /** Props passed down to the `Transition` component /\n transitionProps?: TransitionOverride;\n\n /* Determines whether the overlay should be visible. By default, has the same value as `opened` state. */\n visible?: boolean;\n}\n\nexport function ModalBaseOverlay({\n onClick,\n transitionProps,\n style,\n visible,\n ...others\n}: ModalBaseOverlayProps) {\n const ctx = useModalBaseContext();\n const transition = useModalTransition(transitionProps);\n\n return (\n <Transition\n mounted={visible !== undefined ? visible : ctx.opened}\n {...transition}\n transition=\"fade\"\n >\n {(transitionStyles) => (\n <Overlay\n fixed\n style={[style, transitionStyles]}\n zIndex={ctx.zIndex}\n unstyled={ctx.unstyled}\n onClick={(event) => {\n onClick?.(event);\n ctx.closeOnClickOutside && ctx.onClose();\n }}\n {...others}\n />\n )}\n </Transition>\n );\n}\n\nModalBaseOverlay.displayName = '@mantine/core/ModalBaseOverlay';\n"],"mappings":";;;;;;;AAiBA,SAAgB,iBAAiB,EAC/B,SACA,iBACA,OACA,SACA,GAAG,UACqB;CACxB,MAAM,MAAM,oBAAoB;CAChC,MAAM,aAAa,mBAAmB,eAAe;CAErD,OACE,oBAAC,YAAD;EACE,SAAS,YAAY,KAAA,IAAY,UAAU,IAAI;EAC/C,GAAI;EACJ,YAAW;~~aAET~~,qBACA,oBAAC,SAAD;GACE,OAAA;GACA,OAAO,CAAC,OAAO,gBAAgB;GAC/B,QAAQ,IAAI;GACZ,UAAU,IAAI;GACd,UAAU,UAAU;IAClB,UAAU,KAAK;IACf,IAAI,uBAAuB,IAAI,QAAQ;GACzC;GACA,GAAI;EACL,CAAA;CAEO,CAAA;AAEhB;AAEA,iBAAiB,cAAc"}
1	+ {"version":3,"file":"ModalBaseOverlay.mjs","names":[],"sources":["../../../src/components/ModalBase/ModalBaseOverlay.tsx"],"sourcesContent":["import { ElementProps } from '../../core';\nimport { Overlay, OverlayProps } from '../Overlay';\nimport { Transition, TransitionOverride } from '../Transition';\nimport { useModalBaseContext } from './ModalBase.context';\nimport { useModalTransition } from './use-modal-transition';\n\nexport interface ModalBaseOverlayProps\n extends\n Omit<OverlayProps, 'styles' \| 'classNames' \| 'variant' \| 'vars'>,\n ElementProps<'div', 'color'> {\n /** Props passed down to the `Transition` component /\n transitionProps?: TransitionOverride;\n\n /* Determines whether the overlay should be visible. By default, has the same value as `opened` state. */\n visible?: boolean;\n}\n\nexport function ModalBaseOverlay({\n onClick,\n transitionProps,\n style,\n visible,\n ...others\n}: ModalBaseOverlayProps) {\n const ctx = useModalBaseContext();\n const transition = useModalTransition(transitionProps);\n\n return (\n <Transition\n mounted={visible !== undefined ? visible : ctx.opened}\n {...transition}\n transition=\"fade\"\n >\n {(transitionStyles) => (\n <Overlay\n fixed\n style={[style, transitionStyles]}\n zIndex={ctx.zIndex}\n unstyled={ctx.unstyled}\n onClick={(event) => {\n onClick?.(event);\n ctx.closeOnClickOutside && ctx.onClose();\n }}\n {...others}\n />\n )}\n </Transition>\n );\n}\n\nModalBaseOverlay.displayName = '@mantine/core/ModalBaseOverlay';\n"],"mappings":";;;;;;;AAiBA,SAAgB,iBAAiB,EAC/B,SACA,iBACA,OACA,SACA,GAAG,UACqB;CACxB,MAAM,MAAM,oBAAoB;CAChC,MAAM,aAAa,mBAAmB,eAAe;CAErD,OACE,oBAAC,YAAD;EACE,SAAS,YAAY,KAAA,IAAY,UAAU,IAAI;EAC/C,GAAI;EACJ,YAAW;EAET,WAAA,qBACA,oBAAC,SAAD;GACE,OAAA;GACA,OAAO,CAAC,OAAO,gBAAgB;GAC/B,QAAQ,IAAI;GACZ,UAAU,IAAI;GACd,UAAU,UAAU;IAClB,UAAU,KAAK;IACf,IAAI,uBAAuB,IAAI,QAAQ;GACzC;GACA,GAAI;EACL,CAAA;CAEO,CAAA;AAEhB;AAEA,iBAAiB,cAAc"}

package/esm/components/ModalBase/use-modal.mjs CHANGED Viewed

@@ -7,9 +7,10 @@ function useModal({ id, transitionProps, opened, trapFocus, closeOnEscape, onClo
 	const _id = useId$1(id);
 	const [titleMounted, setTitleMounted] = useState(false);
 	const [bodyMounted, setBodyMounted] = useState(false);
+	const transitionDuration = typeof transitionProps?.duration === "number" ? transitionProps?.duration : 200;
 	const shouldLockScroll = useLockScroll({
 		opened,
-		transitionDuration: typeof transitionProps?.duration === "number" ? transitionProps?.duration : 200
+		transitionDuration
 	});
 	useWindowEvent("keydown", (event) => {
 		if (event.key === "Escape" && closeOnEscape && !event.isComposing && opened) event.target?.getAttribute("data-mantine-stop-propagation") !== "true" && onClose();

package/esm/components/ModalBase/use-modal.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-modal.mjs","names":["useId"],"sources":["../../../src/components/ModalBase/use-modal.ts"],"sourcesContent":["import { useState } from 'react';\nimport { useFocusReturn, useId, useWindowEvent } from '@mantine/hooks';\nimport { TransitionOverride } from '../Transition';\nimport { useLockScroll } from './use-lock-scroll';\n\ninterface UseModalInput {\n opened: boolean;\n onClose: () => void;\n id: string \| undefined;\n transitionProps: TransitionOverride \| undefined;\n trapFocus: boolean \| undefined;\n closeOnEscape: boolean \| undefined;\n returnFocus: boolean \| undefined;\n}\n\nexport function useModal({\n id,\n transitionProps,\n opened,\n trapFocus,\n closeOnEscape,\n onClose,\n returnFocus,\n}: UseModalInput) {\n const _id = useId(id);\n const [titleMounted, setTitleMounted] = useState(false);\n const [bodyMounted, setBodyMounted] = useState(false);\n\n const transitionDuration =\n typeof transitionProps?.duration === 'number' ? transitionProps?.duration : 200;\n\n const shouldLockScroll = useLockScroll({ opened, transitionDuration });\n\n useWindowEvent(\n 'keydown',\n (event) => {\n if (event.key === 'Escape' && closeOnEscape && !event.isComposing && opened) {\n const shouldTrigger =\n (event.target as HTMLElement)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n shouldTrigger && onClose();\n }\n },\n { capture: true }\n );\n\n useFocusReturn({ opened, shouldReturnFocus: trapFocus && returnFocus });\n\n return {\n _id,\n titleMounted,\n bodyMounted,\n shouldLockScroll,\n setTitleMounted,\n setBodyMounted,\n };\n}\n"],"mappings":";;;;;AAeA,SAAgB,SAAS,EACvB,IACA,iBACA,QACA,WACA,eACA,SACA,eACgB;CAChB,MAAM,MAAMA,QAAM,EAAE;CACpB,MAAM,CAAC,cAAc,mBAAmB,SAAS,KAAK;CACtD,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;~~CAKpD~~,MAAM,~~mBAAmB~~,~~cAAc;EAAE;EAAQ,oBAF/C,~~OAAO,iBAAiB,aAAa,WAAW,iBAAiB,WAAW;~~CAEV~~,CAAC;CAErE,eACE,YACC,UAAU;EACT,IAAI,MAAM,QAAQ,YAAY,iBAAiB,CAAC,MAAM,eAAe,QAGnE,MADS,QAAwB,aAAa,+BAA+B,MAAM,UAClE,QAAQ;CAE7B,GACA,EAAE,SAAS,KAAK,CAClB;CAEA,eAAe;EAAE;EAAQ,mBAAmB,aAAa;CAAY,CAAC;CAEtE,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;CACF;AACF"}
1	+ {"version":3,"file":"use-modal.mjs","names":["useId"],"sources":["../../../src/components/ModalBase/use-modal.ts"],"sourcesContent":["import { useState } from 'react';\nimport { useFocusReturn, useId, useWindowEvent } from '@mantine/hooks';\nimport { TransitionOverride } from '../Transition';\nimport { useLockScroll } from './use-lock-scroll';\n\ninterface UseModalInput {\n opened: boolean;\n onClose: () => void;\n id: string \| undefined;\n transitionProps: TransitionOverride \| undefined;\n trapFocus: boolean \| undefined;\n closeOnEscape: boolean \| undefined;\n returnFocus: boolean \| undefined;\n}\n\nexport function useModal({\n id,\n transitionProps,\n opened,\n trapFocus,\n closeOnEscape,\n onClose,\n returnFocus,\n}: UseModalInput) {\n const _id = useId(id);\n const [titleMounted, setTitleMounted] = useState(false);\n const [bodyMounted, setBodyMounted] = useState(false);\n\n const transitionDuration =\n typeof transitionProps?.duration === 'number' ? transitionProps?.duration : 200;\n\n const shouldLockScroll = useLockScroll({ opened, transitionDuration });\n\n useWindowEvent(\n 'keydown',\n (event) => {\n if (event.key === 'Escape' && closeOnEscape && !event.isComposing && opened) {\n const shouldTrigger =\n (event.target as HTMLElement)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n shouldTrigger && onClose();\n }\n },\n { capture: true }\n );\n\n useFocusReturn({ opened, shouldReturnFocus: trapFocus && returnFocus });\n\n return {\n _id,\n titleMounted,\n bodyMounted,\n shouldLockScroll,\n setTitleMounted,\n setBodyMounted,\n };\n}\n"],"mappings":";;;;;AAeA,SAAgB,SAAS,EACvB,IACA,iBACA,QACA,WACA,eACA,SACA,eACgB;CAChB,MAAM,MAAMA,QAAM,EAAE;CACpB,MAAM,CAAC,cAAc,mBAAmB,SAAS,KAAK;CACtD,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CAEpD,MAAM,qBACJ,OAAO,iBAAiB,aAAa,WAAW,iBAAiB,WAAW;CAE9E,MAAM,mBAAmB,cAAc;EAAE;EAAQ;CAAmB,CAAC;CAErE,eACE,YACC,UAAU;EACT,IAAI,MAAM,QAAQ,YAAY,iBAAiB,CAAC,MAAM,eAAe,QAGnE,MADS,QAAwB,aAAa,+BAA+B,MAAM,UAClE,QAAQ;CAE7B,GACA,EAAE,SAAS,KAAK,CAClB;CAEA,eAAe;EAAE;EAAQ,mBAAmB,aAAa;CAAY,CAAC;CAEtE,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;CACF;AACF"}

package/esm/components/MultiSelect/MultiSelect.mjs CHANGED Viewed

@@ -11,6 +11,8 @@ import { useCombobox } from "../Combobox/use-combobox/use-combobox.mjs";
 import { Combobox } from "../Combobox/Combobox.mjs";
 import { OptionsDropdown } from "../Combobox/OptionsDropdown/OptionsDropdown.mjs";
 import { usePillsReorder } from "../Combobox/use-pills-reorder/use-pills-reorder.mjs";
+import { isExternalInputChange } from "../Combobox/is-external-input-change/is-external-input-change.mjs";
+import { getOptionByLabel } from "../Combobox/get-options-lockup/get-option-by-label.mjs";
 import { Pill } from "../Pill/Pill.mjs";
 import { PillsInput } from "../PillsInput/PillsInput.mjs";
 import { filterPickedValues } from "./filter-picked-values.mjs";
@@ -260,6 +262,13 @@ const MultiSelect = genericFactory((_props) => {
 						onKeyDown: handleInputKeydown,
 						value: _searchValue,
 						onChange: (event) => {
+							if (isExternalInputChange(event)) {
+								if (!readOnly) {
+									const externalOption = getOptionByLabel(optionsLockup, event.currentTarget.value);
+									if (externalOption && !_value.includes(externalOption.value) && _value.length < maxValues) setValue([..._value, externalOption.value]);
+								}
+								return;
+							}
 							handleSearchChange(event.currentTarget.value);
 							searchable && combobox.openDropdown();
 							selectFirstOptionOnChange && combobox.selectFirstOption();

package/esm/components/MultiSelect/MultiSelect.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MultiSelect.mjs","names":["useId"],"sources":["../../../src/components/MultiSelect/MultiSelect.tsx"],"sourcesContent":["import { Fragment, useEffect, useRef } from 'react';\nimport { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n extractStyleProps,\n Factory,\n genericFactory,\n MantineColor,\n Primitive,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport {\n Combobox,\n ComboboxItem,\n ComboboxLikeProps,\n ComboboxLikeRenderOptionInput,\n ComboboxLikeStylesNames,\n ComboboxRenderPillInput,\n getOptionsLockup,\n getParsedComboboxData,\n OptionsDropdown,\n OptionsFilter,\n useCombobox,\n usePillsReorder,\n} from '../Combobox';\nimport {\n __BaseInputProps,\n __InputStylesNames,\n ClearSectionMode,\n InputClearButtonProps,\n} from '../Input';\nimport { InputBase } from '../InputBase';\nimport { Pill } from '../Pill';\nimport { PillsInput } from '../PillsInput';\nimport { ScrollAreaProps } from '../ScrollArea';\nimport { filterPickedValues } from './filter-picked-values';\n\nconst clearSectionOffset: Record<string, number> = {\n xs: 41,\n sm: 50,\n md: 60,\n lg: 72,\n xl: 89,\n};\n\nexport type MultiSelectStylesNames =\n \| __InputStylesNames\n \| ComboboxLikeStylesNames\n \| 'pill'\n \| 'pillsList'\n \| 'inputField';\n\nexport interface MultiSelectProps<Value extends Primitive = string>\n extends\n BoxProps,\n __BaseInputProps,\n ComboboxLikeProps<Value>,\n StylesApiProps<MultiSelectFactory>,\n ElementProps<'input', 'size' \| 'value' \| 'defaultValue' \| 'onChange'> {\n /** Controlled component value /\n value?: Value[];\n\n /* Uncontrolled component default value /\n defaultValue?: Value[];\n\n /* Called when value changes /\n onChange?: (value: Value[]) => void;\n\n /* Called with `value` of the removed item /\n onRemove?: (value: Value) => void;\n\n /* Called when the clear button is clicked /\n onClear?: () => void;\n\n /* Called when user attempts to select more values than allowed /\n onMaxValues?: () => void;\n\n /* Controlled search value /\n searchValue?: string;\n\n /* Default search value /\n defaultSearchValue?: string;\n\n /* Called when search changes /\n onSearchChange?: (value: string) => void;\n\n /* Maximum number of values, no limit if not set /\n maxValues?: number;\n\n /* Allows searching through options by user input @default false /\n searchable?: boolean;\n\n /* Message displayed when no options match the search query (when searchable is enabled) or when the data array is empty. If not set, the dropdown will be hidden instead. /\n nothingFoundMessage?: React.ReactNode;\n\n /* If set, the check icon is displayed near the selected option label @default true /\n withCheckIcon?: boolean;\n\n /* If set, unchecked labels are aligned with checked ones @default false /\n withAlignedLabels?: boolean;\n\n /* Position of the checkmark icon shown next to selected options in the dropdown @default 'left' /\n checkIconPosition?: 'left' \| 'right';\n\n /* When enabled, selected options are hidden from the dropdown list @default false /\n hidePickedOptions?: boolean;\n\n /* When enabled, displays a clear button to remove all selected values (hidden when component is empty, disabled, or read-only) @default false /\n clearable?: boolean;\n\n /* Determines how the clear button and rightSection are rendered @default 'both' /\n clearSectionMode?: ClearSectionMode;\n\n /* Props passed down to the clear button /\n clearButtonProps?: InputClearButtonProps;\n\n /* Props passed down to the hidden input /\n hiddenInputProps?: Omit<React.ComponentProps<'input'>, 'value'>;\n\n /* Divider used to separate values in the hidden input `value` attribute @default ',' /\n hiddenInputValuesDivider?: string;\n\n /* A function to render content of the option, replaces the default content of the option /\n renderOption?: (item: ComboboxLikeRenderOptionInput<ComboboxItem<Value>>) => React.ReactNode;\n\n /* A function to render content of the pill /\n renderPill?: (props: ComboboxRenderPillInput<Value>) => React.ReactNode;\n\n /* Props passed down to the underlying `ScrollArea` component in the dropdown /\n scrollAreaProps?: ScrollAreaProps;\n\n /* Controls color of the default chevron /\n chevronColor?: MantineColor;\n\n /* Clear search value when item is selected @default true /\n clearSearchOnChange?: boolean;\n\n /* Controls whether dropdown opens when the input receives focus @default true /\n openOnFocus?: boolean;\n\n /* If set, selected values can be reordered by dragging pills. Disabled when `disabled` or `readOnly` is set. @default false */\n withPillsReorder?: boolean;\n}\n\nexport type MultiSelectFactory = Factory<{\n props: MultiSelectProps;\n ref: HTMLInputElement;\n stylesNames: MultiSelectStylesNames;\n signature: <Value extends Primitive = string>(\n props: MultiSelectProps<Value>\n ) => React.JSX.Element;\n}>;\n\nconst defaultProps = {\n maxValues: Infinity,\n withCheckIcon: true,\n checkIconPosition: 'left',\n hiddenInputValuesDivider: ',',\n clearSearchOnChange: true,\n openOnFocus: true,\n size: 'sm',\n} satisfies Partial<MultiSelectProps>;\n\nexport const MultiSelect = genericFactory<MultiSelectFactory>((_props) => {\n const props = useProps(['Input', 'InputWrapper', 'MultiSelect'], defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n size,\n value,\n defaultValue,\n onChange,\n onKeyDown,\n variant,\n data,\n dropdownOpened,\n defaultDropdownOpened,\n onDropdownOpen,\n onDropdownClose,\n selectFirstOptionOnChange,\n selectFirstOptionOnDropdownOpen,\n onOptionSubmit,\n comboboxProps,\n filter,\n limit,\n withScrollArea,\n maxDropdownHeight,\n floatingHeight,\n searchValue,\n defaultSearchValue,\n onSearchChange,\n readOnly,\n disabled,\n onFocus,\n onBlur,\n radius,\n rightSection,\n rightSectionWidth,\n rightSectionPointerEvents,\n rightSectionProps,\n leftSection,\n leftSectionWidth,\n leftSectionPointerEvents,\n leftSectionProps,\n inputContainer,\n inputWrapperOrder,\n withAsterisk,\n labelProps,\n descriptionProps,\n errorProps,\n successProps,\n wrapperProps,\n description,\n label,\n error,\n success,\n maxValues,\n searchable,\n nothingFoundMessage,\n withCheckIcon,\n withAlignedLabels,\n checkIconPosition,\n hidePickedOptions,\n withErrorStyles,\n withSuccessStyles,\n name,\n form,\n id,\n clearable,\n clearSectionMode,\n clearButtonProps,\n hiddenInputProps,\n placeholder,\n hiddenInputValuesDivider,\n required,\n mod,\n renderOption,\n renderPill,\n onRemove,\n onClear,\n onMaxValues,\n scrollAreaProps,\n chevronColor,\n attributes,\n clearSearchOnChange,\n openOnFocus,\n loading,\n loadingPosition,\n withPillsReorder,\n ...others\n } = props;\n\n const _id = useId(id);\n const parsedData = getParsedComboboxData(data);\n const optionsLockup = getOptionsLockup(parsedData);\n const retainedSelectedOptions = useRef<Record<string, ComboboxItem<Primitive>>>({});\n\n const combobox = useCombobox({\n opened: dropdownOpened,\n defaultOpened: defaultDropdownOpened,\n onDropdownOpen: () => {\n onDropdownOpen?.();\n if (selectFirstOptionOnDropdownOpen) {\n combobox.selectFirstOption();\n }\n },\n onDropdownClose: () => {\n onDropdownClose?.();\n combobox.resetSelectedOption();\n },\n });\n\n const {\n styleProps,\n rest: { type, autoComplete, ...rest },\n } = extractStyleProps(others);\n\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: [],\n onChange,\n });\n\n const { getPillProps, getListProps, handleInputKeyDown } = usePillsReorder({\n value: _value,\n onChange: setValue,\n enabled: withPillsReorder && !disabled && !readOnly,\n });\n\n const [_searchValue, setSearchValue] = useUncontrolled({\n value: searchValue,\n defaultValue: defaultSearchValue,\n finalValue: '',\n onChange: onSearchChange,\n });\n\n const handleSearchChange = (value: string) => {\n setSearchValue(value);\n combobox.resetSelectedOption();\n };\n\n const getStyles = useStyles<MultiSelectFactory>({\n name: 'MultiSelect',\n classes: {} as any,\n props: props as any,\n classNames,\n styles,\n unstyled,\n attributes,\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MultiSelectFactory>({\n props,\n styles,\n classNames,\n });\n\n const handleInputKeydown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n\n if (event.defaultPrevented) {\n return;\n }\n\n if (event.key === ' ' && !searchable) {\n event.preventDefault();\n combobox.toggleDropdown();\n }\n\n if (event.key === 'Backspace' && _searchValue.length === 0 && _value.length > 0) {\n onRemove?.(_value[_value.length - 1]);\n setValue(_value.slice(0, _value.length - 1));\n }\n\n handleInputKeyDown(event);\n };\n\n const values = _value.map((item, index) => {\n const optionData = optionsLockup[`${item}`] \|\| retainedSelectedOptions.current[`${item}`];\n const reorderProps = getPillProps(index);\n\n if (renderPill) {\n return (\n <Fragment key={`${item}-${index}`}>\n {renderPill({\n option: optionData,\n value: item,\n onRemove: () => {\n setValue(_value.filter((i) => item !== i));\n onRemove?.(item);\n },\n disabled,\n reorderProps,\n })}\n </Fragment>\n );\n }\n\n return (\n <Pill\n key={`${item}-${index}`}\n withRemoveButton={!readOnly && !optionsLockup[`${item}`]?.disabled}\n onRemove={() => {\n setValue(_value.filter((i) => item !== i));\n onRemove?.(item);\n }}\n unstyled={unstyled}\n disabled={disabled}\n {...getStyles('pill')}\n {...reorderProps}\n >\n {optionData?.label \|\| item}\n </Pill>\n );\n });\n\n useEffect(() => {\n if (selectFirstOptionOnChange) {\n combobox.selectFirstOption();\n }\n }, [selectFirstOptionOnChange, _searchValue]);\n\n useEffect(() => {\n _value.forEach((val) => {\n if (`${val}` in optionsLockup) {\n retainedSelectedOptions.current[`${val}`] = optionsLockup[`${val}`];\n }\n });\n }, [optionsLockup, _value]);\n\n const clearButton = (\n <Combobox.ClearButton\n {...clearButtonProps}\n onClear={() => {\n onClear?.();\n setValue([]);\n handleSearchChange('');\n }}\n />\n );\n\n const filteredData = filterPickedValues({ data: parsedData, value: _value });\n const _clearable = clearable && _value.length > 0 && !disabled && !readOnly;\n const pillsListStyle = _clearable\n ? { paddingInlineEnd: clearSectionOffset[size] ?? clearSectionOffset.sm }\n : undefined;\n\n return (\n <>\n <Combobox\n store={combobox}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n size={size}\n readOnly={readOnly}\n __staticSelector=\"MultiSelect\"\n attributes={attributes}\n floatingHeight={floatingHeight}\n onOptionSubmit={(val) => {\n onOptionSubmit?.(val as any);\n if (clearSearchOnChange) {\n handleSearchChange('');\n }\n combobox.updateSelectedOptionIndex('selected');\n\n if (_value.includes(optionsLockup[`${val}`].value as any)) {\n setValue(_value.filter((v) => v !== optionsLockup[`${val}`].value));\n onRemove?.(optionsLockup[`${val}`].value as any);\n } else if (_value.length < maxValues) {\n setValue([..._value, optionsLockup[`${val}`].value] as any);\n } else {\n onMaxValues?.();\n }\n }}\n {...comboboxProps}\n >\n <Combobox.DropdownTarget>\n <PillsInput\n {...styleProps}\n __staticSelector=\"MultiSelect\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n size={size}\n className={className}\n style={style}\n variant={variant}\n disabled={disabled}\n radius={radius}\n __defaultRightSection={\n <Combobox.Chevron\n size={size}\n error={error}\n unstyled={unstyled}\n color={chevronColor}\n />\n }\n __clearSection={clearButton}\n __clearable={_clearable}\n __clearSectionMode={clearSectionMode}\n rightSection={rightSection}\n rightSectionPointerEvents={rightSectionPointerEvents \|\| 'none'}\n rightSectionWidth={rightSectionWidth}\n rightSectionProps={rightSectionProps}\n leftSection={leftSection}\n leftSectionWidth={leftSectionWidth}\n leftSectionPointerEvents={leftSectionPointerEvents}\n leftSectionProps={leftSectionProps}\n loading={loading}\n loadingPosition={loadingPosition}\n inputContainer={inputContainer}\n inputWrapperOrder={inputWrapperOrder}\n withAsterisk={withAsterisk}\n labelProps={labelProps}\n descriptionProps={descriptionProps}\n errorProps={errorProps}\n successProps={successProps}\n wrapperProps={wrapperProps}\n description={description}\n label={label}\n error={error}\n success={success}\n withErrorStyles={withErrorStyles}\n withSuccessStyles={withSuccessStyles}\n __stylesApiProps={{\n ...props,\n rightSectionPointerEvents: rightSectionPointerEvents \|\| 'none',\n multiline: true,\n }}\n pointer={!searchable}\n onClick={() => (searchable ? combobox.openDropdown() : combobox.toggleDropdown())}\n data-expanded={combobox.dropdownOpened \|\| undefined}\n id={_id}\n required={required}\n mod={mod}\n attributes={attributes}\n >\n <Pill.Group\n attributes={attributes}\n disabled={disabled}\n unstyled={unstyled}\n {...getStyles('pillsList', { style: pillsListStyle })}\n {...getListProps()}\n >\n {values}\n <Combobox.EventsTarget autoComplete={autoComplete} withExpandedAttribute>\n <PillsInput.Field\n {...rest}\n id={_id}\n placeholder={placeholder}\n type={!searchable && !placeholder ? 'hidden' : 'visible'}\n {...getStyles('inputField')}\n unstyled={unstyled}\n onFocus={(event) => {\n onFocus?.(event);\n openOnFocus && searchable && combobox.openDropdown();\n }}\n onBlur={(event) => {\n onBlur?.(event);\n combobox.closeDropdown();\n handleSearchChange('');\n }}\n onKeyDown={handleInputKeydown}\n value={_searchValue}\n onChange={(event) => {\n handleSearchChange(event.currentTarget.value);\n searchable && combobox.openDropdown();\n selectFirstOptionOnChange && combobox.selectFirstOption();\n }}\n disabled={disabled}\n readOnly={readOnly \|\| !searchable}\n pointer={!searchable}\n />\n </Combobox.EventsTarget>\n </Pill.Group>\n </PillsInput>\n </Combobox.DropdownTarget>\n\n <OptionsDropdown\n data={hidePickedOptions ? filteredData : parsedData}\n hidden={readOnly \|\| disabled}\n filter={filter as OptionsFilter<Primitive> \| undefined}\n search={_searchValue}\n limit={limit}\n hiddenWhenEmpty={!nothingFoundMessage}\n withScrollArea={withScrollArea}\n maxDropdownHeight={maxDropdownHeight}\n filterOptions={searchable}\n value={_value}\n checkIconPosition={checkIconPosition}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n nothingFoundMessage={nothingFoundMessage}\n unstyled={unstyled}\n labelId={label ? `${_id}-label` : undefined}\n aria-label={label ? undefined : others['aria-label']}\n renderOption={renderOption}\n scrollAreaProps={scrollAreaProps}\n />\n </Combobox>\n <Combobox.HiddenInput\n name={name}\n valuesDivider={hiddenInputValuesDivider}\n value={_value}\n form={form}\n disabled={disabled}\n {...hiddenInputProps}\n />\n </>\n );\n});\n\nMultiSelect.classes = { ...InputBase.classes, ...Combobox.classes };\nMultiSelect.displayName = '@mantine/core/MultiSelect';\n\nexport namespace MultiSelect {\n export type Props<Value extends Primitive = string> = MultiSelectProps<Value>;\n export type StylesNames = MultiSelectStylesNames;\n export type Factory = MultiSelectFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAyCA,MAAM,qBAA6C;CACjD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AA8GA,MAAM,eAAe;CACnB,WAAW;CACX,eAAe;CACf,mBAAmB;CACnB,0BAA0B;CAC1B,qBAAqB;CACrB,aAAa;CACb,MAAM;AACR;AAEA,MAAa,cAAc,gBAAoC,WAAW;CACxE,MAAM,QAAQ,SAAS;EAAC;EAAS;EAAgB;CAAa,GAAG,cAAc,MAAM;CACrF,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,OACA,cACA,UACA,WACA,SACA,MACA,gBACA,uBACA,gBACA,iBACA,2BACA,iCACA,gBACA,eACA,QACA,OACA,gBACA,mBACA,gBACA,aACA,oBACA,gBACA,UACA,UACA,SACA,QACA,QACA,cACA,mBACA,2BACA,mBACA,aACA,kBACA,0BACA,kBACA,gBACA,mBACA,cACA,YACA,kBACA,YACA,cACA,cACA,aACA,OACA,OACA,SACA,WACA,YACA,qBACA,eACA,mBACA,mBACA,mBACA,iBACA,mBACA,MACA,MACA,IACA,WACA,kBACA,kBACA,kBACA,aACA,0BACA,UACA,KACA,cACA,YACA,UACA,SACA,aACA,iBACA,cACA,YACA,qBACA,aACA,SACA,iBACA,kBACA,GAAG,WACD;CAEJ,MAAM,MAAMA,QAAM,EAAE;CACpB,MAAM,aAAa,sBAAsB,IAAI;CAC7C,MAAM,gBAAgB,iBAAiB,UAAU;CACjD,MAAM,0BAA0B,OAAgD,CAAC,CAAC;CAElF,MAAM,WAAW,YAAY;EAC3B,QAAQ;EACR,eAAe;EACf,sBAAsB;GACpB,iBAAiB;GACjB,IAAI,iCACF,SAAS,kBAAkB;EAE/B;EACA,uBAAuB;GACrB,kBAAkB;GAClB,SAAS,oBAAoB;EAC/B;CACF,CAAC;CAED,MAAM,EACJ,YACA,MAAM,EAAE,MAAM,cAAc,GAAG,WAC7B,kBAAkB,MAAM;CAE5B,MAAM,CAAC,QAAQ,YAAY,gBAAgB;EACzC;EACA;EACA,YAAY,CAAC;EACb;CACF,CAAC;CAED,MAAM,EAAE,cAAc,cAAc,uBAAuB,gBAAgB;EACzE,OAAO;EACP,UAAU;EACV,SAAS,oBAAoB,CAAC,YAAY,CAAC;CAC7C,CAAC;CAED,MAAM,CAAC,cAAc,kBAAkB,gBAAgB;EACrD,OAAO;EACP,cAAc;EACd,YAAY;EACZ,UAAU;CACZ,CAAC;CAED,MAAM,sBAAsB,UAAkB;EAC5C,eAAe,KAAK;EACpB,SAAS,oBAAoB;CAC/B;CAEA,MAAM,YAAY,UAA8B;EAC9C,MAAM;EACN,SAAS,CAAC;EACH;EACP;EACA;EACA;EACA;CACF,CAAC;CAED,MAAM,EAAE,oBAAoB,mBAAmB,qBAAyC;EACtF;EACA;EACA;CACF,CAAC;CAED,MAAM,sBAAsB,UAAiD;EAC3E,YAAY,KAAK;EAEjB,IAAI,MAAM,kBACR;EAGF,IAAI,MAAM,QAAQ,OAAO,CAAC,YAAY;GACpC,MAAM,eAAe;GACrB,SAAS,eAAe;EAC1B;EAEA,IAAI,MAAM,QAAQ,eAAe,aAAa,WAAW,KAAK,OAAO,SAAS,GAAG;GAC/E,WAAW,OAAO,OAAO,SAAS,EAAE;GACpC,SAAS,OAAO,MAAM,GAAG,OAAO,SAAS,CAAC,CAAC;EAC7C;EAEA,mBAAmB,KAAK;CAC1B;CAEA,MAAM,SAAS,OAAO,KAAK,MAAM,UAAU;EACzC,MAAM,aAAa,cAAc,GAAG,WAAW,wBAAwB,QAAQ,GAAG;EAClF,MAAM,eAAe,aAAa,KAAK;EAEvC,IAAI,YACF,OACE,oBAAC,UAAD,EAAA,UACG,WAAW;GACV,QAAQ;GACR,OAAO;GACP,gBAAgB;IACd,SAAS,OAAO,QAAQ,MAAM,SAAS,CAAC,CAAC;IACzC,WAAW,IAAI;GACjB;GACA;GACA;EACF,CAAC,EACO,GAXK,GAAG,KAAK,GAAG,OAWhB;EAId,OACE,oBAAC,MAAD;GAEE,kBAAkB,CAAC,YAAY,CAAC,cAAc,GAAG,OAAO,EAAE;GAC1D,gBAAgB;IACd,SAAS,OAAO,QAAQ,MAAM,SAAS,CAAC,CAAC;IACzC,WAAW,IAAI;GACjB;GACU;GACA;GACV,GAAI,UAAU,MAAM;GACpB,GAAI;aAEH,YAAY,SAAS;EAClB,GAZC,GAAG,KAAK,GAAG,OAYZ;CAEV,CAAC;CAED,gBAAgB;EACd,IAAI,2BACF,SAAS,kBAAkB;CAE/B,GAAG,CAAC,2BAA2B,YAAY,CAAC;CAE5C,gBAAgB;EACd,OAAO,SAAS,QAAQ;GACtB,IAAI,GAAG,SAAS,eACd,wBAAwB,QAAQ,GAAG,SAAS,cAAc,GAAG;EAEjE,CAAC;CACH,GAAG,CAAC,eAAe,MAAM,CAAC;CAE1B,MAAM,cACJ,oBAAC,SAAS,aAAV;EACE,GAAI;EACJ,eAAe;GACb,UAAU;GACV,SAAS,CAAC,CAAC;GACX,mBAAmB,EAAE;EACvB;CACD,CAAA;CAGH,MAAM,eAAe,mBAAmB;EAAE,MAAM;EAAY,OAAO;CAAO,CAAC;CAC3E,MAAM,aAAa,aAAa,OAAO,SAAS,KAAK,CAAC,YAAY,CAAC;CACnE,MAAM,iBAAiB,aACnB,EAAE,kBAAkB,mBAAmB,SAAS,mBAAmB,GAAG,IACtE,KAAA;CAEJ,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,qBAAC,UAAD;EACE,OAAO;EACP,YAAY;EACZ,QAAQ;EACE;EACJ;EACI;EACV,kBAAiB;EACL;EACI;EAChB,iBAAiB,QAAQ;GACvB,iBAAiB,GAAU;GAC3B,IAAI,qBACF,mBAAmB,EAAE;GAEvB,SAAS,0BAA0B,UAAU;GAE7C,IAAI,OAAO,SAAS,cAAc,GAAG,MAAM,CAAC,KAAY,GAAG;IACzD,SAAS,OAAO,QAAQ,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC,KAAK,CAAC;IAClE,WAAW,cAAc,GAAG,MAAM,CAAC,KAAY;GACjD,OAAO,IAAI,OAAO,SAAS,WACzB,SAAS,CAAC,GAAG,QAAQ,cAAc,GAAG,MAAM,CAAC,KAAK,CAAQ;QAE1D,cAAc;EAElB;EACA,GAAI;YA1BN,CA4BE,oBAAC,SAAS,gBAAV,EAAA,UACE,oBAAC,YAAD;GACE,GAAI;GACJ,kBAAiB;GACjB,YAAY;GACZ,QAAQ;GACE;GACJ;GACK;GACJ;GACE;GACC;GACF;GACR,uBACE,oBAAC,SAAS,SAAV;IACQ;IACC;IACG;IACV,OAAO;GACR,CAAA;GAEH,gBAAgB;GAChB,aAAa;GACb,oBAAoB;GACN;GACd,2BAA2B,6BAA6B;GACrC;GACA;GACN;GACK;GACQ;GACR;GACT;GACQ;GACD;GACG;GACL;GACF;GACM;GACN;GACE;GACA;GACD;GACN;GACA;GACE;GACQ;GACE;GACnB,kBAAkB;IAChB,GAAG;IACH,2BAA2B,6BAA6B;IACxD,WAAW;GACb;GACA,SAAS,CAAC;GACV,eAAgB,aAAa,SAAS,aAAa,IAAI,SAAS,eAAe;GAC/E,iBAAe,SAAS,kBAAkB,KAAA;GAC1C,IAAI;GACM;GACL;GACO;aAEZ,qBAAC,KAAK,OAAN;IACc;IACF;IACA;IACV,GAAI,UAAU,aAAa,EAAE,OAAO,eAAe,CAAC;IACpD,GAAI,aAAa;cALnB,CAOG,QACD,oBAAC,SAAS,cAAV;KAAqC;KAAc,uBAAA;eACjD,oBAAC,WAAW,OAAZ;MACE,GAAI;MACJ,IAAI;MACS;MACb,MAAM,CAAC,cAAc,CAAC,cAAc,WAAW;MAC/C,GAAI,UAAU,YAAY;MAChB;MACV,UAAU,UAAU;OAClB,UAAU,KAAK;OACf,eAAe,cAAc,SAAS,aAAa;MACrD;MACA,SAAS,UAAU;OACjB,SAAS,KAAK;OACd,SAAS,cAAc;OACvB,mBAAmB,EAAE;MACvB;MACA,WAAW;MACX,OAAO;MACP,WAAW,UAAU;OACnB,mBAAmB,MAAM,cAAc,KAAK;OAC5C,cAAc,SAAS,aAAa;OACpC,6BAA6B,SAAS,kBAAkB;MAC1D;MACU;MACV,UAAU,YAAY,CAAC;MACvB,SAAS,CAAC;KACX,CAAA;IACoB,CAAA,CACb;;EACF,CAAA,EACW,CAAA,GAEzB,oBAAC,iBAAD;GACE,MAAM,oBAAoB,eAAe;GACzC,QAAQ,YAAY;GACZ;GACR,QAAQ;GACD;GACP,iBAAiB,CAAC;GACF;GACG;GACnB,eAAe;GACf,OAAO;GACY;GACJ;GACI;GACE;GACX;GACV,SAAS,QAAQ,GAAG,IAAI,UAAU,KAAA;GAClC,cAAY,QAAQ,KAAA,IAAY,OAAO;GACzB;GACG;EAClB,CAAA,CACO;KACV,oBAAC,SAAS,aAAV;EACQ;EACN,eAAe;EACf,OAAO;EACD;EACI;EACV,GAAI;CACL,CAAA,CACD,EAAA,CAAA;AAEN,CAAC;AAED,YAAY,UAAU;CAAE,GAAG,UAAU;CAAS,GAAG,SAAS;AAAQ;AAClE,YAAY,cAAc"}
1	+ {"version":3,"file":"MultiSelect.mjs","names":["useId"],"sources":["../../../src/components/MultiSelect/MultiSelect.tsx"],"sourcesContent":["import { Fragment, useEffect, useRef } from 'react';\nimport { useId, useUncontrolled } from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n extractStyleProps,\n Factory,\n genericFactory,\n MantineColor,\n Primitive,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n useStyles,\n} from '../../core';\nimport {\n Combobox,\n ComboboxItem,\n ComboboxLikeProps,\n ComboboxLikeRenderOptionInput,\n ComboboxLikeStylesNames,\n ComboboxRenderPillInput,\n getOptionsLockup,\n getParsedComboboxData,\n OptionsDropdown,\n OptionsFilter,\n useCombobox,\n usePillsReorder,\n} from '../Combobox';\nimport { getOptionByLabel } from '../Combobox/get-options-lockup/get-option-by-label';\nimport { isExternalInputChange } from '../Combobox/is-external-input-change/is-external-input-change';\nimport {\n __BaseInputProps,\n __InputStylesNames,\n ClearSectionMode,\n InputClearButtonProps,\n} from '../Input';\nimport { InputBase } from '../InputBase';\nimport { Pill } from '../Pill';\nimport { PillsInput } from '../PillsInput';\nimport { ScrollAreaProps } from '../ScrollArea';\nimport { filterPickedValues } from './filter-picked-values';\n\nconst clearSectionOffset: Record<string, number> = {\n xs: 41,\n sm: 50,\n md: 60,\n lg: 72,\n xl: 89,\n};\n\nexport type MultiSelectStylesNames =\n \| __InputStylesNames\n \| ComboboxLikeStylesNames\n \| 'pill'\n \| 'pillsList'\n \| 'inputField';\n\nexport interface MultiSelectProps<Value extends Primitive = string>\n extends\n BoxProps,\n __BaseInputProps,\n ComboboxLikeProps<Value>,\n StylesApiProps<MultiSelectFactory>,\n ElementProps<'input', 'size' \| 'value' \| 'defaultValue' \| 'onChange'> {\n /** Controlled component value /\n value?: Value[];\n\n /* Uncontrolled component default value /\n defaultValue?: Value[];\n\n /* Called when value changes /\n onChange?: (value: Value[]) => void;\n\n /* Called with `value` of the removed item /\n onRemove?: (value: Value) => void;\n\n /* Called when the clear button is clicked /\n onClear?: () => void;\n\n /* Called when user attempts to select more values than allowed /\n onMaxValues?: () => void;\n\n /* Controlled search value /\n searchValue?: string;\n\n /* Default search value /\n defaultSearchValue?: string;\n\n /* Called when search changes /\n onSearchChange?: (value: string) => void;\n\n /* Maximum number of values, no limit if not set /\n maxValues?: number;\n\n /* Allows searching through options by user input @default false /\n searchable?: boolean;\n\n /* Message displayed when no options match the search query (when searchable is enabled) or when the data array is empty. If not set, the dropdown will be hidden instead. /\n nothingFoundMessage?: React.ReactNode;\n\n /* If set, the check icon is displayed near the selected option label @default true /\n withCheckIcon?: boolean;\n\n /* If set, unchecked labels are aligned with checked ones @default false /\n withAlignedLabels?: boolean;\n\n /* Position of the checkmark icon shown next to selected options in the dropdown @default 'left' /\n checkIconPosition?: 'left' \| 'right';\n\n /* When enabled, selected options are hidden from the dropdown list @default false /\n hidePickedOptions?: boolean;\n\n /* When enabled, displays a clear button to remove all selected values (hidden when component is empty, disabled, or read-only) @default false /\n clearable?: boolean;\n\n /* Determines how the clear button and rightSection are rendered @default 'both' /\n clearSectionMode?: ClearSectionMode;\n\n /* Props passed down to the clear button /\n clearButtonProps?: InputClearButtonProps;\n\n /* Props passed down to the hidden input /\n hiddenInputProps?: Omit<React.ComponentProps<'input'>, 'value'>;\n\n /* Divider used to separate values in the hidden input `value` attribute @default ',' /\n hiddenInputValuesDivider?: string;\n\n /* A function to render content of the option, replaces the default content of the option /\n renderOption?: (item: ComboboxLikeRenderOptionInput<ComboboxItem<Value>>) => React.ReactNode;\n\n /* A function to render content of the pill /\n renderPill?: (props: ComboboxRenderPillInput<Value>) => React.ReactNode;\n\n /* Props passed down to the underlying `ScrollArea` component in the dropdown /\n scrollAreaProps?: ScrollAreaProps;\n\n /* Controls color of the default chevron /\n chevronColor?: MantineColor;\n\n /* Clear search value when item is selected @default true /\n clearSearchOnChange?: boolean;\n\n /* Controls whether dropdown opens when the input receives focus @default true /\n openOnFocus?: boolean;\n\n /* If set, selected values can be reordered by dragging pills. Disabled when `disabled` or `readOnly` is set. @default false */\n withPillsReorder?: boolean;\n}\n\nexport type MultiSelectFactory = Factory<{\n props: MultiSelectProps;\n ref: HTMLInputElement;\n stylesNames: MultiSelectStylesNames;\n signature: <Value extends Primitive = string>(\n props: MultiSelectProps<Value>\n ) => React.JSX.Element;\n}>;\n\nconst defaultProps = {\n maxValues: Infinity,\n withCheckIcon: true,\n checkIconPosition: 'left',\n hiddenInputValuesDivider: ',',\n clearSearchOnChange: true,\n openOnFocus: true,\n size: 'sm',\n} satisfies Partial<MultiSelectProps>;\n\nexport const MultiSelect = genericFactory<MultiSelectFactory>((_props) => {\n const props = useProps(['Input', 'InputWrapper', 'MultiSelect'], defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n size,\n value,\n defaultValue,\n onChange,\n onKeyDown,\n variant,\n data,\n dropdownOpened,\n defaultDropdownOpened,\n onDropdownOpen,\n onDropdownClose,\n selectFirstOptionOnChange,\n selectFirstOptionOnDropdownOpen,\n onOptionSubmit,\n comboboxProps,\n filter,\n limit,\n withScrollArea,\n maxDropdownHeight,\n floatingHeight,\n searchValue,\n defaultSearchValue,\n onSearchChange,\n readOnly,\n disabled,\n onFocus,\n onBlur,\n radius,\n rightSection,\n rightSectionWidth,\n rightSectionPointerEvents,\n rightSectionProps,\n leftSection,\n leftSectionWidth,\n leftSectionPointerEvents,\n leftSectionProps,\n inputContainer,\n inputWrapperOrder,\n withAsterisk,\n labelProps,\n descriptionProps,\n errorProps,\n successProps,\n wrapperProps,\n description,\n label,\n error,\n success,\n maxValues,\n searchable,\n nothingFoundMessage,\n withCheckIcon,\n withAlignedLabels,\n checkIconPosition,\n hidePickedOptions,\n withErrorStyles,\n withSuccessStyles,\n name,\n form,\n id,\n clearable,\n clearSectionMode,\n clearButtonProps,\n hiddenInputProps,\n placeholder,\n hiddenInputValuesDivider,\n required,\n mod,\n renderOption,\n renderPill,\n onRemove,\n onClear,\n onMaxValues,\n scrollAreaProps,\n chevronColor,\n attributes,\n clearSearchOnChange,\n openOnFocus,\n loading,\n loadingPosition,\n withPillsReorder,\n ...others\n } = props;\n\n const _id = useId(id);\n const parsedData = getParsedComboboxData(data);\n const optionsLockup = getOptionsLockup(parsedData);\n const retainedSelectedOptions = useRef<Record<string, ComboboxItem<Primitive>>>({});\n\n const combobox = useCombobox({\n opened: dropdownOpened,\n defaultOpened: defaultDropdownOpened,\n onDropdownOpen: () => {\n onDropdownOpen?.();\n if (selectFirstOptionOnDropdownOpen) {\n combobox.selectFirstOption();\n }\n },\n onDropdownClose: () => {\n onDropdownClose?.();\n combobox.resetSelectedOption();\n },\n });\n\n const {\n styleProps,\n rest: { type, autoComplete, ...rest },\n } = extractStyleProps(others);\n\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: [],\n onChange,\n });\n\n const { getPillProps, getListProps, handleInputKeyDown } = usePillsReorder({\n value: _value,\n onChange: setValue,\n enabled: withPillsReorder && !disabled && !readOnly,\n });\n\n const [_searchValue, setSearchValue] = useUncontrolled({\n value: searchValue,\n defaultValue: defaultSearchValue,\n finalValue: '',\n onChange: onSearchChange,\n });\n\n const handleSearchChange = (value: string) => {\n setSearchValue(value);\n combobox.resetSelectedOption();\n };\n\n const getStyles = useStyles<MultiSelectFactory>({\n name: 'MultiSelect',\n classes: {} as any,\n props: props as any,\n classNames,\n styles,\n unstyled,\n attributes,\n });\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<MultiSelectFactory>({\n props,\n styles,\n classNames,\n });\n\n const handleInputKeydown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n\n if (event.defaultPrevented) {\n return;\n }\n\n if (event.key === ' ' && !searchable) {\n event.preventDefault();\n combobox.toggleDropdown();\n }\n\n if (event.key === 'Backspace' && _searchValue.length === 0 && _value.length > 0) {\n onRemove?.(_value[_value.length - 1]);\n setValue(_value.slice(0, _value.length - 1));\n }\n\n handleInputKeyDown(event);\n };\n\n const values = _value.map((item, index) => {\n const optionData = optionsLockup[`${item}`] \|\| retainedSelectedOptions.current[`${item}`];\n const reorderProps = getPillProps(index);\n\n if (renderPill) {\n return (\n <Fragment key={`${item}-${index}`}>\n {renderPill({\n option: optionData,\n value: item,\n onRemove: () => {\n setValue(_value.filter((i) => item !== i));\n onRemove?.(item);\n },\n disabled,\n reorderProps,\n })}\n </Fragment>\n );\n }\n\n return (\n <Pill\n key={`${item}-${index}`}\n withRemoveButton={!readOnly && !optionsLockup[`${item}`]?.disabled}\n onRemove={() => {\n setValue(_value.filter((i) => item !== i));\n onRemove?.(item);\n }}\n unstyled={unstyled}\n disabled={disabled}\n {...getStyles('pill')}\n {...reorderProps}\n >\n {optionData?.label \|\| item}\n </Pill>\n );\n });\n\n useEffect(() => {\n if (selectFirstOptionOnChange) {\n combobox.selectFirstOption();\n }\n }, [selectFirstOptionOnChange, _searchValue]);\n\n useEffect(() => {\n _value.forEach((val) => {\n if (`${val}` in optionsLockup) {\n retainedSelectedOptions.current[`${val}`] = optionsLockup[`${val}`];\n }\n });\n }, [optionsLockup, _value]);\n\n const clearButton = (\n <Combobox.ClearButton\n {...clearButtonProps}\n onClear={() => {\n onClear?.();\n setValue([]);\n handleSearchChange('');\n }}\n />\n );\n\n const filteredData = filterPickedValues({ data: parsedData, value: _value });\n const _clearable = clearable && _value.length > 0 && !disabled && !readOnly;\n const pillsListStyle = _clearable\n ? { paddingInlineEnd: clearSectionOffset[size] ?? clearSectionOffset.sm }\n : undefined;\n\n return (\n <>\n <Combobox\n store={combobox}\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n size={size}\n readOnly={readOnly}\n __staticSelector=\"MultiSelect\"\n attributes={attributes}\n floatingHeight={floatingHeight}\n onOptionSubmit={(val) => {\n onOptionSubmit?.(val as any);\n if (clearSearchOnChange) {\n handleSearchChange('');\n }\n combobox.updateSelectedOptionIndex('selected');\n\n if (_value.includes(optionsLockup[`${val}`].value as any)) {\n setValue(_value.filter((v) => v !== optionsLockup[`${val}`].value));\n onRemove?.(optionsLockup[`${val}`].value as any);\n } else if (_value.length < maxValues) {\n setValue([..._value, optionsLockup[`${val}`].value] as any);\n } else {\n onMaxValues?.();\n }\n }}\n {...comboboxProps}\n >\n <Combobox.DropdownTarget>\n <PillsInput\n {...styleProps}\n __staticSelector=\"MultiSelect\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n size={size}\n className={className}\n style={style}\n variant={variant}\n disabled={disabled}\n radius={radius}\n __defaultRightSection={\n <Combobox.Chevron\n size={size}\n error={error}\n unstyled={unstyled}\n color={chevronColor}\n />\n }\n __clearSection={clearButton}\n __clearable={_clearable}\n __clearSectionMode={clearSectionMode}\n rightSection={rightSection}\n rightSectionPointerEvents={rightSectionPointerEvents \|\| 'none'}\n rightSectionWidth={rightSectionWidth}\n rightSectionProps={rightSectionProps}\n leftSection={leftSection}\n leftSectionWidth={leftSectionWidth}\n leftSectionPointerEvents={leftSectionPointerEvents}\n leftSectionProps={leftSectionProps}\n loading={loading}\n loadingPosition={loadingPosition}\n inputContainer={inputContainer}\n inputWrapperOrder={inputWrapperOrder}\n withAsterisk={withAsterisk}\n labelProps={labelProps}\n descriptionProps={descriptionProps}\n errorProps={errorProps}\n successProps={successProps}\n wrapperProps={wrapperProps}\n description={description}\n label={label}\n error={error}\n success={success}\n withErrorStyles={withErrorStyles}\n withSuccessStyles={withSuccessStyles}\n __stylesApiProps={{\n ...props,\n rightSectionPointerEvents: rightSectionPointerEvents \|\| 'none',\n multiline: true,\n }}\n pointer={!searchable}\n onClick={() => (searchable ? combobox.openDropdown() : combobox.toggleDropdown())}\n data-expanded={combobox.dropdownOpened \|\| undefined}\n id={_id}\n required={required}\n mod={mod}\n attributes={attributes}\n >\n <Pill.Group\n attributes={attributes}\n disabled={disabled}\n unstyled={unstyled}\n {...getStyles('pillsList', { style: pillsListStyle })}\n {...getListProps()}\n >\n {values}\n <Combobox.EventsTarget autoComplete={autoComplete} withExpandedAttribute>\n <PillsInput.Field\n {...rest}\n id={_id}\n placeholder={placeholder}\n type={!searchable && !placeholder ? 'hidden' : 'visible'}\n {...getStyles('inputField')}\n unstyled={unstyled}\n onFocus={(event) => {\n onFocus?.(event);\n openOnFocus && searchable && combobox.openDropdown();\n }}\n onBlur={(event) => {\n onBlur?.(event);\n combobox.closeDropdown();\n handleSearchChange('');\n }}\n onKeyDown={handleInputKeydown}\n value={_searchValue}\n onChange={(event) => {\n if (isExternalInputChange(event)) {\n if (!readOnly) {\n const externalOption = getOptionByLabel(\n optionsLockup,\n event.currentTarget.value\n );\n\n if (\n externalOption &&\n !_value.includes(externalOption.value as any) &&\n _value.length < maxValues\n ) {\n setValue([..._value, externalOption.value] as any);\n }\n }\n\n return;\n }\n\n handleSearchChange(event.currentTarget.value);\n searchable && combobox.openDropdown();\n selectFirstOptionOnChange && combobox.selectFirstOption();\n }}\n disabled={disabled}\n readOnly={readOnly \|\| !searchable}\n pointer={!searchable}\n />\n </Combobox.EventsTarget>\n </Pill.Group>\n </PillsInput>\n </Combobox.DropdownTarget>\n\n <OptionsDropdown\n data={hidePickedOptions ? filteredData : parsedData}\n hidden={readOnly \|\| disabled}\n filter={filter as OptionsFilter<Primitive> \| undefined}\n search={_searchValue}\n limit={limit}\n hiddenWhenEmpty={!nothingFoundMessage}\n withScrollArea={withScrollArea}\n maxDropdownHeight={maxDropdownHeight}\n filterOptions={searchable}\n value={_value}\n checkIconPosition={checkIconPosition}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n nothingFoundMessage={nothingFoundMessage}\n unstyled={unstyled}\n labelId={label ? `${_id}-label` : undefined}\n aria-label={label ? undefined : others['aria-label']}\n renderOption={renderOption}\n scrollAreaProps={scrollAreaProps}\n />\n </Combobox>\n <Combobox.HiddenInput\n name={name}\n valuesDivider={hiddenInputValuesDivider}\n value={_value}\n form={form}\n disabled={disabled}\n {...hiddenInputProps}\n />\n </>\n );\n});\n\nMultiSelect.classes = { ...InputBase.classes, ...Combobox.classes };\nMultiSelect.displayName = '@mantine/core/MultiSelect';\n\nexport namespace MultiSelect {\n export type Props<Value extends Primitive = string> = MultiSelectProps<Value>;\n export type StylesNames = MultiSelectStylesNames;\n export type Factory = MultiSelectFactory;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA2CA,MAAM,qBAA6C;CACjD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AA8GA,MAAM,eAAe;CACnB,WAAW;CACX,eAAe;CACf,mBAAmB;CACnB,0BAA0B;CAC1B,qBAAqB;CACrB,aAAa;CACb,MAAM;AACR;AAEA,MAAa,cAAc,gBAAoC,WAAW;CACxE,MAAM,QAAQ,SAAS;EAAC;EAAS;EAAgB;CAAa,GAAG,cAAc,MAAM;CACrF,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,MACA,OACA,cACA,UACA,WACA,SACA,MACA,gBACA,uBACA,gBACA,iBACA,2BACA,iCACA,gBACA,eACA,QACA,OACA,gBACA,mBACA,gBACA,aACA,oBACA,gBACA,UACA,UACA,SACA,QACA,QACA,cACA,mBACA,2BACA,mBACA,aACA,kBACA,0BACA,kBACA,gBACA,mBACA,cACA,YACA,kBACA,YACA,cACA,cACA,aACA,OACA,OACA,SACA,WACA,YACA,qBACA,eACA,mBACA,mBACA,mBACA,iBACA,mBACA,MACA,MACA,IACA,WACA,kBACA,kBACA,kBACA,aACA,0BACA,UACA,KACA,cACA,YACA,UACA,SACA,aACA,iBACA,cACA,YACA,qBACA,aACA,SACA,iBACA,kBACA,GAAG,WACD;CAEJ,MAAM,MAAMA,QAAM,EAAE;CACpB,MAAM,aAAa,sBAAsB,IAAI;CAC7C,MAAM,gBAAgB,iBAAiB,UAAU;CACjD,MAAM,0BAA0B,OAAgD,CAAC,CAAC;CAElF,MAAM,WAAW,YAAY;EAC3B,QAAQ;EACR,eAAe;EACf,sBAAsB;GACpB,iBAAiB;GACjB,IAAI,iCACF,SAAS,kBAAkB;EAE/B;EACA,uBAAuB;GACrB,kBAAkB;GAClB,SAAS,oBAAoB;EAC/B;CACF,CAAC;CAED,MAAM,EACJ,YACA,MAAM,EAAE,MAAM,cAAc,GAAG,WAC7B,kBAAkB,MAAM;CAE5B,MAAM,CAAC,QAAQ,YAAY,gBAAgB;EACzC;EACA;EACA,YAAY,CAAC;EACb;CACF,CAAC;CAED,MA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"}

package/esm/components/NativeSelect/NativeSelect.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NativeSelect.mjs","names":[],"sources":["../../../src/components/NativeSelect/NativeSelect.tsx"],"sourcesContent":["import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core';\nimport { ComboboxChevron, ComboboxStringGroupData, getParsedComboboxData } from '../Combobox';\nimport { __BaseInputProps, __InputStylesNames } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { NativeSelectOption } from './NativeSelectOption';\n\nexport interface NativeSelectProps\n extends\n BoxProps,\n Omit<__BaseInputProps, 'pointer'>,\n StylesApiProps<NativeSelectFactory>,\n ElementProps<'select', 'size'> {\n /*\n Data used to render options. Accepts strings, objects with label/value,\n * or grouped options. If `children` prop is provided, `data` will be ignored.\n */\n data?: ComboboxStringGroupData;\n}\n\nexport type NativeSelectFactory = Factory<{\n props: NativeSelectProps;\n ref: HTMLSelectElement;\n stylesNames: __InputStylesNames;\n}>;\n\nconst defaultProps = {\n size: 'sm',\n rightSectionPointerEvents: 'none',\n} satisfies Partial<NativeSelectProps>;\n\nexport const NativeSelect = factory<NativeSelectFactory>((props) => {\n const { data, children, size, error, rightSection, unstyled, ...others } = useProps(\n ['Input', 'InputWrapper', 'NativeSelect'],\n defaultProps,\n props\n );\n\n const options = getParsedComboboxData<string>(data).map((item, index) => (\n <NativeSelectOption key={index} data={item} />\n ));\n\n return (\n <InputBase\n component=\"select\"\n {...others}\n __staticSelector=\"NativeSelect\"\n size={size}\n pointer\n error={error}\n unstyled={unstyled}\n rightSection={\n rightSection \|\| <ComboboxChevron size={size} error={error} unstyled={unstyled} />\n }\n >\n {children \|\| options}\n </InputBase>\n );\n});\n\nNativeSelect.classes = InputBase.classes;\nNativeSelect.displayName = '@mantine/core/NativeSelect';\n\nexport namespace NativeSelect {\n export type Props = NativeSelectProps;\n export type Factory = NativeSelectFactory;\n export type StylesNames = __InputStylesNames;\n}\n"],"mappings":";;;;;;;;;AAyBA,MAAM,eAAe;CACnB,MAAM;CACN,2BAA2B;AAC7B;AAEA,MAAa,eAAe,SAA8B,UAAU;CAClE,MAAM,EAAE,MAAM,UAAU,MAAM,OAAO,cAAc,UAAU,GAAG,WAAW,SACzE;EAAC;EAAS;EAAgB;CAAc,GACxC,cACA,KACF;CAEA,MAAM,UAAU,sBAA8B,IAAI,CAAC,CAAC,KAAK,MAAM,UAC7D,oBAAC,oBAAD,EAAgC,MAAM,KAAO,GAApB,KAAoB,CAC9C;CAED,OACE,oBAAC,WAAD;EACE,WAAU;EACV,GAAI;EACJ,kBAAiB;EACX;EACN,SAAA;EACO;EACG;EACV,cACE,gBAAgB,oBAAC,iBAAD;GAAuB;GAAa;GAAiB;EAAW,CAAA;~~YAGjF~~,YAAY;CACJ,CAAA;AAEf,CAAC;AAED,aAAa,UAAU,UAAU;AACjC,aAAa,cAAc"}
1	+ {"version":3,"file":"NativeSelect.mjs","names":[],"sources":["../../../src/components/NativeSelect/NativeSelect.tsx"],"sourcesContent":["import { BoxProps, ElementProps, factory, Factory, StylesApiProps, useProps } from '../../core';\nimport { ComboboxChevron, ComboboxStringGroupData, getParsedComboboxData } from '../Combobox';\nimport { __BaseInputProps, __InputStylesNames } from '../Input';\nimport { InputBase } from '../InputBase';\nimport { NativeSelectOption } from './NativeSelectOption';\n\nexport interface NativeSelectProps\n extends\n BoxProps,\n Omit<__BaseInputProps, 'pointer'>,\n StylesApiProps<NativeSelectFactory>,\n ElementProps<'select', 'size'> {\n /*\n Data used to render options. Accepts strings, objects with label/value,\n * or grouped options. If `children` prop is provided, `data` will be ignored.\n */\n data?: ComboboxStringGroupData;\n}\n\nexport type NativeSelectFactory = Factory<{\n props: NativeSelectProps;\n ref: HTMLSelectElement;\n stylesNames: __InputStylesNames;\n}>;\n\nconst defaultProps = {\n size: 'sm',\n rightSectionPointerEvents: 'none',\n} satisfies Partial<NativeSelectProps>;\n\nexport const NativeSelect = factory<NativeSelectFactory>((props) => {\n const { data, children, size, error, rightSection, unstyled, ...others } = useProps(\n ['Input', 'InputWrapper', 'NativeSelect'],\n defaultProps,\n props\n );\n\n const options = getParsedComboboxData<string>(data).map((item, index) => (\n <NativeSelectOption key={index} data={item} />\n ));\n\n return (\n <InputBase\n component=\"select\"\n {...others}\n __staticSelector=\"NativeSelect\"\n size={size}\n pointer\n error={error}\n unstyled={unstyled}\n rightSection={\n rightSection \|\| <ComboboxChevron size={size} error={error} unstyled={unstyled} />\n }\n >\n {children \|\| options}\n </InputBase>\n );\n});\n\nNativeSelect.classes = InputBase.classes;\nNativeSelect.displayName = '@mantine/core/NativeSelect';\n\nexport namespace NativeSelect {\n export type Props = NativeSelectProps;\n export type Factory = NativeSelectFactory;\n export type StylesNames = __InputStylesNames;\n}\n"],"mappings":";;;;;;;;;AAyBA,MAAM,eAAe;CACnB,MAAM;CACN,2BAA2B;AAC7B;AAEA,MAAa,eAAe,SAA8B,UAAU;CAClE,MAAM,EAAE,MAAM,UAAU,MAAM,OAAO,cAAc,UAAU,GAAG,WAAW,SACzE;EAAC;EAAS;EAAgB;CAAc,GACxC,cACA,KACF;CAEA,MAAM,UAAU,sBAA8B,IAAI,CAAC,CAAC,KAAK,MAAM,UAC7D,oBAAC,oBAAD,EAAgC,MAAM,KAAO,GAApB,KAAoB,CAC9C;CAED,OACE,oBAAC,WAAD;EACE,WAAU;EACV,GAAI;EACJ,kBAAiB;EACX;EACN,SAAA;EACO;EACG;EACV,cACE,gBAAgB,oBAAC,iBAAD;GAAuB;GAAa;GAAiB;EAAW,CAAA;EAGjF,UAAA,YAAY;CACJ,CAAA;AAEf,CAAC;AAED,aAAa,UAAU,UAAU;AACjC,aAAa,cAAc"}

package/esm/components/NativeSelect/NativeSelectOption.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NativeSelectOption.mjs","names":[],"sources":["../../../src/components/NativeSelect/NativeSelectOption.tsx"],"sourcesContent":["import { ComboboxParsedItem, ComboboxParsedItemGroup } from '../Combobox';\n\nexport interface NativeSelectOptionProps {\n data: ComboboxParsedItem;\n}\n\nfunction isGroup(input: ComboboxParsedItem): input is ComboboxParsedItemGroup {\n return 'group' in input;\n}\n\nexport function NativeSelectOption({ data }: NativeSelectOptionProps) {\n if (isGroup(data)) {\n const items = data.items.map((item) => <NativeSelectOption key={item.value} data={item} />);\n return <optgroup label={data.group as string}>{items}</optgroup>;\n }\n\n const { value, label, ...others } = data;\n\n return (\n <option value={data.value} {...others}>\n {data.label}\n </option>\n );\n}\n\nNativeSelectOption.displayName = '@mantine/core/NativeSelectOption';\n"],"mappings":";;;AAMA,SAAS,QAAQ,OAA6D;CAC5E,OAAO,WAAW;AACpB;AAEA,SAAgB,mBAAmB,EAAE,QAAiC;CACpE,IAAI,QAAQ,IAAI,GAAG;EACjB,MAAM,QAAQ,KAAK,MAAM,KAAK,SAAS,oBAAC,oBAAD,EAAqC,MAAM,KAAO,GAAzB,KAAK,KAAoB,CAAC;EAC1F,OAAO,oBAAC,YAAD;GAAU,OAAO,KAAK;~~aAAkB~~;EAAgB,CAAA;CACjE;CAEA,MAAM,EAAE,OAAO,OAAO,GAAG,WAAW;CAEpC,OACE,oBAAC,UAAD;EAAQ,OAAO,KAAK;EAAO,GAAI;~~YAC5B~~,KAAK;CACA,CAAA;AAEZ;AAEA,mBAAmB,cAAc"}
1	+ {"version":3,"file":"NativeSelectOption.mjs","names":[],"sources":["../../../src/components/NativeSelect/NativeSelectOption.tsx"],"sourcesContent":["import { ComboboxParsedItem, ComboboxParsedItemGroup } from '../Combobox';\n\nexport interface NativeSelectOptionProps {\n data: ComboboxParsedItem;\n}\n\nfunction isGroup(input: ComboboxParsedItem): input is ComboboxParsedItemGroup {\n return 'group' in input;\n}\n\nexport function NativeSelectOption({ data }: NativeSelectOptionProps) {\n if (isGroup(data)) {\n const items = data.items.map((item) => <NativeSelectOption key={item.value} data={item} />);\n return <optgroup label={data.group as string}>{items}</optgroup>;\n }\n\n const { value, label, ...others } = data;\n\n return (\n <option value={data.value} {...others}>\n {data.label}\n </option>\n );\n}\n\nNativeSelectOption.displayName = '@mantine/core/NativeSelectOption';\n"],"mappings":";;;AAMA,SAAS,QAAQ,OAA6D;CAC5E,OAAO,WAAW;AACpB;AAEA,SAAgB,mBAAmB,EAAE,QAAiC;CACpE,IAAI,QAAQ,IAAI,GAAG;EACjB,MAAM,QAAQ,KAAK,MAAM,KAAK,SAAS,oBAAC,oBAAD,EAAqC,MAAM,KAAO,GAAzB,KAAK,KAAoB,CAAC;EAC1F,OAAO,oBAAC,YAAD;GAAU,OAAO,KAAK;GAAkB,UAAA;EAAgB,CAAA;CACjE;CAEA,MAAM,EAAE,OAAO,OAAO,GAAG,WAAW;CAEpC,OACE,oBAAC,UAAD;EAAQ,OAAO,KAAK;EAAO,GAAI;EAC5B,UAAA,KAAK;CACA,CAAA;AAEZ;AAEA,mBAAmB,cAAc"}