@lapismd/mira 0.0.1

package/dist/preview/frontmatter/types.js

@@ -0,0 +1,27 @@
+export const frontmatterPropertyKindOptions = [
+    "text",
+    "number",
+    "checkbox",
+    "date",
+    "datetime",
+    "tags",
+    "aliases",
+    "multitext",
+    "array",
+    "object",
+    "null",
+];
+export const frontmatterPropertyKindLabels = {
+    aliases: "Aliases",
+    array: "List",
+    checkbox: "Checkbox",
+    date: "Date",
+    datetime: "Date and time",
+    multitext: "Text list",
+    null: "Empty",
+    number: "Number",
+    object: "Object",
+    tags: "Tags",
+    text: "Text",
+    unknown: "Unknown",
+};

package/dist/preview/frontmatter/values.d.ts

@@ -0,0 +1,5 @@
+import type { FrontmatterConfig, FrontmatterProperty, FrontmatterPropertyKind } from "./types";
+export declare function formatFrontmatterValue(value: unknown): string;
+export declare function parseFrontmatterValue(value: string, kind: FrontmatterPropertyKind): unknown;
+export declare function coerceFrontmatterValue(value: unknown, kind: FrontmatterPropertyKind, config?: FrontmatterConfig, property?: FrontmatterProperty): unknown;
+//# sourceMappingURL=values.d.ts.map

package/dist/preview/frontmatter/values.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"values.d.ts","sourceRoot":"","sources":["../../../src/preview/frontmatter/values.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,iBAAiB,EACjB,mBAAmB,EACnB,uBAAuB,EACxB,MAAM,SAAS,CAAC;AAIjB,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,CAc7D;AAED,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,MAAM,EACb,IAAI,EAAE,uBAAuB,GAC5B,OAAO,CAkCT;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,OAAO,EACd,IAAI,EAAE,uBAAuB,EAC7B,MAAM,CAAC,EAAE,iBAAiB,EAC1B,QAAQ,CAAC,EAAE,mBAAmB,GAC7B,OAAO,CAkDT"}

package/dist/preview/frontmatter/values.js

@@ -0,0 +1,96 @@
+import { parseDocument, stringify } from "yaml";
+import { isRecord, isTextNumberArray } from "./predicates";
+import { resolveFrontmatterWidget, toBuiltinFrontmatterKind } from "./widgets";
+export function formatFrontmatterValue(value) {
+    if (Array.isArray(value)) {
+        if (isTextNumberArray(value)) {
+            return value.map((item) => String(item)).join(", ");
+        }
+        return stringify(value).trimEnd();
+    }
+    if (value === null || value === undefined) {
+        return "";
+    }
+    if (typeof value === "object") {
+        return stringify(value).trimEnd();
+    }
+    return String(value);
+}
+export function parseFrontmatterValue(value, kind) {
+    const builtinKind = toBuiltinFrontmatterKind(kind);
+    if (builtinKind === "number") {
+        const nextNumber = Number(value);
+        return Number.isFinite(nextNumber) ? nextNumber : value;
+    }
+    if (builtinKind === "checkbox") {
+        return value === "true";
+    }
+    if (builtinKind === "tags" ||
+        builtinKind === "aliases" ||
+        builtinKind === "multitext") {
+        return value
+            .split(",")
+            .map((item) => item.trim())
+            .filter(Boolean);
+    }
+    if (builtinKind === "array" ||
+        builtinKind === "object" ||
+        builtinKind === "unknown") {
+        const document = parseDocument(value, { prettyErrors: false });
+        if (document.errors.length || document.warnings.length) {
+            return value;
+        }
+        return document.toJS();
+    }
+    if (builtinKind === "null") {
+        return value.trim() ? value : null;
+    }
+    return value;
+}
+export function coerceFrontmatterValue(value, kind, config, property) {
+    const widget = resolveFrontmatterWidget(config, kind);
+    if (widget?.normalize) {
+        return widget.normalize(value, property);
+    }
+    const builtinKind = toBuiltinFrontmatterKind(widget?.fallbackKind ?? kind);
+    if (builtinKind === "number") {
+        const numberValue = Number(value);
+        return Number.isFinite(numberValue) ? numberValue : 0;
+    }
+    if (builtinKind === "checkbox") {
+        return Boolean(value);
+    }
+    if (builtinKind === "date" ||
+        builtinKind === "datetime" ||
+        builtinKind === "text") {
+        return value === null || value === undefined
+            ? ""
+            : Array.isArray(value)
+                ? value.join(", ")
+                : String(value);
+    }
+    if (builtinKind === "tags" ||
+        builtinKind === "aliases" ||
+        builtinKind === "multitext") {
+        if (Array.isArray(value)) {
+            return value.map((item) => String(item)).filter(Boolean);
+        }
+        if (typeof value === "string") {
+            return value
+                .split(/[,;]+/)
+                .map((item) => item.trim())
+                .filter(Boolean);
+        }
+        return [];
+    }
+    if (builtinKind === "array") {
+        return Array.isArray(value) ? value : [];
+    }
+    if (builtinKind === "object") {
+        return isRecord(value) ? value : {};
+    }
+    if (builtinKind === "null") {
+        return null;
+    }
+    return value;
+}

