@mantine/hooks 5.10.2 → 5.10.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/use-disclosure/use-disclosure.js +22 -17
- package/cjs/use-disclosure/use-disclosure.js.map +1 -1
- package/cjs/use-focus-trap/use-focus-trap.js +4 -0
- package/cjs/use-focus-trap/use-focus-trap.js.map +1 -1
- package/cjs/use-hotkeys/use-hotkeys.js +6 -3
- package/cjs/use-hotkeys/use-hotkeys.js.map +1 -1
- package/esm/use-disclosure/use-disclosure.js +23 -18
- package/esm/use-disclosure/use-disclosure.js.map +1 -1
- package/esm/use-focus-trap/use-focus-trap.js +4 -0
- package/esm/use-focus-trap/use-focus-trap.js.map +1 -1
- package/esm/use-hotkeys/use-hotkeys.js +6 -3
- package/esm/use-hotkeys/use-hotkeys.js.map +1 -1
- package/lib/use-disclosure/use-disclosure.d.ts +1 -1
- package/lib/use-disclosure/use-disclosure.d.ts.map +1 -1
- package/lib/use-focus-trap/use-focus-trap.d.ts.map +1 -1
- package/lib/use-hotkeys/use-hotkeys.d.ts +1 -1
- package/lib/use-hotkeys/use-hotkeys.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -4,25 +4,30 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
6
|
|
|
7
|
-
function useDisclosure(initialState, callbacks) {
|
|
7
|
+
function useDisclosure(initialState = false, callbacks) {
|
|
8
|
+
const { onOpen, onClose } = callbacks || {};
|
|
8
9
|
const [opened, setOpened] = React.useState(initialState);
|
|
9
|
-
const open = () => {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
(
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
10
|
+
const open = React.useCallback(() => {
|
|
11
|
+
setOpened((isOpened) => {
|
|
12
|
+
if (!isOpened) {
|
|
13
|
+
onOpen == null ? void 0 : onOpen();
|
|
14
|
+
return true;
|
|
15
|
+
}
|
|
16
|
+
return isOpened;
|
|
17
|
+
});
|
|
18
|
+
}, [onOpen]);
|
|
19
|
+
const close = React.useCallback(() => {
|
|
20
|
+
setOpened((isOpened) => {
|
|
21
|
+
if (isOpened) {
|
|
22
|
+
onClose == null ? void 0 : onClose();
|
|
23
|
+
return false;
|
|
24
|
+
}
|
|
25
|
+
return isOpened;
|
|
26
|
+
});
|
|
27
|
+
}, [onClose]);
|
|
28
|
+
const toggle = React.useCallback(() => {
|
|
24
29
|
opened ? close() : open();
|
|
25
|
-
};
|
|
30
|
+
}, [close, open, opened]);
|
|
26
31
|
return [opened, { open, close, toggle }];
|
|
27
32
|
}
|
|
28
33
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-disclosure.js","sources":["../../src/use-disclosure/use-disclosure.ts"],"sourcesContent":["import { useState } from 'react';\n\nexport function useDisclosure(\n initialState
|
|
1
|
+
{"version":3,"file":"use-disclosure.js","sources":["../../src/use-disclosure/use-disclosure.ts"],"sourcesContent":["import { useState, useCallback } from 'react';\n\nexport function useDisclosure(\n initialState = false,\n callbacks?: { onOpen?(): void; onClose?(): void }\n) {\n const { onOpen, onClose } = callbacks || {};\n const [opened, setOpened] = useState(initialState);\n\n const open = useCallback(() => {\n setOpened((isOpened) => {\n if (!isOpened) {\n onOpen?.();\n return true;\n }\n return isOpened;\n });\n }, [onOpen]);\n\n const close = useCallback(() => {\n setOpened((isOpened) => {\n if (isOpened) {\n onClose?.();\n return false;\n }\n return isOpened;\n });\n }, [onClose]);\n\n const toggle = useCallback(() => {\n opened ? close() : open();\n }, [close, open, opened]);\n\n return [opened, { open, close, toggle }] as const;\n}\n"],"names":["useState","useCallback"],"mappings":";;;;;;AACO,SAAS,aAAa,CAAC,YAAY,GAAG,KAAK,EAAE,SAAS,EAAE;AAC/D,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,IAAI,EAAE,CAAC;AAC9C,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGA,cAAQ,CAAC,YAAY,CAAC,CAAC;AACrD,EAAE,MAAM,IAAI,GAAGC,iBAAW,CAAC,MAAM;AACjC,IAAI,SAAS,CAAC,CAAC,QAAQ,KAAK;AAC5B,MAAM,IAAI,CAAC,QAAQ,EAAE;AACrB,QAAQ,MAAM,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,MAAM,EAAE,CAAC;AAC3C,QAAQ,OAAO,IAAI,CAAC;AACpB,OAAO;AACP,MAAM,OAAO,QAAQ,CAAC;AACtB,KAAK,CAAC,CAAC;AACP,GAAG,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;AACf,EAAE,MAAM,KAAK,GAAGA,iBAAW,CAAC,MAAM;AAClC,IAAI,SAAS,CAAC,CAAC,QAAQ,KAAK;AAC5B,MAAM,IAAI,QAAQ,EAAE;AACpB,QAAQ,OAAO,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,OAAO,EAAE,CAAC;AAC7C,QAAQ,OAAO,KAAK,CAAC;AACrB,OAAO;AACP,MAAM,OAAO,QAAQ,CAAC;AACtB,KAAK,CAAC,CAAC;AACP,GAAG,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;AAChB,EAAE,MAAM,MAAM,GAAGA,iBAAW,CAAC,MAAM;AACnC,IAAI,MAAM,GAAG,KAAK,EAAE,GAAG,IAAI,EAAE,CAAC;AAC9B,GAAG,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC;AAC5B,EAAE,OAAO,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAAC;AAC3C;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-focus-trap.js","sources":["../../src/use-focus-trap/use-focus-trap.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { FOCUS_SELECTOR, focusable, tabbable } from './tabbable';\nimport { scopeTab } from './scope-tab';\nimport { createAriaHider } from './create-aria-hider';\n\nexport function useFocusTrap(active = true): (instance: HTMLElement | null) => void {\n const ref = useRef<HTMLElement | null>();\n const restoreAria = useRef<Function | null>(null);\n\n const setRef = useCallback(\n (node: HTMLElement | null) => {\n if (!active) {\n return;\n }\n\n if (node === null) {\n return;\n }\n\n restoreAria.current = createAriaHider(node);\n if (ref.current === node) {\n return;\n }\n\n if (node) {\n const processNode = () => {\n let focusElement: HTMLElement = node.querySelector('[data-autofocus]');\n\n if (!focusElement) {\n const children = Array.from<HTMLElement>(node.querySelectorAll(FOCUS_SELECTOR));\n focusElement = children.find(tabbable) || children.find(focusable) || null;\n if (!focusElement && focusable(node)) focusElement = node;\n }\n\n if (focusElement) {\n focusElement.focus({ preventScroll: true });\n } else if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.warn(\n '[@mantine/hooks/use-focus-trap] Failed to find focusable element within provided node',\n node\n );\n }\n };\n\n // Delay processing the HTML node by a frame. This ensures focus is assigned correctly.\n setTimeout(() => {\n if (node.getRootNode()) {\n processNode();\n } else if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.warn('[@mantine/hooks/use-focus-trap] Ref node is not part of the dom', node);\n }\n });\n\n ref.current = node;\n } else {\n ref.current = null;\n }\n },\n [active]\n );\n\n useEffect(() => {\n if (!active) {\n return undefined;\n }\n\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Tab' && ref.current) {\n scopeTab(ref.current, event);\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n\n if (restoreAria.current) {\n restoreAria.current();\n }\n };\n }, [active]);\n\n return setRef;\n}\n"],"names":["useRef","useCallback","createAriaHider","FOCUS_SELECTOR","tabbable","focusable","useEffect","scopeTab"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"use-focus-trap.js","sources":["../../src/use-focus-trap/use-focus-trap.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { FOCUS_SELECTOR, focusable, tabbable } from './tabbable';\nimport { scopeTab } from './scope-tab';\nimport { createAriaHider } from './create-aria-hider';\n\nexport function useFocusTrap(active = true): (instance: HTMLElement | null) => void {\n const ref = useRef<HTMLElement | null>();\n const restoreAria = useRef<Function | null>(null);\n\n const setRef = useCallback(\n (node: HTMLElement | null) => {\n if (!active) {\n return;\n }\n\n if (node === null) {\n if (restoreAria.current) {\n restoreAria.current();\n restoreAria.current = null;\n }\n return;\n }\n\n restoreAria.current = createAriaHider(node);\n if (ref.current === node) {\n return;\n }\n\n if (node) {\n const processNode = () => {\n let focusElement: HTMLElement = node.querySelector('[data-autofocus]');\n\n if (!focusElement) {\n const children = Array.from<HTMLElement>(node.querySelectorAll(FOCUS_SELECTOR));\n focusElement = children.find(tabbable) || children.find(focusable) || null;\n if (!focusElement && focusable(node)) focusElement = node;\n }\n\n if (focusElement) {\n focusElement.focus({ preventScroll: true });\n } else if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.warn(\n '[@mantine/hooks/use-focus-trap] Failed to find focusable element within provided node',\n node\n );\n }\n };\n\n // Delay processing the HTML node by a frame. This ensures focus is assigned correctly.\n setTimeout(() => {\n if (node.getRootNode()) {\n processNode();\n } else if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.warn('[@mantine/hooks/use-focus-trap] Ref node is not part of the dom', node);\n }\n });\n\n ref.current = node;\n } else {\n ref.current = null;\n }\n },\n [active]\n );\n\n useEffect(() => {\n if (!active) {\n return undefined;\n }\n\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Tab' && ref.current) {\n scopeTab(ref.current, event);\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n\n if (restoreAria.current) {\n restoreAria.current();\n }\n };\n }, [active]);\n\n return setRef;\n}\n"],"names":["useRef","useCallback","createAriaHider","FOCUS_SELECTOR","tabbable","focusable","useEffect","scopeTab"],"mappings":"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"}
|
|
@@ -5,17 +5,20 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var parseHotkey = require('./parse-hotkey.js');
|
|
7
7
|
|
|
8
|
-
function shouldFireEvent(event, tagsToIgnore) {
|
|
8
|
+
function shouldFireEvent(event, tagsToIgnore, triggerOnContentEditable = false) {
|
|
9
9
|
if (event.target instanceof HTMLElement) {
|
|
10
|
+
if (triggerOnContentEditable) {
|
|
11
|
+
return !tagsToIgnore.includes(event.target.tagName);
|
|
12
|
+
}
|
|
10
13
|
return !event.target.isContentEditable && !tagsToIgnore.includes(event.target.tagName);
|
|
11
14
|
}
|
|
12
15
|
return true;
|
|
13
16
|
}
|
|
14
|
-
function useHotkeys(hotkeys, tagsToIgnore = ["INPUT", "TEXTAREA", "SELECT"]) {
|
|
17
|
+
function useHotkeys(hotkeys, tagsToIgnore = ["INPUT", "TEXTAREA", "SELECT"], triggerOnContentEditable = false) {
|
|
15
18
|
React.useEffect(() => {
|
|
16
19
|
const keydownListener = (event) => {
|
|
17
20
|
hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {
|
|
18
|
-
if (parseHotkey.getHotkeyMatcher(hotkey)(event) && shouldFireEvent(event, tagsToIgnore)) {
|
|
21
|
+
if (parseHotkey.getHotkeyMatcher(hotkey)(event) && shouldFireEvent(event, tagsToIgnore, triggerOnContentEditable)) {
|
|
19
22
|
if (options.preventDefault) {
|
|
20
23
|
event.preventDefault();
|
|
21
24
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-hotkeys.js","sources":["../../src/use-hotkeys/use-hotkeys.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport {
|
|
1
|
+
{"version":3,"file":"use-hotkeys.js","sources":["../../src/use-hotkeys/use-hotkeys.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport { getHotkeyHandler, getHotkeyMatcher, HotkeyItemOptions } from './parse-hotkey';\n\nexport type { HotkeyItemOptions };\nexport { getHotkeyHandler };\n\nexport type HotkeyItem = [string, (event: KeyboardEvent) => void, HotkeyItemOptions?];\n\nfunction shouldFireEvent(\n event: KeyboardEvent,\n tagsToIgnore: string[],\n triggerOnContentEditable = false\n) {\n if (event.target instanceof HTMLElement) {\n if (triggerOnContentEditable) {\n return !tagsToIgnore.includes(event.target.tagName);\n }\n\n return !event.target.isContentEditable && !tagsToIgnore.includes(event.target.tagName);\n }\n\n return true;\n}\n\nexport function useHotkeys(\n hotkeys: HotkeyItem[],\n tagsToIgnore: string[] = ['INPUT', 'TEXTAREA', 'SELECT'],\n triggerOnContentEditable = false\n) {\n useEffect(() => {\n const keydownListener = (event: KeyboardEvent) => {\n hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {\n if (\n getHotkeyMatcher(hotkey)(event) &&\n shouldFireEvent(event, tagsToIgnore, triggerOnContentEditable)\n ) {\n if (options.preventDefault) {\n event.preventDefault();\n }\n\n handler(event);\n }\n });\n };\n\n document.documentElement.addEventListener('keydown', keydownListener);\n return () => document.documentElement.removeEventListener('keydown', keydownListener);\n }, [hotkeys]);\n}\n"],"names":["useEffect","getHotkeyMatcher"],"mappings":";;;;;;;AAGA,SAAS,eAAe,CAAC,KAAK,EAAE,YAAY,EAAE,wBAAwB,GAAG,KAAK,EAAE;AAChF,EAAE,IAAI,KAAK,CAAC,MAAM,YAAY,WAAW,EAAE;AAC3C,IAAI,IAAI,wBAAwB,EAAE;AAClC,MAAM,OAAO,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;AAC1D,KAAK;AACL,IAAI,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,iBAAiB,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;AAC3F,GAAG;AACH,EAAE,OAAO,IAAI,CAAC;AACd,CAAC;AACM,SAAS,UAAU,CAAC,OAAO,EAAE,YAAY,GAAG,CAAC,OAAO,EAAE,UAAU,EAAE,QAAQ,CAAC,EAAE,wBAAwB,GAAG,KAAK,EAAE;AACtH,EAAEA,eAAS,CAAC,MAAM;AAClB,IAAI,MAAM,eAAe,GAAG,CAAC,KAAK,KAAK;AACvC,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EAAE,OAAO,EAAE,OAAO,GAAG,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC,KAAK;AACjF,QAAQ,IAAIC,4BAAgB,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,IAAI,eAAe,CAAC,KAAK,EAAE,YAAY,EAAE,wBAAwB,CAAC,EAAE;AAC/G,UAAU,IAAI,OAAO,CAAC,cAAc,EAAE;AACtC,YAAY,KAAK,CAAC,cAAc,EAAE,CAAC;AACnC,WAAW;AACX,UAAU,OAAO,CAAC,KAAK,CAAC,CAAC;AACzB,SAAS;AACT,OAAO,CAAC,CAAC;AACT,KAAK,CAAC;AACN,IAAI,QAAQ,CAAC,eAAe,CAAC,gBAAgB,CAAC,SAAS,EAAE,eAAe,CAAC,CAAC;AAC1E,IAAI,OAAO,MAAM,QAAQ,CAAC,eAAe,CAAC,mBAAmB,CAAC,SAAS,EAAE,eAAe,CAAC,CAAC;AAC1F,GAAG,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;AAChB;;;;;"}
|
|
@@ -1,24 +1,29 @@
|
|
|
1
|
-
import { useState } from 'react';
|
|
1
|
+
import { useState, useCallback } from 'react';
|
|
2
2
|
|
|
3
|
-
function useDisclosure(initialState, callbacks) {
|
|
3
|
+
function useDisclosure(initialState = false, callbacks) {
|
|
4
|
+
const { onOpen, onClose } = callbacks || {};
|
|
4
5
|
const [opened, setOpened] = useState(initialState);
|
|
5
|
-
const open = () => {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
(
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
6
|
+
const open = useCallback(() => {
|
|
7
|
+
setOpened((isOpened) => {
|
|
8
|
+
if (!isOpened) {
|
|
9
|
+
onOpen == null ? void 0 : onOpen();
|
|
10
|
+
return true;
|
|
11
|
+
}
|
|
12
|
+
return isOpened;
|
|
13
|
+
});
|
|
14
|
+
}, [onOpen]);
|
|
15
|
+
const close = useCallback(() => {
|
|
16
|
+
setOpened((isOpened) => {
|
|
17
|
+
if (isOpened) {
|
|
18
|
+
onClose == null ? void 0 : onClose();
|
|
19
|
+
return false;
|
|
20
|
+
}
|
|
21
|
+
return isOpened;
|
|
22
|
+
});
|
|
23
|
+
}, [onClose]);
|
|
24
|
+
const toggle = useCallback(() => {
|
|
20
25
|
opened ? close() : open();
|
|
21
|
-
};
|
|
26
|
+
}, [close, open, opened]);
|
|
22
27
|
return [opened, { open, close, toggle }];
|
|
23
28
|
}
|
|
24
29
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-disclosure.js","sources":["../../src/use-disclosure/use-disclosure.ts"],"sourcesContent":["import { useState } from 'react';\n\nexport function useDisclosure(\n initialState
|
|
1
|
+
{"version":3,"file":"use-disclosure.js","sources":["../../src/use-disclosure/use-disclosure.ts"],"sourcesContent":["import { useState, useCallback } from 'react';\n\nexport function useDisclosure(\n initialState = false,\n callbacks?: { onOpen?(): void; onClose?(): void }\n) {\n const { onOpen, onClose } = callbacks || {};\n const [opened, setOpened] = useState(initialState);\n\n const open = useCallback(() => {\n setOpened((isOpened) => {\n if (!isOpened) {\n onOpen?.();\n return true;\n }\n return isOpened;\n });\n }, [onOpen]);\n\n const close = useCallback(() => {\n setOpened((isOpened) => {\n if (isOpened) {\n onClose?.();\n return false;\n }\n return isOpened;\n });\n }, [onClose]);\n\n const toggle = useCallback(() => {\n opened ? close() : open();\n }, [close, open, opened]);\n\n return [opened, { open, close, toggle }] as const;\n}\n"],"names":[],"mappings":";;AACO,SAAS,aAAa,CAAC,YAAY,GAAG,KAAK,EAAE,SAAS,EAAE;AAC/D,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,IAAI,EAAE,CAAC;AAC9C,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;AACrD,EAAE,MAAM,IAAI,GAAG,WAAW,CAAC,MAAM;AACjC,IAAI,SAAS,CAAC,CAAC,QAAQ,KAAK;AAC5B,MAAM,IAAI,CAAC,QAAQ,EAAE;AACrB,QAAQ,MAAM,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,MAAM,EAAE,CAAC;AAC3C,QAAQ,OAAO,IAAI,CAAC;AACpB,OAAO;AACP,MAAM,OAAO,QAAQ,CAAC;AACtB,KAAK,CAAC,CAAC;AACP,GAAG,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;AACf,EAAE,MAAM,KAAK,GAAG,WAAW,CAAC,MAAM;AAClC,IAAI,SAAS,CAAC,CAAC,QAAQ,KAAK;AAC5B,MAAM,IAAI,QAAQ,EAAE;AACpB,QAAQ,OAAO,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,OAAO,EAAE,CAAC;AAC7C,QAAQ,OAAO,KAAK,CAAC;AACrB,OAAO;AACP,MAAM,OAAO,QAAQ,CAAC;AACtB,KAAK,CAAC,CAAC;AACP,GAAG,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;AAChB,EAAE,MAAM,MAAM,GAAG,WAAW,CAAC,MAAM;AACnC,IAAI,MAAM,GAAG,KAAK,EAAE,GAAG,IAAI,EAAE,CAAC;AAC9B,GAAG,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC;AAC5B,EAAE,OAAO,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAAC;AAC3C;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-focus-trap.js","sources":["../../src/use-focus-trap/use-focus-trap.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { FOCUS_SELECTOR, focusable, tabbable } from './tabbable';\nimport { scopeTab } from './scope-tab';\nimport { createAriaHider } from './create-aria-hider';\n\nexport function useFocusTrap(active = true): (instance: HTMLElement | null) => void {\n const ref = useRef<HTMLElement | null>();\n const restoreAria = useRef<Function | null>(null);\n\n const setRef = useCallback(\n (node: HTMLElement | null) => {\n if (!active) {\n return;\n }\n\n if (node === null) {\n return;\n }\n\n restoreAria.current = createAriaHider(node);\n if (ref.current === node) {\n return;\n }\n\n if (node) {\n const processNode = () => {\n let focusElement: HTMLElement = node.querySelector('[data-autofocus]');\n\n if (!focusElement) {\n const children = Array.from<HTMLElement>(node.querySelectorAll(FOCUS_SELECTOR));\n focusElement = children.find(tabbable) || children.find(focusable) || null;\n if (!focusElement && focusable(node)) focusElement = node;\n }\n\n if (focusElement) {\n focusElement.focus({ preventScroll: true });\n } else if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.warn(\n '[@mantine/hooks/use-focus-trap] Failed to find focusable element within provided node',\n node\n );\n }\n };\n\n // Delay processing the HTML node by a frame. This ensures focus is assigned correctly.\n setTimeout(() => {\n if (node.getRootNode()) {\n processNode();\n } else if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.warn('[@mantine/hooks/use-focus-trap] Ref node is not part of the dom', node);\n }\n });\n\n ref.current = node;\n } else {\n ref.current = null;\n }\n },\n [active]\n );\n\n useEffect(() => {\n if (!active) {\n return undefined;\n }\n\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Tab' && ref.current) {\n scopeTab(ref.current, event);\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n\n if (restoreAria.current) {\n restoreAria.current();\n }\n };\n }, [active]);\n\n return setRef;\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"use-focus-trap.js","sources":["../../src/use-focus-trap/use-focus-trap.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { FOCUS_SELECTOR, focusable, tabbable } from './tabbable';\nimport { scopeTab } from './scope-tab';\nimport { createAriaHider } from './create-aria-hider';\n\nexport function useFocusTrap(active = true): (instance: HTMLElement | null) => void {\n const ref = useRef<HTMLElement | null>();\n const restoreAria = useRef<Function | null>(null);\n\n const setRef = useCallback(\n (node: HTMLElement | null) => {\n if (!active) {\n return;\n }\n\n if (node === null) {\n if (restoreAria.current) {\n restoreAria.current();\n restoreAria.current = null;\n }\n return;\n }\n\n restoreAria.current = createAriaHider(node);\n if (ref.current === node) {\n return;\n }\n\n if (node) {\n const processNode = () => {\n let focusElement: HTMLElement = node.querySelector('[data-autofocus]');\n\n if (!focusElement) {\n const children = Array.from<HTMLElement>(node.querySelectorAll(FOCUS_SELECTOR));\n focusElement = children.find(tabbable) || children.find(focusable) || null;\n if (!focusElement && focusable(node)) focusElement = node;\n }\n\n if (focusElement) {\n focusElement.focus({ preventScroll: true });\n } else if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.warn(\n '[@mantine/hooks/use-focus-trap] Failed to find focusable element within provided node',\n node\n );\n }\n };\n\n // Delay processing the HTML node by a frame. This ensures focus is assigned correctly.\n setTimeout(() => {\n if (node.getRootNode()) {\n processNode();\n } else if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.warn('[@mantine/hooks/use-focus-trap] Ref node is not part of the dom', node);\n }\n });\n\n ref.current = node;\n } else {\n ref.current = null;\n }\n },\n [active]\n );\n\n useEffect(() => {\n if (!active) {\n return undefined;\n }\n\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Tab' && ref.current) {\n scopeTab(ref.current, event);\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n\n if (restoreAria.current) {\n restoreAria.current();\n }\n };\n }, [active]);\n\n return setRef;\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -2,17 +2,20 @@ import { useEffect } from 'react';
|
|
|
2
2
|
import { getHotkeyMatcher } from './parse-hotkey.js';
|
|
3
3
|
export { getHotkeyHandler } from './parse-hotkey.js';
|
|
4
4
|
|
|
5
|
-
function shouldFireEvent(event, tagsToIgnore) {
|
|
5
|
+
function shouldFireEvent(event, tagsToIgnore, triggerOnContentEditable = false) {
|
|
6
6
|
if (event.target instanceof HTMLElement) {
|
|
7
|
+
if (triggerOnContentEditable) {
|
|
8
|
+
return !tagsToIgnore.includes(event.target.tagName);
|
|
9
|
+
}
|
|
7
10
|
return !event.target.isContentEditable && !tagsToIgnore.includes(event.target.tagName);
|
|
8
11
|
}
|
|
9
12
|
return true;
|
|
10
13
|
}
|
|
11
|
-
function useHotkeys(hotkeys, tagsToIgnore = ["INPUT", "TEXTAREA", "SELECT"]) {
|
|
14
|
+
function useHotkeys(hotkeys, tagsToIgnore = ["INPUT", "TEXTAREA", "SELECT"], triggerOnContentEditable = false) {
|
|
12
15
|
useEffect(() => {
|
|
13
16
|
const keydownListener = (event) => {
|
|
14
17
|
hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {
|
|
15
|
-
if (getHotkeyMatcher(hotkey)(event) && shouldFireEvent(event, tagsToIgnore)) {
|
|
18
|
+
if (getHotkeyMatcher(hotkey)(event) && shouldFireEvent(event, tagsToIgnore, triggerOnContentEditable)) {
|
|
16
19
|
if (options.preventDefault) {
|
|
17
20
|
event.preventDefault();
|
|
18
21
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-hotkeys.js","sources":["../../src/use-hotkeys/use-hotkeys.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport {
|
|
1
|
+
{"version":3,"file":"use-hotkeys.js","sources":["../../src/use-hotkeys/use-hotkeys.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport { getHotkeyHandler, getHotkeyMatcher, HotkeyItemOptions } from './parse-hotkey';\n\nexport type { HotkeyItemOptions };\nexport { getHotkeyHandler };\n\nexport type HotkeyItem = [string, (event: KeyboardEvent) => void, HotkeyItemOptions?];\n\nfunction shouldFireEvent(\n event: KeyboardEvent,\n tagsToIgnore: string[],\n triggerOnContentEditable = false\n) {\n if (event.target instanceof HTMLElement) {\n if (triggerOnContentEditable) {\n return !tagsToIgnore.includes(event.target.tagName);\n }\n\n return !event.target.isContentEditable && !tagsToIgnore.includes(event.target.tagName);\n }\n\n return true;\n}\n\nexport function useHotkeys(\n hotkeys: HotkeyItem[],\n tagsToIgnore: string[] = ['INPUT', 'TEXTAREA', 'SELECT'],\n triggerOnContentEditable = false\n) {\n useEffect(() => {\n const keydownListener = (event: KeyboardEvent) => {\n hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {\n if (\n getHotkeyMatcher(hotkey)(event) &&\n shouldFireEvent(event, tagsToIgnore, triggerOnContentEditable)\n ) {\n if (options.preventDefault) {\n event.preventDefault();\n }\n\n handler(event);\n }\n });\n };\n\n document.documentElement.addEventListener('keydown', keydownListener);\n return () => document.documentElement.removeEventListener('keydown', keydownListener);\n }, [hotkeys]);\n}\n"],"names":[],"mappings":";;;;AAGA,SAAS,eAAe,CAAC,KAAK,EAAE,YAAY,EAAE,wBAAwB,GAAG,KAAK,EAAE;AAChF,EAAE,IAAI,KAAK,CAAC,MAAM,YAAY,WAAW,EAAE;AAC3C,IAAI,IAAI,wBAAwB,EAAE;AAClC,MAAM,OAAO,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;AAC1D,KAAK;AACL,IAAI,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,iBAAiB,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;AAC3F,GAAG;AACH,EAAE,OAAO,IAAI,CAAC;AACd,CAAC;AACM,SAAS,UAAU,CAAC,OAAO,EAAE,YAAY,GAAG,CAAC,OAAO,EAAE,UAAU,EAAE,QAAQ,CAAC,EAAE,wBAAwB,GAAG,KAAK,EAAE;AACtH,EAAE,SAAS,CAAC,MAAM;AAClB,IAAI,MAAM,eAAe,GAAG,CAAC,KAAK,KAAK;AACvC,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EAAE,OAAO,EAAE,OAAO,GAAG,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC,KAAK;AACjF,QAAQ,IAAI,gBAAgB,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,IAAI,eAAe,CAAC,KAAK,EAAE,YAAY,EAAE,wBAAwB,CAAC,EAAE;AAC/G,UAAU,IAAI,OAAO,CAAC,cAAc,EAAE;AACtC,YAAY,KAAK,CAAC,cAAc,EAAE,CAAC;AACnC,WAAW;AACX,UAAU,OAAO,CAAC,KAAK,CAAC,CAAC;AACzB,SAAS;AACT,OAAO,CAAC,CAAC;AACT,KAAK,CAAC;AACN,IAAI,QAAQ,CAAC,eAAe,CAAC,gBAAgB,CAAC,SAAS,EAAE,eAAe,CAAC,CAAC;AAC1E,IAAI,OAAO,MAAM,QAAQ,CAAC,eAAe,CAAC,mBAAmB,CAAC,SAAS,EAAE,eAAe,CAAC,CAAC;AAC1F,GAAG,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;AAChB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-disclosure.d.ts","sourceRoot":"","sources":["../../src/use-disclosure/use-disclosure.ts"],"names":[],"mappings":"AAEA,wBAAgB,aAAa,CAC3B,YAAY,
|
|
1
|
+
{"version":3,"file":"use-disclosure.d.ts","sourceRoot":"","sources":["../../src/use-disclosure/use-disclosure.ts"],"names":[],"mappings":"AAEA,wBAAgB,aAAa,CAC3B,YAAY,UAAQ,EACpB,SAAS,CAAC,EAAE;IAAE,MAAM,CAAC,IAAI,IAAI,CAAC;IAAC,OAAO,CAAC,IAAI,IAAI,CAAA;CAAE;;;;GA8BlD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-focus-trap.d.ts","sourceRoot":"","sources":["../../src/use-focus-trap/use-focus-trap.ts"],"names":[],"mappings":"AAKA,wBAAgB,YAAY,CAAC,MAAM,UAAO,GAAG,CAAC,QAAQ,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,
|
|
1
|
+
{"version":3,"file":"use-focus-trap.d.ts","sourceRoot":"","sources":["../../src/use-focus-trap/use-focus-trap.ts"],"names":[],"mappings":"AAKA,wBAAgB,YAAY,CAAC,MAAM,UAAO,GAAG,CAAC,QAAQ,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAoFlF"}
|
|
@@ -2,5 +2,5 @@ import { getHotkeyHandler, HotkeyItemOptions } from './parse-hotkey';
|
|
|
2
2
|
export type { HotkeyItemOptions };
|
|
3
3
|
export { getHotkeyHandler };
|
|
4
4
|
export type HotkeyItem = [string, (event: KeyboardEvent) => void, HotkeyItemOptions?];
|
|
5
|
-
export declare function useHotkeys(hotkeys: HotkeyItem[], tagsToIgnore?: string[]): void;
|
|
5
|
+
export declare function useHotkeys(hotkeys: HotkeyItem[], tagsToIgnore?: string[], triggerOnContentEditable?: boolean): void;
|
|
6
6
|
//# sourceMappingURL=use-hotkeys.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-hotkeys.d.ts","sourceRoot":"","sources":["../../src/use-hotkeys/use-hotkeys.ts"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"use-hotkeys.d.ts","sourceRoot":"","sources":["../../src/use-hotkeys/use-hotkeys.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAoB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAEvF,YAAY,EAAE,iBAAiB,EAAE,CAAC;AAClC,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAE5B,MAAM,MAAM,UAAU,GAAG,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,EAAE,iBAAiB,CAAC,CAAC,CAAC;AAkBtF,wBAAgB,UAAU,CACxB,OAAO,EAAE,UAAU,EAAE,EACrB,YAAY,GAAE,MAAM,EAAoC,EACxD,wBAAwB,UAAQ,QAqBjC"}
|