@mui/docs 7.0.0-alpha.0 → 7.0.0-alpha.2

package/ComponentLinkHeader/ComponentLinkHeader.js

@@ -1,18 +1,26 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ComponentLinkHeader = ComponentLinkHeader;
+var React = _interopRequireWildcard(require("react"));
+var _Chip = _interopRequireDefault(require("@mui/material/Chip"));
+var _Tooltip = _interopRequireDefault(require("@mui/material/Tooltip"));
+var _ChatRounded2 = _interopRequireDefault(require("@mui/icons-material/ChatRounded"));
+var _GitHub = _interopRequireDefault(require("@mui/icons-material/GitHub"));
+var _styles = require("@mui/material/styles");
+var _SketchIcon = _interopRequireDefault(require("../svgIcons/SketchIcon"));
+var _FigmaIcon = _interopRequireDefault(require("../svgIcons/FigmaIcon"));
+var _BundleSizeIcon2 = _interopRequireDefault(require("../svgIcons/BundleSizeIcon"));
+var _W3CIcon2 = _interopRequireDefault(require("../svgIcons/W3CIcon"));
+var _MaterialDesignIcon2 = _interopRequireDefault(require("../svgIcons/MaterialDesignIcon"));
+var _i18n = require("../i18n");
+var _jsxRuntime = require("react/jsx-runtime");
 var _ChatRounded, _BundleSizeIcon, _GitHubIcon, _W3CIcon, _MaterialDesignIcon, _li, _li2;
