components-svelte 0.1.0

package/dist/utils/is-remote-url.js

@@ -0,0 +1,12 @@
+const isRemoteUrl = (url) => {
+    if (typeof url !== "string")
+        return false;
+    try {
+        const urlObj = new URL(url);
+        return urlObj.protocol === "https:" || urlObj.protocol === "http:";
+    }
+    catch {
+        return false;
+    }
+};
+export { isRemoteUrl };

package/dist/utils/make-marker-ids-unique.d.ts

@@ -0,0 +1,2 @@
+declare const makeMarkerIdsUnique: (svg: string, prefix: string) => string;
+export { makeMarkerIdsUnique };

package/dist/utils/make-marker-ids-unique.js

@@ -0,0 +1,36 @@
+const MARKER_IDS = [
+    "arrowhead",
+    "crosshead",
+    "filled-head",
+    "sequencenumber",
+    "compositionStart",
+    "compositionEnd",
+    "aggregationStart",
+    "aggregationEnd",
+    "dependencyStart",
+    "dependencyEnd",
+    "extensionStart",
+    "extensionEnd",
+    "lollipopStart",
+    "lollipopEnd",
+    "ZERO_OR_ONE_START",
+    "ZERO_OR_ONE_END",
+    "ONLY_ONE_START",
+    "ONLY_ONE_END",
+    "ZERO_OR_MORE_START",
+    "ZERO_OR_MORE_END",
+    "ONE_OR_MORE_START",
+    "ONE_OR_MORE_END",
+    "MD_PARENT_START",
+    "MD_PARENT_END",
+];
+const makeMarkerIdsUnique = (svg, prefix) => {
+    let result = svg;
+    for (const markerId of MARKER_IDS) {
+        const uniqueMarkerId = `${prefix}-${markerId}`;
+        result = result.replace(new RegExp(`id="${markerId}"`, "g"), `id="${uniqueMarkerId}"`);
+        result = result.replace(new RegExp(`url\\(#${markerId}\\)`, "g"), `url(#${uniqueMarkerId})`);
+    }
+    return result;
+};
+export { makeMarkerIdsUnique };

package/dist/utils/shiki/code-styling.d.ts

@@ -0,0 +1,13 @@
+import type { SHIKI_THEMES } from "./shiki-themes";
+type CodeBlockTheme = "dark" | "system";
+type ShikiTheme = (typeof SHIKI_THEMES)[number];
+type CodeStyling = CodeBlockTheme | {
+    languages?: {
+        custom?: string[];
+    };
+    theme?: ShikiTheme | {
+        light: ShikiTheme;
+        dark: ShikiTheme;
+    };
+} | undefined;
+export type { CodeStyling, CodeBlockTheme, ShikiTheme };

package/dist/utils/shiki/code-styling.js

@@ -0,0 +1 @@
+export {};

package/dist/utils/shiki/constants.d.ts

