@chenzy-design/svelte 0.3.0 → 0.4.1

package/dist/lottie/Lottie.svelte.d.ts

@@ -0,0 +1,32 @@
+import type { AnimationItem, LottiePlayer } from 'lottie-web';
+/**
+ * lottie.loadAnimation 的入参类型（path 或 animationData 二选一 + 通用配置）。
+ * 用 Partial 对齐 Semi foundation（`Partial<ArgsType<typeof lottie.loadAnimation>[0]>`）：
+ * container 可缺省（缺省时由组件自管 div 提供），故整体设为可选。
+ */
+export type LottieParams = Partial<Parameters<LottiePlayer['loadAnimation']>[0]>;
+/**
+ * getLottie —— 获取全局 lottie 包。静态方法版本，与 Semi `Lottie.getLottie` 对齐。
+ * 动态 import lottie-web 并返回其 default 导出（浏览器端）。SSR 下无 window 会抛错。
+ */
+export declare function getLottie(): Promise<LottiePlayer>;
+interface Props {
+    /** 用于配置动画相关参数，透传 lottie.loadAnimation（path / animationData / renderer / loop / autoplay / container 等）。**必填**。 */
+    params: LottieParams;
+    /** 容器宽度（作用于根 div 的 width，如 "300px"）。params.container 存在时不生效。 */
+    width?: string;
+    /** 容器高度（作用于根 div 的 height，如 "300px"）。params.container 存在时不生效。 */
+    height?: string;
+    /** 获取当前动画 AnimationItem 实例（含 play/pause/setSpeed 等方法）。mount 及 params 变更后回调。 */
+    getAnimationInstance?: (animation: AnimationItem | null) => void;
+    /** 获取全局 lottie 包（含 setQuality 等全局方法）。mount 时回调。 */
+    getLottie?: (lottie: LottiePlayer) => void;
+    /** 根节点类名。 */
+    class?: string;
+    /** 根节点内联样式。 */
+    style?: string;
+}
+declare const Lottie: import("svelte").Component<Props, {}, "">;
+type Lottie = ReturnType<typeof Lottie>;
+export default Lottie;
+//# sourceMappingURL=Lottie.svelte.d.ts.map

package/dist/lottie/Lottie.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Lottie.svelte.d.ts","sourceRoot":"","sources":["../../src/lottie/Lottie.svelte.ts"],"names":[],"mappings":"AAGE,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE9D;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,OAAO,CAAC,UAAU,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAEjF;;;GAGG;AACH,wBAAsB,SAAS,IAAI,OAAO,CAAC,YAAY,CAAC,CAGvD;AAMD,UAAU,KAAK;IACb,kHAAkH;IAClH,MAAM,EAAE,YAAY,CAAC;IACrB,gEAAgE;IAChE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iEAAiE;IACjE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,+EAA+E;IAC/E,oBAAoB,CAAC,EAAE,CAAC,SAAS,EAAE,aAAa,GAAG,IAAI,KAAK,IAAI,CAAC;IACjE,mDAAmD;IACnD,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC3C,aAAa;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAgGH,QAAA,MAAM,MAAM,2CAAwC,CAAC;AACrD,KAAK,MAAM,GAAG,UAAU,CAAC,OAAO,MAAM,CAAC,CAAC;AACxC,eAAe,MAAM,CAAC"}

package/dist/lottie/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Lottie, getLottie, type LottieParams } from './Lottie.svelte';
+export { meta as lottieMeta } from './meta.js';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lottie/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,SAAS,EAAE,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAClF,OAAO,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,WAAW,CAAC"}

package/dist/lottie/index.js

@@ -0,0 +1,2 @@
+export { default as Lottie, getLottie } from './Lottie.svelte';
+export { meta as lottieMeta } from './meta.js';

package/dist/lottie/meta.d.ts

