@mantine/hooks 5.1.4 → 5.1.7
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-hotkeys/parse-hotkey.js +3 -2
- package/cjs/use-hotkeys/parse-hotkey.js.map +1 -1
- package/cjs/use-id/use-id.js +2 -2
- package/cjs/use-id/use-id.js.map +1 -1
- package/cjs/use-interval/use-interval.js +2 -1
- package/cjs/use-interval/use-interval.js.map +1 -1
- package/cjs/use-viewport-size/use-viewport-size.js +1 -0
- package/cjs/use-viewport-size/use-viewport-size.js.map +1 -1
- package/esm/use-hotkeys/parse-hotkey.js +3 -2
- package/esm/use-hotkeys/parse-hotkey.js.map +1 -1
- package/esm/use-id/use-id.js +2 -2
- package/esm/use-id/use-id.js.map +1 -1
- package/esm/use-interval/use-interval.js +2 -1
- package/esm/use-interval/use-interval.js.map +1 -1
- package/esm/use-viewport-size/use-viewport-size.js +2 -1
- package/esm/use-viewport-size/use-viewport-size.js.map +1 -1
- package/lib/use-hotkeys/parse-hotkey.d.ts +2 -2
- package/lib/use-hotkeys/parse-hotkey.d.ts.map +1 -1
- package/lib/use-id/use-id.d.ts.map +1 -1
- package/lib/use-interval/use-interval.d.ts.map +1 -1
- package/lib/use-viewport-size/use-viewport-size.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -67,10 +67,11 @@ function getHotkeyMatcher(hotkey) {
|
|
|
67
67
|
}
|
|
68
68
|
function getHotkeyHandler(hotkeys) {
|
|
69
69
|
return (event) => {
|
|
70
|
+
const _event = "nativeEvent" in event ? event.nativeEvent : event;
|
|
70
71
|
hotkeys.forEach(([hotkey, handler]) => {
|
|
71
|
-
if (getHotkeyMatcher(hotkey)(
|
|
72
|
+
if (getHotkeyMatcher(hotkey)(_event)) {
|
|
72
73
|
event.preventDefault();
|
|
73
|
-
handler(
|
|
74
|
+
handler(_event);
|
|
74
75
|
}
|
|
75
76
|
});
|
|
76
77
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"parse-hotkey.js","sources":["../../src/use-hotkeys/parse-hotkey.ts"],"sourcesContent":["export type KeyboardModifiers = {\n alt: boolean;\n ctrl: boolean;\n meta: boolean;\n mod: boolean;\n shift: boolean;\n};\n\nexport type Hotkey = KeyboardModifiers & {\n key?: string;\n};\n\ntype CheckHotkeyMatch = (event: KeyboardEvent) => boolean;\n\nexport function parseHotkey(hotkey: string): Hotkey {\n const keys = hotkey\n .toLowerCase()\n .split('+')\n .map((part) => part.trim());\n\n const modifiers: KeyboardModifiers = {\n alt: keys.includes('alt'),\n ctrl: keys.includes('ctrl'),\n meta: keys.includes('meta'),\n mod: keys.includes('mod'),\n shift: keys.includes('shift'),\n };\n\n const reservedKeys = ['alt', 'ctrl', 'meta', 'shift', 'mod'];\n\n const freeKey = keys.find((key) => !reservedKeys.includes(key));\n\n return {\n ...modifiers,\n key: freeKey,\n };\n}\n\nfunction isExactHotkey(hotkey: Hotkey, event: KeyboardEvent): boolean {\n const { alt, ctrl, meta, mod, shift, key } = hotkey;\n const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKey } = event;\n\n if (alt !== altKey) {\n return false;\n }\n\n if (mod) {\n if (!ctrlKey && !metaKey) {\n return false;\n }\n } else {\n if (ctrl !== ctrlKey) {\n return false;\n }\n if (meta !== metaKey) {\n return false;\n }\n }\n if (shift !== shiftKey) {\n return false;\n }\n\n if (\n key &&\n (pressedKey.toLowerCase() === key.toLowerCase() ||\n event.code.replace('Key', '').toLowerCase() === key.toLowerCase())\n ) {\n return true;\n }\n\n return false;\n}\n\nexport function getHotkeyMatcher(hotkey: string): CheckHotkeyMatch {\n return (event) => isExactHotkey(parseHotkey(hotkey), event);\n}\n\ntype HotkeyItem = [string, (event: React.KeyboardEvent<HTMLElement>) => void];\n\nexport function getHotkeyHandler(hotkeys: HotkeyItem[]) {\n return (event: React.KeyboardEvent<HTMLElement>) => {\n hotkeys.forEach(([hotkey, handler]) => {\n if (getHotkeyMatcher(hotkey)(
|
|
1
|
+
{"version":3,"file":"parse-hotkey.js","sources":["../../src/use-hotkeys/parse-hotkey.ts"],"sourcesContent":["export type KeyboardModifiers = {\n alt: boolean;\n ctrl: boolean;\n meta: boolean;\n mod: boolean;\n shift: boolean;\n};\n\nexport type Hotkey = KeyboardModifiers & {\n key?: string;\n};\n\ntype CheckHotkeyMatch = (event: KeyboardEvent) => boolean;\n\nexport function parseHotkey(hotkey: string): Hotkey {\n const keys = hotkey\n .toLowerCase()\n .split('+')\n .map((part) => part.trim());\n\n const modifiers: KeyboardModifiers = {\n alt: keys.includes('alt'),\n ctrl: keys.includes('ctrl'),\n meta: keys.includes('meta'),\n mod: keys.includes('mod'),\n shift: keys.includes('shift'),\n };\n\n const reservedKeys = ['alt', 'ctrl', 'meta', 'shift', 'mod'];\n\n const freeKey = keys.find((key) => !reservedKeys.includes(key));\n\n return {\n ...modifiers,\n key: freeKey,\n };\n}\n\nfunction isExactHotkey(hotkey: Hotkey, event: KeyboardEvent): boolean {\n const { alt, ctrl, meta, mod, shift, key } = hotkey;\n const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKey } = event;\n\n if (alt !== altKey) {\n return false;\n }\n\n if (mod) {\n if (!ctrlKey && !metaKey) {\n return false;\n }\n } else {\n if (ctrl !== ctrlKey) {\n return false;\n }\n if (meta !== metaKey) {\n return false;\n }\n }\n if (shift !== shiftKey) {\n return false;\n }\n\n if (\n key &&\n (pressedKey.toLowerCase() === key.toLowerCase() ||\n event.code.replace('Key', '').toLowerCase() === key.toLowerCase())\n ) {\n return true;\n }\n\n return false;\n}\n\nexport function getHotkeyMatcher(hotkey: string): CheckHotkeyMatch {\n return (event) => isExactHotkey(parseHotkey(hotkey), event);\n}\n\ntype HotkeyItem = [string, (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => void];\n\nexport function getHotkeyHandler(hotkeys: HotkeyItem[]) {\n return (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => {\n const _event = 'nativeEvent' in event ? event.nativeEvent : event;\n hotkeys.forEach(([hotkey, handler]) => {\n if (getHotkeyMatcher(hotkey)(_event)) {\n event.preventDefault();\n handler(_event);\n }\n });\n };\n}\n"],"names":[],"mappings":"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"}
|
package/cjs/use-id/use-id.js
CHANGED
|
@@ -3,17 +3,17 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
+
var useIsomorphicEffect = require('../use-isomorphic-effect/use-isomorphic-effect.js');
|
|
6
7
|
|
|
7
8
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; }
|
|
8
9
|
|
|
9
10
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
10
11
|
|
|
11
12
|
const randomId = () => `mantine-${Math.random().toString(36).slice(2, 11)}`;
|
|
12
|
-
const useIsomorphicEffect = typeof document !== "undefined" ? React.useLayoutEffect : React.useEffect;
|
|
13
13
|
const useReactId = React__default["useId".toString()] || (() => void 0);
|
|
14
14
|
function useClientId() {
|
|
15
15
|
const [uuid, setUuid] = React.useState("");
|
|
16
|
-
useIsomorphicEffect(() => {
|
|
16
|
+
useIsomorphicEffect.useIsomorphicEffect(() => {
|
|
17
17
|
setUuid(randomId());
|
|
18
18
|
}, []);
|
|
19
19
|
return uuid;
|
package/cjs/use-id/use-id.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-id.js","sources":["../../src/use-id/use-id.ts"],"sourcesContent":["import React, { useState
|
|
1
|
+
{"version":3,"file":"use-id.js","sources":["../../src/use-id/use-id.ts"],"sourcesContent":["import React, { useState } from 'react';\nimport { useIsomorphicEffect } from '../use-isomorphic-effect/use-isomorphic-effect';\n\nconst randomId = () => `mantine-${Math.random().toString(36).slice(2, 11)}`;\n\nconst useReactId: () => string | undefined =\n (React as any)['useId'.toString()] || (() => undefined);\n\nfunction useClientId() {\n const [uuid, setUuid] = useState('');\n\n useIsomorphicEffect(() => {\n setUuid(randomId());\n }, []);\n\n return uuid;\n}\n\nfunction getReactId() {\n const id = useReactId();\n return id ? `mantine-${id.replace(/:/g, '')}` : '';\n}\n\nexport function useId(staticId?: string) {\n return typeof staticId === 'string' ? staticId : getReactId() || useClientId();\n}\n"],"names":["React","useState","useIsomorphicEffect"],"mappings":";;;;;;;;;;;AAEA,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;AAC5E,MAAM,UAAU,GAAGA,cAAK,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,MAAM,KAAK,CAAC,CAAC,CAAC;AAC/D,SAAS,WAAW,GAAG;AACvB,EAAE,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAGC,cAAQ,CAAC,EAAE,CAAC,CAAC;AACvC,EAAEC,uCAAmB,CAAC,MAAM;AAC5B,IAAI,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC;AACxB,GAAG,EAAE,EAAE,CAAC,CAAC;AACT,EAAE,OAAO,IAAI,CAAC;AACd,CAAC;AACD,SAAS,UAAU,GAAG;AACtB,EAAE,MAAM,EAAE,GAAG,UAAU,EAAE,CAAC;AAC1B,EAAE,OAAO,EAAE,GAAG,CAAC,QAAQ,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC;AACrD,CAAC;AACM,SAAS,KAAK,CAAC,QAAQ,EAAE;AAChC,EAAE,OAAO,OAAO,QAAQ,KAAK,QAAQ,GAAG,QAAQ,GAAG,UAAU,EAAE,IAAI,WAAW,EAAE,CAAC;AACjF;;;;"}
|
|
@@ -13,7 +13,7 @@ function useInterval(fn, interval) {
|
|
|
13
13
|
}, [fn]);
|
|
14
14
|
const start = () => {
|
|
15
15
|
setActive((old) => {
|
|
16
|
-
if (!old) {
|
|
16
|
+
if (!old && !intervalRef.current) {
|
|
17
17
|
intervalRef.current = window.setInterval(fnRef.current, interval);
|
|
18
18
|
}
|
|
19
19
|
return true;
|
|
@@ -22,6 +22,7 @@ function useInterval(fn, interval) {
|
|
|
22
22
|
const stop = () => {
|
|
23
23
|
setActive(false);
|
|
24
24
|
window.clearInterval(intervalRef.current);
|
|
25
|
+
intervalRef.current = void 0;
|
|
25
26
|
};
|
|
26
27
|
const toggle = () => {
|
|
27
28
|
if (active) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-interval.js","sources":["../../src/use-interval/use-interval.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nexport function useInterval(fn: () => void, interval: number) {\n const [active, setActive] = useState(false);\n const intervalRef = useRef<number>();\n const fnRef = useRef<() => void>();\n\n useEffect(() => {\n fnRef.current = fn;\n }, [fn]);\n\n const start = () => {\n setActive((old) => {\n if (!old) {\n intervalRef.current = window.setInterval(fnRef.current, interval);\n }\n return true;\n });\n };\n\n const stop = () => {\n setActive(false);\n window.clearInterval(intervalRef.current);\n };\n\n const toggle = () => {\n if (active) {\n stop();\n } else {\n start();\n }\n };\n\n return { start, stop, toggle, active };\n}\n"],"names":["useState","useRef","useEffect"],"mappings":";;;;;;AACO,SAAS,WAAW,CAAC,EAAE,EAAE,QAAQ,EAAE;AAC1C,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGA,cAAQ,CAAC,KAAK,CAAC,CAAC;AAC9C,EAAE,MAAM,WAAW,GAAGC,YAAM,EAAE,CAAC;AAC/B,EAAE,MAAM,KAAK,GAAGA,YAAM,EAAE,CAAC;AACzB,EAAEC,eAAS,CAAC,MAAM;AAClB,IAAI,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC;AACvB,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;AACX,EAAE,MAAM,KAAK,GAAG,MAAM;AACtB,IAAI,SAAS,CAAC,CAAC,GAAG,KAAK;AACvB,MAAM,IAAI,CAAC,GAAG,EAAE;
|
|
1
|
+
{"version":3,"file":"use-interval.js","sources":["../../src/use-interval/use-interval.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nexport function useInterval(fn: () => void, interval: number) {\n const [active, setActive] = useState(false);\n const intervalRef = useRef<number>();\n const fnRef = useRef<() => void>();\n\n useEffect(() => {\n fnRef.current = fn;\n }, [fn]);\n\n const start = () => {\n setActive((old) => {\n if (!old && !intervalRef.current) {\n intervalRef.current = window.setInterval(fnRef.current, interval);\n }\n return true;\n });\n };\n\n const stop = () => {\n setActive(false);\n window.clearInterval(intervalRef.current);\n intervalRef.current = undefined;\n };\n\n const toggle = () => {\n if (active) {\n stop();\n } else {\n start();\n }\n };\n\n return { start, stop, toggle, active };\n}\n"],"names":["useState","useRef","useEffect"],"mappings":";;;;;;AACO,SAAS,WAAW,CAAC,EAAE,EAAE,QAAQ,EAAE;AAC1C,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGA,cAAQ,CAAC,KAAK,CAAC,CAAC;AAC9C,EAAE,MAAM,WAAW,GAAGC,YAAM,EAAE,CAAC;AAC/B,EAAE,MAAM,KAAK,GAAGA,YAAM,EAAE,CAAC;AACzB,EAAEC,eAAS,CAAC,MAAM;AAClB,IAAI,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC;AACvB,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;AACX,EAAE,MAAM,KAAK,GAAG,MAAM;AACtB,IAAI,SAAS,CAAC,CAAC,GAAG,KAAK;AACvB,MAAM,IAAI,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE;AACxC,QAAQ,WAAW,CAAC,OAAO,GAAG,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;AAC1E,OAAO;AACP,MAAM,OAAO,IAAI,CAAC;AAClB,KAAK,CAAC,CAAC;AACP,GAAG,CAAC;AACJ,EAAE,MAAM,IAAI,GAAG,MAAM;AACrB,IAAI,SAAS,CAAC,KAAK,CAAC,CAAC;AACrB,IAAI,MAAM,CAAC,aAAa,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;AAC9C,IAAI,WAAW,CAAC,OAAO,GAAG,KAAK,CAAC,CAAC;AACjC,GAAG,CAAC;AACJ,EAAE,MAAM,MAAM,GAAG,MAAM;AACvB,IAAI,IAAI,MAAM,EAAE;AAChB,MAAM,IAAI,EAAE,CAAC;AACb,KAAK,MAAM;AACX,MAAM,KAAK,EAAE,CAAC;AACd,KAAK;AACL,GAAG,CAAC;AACJ,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC;AACzC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-viewport-size.js","sources":["../../src/use-viewport-size/use-viewport-size.ts"],"sourcesContent":["import { useCallback, useState } from 'react';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\n\nconst eventListerOptions = {\n passive: true,\n};\n\nexport function useViewportSize() {\n const [windowSize, setWindowSize] = useState({\n width: 0,\n height: 0,\n });\n\n const setSize = useCallback(() => {\n setWindowSize({ width: window.innerWidth || 0, height: window.innerHeight || 0 });\n }, []);\n\n useWindowEvent('resize', setSize, eventListerOptions);\n useWindowEvent('orientationchange', setSize, eventListerOptions);\n\n return windowSize;\n}\n"],"names":["useState","useCallback","useWindowEvent"],"mappings":";;;;;;;AAEA,MAAM,kBAAkB,GAAG;AAC3B,EAAE,OAAO,EAAE,IAAI;AACf,CAAC,CAAC;AACK,SAAS,eAAe,GAAG;AAClC,EAAE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAGA,cAAQ,CAAC;AAC/C,IAAI,KAAK,EAAE,CAAC;AACZ,IAAI,MAAM,EAAE,CAAC;AACb,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,OAAO,GAAGC,iBAAW,CAAC,MAAM;AACpC,IAAI,aAAa,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,UAAU,IAAI,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,WAAW,IAAI,CAAC,EAAE,CAAC,CAAC;AACtF,GAAG,EAAE,EAAE,CAAC,CAAC;AACT,EAAEC,6BAAc,CAAC,QAAQ,EAAE,OAAO,EAAE,kBAAkB,CAAC,CAAC;AACxD,EAAEA,6BAAc,CAAC,mBAAmB,EAAE,OAAO,EAAE,kBAAkB,CAAC,CAAC;AACnE,EAAE,OAAO,UAAU,CAAC;AACpB;;;;"}
|
|
1
|
+
{"version":3,"file":"use-viewport-size.js","sources":["../../src/use-viewport-size/use-viewport-size.ts"],"sourcesContent":["import { useCallback, useState, useEffect } from 'react';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\n\nconst eventListerOptions = {\n passive: true,\n};\n\nexport function useViewportSize() {\n const [windowSize, setWindowSize] = useState({\n width: 0,\n height: 0,\n });\n\n const setSize = useCallback(() => {\n setWindowSize({ width: window.innerWidth || 0, height: window.innerHeight || 0 });\n }, []);\n\n useWindowEvent('resize', setSize, eventListerOptions);\n useWindowEvent('orientationchange', setSize, eventListerOptions);\n useEffect(setSize, []);\n\n return windowSize;\n}\n"],"names":["useState","useCallback","useWindowEvent","useEffect"],"mappings":";;;;;;;AAEA,MAAM,kBAAkB,GAAG;AAC3B,EAAE,OAAO,EAAE,IAAI;AACf,CAAC,CAAC;AACK,SAAS,eAAe,GAAG;AAClC,EAAE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAGA,cAAQ,CAAC;AAC/C,IAAI,KAAK,EAAE,CAAC;AACZ,IAAI,MAAM,EAAE,CAAC;AACb,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,OAAO,GAAGC,iBAAW,CAAC,MAAM;AACpC,IAAI,aAAa,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,UAAU,IAAI,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,WAAW,IAAI,CAAC,EAAE,CAAC,CAAC;AACtF,GAAG,EAAE,EAAE,CAAC,CAAC;AACT,EAAEC,6BAAc,CAAC,QAAQ,EAAE,OAAO,EAAE,kBAAkB,CAAC,CAAC;AACxD,EAAEA,6BAAc,CAAC,mBAAmB,EAAE,OAAO,EAAE,kBAAkB,CAAC,CAAC;AACnE,EAAEC,eAAS,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;AACzB,EAAE,OAAO,UAAU,CAAC;AACpB;;;;"}
|
|
@@ -63,10 +63,11 @@ function getHotkeyMatcher(hotkey) {
|
|
|
63
63
|
}
|
|
64
64
|
function getHotkeyHandler(hotkeys) {
|
|
65
65
|
return (event) => {
|
|
66
|
+
const _event = "nativeEvent" in event ? event.nativeEvent : event;
|
|
66
67
|
hotkeys.forEach(([hotkey, handler]) => {
|
|
67
|
-
if (getHotkeyMatcher(hotkey)(
|
|
68
|
+
if (getHotkeyMatcher(hotkey)(_event)) {
|
|
68
69
|
event.preventDefault();
|
|
69
|
-
handler(
|
|
70
|
+
handler(_event);
|
|
70
71
|
}
|
|
71
72
|
});
|
|
72
73
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"parse-hotkey.js","sources":["../../src/use-hotkeys/parse-hotkey.ts"],"sourcesContent":["export type KeyboardModifiers = {\n alt: boolean;\n ctrl: boolean;\n meta: boolean;\n mod: boolean;\n shift: boolean;\n};\n\nexport type Hotkey = KeyboardModifiers & {\n key?: string;\n};\n\ntype CheckHotkeyMatch = (event: KeyboardEvent) => boolean;\n\nexport function parseHotkey(hotkey: string): Hotkey {\n const keys = hotkey\n .toLowerCase()\n .split('+')\n .map((part) => part.trim());\n\n const modifiers: KeyboardModifiers = {\n alt: keys.includes('alt'),\n ctrl: keys.includes('ctrl'),\n meta: keys.includes('meta'),\n mod: keys.includes('mod'),\n shift: keys.includes('shift'),\n };\n\n const reservedKeys = ['alt', 'ctrl', 'meta', 'shift', 'mod'];\n\n const freeKey = keys.find((key) => !reservedKeys.includes(key));\n\n return {\n ...modifiers,\n key: freeKey,\n };\n}\n\nfunction isExactHotkey(hotkey: Hotkey, event: KeyboardEvent): boolean {\n const { alt, ctrl, meta, mod, shift, key } = hotkey;\n const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKey } = event;\n\n if (alt !== altKey) {\n return false;\n }\n\n if (mod) {\n if (!ctrlKey && !metaKey) {\n return false;\n }\n } else {\n if (ctrl !== ctrlKey) {\n return false;\n }\n if (meta !== metaKey) {\n return false;\n }\n }\n if (shift !== shiftKey) {\n return false;\n }\n\n if (\n key &&\n (pressedKey.toLowerCase() === key.toLowerCase() ||\n event.code.replace('Key', '').toLowerCase() === key.toLowerCase())\n ) {\n return true;\n }\n\n return false;\n}\n\nexport function getHotkeyMatcher(hotkey: string): CheckHotkeyMatch {\n return (event) => isExactHotkey(parseHotkey(hotkey), event);\n}\n\ntype HotkeyItem = [string, (event: React.KeyboardEvent<HTMLElement>) => void];\n\nexport function getHotkeyHandler(hotkeys: HotkeyItem[]) {\n return (event: React.KeyboardEvent<HTMLElement>) => {\n hotkeys.forEach(([hotkey, handler]) => {\n if (getHotkeyMatcher(hotkey)(
|
|
1
|
+
{"version":3,"file":"parse-hotkey.js","sources":["../../src/use-hotkeys/parse-hotkey.ts"],"sourcesContent":["export type KeyboardModifiers = {\n alt: boolean;\n ctrl: boolean;\n meta: boolean;\n mod: boolean;\n shift: boolean;\n};\n\nexport type Hotkey = KeyboardModifiers & {\n key?: string;\n};\n\ntype CheckHotkeyMatch = (event: KeyboardEvent) => boolean;\n\nexport function parseHotkey(hotkey: string): Hotkey {\n const keys = hotkey\n .toLowerCase()\n .split('+')\n .map((part) => part.trim());\n\n const modifiers: KeyboardModifiers = {\n alt: keys.includes('alt'),\n ctrl: keys.includes('ctrl'),\n meta: keys.includes('meta'),\n mod: keys.includes('mod'),\n shift: keys.includes('shift'),\n };\n\n const reservedKeys = ['alt', 'ctrl', 'meta', 'shift', 'mod'];\n\n const freeKey = keys.find((key) => !reservedKeys.includes(key));\n\n return {\n ...modifiers,\n key: freeKey,\n };\n}\n\nfunction isExactHotkey(hotkey: Hotkey, event: KeyboardEvent): boolean {\n const { alt, ctrl, meta, mod, shift, key } = hotkey;\n const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKey } = event;\n\n if (alt !== altKey) {\n return false;\n }\n\n if (mod) {\n if (!ctrlKey && !metaKey) {\n return false;\n }\n } else {\n if (ctrl !== ctrlKey) {\n return false;\n }\n if (meta !== metaKey) {\n return false;\n }\n }\n if (shift !== shiftKey) {\n return false;\n }\n\n if (\n key &&\n (pressedKey.toLowerCase() === key.toLowerCase() ||\n event.code.replace('Key', '').toLowerCase() === key.toLowerCase())\n ) {\n return true;\n }\n\n return false;\n}\n\nexport function getHotkeyMatcher(hotkey: string): CheckHotkeyMatch {\n return (event) => isExactHotkey(parseHotkey(hotkey), event);\n}\n\ntype HotkeyItem = [string, (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => void];\n\nexport function getHotkeyHandler(hotkeys: HotkeyItem[]) {\n return (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => {\n const _event = 'nativeEvent' in event ? event.nativeEvent : event;\n hotkeys.forEach(([hotkey, handler]) => {\n if (getHotkeyMatcher(hotkey)(_event)) {\n event.preventDefault();\n handler(_event);\n }\n });\n };\n}\n"],"names":[],"mappings":"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"}
|
package/esm/use-id/use-id.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import React, { useState
|
|
1
|
+
import React, { useState } from 'react';
|
|
2
|
+
import { useIsomorphicEffect } from '../use-isomorphic-effect/use-isomorphic-effect.js';
|
|
2
3
|
|
|
3
4
|
const randomId = () => `mantine-${Math.random().toString(36).slice(2, 11)}`;
|
|
4
|
-
const useIsomorphicEffect = typeof document !== "undefined" ? useLayoutEffect : useEffect;
|
|
5
5
|
const useReactId = React["useId".toString()] || (() => void 0);
|
|
6
6
|
function useClientId() {
|
|
7
7
|
const [uuid, setUuid] = useState("");
|
package/esm/use-id/use-id.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-id.js","sources":["../../src/use-id/use-id.ts"],"sourcesContent":["import React, { useState
|
|
1
|
+
{"version":3,"file":"use-id.js","sources":["../../src/use-id/use-id.ts"],"sourcesContent":["import React, { useState } from 'react';\nimport { useIsomorphicEffect } from '../use-isomorphic-effect/use-isomorphic-effect';\n\nconst randomId = () => `mantine-${Math.random().toString(36).slice(2, 11)}`;\n\nconst useReactId: () => string | undefined =\n (React as any)['useId'.toString()] || (() => undefined);\n\nfunction useClientId() {\n const [uuid, setUuid] = useState('');\n\n useIsomorphicEffect(() => {\n setUuid(randomId());\n }, []);\n\n return uuid;\n}\n\nfunction getReactId() {\n const id = useReactId();\n return id ? `mantine-${id.replace(/:/g, '')}` : '';\n}\n\nexport function useId(staticId?: string) {\n return typeof staticId === 'string' ? staticId : getReactId() || useClientId();\n}\n"],"names":[],"mappings":";;;AAEA,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;AAC5E,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,MAAM,KAAK,CAAC,CAAC,CAAC;AAC/D,SAAS,WAAW,GAAG;AACvB,EAAE,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;AACvC,EAAE,mBAAmB,CAAC,MAAM;AAC5B,IAAI,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC;AACxB,GAAG,EAAE,EAAE,CAAC,CAAC;AACT,EAAE,OAAO,IAAI,CAAC;AACd,CAAC;AACD,SAAS,UAAU,GAAG;AACtB,EAAE,MAAM,EAAE,GAAG,UAAU,EAAE,CAAC;AAC1B,EAAE,OAAO,EAAE,GAAG,CAAC,QAAQ,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC;AACrD,CAAC;AACM,SAAS,KAAK,CAAC,QAAQ,EAAE;AAChC,EAAE,OAAO,OAAO,QAAQ,KAAK,QAAQ,GAAG,QAAQ,GAAG,UAAU,EAAE,IAAI,WAAW,EAAE,CAAC;AACjF;;;;"}
|
|
@@ -9,7 +9,7 @@ function useInterval(fn, interval) {
|
|
|
9
9
|
}, [fn]);
|
|
10
10
|
const start = () => {
|
|
11
11
|
setActive((old) => {
|
|
12
|
-
if (!old) {
|
|
12
|
+
if (!old && !intervalRef.current) {
|
|
13
13
|
intervalRef.current = window.setInterval(fnRef.current, interval);
|
|
14
14
|
}
|
|
15
15
|
return true;
|
|
@@ -18,6 +18,7 @@ function useInterval(fn, interval) {
|
|
|
18
18
|
const stop = () => {
|
|
19
19
|
setActive(false);
|
|
20
20
|
window.clearInterval(intervalRef.current);
|
|
21
|
+
intervalRef.current = void 0;
|
|
21
22
|
};
|
|
22
23
|
const toggle = () => {
|
|
23
24
|
if (active) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-interval.js","sources":["../../src/use-interval/use-interval.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nexport function useInterval(fn: () => void, interval: number) {\n const [active, setActive] = useState(false);\n const intervalRef = useRef<number>();\n const fnRef = useRef<() => void>();\n\n useEffect(() => {\n fnRef.current = fn;\n }, [fn]);\n\n const start = () => {\n setActive((old) => {\n if (!old) {\n intervalRef.current = window.setInterval(fnRef.current, interval);\n }\n return true;\n });\n };\n\n const stop = () => {\n setActive(false);\n window.clearInterval(intervalRef.current);\n };\n\n const toggle = () => {\n if (active) {\n stop();\n } else {\n start();\n }\n };\n\n return { start, stop, toggle, active };\n}\n"],"names":[],"mappings":";;AACO,SAAS,WAAW,CAAC,EAAE,EAAE,QAAQ,EAAE;AAC1C,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAC9C,EAAE,MAAM,WAAW,GAAG,MAAM,EAAE,CAAC;AAC/B,EAAE,MAAM,KAAK,GAAG,MAAM,EAAE,CAAC;AACzB,EAAE,SAAS,CAAC,MAAM;AAClB,IAAI,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC;AACvB,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;AACX,EAAE,MAAM,KAAK,GAAG,MAAM;AACtB,IAAI,SAAS,CAAC,CAAC,GAAG,KAAK;AACvB,MAAM,IAAI,CAAC,GAAG,EAAE;
|
|
1
|
+
{"version":3,"file":"use-interval.js","sources":["../../src/use-interval/use-interval.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nexport function useInterval(fn: () => void, interval: number) {\n const [active, setActive] = useState(false);\n const intervalRef = useRef<number>();\n const fnRef = useRef<() => void>();\n\n useEffect(() => {\n fnRef.current = fn;\n }, [fn]);\n\n const start = () => {\n setActive((old) => {\n if (!old && !intervalRef.current) {\n intervalRef.current = window.setInterval(fnRef.current, interval);\n }\n return true;\n });\n };\n\n const stop = () => {\n setActive(false);\n window.clearInterval(intervalRef.current);\n intervalRef.current = undefined;\n };\n\n const toggle = () => {\n if (active) {\n stop();\n } else {\n start();\n }\n };\n\n return { start, stop, toggle, active };\n}\n"],"names":[],"mappings":";;AACO,SAAS,WAAW,CAAC,EAAE,EAAE,QAAQ,EAAE;AAC1C,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAC9C,EAAE,MAAM,WAAW,GAAG,MAAM,EAAE,CAAC;AAC/B,EAAE,MAAM,KAAK,GAAG,MAAM,EAAE,CAAC;AACzB,EAAE,SAAS,CAAC,MAAM;AAClB,IAAI,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC;AACvB,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;AACX,EAAE,MAAM,KAAK,GAAG,MAAM;AACtB,IAAI,SAAS,CAAC,CAAC,GAAG,KAAK;AACvB,MAAM,IAAI,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE;AACxC,QAAQ,WAAW,CAAC,OAAO,GAAG,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;AAC1E,OAAO;AACP,MAAM,OAAO,IAAI,CAAC;AAClB,KAAK,CAAC,CAAC;AACP,GAAG,CAAC;AACJ,EAAE,MAAM,IAAI,GAAG,MAAM;AACrB,IAAI,SAAS,CAAC,KAAK,CAAC,CAAC;AACrB,IAAI,MAAM,CAAC,aAAa,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;AAC9C,IAAI,WAAW,CAAC,OAAO,GAAG,KAAK,CAAC,CAAC;AACjC,GAAG,CAAC;AACJ,EAAE,MAAM,MAAM,GAAG,MAAM;AACvB,IAAI,IAAI,MAAM,EAAE;AAChB,MAAM,IAAI,EAAE,CAAC;AACb,KAAK,MAAM;AACX,MAAM,KAAK,EAAE,CAAC;AACd,KAAK;AACL,GAAG,CAAC;AACJ,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC;AACzC;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { useState, useCallback } from 'react';
|
|
1
|
+
import { useState, useCallback, useEffect } from 'react';
|
|
2
2
|
import { useWindowEvent } from '../use-window-event/use-window-event.js';
|
|
3
3
|
|
|
4
4
|
const eventListerOptions = {
|
|
@@ -14,6 +14,7 @@ function useViewportSize() {
|
|
|
14
14
|
}, []);
|
|
15
15
|
useWindowEvent("resize", setSize, eventListerOptions);
|
|
16
16
|
useWindowEvent("orientationchange", setSize, eventListerOptions);
|
|
17
|
+
useEffect(setSize, []);
|
|
17
18
|
return windowSize;
|
|
18
19
|
}
|
|
19
20
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-viewport-size.js","sources":["../../src/use-viewport-size/use-viewport-size.ts"],"sourcesContent":["import { useCallback, useState } from 'react';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\n\nconst eventListerOptions = {\n passive: true,\n};\n\nexport function useViewportSize() {\n const [windowSize, setWindowSize] = useState({\n width: 0,\n height: 0,\n });\n\n const setSize = useCallback(() => {\n setWindowSize({ width: window.innerWidth || 0, height: window.innerHeight || 0 });\n }, []);\n\n useWindowEvent('resize', setSize, eventListerOptions);\n useWindowEvent('orientationchange', setSize, eventListerOptions);\n\n return windowSize;\n}\n"],"names":[],"mappings":";;;AAEA,MAAM,kBAAkB,GAAG;AAC3B,EAAE,OAAO,EAAE,IAAI;AACf,CAAC,CAAC;AACK,SAAS,eAAe,GAAG;AAClC,EAAE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC;AAC/C,IAAI,KAAK,EAAE,CAAC;AACZ,IAAI,MAAM,EAAE,CAAC;AACb,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,OAAO,GAAG,WAAW,CAAC,MAAM;AACpC,IAAI,aAAa,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,UAAU,IAAI,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,WAAW,IAAI,CAAC,EAAE,CAAC,CAAC;AACtF,GAAG,EAAE,EAAE,CAAC,CAAC;AACT,EAAE,cAAc,CAAC,QAAQ,EAAE,OAAO,EAAE,kBAAkB,CAAC,CAAC;AACxD,EAAE,cAAc,CAAC,mBAAmB,EAAE,OAAO,EAAE,kBAAkB,CAAC,CAAC;AACnE,EAAE,OAAO,UAAU,CAAC;AACpB;;;;"}
|
|
1
|
+
{"version":3,"file":"use-viewport-size.js","sources":["../../src/use-viewport-size/use-viewport-size.ts"],"sourcesContent":["import { useCallback, useState, useEffect } from 'react';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\n\nconst eventListerOptions = {\n passive: true,\n};\n\nexport function useViewportSize() {\n const [windowSize, setWindowSize] = useState({\n width: 0,\n height: 0,\n });\n\n const setSize = useCallback(() => {\n setWindowSize({ width: window.innerWidth || 0, height: window.innerHeight || 0 });\n }, []);\n\n useWindowEvent('resize', setSize, eventListerOptions);\n useWindowEvent('orientationchange', setSize, eventListerOptions);\n useEffect(setSize, []);\n\n return windowSize;\n}\n"],"names":[],"mappings":";;;AAEA,MAAM,kBAAkB,GAAG;AAC3B,EAAE,OAAO,EAAE,IAAI;AACf,CAAC,CAAC;AACK,SAAS,eAAe,GAAG;AAClC,EAAE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC;AAC/C,IAAI,KAAK,EAAE,CAAC;AACZ,IAAI,MAAM,EAAE,CAAC;AACb,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,OAAO,GAAG,WAAW,CAAC,MAAM;AACpC,IAAI,aAAa,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,UAAU,IAAI,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,WAAW,IAAI,CAAC,EAAE,CAAC,CAAC;AACtF,GAAG,EAAE,EAAE,CAAC,CAAC;AACT,EAAE,cAAc,CAAC,QAAQ,EAAE,OAAO,EAAE,kBAAkB,CAAC,CAAC;AACxD,EAAE,cAAc,CAAC,mBAAmB,EAAE,OAAO,EAAE,kBAAkB,CAAC,CAAC;AACnE,EAAE,SAAS,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;AACzB,EAAE,OAAO,UAAU,CAAC;AACpB;;;;"}
|
|
@@ -12,7 +12,7 @@ export declare type Hotkey = KeyboardModifiers & {
|
|
|
12
12
|
declare type CheckHotkeyMatch = (event: KeyboardEvent) => boolean;
|
|
13
13
|
export declare function parseHotkey(hotkey: string): Hotkey;
|
|
14
14
|
export declare function getHotkeyMatcher(hotkey: string): CheckHotkeyMatch;
|
|
15
|
-
declare type HotkeyItem = [string, (event: React.KeyboardEvent<HTMLElement>) => void];
|
|
16
|
-
export declare function getHotkeyHandler(hotkeys: HotkeyItem[]): (event: React.KeyboardEvent<HTMLElement>) => void;
|
|
15
|
+
declare type HotkeyItem = [string, (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => void];
|
|
16
|
+
export declare function getHotkeyHandler(hotkeys: HotkeyItem[]): (event: React.KeyboardEvent<HTMLElement> | KeyboardEvent) => void;
|
|
17
17
|
export {};
|
|
18
18
|
//# sourceMappingURL=parse-hotkey.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"parse-hotkey.d.ts","sourceRoot":"","sources":["../../src/use-hotkeys/parse-hotkey.ts"],"names":[],"mappings":";AAAA,oBAAY,iBAAiB,GAAG;IAC9B,GAAG,EAAE,OAAO,CAAC;IACb,IAAI,EAAE,OAAO,CAAC;IACd,IAAI,EAAE,OAAO,CAAC;IACd,GAAG,EAAE,OAAO,CAAC;IACb,KAAK,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF,oBAAY,MAAM,GAAG,iBAAiB,GAAG;IACvC,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,aAAK,gBAAgB,GAAG,CAAC,KAAK,EAAE,aAAa,KAAK,OAAO,CAAC;AAE1D,wBAAgB,WAAW,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAsBlD;AAqCD,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,MAAM,GAAG,gBAAgB,CAEjE;AAED,aAAK,UAAU,GAAG,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"parse-hotkey.d.ts","sourceRoot":"","sources":["../../src/use-hotkeys/parse-hotkey.ts"],"names":[],"mappings":";AAAA,oBAAY,iBAAiB,GAAG;IAC9B,GAAG,EAAE,OAAO,CAAC;IACb,IAAI,EAAE,OAAO,CAAC;IACd,IAAI,EAAE,OAAO,CAAC;IACd,GAAG,EAAE,OAAO,CAAC;IACb,KAAK,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF,oBAAY,MAAM,GAAG,iBAAiB,GAAG;IACvC,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,aAAK,gBAAgB,GAAG,CAAC,KAAK,EAAE,aAAa,KAAK,OAAO,CAAC;AAE1D,wBAAgB,WAAW,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAsBlD;AAqCD,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,MAAM,GAAG,gBAAgB,CAEjE;AAED,aAAK,UAAU,GAAG,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,GAAG,aAAa,KAAK,IAAI,CAAC,CAAC;AAE9F,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,UAAU,EAAE,WACrC,mBAAmB,CAAC,WAAW,CAAC,GAAG,aAAa,UAShE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-id.d.ts","sourceRoot":"","sources":["../../src/use-id/use-id.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-id.d.ts","sourceRoot":"","sources":["../../src/use-id/use-id.ts"],"names":[],"mappings":"AAuBA,wBAAgB,KAAK,CAAC,QAAQ,CAAC,EAAE,MAAM,UAEtC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-interval.d.ts","sourceRoot":"","sources":["../../src/use-interval/use-interval.ts"],"names":[],"mappings":"AAEA,wBAAgB,WAAW,CAAC,EAAE,EAAE,MAAM,IAAI,EAAE,QAAQ,EAAE,MAAM;;;;;
|
|
1
|
+
{"version":3,"file":"use-interval.d.ts","sourceRoot":"","sources":["../../src/use-interval/use-interval.ts"],"names":[],"mappings":"AAEA,wBAAgB,WAAW,CAAC,EAAE,EAAE,MAAM,IAAI,EAAE,QAAQ,EAAE,MAAM;;;;;EAiC3D"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-viewport-size.d.ts","sourceRoot":"","sources":["../../src/use-viewport-size/use-viewport-size.ts"],"names":[],"mappings":"AAOA,wBAAgB,eAAe;;;
|
|
1
|
+
{"version":3,"file":"use-viewport-size.d.ts","sourceRoot":"","sources":["../../src/use-viewport-size/use-viewport-size.ts"],"names":[],"mappings":"AAOA,wBAAgB,eAAe;;;EAe9B"}
|