@@ -0,0 +1,21 @@
+import type { ShikiTheme } from "./code-styling";
+import { SHIKI_THEMES } from "./shiki-themes";
+declare const DEFAULT_DARK_THEME = "dark-plus";
+declare const DEFAULT_LIGHT_THEME = "github-light-default";
+type ShikiThemeType = (typeof SHIKI_THEMES)[number];
+declare const LINE_HIGHLIGHT_CLASS_NAME = "line-highlight";
+declare const LINE_FOCUS_CLASS_NAME = "line-focus";
+declare const LINE_DIFF_ADD_CLASS_NAME = "line-diff line-add";
+declare const LINE_DIFF_REMOVE_CLASS_NAME = "line-diff line-remove";
+declare const SHIKI_CLASSNAME = "shiki shiki-themes";
+declare const SHIKI_THEMES_EXCLUDING_CSS_VARIABLES_AND_DEFAULTS: ("red" | "andromeeda" | "aurora-x" | "ayu-dark" | "catppuccin-frappe" | "catppuccin-latte" | "catppuccin-macchiato" | "catppuccin-mocha" | "dracula" | "dracula-soft" | "everforest-dark" | "everforest-light" | "github-dark" | "github-dark-default" | "github-dark-dimmed" | "github-dark-high-contrast" | "github-light" | "github-light-high-contrast" | "gruvbox-dark-hard" | "gruvbox-dark-medium" | "gruvbox-dark-soft" | "gruvbox-light-hard" | "gruvbox-light-medium" | "gruvbox-light-soft" | "houston" | "kanagawa-dragon" | "kanagawa-lotus" | "kanagawa-wave" | "laserwave" | "light-plus" | "material-theme" | "material-theme-darker" | "material-theme-lighter" | "material-theme-ocean" | "material-theme-palenight" | "min-dark" | "min-light" | "monokai" | "night-owl" | "nord" | "one-dark-pro" | "one-light" | "plastic" | "poimandres" | "rose-pine" | "rose-pine-dawn" | "rose-pine-moon" | "slack-dark" | "slack-ochin" | "snazzy-light" | "solarized-dark" | "solarized-light" | "synthwave-84" | "tokyo-night" | "vesper" | "vitesse-black" | "vitesse-dark" | "vitesse-light")[];
+declare const DEFAULT_DARK_BG = "#0B0C0E";
+declare const DEFAULT_LIGHT_BG = "#FFFFFF";
+declare const THEMES: [ShikiTheme, ShikiTheme, ...ShikiTheme[]];
+declare const SHIKI_THEME_MAP: Record<"dark" | "light", ShikiTheme>;
+declare const LANGS: readonly ["bash", "c", "c++", "dart", "go", "java", "javascript", "json", "kotlin", "php", "python", "ruby", "rust", "swift", "csharp", "typescript", "tsx", "yaml"];
+type ShikiLanguage = (typeof LANGS)[number];
+declare const SHIKI_COLOR_REPLACEMENTS: Record<string, string | Record<string, string>>;
+declare const SHIKI_LANG_MAP: Record<string, ShikiLanguage>;
+declare const SHIKI_DISPLAY_LANG_MAP: Record<string, string>;
+export { SHIKI_CLASSNAME, SHIKI_LANG_MAP, SHIKI_COLOR_REPLACEMENTS, SHIKI_DISPLAY_LANG_MAP, SHIKI_THEME_MAP, SHIKI_THEMES_EXCLUDING_CSS_VARIABLES_AND_DEFAULTS, type ShikiLanguage, type ShikiThemeType, THEMES, LANGS, DEFAULT_DARK_BG, DEFAULT_LIGHT_BG, LINE_HIGHLIGHT_CLASS_NAME, LINE_FOCUS_CLASS_NAME, LINE_DIFF_ADD_CLASS_NAME, LINE_DIFF_REMOVE_CLASS_NAME, DEFAULT_DARK_THEME, DEFAULT_LIGHT_THEME, };

package/dist/utils/shiki/constants.js

