@rxdrag/website-lib-core 0.0.74 → 0.0.75

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rxdrag/website-lib-core",
-  "version": "0.0.74",
+  "version": "0.0.75",
   "type": "module",
   "exports": {
     ".": "./index.ts"
@@ -29,6 +29,7 @@
     "@rxdrag/slate-preview": "1.2.60"
   },
   "dependencies": {
+    "@iconify/utils": "^3.0.2",
     "clsx": "^2.1.0",
     "gsap": "^3.12.7",
     "hls.js": "^1.6.13",

package/src/react/components/Icon/index.tsx

@@ -3,12 +3,24 @@ import {
   IconProps as IconifyIconProps,
 } from "@iconify/react";
 import { forwardRef } from "react";
+import { svgToIconify } from "./svgToIconify";
+
+export { svgToIconify };
 
 export type IconProps = Omit<IconifyIconProps, "icon"> & {
   icon?: string;
+  svg?: string;
 };
 
 export const Icon = forwardRef<SVGSVGElement, IconProps>((props, ref) => {
-  const { icon, ...rest } = props;
-  return icon ? <IconifyIcon ref={ref} {...rest} icon={icon} /> : null;
+  const { icon, svg, ...rest } = props;
+
+  const iconObj = svg ? svgToIconify(svg) : undefined;
+  const finalIcon = icon || iconObj;
+
+  if (!finalIcon) {
+    return null;
+  }
+
+  return <IconifyIcon ref={ref} {...rest} icon={finalIcon} />;
 });

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

@@ -0,0 +1,39 @@
+import { IconifyIcon } from "@iconify/react";
+
+export function svgToIconify(svgString: string): IconifyIcon | null {
+  if (typeof window === 'undefined') return null;
+
+  try {
+    const parser = new DOMParser();
+    const doc = parser.parseFromString(svgString, "image/svg+xml");
+    const svg = doc.querySelector("svg");
+
+    if (!svg) {
+      console.error("Invalid SVG string");
+      return 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)) {
+      const parts = viewBox.split(/\s+/).map(parseFloat);
+      if (parts.length === 4) {
+        if (!width) width = parts[2].toString();
+        if (!height) height = parts[3].toString();
+      }
+    }
+
+    return {
+      body,
+      width: width ? parseFloat(width) : undefined,
+      height: height ? parseFloat(height) : undefined,
+    };
+  } catch (e) {
+    console.error("Error parsing SVG:", e);
+    return null;
+  }
+}