@mui/internal-docs-infra 0.1.0 → 0.1.1-alpha.0

package/README.md

@@ -14,4 +14,6 @@ npm install @mui/internal-docs-infra
 
 ## Documentation
 
-We have no documentation for these components.
+This is stored in the `docs` directory.
+
+[Read More](./docs/README.md)

package/build/CodeControllerContext/CodeControllerContext.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { ControlledCode } from "../CodeHighlighter/types.js";
+export type Selection = {
+  variant: string;
+  fileName?: string;
+  transformKey?: string;
+};
+export interface CodeControllerContext {
+  code?: ControlledCode;
+  selection?: Selection;
+  setCode?: React.Dispatch<React.SetStateAction<ControlledCode | undefined>>;
+  setSelection?: React.Dispatch<React.SetStateAction<Selection>>;
+  components?: Record<string, React.ReactNode> | undefined;
+}
+export declare const CodeControllerContext: React.Context<CodeControllerContext | undefined>;
+export declare function useControlledCode(): {
+  controlledCode: ControlledCode | undefined;
+  controlledSelection: Selection | undefined;
+  controlledSetCode: React.Dispatch<React.SetStateAction<ControlledCode | undefined>> | undefined;
+  controlledSetSelection: React.Dispatch<React.SetStateAction<Selection>> | undefined;
+  controlledComponents: Record<string, React.ReactNode> | undefined;
+};

package/build/CodeControllerContext/CodeControllerContext.js

@@ -0,0 +1,21 @@
+"use strict";
+'use client';
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CodeControllerContext = void 0;
+exports.useControlledCode = useControlledCode;
+var React = _interopRequireWildcard(require("react"));
+var CodeControllerContext = exports.CodeControllerContext = /*#__PURE__*/React.createContext(undefined);
+function useControlledCode() {
+  var context = React.useContext(CodeControllerContext);
+  return {
+    controlledCode: context == null ? void 0 : context.code,
+    controlledSelection: context == null ? void 0 : context.selection,
+    controlledSetCode: context == null ? void 0 : context.setCode,
+    controlledSetSelection: context == null ? void 0 : context.setSelection,
+    controlledComponents: context == null ? void 0 : context.components
+  };
+}

package/build/CodeControllerContext/index.d.ts

@@ -0,0 +1 @@
+export * from "./CodeControllerContext.js";

package/build/CodeControllerContext/index.js

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

package/build/CodeHighlighter/CodeHighlighter.d.ts

@@ -0,0 +1,2 @@
+import type { CodeHighlighterProps } from "./types.js";
+export declare function CodeHighlighter(props: CodeHighlighterProps): import("react/jsx-runtime").JSX.Element;

package/build/CodeHighlighter/CodeHighlighter.js