package/dist/preview/frontmatter/widgets.d.ts

@@ -0,0 +1,9 @@
+import type { BuiltinFrontmatterPropertyKind, FrontmatterConfig, FrontmatterPropertyKind, FrontmatterTypeDefinition } from "./types";
+export declare function frontmatterPropertyIcon(kind: FrontmatterPropertyKind, config?: FrontmatterConfig): string;
+export declare function frontmatterPropertyLabel(kind: FrontmatterPropertyKind, config?: FrontmatterConfig): string;
+export declare function frontmatterTypeOptions(config?: FrontmatterConfig): FrontmatterTypeDefinition[];
+export declare function resolveConfiguredFrontmatterType(config: FrontmatterConfig | undefined, pathString: string, key: string): FrontmatterTypeDefinition | null;
+export declare function resolveFrontmatterWidget(config: FrontmatterConfig | undefined, kind: FrontmatterPropertyKind): FrontmatterTypeDefinition | null;
+export declare function toBuiltinFrontmatterKind(kind: FrontmatterPropertyKind): BuiltinFrontmatterPropertyKind;
+export declare function isBuiltinFrontmatterKind(kind: FrontmatterPropertyKind): kind is BuiltinFrontmatterPropertyKind;
+//# sourceMappingURL=widgets.d.ts.map

package/dist/preview/frontmatter/widgets.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"widgets.d.ts","sourceRoot":"","sources":["../../../src/preview/frontmatter/widgets.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,8BAA8B,EAC9B,iBAAiB,EACjB,uBAAuB,EACvB,yBAAyB,EAC1B,MAAM,SAAS,CAAC;AAMjB,wBAAgB,uBAAuB,CACrC,IAAI,EAAE,uBAAuB,EAC7B,MAAM,CAAC,EAAE,iBAAiB,GACzB,MAAM,CAsBR;AAED,wBAAgB,wBAAwB,CACtC,IAAI,EAAE,uBAAuB,EAC7B,MAAM,CAAC,EAAE,iBAAiB,GACzB,MAAM,CASR;AAED,wBAAgB,sBAAsB,CACpC,MAAM,CAAC,EAAE,iBAAiB,GACzB,yBAAyB,EAAE,CAiC7B;AAWD,wBAAgB,gCAAgC,CAC9C,MAAM,EAAE,iBAAiB,GAAG,SAAS,EACrC,UAAU,EAAE,MAAM,EAClB,GAAG,EAAE,MAAM,GACV,yBAAyB,GAAG,IAAI,CAOlC;AAED,wBAAgB,wBAAwB,CACtC,MAAM,EAAE,iBAAiB,GAAG,SAAS,EACrC,IAAI,EAAE,uBAAuB,GAC5B,yBAAyB,GAAG,IAAI,CAUlC;AAED,wBAAgB,wBAAwB,CACtC,IAAI,EAAE,uBAAuB,GAC5B,8BAA8B,CAEhC;AAED,wBAAgB,wBAAwB,CACtC,IAAI,EAAE,uBAAuB,GAC5B,IAAI,IAAI,8BAA8B,CAexC"}

package/dist/preview/frontmatter/widgets.js

