@mui/internal-docs-infra/CodeProvider/CodeProvider.mjs

MUI Infra - internal documentation creation tools.

'use client';

import * as React from 'react';
import { CodeContext } from "./CodeContext.mjs";
import { useCodeProviderValue } from "./useCodeProviderValue.mjs";
// Heavy functions: statically imported (eager). They ship in this provider's
// chunk so its accessors resolve instantly with no fetch. Use `CodeProviderLazy`
// to keep them out of the initial bundle instead. (The default emphasis enhancer
// is eager in both providers - see useCodeProviderValue.)
import { createParseSource } from "../pipeline/parseSource/parseSource.mjs";
import { loadCodeFallback } from "../pipeline/loadIsomorphicCodeVariant/loadCodeFallback.mjs";
import { loadIsomorphicCodeVariant } from "../pipeline/loadIsomorphicCodeVariant/loadIsomorphicCodeVariant.mjs";
import { computeHastDeltas } from "../pipeline/loadIsomorphicCodeVariant/computeHastDeltas.mjs";
import * as EditingEngine from "../useCode/EditingEngine.mjs";
import { createTransformedFiles } from "../useCode/TransformEngine.mjs";
// Eager: the emphasis enhancer is bundled so the synchronous editing
// re-enhancement path has it with no fetch (zero-latency invariant).
import { enhanceCodeEmphasis } from "../pipeline/enhanceCodeEmphasis/index.mjs";

// Eager: the Starry Night engine is bundled, so the parser is created synchronously.
import { jsx as _jsx } from "react/jsx-runtime";
const createSourceParserEager = () => createParseSource();

// Eager accessors: the function is already bundled, so the accessor resolves
// instantly. Module-level so the references are stable across renders.
const loadCodeFallbackLoaderEager = () => Promise.resolve(loadCodeFallback);
const loadVariantLoaderEager = () => Promise.resolve(loadIsomorphicCodeVariant);
const computeHastDeltasLoaderEager = () => Promise.resolve(computeHastDeltas);
const editingEngineLoaderEager = () => Promise.resolve(EditingEngine);
const transformEngineLoaderEager = () => Promise.resolve(createTransformedFiles);

/**
 * Provides client-side functions for fetching source code and highlighting it.
 * Designed for cases where you need to render code blocks or demos based on
 * client-side state or dynamic content loading.
 *
 * The heavy functions are bundled eagerly here, so they resolve instantly with
 * no fetch - best when a layout will definitely render code. To keep them out of
 * the initial bundle (loaded on demand, deduped across the page), use
 * `CodeProviderLazy` instead.
 */
export function CodeProvider({
  children,
  loadCodeMeta,
  loadVariantMeta,
  loadSource,
  sourceEnhancers
}) {
  const heavy = React.useMemo(() => ({
    loadCodeFallbackLoader: loadCodeFallbackLoaderEager,
    loadIsomorphicCodeVariantLoader: loadVariantLoaderEager,
    computeHastDeltasLoader: computeHastDeltasLoaderEager,
    editingEngineLoader: editingEngineLoaderEager,
    transformEngineLoader: transformEngineLoaderEager,
    defaultSourceEnhancers: [enhanceCodeEmphasis]
  }), []);
  const context = useCodeProviderValue({
    loadCodeMeta,
    loadVariantMeta,
    loadSource,
    sourceEnhancers
  }, heavy, createSourceParserEager);
  return /*#__PURE__*/_jsx(CodeContext.Provider, {
    value: context,
    children: children
  });
}