@mui/material 5.10.17 → 5.11.0

package/Tabs/ScrollbarSize.js

@@ -1,20 +1,11 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = ScrollbarSize;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-var React = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _debounce = _interopRequireDefault(require("../utils/debounce"));
-var _utils = require("../utils");
-var _jsxRuntime = require("react/jsx-runtime");
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 const _excluded = ["onChange"];
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import debounce from '../utils/debounce';
+import { ownerWindow } from '../utils';
+import { jsx as _jsx } from "react/jsx-runtime";
 const styles = {
   width: 99,
   height: 99,
@@ -28,25 +19,25 @@ const styles = {
  * The component originates from https://github.com/STORIS/react-scrollbar-size.
  * It has been moved into the core in order to minimize the bundle size.
  */
-function ScrollbarSize(props) {
+export default function ScrollbarSize(props) {
   const {
       onChange
     } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const scrollbarHeight = React.useRef();
   const nodeRef = React.useRef(null);
   const setMeasurements = () => {
     scrollbarHeight.current = nodeRef.current.offsetHeight - nodeRef.current.clientHeight;
   };
   React.useEffect(() => {
-    const handleResize = (0, _debounce.default)(() => {
+    const handleResize = debounce(() => {
       const prevHeight = scrollbarHeight.current;
       setMeasurements();
       if (prevHeight !== scrollbarHeight.current) {
         onChange(scrollbarHeight.current);
       }
     });
-    const containerWindow = (0, _utils.ownerWindow)(nodeRef.current);
+    const containerWindow = ownerWindow(nodeRef.current);
     containerWindow.addEventListener('resize', handleResize);
     return () => {
       handleResize.clear();
@@ -57,11 +48,11 @@ function ScrollbarSize(props) {
     setMeasurements();
     onChange(scrollbarHeight.current);
   }, [onChange]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", (0, _extends2.default)({
+  return /*#__PURE__*/_jsx("div", _extends({
     style: styles,
     ref: nodeRef
   }, other));
 }
 process.env.NODE_ENV !== "production" ? ScrollbarSize.propTypes = {
-  onChange: _propTypes.default.func.isRequired
+  onChange: PropTypes.func.isRequired
 } : void 0;

package/Tabs/Tabs.js

@@ -1,34 +1,26 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var React = _interopRequireWildcard(require("react"));
-var _reactIs = require("react-is");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _utils = require("@mui/utils");
-var _base = require("@mui/base");
-var _styled = _interopRequireDefault(require("../styles/styled"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
-var _useTheme = _interopRequireDefault(require("../styles/useTheme"));
-var _debounce = _interopRequireDefault(require("../utils/debounce"));
-var _scrollLeft = require("../utils/scrollLeft");
-var _animate = _interopRequireDefault(require("../internal/animate"));
-var _ScrollbarSize = _interopRequireDefault(require("./ScrollbarSize"));
-var _TabScrollButton = _interopRequireDefault(require("../TabScrollButton"));
-var _useEventCallback = _interopRequireDefault(require("../utils/useEventCallback"));
-var _tabsClasses = _interopRequireWildcard(require("./tabsClasses"));
-var _ownerDocument = _interopRequireDefault(require("../utils/ownerDocument"));
-var _ownerWindow = _interopRequireDefault(require("../utils/ownerWindow"));
-var _jsxRuntime = require("react/jsx-runtime");
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
 const _excluded = ["aria-label", "aria-labelledby", "action", "centered", "children", "className", "component", "allowScrollButtonsMobile", "indicatorColor", "onChange", "orientation", "ScrollButtonComponent", "scrollButtons", "selectionFollowsFocus", "TabIndicatorProps", "TabScrollButtonProps", "textColor", "value", "variant", "visibleScrollbar"];
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+import * as React from 'react';
+import { isFragment } from 'react-is';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { refType } from '@mui/utils';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import useTheme from '../styles/useTheme';
+import debounce from '../utils/debounce';
+import { getNormalizedScrollLeft, detectScrollType } from '../utils/scrollLeft';
+import animate from '../internal/animate';
+import ScrollbarSize from './ScrollbarSize';
+import TabScrollButton from '../TabScrollButton';
+import useEventCallback from '../utils/useEventCallback';
+import tabsClasses, { getTabsUtilityClass } from './tabsClasses';
+import ownerDocument from '../utils/ownerDocument';
+import ownerWindow from '../utils/ownerWindow';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 const nextItem = (list, item) => {
   if (list === item) {
     return list.firstChild;
@@ -90,9 +82,9 @@ const useUtilityClasses = ownerState => {
     scrollableX: [scrollableX && 'scrollableX'],
     hideScrollbar: [hideScrollbar && 'hideScrollbar']
   };
-  return (0, _base.unstable_composeClasses)(slots, _tabsClasses.getTabsUtilityClass, classes);
+  return composeClasses(slots, getTabsUtilityClass, classes);
 };
-const TabsRoot = (0, _styled.default)('div', {
+const TabsRoot = styled('div', {
   name: 'MuiTabs',
   slot: 'Root',
   overridesResolver: (props, styles) => {
@@ -100,15 +92,15 @@ const TabsRoot = (0, _styled.default)('div', {
       ownerState
     } = props;
     return [{
-      [`& .${_tabsClasses.default.scrollButtons}`]: styles.scrollButtons
+      [`& .${tabsClasses.scrollButtons}`]: styles.scrollButtons
     }, {
-      [`& .${_tabsClasses.default.scrollButtons}`]: ownerState.scrollButtonsHideMobile && styles.scrollButtonsHideMobile
+      [`& .${tabsClasses.scrollButtons}`]: ownerState.scrollButtonsHideMobile && styles.scrollButtonsHideMobile
     }, styles.root, ownerState.vertical && styles.vertical];
   }
 })(({
   ownerState,
   theme
-}) => (0, _extends2.default)({
+}) => _extends({
   overflow: 'hidden',
   minHeight: 48,
   // Add iOS momentum scrolling for iOS < 13.0
@@ -117,13 +109,13 @@ const TabsRoot = (0, _styled.default)('div', {
 }, ownerState.vertical && {
   flexDirection: 'column'
 }, ownerState.scrollButtonsHideMobile && {
-  [`& .${_tabsClasses.default.scrollButtons}`]: {
+  [`& .${tabsClasses.scrollButtons}`]: {
     [theme.breakpoints.down('sm')]: {
       display: 'none'
     }
   }
 }));
-const TabsScroller = (0, _styled.default)('div', {
+const TabsScroller = styled('div', {
   name: 'MuiTabs',
   slot: 'Scroller',
   overridesResolver: (props, styles) => {
@@ -134,7 +126,7 @@ const TabsScroller = (0, _styled.default)('div', {
   }
 })(({
   ownerState
-}) => (0, _extends2.default)({
+}) => _extends({
   position: 'relative',
   display: 'inline-block',
   flex: '1 1 auto',
@@ -156,7 +148,7 @@ const TabsScroller = (0, _styled.default)('div', {
   overflowY: 'auto',
   overflowX: 'hidden'
 }));
-const FlexContainer = (0, _styled.default)('div', {
+const FlexContainer = styled('div', {
   name: 'MuiTabs',
   slot: 'FlexContainer',
   overridesResolver: (props, styles) => {
@@ -167,21 +159,21 @@ const FlexContainer = (0, _styled.default)('div', {
   }
 })(({
   ownerState
-}) => (0, _extends2.default)({
+}) => _extends({
   display: 'flex'
 }, ownerState.vertical && {
   flexDirection: 'column'
 }, ownerState.centered && {
   justifyContent: 'center'
 }));
-const TabsIndicator = (0, _styled.default)('span', {
+const TabsIndicator = styled('span', {
   name: 'MuiTabs',
   slot: 'Indicator',
   overridesResolver: (props, styles) => styles.indicator
 })(({
   ownerState,
   theme
-}) => (0, _extends2.default)({
+}) => _extends({
   position: 'absolute',
   height: 2,
   bottom: 0,
@@ -196,7 +188,7 @@ const TabsIndicator = (0, _styled.default)('span', {
   width: 2,
   right: 0
 }));
-const TabsScrollbarSize = (0, _styled.default)(_ScrollbarSize.default, {
+const TabsScrollbarSize = styled(ScrollbarSize, {
   name: 'MuiTabs',
   slot: 'ScrollbarSize'
 })({
@@ -213,11 +205,11 @@ const TabsScrollbarSize = (0, _styled.default)(_ScrollbarSize.default, {
 const defaultIndicatorStyle = {};
 let warnedOnceTabPresent = false;
 const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
-  const props = (0, _useThemeProps.default)({
+  const props = useThemeProps({
     props: inProps,
     name: 'MuiTabs'
   });
-  const theme = (0, _useTheme.default)();
+  const theme = useTheme();
   const isRtl = theme.direction === 'rtl';
   const {
       'aria-label': ariaLabel,
@@ -231,7 +223,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
       indicatorColor = 'primary',
       onChange,
       orientation = 'horizontal',
-      ScrollButtonComponent = _TabScrollButton.default,
+      ScrollButtonComponent = TabScrollButton,
       scrollButtons = 'auto',
       selectionFollowsFocus,
       TabIndicatorProps = {},
@@ -241,7 +233,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
       variant = 'standard',
       visibleScrollbar = false
     } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const scrollable = variant === 'scrollable';
   const vertical = orientation === 'vertical';
   const scrollStart = vertical ? 'scrollTop' : 'scrollLeft';
@@ -249,7 +241,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
   const end = vertical ? 'bottom' : 'right';
   const clientSize = vertical ? 'clientHeight' : 'clientWidth';
   const size = vertical ? 'height' : 'width';
-  const ownerState = (0, _extends2.default)({}, props, {
+  const ownerState = _extends({}, props, {
     component,
     allowScrollButtonsMobile,
     indicatorColor,
@@ -295,7 +287,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
         clientWidth: tabsNode.clientWidth,
         scrollLeft: tabsNode.scrollLeft,
         scrollTop: tabsNode.scrollTop,
-        scrollLeftNormalized: (0, _scrollLeft.getNormalizedScrollLeft)(tabsNode, theme.direction),
+        scrollLeftNormalized: getNormalizedScrollLeft(tabsNode, theme.direction),
         scrollWidth: tabsNode.scrollWidth,
         top: rect.top,
         bottom: rect.bottom,
@@ -328,7 +320,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
       tabMeta
     };
   };
-  const updateIndicatorState = (0, _useEventCallback.default)(() => {
+  const updateIndicatorState = useEventCallback(() => {
     const {
       tabsMeta,
       tabMeta
@@ -369,7 +361,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
     animation = true
   } = {}) => {
     if (animation) {
-      (0, _animate.default)(scrollStart, tabsRef.current, scrollValue, {
+      animate(scrollStart, tabsRef.current, scrollValue, {
         duration: theme.transitions.duration.standard
       });
     } else {
@@ -383,7 +375,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
     } else {
       scrollValue += delta * (isRtl ? -1 : 1);
       // Fix for Edge
-      scrollValue *= isRtl && (0, _scrollLeft.detectScrollType)() === 'reverse' ? -1 : 1;
+      scrollValue *= isRtl && detectScrollType() === 'reverse' ? -1 : 1;
     }
     scroll(scrollValue);
   };
@@ -422,31 +414,31 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
   }, []);
   const getConditionalElements = () => {
     const conditionalElements = {};
-    conditionalElements.scrollbarSizeListener = scrollable ? /*#__PURE__*/(0, _jsxRuntime.jsx)(TabsScrollbarSize, {
+    conditionalElements.scrollbarSizeListener = scrollable ? /*#__PURE__*/_jsx(TabsScrollbarSize, {
       onChange: handleScrollbarSizeChange,
-      className: (0, _clsx.default)(classes.scrollableX, classes.hideScrollbar)
+      className: clsx(classes.scrollableX, classes.hideScrollbar)
     }) : null;
     const scrollButtonsActive = displayScroll.start || displayScroll.end;
     const showScrollButtons = scrollable && (scrollButtons === 'auto' && scrollButtonsActive || scrollButtons === true);
-    conditionalElements.scrollButtonStart = showScrollButtons ? /*#__PURE__*/(0, _jsxRuntime.jsx)(ScrollButtonComponent, (0, _extends2.default)({
+    conditionalElements.scrollButtonStart = showScrollButtons ? /*#__PURE__*/_jsx(ScrollButtonComponent, _extends({
       orientation: orientation,
       direction: isRtl ? 'right' : 'left',
       onClick: handleStartScrollClick,
       disabled: !displayScroll.start
     }, TabScrollButtonProps, {
-      className: (0, _clsx.default)(classes.scrollButtons, TabScrollButtonProps.className)
+      className: clsx(classes.scrollButtons, TabScrollButtonProps.className)
     })) : null;
-    conditionalElements.scrollButtonEnd = showScrollButtons ? /*#__PURE__*/(0, _jsxRuntime.jsx)(ScrollButtonComponent, (0, _extends2.default)({
+    conditionalElements.scrollButtonEnd = showScrollButtons ? /*#__PURE__*/_jsx(ScrollButtonComponent, _extends({
       orientation: orientation,
       direction: isRtl ? 'left' : 'right',
       onClick: handleEndScrollClick,
       disabled: !displayScroll.end
     }, TabScrollButtonProps, {
-      className: (0, _clsx.default)(classes.scrollButtons, TabScrollButtonProps.className)
+      className: clsx(classes.scrollButtons, TabScrollButtonProps.className)
     })) : null;
     return conditionalElements;
   };
-  const scrollSelectedIntoView = (0, _useEventCallback.default)(animation => {
+  const scrollSelectedIntoView = useEventCallback(animation => {
     const {
       tabsMeta,
       tabMeta
@@ -468,7 +460,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
       });
     }
   });
-  const updateScrollButtonState = (0, _useEventCallback.default)(() => {
+  const updateScrollButtonState = useEventCallback(() => {
     if (scrollable && scrollButtons !== false) {
       const {
         scrollTop,
@@ -483,7 +475,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
         showStartScroll = scrollTop > 1;
         showEndScroll = scrollTop < scrollHeight - clientHeight - 1;
       } else {
-        const scrollLeft = (0, _scrollLeft.getNormalizedScrollLeft)(tabsRef.current, theme.direction);
+        const scrollLeft = getNormalizedScrollLeft(tabsRef.current, theme.direction);
         // use 1 for the potential rounding error with browser zooms.
         showStartScroll = isRtl ? scrollLeft < scrollWidth - clientWidth - 1 : scrollLeft > 1;
         showEndScroll = !isRtl ? scrollLeft < scrollWidth - clientWidth - 1 : scrollLeft > 1;
@@ -497,7 +489,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
     }
   });
   React.useEffect(() => {
-    const handleResize = (0, _debounce.default)(() => {
+    const handleResize = debounce(() => {
       // If the Tabs component is replaced by Suspense with a fallback, the last
       // ResizeObserver's handler that runs because of the change in the layout is trying to
       // access a dom node that is no longer there (as the fallback component is being shown instead).
@@ -509,7 +501,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
         updateScrollButtonState();
       }
     });
-    const win = (0, _ownerWindow.default)(tabsRef.current);
+    const win = ownerWindow(tabsRef.current);
     win.addEventListener('resize', handleResize);
     let resizeObserver;
     if (typeof ResizeObserver !== 'undefined') {
@@ -526,7 +518,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
       }
     };
   }, [updateIndicatorState, updateScrollButtonState]);
-  const handleTabsScroll = React.useMemo(() => (0, _debounce.default)(() => {
+  const handleTabsScroll = React.useMemo(() => debounce(() => {
     updateScrollButtonState();
   }), [updateScrollButtonState]);
   React.useEffect(() => {
@@ -549,10 +541,10 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
     updateIndicator: updateIndicatorState,
     updateScrollButtons: updateScrollButtonState
   }), [updateIndicatorState, updateScrollButtonState]);
-  const indicator = /*#__PURE__*/(0, _jsxRuntime.jsx)(TabsIndicator, (0, _extends2.default)({}, TabIndicatorProps, {
-    className: (0, _clsx.default)(classes.indicator, TabIndicatorProps.className),
+  const indicator = /*#__PURE__*/_jsx(TabsIndicator, _extends({}, TabIndicatorProps, {
+    className: clsx(classes.indicator, TabIndicatorProps.className),
     ownerState: ownerState,
-    style: (0, _extends2.default)({}, indicatorStyle, TabIndicatorProps.style)
+    style: _extends({}, indicatorStyle, TabIndicatorProps.style)
   }));
   let childIndex = 0;
   const children = React.Children.map(childrenProp, child => {
@@ -560,7 +552,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
       return null;
     }
     if (process.env.NODE_ENV !== 'production') {
-      if ((0, _reactIs.isFragment)(child)) {
+      if (isFragment(child)) {
         console.error(["MUI: The Tabs component doesn't accept a Fragment as a child.", 'Consider providing an array instead.'].join('\n'));
       }
     }
@@ -568,7 +560,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
     valueToIndex.set(childValue, childIndex);
     const selected = childValue === value;
     childIndex += 1;
-    return /*#__PURE__*/React.cloneElement(child, (0, _extends2.default)({
+    return /*#__PURE__*/React.cloneElement(child, _extends({
       fullWidth: variant === 'fullWidth',
       indicator: selected && !mounted && indicator,
       selected,
@@ -582,7 +574,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
   });
   const handleKeyDown = event => {
     const list = tabListRef.current;
-    const currentFocus = (0, _ownerDocument.default)(list).activeElement;
+    const currentFocus = ownerDocument(list).activeElement;
     // Keyboard navigation assumes that [role="tab"] are siblings
     // though we might warn in the future about nested, interactive elements
     // as a a11y violation
@@ -619,13 +611,13 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
     }
   };
   const conditionalElements = getConditionalElements();
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(TabsRoot, (0, _extends2.default)({
-    className: (0, _clsx.default)(classes.root, className),
+  return /*#__PURE__*/_jsxs(TabsRoot, _extends({
+    className: clsx(classes.root, className),
     ownerState: ownerState,
     ref: ref,
     as: component
   }, other, {
-    children: [conditionalElements.scrollButtonStart, conditionalElements.scrollbarSizeListener, /*#__PURE__*/(0, _jsxRuntime.jsxs)(TabsScroller, {
+    children: [conditionalElements.scrollButtonStart, conditionalElements.scrollbarSizeListener, /*#__PURE__*/_jsxs(TabsScroller, {
       className: classes.scroller,
       ownerState: ownerState,
       style: {
@@ -634,7 +626,7 @@ const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
       },
       ref: tabsRef,
       onScroll: handleTabsScroll,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(FlexContainer, {
+      children: [/*#__PURE__*/_jsx(FlexContainer, {
         "aria-label": ariaLabel,
         "aria-labelledby": ariaLabelledBy,
         "aria-orientation": orientation === 'vertical' ? 'vertical' : null,
@@ -661,66 +653,66 @@ process.env.NODE_ENV !== "production" ? Tabs.propTypes /* remove-proptypes */ =
    * @param {object} actions This object contains all possible actions
    * that can be triggered programmatically.
    */
-  action: _utils.refType,
+  action: refType,
   /**
    * If `true`, the scroll buttons aren't forced hidden on mobile.
    * By default the scroll buttons are hidden on mobile and takes precedence over `scrollButtons`.
    * @default false
    */
-  allowScrollButtonsMobile: _propTypes.default.bool,
+  allowScrollButtonsMobile: PropTypes.bool,
   /**
    * The label for the Tabs as a string.
    */
-  'aria-label': _propTypes.default.string,
+  'aria-label': PropTypes.string,
   /**
    * An id or list of ids separated by a space that label the Tabs.
    */
-  'aria-labelledby': _propTypes.default.string,
+  'aria-labelledby': PropTypes.string,
   /**
    * If `true`, the tabs are centered.
    * This prop is intended for large views.
    * @default false
    */
-  centered: _propTypes.default.bool,
+  centered: PropTypes.bool,
   /**
    * The content of the component.
    */
-  children: _propTypes.default.node,
+  children: PropTypes.node,
   /**
    * Override or extend the styles applied to the component.
    */
-  classes: _propTypes.default.object,
+  classes: PropTypes.object,
   /**
    * @ignore
    */
-  className: _propTypes.default.string,
+  className: PropTypes.string,
   /**
    * The component used for the root node.
    * Either a string to use a HTML element or a component.
    */
-  component: _propTypes.default.elementType,
+  component: PropTypes.elementType,
   /**
    * Determines the color of the indicator.
    * @default 'primary'
    */
-  indicatorColor: _propTypes.default /* @typescript-to-proptypes-ignore */.oneOfType([_propTypes.default.oneOf(['primary', 'secondary']), _propTypes.default.string]),
+  indicatorColor: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['primary', 'secondary']), PropTypes.string]),
   /**
    * Callback fired when the value changes.
    *
    * @param {React.SyntheticEvent} event The event source of the callback. **Warning**: This is a generic event not a change event.
    * @param {any} value We default to the index of the child (number)
    */
-  onChange: _propTypes.default.func,
+  onChange: PropTypes.func,
   /**
    * The component orientation (layout flow direction).
    * @default 'horizontal'
    */
-  orientation: _propTypes.default.oneOf(['horizontal', 'vertical']),
+  orientation: PropTypes.oneOf(['horizontal', 'vertical']),
   /**
    * The component used to render the scroll buttons.
    * @default TabScrollButton
    */
-  ScrollButtonComponent: _propTypes.default.elementType,
+  ScrollButtonComponent: PropTypes.elementType,
   /**
    * Determine behavior of scroll buttons when tabs are set to scroll:
    *
@@ -732,36 +724,36 @@ process.env.NODE_ENV !== "production" ? Tabs.propTypes /* remove-proptypes */ =
    * This behavior can be disabled with `allowScrollButtonsMobile`.
    * @default 'auto'
    */
-  scrollButtons: _propTypes.default /* @typescript-to-proptypes-ignore */.oneOf(['auto', false, true]),
+  scrollButtons: PropTypes /* @typescript-to-proptypes-ignore */.oneOf(['auto', false, true]),
   /**
    * If `true` the selected tab changes on focus. Otherwise it only
    * changes on activation.
    */
-  selectionFollowsFocus: _propTypes.default.bool,
+  selectionFollowsFocus: PropTypes.bool,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   /**
    * Props applied to the tab indicator element.
    * @default  {}
    */
-  TabIndicatorProps: _propTypes.default.object,
+  TabIndicatorProps: PropTypes.object,
   /**
    * Props applied to the [`TabScrollButton`](/material-ui/api/tab-scroll-button/) element.
    * @default {}
    */
-  TabScrollButtonProps: _propTypes.default.object,
+  TabScrollButtonProps: PropTypes.object,
   /**
    * Determines the color of the `Tab`.
    * @default 'primary'
    */
-  textColor: _propTypes.default.oneOf(['inherit', 'primary', 'secondary']),
+  textColor: PropTypes.oneOf(['inherit', 'primary', 'secondary']),
   /**
    * The value of the currently selected `Tab`.
    * If you don't want any selected `Tab`, you can set this prop to `false`.
    */
-  value: _propTypes.default.any,
+  value: PropTypes.any,
   /**
    * Determines additional display behavior of the tabs:
    *
@@ -772,13 +764,12 @@ process.env.NODE_ENV !== "production" ? Tabs.propTypes /* remove-proptypes */ =
    *  - `standard` will render the default state.
    * @default 'standard'
    */
-  variant: _propTypes.default.oneOf(['fullWidth', 'scrollable', 'standard']),
+  variant: PropTypes.oneOf(['fullWidth', 'scrollable', 'standard']),
   /**
    * If `true`, the scrollbar is visible. It can be useful when displaying
    * a long vertical list of tabs.
    * @default false
    */
-  visibleScrollbar: _propTypes.default.bool
+  visibleScrollbar: PropTypes.bool
 } : void 0;
-var _default = Tabs;
-exports.default = _default;
+export default Tabs;

package/Tabs/index.js

@@ -1,36 +1,3 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _exportNames = {
-  tabsClasses: true
-};
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function () {
-    return _Tabs.default;
-  }
-});
-Object.defineProperty(exports, "tabsClasses", {
-  enumerable: true,
-  get: function () {
-    return _tabsClasses.default;
-  }
-});
-var _Tabs = _interopRequireDefault(require("./Tabs"));
-var _tabsClasses = _interopRequireWildcard(require("./tabsClasses"));
-Object.keys(_tabsClasses).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _tabsClasses[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _tabsClasses[key];
-    }
-  });
-});
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+export { default } from './Tabs';
+export { default as tabsClasses } from './tabsClasses';
+export * from './tabsClasses';

package/Tabs/package.json

@@ -1,6 +1,6 @@
 {
   "sideEffects": false,
-  "module": "../esm/Tabs/index.js",
-  "main": "./index.js",
+  "module": "./index.js",
+  "main": "../node/Tabs/index.js",
   "types": "./index.d.ts"
 }