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

@mantine/core 9.6.0 → 9.6.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (78) hide show

package/cjs/components/Accordion/Accordion.module.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Accordion.module.cjs","names":[],"sources":["../../../src/components/Accordion/Accordion.module.css"],"sourcesContent":[".root {\n --accordion-radius: var(--mantine-radius-default);\n}\n\n.panel {\n overflow-wrap: break-word;\n}\n\n.content {\n padding: var(--mantine-spacing-md);\n padding-top: calc(var(--mantine-spacing-xs) / 2);\n}\n\n.itemTitle {\n margin: 0;\n padding: 0;\n width: 100%;\n}\n\n.control {\n width: 100%;\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n padding-inline: var(--mantine-spacing-md);\n opacity: 1;\n cursor: pointer;\n background-color: transparent;\n color: var(--mantine-color-bright);\n\n &:where([data-chevron-position='left']) {\n flex-direction: row;\n padding-inline-start: 0;\n }\n\n &:where(:disabled, [data-disabled]) {\n opacity: 0.4;\n cursor: not-allowed;\n }\n}\n\n.control--default,\n.control--contained {\n &:where(:not(:disabled, [data-disabled])) {\n @mixin hover {\n @mixin where-light {\n background-color: var(--mantine-color-gray-0);\n }\n\n @mixin where-dark {\n background-color: var(--mantine-color-dark-6);\n }\n }\n }\n}\n\n.label {\n color: inherit;\n font-weight: var(--mantine-font-weight-regular);\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n padding-top: var(--mantine-spacing-sm);\n padding-bottom: var(--mantine-spacing-sm);\n}\n\n.chevron {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n transition: transform var(--accordion-transition-duration, 200ms) ease;\n width: var(--accordion-chevron-size, rem(15px));\n min-width: var(--accordion-chevron-size, rem(15px));\n transform: rotate(0deg);\n\n &:where([data-rotate]) {\n transform: rotate(180deg);\n }\n\n &:where([data-position='left']) {\n margin-inline-end: var(--mantine-spacing-md);\n margin-inline-start: var(--mantine-spacing-md);\n }\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n margin-inline-end: var(--mantine-spacing-sm);\n\n &:where([data-chevron-position='left']) {\n margin-inline-end: 0;\n margin-inline-start: var(--mantine-spacing-lg);\n }\n}\n\n.item {\n @mixin where-light {\n --item-border-color: var(--mantine-color-gray-3);\n --item-filled-color: var(--mantine-color-gray-0);\n }\n\n @mixin where-dark {\n --item-border-color: var(--mantine-color-dark-4);\n --item-filled-color: var(--mantine-color-dark-6);\n }\n}\n\n.item--default {\n border-bottom: 1px solid var(--item-border-color);\n}\n\n.item--contained {\n border: 1px solid var(--item-border-color);\n transition: background-color 150ms ease;\n\n &:where([data-active]) {\n background-color: var(--item-filled-color);\n }\n\n &:first-of-type {\n border-start-start-radius: var(--accordion-radius);\n border-start-end-radius: var(--accordion-radius);\n\n & > [data-accordion-control] {\n border-start-start-radius: var(--accordion-radius);\n border-start-end-radius: var(--accordion-radius);\n }\n }\n\n &:last-of-type {\n border-end-start-radius: var(--accordion-radius);\n border-end-end-radius: var(--accordion-radius);\n\n & > [data-accordion-control] {\n border-end-start-radius: var(--accordion-radius);\n border-end-end-radius: var(--accordion-radius);\n }\n }\n\n & + & {\n border-top: 0;\n }\n}\n\n.item--filled {\n border-radius: var(--accordion-radius);\n\n &:where([data-active]) {\n background-color: var(--item-filled-color);\n }\n}\n\n.item--separated {\n background-color: var(--item-filled-color);\n border-radius: var(--accordion-radius);\n border: 1px solid transparent;\n transition: background-color 150ms ease;\n\n &[data-active] {\n border-color: var(--item-border-color);\n\n @mixin where-light {\n background-color: var(--mantine-color-white);\n }\n\n @mixin where-dark {\n background-color: var(--mantine-color-dark-7);\n }\n }\n\n & + & {\n margin-top: var(--mantine-spacing-md);\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"Accordion.module.cjs","names":[],"sources":["../../../src/components/Accordion/Accordion.module.css"],"sourcesContent":[".root {\n --accordion-radius: var(--mantine-radius-default);\n}\n\n.panel {\n overflow-wrap: break-word;\n}\n\n.content {\n padding: var(--mantine-spacing-md);\n padding-top: calc(var(--mantine-spacing-xs) / 2);\n}\n\n.itemTitle {\n margin: 0;\n padding: 0;\n width: 100%;\n}\n\n.control {\n width: 100%;\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n padding-inline: var(--mantine-spacing-md);\n opacity: 1;\n cursor: pointer;\n background-color: transparent;\n color: var(--mantine-color-bright);\n\n &:where([data-chevron-position='left']) {\n flex-direction: row;\n padding-inline-start: 0;\n }\n\n &:where(:disabled, [data-disabled]) {\n opacity: 0.4;\n cursor: not-allowed;\n }\n}\n\n.control--default,\n.control--contained {\n &:where(:not(:disabled, [data-disabled])) {\n @mixin hover {\n @mixin where-light {\n background-color: var(--mantine-color-gray-0);\n }\n\n @mixin where-dark {\n background-color: var(--mantine-color-dark-6);\n }\n }\n }\n}\n\n.label {\n color: inherit;\n font-weight: var(--mantine-font-weight-regular);\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n padding-top: var(--mantine-spacing-sm);\n padding-bottom: var(--mantine-spacing-sm);\n}\n\n.chevron {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n transition: transform var(--accordion-transition-duration, 200ms) ease;\n width: var(--accordion-chevron-size, rem(15px));\n min-width: var(--accordion-chevron-size, rem(15px));\n transform: rotate(0deg);\n\n &:where([data-rotate]) {\n transform: rotate(180deg);\n }\n\n &:where([data-position='left']) {\n margin-inline-end: var(--mantine-spacing-md);\n margin-inline-start: var(--mantine-spacing-md);\n }\n}\n\n.icon {\n display: flex;\n align-items: center;\n justify-content: center;\n margin-inline-end: var(--mantine-spacing-sm);\n\n &:where([data-chevron-position='left']) {\n margin-inline-end: 0;\n margin-inline-start: var(--mantine-spacing-lg);\n }\n}\n\n.item {\n @mixin where-light {\n --item-border-color: var(--mantine-color-gray-3);\n --item-filled-color: var(--mantine-color-gray-0);\n }\n\n @mixin where-dark {\n --item-border-color: var(--mantine-color-dark-4);\n --item-filled-color: var(--mantine-color-dark-6);\n }\n}\n\n.item--default {\n border-bottom: 1px solid var(--item-border-color);\n}\n\n.item--contained {\n border: 1px solid var(--item-border-color);\n transition: background-color 150ms ease;\n\n &:where([data-active]) {\n background-color: var(--item-filled-color);\n }\n\n &:first-of-type {\n border-start-start-radius: var(--accordion-radius);\n border-start-end-radius: var(--accordion-radius);\n\n & > [data-accordion-control],\n & > .itemTitle > [data-accordion-control] {\n border-start-start-radius: var(--accordion-radius);\n border-start-end-radius: var(--accordion-radius);\n }\n }\n\n &:last-of-type {\n border-end-start-radius: var(--accordion-radius);\n border-end-end-radius: var(--accordion-radius);\n\n & > [data-accordion-control],\n & > .itemTitle > [data-accordion-control] {\n border-end-start-radius: var(--accordion-radius);\n border-end-end-radius: var(--accordion-radius);\n }\n }\n\n & + & {\n border-top: 0;\n }\n}\n\n.item--filled {\n border-radius: var(--accordion-radius);\n\n &:where([data-active]) {\n background-color: var(--item-filled-color);\n }\n}\n\n.item--separated {\n background-color: var(--item-filled-color);\n border-radius: var(--accordion-radius);\n border: 1px solid transparent;\n transition: background-color 150ms ease;\n\n &[data-active] {\n border-color: var(--item-border-color);\n\n @mixin where-light {\n background-color: var(--mantine-color-white);\n }\n\n @mixin where-dark {\n background-color: var(--mantine-color-dark-7);\n }\n }\n\n & + & {\n margin-top: var(--mantine-spacing-md);\n }\n}\n"],"mappings":""}

package/cjs/components/Combobox/use-combobox/use-combobox.cjs CHANGED Viewed

@@ -48,9 +48,7 @@ function useCombobox({ defaultOpened, opened, onOpenedChange, onDropdownClose, o
 	]);
 	const clearSelectedItem = (0, react.useCallback)(() => {
 		const root = require_find_element_in_shadow_dom.getRootElement(targetRef.current);
-		const selected = require_find_element_in_shadow_dom.findElementBySelector(`#${listId.current} [data-combobox-selected]`, root);
-		selected?.removeAttribute("data-combobox-selected");
-		selected?.removeAttribute("aria-selected");
+		require_find_element_in_shadow_dom.findElementBySelector(`#${listId.current} [data-combobox-selected]`, root)?.removeAttribute("data-combobox-selected");
 	}, []);
 	const selectOption = (0, react.useCallback)((index) => {
 		const root = require_find_element_in_shadow_dom.getRootElement(targetRef.current);
@@ -62,7 +60,6 @@ function useCombobox({ defaultOpened, opened, onOpenedChange, onDropdownClose, o
 		if (items?.[nextIndex] && !items[nextIndex].hasAttribute("data-combobox-disabled")) {
 			clearSelectedItem();
 			items[nextIndex].setAttribute("data-combobox-selected", "true");
-			items[nextIndex].setAttribute("aria-selected", "true");
 			items[nextIndex].scrollIntoView({
 				block: "nearest",
 				behavior: scrollBehavior

package/cjs/components/Combobox/use-combobox/use-combobox.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-combobox.cjs","names":["useUncontrolled","useRef","useCallback","getRootElement","findElementBySelector","findElementsBySelector","getNextIndex","getPreviousIndex","getFirstIndex"],"sources":["../../../../src/components/Combobox/use-combobox/use-combobox.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport { findElementBySelector, findElementsBySelector, getRootElement } from '../../../core/utils';\nimport { getFirstIndex, getNextIndex, getPreviousIndex } from './get-index/get-index';\n\nexport type ComboboxDropdownEventSource = 'keyboard' \| 'mouse' \| 'unknown';\n\nexport interface ComboboxStore {\n /** Current dropdown opened state /\n dropdownOpened: boolean;\n\n /* Opens dropdown /\n openDropdown: (eventSource?: ComboboxDropdownEventSource) => void;\n\n /* Closes dropdown /\n closeDropdown: (eventSource?: ComboboxDropdownEventSource) => void;\n\n /* Toggles dropdown opened state /\n toggleDropdown: (eventSource?: ComboboxDropdownEventSource) => void;\n\n /* Selected option index ref /\n selectedOptionIndex: number;\n\n /* Returns currently selected option index or `-1` if none of the options is selected /\n getSelectedOptionIndex: () => number;\n\n /* Selects `Combobox.Option` by index /\n selectOption: (index: number) => void;\n\n /* Selects first `Combobox.Option` with `active` prop.\n * If there are no such options, the function does nothing.\n /\n selectActiveOption: () => string \| null;\n\n /* Selects first `Combobox.Option` that is not disabled.\n * If there are no such options, the function does nothing.\n * /\n selectFirstOption: () => string \| null;\n\n /* Selects next `Combobox.Option` that is not disabled.\n * If the current option is the last one, the function selects first option, if `loop` is true.\n /\n selectNextOption: () => string \| null;\n\n /* Selects previous `Combobox.Option` that is not disabled.\n * If the current option is the first one, the function selects last option, if `loop` is true.\n * /\n selectPreviousOption: () => string \| null;\n\n /* Resets selected option index to -1, removes `data-combobox-selected` from selected option /\n resetSelectedOption: () => void;\n\n /* Triggers `onClick` event of selected option.\n * If there is no selected option, the function does nothing.\n /\n clickSelectedOption: () => void;\n\n /* Updates selected option index to currently selected or active option.\n * The function is required to be used with searchable components to update selected option index\n * when options list changes based on search query.\n /\n updateSelectedOptionIndex: (\n target?: 'active' \| 'selected' \| number,\n options?: { scrollIntoView?: boolean }\n ) => void;\n\n /* List id, used for `aria-` attributes /\n listId: string \| null;\n\n /** Sets list id /\n setListId: (id: string) => void;\n\n /* Ref of `Combobox.Search` input /\n searchRef: React.RefObject<HTMLInputElement \| null>;\n\n /* Moves focus to `Combobox.Search` input /\n focusSearchInput: () => void;\n\n /* Ref of the target element /\n targetRef: React.RefObject<HTMLElement \| null>;\n\n /* Moves focus to the target element /\n focusTarget: () => void;\n}\n\nexport interface UseComboboxOptions {\n /* Default value for `dropdownOpened`, `false` by default. Used when the component is uncontrolled /\n defaultOpened?: boolean;\n\n /* Controlled `dropdownOpened` state. When set, the dropdown opened state is controlled by the parent component /\n opened?: boolean;\n\n /* Called when `dropdownOpened` state changes. Required for controlled mode /\n onOpenedChange?: (opened: boolean) => void;\n\n /* Called when dropdown closes with event source: keyboard, mouse or unknown. Useful for analytics or side effects on dropdown closure /\n onDropdownClose?: (eventSource: ComboboxDropdownEventSource) => void;\n\n /* Called when dropdown opens with event source: keyboard, mouse or unknown. Useful for analytics or side effects on dropdown opening /\n onDropdownOpen?: (eventSource: ComboboxDropdownEventSource) => void;\n\n /* Determines whether arrow key presses should loop through items (first to last and last to first). Defaults to `true` /\n loop?: boolean;\n\n /* `behavior` passed down to `element.scrollIntoView`. Controls the scrolling animation when options are scrolled into view. Defaults to `'instant'` */\n scrollBehavior?: ScrollBehavior;\n}\n\nexport function useCombobox({\n defaultOpened,\n opened,\n onOpenedChange,\n onDropdownClose,\n onDropdownOpen,\n loop = true,\n scrollBehavior = 'instant',\n}: UseComboboxOptions = {}): ComboboxStore {\n const [dropdownOpened, setDropdownOpened] = useUncontrolled({\n value: opened,\n defaultValue: defaultOpened,\n finalValue: false,\n onChange: onOpenedChange,\n });\n\n const listId = useRef<string \| null>(null);\n const selectedOptionIndex = useRef<number>(-1);\n const searchRef = useRef<HTMLInputElement \| null>(null);\n const targetRef = useRef<HTMLElement \| null>(null);\n const focusSearchTimeout = useRef<number>(-1);\n const focusTargetTimeout = useRef<number>(-1);\n const selectedIndexUpdateTimeout = useRef<number>(-1);\n\n const openDropdown: ComboboxStore['openDropdown'] = useCallback(\n (eventSource = 'unknown') => {\n if (!dropdownOpened) {\n setDropdownOpened(true);\n onDropdownOpen?.(eventSource);\n }\n },\n [setDropdownOpened, onDropdownOpen, dropdownOpened]\n );\n\n const closeDropdown: ComboboxStore['closeDropdown'] = useCallback(\n (eventSource = 'unknown') => {\n if (dropdownOpened) {\n setDropdownOpened(false);\n onDropdownClose?.(eventSource);\n }\n },\n [setDropdownOpened, onDropdownClose, dropdownOpened]\n );\n\n const toggleDropdown: ComboboxStore['toggleDropdown'] = useCallback(\n (eventSource = 'unknown') => {\n if (dropdownOpened) {\n closeDropdown(eventSource);\n } else {\n openDropdown(eventSource);\n }\n },\n [closeDropdown, openDropdown, dropdownOpened]\n );\n\n const clearSelectedItem = useCallback(() => {\n const root = getRootElement(targetRef.current);\n const selected = findElementBySelector(`#${listId.current} [data-combobox-selected]`, root);\n selected?.removeAttribute('data-combobox-selected');\n selected?.removeAttribute('aria-selected');\n }, []);\n\n const selectOption = useCallback(\n (index: number) => {\n const root = getRootElement(targetRef.current);\n const list = findElementBySelector(`#${listId.current!}`, root);\n const items = list\n ? findElementsBySelector<HTMLDivElement>('[data-combobox-option]', list)\n : null;\n\n if (!items) {\n return null;\n }\n\n const nextIndex = index >= items!.length ? 0 : index < 0 ? items!.length - 1 : index;\n selectedOptionIndex.current = nextIndex;\n\n if (items?.[nextIndex] && !items[nextIndex].hasAttribute('data-combobox-disabled')) {\n clearSelectedItem();\n items[nextIndex].setAttribute('data-combobox-selected', 'true');\n items[nextIndex].setAttribute('aria-selected', 'true');\n items[nextIndex].scrollIntoView({ block: 'nearest', behavior: scrollBehavior });\n return items[nextIndex].id;\n }\n\n return null;\n },\n [scrollBehavior, clearSelectedItem]\n );\n\n const selectActiveOption = useCallback(() => {\n const root = getRootElement(targetRef.current);\n const activeOption = findElementBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-active]`,\n root\n );\n\n if (activeOption) {\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n const index = items.findIndex((option) => option === activeOption);\n return selectOption(index);\n }\n\n return selectOption(0);\n }, [selectOption]);\n\n const selectNextOption = useCallback(() => {\n const root = getRootElement(targetRef.current);\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n return selectOption(getNextIndex(selectedOptionIndex.current, items, loop));\n }, [selectOption, loop]);\n\n const selectPreviousOption = useCallback(() => {\n const root = getRootElement(targetRef.current);\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n return selectOption(getPreviousIndex(selectedOptionIndex.current, items, loop));\n }, [selectOption, loop]);\n\n const selectFirstOption = useCallback(() => {\n const root = getRootElement(targetRef.current);\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n return selectOption(getFirstIndex(items));\n }, [selectOption]);\n\n const updateSelectedOptionIndex: ComboboxStore['updateSelectedOptionIndex'] = useCallback(\n (target = 'selected', options) => {\n if (typeof target === 'number') {\n selectedOptionIndex.current = target;\n const root = getRootElement(targetRef.current);\n\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n\n if (options?.scrollIntoView) {\n items[target]?.scrollIntoView({ block: 'nearest', behavior: scrollBehavior });\n }\n return;\n }\n\n selectedIndexUpdateTimeout.current = window.setTimeout(() => {\n const root = getRootElement(targetRef.current);\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n const index = items.findIndex((option) => option.hasAttribute(`data-combobox-${target}`));\n\n selectedOptionIndex.current = index;\n\n if (options?.scrollIntoView) {\n items[index]?.scrollIntoView({ block: 'nearest', behavior: scrollBehavior });\n }\n }, 0);\n },\n []\n );\n\n const resetSelectedOption = useCallback(() => {\n selectedOptionIndex.current = -1;\n clearSelectedItem();\n }, [clearSelectedItem]);\n\n const clickSelectedOption = useCallback(() => {\n const root = getRootElement(targetRef.current);\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n const item = items?.[selectedOptionIndex.current];\n item?.click();\n }, []);\n\n const setListId = useCallback((id: string) => {\n listId.current = id;\n }, []);\n\n const focusSearchInput = useCallback(() => {\n focusSearchTimeout.current = window.setTimeout(() => searchRef.current?.focus(), 0);\n }, []);\n\n const focusTarget = useCallback(() => {\n focusTargetTimeout.current = window.setTimeout(() => targetRef.current?.focus(), 0);\n }, []);\n\n const getSelectedOptionIndex = useCallback(() => selectedOptionIndex.current, []);\n\n useEffect(\n () => () => {\n window.clearTimeout(focusSearchTimeout.current);\n window.clearTimeout(focusTargetTimeout.current);\n window.clearTimeout(selectedIndexUpdateTimeout.current);\n },\n []\n );\n\n return {\n dropdownOpened,\n openDropdown,\n closeDropdown,\n toggleDropdown,\n\n selectedOptionIndex: selectedOptionIndex.current,\n getSelectedOptionIndex,\n selectOption,\n selectFirstOption,\n selectActiveOption,\n selectNextOption,\n selectPreviousOption,\n resetSelectedOption,\n updateSelectedOptionIndex,\n\n listId: listId.current,\n setListId,\n clickSelectedOption,\n\n searchRef,\n focusSearchInput,\n\n targetRef,\n focusTarget,\n };\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"use-combobox.cjs","names":["useUncontrolled","useRef","useCallback","getRootElement","findElementBySelector","findElementsBySelector","getNextIndex","getPreviousIndex","getFirstIndex"],"sources":["../../../../src/components/Combobox/use-combobox/use-combobox.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { useUncontrolled } from '@mantine/hooks';\nimport { findElementBySelector, findElementsBySelector, getRootElement } from '../../../core/utils';\nimport { getFirstIndex, getNextIndex, getPreviousIndex } from './get-index/get-index';\n\nexport type ComboboxDropdownEventSource = 'keyboard' \| 'mouse' \| 'unknown';\n\nexport interface ComboboxStore {\n /** Current dropdown opened state /\n dropdownOpened: boolean;\n\n /* Opens dropdown /\n openDropdown: (eventSource?: ComboboxDropdownEventSource) => void;\n\n /* Closes dropdown /\n closeDropdown: (eventSource?: ComboboxDropdownEventSource) => void;\n\n /* Toggles dropdown opened state /\n toggleDropdown: (eventSource?: ComboboxDropdownEventSource) => void;\n\n /* Selected option index ref /\n selectedOptionIndex: number;\n\n /* Returns currently selected option index or `-1` if none of the options is selected /\n getSelectedOptionIndex: () => number;\n\n /* Selects `Combobox.Option` by index /\n selectOption: (index: number) => void;\n\n /* Selects first `Combobox.Option` with `active` prop.\n * If there are no such options, the function does nothing.\n /\n selectActiveOption: () => string \| null;\n\n /* Selects first `Combobox.Option` that is not disabled.\n * If there are no such options, the function does nothing.\n * /\n selectFirstOption: () => string \| null;\n\n /* Selects next `Combobox.Option` that is not disabled.\n * If the current option is the last one, the function selects first option, if `loop` is true.\n /\n selectNextOption: () => string \| null;\n\n /* Selects previous `Combobox.Option` that is not disabled.\n * If the current option is the first one, the function selects last option, if `loop` is true.\n * /\n selectPreviousOption: () => string \| null;\n\n /* Resets selected option index to -1, removes `data-combobox-selected` from selected option /\n resetSelectedOption: () => void;\n\n /* Triggers `onClick` event of selected option.\n * If there is no selected option, the function does nothing.\n /\n clickSelectedOption: () => void;\n\n /* Updates selected option index to currently selected or active option.\n * The function is required to be used with searchable components to update selected option index\n * when options list changes based on search query.\n /\n updateSelectedOptionIndex: (\n target?: 'active' \| 'selected' \| number,\n options?: { scrollIntoView?: boolean }\n ) => void;\n\n /* List id, used for `aria-` attributes /\n listId: string \| null;\n\n /** Sets list id /\n setListId: (id: string) => void;\n\n /* Ref of `Combobox.Search` input /\n searchRef: React.RefObject<HTMLInputElement \| null>;\n\n /* Moves focus to `Combobox.Search` input /\n focusSearchInput: () => void;\n\n /* Ref of the target element /\n targetRef: React.RefObject<HTMLElement \| null>;\n\n /* Moves focus to the target element /\n focusTarget: () => void;\n}\n\nexport interface UseComboboxOptions {\n /* Default value for `dropdownOpened`, `false` by default. Used when the component is uncontrolled /\n defaultOpened?: boolean;\n\n /* Controlled `dropdownOpened` state. When set, the dropdown opened state is controlled by the parent component /\n opened?: boolean;\n\n /* Called when `dropdownOpened` state changes. Required for controlled mode /\n onOpenedChange?: (opened: boolean) => void;\n\n /* Called when dropdown closes with event source: keyboard, mouse or unknown. Useful for analytics or side effects on dropdown closure /\n onDropdownClose?: (eventSource: ComboboxDropdownEventSource) => void;\n\n /* Called when dropdown opens with event source: keyboard, mouse or unknown. Useful for analytics or side effects on dropdown opening /\n onDropdownOpen?: (eventSource: ComboboxDropdownEventSource) => void;\n\n /* Determines whether arrow key presses should loop through items (first to last and last to first). Defaults to `true` /\n loop?: boolean;\n\n /* `behavior` passed down to `element.scrollIntoView`. Controls the scrolling animation when options are scrolled into view. Defaults to `'instant'` */\n scrollBehavior?: ScrollBehavior;\n}\n\nexport function useCombobox({\n defaultOpened,\n opened,\n onOpenedChange,\n onDropdownClose,\n onDropdownOpen,\n loop = true,\n scrollBehavior = 'instant',\n}: UseComboboxOptions = {}): ComboboxStore {\n const [dropdownOpened, setDropdownOpened] = useUncontrolled({\n value: opened,\n defaultValue: defaultOpened,\n finalValue: false,\n onChange: onOpenedChange,\n });\n\n const listId = useRef<string \| null>(null);\n const selectedOptionIndex = useRef<number>(-1);\n const searchRef = useRef<HTMLInputElement \| null>(null);\n const targetRef = useRef<HTMLElement \| null>(null);\n const focusSearchTimeout = useRef<number>(-1);\n const focusTargetTimeout = useRef<number>(-1);\n const selectedIndexUpdateTimeout = useRef<number>(-1);\n\n const openDropdown: ComboboxStore['openDropdown'] = useCallback(\n (eventSource = 'unknown') => {\n if (!dropdownOpened) {\n setDropdownOpened(true);\n onDropdownOpen?.(eventSource);\n }\n },\n [setDropdownOpened, onDropdownOpen, dropdownOpened]\n );\n\n const closeDropdown: ComboboxStore['closeDropdown'] = useCallback(\n (eventSource = 'unknown') => {\n if (dropdownOpened) {\n setDropdownOpened(false);\n onDropdownClose?.(eventSource);\n }\n },\n [setDropdownOpened, onDropdownClose, dropdownOpened]\n );\n\n const toggleDropdown: ComboboxStore['toggleDropdown'] = useCallback(\n (eventSource = 'unknown') => {\n if (dropdownOpened) {\n closeDropdown(eventSource);\n } else {\n openDropdown(eventSource);\n }\n },\n [closeDropdown, openDropdown, dropdownOpened]\n );\n\n const clearSelectedItem = useCallback(() => {\n const root = getRootElement(targetRef.current);\n const selected = findElementBySelector(`#${listId.current} [data-combobox-selected]`, root);\n selected?.removeAttribute('data-combobox-selected');\n }, []);\n\n const selectOption = useCallback(\n (index: number) => {\n const root = getRootElement(targetRef.current);\n const list = findElementBySelector(`#${listId.current!}`, root);\n const items = list\n ? findElementsBySelector<HTMLDivElement>('[data-combobox-option]', list)\n : null;\n\n if (!items) {\n return null;\n }\n\n const nextIndex = index >= items!.length ? 0 : index < 0 ? items!.length - 1 : index;\n selectedOptionIndex.current = nextIndex;\n\n if (items?.[nextIndex] && !items[nextIndex].hasAttribute('data-combobox-disabled')) {\n clearSelectedItem();\n items[nextIndex].setAttribute('data-combobox-selected', 'true');\n items[nextIndex].scrollIntoView({ block: 'nearest', behavior: scrollBehavior });\n return items[nextIndex].id;\n }\n\n return null;\n },\n [scrollBehavior, clearSelectedItem]\n );\n\n const selectActiveOption = useCallback(() => {\n const root = getRootElement(targetRef.current);\n const activeOption = findElementBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-active]`,\n root\n );\n\n if (activeOption) {\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n const index = items.findIndex((option) => option === activeOption);\n return selectOption(index);\n }\n\n return selectOption(0);\n }, [selectOption]);\n\n const selectNextOption = useCallback(() => {\n const root = getRootElement(targetRef.current);\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n return selectOption(getNextIndex(selectedOptionIndex.current, items, loop));\n }, [selectOption, loop]);\n\n const selectPreviousOption = useCallback(() => {\n const root = getRootElement(targetRef.current);\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n return selectOption(getPreviousIndex(selectedOptionIndex.current, items, loop));\n }, [selectOption, loop]);\n\n const selectFirstOption = useCallback(() => {\n const root = getRootElement(targetRef.current);\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n return selectOption(getFirstIndex(items));\n }, [selectOption]);\n\n const updateSelectedOptionIndex: ComboboxStore['updateSelectedOptionIndex'] = useCallback(\n (target = 'selected', options) => {\n if (typeof target === 'number') {\n selectedOptionIndex.current = target;\n const root = getRootElement(targetRef.current);\n\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n\n if (options?.scrollIntoView) {\n items[target]?.scrollIntoView({ block: 'nearest', behavior: scrollBehavior });\n }\n return;\n }\n\n selectedIndexUpdateTimeout.current = window.setTimeout(() => {\n const root = getRootElement(targetRef.current);\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n const index = items.findIndex((option) => option.hasAttribute(`data-combobox-${target}`));\n\n selectedOptionIndex.current = index;\n\n if (options?.scrollIntoView) {\n items[index]?.scrollIntoView({ block: 'nearest', behavior: scrollBehavior });\n }\n }, 0);\n },\n []\n );\n\n const resetSelectedOption = useCallback(() => {\n selectedOptionIndex.current = -1;\n clearSelectedItem();\n }, [clearSelectedItem]);\n\n const clickSelectedOption = useCallback(() => {\n const root = getRootElement(targetRef.current);\n const items = findElementsBySelector<HTMLDivElement>(\n `#${listId.current} [data-combobox-option]`,\n root\n );\n const item = items?.[selectedOptionIndex.current];\n item?.click();\n }, []);\n\n const setListId = useCallback((id: string) => {\n listId.current = id;\n }, []);\n\n const focusSearchInput = useCallback(() => {\n focusSearchTimeout.current = window.setTimeout(() => searchRef.current?.focus(), 0);\n }, []);\n\n const focusTarget = useCallback(() => {\n focusTargetTimeout.current = window.setTimeout(() => targetRef.current?.focus(), 0);\n }, []);\n\n const getSelectedOptionIndex = useCallback(() => selectedOptionIndex.current, []);\n\n useEffect(\n () => () => {\n window.clearTimeout(focusSearchTimeout.current);\n window.clearTimeout(focusTargetTimeout.current);\n window.clearTimeout(selectedIndexUpdateTimeout.current);\n },\n []\n );\n\n return {\n dropdownOpened,\n openDropdown,\n closeDropdown,\n toggleDropdown,\n\n selectedOptionIndex: selectedOptionIndex.current,\n getSelectedOptionIndex,\n selectOption,\n selectFirstOption,\n selectActiveOption,\n selectNextOption,\n selectPreviousOption,\n resetSelectedOption,\n updateSelectedOptionIndex,\n\n listId: listId.current,\n setListId,\n clickSelectedOption,\n\n searchRef,\n focusSearchInput,\n\n targetRef,\n focusTarget,\n };\n}\n"],"mappings":"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"}

package/cjs/components/ComboboxPopover/ComboboxPopover.cjs CHANGED Viewed

@@ -127,7 +127,6 @@ const ComboboxPopover = require_factory.genericFactory((_props) => {
 		onDropdownClose: () => {
 			onDropdownClose?.();
 			combobox.resetSelectedOption();
-			if (searchable) combobox.focusTarget();
 		}
 	});
 	const handleSearchChange = (val) => {
@@ -162,6 +161,7 @@ const ComboboxPopover = require_factory.genericFactory((_props) => {
 		unstyled,
 		attributes,
 		onOptionSubmit: handleOptionSubmit,
+		returnFocus: true,
 		...comboboxProps,
 		...others,
 		children: [children, searchable ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SearchableDropdown, {

package/cjs/components/ComboboxPopover/ComboboxPopover.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboboxPopover.cjs","names":["isOptionsGroup","Combobox","CheckIcon","comboboxClasses","cx","defaultOptionsFilter","isEmptyComboboxData","ScrollArea","genericFactory","useProps","useMemo","getParsedComboboxData","getOptionsLockup","useUncontrolled","useCombobox","useResolvedStylesApi","OptionsDropdown","ComboboxPopoverTarget"],"sources":["../../../src/components/ComboboxPopover/ComboboxPopover.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport cx from 'clsx';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n Factory,\n genericFactory,\n Primitive,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n} from '../../core';\nimport { CheckIcon } from '../Checkbox';\nimport {\n Combobox,\n ComboboxData,\n ComboboxItem,\n ComboboxLikeRenderOptionInput,\n ComboboxLikeStylesNames,\n ComboboxProps,\n defaultOptionsFilter,\n getOptionsLockup,\n getParsedComboboxData,\n isOptionsGroup,\n OptionsDropdown,\n OptionsFilter,\n useCombobox,\n} from '../Combobox';\nimport { ComboboxParsedItem } from '../Combobox/Combobox.types';\nimport { isEmptyComboboxData } from '../Combobox/OptionsDropdown/is-empty-combobox-data';\nimport { ScrollArea, ScrollAreaProps } from '../ScrollArea';\nimport { ComboboxPopoverValue } from './ComboboxPopover.types';\nimport { ComboboxPopoverTarget } from './ComboboxPopoverTarget';\nimport comboboxClasses from '../Combobox/Combobox.module.css';\n\nfunction isValueChecked(value: Primitive \| Primitive[] \| undefined \| null, optionValue: Primitive) {\n return Array.isArray(value) ? value.includes(optionValue) : value === optionValue;\n}\n\ninterface OptionProps {\n data: ComboboxParsedItem<Primitive>;\n withCheckIcon?: boolean;\n withAlignedLabels?: boolean;\n value?: Primitive \| Primitive[] \| null;\n checkIconPosition?: 'left' \| 'right';\n unstyled: boolean \| undefined;\n renderOption?: (input: ComboboxLikeRenderOptionInput<any>) => React.ReactNode;\n}\n\nfunction Option({\n data,\n withCheckIcon,\n withAlignedLabels,\n value,\n checkIconPosition,\n unstyled,\n renderOption,\n}: OptionProps) {\n if (isOptionsGroup(data)) {\n const options = data.items.map((item) => (\n <Option\n data={item}\n value={value}\n key={`${item.value}`}\n unstyled={unstyled}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n checkIconPosition={checkIconPosition}\n renderOption={renderOption}\n />\n ));\n return <Combobox.Group label={data.group}>{options}</Combobox.Group>;\n }\n\n const checked = isValueChecked(value, data.value);\n const check =\n withCheckIcon &&\n (checked ? (\n <CheckIcon className={comboboxClasses.optionsDropdownCheckIcon} />\n ) : withAlignedLabels ? (\n <div className={comboboxClasses.optionsDropdownCheckPlaceholder} />\n ) : null);\n\n const defaultContent = (\n <>\n {checkIconPosition === 'left' && check}\n <span>{data.label}</span>\n {checkIconPosition === 'right' && check}\n </>\n );\n\n return (\n <Combobox.Option\n value={data.value}\n disabled={data.disabled}\n className={cx({ [comboboxClasses.optionsDropdownOption]: !unstyled })}\n data-reverse={checkIconPosition === 'right' \|\| undefined}\n data-checked={checked \|\| undefined}\n aria-selected={checked}\n active={checked}\n >\n {typeof renderOption === 'function'\n ? renderOption({ option: data, checked })\n : defaultContent}\n </Combobox.Option>\n );\n}\n\ninterface SearchableDropdownProps {\n data: ComboboxParsedItem<Primitive>[];\n filter: OptionsFilter<Primitive> \| undefined;\n search: string;\n limit: number \| undefined;\n nothingFoundMessage: React.ReactNode \| undefined;\n withScrollArea: boolean \| undefined;\n maxDropdownHeight: number \| string \| undefined;\n value: Primitive \| Primitive[] \| null;\n checkIconPosition: 'left' \| 'right' \| undefined;\n withCheckIcon: boolean \| undefined;\n withAlignedLabels: boolean \| undefined;\n unstyled: boolean \| undefined;\n renderOption?: (input: ComboboxLikeRenderOptionInput<any>) => React.ReactNode;\n scrollAreaProps: ScrollAreaProps \| undefined;\n onSearchChange: (event: React.ChangeEvent<HTMLInputElement>) => void;\n}\n\nfunction SearchableDropdown({\n data,\n filter,\n search,\n limit,\n nothingFoundMessage,\n withScrollArea = true,\n maxDropdownHeight,\n value,\n checkIconPosition,\n withCheckIcon = false,\n withAlignedLabels = false,\n unstyled,\n renderOption,\n scrollAreaProps,\n onSearchChange,\n}: SearchableDropdownProps) {\n const filteredData = (filter \|\| defaultOptionsFilter)({\n options: data,\n search,\n limit: limit ?? Infinity,\n });\n const isEmpty = isEmptyComboboxData(filteredData);\n\n const options = filteredData.map((item, index) => (\n <Option\n data={item}\n key={\n isOptionsGroup(item)\n ? `group-${typeof item.group === 'string' ? item.group : index}`\n : `${item.value}`\n }\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n value={value}\n checkIconPosition={checkIconPosition}\n unstyled={unstyled}\n renderOption={renderOption}\n />\n ));\n\n return (\n <Combobox.Dropdown data-composed>\n <Combobox.Search value={search} onChange={onSearchChange} placeholder=\"Search...\" />\n <Combobox.Options>\n {withScrollArea ? (\n <ScrollArea.Autosize\n mah={maxDropdownHeight ?? 220}\n type=\"scroll\"\n scrollbarSize=\"var(--combobox-padding)\"\n offsetScrollbars=\"y\"\n {...scrollAreaProps}\n >\n {options}\n </ScrollArea.Autosize>\n ) : (\n options\n )}\n {isEmpty && nothingFoundMessage && <Combobox.Empty>{nothingFoundMessage}</Combobox.Empty>}\n </Combobox.Options>\n </Combobox.Dropdown>\n );\n}\n\nexport type ComboboxPopoverStylesNames = ComboboxLikeStylesNames \| 'search';\n\nexport interface ComboboxPopoverProps<\n Multiple extends boolean = false,\n Value extends Primitive = string,\n> extends StylesApiProps<ComboboxPopoverFactory> {\n /** If set, multiple items can be selected at the same time /\n multiple?: Multiple;\n\n /* Controlled component value /\n value?: ComboboxPopoverValue<Multiple, Value>;\n\n /* Uncontrolled component default value /\n defaultValue?: ComboboxPopoverValue<Multiple, Value>;\n\n /* Called when value changes /\n onChange?: (value: ComboboxPopoverValue<Multiple, Value>) => void;\n\n /* Data used to generate options /\n data?: ComboboxData<Value>;\n\n /* Controlled dropdown opened state /\n dropdownOpened?: boolean;\n\n /* Uncontrolled dropdown initial opened state /\n defaultDropdownOpened?: boolean;\n\n /* Called when dropdown opens /\n onDropdownOpen?: () => void;\n\n /* Called when dropdown closes /\n onDropdownClose?: () => void;\n\n /* Called when option is submitted from dropdown with mouse click or Enter key /\n onOptionSubmit?: (value: Value) => void;\n\n /* Props passed down to Combobox component /\n comboboxProps?: ComboboxProps;\n\n /* Function based on which items are filtered and sorted /\n filter?: OptionsFilter<Value>;\n\n /* Maximum number of options displayed at a time @default Infinity /\n limit?: number;\n\n /* Determines whether the options should be wrapped with ScrollArea.AutoSize @default true /\n withScrollArea?: boolean;\n\n /* max-height of the dropdown @default 250 /\n maxDropdownHeight?: number \| string;\n\n /* If set, the first option is selected when dropdown opens @default false /\n selectFirstOptionOnDropdownOpen?: boolean;\n\n /* Displays check icon near the selected option label @default true /\n withCheckIcon?: boolean;\n\n /* Aligns unchecked labels with the checked one @default false /\n withAlignedLabels?: boolean;\n\n /* Position of the check icon relative to the option label @default 'left' /\n checkIconPosition?: 'left' \| 'right';\n\n /* Message displayed when no options match the search query or when there is no data /\n nothingFoundMessage?: React.ReactNode;\n\n /* Allows searching through options @default false /\n searchable?: boolean;\n\n /* Controlled search value /\n searchValue?: string;\n\n /* Default search value /\n defaultSearchValue?: string;\n\n /* Called when search changes /\n onSearchChange?: (value: string) => void;\n\n /* Allows deselecting the selected option by clicking it (only for single mode) @default true /\n allowDeselect?: boolean;\n\n /* A function to render content of the option, replaces the default content of the option /\n renderOption?: (item: ComboboxLikeRenderOptionInput<ComboboxItem>) => React.ReactNode;\n\n /* Props passed down to the underlying ScrollArea component in the dropdown /\n scrollAreaProps?: ScrollAreaProps;\n\n /* Props passed down to the hidden input /\n hiddenInputProps?: Omit<React.ComponentProps<'input'>, 'value'>;\n\n /* Hidden input name for form submission /\n name?: string;\n\n /* Hidden input form for form submission /\n form?: string;\n\n /* Content of the component /\n children?: React.ReactNode;\n\n /* Divider used to separate values in the hidden input value attribute @default ',' */\n hiddenInputValuesDivider?: string;\n}\n\nexport type ComboboxPopoverFactory = Factory<{\n props: ComboboxPopoverProps;\n ref: HTMLDivElement;\n stylesNames: ComboboxPopoverStylesNames;\n signature: <Multiple extends boolean = false, Value extends Primitive = string>(\n props: ComboboxPopoverProps<Multiple, Value>\n ) => React.JSX.Element;\n staticComponents: {\n Target: typeof ComboboxPopoverTarget;\n };\n}>;\n\nconst defaultProps = {\n withCheckIcon: true,\n allowDeselect: true,\n checkIconPosition: 'left',\n hiddenInputValuesDivider: ',',\n} satisfies Partial<ComboboxPopoverProps>;\n\nexport const ComboboxPopover = genericFactory<ComboboxPopoverFactory>((_props) => {\n const props = useProps('ComboboxPopover', defaultProps as any, _props);\n const {\n classNames,\n styles,\n unstyled,\n vars,\n children,\n multiple,\n value,\n defaultValue,\n onChange,\n data,\n dropdownOpened,\n defaultDropdownOpened,\n onDropdownOpen,\n onDropdownClose,\n onOptionSubmit,\n comboboxProps,\n filter,\n limit,\n withScrollArea,\n maxDropdownHeight,\n selectFirstOptionOnDropdownOpen,\n withCheckIcon,\n withAlignedLabels,\n checkIconPosition,\n nothingFoundMessage,\n searchable,\n searchValue,\n defaultSearchValue,\n onSearchChange,\n allowDeselect,\n renderOption,\n scrollAreaProps,\n hiddenInputProps,\n name,\n form,\n hiddenInputValuesDivider,\n attributes,\n ...others\n } = props;\n\n const parsedData = useMemo(() => getParsedComboboxData(data), [data]);\n const optionsLockup = useMemo(() => getOptionsLockup(parsedData), [parsedData]);\n\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: multiple ? ([] as any) : null,\n onChange,\n });\n\n const [_searchValue, setSearchValue] = useUncontrolled({\n value: searchValue,\n defaultValue: defaultSearchValue,\n finalValue: '',\n onChange: onSearchChange,\n });\n\n const combobox = useCombobox({\n opened: dropdownOpened,\n defaultOpened: defaultDropdownOpened,\n onDropdownOpen: () => {\n onDropdownOpen?.();\n if (searchable) {\n combobox.focusSearchInput();\n }\n if (selectFirstOptionOnDropdownOpen) {\n combobox.selectFirstOption();\n }\n },\n onDropdownClose: () => {\n onDropdownClose?.();\n combobox.resetSelectedOption();\n if (searchable) {\n combobox.focusTarget();\n }\n },\n });\n\n const handleSearchChange = (val: string) => {\n setSearchValue(val);\n combobox.resetSelectedOption();\n };\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<ComboboxPopoverFactory>({\n props,\n styles,\n classNames,\n });\n\n const handleOptionSubmit = (val: string) => {\n onOptionSubmit?.(val as any);\n const option = optionsLockup[val];\n\n if (multiple) {\n const currentValue = Array.isArray(_value) ? _value : [];\n if (currentValue.includes(option.value)) {\n setValue(currentValue.filter((v: any) => v !== option.value) as any);\n } else {\n setValue([...currentValue, option.value] as any);\n }\n combobox.updateSelectedOptionIndex('selected');\n } else {\n const nextValue = allowDeselect && `${option.value}` === `${_value}` ? null : option.value;\n setValue(nextValue as any);\n combobox.closeDropdown();\n }\n\n if (searchable) {\n handleSearchChange('');\n }\n };\n\n return (\n <>\n <Combobox\n store={combobox}\n __staticSelector=\"ComboboxPopover\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n attributes={attributes}\n onOptionSubmit={handleOptionSubmit}\n {...comboboxProps}\n {...others}\n >\n {children}\n {searchable ? (\n <SearchableDropdown\n data={parsedData as any}\n filter={filter as OptionsFilter<Primitive> \| undefined}\n search={_searchValue}\n limit={limit}\n nothingFoundMessage={nothingFoundMessage}\n withScrollArea={withScrollArea}\n maxDropdownHeight={maxDropdownHeight}\n value={_value}\n checkIconPosition={checkIconPosition}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n unstyled={unstyled}\n renderOption={renderOption}\n scrollAreaProps={scrollAreaProps}\n onSearchChange={(event) => {\n handleSearchChange(event.currentTarget.value);\n }}\n />\n ) : (\n <OptionsDropdown\n data={parsedData as any}\n filter={filter as OptionsFilter<Primitive> \| undefined}\n search={undefined}\n limit={limit}\n hiddenWhenEmpty={!nothingFoundMessage}\n withScrollArea={withScrollArea}\n maxDropdownHeight={maxDropdownHeight}\n filterOptions={false}\n value={_value}\n checkIconPosition={checkIconPosition}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n nothingFoundMessage={nothingFoundMessage}\n unstyled={unstyled}\n renderOption={renderOption}\n scrollAreaProps={scrollAreaProps}\n labelId={undefined}\n aria-label={undefined}\n />\n )}\n </Combobox>\n <Combobox.HiddenInput\n name={name}\n value={_value}\n form={form}\n valuesDivider={hiddenInputValuesDivider}\n {...hiddenInputProps}\n />\n </>\n );\n});\n\nComboboxPopover.classes = Combobox.classes;\nComboboxPopover.displayName = '@mantine/core/ComboboxPopover';\nComboboxPopover.Target = ComboboxPopoverTarget;\n"],"mappings":"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"}
1	+ {"version":3,"file":"ComboboxPopover.cjs","names":["isOptionsGroup","Combobox","CheckIcon","comboboxClasses","cx","defaultOptionsFilter","isEmptyComboboxData","ScrollArea","genericFactory","useProps","useMemo","getParsedComboboxData","getOptionsLockup","useUncontrolled","useCombobox","useResolvedStylesApi","OptionsDropdown","ComboboxPopoverTarget"],"sources":["../../../src/components/ComboboxPopover/ComboboxPopover.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport cx from 'clsx';\nimport { useUncontrolled } from '@mantine/hooks';\nimport {\n Factory,\n genericFactory,\n Primitive,\n StylesApiProps,\n useProps,\n useResolvedStylesApi,\n} from '../../core';\nimport { CheckIcon } from '../Checkbox';\nimport {\n Combobox,\n ComboboxData,\n ComboboxItem,\n ComboboxLikeRenderOptionInput,\n ComboboxLikeStylesNames,\n ComboboxProps,\n defaultOptionsFilter,\n getOptionsLockup,\n getParsedComboboxData,\n isOptionsGroup,\n OptionsDropdown,\n OptionsFilter,\n useCombobox,\n} from '../Combobox';\nimport { ComboboxParsedItem } from '../Combobox/Combobox.types';\nimport { isEmptyComboboxData } from '../Combobox/OptionsDropdown/is-empty-combobox-data';\nimport { ScrollArea, ScrollAreaProps } from '../ScrollArea';\nimport { ComboboxPopoverValue } from './ComboboxPopover.types';\nimport { ComboboxPopoverTarget } from './ComboboxPopoverTarget';\nimport comboboxClasses from '../Combobox/Combobox.module.css';\n\nfunction isValueChecked(value: Primitive \| Primitive[] \| undefined \| null, optionValue: Primitive) {\n return Array.isArray(value) ? value.includes(optionValue) : value === optionValue;\n}\n\ninterface OptionProps {\n data: ComboboxParsedItem<Primitive>;\n withCheckIcon?: boolean;\n withAlignedLabels?: boolean;\n value?: Primitive \| Primitive[] \| null;\n checkIconPosition?: 'left' \| 'right';\n unstyled: boolean \| undefined;\n renderOption?: (input: ComboboxLikeRenderOptionInput<any>) => React.ReactNode;\n}\n\nfunction Option({\n data,\n withCheckIcon,\n withAlignedLabels,\n value,\n checkIconPosition,\n unstyled,\n renderOption,\n}: OptionProps) {\n if (isOptionsGroup(data)) {\n const options = data.items.map((item) => (\n <Option\n data={item}\n value={value}\n key={`${item.value}`}\n unstyled={unstyled}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n checkIconPosition={checkIconPosition}\n renderOption={renderOption}\n />\n ));\n return <Combobox.Group label={data.group}>{options}</Combobox.Group>;\n }\n\n const checked = isValueChecked(value, data.value);\n const check =\n withCheckIcon &&\n (checked ? (\n <CheckIcon className={comboboxClasses.optionsDropdownCheckIcon} />\n ) : withAlignedLabels ? (\n <div className={comboboxClasses.optionsDropdownCheckPlaceholder} />\n ) : null);\n\n const defaultContent = (\n <>\n {checkIconPosition === 'left' && check}\n <span>{data.label}</span>\n {checkIconPosition === 'right' && check}\n </>\n );\n\n return (\n <Combobox.Option\n value={data.value}\n disabled={data.disabled}\n className={cx({ [comboboxClasses.optionsDropdownOption]: !unstyled })}\n data-reverse={checkIconPosition === 'right' \|\| undefined}\n data-checked={checked \|\| undefined}\n aria-selected={checked}\n active={checked}\n >\n {typeof renderOption === 'function'\n ? renderOption({ option: data, checked })\n : defaultContent}\n </Combobox.Option>\n );\n}\n\ninterface SearchableDropdownProps {\n data: ComboboxParsedItem<Primitive>[];\n filter: OptionsFilter<Primitive> \| undefined;\n search: string;\n limit: number \| undefined;\n nothingFoundMessage: React.ReactNode \| undefined;\n withScrollArea: boolean \| undefined;\n maxDropdownHeight: number \| string \| undefined;\n value: Primitive \| Primitive[] \| null;\n checkIconPosition: 'left' \| 'right' \| undefined;\n withCheckIcon: boolean \| undefined;\n withAlignedLabels: boolean \| undefined;\n unstyled: boolean \| undefined;\n renderOption?: (input: ComboboxLikeRenderOptionInput<any>) => React.ReactNode;\n scrollAreaProps: ScrollAreaProps \| undefined;\n onSearchChange: (event: React.ChangeEvent<HTMLInputElement>) => void;\n}\n\nfunction SearchableDropdown({\n data,\n filter,\n search,\n limit,\n nothingFoundMessage,\n withScrollArea = true,\n maxDropdownHeight,\n value,\n checkIconPosition,\n withCheckIcon = false,\n withAlignedLabels = false,\n unstyled,\n renderOption,\n scrollAreaProps,\n onSearchChange,\n}: SearchableDropdownProps) {\n const filteredData = (filter \|\| defaultOptionsFilter)({\n options: data,\n search,\n limit: limit ?? Infinity,\n });\n const isEmpty = isEmptyComboboxData(filteredData);\n\n const options = filteredData.map((item, index) => (\n <Option\n data={item}\n key={\n isOptionsGroup(item)\n ? `group-${typeof item.group === 'string' ? item.group : index}`\n : `${item.value}`\n }\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n value={value}\n checkIconPosition={checkIconPosition}\n unstyled={unstyled}\n renderOption={renderOption}\n />\n ));\n\n return (\n <Combobox.Dropdown data-composed>\n <Combobox.Search value={search} onChange={onSearchChange} placeholder=\"Search...\" />\n <Combobox.Options>\n {withScrollArea ? (\n <ScrollArea.Autosize\n mah={maxDropdownHeight ?? 220}\n type=\"scroll\"\n scrollbarSize=\"var(--combobox-padding)\"\n offsetScrollbars=\"y\"\n {...scrollAreaProps}\n >\n {options}\n </ScrollArea.Autosize>\n ) : (\n options\n )}\n {isEmpty && nothingFoundMessage && <Combobox.Empty>{nothingFoundMessage}</Combobox.Empty>}\n </Combobox.Options>\n </Combobox.Dropdown>\n );\n}\n\nexport type ComboboxPopoverStylesNames = ComboboxLikeStylesNames \| 'search';\n\nexport interface ComboboxPopoverProps<\n Multiple extends boolean = false,\n Value extends Primitive = string,\n> extends StylesApiProps<ComboboxPopoverFactory> {\n /** If set, multiple items can be selected at the same time /\n multiple?: Multiple;\n\n /* Controlled component value /\n value?: ComboboxPopoverValue<Multiple, Value>;\n\n /* Uncontrolled component default value /\n defaultValue?: ComboboxPopoverValue<Multiple, Value>;\n\n /* Called when value changes /\n onChange?: (value: ComboboxPopoverValue<Multiple, Value>) => void;\n\n /* Data used to generate options /\n data?: ComboboxData<Value>;\n\n /* Controlled dropdown opened state /\n dropdownOpened?: boolean;\n\n /* Uncontrolled dropdown initial opened state /\n defaultDropdownOpened?: boolean;\n\n /* Called when dropdown opens /\n onDropdownOpen?: () => void;\n\n /* Called when dropdown closes /\n onDropdownClose?: () => void;\n\n /* Called when option is submitted from dropdown with mouse click or Enter key /\n onOptionSubmit?: (value: Value) => void;\n\n /* Props passed down to Combobox component /\n comboboxProps?: ComboboxProps;\n\n /* Function based on which items are filtered and sorted /\n filter?: OptionsFilter<Value>;\n\n /* Maximum number of options displayed at a time @default Infinity /\n limit?: number;\n\n /* Determines whether the options should be wrapped with ScrollArea.AutoSize @default true /\n withScrollArea?: boolean;\n\n /* max-height of the dropdown @default 250 /\n maxDropdownHeight?: number \| string;\n\n /* If set, the first option is selected when dropdown opens @default false /\n selectFirstOptionOnDropdownOpen?: boolean;\n\n /* Displays check icon near the selected option label @default true /\n withCheckIcon?: boolean;\n\n /* Aligns unchecked labels with the checked one @default false /\n withAlignedLabels?: boolean;\n\n /* Position of the check icon relative to the option label @default 'left' /\n checkIconPosition?: 'left' \| 'right';\n\n /* Message displayed when no options match the search query or when there is no data /\n nothingFoundMessage?: React.ReactNode;\n\n /* Allows searching through options @default false /\n searchable?: boolean;\n\n /* Controlled search value /\n searchValue?: string;\n\n /* Default search value /\n defaultSearchValue?: string;\n\n /* Called when search changes /\n onSearchChange?: (value: string) => void;\n\n /* Allows deselecting the selected option by clicking it (only for single mode) @default true /\n allowDeselect?: boolean;\n\n /* A function to render content of the option, replaces the default content of the option /\n renderOption?: (item: ComboboxLikeRenderOptionInput<ComboboxItem>) => React.ReactNode;\n\n /* Props passed down to the underlying ScrollArea component in the dropdown /\n scrollAreaProps?: ScrollAreaProps;\n\n /* Props passed down to the hidden input /\n hiddenInputProps?: Omit<React.ComponentProps<'input'>, 'value'>;\n\n /* Hidden input name for form submission /\n name?: string;\n\n /* Hidden input form for form submission /\n form?: string;\n\n /* Content of the component /\n children?: React.ReactNode;\n\n /* Divider used to separate values in the hidden input value attribute @default ',' */\n hiddenInputValuesDivider?: string;\n}\n\nexport type ComboboxPopoverFactory = Factory<{\n props: ComboboxPopoverProps;\n ref: HTMLDivElement;\n stylesNames: ComboboxPopoverStylesNames;\n signature: <Multiple extends boolean = false, Value extends Primitive = string>(\n props: ComboboxPopoverProps<Multiple, Value>\n ) => React.JSX.Element;\n staticComponents: {\n Target: typeof ComboboxPopoverTarget;\n };\n}>;\n\nconst defaultProps = {\n withCheckIcon: true,\n allowDeselect: true,\n checkIconPosition: 'left',\n hiddenInputValuesDivider: ',',\n} satisfies Partial<ComboboxPopoverProps>;\n\nexport const ComboboxPopover = genericFactory<ComboboxPopoverFactory>((_props) => {\n const props = useProps('ComboboxPopover', defaultProps as any, _props);\n const {\n classNames,\n styles,\n unstyled,\n vars,\n children,\n multiple,\n value,\n defaultValue,\n onChange,\n data,\n dropdownOpened,\n defaultDropdownOpened,\n onDropdownOpen,\n onDropdownClose,\n onOptionSubmit,\n comboboxProps,\n filter,\n limit,\n withScrollArea,\n maxDropdownHeight,\n selectFirstOptionOnDropdownOpen,\n withCheckIcon,\n withAlignedLabels,\n checkIconPosition,\n nothingFoundMessage,\n searchable,\n searchValue,\n defaultSearchValue,\n onSearchChange,\n allowDeselect,\n renderOption,\n scrollAreaProps,\n hiddenInputProps,\n name,\n form,\n hiddenInputValuesDivider,\n attributes,\n ...others\n } = props;\n\n const parsedData = useMemo(() => getParsedComboboxData(data), [data]);\n const optionsLockup = useMemo(() => getOptionsLockup(parsedData), [parsedData]);\n\n const [_value, setValue] = useUncontrolled({\n value,\n defaultValue,\n finalValue: multiple ? ([] as any) : null,\n onChange,\n });\n\n const [_searchValue, setSearchValue] = useUncontrolled({\n value: searchValue,\n defaultValue: defaultSearchValue,\n finalValue: '',\n onChange: onSearchChange,\n });\n\n const combobox = useCombobox({\n opened: dropdownOpened,\n defaultOpened: defaultDropdownOpened,\n onDropdownOpen: () => {\n onDropdownOpen?.();\n if (searchable) {\n combobox.focusSearchInput();\n }\n if (selectFirstOptionOnDropdownOpen) {\n combobox.selectFirstOption();\n }\n },\n onDropdownClose: () => {\n onDropdownClose?.();\n combobox.resetSelectedOption();\n },\n });\n\n const handleSearchChange = (val: string) => {\n setSearchValue(val);\n combobox.resetSelectedOption();\n };\n\n const { resolvedClassNames, resolvedStyles } = useResolvedStylesApi<ComboboxPopoverFactory>({\n props,\n styles,\n classNames,\n });\n\n const handleOptionSubmit = (val: string) => {\n onOptionSubmit?.(val as any);\n const option = optionsLockup[val];\n\n if (multiple) {\n const currentValue = Array.isArray(_value) ? _value : [];\n if (currentValue.includes(option.value)) {\n setValue(currentValue.filter((v: any) => v !== option.value) as any);\n } else {\n setValue([...currentValue, option.value] as any);\n }\n combobox.updateSelectedOptionIndex('selected');\n } else {\n const nextValue = allowDeselect && `${option.value}` === `${_value}` ? null : option.value;\n setValue(nextValue as any);\n combobox.closeDropdown();\n }\n\n if (searchable) {\n handleSearchChange('');\n }\n };\n\n return (\n <>\n <Combobox\n store={combobox}\n __staticSelector=\"ComboboxPopover\"\n classNames={resolvedClassNames}\n styles={resolvedStyles}\n unstyled={unstyled}\n attributes={attributes}\n onOptionSubmit={handleOptionSubmit}\n returnFocus\n {...comboboxProps}\n {...others}\n >\n {children}\n {searchable ? (\n <SearchableDropdown\n data={parsedData as any}\n filter={filter as OptionsFilter<Primitive> \| undefined}\n search={_searchValue}\n limit={limit}\n nothingFoundMessage={nothingFoundMessage}\n withScrollArea={withScrollArea}\n maxDropdownHeight={maxDropdownHeight}\n value={_value}\n checkIconPosition={checkIconPosition}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n unstyled={unstyled}\n renderOption={renderOption}\n scrollAreaProps={scrollAreaProps}\n onSearchChange={(event) => {\n handleSearchChange(event.currentTarget.value);\n }}\n />\n ) : (\n <OptionsDropdown\n data={parsedData as any}\n filter={filter as OptionsFilter<Primitive> \| undefined}\n search={undefined}\n limit={limit}\n hiddenWhenEmpty={!nothingFoundMessage}\n withScrollArea={withScrollArea}\n maxDropdownHeight={maxDropdownHeight}\n filterOptions={false}\n value={_value}\n checkIconPosition={checkIconPosition}\n withCheckIcon={withCheckIcon}\n withAlignedLabels={withAlignedLabels}\n nothingFoundMessage={nothingFoundMessage}\n unstyled={unstyled}\n renderOption={renderOption}\n scrollAreaProps={scrollAreaProps}\n labelId={undefined}\n aria-label={undefined}\n />\n )}\n </Combobox>\n <Combobox.HiddenInput\n name={name}\n value={_value}\n form={form}\n valuesDivider={hiddenInputValuesDivider}\n {...hiddenInputProps}\n />\n </>\n );\n});\n\nComboboxPopover.classes = Combobox.classes;\nComboboxPopover.displayName = '@mantine/core/ComboboxPopover';\nComboboxPopover.Target = ComboboxPopoverTarget;\n"],"mappings":"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"}

package/cjs/components/Drawer/Drawer.cjs CHANGED Viewed

@@ -33,7 +33,8 @@ const Drawer = require_factory.factory((_props) => {
 	const stackProps = ctx && stackId ? {
 		closeOnEscape: ctx.currentId === stackId,
 		trapFocus: ctx.currentId === stackId,
-		zIndex: ctx.getZIndex(stackId)
+		zIndex: ctx.getZIndex(stackId),
+		__handledEscapeEvents: ctx.handledEscapeEvents
 	} : {};
 	const overlayVisible = withOverlay === false ? false : stackId && ctx ? ctx.currentId === stackId : opened;
 	(0, react.useEffect)(() => {

package/cjs/components/Drawer/Drawer.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Drawer.cjs","names":["getDefaultZIndex","factory","useProps","use","DrawerStackContext","DrawerRoot","DrawerOverlay","DrawerContent","DrawerHeader","DrawerTitle","DrawerCloseButton","DrawerBody","classes","DrawerStack"],"sources":["../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import { use, useEffect } from 'react';\nimport { factory, Factory, getDefaultZIndex, useProps } from '../../core';\nimport { ModalBaseCloseButtonProps, ModalBaseOverlayProps } from '../ModalBase';\nimport { DrawerBody } from './DrawerBody';\nimport { DrawerCloseButton } from './DrawerCloseButton';\nimport { DrawerContent } from './DrawerContent';\nimport { DrawerHeader } from './DrawerHeader';\nimport { DrawerOverlay } from './DrawerOverlay';\nimport {\n DrawerRoot,\n DrawerRootCssVariables,\n DrawerRootProps,\n DrawerRootStylesNames,\n} from './DrawerRoot';\nimport { DrawerStack, DrawerStackContext } from './DrawerStack';\nimport { DrawerTitle } from './DrawerTitle';\nimport classes from './Drawer.module.css';\n\nexport type DrawerStylesNames = DrawerRootStylesNames;\nexport type DrawerCssVariables = DrawerRootCssVariables;\n\nexport interface DrawerProps extends DrawerRootProps {\n /** Drawer title /\n title?: React.ReactNode;\n\n /* If set, the overlay is displayed @default true /\n withOverlay?: boolean;\n\n /* Props passed down to the `Overlay` component, can be used to configure opacity, `background-color`, styles and other properties /\n overlayProps?: ModalBaseOverlayProps;\n\n /* Drawer content /\n children?: React.ReactNode;\n\n /* If set, the close button is displayed @default true /\n withCloseButton?: boolean;\n\n /* Props passed down to the close button /\n closeButtonProps?: ModalBaseCloseButtonProps;\n\n /* Id of the drawer in the `Drawer.Stack` */\n stackId?: string;\n}\n\nexport type DrawerFactory = Factory<{\n props: DrawerProps;\n ref: HTMLDivElement;\n stylesNames: DrawerStylesNames;\n vars: DrawerCssVariables;\n staticComponents: {\n Root: typeof DrawerRoot;\n Overlay: typeof DrawerOverlay;\n Content: typeof DrawerContent;\n Body: typeof DrawerBody;\n Header: typeof DrawerHeader;\n Title: typeof DrawerTitle;\n CloseButton: typeof DrawerCloseButton;\n Stack: typeof DrawerStack;\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 withOverlay: true,\n withCloseButton: true,\n} satisfies Partial<DrawerProps>;\n\nexport const Drawer = factory<DrawerFactory>((_props) => {\n const {\n title,\n withOverlay,\n overlayProps,\n withCloseButton,\n closeButtonProps,\n children,\n opened,\n stackId,\n zIndex,\n ...others\n } = useProps('Drawer', defaultProps, _props);\n\n const ctx = use(DrawerStackContext);\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 <DrawerRoot\n opened={opened}\n zIndex={ctx && stackId ? ctx.getZIndex(stackId) : zIndex}\n {...others}\n {...stackProps}\n >\n {withOverlay && (\n <DrawerOverlay\n visible={overlayVisible}\n transitionProps={ctx && stackId ? { duration: 0 } : undefined}\n {...overlayProps}\n />\n )}\n <DrawerContent __hidden={ctx && stackId && opened ? stackId !== ctx.currentId : false}>\n {hasHeader && (\n <DrawerHeader>\n {title && <DrawerTitle>{title}</DrawerTitle>}\n {withCloseButton && <DrawerCloseButton {...closeButtonProps} />}\n </DrawerHeader>\n )}\n\n <DrawerBody>{children}</DrawerBody>\n </DrawerContent>\n </DrawerRoot>\n );\n});\n\nDrawer.classes = classes;\nDrawer.displayName = '@mantine/core/Drawer';\nDrawer.Root = DrawerRoot;\nDrawer.Overlay = DrawerOverlay;\nDrawer.Content = DrawerContent;\nDrawer.Body = DrawerBody;\nDrawer.Header = DrawerHeader;\nDrawer.Title = DrawerTitle;\nDrawer.CloseButton = DrawerCloseButton;\nDrawer.Stack = DrawerStack;\n"],"mappings":";;;;;;;;;;;;;;;;AA6DA,MAAM,eAAe;CACnB,qBAAqB;CACrB,cAAc;CACd,YAAY;CACZ,WAAW;CACX,aAAa;CACb,eAAe;CACf,aAAa;CACb,QAAQA,4BAAAA,iBAAiB,OAAO;CAChC,aAAa;CACb,iBAAiB;AACnB;AAEA,MAAa,SAASC,gBAAAA,SAAwB,WAAW;CACvD,MAAM,EACJ,OACA,aACA,cACA,iBACA,kBACA,UACA,QACA,SACA,QACA,GAAG,WACDC,kBAAAA,SAAS,UAAU,cAAc,MAAM;CAE3C,MAAM,OAAA,GAAMC,MAAAA,IAAAA,CAAIC,oBAAAA,kBAAkB;CAClC,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,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,IAAI,OAAO,SACT,SACI,IAAI,SAAS,SAAS,UAAUJ,4BAAAA,iBAAiB,OAAO,CAAC,IACzD,IAAI,YAAY,OAAO;CAE/B,GAAG;EAAC;EAAQ;EAAS;CAAM,CAAC;CAE5B,OACE,iBAAA,GAAA,kBAAA,KAAA,CAACK,mBAAAA,YAAD;EACU;EACR,QAAQ,OAAO,UAAU,IAAI,UAAU,OAAO,IAAI;EAClD,GAAI;EACJ,GAAI;EAJN,UAAA,CAMG,eACC,iBAAA,GAAA,kBAAA,IAAA,CAACC,sBAAAA,eAAD;GACE,SAAS;GACT,iBAAiB,OAAO,UAAU,EAAE,UAAU,EAAE,IAAI,KAAA;GACpD,GAAI;EACL,CAAA,GAEH,iBAAA,GAAA,kBAAA,KAAA,CAACC,sBAAAA,eAAD;GAAe,UAAU,OAAO,WAAW,SAAS,YAAY,IAAI,YAAY;GAAhF,UAAA,CACG,aACC,iBAAA,GAAA,kBAAA,KAAA,CAACC,qBAAAA,cAAD,EAAA,UAAA,CACG,SAAS,iBAAA,GAAA,kBAAA,IAAA,CAACC,oBAAAA,aAAD,EAAA,UAAc,MAAmB,CAAA,GAC1C,mBAAmB,iBAAA,GAAA,kBAAA,IAAA,CAACC,0BAAAA,mBAAD,EAAmB,GAAI,iBAAmB,CAAA,CAClD,EAAA,CAAA,GAGhB,iBAAA,GAAA,kBAAA,IAAA,CAACC,mBAAAA,YAAD,EAAa,SAAqB,CAAA,CACrB;EACL,CAAA,CAAA;;AAEhB,CAAC;AAED,OAAO,UAAUC,sBAAAA;AACjB,OAAO,cAAc;AACrB,OAAO,OAAOP,mBAAAA;AACd,OAAO,UAAUC,sBAAAA;AACjB,OAAO,UAAUC,sBAAAA;AACjB,OAAO,OAAOI,mBAAAA;AACd,OAAO,SAASH,qBAAAA;AAChB,OAAO,QAAQC,oBAAAA;AACf,OAAO,cAAcC,0BAAAA;AACrB,OAAO,QAAQG,oBAAAA"}
1	+ {"version":3,"file":"Drawer.cjs","names":["getDefaultZIndex","factory","useProps","use","DrawerStackContext","DrawerRoot","DrawerOverlay","DrawerContent","DrawerHeader","DrawerTitle","DrawerCloseButton","DrawerBody","classes","DrawerStack"],"sources":["../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import { use, useEffect } from 'react';\nimport { factory, Factory, getDefaultZIndex, useProps } from '../../core';\nimport { ModalBaseCloseButtonProps, ModalBaseOverlayProps } from '../ModalBase';\nimport { DrawerBody } from './DrawerBody';\nimport { DrawerCloseButton } from './DrawerCloseButton';\nimport { DrawerContent } from './DrawerContent';\nimport { DrawerHeader } from './DrawerHeader';\nimport { DrawerOverlay } from './DrawerOverlay';\nimport {\n DrawerRoot,\n DrawerRootCssVariables,\n DrawerRootProps,\n DrawerRootStylesNames,\n} from './DrawerRoot';\nimport { DrawerStack, DrawerStackContext } from './DrawerStack';\nimport { DrawerTitle } from './DrawerTitle';\nimport classes from './Drawer.module.css';\n\nexport type DrawerStylesNames = DrawerRootStylesNames;\nexport type DrawerCssVariables = DrawerRootCssVariables;\n\nexport interface DrawerProps extends DrawerRootProps {\n /** Drawer title /\n title?: React.ReactNode;\n\n /* If set, the overlay is displayed @default true /\n withOverlay?: boolean;\n\n /* Props passed down to the `Overlay` component, can be used to configure opacity, `background-color`, styles and other properties /\n overlayProps?: ModalBaseOverlayProps;\n\n /* Drawer content /\n children?: React.ReactNode;\n\n /* If set, the close button is displayed @default true /\n withCloseButton?: boolean;\n\n /* Props passed down to the close button /\n closeButtonProps?: ModalBaseCloseButtonProps;\n\n /* Id of the drawer in the `Drawer.Stack` */\n stackId?: string;\n}\n\nexport type DrawerFactory = Factory<{\n props: DrawerProps;\n ref: HTMLDivElement;\n stylesNames: DrawerStylesNames;\n vars: DrawerCssVariables;\n staticComponents: {\n Root: typeof DrawerRoot;\n Overlay: typeof DrawerOverlay;\n Content: typeof DrawerContent;\n Body: typeof DrawerBody;\n Header: typeof DrawerHeader;\n Title: typeof DrawerTitle;\n CloseButton: typeof DrawerCloseButton;\n Stack: typeof DrawerStack;\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 withOverlay: true,\n withCloseButton: true,\n} satisfies Partial<DrawerProps>;\n\nexport const Drawer = factory<DrawerFactory>((_props) => {\n const {\n title,\n withOverlay,\n overlayProps,\n withCloseButton,\n closeButtonProps,\n children,\n opened,\n stackId,\n zIndex,\n ...others\n } = useProps('Drawer', defaultProps, _props);\n\n const ctx = use(DrawerStackContext);\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 __handledEscapeEvents: ctx.handledEscapeEvents,\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 <DrawerRoot\n opened={opened}\n zIndex={ctx && stackId ? ctx.getZIndex(stackId) : zIndex}\n {...others}\n {...stackProps}\n >\n {withOverlay && (\n <DrawerOverlay\n visible={overlayVisible}\n transitionProps={ctx && stackId ? { duration: 0 } : undefined}\n {...overlayProps}\n />\n )}\n <DrawerContent __hidden={ctx && stackId && opened ? stackId !== ctx.currentId : false}>\n {hasHeader && (\n <DrawerHeader>\n {title && <DrawerTitle>{title}</DrawerTitle>}\n {withCloseButton && <DrawerCloseButton {...closeButtonProps} />}\n </DrawerHeader>\n )}\n\n <DrawerBody>{children}</DrawerBody>\n </DrawerContent>\n </DrawerRoot>\n );\n});\n\nDrawer.classes = classes;\nDrawer.displayName = '@mantine/core/Drawer';\nDrawer.Root = DrawerRoot;\nDrawer.Overlay = DrawerOverlay;\nDrawer.Content = DrawerContent;\nDrawer.Body = DrawerBody;\nDrawer.Header = DrawerHeader;\nDrawer.Title = DrawerTitle;\nDrawer.CloseButton = DrawerCloseButton;\nDrawer.Stack = DrawerStack;\n"],"mappings":";;;;;;;;;;;;;;;;AA6DA,MAAM,eAAe;CACnB,qBAAqB;CACrB,cAAc;CACd,YAAY;CACZ,WAAW;CACX,aAAa;CACb,eAAe;CACf,aAAa;CACb,QAAQA,4BAAAA,iBAAiB,OAAO;CAChC,aAAa;CACb,iBAAiB;AACnB;AAEA,MAAa,SAASC,gBAAAA,SAAwB,WAAW;CACvD,MAAM,EACJ,OACA,aACA,cACA,iBACA,kBACA,UACA,QACA,SACA,QACA,GAAG,WACDC,kBAAAA,SAAS,UAAU,cAAc,MAAM;CAE3C,MAAM,OAAA,GAAMC,MAAAA,IAAAA,CAAIC,oBAAAA,kBAAkB;CAClC,MAAM,YAAY,CAAC,CAAC,SAAS;CAC7B,MAAM,aACJ,OAAO,UACH;EACE,eAAe,IAAI,cAAc;EACjC,WAAW,IAAI,cAAc;EAC7B,QAAQ,IAAI,UAAU,OAAO;EAC7B,uBAAuB,IAAI;CAC7B,IACA,CAAC;CAEP,MAAM,iBACJ,gBAAgB,QAAQ,QAAQ,WAAW,MAAM,IAAI,cAAc,UAAU;CAE/E,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,IAAI,OAAO,SACT,SACI,IAAI,SAAS,SAAS,UAAUJ,4BAAAA,iBAAiB,OAAO,CAAC,IACzD,IAAI,YAAY,OAAO;CAE/B,GAAG;EAAC;EAAQ;EAAS;CAAM,CAAC;CAE5B,OACE,iBAAA,GAAA,kBAAA,KAAA,CAACK,mBAAAA,YAAD;EACU;EACR,QAAQ,OAAO,UAAU,IAAI,UAAU,OAAO,IAAI;EAClD,GAAI;EACJ,GAAI;EAJN,UAAA,CAMG,eACC,iBAAA,GAAA,kBAAA,IAAA,CAACC,sBAAAA,eAAD;GACE,SAAS;GACT,iBAAiB,OAAO,UAAU,EAAE,UAAU,EAAE,IAAI,KAAA;GACpD,GAAI;EACL,CAAA,GAEH,iBAAA,GAAA,kBAAA,KAAA,CAACC,sBAAAA,eAAD;GAAe,UAAU,OAAO,WAAW,SAAS,YAAY,IAAI,YAAY;GAAhF,UAAA,CACG,aACC,iBAAA,GAAA,kBAAA,KAAA,CAACC,qBAAAA,cAAD,EAAA,UAAA,CACG,SAAS,iBAAA,GAAA,kBAAA,IAAA,CAACC,oBAAAA,aAAD,EAAA,UAAc,MAAmB,CAAA,GAC1C,mBAAmB,iBAAA,GAAA,kBAAA,IAAA,CAACC,0BAAAA,mBAAD,EAAmB,GAAI,iBAAmB,CAAA,CAClD,EAAA,CAAA,GAGhB,iBAAA,GAAA,kBAAA,IAAA,CAACC,mBAAAA,YAAD,EAAa,SAAqB,CAAA,CACrB;EACL,CAAA,CAAA;;AAEhB,CAAC;AAED,OAAO,UAAUC,sBAAAA;AACjB,OAAO,cAAc;AACrB,OAAO,OAAOP,mBAAAA;AACd,OAAO,UAAUC,sBAAAA;AACjB,OAAO,UAAUC,sBAAAA;AACjB,OAAO,OAAOI,mBAAAA;AACd,OAAO,SAASH,qBAAAA;AAChB,OAAO,QAAQC,oBAAAA;AACf,OAAO,cAAcC,0BAAAA;AACrB,OAAO,QAAQG,oBAAAA"}

package/cjs/components/Drawer/DrawerStack.cjs CHANGED Viewed

@@ -7,6 +7,7 @@ const DrawerStackContext = (0, react.createContext)(null);
 function DrawerStack({ children }) {
 	const [stack, setStack] = (0, react.useState)([]);
 	const [maxZIndex, setMaxZIndex] = (0, react.useState)(require_get_default_z_index.getDefaultZIndex("modal"));
+	const [handledEscapeEvents] = (0, react.useState)(() => /* @__PURE__ */ new WeakSet());
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DrawerStackContext, {
 		value: {
 			stack,
@@ -17,7 +18,8 @@ function DrawerStack({ children }) {
 			removeModal: (id) => setStack((current) => current.filter((currentId) => currentId !== id)),
 			getZIndex: (id) => `calc(${maxZIndex} + ${stack.indexOf(id)} + 1)`,
 			currentId: stack[stack.length - 1],
-			maxZIndex
+			maxZIndex,
+			handledEscapeEvents
 		},
 		children
 	});

package/cjs/components/Drawer/DrawerStack.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DrawerStack.cjs","names":["createContext","useState","getDefaultZIndex"],"sources":["../../../src/components/Drawer/DrawerStack.tsx"],"sourcesContent":["import { createContext, useState } from 'react';\nimport { getDefaultZIndex } from '../../core';\n\ninterface DrawerStackContext {\n stack: string[];\n addModal: (id: string, zIndex: number \| string) => void;\n removeModal: (id: string) => void;\n getZIndex: (id: string) => string;\n currentId: string;\n maxZIndex: string \| number;\n}\n\nexport const DrawerStackContext = createContext<DrawerStackContext \| null>(null);\n\nexport interface DrawerStackProps {\n children: React.ReactNode;\n}\n\nexport function DrawerStack({ children }: DrawerStackProps) {\n const [stack, setStack] = useState<string[]>([]);\n const [maxZIndex, setMaxZIndex] = useState<number \| string>(getDefaultZIndex('modal'));\n\n return (\n <DrawerStackContext\n value={{\n stack,\n addModal: (id, zIndex) => {\n setStack((current) => [...new Set([...current, id])]);\n setMaxZIndex((current) =>\n typeof zIndex === 'number' && typeof current === 'number'\n ? Math.max(current, zIndex)\n : current\n );\n },\n removeModal: (id) => setStack((current) => current.filter((currentId) => currentId !== id)),\n getZIndex: (id) => `calc(${maxZIndex} + ${stack.indexOf(id)} + 1)`,\n currentId: stack[stack.length - 1],\n maxZIndex,\n }}\n >\n {children}\n </DrawerStackContext>\n );\n}\n\nDrawerStack.displayName = '@mantine/core/DrawerStack';\n"],"mappings":";;;;;~~AAYA~~,MAAa,sBAAA,GAAqBA,MAAAA,cAAAA,CAAyC,IAAI;AAM/E,SAAgB,YAAY,EAAE,YAA8B;CAC1D,MAAM,CAAC,OAAO,aAAA,GAAYC,MAAAA,SAAAA,CAAmB,CAAC,CAAC;CAC/C,MAAM,CAAC,WAAW,iBAAA,GAAgBA,MAAAA,SAAAA,CAA0BC,4BAAAA,iBAAiB,OAAO,CAAC;~~CAErF~~,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,oBAAD;EACE,OAAO;GACL;GACA,WAAW,IAAI,WAAW;IACxB,UAAU,YAAY,CAAC,mBAAG,IAAI,IAAI,CAAC,GAAG,SAAS,EAAE,CAAC,CAAC,CAAC;IACpD,cAAc,YACZ,OAAO,WAAW,YAAY,OAAO,YAAY,WAC7C,KAAK,IAAI,SAAS,MAAM,IACxB,OACN;GACF;GACA,cAAc,OAAO,UAAU,YAAY,QAAQ,QAAQ,cAAc,cAAc,EAAE,CAAC;GAC1F,YAAY,OAAO,QAAQ,UAAU,KAAK,MAAM,QAAQ,EAAE,EAAE;GAC5D,WAAW,MAAM,MAAM,SAAS;GAChC;EACF;EAEC;CACiB,CAAA;AAExB;AAEA,YAAY,cAAc"}
1	+ {"version":3,"file":"DrawerStack.cjs","names":["createContext","useState","getDefaultZIndex"],"sources":["../../../src/components/Drawer/DrawerStack.tsx"],"sourcesContent":["import { createContext, useState } from 'react';\nimport { getDefaultZIndex } from '../../core';\n\ninterface DrawerStackContext {\n stack: string[];\n addModal: (id: string, zIndex: number \| string) => void;\n removeModal: (id: string) => void;\n getZIndex: (id: string) => string;\n currentId: string;\n maxZIndex: string \| number;\n handledEscapeEvents: WeakSet<KeyboardEvent>;\n}\n\nexport const DrawerStackContext = createContext<DrawerStackContext \| null>(null);\n\nexport interface DrawerStackProps {\n children: React.ReactNode;\n}\n\nexport function DrawerStack({ children }: DrawerStackProps) {\n const [stack, setStack] = useState<string[]>([]);\n const [maxZIndex, setMaxZIndex] = useState<number \| string>(getDefaultZIndex('modal'));\n const [handledEscapeEvents] = useState(() => new WeakSet<KeyboardEvent>());\n\n return (\n <DrawerStackContext\n value={{\n stack,\n addModal: (id, zIndex) => {\n setStack((current) => [...new Set([...current, id])]);\n setMaxZIndex((current) =>\n typeof zIndex === 'number' && typeof current === 'number'\n ? Math.max(current, zIndex)\n : current\n );\n },\n removeModal: (id) => setStack((current) => current.filter((currentId) => currentId !== id)),\n getZIndex: (id) => `calc(${maxZIndex} + ${stack.indexOf(id)} + 1)`,\n currentId: stack[stack.length - 1],\n maxZIndex,\n handledEscapeEvents,\n }}\n >\n {children}\n </DrawerStackContext>\n );\n}\n\nDrawerStack.displayName = '@mantine/core/DrawerStack';\n"],"mappings":";;;;;AAaA,MAAa,sBAAA,GAAqBA,MAAAA,cAAAA,CAAyC,IAAI;AAM/E,SAAgB,YAAY,EAAE,YAA8B;CAC1D,MAAM,CAAC,OAAO,aAAA,GAAYC,MAAAA,SAAAA,CAAmB,CAAC,CAAC;CAC/C,MAAM,CAAC,WAAW,iBAAA,GAAgBA,MAAAA,SAAAA,CAA0BC,4BAAAA,iBAAiB,OAAO,CAAC;CACrF,MAAM,CAAC,wBAAA,GAAuBD,MAAAA,SAAAA,uBAAe,IAAI,QAAuB,CAAC;CAEzE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,oBAAD;EACE,OAAO;GACL;GACA,WAAW,IAAI,WAAW;IACxB,UAAU,YAAY,CAAC,mBAAG,IAAI,IAAI,CAAC,GAAG,SAAS,EAAE,CAAC,CAAC,CAAC;IACpD,cAAc,YACZ,OAAO,WAAW,YAAY,OAAO,YAAY,WAC7C,KAAK,IAAI,SAAS,MAAM,IACxB,OACN;GACF;GACA,cAAc,OAAO,UAAU,YAAY,QAAQ,QAAQ,cAAc,cAAc,EAAE,CAAC;GAC1F,YAAY,OAAO,QAAQ,UAAU,KAAK,MAAM,QAAQ,EAAE,EAAE;GAC5D,WAAW,MAAM,MAAM,SAAS;GAChC;GACA;EACF;EAEC;CACiB,CAAA;AAExB;AAEA,YAAY,cAAc"}

package/cjs/components/Menu/MenuSub/MenuSub.cjs CHANGED Viewed

@@ -93,11 +93,11 @@ function MenuSub(_props) {
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Popover.Popover, {
 			opened,
 			onChange: (nextOpened) => nextOpened ? handleOpen() : handleClose(),
-			withinPortal: false,
 			withArrow: false,
 			id,
 			position,
 			...others,
+			withinPortal: false,
 			children
 		})
 	});

package/cjs/components/Menu/MenuSub/MenuSub.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenuSub.cjs","names":["useProps","useId","useUncontrolled","use","SubMenuContext","useMenuContext","useDirection","getFloatingPosition","useRef","useCallback","useFloating","useInteractions","useHover","safePolygon","Popover","MenuSubTarget","MenuSubDropdown","MenuSubItem"],"sources":["../../../../src/components/Menu/MenuSub/MenuSub.tsx"],"sourcesContent":["import { use, useCallback, useEffect, useRef } from 'react';\nimport {\n safePolygon,\n useFloating,\n useHover,\n useInteractions,\n type SafePolygonOptions,\n} from '@floating-ui/react';\nimport { useId, useUncontrolled } from '@mantine/hooks';\nimport { ExtendComponent, Factory, useDirection, useProps } from '../../../core';\nimport {\n FloatingAxesOffsets,\n FloatingPosition,\n getFloatingPosition,\n} from '../../../utils/Floating';\nimport { __PopoverProps, Popover } from '../../Popover';\nimport { TransitionOverride } from '../../Transition';\nimport { useMenuContext } from '../Menu.context';\nimport { MenuSubDropdown } from '../MenuSubDropdown/MenuSubDropdown';\nimport { MenuSubItem } from '../MenuSubItem/MenuSubItem';\nimport { MenuSubTarget } from '../MenuSubTarget/MenuSubTarget';\nimport { SubMenuContext } from './MenuSub.context';\n\nexport type MenuSubFactory = Factory<{\n props: MenuSubProps;\n}>;\n\nexport interface MenuSubProps extends __PopoverProps {\n children: React.ReactNode;\n\n /** Controlled opened state /\n opened?: boolean;\n\n /* Called with current state when dropdown opens or closes /\n onChange?: (opened: boolean) => void;\n\n /* Open delay in ms, applicable when hover trigger is used /\n openDelay?: number;\n\n /* Close delay in ms, applicable when hover trigger is used /\n closeDelay?: number;\n\n /* Dropdown position relative to the target element @default 'right-start' /\n position?: FloatingPosition;\n\n /* Offset of the dropdown element @default 0 /\n offset?: number \| FloatingAxesOffsets;\n\n /* Props passed down to the `Transition` component that used to animate dropdown presence, use to configure duration and animation type @default { duration: 0 } /\n transitionProps?: TransitionOverride;\n\n /* Determines whether submenu stays open while the cursor moves toward its dropdown. Pass an object to configure safe polygon behavior. @default true */\n safeAreaPolygon?: boolean \| SafePolygonOptions;\n}\n\nconst defaultProps = {\n offset: 0,\n position: 'right-start',\n safeAreaPolygon: true,\n transitionProps: { duration: 0 },\n openDelay: 0,\n middlewares: {\n shift: {\n // Enable crossAxis shift to keep submenu dropdown within viewport bounds when positioned horizontally\n crossAxis: true,\n },\n },\n} satisfies Partial<MenuSubProps>;\n\nexport function MenuSub(_props: MenuSubProps) {\n const {\n children,\n closeDelay,\n openDelay,\n position,\n safeAreaPolygon,\n opened: openedProp,\n onChange,\n ...others\n } = useProps('MenuSub', defaultProps, _props);\n const id = useId();\n const [opened, setOpened] = useUncontrolled({\n value: openedProp,\n finalValue: false,\n onChange,\n });\n const parentSubCtx = use(SubMenuContext);\n const menuCtx = useMenuContext();\n const { dir } = useDirection();\n const resolvedPosition = getFloatingPosition(dir, position);\n\n const levelRegister = parentSubCtx?.registerOpenSub ?? menuCtx.registerOpenSub;\n\n const activeChildCloseRef = useRef<(() => void) \| null>(null);\n const registerOpenSub = useCallback((closeFn: () => void) => {\n const prev = activeChildCloseRef.current;\n if (prev && prev !== closeFn) {\n prev();\n }\n activeChildCloseRef.current = closeFn;\n return () => {\n if (activeChildCloseRef.current === closeFn) {\n activeChildCloseRef.current = null;\n }\n };\n }, []);\n\n const setOpenedRef = useRef(setOpened);\n setOpenedRef.current = setOpened;\n\n const handleOpen = useCallback(() => setOpenedRef.current(true), []);\n const handleClose = useCallback(() => setOpenedRef.current(false), []);\n\n useEffect(() => {\n if (!opened) {\n return undefined;\n }\n\n return levelRegister(handleClose);\n }, [opened, levelRegister, handleClose]);\n\n const { context, refs } = useFloating({\n placement: resolvedPosition,\n open: opened,\n onOpenChange: (nextOpen) => {\n if (nextOpen) {\n handleOpen();\n } else {\n handleClose();\n }\n },\n });\n\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useHover(context, {\n handleClose: safeAreaPolygon\n ? safePolygon(typeof safeAreaPolygon === 'object' ? safeAreaPolygon : undefined)\n : undefined,\n delay: { open: openDelay, close: closeDelay },\n }),\n ]);\n\n const focusFirstItem = () =>\n window.setTimeout(() => {\n document\n .getElementById(`${id}-dropdown`)\n ?.querySelectorAll<HTMLButtonElement>('[data-menu-item]:not([data-disabled])')[0]\n ?.focus();\n }, 16);\n\n const focusParentItem = () =>\n window.setTimeout(() => {\n document.getElementById(`${id}-target`)?.focus();\n }, 16);\n\n return (\n <SubMenuContext\n value={{\n opened,\n close: handleClose,\n open: handleOpen,\n focusFirstItem,\n focusParentItem,\n parentContext: parentSubCtx,\n setReference: refs.setReference,\n setFloating: refs.setFloating,\n getReferenceProps,\n getFloatingProps,\n registerOpenSub,\n }}\n >\n <Popover\n opened={opened}\n onChange={(nextOpened) => (nextOpened ? handleOpen() : handleClose())}\n ~~withinPortal={false}\n~~ withArrow={false}\n id={id}\n position={position}\n {...others}\n >\n {children}\n </Popover>\n </SubMenuContext>\n );\n}\n\nMenuSub.extend = (input: ExtendComponent<MenuSubFactory>) => input;\nMenuSub.displayName = '@mantine/core/MenuSub';\nMenuSub.Target = MenuSubTarget;\nMenuSub.Dropdown = MenuSubDropdown;\nMenuSub.Item = MenuSubItem;\n"],"mappings":";;;;;;;;;;;;;;;~~AAuDA~~,MAAM,eAAe;CACnB,QAAQ;CACR,UAAU;CACV,iBAAiB;CACjB,iBAAiB,EAAE,UAAU,EAAE;CAC/B,WAAW;CACX,aAAa,EACX,OAAO,EAEL,WAAW,KACb,EACF;AACF;AAEA,SAAgB,QAAQ,QAAsB;CAC5C,MAAM,EACJ,UACA,YACA,WACA,UACA,iBACA,QAAQ,YACR,UACA,GAAG,WACDA,kBAAAA,SAAS,WAAW,cAAc,MAAM;CAC5C,MAAM,MAAA,GAAKC,eAAAA,MAAAA,CAAM;CACjB,MAAM,CAAC,QAAQ,cAAA,GAAaC,eAAAA,gBAAAA,CAAgB;EAC1C,OAAO;EACP,YAAY;EACZ;CACF,CAAC;CACD,MAAM,gBAAA,GAAeC,MAAAA,IAAAA,CAAIC,wBAAAA,cAAc;CACvC,MAAM,UAAUC,qBAAAA,eAAe;CAC/B,MAAM,EAAE,QAAQC,0BAAAA,aAAa;CAC7B,MAAM,mBAAmBC,8BAAAA,oBAAoB,KAAK,QAAQ;CAE1D,MAAM,gBAAgB,cAAc,mBAAmB,QAAQ;CAE/D,MAAM,uBAAA,GAAsBC,MAAAA,OAAAA,CAA4B,IAAI;CAC5D,MAAM,mBAAA,GAAkBC,MAAAA,YAAAA,EAAa,YAAwB;EAC3D,MAAM,OAAO,oBAAoB;EACjC,IAAI,QAAQ,SAAS,SACnB,KAAK;EAEP,oBAAoB,UAAU;EAC9B,aAAa;GACX,IAAI,oBAAoB,YAAY,SAClC,oBAAoB,UAAU;EAElC;CACF,GAAG,CAAC,CAAC;CAEL,MAAM,gBAAA,GAAeD,MAAAA,OAAAA,CAAO,SAAS;CACrC,aAAa,UAAU;CAEvB,MAAM,cAAA,GAAaC,MAAAA,YAAAA,OAAkB,aAAa,QAAQ,IAAI,GAAG,CAAC,CAAC;CACnE,MAAM,eAAA,GAAcA,MAAAA,YAAAA,OAAkB,aAAa,QAAQ,KAAK,GAAG,CAAC,CAAC;CAErE,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,IAAI,CAAC,QACH;EAGF,OAAO,cAAc,WAAW;CAClC,GAAG;EAAC;EAAQ;EAAe;CAAW,CAAC;CAEvC,MAAM,EAAE,SAAS,UAAA,GAASC,mBAAAA,YAAAA,CAAY;EACpC,WAAW;EACX,MAAM;EACN,eAAe,aAAa;GAC1B,IAAI,UACF,WAAW;QAEX,YAAY;EAEhB;CACF,CAAC;CAED,MAAM,EAAE,mBAAmB,sBAAA,GAAqBC,mBAAAA,gBAAAA,CAAgB,EAAA,GAC9DC,mBAAAA,SAAAA,CAAS,SAAS;EAChB,aAAa,mBAAA,GACTC,mBAAAA,YAAAA,CAAY,OAAO,oBAAoB,WAAW,kBAAkB,KAAA,CAAS,IAC7E,KAAA;EACJ,OAAO;GAAE,MAAM;GAAW,OAAO;EAAW;CAC9C,CAAC,CACH,CAAC;CAED,MAAM,uBACJ,OAAO,iBAAiB;EACtB,SACG,eAAe,GAAG,GAAG,UAAU,CAAC,EAC/B,iBAAoC,uCAAuC,CAAC,CAAC,EAAE,EAC/E,MAAM;CACZ,GAAG,EAAE;CAEP,MAAM,wBACJ,OAAO,iBAAiB;EACtB,SAAS,eAAe,GAAG,GAAG,QAAQ,CAAC,EAAE,MAAM;CACjD,GAAG,EAAE;CAEP,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACT,wBAAAA,gBAAD;EACE,OAAO;GACL;GACA,OAAO;GACP,MAAM;GACN;GACA;GACA,eAAe;GACf,cAAc,KAAK;GACnB,aAAa,KAAK;GAClB;GACA;GACA;EACF;EAEA,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACU,gBAAAA,SAAD;GACU;GACR,WAAW,eAAgB,aAAa,WAAW,IAAI,YAAY;GACnE,~~cAAc;GACd,~~WAAW;GACP;GACM;GACV,GAAI;~~GAEH~~;EACM,CAAA;CACK,CAAA;AAEpB;AAEA,QAAQ,UAAU,UAA2C;AAC7D,QAAQ,cAAc;AACtB,QAAQ,SAASC,sBAAAA;AACjB,QAAQ,WAAWC,wBAAAA;AACnB,QAAQ,OAAOC,oBAAAA"}
1	+ {"version":3,"file":"MenuSub.cjs","names":["useProps","useId","useUncontrolled","use","SubMenuContext","useMenuContext","useDirection","getFloatingPosition","useRef","useCallback","useFloating","useInteractions","useHover","safePolygon","Popover","MenuSubTarget","MenuSubDropdown","MenuSubItem"],"sources":["../../../../src/components/Menu/MenuSub/MenuSub.tsx"],"sourcesContent":["import { use, useCallback, useEffect, useRef } from 'react';\nimport {\n safePolygon,\n useFloating,\n useHover,\n useInteractions,\n type SafePolygonOptions,\n} from '@floating-ui/react';\nimport { useId, useUncontrolled } from '@mantine/hooks';\nimport { ExtendComponent, Factory, useDirection, useProps } from '../../../core';\nimport {\n FloatingAxesOffsets,\n FloatingPosition,\n getFloatingPosition,\n} from '../../../utils/Floating';\nimport { __PopoverProps, Popover } from '../../Popover';\nimport { TransitionOverride } from '../../Transition';\nimport { useMenuContext } from '../Menu.context';\nimport { MenuSubDropdown } from '../MenuSubDropdown/MenuSubDropdown';\nimport { MenuSubItem } from '../MenuSubItem/MenuSubItem';\nimport { MenuSubTarget } from '../MenuSubTarget/MenuSubTarget';\nimport { SubMenuContext } from './MenuSub.context';\n\nexport type MenuSubFactory = Factory<{\n props: MenuSubProps;\n}>;\n\n/** `Menu.Sub` dropdown is always rendered inside the parent dropdown: hover tracking and outside\n * clicks detection rely on it being a DOM descendant of the menu it belongs to. /\nexport interface MenuSubProps extends Omit<__PopoverProps, 'withinPortal' \| 'portalProps'> {\n children: React.ReactNode;\n\n /* Controlled opened state /\n opened?: boolean;\n\n /* Called with current state when dropdown opens or closes /\n onChange?: (opened: boolean) => void;\n\n /* Open delay in ms, applicable when hover trigger is used /\n openDelay?: number;\n\n /* Close delay in ms, applicable when hover trigger is used /\n closeDelay?: number;\n\n /* Dropdown position relative to the target element @default 'right-start' /\n position?: FloatingPosition;\n\n /* Offset of the dropdown element @default 0 /\n offset?: number \| FloatingAxesOffsets;\n\n /* Props passed down to the `Transition` component that used to animate dropdown presence, use to configure duration and animation type @default { duration: 0 } /\n transitionProps?: TransitionOverride;\n\n /* Determines whether submenu stays open while the cursor moves toward its dropdown. Pass an object to configure safe polygon behavior. @default true */\n safeAreaPolygon?: boolean \| SafePolygonOptions;\n}\n\nconst defaultProps = {\n offset: 0,\n position: 'right-start',\n safeAreaPolygon: true,\n transitionProps: { duration: 0 },\n openDelay: 0,\n middlewares: {\n shift: {\n // Enable crossAxis shift to keep submenu dropdown within viewport bounds when positioned horizontally\n crossAxis: true,\n },\n },\n} satisfies Partial<MenuSubProps>;\n\nexport function MenuSub(_props: MenuSubProps) {\n const {\n children,\n closeDelay,\n openDelay,\n position,\n safeAreaPolygon,\n opened: openedProp,\n onChange,\n ...others\n } = useProps('MenuSub', defaultProps, _props);\n const id = useId();\n const [opened, setOpened] = useUncontrolled({\n value: openedProp,\n finalValue: false,\n onChange,\n });\n const parentSubCtx = use(SubMenuContext);\n const menuCtx = useMenuContext();\n const { dir } = useDirection();\n const resolvedPosition = getFloatingPosition(dir, position);\n\n const levelRegister = parentSubCtx?.registerOpenSub ?? menuCtx.registerOpenSub;\n\n const activeChildCloseRef = useRef<(() => void) \| null>(null);\n const registerOpenSub = useCallback((closeFn: () => void) => {\n const prev = activeChildCloseRef.current;\n if (prev && prev !== closeFn) {\n prev();\n }\n activeChildCloseRef.current = closeFn;\n return () => {\n if (activeChildCloseRef.current === closeFn) {\n activeChildCloseRef.current = null;\n }\n };\n }, []);\n\n const setOpenedRef = useRef(setOpened);\n setOpenedRef.current = setOpened;\n\n const handleOpen = useCallback(() => setOpenedRef.current(true), []);\n const handleClose = useCallback(() => setOpenedRef.current(false), []);\n\n useEffect(() => {\n if (!opened) {\n return undefined;\n }\n\n return levelRegister(handleClose);\n }, [opened, levelRegister, handleClose]);\n\n const { context, refs } = useFloating({\n placement: resolvedPosition,\n open: opened,\n onOpenChange: (nextOpen) => {\n if (nextOpen) {\n handleOpen();\n } else {\n handleClose();\n }\n },\n });\n\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useHover(context, {\n handleClose: safeAreaPolygon\n ? safePolygon(typeof safeAreaPolygon === 'object' ? safeAreaPolygon : undefined)\n : undefined,\n delay: { open: openDelay, close: closeDelay },\n }),\n ]);\n\n const focusFirstItem = () =>\n window.setTimeout(() => {\n document\n .getElementById(`${id}-dropdown`)\n ?.querySelectorAll<HTMLButtonElement>('[data-menu-item]:not([data-disabled])')[0]\n ?.focus();\n }, 16);\n\n const focusParentItem = () =>\n window.setTimeout(() => {\n document.getElementById(`${id}-target`)?.focus();\n }, 16);\n\n return (\n <SubMenuContext\n value={{\n opened,\n close: handleClose,\n open: handleOpen,\n focusFirstItem,\n focusParentItem,\n parentContext: parentSubCtx,\n setReference: refs.setReference,\n setFloating: refs.setFloating,\n getReferenceProps,\n getFloatingProps,\n registerOpenSub,\n }}\n >\n <Popover\n opened={opened}\n onChange={(nextOpened) => (nextOpened ? handleOpen() : handleClose())}\n withArrow={false}\n id={id}\n position={position}\n {...others}\n withinPortal={false}\n >\n {children}\n </Popover>\n </SubMenuContext>\n );\n}\n\nMenuSub.extend = (input: ExtendComponent<MenuSubFactory>) => input;\nMenuSub.displayName = '@mantine/core/MenuSub';\nMenuSub.Target = MenuSubTarget;\nMenuSub.Dropdown = MenuSubDropdown;\nMenuSub.Item = MenuSubItem;\n"],"mappings":"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"}

package/cjs/components/Modal/Modal.cjs CHANGED Viewed

@@ -37,7 +37,8 @@ const Modal = require_factory.factory((_props) => {
 	const stackProps = ctx && stackId ? {
 		closeOnEscape: ctx.currentId === stackId,
 		trapFocus: ctx.currentId === stackId,
-		zIndex: ctx.getZIndex(stackId)
+		zIndex: ctx.getZIndex(stackId),
+		__handledEscapeEvents: ctx.handledEscapeEvents
 	} : {};
 	const overlayVisible = withOverlay === false ? false : stackId && ctx ? ctx.currentId === stackId : opened;
 	(0, react.useEffect)(() => {

package/cjs/components/Modal/Modal.cjs.map CHANGED Viewed

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

package/cjs/components/Modal/ModalStack.cjs CHANGED Viewed

@@ -7,6 +7,7 @@ const ModalStackContext = (0, react.createContext)(null);
 function ModalStack({ children }) {
 	const [stack, setStack] = (0, react.useState)([]);
 	const [maxZIndex, setMaxZIndex] = (0, react.useState)(require_get_default_z_index.getDefaultZIndex("modal"));
+	const [handledEscapeEvents] = (0, react.useState)(() => /* @__PURE__ */ new WeakSet());
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModalStackContext, {
 		value: {
 			stack,
@@ -17,7 +18,8 @@ function ModalStack({ children }) {
 			removeModal: (id) => setStack((current) => current.filter((currentId) => currentId !== id)),
 			getZIndex: (id) => `calc(${maxZIndex} + ${stack.indexOf(id)} + 1)`,
 			currentId: stack[stack.length - 1],
-			maxZIndex
+			maxZIndex,
+			handledEscapeEvents
 		},
 		children
 	});

package/cjs/components/Modal/ModalStack.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalStack.cjs","names":["createContext","useState","getDefaultZIndex"],"sources":["../../../src/components/Modal/ModalStack.tsx"],"sourcesContent":["import { createContext, useState } from 'react';\nimport { getDefaultZIndex } from '../../core';\n\ninterface ModalStackContext {\n stack: string[];\n addModal: (id: string, zIndex: number \| string) => void;\n removeModal: (id: string) => void;\n getZIndex: (id: string) => string;\n currentId: string;\n maxZIndex: string \| number;\n}\n\nexport const ModalStackContext = createContext<ModalStackContext \| null>(null);\n\nexport interface ModalStackProps {\n children: React.ReactNode;\n}\n\nexport function ModalStack({ children }: ModalStackProps) {\n const [stack, setStack] = useState<string[]>([]);\n const [maxZIndex, setMaxZIndex] = useState<number \| string>(getDefaultZIndex('modal'));\n\n return (\n <ModalStackContext\n value={{\n stack,\n addModal: (id, zIndex) => {\n setStack((current) => [...new Set([...current, id])]);\n setMaxZIndex((current) =>\n typeof zIndex === 'number' && typeof current === 'number'\n ? Math.max(current, zIndex)\n : current\n );\n },\n removeModal: (id) => setStack((current) => current.filter((currentId) => currentId !== id)),\n getZIndex: (id) => `calc(${maxZIndex} + ${stack.indexOf(id)} + 1)`,\n currentId: stack[stack.length - 1],\n maxZIndex,\n }}\n >\n {children}\n </ModalStackContext>\n );\n}\n\nModalStack.displayName = '@mantine/core/ModalStack';\n"],"mappings":";;;;;~~AAYA~~,MAAa,qBAAA,GAAoBA,MAAAA,cAAAA,CAAwC,IAAI;AAM7E,SAAgB,WAAW,EAAE,YAA6B;CACxD,MAAM,CAAC,OAAO,aAAA,GAAYC,MAAAA,SAAAA,CAAmB,CAAC,CAAC;CAC/C,MAAM,CAAC,WAAW,iBAAA,GAAgBA,MAAAA,SAAAA,CAA0BC,4BAAAA,iBAAiB,OAAO,CAAC;~~CAErF~~,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,mBAAD;EACE,OAAO;GACL;GACA,WAAW,IAAI,WAAW;IACxB,UAAU,YAAY,CAAC,mBAAG,IAAI,IAAI,CAAC,GAAG,SAAS,EAAE,CAAC,CAAC,CAAC;IACpD,cAAc,YACZ,OAAO,WAAW,YAAY,OAAO,YAAY,WAC7C,KAAK,IAAI,SAAS,MAAM,IACxB,OACN;GACF;GACA,cAAc,OAAO,UAAU,YAAY,QAAQ,QAAQ,cAAc,cAAc,EAAE,CAAC;GAC1F,YAAY,OAAO,QAAQ,UAAU,KAAK,MAAM,QAAQ,EAAE,EAAE;GAC5D,WAAW,MAAM,MAAM,SAAS;GAChC;EACF;EAEC;CACgB,CAAA;AAEvB;AAEA,WAAW,cAAc"}
1	+ {"version":3,"file":"ModalStack.cjs","names":["createContext","useState","getDefaultZIndex"],"sources":["../../../src/components/Modal/ModalStack.tsx"],"sourcesContent":["import { createContext, useState } from 'react';\nimport { getDefaultZIndex } from '../../core';\n\ninterface ModalStackContext {\n stack: string[];\n addModal: (id: string, zIndex: number \| string) => void;\n removeModal: (id: string) => void;\n getZIndex: (id: string) => string;\n currentId: string;\n maxZIndex: string \| number;\n handledEscapeEvents: WeakSet<KeyboardEvent>;\n}\n\nexport const ModalStackContext = createContext<ModalStackContext \| null>(null);\n\nexport interface ModalStackProps {\n children: React.ReactNode;\n}\n\nexport function ModalStack({ children }: ModalStackProps) {\n const [stack, setStack] = useState<string[]>([]);\n const [maxZIndex, setMaxZIndex] = useState<number \| string>(getDefaultZIndex('modal'));\n const [handledEscapeEvents] = useState(() => new WeakSet<KeyboardEvent>());\n\n return (\n <ModalStackContext\n value={{\n stack,\n addModal: (id, zIndex) => {\n setStack((current) => [...new Set([...current, id])]);\n setMaxZIndex((current) =>\n typeof zIndex === 'number' && typeof current === 'number'\n ? Math.max(current, zIndex)\n : current\n );\n },\n removeModal: (id) => setStack((current) => current.filter((currentId) => currentId !== id)),\n getZIndex: (id) => `calc(${maxZIndex} + ${stack.indexOf(id)} + 1)`,\n currentId: stack[stack.length - 1],\n maxZIndex,\n handledEscapeEvents,\n }}\n >\n {children}\n </ModalStackContext>\n );\n}\n\nModalStack.displayName = '@mantine/core/ModalStack';\n"],"mappings":";;;;;AAaA,MAAa,qBAAA,GAAoBA,MAAAA,cAAAA,CAAwC,IAAI;AAM7E,SAAgB,WAAW,EAAE,YAA6B;CACxD,MAAM,CAAC,OAAO,aAAA,GAAYC,MAAAA,SAAAA,CAAmB,CAAC,CAAC;CAC/C,MAAM,CAAC,WAAW,iBAAA,GAAgBA,MAAAA,SAAAA,CAA0BC,4BAAAA,iBAAiB,OAAO,CAAC;CACrF,MAAM,CAAC,wBAAA,GAAuBD,MAAAA,SAAAA,uBAAe,IAAI,QAAuB,CAAC;CAEzE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,mBAAD;EACE,OAAO;GACL;GACA,WAAW,IAAI,WAAW;IACxB,UAAU,YAAY,CAAC,mBAAG,IAAI,IAAI,CAAC,GAAG,SAAS,EAAE,CAAC,CAAC,CAAC;IACpD,cAAc,YACZ,OAAO,WAAW,YAAY,OAAO,YAAY,WAC7C,KAAK,IAAI,SAAS,MAAM,IACxB,OACN;GACF;GACA,cAAc,OAAO,UAAU,YAAY,QAAQ,QAAQ,cAAc,cAAc,EAAE,CAAC;GAC1F,YAAY,OAAO,QAAQ,UAAU,KAAK,MAAM,QAAQ,EAAE,EAAE;GAC5D,WAAW,MAAM,MAAM,SAAS;GAChC;GACA;EACF;EAEC;CACgB,CAAA;AAEvB;AAEA,WAAW,cAAc"}

package/cjs/components/ModalBase/ModalBase.cjs CHANGED Viewed

@@ -8,7 +8,7 @@ const require_use_modal = require("./use-modal.cjs");
 let react_remove_scroll = require("react-remove-scroll");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region packages/@mantine/core/src/components/ModalBase/ModalBase.tsx
-function ModalBase({ keepMounted, keepMountedMode = "activity", opened, onClose, id, transitionProps, onExitTransitionEnd, onEnterTransitionEnd, trapFocus, closeOnEscape, returnFocus, closeOnClickOutside, withinPortal, portalProps, lockScroll, children, zIndex, shadow, padding, __vars, unstyled, removeScrollProps, ...others }) {
+function ModalBase({ keepMounted, keepMountedMode = "activity", opened, onClose, id, transitionProps, onExitTransitionEnd, onEnterTransitionEnd, trapFocus, closeOnEscape, returnFocus, closeOnClickOutside, withinPortal, portalProps, lockScroll, children, zIndex, shadow, padding, __vars, unstyled, removeScrollProps, __handledEscapeEvents, ...others }) {
 	const { _id, titleMounted, bodyMounted, shouldLockScroll, setTitleMounted, setBodyMounted } = require_use_modal.useModal({
 		id,
 		transitionProps,
@@ -16,7 +16,8 @@ function ModalBase({ keepMounted, keepMountedMode = "activity", opened, onClose,
 		trapFocus,
 		closeOnEscape,
 		onClose,
-		returnFocus
+		returnFocus,
+		handledEscapeEvents: __handledEscapeEvents
 	});
 	const { key: removeScrollKey, ...otherRemoveScrollProps } = removeScrollProps || {};
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_OptionalPortal.OptionalPortal, {

package/cjs/components/ModalBase/ModalBase.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalBase.cjs","names":["useModal","OptionalPortal","ModalBaseProvider","RemoveScroll","Box","getDefaultZIndex","getShadow","getSpacing"],"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,mBACzEA,kBAAAA,SAAS;~~EAAE~~;~~EAAI~~;~~EAAiB~~;~~EAAQ~~;~~EAAW~~;~~EAAe~~;~~EAAS~~;~~CAAY~~,CAAC;~~CAE1F~~,MAAM,EAAE,KAAK,iBAAiB,GAAG,2BAA2B,qBAAqB,CAAC;CAElF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,uBAAAA,gBAAD;EAAgB,GAAI;EAA2B;EAC7C,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,0BAAAA,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,iBAAA,GAAA,kBAAA,IAAA,CAACC,oBAAAA,cAAD;IACE,SAAS,oBAAoB;IAE7B,GAAI;IAEJ,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;KACE,GAAI;KACJ,IAAI;KACJ,QAAQ;MACN,GAAG;MACH,iBAAiB,UAAUC,4BAAAA,iBAAiB,OAAO,EAAA,CAAG,SAAS;MAC/D,eAAeC,iBAAAA,UAAU,MAAM;MAC/B,gBAAgBC,iBAAAA,WAAW,OAAO;KACpC;KAEC;IACE,CAAA;GACO,GAfP,eAeO;EACG,CAAA;CACL,CAAA;AAEpB;AAEA,UAAU,cAAc"}
1	+ {"version":3,"file":"ModalBase.cjs","names":["useModal","OptionalPortal","ModalBaseProvider","RemoveScroll","Box","getDefaultZIndex","getShadow","getSpacing"],"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 __handledEscapeEvents?: WeakSet<KeyboardEvent>;\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 __handledEscapeEvents,\n ...others\n}: ModalBaseProps) {\n const { _id, titleMounted, bodyMounted, shouldLockScroll, setTitleMounted, setBodyMounted } =\n useModal({\n id,\n transitionProps,\n opened,\n trapFocus,\n closeOnEscape,\n onClose,\n returnFocus,\n handledEscapeEvents: __handledEscapeEvents,\n });\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":";;;;;;;;;;AA2FA,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,uBACA,GAAG,UACc;CACjB,MAAM,EAAE,KAAK,cAAc,aAAa,kBAAkB,iBAAiB,mBACzEA,kBAAAA,SAAS;EACP;EACA;EACA;EACA;EACA;EACA;EACA;EACA,qBAAqB;CACvB,CAAC;CAEH,MAAM,EAAE,KAAK,iBAAiB,GAAG,2BAA2B,qBAAqB,CAAC;CAElF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,uBAAAA,gBAAD;EAAgB,GAAI;EAA2B;EAC7C,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,0BAAAA,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,iBAAA,GAAA,kBAAA,IAAA,CAACC,oBAAAA,cAAD;IACE,SAAS,oBAAoB;IAE7B,GAAI;IAEJ,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;KACE,GAAI;KACJ,IAAI;KACJ,QAAQ;MACN,GAAG;MACH,iBAAiB,UAAUC,4BAAAA,iBAAiB,OAAO,EAAA,CAAG,SAAS;MAC/D,eAAeC,iBAAAA,UAAU,MAAM;MAC/B,gBAAgBC,iBAAAA,WAAW,OAAO;KACpC;KAEC;IACE,CAAA;GACO,GAfP,eAeO;EACG,CAAA;CACL,CAAA;AAEpB;AAEA,UAAU,cAAc"}

package/cjs/components/ModalBase/use-modal.cjs CHANGED Viewed

@@ -3,7 +3,7 @@ const require_use_lock_scroll = require("./use-lock-scroll.cjs");
 let react = require("react");
 let _mantine_hooks = require("@mantine/hooks");
 //#region packages/@mantine/core/src/components/ModalBase/use-modal.ts
-function useModal({ id, transitionProps, opened, trapFocus, closeOnEscape, onClose, returnFocus }) {
+function useModal({ id, transitionProps, opened, trapFocus, closeOnEscape, onClose, returnFocus, handledEscapeEvents }) {
 	const _id = (0, _mantine_hooks.useId)(id);
 	const [titleMounted, setTitleMounted] = (0, react.useState)(false);
 	const [bodyMounted, setBodyMounted] = (0, react.useState)(false);
@@ -13,7 +13,12 @@ function useModal({ id, transitionProps, opened, trapFocus, closeOnEscape, onClo
 		transitionDuration
 	});
 	(0, _mantine_hooks.useWindowEvent)("keydown", (event) => {
-		if (event.key === "Escape" && closeOnEscape && !event.isComposing && opened) event.target?.getAttribute("data-mantine-stop-propagation") !== "true" && onClose();
+		if (event.key === "Escape" && closeOnEscape && !event.isComposing && opened && !handledEscapeEvents?.has(event)) {
+			if (event.target?.getAttribute("data-mantine-stop-propagation") !== "true") {
+				handledEscapeEvents?.add(event);
+				onClose();
+			}
+		}
 	}, { capture: true });
 	(0, _mantine_hooks.useFocusReturn)({
 		opened,

package/cjs/components/ModalBase/use-modal.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-modal.cjs","names":["useId","useState","useLockScroll"],"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,OAAA,GAAMA,eAAAA,MAAAA,CAAM,EAAE;CACpB,MAAM,CAAC,cAAc,oBAAA,GAAmBC,MAAAA,SAAAA,CAAS,KAAK;CACtD,MAAM,CAAC,aAAa,mBAAA,GAAkBA,MAAAA,SAAAA,CAAS,KAAK;CAEpD,MAAM,qBACJ,OAAO,iBAAiB,aAAa,WAAW,iBAAiB,WAAW;CAE9E,MAAM,mBAAmBC,wBAAAA,cAAc;EAAE;EAAQ;CAAmB,CAAC;CAErE,CAAA,GAAA,eAAA,eAAA,CACE,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,CAAA,GAAA,eAAA,eAAA,CAAe;EAAE;EAAQ,mBAAmB,aAAa;CAAY,CAAC;CAEtE,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;CACF;AACF"}
1	+ {"version":3,"file":"use-modal.cjs","names":["useId","useState","useLockScroll"],"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 handledEscapeEvents?: WeakSet<KeyboardEvent>;\n}\n\nexport function useModal({\n id,\n transitionProps,\n opened,\n trapFocus,\n closeOnEscape,\n onClose,\n returnFocus,\n handledEscapeEvents,\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 (\n event.key === 'Escape' &&\n closeOnEscape &&\n !event.isComposing &&\n opened &&\n !handledEscapeEvents?.has(event)\n ) {\n const shouldTrigger =\n (event.target as HTMLElement)?.getAttribute('data-mantine-stop-propagation') !== 'true';\n if (shouldTrigger) {\n handledEscapeEvents?.add(event);\n onClose();\n }\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":";;;;;AAgBA,SAAgB,SAAS,EACvB,IACA,iBACA,QACA,WACA,eACA,SACA,aACA,uBACgB;CAChB,MAAM,OAAA,GAAMA,eAAAA,MAAAA,CAAM,EAAE;CACpB,MAAM,CAAC,cAAc,oBAAA,GAAmBC,MAAAA,SAAAA,CAAS,KAAK;CACtD,MAAM,CAAC,aAAa,mBAAA,GAAkBA,MAAAA,SAAAA,CAAS,KAAK;CAEpD,MAAM,qBACJ,OAAO,iBAAiB,aAAa,WAAW,iBAAiB,WAAW;CAE9E,MAAM,mBAAmBC,wBAAAA,cAAc;EAAE;EAAQ;CAAmB,CAAC;CAErE,CAAA,GAAA,eAAA,eAAA,CACE,YACC,UAAU;EACT,IACE,MAAM,QAAQ,YACd,iBACA,CAAC,MAAM,eACP,UACA,CAAC,qBAAqB,IAAI,KAAK,GAG5B;OAAA,MAAM,QAAwB,aAAa,+BAA+B,MAAM,QAChE;IACjB,qBAAqB,IAAI,KAAK;IAC9B,QAAQ;GACV;;CAEJ,GACA,EAAE,SAAS,KAAK,CAClB;CAEA,CAAA,GAAA,eAAA,eAAA,CAAe;EAAE;EAAQ,mBAAmB,aAAa;CAAY,CAAC;CAEtE,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;CACF;AACF"}