From 9e8d4e6388ba91b6bab1cd98c2c2d0f421947f09 Mon Sep 17 00:00:00 2001
From: hypercross <helios.tnak@gmail.com>
Date: Fri, 13 Mar 2026 11:14:01 +0800
Subject: [PATCH] feat: md icon prefix

---
 src/components/md-deck/CardLayer.tsx      |  4 ++--
 src/components/md-deck/hooks/deckStore.ts | 17 ++++++++++++++++-
 src/markdown/index.ts                     | 17 ++++++++++++++---
 src/styles.css                            |  2 +-
 4 files changed, 33 insertions(+), 7 deletions(-)

diff --git a/src/components/md-deck/CardLayer.tsx b/src/components/md-deck/CardLayer.tsx
index 5f746ed..23dfe8c 100644
--- a/src/components/md-deck/CardLayer.tsx
+++ b/src/components/md-deck/CardLayer.tsx
@@ -1,5 +1,5 @@
 import {createMemo, For} from 'solid-js';
-import { marked } from '../../markdown';
+import {parseMarkdown} from '../../markdown';
 import { getLayerStyle } from './hooks/dimensions';
 import type { CardData } from './types';
 import {DeckStore} from "./hooks/deckStore";
@@ -16,7 +16,7 @@ export function CardLayer(props: CardLayerProps) {
   const showBounds = () => props.store.state.isEditing;
   
   function renderLayerContent(content: string) {
-    return marked.parse(processVariables(content, props.cardData, props.store.state.cards)) as string;
+    return parseMarkdown(processVariables(content, props.cardData, props.store.state.cards), props.cardData.iconPath) as string;
   }
   return (
     <For each={layers()}>
diff --git a/src/components/md-deck/hooks/deckStore.ts b/src/components/md-deck/hooks/deckStore.ts
index 262c289..d2ba1c4 100644
--- a/src/components/md-deck/hooks/deckStore.ts
+++ b/src/components/md-deck/hooks/deckStore.ts
@@ -269,7 +269,22 @@ export function createDeckStore(
 
   const generateCode = () => {
     const layersStr = formatLayers(state.layerConfigs);
-    return `:md-deck[${state.rawSrc || state.src}]{size="${state.sizeW}x${state.sizeH}" grid="${state.gridW}x${state.gridH}" bleed="${state.bleed}" padding="${state.padding}" layers="${layersStr}"}`;
+    const parts = [
+      `:md-deck[${state.rawSrc || state.src}]`,
+      `{size="${state.sizeW}x${state.sizeH}"`,
+      `grid="${state.gridW}x${state.gridH}"`
+    ];
+    
+    // 仅在非默认值时添加 bleed 和 padding
+    if (state.bleed !== DECK_DEFAULTS.BLEED) {
+      parts.push(`bleed="${state.bleed}"`);
+    }
+    if (state.padding !== DECK_DEFAULTS.PADDING) {
+      parts.push(`padding="${state.padding}"`);
+    }
+    
+    parts.push(`layers="${layersStr}"}`);
+    return parts.join(' ');
   };
 
   const copyCode = async () => {
diff --git a/src/markdown/index.ts b/src/markdown/index.ts
index 5c66841..a88d5d9 100644
--- a/src/markdown/index.ts
+++ b/src/markdown/index.ts
@@ -5,6 +5,15 @@ import markedAlert from "marked-alert";
 import markedMermaid from "./mermaid";
 import {gfmHeadingId} from "marked-gfm-heading-id";
 
+let globalIconPrefix: string | undefined = undefined;
+function overrideIconPrefix(path?: string){
+    globalIconPrefix = path;
+    return {
+        [Symbol.dispose](){
+            globalIconPrefix = undefined;
+        }
+    }
+}
 // 使用 marked-directive 来支持指令语法
 const marked = new Marked()
     .use(gfmHeadingId())
@@ -26,7 +35,8 @@ const marked = new Marked()
         // :[blah] becomes <i class="icon icon-blah"></i>
         renderer(token) {
             if (!token.meta.name) {
-                return `<icon class="icon-${token.text}"></icon>`;
+                const style = globalIconPrefix ? `style="--icon-src: url('${globalIconPrefix}${token.text}.png')"` : '';
+                return `<icon ${style} class="icon-${token.text}"></icon>`;
             }
             return false;
         }
@@ -89,8 +99,9 @@ const marked = new Marked()
     }]
 });
 
-export function parseMarkdown(content: string): string {
-  return marked.parse(content.trimStart()) as string;
+export function parseMarkdown(content: string, iconPrefix?: string): string {
+    using prefix = overrideIconPrefix(iconPrefix);
+    return marked.parse(content.trimStart()) as string;
 }
 
 export { marked };
diff --git a/src/styles.css b/src/styles.css
index f4c13ea..04c3819 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -7,7 +7,7 @@ icon{
     width: 1em;
     height: 1em;
     --icon-src: '';
-    background: var(--icon-src);
+    background-image: var(--icon-src);
     background-size: contain;
     background-position: center;
     background-repeat: no-repeat;