@@ -0,0 +1,104 @@
+import { frontmatterPropertyKindLabels, frontmatterPropertyKindOptions, } from "./types";
+export function frontmatterPropertyIcon(kind, config) {
+    const configured = resolveFrontmatterWidget(config, kind);
+    if (configured?.icon) {
+        return configured.icon;
+    }
+    const icons = {
+        aliases: "lucide-at-sign",
+        array: "lucide-brackets",
+        checkbox: "lucide-check-square",
+        date: "lucide-calendar",
+        datetime: "lucide-clock",
+        multitext: "lucide-list",
+        null: "lucide-file-question",
+        number: "lucide-binary",
+        object: "lucide-braces",
+        tags: "lucide-hash",
+        text: "lucide-text",
+        unknown: "lucide-file-question",
+    };
+    return icons[toBuiltinFrontmatterKind(kind)] ?? icons.unknown;
+}
+export function frontmatterPropertyLabel(kind, config) {
+    const configured = resolveFrontmatterWidget(config, kind);
+    if (configured?.label) {
+        return configured.label;
+    }
+    return (frontmatterPropertyKindLabels[toBuiltinFrontmatterKind(kind)] ??
+        String(kind));
+}
+export function frontmatterTypeOptions(config) {
+    const options = new Map();
+    for (const kind of frontmatterPropertyKindOptions) {
+        options.set(kind, {
+            type: kind,
+            label: frontmatterPropertyKindLabels[kind],
+            icon: frontmatterPropertyIcon(kind),
+        });
+    }
+    for (const definition of Object.values(config?.properties ?? {})) {
+        const normalized = normalizeTypeDefinition(definition);
+        options.set(normalized.type, {
+            ...normalized,
+            label: normalized.label ?? frontmatterPropertyLabel(normalized.type),
+            icon: normalized.icon ?? frontmatterPropertyIcon(normalized.type),
+        });
+    }
+    for (const definition of Object.values(config?.types ?? {})) {
+        const normalized = normalizeTypeDefinition(definition);
+        options.set(normalized.type, {
+            ...normalized,
+            label: normalized.label ?? frontmatterPropertyLabel(normalized.type),
+            icon: normalized.icon ?? frontmatterPropertyIcon(normalized.type),
+        });
+    }
+    for (const definition of config?.widgets ?? []) {
+        options.set(definition.type, {
+            ...definition,
+            label: definition.label ?? frontmatterPropertyLabel(definition.type),
+            icon: definition.icon ?? frontmatterPropertyIcon(definition.type),
+        });
+    }
+    return [...options.values()];
+}
+function normalizeTypeDefinition(definition) {
+    if (typeof definition === "string") {
+        return { type: definition };
+    }
+    return definition;
+}
+export function resolveConfiguredFrontmatterType(config, pathString, key) {
+    const candidate = config?.types?.[pathString] ??
+        config?.types?.[key] ??
+        config?.properties?.[pathString] ??
+        config?.properties?.[key];
+    return candidate ? normalizeTypeDefinition(candidate) : null;
+}
+export function resolveFrontmatterWidget(config, kind) {
+    const configured = config?.widgets?.find((widget) => widget.type === kind) ??
+        Object.values(config?.properties ?? {})
+            .map(normalizeTypeDefinition)
+            .find((definition) => definition.type === kind) ??
+        Object.values(config?.types ?? {})
+            .map(normalizeTypeDefinition)
+            .find((definition) => definition.type === kind);
+    return configured ?? null;
+}
+export function toBuiltinFrontmatterKind(kind) {
+    return isBuiltinFrontmatterKind(kind) ? kind : "text";
+}
+export function isBuiltinFrontmatterKind(kind) {
+    return (kind === "unknown" ||
+        kind === "tags" ||
+        kind === "aliases" ||
+        kind === "multitext" ||
+        kind === "array" ||
+        kind === "object" ||
+        kind === "text" ||
+        kind === "number" ||
+        kind === "checkbox" ||
+        kind === "date" ||
+        kind === "datetime" ||
+        kind === "null");
+}

package/dist/preview/index.d.ts