@@ -0,0 +1,76 @@
+/**
+ * Machine-readable component metadata for AI/docs consumption.
+ * Lottie — 严格对齐 Semi Design Lottie（semi-ui/lottie）。内部基于 lottie-web 渲染动画。
+ * 零 token（Semi 仅一个无样式 .semi-lottie class）；无播放控制 prop，全部经 getAnimationInstance→AnimationItem。
+ */
+export declare const meta: {
+    readonly name: "Lottie";
+    readonly category: "plus";
+    readonly stage: "M6";
+    readonly semiEquivalent: "Lottie";
+    readonly description: "在网页中展示 Lottie 动画，内部基于 lottie-web 渲染（严格对齐 Semi）。相较直接用 lottie-web，无需关心动画容器的创建与销毁、动画本身的生命周期。params 透传 lottie.loadAnimation（path CDN / animationData 打包 / renderer / loop / autoplay / container 等）；getAnimationInstance 获取当前 AnimationItem（含 play/pause/setSpeed 等方法）实现播放控制；getLottie 获取全局 lottie 包，亦可用静态方法 Lottie.getLottie()。params.container 存在时组件不渲染 DOM（用户自管容器）。";
+    readonly exports: readonly ["Lottie"];
+    readonly props: readonly [{
+        readonly name: "params";
+        readonly type: "LottieParams";
+        readonly default: "—";
+        readonly desc: "必填。用于配置动画相关参数，透传 lottie.loadAnimation（path / animationData / renderer / loop / autoplay / container 等，默认 renderer:svg / loop:true / autoplay:true）";
+    }, {
+        readonly name: "width";
+        readonly type: "string";
+        readonly default: "undefined";
+        readonly desc: "容器宽度（作用于根 div，如 \"300px\"）；params.container 存在时不生效";
+    }, {
+        readonly name: "height";
+        readonly type: "string";
+        readonly default: "undefined";
+        readonly desc: "容器高度（作用于根 div，如 \"300px\"）；params.container 存在时不生效";
+    }, {
+        readonly name: "getAnimationInstance";
+        readonly type: "(animation: AnimationItem | null) => void";
+        readonly default: "undefined";
+        readonly desc: "获取当前动画 AnimationItem 实例（含 play/pause/setSpeed/goToAndStop 等方法）；mount 及 params 变更后回调";
+    }, {
+        readonly name: "getLottie";
+        readonly type: "(lottie: LottiePlayer) => void";
+        readonly default: "undefined";
+        readonly desc: "获取全局 lottie 包（含 setQuality 等全局方法）；mount 时回调。等价具名导出 getLottie()";
+    }, {
+        readonly name: "class";
+        readonly type: "string";
+        readonly default: "undefined";
+        readonly desc: "根节点类名";
+    }, {
+        readonly name: "style";
+        readonly type: "string";
+        readonly default: "undefined";
+        readonly desc: "根节点内联样式";
+    }];
+    readonly events: readonly [];
+    readonly slots: readonly [];
+    readonly staticMembers: readonly [{
+        readonly name: "getLottie";
+        readonly desc: "具名导出（异步函数），返回全局 lottie 包（lottie-web 的 default 导出）。对齐 Semi Lottie.getLottie 静态方法；Svelte 组件无法挂静态方法，故以具名导出提供";
+    }];
+    readonly a11y: {
+        readonly hasRole: false;
+        readonly focusable: false;
+        readonly note: "Semi Lottie 为纯动画展示容器，无内建 role/aria；无障碍名由使用方按场景在容器上补充。";
+    };
+    readonly tokens: readonly [];
+    readonly responsive: false;
+    readonly examples: readonly [{
+        readonly title: "path CDN 基本用法";
+        readonly code: "<Lottie params={{ path: jsonURL }} width=\"300px\" height=\"300px\" />";
+    }, {
+        readonly title: "animationData 打包用法";
+        readonly code: "<Lottie params={{ animationData: data }} width=\"300px\" height=\"300px\" />";
+    }, {
+        readonly title: "获取当前动画实例";
+        readonly code: "<Lottie params={{ path: jsonURL }} getAnimationInstance={(a) => console.log(a)} />";
+    }, {
+        readonly title: "获取全局 Lottie";
+        readonly code: "<Lottie params={{ path: jsonURL }} getLottie={(l) => console.log(l)} />";
+    }];
+};
+//# sourceMappingURL=meta.d.ts.map

package/dist/lottie/meta.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../src/lottie/meta.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4EP,CAAC"}

package/dist/lottie/meta.js

