@rxdrag/website-lib-core 0.0.87 → 0.0.88

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rxdrag/website-lib-core",
-  "version": "0.0.87",
+  "version": "0.0.88",
   "type": "module",
   "exports": {
     ".": "./index.ts"

package/src/entify/Entify.ts

@@ -42,6 +42,7 @@ import { queryPageBySlug } from "./lib/queryPageBySlug";
 import { queryPageByType } from "./lib/queryPageByType";
 import { queryOneMedia } from "./lib/queryOneMedia";
 import { DEFAULT_LARGE, DEFAULT_MEDIUM, DEFAULT_SAMLL, DEFUALT_HEIGHT, DEFUALT_WIDTH, FileFieldType, ImageResize } from "../astro/media";
+import { queryOneIcon } from "./lib/queryOneIcon";
 
 export class Entify implements IEntify {
   private static instance: Entify | null = null;
@@ -132,6 +133,10 @@ export class Entify implements IEntify {
     return await queryOneMedia(ref, fields, this.envVariables);
   }
 
+  public async getIcon(name: string | undefined | null) {
+    return await queryOneIcon(name, this.envVariables);
+  }
+
   public async getFeaturedProducts(
     count?: number,
     imageSize?: ImageSize,

package/src/entify/IEntify.ts

@@ -16,6 +16,7 @@ import {
   PageType,
   Product,
   SearchIndex,
+  SvgIcon,
   ThemeBranch,
   Website,
   WebsitePart,
@@ -61,6 +62,8 @@ export interface IEntify {
 
   getMedia(ref: string | undefined | null, fileField?: FileFieldType, resize?: ImageResize): Promise<Media | undefined>;
 
+  getIcon(name: string | undefined | null): Promise<SvgIcon | undefined>;
+
   getFeaturedProducts(
     count?: number,
     imageSize?: ImageSize,

package/src/entify/lib/queryOneIcon.ts

@@ -0,0 +1,27 @@
+import { SvgIcon, SvgIconBoolExp, SvgIconDistinctExp, SvgIconOrderBy, SvgIconQueryOptions, SvgIconFields } from "@rxdrag/rxcms-models";
+import { EnvVariables } from "../types";
+import { queryOneEntity } from "./queryOneEntity";
+
+export const queryOneIcon = async (
+  name: string | undefined | null,
+  envVariables: EnvVariables) => {
+
+  const icon = await queryOneEntity<SvgIcon, SvgIconBoolExp, SvgIconOrderBy, SvgIconDistinctExp>(
+    new SvgIconQueryOptions([
+      SvgIconFields.id,
+      SvgIconFields.name,
+      SvgIconFields.title,
+      SvgIconFields.code,
+    ], {
+      where: {
+        name: {
+          "_eq": name || ""
+        }
+      }
+    })
+      .setNoQuery(!name)
+    ,
+    envVariables
+  );
+  return icon;
+};

package/src/react/components/Icon/svgToIconify.ts

@@ -16,7 +16,6 @@ export function svgToIconify(svgString: string): IconifyIcon | null {
     const viewBox = svg.getAttribute("viewBox");
     let width = svg.getAttribute("width");
     let height = svg.getAttribute("height");
-    const body = svg.innerHTML;
 
     // 如果没有显式宽高，尝试从 viewBox 解析
     if (viewBox && (!width || !height)) {
@@ -27,6 +26,27 @@ export function svgToIconify(svgString: string): IconifyIcon | null {
       }
     }
 
+    // 提取关键属性并包裹在 <g> 中，以保留 SVG 根节点的样式
+    const attributesToPreserve = [
+      "fill", 
+      "stroke", 
+      "stroke-width", 
+      "stroke-linecap", 
+      "stroke-linejoin"
+    ];
+    
+    const gAttributes = attributesToPreserve
+      .map(attr => {
+        const value = svg.getAttribute(attr);
+        return value ? `${attr}="${value}"` : "";
+      })
+      .filter(Boolean)
+      .join(" ");
+
+    const body = gAttributes 
+      ? `<g ${gAttributes}>${svg.innerHTML}</g>`
+      : svg.innerHTML;
+
     return {
       body,
       width: width ? parseFloat(width) : undefined,