@mui/docs 6.0.0-alpha.1 → 6.0.0-alpha.11

package/node/CodeCopy/CodeCopy.js

@@ -0,0 +1,188 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CodeCopyProvider = CodeCopyProvider;
+exports.useCodeCopy = useCodeCopy;
+var React = _interopRequireWildcard(require("react"));
+var _router = require("next/router");
+var _clipboardCopy = _interopRequireDefault(require("clipboard-copy"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _InitCodeCopy;
+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 && {}.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; }
+const CodeBlockContext = /*#__PURE__*/React.createContext({
+  current: null
+});
+
+/**
+ * How to use: spread the handlers to the .MuiCode-root
+ *
+ * The html structure should be:
+ * <div className="MuiCode-root">
+ *  <pre>...</pre>
+ *  <button className="MuiCode-copy">...</button>
+ * </div>
+ */
+function useCodeCopy() {
+  const rootNode = React.useContext(CodeBlockContext);
+  return {
+    onMouseEnter: event => {
+      rootNode.current = event.currentTarget;
+    },
+    onMouseLeave: event => {
+      if (rootNode.current === event.currentTarget) {
+        var _rootNode$current$que;
+        (_rootNode$current$que = rootNode.current.querySelector('.MuiCode-copy')) == null || _rootNode$current$que.blur();
+        rootNode.current = null;
+      }
+    },
+    onFocus: event => {
+      rootNode.current = event.currentTarget;
+    },
+    onBlur: event => {
+      if (rootNode.current === event.currentTarget) {
+        rootNode.current = null;
+      }
+    }
+  };
+}
+function InitCodeCopy() {
+  const rootNode = React.useContext(CodeBlockContext);
+  const router = (0, _router.useRouter)();
+  React.useEffect(() => {
+    let key = 'Ctrl + ';
+    if (typeof window !== 'undefined') {
+      const macOS = window.navigator.platform.toUpperCase().indexOf('MAC') >= 0;
+      if (macOS) {
+        key = '⌘';
+      }
+    }
+    const codeRoots = document.getElementsByClassName('MuiCode-root');
+    if (codeRoots !== null) {
+      const listeners = [];
+      Array.from(codeRoots).forEach(elm => {
+        const handleMouseEnter = () => {
+          rootNode.current = elm;
+        };
+        elm.addEventListener('mouseenter', handleMouseEnter);
+        listeners.push(() => elm.removeEventListener('mouseenter', handleMouseEnter));
+        const handleMouseLeave = () => {
+          if (rootNode.current === elm) {
+            var _rootNode$current$que2;
+            (_rootNode$current$que2 = rootNode.current.querySelector('.MuiCode-copy')) == null || _rootNode$current$que2.blur();
+            rootNode.current = null;
+          }
+        };
+        elm.addEventListener('mouseleave', handleMouseLeave);
+        listeners.push(() => elm.removeEventListener('mouseleave', handleMouseLeave));
+        const handleFocusin = () => {
+          // use `focusin` because it bubbles from the copy button
+          rootNode.current = elm;
+        };
+        elm.addEventListener('focusin', handleFocusin);
+        listeners.push(() => elm.removeEventListener('focusin', handleFocusin));
+        const handleFocusout = () => {
+          // use `focusout` because it bubbles from the copy button
+          if (rootNode.current === elm) {
+            rootNode.current = null;
+          }
+        };
+        elm.addEventListener('focusout', handleFocusout);
+        listeners.push(() => elm.removeEventListener('focusout', handleFocusout));
+        async function handleClick(event) {
+          var _event$currentTarget, _textNode$textContent;
+          const trigger = event.currentTarget;
+          const pre = (_event$currentTarget = event.currentTarget) == null ? void 0 : _event$currentTarget.previousElementSibling;
+          const textNode = trigger.childNodes[0];
+          textNode.nodeValue = ((_textNode$textContent = textNode.textContent) == null ? void 0 : _textNode$textContent.replace('Copy', 'Copied')) || null;
+          trigger.dataset.copied = 'true';
+          setTimeout(() => {
+            if (trigger) {
+              var _textNode$textContent2;
+              textNode.nodeValue = ((_textNode$textContent2 = textNode.textContent) == null ? void 0 : _textNode$textContent2.replace('Copied', 'Copy')) || null;
+              delete trigger.dataset.copied;
+            }
+          }, 2000);
+          try {
+            if (pre.textContent) {
+              await (0, _clipboardCopy.default)(pre.textContent);
+            }
+            // eslint-disable-next-line no-empty
+          } catch (error) {}
+        }
+        const btn = elm.querySelector('.MuiCode-copy');
+        if (btn) {
+          var _btn$querySelector, _keyNode$textContent;
+          const keyNode = (_btn$querySelector = btn.querySelector('.MuiCode-copyKeypress')) == null ? void 0 : _btn$querySelector.childNodes[1];
+          if (!keyNode) {
+            // skip the logic if the btn is not generated from the markdown.
+            return;
+          }
+          keyNode.textContent = (keyNode == null || (_keyNode$textContent = keyNode.textContent) == null ? void 0 : _keyNode$textContent.replace('$key', key)) || null;
+          btn.addEventListener('click', handleClick);
+          listeners.push(() => btn.removeEventListener('click', handleClick));
+        }
+      });
+      return () => {
+        listeners.forEach(removeEventListener => {
+          removeEventListener();
+        });
+      };
+    }
+    return undefined;
+  }, [rootNode, router.pathname]);
+  return null;
+}
+function hasNativeSelection(element) {
+  var _window$getSelection;
+  if ((_window$getSelection = window.getSelection()) != null && _window$getSelection.toString()) {
+    return true;
+  }
+
+  // window.getSelection() returns an empty string in Firefox for selections inside a form element.
+  // See: https://bugzilla.mozilla.org/show_bug.cgi?id=85686.
+  // Instead, we can use element.selectionStart that is only defined on form elements.
+  if (element && (element.selectionEnd || 0) - (element.selectionStart || 0) > 0) {
+    return true;
+  }
+  return false;
+}
+/**
+ * Place <CodeCopyProvider> at the page level. It will check the keydown event and try to initiate copy click if rootNode exist.
+ * Any code block inside the tree can set the rootNode when mouse enter to leverage keyboard copy.
+ */
+function CodeCopyProvider({
+  children
+}) {
+  const rootNode = React.useRef(null);
+  React.useEffect(() => {
+    document.addEventListener('keydown', event => {
+      if (!rootNode.current) {
+        return;
+      }
+
+      // Skip if user is highlighting a text.
+      if (hasNativeSelection(event.target)) {
+        return;
+      }
+
+      // Skip if it's not a copy keyboard event
+      if (!((event.ctrlKey || event.metaKey) && event.key.toLowerCase() === 'c' && !event.shiftKey && !event.altKey)) {
+        return;
+      }
+      const copyBtn = rootNode.current.querySelector('.MuiCode-copy');
+      const initialEventAction = copyBtn.getAttribute('data-ga-event-action');
+      // update the 'data-ga-event-action' on the button to track keyboard interaction
+      copyBtn.dataset.gaEventAction = (initialEventAction == null ? void 0 : initialEventAction.replace('click', 'keyboard')) || 'copy-keyboard';
+      copyBtn.click(); // let the GA setup in GoogleAnalytics.js do the job
+      copyBtn.dataset.gaEventAction = initialEventAction; // reset the 'data-ga-event-action' back to initial
+    });
+  }, []);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(CodeBlockContext.Provider, {
+    value: rootNode,
+    children: [_InitCodeCopy || (_InitCodeCopy = /*#__PURE__*/(0, _jsxRuntime.jsx)(InitCodeCopy, {})), children]
+  });
+}

package/node/CodeCopy/CodeCopyButton.js

@@ -0,0 +1,50 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CodeCopyButton = CodeCopyButton;
+var React = _interopRequireWildcard(require("react"));
+var _useClipboardCopy = _interopRequireDefault(require("./useClipboardCopy"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _span, _span2;
+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 && {}.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; }
+function CodeCopyButton(props) {
+  const {
+    code,
+    ...other
+  } = props;
+  const {
+    copy,
+    isCopied
+  } = (0, _useClipboardCopy.default)();
+  // This component is designed to be wrapped in NoSsr
+  const macOS = window.navigator.platform.toUpperCase().indexOf('MAC') >= 0;
+  const key = macOS ? '⌘' : 'Ctrl + ';
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: "MuiCode-copy-container",
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
+      ...other,
+      "aria-label": "Copy the code",
+      type: "button",
+      className: "MuiCode-copy",
+      onClick: async () => {
+        // event.stopPropagation();
+        await copy(code);
+      },
+      children: [isCopied ? 'Copied' : 'Copy', /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+        className: "MuiCode-copyKeypress",
+        style: {
+          opacity: isCopied ? 0 : 1
+        },
+        children: [_span || (_span = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          children: "(or"
+        })), " ", key, "C", _span2 || (_span2 = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          children: ")"
+        }))]
+      })]
+    })
+  });
+}