@@ -0,0 +1,81 @@
+/**
+ * Machine-readable component metadata for AI/docs consumption.
+ * Lottie — 严格对齐 Semi Design Lottie（semi-ui/lottie）。内部基于 lottie-web 渲染动画。
+ * 零 token（Semi 仅一个无样式 .semi-lottie class）；无播放控制 prop，全部经 getAnimationInstance→AnimationItem。
+ */
+export const meta = {
+    name: 'Lottie',
+    category: 'plus',
+    stage: 'M6',
+    semiEquivalent: 'Lottie',
+    description: '在网页中展示 Lottie 动画，内部基于 lottie-web 渲染（严格对齐 Semi）。相较直接用 lottie-web，无需关心动画容器的创建与销毁、动画本身的生命周期。params 透传 lottie.loadAnimation（path CDN / animationData 打包 / renderer / loop / autoplay / container 等）；getAnimationInstance 获取当前 AnimationItem（含 play/pause/setSpeed 等方法）实现播放控制；getLottie 获取全局 lottie 包，亦可用静态方法 Lottie.getLottie()。params.container 存在时组件不渲染 DOM（用户自管容器）。',
+    exports: ['Lottie'],
+    props: [
+        {
+            name: 'params',
+            type: 'LottieParams',
+            default: '—',
+            desc: '必填。用于配置动画相关参数，透传 lottie.loadAnimation（path / animationData / renderer / loop / autoplay / container 等，默认 renderer:svg / loop:true / autoplay:true）',
+        },
+        {
+            name: 'width',
+            type: 'string',
+            default: 'undefined',
+            desc: '容器宽度（作用于根 div，如 "300px"）；params.container 存在时不生效',
+        },
+        {
+            name: 'height',
+            type: 'string',
+            default: 'undefined',
+            desc: '容器高度（作用于根 div，如 "300px"）；params.container 存在时不生效',
+        },
+        {
+            name: 'getAnimationInstance',
+            type: '(animation: AnimationItem | null) => void',
+            default: 'undefined',
+            desc: '获取当前动画 AnimationItem 实例（含 play/pause/setSpeed/goToAndStop 等方法）；mount 及 params 变更后回调',
+        },
+        {
+            name: 'getLottie',
+            type: '(lottie: LottiePlayer) => void',
+            default: 'undefined',
+            desc: '获取全局 lottie 包（含 setQuality 等全局方法）；mount 时回调。等价具名导出 getLottie()',
+        },
+        { name: 'class', type: 'string', default: 'undefined', desc: '根节点类名' },
+        { name: 'style', type: 'string', default: 'undefined', desc: '根节点内联样式' },
+    ],
+    events: [],
+    slots: [],
+    staticMembers: [
+        {
+            name: 'getLottie',
+            desc: '具名导出（异步函数），返回全局 lottie 包（lottie-web 的 default 导出）。对齐 Semi Lottie.getLottie 静态方法；Svelte 组件无法挂静态方法，故以具名导出提供',
+        },
+    ],
+    a11y: {
+        hasRole: false,
+        focusable: false,
+        note: 'Semi Lottie 为纯动画展示容器，无内建 role/aria；无障碍名由使用方按场景在容器上补充。',
+    },
+    // 零 token —— 严格对齐 Semi（仅一个无样式 .semi-lottie class）。
+    tokens: [],
+    responsive: false,
+    examples: [
+        {
+            title: 'path CDN 基本用法',
+            code: '<Lottie params={{ path: jsonURL }} width="300px" height="300px" />',
+        },
+        {
+            title: 'animationData 打包用法',
+            code: '<Lottie params={{ animationData: data }} width="300px" height="300px" />',
+        },
+        {
+            title: '获取当前动画实例',
+            code: '<Lottie params={{ path: jsonURL }} getAnimationInstance={(a) => console.log(a)} />',
+        },
+        {
+            title: '获取全局 Lottie',
+            code: '<Lottie params={{ path: jsonURL }} getLottie={(l) => console.log(l)} />',
+        },
+    ],
+};

package/dist/markdown-render/HastNode.svelte

