@mantine/hooks 3.2.0 → 3.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/index.js +2 -0
- package/cjs/index.js.map +1 -1
- package/cjs/use-focus-trap/use-focus-trap.js +0 -7
- package/cjs/use-focus-trap/use-focus-trap.js.map +1 -1
- package/cjs/use-form/use-form.js +15 -7
- package/cjs/use-form/use-form.js.map +1 -1
- package/cjs/use-input-state/use-input-state.js +32 -0
- package/cjs/use-input-state/use-input-state.js.map +1 -0
- package/cjs/use-scroll-into-view/use-scroll-into-view.js +1 -1
- package/cjs/use-scroll-into-view/use-scroll-into-view.js.map +1 -1
- package/esm/index.js +1 -0
- package/esm/index.js.map +1 -1
- package/esm/use-focus-trap/use-focus-trap.js +0 -7
- package/esm/use-focus-trap/use-focus-trap.js.map +1 -1
- package/esm/use-form/use-form.js +15 -7
- package/esm/use-form/use-form.js.map +1 -1
- package/esm/use-input-state/use-input-state.js +27 -0
- package/esm/use-input-state/use-input-state.js.map +1 -0
- package/esm/use-scroll-into-view/use-scroll-into-view.js +1 -1
- package/esm/use-scroll-into-view/use-scroll-into-view.js.map +1 -1
- package/lib/index.d.ts +1 -0
- package/lib/index.d.ts.map +1 -1
- package/lib/use-focus-trap/use-focus-trap.d.ts.map +1 -1
- package/lib/use-form/use-form.d.ts +15 -4
- package/lib/use-form/use-form.d.ts.map +1 -1
- package/lib/use-hover/use-hover.d.ts +0 -1
- package/lib/use-hover/use-hover.d.ts.map +1 -1
- package/lib/use-input-state/use-input-state.d.ts +4 -0
- package/lib/use-input-state/use-input-state.d.ts.map +1 -0
- package/lib/use-list-state/use-list-state.d.ts +0 -1
- package/lib/use-list-state/use-list-state.d.ts.map +1 -1
- package/lib/use-mouse/use-mouse.d.ts +0 -1
- package/lib/use-mouse/use-mouse.d.ts.map +1 -1
- package/lib/use-move/use-move.d.ts +0 -1
- package/lib/use-move/use-move.d.ts.map +1 -1
- package/lib/use-scroll-into-view/use-scroll-into-view.d.ts +0 -1
- package/lib/use-scroll-into-view/use-scroll-into-view.d.ts.map +1 -1
- package/lib/use-toggle/use-toggle.d.ts +0 -1
- package/lib/use-toggle/use-toggle.d.ts.map +1 -1
- package/package.json +1 -1
- package/cjs/use-focus-trap/focus-manager.js +0 -58
- package/cjs/use-focus-trap/focus-manager.js.map +0 -1
- package/esm/use-focus-trap/focus-manager.js +0 -51
- package/esm/use-focus-trap/focus-manager.js.map +0 -1
- package/lib/use-focus-trap/focus-manager.d.ts +0 -5
- package/lib/use-focus-trap/focus-manager.d.ts.map +0 -1
package/cjs/index.js
CHANGED
|
@@ -43,6 +43,7 @@ var useHover = require('./use-hover/use-hover.js');
|
|
|
43
43
|
var useUuid = require('./use-uuid/use-uuid.js');
|
|
44
44
|
var useOs = require('./use-os/use-os.js');
|
|
45
45
|
var useSetState = require('./use-set-state/use-set-state.js');
|
|
46
|
+
var useInputState = require('./use-input-state/use-input-state.js');
|
|
46
47
|
var parseHotkey = require('./use-hotkey/parse-hotkey.js');
|
|
47
48
|
var assignRef = require('./utils/assign-ref/assign-ref.js');
|
|
48
49
|
var clamp = require('./utils/clamp/clamp.js');
|
|
@@ -98,6 +99,7 @@ exports.useHover = useHover.useHover;
|
|
|
98
99
|
exports.useUuid = useUuid.useUuid;
|
|
99
100
|
exports.useOs = useOs.useOs;
|
|
100
101
|
exports.useSetState = useSetState.useSetState;
|
|
102
|
+
exports.useInputState = useInputState.useInputState;
|
|
101
103
|
exports.getHotkeyHandler = parseHotkey.getHotkeyHandler;
|
|
102
104
|
exports.assignRef = assignRef.assignRef;
|
|
103
105
|
exports.clamp = clamp.clamp;
|
package/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -3,7 +3,6 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var react = require('react');
|
|
6
|
-
var focusManager = require('./focus-manager.js');
|
|
7
6
|
var tabbable = require('./tabbable.js');
|
|
8
7
|
var scopeTab = require('./scope-tab.js');
|
|
9
8
|
var createAriaHider = require('./create-aria-hider.js');
|
|
@@ -18,13 +17,7 @@ function useFocusTrap(active = true) {
|
|
|
18
17
|
if (restoreAria.current) {
|
|
19
18
|
restoreAria.current();
|
|
20
19
|
}
|
|
21
|
-
if (ref.current) {
|
|
22
|
-
focusManager.returnFocus();
|
|
23
|
-
focusManager.teardownScopedFocus();
|
|
24
|
-
}
|
|
25
20
|
if (node) {
|
|
26
|
-
focusManager.setupScopedFocus(node);
|
|
27
|
-
focusManager.markForFocusLater();
|
|
28
21
|
const processNode = (_node) => {
|
|
29
22
|
restoreAria.current = createAriaHider.createAriaHider(_node);
|
|
30
23
|
let focusElement = node.querySelector("[data-autofocus]");
|
|
@@ -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 {
|
|
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 (restoreAria.current) {\n restoreAria.current();\n }\n\n if (node) {\n const processNode = (_node: HTMLElement) => {\n restoreAria.current = createAriaHider(_node);\n\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();\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.ownerDocument) {\n processNode(node);\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 }, [active]);\n\n return setRef;\n}\n"],"names":["useRef","useCallback","createAriaHider","FOCUS_SELECTOR","tabbable","focusable","useEffect","scopeTab"],"mappings":";;;;;;;;;AAIO,SAAS,YAAY,CAAC,MAAM,GAAG,IAAI,EAAE;AAC5C,EAAE,MAAM,GAAG,GAAGA,YAAM,EAAE,CAAC;AACvB,EAAE,MAAM,WAAW,GAAGA,YAAM,CAAC,IAAI,CAAC,CAAC;AACnC,EAAE,MAAM,MAAM,GAAGC,iBAAW,CAAC,CAAC,IAAI,KAAK;AACvC,IAAI,IAAI,CAAC,MAAM,EAAE;AACjB,MAAM,OAAO;AACb,KAAK;AACL,IAAI,IAAI,WAAW,CAAC,OAAO,EAAE;AAC7B,MAAM,WAAW,CAAC,OAAO,EAAE,CAAC;AAC5B,KAAK;AACL,IAAI,IAAI,IAAI,EAAE;AACd,MAAM,MAAM,WAAW,GAAG,CAAC,KAAK,KAAK;AACrC,QAAQ,WAAW,CAAC,OAAO,GAAGC,+BAAe,CAAC,KAAK,CAAC,CAAC;AACrD,QAAQ,IAAI,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;AAClE,QAAQ,IAAI,CAAC,YAAY,EAAE;AAC3B,UAAU,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAACC,uBAAc,CAAC,CAAC,CAAC;AAC7E,UAAU,YAAY,GAAG,QAAQ,CAAC,IAAI,CAACC,iBAAQ,CAAC,IAAI,QAAQ,CAAC,IAAI,CAACC,kBAAS,CAAC,IAAI,IAAI,CAAC;AACrF,UAAU,IAAI,CAAC,YAAY,IAAIA,kBAAS,CAAC,IAAI,CAAC;AAC9C,YAAY,YAAY,GAAG,IAAI,CAAC;AAChC,SAAS;AACT,QAAQ,IAAI,YAAY,EAAE;AAC1B,UAAU,YAAY,CAAC,KAAK,EAAE,CAAC;AAC/B,SAAS,MAAM,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,aAAa,EAAE;AAC3D,UAAU,OAAO,CAAC,IAAI,CAAC,uFAAuF,EAAE,IAAI,CAAC,CAAC;AACtH,SAAS;AACT,OAAO,CAAC;AACR,MAAM,UAAU,CAAC,MAAM;AACvB,QAAQ,IAAI,IAAI,CAAC,aAAa,EAAE;AAChC,UAAU,WAAW,CAAC,IAAI,CAAC,CAAC;AAC5B,SAAS,MAAM,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,aAAa,EAAE;AAC3D,UAAU,OAAO,CAAC,IAAI,CAAC,iEAAiE,EAAE,IAAI,CAAC,CAAC;AAChG,SAAS;AACT,OAAO,CAAC,CAAC;AACT,MAAM,GAAG,CAAC,OAAO,GAAG,IAAI,CAAC;AACzB,KAAK,MAAM;AACX,MAAM,GAAG,CAAC,OAAO,GAAG,IAAI,CAAC;AACzB,KAAK;AACL,GAAG,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;AACf,EAAEC,eAAS,CAAC,MAAM;AAClB,IAAI,IAAI,CAAC,MAAM,EAAE;AACjB,MAAM,OAAO,KAAK,CAAC,CAAC;AACpB,KAAK;AACL,IAAI,MAAM,aAAa,GAAG,CAAC,KAAK,KAAK;AACrC,MAAM,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,IAAI,GAAG,CAAC,OAAO,EAAE;AAC9C,QAAQC,iBAAQ,CAAC,GAAG,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;AACrC,OAAO;AACP,KAAK,CAAC;AACN,IAAI,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;AACxD,IAAI,OAAO,MAAM;AACjB,MAAM,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;AAC7D,KAAK,CAAC;AACN,GAAG,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;AACf,EAAE,OAAO,MAAM,CAAC;AAChB;;;;"}
|
package/cjs/use-form/use-form.js
CHANGED
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var react = require('react');
|
|
6
|
+
var useInputState = require('../use-input-state/use-input-state.js');
|
|
6
7
|
|
|
7
8
|
var __defProp = Object.defineProperty;
|
|
8
9
|
var __defProps = Object.defineProperties;
|
|
@@ -25,10 +26,11 @@ var __spreadValues = (a, b) => {
|
|
|
25
26
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
26
27
|
function useForm({
|
|
27
28
|
initialValues,
|
|
28
|
-
validationRules = {}
|
|
29
|
+
validationRules = {},
|
|
30
|
+
errorMessages = {}
|
|
29
31
|
}) {
|
|
30
32
|
const initialErrors = Object.keys(initialValues).reduce((acc, field) => {
|
|
31
|
-
acc[field] =
|
|
33
|
+
acc[field] = null;
|
|
32
34
|
return acc;
|
|
33
35
|
}, {});
|
|
34
36
|
const [errors, setErrors] = react.useState(initialErrors);
|
|
@@ -42,10 +44,10 @@ function useForm({
|
|
|
42
44
|
let isValid = true;
|
|
43
45
|
const validationErrors = Object.keys(values).reduce((acc, field) => {
|
|
44
46
|
if (validationRules && typeof validationRules[field] === "function" && !validationRules[field](values[field], values)) {
|
|
45
|
-
acc[field] = true;
|
|
47
|
+
acc[field] = errorMessages[field] || true;
|
|
46
48
|
isValid = false;
|
|
47
49
|
} else {
|
|
48
|
-
acc[field] =
|
|
50
|
+
acc[field] = null;
|
|
49
51
|
}
|
|
50
52
|
return acc;
|
|
51
53
|
}, {});
|
|
@@ -53,17 +55,22 @@ function useForm({
|
|
|
53
55
|
return isValid;
|
|
54
56
|
};
|
|
55
57
|
const validateField = (field) => setErrors((currentErrors) => __spreadProps(__spreadValues({}, currentErrors), {
|
|
56
|
-
[field]: typeof validationRules[field] === "function" ?
|
|
58
|
+
[field]: typeof validationRules[field] === "function" ? validationRules[field](values[field], values) ? null : errorMessages[field] || true : null
|
|
57
59
|
}));
|
|
58
60
|
const setFieldError = (field, error) => setErrors((currentErrors) => __spreadProps(__spreadValues({}, currentErrors), { [field]: error }));
|
|
59
61
|
const setFieldValue = (field, value) => {
|
|
60
62
|
setValues((currentValues) => __spreadProps(__spreadValues({}, currentValues), { [field]: value }));
|
|
61
|
-
setFieldError(field,
|
|
63
|
+
setFieldError(field, null);
|
|
62
64
|
};
|
|
63
65
|
const onSubmit = (handleSubmit) => (event) => {
|
|
64
66
|
event && event.preventDefault();
|
|
65
67
|
validate() && handleSubmit(values);
|
|
66
68
|
};
|
|
69
|
+
const getInputProps = (field, options) => ({
|
|
70
|
+
[(options == null ? void 0 : options.type) === "checkbox" ? "checked" : "value"]: values[field],
|
|
71
|
+
onChange: useInputState.getInputOnChange((val) => setFieldValue(field, val)),
|
|
72
|
+
error: errors[field] || void 0
|
|
73
|
+
});
|
|
67
74
|
return {
|
|
68
75
|
values,
|
|
69
76
|
errors,
|
|
@@ -75,7 +82,8 @@ function useForm({
|
|
|
75
82
|
setFieldError,
|
|
76
83
|
validateField,
|
|
77
84
|
resetErrors,
|
|
78
|
-
onSubmit
|
|
85
|
+
onSubmit,
|
|
86
|
+
getInputProps
|
|
79
87
|
};
|
|
80
88
|
}
|
|
81
89
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-form.js","sources":["../../src/use-form/use-form.ts"],"sourcesContent":["import React, { useState } from 'react';\n\nexport type ValidationRule<T> = {\n readonly [P in keyof T]?: (value: T[P], values?: T) => boolean;\n};\n\nexport interface UseForm<T> {\n validationRules?: ValidationRule<T>;\n initialValues: T;\n}\n\nexport function useForm<T extends { [key: string]: any }>({\n initialValues,\n validationRules = {},\n}: UseForm<T>) {\n type ValidationErrors = Record<keyof T,
|
|
1
|
+
{"version":3,"file":"use-form.js","sources":["../../src/use-form/use-form.ts"],"sourcesContent":["import React, { useState } from 'react';\nimport { getInputOnChange } from '../use-input-state/use-input-state';\n\nexport type ValidationRule<T> = {\n readonly [P in keyof T]?: (value: T[P], values?: T) => boolean;\n};\n\nexport type UseFormErrors<T> = {\n readonly [P in keyof T]?: React.ReactNode | null;\n};\n\nexport interface UseForm<T> {\n validationRules?: ValidationRule<T>;\n errorMessages?: UseFormErrors<T>;\n initialValues: T;\n}\n\nexport function useForm<T extends { [key: string]: any }>({\n initialValues,\n validationRules = {},\n errorMessages = {},\n}: UseForm<T>) {\n type ValidationErrors = Record<keyof T, React.ReactNode>;\n\n const initialErrors = Object.keys(initialValues).reduce((acc, field) => {\n acc[field as keyof T] = null;\n return acc;\n }, {} as ValidationErrors);\n\n const [errors, setErrors] = useState(initialErrors);\n const [values, setValues] = useState(initialValues);\n\n const resetErrors = () => setErrors(initialErrors);\n\n const reset = () => {\n setValues(initialValues);\n resetErrors();\n };\n\n const validate = () => {\n let isValid = true;\n\n const validationErrors = Object.keys(values).reduce((acc, field) => {\n if (\n validationRules &&\n typeof validationRules[field] === 'function' &&\n !validationRules[field](values[field], values)\n ) {\n acc[field as keyof T] = errorMessages[field] || true;\n isValid = false;\n } else {\n acc[field as keyof T] = null;\n }\n\n return acc;\n }, {} as ValidationErrors);\n\n setErrors(validationErrors);\n return isValid;\n };\n\n const validateField = (field: keyof T) =>\n setErrors((currentErrors) => ({\n ...currentErrors,\n [field]:\n typeof validationRules[field] === 'function'\n ? validationRules[field](values[field], values)\n ? null\n : errorMessages[field] || true\n : null,\n }));\n\n const setFieldError = (field: keyof T, error: React.ReactNode) =>\n setErrors((currentErrors) => ({ ...currentErrors, [field]: error }));\n\n const setFieldValue = <K extends keyof T, U extends T[K]>(field: K, value: U) => {\n setValues((currentValues) => ({ ...currentValues, [field]: value }));\n setFieldError(field, null);\n };\n\n const onSubmit = (handleSubmit: (values: T) => any) => (event?: React.FormEvent) => {\n event && event.preventDefault();\n validate() && handleSubmit(values);\n };\n\n const getInputProps = <K extends keyof T, U extends T[K]>(\n field: K,\n options?: { type?: 'checkbox' | 'default' }\n ) => ({\n [options?.type === 'checkbox' ? 'checked' : 'value']: values[field],\n onChange: getInputOnChange<U>((val: U) => setFieldValue(field, val)),\n error: errors[field] || undefined,\n });\n\n return {\n values,\n errors,\n validate,\n reset,\n setErrors,\n setValues,\n setFieldValue,\n setFieldError,\n validateField,\n resetErrors,\n onSubmit,\n getInputProps,\n };\n}\n"],"names":["useState","getInputOnChange"],"mappings":"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"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var react = require('react');
|
|
6
|
+
|
|
7
|
+
function getInputOnChange(setValue) {
|
|
8
|
+
return (val) => {
|
|
9
|
+
if (!val) {
|
|
10
|
+
setValue(val);
|
|
11
|
+
} else if (typeof val === "function") {
|
|
12
|
+
setValue(val);
|
|
13
|
+
} else if (typeof val === "object" && "nativeEvent" in val) {
|
|
14
|
+
const { currentTarget } = val;
|
|
15
|
+
if (currentTarget.type === "checkbox") {
|
|
16
|
+
setValue(currentTarget.checked);
|
|
17
|
+
} else {
|
|
18
|
+
setValue(currentTarget.value);
|
|
19
|
+
}
|
|
20
|
+
} else {
|
|
21
|
+
setValue(val);
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
}
|
|
25
|
+
function useInputState(initialState) {
|
|
26
|
+
const [value, setValue] = react.useState(initialState);
|
|
27
|
+
return [value, getInputOnChange(setValue)];
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
exports.getInputOnChange = getInputOnChange;
|
|
31
|
+
exports.useInputState = useInputState;
|
|
32
|
+
//# sourceMappingURL=use-input-state.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-input-state.js","sources":["../../src/use-input-state/use-input-state.ts"],"sourcesContent":["import React, { useState } from 'react';\n\nexport function getInputOnChange<T>(setValue: (value: T | ((current: T) => T)) => void) {\n return (val: T | React.ChangeEvent<any> | ((current: T) => T)) => {\n if (!val) {\n setValue(val as T);\n } else if (typeof val === 'function') {\n setValue(val);\n } else if (typeof val === 'object' && 'nativeEvent' in val) {\n const { currentTarget } = val;\n\n if (currentTarget.type === 'checkbox') {\n setValue((currentTarget as any).checked as any);\n } else {\n setValue(currentTarget.value as any);\n }\n } else {\n setValue(val);\n }\n };\n}\n\nexport function useInputState<T>(initialState: T) {\n const [value, setValue] = useState(initialState);\n return [value, getInputOnChange<T>(setValue)] as const;\n}\n"],"names":["useState"],"mappings":";;;;;;AACO,SAAS,gBAAgB,CAAC,QAAQ,EAAE;AAC3C,EAAE,OAAO,CAAC,GAAG,KAAK;AAClB,IAAI,IAAI,CAAC,GAAG,EAAE;AACd,MAAM,QAAQ,CAAC,GAAG,CAAC,CAAC;AACpB,KAAK,MAAM,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE;AAC1C,MAAM,QAAQ,CAAC,GAAG,CAAC,CAAC;AACpB,KAAK,MAAM,IAAI,OAAO,GAAG,KAAK,QAAQ,IAAI,aAAa,IAAI,GAAG,EAAE;AAChE,MAAM,MAAM,EAAE,aAAa,EAAE,GAAG,GAAG,CAAC;AACpC,MAAM,IAAI,aAAa,CAAC,IAAI,KAAK,UAAU,EAAE;AAC7C,QAAQ,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;AACxC,OAAO,MAAM;AACb,QAAQ,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;AACtC,OAAO;AACP,KAAK,MAAM;AACX,MAAM,QAAQ,CAAC,GAAG,CAAC,CAAC;AACpB,KAAK;AACL,GAAG,CAAC;AACJ,CAAC;AACM,SAAS,aAAa,CAAC,YAAY,EAAE;AAC5C,EAAE,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAGA,cAAQ,CAAC,YAAY,CAAC,CAAC;AACnD,EAAE,OAAO,CAAC,KAAK,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;AAC7C;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-scroll-into-view.js","sources":["../../src/use-scroll-into-view/use-scroll-into-view.ts"],"sourcesContent":["import { useCallback, useRef, useEffect } from 'react';\nimport { useReducedMotion } from '../use-reduced-motion/use-reduced-motion';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\nimport { easeInOutQuad } from './utils/ease-in-out-quad';\nimport { getRelativePosition } from './utils/get-relative-position';\nimport { getScrollStart } from './utils/get-scroll-start';\nimport { setScrollParam } from './utils/set-scroll-param';\n\ninterface ScrollIntoViewAnimation {\n /** target element alignment relatively to parent based on current axis */\n alignment?: 'start' | 'end' | 'center';\n}\n\ninterface ScrollIntoViewParams {\n /** callback fired after scroll */\n onScrollFinish?: () => void;\n\n /** duration of scroll in milliseconds */\n duration?: number;\n\n /** axis of scroll */\n axis?: 'x' | 'y';\n\n /** custom mathematical easing function */\n easing?: (t: number) => number;\n\n /** additional distance between nearest edge and element */\n offset?: number;\n\n /** indicator if animation may be interrupted by user scrolling */\n cancelable?: boolean;\n\n /** prevents content jumping in scrolling lists with multiple targets */\n isList?: boolean;\n}\n\nexport function useScrollIntoView<\n Target extends HTMLElement,\n Parent extends HTMLElement | null = null\n>({\n duration = 1250,\n axis = 'y',\n onScrollFinish,\n easing = easeInOutQuad,\n offset = 0,\n cancelable = true,\n isList = false,\n}: ScrollIntoViewParams = {}) {\n const frameID = useRef(0);\n const startTime = useRef(0);\n const shouldStop = useRef(false);\n\n const scrollableRef = useRef<Parent>(null);\n const targetRef = useRef<Target>(null);\n\n const reducedMotion = useReducedMotion();\n\n const cancel = (): void => {\n if (frameID.current) {\n cancelAnimationFrame(frameID.current);\n }\n };\n\n const scrollIntoView = useCallback(({ alignment = 'start' }: ScrollIntoViewAnimation = {}) => {\n
|
|
1
|
+
{"version":3,"file":"use-scroll-into-view.js","sources":["../../src/use-scroll-into-view/use-scroll-into-view.ts"],"sourcesContent":["import { useCallback, useRef, useEffect } from 'react';\nimport { useReducedMotion } from '../use-reduced-motion/use-reduced-motion';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\nimport { easeInOutQuad } from './utils/ease-in-out-quad';\nimport { getRelativePosition } from './utils/get-relative-position';\nimport { getScrollStart } from './utils/get-scroll-start';\nimport { setScrollParam } from './utils/set-scroll-param';\n\ninterface ScrollIntoViewAnimation {\n /** target element alignment relatively to parent based on current axis */\n alignment?: 'start' | 'end' | 'center';\n}\n\ninterface ScrollIntoViewParams {\n /** callback fired after scroll */\n onScrollFinish?: () => void;\n\n /** duration of scroll in milliseconds */\n duration?: number;\n\n /** axis of scroll */\n axis?: 'x' | 'y';\n\n /** custom mathematical easing function */\n easing?: (t: number) => number;\n\n /** additional distance between nearest edge and element */\n offset?: number;\n\n /** indicator if animation may be interrupted by user scrolling */\n cancelable?: boolean;\n\n /** prevents content jumping in scrolling lists with multiple targets */\n isList?: boolean;\n}\n\nexport function useScrollIntoView<\n Target extends HTMLElement,\n Parent extends HTMLElement | null = null\n>({\n duration = 1250,\n axis = 'y',\n onScrollFinish,\n easing = easeInOutQuad,\n offset = 0,\n cancelable = true,\n isList = false,\n}: ScrollIntoViewParams = {}) {\n const frameID = useRef(0);\n const startTime = useRef(0);\n const shouldStop = useRef(false);\n\n const scrollableRef = useRef<Parent>(null);\n const targetRef = useRef<Target>(null);\n\n const reducedMotion = useReducedMotion();\n\n const cancel = (): void => {\n if (frameID.current) {\n cancelAnimationFrame(frameID.current);\n }\n };\n\n const scrollIntoView = useCallback(\n ({ alignment = 'start' }: ScrollIntoViewAnimation = {}) => {\n shouldStop.current = false;\n\n if (frameID.current) {\n cancel();\n }\n\n const start = getScrollStart({ parent: scrollableRef.current, axis }) ?? 0;\n\n const change =\n getRelativePosition({\n parent: scrollableRef.current,\n target: targetRef.current,\n axis,\n alignment,\n offset,\n isList,\n }) - (scrollableRef.current ? 0 : start);\n\n function animateScroll() {\n if (startTime.current === 0) {\n startTime.current = performance.now();\n }\n\n const now = performance.now();\n const elapsed = now - startTime.current;\n\n // easing timing progress\n const t = reducedMotion || duration === 0 ? 1 : elapsed / duration;\n\n const distance = start + change * easing(t);\n\n setScrollParam({\n parent: scrollableRef.current,\n axis,\n distance,\n });\n\n if (!shouldStop.current && t < 1) {\n frameID.current = requestAnimationFrame(animateScroll);\n } else {\n typeof onScrollFinish === 'function' && onScrollFinish();\n startTime.current = 0;\n frameID.current = 0;\n cancel();\n }\n }\n animateScroll();\n },\n [scrollableRef.current]\n );\n\n const handleStop = () => {\n if (cancelable) {\n shouldStop.current = true;\n }\n };\n\n /**\n * detection of one of these events stops scroll animation\n * wheel - mouse wheel / touch pad\n * touchmove - any touchable device\n */\n\n useWindowEvent('wheel', handleStop, {\n passive: true,\n });\n\n useWindowEvent('touchmove', handleStop, {\n passive: true,\n });\n\n // cleanup requestAnimationFrame\n useEffect(() => cancel, []);\n\n return {\n scrollableRef,\n targetRef,\n scrollIntoView,\n cancel,\n };\n}\n"],"names":["easeInOutQuad","useRef","useReducedMotion","useCallback","getScrollStart","getRelativePosition","setScrollParam","useWindowEvent","useEffect"],"mappings":"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"}
|
package/esm/index.js
CHANGED
|
@@ -39,6 +39,7 @@ export { useHover } from './use-hover/use-hover.js';
|
|
|
39
39
|
export { useUuid } from './use-uuid/use-uuid.js';
|
|
40
40
|
export { useOs } from './use-os/use-os.js';
|
|
41
41
|
export { useSetState } from './use-set-state/use-set-state.js';
|
|
42
|
+
export { useInputState } from './use-input-state/use-input-state.js';
|
|
42
43
|
export { getHotkeyHandler } from './use-hotkey/parse-hotkey.js';
|
|
43
44
|
export { assignRef } from './utils/assign-ref/assign-ref.js';
|
|
44
45
|
export { clamp } from './utils/clamp/clamp.js';
|
package/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { useRef, useCallback, useEffect } from 'react';
|
|
2
|
-
import { returnFocus, teardownScopedFocus, setupScopedFocus, markForFocusLater } from './focus-manager.js';
|
|
3
2
|
import { FOCUS_SELECTOR, tabbable, focusable } from './tabbable.js';
|
|
4
3
|
import { scopeTab } from './scope-tab.js';
|
|
5
4
|
import { createAriaHider } from './create-aria-hider.js';
|
|
@@ -14,13 +13,7 @@ function useFocusTrap(active = true) {
|
|
|
14
13
|
if (restoreAria.current) {
|
|
15
14
|
restoreAria.current();
|
|
16
15
|
}
|
|
17
|
-
if (ref.current) {
|
|
18
|
-
returnFocus();
|
|
19
|
-
teardownScopedFocus();
|
|
20
|
-
}
|
|
21
16
|
if (node) {
|
|
22
|
-
setupScopedFocus(node);
|
|
23
|
-
markForFocusLater();
|
|
24
17
|
const processNode = (_node) => {
|
|
25
18
|
restoreAria.current = createAriaHider(_node);
|
|
26
19
|
let focusElement = node.querySelector("[data-autofocus]");
|
|
@@ -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 {
|
|
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 (restoreAria.current) {\n restoreAria.current();\n }\n\n if (node) {\n const processNode = (_node: HTMLElement) => {\n restoreAria.current = createAriaHider(_node);\n\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();\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.ownerDocument) {\n processNode(node);\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 }, [active]);\n\n return setRef;\n}\n"],"names":[],"mappings":";;;;;AAIO,SAAS,YAAY,CAAC,MAAM,GAAG,IAAI,EAAE;AAC5C,EAAE,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;AACvB,EAAE,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;AACnC,EAAE,MAAM,MAAM,GAAG,WAAW,CAAC,CAAC,IAAI,KAAK;AACvC,IAAI,IAAI,CAAC,MAAM,EAAE;AACjB,MAAM,OAAO;AACb,KAAK;AACL,IAAI,IAAI,WAAW,CAAC,OAAO,EAAE;AAC7B,MAAM,WAAW,CAAC,OAAO,EAAE,CAAC;AAC5B,KAAK;AACL,IAAI,IAAI,IAAI,EAAE;AACd,MAAM,MAAM,WAAW,GAAG,CAAC,KAAK,KAAK;AACrC,QAAQ,WAAW,CAAC,OAAO,GAAG,eAAe,CAAC,KAAK,CAAC,CAAC;AACrD,QAAQ,IAAI,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;AAClE,QAAQ,IAAI,CAAC,YAAY,EAAE;AAC3B,UAAU,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC,CAAC;AAC7E,UAAU,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC;AACrF,UAAU,IAAI,CAAC,YAAY,IAAI,SAAS,CAAC,IAAI,CAAC;AAC9C,YAAY,YAAY,GAAG,IAAI,CAAC;AAChC,SAAS;AACT,QAAQ,IAAI,YAAY,EAAE;AAC1B,UAAU,YAAY,CAAC,KAAK,EAAE,CAAC;AAC/B,SAAS,MAAM,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,aAAa,EAAE;AAC3D,UAAU,OAAO,CAAC,IAAI,CAAC,uFAAuF,EAAE,IAAI,CAAC,CAAC;AACtH,SAAS;AACT,OAAO,CAAC;AACR,MAAM,UAAU,CAAC,MAAM;AACvB,QAAQ,IAAI,IAAI,CAAC,aAAa,EAAE;AAChC,UAAU,WAAW,CAAC,IAAI,CAAC,CAAC;AAC5B,SAAS,MAAM,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,aAAa,EAAE;AAC3D,UAAU,OAAO,CAAC,IAAI,CAAC,iEAAiE,EAAE,IAAI,CAAC,CAAC;AAChG,SAAS;AACT,OAAO,CAAC,CAAC;AACT,MAAM,GAAG,CAAC,OAAO,GAAG,IAAI,CAAC;AACzB,KAAK,MAAM;AACX,MAAM,GAAG,CAAC,OAAO,GAAG,IAAI,CAAC;AACzB,KAAK;AACL,GAAG,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;AACf,EAAE,SAAS,CAAC,MAAM;AAClB,IAAI,IAAI,CAAC,MAAM,EAAE;AACjB,MAAM,OAAO,KAAK,CAAC,CAAC;AACpB,KAAK;AACL,IAAI,MAAM,aAAa,GAAG,CAAC,KAAK,KAAK;AACrC,MAAM,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,IAAI,GAAG,CAAC,OAAO,EAAE;AAC9C,QAAQ,QAAQ,CAAC,GAAG,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;AACrC,OAAO;AACP,KAAK,CAAC;AACN,IAAI,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;AACxD,IAAI,OAAO,MAAM;AACjB,MAAM,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;AAC7D,KAAK,CAAC;AACN,GAAG,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;AACf,EAAE,OAAO,MAAM,CAAC;AAChB;;;;"}
|
package/esm/use-form/use-form.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { useState } from 'react';
|
|
2
|
+
import { getInputOnChange } from '../use-input-state/use-input-state.js';
|
|
2
3
|
|
|
3
4
|
var __defProp = Object.defineProperty;
|
|
4
5
|
var __defProps = Object.defineProperties;
|
|
@@ -21,10 +22,11 @@ var __spreadValues = (a, b) => {
|
|
|
21
22
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
22
23
|
function useForm({
|
|
23
24
|
initialValues,
|
|
24
|
-
validationRules = {}
|
|
25
|
+
validationRules = {},
|
|
26
|
+
errorMessages = {}
|
|
25
27
|
}) {
|
|
26
28
|
const initialErrors = Object.keys(initialValues).reduce((acc, field) => {
|
|
27
|
-
acc[field] =
|
|
29
|
+
acc[field] = null;
|
|
28
30
|
return acc;
|
|
29
31
|
}, {});
|
|
30
32
|
const [errors, setErrors] = useState(initialErrors);
|
|
@@ -38,10 +40,10 @@ function useForm({
|
|
|
38
40
|
let isValid = true;
|
|
39
41
|
const validationErrors = Object.keys(values).reduce((acc, field) => {
|
|
40
42
|
if (validationRules && typeof validationRules[field] === "function" && !validationRules[field](values[field], values)) {
|
|
41
|
-
acc[field] = true;
|
|
43
|
+
acc[field] = errorMessages[field] || true;
|
|
42
44
|
isValid = false;
|
|
43
45
|
} else {
|
|
44
|
-
acc[field] =
|
|
46
|
+
acc[field] = null;
|
|
45
47
|
}
|
|
46
48
|
return acc;
|
|
47
49
|
}, {});
|
|
@@ -49,17 +51,22 @@ function useForm({
|
|
|
49
51
|
return isValid;
|
|
50
52
|
};
|
|
51
53
|
const validateField = (field) => setErrors((currentErrors) => __spreadProps(__spreadValues({}, currentErrors), {
|
|
52
|
-
[field]: typeof validationRules[field] === "function" ?
|
|
54
|
+
[field]: typeof validationRules[field] === "function" ? validationRules[field](values[field], values) ? null : errorMessages[field] || true : null
|
|
53
55
|
}));
|
|
54
56
|
const setFieldError = (field, error) => setErrors((currentErrors) => __spreadProps(__spreadValues({}, currentErrors), { [field]: error }));
|
|
55
57
|
const setFieldValue = (field, value) => {
|
|
56
58
|
setValues((currentValues) => __spreadProps(__spreadValues({}, currentValues), { [field]: value }));
|
|
57
|
-
setFieldError(field,
|
|
59
|
+
setFieldError(field, null);
|
|
58
60
|
};
|
|
59
61
|
const onSubmit = (handleSubmit) => (event) => {
|
|
60
62
|
event && event.preventDefault();
|
|
61
63
|
validate() && handleSubmit(values);
|
|
62
64
|
};
|
|
65
|
+
const getInputProps = (field, options) => ({
|
|
66
|
+
[(options == null ? void 0 : options.type) === "checkbox" ? "checked" : "value"]: values[field],
|
|
67
|
+
onChange: getInputOnChange((val) => setFieldValue(field, val)),
|
|
68
|
+
error: errors[field] || void 0
|
|
69
|
+
});
|
|
63
70
|
return {
|
|
64
71
|
values,
|
|
65
72
|
errors,
|
|
@@ -71,7 +78,8 @@ function useForm({
|
|
|
71
78
|
setFieldError,
|
|
72
79
|
validateField,
|
|
73
80
|
resetErrors,
|
|
74
|
-
onSubmit
|
|
81
|
+
onSubmit,
|
|
82
|
+
getInputProps
|
|
75
83
|
};
|
|
76
84
|
}
|
|
77
85
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-form.js","sources":["../../src/use-form/use-form.ts"],"sourcesContent":["import React, { useState } from 'react';\n\nexport type ValidationRule<T> = {\n readonly [P in keyof T]?: (value: T[P], values?: T) => boolean;\n};\n\nexport interface UseForm<T> {\n validationRules?: ValidationRule<T>;\n initialValues: T;\n}\n\nexport function useForm<T extends { [key: string]: any }>({\n initialValues,\n validationRules = {},\n}: UseForm<T>) {\n type ValidationErrors = Record<keyof T,
|
|
1
|
+
{"version":3,"file":"use-form.js","sources":["../../src/use-form/use-form.ts"],"sourcesContent":["import React, { useState } from 'react';\nimport { getInputOnChange } from '../use-input-state/use-input-state';\n\nexport type ValidationRule<T> = {\n readonly [P in keyof T]?: (value: T[P], values?: T) => boolean;\n};\n\nexport type UseFormErrors<T> = {\n readonly [P in keyof T]?: React.ReactNode | null;\n};\n\nexport interface UseForm<T> {\n validationRules?: ValidationRule<T>;\n errorMessages?: UseFormErrors<T>;\n initialValues: T;\n}\n\nexport function useForm<T extends { [key: string]: any }>({\n initialValues,\n validationRules = {},\n errorMessages = {},\n}: UseForm<T>) {\n type ValidationErrors = Record<keyof T, React.ReactNode>;\n\n const initialErrors = Object.keys(initialValues).reduce((acc, field) => {\n acc[field as keyof T] = null;\n return acc;\n }, {} as ValidationErrors);\n\n const [errors, setErrors] = useState(initialErrors);\n const [values, setValues] = useState(initialValues);\n\n const resetErrors = () => setErrors(initialErrors);\n\n const reset = () => {\n setValues(initialValues);\n resetErrors();\n };\n\n const validate = () => {\n let isValid = true;\n\n const validationErrors = Object.keys(values).reduce((acc, field) => {\n if (\n validationRules &&\n typeof validationRules[field] === 'function' &&\n !validationRules[field](values[field], values)\n ) {\n acc[field as keyof T] = errorMessages[field] || true;\n isValid = false;\n } else {\n acc[field as keyof T] = null;\n }\n\n return acc;\n }, {} as ValidationErrors);\n\n setErrors(validationErrors);\n return isValid;\n };\n\n const validateField = (field: keyof T) =>\n setErrors((currentErrors) => ({\n ...currentErrors,\n [field]:\n typeof validationRules[field] === 'function'\n ? validationRules[field](values[field], values)\n ? null\n : errorMessages[field] || true\n : null,\n }));\n\n const setFieldError = (field: keyof T, error: React.ReactNode) =>\n setErrors((currentErrors) => ({ ...currentErrors, [field]: error }));\n\n const setFieldValue = <K extends keyof T, U extends T[K]>(field: K, value: U) => {\n setValues((currentValues) => ({ ...currentValues, [field]: value }));\n setFieldError(field, null);\n };\n\n const onSubmit = (handleSubmit: (values: T) => any) => (event?: React.FormEvent) => {\n event && event.preventDefault();\n validate() && handleSubmit(values);\n };\n\n const getInputProps = <K extends keyof T, U extends T[K]>(\n field: K,\n options?: { type?: 'checkbox' | 'default' }\n ) => ({\n [options?.type === 'checkbox' ? 'checked' : 'value']: values[field],\n onChange: getInputOnChange<U>((val: U) => setFieldValue(field, val)),\n error: errors[field] || undefined,\n });\n\n return {\n values,\n errors,\n validate,\n reset,\n setErrors,\n setValues,\n setFieldValue,\n setFieldError,\n validateField,\n resetErrors,\n onSubmit,\n getInputProps,\n };\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { useState } from 'react';
|
|
2
|
+
|
|
3
|
+
function getInputOnChange(setValue) {
|
|
4
|
+
return (val) => {
|
|
5
|
+
if (!val) {
|
|
6
|
+
setValue(val);
|
|
7
|
+
} else if (typeof val === "function") {
|
|
8
|
+
setValue(val);
|
|
9
|
+
} else if (typeof val === "object" && "nativeEvent" in val) {
|
|
10
|
+
const { currentTarget } = val;
|
|
11
|
+
if (currentTarget.type === "checkbox") {
|
|
12
|
+
setValue(currentTarget.checked);
|
|
13
|
+
} else {
|
|
14
|
+
setValue(currentTarget.value);
|
|
15
|
+
}
|
|
16
|
+
} else {
|
|
17
|
+
setValue(val);
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
}
|
|
21
|
+
function useInputState(initialState) {
|
|
22
|
+
const [value, setValue] = useState(initialState);
|
|
23
|
+
return [value, getInputOnChange(setValue)];
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
export { getInputOnChange, useInputState };
|
|
27
|
+
//# sourceMappingURL=use-input-state.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-input-state.js","sources":["../../src/use-input-state/use-input-state.ts"],"sourcesContent":["import React, { useState } from 'react';\n\nexport function getInputOnChange<T>(setValue: (value: T | ((current: T) => T)) => void) {\n return (val: T | React.ChangeEvent<any> | ((current: T) => T)) => {\n if (!val) {\n setValue(val as T);\n } else if (typeof val === 'function') {\n setValue(val);\n } else if (typeof val === 'object' && 'nativeEvent' in val) {\n const { currentTarget } = val;\n\n if (currentTarget.type === 'checkbox') {\n setValue((currentTarget as any).checked as any);\n } else {\n setValue(currentTarget.value as any);\n }\n } else {\n setValue(val);\n }\n };\n}\n\nexport function useInputState<T>(initialState: T) {\n const [value, setValue] = useState(initialState);\n return [value, getInputOnChange<T>(setValue)] as const;\n}\n"],"names":[],"mappings":";;AACO,SAAS,gBAAgB,CAAC,QAAQ,EAAE;AAC3C,EAAE,OAAO,CAAC,GAAG,KAAK;AAClB,IAAI,IAAI,CAAC,GAAG,EAAE;AACd,MAAM,QAAQ,CAAC,GAAG,CAAC,CAAC;AACpB,KAAK,MAAM,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE;AAC1C,MAAM,QAAQ,CAAC,GAAG,CAAC,CAAC;AACpB,KAAK,MAAM,IAAI,OAAO,GAAG,KAAK,QAAQ,IAAI,aAAa,IAAI,GAAG,EAAE;AAChE,MAAM,MAAM,EAAE,aAAa,EAAE,GAAG,GAAG,CAAC;AACpC,MAAM,IAAI,aAAa,CAAC,IAAI,KAAK,UAAU,EAAE;AAC7C,QAAQ,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;AACxC,OAAO,MAAM;AACb,QAAQ,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;AACtC,OAAO;AACP,KAAK,MAAM;AACX,MAAM,QAAQ,CAAC,GAAG,CAAC,CAAC;AACpB,KAAK;AACL,GAAG,CAAC;AACJ,CAAC;AACM,SAAS,aAAa,CAAC,YAAY,EAAE;AAC5C,EAAE,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;AACnD,EAAE,OAAO,CAAC,KAAK,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;AAC7C;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-scroll-into-view.js","sources":["../../src/use-scroll-into-view/use-scroll-into-view.ts"],"sourcesContent":["import { useCallback, useRef, useEffect } from 'react';\nimport { useReducedMotion } from '../use-reduced-motion/use-reduced-motion';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\nimport { easeInOutQuad } from './utils/ease-in-out-quad';\nimport { getRelativePosition } from './utils/get-relative-position';\nimport { getScrollStart } from './utils/get-scroll-start';\nimport { setScrollParam } from './utils/set-scroll-param';\n\ninterface ScrollIntoViewAnimation {\n /** target element alignment relatively to parent based on current axis */\n alignment?: 'start' | 'end' | 'center';\n}\n\ninterface ScrollIntoViewParams {\n /** callback fired after scroll */\n onScrollFinish?: () => void;\n\n /** duration of scroll in milliseconds */\n duration?: number;\n\n /** axis of scroll */\n axis?: 'x' | 'y';\n\n /** custom mathematical easing function */\n easing?: (t: number) => number;\n\n /** additional distance between nearest edge and element */\n offset?: number;\n\n /** indicator if animation may be interrupted by user scrolling */\n cancelable?: boolean;\n\n /** prevents content jumping in scrolling lists with multiple targets */\n isList?: boolean;\n}\n\nexport function useScrollIntoView<\n Target extends HTMLElement,\n Parent extends HTMLElement | null = null\n>({\n duration = 1250,\n axis = 'y',\n onScrollFinish,\n easing = easeInOutQuad,\n offset = 0,\n cancelable = true,\n isList = false,\n}: ScrollIntoViewParams = {}) {\n const frameID = useRef(0);\n const startTime = useRef(0);\n const shouldStop = useRef(false);\n\n const scrollableRef = useRef<Parent>(null);\n const targetRef = useRef<Target>(null);\n\n const reducedMotion = useReducedMotion();\n\n const cancel = (): void => {\n if (frameID.current) {\n cancelAnimationFrame(frameID.current);\n }\n };\n\n const scrollIntoView = useCallback(({ alignment = 'start' }: ScrollIntoViewAnimation = {}) => {\n
|
|
1
|
+
{"version":3,"file":"use-scroll-into-view.js","sources":["../../src/use-scroll-into-view/use-scroll-into-view.ts"],"sourcesContent":["import { useCallback, useRef, useEffect } from 'react';\nimport { useReducedMotion } from '../use-reduced-motion/use-reduced-motion';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\nimport { easeInOutQuad } from './utils/ease-in-out-quad';\nimport { getRelativePosition } from './utils/get-relative-position';\nimport { getScrollStart } from './utils/get-scroll-start';\nimport { setScrollParam } from './utils/set-scroll-param';\n\ninterface ScrollIntoViewAnimation {\n /** target element alignment relatively to parent based on current axis */\n alignment?: 'start' | 'end' | 'center';\n}\n\ninterface ScrollIntoViewParams {\n /** callback fired after scroll */\n onScrollFinish?: () => void;\n\n /** duration of scroll in milliseconds */\n duration?: number;\n\n /** axis of scroll */\n axis?: 'x' | 'y';\n\n /** custom mathematical easing function */\n easing?: (t: number) => number;\n\n /** additional distance between nearest edge and element */\n offset?: number;\n\n /** indicator if animation may be interrupted by user scrolling */\n cancelable?: boolean;\n\n /** prevents content jumping in scrolling lists with multiple targets */\n isList?: boolean;\n}\n\nexport function useScrollIntoView<\n Target extends HTMLElement,\n Parent extends HTMLElement | null = null\n>({\n duration = 1250,\n axis = 'y',\n onScrollFinish,\n easing = easeInOutQuad,\n offset = 0,\n cancelable = true,\n isList = false,\n}: ScrollIntoViewParams = {}) {\n const frameID = useRef(0);\n const startTime = useRef(0);\n const shouldStop = useRef(false);\n\n const scrollableRef = useRef<Parent>(null);\n const targetRef = useRef<Target>(null);\n\n const reducedMotion = useReducedMotion();\n\n const cancel = (): void => {\n if (frameID.current) {\n cancelAnimationFrame(frameID.current);\n }\n };\n\n const scrollIntoView = useCallback(\n ({ alignment = 'start' }: ScrollIntoViewAnimation = {}) => {\n shouldStop.current = false;\n\n if (frameID.current) {\n cancel();\n }\n\n const start = getScrollStart({ parent: scrollableRef.current, axis }) ?? 0;\n\n const change =\n getRelativePosition({\n parent: scrollableRef.current,\n target: targetRef.current,\n axis,\n alignment,\n offset,\n isList,\n }) - (scrollableRef.current ? 0 : start);\n\n function animateScroll() {\n if (startTime.current === 0) {\n startTime.current = performance.now();\n }\n\n const now = performance.now();\n const elapsed = now - startTime.current;\n\n // easing timing progress\n const t = reducedMotion || duration === 0 ? 1 : elapsed / duration;\n\n const distance = start + change * easing(t);\n\n setScrollParam({\n parent: scrollableRef.current,\n axis,\n distance,\n });\n\n if (!shouldStop.current && t < 1) {\n frameID.current = requestAnimationFrame(animateScroll);\n } else {\n typeof onScrollFinish === 'function' && onScrollFinish();\n startTime.current = 0;\n frameID.current = 0;\n cancel();\n }\n }\n animateScroll();\n },\n [scrollableRef.current]\n );\n\n const handleStop = () => {\n if (cancelable) {\n shouldStop.current = true;\n }\n };\n\n /**\n * detection of one of these events stops scroll animation\n * wheel - mouse wheel / touch pad\n * touchmove - any touchable device\n */\n\n useWindowEvent('wheel', handleStop, {\n passive: true,\n });\n\n useWindowEvent('touchmove', handleStop, {\n passive: true,\n });\n\n // cleanup requestAnimationFrame\n useEffect(() => cancel, []);\n\n return {\n scrollableRef,\n targetRef,\n scrollIntoView,\n cancel,\n };\n}\n"],"names":[],"mappings":"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"}
|
package/lib/index.d.ts
CHANGED
|
@@ -40,6 +40,7 @@ export { useHover } from './use-hover/use-hover';
|
|
|
40
40
|
export { useUuid } from './use-uuid/use-uuid';
|
|
41
41
|
export { useOs } from './use-os/use-os';
|
|
42
42
|
export { useSetState } from './use-set-state/use-set-state';
|
|
43
|
+
export { useInputState } from './use-input-state/use-input-state';
|
|
43
44
|
export type { UseMovePosition } from './use-move/use-move';
|
|
44
45
|
export type { OS } from './use-os/use-os';
|
|
45
46
|
//# sourceMappingURL=index.d.ts.map
|
package/lib/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AAExB,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACxE,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAC7D,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,EAAE,iBAAiB,EAAE,MAAM,2CAA2C,CAAC;AAC9E,OAAO,EAAE,gBAAgB,EAAE,MAAM,yCAAyC,CAAC;AAC3E,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,+CAA+C,CAAC;AACpF,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,OAAO,EAAE,oBAAoB,EAAE,MAAM,mDAAmD,CAAC;AACzF,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC1E,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,yCAAyC,CAAC;AAC3E,OAAO,EAAE,iBAAiB,EAAE,MAAM,6CAA6C,CAAC;AAChF,OAAO,EAAE,iBAAiB,EAAE,MAAM,2CAA2C,CAAC;AAC9E,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,yCAAyC,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAC;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACxE,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACxE,OAAO,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAC;AACtE,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AAExB,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACxE,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAC7D,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,EAAE,iBAAiB,EAAE,MAAM,2CAA2C,CAAC;AAC9E,OAAO,EAAE,gBAAgB,EAAE,MAAM,yCAAyC,CAAC;AAC3E,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,+CAA+C,CAAC;AACpF,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,OAAO,EAAE,oBAAoB,EAAE,MAAM,mDAAmD,CAAC;AACzF,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC1E,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,yCAAyC,CAAC;AAC3E,OAAO,EAAE,iBAAiB,EAAE,MAAM,6CAA6C,CAAC;AAChF,OAAO,EAAE,iBAAiB,EAAE,MAAM,2CAA2C,CAAC;AAC9E,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,yCAAyC,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAC;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACxE,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACxE,OAAO,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAC;AACtE,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAElE,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC3D,YAAY,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-focus-trap.d.ts","sourceRoot":"","sources":["../../src/use-focus-trap/use-focus-trap.ts"],"names":[],"mappings":"
|
|
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,CAyElF"}
|
|
@@ -2,23 +2,34 @@ import React from 'react';
|
|
|
2
2
|
export declare type ValidationRule<T> = {
|
|
3
3
|
readonly [P in keyof T]?: (value: T[P], values?: T) => boolean;
|
|
4
4
|
};
|
|
5
|
+
export declare type UseFormErrors<T> = {
|
|
6
|
+
readonly [P in keyof T]?: React.ReactNode | null;
|
|
7
|
+
};
|
|
5
8
|
export interface UseForm<T> {
|
|
6
9
|
validationRules?: ValidationRule<T>;
|
|
10
|
+
errorMessages?: UseFormErrors<T>;
|
|
7
11
|
initialValues: T;
|
|
8
12
|
}
|
|
9
13
|
export declare function useForm<T extends {
|
|
10
14
|
[key: string]: any;
|
|
11
|
-
}>({ initialValues, validationRules, }: UseForm<T>): {
|
|
15
|
+
}>({ initialValues, validationRules, errorMessages, }: UseForm<T>): {
|
|
12
16
|
values: T;
|
|
13
|
-
errors: Record<keyof T,
|
|
17
|
+
errors: Record<keyof T, React.ReactNode>;
|
|
14
18
|
validate: () => boolean;
|
|
15
19
|
reset: () => void;
|
|
16
|
-
setErrors: React.Dispatch<React.SetStateAction<Record<keyof T,
|
|
20
|
+
setErrors: React.Dispatch<React.SetStateAction<Record<keyof T, React.ReactNode>>>;
|
|
17
21
|
setValues: React.Dispatch<React.SetStateAction<T>>;
|
|
18
22
|
setFieldValue: <K extends keyof T, U extends T[K]>(field: K, value: U) => void;
|
|
19
|
-
setFieldError: (field: keyof T, error:
|
|
23
|
+
setFieldError: (field: keyof T, error: React.ReactNode) => void;
|
|
20
24
|
validateField: (field: keyof T) => void;
|
|
21
25
|
resetErrors: () => void;
|
|
22
26
|
onSubmit: (handleSubmit: (values: T) => any) => (event?: React.FormEvent) => void;
|
|
27
|
+
getInputProps: <K_1 extends keyof T, U_1 extends T[K_1]>(field: K_1, options?: {
|
|
28
|
+
type?: 'checkbox' | 'default';
|
|
29
|
+
}) => {
|
|
30
|
+
[x: string]: T[K_1] | Record<keyof T, React.ReactNode>[K_1];
|
|
31
|
+
onChange: (val: React.ChangeEvent<any> | U_1 | ((current: U_1) => U_1)) => void;
|
|
32
|
+
error: Record<keyof T, React.ReactNode>[K_1];
|
|
33
|
+
};
|
|
23
34
|
};
|
|
24
35
|
//# sourceMappingURL=use-form.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-form.d.ts","sourceRoot":"","sources":["../../src/use-form/use-form.ts"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"use-form.d.ts","sourceRoot":"","sources":["../../src/use-form/use-form.ts"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,oBAAY,cAAc,CAAC,CAAC,IAAI;IAC9B,QAAQ,EAAE,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,EAAE,CAAC,KAAK,OAAO;CAC/D,CAAC;AAEF,oBAAY,aAAa,CAAC,CAAC,IAAI;IAC7B,QAAQ,EAAE,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI;CACjD,CAAC;AAEF,MAAM,WAAW,OAAO,CAAC,CAAC;IACxB,eAAe,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;IACpC,aAAa,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IACjC,aAAa,EAAE,CAAC,CAAC;CAClB;AAED,wBAAgB,OAAO,CAAC,CAAC,SAAS;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,EAAE,EACxD,aAAa,EACb,eAAoB,EACpB,aAAkB,GACnB,EAAE,OAAO,CAAC,CAAC,CAAC;;;;;;;;2BAmDmB,MAAM,CAAC,SAAS,MAAM,SAAS;2BAX/B,MAAM,CAAC;;sCAmBI,CAAC,KAAK,GAAG,cAAc,MAAM,SAAS;mFAOnE;QAAE,IAAI,CAAC,EAAE,UAAU,GAAG,SAAS,CAAA;KAAE;;;;;EAqB9C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-hover.d.ts","sourceRoot":"","sources":["../../src/use-hover/use-hover.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-hover.d.ts","sourceRoot":"","sources":["../../src/use-hover/use-hover.ts"],"names":[],"mappings":"AAEA,wBAAgB,QAAQ,CAAC,CAAC,SAAS,WAAW,GAAG,cAAc;;;EAqB9D"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export declare function getInputOnChange<T>(setValue: (value: T | ((current: T) => T)) => void): (val: T | React.ChangeEvent<any> | ((current: T) => T)) => void;
|
|
3
|
+
export declare function useInputState<T>(initialState: T): readonly [T, (val: React.ChangeEvent<any> | T | ((current: T) => T)) => void];
|
|
4
|
+
//# sourceMappingURL=use-input-state.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-input-state.d.ts","sourceRoot":"","sources":["../../src/use-input-state/use-input-state.ts"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC,KAAK,CAAC,CAAC,KAAK,IAAI,iDAC/B,CAAC,KAAK,CAAC,WAiB7D;AAED,wBAAgB,aAAa,CAAC,CAAC,EAAE,YAAY,EAAE,CAAC,iFAG/C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-list-state.d.ts","sourceRoot":"","sources":["../../src/use-list-state/use-list-state.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-list-state.d.ts","sourceRoot":"","sources":["../../src/use-list-state/use-list-state.ts"],"names":[],"mappings":"AAEA,wBAAgB,YAAY,CAAC,CAAC,EAAE,YAAY,GAAE,CAAC,EAAO;;gCAG1B,CAAC,EAAE;iCACF,CAAC,EAAE;6BAEP,MAAM,YAAY,CAAC,EAAE;;;gCAGlB,CAAC,UAAU,MAAM,KAAK,CAAC;4CA8C7B,CAAC,UAAU,MAAM,KAAK,OAAO,aACpC,CAAC,UAAU,MAAM,KAAK,CAAC;kCA5CR,MAAM,EAAE;;cAiBG,MAAM;YAAM,MAAM;;8BAWjC,MAAM,QAAQ,CAAC;qEAOwB,MAAM;GA6BtE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-mouse.d.ts","sourceRoot":"","sources":["../../src/use-mouse/use-mouse.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-mouse.d.ts","sourceRoot":"","sources":["../../src/use-mouse/use-mouse.ts"],"names":[],"mappings":"AAGA,wBAAgB,QAAQ,CAAC,CAAC,SAAS,WAAW,GAAG,GAAG;;;;EAiCnD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-move.d.ts","sourceRoot":"","sources":["../../src/use-move/use-move.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-move.d.ts","sourceRoot":"","sources":["../../src/use-move/use-move.ts"],"names":[],"mappings":"AAIA,MAAM,WAAW,eAAe;IAC9B,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,eAAO,MAAM,oBAAoB,aAAc,eAAe;;;CAG5D,CAAC;AAEH,UAAU,eAAe;IACvB,YAAY,CAAC,IAAI,IAAI,CAAC;IACtB,UAAU,CAAC,IAAI,IAAI,CAAC;CACrB;AAED,wBAAgB,OAAO,CAAC,CAAC,SAAS,WAAW,GAAG,cAAc,EAC5D,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,EAC1C,QAAQ,CAAC,EAAE,eAAe;;;EA6F3B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-scroll-into-view.d.ts","sourceRoot":"","sources":["../../src/use-scroll-into-view/use-scroll-into-view.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-scroll-into-view.d.ts","sourceRoot":"","sources":["../../src/use-scroll-into-view/use-scroll-into-view.ts"],"names":[],"mappings":"AAQA,UAAU,uBAAuB;IAC/B,0EAA0E;IAC1E,SAAS,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC;CACxC;AAED,UAAU,oBAAoB;IAC5B,kCAAkC;IAClC,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAE5B,yCAAyC;IACzC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,qBAAqB;IACrB,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IAEjB,0CAA0C;IAC1C,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAE/B,2DAA2D;IAC3D,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,kEAAkE;IAClE,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,wEAAwE;IACxE,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,wBAAgB,iBAAiB,CAC/B,MAAM,SAAS,WAAW,EAC1B,MAAM,SAAS,WAAW,GAAG,IAAI,GAAG,IAAI,EACxC,EACA,QAAe,EACf,IAAU,EACV,cAAc,EACd,MAAsB,EACtB,MAAU,EACV,UAAiB,EACjB,MAAc,GACf,GAAE,oBAAyB;;;qCAiBE,uBAAuB;kBAPhC,IAAI;EAwFxB"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
1
|
export declare function useToggle<T>(initialValue: T, options: [T, T]): readonly [T, (value?: React.SetStateAction<T>) => void];
|
|
3
2
|
export declare function useBooleanToggle(initialValue?: boolean): readonly [boolean, (value?: import("react").SetStateAction<boolean>) => void];
|
|
4
3
|
//# sourceMappingURL=use-toggle.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-toggle.d.ts","sourceRoot":"","sources":["../../src/use-toggle/use-toggle.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"use-toggle.d.ts","sourceRoot":"","sources":["../../src/use-toggle/use-toggle.ts"],"names":[],"mappings":"AAEA,wBAAgB,SAAS,CAAC,CAAC,EAAE,YAAY,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,yBAGnC,MAAM,cAAc,CAAC,CAAC,CAAC,WAehD;AAED,wBAAgB,gBAAgB,CAAC,YAAY,UAAQ,iFAEpD"}
|
package/package.json
CHANGED
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
var tabbable = require('./tabbable.js');
|
|
6
|
-
|
|
7
|
-
const focusLaterElements = [];
|
|
8
|
-
let focusElement = null;
|
|
9
|
-
let needToFocus = false;
|
|
10
|
-
function handleBlur() {
|
|
11
|
-
needToFocus = true;
|
|
12
|
-
}
|
|
13
|
-
function handleFocus() {
|
|
14
|
-
if (needToFocus) {
|
|
15
|
-
needToFocus = false;
|
|
16
|
-
if (!focusElement) {
|
|
17
|
-
return;
|
|
18
|
-
}
|
|
19
|
-
if (focusElement.contains(document.activeElement)) {
|
|
20
|
-
return;
|
|
21
|
-
}
|
|
22
|
-
const el = tabbable.findTabbableDescendants(focusElement)[0] || focusElement;
|
|
23
|
-
el.focus();
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
function markForFocusLater() {
|
|
27
|
-
focusLaterElements.push(document.activeElement);
|
|
28
|
-
}
|
|
29
|
-
function returnFocus() {
|
|
30
|
-
let toFocus = null;
|
|
31
|
-
try {
|
|
32
|
-
toFocus = focusLaterElements.pop();
|
|
33
|
-
if (toFocus)
|
|
34
|
-
toFocus.focus();
|
|
35
|
-
} catch (e) {
|
|
36
|
-
console.warn([
|
|
37
|
-
"[@mantine/hooks/use-focus-trap] Focus was returned to",
|
|
38
|
-
toFocus,
|
|
39
|
-
"but dom node does not exist"
|
|
40
|
-
].join(" "));
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
function setupScopedFocus(element) {
|
|
44
|
-
focusElement = element;
|
|
45
|
-
document.addEventListener("focusout", handleBlur, false);
|
|
46
|
-
document.addEventListener("focusin", handleFocus, true);
|
|
47
|
-
}
|
|
48
|
-
function teardownScopedFocus() {
|
|
49
|
-
focusElement = null;
|
|
50
|
-
document.removeEventListener("focusout", handleBlur);
|
|
51
|
-
document.removeEventListener("focusin", handleFocus);
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
exports.markForFocusLater = markForFocusLater;
|
|
55
|
-
exports.returnFocus = returnFocus;
|
|
56
|
-
exports.setupScopedFocus = setupScopedFocus;
|
|
57
|
-
exports.teardownScopedFocus = teardownScopedFocus;
|
|
58
|
-
//# sourceMappingURL=focus-manager.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"focus-manager.js","sources":["../../src/use-focus-trap/focus-manager.ts"],"sourcesContent":["import { findTabbableDescendants } from './tabbable';\n\nconst focusLaterElements: HTMLElement[] = [];\nlet focusElement: HTMLElement = null;\nlet needToFocus = false;\n\nfunction handleBlur() {\n needToFocus = true;\n}\n\nfunction handleFocus() {\n if (needToFocus) {\n needToFocus = false;\n\n if (!focusElement) {\n return;\n }\n\n if (focusElement.contains(document.activeElement)) {\n return;\n }\n\n const el = findTabbableDescendants(focusElement)[0] || focusElement;\n el.focus();\n }\n}\n\nexport function markForFocusLater() {\n focusLaterElements.push(document.activeElement as HTMLElement);\n}\n\nexport function returnFocus() {\n let toFocus = null;\n try {\n toFocus = focusLaterElements.pop();\n if (toFocus) toFocus.focus();\n } catch (e) {\n // eslint-disable-next-line no-console\n console.warn(\n [\n '[@mantine/hooks/use-focus-trap] Focus was returned to',\n toFocus,\n 'but dom node does not exist',\n ].join(' ')\n );\n }\n}\n\nexport function setupScopedFocus(element: HTMLElement) {\n focusElement = element;\n document.addEventListener('focusout', handleBlur, false);\n document.addEventListener('focusin', handleFocus, true);\n}\n\nexport function teardownScopedFocus() {\n focusElement = null;\n document.removeEventListener('focusout', handleBlur);\n document.removeEventListener('focusin', handleFocus);\n}\n"],"names":["findTabbableDescendants"],"mappings":";;;;;;AACA,MAAM,kBAAkB,GAAG,EAAE,CAAC;AAC9B,IAAI,YAAY,GAAG,IAAI,CAAC;AACxB,IAAI,WAAW,GAAG,KAAK,CAAC;AACxB,SAAS,UAAU,GAAG;AACtB,EAAE,WAAW,GAAG,IAAI,CAAC;AACrB,CAAC;AACD,SAAS,WAAW,GAAG;AACvB,EAAE,IAAI,WAAW,EAAE;AACnB,IAAI,WAAW,GAAG,KAAK,CAAC;AACxB,IAAI,IAAI,CAAC,YAAY,EAAE;AACvB,MAAM,OAAO;AACb,KAAK;AACL,IAAI,IAAI,YAAY,CAAC,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE;AACvD,MAAM,OAAO;AACb,KAAK;AACL,IAAI,MAAM,EAAE,GAAGA,gCAAuB,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,IAAI,YAAY,CAAC;AACxE,IAAI,EAAE,CAAC,KAAK,EAAE,CAAC;AACf,GAAG;AACH,CAAC;AACM,SAAS,iBAAiB,GAAG;AACpC,EAAE,kBAAkB,CAAC,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;AAClD,CAAC;AACM,SAAS,WAAW,GAAG;AAC9B,EAAE,IAAI,OAAO,GAAG,IAAI,CAAC;AACrB,EAAE,IAAI;AACN,IAAI,OAAO,GAAG,kBAAkB,CAAC,GAAG,EAAE,CAAC;AACvC,IAAI,IAAI,OAAO;AACf,MAAM,OAAO,CAAC,KAAK,EAAE,CAAC;AACtB,GAAG,CAAC,OAAO,CAAC,EAAE;AACd,IAAI,OAAO,CAAC,IAAI,CAAC;AACjB,MAAM,uDAAuD;AAC7D,MAAM,OAAO;AACb,MAAM,6BAA6B;AACnC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;AACjB,GAAG;AACH,CAAC;AACM,SAAS,gBAAgB,CAAC,OAAO,EAAE;AAC1C,EAAE,YAAY,GAAG,OAAO,CAAC;AACzB,EAAE,QAAQ,CAAC,gBAAgB,CAAC,UAAU,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC;AAC3D,EAAE,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,WAAW,EAAE,IAAI,CAAC,CAAC;AAC1D,CAAC;AACM,SAAS,mBAAmB,GAAG;AACtC,EAAE,YAAY,GAAG,IAAI,CAAC;AACtB,EAAE,QAAQ,CAAC,mBAAmB,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;AACvD,EAAE,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;AACvD;;;;;;;"}
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
import { findTabbableDescendants } from './tabbable.js';
|
|
2
|
-
|
|
3
|
-
const focusLaterElements = [];
|
|
4
|
-
let focusElement = null;
|
|
5
|
-
let needToFocus = false;
|
|
6
|
-
function handleBlur() {
|
|
7
|
-
needToFocus = true;
|
|
8
|
-
}
|
|
9
|
-
function handleFocus() {
|
|
10
|
-
if (needToFocus) {
|
|
11
|
-
needToFocus = false;
|
|
12
|
-
if (!focusElement) {
|
|
13
|
-
return;
|
|
14
|
-
}
|
|
15
|
-
if (focusElement.contains(document.activeElement)) {
|
|
16
|
-
return;
|
|
17
|
-
}
|
|
18
|
-
const el = findTabbableDescendants(focusElement)[0] || focusElement;
|
|
19
|
-
el.focus();
|
|
20
|
-
}
|
|
21
|
-
}
|
|
22
|
-
function markForFocusLater() {
|
|
23
|
-
focusLaterElements.push(document.activeElement);
|
|
24
|
-
}
|
|
25
|
-
function returnFocus() {
|
|
26
|
-
let toFocus = null;
|
|
27
|
-
try {
|
|
28
|
-
toFocus = focusLaterElements.pop();
|
|
29
|
-
if (toFocus)
|
|
30
|
-
toFocus.focus();
|
|
31
|
-
} catch (e) {
|
|
32
|
-
console.warn([
|
|
33
|
-
"[@mantine/hooks/use-focus-trap] Focus was returned to",
|
|
34
|
-
toFocus,
|
|
35
|
-
"but dom node does not exist"
|
|
36
|
-
].join(" "));
|
|
37
|
-
}
|
|
38
|
-
}
|
|
39
|
-
function setupScopedFocus(element) {
|
|
40
|
-
focusElement = element;
|
|
41
|
-
document.addEventListener("focusout", handleBlur, false);
|
|
42
|
-
document.addEventListener("focusin", handleFocus, true);
|
|
43
|
-
}
|
|
44
|
-
function teardownScopedFocus() {
|
|
45
|
-
focusElement = null;
|
|
46
|
-
document.removeEventListener("focusout", handleBlur);
|
|
47
|
-
document.removeEventListener("focusin", handleFocus);
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
export { markForFocusLater, returnFocus, setupScopedFocus, teardownScopedFocus };
|
|
51
|
-
//# sourceMappingURL=focus-manager.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"focus-manager.js","sources":["../../src/use-focus-trap/focus-manager.ts"],"sourcesContent":["import { findTabbableDescendants } from './tabbable';\n\nconst focusLaterElements: HTMLElement[] = [];\nlet focusElement: HTMLElement = null;\nlet needToFocus = false;\n\nfunction handleBlur() {\n needToFocus = true;\n}\n\nfunction handleFocus() {\n if (needToFocus) {\n needToFocus = false;\n\n if (!focusElement) {\n return;\n }\n\n if (focusElement.contains(document.activeElement)) {\n return;\n }\n\n const el = findTabbableDescendants(focusElement)[0] || focusElement;\n el.focus();\n }\n}\n\nexport function markForFocusLater() {\n focusLaterElements.push(document.activeElement as HTMLElement);\n}\n\nexport function returnFocus() {\n let toFocus = null;\n try {\n toFocus = focusLaterElements.pop();\n if (toFocus) toFocus.focus();\n } catch (e) {\n // eslint-disable-next-line no-console\n console.warn(\n [\n '[@mantine/hooks/use-focus-trap] Focus was returned to',\n toFocus,\n 'but dom node does not exist',\n ].join(' ')\n );\n }\n}\n\nexport function setupScopedFocus(element: HTMLElement) {\n focusElement = element;\n document.addEventListener('focusout', handleBlur, false);\n document.addEventListener('focusin', handleFocus, true);\n}\n\nexport function teardownScopedFocus() {\n focusElement = null;\n document.removeEventListener('focusout', handleBlur);\n document.removeEventListener('focusin', handleFocus);\n}\n"],"names":[],"mappings":";;AACA,MAAM,kBAAkB,GAAG,EAAE,CAAC;AAC9B,IAAI,YAAY,GAAG,IAAI,CAAC;AACxB,IAAI,WAAW,GAAG,KAAK,CAAC;AACxB,SAAS,UAAU,GAAG;AACtB,EAAE,WAAW,GAAG,IAAI,CAAC;AACrB,CAAC;AACD,SAAS,WAAW,GAAG;AACvB,EAAE,IAAI,WAAW,EAAE;AACnB,IAAI,WAAW,GAAG,KAAK,CAAC;AACxB,IAAI,IAAI,CAAC,YAAY,EAAE;AACvB,MAAM,OAAO;AACb,KAAK;AACL,IAAI,IAAI,YAAY,CAAC,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE;AACvD,MAAM,OAAO;AACb,KAAK;AACL,IAAI,MAAM,EAAE,GAAG,uBAAuB,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,IAAI,YAAY,CAAC;AACxE,IAAI,EAAE,CAAC,KAAK,EAAE,CAAC;AACf,GAAG;AACH,CAAC;AACM,SAAS,iBAAiB,GAAG;AACpC,EAAE,kBAAkB,CAAC,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;AAClD,CAAC;AACM,SAAS,WAAW,GAAG;AAC9B,EAAE,IAAI,OAAO,GAAG,IAAI,CAAC;AACrB,EAAE,IAAI;AACN,IAAI,OAAO,GAAG,kBAAkB,CAAC,GAAG,EAAE,CAAC;AACvC,IAAI,IAAI,OAAO;AACf,MAAM,OAAO,CAAC,KAAK,EAAE,CAAC;AACtB,GAAG,CAAC,OAAO,CAAC,EAAE;AACd,IAAI,OAAO,CAAC,IAAI,CAAC;AACjB,MAAM,uDAAuD;AAC7D,MAAM,OAAO;AACb,MAAM,6BAA6B;AACnC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;AACjB,GAAG;AACH,CAAC;AACM,SAAS,gBAAgB,CAAC,OAAO,EAAE;AAC1C,EAAE,YAAY,GAAG,OAAO,CAAC;AACzB,EAAE,QAAQ,CAAC,gBAAgB,CAAC,UAAU,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC;AAC3D,EAAE,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,WAAW,EAAE,IAAI,CAAC,CAAC;AAC1D,CAAC;AACM,SAAS,mBAAmB,GAAG;AACtC,EAAE,YAAY,GAAG,IAAI,CAAC;AACtB,EAAE,QAAQ,CAAC,mBAAmB,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;AACvD,EAAE,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;AACvD;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"focus-manager.d.ts","sourceRoot":"","sources":["../../src/use-focus-trap/focus-manager.ts"],"names":[],"mappings":"AA2BA,wBAAgB,iBAAiB,SAEhC;AAED,wBAAgB,WAAW,SAe1B;AAED,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,WAAW,QAIpD;AAED,wBAAgB,mBAAmB,SAIlC"}
|