@@ -0,0 +1,116 @@
+import { SHIKI_THEMES } from "./shiki-themes";
+const DEFAULT_DARK_THEME = "dark-plus";
+const DEFAULT_LIGHT_THEME = "github-light-default";
+const LINE_HIGHLIGHT_CLASS_NAME = "line-highlight";
+const LINE_FOCUS_CLASS_NAME = "line-focus";
+const LINE_DIFF_ADD_CLASS_NAME = "line-diff line-add";
+const LINE_DIFF_REMOVE_CLASS_NAME = "line-diff line-remove";
+const SHIKI_CLASSNAME = "shiki shiki-themes";
+const SHIKI_THEMES_EXCLUDING_CSS_VARIABLES_AND_DEFAULTS = SHIKI_THEMES.filter((theme) => theme !== "css-variables" &&
+    theme !== DEFAULT_DARK_THEME &&
+    theme !== DEFAULT_LIGHT_THEME);
+const DEFAULT_DARK_BG = "#0B0C0E";
+const DEFAULT_LIGHT_BG = "#FFFFFF";
+const THEMES = [
+    DEFAULT_DARK_THEME,
+    DEFAULT_LIGHT_THEME,
+    ...SHIKI_THEMES_EXCLUDING_CSS_VARIABLES_AND_DEFAULTS,
+];
+const SHIKI_THEME_MAP = {
+    dark: THEMES[0],
+    light: THEMES[1],
+};
+const LANGS = [
+    "bash",
+    "c",
+    "c++",
+    "dart",
+    "go",
+    "java",
+    "javascript",
+    "json",
+    "kotlin",
+    "php",
+    "python",
+    "ruby",
+    "rust",
+    "swift",
+    "csharp",
+    "typescript",
+    "tsx",
+    "yaml",
+];
+const SHIKI_COLOR_REPLACEMENTS = {
+    [THEMES[0]]: {
+        "#1e1e1e": DEFAULT_DARK_BG,
+    },
+};
+const SHIKI_LANG_MAP = {
+    curl: "bash",
+    bash: "bash",
+    sh: "bash",
+    shell: "bash",
+    zsh: "bash",
+    shellscript: "bash",
+    c: "c",
+    csharp: "csharp",
+    "c++": "c++",
+    cpp: "c++",
+    cc: "c++",
+    go: "go",
+    golang: "go",
+    java: "java",
+    javascript: "javascript",
+    js: "javascript",
+    node: "javascript",
+    nodejs: "javascript",
+    json: "json",
+    jsonc: "json",
+    json5: "json",
+    php: "php",
+    python: "python",
+    py: "python",
+    typescript: "typescript",
+    ts: "typescript",
+    tsx: "tsx",
+    react: "tsx",
+    reactts: "tsx",
+    "react-ts": "tsx",
+    jsx: "tsx",
+    ruby: "ruby",
+    rb: "ruby",
+    rust: "rust",
+    rs: "rust",
+    rustc: "rust",
+    swift: "swift",
+    kotlin: "kotlin",
+    kt: "kotlin",
+    dart: "dart",
+    flutter: "dart",
+    yaml: "yaml",
+    yml: "yaml",
+    toml: "yaml",
+};
+const SHIKI_DISPLAY_LANG_MAP = {
+    bash: "cURL",
+    c: "C",
+    "c++": "C++",
+    "c#": "C#",
+    ".NET": ".NET",
+    dart: "Dart",
+    go: "Go",
+    java: "Java",
+    javascript: "Javascript",
+    json: "JSON",
+    kotlin: "Kotlin",
+    node: "Node.js",
+    php: "PHP",
+    python: "Python",
+    ruby: "Ruby",
+    rust: "Rust",
+    swift: "Swift",
+    typescript: "Typescript",
+    tsx: "TSX",
+    yaml: "YAML",
+};
+export { SHIKI_CLASSNAME, SHIKI_LANG_MAP, SHIKI_COLOR_REPLACEMENTS, SHIKI_DISPLAY_LANG_MAP, SHIKI_THEME_MAP, SHIKI_THEMES_EXCLUDING_CSS_VARIABLES_AND_DEFAULTS, THEMES, LANGS, DEFAULT_DARK_BG, DEFAULT_LIGHT_BG, LINE_HIGHLIGHT_CLASS_NAME, LINE_FOCUS_CLASS_NAME, LINE_DIFF_ADD_CLASS_NAME, LINE_DIFF_REMOVE_CLASS_NAME, DEFAULT_DARK_THEME, DEFAULT_LIGHT_THEME, };

package/dist/utils/shiki/get-code-styling.d.ts

@@ -0,0 +1,9 @@
+import type { CodeStyling } from "./code-styling";
+import { type ShikiThemeType } from "./constants";
+declare const codeStylingToThemeOrThemes: (codeStylingFromConfig: CodeStyling) => {
+    themes: {
+        light: ShikiThemeType;
+        dark: ShikiThemeType;
+    };
+};
+export { codeStylingToThemeOrThemes };

package/dist/utils/shiki/get-code-styling.js

@@ -0,0 +1,38 @@
+import { DEFAULT_DARK_THEME, DEFAULT_LIGHT_THEME, } from "./constants";
+const codeStylingToThemeOrThemes = (codeStylingFromConfig) => {
+    if (typeof codeStylingFromConfig === "object" &&
+        codeStylingFromConfig &&
+        "theme" in codeStylingFromConfig &&
+        typeof codeStylingFromConfig.theme === "object" &&
+        codeStylingFromConfig.theme) {
+        return {
+            themes: codeStylingFromConfig.theme,
+        };
+    }
+    if (typeof codeStylingFromConfig === "object" &&
+        codeStylingFromConfig &&
+        "theme" in codeStylingFromConfig &&
+        typeof codeStylingFromConfig.theme === "string") {
+        return {
+            themes: {
+                light: codeStylingFromConfig.theme,
+                dark: codeStylingFromConfig.theme,
+            },
+        };
+    }
+    if (codeStylingFromConfig === "dark") {
+        return {
+            themes: {
+                light: DEFAULT_DARK_THEME,
+                dark: DEFAULT_DARK_THEME,
+            },
+        };
+    }
+    return {
+        themes: {
+            light: DEFAULT_LIGHT_THEME,
+            dark: DEFAULT_DARK_THEME,
+        },
+    };
+};
+export { codeStylingToThemeOrThemes };