@@ -0,0 +1,18 @@
+import MarkdownPreview from "./markdown-preview.svelte";
+import MarkdownOutline from "./markdown-outline.svelte";
+import Markdown from "./renderer/markdown.svelte";
+import FileEmbed from "./file-embed.svelte";
+import MarkdownEmbed from "./markdown-embed.svelte";
+import NoteLink from "./note-link.svelte";
+import FrontmatterEditor from "./components/frontmatter.svelte";
+import EditableMarkdownPreview from "./editable-markdown-preview.svelte";
+export { EditableMarkdownPreview, FileEmbed, FrontmatterEditor, Markdown, MarkdownEmbed, MarkdownOutline, MarkdownPreview, NoteLink, };
+export type { MarkdownOutlineItem, MarkdownOutlineVariant } from "./outline";
+export { default as Renderer } from "./renderer/renderer.svelte";
+export * from "./code-language";
+export type * from "./renderer/types";
+export * from "./embed-target";
+export * from "./remark";
+export { FrontmatterController, createFrontmatterPropertyManager, type FrontmatterControllerCommit, type FrontmatterControllerOptions, type FrontmatterPropertyManager, type CreateFrontmatterPropertyManagerOptions, type FrontmatterRenameResult, type FrontmatterConfig, type FrontmatterProperty, type FrontmatterPropertyKind, type FrontmatterTypeDefinition, } from "./frontmatter";
+export default MarkdownPreview;
+//# sourceMappingURL=index.d.ts.map

package/dist/preview/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/preview/index.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,2BAA2B,CAAC;AACxD,OAAO,eAAe,MAAM,2BAA2B,CAAC;AACxD,OAAO,QAAQ,MAAM,4BAA4B,CAAC;AAClD,OAAO,SAAS,MAAM,qBAAqB,CAAC;AAC5C,OAAO,aAAa,MAAM,yBAAyB,CAAC;AACpD,OAAO,QAAQ,MAAM,oBAAoB,CAAC;AAC1C,OAAO,iBAAiB,MAAM,iCAAiC,CAAC;AAChE,OAAO,uBAAuB,MAAM,oCAAoC,CAAC;AAEzE,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,iBAAiB,EACjB,QAAQ,EACR,aAAa,EACb,eAAe,EACf,eAAe,EACf,QAAQ,GACT,CAAC;AACF,YAAY,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,MAAM,WAAW,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AACjE,cAAc,iBAAiB,CAAC;AAChC,mBAAmB,kBAAkB,CAAC;AACtC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,OAAO,EACL,qBAAqB,EACrB,gCAAgC,EAChC,KAAK,2BAA2B,EAChC,KAAK,4BAA4B,EACjC,KAAK,0BAA0B,EAC/B,KAAK,uCAAuC,EAC5C,KAAK,uBAAuB,EAC5B,KAAK,iBAAiB,EACtB,KAAK,mBAAmB,EACxB,KAAK,uBAAuB,EAC5B,KAAK,yBAAyB,GAC/B,MAAM,eAAe,CAAC;AACvB,eAAe,eAAe,CAAC"}

package/dist/preview/index.js

@@ -0,0 +1,15 @@
+import MarkdownPreview from "./markdown-preview.svelte";
+import MarkdownOutline from "./markdown-outline.svelte";
+import Markdown from "./renderer/markdown.svelte";
+import FileEmbed from "./file-embed.svelte";
+import MarkdownEmbed from "./markdown-embed.svelte";
+import NoteLink from "./note-link.svelte";
+import FrontmatterEditor from "./components/frontmatter.svelte";
+import EditableMarkdownPreview from "./editable-markdown-preview.svelte";
+export { EditableMarkdownPreview, FileEmbed, FrontmatterEditor, Markdown, MarkdownEmbed, MarkdownOutline, MarkdownPreview, NoteLink, };
+export { default as Renderer } from "./renderer/renderer.svelte";
+export * from "./code-language";
+export * from "./embed-target";
+export * from "./remark";
+export { FrontmatterController, createFrontmatterPropertyManager, } from "./frontmatter";
+export default MarkdownPreview;

package/dist/preview/markdown-embed.svelte