package/node/CodeCopy/index.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  useClipboardCopy: true
+};
+Object.defineProperty(exports, "useClipboardCopy", {
+  enumerable: true,
+  get: function () {
+    return _useClipboardCopy.default;
+  }
+});
+var _CodeCopy = require("./CodeCopy");
+Object.keys(_CodeCopy).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _CodeCopy[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _CodeCopy[key];
+    }
+  });
+});
+var _CodeCopyButton = require("./CodeCopyButton");
+Object.keys(_CodeCopyButton).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _CodeCopyButton[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _CodeCopyButton[key];
+    }
+  });
+});
+var _useClipboardCopy = _interopRequireDefault(require("./useClipboardCopy"));

package/node/CodeCopy/useClipboardCopy.js

@@ -0,0 +1,30 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useClipboardCopy;
+var React = _interopRequireWildcard(require("react"));
+var _clipboardCopy = _interopRequireDefault(require("clipboard-copy"));
+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 && {}.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; }
+function useClipboardCopy() {
+  const [isCopied, setIsCopied] = React.useState(false);
+  const timeout = React.useRef();
+  React.useEffect(() => () => {
+    clearTimeout(timeout.current);
+  }, []);
+  const copy = async text => {
+    await (0, _clipboardCopy.default)(text);
+    setIsCopied(true);
+    clearTimeout(timeout.current);
+    timeout.current = setTimeout(() => {
+      setIsCopied(false);
+    }, 1200);
+  };
+  return {
+    copy,
+    isCopied
+  };
+}

