react-shiki 0.9.0 → 0.9.2

package/README.md

@@ -24,7 +24,7 @@ A performant client-side syntax highlighting component and hook for React, built
         - [Option 2: CSS Theme Switching](#option-2-css-theme-switching)
     - [Custom Themes](#custom-themes)
     - [Custom Languages](#custom-languages)
-      - [Preloading Custom Languages](#preloading-custom-languages)
+      - [Preloading Languages](#preloading-languages)
     - [Language Aliases](#language-aliases)
     - [Custom Transformers](#custom-transformers)
     - [Line Numbers](#line-numbers)
@@ -211,7 +211,8 @@ See [Shiki - RegExp Engines](https://shiki.style/guide/regex-engines) for more i
 | `language`          | `string \| object` | -               | Language to highlight, built-in or custom textmate grammer object             |
 | `theme`             | `string \| object` | `'github-dark'` | Single or multi-theme configuration, built-in or custom textmate theme object |
 | `delay`             | `number`           | `0`             | Delay between highlights (in milliseconds)                                    |
-| `customLanguages`   | `array`            | `[]`            | Array of custom languages to preload                                          |
+| `customLanguages`   | `array`            | `[]`            | **Deprecated**: use `preloadLanguages` instead. |
+| `preloadLanguages`  | `array`            | `[]`            | Preload bundled language IDs and custom language grammars |
 | `langAlias`         | `object`           | `{}`            | Map of language aliases                                                       |
 | `engine`            | `RegexEngine`      | Oniguruma       | RegExp engine for syntax highlighting (Oniguruma, JavaScript RegExp, or JavaScript Raw) |
 | `showLineNumbers`   | `boolean`          | `false`         | Display line numbers alongside code                                           |
@@ -358,9 +359,10 @@ import mcfunction from "../langs/mcfunction.tmLanguage.json";
 const highlightedCode = useShikiHighlighter(code, mcfunction, "github-dark");
 ```
 
-#### Preloading Custom Languages
+#### Preloading Languages
 
 For dynamic highlighting scenarios where language selection happens at runtime:
+`preloadLanguages` can also preload bundled language IDs, not just custom grammars.
 
 ```tsx
 import mcfunction from "../langs/mcfunction.tmLanguage.json";
@@ -370,14 +372,14 @@ import bosque from "../langs/bosque.tmLanguage.json";
 <ShikiHighlighter
   language="typescript"
   theme="github-dark"
-  customLanguages={[mcfunction, bosque]}
+  preloadLanguages={[mcfunction, bosque]}
 >
   {code.trim()}
 </ShikiHighlighter>
 
 // Hook
 const highlightedCode = useShikiHighlighter(code, "typescript", "github-dark", {
-  customLanguages: [mcfunction, bosque],
+  preloadLanguages: [mcfunction, bosque],
 });
 ```
 

package/dist/{chunk-SCXX26KJ.js → chunk-QPJZGYHO.js}

@@ -7,27 +7,17 @@ import {
 } from "react";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { toJsxRuntime } from "hast-util-to-jsx-runtime";
+import { guessEmbeddedLanguages } from "shiki/core";
 
 // src/lib/utils.ts
 import { useRef } from "react";
 import { dequal } from "dequal";
-var useStableOptions = (value) => {
+var useStableValue = (value) => {
   const ref = useRef(value);
-  const revision = useRef(0);
-  if (typeof value !== "object" || value === null) {
-    if (value !== ref.current) {
-      ref.current = value;
-      revision.current += 1;
-    }
-    return [value, revision.current];
-  }
-  if (value !== ref.current) {
-    if (!dequal(value, ref.current)) {
-      ref.current = value;
-      revision.current += 1;
-    }
+  if (value !== ref.current && !dequal(value, ref.current)) {
+    ref.current = value;
   }
-  return [ref.current, revision.current];
+  return ref.current;
 };
 var throttleHighlighting = (performHighlight, timeoutControl, throttleMs) => {
   const now = Date.now();
@@ -39,53 +29,81 @@ var throttleHighlighting = (performHighlight, timeoutControl, throttleMs) => {
   }, delay);
 };
 
-// src/lib/resolvers.ts
-var resolveLanguage = (lang, customLanguages, langAliases) => {
-  const normalizedCustomLangs = customLanguages ? Array.isArray(customLanguages) ? customLanguages : [customLanguages] : [];
+// src/lib/language.ts
+import { isSpecialLang } from "shiki/core";
+var FALLBACK_LANGUAGE = "plaintext";
+var toArray = (value) => value == null ? [] : Array.isArray(value) ? value : [value];
+var languageKey = (lang) => {
+  if (lang == null) return null;
+  if (typeof lang === "string") return `s:${lang}`;
+  return `o:${lang.name}::${lang.scopeName}`;
+};
+var dedupeLanguages = (langs) => {
+  const seen = /* @__PURE__ */ new Set();
+  const deduped = [];
+  for (const lang of langs) {
+    const key = languageKey(lang);
+    if (key == null || seen.has(key)) continue;
+    seen.add(key);
+    deduped.push(lang);
+  }
+  return deduped;
+};
+var isLoadableLanguage = (lang, bundledLanguages) => {
+  if (lang == null) return false;
+  if (typeof lang === "string") return lang in bundledLanguages;
+  return typeof lang.name === "string" && typeof lang.scopeName === "string";
+};
+var resolveLoadedLanguage = (languageId, loadedLanguages) => isSpecialLang(languageId) || loadedLanguages.includes(languageId) ? languageId : FALLBACK_LANGUAGE;
+var resolveLanguage = (lang, customLanguages, langAliases, preloadLanguages) => {
+  const customLangs = toArray(customLanguages);
+  const preloadLangs = toArray(preloadLanguages);
+  const customMatchPool = [...customLangs, ...preloadLangs];
+  let languageId = FALLBACK_LANGUAGE;
+  let primaryLang;
   if (lang == null || typeof lang === "string" && !lang.trim()) {
     return {
-      languageId: "plaintext",
-      displayLanguageId: "plaintext",
-      langsToLoad: void 0
+      languageId,
+      langsToLoad: dedupeLanguages([...preloadLangs, ...customLangs])
     };
   }
   if (typeof lang === "object") {
-    return {
-      languageId: lang.name,
-      displayLanguageId: lang.name || null,
-      langsToLoad: lang
-    };
-  }
-  const lowerLang = lang.toLowerCase();
-  const matches = (str) => str?.toLowerCase() === lowerLang;
-  const customMatch = normalizedCustomLangs.find(
-    (cl) => matches(cl.name) || matches(cl.scopeName) || matches(cl.scopeName?.split(".").pop()) || cl.aliases?.some(matches) || cl.fileTypes?.some(matches)
-  );
-  if (customMatch) {
-    return {
-      languageId: customMatch.name || lang,
-      displayLanguageId: lang,
-      langsToLoad: customMatch
-    };
-  }
-  if (langAliases?.[lang]) {
-    return {
-      languageId: langAliases[lang],
-      displayLanguageId: lang,
-      langsToLoad: langAliases[lang]
-    };
+    languageId = lang.name;
+    primaryLang = lang;
+  } else {
+    const lowerLang = lang.toLowerCase();
+    const matches = (str) => str?.toLowerCase() === lowerLang;
+    const customMatch = customMatchPool.find(
+      (candidate) => typeof candidate === "object" && candidate != null && !!(matches(candidate.name) || matches(candidate.scopeName) || matches(candidate.scopeName?.split(".").pop()) || candidate.aliases?.some(matches) || candidate.fileTypes?.some(matches))
+    );
+    if (customMatch) {
+      languageId = customMatch.name || lang;
+      primaryLang = customMatch;
+    } else if (langAliases?.[lang]) {
+      languageId = langAliases[lang];
+      primaryLang = langAliases[lang];
+    } else {
+      languageId = lang;
+      primaryLang = lang;
+    }
   }
   return {
-    languageId: lang,
-    displayLanguageId: lang,
-    langsToLoad: lang
+    languageId,
+    langsToLoad: dedupeLanguages([
+      primaryLang,
+      ...preloadLangs,
+      ...customLangs
+    ])
   };
 };
+
+// src/lib/theme.ts
+var isTextmateTheme = (value) => typeof value === "object" && value !== null && "tokenColors" in value && Array.isArray(value.tokenColors);
 function resolveTheme(themeInput) {
-  const isTextmateTheme = typeof themeInput === "object" && "tokenColors" in themeInput && Array.isArray(themeInput.tokenColors);
-  const isMultiThemeConfig = typeof themeInput === "object" && themeInput !== null && !isTextmateTheme;
-  const validMultiThemeObj = typeof themeInput === "object" && themeInput !== null && !isTextmateTheme && Object.entries(themeInput).some(
-    ([key, value]) => key && value && key.trim() !== "" && value !== "" && (typeof value === "string" || isTextmateTheme)
+  const inputIsTextmateTheme = isTextmateTheme(themeInput);
+  const isMultiThemeConfig = typeof themeInput === "object" && themeInput !== null && !inputIsTextmateTheme;
+  const validMultiThemeObj = typeof themeInput === "object" && themeInput !== null && !inputIsTextmateTheme && Object.entries(themeInput).some(
+    ([key, value]) => key.trim() !== "" && (typeof value === "string" && value.trim() !== "" || isTextmateTheme(value))
   );
   if (isMultiThemeConfig) {
     const themeId = validMultiThemeObj ? `multi-${Object.values(themeInput).map(
@@ -128,56 +146,94 @@ function lineNumbersTransformer(startLine = 1) {
   };
 }
 
-// src/lib/hook.ts
+// src/lib/options.ts
 var DEFAULT_THEMES = {
   light: "github-light",
   dark: "github-dark"
 };
+var buildThemeOptions = (resolvedTheme, options) => {
+  if (resolvedTheme.isMultiTheme) {
+    return {
+      themes: resolvedTheme.multiTheme ?? DEFAULT_THEMES,
+      defaultColor: options.defaultColor,
+      cssVariablePrefix: options.cssVariablePrefix
+    };
+  }
+  return {
+    theme: resolvedTheme.singleTheme ?? DEFAULT_THEMES.dark
+  };
+};
+var buildTransformers = (options) => {
+  const transformers = [...options.transformers || []];
+  if (options.showLineNumbers) {
+    transformers.push(lineNumbersTransformer(options.startingLineNumber));
+  }
+  return transformers;
+};
+var buildShikiOptions = ({
+  languageId,
+  resolvedTheme,
+  options
+}) => {
+  const {
+    defaultColor: _defaultColor,
+    cssVariablePrefix: _cssVariablePrefix,
+    showLineNumbers: _showLineNumbers,
+    startingLineNumber: _startingLineNumber,
+    transformers: _transformers,
+    ...restOptions
+  } = options;
+  return {
+    lang: languageId,
+    ...buildThemeOptions(resolvedTheme, options),
+    ...restOptions,
+    transformers: buildTransformers(options)
+  };
+};
+
+// src/lib/hook.ts
+var getEmbeddedLanguages = (code, languageId, highlighter) => {
+  const bundled = highlighter.getBundledLanguages();
+  return guessEmbeddedLanguages(code, languageId).flatMap(
+    (language) => bundled[language] ?? []
+  );
+};
 var useShikiHighlighter = (code, lang, themeInput, options = {}, highlighterFactory) => {
   const [highlightedCode, setHighlightedCode] = useState(null);
-  const [stableLang, langRev] = useStableOptions(lang);
-  const [stableTheme, themeRev] = useStableOptions(themeInput);
-  const [stableOpts, optsRev] = useStableOptions(options);
+  const stableLang = useStableValue(lang);
+  const stableTheme = useStableValue(themeInput);
+  const stableOpts = useStableValue(options);
   const { languageId, langsToLoad } = useMemo(
     () => resolveLanguage(
       stableLang,
       stableOpts.customLanguages,
-      stableOpts.langAlias
+      stableOpts.langAlias,
+      stableOpts.preloadLanguages
     ),
-    [stableLang, stableOpts.customLanguages, stableOpts.langAlias]
+    [
+      stableLang,
+      stableOpts.customLanguages,
+      stableOpts.preloadLanguages,
+      stableOpts.langAlias
+    ]
+  );
+  const resolvedTheme = useMemo(
+    () => resolveTheme(stableTheme),
+    [stableTheme]
   );
-  const { isMultiTheme, themeId, multiTheme, singleTheme, themesToLoad } = useMemo(() => resolveTheme(stableTheme), [stableTheme]);
+  const { themesToLoad } = resolvedTheme;
   const timeoutControl = useRef2({
     nextAllowedTime: 0,
     timeoutId: void 0
   });
-  const shikiOptions = useMemo(() => {
-    const languageOption = { lang: languageId };
-    const {
-      defaultColor,
-      cssVariablePrefix,
-      showLineNumbers,
-      startingLineNumber,
-      ...restOptions
-    } = stableOpts;
-    const themeOptions = isMultiTheme ? {
-      themes: multiTheme || DEFAULT_THEMES,
-      defaultColor,
-      cssVariablePrefix
-    } : {
-      theme: singleTheme || DEFAULT_THEMES.dark
-    };
-    const transformers = restOptions.transformers || [];
-    if (showLineNumbers) {
-      transformers.push(lineNumbersTransformer(startingLineNumber));
-    }
-    return {
-      ...languageOption,
-      ...themeOptions,
-      ...restOptions,
-      transformers
-    };
-  }, [languageId, themeId, langRev, themeRev, optsRev]);
+  const shikiOptions = useMemo(
+    () => buildShikiOptions({
+      languageId,
+      resolvedTheme,
+      options: stableOpts
+    }),
+    [languageId, resolvedTheme, stableOpts]
+  );
   useEffect(() => {
     let isMounted = true;
     const highlightCode = async () => {
@@ -187,8 +243,20 @@ var useShikiHighlighter = (code, lang, themeInput, options = {}, highlighterFact
         themesToLoad,
         stableOpts.engine
       );
-      const loadedLanguages = highlighter.getLoadedLanguages();
-      const langToUse = loadedLanguages.includes(languageId) ? languageId : "plaintext";
+      if (!stableOpts.highlighter) {
+        const embedded = getEmbeddedLanguages(
+          code,
+          languageId,
+          highlighter
+        );
+        if (embedded.length > 0) {
+          await highlighter.loadLanguage(...embedded);
+        }
+      }
+      const langToUse = resolveLoadedLanguage(
+        languageId,
+        highlighter.getLoadedLanguages()
+      );
       const finalOptions = { ...shikiOptions, lang: langToUse };
       if (isMounted) {
         const output = stableOpts.outputFormat === "html" ? highlighter.codeToHtml(code, finalOptions) : toJsxRuntime(highlighter.codeToHast(code, finalOptions), {
@@ -285,22 +353,21 @@ var createShikiHighlighterComponent = (useShikiHighlighterImpl) => {
       children: code,
       as: Element = "pre",
       customLanguages,
+      preloadLanguages,
       ...shikiOptions
     }, ref) => {
       const options = {
         delay,
         transformers,
         customLanguages,
+        preloadLanguages,
         showLineNumbers,
         defaultColor,
         cssVariablePrefix,
         startingLineNumber,
         ...shikiOptions
       };
-      const { displayLanguageId } = resolveLanguage(
-        language,
-        customLanguages
-      );
+      const displayLanguageId = typeof language === "object" ? language.name || null : language?.trim() || null;
       const highlightedCode = useShikiHighlighterImpl(
         code,
         language,
@@ -340,9 +407,10 @@ var createShikiHighlighterComponent = (useShikiHighlighterImpl) => {
 };
 
 export {
+  isLoadableLanguage,
   useShikiHighlighter,
   rehypeInlineCodeProperty,
   isInlineCode,
   createShikiHighlighterComponent
 };
-//# sourceMappingURL=chunk-SCXX26KJ.js.map
+//# sourceMappingURL=chunk-QPJZGYHO.js.map

package/dist/chunk-QPJZGYHO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/hook.ts","../src/lib/utils.ts","../src/lib/language.ts","../src/lib/theme.ts","../src/lib/transformers.ts","../src/lib/options.ts","../src/lib/plugins.ts","#style-inject:#style-inject","../src/lib/styles.css","../src/lib/component.tsx"],"sourcesContent":["import {\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ReactNode,\n} from 'react';\n\nimport { jsx, jsxs, Fragment } from 'react/jsx-runtime';\nimport { toJsxRuntime } from 'hast-util-to-jsx-runtime';\n\nimport type {\n  Highlighter,\n  HighlighterCore,\n  Awaitable,\n  LanguageInput,\n  RegexEngine,\n} from 'shiki';\n\nimport { guessEmbeddedLanguages } from 'shiki/core';\n\nimport type {\n  Language,\n  Theme,\n  HighlighterOptions,\n  TimeoutState,\n  Themes,\n} from './types';\n\nimport { throttleHighlighting, useStableValue } from './utils';\nimport { resolveLanguage, resolveLoadedLanguage } from './language';\nimport { resolveTheme } from './theme';\nimport { buildShikiOptions } from './options';\n\n/**\n * Returns detected embedded languages that are available in the current bundle.\n */\nconst getEmbeddedLanguages = (\n  code: string,\n  languageId: string,\n  highlighter: Highlighter | HighlighterCore\n): LanguageInput[] => {\n  const bundled: Record<string, LanguageInput> =\n    highlighter.getBundledLanguages();\n  return guessEmbeddedLanguages(code, languageId).flatMap(\n    (language) => bundled[language] ?? []\n  );\n};\n\n/**\n * Base hook for syntax highlighting using Shiki.\n * This is the core implementation used by all entry points.\n *\n * @param code - The code to highlight\n * @param lang - Language for highlighting\n * @param themeInput - Theme or themes to use\n * @param options - Highlighting options\n * @param highlighterFactory - Factory function to create highlighter (internal use)\n */\nexport const useShikiHighlighter = (\n  code: string,\n  lang: Language,\n  themeInput: Theme | Themes,\n  options: HighlighterOptions = {},\n  highlighterFactory: (\n    langsToLoad: Language[],\n    themesToLoad: Theme[],\n    engine?: Awaitable<RegexEngine>\n  ) => Promise<Highlighter | HighlighterCore>\n) => {\n  const [highlightedCode, setHighlightedCode] = useState<\n    ReactNode | string | null\n  >(null);\n\n  // Stabilize options, language and theme inputs to prevent unnecessary\n  // re-renders or recalculations when object references change\n  const stableLang = useStableValue(lang);\n  const stableTheme = useStableValue(themeInput);\n  const stableOpts = useStableValue(options);\n\n  const { languageId, langsToLoad } = useMemo(\n    () =>\n      resolveLanguage(\n        stableLang,\n        stableOpts.customLanguages,\n        stableOpts.langAlias,\n        stableOpts.preloadLanguages\n      ),\n    [\n      stableLang,\n      stableOpts.customLanguages,\n      stableOpts.preloadLanguages,\n      stableOpts.langAlias,\n    ]\n  );\n\n  const resolvedTheme = useMemo(\n    () => resolveTheme(stableTheme),\n    [stableTheme]\n  );\n  const { themesToLoad } = resolvedTheme;\n\n  const timeoutControl = useRef<TimeoutState>({\n    nextAllowedTime: 0,\n    timeoutId: undefined,\n  });\n\n  const shikiOptions = useMemo(\n    () =>\n      buildShikiOptions({\n        languageId,\n        resolvedTheme,\n        options: stableOpts,\n      }),\n    [languageId, resolvedTheme, stableOpts]\n  );\n\n  useEffect(() => {\n    let isMounted = true;\n\n    const highlightCode = async () => {\n      if (!languageId) return;\n\n      const highlighter = stableOpts.highlighter\n        ? stableOpts.highlighter\n        : await highlighterFactory(\n            langsToLoad,\n            themesToLoad,\n            stableOpts.engine\n          );\n\n      // Load embedded language grammars (e.g. ```python inside markdown)\n      if (!stableOpts.highlighter) {\n        const embedded = getEmbeddedLanguages(\n          code,\n          languageId,\n          highlighter\n        );\n        if (embedded.length > 0) {\n          await highlighter.loadLanguage(...embedded);\n        }\n      }\n\n      const langToUse = resolveLoadedLanguage(\n        languageId,\n        highlighter.getLoadedLanguages()\n      );\n      const finalOptions = { ...shikiOptions, lang: langToUse };\n\n      if (isMounted) {\n        const output =\n          stableOpts.outputFormat === 'html'\n            ? highlighter.codeToHtml(code, finalOptions)\n            : toJsxRuntime(highlighter.codeToHast(code, finalOptions), {\n                jsx,\n                jsxs,\n                Fragment,\n              });\n        setHighlightedCode(output);\n      }\n    };\n\n    const { delay } = stableOpts;\n\n    if (delay) {\n      throttleHighlighting(highlightCode, timeoutControl, delay);\n    } else {\n      highlightCode().catch(console.error);\n    }\n\n    return () => {\n      isMounted = false;\n      clearTimeout(timeoutControl.current.timeoutId);\n    };\n  }, [\n    code,\n    shikiOptions,\n    stableOpts.delay,\n    stableOpts.highlighter,\n    langsToLoad,\n    themesToLoad,\n  ]);\n\n  return highlightedCode;\n};\n","import { useRef } from 'react';\nimport { dequal } from 'dequal';\n\nimport type { TimeoutState } from './types';\n\n/**\n * Returns a referentially stable version of `value` that only updates when content changes.\n * Uses reference equality as a fast path and deep comparison to prevent unnecessary updates.\n */\nexport const useStableValue = <T>(value: T): T => {\n  const ref = useRef(value);\n\n  if (value !== ref.current && !dequal(value, ref.current)) {\n    ref.current = value;\n  }\n\n  return ref.current;\n};\n\n/**\n * Optionally throttles rapid sequential highlighting operations\n *\n * @example\n * const timeoutControl = useRef<TimeoutState>({\n *   nextAllowedTime: 0,\n *   timeoutId: undefined\n * });\n *\n * throttleHighlighting(highlightCode, timeoutControl, 1000);\n */\nexport const throttleHighlighting = (\n  performHighlight: () => Promise<void>,\n  timeoutControl: React.RefObject<TimeoutState>,\n  throttleMs: number\n) => {\n  const now = Date.now();\n  clearTimeout(timeoutControl.current.timeoutId);\n\n  const delay = Math.max(0, timeoutControl.current.nextAllowedTime - now);\n  timeoutControl.current.timeoutId = setTimeout(() => {\n    performHighlight().catch(console.error);\n    timeoutControl.current.nextAllowedTime = now + throttleMs;\n  }, delay);\n};\n","import type { Language } from './types';\nimport { isSpecialLang } from 'shiki/core';\nimport type {\n  DynamicImportLanguageRegistration,\n  LanguageRegistration,\n} from 'shiki';\n\nexport const FALLBACK_LANGUAGE = 'plaintext';\n\n/**\n * Resolved languages and metadata\n */\ntype LanguageResult = {\n  languageId: string;\n  langsToLoad: Language[];\n};\n\nconst toArray = <T>(value?: T | T[]): T[] =>\n  value == null ? [] : Array.isArray(value) ? value : [value];\n\nconst languageKey = (lang: Language): string | null => {\n  if (lang == null) return null;\n  if (typeof lang === 'string') return `s:${lang}`;\n  return `o:${lang.name}::${lang.scopeName}`;\n};\n\nconst dedupeLanguages = (langs: Language[]): Language[] => {\n  const seen = new Set<string>();\n  const deduped: Language[] = [];\n\n  for (const lang of langs) {\n    const key = languageKey(lang);\n    if (key == null || seen.has(key)) continue;\n    seen.add(key);\n    deduped.push(lang);\n  }\n\n  return deduped;\n};\n\n/**\n * Used in factories to check if language is supported.\n * Objects are validated as grammar registrations (name + scopeName).\n */\nexport const isLoadableLanguage = <T extends string>(\n  lang: Language,\n  bundledLanguages: Record<T, DynamicImportLanguageRegistration>\n): lang is NonNullable<Language> => {\n  if (lang == null) return false;\n  if (typeof lang === 'string') return lang in bundledLanguages;\n  return (\n    typeof lang.name === 'string' && typeof lang.scopeName === 'string'\n  );\n};\n\n/**\n * Used in hook to resolve loaded language for highlighting.\n * Falls back to \"plaintext\" if not supported.\n */\nexport const resolveLoadedLanguage = (\n  languageId: string,\n  loadedLanguages: string[]\n): string =>\n  isSpecialLang(languageId) || loadedLanguages.includes(languageId)\n    ? languageId\n    : FALLBACK_LANGUAGE;\n\n/**\n * Resolves the language input to standardized IDs and objects for Shiki\n * @param lang The language input from props\n * @param customLanguages An array of custom textmate grammar objects or a single grammar object\n * @returns A LanguageResult object containing:\n *   - languageId: The resolved language ID\n *   - langsToLoad: The language objects/string ids to load\n */\nexport const resolveLanguage = (\n  lang: Language,\n  customLanguages?: LanguageRegistration | LanguageRegistration[],\n  langAliases?: Record<string, string>,\n  preloadLanguages?: Language | Language[]\n): LanguageResult => {\n  const customLangs = toArray(customLanguages);\n  const preloadLangs = toArray(preloadLanguages);\n  const customMatchPool = [...customLangs, ...preloadLangs];\n  let languageId = FALLBACK_LANGUAGE;\n  let primaryLang: Language;\n\n  // Language is null or empty string\n  if (lang == null || (typeof lang === 'string' && !lang.trim())) {\n    return {\n      languageId,\n      langsToLoad: dedupeLanguages([...preloadLangs, ...customLangs]),\n    };\n  }\n\n  // Language is custom object\n  if (typeof lang === 'object') {\n    languageId = lang.name;\n    primaryLang = lang;\n  } else {\n    // Language is string\n    const lowerLang = lang.toLowerCase();\n    const matches = (str: string | undefined): boolean =>\n      str?.toLowerCase() === lowerLang;\n\n    // Check custom registrations (from both customLanguages and preloadLanguages)\n    const customMatch = customMatchPool.find(\n      (candidate): candidate is LanguageRegistration =>\n        typeof candidate === 'object' &&\n        candidate != null &&\n        !!(\n          matches(candidate.name) ||\n          matches(candidate.scopeName) ||\n          matches(candidate.scopeName?.split('.').pop()) ||\n          candidate.aliases?.some(matches) ||\n          candidate.fileTypes?.some(matches)\n        )\n    );\n\n    if (customMatch) {\n      languageId = customMatch.name || lang;\n      primaryLang = customMatch;\n    } else if (langAliases?.[lang]) {\n      // Language is aliased\n      languageId = langAliases[lang];\n      primaryLang = langAliases[lang];\n    } else {\n      // For any other string, pass it through to the factory\n      languageId = lang;\n      primaryLang = lang;\n    }\n  }\n\n  return {\n    languageId,\n    langsToLoad: dedupeLanguages([\n      primaryLang,\n      ...preloadLangs,\n      ...customLangs,\n    ]),\n  };\n};\n","import type { Theme, Themes } from './types';\nimport type { ThemeRegistrationAny } from 'shiki/core';\n\n/**\n * Resolved themes and metadata\n */\nexport interface ThemeResult {\n  isMultiTheme: boolean;\n  themeId: Theme;\n  multiTheme?: Themes | null;\n  singleTheme?: Theme;\n  themesToLoad: Theme[];\n}\n\n/**\n * Determines theme configuration and returns the resolved theme with metadata\n * @param themeInput - The theme input, either as a string name or theme object\n * @returns Object containing:\n *   - isMultiTheme: If theme input is a multi-theme configuration\n *   - themeId: Theme reference identifier\n *   - multiTheme: The multi-theme config if it exists\n *   - singleTheme: The single theme if it exists\n *   - themesToLoad: The themes to load when creating the highlighter\n */\nconst isTextmateTheme = (value: unknown): value is ThemeRegistrationAny =>\n  typeof value === 'object' &&\n  value !== null &&\n  'tokenColors' in value &&\n  Array.isArray((value as ThemeRegistrationAny).tokenColors);\n\nexport function resolveTheme(themeInput: Theme | Themes): ThemeResult {\n  const inputIsTextmateTheme = isTextmateTheme(themeInput);\n\n  // Assume non textmate objects are multi theme configs\n  const isMultiThemeConfig =\n    typeof themeInput === 'object' &&\n    themeInput !== null &&\n    !inputIsTextmateTheme;\n\n  const validMultiThemeObj =\n    typeof themeInput === 'object' &&\n    themeInput !== null &&\n    !inputIsTextmateTheme &&\n    Object.entries(themeInput).some(\n      ([key, value]) =>\n        key.trim() !== '' &&\n        ((typeof value === 'string' && value.trim() !== '') ||\n          isTextmateTheme(value))\n    );\n\n  if (isMultiThemeConfig) {\n    const themeId = validMultiThemeObj\n      ? `multi-${Object.values(themeInput)\n          .map(\n            (theme) =>\n              (typeof theme === 'string'\n                ? theme\n                : (theme as { name?: string })?.name) || 'custom'\n          )\n          .sort()\n          .join('-')}`\n      : 'multi-default';\n\n    // If config is invalid, return null to handle fallback in `buildShikiOptions()`\n    return {\n      isMultiTheme: true,\n      themeId,\n      multiTheme: validMultiThemeObj ? themeInput : null,\n      themesToLoad: validMultiThemeObj ? Object.values(themeInput) : [],\n    };\n  }\n\n  return {\n    isMultiTheme: false,\n    themeId:\n      typeof themeInput === 'string'\n        ? themeInput\n        : themeInput?.name || 'custom',\n    singleTheme: themeInput,\n    themesToLoad: [themeInput],\n  };\n}\n","import type { ShikiTransformer } from 'shiki/core';\n\n/**\n * Creates a transformer that enables line numbers display\n * @param startLine - The starting line number (defaults to 1)\n */\nexport function lineNumbersTransformer(startLine = 1): ShikiTransformer {\n  return {\n    name: 'react-shiki:line-numbers',\n    code(node) {\n      this.addClassToHast(node, 'has-line-numbers');\n      if (startLine !== 1) {\n        const existingStyle = (node.properties?.style as string) || '';\n        const newStyle = existingStyle\n          ? `${existingStyle}; --line-start: ${startLine}`\n          : `--line-start: ${startLine}`;\n        node.properties = {\n          ...node.properties,\n          style: newStyle,\n        };\n      }\n    },\n    line(node) {\n      this.addClassToHast(node, 'line-numbers');\n      return node;\n    },\n  };\n}\n","import type {\n  BundledTheme,\n  CodeOptionsMultipleThemes,\n  CodeOptionsSingleTheme,\n  CodeToHastOptions,\n} from 'shiki';\n\nimport type { HighlighterOptions, Themes } from './types';\nimport type { ThemeResult } from './theme';\nimport { lineNumbersTransformer } from './transformers';\n\nconst DEFAULT_THEMES: Themes = {\n  light: 'github-light',\n  dark: 'github-dark',\n};\n\ninterface BuildShikiOptionsInput {\n  languageId: string;\n  resolvedTheme: ThemeResult;\n  options: HighlighterOptions;\n}\n\nconst buildThemeOptions = (\n  resolvedTheme: ThemeResult,\n  options: HighlighterOptions\n):\n  | CodeOptionsMultipleThemes<BundledTheme>\n  | CodeOptionsSingleTheme<BundledTheme> => {\n  if (resolvedTheme.isMultiTheme) {\n    return {\n      themes: resolvedTheme.multiTheme ?? DEFAULT_THEMES,\n      defaultColor: options.defaultColor,\n      cssVariablePrefix: options.cssVariablePrefix,\n    } as CodeOptionsMultipleThemes<BundledTheme>;\n  }\n\n  return {\n    theme: resolvedTheme.singleTheme ?? DEFAULT_THEMES.dark,\n  } as CodeOptionsSingleTheme<BundledTheme>;\n};\n\nconst buildTransformers = (\n  options: HighlighterOptions\n): CodeToHastOptions['transformers'] => {\n  const transformers = [...(options.transformers || [])];\n\n  if (options.showLineNumbers) {\n    transformers.push(lineNumbersTransformer(options.startingLineNumber));\n  }\n\n  return transformers;\n};\n\nexport const buildShikiOptions = ({\n  languageId,\n  resolvedTheme,\n  options,\n}: BuildShikiOptionsInput): CodeToHastOptions => {\n  const {\n    defaultColor: _defaultColor,\n    cssVariablePrefix: _cssVariablePrefix,\n    showLineNumbers: _showLineNumbers,\n    startingLineNumber: _startingLineNumber,\n    transformers: _transformers,\n    ...restOptions\n  } = options;\n\n  return {\n    lang: languageId,\n    ...buildThemeOptions(resolvedTheme, options),\n    ...restOptions,\n    transformers: buildTransformers(options),\n  };\n};\n","import { visit } from 'unist-util-visit';\nimport type { Element } from './types';\n\n/**\n * Rehype plugin to add an 'inline' property to <code> elements\n * Sets 'inline' property to true if the <code> is not within a <pre> tag\n *\n * Pass this plugin to the `rehypePlugins` prop of react-markdown\n * You can then access `inline` as a prop in components passed to react-markdown\n *\n * @example\n * <ReactMarkdown rehypePlugins={[rehypeInlineCodeProperty]} />\n */\nexport function rehypeInlineCodeProperty() {\n  return (tree: any): undefined => {\n    visit(tree, 'element', (node: Element, _index, parent: Element) => {\n      if (node.tagName === 'code' && parent.tagName !== 'pre') {\n        node.properties.inline = true;\n      }\n    });\n  };\n}\n\n/**\n * Function to determine if code is inline based on the presence of line breaks\n *\n * @example\n * const isInline = node && isInlineCode(node: Element)\n */\nexport const isInlineCode = (node: Element): boolean => {\n  const textContent = (node.children || [])\n    .filter((child) => child.type === 'text')\n    .map((child) => child.value)\n    .join('');\n\n  return !textContent.includes('\\n');\n};\n","\n          export default function styleInject(css, { insertAt } = {}) {\n            if (!css || typeof document === 'undefined') return\n          \n            const head = document.head || document.getElementsByTagName('head')[0]\n            const style = document.createElement('style')\n            style.type = 'text/css'\n          \n            if (insertAt === 'top') {\n              if (head.firstChild) {\n                head.insertBefore(style, head.firstChild)\n              } else {\n                head.appendChild(style)\n              }\n            } else {\n              head.appendChild(style)\n            }\n          \n            if (style.styleSheet) {\n              style.styleSheet.cssText = css\n            } else {\n              style.appendChild(document.createTextNode(css))\n            }\n          }\n          ","import styleInject from '#style-inject';styleInject(\".relative {\\n  position: relative;\\n}\\n.defaultStyles pre {\\n  overflow: auto;\\n  border-radius: 0.5rem;\\n  padding-left: 1.5rem;\\n  padding-right: 1.5rem;\\n  padding-top: 1.25rem;\\n  padding-bottom: 1.25rem;\\n}\\n.languageLabel {\\n  position: absolute;\\n  right: 0.75rem;\\n  top: 0.5rem;\\n  font-family: monospace;\\n  font-size: 0.75rem;\\n  letter-spacing: -0.05em;\\n  color: rgba(107, 114, 128, 0.85);\\n}\\n.line-numbers::before {\\n  counter-increment: line-number;\\n  content: counter(line-number);\\n  display: inline-flex;\\n  justify-content: flex-end;\\n  align-items: flex-start;\\n  box-sizing: content-box;\\n  min-width: var(--line-numbers-width, 2ch);\\n  padding-left: var(--line-numbers-padding-left, 2ch);\\n  padding-right: var(--line-numbers-padding-right, 2ch);\\n  color: var(--line-numbers-foreground, rgba(107, 114, 128, 0.6));\\n  font-size: var(--line-numbers-font-size, inherit);\\n  font-weight: var(--line-numbers-font-weight, inherit);\\n  line-height: var(--line-numbers-line-height, inherit);\\n  font-family: var(--line-numbers-font-family, inherit);\\n  opacity: var(--line-numbers-opacity, 1);\\n  user-select: none;\\n  pointer-events: none;\\n}\\n.has-line-numbers {\\n  counter-reset: line-number calc(var(--line-start, 1) - 1);\\n  --line-numbers-foreground: rgba(107, 114, 128, 0.5);\\n  --line-numbers-width: 2ch;\\n  --line-numbers-padding-left: 0ch;\\n  --line-numbers-padding-right: 2ch;\\n  --line-numbers-font-size: inherit;\\n  --line-numbers-font-weight: inherit;\\n  --line-numbers-line-height: inherit;\\n  --line-numbers-font-family: inherit;\\n  --line-numbers-opacity: 1;\\n}\\n\")","import './styles.css';\nimport { clsx } from 'clsx';\n\nimport type {\n  HighlighterOptions,\n  Language,\n  Theme,\n  Themes,\n  UseShikiHighlighter,\n} from './types';\nimport { forwardRef } from 'react';\n\n/**\n * Props for the ShikiHighlighter component\n */\nexport interface ShikiHighlighterProps extends HighlighterOptions {\n  /**\n   * The programming language for syntax highlighting\n   * Supports custom textmate grammar objects in addition to Shiki's bundled languages\n   * @see https://shiki.style/languages\n   */\n  language: Language;\n\n  /**\n   * The code to be highlighted\n   */\n  children: string;\n\n  /**\n   * The color theme or themes for syntax highlighting\n   * Supports single, dual, or multiple themes\n   * Supports custom textmate theme objects in addition to Shiki's bundled themes\n   *\n   * @example\n   * theme='github-dark' // single theme\n   * theme={{ light: 'github-light', dark: 'github-dark' }} // multi-theme\n   *\n   * @see https://shiki.style/themes\n   */\n  theme: Theme | Themes;\n\n  /**\n   * Controls the application of default styles to the generated code blocks\n   *\n   * Default styles include padding, overflow handling, border radius, language label styling, and font settings\n   * @default true\n   */\n  addDefaultStyles?: boolean;\n\n  /**\n   * Add custom inline styles to the generated code block\n   */\n  style?: React.CSSProperties;\n\n  /**\n   * Add custom inline styles to the language label\n   */\n  langStyle?: React.CSSProperties;\n\n  /**\n   * Add custom CSS class names to the generated code block\n   */\n  className?: string;\n\n  /**\n   * Add custom CSS class names to the language label\n   */\n  langClassName?: string;\n\n  /**\n   * Whether to show the language label\n   * @default true\n   */\n  showLanguage?: boolean;\n\n  /**\n   * Whether to show line numbers\n   * @default false\n   */\n  showLineNumbers?: boolean;\n\n  /**\n   * Starting line number (when showLineNumbers is true)\n   * @default 1\n   */\n  startingLineNumber?: number;\n\n  /**\n   * The HTML element that wraps the generated code block.\n   * @default 'pre'\n   */\n  as?: React.ElementType;\n}\n\n/**\n * Base ShikiHighlighter component factory.\n * This creates a component that uses the provided hook implementation.\n */\nexport const createShikiHighlighterComponent = (\n  useShikiHighlighterImpl: UseShikiHighlighter\n) => {\n  return forwardRef<HTMLElement, ShikiHighlighterProps>(\n    (\n      {\n        language,\n        theme,\n        delay,\n        transformers,\n        defaultColor,\n        cssVariablePrefix,\n        addDefaultStyles = true,\n        style,\n        langStyle,\n        className,\n        langClassName,\n        showLanguage = true,\n        showLineNumbers = false,\n        startingLineNumber = 1,\n        children: code,\n        as: Element = 'pre',\n        customLanguages,\n        preloadLanguages,\n        ...shikiOptions\n      },\n      ref\n    ) => {\n      // Destructure some options for use in hook\n      const options: HighlighterOptions = {\n        delay,\n        transformers,\n        customLanguages,\n        preloadLanguages,\n        showLineNumbers,\n        defaultColor,\n        cssVariablePrefix,\n        startingLineNumber,\n        ...shikiOptions,\n      };\n\n      const displayLanguageId =\n        typeof language === 'object'\n          ? language.name || null\n          : language?.trim() || null;\n\n      const highlightedCode = useShikiHighlighterImpl(\n        code,\n        language,\n        theme,\n        options\n      );\n\n      const isHtmlOutput = typeof highlightedCode === 'string';\n\n      return (\n        <Element\n          ref={ref}\n          data-testid=\"shiki-container\"\n          className={clsx(\n            'relative',\n            'not-prose',\n            addDefaultStyles && 'defaultStyles',\n            className\n          )}\n          style={style}\n          id=\"shiki-container\"\n        >\n          {showLanguage && displayLanguageId ? (\n            <span\n              className={clsx('languageLabel', langClassName)}\n              style={langStyle}\n              id=\"language-label\"\n            >\n              {displayLanguageId}\n            </span>\n          ) : null}\n          {isHtmlOutput ? (\n            <div dangerouslySetInnerHTML={{ __html: highlightedCode }} />\n          ) : (\n            highlightedCode\n          )}\n        </Element>\n      );\n    }\n  );\n};\n"],"mappings":"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","names":["useRef","useRef","jsx","jsxs"]}

package/dist/{component-mMdHg8JD.d.ts → component-CoSKNtmy.d.ts}

@@ -1,44 +1,7 @@
-import { Highlighter, HighlighterCore, CodeOptionsMultipleThemes, BundledTheme, CodeToHastOptions, BundledHighlighterOptions, StringLiteralUnion, BundledLanguage, SpecialLanguage, ThemeRegistrationAny } from 'shiki';
+import { LanguageRegistration, StringLiteralUnion, BundledLanguage, SpecialLanguage, Highlighter, HighlighterCore, CodeOptionsMultipleThemes, BundledTheme, CodeToHastOptions, BundledHighlighterOptions, ThemeRegistrationAny } from 'shiki';
 import { ReactNode } from 'react';
-import { LanguageRegistration as LanguageRegistration$1 } from 'shiki/core';
 import { Element as Element$1 } from 'hast';
 
-/**
- * Attribution:
- *  This code was written by github:hippotastic in expressive-code/expressive-code
- *  https://github.com/expressive-code/expressive-code/blob/main/packages/%40expressive-code/plugin-shiki/src/languages.ts
- */
-
-type IShikiRawRepository = LanguageRegistration$1['repository'];
-type IShikiRawRule = IShikiRawRepository[keyof IShikiRawRepository];
-type ILocation = IShikiRawRepository['$vscodeTextmateLocation'];
-interface ILocatable {
-    readonly $vscodeTextmateLocation?: ILocation;
-}
-interface IRawRepositoryMap {
-    [name: string]: IRawRule;
-}
-type IRawRepository = IRawRepositoryMap & ILocatable;
-interface IRawCapturesMap {
-    [captureId: string]: IRawRule;
-}
-type IRawCaptures = IRawCapturesMap & ILocatable;
-interface IRawRule extends Omit<IShikiRawRule, 'applyEndPatternLast' | 'captures' | 'patterns'> {
-    readonly applyEndPatternLast?: boolean | number;
-    readonly captures?: IRawCaptures;
-    readonly comment?: string;
-    readonly patterns?: IRawRule[];
-}
-/**
- * A less strict version of Shiki's `LanguageRegistration` interface that aligns better with
- * actual grammars found in the wild. This version attempts to reduce the amount
- * of type errors that would occur when importing and adding external grammars,
- * while still being supported by the language processing code.
- */
-interface LanguageRegistration extends Omit<LanguageRegistration$1, 'repository'> {
-    repository?: IRawRepository;
-}
-
 /**
  * HTML Element, use to type `node` from react-markdown
  */
@@ -47,7 +10,7 @@ type Element = Element$1;
  * A Shiki BundledLanguage or a custom textmate grammar object
  * @see https://shiki.style/languages
  */
-type Language = LanguageRegistration | StringLiteralUnion<BundledLanguage | SpecialLanguage> | undefined;
+type Language = LanguageRegistration | StringLiteralUnion<BundledLanguage> | SpecialLanguage | undefined;
 /**
  * A Shiki BundledTheme or a custom textmate theme object
  * @see https://shiki.style/themes
@@ -83,8 +46,14 @@ interface ReactShikiOptions {
     delay?: number;
     /**
      * Custom textmate grammars to be preloaded for highlighting.
+     * @deprecated Use preloadLanguages instead.
      */
     customLanguages?: LanguageRegistration | LanguageRegistration[];
+    /**
+     * Preload custom grammars or bundled languages.
+     * Supports custom textmate grammars, replaces deprecated `customLanguages`
+     */
+    preloadLanguages?: Language | Language[];
     /**
      * Output format for the highlighted code.
      * - 'react': Returns React nodes (default, safer)

package/dist/core.d.ts

@@ -1,7 +1,7 @@
 import * as react from 'react';
-import { S as ShikiHighlighterProps, U as UseShikiHighlighter } from './component-mMdHg8JD.js';
-export { E as Element, H as HighlighterOptions, L as Language, T as Theme, a as Themes, i as isInlineCode, r as rehypeInlineCodeProperty } from './component-mMdHg8JD.js';
-export { createHighlighterCore } from 'shiki/core';
+import { S as ShikiHighlighterProps, U as UseShikiHighlighter } from './component-CoSKNtmy.js';
+export { E as Element, H as HighlighterOptions, L as Language, T as Theme, a as Themes, i as isInlineCode, r as rehypeInlineCodeProperty } from './component-CoSKNtmy.js';
+export { LanguageRegistration, createHighlighterCore } from 'shiki/core';
 export { createOnigurumaEngine } from 'shiki/engine/oniguruma';
 export { createJavaScriptRawEngine, createJavaScriptRegexEngine } from 'shiki/engine/javascript';
 import 'shiki';

package/dist/core.js

@@ -3,7 +3,7 @@ import {
   isInlineCode,
   rehypeInlineCodeProperty,
   useShikiHighlighter
-} from "./chunk-SCXX26KJ.js";
+} from "./chunk-QPJZGYHO.js";
 
 // src/bundles/core.ts
 function validateCoreHighlighter(highlighter) {

package/dist/core.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/bundles/core.ts","../src/core.ts"],"sourcesContent":["import type { HighlighterCore } from 'shiki';\n\n/**\n * Validates that a highlighter is provided for the core bundle.\n * The core bundle requires users to provide their own highlighter instance.\n */\nexport function validateCoreHighlighter(\n  highlighter: HighlighterCore | undefined\n): HighlighterCore {\n  if (!highlighter) {\n    throw new Error(\n      'react-shiki/core requires a custom highlighter. ' +\n        'Use createHighlighterCore() from react-shiki or switch to react-shiki for plug-and-play usage.'\n    );\n  }\n  return highlighter;\n}\n","import { useShikiHighlighter as useBaseHook } from './lib/hook';\nimport { validateCoreHighlighter } from './bundles/core';\nimport type { UseShikiHighlighter } from './lib/types';\n\nexport { isInlineCode, rehypeInlineCodeProperty } from './lib/plugins';\n\nimport {\n  createShikiHighlighterComponent,\n  type ShikiHighlighterProps,\n} from './lib/component';\n\nexport type { ShikiHighlighterProps };\n\nexport type {\n  UseShikiHighlighter,\n  Language,\n  Theme,\n  Themes,\n  Element,\n  HighlighterOptions,\n} from './lib/types';\n\nexport { createHighlighterCore } from 'shiki/core';\nexport { createOnigurumaEngine } from 'shiki/engine/oniguruma';\nexport {\n  createJavaScriptRegexEngine,\n  createJavaScriptRawEngine,\n} from 'shiki/engine/javascript';\n\n/**\n * Highlight code with shiki (core bundle)\n *\n * @param code - Code to highlight\n * @param lang - Language (bundled or custom)\n * @param theme - Theme (bundled, multi-theme, or custom)\n * @param options - react-shiki options + shiki options\n * @returns Highlighted code as React elements or HTML string\n *\n * @example\n * ```tsx\n * import { createHighlighterCore, createOnigurumaEngine } from 'react-shiki/core';\n *\n *\n * const highlighter = await createHighlighterCore({\n *   themes: [import('@shikijs/themes/github-light'), import('@shikijs/themes/github-dark')],\n *   langs: [import('@shikijs/langs/typescript')],\n *   engine: createOnigurumaEngine(import('shiki/wasm'))\n * });\n *\n * const highlighted = useShikiHighlighter(\n *   'const x = 1;',\n *   'typescript',\n *   {\n *     light: 'github-light',\n *     dark: 'github-dark'\n *   },\n *   { highlighter }\n * );\n * ```\n *\n * Core bundle (minimal). For plug-and-play: `react-shiki` or `react-shiki/web`\n */\nexport const useShikiHighlighter: UseShikiHighlighter = (\n  code,\n  lang,\n  themeInput,\n  options = {}\n) => {\n  // Validate that highlighter is provided\n  const highlighter = validateCoreHighlighter(options.highlighter);\n\n  return useBaseHook(\n    code,\n    lang,\n    themeInput,\n    {\n      ...options,\n      highlighter,\n    },\n    async () => highlighter\n  );\n};\n\n/**\n * ShikiHighlighter component using a custom highlighter.\n * Requires a highlighter to be provided.\n */\nexport const ShikiHighlighter = createShikiHighlighterComponent(\n  useShikiHighlighter\n);\nexport default ShikiHighlighter;\n"],"mappings":";;;;;;;;AAMO,SAAS,wBACd,aACiB;AACjB,MAAI,CAAC,aAAa;AAChB,UAAM,IAAI;AAAA,MACR;AAAA,IAEF;AAAA,EACF;AACA,SAAO;AACT;;;ACMA,SAAS,6BAA6B;AACtC,SAAS,6BAA6B;AACtC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAmCA,IAAMA,uBAA2C,CACtD,MACA,MACA,YACA,UAAU,CAAC,MACR;AAEH,QAAM,cAAc,wBAAwB,QAAQ,WAAW;AAE/D,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE,GAAG;AAAA,MACH;AAAA,IACF;AAAA,IACA,YAAY;AAAA,EACd;AACF;AAMO,IAAM,mBAAmB;AAAA,EAC9BA;AACF;AACA,IAAO,eAAQ;","names":["useShikiHighlighter"]}
+{"version":3,"sources":["../src/bundles/core.ts","../src/core.ts"],"sourcesContent":["import type { HighlighterCore } from 'shiki';\n\n/**\n * Validates that a highlighter is provided for the core bundle.\n * The core bundle requires users to provide their own highlighter instance.\n */\nexport function validateCoreHighlighter(\n  highlighter: HighlighterCore | undefined\n): HighlighterCore {\n  if (!highlighter) {\n    throw new Error(\n      'react-shiki/core requires a custom highlighter. ' +\n        'Use createHighlighterCore() from react-shiki or switch to react-shiki for plug-and-play usage.'\n    );\n  }\n  return highlighter;\n}\n","import { useShikiHighlighter as useBaseHook } from './lib/hook';\nimport { validateCoreHighlighter } from './bundles/core';\nimport type { UseShikiHighlighter } from './lib/types';\n\nexport { isInlineCode, rehypeInlineCodeProperty } from './lib/plugins';\n\nimport {\n  createShikiHighlighterComponent,\n  type ShikiHighlighterProps,\n} from './lib/component';\n\nexport type { ShikiHighlighterProps };\n\nexport type {\n  UseShikiHighlighter,\n  Language,\n  Theme,\n  Themes,\n  Element,\n  HighlighterOptions,\n} from './lib/types';\n\nexport { createHighlighterCore } from 'shiki/core';\nexport { createOnigurumaEngine } from 'shiki/engine/oniguruma';\nexport {\n  createJavaScriptRegexEngine,\n  createJavaScriptRawEngine,\n} from 'shiki/engine/javascript';\n\nexport type { LanguageRegistration } from 'shiki/core';\n\n/**\n * Highlight code with shiki (core bundle)\n *\n * @param code - Code to highlight\n * @param lang - Language (bundled or custom)\n * @param theme - Theme (bundled, multi-theme, or custom)\n * @param options - react-shiki options + shiki options\n * @returns Highlighted code as React elements or HTML string\n *\n * @example\n * ```tsx\n * import { createHighlighterCore, createOnigurumaEngine } from 'react-shiki/core';\n *\n *\n * const highlighter = await createHighlighterCore({\n *   themes: [import('@shikijs/themes/github-light'), import('@shikijs/themes/github-dark')],\n *   langs: [import('@shikijs/langs/typescript')],\n *   engine: createOnigurumaEngine(import('shiki/wasm'))\n * });\n *\n * const highlighted = useShikiHighlighter(\n *   'const x = 1;',\n *   'typescript',\n *   {\n *     light: 'github-light',\n *     dark: 'github-dark'\n *   },\n *   { highlighter }\n * );\n * ```\n *\n * Core bundle (minimal). For plug-and-play: `react-shiki` or `react-shiki/web`\n */\nexport const useShikiHighlighter: UseShikiHighlighter = (\n  code,\n  lang,\n  themeInput,\n  options = {}\n) => {\n  // Validate that highlighter is provided\n  const highlighter = validateCoreHighlighter(options.highlighter);\n\n  return useBaseHook(\n    code,\n    lang,\n    themeInput,\n    {\n      ...options,\n      highlighter,\n    },\n    async () => highlighter\n  );\n};\n\n/**\n * ShikiHighlighter component using a custom highlighter.\n * Requires a highlighter to be provided.\n */\nexport const ShikiHighlighter = createShikiHighlighterComponent(\n  useShikiHighlighter\n);\nexport default ShikiHighlighter;\n"],"mappings":";;;;;;;;AAMO,SAAS,wBACd,aACiB;AACjB,MAAI,CAAC,aAAa;AAChB,UAAM,IAAI;AAAA,MACR;AAAA,IAEF;AAAA,EACF;AACA,SAAO;AACT;;;ACMA,SAAS,6BAA6B;AACtC,SAAS,6BAA6B;AACtC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAqCA,IAAMA,uBAA2C,CACtD,MACA,MACA,YACA,UAAU,CAAC,MACR;AAEH,QAAM,cAAc,wBAAwB,QAAQ,WAAW;AAE/D,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE,GAAG;AAAA,MACH;AAAA,IACF;AAAA,IACA,YAAY;AAAA,EACd;AACF;AAMO,IAAM,mBAAmB;AAAA,EAC9BA;AACF;AACA,IAAO,eAAQ;","names":["useShikiHighlighter"]}

package/dist/index.d.ts

@@ -1,9 +1,8 @@
 import * as react from 'react';
-import { S as ShikiHighlighterProps, U as UseShikiHighlighter } from './component-mMdHg8JD.js';
-export { E as Element, H as HighlighterOptions, L as Language, T as Theme, a as Themes, i as isInlineCode, r as rehypeInlineCodeProperty } from './component-mMdHg8JD.js';
+import { S as ShikiHighlighterProps, U as UseShikiHighlighter } from './component-CoSKNtmy.js';
+export { E as Element, H as HighlighterOptions, L as Language, T as Theme, a as Themes, i as isInlineCode, r as rehypeInlineCodeProperty } from './component-CoSKNtmy.js';
 export { createJavaScriptRawEngine, createJavaScriptRegexEngine } from 'shiki/engine/javascript';
-import 'shiki';
-import 'shiki/core';
+export { LanguageRegistration } from 'shiki';
 import 'hast';
 
 /**

package/dist/index.js

@@ -1,32 +1,26 @@
 import {
   createShikiHighlighterComponent,
   isInlineCode,
+  isLoadableLanguage,
   rehypeInlineCodeProperty,
   useShikiHighlighter
-} from "./chunk-SCXX26KJ.js";
+} from "./chunk-QPJZGYHO.js";
 
 // src/bundles/full.ts
 import {
-  getSingletonHighlighter
+  getSingletonHighlighter,
+  bundledLanguages
 } from "shiki";
 import { createOnigurumaEngine } from "shiki/engine/oniguruma";
 async function createFullHighlighter(langsToLoad, themesToLoad, engine) {
-  try {
-    return await getSingletonHighlighter({
-      langs: [langsToLoad],
-      themes: themesToLoad,
-      engine: engine ?? createOnigurumaEngine(import("shiki/wasm"))
-    });
-  } catch (error) {
-    if (error instanceof Error && error.message.includes("Language")) {
-      return await getSingletonHighlighter({
-        langs: ["plaintext"],
-        themes: themesToLoad,
-        engine: engine ?? createOnigurumaEngine(import("shiki/wasm"))
-      });
-    }
-    throw error;
-  }
+  const langs = langsToLoad.filter(
+    (lang) => isLoadableLanguage(lang, bundledLanguages)
+  );
+  return await getSingletonHighlighter({
+    langs,
+    themes: themesToLoad,
+    engine: engine ?? createOnigurumaEngine(import("shiki/wasm"))
+  });
 }
 
 // src/index.ts

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/bundles/full.ts","../src/index.ts"],"sourcesContent":["import {\n  getSingletonHighlighter,\n  type Highlighter,\n  type Awaitable,\n  type RegexEngine,\n} from 'shiki';\nimport { createOnigurumaEngine } from 'shiki/engine/oniguruma';\nimport type { ShikiLanguageRegistration } from '../lib/extended-types';\nimport type { Theme } from '../lib/types';\n\n/**\n * Creates a highlighter using the full Shiki bundle with all languages and themes.\n * This is the largest bundle but provides maximum compatibility.\n */\nexport async function createFullHighlighter(\n  langsToLoad: ShikiLanguageRegistration,\n  themesToLoad: Theme[],\n  engine?: Awaitable<RegexEngine>\n): Promise<Highlighter> {\n  try {\n    return await getSingletonHighlighter({\n      langs: [langsToLoad],\n      themes: themesToLoad,\n      engine: engine ?? createOnigurumaEngine(import('shiki/wasm')),\n    });\n  } catch (error) {\n    if (error instanceof Error && error.message.includes('Language')) {\n      return await getSingletonHighlighter({\n        langs: ['plaintext'],\n        themes: themesToLoad,\n        engine: engine ?? createOnigurumaEngine(import('shiki/wasm')),\n      });\n    }\n    throw error;\n  }\n}\n","import { useShikiHighlighter as useBaseHook } from './lib/hook';\nimport { createFullHighlighter } from './bundles/full';\nimport type { UseShikiHighlighter } from './lib/types';\n\nexport { isInlineCode, rehypeInlineCodeProperty } from './lib/plugins';\n\nimport {\n  createShikiHighlighterComponent,\n  type ShikiHighlighterProps,\n} from './lib/component';\n\nexport type { ShikiHighlighterProps };\n\nexport type {\n  UseShikiHighlighter,\n  Language,\n  Theme,\n  Themes,\n  Element,\n  HighlighterOptions,\n} from './lib/types';\n\nexport {\n  createJavaScriptRegexEngine,\n  createJavaScriptRawEngine,\n} from 'shiki/engine/javascript';\n\n/**\n * Highlight code with shiki (full bundle)\n *\n * @param code - Code to highlight\n * @param lang - Language (bundled or custom)\n * @param theme - Theme (bundled, multi-theme, or custom)\n * @param options - react-shiki options + shiki options\n * @returns Highlighted code as React elements or HTML string\n *\n * @example\n * ```tsx\n * const highlighted = useShikiHighlighter(\n *   'const x = 1;',\n *   'typescript',\n *   {\n *     light: 'github-light',\n *     dark: 'github-dark'\n *   }\n * );\n * ```\n *\n * Full bundle (~6.4MB minified, 1.2MB gzipped). For smaller bundles: `react-shiki/web` or `react-shiki/core`\n */\nexport const useShikiHighlighter: UseShikiHighlighter = (\n  code,\n  lang,\n  themeInput,\n  options = {}\n) => {\n  return useBaseHook(\n    code,\n    lang,\n    themeInput,\n    options,\n    createFullHighlighter\n  );\n};\n\n/**\n * ShikiHighlighter component using the full bundle.\n * Includes all languages and themes for maximum compatibility.\n */\nexport const ShikiHighlighter = createShikiHighlighterComponent(\n  useShikiHighlighter\n);\nexport default ShikiHighlighter;\n"],"mappings":";;;;;;;;AAAA;AAAA,EACE;AAAA,OAIK;AACP,SAAS,6BAA6B;AAQtC,eAAsB,sBACpB,aACA,cACA,QACsB;AACtB,MAAI;AACF,WAAO,MAAM,wBAAwB;AAAA,MACnC,OAAO,CAAC,WAAW;AAAA,MACnB,QAAQ;AAAA,MACR,QAAQ,UAAU,sBAAsB,OAAO,YAAY,CAAC;AAAA,IAC9D,CAAC;AAAA,EACH,SAAS,OAAO;AACd,QAAI,iBAAiB,SAAS,MAAM,QAAQ,SAAS,UAAU,GAAG;AAChE,aAAO,MAAM,wBAAwB;AAAA,QACnC,OAAO,CAAC,WAAW;AAAA,QACnB,QAAQ;AAAA,QACR,QAAQ,UAAU,sBAAsB,OAAO,YAAY,CAAC;AAAA,MAC9D,CAAC;AAAA,IACH;AACA,UAAM;AAAA,EACR;AACF;;;ACbA;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAyBA,IAAMA,uBAA2C,CACtD,MACA,MACA,YACA,UAAU,CAAC,MACR;AACH,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAMO,IAAM,mBAAmB;AAAA,EAC9BA;AACF;AACA,IAAO,cAAQ;","names":["useShikiHighlighter"]}
+{"version":3,"sources":["../src/bundles/full.ts","../src/index.ts"],"sourcesContent":["import {\n  getSingletonHighlighter,\n  bundledLanguages,\n  type Highlighter,\n  type Awaitable,\n  type RegexEngine,\n} from 'shiki';\nimport { createOnigurumaEngine } from 'shiki/engine/oniguruma';\nimport type { Language, Theme } from '../lib/types';\nimport { isLoadableLanguage } from '../lib/language';\n\n/**\n * Creates a highlighter using the full Shiki bundle with all languages and themes.\n * This is the largest bundle but provides maximum compatibility.\n */\nexport async function createFullHighlighter(\n  langsToLoad: Language[],\n  themesToLoad: Theme[],\n  engine?: Awaitable<RegexEngine>\n): Promise<Highlighter> {\n  const langs = langsToLoad.filter((lang) =>\n    isLoadableLanguage(lang, bundledLanguages)\n  );\n\n  return await getSingletonHighlighter({\n    langs,\n    themes: themesToLoad,\n    engine: engine ?? createOnigurumaEngine(import('shiki/wasm')),\n  });\n}\n","import { useShikiHighlighter as useBaseHook } from './lib/hook';\nimport { createFullHighlighter } from './bundles/full';\nimport type { UseShikiHighlighter } from './lib/types';\n\nexport { isInlineCode, rehypeInlineCodeProperty } from './lib/plugins';\n\nimport {\n  createShikiHighlighterComponent,\n  type ShikiHighlighterProps,\n} from './lib/component';\n\nexport type { ShikiHighlighterProps };\n\nexport type {\n  UseShikiHighlighter,\n  Language,\n  Theme,\n  Themes,\n  Element,\n  HighlighterOptions,\n} from './lib/types';\n\nexport {\n  createJavaScriptRegexEngine,\n  createJavaScriptRawEngine,\n} from 'shiki/engine/javascript';\n\nexport type { LanguageRegistration } from 'shiki';\n\n/**\n * Highlight code with shiki (full bundle)\n *\n * @param code - Code to highlight\n * @param lang - Language (bundled or custom)\n * @param theme - Theme (bundled, multi-theme, or custom)\n * @param options - react-shiki options + shiki options\n * @returns Highlighted code as React elements or HTML string\n *\n * @example\n * ```tsx\n * const highlighted = useShikiHighlighter(\n *   'const x = 1;',\n *   'typescript',\n *   {\n *     light: 'github-light',\n *     dark: 'github-dark'\n *   }\n * );\n * ```\n *\n * Full bundle (~6.4MB minified, 1.2MB gzipped). For smaller bundles: `react-shiki/web` or `react-shiki/core`\n */\nexport const useShikiHighlighter: UseShikiHighlighter = (\n  code,\n  lang,\n  themeInput,\n  options = {}\n) => {\n  return useBaseHook(\n    code,\n    lang,\n    themeInput,\n    options,\n    createFullHighlighter\n  );\n};\n\n/**\n * ShikiHighlighter component using the full bundle.\n * Includes all languages and themes for maximum compatibility.\n */\nexport const ShikiHighlighter = createShikiHighlighterComponent(\n  useShikiHighlighter\n);\nexport default ShikiHighlighter;\n"],"mappings":";;;;;;;;;AAAA;AAAA,EACE;AAAA,EACA;AAAA,OAIK;AACP,SAAS,6BAA6B;AAQtC,eAAsB,sBACpB,aACA,cACA,QACsB;AACtB,QAAM,QAAQ,YAAY;AAAA,IAAO,CAAC,SAChC,mBAAmB,MAAM,gBAAgB;AAAA,EAC3C;AAEA,SAAO,MAAM,wBAAwB;AAAA,IACnC;AAAA,IACA,QAAQ;AAAA,IACR,QAAQ,UAAU,sBAAsB,OAAO,YAAY,CAAC;AAAA,EAC9D,CAAC;AACH;;;ACPA;AAAA,EACE;AAAA,EACA;AAAA,OACK;AA2BA,IAAMA,uBAA2C,CACtD,MACA,MACA,YACA,UAAU,CAAC,MACR;AACH,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAMO,IAAM,mBAAmB;AAAA,EAC9BA;AACF;AACA,IAAO,cAAQ;","names":["useShikiHighlighter"]}

package/dist/web.d.ts

@@ -1,9 +1,9 @@
 import * as react from 'react';
-import { S as ShikiHighlighterProps, U as UseShikiHighlighter } from './component-mMdHg8JD.js';
-export { E as Element, H as HighlighterOptions, L as Language, T as Theme, a as Themes, i as isInlineCode, r as rehypeInlineCodeProperty } from './component-mMdHg8JD.js';
+import { S as ShikiHighlighterProps, U as UseShikiHighlighter } from './component-CoSKNtmy.js';
+export { E as Element, H as HighlighterOptions, L as Language, T as Theme, a as Themes, i as isInlineCode, r as rehypeInlineCodeProperty } from './component-CoSKNtmy.js';
 export { createJavaScriptRawEngine, createJavaScriptRegexEngine } from 'shiki/engine/javascript';
+export { LanguageRegistration } from 'shiki/bundle/web';
 import 'shiki';
-import 'shiki/core';
 import 'hast';
 
 /**

package/dist/web.js

@@ -1,32 +1,26 @@
 import {
   createShikiHighlighterComponent,
   isInlineCode,
+  isLoadableLanguage,
   rehypeInlineCodeProperty,
   useShikiHighlighter
-} from "./chunk-SCXX26KJ.js";
+} from "./chunk-QPJZGYHO.js";
 
 // src/bundles/web.ts
 import {
-  getSingletonHighlighter
+  getSingletonHighlighter,
+  bundledLanguages
 } from "shiki/bundle/web";
 import { createOnigurumaEngine } from "shiki/engine/oniguruma";
 async function createWebHighlighter(langsToLoad, themesToLoad, engine) {
-  try {
-    return await getSingletonHighlighter({
-      langs: [langsToLoad],
-      themes: themesToLoad,
-      engine: engine ?? createOnigurumaEngine(import("shiki/wasm"))
-    });
-  } catch (error) {
-    if (error instanceof Error && error.message.includes("Language")) {
-      return await getSingletonHighlighter({
-        langs: ["plaintext"],
-        themes: themesToLoad,
-        engine: engine ?? createOnigurumaEngine(import("shiki/wasm"))
-      });
-    }
-    throw error;
-  }
+  const langs = langsToLoad.filter(
+    (lang) => isLoadableLanguage(lang, bundledLanguages)
+  );
+  return await getSingletonHighlighter({
+    langs,
+    themes: themesToLoad,
+    engine: engine ?? createOnigurumaEngine(import("shiki/wasm"))
+  });
 }
 
 // src/web.ts

package/dist/web.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/bundles/web.ts","../src/web.ts"],"sourcesContent":["import {\n  getSingletonHighlighter,\n  type Highlighter,\n  type Awaitable,\n  type RegexEngine,\n} from 'shiki/bundle/web';\nimport { createOnigurumaEngine } from 'shiki/engine/oniguruma';\nimport type { ShikiLanguageRegistration } from '../lib/extended-types';\nimport type { Theme } from '../lib/types';\n\n/**\n * Creates a highlighter using the web Shiki bundle with web-focused languages.\n * Smaller than the full bundle while covering most web development needs.\n * Includes: HTML, CSS, JS, TS, JSON, Markdown, Vue, JSX, Svelte, etc.\n */\nexport async function createWebHighlighter(\n  langsToLoad: ShikiLanguageRegistration,\n  themesToLoad: Theme[],\n  engine?: Awaitable<RegexEngine>\n): Promise<Highlighter> {\n  try {\n    return await getSingletonHighlighter({\n      langs: [langsToLoad],\n      themes: themesToLoad,\n      engine: engine ?? createOnigurumaEngine(import('shiki/wasm')),\n    });\n  } catch (error) {\n    if (error instanceof Error && error.message.includes('Language')) {\n      return await getSingletonHighlighter({\n        langs: ['plaintext'],\n        themes: themesToLoad,\n        engine: engine ?? createOnigurumaEngine(import('shiki/wasm')),\n      });\n    }\n    throw error;\n  }\n}\n","import { useShikiHighlighter as useBaseHook } from './lib/hook';\nimport { createWebHighlighter } from './bundles/web';\nimport type { UseShikiHighlighter } from './lib/types';\n\nexport { isInlineCode, rehypeInlineCodeProperty } from './lib/plugins';\n\nimport {\n  createShikiHighlighterComponent,\n  type ShikiHighlighterProps,\n} from './lib/component';\n\nexport type { ShikiHighlighterProps };\n\nexport type {\n  UseShikiHighlighter,\n  Language,\n  Theme,\n  Themes,\n  Element,\n  HighlighterOptions,\n} from './lib/types';\n\nexport {\n  createJavaScriptRegexEngine,\n  createJavaScriptRawEngine,\n} from 'shiki/engine/javascript';\n\n/**\n * Highlight code with shiki (web bundle)\n *\n * @param code - Code to highlight\n * @param lang - Language (bundled or custom)\n * @param theme - Theme (bundled, multi-theme, or custom)\n * @param options - react-shiki options + shiki options\n * @returns Highlighted code as React elements or HTML string\n *\n * @example\n * ```tsx\n * const highlighted = useShikiHighlighter(\n *   'const x = 1;',\n *   'typescript',\n *   {\n *     light: 'github-light',\n *     dark: 'github-dark'\n *   }\n * );\n * ```\n *\n * Web bundle (~3.8MB minified, 695KB gzipped). For other bundles: `react-shiki` or `react-shiki/core`\n */\nexport const useShikiHighlighter: UseShikiHighlighter = (\n  code,\n  lang,\n  themeInput,\n  options = {}\n) => {\n  return useBaseHook(\n    code,\n    lang,\n    themeInput,\n    options,\n    createWebHighlighter\n  );\n};\n\n/**\n * ShikiHighlighter component using the web bundle.\n * Includes web-focused languages for balanced size and functionality.\n */\nexport const ShikiHighlighter = createShikiHighlighterComponent(\n  useShikiHighlighter\n);\nexport default ShikiHighlighter;\n"],"mappings":";;;;;;;;AAAA;AAAA,EACE;AAAA,OAIK;AACP,SAAS,6BAA6B;AAStC,eAAsB,qBACpB,aACA,cACA,QACsB;AACtB,MAAI;AACF,WAAO,MAAM,wBAAwB;AAAA,MACnC,OAAO,CAAC,WAAW;AAAA,MACnB,QAAQ;AAAA,MACR,QAAQ,UAAU,sBAAsB,OAAO,YAAY,CAAC;AAAA,IAC9D,CAAC;AAAA,EACH,SAAS,OAAO;AACd,QAAI,iBAAiB,SAAS,MAAM,QAAQ,SAAS,UAAU,GAAG;AAChE,aAAO,MAAM,wBAAwB;AAAA,QACnC,OAAO,CAAC,WAAW;AAAA,QACnB,QAAQ;AAAA,QACR,QAAQ,UAAU,sBAAsB,OAAO,YAAY,CAAC;AAAA,MAC9D,CAAC;AAAA,IACH;AACA,UAAM;AAAA,EACR;AACF;;;ACdA;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAyBA,IAAMA,uBAA2C,CACtD,MACA,MACA,YACA,UAAU,CAAC,MACR;AACH,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAMO,IAAM,mBAAmB;AAAA,EAC9BA;AACF;AACA,IAAO,cAAQ;","names":["useShikiHighlighter"]}
+{"version":3,"sources":["../src/bundles/web.ts","../src/web.ts"],"sourcesContent":["import {\n  getSingletonHighlighter,\n  bundledLanguages,\n  type Highlighter,\n  type Awaitable,\n  type RegexEngine,\n} from 'shiki/bundle/web';\nimport { createOnigurumaEngine } from 'shiki/engine/oniguruma';\nimport type { Language, Theme } from '../lib/types';\nimport { isLoadableLanguage } from '../lib/language';\n\n/**\n * Creates a highlighter using the web Shiki bundle with web-focused languages.\n * Smaller than the full bundle while covering most web development needs.\n * Includes: HTML, CSS, JS, TS, JSON, Markdown, Vue, JSX, Svelte, etc.\n */\nexport async function createWebHighlighter(\n  langsToLoad: Language[],\n  themesToLoad: Theme[],\n  engine?: Awaitable<RegexEngine>\n): Promise<Highlighter> {\n  const langs = langsToLoad.filter((lang) =>\n    isLoadableLanguage(lang, bundledLanguages)\n  );\n\n  return await getSingletonHighlighter({\n    langs,\n    themes: themesToLoad,\n    engine: engine ?? createOnigurumaEngine(import('shiki/wasm')),\n  });\n}\n","import { useShikiHighlighter as useBaseHook } from './lib/hook';\nimport { createWebHighlighter } from './bundles/web';\nimport type { UseShikiHighlighter } from './lib/types';\n\nexport { isInlineCode, rehypeInlineCodeProperty } from './lib/plugins';\n\nimport {\n  createShikiHighlighterComponent,\n  type ShikiHighlighterProps,\n} from './lib/component';\n\nexport type { ShikiHighlighterProps };\n\nexport type {\n  UseShikiHighlighter,\n  Language,\n  Theme,\n  Themes,\n  Element,\n  HighlighterOptions,\n} from './lib/types';\n\nexport {\n  createJavaScriptRegexEngine,\n  createJavaScriptRawEngine,\n} from 'shiki/engine/javascript';\n\nexport type { LanguageRegistration } from 'shiki/bundle/web';\n\n/**\n * Highlight code with shiki (web bundle)\n *\n * @param code - Code to highlight\n * @param lang - Language (bundled or custom)\n * @param theme - Theme (bundled, multi-theme, or custom)\n * @param options - react-shiki options + shiki options\n * @returns Highlighted code as React elements or HTML string\n *\n * @example\n * ```tsx\n * const highlighted = useShikiHighlighter(\n *   'const x = 1;',\n *   'typescript',\n *   {\n *     light: 'github-light',\n *     dark: 'github-dark'\n *   }\n * );\n * ```\n *\n * Web bundle (~3.8MB minified, 695KB gzipped). For other bundles: `react-shiki` or `react-shiki/core`\n */\nexport const useShikiHighlighter: UseShikiHighlighter = (\n  code,\n  lang,\n  themeInput,\n  options = {}\n) => {\n  return useBaseHook(\n    code,\n    lang,\n    themeInput,\n    options,\n    createWebHighlighter\n  );\n};\n\n/**\n * ShikiHighlighter component using the web bundle.\n * Includes web-focused languages for balanced size and functionality.\n */\nexport const ShikiHighlighter = createShikiHighlighterComponent(\n  useShikiHighlighter\n);\nexport default ShikiHighlighter;\n"],"mappings":";;;;;;;;;AAAA;AAAA,EACE;AAAA,EACA;AAAA,OAIK;AACP,SAAS,6BAA6B;AAStC,eAAsB,qBACpB,aACA,cACA,QACsB;AACtB,QAAM,QAAQ,YAAY;AAAA,IAAO,CAAC,SAChC,mBAAmB,MAAM,gBAAgB;AAAA,EAC3C;AAEA,SAAO,MAAM,wBAAwB;AAAA,IACnC;AAAA,IACA,QAAQ;AAAA,IACR,QAAQ,UAAU,sBAAsB,OAAO,YAAY,CAAC;AAAA,EAC9D,CAAC;AACH;;;ACRA;AAAA,EACE;AAAA,EACA;AAAA,OACK;AA2BA,IAAMA,uBAA2C,CACtD,MACA,MACA,YACA,UAAU,CAAC,MACR;AACH,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAMO,IAAM,mBAAmB;AAAA,EAC9BA;AACF;AACA,IAAO,cAAQ;","names":["useShikiHighlighter"]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "react-shiki",
   "description": "Syntax highlighter component for react using shiki",
-  "version": "0.9.0",
+  "version": "0.9.2",
   "license": "MIT",
   "author": {
     "name": "Bassim Shahidy",
@@ -11,7 +11,7 @@
   "repository": {
     "type": "git",
     "directory": "package",
-    "url": "git+https://github.com/avgvstvs96/react-shiki.git"
+    "url": "https://github.com/AVGVSTVS96/react-shiki"
   },
   "homepage": "https://react-shiki.vercel.app/",
   "keywords": [
@@ -33,6 +33,10 @@
   "sideEffects": [
     "src/lib/styles.css"
   ],
+  "publishConfig": {
+    "access": "public",
+    "provenance": true
+  },
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -66,21 +70,21 @@
     "clsx": "^2.1.1",
     "dequal": "^2.0.3",
     "hast-util-to-jsx-runtime": "^2.3.6",
-    "shiki": "^3.11.0",
-    "unist-util-visit": "^5.0.0"
+    "shiki": "^4.0.0",
+    "unist-util-visit": "^5.1.0"
   },
   "devDependencies": {
-    "@testing-library/jest-dom": "^6.8.0",
-    "@testing-library/react": "^16.3.0",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.2",
     "@types/hast": "^3.0.4",
-    "@types/jest": "^29.5.14",
-    "@types/node": "22.17.2",
+    "@types/jest": "^30.0.0",
+    "@types/node": "25.3.3",
     "@types/react": "^19.1.10",
-    "@vitejs/plugin-react": "^4.7.0",
-    "html-react-parser": "^5.2.6",
-    "jsdom": "^26.1.0",
-    "tsup": "^8.5.0",
-    "vitest": "^3.2.4"
+    "@vitejs/plugin-react": "^5.1.4",
+    "html-react-parser": "^5.2.17",
+    "jsdom": "^28.1.0",
+    "tsup": "^8.5.1",
+    "vitest": "^4.0.18"
   },
   "scripts": {
     "dev": "tsup --watch",

package/dist/chunk-SCXX26KJ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/lib/hook.ts","../src/lib/utils.ts","../src/lib/resolvers.ts","../src/lib/transformers.ts","../src/lib/plugins.ts","#style-inject:#style-inject","../src/lib/styles.css","../src/lib/component.tsx"],"sourcesContent":["import {\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ReactNode,\n} from 'react';\n\nimport { jsx, jsxs, Fragment } from 'react/jsx-runtime';\nimport { toJsxRuntime } from 'hast-util-to-jsx-runtime';\n\nimport type {\n  CodeToHastOptions,\n  CodeOptionsSingleTheme,\n  CodeOptionsMultipleThemes,\n  Highlighter,\n  HighlighterCore,\n  Awaitable,\n  RegexEngine,\n  BundledTheme,\n} from 'shiki';\n\nimport type { ShikiLanguageRegistration } from './extended-types';\n\nimport type {\n  Language,\n  Theme,\n  HighlighterOptions,\n  TimeoutState,\n  Themes,\n} from './types';\n\nimport { throttleHighlighting, useStableOptions } from './utils';\nimport { resolveLanguage, resolveTheme } from './resolvers';\nimport { lineNumbersTransformer } from './transformers';\n\nconst DEFAULT_THEMES: Themes = {\n  light: 'github-light',\n  dark: 'github-dark',\n};\n\n/**\n * Base hook for syntax highlighting using Shiki.\n * This is the core implementation used by all entry points.\n *\n * @param code - The code to highlight\n * @param lang - Language for highlighting\n * @param themeInput - Theme or themes to use\n * @param options - Highlighting options\n * @param highlighterFactory - Factory function to create highlighter (internal use)\n */\nexport const useShikiHighlighter = (\n  code: string,\n  lang: Language,\n  themeInput: Theme | Themes,\n  options: HighlighterOptions = {},\n  highlighterFactory: (\n    langsToLoad: ShikiLanguageRegistration,\n    themesToLoad: Theme[],\n    engine?: Awaitable<RegexEngine>\n  ) => Promise<Highlighter | HighlighterCore>\n) => {\n  const [highlightedCode, setHighlightedCode] = useState<\n    ReactNode | string | null\n  >(null);\n\n  // Stabilize options, language and theme inputs to prevent unnecessary\n  // re-renders or recalculations when object references change\n  const [stableLang, langRev] = useStableOptions(lang);\n  const [stableTheme, themeRev] = useStableOptions(themeInput);\n  const [stableOpts, optsRev] = useStableOptions(options);\n\n  const { languageId, langsToLoad } = useMemo(\n    () =>\n      resolveLanguage(\n        stableLang,\n        stableOpts.customLanguages,\n        stableOpts.langAlias\n      ),\n    [stableLang, stableOpts.customLanguages, stableOpts.langAlias]\n  );\n\n  const { isMultiTheme, themeId, multiTheme, singleTheme, themesToLoad } =\n    useMemo(() => resolveTheme(stableTheme), [stableTheme]);\n\n  const timeoutControl = useRef<TimeoutState>({\n    nextAllowedTime: 0,\n    timeoutId: undefined,\n  });\n\n  const shikiOptions = useMemo<CodeToHastOptions>(() => {\n    const languageOption = { lang: languageId };\n    const {\n      defaultColor,\n      cssVariablePrefix,\n      showLineNumbers,\n      startingLineNumber,\n      ...restOptions\n    } = stableOpts;\n\n    const themeOptions = isMultiTheme\n      ? ({\n          themes: multiTheme || DEFAULT_THEMES,\n          defaultColor,\n          cssVariablePrefix,\n        } as CodeOptionsMultipleThemes<BundledTheme>)\n      : ({\n          theme: singleTheme || DEFAULT_THEMES.dark,\n        } as CodeOptionsSingleTheme<BundledTheme>);\n\n    const transformers = restOptions.transformers || [];\n    if (showLineNumbers) {\n      transformers.push(lineNumbersTransformer(startingLineNumber));\n    }\n\n    return {\n      ...languageOption,\n      ...themeOptions,\n      ...restOptions,\n      transformers,\n    };\n  }, [languageId, themeId, langRev, themeRev, optsRev]);\n\n  useEffect(() => {\n    let isMounted = true;\n\n    const highlightCode = async () => {\n      if (!languageId) return;\n\n      const highlighter = stableOpts.highlighter\n        ? stableOpts.highlighter\n        : await highlighterFactory(\n            langsToLoad as ShikiLanguageRegistration,\n            themesToLoad,\n            stableOpts.engine\n          );\n\n      const loadedLanguages = highlighter.getLoadedLanguages();\n      const langToUse = loadedLanguages.includes(languageId)\n        ? languageId\n        : 'plaintext';\n      const finalOptions = { ...shikiOptions, lang: langToUse };\n\n      if (isMounted) {\n        const output =\n          stableOpts.outputFormat === 'html'\n            ? highlighter.codeToHtml(code, finalOptions)\n            : toJsxRuntime(highlighter.codeToHast(code, finalOptions), {\n                jsx,\n                jsxs,\n                Fragment,\n              });\n        setHighlightedCode(output);\n      }\n    };\n\n    const { delay } = stableOpts;\n\n    if (delay) {\n      throttleHighlighting(highlightCode, timeoutControl, delay);\n    } else {\n      highlightCode().catch(console.error);\n    }\n\n    return () => {\n      isMounted = false;\n      clearTimeout(timeoutControl.current.timeoutId);\n    };\n  }, [\n    code,\n    shikiOptions,\n    stableOpts.delay,\n    stableOpts.highlighter,\n    langsToLoad,\n    themesToLoad,\n  ]);\n\n  return highlightedCode;\n};\n","import { useRef } from 'react';\nimport { dequal } from 'dequal';\n\nimport type { TimeoutState } from './types';\n\n/**\n * Returns a deep-stable reference and a version counter that only changes when content changes.\n * Includes optimizations for primitive values and reference equality.\n */\nexport const useStableOptions = <T>(value: T) => {\n  const ref = useRef(value);\n  const revision = useRef(0);\n\n  // Fast-path for primitive values\n  if (typeof value !== 'object' || value === null) {\n    if (value !== ref.current) {\n      ref.current = value;\n      revision.current += 1;\n    }\n    return [value, revision.current] as const;\n  }\n\n  // Reference equality check before expensive deep comparison\n  if (value !== ref.current) {\n    if (!dequal(value, ref.current)) {\n      ref.current = value;\n      revision.current += 1;\n    }\n  }\n\n  return [ref.current, revision.current] as const;\n};\n\n/**\n * Optionally throttles rapid sequential highlighting operations\n *\n * @example\n * const timeoutControl = useRef<TimeoutState>({\n *   nextAllowedTime: 0,\n *   timeoutId: undefined\n * });\n *\n * throttleHighlighting(highlightCode, timeoutControl, 1000);\n */\nexport const throttleHighlighting = (\n  performHighlight: () => Promise<void>,\n  timeoutControl: React.RefObject<TimeoutState>,\n  throttleMs: number\n) => {\n  const now = Date.now();\n  clearTimeout(timeoutControl.current.timeoutId);\n\n  const delay = Math.max(0, timeoutControl.current.nextAllowedTime - now);\n  timeoutControl.current.timeoutId = setTimeout(() => {\n    performHighlight().catch(console.error);\n    timeoutControl.current.nextAllowedTime = now + throttleMs;\n  }, delay);\n};\n","import type { Language, Theme, Themes } from './types';\nimport type { ThemeRegistrationAny } from 'shiki/core';\nimport type { LanguageRegistration } from './extended-types';\n\n/**\n * Resolved languages and metadata\n */\ntype LanguageResult = {\n  languageId: string;\n  displayLanguageId: string | null;\n  langsToLoad: Language;\n};\n\n/**\n * Resolves the language input to standardized IDs and objects for Shiki and UI display\n * @param lang The language input from props\n * @param customLanguages An array of custom textmate grammar objects or a single grammar object\n * @returns A LanguageResult object containing:\n *   - languageId: The resolved language ID\n *   - displayLanguageId: The display language ID\n *   - langToLoad: The language object or string id to load\n */\nexport const resolveLanguage = (\n  lang: Language,\n  customLanguages?: LanguageRegistration | LanguageRegistration[],\n  langAliases?: Record<string, string>\n): LanguageResult => {\n  const normalizedCustomLangs = customLanguages\n    ? Array.isArray(customLanguages)\n      ? customLanguages\n      : [customLanguages]\n    : [];\n\n  // Language is null or empty string\n  if (lang == null || (typeof lang === 'string' && !lang.trim())) {\n    return {\n      languageId: 'plaintext',\n      displayLanguageId: 'plaintext',\n      langsToLoad: undefined,\n    };\n  }\n\n  // Language is custom\n  if (typeof lang === 'object') {\n    return {\n      languageId: lang.name,\n      displayLanguageId: lang.name || null,\n      langsToLoad: lang,\n    };\n  }\n\n  // Language is string\n  const lowerLang = lang.toLowerCase();\n  const matches = (str: string | undefined): boolean =>\n    str?.toLowerCase() === lowerLang;\n\n  // Check if the string identifies a provided custom language\n  const customMatch = normalizedCustomLangs.find(\n    (cl) =>\n      matches(cl.name) ||\n      matches(cl.scopeName) ||\n      matches(cl.scopeName?.split('.').pop()) ||\n      cl.aliases?.some(matches) ||\n      cl.fileTypes?.some(matches)\n  );\n\n  if (customMatch) {\n    return {\n      languageId: customMatch.name || lang,\n      displayLanguageId: lang,\n      langsToLoad: customMatch,\n    };\n  }\n\n  // Check if language is aliased\n  if (langAliases?.[lang]) {\n    return {\n      languageId: langAliases[lang],\n      displayLanguageId: lang,\n      langsToLoad: langAliases[lang],\n    };\n  }\n\n  // For any other string, pass it through,\n  // fallback is handled in highlighter factories\n  return {\n    languageId: lang,\n    displayLanguageId: lang,\n    langsToLoad: lang,\n  };\n};\n\n/**\n * Resolved themes and metadata\n */\ninterface ThemeResult {\n  isMultiTheme: boolean;\n  themeId: Theme;\n  multiTheme?: Themes | ThemeRegistrationAny | null;\n  singleTheme?: Theme | undefined;\n  themesToLoad: Theme[];\n}\n\n/**\n * Determines theme configuration and returns the resolved theme with metadata\n * @param themeInput - The theme input, either as a string name or theme object\n * @returns Object containing:\n *   - isMultiTheme: If theme input is a multi-theme configuration\n *   - themeId: Theme reference identifier\n *   - multiTheme: The multi-theme config if it exists\n *   - singleTheme: The single theme if it exists\n *   - themesToLoad: The themes to load when creating the highlighter\n */\nexport function resolveTheme(themeInput: Theme | Themes): ThemeResult {\n  const isTextmateTheme =\n    typeof themeInput === 'object' &&\n    'tokenColors' in themeInput &&\n    Array.isArray(themeInput.tokenColors);\n\n  // Assume non textmate objects are multi theme configs\n  const isMultiThemeConfig =\n    typeof themeInput === 'object' &&\n    themeInput !== null &&\n    !isTextmateTheme;\n\n  const validMultiThemeObj =\n    typeof themeInput === 'object' &&\n    themeInput !== null &&\n    !isTextmateTheme &&\n    Object.entries(themeInput).some(\n      ([key, value]) =>\n        key &&\n        value &&\n        key.trim() !== '' &&\n        value !== '' &&\n        (typeof value === 'string' || isTextmateTheme)\n    );\n\n  if (isMultiThemeConfig) {\n    const themeId = validMultiThemeObj\n      ? `multi-${Object.values(themeInput)\n          .map(\n            (theme) =>\n              (typeof theme === 'string' ? theme : theme?.name) ||\n              'custom'\n          )\n          .sort()\n          .join('-')}`\n      : 'multi-default';\n\n    // If config is invalid, return null to handle fallback in `buildShikiOptions()`\n    return {\n      isMultiTheme: true,\n      themeId,\n      multiTheme: validMultiThemeObj ? themeInput : null,\n      themesToLoad: validMultiThemeObj ? Object.values(themeInput) : [],\n    };\n  }\n\n  return {\n    isMultiTheme: false,\n    themeId:\n      typeof themeInput === 'string'\n        ? themeInput\n        : themeInput?.name || 'custom',\n    singleTheme: themeInput,\n    themesToLoad: [themeInput],\n  };\n}\n","import type { ShikiTransformer } from 'shiki/core';\n\n/**\n * Creates a transformer that enables line numbers display\n * @param startLine - The starting line number (defaults to 1)\n */\nexport function lineNumbersTransformer(startLine = 1): ShikiTransformer {\n  return {\n    name: 'react-shiki:line-numbers',\n    code(node) {\n      this.addClassToHast(node, 'has-line-numbers');\n      if (startLine !== 1) {\n        const existingStyle = (node.properties?.style as string) || '';\n        const newStyle = existingStyle\n          ? `${existingStyle}; --line-start: ${startLine}`\n          : `--line-start: ${startLine}`;\n        node.properties = {\n          ...node.properties,\n          style: newStyle,\n        };\n      }\n    },\n    line(node) {\n      this.addClassToHast(node, 'line-numbers');\n      return node;\n    },\n  };\n}\n","import { visit } from 'unist-util-visit';\nimport type { Element } from './types';\n\n/**\n * Rehype plugin to add an 'inline' property to <code> elements\n * Sets 'inline' property to true if the <code> is not within a <pre> tag\n *\n * Pass this plugin to the `rehypePlugins` prop of react-markdown\n * You can then access `inline` as a prop in components passed to react-markdown\n *\n * @example\n * <ReactMarkdown rehypePlugins={[rehypeInlineCodeProperty]} />\n */\nexport function rehypeInlineCodeProperty() {\n  return (tree: any): undefined => {\n    visit(tree, 'element', (node: Element, _index, parent: Element) => {\n      if (node.tagName === 'code' && parent.tagName !== 'pre') {\n        node.properties.inline = true;\n      }\n    });\n  };\n}\n\n/**\n * Function to determine if code is inline based on the presence of line breaks\n *\n * @example\n * const isInline = node && isInlineCode(node: Element)\n */\nexport const isInlineCode = (node: Element): boolean => {\n  const textContent = (node.children || [])\n    .filter((child) => child.type === 'text')\n    .map((child) => child.value)\n    .join('');\n\n  return !textContent.includes('\\n');\n};\n","\n          export default function styleInject(css, { insertAt } = {}) {\n            if (!css || typeof document === 'undefined') return\n          \n            const head = document.head || document.getElementsByTagName('head')[0]\n            const style = document.createElement('style')\n            style.type = 'text/css'\n          \n            if (insertAt === 'top') {\n              if (head.firstChild) {\n                head.insertBefore(style, head.firstChild)\n              } else {\n                head.appendChild(style)\n              }\n            } else {\n              head.appendChild(style)\n            }\n          \n            if (style.styleSheet) {\n              style.styleSheet.cssText = css\n            } else {\n              style.appendChild(document.createTextNode(css))\n            }\n          }\n          ","import styleInject from '#style-inject';styleInject(\".relative {\\n  position: relative;\\n}\\n.defaultStyles pre {\\n  overflow: auto;\\n  border-radius: 0.5rem;\\n  padding-left: 1.5rem;\\n  padding-right: 1.5rem;\\n  padding-top: 1.25rem;\\n  padding-bottom: 1.25rem;\\n}\\n.languageLabel {\\n  position: absolute;\\n  right: 0.75rem;\\n  top: 0.5rem;\\n  font-family: monospace;\\n  font-size: 0.75rem;\\n  letter-spacing: -0.05em;\\n  color: rgba(107, 114, 128, 0.85);\\n}\\n.line-numbers::before {\\n  counter-increment: line-number;\\n  content: counter(line-number);\\n  display: inline-flex;\\n  justify-content: flex-end;\\n  align-items: flex-start;\\n  box-sizing: content-box;\\n  min-width: var(--line-numbers-width, 2ch);\\n  padding-left: var(--line-numbers-padding-left, 2ch);\\n  padding-right: var(--line-numbers-padding-right, 2ch);\\n  color: var(--line-numbers-foreground, rgba(107, 114, 128, 0.6));\\n  font-size: var(--line-numbers-font-size, inherit);\\n  font-weight: var(--line-numbers-font-weight, inherit);\\n  line-height: var(--line-numbers-line-height, inherit);\\n  font-family: var(--line-numbers-font-family, inherit);\\n  opacity: var(--line-numbers-opacity, 1);\\n  user-select: none;\\n  pointer-events: none;\\n}\\n.has-line-numbers {\\n  counter-reset: line-number calc(var(--line-start, 1) - 1);\\n  --line-numbers-foreground: rgba(107, 114, 128, 0.5);\\n  --line-numbers-width: 2ch;\\n  --line-numbers-padding-left: 0ch;\\n  --line-numbers-padding-right: 2ch;\\n  --line-numbers-font-size: inherit;\\n  --line-numbers-font-weight: inherit;\\n  --line-numbers-line-height: inherit;\\n  --line-numbers-font-family: inherit;\\n  --line-numbers-opacity: 1;\\n}\\n\")","import './styles.css';\nimport { clsx } from 'clsx';\nimport { resolveLanguage } from './resolvers';\n\nimport type {\n  HighlighterOptions,\n  Language,\n  Theme,\n  Themes,\n  UseShikiHighlighter,\n} from './types';\nimport { forwardRef } from 'react';\n\n/**\n * Props for the ShikiHighlighter component\n */\nexport interface ShikiHighlighterProps extends HighlighterOptions {\n  /**\n   * The programming language for syntax highlighting\n   * Supports custom textmate grammar objects in addition to Shiki's bundled languages\n   * @see https://shiki.style/languages\n   */\n  language: Language;\n\n  /**\n   * The code to be highlighted\n   */\n  children: string;\n\n  /**\n   * The color theme or themes for syntax highlighting\n   * Supports single, dual, or multiple themes\n   * Supports custom textmate theme objects in addition to Shiki's bundled themes\n   *\n   * @example\n   * theme='github-dark' // single theme\n   * theme={{ light: 'github-light', dark: 'github-dark' }} // multi-theme\n   *\n   * @see https://shiki.style/themes\n   */\n  theme: Theme | Themes;\n\n  /**\n   * Controls the application of default styles to the generated code blocks\n   *\n   * Default styles include padding, overflow handling, border radius, language label styling, and font settings\n   * @default true\n   */\n  addDefaultStyles?: boolean;\n\n  /**\n   * Add custom inline styles to the generated code block\n   */\n  style?: React.CSSProperties;\n\n  /**\n   * Add custom inline styles to the language label\n   */\n  langStyle?: React.CSSProperties;\n\n  /**\n   * Add custom CSS class names to the generated code block\n   */\n  className?: string;\n\n  /**\n   * Add custom CSS class names to the language label\n   */\n  langClassName?: string;\n\n  /**\n   * Whether to show the language label\n   * @default true\n   */\n  showLanguage?: boolean;\n\n  /**\n   * Whether to show line numbers\n   * @default false\n   */\n  showLineNumbers?: boolean;\n\n  /**\n   * Starting line number (when showLineNumbers is true)\n   * @default 1\n   */\n  startingLineNumber?: number;\n\n  /**\n   * The HTML element that wraps the generated code block.\n   * @default 'pre'\n   */\n  as?: React.ElementType;\n}\n\n/**\n * Base ShikiHighlighter component factory.\n * This creates a component that uses the provided hook implementation.\n */\nexport const createShikiHighlighterComponent = (\n  useShikiHighlighterImpl: UseShikiHighlighter\n) => {\n  return forwardRef<HTMLElement, ShikiHighlighterProps>(\n    (\n      {\n        language,\n        theme,\n        delay,\n        transformers,\n        defaultColor,\n        cssVariablePrefix,\n        addDefaultStyles = true,\n        style,\n        langStyle,\n        className,\n        langClassName,\n        showLanguage = true,\n        showLineNumbers = false,\n        startingLineNumber = 1,\n        children: code,\n        as: Element = 'pre',\n        customLanguages,\n        ...shikiOptions\n      },\n      ref\n    ) => {\n      // Destructure some options for use in hook\n      const options: HighlighterOptions = {\n        delay,\n        transformers,\n        customLanguages,\n        showLineNumbers,\n        defaultColor,\n        cssVariablePrefix,\n        startingLineNumber,\n        ...shikiOptions,\n      };\n\n      // Use resolveLanguage to get displayLanguageId directly\n      const { displayLanguageId } = resolveLanguage(\n        language,\n        customLanguages\n      );\n\n      const highlightedCode = useShikiHighlighterImpl(\n        code,\n        language,\n        theme,\n        options\n      );\n\n      const isHtmlOutput = typeof highlightedCode === 'string';\n\n      return (\n        <Element\n          ref={ref}\n          data-testid=\"shiki-container\"\n          className={clsx(\n            'relative',\n            'not-prose',\n            addDefaultStyles && 'defaultStyles',\n            className\n          )}\n          style={style}\n          id=\"shiki-container\"\n        >\n          {showLanguage && displayLanguageId ? (\n            <span\n              className={clsx('languageLabel', langClassName)}\n              style={langStyle}\n              id=\"language-label\"\n            >\n              {displayLanguageId}\n            </span>\n          ) : null}\n          {isHtmlOutput ? (\n            <div dangerouslySetInnerHTML={{ __html: highlightedCode }} />\n          ) : (\n            highlightedCode\n          )}\n        </Element>\n      );\n    }\n  );\n};\n"],"mappings":"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","names":["useRef","useRef","jsx","jsxs"]}