@@ -0,0 +1,80 @@
+<script lang="ts">
+  import type {
+    MiraAssetResolver,
+    MiraExtension,
+    MiraFileAdapter,
+    MiraLinkResolver,
+    MiraListCallout,
+    MiraMarkdownPostProcessor,
+    MiraRendererComponents,
+  } from "@lapismd/mira/extensions";
+  import type { FrontmatterConfig } from "./components/frontmatter-utils";
+  import MarkdownPreview from "./markdown-preview.svelte";
+
+  type Props = {
+    value?: string;
+    sourcePath?: string;
+    extensions?: MiraExtension[];
+    components?: MiraRendererComponents;
+    class?: string;
+    highlight?: boolean;
+    linkResolver?: MiraLinkResolver;
+    assetResolver?: MiraAssetResolver;
+    fileAdapter?: MiraFileAdapter;
+    frontmatterOpen?: boolean;
+    frontmatterConfig?: FrontmatterConfig;
+    headingIds?: boolean;
+    headingIdPrefix?: string;
+    htmlPolicy?: "trusted" | "safe";
+    emoji?: boolean;
+    dialog?: boolean;
+    listCallouts?: MiraListCallout[];
+    postProcess?: MiraMarkdownPostProcessor;
+    onChange?: (replacement: string, from: number, to: number) => void;
+  };
+
+  let {
+    value = "",
+    sourcePath,
+    extensions = [],
+    components = {},
+    class: className = "",
+    highlight = true,
+    linkResolver,
+    assetResolver,
+    fileAdapter,
+    frontmatterOpen = false,
+    frontmatterConfig,
+    headingIds = false,
+    headingIdPrefix = "",
+    htmlPolicy = "trusted",
+    emoji = false,
+    dialog = false,
+    listCallouts = [],
+    postProcess,
+    onChange,
+  }: Props = $props();
+</script>
+
+<MarkdownPreview
+  {value}
+  {sourcePath}
+  {extensions}
+  {components}
+  class={className}
+  {highlight}
+  {linkResolver}
+  {assetResolver}
+  {fileAdapter}
+  {frontmatterOpen}
+  {frontmatterConfig}
+  {headingIds}
+  {headingIdPrefix}
+  {htmlPolicy}
+  {emoji}
+  {dialog}
+  {listCallouts}
+  {postProcess}
+  {onChange}
+  embed
+/>

package/dist/preview/markdown-embed.svelte.d.ts

@@ -0,0 +1,27 @@
+import type { MiraAssetResolver, MiraExtension, MiraFileAdapter, MiraLinkResolver, MiraListCallout, MiraMarkdownPostProcessor, MiraRendererComponents } from "@lapismd/mira/extensions";
+import type { FrontmatterConfig } from "./components/frontmatter-utils";
+type Props = {
+    value?: string;
+    sourcePath?: string;
+    extensions?: MiraExtension[];
+    components?: MiraRendererComponents;
+    class?: string;
+    highlight?: boolean;
+    linkResolver?: MiraLinkResolver;
+    assetResolver?: MiraAssetResolver;
+    fileAdapter?: MiraFileAdapter;
+    frontmatterOpen?: boolean;
+    frontmatterConfig?: FrontmatterConfig;
+    headingIds?: boolean;
+    headingIdPrefix?: string;
+    htmlPolicy?: "trusted" | "safe";
+    emoji?: boolean;
+    dialog?: boolean;
+    listCallouts?: MiraListCallout[];
+    postProcess?: MiraMarkdownPostProcessor;
+    onChange?: (replacement: string, from: number, to: number) => void;
+};
+declare const MarkdownEmbed: import("svelte").Component<Props, {}, "">;
+type MarkdownEmbed = ReturnType<typeof MarkdownEmbed>;
+export default MarkdownEmbed;
+//# sourceMappingURL=markdown-embed.svelte.d.ts.map