@@ -0,0 +1,329 @@
+"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.CodeHighlighter = CodeHighlighter;
+var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
+var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+var React = _interopRequireWildcard(require("react"));
+var _loadVariant = require("./loadVariant");
+var _loadFallbackCode = require("./loadFallbackCode");
+var _hast = require("../hast");
+var _CodeHighlighterClient = require("./CodeHighlighterClient");
+var _maybeInitialData2 = require("./maybeInitialData");
+var _hasAllVariants = require("./hasAllVariants");
+var _jsxRuntime = require("react/jsx-runtime");
+// Common props shared across helper functions
+
+var DEFAULT_HIGHLIGHT_AT = 'stream';
+var DEBUG = false; // Set to true for debugging purposes
+
+function HighlightErrorHandler(_ref) {
+  var error = _ref.error;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    children: ["Error: ", error.message]
+  });
+}
+function createClientProps(props) {
+  var highlightAt = props.highlightAt === 'stream' ? 'init' : props.highlightAt;
+  return {
+    url: props.url,
+    code: props.code,
+    precompute: props.precompute,
+    components: props.components,
+    variants: props.variants,
+    variant: props.variant,
+    fileName: props.fileName,
+    initialVariant: props.initialVariant,
+    defaultVariant: props.defaultVariant,
+    highlightAt: highlightAt || 'init',
+    fallback: props.fallback,
+    skipFallback: props.skipFallback,
+    controlled: props.controlled,
+    name: props.name,
+    slug: props.slug,
+    description: props.description,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(props.Content, {
+      code: (0, _typeof2["default"])(props.precompute) === 'object' ? props.code || props.precompute : props.code,
+      components: props.components,
+      name: props.name,
+      slug: props.slug,
+      description: props.description
+    })
+  };
+}
+function CodeSourceLoader(_x) {
+  return _CodeSourceLoader.apply(this, arguments);
+}
+function _CodeSourceLoader() {
+  _CodeSourceLoader = (0, _asyncToGenerator2["default"])(/*#__PURE__*/(0, _regeneratorRuntime2["default"])().mark(function _callee(props) {
+    var ErrorHandler, loadedCode, variantNames, variantCodes, processedCode, errors, _iterator, _step, item, clientProps;
+    return (0, _regeneratorRuntime2["default"])().wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          ErrorHandler = props.ErrorHandler || HighlightErrorHandler; // Start with the loaded code from precompute, or load it if needed
+          loadedCode = props.code;
+          if (loadedCode) {
+            _context.next = 14;
+            break;
+          }
+          if (props.loadCodeMeta) {
+            _context.next = 5;
+            break;
+          }
+          return _context.abrupt("return", /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorHandler, {
+            error: new Error('No code provided and "loadCodeMeta" function is not defined')
+          }));
+        case 5:
+          _context.prev = 5;
+          _context.next = 8;
+          return props.loadCodeMeta(props.url);
+        case 8:
+          loadedCode = _context.sent;
+          _context.next = 14;
+          break;
+        case 11:
+          _context.prev = 11;
+          _context.t0 = _context["catch"](5);
+          return _context.abrupt("return", /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorHandler, {
+            error: new Error("Failed to load code from URL: ".concat(props.url, ". Error: ").concat(JSON.stringify(_context.t0)))
+          }));
+        case 14:
+          // TODO: if props.variant is provided, we should only load that variant
+          variantNames = Object.keys(props.components || loadedCode || {});
+          _context.next = 17;
+          return Promise.all(variantNames.map(function (variantName) {
+            return (0, _loadVariant.loadVariant)(props.url, variantName, loadedCode[variantName], props.sourceParser, props.loadSource, props.loadVariantMeta, props.sourceTransformers).then(function (variant) {
+              return {
+                name: variantName,
+                variant: variant
+              };
+            })["catch"](function (error) {
+              return {
+                error: error
+              };
+            });
+          }));
+        case 17:
+          variantCodes = _context.sent;
+          processedCode = {};
+          errors = [];
+          _iterator = (0, _createForOfIteratorHelper2["default"])(variantCodes);
+          try {
+            for (_iterator.s(); !(_step = _iterator.n()).done;) {
+              item = _step.value;
+              if ('error' in item) {
+                errors.push(item.error);
+              } else {
+                processedCode[item.name] = item.variant.code;
+              }
+            }
+          } catch (err) {
+            _iterator.e(err);
+          } finally {
+            _iterator.f();
+          }
+          if (!(errors.length > 0)) {
+            _context.next = 24;
+            break;
+          }
+          return _context.abrupt("return", /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorHandler, {
+            error: new Error("Failed loading code: ".concat(errors.map(function (err) {
+              return err.message;
+            }).join('\n ')))
+          }));
+        case 24:
+          clientProps = createClientProps((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), {}, {
+            code: processedCode
+          }));
+          return _context.abrupt("return", /*#__PURE__*/(0, _jsxRuntime.jsx)(_CodeHighlighterClient.CodeHighlighterClient, (0, _objectSpread2["default"])({}, clientProps)));
+        case 26:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee, null, [[5, 11]]);
+  }));
+  return _CodeSourceLoader.apply(this, arguments);
+}
+function renderCodeHighlighter(props) {
+  var ErrorHandler = props.ErrorHandler || HighlightErrorHandler;
+  var code = props.precompute !== true ? props.code || props.precompute : props.code;
+  var variants = props.variants || Object.keys(props.components || code || {});
+  var allCodeVariantsLoaded = code && (0, _hasAllVariants.hasAllVariants)(variants, code, true);
+  if (!allCodeVariantsLoaded) {
+    if (props.forceClient) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorHandler, {
+        error: new Error('Client only mode requires precomputed source code')
+      });
+    }
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(CodeSourceLoader, (0, _objectSpread2["default"])({}, props));
+  }
+  var clientProps = createClientProps((0, _objectSpread2["default"])({}, props));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CodeHighlighterClient.CodeHighlighterClient, (0, _objectSpread2["default"])({}, clientProps));
+
+  // TODO: we might not need the client if hydrateAt is 'init' or 'stream' and there is no props.controlled
+}
+
+/**
+ * Ensures that the suspense boundary is always rendered, even if none of the children have async operations.
+ */
+function CodeHighlighterSuspense(_x2) {
+  return _CodeHighlighterSuspense.apply(this, arguments);
+}
+function _CodeHighlighterSuspense() {
+  _CodeHighlighterSuspense = (0, _asyncToGenerator2["default"])(/*#__PURE__*/(0, _regeneratorRuntime2["default"])().mark(function _callee2(props) {
+    return (0, _regeneratorRuntime2["default"])().wrap(function _callee2$(_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          return _context2.abrupt("return", props.children);
+        case 1:
+        case "end":
+          return _context2.stop();
+      }
+    }, _callee2);
+  }));
+  return _CodeHighlighterSuspense.apply(this, arguments);
+}
+function renderWithInitialSource(props) {
+  var fileNames = [props.initialFilename].concat((0, _toConsumableArray2["default"])(Object.keys(props.initialExtraFiles || {})));
+  var source = (0, _hast.stringOrHastToJsx)(props.initialSource, props.highlightAt === 'init');
+  var ContentLoading = props.ContentLoading;
+  var fallback = /*#__PURE__*/(0, _jsxRuntime.jsx)(ContentLoading, {
+    fileNames: fileNames,
+    source: source
+  });
+  if (props.forceClient) {
+    return renderCodeHighlighter((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), {}, {
+      fallback: fallback
+    }));
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Suspense, {
+    fallback: fallback,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(CodeHighlighterSuspense, {
+      children: renderCodeHighlighter((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), {}, {
+        fallback: fallback,
+        skipFallback: true
+      }))
+    })
+  });
+}
+function CodeInitialSourceLoader(_x3) {
+  return _CodeInitialSourceLoader.apply(this, arguments);
+}
+function _CodeInitialSourceLoader() {
+  _CodeInitialSourceLoader = (0, _asyncToGenerator2["default"])(/*#__PURE__*/(0, _regeneratorRuntime2["default"])().mark(function _callee3(props) {
+    var ErrorHandler, loaded, code, initialFilename, initialSource, initialExtraFiles;
+    return (0, _regeneratorRuntime2["default"])().wrap(function _callee3$(_context3) {
+      while (1) switch (_context3.prev = _context3.next) {
+        case 0:
+          ErrorHandler = props.ErrorHandler || HighlightErrorHandler;
+          _context3.next = 3;
+          return (0, _loadFallbackCode.loadFallbackCode)(props.url, props.initialVariant, props.code, props.highlightAt === 'init', props.fallbackUsesExtraFiles, props.fallbackUsesAllVariants, props.sourceParser, props.loadSource, props.loadVariantMeta, props.loadCodeMeta, props.fileName, props.variants)["catch"](function (error) {
+            return {
+              error: error
+            };
+          });
+        case 3:
+          loaded = _context3.sent;
+          if (!('error' in loaded)) {
+            _context3.next = 6;
+            break;
+          }
+          return _context3.abrupt("return", /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorHandler, {
+            error: loaded.error
+          }));
+        case 6:
+          code = loaded.code, initialFilename = loaded.initialFilename, initialSource = loaded.initialSource, initialExtraFiles = loaded.initialExtraFiles;
+          return _context3.abrupt("return", renderWithInitialSource((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), {}, {
+            code: code,
+            initialFilename: initialFilename,
+            initialSource: initialSource,
+            initialExtraFiles: initialExtraFiles,
+            ContentLoading: props.ContentLoading
+          })));
+        case 8:
+        case "end":
+          return _context3.stop();
+      }
+    }, _callee3);
+  }));
+  return _CodeInitialSourceLoader.apply(this, arguments);
+}
+function CodeHighlighter(props) {
+  var _props$components;
+  var ErrorHandler = props.ErrorHandler || HighlightErrorHandler;
+  if (props.precompute === true) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorHandler, {
+      error: new Error('Precompute enabled, but not provided')
+    });
+  }
+  var code = props.precompute || props.code;
+  var variants = props.variants || Object.keys(props.components || props.precompute || props.code || {});
+  if (variants.length === 0) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorHandler, {
+      error: new Error('No code or components provided')
+    });
+  }
+  var ContentLoading = props.ContentLoading;
+  if (!ContentLoading) {
+    if (props.highlightAt === 'stream') {
+      // if the user explicitly sets highlightAt to 'stream', we need a ContentLoading component
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorHandler, {
+        error: new Error('ContentLoading component is required for stream highlighting')
+      });
+    }
+    return renderCodeHighlighter((0, _objectSpread2["default"])({}, props));
+  }
+  var initialKey = props.initialVariant || props.variant || props.defaultVariant || 'Default';
+  var initial = code == null ? void 0 : code[initialKey];
+  if (!initial && !((_props$components = props.components) != null && _props$components[initialKey])) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorHandler, {
+      error: new Error("No code or component for variant \"".concat(initialKey, "\""))
+    });
+  }
+
+  // TODO: use initial.filesOrder to determing which source to use
+  var highlightAt = props.highlightAt || DEFAULT_HIGHLIGHT_AT;
+  var _maybeInitialData = (0, _maybeInitialData2.maybeInitialData)(variants, initialKey, code, undefined,
+    // TODO: use initial.filesOrder if provided?
+    highlightAt === 'init', props.fallbackUsesExtraFiles, props.fallbackUsesAllVariants),
+    initialData = _maybeInitialData.initialData,
+    reason = _maybeInitialData.reason;
+  if (!initialData) {
+    if (DEBUG) {
+      // eslint-disable-next-line no-console
+      console.log('Initial data not found:', reason);
+    }
+    if (props.forceClient) {
+      if (highlightAt === 'init') {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorHandler, {
+          error: new Error('Client only mode with highlightAt: init requires precomputed and parsed source code')
+        });
+      }
+
+      // TODO: send directly to client component?
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(ErrorHandler, {
+        error: new Error('Client only mode requires precomputed source code')
+      });
+    }
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(CodeInitialSourceLoader, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), {}, {
+      ContentLoading: ContentLoading,
+      initialVariant: initialKey
+    }));
+  }
+  return renderWithInitialSource((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), {}, {
+    code: initialData.code,
+    ContentLoading: ContentLoading,
+    initialVariant: initialKey,
+    initialFilename: initialData.initialFilename,
+    initialSource: initialData.initialSource,
+    initialExtraFiles: initialData.initialExtraFiles
+  }));
+}

package/build/CodeHighlighter/CodeHighlighterClient.d.ts

@@ -0,0 +1,2 @@
+import { CodeHighlighterClientProps } from "./types.js";
+export declare function CodeHighlighterClient(props: CodeHighlighterClientProps): import("react/jsx-runtime").JSX.Element;