package/node/ComponentLinkHeader/ComponentLinkHeader.js

@@ -0,0 +1,189 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+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 _styles = require("@mui/material/styles");
+var _SketchIcon = _interopRequireDefault(require("../svgIcons/SketchIcon"));
+var _FigmaIcon = _interopRequireDefault(require("../svgIcons/FigmaIcon"));
+var _AdobeXDIcon = _interopRequireDefault(require("../svgIcons/AdobeXDIcon"));
+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, _W3CIcon, _MaterialDesignIcon, _li, _React$Fragment;
+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 && {}.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; }
+const Root = (0, _styles.styled)('ul')({
+  margin: 0,
+  padding: 0,
+  listStyle: 'none',
+  display: 'flex',
+  flexWrap: 'wrap',
+  gap: 8,
+  '& .MuiChip-root': {
+    height: 26,
+    padding: '0 8px',
+    gap: 6,
+    '& .MuiChip-label': {
+      padding: 0
+    },
+    '& .MuiChip-iconSmall': {
+      margin: 0,
+      fontSize: 14
+    }
+  }
+});
+const defaultPackageNames = {
+  'material-ui': '@mui/material',
+  'joy-ui': '@mui/joy',
+  'base-ui': '@mui/base',
+  system: '@mui/system'
+};
+function ComponentLinkHeader(props) {
+  var _ref, _headers$packageName;
+  const {
+    markdown: {
+      headers
+    },
+    design
+  } = props;
+  const t = (0, _i18n.useTranslate)();
+  const packageName = (_ref = (_headers$packageName = headers.packageName) != null ? _headers$packageName : defaultPackageNames[headers.productId]) != null ? _ref : '@mui/material';
+  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",
+        size: "small",
+        variant: "outlined",
+        rel: "nofollow",
+        href: `${process.env.SOURCE_CODE_REPO}/labels/${encodeURIComponent(headers.githubLabel)}`,
+        icon: _ChatRounded || (_ChatRounded = /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChatRounded2.default, {
+          color: "primary"
+        })),
+        "data-ga-event-category": "ComponentLinkHeader",
+        "data-ga-event-action": "click",
+        "data-ga-event-label": t('githubLabel'),
+        "data-ga-event-split": "0.1",
+        label: t('githubLabel')
+      })
+    }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+        title: t('bundleSizeTooltip'),
+        describeChild: true,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+          clickable: true,
+          role: undefined,
+          component: "a",
+          size: "small",
+          variant: "outlined",
+          rel: "nofollow",
+          href: `https://bundlephobia.com/package/${packageName}@latest`,
+          icon: _BundleSizeIcon || (_BundleSizeIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_BundleSizeIcon2.default, {
+            color: "primary"
+          })),
+          "data-ga-event-category": "ComponentLinkHeader",
+          "data-ga-event-action": "click",
+          "data-ga-event-label": t('bundleSize'),
+          "data-ga-event-split": "0.1",
+          label: t('bundleSize')
+        })
+      })
+    }), headers.waiAria ? /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+        clickable: true,
+        role: undefined,
+        component: "a",
+        size: "small",
+        variant: "outlined",
+        rel: "nofollow",
+        href: headers.waiAria,
+        icon: _W3CIcon || (_W3CIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_W3CIcon2.default, {
+          color: "primary"
+        })),
+        "data-ga-event-category": "ComponentLinkHeader",
+        "data-ga-event-action": "click",
+        "data-ga-event-label": "WAI-ARIA",
+        "data-ga-event-split": "0.1",
+        label: "WAI-ARIA"
+      })
+    }) : null, headers.materialDesign ? /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+        clickable: true,
+        role: undefined,
+        component: "a",
+        size: "small",
+        variant: "outlined",
+        rel: "nofollow",
+        href: headers.materialDesign,
+        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__*/(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",
+          size: "small",
+          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__*/(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 : _React$Fragment || (_React$Fragment = /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+            clickable: true,
+            role: undefined,
+            component: "a",
+            size: "small",
+            variant: "outlined",
+            rel: "nofollow",
+            href: "https://mui.com/store/items/adobe-xd-react/?utm_source=docs&utm_medium=referral&utm_campaign=component-link-header",
+            icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_AdobeXDIcon.default, {}),
+            "data-ga-event-category": "ComponentLinkHeader",
+            "data-ga-event-action": "click",
+            "data-ga-event-label": "Adobe XD",
+            "data-ga-event-split": "0.1",
+            label: "Adobe"
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
+            clickable: true,
+            role: undefined,
+            component: "a",
+            size: "small",
+            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__*/(0, _jsxRuntime.jsx)(_SketchIcon.default, {}),
+            "data-ga-event-category": "ComponentLinkHeader",
+            "data-ga-event-action": "click",
+            "data-ga-event-label": "Sketch",
+            "data-ga-event-split": "0.1",
+            label: "Sketch"
+          })
+        })]
+      }))]
+    })]
+  });
+}