package/dist/utils/shiki/get-shiki-background-colors.d.ts

@@ -0,0 +1,20 @@
+import type { CodeBlockTheme } from "./code-styling";
+declare const getShikiBackgroundColors: (codeBlockTheme: CodeBlockTheme, html: string | undefined, children: unknown) => {
+    light: string | undefined;
+    dark: string | undefined;
+} | undefined;
+declare const getBackgroundColorsFromHtml: (html: string, defaultBgColors: {
+    light: string;
+    dark: string;
+}) => {
+    light: string | undefined;
+    dark: string | undefined;
+};
+declare const getBackgroundColorsFromChildren: (children: unknown, defaultBgColors: {
+    light: string;
+    dark: string;
+}) => {
+    light: string | undefined;
+    dark: string | undefined;
+};
+export { getShikiBackgroundColors, getBackgroundColorsFromHtml, getBackgroundColorsFromChildren, };

package/dist/utils/shiki/get-shiki-background-colors.js

@@ -0,0 +1,56 @@
+import { DEFAULT_DARK_BG, DEFAULT_LIGHT_BG } from "./constants";
+const getShikiBackgroundColors = (codeBlockTheme, html, children) => {
+    const defaultBgColors = codeBlockTheme === "dark"
+        ? { light: DEFAULT_DARK_BG, dark: DEFAULT_DARK_BG }
+        : { light: DEFAULT_LIGHT_BG, dark: DEFAULT_DARK_BG };
+    if (html) {
+        return getBackgroundColorsFromHtml(html, defaultBgColors);
+    }
+    if (children) {
+        return getBackgroundColorsFromChildren(children, defaultBgColors);
+    }
+    return defaultBgColors;
+};
+const isTransparentOrUndefined = (color) => color === "transparent" || color === undefined;
+const getBackgroundColorsFromHtml = (html, defaultBgColors) => {
+    const styles = html.split('style="');
+    if (styles.length < 2) {
+        return defaultBgColors;
+    }
+    const backgroundColor = styles[1]
+        ?.split("background-color:")[1]
+        ?.split(";")[0];
+    const shikiDarkBgValue = styles[1]
+        ?.split("--shiki-dark-bg:")[1]
+        ?.split(";")[0];
+    return {
+        light: isTransparentOrUndefined(backgroundColor)
+            ? defaultBgColors.light
+            : backgroundColor,
+        dark: isTransparentOrUndefined(shikiDarkBgValue)
+            ? defaultBgColors.dark
+            : shikiDarkBgValue,
+    };
+};
+const getBackgroundColorsFromChildren = (children, defaultBgColors) => {
+    if (children &&
+        typeof children === "object" &&
+        "style" in children &&
+        children.style &&
+        typeof children.style === "object" &&
+        "backgroundColor" in children.style &&
+        typeof children.style.backgroundColor === "string" &&
+        "--shiki-dark-bg" in children.style &&
+        typeof children.style["--shiki-dark-bg"] === "string") {
+        return {
+            light: isTransparentOrUndefined(children.style.backgroundColor)
+                ? defaultBgColors.light
+                : children.style.backgroundColor,
+            dark: isTransparentOrUndefined(children.style["--shiki-dark-bg"])
+                ? defaultBgColors.dark
+                : children.style["--shiki-dark-bg"],
+        };
+    }
+    return defaultBgColors;
+};
+export { getShikiBackgroundColors, getBackgroundColorsFromHtml, getBackgroundColorsFromChildren, };

package/dist/utils/shiki/index.d.ts

