@mui/internal-docs-infra 0.1.1-canary.9 → 0.2.0-alpha.1

package/CHANGELOG.md

@@ -0,0 +1,9 @@
+# Versions
+
+## 2.0.7
+
+Test release
+
+## 2.0.6
+
+Changelog start

package/README.md

@@ -2,16 +2,8 @@
 
 This package hosts the tools that help create the documentation.
 
-## Installation
-
-Install the package in your project directory with:
-
-<!-- #npm-tag-reference -->
-
-```bash
-npm install @mui/internal-docs-infra
-```
-
 ## Documentation
 
-We have no documentation for these components.
+This is stored in the `docs` directory.
+
+[Read More](../../docs/app/docs-infra/page.mdx)

package/esm/CodeControllerContext/CodeControllerContext.d.ts

@@ -0,0 +1,62 @@
+import * as React from 'react';
+import type { ControlledCode } from "../CodeHighlighter/types.js";
+export type Selection = {
+  variant: string;
+  fileName?: string;
+  transformKey?: string;
+};
+/**
+ * Context for controlling the code shown within the CodeHighlighter component.
+ *
+ * To benefit from server or build-time rendering, the initial code should not be provided
+ * to the controller context. It's recommended to only set `code` after the first `setCode`
+ * event fires.
+ */
+export interface CodeControllerContext {
+  /**
+   * Controls the code shown within the code highlighter. Unlike the CodeHighlighter component,
+   * code is always a string to simplify use. It will be highlighted when it is passed as `code`.
+   * This behavior depends on client-side highlighting and the CodeProvider component.
+   */
+  code?: ControlledCode;
+  /**
+   * Controls the state for displaying the given code. This works with build-time and client-side
+   * loading. If using server loading, the selection won't work for fallback loading and would
+   * have to be passed directly into the CodeHighlighter component within a server component.
+   */
+  selection?: Selection;
+  /**
+   * Setter function for updating the code. When provided in the context, this function will be
+   * called when the user interacts with the code highlighting. It's recommended to only set `code`
+   * after the first `setCode` event fires to benefit from server or build-time rendering.
+   */
+  setCode?: React.Dispatch<React.SetStateAction<ControlledCode | undefined>>;
+  /**
+   * Setter function for updating the selection state. When provided in the context, this function
+   * will be called when the user interacts with the code highlighting interface.
+   */
+  setSelection?: React.Dispatch<React.SetStateAction<Selection>>;
+  /**
+   * Allows overriding the preview components shown within the CodeHighlighter.
+   * It's recommended to keep this value undefined until there are any changes made to a
+   * component's code and passed as `code`. Each variant has a given component,
+   * e.g. `{ variantA: {}, variantB: {} }`.
+   */
+  components?: Record<string, React.ReactNode> | undefined;
+}
+export declare const CodeControllerContext: React.Context<CodeControllerContext | undefined>;
+/**
+ * Hook for accessing the controlled code context.
+ *
+ * This hook provides access to the controlled code, selection state, and setter functions
+ * from the CodeControllerContext. It's worth noting that useCode and useDemo handle
+ * controlling selection in typical cases.
+ *
+ * @returns An object containing:
+ *   - code: The current code being controlled
+ *   - selection: The current selection state
+ *   - setCode: Function to update the controlled code
+ *   - setSelection: Function to update the selection
+ *   - components: Override components for the preview
+ */
+export declare function useControlledCode(): CodeControllerContext | undefined;

package/esm/CodeControllerContext/CodeControllerContext.js