-import * as React from 'react';
-import Chip from '@mui/material/Chip';
-import Tooltip from '@mui/material/Tooltip';
-import ChatRounded from '@mui/icons-material/ChatRounded';
-import GitHubIcon from '@mui/icons-material/GitHub';
-import { styled } from '@mui/material/styles';
-import SketchIcon from "../svgIcons/SketchIcon.js";
-import FigmaIcon from "../svgIcons/FigmaIcon.js";
-import BundleSizeIcon from "../svgIcons/BundleSizeIcon.js";
-import W3CIcon from "../svgIcons/W3CIcon.js";
-import MaterialDesignIcon from "../svgIcons/MaterialDesignIcon.js";
-import { useTranslate } from "../i18n/index.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const Root = styled('ul')(({
+const Root = (0, _styles.styled)('ul')(({
   theme
 }) => ({
   margin: 0,
@@ -41,18 +49,18 @@ const defaultPackageNames = {
   'base-ui': '@mui/base',
   system: '@mui/system'
 };
-export function ComponentLinkHeader(props) {
+function ComponentLinkHeader(props) {
   const {
     markdown: {
       headers
     },
     design
   } = props;
-  const t = useTranslate();
+  const t = (0, _i18n.useTranslate)();
   const packageName = headers.packageName ?? defaultPackageNames[headers.productId] ?? '@mui/material';
-  return /*#__PURE__*/_jsxs(Root, {
-    children: [headers.githubLabel ? /*#__PURE__*/_jsx("li", {
-      children: /*#__PURE__*/_jsx(Chip, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Root, {
+    children: [headers.githubLabel ? /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
         clickable: true,
         role: undefined,
         component: "a",
@@ -60,7 +68,7 @@ export function ComponentLinkHeader(props) {
         variant: "outlined",
         rel: "nofollow",
         href: `${process.env.SOURCE_CODE_REPO}/labels/${encodeURIComponent(headers.githubLabel)}`,
-        icon: _ChatRounded || (_ChatRounded = /*#__PURE__*/_jsx(ChatRounded, {
+        icon: _ChatRounded || (_ChatRounded = /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChatRounded2.default, {
           color: "primary"
         })),
         "data-ga-event-category": "ComponentLinkHeader",
@@ -69,11 +77,11 @@ export function ComponentLinkHeader(props) {
         "data-ga-event-split": "0.1",
         label: t('githubLabel')
       })
-    }) : null, /*#__PURE__*/_jsx("li", {
-      children: /*#__PURE__*/_jsx(Tooltip, {
+    }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
         title: t('bundleSizeTooltip'),
         describeChild: true,
-        children: /*#__PURE__*/_jsx(Chip, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
           clickable: true,
           role: undefined,
           component: "a",
@@ -81,7 +89,7 @@ export function ComponentLinkHeader(props) {
           variant: "outlined",
           rel: "nofollow",
           href: `https://bundlephobia.com/package/${packageName}@latest`,
-          icon: _BundleSizeIcon || (_BundleSizeIcon = /*#__PURE__*/_jsx(BundleSizeIcon, {
+          icon: _BundleSizeIcon || (_BundleSizeIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_BundleSizeIcon2.default, {
             color: "primary"
           })),
           "data-ga-event-category": "ComponentLinkHeader",
@@ -91,8 +99,8 @@ export function ComponentLinkHeader(props) {
           label: t('bundleSize')
         })
       })
-    }), headers.githubSource ? /*#__PURE__*/_jsx("li", {
-      children: /*#__PURE__*/_jsx(Chip, {
+    }), headers.githubSource ? /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
         clickable: true,
         role: undefined,
         component: "a",
@@ -100,15 +108,15 @@ export function ComponentLinkHeader(props) {
         variant: "outlined",
         rel: "nofollow",
         href: `${process.env.SOURCE_CODE_REPO}/tree/v${process.env.LIB_VERSION}/${headers.githubSource}`,
-        icon: _GitHubIcon || (_GitHubIcon = /*#__PURE__*/_jsx(GitHubIcon, {})),
+        icon: _GitHubIcon || (_GitHubIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_GitHub.default, {})),
         "data-ga-event-category": "ComponentLinkHeader",
         "data-ga-event-action": "click",
         "data-ga-event-label": "Source",
         "data-ga-event-split": "0.1",
         label: "Source"
       })
-    }) : null, headers.waiAria ? /*#__PURE__*/_jsx("li", {
-      children: /*#__PURE__*/_jsx(Chip, {
+    }) : null, headers.waiAria ? /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
         clickable: true,
         role: undefined,
         component: "a",
@@ -116,7 +124,7 @@ export function ComponentLinkHeader(props) {
         variant: "outlined",
         rel: "nofollow",
         href: headers.waiAria,
-        icon: _W3CIcon || (_W3CIcon = /*#__PURE__*/_jsx(W3CIcon, {
+        icon: _W3CIcon || (_W3CIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_W3CIcon2.default, {
           color: "primary"
         })),
         "data-ga-event-category": "ComponentLinkHeader",
@@ -125,8 +133,8 @@ export function ComponentLinkHeader(props) {
         "data-ga-event-split": "0.1",
         label: "WAI-ARIA"
       })
-    }) : null, headers.materialDesign ? /*#__PURE__*/_jsx("li", {
-      children: /*#__PURE__*/_jsx(Chip, {
+    }) : null, headers.materialDesign ? /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
         clickable: true,
         role: undefined,
         component: "a",
@@ -134,16 +142,16 @@ export function ComponentLinkHeader(props) {
         variant: "outlined",
         rel: "nofollow",
         href: headers.materialDesign,
-        icon: _MaterialDesignIcon || (_MaterialDesignIcon = /*#__PURE__*/_jsx(MaterialDesignIcon, {})),
+        icon: _MaterialDesignIcon || (_MaterialDesignIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_MaterialDesignIcon2.default, {})),
         "data-ga-event-category": "ComponentLinkHeader",
         "data-ga-event-action": "click",
         "data-ga-event-label": "Material Design",
         "data-ga-event-split": "0.1",
         label: "Material Design"
       })
-    }) : null, design === false ? null : /*#__PURE__*/_jsxs(React.Fragment, {
-      children: [_li || (_li = /*#__PURE__*/_jsx("li", {
-        children: /*#__PURE__*/_jsx(Chip, {
+    }) : null, design === false ? null : /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
+      children: [_li || (_li = /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
           clickable: true,
           role: undefined,
           component: "a",
@@ -151,15 +159,15 @@ export function ComponentLinkHeader(props) {
           variant: "outlined",
           rel: "nofollow",
           href: "https://mui.com/store/items/figma-react/?utm_source=docs&utm_medium=referral&utm_campaign=component-link-header",
-          icon: /*#__PURE__*/_jsx(FigmaIcon, {}),
+          icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_FigmaIcon.default, {}),
           "data-ga-event-category": "ComponentLinkHeader",
           "data-ga-event-action": "click",
           "data-ga-event-label": "Figma",
           "data-ga-event-split": "0.1",
           label: "Figma"
         })
-      })), packageName === '@mui/joy' ? null : _li2 || (_li2 = /*#__PURE__*/_jsx("li", {
-        children: /*#__PURE__*/_jsx(Chip, {
+      })), packageName === '@mui/joy' ? null : _li2 || (_li2 = /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
           clickable: true,
           role: undefined,
           component: "a",
@@ -167,7 +175,7 @@ export function ComponentLinkHeader(props) {
           variant: "outlined",
           rel: "nofollow",
           href: "https://mui.com/store/items/sketch-react/?utm_source=docs&utm_medium=referral&utm_campaign=component-link-header",
-          icon: /*#__PURE__*/_jsx(SketchIcon, {}),
+          icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SketchIcon.default, {}),
           "data-ga-event-category": "ComponentLinkHeader",
           "data-ga-event-action": "click",
           "data-ga-event-label": "Sketch",

package/ComponentLinkHeader/index.d.ts

@@ -1,2 +1,2 @@
-export * from './ComponentLinkHeader';
-export { ComponentLinkHeader as default } from './ComponentLinkHeader';
+export * from "./ComponentLinkHeader.js";
+export { ComponentLinkHeader as default } from "./ComponentLinkHeader.js";

package/ComponentLinkHeader/index.js

@@ -1,2 +1,24 @@
-export * from "./ComponentLinkHeader.js";
-export { ComponentLinkHeader as default } from "./ComponentLinkHeader.js";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _ComponentLinkHeader.ComponentLinkHeader;
+  }
+});
+var _ComponentLinkHeader = require("./ComponentLinkHeader");
+Object.keys(_ComponentLinkHeader).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _ComponentLinkHeader[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _ComponentLinkHeader[key];
+    }
+  });
+});

package/DocsProvider/DocsProvider.d.ts

@@ -1,18 +1,24 @@
 import * as React from 'react';
-import { Translations } from '../i18n';
-import { AdConfig } from '../Ad';
+import { Translations } from "../i18n/index.js";
+import { AdConfig } from "../Ad/index.js";
 export interface DocsConfig {
-    LANGUAGES: string[];
-    LANGUAGES_SSR: string[];
-    LANGUAGES_IN_PROGRESS: string[];
-    LANGUAGES_IGNORE_PAGES: (pathname: string) => boolean;
+  LANGUAGES: string[];
+  LANGUAGES_SSR: string[];
+  LANGUAGES_IN_PROGRESS: string[];
+  LANGUAGES_IGNORE_PAGES: (pathname: string) => boolean;
 }
 export interface DocsProviderProps {
-    config: DocsConfig;
-    adConfig?: Partial<AdConfig>;
-    defaultUserLanguage: string;
-    children?: React.ReactNode;
-    translations?: Translations;
+  config: DocsConfig;
+  adConfig?: Partial<AdConfig>;
+  defaultUserLanguage: string;
+  children?: React.ReactNode;
+  translations?: Translations;
 }
-export declare function DocsProvider({ config, adConfig, defaultUserLanguage, translations, children, }: DocsProviderProps): React.JSX.Element;
-export declare function useDocsConfig(): DocsConfig;
+export declare function DocsProvider({
+  config,
+  adConfig,
+  defaultUserLanguage,
+  translations,
+  children
+}: DocsProviderProps): React.JSX.Element;
+export declare function useDocsConfig(): DocsConfig;

package/DocsProvider/DocsProvider.js

@@ -1,20 +1,28 @@
-import * as React from 'react';
-import { UserLanguageProvider } from "../i18n/index.js";
-import { AdProvider } from "../Ad/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DocsProvider = DocsProvider;
+exports.useDocsConfig = useDocsConfig;
+var React = _interopRequireWildcard(require("react"));
+var _i18n = require("../i18n");
+var _Ad = require("../Ad");
+var _jsxRuntime = require("react/jsx-runtime");
 const DocsConfigContext = /*#__PURE__*/React.createContext(null);
-export function DocsProvider({
+function DocsProvider({
   config,
   adConfig,
   defaultUserLanguage,
   translations,
   children
 }) {
-  return /*#__PURE__*/_jsx(DocsConfigContext.Provider, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(DocsConfigContext.Provider, {
     value: config,
-    children: /*#__PURE__*/_jsx(AdProvider, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Ad.AdProvider, {
       config: adConfig,
-      children: /*#__PURE__*/_jsx(UserLanguageProvider, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_i18n.UserLanguageProvider, {
         defaultUserLanguage: defaultUserLanguage,
         translations: translations,
         children: children
@@ -22,7 +30,7 @@ export function DocsProvider({
     })
   });
 }
-export function useDocsConfig() {
+function useDocsConfig() {
   const config = React.useContext(DocsConfigContext);
   if (!config) {
     throw new Error('Could not find docs config context value; please ensure the component is wrapped in a <DocsProvider>');

package/DocsProvider/index.d.ts

@@ -1 +1 @@
-export * from './DocsProvider';
+export * from "./DocsProvider.js";

package/DocsProvider/index.js

@@ -1 +1,16 @@
-export * from "./DocsProvider.js";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _DocsProvider = require("./DocsProvider");
+Object.keys(_DocsProvider).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _DocsProvider[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _DocsProvider[key];
+    }
+  });
+});

package/HighlightedCode/HighlightedCode.d.ts

@@ -2,13 +2,13 @@ import * as React from 'react';
 import { ButtonProps } from '@mui/material/Button';
 import { SxProps } from '@mui/material/styles';
 export interface HighlightedCodeProps {
-    code: string;
-    copyButtonHidden?: boolean;
-    copyButtonProps?: ButtonProps;
-    language: string;
-    parentComponent?: React.ElementType;
-    plainStyle?: boolean;
-    preComponent?: React.ElementType;
-    sx?: SxProps;
+  code: string;
+  copyButtonHidden?: boolean;
+  copyButtonProps?: ButtonProps;
+  language: string;
+  parentComponent?: React.ElementType;
+  plainStyle?: boolean;
+  preComponent?: React.ElementType;
+  sx?: SxProps;
 }
-export declare const HighlightedCode: React.ForwardRefExoticComponent<HighlightedCodeProps & React.RefAttributes<HTMLDivElement>>;
+export declare const HighlightedCode: React.ForwardRefExoticComponent<HighlightedCodeProps & React.RefAttributes<HTMLDivElement>>;

package/HighlightedCode/HighlightedCode.js

@@ -1,11 +1,19 @@
-import * as React from 'react';
-import prism from '@mui/internal-markdown/prism';
-import { NoSsr } from '@mui/base/NoSsr';
-import { styled } from '@mui/material/styles';
-import { useCodeCopy, CodeCopyButton } from "../CodeCopy/index.js";
-import { MarkdownElement } from "../MarkdownElement/index.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const Pre = styled('pre')(({
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HighlightedCode = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _prism = _interopRequireDefault(require("@mui/internal-markdown/prism"));
+var _NoSsr = require("@mui/base/NoSsr");
+var _styles = require("@mui/material/styles");
+var _CodeCopy = require("../CodeCopy");
+var _MarkdownElement = require("../MarkdownElement");
+var _jsxRuntime = require("react/jsx-runtime");
+const Pre = (0, _styles.styled)('pre')(({
   theme
 }) => ({
   margin: 0,
@@ -23,37 +31,37 @@ const Pre = styled('pre')(({
     // https://github.com/necolas/normalize.css/blob/master/normalize.css#L102
   }
 }));
-export const HighlightedCode = /*#__PURE__*/React.forwardRef(function HighlightedCode(props, ref) {
+const HighlightedCode = exports.HighlightedCode = /*#__PURE__*/React.forwardRef(function HighlightedCode(props, ref) {
   const {
     code,
     copyButtonHidden = false,
     copyButtonProps,
     language,
     plainStyle,
-    parentComponent: Component = plainStyle ? React.Fragment : MarkdownElement,
+    parentComponent: Component = plainStyle ? React.Fragment : _MarkdownElement.MarkdownElement,
     preComponent: PreComponent = plainStyle ? Pre : 'pre',
     ...other
   } = props;
   const renderedCode = React.useMemo(() => {
-    return prism(code.trim(), language);
+    return (0, _prism.default)(code.trim(), language);
   }, [code, language]);
-  const handlers = useCodeCopy();
-  return /*#__PURE__*/_jsx(Component, {
+  const handlers = (0, _CodeCopy.useCodeCopy)();
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
     ref: ref,
     ...other,
-    children: /*#__PURE__*/_jsxs("div", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "MuiCode-root",
       ...handlers,
       style: {
         height: '100%'
       },
-      children: [copyButtonHidden ? null : /*#__PURE__*/_jsx(NoSsr, {
-        children: /*#__PURE__*/_jsx(CodeCopyButton, {
+      children: [copyButtonHidden ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_NoSsr.NoSsr, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CodeCopy.CodeCopyButton, {
           code: code,
           ...copyButtonProps
         })
-      }), /*#__PURE__*/_jsx(PreComponent, {
-        children: /*#__PURE__*/_jsx("code", {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(PreComponent, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("code", {
           className: `language-${language}`
           // eslint-disable-next-line react/no-danger
           ,

package/HighlightedCode/index.d.ts

@@ -1 +1 @@
-export * from './HighlightedCode';
+export * from "./HighlightedCode.js";

package/HighlightedCode/index.js

@@ -1 +1,16 @@
-export * from "./HighlightedCode.js";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _HighlightedCode = require("./HighlightedCode");
+Object.keys(_HighlightedCode).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _HighlightedCode[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _HighlightedCode[key];
+    }
+  });
+});

package/HighlightedCodeWithTabs/HighlightedCodeWithTabs.d.ts

@@ -1,29 +1,29 @@
 import * as React from 'react';
 export declare const CodeTabList: import("@emotion/styled").StyledComponent<import("@mui/base/TabsList").TabsListOwnProps & Omit<any, keyof import("@mui/base/TabsList").TabsListOwnProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
-    ownerState: {
-        mounted: boolean;
-        contained?: boolean;
-    };
+  ownerState: {
+    mounted: boolean;
+    contained?: boolean;
+  };
 }, {}, {}>;
 export declare const CodeTabPanel: import("@emotion/styled").StyledComponent<import("@mui/base/TabPanel").TabPanelOwnProps & Omit<any, keyof import("@mui/base/TabPanel").TabPanelOwnProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
-    ownerState: {
-        mounted: boolean;
-        contained?: boolean;
-    };
+  ownerState: {
+    mounted: boolean;
+    contained?: boolean;
+  };
 }, {}, {}>;
 export declare const CodeTab: import("@emotion/styled").StyledComponent<import("@mui/base/Tab").TabOwnProps & Omit<any, keyof import("@mui/base/Tab").TabOwnProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
-    ownerState: {
-        mounted: boolean;
-        contained?: boolean;
-    };
+  ownerState: {
+    mounted: boolean;
+    contained?: boolean;
+  };
 }, {}, {}>;
 type TabsConfig = {
-    code: string | ((tab: string) => string);
-    language: string;
-    tab: string;
+  code: string | ((tab: string) => string);
+  language: string;
+  tab: string;
 };
 export declare function HighlightedCodeWithTabs(props: {
-    tabs: Array<TabsConfig>;
-    storageKey?: string;
+  tabs: Array<TabsConfig>;
+  storageKey?: string;
 } & Record<string, any>): React.JSX.Element;
-export {};
+export {};

package/HighlightedCodeWithTabs/HighlightedCodeWithTabs.js

@@ -1,13 +1,22 @@
-import * as React from 'react';
-import { styled, alpha } from '@mui/material/styles';
-import { Tabs } from '@mui/base/Tabs';
-import { TabsList as TabsListBase } from '@mui/base/TabsList';
-import { TabPanel as TabPanelBase } from '@mui/base/TabPanel';
-import { Tab as TabBase } from '@mui/base/Tab';
-import useLocalStorageState from '@mui/utils/useLocalStorageState';
-import { HighlightedCode } from "../HighlightedCode/index.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const CodeTabList = styled(TabsListBase)(({
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CodeTabPanel = exports.CodeTabList = exports.CodeTab = void 0;
+exports.HighlightedCodeWithTabs = HighlightedCodeWithTabs;
+var React = _interopRequireWildcard(require("react"));
+var _styles = require("@mui/material/styles");
+var _Tabs = require("@mui/base/Tabs");
+var _TabsList = require("@mui/base/TabsList");
+var _TabPanel = require("@mui/base/TabPanel");
+var _Tab = require("@mui/base/Tab");
+var _useLocalStorageState = _interopRequireDefault(require("@mui/utils/useLocalStorageState"));
+var _HighlightedCode = require("../HighlightedCode");
+var _jsxRuntime = require("react/jsx-runtime");
+const CodeTabList = exports.CodeTabList = (0, _styles.styled)(_TabsList.TabsList)(({
   theme
 }) => ({
   display: 'flex',
@@ -16,7 +25,7 @@ export const CodeTabList = styled(TabsListBase)(({
   borderRight: '1px solid',
   overflowX: 'auto',
   ...theme.applyDarkStyles({
-    backgroundColor: alpha(theme.palette.primaryDark[800], 0.2)
+    backgroundColor: (0, _styles.alpha)(theme.palette.primaryDark[800], 0.2)
   }),
   variants: [{
     props: ({
@@ -107,7 +116,7 @@ export const CodeTabList = styled(TabsListBase)(({
       ownerState
     }) => ownerState?.contained,
     style: {
-      backgroundColor: alpha(theme.palette.grey[50], 0.2)
+      backgroundColor: (0, _styles.alpha)(theme.palette.grey[50], 0.2)
     }
   }, {
     props: ({
@@ -118,7 +127,7 @@ export const CodeTabList = styled(TabsListBase)(({
     }
   }]
 }));
-export const CodeTabPanel = styled(TabPanelBase)({
+const CodeTabPanel = exports.CodeTabPanel = (0, _styles.styled)(_TabPanel.TabPanel)({
   '& pre': {
     borderTopLeftRadius: 0,
     borderTopRightRadius: 0,
@@ -180,7 +189,7 @@ export const CodeTabPanel = styled(TabPanelBase)({
     }
   }]
 });
-export const CodeTab = styled(TabBase)(({
+const CodeTab = exports.CodeTab = (0, _styles.styled)(_Tab.Tab)(({
   theme
 }) => ({
   variants: [{
@@ -261,7 +270,7 @@ export const CodeTab = styled(TabBase)(({
     }) => !ownerState?.contained,
     style: {
       '&:hover': {
-        backgroundColor: alpha(theme.palette.primaryDark[500], 0.5),
+        backgroundColor: (0, _styles.alpha)(theme.palette.primaryDark[500], 0.5),
         color: (theme.vars || theme).palette.grey[400]
       }
     }
@@ -305,7 +314,7 @@ export const CodeTab = styled(TabBase)(({
     }
   })
 }));
-export function HighlightedCodeWithTabs(props) {
+function HighlightedCodeWithTabs(props) {
   const {
     tabs,
     storageKey
@@ -313,7 +322,7 @@ export function HighlightedCodeWithTabs(props) {
   const availableTabs = React.useMemo(() => tabs.map(({
     tab
   }) => tab), [tabs]);
-  const [activeTab, setActiveTab] = useLocalStorageState(storageKey ?? null, availableTabs[0]);
+  const [activeTab, setActiveTab] = (0, _useLocalStorageState.default)(storageKey ?? null, availableTabs[0]);
   // During hydration, activeTab is null, default to first value.
   const defaultizedActiveTab = activeTab ?? availableTabs[0];
   const [mounted, setMounted] = React.useState(false);
@@ -326,15 +335,15 @@ export function HighlightedCodeWithTabs(props) {
   const ownerState = {
     mounted
   };
-  return /*#__PURE__*/_jsxs(Tabs, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Tabs.Tabs, {
     selectionFollowsFocus: true,
     value: defaultizedActiveTab,
     onChange: handleChange,
-    children: [/*#__PURE__*/_jsx(CodeTabList, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(CodeTabList, {
       ownerState: ownerState,
       children: tabs.map(({
         tab
-      }) => /*#__PURE__*/_jsx(CodeTab, {
+      }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(CodeTab, {
         ownerState: ownerState,
         value: tab,
         children: tab
@@ -343,10 +352,10 @@ export function HighlightedCodeWithTabs(props) {
       tab,
       language,
       code
-    }) => /*#__PURE__*/_jsx(CodeTabPanel, {
+    }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(CodeTabPanel, {
       ownerState: ownerState,
       value: tab,
-      children: /*#__PURE__*/_jsx(HighlightedCode, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_HighlightedCode.HighlightedCode, {
         language: language || 'bash',
         code: typeof code === 'function' ? code(tab) : code
       })

package/HighlightedCodeWithTabs/index.d.ts

@@ -1,2 +1,2 @@
-export * from './HighlightedCodeWithTabs';
-export { HighlightedCodeWithTabs as default } from './HighlightedCodeWithTabs';
+export * from "./HighlightedCodeWithTabs.js";
+export { HighlightedCodeWithTabs as default } from "./HighlightedCodeWithTabs.js";