Files
simply_cpq/website/node_modules/@mui/x-internals/ToolbarContext/ToolbarContext.js
T
2026-08-07 21:39:30 +02:00

209 lines
7.8 KiB
JavaScript

"use strict";
'use client';
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.ToolbarContext = void 0;
exports.ToolbarContextProvider = ToolbarContextProvider;
exports.useToolbarContext = useToolbarContext;
var _index = _interopRequireDefault(require("../formatErrorMessage/index.js"));
var React = _interopRequireWildcard(require("react"));
var _jsxRuntime = require("react/jsx-runtime");
const ToolbarContext = exports.ToolbarContext = /*#__PURE__*/React.createContext(undefined);
if (process.env.NODE_ENV !== "production") ToolbarContext.displayName = "ToolbarContext";
function useToolbarContext() {
const context = React.useContext(ToolbarContext);
if (context === undefined) {
throw new Error(process.env.NODE_ENV !== "production" ? 'MUI X: Missing context. Toolbar subcomponents must be placed within a <Toolbar /> component.' : (0, _index.default)(63));
}
return context;
}
function ToolbarContextProvider({
children
}) {
const [focusableItemId, setFocusableItemId] = React.useState(null);
const focusableItemIdRef = React.useRef(focusableItemId);
// The item that currently has real DOM focus, `null` when focus is outside the toolbar.
const focusedItemIdRef = React.useRef(null);
const [items, setItems] = React.useState([]);
const updateFocusableItemId = React.useCallback(id => {
focusableItemIdRef.current = id;
setFocusableItemId(id);
}, []);
const getSortedItems = React.useCallback(() => items.sort(sortByDocumentPosition), [items]);
const findEnabledItem = React.useCallback((startIndex, step, wrap = true) => {
let index = startIndex;
const sortedItems = getSortedItems();
const itemCount = sortedItems.length;
// Look for enabled items in the specified direction
for (let i = 0; i < itemCount; i += 1) {
index += step;
// Handle wrapping around the ends
if (index >= itemCount) {
if (!wrap) {
return -1;
}
index = 0;
} else if (index < 0) {
if (!wrap) {
return -1;
}
index = itemCount - 1;
}
// Return if we found an enabled item
if (!sortedItems[index].ref.current?.disabled && sortedItems[index].ref.current?.ariaDisabled !== 'true') {
return index;
}
}
// If we've checked all items and found none enabled
return -1;
}, [getSortedItems]);
const registerItem = React.useCallback((id, itemRef) => {
setItems(prevItems => [...prevItems, {
id,
ref: itemRef
}]);
}, []);
const unregisterItem = React.useCallback(id => {
setItems(prevItems => prevItems.filter(i => i.id !== id));
}, []);
const onItemKeyDown = React.useCallback(event => {
if (!focusableItemId) {
return;
}
const sortedItems = getSortedItems();
const focusableItemIndex = sortedItems.findIndex(item => item.id === focusableItemId);
let newIndex = -1;
if (event.key === 'ArrowRight') {
event.preventDefault();
newIndex = findEnabledItem(focusableItemIndex, 1);
} else if (event.key === 'ArrowLeft') {
event.preventDefault();
newIndex = findEnabledItem(focusableItemIndex, -1);
} else if (event.key === 'Home') {
event.preventDefault();
newIndex = findEnabledItem(-1, 1, false);
} else if (event.key === 'End') {
event.preventDefault();
newIndex = findEnabledItem(sortedItems.length, -1, false);
}
if (newIndex >= 0 && newIndex < sortedItems.length) {
const item = sortedItems[newIndex];
updateFocusableItemId(item.id);
item.ref.current?.focus();
}
}, [getSortedItems, focusableItemId, findEnabledItem, updateFocusableItemId]);
const onItemFocus = React.useCallback(id => {
focusedItemIdRef.current = id;
if (focusableItemId !== id) {
updateFocusableItemId(id);
}
}, [focusableItemId, updateFocusableItemId]);
const onItemBlur = React.useCallback((id, event) => {
// When a focused item becomes disabled, the browser blurs it before the
// `onItemDisabled` effect runs. Keep tracking it as the focused item in that
// case so `onItemDisabled` can move focus to the next enabled item.
if (event.currentTarget.disabled) {
return;
}
if (focusedItemIdRef.current === id) {
focusedItemIdRef.current = null;
}
}, []);
const onItemDisabled = React.useCallback(id => {
const itemHadFocus = focusedItemIdRef.current === id;
const itemWasTabStop = focusableItemIdRef.current === id;
// Disabling an item the user is not interacting with must not move focus,
// and only requires a new tab stop if the disabled item was the tab stop.
if (!itemHadFocus && !itemWasTabStop) {
return;
}
const sortedItems = getSortedItems();
const currentIndex = sortedItems.findIndex(item => item.id === id);
if (currentIndex === -1) {
return;
}
// An `aria-disabled` item is still focusable, so real focus can stay where
// it is. Only a `disabled` item drops focus and needs it restored.
const focusLost = itemHadFocus && Boolean(sortedItems[currentIndex].ref.current?.disabled);
const newIndex = findEnabledItem(currentIndex, 1);
if (newIndex >= 0 && newIndex < sortedItems.length) {
const item = sortedItems[newIndex];
updateFocusableItemId(item.id);
if (focusLost) {
focusedItemIdRef.current = item.id;
item.ref.current?.focus();
}
} else if (focusLost) {
// No enabled item to move focus to
focusedItemIdRef.current = null;
}
}, [getSortedItems, findEnabledItem, updateFocusableItemId]);
React.useEffect(() => {
const sortedItems = getSortedItems();
if (sortedItems.length === 0) {
return;
}
// Set initial focusable item. A disabled item can't receive focus, so the
// toolbar would be unreachable with `Tab` if it became the tab stop.
// Fall back to the first item when every item is disabled.
if (!focusableItemIdRef.current) {
const firstEnabledIndex = findEnabledItem(-1, 1, false);
updateFocusableItemId(sortedItems[firstEnabledIndex === -1 ? 0 : firstEnabledIndex].id);
return;
}
const focusableItemExists = sortedItems.some(item => item.id === focusableItemIdRef.current);
if (!focusableItemExists) {
// The tab stop has been removed from the items array, assign it to the last item
const fallbackItem = sortedItems[sortedItems.length - 1];
updateFocusableItemId(fallbackItem.id);
// Move real focus only if the removed item had focus
if (focusedItemIdRef.current !== null && !sortedItems.some(item => item.id === focusedItemIdRef.current)) {
focusedItemIdRef.current = fallbackItem.id;
fallbackItem.ref.current?.focus();
}
}
}, [getSortedItems, findEnabledItem, updateFocusableItemId]);
const contextValue = React.useMemo(() => ({
focusableItemId,
registerItem,
unregisterItem,
onItemKeyDown,
onItemFocus,
onItemBlur,
onItemDisabled
}), [focusableItemId, registerItem, unregisterItem, onItemKeyDown, onItemFocus, onItemBlur, onItemDisabled]);
return /*#__PURE__*/(0, _jsxRuntime.jsx)(ToolbarContext.Provider, {
value: contextValue,
children: children
});
}
/* eslint-disable no-bitwise */
function sortByDocumentPosition(a, b) {
if (!a.ref.current || !b.ref.current) {
return 0;
}
const position = a.ref.current.compareDocumentPosition(b.ref.current);
if (!position) {
return 0;
}
if (position & Node.DOCUMENT_POSITION_FOLLOWING || position & Node.DOCUMENT_POSITION_CONTAINED_BY) {
return -1;
}
if (position & Node.DOCUMENT_POSITION_PRECEDING || position & Node.DOCUMENT_POSITION_CONTAINS) {
return 1;
}
return 0;
}