"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 }; }