@@ -0,0 +1,30 @@
+import type { ShikiTransformer } from "@shikijs/types";
+import type { CodeToHastOptions } from "shiki/types";
+import type { CodeStyling } from "./code-styling";
+import { SHIKI_CLASSNAME, type ShikiLanguage } from "./constants";
+declare const SHIKI_TRANSFORMERS: ShikiTransformer[];
+declare const highlighterPromise: Promise<void>;
+declare function getShikiLanguage(lang: string | undefined): ShikiLanguage;
+declare function getLanguageFromClassName(className: string | undefined, fallback?: string): string;
+declare function loadShikiThemes(codeblocks?: CodeStyling): Promise<void>;
+type ShikiHighlightedHtmlArgs = {
+    codeString: string;
+    codeBlockTheme: CodeStyling;
+    opts?: Partial<CodeToHastOptions> & {
+        highlightedLines?: number[];
+        focusedLines?: number[];
+        noAsync?: boolean;
+    };
+} & ({
+    className: string | undefined;
+    fileName?: string;
+} | {
+    language: string;
+});
+declare function getShikiHighlightedHtml(props: ShikiHighlightedHtmlArgs & {
+    opts: ShikiHighlightedHtmlArgs["opts"] & {
+        noAsync: true;
+    };
+}): string | undefined;
+declare function getShikiHighlightedHtml(props: ShikiHighlightedHtmlArgs): string | undefined | Promise<string | undefined>;
+export { SHIKI_CLASSNAME, SHIKI_TRANSFORMERS, highlighterPromise, getShikiLanguage, getLanguageFromClassName, loadShikiThemes, type ShikiHighlightedHtmlArgs, getShikiHighlightedHtml, };

package/dist/utils/shiki/index.js

