FrontPastel/node_modules/@mui/base/node/useTabsList/useTabsList.js

138 lines
5.1 KiB
JavaScript
Raw Normal View History

2024-04-17 13:55:11 +00:00
"use strict";
'use client';
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.useTabsList = useTabsList;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var React = _interopRequireWildcard(require("react"));
var _Tabs = require("../Tabs");
var _useTabsList = require("./useTabsList.types");
var _useCompound = require("../useCompound");
var _useList = require("../useList");
var _tabsListReducer = require("./tabsListReducer");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
/**
*
* Demos:
*
* - [Tabs](https://mui.com/base-ui/react-tabs/#hooks)
*
* API:
*
* - [useTabsList API](https://mui.com/base-ui/react-tabs/hooks-api/#use-tabs-list)
*/
function useTabsList(parameters) {
var _selectedValues$;
const {
rootRef: externalRef
} = parameters;
const {
direction = 'ltr',
onSelected,
orientation = 'horizontal',
value,
registerTabIdLookup,
selectionFollowsFocus
} = (0, _Tabs.useTabsContext)();
const {
subitems,
contextValue: compoundComponentContextValue
} = (0, _useCompound.useCompoundParent)();
const tabIdLookup = React.useCallback(tabValue => {
var _subitems$get;
return (_subitems$get = subitems.get(tabValue)) == null ? void 0 : _subitems$get.id;
}, [subitems]);
registerTabIdLookup(tabIdLookup);
const subitemKeys = React.useMemo(() => Array.from(subitems.keys()), [subitems]);
const getTabElement = React.useCallback(tabValue => {
var _subitems$get$ref$cur, _subitems$get2;
if (tabValue == null) {
return null;
}
return (_subitems$get$ref$cur = (_subitems$get2 = subitems.get(tabValue)) == null ? void 0 : _subitems$get2.ref.current) != null ? _subitems$get$ref$cur : null;
}, [subitems]);
const isRtl = direction === 'rtl';
let listOrientation;
if (orientation === 'vertical') {
listOrientation = 'vertical';
} else {
listOrientation = isRtl ? 'horizontal-rtl' : 'horizontal-ltr';
}
const handleChange = React.useCallback((event, newValue) => {
var _newValue$;
onSelected(event, (_newValue$ = newValue[0]) != null ? _newValue$ : null);
}, [onSelected]);
const controlledProps = React.useMemo(() => {
if (value === undefined) {
return {};
}
return value != null ? {
selectedValues: [value]
} : {
selectedValues: []
};
}, [value]);
const isItemDisabled = React.useCallback(item => {
var _subitems$get$disable, _subitems$get3;
return (_subitems$get$disable = (_subitems$get3 = subitems.get(item)) == null ? void 0 : _subitems$get3.disabled) != null ? _subitems$get$disable : false;
}, [subitems]);
const {
contextValue: listContextValue,
dispatch,
getRootProps: getListboxRootProps,
state: {
highlightedValue,
selectedValues
},
rootRef: mergedRootRef
} = (0, _useList.useList)({
controlledProps,
disabledItemsFocusable: !selectionFollowsFocus,
focusManagement: 'DOM',
getItemDomElement: getTabElement,
isItemDisabled,
items: subitemKeys,
rootRef: externalRef,
onChange: handleChange,
orientation: listOrientation,
reducerActionContext: React.useMemo(() => ({
selectionFollowsFocus: selectionFollowsFocus || false
}), [selectionFollowsFocus]),
selectionMode: 'single',
stateReducer: _tabsListReducer.tabsListReducer
});
React.useEffect(() => {
if (value === undefined) {
return;
}
// when a value changes externally, the highlighted value should be synced to it
if (value != null) {
dispatch({
type: _useTabsList.TabsListActionTypes.valueChange,
value
});
}
}, [dispatch, value]);
const getRootProps = (externalProps = {}) => {
return (0, _extends2.default)({}, externalProps, getListboxRootProps(externalProps), {
'aria-orientation': orientation === 'vertical' ? 'vertical' : undefined,
role: 'tablist'
});
};
const contextValue = React.useMemo(() => (0, _extends2.default)({}, compoundComponentContextValue, listContextValue), [compoundComponentContextValue, listContextValue]);
return {
contextValue,
dispatch,
getRootProps,
highlightedValue,
isRtl,
orientation,
rootRef: mergedRootRef,
selectedValue: (_selectedValues$ = selectedValues[0]) != null ? _selectedValues$ : null
};
}