UNPKG

4.19 kBJavaScriptView Raw
1import _extends from "@babel/runtime/helpers/esm/extends";
2import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3import * as React from 'react';
4import PropTypes from 'prop-types';
5import { unstable_useForkRef as useForkRef } from '@mui/utils';
6import composeClasses from '../composeClasses';
7import { getTabUtilityClass } from './tabClasses';
8import useTab from '../useTab';
9import { useSlotProps } from '../utils';
10import { useClassNamesOverride } from '../utils/ClassNameConfigurator';
11import { jsx as _jsx } from "react/jsx-runtime";
12var useUtilityClasses = function useUtilityClasses(ownerState) {
13 var selected = ownerState.selected,
14 disabled = ownerState.disabled;
15 var slots = {
16 root: ['root', selected && 'selected', disabled && 'disabled']
17 };
18 return composeClasses(slots, useClassNamesOverride(getTabUtilityClass));
19};
20/**
21 *
22 * Demos:
23 *
24 * - [Tabs](https://mui.com/base/react-tabs/)
25 *
26 * API:
27 *
28 * - [Tab API](https://mui.com/base/react-tabs/components-api/#tab)
29 */
30var Tab = /*#__PURE__*/React.forwardRef(function Tab(props, forwardedRef) {
31 var _slots$root;
32 var action = props.action,
33 children = props.children,
34 valueProp = props.value,
35 _props$disabled = props.disabled,
36 disabled = _props$disabled === void 0 ? false : _props$disabled,
37 onChange = props.onChange,
38 onClick = props.onClick,
39 onFocus = props.onFocus,
40 _props$slotProps = props.slotProps,
41 slotProps = _props$slotProps === void 0 ? {} : _props$slotProps,
42 _props$slots = props.slots,
43 slots = _props$slots === void 0 ? {} : _props$slots,
44 other = _objectWithoutProperties(props, ["action", "children", "value", "disabled", "onChange", "onClick", "onFocus", "slotProps", "slots"]);
45 var tabRef = React.useRef();
46 var handleRef = useForkRef(tabRef, forwardedRef);
47 var _useTab = useTab(_extends({}, props, {
48 rootRef: handleRef
49 })),
50 active = _useTab.active,
51 highlighted = _useTab.highlighted,
52 selected = _useTab.selected,
53 getRootProps = _useTab.getRootProps;
54 var ownerState = _extends({}, props, {
55 active: active,
56 disabled: disabled,
57 highlighted: highlighted,
58 selected: selected
59 });
60 var classes = useUtilityClasses(ownerState);
61 var TabRoot = (_slots$root = slots.root) != null ? _slots$root : 'button';
62 var tabRootProps = useSlotProps({
63 elementType: TabRoot,
64 getSlotProps: getRootProps,
65 externalSlotProps: slotProps.root,
66 externalForwardedProps: other,
67 additionalProps: {
68 ref: forwardedRef
69 },
70 ownerState: ownerState,
71 className: classes.root
72 });
73 return /*#__PURE__*/_jsx(TabRoot, _extends({}, tabRootProps, {
74 children: children
75 }));
76});
77process.env.NODE_ENV !== "production" ? Tab.propTypes /* remove-proptypes */ = {
78 // ----------------------------- Warning --------------------------------
79 // | These PropTypes are generated from the TypeScript type definitions |
80 // | To update them edit TypeScript types and run "yarn proptypes" |
81 // ----------------------------------------------------------------------
82 /**
83 * A ref for imperative actions. It currently only supports `focusVisible()` action.
84 */
85 action: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
86 current: PropTypes.shape({
87 focusVisible: PropTypes.func.isRequired
88 })
89 })]),
90 /**
91 * @ignore
92 */
93 children: PropTypes.node,
94 /**
95 * If `true`, the component is disabled.
96 * @default false
97 */
98 disabled: PropTypes.bool,
99 /**
100 * Callback invoked when new value is being set.
101 */
102 onChange: PropTypes.func,
103 /**
104 * The props used for each slot inside the Tab.
105 * @default {}
106 */
107 slotProps: PropTypes.shape({
108 root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
109 }),
110 /**
111 * The components used for each slot inside the Tab.
112 * Either a string to use a HTML element or a component.
113 * @default {}
114 */
115 slots: PropTypes.shape({
116 root: PropTypes.elementType
117 }),
118 /**
119 * You can provide your own value. Otherwise, it falls back to the child position index.
120 */
121 value: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
122} : void 0;
123export default Tab;
\No newline at end of file