package/node/ComponentLinkHeader/index.js

@@ -0,0 +1,24 @@
+"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/node/HighlightedCode/HighlightedCode.js

@@ -0,0 +1,77 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+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");
+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 && {}.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; }
+const Pre = (0, _styles.styled)('pre')(({
+  theme
+}) => ({
+  margin: 0,
+  color: 'hsl(60deg 30% 96.08%)',
+  // fallback color until Prism's theme is loaded
+  WebkitOverflowScrolling: 'touch',
+  // iOS momentum scrolling.
+  maxWidth: 'calc(100vw - 32px)',
+  [theme.breakpoints.up('md')]: {
+    maxWidth: 'calc(100vw - 32px - 16px)'
+  },
+  '& code': {
+    // Avoid layout jump after hydration (style injected by Prism)
+    ...theme.typography.caption,
+    fontFamily: theme.typography.fontFamilyCode,
+    fontWeight: 400,
+    WebkitFontSmoothing: 'subpixel-antialiased'
+    // Reset for Safari
+    // https://github.com/necolas/normalize.css/blob/master/normalize.css#L102
+  }
+}));
+const HighlightedCode = exports.HighlightedCode = /*#__PURE__*/React.forwardRef(function HighlightedCode(props, ref) {
+  const {
+    code,
+    copyButtonHidden = false,
+    copyButtonProps,
+    language,
+    plainStyle,
+    parentComponent: Component = plainStyle ? 'div' : _MarkdownElement.MarkdownElement,
+    preComponent: PreComponent = plainStyle ? Pre : 'pre',
+    ...other
+  } = props;
+  const renderedCode = React.useMemo(() => {
+    return (0, _prism.default)(code.trim(), language);
+  }, [code, language]);
+  const handlers = (0, _CodeCopy.useCodeCopy)();
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
+    ref: ref,
+    ...other,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "MuiCode-root",
+      ...handlers,
+      children: [copyButtonHidden ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_NoSsr.NoSsr, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CodeCopy.CodeCopyButton, {
+          code: code,
+          ...copyButtonProps
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(PreComponent, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("code", {
+          className: `language-${language}`
+          // eslint-disable-next-line react/no-danger
+          ,
+          dangerouslySetInnerHTML: {
+            __html: renderedCode
+          }
+        })
+      })]
+    })
+  });
+});

package/node/HighlightedCode/index.js

@@ -0,0 +1,16 @@
+"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];
+    }
+  });
+});