@@ -0,0 +1,209 @@
+import { transformerMetaHighlight, transformerNotationDiff, transformerNotationFocus, transformerNotationHighlight, } from "@shikijs/transformers";
+import { createHighlighter, hastToHtml } from "shiki";
+import { createJavaScriptRegexEngine } from "shiki/engine/javascript";
+import { MAX_PREVIEW_BYTES } from "../../constants";
+import { codeStylingToThemeOrThemes } from "./get-code-styling";
+import { getShikiLanguageFromPreset } from "./snippet-presets";
+import { DEFAULT_DARK_THEME, DEFAULT_LIGHT_THEME, LANGS, LINE_DIFF_ADD_CLASS_NAME, LINE_DIFF_REMOVE_CLASS_NAME, LINE_FOCUS_CLASS_NAME, LINE_HIGHLIGHT_CLASS_NAME, SHIKI_COLOR_REPLACEMENTS, SHIKI_LANG_MAP, SHIKI_CLASSNAME, } from "./constants";
+import { getShikiWorker } from "./worker-client";
+const matchAlgorithm = {
+    matchAlgorithm: "v3",
+};
+const SHIKI_TRANSFORMERS = [
+    transformerMetaHighlight({
+        className: LINE_HIGHLIGHT_CLASS_NAME,
+    }),
+    transformerNotationHighlight({
+        ...matchAlgorithm,
+        classActiveLine: LINE_HIGHLIGHT_CLASS_NAME,
+    }),
+    transformerNotationFocus({
+        ...matchAlgorithm,
+        classActiveLine: LINE_FOCUS_CLASS_NAME,
+    }),
+    transformerNotationDiff({
+        ...matchAlgorithm,
+        classLineAdd: LINE_DIFF_ADD_CLASS_NAME,
+        classLineRemove: LINE_DIFF_REMOVE_CLASS_NAME,
+    }),
+];
+const jsEngine = createJavaScriptRegexEngine({
+    forgiving: true,
+    cache: new Map(),
+});
+let highlighter;
+let highlighterError;
+let highlighterResolved = false;
+const highlighterPromise = createHighlighter({
+    themes: [],
+    langs: [...LANGS],
+    engine: jsEngine,
+})
+    .then((resolvedHighlighter) => {
+    highlighter = resolvedHighlighter;
+})
+    .catch((error) => {
+    console.error(error);
+    highlighterError =
+        error ?? new Error("Unknown error occurred initializing highlighter");
+})
+    .finally(() => {
+    highlighterResolved = true;
+});
+function getShikiLanguage(lang) {
+    const text = "text";
+    if (lang === undefined) {
+        return text;
+    }
+    const possibleStatusCode = Number(lang);
+    if (!Number.isNaN(possibleStatusCode) &&
+        possibleStatusCode > 99 &&
+        possibleStatusCode < 600) {
+        return "json";
+    }
+    const lower = lang.toLowerCase();
+    const presetLang = getShikiLanguageFromPreset(lower);
+    return SHIKI_LANG_MAP[presetLang] ?? SHIKI_LANG_MAP[lower] ?? text;
+}
+function getLanguageFromClassName(className, fallback) {
+    // biome-ignore lint/performance/useTopLevelRegex: TODO
+    const match = /language-(\w+)/.exec(className ?? "");
+    return match ? (match[1] ?? "text") : (fallback ?? "text");
+}
+function getThemesForCodeStyling(codeblocks) {
+    if (typeof codeblocks === "string" || !codeblocks) {
+        return codeblocks === "system" || !codeblocks
+            ? [DEFAULT_DARK_THEME, DEFAULT_LIGHT_THEME]
+            : [DEFAULT_DARK_THEME];
+    }
+    const { theme } = codeblocks;
+    if (typeof theme === "string") {
+        return [theme];
+    }
+    if (typeof theme === "object" && theme) {
+        return [theme.dark, theme.light];
+    }
+    return [DEFAULT_DARK_THEME, DEFAULT_LIGHT_THEME];
+}
+function areThemesLoaded(codeblocks) {
+    if (!highlighter) {
+        return false;
+    }
+    const loaded = highlighter.getLoadedThemes();
+    const needed = getThemesForCodeStyling(codeblocks);
+    return needed.every((theme) => theme === "css-variables" || loaded.includes(theme));
+}
+async function loadShikiThemes(codeblocks) {
+    await highlighterPromise;
+    if (!highlighter) {
+        return;
+    }
+    const loaded = highlighter.getLoadedThemes();
+    const toLoad = getThemesForCodeStyling(codeblocks).filter((theme) => theme !== "css-variables" && !loaded.includes(theme));
+    if (toLoad.length > 0) {
+        await highlighter.loadTheme(...toLoad);
+    }
+}
+function getShikiHighlightedHtml(props) {
+    if (!props.codeString || highlighterError !== undefined) {
+        return undefined;
+    }
+    if (highlighter === undefined) {
+        if (props.opts?.noAsync || highlighterResolved) {
+            return undefined;
+        }
+        return highlighterPromise
+            .then(() => getShikiHighlightedHtml(props))
+            .catch(() => undefined);
+    }
+    if (!areThemesLoaded(props.codeBlockTheme)) {
+        if (props.opts?.noAsync) {
+            return undefined;
+        }
+        return loadShikiThemes(props.codeBlockTheme)
+            .then(() => getShikiHighlightedHtml(props))
+            .catch(() => undefined);
+    }
+    let lang;
+    if ("language" in props) {
+        if (props.language === "text") {
+            return undefined;
+        }
+        lang = props.language;
+    }
+    else {
+        if (props.className === "lang-text") {
+            return undefined;
+        }
+        lang = getLanguageFromClassName(props.className, props.fileName);
+    }
+    if (props.codeString.length > MAX_PREVIEW_BYTES * 5) {
+        return undefined;
+    }
+    if (props.codeString.length > MAX_PREVIEW_BYTES) {
+        try {
+            const worker = getShikiWorker();
+            return worker ? worker.highlight(props) : undefined;
+        }
+        catch {
+            return undefined;
+        }
+    }
+    let html;
+    if (lang) {
+        try {
+            const serializer = props.opts?.highlightedLines?.length || props.opts?.focusedLines?.length
+                ? "codeToHast"
+                : "codeToHtml";
+            const code = props.codeString.trim();
+            const themeOrThemes = codeStylingToThemeOrThemes(props.codeBlockTheme);
+            html = highlighter[serializer](code, {
+                lang: getShikiLanguage(lang),
+                ...themeOrThemes,
+                colorReplacements: { ...SHIKI_COLOR_REPLACEMENTS },
+                transformers: SHIKI_TRANSFORMERS,
+                tabindex: false,
+                ...props.opts,
+            });
+        }
+        catch (error) {
+            console.error("error getting shiki highlighted html", error);
+        }
+    }
+    if (typeof html !== "object") {
+        return html;
+    }
+    const firstChild = html.children[0];
+    if (!firstChild) {
+        return undefined;
+    }
+    if (firstChild.type === "element" && firstChild.tagName === "pre") {
+        const codeElement = firstChild.children[0];
+        if (!codeElement?.children) {
+            return hastToHtml(html);
+        }
+        const spanElements = codeElement.children.filter((child) => child.type === "element" && child.tagName === "span");
+        // biome-ignore lint/complexity/noExcessiveCognitiveComplexity: TODO
+        spanElements.forEach((child, index) => {
+            const actualIndex = index + 1;
+            if (typeof child.properties.class === "string") {
+                if (props.opts?.highlightedLines?.includes(actualIndex)) {
+                    child.properties.class += " " + LINE_HIGHLIGHT_CLASS_NAME;
+                }
+                if (props.opts?.focusedLines?.includes(actualIndex)) {
+                    child.properties.class += " " + LINE_FOCUS_CLASS_NAME;
+                }
+            }
+            else if (Array.isArray(child.properties.class)) {
+                if (props.opts?.highlightedLines?.includes(actualIndex)) {
+                    child.properties.class.push(LINE_HIGHLIGHT_CLASS_NAME);
+                }
+                if (props.opts?.focusedLines?.includes(actualIndex)) {
+                    child.properties.class.push(LINE_FOCUS_CLASS_NAME);
+                }
+            }
+        });
+    }
+    return hastToHtml(html);
+}
+export { SHIKI_CLASSNAME, SHIKI_TRANSFORMERS, highlighterPromise, getShikiLanguage, getLanguageFromClassName, loadShikiThemes, getShikiHighlightedHtml, };