@@ -0,0 +1,33 @@
+'use client';
+
+import * as React from 'react';
+
+/**
+ * Context for controlling the code shown within the CodeHighlighter component.
+ *
+ * To benefit from server or build-time rendering, the initial code should not be provided
+ * to the controller context. It's recommended to only set `code` after the first `setCode`
+ * event fires.
+ */
+
+export var CodeControllerContext = /*#__PURE__*/React.createContext(undefined);
+
+/**
+ * Hook for accessing the controlled code context.
+ *
+ * This hook provides access to the controlled code, selection state, and setter functions
+ * from the CodeControllerContext. It's worth noting that useCode and useDemo handle
+ * controlling selection in typical cases.
+ *
+ * @returns An object containing:
+ *   - code: The current code being controlled
+ *   - selection: The current selection state
+ *   - setCode: Function to update the controlled code
+ *   - setSelection: Function to update the selection
+ *   - components: Override components for the preview
+ */
+if (process.env.NODE_ENV !== "production") CodeControllerContext.displayName = "CodeControllerContext";
+export function useControlledCode() {
+  var context = React.useContext(CodeControllerContext);
+  return context;
+}

package/esm/CodeControllerContext/index.d.ts

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

package/esm/CodeControllerContext/index.js

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

package/esm/CodeExternalsContext/CodeExternalsContext.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+type Module = NonNullable<unknown>;
+export interface CodeExternalsContext {
+  externals?: Record<string, Module>;
+}
+export declare const CodeExternalsContext: React.Context<CodeExternalsContext | undefined>;
+export declare function useCodeExternals(): CodeExternalsContext | undefined;
+export {};

package/esm/CodeExternalsContext/CodeExternalsContext.js

@@ -0,0 +1,8 @@
+'use client';
+
+import * as React from 'react';
+export var CodeExternalsContext = /*#__PURE__*/React.createContext(undefined);
+if (process.env.NODE_ENV !== "production") CodeExternalsContext.displayName = "CodeExternalsContext";
+export function useCodeExternals() {
+  return React.useContext(CodeExternalsContext);
+}

package/esm/CodeExternalsContext/index.d.ts

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

package/esm/CodeExternalsContext/index.js

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

package/esm/CodeHighlighter/CodeHighlighter.d.ts

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

package/esm/CodeHighlighter/CodeHighlighter.js