@@ -0,0 +1,66 @@
+<!--
+  HastNode — internal recursive renderer for a single hast node (MarkdownRender).
+
+  规则：
+  - element 节点：查 components[tagName]，命中 → 渲染注册的 Svelte 组件（传 hast properties + children snippet）；
+    未命中 → 渲染原生标签（属性经 hastPropsToAttrs 归一）。
+  - text 节点：渲染文本。
+  - root 节点：渲染其 children。
+  - 其它节点（raw / comment / doctype 等）：忽略（对齐 Semi format='md' 不渲染 raw HTML）。
+
+  安全：只渲染 element/text/root；raw/comment 一律跳过，除非使用方经 rehypePlugins 把它们转成 element。
+-->
+<script lang="ts">
+  import type { Component } from 'svelte';
+  import type { Root, Element, ElementContent, RootContent } from 'hast';
+  import { hastPropsToAttrs } from './props.js';
+  import Self from './HastNode.svelte';
+
+  type Registry = Record<string, Component<any> | string>;
+
+  interface Props {
+    node: Root | ElementContent | RootContent;
+    components: Registry;
+  }
+
+  let { node, components }: Props = $props();
+
+  // 命中注册表的 Svelte 组件（string 值表示别名到另一原生标签，走原生分支）。
+  const mapped = $derived(
+    node.type === 'element' ? components[(node as Element).tagName] : undefined,
+  );
+  const CustomComp = $derived(typeof mapped === 'function' ? mapped : undefined);
+  const aliasTag = $derived(typeof mapped === 'string' ? mapped : undefined);
+
+  const attrs = $derived(
+    node.type === 'element' ? hastPropsToAttrs((node as Element).properties) : {},
+  );
+  const childList = $derived(
+    'children' in node ? (node.children as (ElementContent | RootContent)[]) : [],
+  );
+</script>
+
+{#snippet renderChildren(list: (ElementContent | RootContent)[])}
+  {#each list as child, i (i)}
+    <Self node={child} {components} />
+  {/each}
+{/snippet}
+
+{#if node.type === 'text'}
+  {node.value}
+{:else if node.type === 'root'}
+  {@render renderChildren(childList)}
+{:else if node.type === 'element'}
+  {@const el = node as Element}
+  {#if CustomComp}
+    <!-- 注册的 Svelte 组件：透传 hast properties（原始）与 children snippet -->
+    <CustomComp {...el.properties ?? {}} node={el}>
+      {@render renderChildren(childList)}
+    </CustomComp>
+  {:else}
+    {@const Tag = aliasTag ?? el.tagName}
+    <svelte:element this={Tag} {...attrs}>
+      {@render renderChildren(childList)}
+    </svelte:element>
+  {/if}
+{/if}

package/dist/markdown-render/HastNode.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { Component } from 'svelte';
+import type { Root, ElementContent, RootContent } from 'hast';
+type Registry = Record<string, Component<any> | string>;
+interface Props {
+    node: Root | ElementContent | RootContent;
+    components: Registry;
+}
+declare const HastNode: Component<Props, {}, "">;
+type HastNode = ReturnType<typeof HastNode>;
+export default HastNode;
+//# sourceMappingURL=HastNode.svelte.d.ts.map

package/dist/markdown-render/HastNode.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HastNode.svelte.d.ts","sourceRoot":"","sources":["../../src/markdown-render/HastNode.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,KAAK,EAAE,IAAI,EAAW,cAAc,EAAE,WAAW,EAAE,MAAM,MAAM,CAAC;AAKrE,KAAK,QAAQ,GAAG,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,CAAC;AAExD,UAAU,KAAK;IACb,IAAI,EAAE,IAAI,GAAG,cAAc,GAAG,WAAW,CAAC;IAC1C,UAAU,EAAE,QAAQ,CAAC;CACtB;AAsDH,QAAA,MAAM,QAAQ,0BAAwC,CAAC;AACvD,KAAK,QAAQ,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC5C,eAAe,QAAQ,CAAC"}

package/dist/markdown-render/MarkdownRender.svelte

@@ -0,0 +1,152 @@
+<!--
+  MarkdownRender — Markdown 渲染组件（严格对齐 Semi Design markdownRender，用 unified 管线替代 MDX）。
+
+  Semi 用 @mdx-js/mdx evaluate 产出 React 组件；Svelte 无 jsx-runtime 无法复用（运行时模型硬不兼容）。
+  本组件：core.compileToHast 把 raw 编译成 hast → HastNode 递归渲染成 Svelte 组件 / 原生标签。
+
+  对齐 Semi（可观察结果）：
+  - DOM 类名体系 cd-markdownRender → 本库 cd-markdown-render；元素映射到组件 + -component-* 类名。
+  - 默认组件映射（对齐 Semi SemiMarkdownComponents 11 键）：h1-h6→Typography.Title、p→Typography.Paragraph、
+    a→Typography.Text link、img→div>Image+alt、table→Table、code(行内)→span.simple-code、pre(围栏)→CodeHighlight。
+  - token 镜像 Semi variables.scss（20 个：simpleCode/image/header1-5 margin/list color/p strong）；
+    标题字号/行高/颜色由 Typography 承担（Semi 也如此），故不自造这些 token。
+  - 默认不渲染 raw HTML（对齐 Semi format='md' 剥离）；保留 HTML 由使用方传 rehype-raw 自负 XSS。
+  - 不支持 md 正文里任意 JSX 表达式求值（Semi format='mdx' 深度能力，Svelte 无 jsx-runtime）。
+
+  异步：compileToHast 惰性 import 编译器，$effect 内编译，结果写 $state（编译期先渲染上一次/空）。
+-->
+<script lang="ts" module>
+  import type { Component } from 'svelte';
+  import { defaultComponents } from './components/index.js';
+
+  export { defaultComponents };
+</script>
+
+<script lang="ts">
+  import { compileToHast, type HastRoot, type UnifiedPluginEntry } from '@chenzy-design/core';
+  import HastNode from './HastNode.svelte';
+
+  interface Props {
+    /** Markdown 源码。 */
+    raw?: string;
+    /** 元素覆盖 / 自定义标签注册；浅合并覆盖 defaultComponents。 */
+    components?: Record<string, Component<any> | string>;
+    /** 格式。仅支持 'md'（unified 管线）；'mdx' 不支持（Svelte 无 jsx-runtime）。 */
+    format?: 'md';
+    /** 是否启用 GFM（表格 / 任务列表 / 删除线）。对齐 Semi 默认 true。 */
+    remarkGfm?: boolean;
+    /** 透传 remark 插件（mdast 阶段）。 */
+    remarkPlugins?: UnifiedPluginEntry[];
+    /** 透传 rehype 插件（hast 阶段）；传 rehype-raw 可保留 raw HTML（自负 XSS）。 */
+    rehypePlugins?: UnifiedPluginEntry[];
+    /** 根容器附加类名。 */
+    class?: string;
+    /** 根容器内联样式。 */
+    style?: string;
+  }
+
+  let {
+    raw = '',
+    components,
+    format = 'md',
+    remarkGfm = true,
+    remarkPlugins,
+    rehypePlugins,
+    class: className = '',
+    style,
+  }: Props = $props();
+
+  // 合并注册表：默认 + 使用方覆盖。
+  const registry = $derived({ ...defaultComponents, ...(components ?? {}) });
+
+  // 编译结果单独 $state 承载（异步写），render 只读它。
+  let hast = $state<HastRoot | undefined>(undefined);
+
+  // raw / 选项变化 → 重新编译。竞态用 stale 标记丢弃过期结果。
+  $effect(() => {
+    const currentRaw = raw;
+    const opts = {
+      remarkGfm,
+      remarkPlugins,
+      rehypePlugins,
+    };
+    let stale = false;
+    void compileToHast(currentRaw, opts)
+      .then((result) => {
+        if (!stale) hast = result;
+      })
+      .catch(() => {
+        if (!stale) hast = undefined;
+      });
+    return () => {
+      stale = true;
+    };
+  });
+
+  const cls = $derived(['cd-markdown-render', className].filter(Boolean).join(' '));
+</script>
+
+<div class={cls} {style}>
+  {#if hast}
+    <HastNode node={hast} components={registry} />
+  {/if}
+</div>
+
+<style>
+  /* —— 严格对齐 Semi markdownRender.scss —— 排版由 Typography 组件承担，此处仅补 Semi 定义的样式 —— */
+
+  /* 行内 code（无语言）：simple-code（对齐 semi-markdownRender-simple-code） */
+  .cd-markdown-render :global(.cd-markdown-render-simple-code) {
+    background: var(--cd-markdown-render-simple-code-bg);
+    color: var(--cd-markdown-render-simple-code-text);
+  }
+
+  /* 列表颜色（对齐 semi-markdownRender ul,li） */
+  .cd-markdown-render :global(ul),
+  .cd-markdown-render :global(li) {
+    color: var(--cd-markdown-render-list-color);
+  }
+
+  /* 图片容器（对齐 semi-markdownRender-component-image） */
+  .cd-markdown-render :global(.cd-markdown-render-component-image) {
+    margin: var(--cd-markdown-render-image-margin-top) var(--cd-markdown-render-image-margin-right)
+      var(--cd-markdown-render-image-margin-bottom) var(--cd-markdown-render-image-margin-left);
+    max-width: var(--cd-markdown-render-image-max-width);
+    max-height: var(--cd-markdown-render-image-max-height);
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+  }
+  .cd-markdown-render :global(.cd-markdown-render-component-image-alt) {
+    margin-top: var(--cd-markdown-render-image-alt-margin-top);
+    text-align: center;
+    color: var(--cd-markdown-render-image-alt-color);
+  }
+
+  /* 标题 margin（对齐 semi-markdownRender-component-header.semi-typography-h1..h5；字号/颜色由 Typography.Title 承担） */
+  .cd-markdown-render :global(.cd-markdown-render-component-header.cd-typography-h1) {
+    margin-top: var(--cd-markdown-render-header1-margin-top);
+    margin-bottom: var(--cd-markdown-render-header1-margin-bottom);
+  }
+  .cd-markdown-render :global(.cd-markdown-render-component-header.cd-typography-h2) {
+    margin-top: var(--cd-markdown-render-header2-margin-top);
+    margin-bottom: var(--cd-markdown-render-header2-margin-bottom);
+  }
+  .cd-markdown-render :global(.cd-markdown-render-component-header.cd-typography-h3) {
+    margin-top: var(--cd-markdown-render-header3-margin-top);
+    margin-bottom: var(--cd-markdown-render-header3-margin-bottom);
+  }
+  .cd-markdown-render :global(.cd-markdown-render-component-header.cd-typography-h4) {
+    margin-top: var(--cd-markdown-render-header4-margin-top);
+    margin-bottom: var(--cd-markdown-render-header4-margin-bottom);
+  }
+  .cd-markdown-render :global(.cd-markdown-render-component-header.cd-typography-h5) {
+    margin-top: var(--cd-markdown-render-header5-margin-top);
+    margin-bottom: var(--cd-markdown-render-header5-margin-bottom);
+  }
+
+  /* 段落内加粗（对齐 semi-markdownRender-component-p strong） */
+  .cd-markdown-render :global(.cd-markdown-render-component-p strong) {
+    font-weight: var(--cd-font-weight-bold);
+  }
+</style>

package/dist/markdown-render/MarkdownRender.svelte.d.ts

@@ -0,0 +1,26 @@
+import type { Component } from 'svelte';
+import { defaultComponents } from './components/index.js';
+export { defaultComponents };
+import { type UnifiedPluginEntry } from '@chenzy-design/core';
+interface Props {
+    /** Markdown 源码。 */
+    raw?: string;
+    /** 元素覆盖 / 自定义标签注册；浅合并覆盖 defaultComponents。 */
+    components?: Record<string, Component<any> | string>;
+    /** 格式。仅支持 'md'（unified 管线）；'mdx' 不支持（Svelte 无 jsx-runtime）。 */
+    format?: 'md';
+    /** 是否启用 GFM（表格 / 任务列表 / 删除线）。对齐 Semi 默认 true。 */
+    remarkGfm?: boolean;
+    /** 透传 remark 插件（mdast 阶段）。 */
+    remarkPlugins?: UnifiedPluginEntry[];
+    /** 透传 rehype 插件（hast 阶段）；传 rehype-raw 可保留 raw HTML（自负 XSS）。 */
+    rehypePlugins?: UnifiedPluginEntry[];
+    /** 根容器附加类名。 */
+    class?: string;
+    /** 根容器内联样式。 */
+    style?: string;
+}
+declare const MarkdownRender: Component<Props, {}, "">;
+type MarkdownRender = ReturnType<typeof MarkdownRender>;
+export default MarkdownRender;
+//# sourceMappingURL=MarkdownRender.svelte.d.ts.map

package/dist/markdown-render/MarkdownRender.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarkdownRender.svelte.d.ts","sourceRoot":"","sources":["../../src/markdown-render/MarkdownRender.svelte.ts"],"names":[],"mappings":"AAGE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE1D,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAG/B,OAAO,EAAgC,KAAK,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAI1F,UAAU,KAAK;IACb,mBAAmB;IACnB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,8CAA8C;IAC9C,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,CAAC;IACrD,+DAA+D;IAC/D,MAAM,CAAC,EAAE,IAAI,CAAC;IACd,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,8BAA8B;IAC9B,aAAa,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACrC,+DAA+D;IAC/D,aAAa,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACrC,eAAe;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AA4DH,QAAA,MAAM,cAAc,0BAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}

package/dist/markdown-render/components/MdCode.svelte

@@ -0,0 +1,20 @@
+<!--
+  MdCode — MarkdownRender 行内 code 覆盖（对齐 Semi code.tsx 无语言分支）。
+  行内 code（无 language className）→ <span class="cd-markdown-render-simple-code">。
+  围栏代码块（pre>code）由 MdPre 拦截 pre 键处理（渲染 CodeHighlight），不走这里，
+  避免 pre>div(CodeHighlight) 的无效 HTML 嵌套（Semi 靠 MDX 扁平化 pre 达到同样效果）。
+-->
+<script lang="ts">
+  import type { Snippet } from 'svelte';
+
+  interface Props {
+    children?: Snippet;
+    [key: string]: unknown;
+  }
+
+  let { children }: Props = $props();
+</script>
+
+<span class="cd-markdown-render-simple-code">
+  {#if children}{@render children()}{/if}
+</span>

package/dist/markdown-render/components/MdCode.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from 'svelte';
+interface Props {
+    children?: Snippet;
+    [key: string]: unknown;
+}
+declare const MdCode: import("svelte").Component<Props, {}, "">;
+type MdCode = ReturnType<typeof MdCode>;
+export default MdCode;
+//# sourceMappingURL=MdCode.svelte.d.ts.map

package/dist/markdown-render/components/MdCode.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MdCode.svelte.d.ts","sourceRoot":"","sources":["../../../src/markdown-render/components/MdCode.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAGpC,UAAU,KAAK;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAeH,QAAA,MAAM,MAAM,2CAAwC,CAAC;AACrD,KAAK,MAAM,GAAG,UAAU,CAAC,OAAO,MAAM,CAAC,CAAC;AACxC,eAAe,MAAM,CAAC"}

package/dist/markdown-render/components/MdHeading.svelte

@@ -0,0 +1,29 @@
+<!--
+  MdHeading — MarkdownRender 默认 h1-h6 覆盖（严格对齐 Semi markdownRender components/h1-h6.tsx）。
+  Semi：<Typography.Title heading={n} className="semi-markdownRender-component-header" />。
+  本组件按 hast 节点 tagName（h1..h6）推断 heading 级别，注册到 h1-h6 全部键。
+-->
+<script lang="ts">
+  import type { Snippet } from 'svelte';
+  import type { Element } from 'hast';
+  import { Title } from '../../typography/index.js';
+
+  interface Props {
+    node?: Element;
+    children?: Snippet;
+    [key: string]: unknown;
+  }
+
+  let { node, children }: Props = $props();
+
+  // 从 tagName（h1..h6）取级别，缺省 1。
+  const heading = $derived.by(() => {
+    const t = node?.tagName ?? 'h1';
+    const n = Number(t.slice(1));
+    return (n >= 1 && n <= 6 ? n : 1) as 1 | 2 | 3 | 4 | 5 | 6;
+  });
+</script>
+
+<Title {heading} class="cd-markdown-render-component-header">
+  {#if children}{@render children()}{/if}
+</Title>

package/dist/markdown-render/components/MdHeading.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { Snippet } from 'svelte';
+import type { Element } from 'hast';
+interface Props {
+    node?: Element;
+    children?: Snippet;
+    [key: string]: unknown;
+}
+declare const MdHeading: import("svelte").Component<Props, {}, "">;
+type MdHeading = ReturnType<typeof MdHeading>;
+export default MdHeading;
+//# sourceMappingURL=MdHeading.svelte.d.ts.map

package/dist/markdown-render/components/MdHeading.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MdHeading.svelte.d.ts","sourceRoot":"","sources":["../../../src/markdown-render/components/MdHeading.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,MAAM,CAAC;AAIlC,UAAU,KAAK;IACb,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAwBH,QAAA,MAAM,SAAS,2CAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}

package/dist/markdown-render/components/MdImage.svelte

@@ -0,0 +1,28 @@
+<!--
+  MdImage — MarkdownRender 默认 img 覆盖（严格对齐 Semi markdownRender components/img.tsx）。
+  Semi：<div class="semi-markdownRender-component-image">
+          <Image fallback={<IconUploadError/>} width="100%" {...omit(props,'children')} />
+          <div class="semi-markdownRender-component-image-alt">{alt}</div>
+        </div>
+-->
+<script lang="ts">
+  import Image from '../../image/Image.svelte';
+  import { IconUploadError } from '@chenzy-design/icons';
+
+  interface Props {
+    src?: string;
+    alt?: string;
+    [key: string]: unknown;
+  }
+
+  let { src = '', alt = '' }: Props = $props();
+</script>
+
+{#snippet errorFallback()}
+  <IconUploadError />
+{/snippet}
+
+<div class="cd-markdown-render-component-image">
+  <Image {src} {alt} width="100%" fallback={errorFallback} />
+  <div class="cd-markdown-render-component-image-alt">{alt}</div>
+</div>

package/dist/markdown-render/components/MdImage.svelte.d.ts

@@ -0,0 +1,9 @@
+interface Props {
+    src?: string;
+    alt?: string;
+    [key: string]: unknown;
+}
+declare const MdImage: import("svelte").Component<Props, {}, "">;
+type MdImage = ReturnType<typeof MdImage>;
+export default MdImage;
+//# sourceMappingURL=MdImage.svelte.d.ts.map

package/dist/markdown-render/components/MdImage.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MdImage.svelte.d.ts","sourceRoot":"","sources":["../../../src/markdown-render/components/MdImage.svelte.ts"],"names":[],"mappings":"AAOE,UAAU,KAAK;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAqBH,QAAA,MAAM,OAAO,2CAAwC,CAAC;AACtD,KAAK,OAAO,GAAG,UAAU,CAAC,OAAO,OAAO,CAAC,CAAC;AAC1C,eAAe,OAAO,CAAC"}

package/dist/markdown-render/components/MdLink.svelte

@@ -0,0 +1,33 @@
+<!--
+  MdLink — MarkdownRender 默认 a 覆盖（严格对齐 Semi markdownRender components/a.tsx）。
+  Semi：<Typography.Text link={{ ...props }} {...props} />（把 href 等透传给内部 <a>）。
+  额外：外链（http(s):// 或 //）自动补 rel=noopener + target=_blank（安全默认，Semi Text link 也支持透传）。
+-->
+<script lang="ts">
+  import type { Snippet } from 'svelte';
+  import { Text } from '../../typography/index.js';
+
+  interface Props {
+    href?: string | number | boolean;
+    children?: Snippet;
+    [key: string]: unknown;
+  }
+
+  let { href, children, ...rest }: Props = $props();
+
+  const hrefStr = $derived(typeof href === 'string' ? href : undefined);
+  const isExternal = $derived(!!hrefStr && /^(https?:)?\/\//.test(hrefStr));
+
+  // link 属性对象透传给内部 <a>（对齐 Semi link={{...props}}）。
+  const linkProps = $derived({
+    href: hrefStr,
+    ...(isExternal ? { target: '_blank', rel: 'noopener noreferrer' } : {}),
+    ...Object.fromEntries(
+      Object.entries(rest).filter(([, v]) => v !== undefined && v !== null && v !== false),
+    ),
+  });
+</script>
+
+<Text link={linkProps}>
+  {#if children}{@render children()}{/if}
+</Text>

package/dist/markdown-render/components/MdLink.svelte.d.ts

@@ -0,0 +1,10 @@
+import type { Snippet } from 'svelte';
+interface Props {
+    href?: string | number | boolean;
+    children?: Snippet;
+    [key: string]: unknown;
+}
+declare const MdLink: import("svelte").Component<Props, {}, "">;
+type MdLink = ReturnType<typeof MdLink>;
+export default MdLink;
+//# sourceMappingURL=MdLink.svelte.d.ts.map