package/dist/utils/shiki/lib.d.ts

@@ -0,0 +1,4 @@
+declare function getCodeString(children: unknown, className?: string, forceExtract?: boolean): string;
+declare function calculateCodeLinesFromHtml(html: string | undefined): number;
+declare function useCalculateCodeLines(html: string | undefined, existingNumberOfLines?: number): number | undefined;
+export { getCodeString, calculateCodeLinesFromHtml, useCalculateCodeLines };

package/dist/utils/shiki/lib.js

@@ -0,0 +1,49 @@
+import { dedent } from "../dedent";
+import { getNodeText } from "../get-node-text";
+import { SHIKI_CLASSNAME } from "./constants";
+function findShikiClassName(children) {
+    if (!children || typeof children !== "object") {
+        return false;
+    }
+    if (Array.isArray(children)) {
+        for (const child of children) {
+            if (findShikiClassName(child)) {
+                return true;
+            }
+        }
+    }
+    if ("props" in children &&
+        children.props &&
+        typeof children.props === "object") {
+        if ("className" in children.props &&
+            typeof children.props.className === "string" &&
+            children.props.className.includes(SHIKI_CLASSNAME)) {
+            return true;
+        }
+        if ("children" in children.props) {
+            return findShikiClassName(children.props.children);
+        }
+    }
+    return false;
+}
+function getCodeString(children, className, forceExtract = false) {
+    const isShiki = className?.includes(SHIKI_CLASSNAME) || findShikiClassName(children);
+    if (isShiki && !forceExtract) {
+        return "";
+    }
+    return dedent(getNodeText(children));
+}
+function calculateCodeLinesFromHtml(html) {
+    if (!html || typeof html !== "string") {
+        return 0;
+    }
+    const lineMatches = html.match(/<span class="line/g);
+    return lineMatches ? lineMatches.length : 0;
+}
+function useCalculateCodeLines(html, existingNumberOfLines) {
+    if (existingNumberOfLines !== undefined) {
+        return existingNumberOfLines;
+    }
+    return html ? calculateCodeLinesFromHtml(html) : undefined;
+}
+export { getCodeString, calculateCodeLinesFromHtml, useCalculateCodeLines };

package/dist/utils/shiki/shiki-themes.d.ts

@@ -0,0 +1,2 @@
+declare const SHIKI_THEMES: readonly ["andromeeda", "aurora-x", "ayu-dark", "catppuccin-frappe", "catppuccin-latte", "catppuccin-macchiato", "catppuccin-mocha", "dark-plus", "dracula", "dracula-soft", "everforest-dark", "everforest-light", "github-dark", "github-dark-default", "github-dark-dimmed", "github-dark-high-contrast", "github-light", "github-light-default", "github-light-high-contrast", "gruvbox-dark-hard", "gruvbox-dark-medium", "gruvbox-dark-soft", "gruvbox-light-hard", "gruvbox-light-medium", "gruvbox-light-soft", "houston", "kanagawa-dragon", "kanagawa-lotus", "kanagawa-wave", "laserwave", "light-plus", "material-theme", "material-theme-darker", "material-theme-lighter", "material-theme-ocean", "material-theme-palenight", "min-dark", "min-light", "monokai", "night-owl", "nord", "one-dark-pro", "one-light", "plastic", "poimandres", "red", "rose-pine", "rose-pine-dawn", "rose-pine-moon", "slack-dark", "slack-ochin", "snazzy-light", "solarized-dark", "solarized-light", "synthwave-84", "tokyo-night", "vesper", "vitesse-black", "vitesse-dark", "vitesse-light", "css-variables"];
+export { SHIKI_THEMES };