package/dist/preview/markdown-embed.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"markdown-embed.svelte.d.ts","sourceRoot":"","sources":["../../src/preview/markdown-embed.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACR,iBAAiB,EACjB,aAAa,EACb,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,yBAAyB,EACzB,sBAAsB,EACvB,MAAM,0BAA0B,CAAC;AACpC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAItE,KAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;IAC7B,UAAU,CAAC,EAAE,sBAAsB,CAAC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC,aAAa,CAAC,EAAE,iBAAiB,CAAC;IAClC,WAAW,CAAC,EAAE,eAAe,CAAC;IAC9B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAChC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,YAAY,CAAC,EAAE,eAAe,EAAE,CAAC;IACjC,WAAW,CAAC,EAAE,yBAAyB,CAAC;IACxC,QAAQ,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACpE,CAAC;AAkCJ,QAAA,MAAM,aAAa,2CAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/preview/markdown-outline.svelte

@@ -0,0 +1,256 @@
+<script lang="ts">
+  import {
+    activeMarkdownOutlineId,
+    findMarkdownOutlineScrollRoot,
+    slugHeadingText,
+    type MarkdownOutlineItem,
+    type MarkdownOutlineVariant,
+  } from "./outline";
+
+  type Props = {
+    value: string;
+    headingIdPrefix?: string;
+    minLevel?: number;
+    maxLevel?: number;
+    variant?: MarkdownOutlineVariant;
+    title?: string;
+    root?: HTMLElement | null;
+    class?: string;
+  };
+
+  let {
+    value,
+    headingIdPrefix = "",
+    minLevel = 1,
+    maxLevel = 6,
+    variant = "floating",
+    title = "On this page",
+    root = null,
+    class: className = "",
+  }: Props = $props();
+
+  let activeId = $state("");
+  let hoverOpen = $state(false);
+  let pinnedOpen = $state(false);
+  let focusOpen = $state(false);
+  let containerElement = $state<HTMLDivElement | null>(null);
+
+  const items = $derived(
+    extractOutline(value, {
+      headingIdPrefix,
+      minLevel,
+      maxLevel,
+    }),
+  );
+  const isOpen = $derived(
+    variant === "floating" && (hoverOpen || pinnedOpen || focusOpen),
+  );
+
+  function extractOutline(
+    markdown: string,
+    options: {
+      headingIdPrefix: string;
+      minLevel: number;
+      maxLevel: number;
+    },
+  ): MarkdownOutlineItem[] {
+    const counts = new Map<string, number>();
+    const headings: MarkdownOutlineItem[] = [];
+
+    for (const line of markdown.split(/\r?\n/)) {
+      const match = /^(#{1,6})\s+(.+?)\s*#*\s*$/.exec(line);
+      if (!match) continue;
+
+      const marker = match[1] ?? "";
+      const content = match[2] ?? "";
+      const level = marker.length;
+      if (level < options.minLevel || level > options.maxLevel) continue;
+
+      const text = content.replace(/[`*_~[\]()]/g, "").trim();
+      const slug = `${options.headingIdPrefix}${slugHeadingText(text)}`;
+      const count = counts.get(slug) ?? 0;
+      counts.set(slug, count + 1);
+      headings.push({
+        id: count === 0 ? slug : `${slug}-${count}`,
+        level,
+        text,
+      });
+    }
+
+    return headings;
+  }
+
+  function headingElement(item: MarkdownOutlineItem): HTMLElement | null {
+    if (root) {
+      return root.querySelector<HTMLElement>(`[id="${CSS.escape(item.id)}"]`);
+    }
+
+    return document.getElementById(item.id);
+  }
+
+  function navigateToHeading(item: MarkdownOutlineItem): void {
+    const target = headingElement(item);
+    if (!target) return;
+
+    const reduceMotion =
+      window.matchMedia?.("(prefers-reduced-motion: reduce)").matches ?? false;
+    target.scrollIntoView({
+      behavior: reduceMotion ? "auto" : "smooth",
+      block: "start",
+    });
+    if (!target.hasAttribute("tabindex")) target.setAttribute("tabindex", "-1");
+    target.focus({ preventScroll: true });
+    activeId = item.id;
+  }
+
+  function handleRailClick(event: MouseEvent, item: MarkdownOutlineItem): void {
+    event.preventDefault();
+    event.stopPropagation();
+    pinnedOpen = true;
+    navigateToHeading(item);
+  }
+
+  function handlePanelClick(
+    event: MouseEvent,
+    item: MarkdownOutlineItem,
+  ): void {
+    event.preventDefault();
+    event.stopPropagation();
+    navigateToHeading(item);
+    pinnedOpen = false;
+  }
+
+  function handleFocusOut(): void {
+    window.setTimeout(() => {
+      if (!containerElement?.contains(document.activeElement))
+        focusOpen = false;
+    }, 0);
+  }
+
+  function handleDocumentPointerDown(event: PointerEvent): void {
+    const target = event.target;
+    if (target instanceof Node && containerElement?.contains(target)) return;
+    hoverOpen = false;
+    pinnedOpen = false;
+    focusOpen = false;
+  }
+
+  $effect(() => {
+    if (variant !== "floating" || items.length === 0) return;
+
+    const firstTarget = headingElement(items[0]!);
+    const scrollRoot = findMarkdownOutlineScrollRoot(firstTarget, root);
+    let frame = 0;
+    const scheduleUpdate = () => {
+      cancelAnimationFrame(frame);
+      frame = requestAnimationFrame(() => {
+        activeId = activeMarkdownOutlineId(
+          items,
+          headingElement,
+          scrollRoot,
+          96,
+          document.activeElement,
+        );
+      });
+    };
+
+    scheduleUpdate();
+    window.addEventListener("scroll", scheduleUpdate, { passive: true });
+    window.addEventListener("resize", scheduleUpdate);
+    scrollRoot?.addEventListener("scroll", scheduleUpdate, { passive: true });
+
+    return () => {
+      cancelAnimationFrame(frame);
+      window.removeEventListener("scroll", scheduleUpdate);
+      window.removeEventListener("resize", scheduleUpdate);
+      scrollRoot?.removeEventListener("scroll", scheduleUpdate);
+    };
+  });
+
+  $effect(() => {
+    if (!isOpen) return;
+    document.addEventListener("pointerdown", handleDocumentPointerDown, true);
+    return () => {
+      document.removeEventListener(
+        "pointerdown",
+        handleDocumentPointerDown,
+        true,
+      );
+    };
+  });
+</script>
+
+{#if items.length > 0}
+  {#if variant === "floating"}
+    <div
+      class={`mira-markdown-outline mira-markdown-outline--floating ${isOpen ? "is-open" : ""} ${className}`.trim()}
+      role="group"
+      aria-label="Document outline"
+      bind:this={containerElement}
+      onpointerenter={() => (hoverOpen = true)}
+      onpointerleave={() => (hoverOpen = false)}
+      onfocusin={() => (focusOpen = true)}
+      onfocusout={handleFocusOut}
+    >
+      <ol
+        class="mira-markdown-outline__rail"
+        aria-label="Document heading markers"
+      >
+        {#each items as item (item.id)}
+          <li>
+            <button
+              type="button"
+              class="mira-markdown-outline__rail-marker"
+              aria-label={`Open outline and scroll to ${item.text}`}
+              aria-current={activeId === item.id ? "true" : undefined}
+              data-level={item.level}
+              onclick={(event) => handleRailClick(event, item)}
+            >
+              <span
+                class={`mira-markdown-outline__rail-line ${activeId === item.id ? "is-active" : ""}`}
+                aria-hidden="true"
+              ></span>
+            </button>
+          </li>
+        {/each}
+      </ol>
+
+      {#if isOpen}
+        <nav
+          class="mira-markdown-outline__panel"
+          aria-label="Table of contents"
+        >
+          <p class="mira-markdown-outline__title">{title}</p>
+          <ol>
+            {#each items as item (item.id)}
+              <li>
+                <button
+                  type="button"
+                  class={`mira-markdown-outline__item ${activeId === item.id ? "is-active" : ""}`}
+                  aria-current={activeId === item.id ? "true" : undefined}
+                  data-level={item.level}
+                  onclick={(event) => handlePanelClick(event, item)}
+                >
+                  {item.text}
+                </button>
+              </li>
+            {/each}
+          </ol>
+        </nav>
+      {/if}
+    </div>
+  {:else}
+    <nav
+      class={`mira-markdown-outline mira-markdown-outline--sidebar ${className}`.trim()}
+      aria-label="Table of contents"
+    >
+      <ol>
+        {#each items as item (item.id)}
+          <li style={`--mira-outline-level: ${item.level}`}>
+            <a href={`#${item.id}`}>{item.text}</a>
+          </li>
+        {/each}
+      </ol>
+    </nav>
+  {/if}
+{/if}

package/dist/preview/markdown-outline.svelte.d.ts

@@ -0,0 +1,15 @@
+import { type MarkdownOutlineVariant } from "./outline";
+type Props = {
+    value: string;
+    headingIdPrefix?: string;
+    minLevel?: number;
+    maxLevel?: number;
+    variant?: MarkdownOutlineVariant;
+    title?: string;
+    root?: HTMLElement | null;
+    class?: string;
+};
+declare const MarkdownOutline: import("svelte").Component<Props, {}, "">;
+type MarkdownOutline = ReturnType<typeof MarkdownOutline>;
+export default MarkdownOutline;
+//# sourceMappingURL=markdown-outline.svelte.d.ts.map

package/dist/preview/markdown-outline.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"markdown-outline.svelte.d.ts","sourceRoot":"","sources":["../../src/preview/markdown-outline.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAKH,KAAK,sBAAsB,EAC5B,MAAM,WAAW,CAAC;AAGnB,KAAK,KAAK,GAAG;IACX,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAkNJ,QAAA,MAAM,eAAe,2CAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}