@vuu-ui/vuu-utils 2.0.0 → 2.1.0-alpha.10
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/node_modules/@dnd-kit/react/hooks.js +3 -3
- package/cjs/node_modules/@floating-ui/dom/dist/floating-ui.dom.js +492 -0
- package/cjs/node_modules/@floating-ui/dom/dist/floating-ui.dom.js.map +1 -0
- package/cjs/node_modules/@floating-ui/react/dist/floating-ui.react.js +987 -0
- package/cjs/node_modules/@floating-ui/react/dist/floating-ui.react.js.map +1 -0
- package/cjs/node_modules/@floating-ui/react/dist/floating-ui.react.utils.js +130 -0
- package/cjs/node_modules/@floating-ui/react/dist/floating-ui.react.utils.js.map +1 -0
- package/cjs/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js +183 -0
- package/cjs/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js.map +1 -0
- package/cjs/node_modules/@floating-ui/utils/dist/floating-ui.utils.js +39 -0
- package/cjs/node_modules/@floating-ui/utils/dist/floating-ui.utils.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/aria-announcer/AriaAnnouncerContext.js +10 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/aria-announcer/AriaAnnouncerContext.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/aria-announcer/AriaAnnouncerProvider.js +76 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/aria-announcer/AriaAnnouncerProvider.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/aria-announcer/useAriaAnnouncer.js +52 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/aria-announcer/useAriaAnnouncer.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/breakpoints/BreakpointProvider.js +59 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/breakpoints/BreakpointProvider.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/breakpoints/Breakpoints.js +12 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/breakpoints/Breakpoints.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/button/Button.css.js +6 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/button/Button.css.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/button/Button.js +96 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/button/Button.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/button/useButton.js +65 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/button/useButton.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/salt-provider/ProviderContext.js +11 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/salt-provider/ProviderContext.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/salt-provider/SaltProvider.css.js +6 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/salt-provider/SaltProvider.css.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/salt-provider/SaltProvider.js +160 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/salt-provider/SaltProvider.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/salt-provider/ThemeApplicator.js +115 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/salt-provider/ThemeApplicator.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/spinner/Spinner.css.js +6 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/spinner/Spinner.css.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/spinner/Spinner.js +86 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/spinner/Spinner.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/spinner/svgSpinners/SpinnerSVG.js +93 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/createChainedFunction.js +20 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/createChainedFunction.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/createContext.js +14 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/createContext.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/debounce.js +22 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/debounce.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/makePrefixer.js +6 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/makePrefixer.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/useFloatingUI/useFloatingUI.js +52 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/useFloatingUI/useFloatingUI.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/useId.js +45 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/useId.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/useIsomorphicLayoutEffect.js +8 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/useIsomorphicLayoutEffect.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/usePreventScroll.js +233 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/utils/usePreventScroll.js.map +1 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/viewport/ViewportProvider.js +35 -0
- package/cjs/node_modules/@salt-ds/core/dist-es/viewport/ViewportProvider.js.map +1 -0
- package/cjs/node_modules/@salt-ds/styles/dist-es/style-injection-provider/index.js +22 -0
- package/cjs/node_modules/@salt-ds/styles/dist-es/style-injection-provider/index.js.map +1 -0
- package/cjs/node_modules/@salt-ds/styles/dist-es/use-style-injection/InsertionPointProvider.js +16 -0
- package/cjs/node_modules/@salt-ds/styles/dist-es/use-style-injection/InsertionPointProvider.js.map +1 -0
- package/cjs/node_modules/@salt-ds/styles/dist-es/use-style-injection/useStyleInjection.js +75 -0
- package/cjs/node_modules/@salt-ds/styles/dist-es/use-style-injection/useStyleInjection.js.map +1 -0
- package/cjs/node_modules/@salt-ds/window/dist-es/WindowProvider.js +17 -0
- package/cjs/node_modules/@salt-ds/window/dist-es/WindowProvider.js.map +1 -0
- package/cjs/node_modules/tabbable/dist/index.esm.js +550 -0
- package/cjs/node_modules/tabbable/dist/index.esm.js.map +1 -0
- package/cjs/packages/vuu-utils/src/ThemeProvider.js +2 -2
- package/cjs/packages/vuu-utils/src/ThemeProvider.js.map +1 -1
- package/cjs/packages/vuu-utils/src/data-editing/DataEditingProvider.js +25 -0
- package/cjs/packages/vuu-utils/src/data-editing/DataEditingProvider.js.map +1 -0
- package/cjs/packages/vuu-utils/src/data-editing/EditButtons.js +31 -0
- package/cjs/packages/vuu-utils/src/data-editing/EditButtons.js.map +1 -0
- package/cjs/packages/vuu-utils/src/data-editing/EditTracker.js +157 -0
- package/cjs/packages/vuu-utils/src/data-editing/EditTracker.js.map +1 -0
- package/cjs/packages/vuu-utils/src/data-editing/useEditableTable.js +65 -0
- package/cjs/packages/vuu-utils/src/data-editing/useEditableTable.js.map +1 -0
- package/cjs/packages/vuu-utils/src/index.js +11 -0
- package/cjs/packages/vuu-utils/src/index.js.map +1 -1
- package/cjs/packages/vuu-utils/src/theme-utils.js +36 -0
- package/cjs/packages/vuu-utils/src/theme-utils.js.map +1 -0
- package/cjs/packages/vuu-utils/src/url-utils.js +2 -2
- package/cjs/packages/vuu-utils/src/url-utils.js.map +1 -1
- package/esm/node_modules/@floating-ui/dom/dist/floating-ui.dom.js +489 -0
- package/esm/node_modules/@floating-ui/dom/dist/floating-ui.dom.js.map +1 -0
- package/esm/node_modules/@floating-ui/react/dist/floating-ui.react.js +962 -0
- package/esm/node_modules/@floating-ui/react/dist/floating-ui.react.js.map +1 -0
- package/esm/node_modules/@floating-ui/react/dist/floating-ui.react.utils.js +114 -0
- package/esm/node_modules/@floating-ui/react/dist/floating-ui.react.utils.js.map +1 -0
- package/esm/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js +162 -0
- package/esm/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js.map +1 -0
- package/esm/node_modules/@floating-ui/utils/dist/floating-ui.utils.js +33 -0
- package/esm/node_modules/@floating-ui/utils/dist/floating-ui.utils.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/aria-announcer/AriaAnnouncerContext.js +8 -0
- package/esm/node_modules/@salt-ds/core/dist-es/aria-announcer/AriaAnnouncerContext.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/aria-announcer/AriaAnnouncerProvider.js +73 -0
- package/esm/node_modules/@salt-ds/core/dist-es/aria-announcer/AriaAnnouncerProvider.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/aria-announcer/useAriaAnnouncer.js +50 -0
- package/esm/node_modules/@salt-ds/core/dist-es/aria-announcer/useAriaAnnouncer.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/breakpoints/BreakpointProvider.js +56 -0
- package/esm/node_modules/@salt-ds/core/dist-es/breakpoints/BreakpointProvider.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/breakpoints/Breakpoints.js +10 -0
- package/esm/node_modules/@salt-ds/core/dist-es/breakpoints/Breakpoints.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/button/Button.css.js +4 -0
- package/esm/node_modules/@salt-ds/core/dist-es/button/Button.css.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/button/Button.js +94 -0
- package/esm/node_modules/@salt-ds/core/dist-es/button/Button.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/button/useButton.js +63 -0
- package/esm/node_modules/@salt-ds/core/dist-es/button/useButton.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/salt-provider/ProviderContext.js +9 -0
- package/esm/node_modules/@salt-ds/core/dist-es/salt-provider/ProviderContext.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/salt-provider/SaltProvider.css.js +4 -0
- package/esm/node_modules/@salt-ds/core/dist-es/salt-provider/SaltProvider.css.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/salt-provider/SaltProvider.js +151 -0
- package/esm/node_modules/@salt-ds/core/dist-es/salt-provider/SaltProvider.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/salt-provider/ThemeApplicator.js +113 -0
- package/esm/node_modules/@salt-ds/core/dist-es/salt-provider/ThemeApplicator.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/spinner/Spinner.css.js +4 -0
- package/esm/node_modules/@salt-ds/core/dist-es/spinner/Spinner.css.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/spinner/Spinner.js +84 -0
- package/esm/node_modules/@salt-ds/core/dist-es/spinner/Spinner.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/spinner/svgSpinners/SpinnerSVG.js +91 -0
- package/esm/node_modules/@salt-ds/core/dist-es/spinner/svgSpinners/SpinnerSVG.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/createChainedFunction.js +18 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/createChainedFunction.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/createContext.js +12 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/createContext.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/debounce.js +20 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/debounce.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/makePrefixer.js +4 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/makePrefixer.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/useFloatingUI/useFloatingUI.js +50 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/useFloatingUI/useFloatingUI.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/useId.js +24 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/useId.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/useIsomorphicLayoutEffect.js +6 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/useIsomorphicLayoutEffect.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/usePreventScroll.js +231 -0
- package/esm/node_modules/@salt-ds/core/dist-es/utils/usePreventScroll.js.map +1 -0
- package/esm/node_modules/@salt-ds/core/dist-es/viewport/ViewportProvider.js +32 -0
- package/esm/node_modules/@salt-ds/core/dist-es/viewport/ViewportProvider.js.map +1 -0
- package/esm/node_modules/@salt-ds/styles/dist-es/style-injection-provider/index.js +19 -0
- package/esm/node_modules/@salt-ds/styles/dist-es/style-injection-provider/index.js.map +1 -0
- package/esm/node_modules/@salt-ds/styles/dist-es/use-style-injection/InsertionPointProvider.js +14 -0
- package/esm/node_modules/@salt-ds/styles/dist-es/use-style-injection/InsertionPointProvider.js.map +1 -0
- package/esm/node_modules/@salt-ds/styles/dist-es/use-style-injection/useStyleInjection.js +54 -0
- package/esm/node_modules/@salt-ds/styles/dist-es/use-style-injection/useStyleInjection.js.map +1 -0
- package/esm/node_modules/@salt-ds/window/dist-es/WindowProvider.js +15 -0
- package/esm/node_modules/@salt-ds/window/dist-es/WindowProvider.js.map +1 -0
- package/esm/node_modules/tabbable/dist/index.esm.js +546 -0
- package/esm/node_modules/tabbable/dist/index.esm.js.map +1 -0
- package/esm/packages/vuu-utils/src/ThemeProvider.js +2 -2
- package/esm/packages/vuu-utils/src/ThemeProvider.js.map +1 -1
- package/esm/packages/vuu-utils/src/context-definitions/WorkspaceContext.js +2 -2
- package/esm/packages/vuu-utils/src/context-definitions/WorkspaceContext.js.map +1 -1
- package/esm/packages/vuu-utils/src/data-editing/DataEditingProvider.js +22 -0
- package/esm/packages/vuu-utils/src/data-editing/DataEditingProvider.js.map +1 -0
- package/esm/packages/vuu-utils/src/data-editing/EditButtons.js +29 -0
- package/esm/packages/vuu-utils/src/data-editing/EditButtons.js.map +1 -0
- package/esm/packages/vuu-utils/src/data-editing/EditTracker.js +155 -0
- package/esm/packages/vuu-utils/src/data-editing/EditTracker.js.map +1 -0
- package/esm/packages/vuu-utils/src/data-editing/useEditableTable.js +63 -0
- package/esm/packages/vuu-utils/src/data-editing/useEditableTable.js.map +1 -0
- package/esm/packages/vuu-utils/src/feature-utils.js +2 -2
- package/esm/packages/vuu-utils/src/feature-utils.js.map +1 -1
- package/esm/packages/vuu-utils/src/index.js +5 -0
- package/esm/packages/vuu-utils/src/index.js.map +1 -1
- package/esm/packages/vuu-utils/src/theme-utils.js +34 -0
- package/esm/packages/vuu-utils/src/theme-utils.js.map +1 -0
- package/esm/packages/vuu-utils/src/url-utils.js +2 -2
- package/esm/packages/vuu-utils/src/url-utils.js.map +1 -1
- package/package.json +6 -6
- package/types/data-editing/DataEditingProvider.d.ts +7 -0
- package/types/data-editing/EditButtons.d.ts +7 -0
- package/types/data-editing/EditModeProvider.d.ts +13 -0
- package/types/data-editing/EditTracker.d.ts +24 -0
- package/types/data-editing/useEditableTable.d.ts +26 -0
- package/types/index.d.ts +6 -1
- package/types/theme-utils.d.ts +14 -0
- package/types/url-utils.d.ts +2 -1
|
@@ -0,0 +1,987 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var floatingUi_react_utils = require('./floating-ui.react.utils.js');
|
|
5
|
+
var floatingUi_utils_dom = require('../../utils/dist/floating-ui.utils.dom.js');
|
|
6
|
+
var index_esm = require('../../../tabbable/dist/index.esm.js');
|
|
7
|
+
var ReactDOM = require('react-dom');
|
|
8
|
+
|
|
9
|
+
function _interopNamespaceDefault(e) {
|
|
10
|
+
var n = Object.create(null);
|
|
11
|
+
if (e) {
|
|
12
|
+
Object.keys(e).forEach(function (k) {
|
|
13
|
+
if (k !== 'default') {
|
|
14
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
15
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
16
|
+
enumerable: true,
|
|
17
|
+
get: function () { return e[k]; }
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
n.default = e;
|
|
23
|
+
return Object.freeze(n);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
27
|
+
var ReactDOM__namespace = /*#__PURE__*/_interopNamespaceDefault(ReactDOM);
|
|
28
|
+
|
|
29
|
+
// https://github.com/mui/material-ui/issues/41190#issuecomment-2040873379
|
|
30
|
+
const SafeReact = {
|
|
31
|
+
...React__namespace
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
const useInsertionEffect = SafeReact.useInsertionEffect;
|
|
35
|
+
const useSafeInsertionEffect = useInsertionEffect || (fn => fn());
|
|
36
|
+
function useEffectEvent(callback) {
|
|
37
|
+
const ref = React__namespace.useRef(() => {
|
|
38
|
+
if (process.env.NODE_ENV !== "production") {
|
|
39
|
+
throw new Error('Cannot call an event handler while rendering.');
|
|
40
|
+
}
|
|
41
|
+
});
|
|
42
|
+
useSafeInsertionEffect(() => {
|
|
43
|
+
ref.current = callback;
|
|
44
|
+
});
|
|
45
|
+
return React__namespace.useCallback(function () {
|
|
46
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
47
|
+
args[_key] = arguments[_key];
|
|
48
|
+
}
|
|
49
|
+
return ref.current == null ? void 0 : ref.current(...args);
|
|
50
|
+
}, []);
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
var index = typeof document !== 'undefined' ? React.useLayoutEffect : React.useEffect;
|
|
54
|
+
|
|
55
|
+
function _extends() {
|
|
56
|
+
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
57
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
58
|
+
var source = arguments[i];
|
|
59
|
+
for (var key in source) {
|
|
60
|
+
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
61
|
+
target[key] = source[key];
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
return target;
|
|
66
|
+
};
|
|
67
|
+
return _extends.apply(this, arguments);
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
let serverHandoffComplete = false;
|
|
71
|
+
let count = 0;
|
|
72
|
+
const genId = () => // Ensure the id is unique with multiple independent versions of Floating UI
|
|
73
|
+
// on <React 18
|
|
74
|
+
"floating-ui-" + Math.random().toString(36).slice(2, 6) + count++;
|
|
75
|
+
function useFloatingId() {
|
|
76
|
+
const [id, setId] = React__namespace.useState(() => serverHandoffComplete ? genId() : undefined);
|
|
77
|
+
index(() => {
|
|
78
|
+
if (id == null) {
|
|
79
|
+
setId(genId());
|
|
80
|
+
}
|
|
81
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
82
|
+
}, []);
|
|
83
|
+
React__namespace.useEffect(() => {
|
|
84
|
+
serverHandoffComplete = true;
|
|
85
|
+
}, []);
|
|
86
|
+
return id;
|
|
87
|
+
}
|
|
88
|
+
const useReactId = SafeReact.useId;
|
|
89
|
+
|
|
90
|
+
/**
|
|
91
|
+
* Uses React 18's built-in `useId()` when available, or falls back to a
|
|
92
|
+
* slightly less performant (requiring a double render) implementation for
|
|
93
|
+
* earlier React versions.
|
|
94
|
+
* @see https://floating-ui.com/docs/react-utils#useid
|
|
95
|
+
*/
|
|
96
|
+
const useId = useReactId || useFloatingId;
|
|
97
|
+
if (process.env.NODE_ENV !== "production") ;
|
|
98
|
+
const FloatingTreeContext = /*#__PURE__*/React__namespace.createContext(null);
|
|
99
|
+
|
|
100
|
+
/**
|
|
101
|
+
* Returns the nearest floating tree context, if available.
|
|
102
|
+
*/
|
|
103
|
+
const useFloatingTree = () => React__namespace.useContext(FloatingTreeContext);
|
|
104
|
+
|
|
105
|
+
function createAttribute(name) {
|
|
106
|
+
return "data-floating-ui-" + name;
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
function useLatestRef(value) {
|
|
110
|
+
const ref = React.useRef(value);
|
|
111
|
+
index(() => {
|
|
112
|
+
ref.current = value;
|
|
113
|
+
});
|
|
114
|
+
return ref;
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
let rafId = 0;
|
|
118
|
+
function enqueueFocus(el, options) {
|
|
119
|
+
if (options === void 0) {
|
|
120
|
+
options = {};
|
|
121
|
+
}
|
|
122
|
+
const {
|
|
123
|
+
preventScroll = false,
|
|
124
|
+
cancelPrevious = true,
|
|
125
|
+
sync = false
|
|
126
|
+
} = options;
|
|
127
|
+
cancelPrevious && cancelAnimationFrame(rafId);
|
|
128
|
+
const exec = () => el == null ? void 0 : el.focus({
|
|
129
|
+
preventScroll
|
|
130
|
+
});
|
|
131
|
+
if (sync) {
|
|
132
|
+
exec();
|
|
133
|
+
} else {
|
|
134
|
+
rafId = requestAnimationFrame(exec);
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
function getAncestors(nodes, id) {
|
|
139
|
+
var _nodes$find;
|
|
140
|
+
let allAncestors = [];
|
|
141
|
+
let currentParentId = (_nodes$find = nodes.find(node => node.id === id)) == null ? void 0 : _nodes$find.parentId;
|
|
142
|
+
while (currentParentId) {
|
|
143
|
+
const currentNode = nodes.find(node => node.id === currentParentId);
|
|
144
|
+
currentParentId = currentNode == null ? void 0 : currentNode.parentId;
|
|
145
|
+
if (currentNode) {
|
|
146
|
+
allAncestors = allAncestors.concat(currentNode);
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
return allAncestors;
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
function getChildren(nodes, id) {
|
|
153
|
+
let allChildren = nodes.filter(node => {
|
|
154
|
+
var _node$context;
|
|
155
|
+
return node.parentId === id && ((_node$context = node.context) == null ? void 0 : _node$context.open);
|
|
156
|
+
});
|
|
157
|
+
let currentChildren = allChildren;
|
|
158
|
+
while (currentChildren.length) {
|
|
159
|
+
currentChildren = nodes.filter(node => {
|
|
160
|
+
var _currentChildren;
|
|
161
|
+
return (_currentChildren = currentChildren) == null ? void 0 : _currentChildren.some(n => {
|
|
162
|
+
var _node$context2;
|
|
163
|
+
return node.parentId === n.id && ((_node$context2 = node.context) == null ? void 0 : _node$context2.open);
|
|
164
|
+
});
|
|
165
|
+
});
|
|
166
|
+
allChildren = allChildren.concat(currentChildren);
|
|
167
|
+
}
|
|
168
|
+
return allChildren;
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
// Modified to add conditional `aria-hidden` support:
|
|
172
|
+
// https://github.com/theKashey/aria-hidden/blob/9220c8f4a4fd35f63bee5510a9f41a37264382d4/src/index.ts
|
|
173
|
+
let counterMap = /*#__PURE__*/new WeakMap();
|
|
174
|
+
let uncontrolledElementsSet = /*#__PURE__*/new WeakSet();
|
|
175
|
+
let markerMap = {};
|
|
176
|
+
let lockCount$1 = 0;
|
|
177
|
+
const supportsInert = () => typeof HTMLElement !== 'undefined' && 'inert' in HTMLElement.prototype;
|
|
178
|
+
const unwrapHost = node => node && (node.host || unwrapHost(node.parentNode));
|
|
179
|
+
const correctElements = (parent, targets) => targets.map(target => {
|
|
180
|
+
if (parent.contains(target)) {
|
|
181
|
+
return target;
|
|
182
|
+
}
|
|
183
|
+
const correctedTarget = unwrapHost(target);
|
|
184
|
+
if (parent.contains(correctedTarget)) {
|
|
185
|
+
return correctedTarget;
|
|
186
|
+
}
|
|
187
|
+
return null;
|
|
188
|
+
}).filter(x => x != null);
|
|
189
|
+
function applyAttributeToOthers(uncorrectedAvoidElements, body, ariaHidden, inert) {
|
|
190
|
+
const markerName = 'data-floating-ui-inert';
|
|
191
|
+
const controlAttribute = inert ? 'inert' : ariaHidden ? 'aria-hidden' : null;
|
|
192
|
+
const avoidElements = correctElements(body, uncorrectedAvoidElements);
|
|
193
|
+
const elementsToKeep = new Set();
|
|
194
|
+
const elementsToStop = new Set(avoidElements);
|
|
195
|
+
const hiddenElements = [];
|
|
196
|
+
if (!markerMap[markerName]) {
|
|
197
|
+
markerMap[markerName] = new WeakMap();
|
|
198
|
+
}
|
|
199
|
+
const markerCounter = markerMap[markerName];
|
|
200
|
+
avoidElements.forEach(keep);
|
|
201
|
+
deep(body);
|
|
202
|
+
elementsToKeep.clear();
|
|
203
|
+
function keep(el) {
|
|
204
|
+
if (!el || elementsToKeep.has(el)) {
|
|
205
|
+
return;
|
|
206
|
+
}
|
|
207
|
+
elementsToKeep.add(el);
|
|
208
|
+
el.parentNode && keep(el.parentNode);
|
|
209
|
+
}
|
|
210
|
+
function deep(parent) {
|
|
211
|
+
if (!parent || elementsToStop.has(parent)) {
|
|
212
|
+
return;
|
|
213
|
+
}
|
|
214
|
+
[].forEach.call(parent.children, node => {
|
|
215
|
+
if (floatingUi_utils_dom.getNodeName(node) === 'script') return;
|
|
216
|
+
if (elementsToKeep.has(node)) {
|
|
217
|
+
deep(node);
|
|
218
|
+
} else {
|
|
219
|
+
const attr = controlAttribute ? node.getAttribute(controlAttribute) : null;
|
|
220
|
+
const alreadyHidden = attr !== null && attr !== 'false';
|
|
221
|
+
const counterValue = (counterMap.get(node) || 0) + 1;
|
|
222
|
+
const markerValue = (markerCounter.get(node) || 0) + 1;
|
|
223
|
+
counterMap.set(node, counterValue);
|
|
224
|
+
markerCounter.set(node, markerValue);
|
|
225
|
+
hiddenElements.push(node);
|
|
226
|
+
if (counterValue === 1 && alreadyHidden) {
|
|
227
|
+
uncontrolledElementsSet.add(node);
|
|
228
|
+
}
|
|
229
|
+
if (markerValue === 1) {
|
|
230
|
+
node.setAttribute(markerName, '');
|
|
231
|
+
}
|
|
232
|
+
if (!alreadyHidden && controlAttribute) {
|
|
233
|
+
node.setAttribute(controlAttribute, 'true');
|
|
234
|
+
}
|
|
235
|
+
}
|
|
236
|
+
});
|
|
237
|
+
}
|
|
238
|
+
lockCount$1++;
|
|
239
|
+
return () => {
|
|
240
|
+
hiddenElements.forEach(element => {
|
|
241
|
+
const counterValue = (counterMap.get(element) || 0) - 1;
|
|
242
|
+
const markerValue = (markerCounter.get(element) || 0) - 1;
|
|
243
|
+
counterMap.set(element, counterValue);
|
|
244
|
+
markerCounter.set(element, markerValue);
|
|
245
|
+
if (!counterValue) {
|
|
246
|
+
if (!uncontrolledElementsSet.has(element) && controlAttribute) {
|
|
247
|
+
element.removeAttribute(controlAttribute);
|
|
248
|
+
}
|
|
249
|
+
uncontrolledElementsSet.delete(element);
|
|
250
|
+
}
|
|
251
|
+
if (!markerValue) {
|
|
252
|
+
element.removeAttribute(markerName);
|
|
253
|
+
}
|
|
254
|
+
});
|
|
255
|
+
lockCount$1--;
|
|
256
|
+
if (!lockCount$1) {
|
|
257
|
+
counterMap = new WeakMap();
|
|
258
|
+
counterMap = new WeakMap();
|
|
259
|
+
uncontrolledElementsSet = new WeakSet();
|
|
260
|
+
markerMap = {};
|
|
261
|
+
}
|
|
262
|
+
};
|
|
263
|
+
}
|
|
264
|
+
function markOthers(avoidElements, ariaHidden, inert) {
|
|
265
|
+
if (ariaHidden === void 0) {
|
|
266
|
+
ariaHidden = false;
|
|
267
|
+
}
|
|
268
|
+
if (inert === void 0) {
|
|
269
|
+
inert = false;
|
|
270
|
+
}
|
|
271
|
+
const body = floatingUi_react_utils.getDocument(avoidElements[0]).body;
|
|
272
|
+
return applyAttributeToOthers(avoidElements.concat(Array.from(body.querySelectorAll('[aria-live]'))), body, ariaHidden, inert);
|
|
273
|
+
}
|
|
274
|
+
|
|
275
|
+
const getTabbableOptions = () => ({
|
|
276
|
+
getShadowRoot: true,
|
|
277
|
+
displayCheck:
|
|
278
|
+
// JSDOM does not support the `tabbable` library. To solve this we can
|
|
279
|
+
// check if `ResizeObserver` is a real function (not polyfilled), which
|
|
280
|
+
// determines if the current environment is JSDOM-like.
|
|
281
|
+
typeof ResizeObserver === 'function' && ResizeObserver.toString().includes('[native code]') ? 'full' : 'none'
|
|
282
|
+
});
|
|
283
|
+
function getTabbableIn(container, direction) {
|
|
284
|
+
const allTabbable = index_esm.tabbable(container, getTabbableOptions());
|
|
285
|
+
if (direction === 'prev') {
|
|
286
|
+
allTabbable.reverse();
|
|
287
|
+
}
|
|
288
|
+
const activeIndex = allTabbable.indexOf(floatingUi_react_utils.activeElement(floatingUi_react_utils.getDocument(container)));
|
|
289
|
+
const nextTabbableElements = allTabbable.slice(activeIndex + 1);
|
|
290
|
+
return nextTabbableElements[0];
|
|
291
|
+
}
|
|
292
|
+
function getNextTabbable() {
|
|
293
|
+
return getTabbableIn(document.body, 'next');
|
|
294
|
+
}
|
|
295
|
+
function getPreviousTabbable() {
|
|
296
|
+
return getTabbableIn(document.body, 'prev');
|
|
297
|
+
}
|
|
298
|
+
function isOutsideEvent(event, container) {
|
|
299
|
+
const containerElement = container || event.currentTarget;
|
|
300
|
+
const relatedTarget = event.relatedTarget;
|
|
301
|
+
return !relatedTarget || !floatingUi_react_utils.contains(containerElement, relatedTarget);
|
|
302
|
+
}
|
|
303
|
+
function disableFocusInside(container) {
|
|
304
|
+
const tabbableElements = index_esm.tabbable(container, getTabbableOptions());
|
|
305
|
+
tabbableElements.forEach(element => {
|
|
306
|
+
element.dataset.tabindex = element.getAttribute('tabindex') || '';
|
|
307
|
+
element.setAttribute('tabindex', '-1');
|
|
308
|
+
});
|
|
309
|
+
}
|
|
310
|
+
function enableFocusInside(container) {
|
|
311
|
+
const elements = container.querySelectorAll('[data-tabindex]');
|
|
312
|
+
elements.forEach(element => {
|
|
313
|
+
const tabindex = element.dataset.tabindex;
|
|
314
|
+
delete element.dataset.tabindex;
|
|
315
|
+
if (tabindex) {
|
|
316
|
+
element.setAttribute('tabindex', tabindex);
|
|
317
|
+
} else {
|
|
318
|
+
element.removeAttribute('tabindex');
|
|
319
|
+
}
|
|
320
|
+
});
|
|
321
|
+
}
|
|
322
|
+
|
|
323
|
+
// See Diego Haz's Sandbox for making this logic work well on Safari/iOS:
|
|
324
|
+
// https://codesandbox.io/s/tabbable-portal-f4tng?file=/src/FocusTrap.tsx
|
|
325
|
+
|
|
326
|
+
const HIDDEN_STYLES = {
|
|
327
|
+
border: 0,
|
|
328
|
+
clip: 'rect(0 0 0 0)',
|
|
329
|
+
height: '1px',
|
|
330
|
+
margin: '-1px',
|
|
331
|
+
overflow: 'hidden',
|
|
332
|
+
padding: 0,
|
|
333
|
+
position: 'fixed',
|
|
334
|
+
whiteSpace: 'nowrap',
|
|
335
|
+
width: '1px',
|
|
336
|
+
top: 0,
|
|
337
|
+
left: 0
|
|
338
|
+
};
|
|
339
|
+
let timeoutId;
|
|
340
|
+
function setActiveElementOnTab(event) {
|
|
341
|
+
if (event.key === 'Tab') {
|
|
342
|
+
event.target;
|
|
343
|
+
clearTimeout(timeoutId);
|
|
344
|
+
}
|
|
345
|
+
}
|
|
346
|
+
const FocusGuard = /*#__PURE__*/React__namespace.forwardRef(function FocusGuard(props, ref) {
|
|
347
|
+
const [role, setRole] = React__namespace.useState();
|
|
348
|
+
index(() => {
|
|
349
|
+
if (floatingUi_react_utils.isSafari()) {
|
|
350
|
+
// Unlike other screen readers such as NVDA and JAWS, the virtual cursor
|
|
351
|
+
// on VoiceOver does trigger the onFocus event, so we can use the focus
|
|
352
|
+
// trap element. On Safari, only buttons trigger the onFocus event.
|
|
353
|
+
// NB: "group" role in the Sandbox no longer appears to work, must be a
|
|
354
|
+
// button role.
|
|
355
|
+
setRole('button');
|
|
356
|
+
}
|
|
357
|
+
document.addEventListener('keydown', setActiveElementOnTab);
|
|
358
|
+
return () => {
|
|
359
|
+
document.removeEventListener('keydown', setActiveElementOnTab);
|
|
360
|
+
};
|
|
361
|
+
}, []);
|
|
362
|
+
const restProps = {
|
|
363
|
+
ref,
|
|
364
|
+
tabIndex: 0,
|
|
365
|
+
// Role is only for VoiceOver
|
|
366
|
+
role,
|
|
367
|
+
'aria-hidden': role ? undefined : true,
|
|
368
|
+
[createAttribute('focus-guard')]: '',
|
|
369
|
+
style: HIDDEN_STYLES
|
|
370
|
+
};
|
|
371
|
+
return /*#__PURE__*/React__namespace.createElement("span", _extends({}, props, restProps));
|
|
372
|
+
});
|
|
373
|
+
|
|
374
|
+
const PortalContext = /*#__PURE__*/React__namespace.createContext(null);
|
|
375
|
+
const attr = /*#__PURE__*/createAttribute('portal');
|
|
376
|
+
/**
|
|
377
|
+
* @see https://floating-ui.com/docs/FloatingPortal#usefloatingportalnode
|
|
378
|
+
*/
|
|
379
|
+
function useFloatingPortalNode(props) {
|
|
380
|
+
if (props === void 0) {
|
|
381
|
+
props = {};
|
|
382
|
+
}
|
|
383
|
+
const {
|
|
384
|
+
id,
|
|
385
|
+
root
|
|
386
|
+
} = props;
|
|
387
|
+
const uniqueId = useId();
|
|
388
|
+
const portalContext = usePortalContext();
|
|
389
|
+
const [portalNode, setPortalNode] = React__namespace.useState(null);
|
|
390
|
+
const portalNodeRef = React__namespace.useRef(null);
|
|
391
|
+
index(() => {
|
|
392
|
+
return () => {
|
|
393
|
+
portalNode == null || portalNode.remove();
|
|
394
|
+
// Allow the subsequent layout effects to create a new node on updates.
|
|
395
|
+
// The portal node will still be cleaned up on unmount.
|
|
396
|
+
// https://github.com/floating-ui/floating-ui/issues/2454
|
|
397
|
+
queueMicrotask(() => {
|
|
398
|
+
portalNodeRef.current = null;
|
|
399
|
+
});
|
|
400
|
+
};
|
|
401
|
+
}, [portalNode]);
|
|
402
|
+
index(() => {
|
|
403
|
+
// Wait for the uniqueId to be generated before creating the portal node in
|
|
404
|
+
// React <18 (using `useFloatingId` instead of the native `useId`).
|
|
405
|
+
// https://github.com/floating-ui/floating-ui/issues/2778
|
|
406
|
+
if (!uniqueId) return;
|
|
407
|
+
if (portalNodeRef.current) return;
|
|
408
|
+
const existingIdRoot = id ? document.getElementById(id) : null;
|
|
409
|
+
if (!existingIdRoot) return;
|
|
410
|
+
const subRoot = document.createElement('div');
|
|
411
|
+
subRoot.id = uniqueId;
|
|
412
|
+
subRoot.setAttribute(attr, '');
|
|
413
|
+
existingIdRoot.appendChild(subRoot);
|
|
414
|
+
portalNodeRef.current = subRoot;
|
|
415
|
+
setPortalNode(subRoot);
|
|
416
|
+
}, [id, uniqueId]);
|
|
417
|
+
index(() => {
|
|
418
|
+
// Wait for the root to exist before creating the portal node. The root must
|
|
419
|
+
// be stored in state, not a ref, for this to work reactively.
|
|
420
|
+
if (root === null) return;
|
|
421
|
+
if (!uniqueId) return;
|
|
422
|
+
if (portalNodeRef.current) return;
|
|
423
|
+
let container = root || (portalContext == null ? void 0 : portalContext.portalNode);
|
|
424
|
+
if (container && !floatingUi_utils_dom.isElement(container)) container = container.current;
|
|
425
|
+
container = container || document.body;
|
|
426
|
+
let idWrapper = null;
|
|
427
|
+
if (id) {
|
|
428
|
+
idWrapper = document.createElement('div');
|
|
429
|
+
idWrapper.id = id;
|
|
430
|
+
container.appendChild(idWrapper);
|
|
431
|
+
}
|
|
432
|
+
const subRoot = document.createElement('div');
|
|
433
|
+
subRoot.id = uniqueId;
|
|
434
|
+
subRoot.setAttribute(attr, '');
|
|
435
|
+
container = idWrapper || container;
|
|
436
|
+
container.appendChild(subRoot);
|
|
437
|
+
portalNodeRef.current = subRoot;
|
|
438
|
+
setPortalNode(subRoot);
|
|
439
|
+
}, [id, root, uniqueId, portalContext]);
|
|
440
|
+
return portalNode;
|
|
441
|
+
}
|
|
442
|
+
/**
|
|
443
|
+
* Portals the floating element into a given container element — by default,
|
|
444
|
+
* outside of the app root and into the body.
|
|
445
|
+
* This is necessary to ensure the floating element can appear outside any
|
|
446
|
+
* potential parent containers that cause clipping (such as `overflow: hidden`),
|
|
447
|
+
* while retaining its location in the React tree.
|
|
448
|
+
* @see https://floating-ui.com/docs/FloatingPortal
|
|
449
|
+
*/
|
|
450
|
+
function FloatingPortal(props) {
|
|
451
|
+
const {
|
|
452
|
+
children,
|
|
453
|
+
id,
|
|
454
|
+
root,
|
|
455
|
+
preserveTabOrder = true
|
|
456
|
+
} = props;
|
|
457
|
+
const portalNode = useFloatingPortalNode({
|
|
458
|
+
id,
|
|
459
|
+
root
|
|
460
|
+
});
|
|
461
|
+
const [focusManagerState, setFocusManagerState] = React__namespace.useState(null);
|
|
462
|
+
const beforeOutsideRef = React__namespace.useRef(null);
|
|
463
|
+
const afterOutsideRef = React__namespace.useRef(null);
|
|
464
|
+
const beforeInsideRef = React__namespace.useRef(null);
|
|
465
|
+
const afterInsideRef = React__namespace.useRef(null);
|
|
466
|
+
const modal = focusManagerState == null ? void 0 : focusManagerState.modal;
|
|
467
|
+
const open = focusManagerState == null ? void 0 : focusManagerState.open;
|
|
468
|
+
const shouldRenderGuards =
|
|
469
|
+
// The FocusManager and therefore floating element are currently open/
|
|
470
|
+
// rendered.
|
|
471
|
+
!!focusManagerState &&
|
|
472
|
+
// Guards are only for non-modal focus management.
|
|
473
|
+
!focusManagerState.modal &&
|
|
474
|
+
// Don't render if unmount is transitioning.
|
|
475
|
+
focusManagerState.open && preserveTabOrder && !!(root || portalNode);
|
|
476
|
+
|
|
477
|
+
// https://codesandbox.io/s/tabbable-portal-f4tng?file=/src/TabbablePortal.tsx
|
|
478
|
+
React__namespace.useEffect(() => {
|
|
479
|
+
if (!portalNode || !preserveTabOrder || modal) {
|
|
480
|
+
return;
|
|
481
|
+
}
|
|
482
|
+
|
|
483
|
+
// Make sure elements inside the portal element are tabbable only when the
|
|
484
|
+
// portal has already been focused, either by tabbing into a focus trap
|
|
485
|
+
// element outside or using the mouse.
|
|
486
|
+
function onFocus(event) {
|
|
487
|
+
if (portalNode && isOutsideEvent(event)) {
|
|
488
|
+
const focusing = event.type === 'focusin';
|
|
489
|
+
const manageFocus = focusing ? enableFocusInside : disableFocusInside;
|
|
490
|
+
manageFocus(portalNode);
|
|
491
|
+
}
|
|
492
|
+
}
|
|
493
|
+
// Listen to the event on the capture phase so they run before the focus
|
|
494
|
+
// trap elements onFocus prop is called.
|
|
495
|
+
portalNode.addEventListener('focusin', onFocus, true);
|
|
496
|
+
portalNode.addEventListener('focusout', onFocus, true);
|
|
497
|
+
return () => {
|
|
498
|
+
portalNode.removeEventListener('focusin', onFocus, true);
|
|
499
|
+
portalNode.removeEventListener('focusout', onFocus, true);
|
|
500
|
+
};
|
|
501
|
+
}, [portalNode, preserveTabOrder, modal]);
|
|
502
|
+
React__namespace.useEffect(() => {
|
|
503
|
+
if (!portalNode) return;
|
|
504
|
+
if (open) return;
|
|
505
|
+
enableFocusInside(portalNode);
|
|
506
|
+
}, [open, portalNode]);
|
|
507
|
+
return /*#__PURE__*/React__namespace.createElement(PortalContext.Provider, {
|
|
508
|
+
value: React__namespace.useMemo(() => ({
|
|
509
|
+
preserveTabOrder,
|
|
510
|
+
beforeOutsideRef,
|
|
511
|
+
afterOutsideRef,
|
|
512
|
+
beforeInsideRef,
|
|
513
|
+
afterInsideRef,
|
|
514
|
+
portalNode,
|
|
515
|
+
setFocusManagerState
|
|
516
|
+
}), [preserveTabOrder, portalNode])
|
|
517
|
+
}, shouldRenderGuards && portalNode && /*#__PURE__*/React__namespace.createElement(FocusGuard, {
|
|
518
|
+
"data-type": "outside",
|
|
519
|
+
ref: beforeOutsideRef,
|
|
520
|
+
onFocus: event => {
|
|
521
|
+
if (isOutsideEvent(event, portalNode)) {
|
|
522
|
+
var _beforeInsideRef$curr;
|
|
523
|
+
(_beforeInsideRef$curr = beforeInsideRef.current) == null || _beforeInsideRef$curr.focus();
|
|
524
|
+
} else {
|
|
525
|
+
const prevTabbable = getPreviousTabbable() || (focusManagerState == null ? void 0 : focusManagerState.refs.domReference.current);
|
|
526
|
+
prevTabbable == null || prevTabbable.focus();
|
|
527
|
+
}
|
|
528
|
+
}
|
|
529
|
+
}), shouldRenderGuards && portalNode && /*#__PURE__*/React__namespace.createElement("span", {
|
|
530
|
+
"aria-owns": portalNode.id,
|
|
531
|
+
style: HIDDEN_STYLES
|
|
532
|
+
}), portalNode && /*#__PURE__*/ReactDOM__namespace.createPortal(children, portalNode), shouldRenderGuards && portalNode && /*#__PURE__*/React__namespace.createElement(FocusGuard, {
|
|
533
|
+
"data-type": "outside",
|
|
534
|
+
ref: afterOutsideRef,
|
|
535
|
+
onFocus: event => {
|
|
536
|
+
if (isOutsideEvent(event, portalNode)) {
|
|
537
|
+
var _afterInsideRef$curre;
|
|
538
|
+
(_afterInsideRef$curre = afterInsideRef.current) == null || _afterInsideRef$curre.focus();
|
|
539
|
+
} else {
|
|
540
|
+
const nextTabbable = getNextTabbable() || (focusManagerState == null ? void 0 : focusManagerState.refs.domReference.current);
|
|
541
|
+
nextTabbable == null || nextTabbable.focus();
|
|
542
|
+
(focusManagerState == null ? void 0 : focusManagerState.closeOnFocusOut) && (focusManagerState == null ? void 0 : focusManagerState.onOpenChange(false, event.nativeEvent, 'focus-out'));
|
|
543
|
+
}
|
|
544
|
+
}
|
|
545
|
+
}));
|
|
546
|
+
}
|
|
547
|
+
const usePortalContext = () => React__namespace.useContext(PortalContext);
|
|
548
|
+
|
|
549
|
+
const FOCUSABLE_ATTRIBUTE = 'data-floating-ui-focusable';
|
|
550
|
+
function getFloatingFocusElement(floatingElement) {
|
|
551
|
+
if (!floatingElement) {
|
|
552
|
+
return null;
|
|
553
|
+
}
|
|
554
|
+
// Try to find the element that has `{...getFloatingProps()}` spread on it.
|
|
555
|
+
// This indicates the floating element is acting as a positioning wrapper, and
|
|
556
|
+
// so focus should be managed on the child element with the event handlers and
|
|
557
|
+
// aria props.
|
|
558
|
+
return floatingElement.hasAttribute(FOCUSABLE_ATTRIBUTE) ? floatingElement : floatingElement.querySelector("[" + FOCUSABLE_ATTRIBUTE + "]") || floatingElement;
|
|
559
|
+
}
|
|
560
|
+
|
|
561
|
+
const LIST_LIMIT = 20;
|
|
562
|
+
let previouslyFocusedElements = [];
|
|
563
|
+
function addPreviouslyFocusedElement(element) {
|
|
564
|
+
previouslyFocusedElements = previouslyFocusedElements.filter(el => el.isConnected);
|
|
565
|
+
let tabbableEl = element;
|
|
566
|
+
if (!tabbableEl || floatingUi_utils_dom.getNodeName(tabbableEl) === 'body') return;
|
|
567
|
+
if (!index_esm.isTabbable(tabbableEl, getTabbableOptions())) {
|
|
568
|
+
const tabbableChild = index_esm.tabbable(tabbableEl, getTabbableOptions())[0];
|
|
569
|
+
if (tabbableChild) {
|
|
570
|
+
tabbableEl = tabbableChild;
|
|
571
|
+
}
|
|
572
|
+
}
|
|
573
|
+
previouslyFocusedElements.push(tabbableEl);
|
|
574
|
+
if (previouslyFocusedElements.length > LIST_LIMIT) {
|
|
575
|
+
previouslyFocusedElements = previouslyFocusedElements.slice(-LIST_LIMIT);
|
|
576
|
+
}
|
|
577
|
+
}
|
|
578
|
+
function getPreviouslyFocusedElement() {
|
|
579
|
+
return previouslyFocusedElements.slice().reverse().find(el => el.isConnected);
|
|
580
|
+
}
|
|
581
|
+
const VisuallyHiddenDismiss = /*#__PURE__*/React__namespace.forwardRef(function VisuallyHiddenDismiss(props, ref) {
|
|
582
|
+
return /*#__PURE__*/React__namespace.createElement("button", _extends({}, props, {
|
|
583
|
+
type: "button",
|
|
584
|
+
ref: ref,
|
|
585
|
+
tabIndex: -1,
|
|
586
|
+
style: HIDDEN_STYLES
|
|
587
|
+
}));
|
|
588
|
+
});
|
|
589
|
+
/**
|
|
590
|
+
* Provides focus management for the floating element.
|
|
591
|
+
* @see https://floating-ui.com/docs/FloatingFocusManager
|
|
592
|
+
*/
|
|
593
|
+
function FloatingFocusManager(props) {
|
|
594
|
+
const {
|
|
595
|
+
context,
|
|
596
|
+
children,
|
|
597
|
+
disabled = false,
|
|
598
|
+
order = ['content'],
|
|
599
|
+
guards: _guards = true,
|
|
600
|
+
initialFocus = 0,
|
|
601
|
+
returnFocus = true,
|
|
602
|
+
restoreFocus = false,
|
|
603
|
+
modal = true,
|
|
604
|
+
visuallyHiddenDismiss = false,
|
|
605
|
+
closeOnFocusOut = true
|
|
606
|
+
} = props;
|
|
607
|
+
const {
|
|
608
|
+
open,
|
|
609
|
+
refs,
|
|
610
|
+
nodeId,
|
|
611
|
+
onOpenChange,
|
|
612
|
+
events,
|
|
613
|
+
dataRef,
|
|
614
|
+
floatingId,
|
|
615
|
+
elements: {
|
|
616
|
+
domReference,
|
|
617
|
+
floating
|
|
618
|
+
}
|
|
619
|
+
} = context;
|
|
620
|
+
const ignoreInitialFocus = typeof initialFocus === 'number' && initialFocus < 0;
|
|
621
|
+
// If the reference is a combobox and is typeable (e.g. input/textarea),
|
|
622
|
+
// there are different focus semantics. The guards should not be rendered, but
|
|
623
|
+
// aria-hidden should be applied to all nodes still. Further, the visually
|
|
624
|
+
// hidden dismiss button should only appear at the end of the list, not the
|
|
625
|
+
// start.
|
|
626
|
+
const isUntrappedTypeableCombobox = floatingUi_react_utils.isTypeableCombobox(domReference) && ignoreInitialFocus;
|
|
627
|
+
|
|
628
|
+
// Force the guards to be rendered if the `inert` attribute is not supported.
|
|
629
|
+
const guards = supportsInert() ? _guards : true;
|
|
630
|
+
const orderRef = useLatestRef(order);
|
|
631
|
+
const initialFocusRef = useLatestRef(initialFocus);
|
|
632
|
+
const returnFocusRef = useLatestRef(returnFocus);
|
|
633
|
+
const tree = useFloatingTree();
|
|
634
|
+
const portalContext = usePortalContext();
|
|
635
|
+
const startDismissButtonRef = React__namespace.useRef(null);
|
|
636
|
+
const endDismissButtonRef = React__namespace.useRef(null);
|
|
637
|
+
const preventReturnFocusRef = React__namespace.useRef(false);
|
|
638
|
+
const isPointerDownRef = React__namespace.useRef(false);
|
|
639
|
+
const tabbableIndexRef = React__namespace.useRef(-1);
|
|
640
|
+
const isInsidePortal = portalContext != null;
|
|
641
|
+
const floatingFocusElement = getFloatingFocusElement(floating);
|
|
642
|
+
const getTabbableContent = useEffectEvent(function (container) {
|
|
643
|
+
if (container === void 0) {
|
|
644
|
+
container = floatingFocusElement;
|
|
645
|
+
}
|
|
646
|
+
return container ? index_esm.tabbable(container, getTabbableOptions()) : [];
|
|
647
|
+
});
|
|
648
|
+
const getTabbableElements = useEffectEvent(container => {
|
|
649
|
+
const content = getTabbableContent(container);
|
|
650
|
+
return orderRef.current.map(type => {
|
|
651
|
+
if (domReference && type === 'reference') {
|
|
652
|
+
return domReference;
|
|
653
|
+
}
|
|
654
|
+
if (floatingFocusElement && type === 'floating') {
|
|
655
|
+
return floatingFocusElement;
|
|
656
|
+
}
|
|
657
|
+
return content;
|
|
658
|
+
}).filter(Boolean).flat();
|
|
659
|
+
});
|
|
660
|
+
React__namespace.useEffect(() => {
|
|
661
|
+
if (disabled) return;
|
|
662
|
+
if (!modal) return;
|
|
663
|
+
function onKeyDown(event) {
|
|
664
|
+
if (event.key === 'Tab') {
|
|
665
|
+
// The focus guards have nothing to focus, so we need to stop the event.
|
|
666
|
+
if (floatingUi_react_utils.contains(floatingFocusElement, floatingUi_react_utils.activeElement(floatingUi_react_utils.getDocument(floatingFocusElement))) && getTabbableContent().length === 0 && !isUntrappedTypeableCombobox) {
|
|
667
|
+
floatingUi_react_utils.stopEvent(event);
|
|
668
|
+
}
|
|
669
|
+
const els = getTabbableElements();
|
|
670
|
+
const target = floatingUi_react_utils.getTarget(event);
|
|
671
|
+
if (orderRef.current[0] === 'reference' && target === domReference) {
|
|
672
|
+
floatingUi_react_utils.stopEvent(event);
|
|
673
|
+
if (event.shiftKey) {
|
|
674
|
+
enqueueFocus(els[els.length - 1]);
|
|
675
|
+
} else {
|
|
676
|
+
enqueueFocus(els[1]);
|
|
677
|
+
}
|
|
678
|
+
}
|
|
679
|
+
if (orderRef.current[1] === 'floating' && target === floatingFocusElement && event.shiftKey) {
|
|
680
|
+
floatingUi_react_utils.stopEvent(event);
|
|
681
|
+
enqueueFocus(els[0]);
|
|
682
|
+
}
|
|
683
|
+
}
|
|
684
|
+
}
|
|
685
|
+
const doc = floatingUi_react_utils.getDocument(floatingFocusElement);
|
|
686
|
+
doc.addEventListener('keydown', onKeyDown);
|
|
687
|
+
return () => {
|
|
688
|
+
doc.removeEventListener('keydown', onKeyDown);
|
|
689
|
+
};
|
|
690
|
+
}, [disabled, domReference, floatingFocusElement, modal, orderRef, isUntrappedTypeableCombobox, getTabbableContent, getTabbableElements]);
|
|
691
|
+
React__namespace.useEffect(() => {
|
|
692
|
+
if (disabled) return;
|
|
693
|
+
if (!floating) return;
|
|
694
|
+
function handleFocusIn(event) {
|
|
695
|
+
const target = floatingUi_react_utils.getTarget(event);
|
|
696
|
+
const tabbableContent = getTabbableContent();
|
|
697
|
+
const tabbableIndex = tabbableContent.indexOf(target);
|
|
698
|
+
if (tabbableIndex !== -1) {
|
|
699
|
+
tabbableIndexRef.current = tabbableIndex;
|
|
700
|
+
}
|
|
701
|
+
}
|
|
702
|
+
floating.addEventListener('focusin', handleFocusIn);
|
|
703
|
+
return () => {
|
|
704
|
+
floating.removeEventListener('focusin', handleFocusIn);
|
|
705
|
+
};
|
|
706
|
+
}, [disabled, floating, getTabbableContent]);
|
|
707
|
+
React__namespace.useEffect(() => {
|
|
708
|
+
if (disabled) return;
|
|
709
|
+
if (!closeOnFocusOut) return;
|
|
710
|
+
|
|
711
|
+
// In Safari, buttons lose focus when pressing them.
|
|
712
|
+
function handlePointerDown() {
|
|
713
|
+
isPointerDownRef.current = true;
|
|
714
|
+
setTimeout(() => {
|
|
715
|
+
isPointerDownRef.current = false;
|
|
716
|
+
});
|
|
717
|
+
}
|
|
718
|
+
function handleFocusOutside(event) {
|
|
719
|
+
const relatedTarget = event.relatedTarget;
|
|
720
|
+
queueMicrotask(() => {
|
|
721
|
+
const movedToUnrelatedNode = !(floatingUi_react_utils.contains(domReference, relatedTarget) || floatingUi_react_utils.contains(floating, relatedTarget) || floatingUi_react_utils.contains(relatedTarget, floating) || floatingUi_react_utils.contains(portalContext == null ? void 0 : portalContext.portalNode, relatedTarget) || relatedTarget != null && relatedTarget.hasAttribute(createAttribute('focus-guard')) || tree && (getChildren(tree.nodesRef.current, nodeId).find(node => {
|
|
722
|
+
var _node$context, _node$context2;
|
|
723
|
+
return floatingUi_react_utils.contains((_node$context = node.context) == null ? void 0 : _node$context.elements.floating, relatedTarget) || floatingUi_react_utils.contains((_node$context2 = node.context) == null ? void 0 : _node$context2.elements.domReference, relatedTarget);
|
|
724
|
+
}) || getAncestors(tree.nodesRef.current, nodeId).find(node => {
|
|
725
|
+
var _node$context3, _node$context4;
|
|
726
|
+
return ((_node$context3 = node.context) == null ? void 0 : _node$context3.elements.floating) === relatedTarget || ((_node$context4 = node.context) == null ? void 0 : _node$context4.elements.domReference) === relatedTarget;
|
|
727
|
+
})));
|
|
728
|
+
|
|
729
|
+
// Restore focus to the previous tabbable element index to prevent
|
|
730
|
+
// focus from being lost outside the floating tree.
|
|
731
|
+
if (restoreFocus && movedToUnrelatedNode && floatingUi_react_utils.activeElement(floatingUi_react_utils.getDocument(floatingFocusElement)) === floatingUi_react_utils.getDocument(floatingFocusElement).body) {
|
|
732
|
+
// Let `FloatingPortal` effect knows that focus is still inside the
|
|
733
|
+
// floating tree.
|
|
734
|
+
if (floatingUi_utils_dom.isHTMLElement(floatingFocusElement)) {
|
|
735
|
+
floatingFocusElement.focus();
|
|
736
|
+
}
|
|
737
|
+
const prevTabbableIndex = tabbableIndexRef.current;
|
|
738
|
+
const tabbableContent = getTabbableContent();
|
|
739
|
+
const nodeToFocus = tabbableContent[prevTabbableIndex] || tabbableContent[tabbableContent.length - 1] || floatingFocusElement;
|
|
740
|
+
if (floatingUi_utils_dom.isHTMLElement(nodeToFocus)) {
|
|
741
|
+
nodeToFocus.focus();
|
|
742
|
+
}
|
|
743
|
+
}
|
|
744
|
+
|
|
745
|
+
// Focus did not move inside the floating tree, and there are no tabbable
|
|
746
|
+
// portal guards to handle closing.
|
|
747
|
+
if ((isUntrappedTypeableCombobox ? true : !modal) && relatedTarget && movedToUnrelatedNode && !isPointerDownRef.current &&
|
|
748
|
+
// Fix React 18 Strict Mode returnFocus due to double rendering.
|
|
749
|
+
relatedTarget !== getPreviouslyFocusedElement()) {
|
|
750
|
+
preventReturnFocusRef.current = true;
|
|
751
|
+
onOpenChange(false, event, 'focus-out');
|
|
752
|
+
}
|
|
753
|
+
});
|
|
754
|
+
}
|
|
755
|
+
if (floating && floatingUi_utils_dom.isHTMLElement(domReference)) {
|
|
756
|
+
domReference.addEventListener('focusout', handleFocusOutside);
|
|
757
|
+
domReference.addEventListener('pointerdown', handlePointerDown);
|
|
758
|
+
floating.addEventListener('focusout', handleFocusOutside);
|
|
759
|
+
return () => {
|
|
760
|
+
domReference.removeEventListener('focusout', handleFocusOutside);
|
|
761
|
+
domReference.removeEventListener('pointerdown', handlePointerDown);
|
|
762
|
+
floating.removeEventListener('focusout', handleFocusOutside);
|
|
763
|
+
};
|
|
764
|
+
}
|
|
765
|
+
}, [disabled, domReference, floating, floatingFocusElement, modal, nodeId, tree, portalContext, onOpenChange, closeOnFocusOut, restoreFocus, getTabbableContent, isUntrappedTypeableCombobox]);
|
|
766
|
+
React__namespace.useEffect(() => {
|
|
767
|
+
var _portalContext$portal;
|
|
768
|
+
if (disabled) return;
|
|
769
|
+
|
|
770
|
+
// Don't hide portals nested within the parent portal.
|
|
771
|
+
const portalNodes = Array.from((portalContext == null || (_portalContext$portal = portalContext.portalNode) == null ? void 0 : _portalContext$portal.querySelectorAll("[" + createAttribute('portal') + "]")) || []);
|
|
772
|
+
if (floating) {
|
|
773
|
+
const insideElements = [floating, ...portalNodes, startDismissButtonRef.current, endDismissButtonRef.current, orderRef.current.includes('reference') || isUntrappedTypeableCombobox ? domReference : null].filter(x => x != null);
|
|
774
|
+
const cleanup = modal || isUntrappedTypeableCombobox ? markOthers(insideElements, guards, !guards) : markOthers(insideElements);
|
|
775
|
+
return () => {
|
|
776
|
+
cleanup();
|
|
777
|
+
};
|
|
778
|
+
}
|
|
779
|
+
}, [disabled, domReference, floating, modal, orderRef, portalContext, isUntrappedTypeableCombobox, guards]);
|
|
780
|
+
index(() => {
|
|
781
|
+
if (disabled || !floatingUi_utils_dom.isHTMLElement(floatingFocusElement)) return;
|
|
782
|
+
const doc = floatingUi_react_utils.getDocument(floatingFocusElement);
|
|
783
|
+
const previouslyFocusedElement = floatingUi_react_utils.activeElement(doc);
|
|
784
|
+
|
|
785
|
+
// Wait for any layout effect state setters to execute to set `tabIndex`.
|
|
786
|
+
queueMicrotask(() => {
|
|
787
|
+
const focusableElements = getTabbableElements(floatingFocusElement);
|
|
788
|
+
const initialFocusValue = initialFocusRef.current;
|
|
789
|
+
const elToFocus = (typeof initialFocusValue === 'number' ? focusableElements[initialFocusValue] : initialFocusValue.current) || floatingFocusElement;
|
|
790
|
+
const focusAlreadyInsideFloatingEl = floatingUi_react_utils.contains(floatingFocusElement, previouslyFocusedElement);
|
|
791
|
+
if (!ignoreInitialFocus && !focusAlreadyInsideFloatingEl && open) {
|
|
792
|
+
enqueueFocus(elToFocus, {
|
|
793
|
+
preventScroll: elToFocus === floatingFocusElement
|
|
794
|
+
});
|
|
795
|
+
}
|
|
796
|
+
});
|
|
797
|
+
}, [disabled, open, floatingFocusElement, ignoreInitialFocus, getTabbableElements, initialFocusRef]);
|
|
798
|
+
index(() => {
|
|
799
|
+
if (disabled || !floatingFocusElement) return;
|
|
800
|
+
let preventReturnFocusScroll = false;
|
|
801
|
+
const doc = floatingUi_react_utils.getDocument(floatingFocusElement);
|
|
802
|
+
const previouslyFocusedElement = floatingUi_react_utils.activeElement(doc);
|
|
803
|
+
const contextData = dataRef.current;
|
|
804
|
+
let openEvent = contextData.openEvent;
|
|
805
|
+
addPreviouslyFocusedElement(previouslyFocusedElement);
|
|
806
|
+
|
|
807
|
+
// Dismissing via outside press should always ignore `returnFocus` to
|
|
808
|
+
// prevent unwanted scrolling.
|
|
809
|
+
function onOpenChange(_ref) {
|
|
810
|
+
let {
|
|
811
|
+
open,
|
|
812
|
+
reason,
|
|
813
|
+
event,
|
|
814
|
+
nested
|
|
815
|
+
} = _ref;
|
|
816
|
+
if (open) {
|
|
817
|
+
openEvent = event;
|
|
818
|
+
}
|
|
819
|
+
if (reason === 'escape-key' && refs.domReference.current) {
|
|
820
|
+
addPreviouslyFocusedElement(refs.domReference.current);
|
|
821
|
+
}
|
|
822
|
+
if (reason === 'hover' && event.type === 'mouseleave') {
|
|
823
|
+
preventReturnFocusRef.current = true;
|
|
824
|
+
}
|
|
825
|
+
if (reason !== 'outside-press') return;
|
|
826
|
+
if (nested) {
|
|
827
|
+
preventReturnFocusRef.current = false;
|
|
828
|
+
preventReturnFocusScroll = true;
|
|
829
|
+
} else {
|
|
830
|
+
preventReturnFocusRef.current = !(floatingUi_react_utils.isVirtualClick(event) || floatingUi_react_utils.isVirtualPointerEvent(event));
|
|
831
|
+
}
|
|
832
|
+
}
|
|
833
|
+
events.on('openchange', onOpenChange);
|
|
834
|
+
const fallbackEl = doc.createElement('span');
|
|
835
|
+
fallbackEl.setAttribute('tabindex', '-1');
|
|
836
|
+
fallbackEl.setAttribute('aria-hidden', 'true');
|
|
837
|
+
Object.assign(fallbackEl.style, HIDDEN_STYLES);
|
|
838
|
+
if (isInsidePortal && domReference) {
|
|
839
|
+
domReference.insertAdjacentElement('afterend', fallbackEl);
|
|
840
|
+
}
|
|
841
|
+
function getReturnElement() {
|
|
842
|
+
if (typeof returnFocusRef.current === 'boolean') {
|
|
843
|
+
return getPreviouslyFocusedElement() || fallbackEl;
|
|
844
|
+
}
|
|
845
|
+
return returnFocusRef.current.current || fallbackEl;
|
|
846
|
+
}
|
|
847
|
+
return () => {
|
|
848
|
+
events.off('openchange', onOpenChange);
|
|
849
|
+
const activeEl = floatingUi_react_utils.activeElement(doc);
|
|
850
|
+
const isFocusInsideFloatingTree = floatingUi_react_utils.contains(floating, activeEl) || tree && getChildren(tree.nodesRef.current, nodeId).some(node => {
|
|
851
|
+
var _node$context5;
|
|
852
|
+
return floatingUi_react_utils.contains((_node$context5 = node.context) == null ? void 0 : _node$context5.elements.floating, activeEl);
|
|
853
|
+
});
|
|
854
|
+
const shouldFocusReference = isFocusInsideFloatingTree || openEvent && ['click', 'mousedown'].includes(openEvent.type);
|
|
855
|
+
if (shouldFocusReference && refs.domReference.current) {
|
|
856
|
+
addPreviouslyFocusedElement(refs.domReference.current);
|
|
857
|
+
}
|
|
858
|
+
const returnElement = getReturnElement();
|
|
859
|
+
queueMicrotask(() => {
|
|
860
|
+
if (
|
|
861
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
862
|
+
returnFocusRef.current && !preventReturnFocusRef.current && floatingUi_utils_dom.isHTMLElement(returnElement) && (
|
|
863
|
+
// If the focus moved somewhere else after mount, avoid returning focus
|
|
864
|
+
// since it likely entered a different element which should be
|
|
865
|
+
// respected: https://github.com/floating-ui/floating-ui/issues/2607
|
|
866
|
+
returnElement !== activeEl && activeEl !== doc.body ? isFocusInsideFloatingTree : true)) {
|
|
867
|
+
returnElement.focus({
|
|
868
|
+
preventScroll: preventReturnFocusScroll
|
|
869
|
+
});
|
|
870
|
+
}
|
|
871
|
+
fallbackEl.remove();
|
|
872
|
+
});
|
|
873
|
+
};
|
|
874
|
+
}, [disabled, floating, floatingFocusElement, returnFocusRef, dataRef, refs, events, tree, nodeId, isInsidePortal, domReference]);
|
|
875
|
+
React__namespace.useEffect(() => {
|
|
876
|
+
// The `returnFocus` cleanup behavior is inside a microtask; ensure we
|
|
877
|
+
// wait for it to complete before resetting the flag.
|
|
878
|
+
queueMicrotask(() => {
|
|
879
|
+
preventReturnFocusRef.current = false;
|
|
880
|
+
});
|
|
881
|
+
}, [disabled]);
|
|
882
|
+
|
|
883
|
+
// Synchronize the `context` & `modal` value to the FloatingPortal context.
|
|
884
|
+
// It will decide whether or not it needs to render its own guards.
|
|
885
|
+
index(() => {
|
|
886
|
+
if (disabled) return;
|
|
887
|
+
if (!portalContext) return;
|
|
888
|
+
portalContext.setFocusManagerState({
|
|
889
|
+
modal,
|
|
890
|
+
closeOnFocusOut,
|
|
891
|
+
open,
|
|
892
|
+
onOpenChange,
|
|
893
|
+
refs
|
|
894
|
+
});
|
|
895
|
+
return () => {
|
|
896
|
+
portalContext.setFocusManagerState(null);
|
|
897
|
+
};
|
|
898
|
+
}, [disabled, portalContext, modal, open, onOpenChange, refs, closeOnFocusOut]);
|
|
899
|
+
index(() => {
|
|
900
|
+
if (disabled) return;
|
|
901
|
+
if (!floatingFocusElement) return;
|
|
902
|
+
if (typeof MutationObserver !== 'function') return;
|
|
903
|
+
if (ignoreInitialFocus) return;
|
|
904
|
+
const handleMutation = () => {
|
|
905
|
+
const tabIndex = floatingFocusElement.getAttribute('tabindex');
|
|
906
|
+
const tabbableContent = getTabbableContent();
|
|
907
|
+
const activeEl = floatingUi_react_utils.activeElement(floatingUi_react_utils.getDocument(floating));
|
|
908
|
+
const tabbableIndex = tabbableContent.indexOf(activeEl);
|
|
909
|
+
if (tabbableIndex !== -1) {
|
|
910
|
+
tabbableIndexRef.current = tabbableIndex;
|
|
911
|
+
}
|
|
912
|
+
if (orderRef.current.includes('floating') || activeEl !== refs.domReference.current && tabbableContent.length === 0) {
|
|
913
|
+
if (tabIndex !== '0') {
|
|
914
|
+
floatingFocusElement.setAttribute('tabindex', '0');
|
|
915
|
+
}
|
|
916
|
+
} else if (tabIndex !== '-1') {
|
|
917
|
+
floatingFocusElement.setAttribute('tabindex', '-1');
|
|
918
|
+
}
|
|
919
|
+
};
|
|
920
|
+
handleMutation();
|
|
921
|
+
const observer = new MutationObserver(handleMutation);
|
|
922
|
+
observer.observe(floatingFocusElement, {
|
|
923
|
+
childList: true,
|
|
924
|
+
subtree: true,
|
|
925
|
+
attributes: true
|
|
926
|
+
});
|
|
927
|
+
return () => {
|
|
928
|
+
observer.disconnect();
|
|
929
|
+
};
|
|
930
|
+
}, [disabled, floating, floatingFocusElement, refs, orderRef, getTabbableContent, ignoreInitialFocus]);
|
|
931
|
+
function renderDismissButton(location) {
|
|
932
|
+
if (disabled || !visuallyHiddenDismiss || !modal) {
|
|
933
|
+
return null;
|
|
934
|
+
}
|
|
935
|
+
return /*#__PURE__*/React__namespace.createElement(VisuallyHiddenDismiss, {
|
|
936
|
+
ref: location === 'start' ? startDismissButtonRef : endDismissButtonRef,
|
|
937
|
+
onClick: event => onOpenChange(false, event.nativeEvent)
|
|
938
|
+
}, typeof visuallyHiddenDismiss === 'string' ? visuallyHiddenDismiss : 'Dismiss');
|
|
939
|
+
}
|
|
940
|
+
const shouldRenderGuards = !disabled && guards && (modal ? !isUntrappedTypeableCombobox : true) && (isInsidePortal || modal);
|
|
941
|
+
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, shouldRenderGuards && /*#__PURE__*/React__namespace.createElement(FocusGuard, {
|
|
942
|
+
"data-type": "inside",
|
|
943
|
+
ref: portalContext == null ? void 0 : portalContext.beforeInsideRef,
|
|
944
|
+
onFocus: event => {
|
|
945
|
+
if (modal) {
|
|
946
|
+
const els = getTabbableElements();
|
|
947
|
+
enqueueFocus(order[0] === 'reference' ? els[0] : els[els.length - 1]);
|
|
948
|
+
} else if (portalContext != null && portalContext.preserveTabOrder && portalContext.portalNode) {
|
|
949
|
+
preventReturnFocusRef.current = false;
|
|
950
|
+
if (isOutsideEvent(event, portalContext.portalNode)) {
|
|
951
|
+
const nextTabbable = getNextTabbable() || domReference;
|
|
952
|
+
nextTabbable == null || nextTabbable.focus();
|
|
953
|
+
} else {
|
|
954
|
+
var _portalContext$before;
|
|
955
|
+
(_portalContext$before = portalContext.beforeOutsideRef.current) == null || _portalContext$before.focus();
|
|
956
|
+
}
|
|
957
|
+
}
|
|
958
|
+
}
|
|
959
|
+
}), !isUntrappedTypeableCombobox && renderDismissButton('start'), children, renderDismissButton('end'), shouldRenderGuards && /*#__PURE__*/React__namespace.createElement(FocusGuard, {
|
|
960
|
+
"data-type": "inside",
|
|
961
|
+
ref: portalContext == null ? void 0 : portalContext.afterInsideRef,
|
|
962
|
+
onFocus: event => {
|
|
963
|
+
if (modal) {
|
|
964
|
+
enqueueFocus(getTabbableElements()[0]);
|
|
965
|
+
} else if (portalContext != null && portalContext.preserveTabOrder && portalContext.portalNode) {
|
|
966
|
+
if (closeOnFocusOut) {
|
|
967
|
+
preventReturnFocusRef.current = true;
|
|
968
|
+
}
|
|
969
|
+
if (isOutsideEvent(event, portalContext.portalNode)) {
|
|
970
|
+
const prevTabbable = getPreviousTabbable() || domReference;
|
|
971
|
+
prevTabbable == null || prevTabbable.focus();
|
|
972
|
+
} else {
|
|
973
|
+
var _portalContext$afterO;
|
|
974
|
+
(_portalContext$afterO = portalContext.afterOutsideRef.current) == null || _portalContext$afterO.focus();
|
|
975
|
+
}
|
|
976
|
+
}
|
|
977
|
+
}
|
|
978
|
+
}));
|
|
979
|
+
}
|
|
980
|
+
|
|
981
|
+
exports.getOverflowAncestors = floatingUi_utils_dom.getOverflowAncestors;
|
|
982
|
+
exports.FloatingFocusManager = FloatingFocusManager;
|
|
983
|
+
exports.FloatingPortal = FloatingPortal;
|
|
984
|
+
exports.useFloatingPortalNode = useFloatingPortalNode;
|
|
985
|
+
exports.useFloatingTree = useFloatingTree;
|
|
986
|
+
exports.useId = useId;
|
|
987
|
+
//# sourceMappingURL=floating-ui.react.js.map
|