@@ -0,0 +1,441 @@
+import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
+import _regenerator from "@babel/runtime/helpers/esm/regenerator";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { loadVariant } from "./loadVariant.js";
+import { loadFallbackCode } from "./loadFallbackCode.js";
+import { CodeHighlighterClient } from "./CodeHighlighterClient.js";
+import { maybeInitialData } from "./maybeInitialData.js";
+import { hasAllVariants } from "./hasAllVariants.js";
+import { getFileNameFromUrl } from "../pipeline/loaderUtils/getFileNameFromUrl.js";
+import { codeToFallbackProps } from "./codeToFallbackProps.js";
+import * as Errors from "./errors.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+var DEFAULT_HIGHLIGHT_AT = 'stream';
+var DEBUG = false; // Set to true for debugging purposes
+
+function createClientProps(props) {
+  var highlightAt = props.highlightAt === 'stream' ? 'init' : props.highlightAt;
+  var contentProps = _extends({
+    code: props.code || props.precompute,
+    components: props.components,
+    name: props.name,
+    slug: props.slug,
+    url: props.url,
+    variantType: props.variantType
+  }, props.contentProps);
+  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',
+    skipFallback: props.skipFallback,
+    controlled: props.controlled,
+    name: props.name,
+    slug: props.slug,
+    // Use processedGlobalsCode if available, otherwise fall back to raw globalsCode
+    globalsCode: props.processedGlobalsCode || props.globalsCode,
+    // Note: it is important that we render components before passing them to the client
+    // otherwise we will get an error because functions can't be serialized
+    // On the client, in order to send data to these components, we have to set context
+    fallback: props.fallback,
+    children: /*#__PURE__*/_jsx(props.Content, _extends({}, contentProps))
+  };
+}
+function CodeSourceLoader(_x) {
+  return _CodeSourceLoader.apply(this, arguments);
+}
+function _CodeSourceLoader() {
+  _CodeSourceLoader = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2(props) {
+    var loadedCode, processedGlobalsCode, hasStringUrls, globalsPromises, variantNames, variantCodes, processedCode, errors, _iterator2, _step2, item, clientProps, _t2;
+    return _regenerator().w(function (_context2) {
+      while (1) switch (_context2.p = _context2.n) {
+        case 0:
+          // Start with the loaded code from precompute, or load it if needed
+          loadedCode = props.code || props.precompute;
+          if (loadedCode) {
+            _context2.n = 5;
+            break;
+          }
+          if (props.loadCodeMeta) {
+            _context2.n = 1;
+            break;
+          }
+          throw new Errors.ErrorCodeHighlighterServerMissingLoadCodeMeta();
+        case 1:
+          if (props.url) {
+            _context2.n = 2;
+            break;
+          }
+          throw new Errors.ErrorCodeHighlighterServerMissingUrlForLoadCodeMeta();
+        case 2:
+          _context2.p = 2;
+          _context2.n = 3;
+          return props.loadCodeMeta(props.url);
+        case 3:
+          loadedCode = _context2.v;
+          _context2.n = 5;
+          break;
+        case 4:
+          _context2.p = 4;
+          _t2 = _context2.v;
+          throw new Errors.ErrorCodeHighlighterServerLoadCodeFailure(props.url, _t2);
+        case 5:
+          // TODO: if props.variant is provided, we should only load that variant
+          // Process globalsCode: use already processed version if available, otherwise convert string URLs to Code objects
+          processedGlobalsCode = props.processedGlobalsCode;
+          if (!(!processedGlobalsCode && props.globalsCode && props.globalsCode.length > 0)) {
+            _context2.n = 8;
+            break;
+          }
+          hasStringUrls = props.globalsCode.some(function (item) {
+            return typeof item === 'string';
+          });
+          if (!(hasStringUrls && !props.loadCodeMeta)) {
+            _context2.n = 6;
+            break;
+          }
+          throw new Errors.ErrorCodeHighlighterServerMissingLoadCodeMetaForGlobals();
+        case 6:
+          // Load all string URLs in parallel, keep Code objects as-is
+          globalsPromises = props.globalsCode.map(/*#__PURE__*/function () {
+            var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(globalItem) {
+              var _t;
+              return _regenerator().w(function (_context) {
+                while (1) switch (_context.p = _context.n) {
+                  case 0:
+                    if (!(typeof globalItem === 'string')) {
+                      _context.n = 4;
+                      break;
+                    }
+                    _context.p = 1;
+                    _context.n = 2;
+                    return props.loadCodeMeta(globalItem);
+                  case 2:
+                    return _context.a(2, _context.v);
+                  case 3:
+                    _context.p = 3;
+                    _t = _context.v;
+                    throw new Errors.ErrorCodeHighlighterServerLoadGlobalsFailure(globalItem, _t);
+                  case 4:
+                    return _context.a(2, globalItem);
+                  case 5:
+                    return _context.a(2);
+                }
+              }, _callee, null, [[1, 3]]);
+            }));
+            return function (_x4) {
+              return _ref.apply(this, arguments);
+            };
+          }());
+          _context2.n = 7;
+          return Promise.all(globalsPromises);
+        case 7:
+          processedGlobalsCode = _context2.v;
+        case 8:
+          variantNames = Object.keys(props.components || loadedCode || {});
+          _context2.n = 9;
+          return Promise.all(variantNames.map(function (variantName) {
+            var variantCode = loadedCode[variantName];
+            var variantUrl = _typeof(variantCode) === 'object' && variantCode != null && variantCode.url ? variantCode.url : props.url;
+
+            // Convert processedGlobalsCode to VariantCode | string for this specific variant
+            var resolvedGlobalsCode;
+            if (processedGlobalsCode && processedGlobalsCode.length > 0) {
+              resolvedGlobalsCode = [];
+              var _iterator = _createForOfIteratorHelper(processedGlobalsCode),
+                _step;
+              try {
+                for (_iterator.s(); !(_step = _iterator.n()).done;) {
+                  var codeObj = _step.value;
+                  // Only include if this variant exists in the globalsCode
+                  var targetVariant = codeObj[variantName];
+                  if (targetVariant) {
+                    resolvedGlobalsCode.push(targetVariant);
+                  }
+                }
+              } catch (err) {
+                _iterator.e(err);
+              } finally {
+                _iterator.f();
+              }
+            }
+            return loadVariant(variantUrl, variantName, variantCode, {
+              sourceParser: props.sourceParser,
+              loadSource: props.loadSource,
+              loadVariantMeta: props.loadVariantMeta,
+              sourceTransformers: props.sourceTransformers,
+              globalsCode: resolvedGlobalsCode
+            }).then(function (variant) {
+              return {
+                name: variantName,
+                variant: variant
+              };
+            })["catch"](function (error) {
+              return {
+                error: error
+              };
+            });
+          }));
+        case 9:
+          variantCodes = _context2.v;
+          processedCode = {};
+          errors = [];
+          _iterator2 = _createForOfIteratorHelper(variantCodes);
+          try {
+            for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+              item = _step2.value;
+              if ('error' in item) {
+                console.error(new Errors.ErrorCodeHighlighterServerLoadVariantFailure(props.url, item.error));
+                errors.push(item.error);
+              } else {
+                processedCode[item.name] = item.variant.code;
+              }
+            }
+          } catch (err) {
+            _iterator2.e(err);
+          } finally {
+            _iterator2.f();
+          }
+          if (!(errors.length > 0)) {
+            _context2.n = 10;
+            break;
+          }
+          throw new Errors.ErrorCodeHighlighterServerLoadVariantsFailure(props.url, errors);
+        case 10:
+          clientProps = createClientProps(_extends(_extends({}, props), {}, {
+            code: processedCode,
+            processedGlobalsCode: processedGlobalsCode
+          }));
+          return _context2.a(2, /*#__PURE__*/_jsx(CodeHighlighterClient, _extends({}, clientProps)));
+      }
+    }, _callee2, null, [[2, 4]]);
+  }));
+  return _CodeSourceLoader.apply(this, arguments);
+}
+function renderCodeHighlighter(props) {
+  var code = props.code || props.precompute;
+  var variants = props.variants || Object.keys(props.components || code || {});
+  var allCodeVariantsLoaded = code && hasAllVariants(variants, code, true);
+
+  // Check if any loader functions are available before trying async loading
+  var hasAnyLoaderFunction = !!(props.loadCodeMeta || props.loadVariantMeta || props.loadSource || props.sourceParser || props.sourceTransformers);
+  if (!allCodeVariantsLoaded && hasAnyLoaderFunction && !props.forceClient) {
+    return /*#__PURE__*/_jsx(CodeSourceLoader, _extends({}, props));
+  }
+  var clientProps = createClientProps(props);
+  return /*#__PURE__*/_jsx(CodeHighlighterClient, _extends({}, clientProps));
+}
+
+/**
+ * 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 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3(props) {
+    return _regenerator().w(function (_context3) {
+      while (1) switch (_context3.n) {
+        case 0:
+          return _context3.a(2, props.children);
+      }
+    }, _callee3);
+  }));
+  return _CodeHighlighterSuspense.apply(this, arguments);
+}
+function renderWithInitialSource(props) {
+  var _props$components;
+  var ContentLoading = props.ContentLoading;
+  var url = props.url,
+    slug = props.slug,
+    name = props.name,
+    initialVariant = props.initialVariant,
+    code = props.code,
+    initialFilename = props.initialFilename,
+    fallbackUsesExtraFiles = props.fallbackUsesExtraFiles,
+    fallbackUsesAllVariants = props.fallbackUsesAllVariants;
+  var fallbackProps = codeToFallbackProps(initialVariant, code, initialFilename, fallbackUsesExtraFiles, fallbackUsesAllVariants);
+
+  // Get the component for the selected variant
+  var component = (_props$components = props.components) == null ? void 0 : _props$components[initialVariant];
+
+  // Only include components (plural) if we're also including extraVariants
+  var components = fallbackProps.extraVariants ? props.components : undefined;
+  var contentProps = _extends(_extends({
+    name: name,
+    slug: slug,
+    url: url,
+    initialFilename: initialFilename,
+    component: component,
+    components: components
+  }, fallbackProps), props.contentProps);
+  var fallback = /*#__PURE__*/_jsx(ContentLoading, _extends({}, contentProps));
+  if (props.forceClient) {
+    return renderCodeHighlighter(_extends(_extends({}, props), {}, {
+      fallback: fallback
+    }));
+  }
+  return /*#__PURE__*/_jsx(React.Suspense, {
+    fallback: fallback,
+    children: /*#__PURE__*/_jsx(CodeHighlighterSuspense, {
+      children: renderCodeHighlighter(_extends(_extends({}, props), {}, {
+        fallback: fallback,
+        skipFallback: true
+      }))
+    })
+  });
+}
+function CodeInitialSourceLoader(_x3) {
+  return _CodeInitialSourceLoader.apply(this, arguments);
+}
+function _CodeInitialSourceLoader() {
+  _CodeInitialSourceLoader = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee4(props) {
+    var url, initialVariant, highlightAt, fallbackUsesExtraFiles, fallbackUsesAllVariants, sourceParser, loadSource, loadVariantMeta, loadCodeMeta, fileName, variants, globalsCode, ContentLoading, _yield$loadFallbackCo, code, initialFilename, initialSource, initialExtraFiles, processedGlobalsCode;
+    return _regenerator().w(function (_context4) {
+      while (1) switch (_context4.n) {
+        case 0:
+          url = props.url, initialVariant = props.initialVariant, highlightAt = props.highlightAt, fallbackUsesExtraFiles = props.fallbackUsesExtraFiles, fallbackUsesAllVariants = props.fallbackUsesAllVariants, sourceParser = props.sourceParser, loadSource = props.loadSource, loadVariantMeta = props.loadVariantMeta, loadCodeMeta = props.loadCodeMeta, fileName = props.fileName, variants = props.variants, globalsCode = props.globalsCode, ContentLoading = props.ContentLoading;
+          if (url) {
+            _context4.n = 1;
+            break;
+          }
+          throw new Errors.ErrorCodeHighlighterServerMissingUrl();
+        case 1:
+          _context4.n = 2;
+          return loadFallbackCode(url, initialVariant, props.code, {
+            shouldHighlight: highlightAt === 'init',
+            fallbackUsesExtraFiles: fallbackUsesExtraFiles,
+            fallbackUsesAllVariants: fallbackUsesAllVariants,
+            sourceParser: sourceParser,
+            loadSource: loadSource,
+            loadVariantMeta: loadVariantMeta,
+            loadCodeMeta: loadCodeMeta,
+            initialFilename: fileName,
+            variants: variants,
+            globalsCode: globalsCode
+          });
+        case 2:
+          _yield$loadFallbackCo = _context4.v;
+          code = _yield$loadFallbackCo.code;
+          initialFilename = _yield$loadFallbackCo.initialFilename;
+          initialSource = _yield$loadFallbackCo.initialSource;
+          initialExtraFiles = _yield$loadFallbackCo.initialExtraFiles;
+          processedGlobalsCode = _yield$loadFallbackCo.processedGlobalsCode;
+          return _context4.a(2, renderWithInitialSource(_extends(_extends({}, props), {}, {
+            ContentLoading: ContentLoading,
+            code: code,
+            initialFilename: initialFilename,
+            initialSource: initialSource,
+            initialExtraFiles: initialExtraFiles,
+            processedGlobalsCode: processedGlobalsCode
+          })));
+      }
+    }, _callee4);
+  }));
+  return _CodeInitialSourceLoader.apply(this, arguments);
+}
+export function CodeHighlighter(props) {
+  var _code, _props$components2;
+  // Validate mutually exclusive props
+  if (props.children && (props.code || props.precompute)) {
+    throw new Errors.ErrorCodeHighlighterServerInvalidProps();
+  }
+
+  // Handle children as string -> Default variant
+  var code = props.code;
+  if (props.children && typeof props.children === 'string') {
+    var fileName = props.fileName || (props.url ? getFileNameFromUrl(props.url).fileName : undefined);
+    code = {
+      Default: {
+        fileName: fileName,
+        source: props.children,
+        url: props.url
+      }
+    };
+  }
+  var variants = props.variants || Object.keys(props.components || code || props.precompute || {});
+  if (variants.length === 0) {
+    throw new Errors.ErrorCodeHighlighterServerMissingData();
+  }
+
+  // Validate fileName is provided when extraFiles are present
+  if (code) {
+    for (var _i = 0, _Object$entries = Object.entries(code); _i < _Object$entries.length; _i++) {
+      var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2),
+        variantName = _Object$entries$_i[0],
+        variantCode = _Object$entries$_i[1];
+      if (_typeof(variantCode) === 'object' && variantCode != null && variantCode.extraFiles && Object.keys(variantCode.extraFiles).length > 0 && !variantCode.fileName && !variantCode.url) {
+        throw new Errors.ErrorCodeHighlighterServerMissingFileName(variantName);
+      }
+    }
+  }
+  var ContentLoading = props.ContentLoading;
+  if (!ContentLoading) {
+    if (props.highlightAt === 'stream') {
+      // if the user explicitly sets highlightAt to 'stream', we need a ContentLoading component
+      throw new Errors.ErrorCodeHighlighterServerMissingContentLoading();
+    }
+    return renderCodeHighlighter(_extends(_extends({}, props), {}, {
+      code: code
+    }));
+  }
+
+  // Check if any loader functions are available
+  var hasAnyLoaderFunction = !!(props.loadCodeMeta || props.loadVariantMeta || props.loadSource || props.sourceParser || props.sourceTransformers);
+
+  // If no loader functions are available, skip async loading and go directly to client
+  if (!hasAnyLoaderFunction) {
+    return renderCodeHighlighter(_extends(_extends({}, props), {}, {
+      code: code
+    }));
+  }
+  var initialKey = props.initialVariant || props.variant || props.defaultVariant || variants[0];
+  var initial = (_code = code) == null ? void 0 : _code[initialKey];
+  if (!initial && !((_props$components2 = props.components) != null && _props$components2[initialKey])) {
+    throw new Errors.ErrorCodeHighlighterServerMissingVariant(initialKey);
+  }
+
+  // TODO: use initial.filesOrder to determing which source to use
+  var highlightAt = props.highlightAt || DEFAULT_HIGHLIGHT_AT;
+  var _maybeInitialData = maybeInitialData(variants, initialKey, code || props.precompute, 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') {
+        throw new Errors.ErrorCodeHighlighterServerInvalidClientMode();
+      }
+      return renderCodeHighlighter(_extends(_extends({}, props), {}, {
+        code: code
+      }));
+    }
+    return /*#__PURE__*/_jsx(CodeInitialSourceLoader, _extends(_extends({}, props), {}, {
+      ContentLoading: ContentLoading,
+      initialVariant: initialKey
+    }));
+  }
+  return renderWithInitialSource(_extends(_extends({}, props), {}, {
+    code: initialData.code,
+    ContentLoading: ContentLoading,
+    initialVariant: initialKey,
+    initialFilename: initialData.initialFilename,
+    initialSource: initialData.initialSource,
+    initialExtraFiles: initialData.initialExtraFiles
+  }));
+}

package/esm/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;