@mico_fe/ftc-plugin 0.2.0

package/dist/code.js

@@ -0,0 +1,3784 @@
+(() => {
+  var __defProp = Object.defineProperty;
+  var __defProps = Object.defineProperties;
+  var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+  var __hasOwnProp = Object.prototype.hasOwnProperty;
+  var __propIsEnum = Object.prototype.propertyIsEnumerable;
+  var __pow = Math.pow;
+  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __spreadValues = (a, b) => {
+    for (var prop in b || (b = {}))
+      if (__hasOwnProp.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    if (__getOwnPropSymbols)
+      for (var prop of __getOwnPropSymbols(b)) {
+        if (__propIsEnum.call(b, prop))
+          __defNormalProp(a, prop, b[prop]);
+      }
+    return a;
+  };
+  var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+  var __objRest = (source, exclude) => {
+    var target = {};
+    for (var prop in source)
+      if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+        target[prop] = source[prop];
+    if (source != null && __getOwnPropSymbols)
+      for (var prop of __getOwnPropSymbols(source)) {
+        if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+          target[prop] = source[prop];
+      }
+    return target;
+  };
+  var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  var __async = (__this, __arguments, generator) => {
+    return new Promise((resolve, reject) => {
+      var fulfilled = (value) => {
+        try {
+          step(generator.next(value));
+        } catch (e) {
+          reject(e);
+        }
+      };
+      var rejected = (value) => {
+        try {
+          step(generator.throw(value));
+        } catch (e) {
+          reject(e);
+        }
+      };
+      var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+      step((generator = generator.apply(__this, __arguments)).next());
+    });
+  };
+
+  // ../../packages/pluginMain/src/common/indentString.ts
+  var indentString = (str, indentLevel = 2) => {
+    const regex = /^(?!\s*$)/gm;
+    return str.replace(regex, " ".repeat(indentLevel));
+  };
+
+  // ../../packages/types/src/types.ts
+  var DEFAULT_LAYOUT_UNIT = "rem-100";
+  var LAYOUT_UNIT_STORAGE_KEY = "layout-unit";
+
+  // ../../packages/pluginMain/src/clientStorage.ts
+  var PREFIX = "code-forge:";
+  var setClientStorage = (key, value, prefix = "") => __async(null, null, function* () {
+    try {
+      yield figma.clientStorage.setAsync(`${prefix}${key}`, value);
+      console.log(`[ClientStorage] Set key "${prefix}${key}":`, value);
+    } catch (error) {
+      console.error(`[ClientStorage] Failed to set key "${prefix}${key}":`, error);
+      throw error;
+    }
+  });
+  var getClientStorage = (key, prefix = "") => __async(null, null, function* () {
+    try {
+      const value = yield figma.clientStorage.getAsync(`${prefix}${key}`);
+      console.log(`[ClientStorage] Get key "${prefix}${key}":`, value);
+      return value !== void 0 ? value : null;
+    } catch (error) {
+      console.error(`[ClientStorage] Failed to get key "${prefix}${key}":`, error);
+      return null;
+    }
+  });
+  var getClientStorageWithDefault = (key, defaultValue, prefix = "") => __async(null, null, function* () {
+    const value = yield getClientStorage(key, prefix);
+    return value !== null ? value : defaultValue;
+  });
+  var removeClientStorage = (key, prefix = "") => __async(null, null, function* () {
+    try {
+      yield figma.clientStorage.deleteAsync(`${prefix}${key}`);
+      console.log(`[ClientStorage] Removed key "${prefix}${key}"`);
+    } catch (error) {
+      console.error(`[ClientStorage] Failed to remove key "${prefix}${key}":`, error);
+      throw error;
+    }
+  });
+  var getAllClientStorageKeys = () => __async(null, null, function* () {
+    try {
+      const keys = yield figma.clientStorage.keysAsync();
+      console.log(`[ClientStorage] All keys:`, keys);
+      return keys;
+    } catch (error) {
+      console.error(`[ClientStorage] Failed to get all keys:`, error);
+      return [];
+    }
+  });
+  var handleClientStorageMessage = (msg) => __async(null, null, function* () {
+    const { action, key, value } = msg;
+    try {
+      switch (action) {
+        case "set":
+          if (key !== void 0) {
+            yield setClientStorage(key, value);
+          }
+          break;
+        case "remove":
+          if (key !== void 0) {
+            yield removeClientStorage(key);
+          }
+          break;
+        case "clear":
+          const allKeys = yield getAllClientStorageKeys();
+          const keysToDelete = allKeys.filter((k) => k.startsWith(PREFIX));
+          yield Promise.all(keysToDelete.map((k) => removeClientStorage(k)));
+          console.log(`[ClientStorage] Cleared ${keysToDelete.length} keys`);
+          break;
+        default:
+          console.warn(`[ClientStorage] Unknown action: ${String(action)}`);
+      }
+    } catch (error) {
+      console.error(`[ClientStorage] Error handling message:`, error);
+    }
+  });
+
+  // ../../packages/pluginMain/src/common/numToAutoFixed.ts
+  var numberToFixedString = (num) => {
+    return num.toFixed(2).replace(/\.00$/, "");
+  };
+  var roundToNearestDecimal = (decimal) => (n) => Math.round(n * __pow(10, decimal)) / __pow(10, decimal);
+  var roundToNearestHundreth = roundToNearestDecimal(2);
+  function stringToClassName(name) {
+    const words = name.split(/[^a-zA-Z0-9]+/);
+    const camelCaseWords = words.map((word, index) => {
+      if (index === 0) {
+        const cleanedWord = word.replace(/^[^a-zA-Z]+/g, "");
+        return cleanedWord.charAt(0).toUpperCase() + cleanedWord.slice(1).toLowerCase();
+      }
+      return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
+    });
+    return camelCaseWords.join("");
+  }
+
+  // ../../packages/pluginMain/src/common/layoutUnit.ts
+  var currentLayoutUnit = DEFAULT_LAYOUT_UNIT;
+  var setCurrentLayoutUnit = (unit) => {
+    currentLayoutUnit = unit;
+  };
+  var formatSizeValue = (num) => {
+    switch (currentLayoutUnit) {
+      case "rem-100":
+        return `${numberToFixedString(num / 100)}rem`;
+      case "rem-50":
+        return `${numberToFixedString(num / 50)}rem`;
+      default:
+        return `${numberToFixedString(num)}px`;
+    }
+  };
+  var initLayoutUnitFromStorage = () => __async(null, null, function* () {
+    const unit = yield getClientStorageWithDefault(
+      LAYOUT_UNIT_STORAGE_KEY,
+      DEFAULT_LAYOUT_UNIT,
+      PREFIX
+    );
+    setCurrentLayoutUnit(unit);
+    return unit;
+  });
+
+  // ../../packages/pluginMain/src/common/parseJSX.ts
+  var formatWithJSX = (property, isJsx, value) => {
+    const jsx_property = property.split("-").map((d, i) => i > 0 ? d.charAt(0).toUpperCase() + d.slice(1) : d).join("");
+    if (typeof value === "number") {
+      if (isJsx) {
+        return `${jsx_property}: ${numberToFixedString(value)}`;
+      } else {
+        return `${property}: ${formatSizeValue(value)}`;
+      }
+    } else if (isJsx) {
+      return `${jsx_property}: '${value}'`;
+    } else {
+      return `${property}: ${value}`;
+    }
+  };
+  var formatMultipleJSXArray = (styles, isJsx) => Object.entries(styles).filter(([, value]) => value !== "").map(([key, value]) => formatWithJSX(key, isJsx, value));
+  var formatMultipleJSX = (styles, isJsx) => Object.entries(styles).filter(([, value]) => value).map(([key, value]) => formatWithJSX(key, isJsx, value)).join(isJsx ? ", " : "; ");
+
+  // ../../packages/pluginMain/src/common/retrieveFill.ts
+  var retrieveTopFill = (fills) => {
+    if (fills && Array.isArray(fills) && fills.length > 0) {
+      return [...fills].reverse().find((d) => d.visible !== false);
+    }
+    return void 0;
+  };
+
+  // ../../packages/pluginMain/src/html/builderImpl/htmlColor.ts
+  var processColorWithVariable = (fill) => {
+    var _a;
+    const opacity = (_a = fill.opacity) != null ? _a : 1;
+    if (fill.variableColorName) {
+      const varName = fill.variableColorName;
+      const fallbackColor = htmlColor(fill.color, opacity);
+      return `var(--${varName}, ${fallbackColor})`;
+    }
+    return htmlColor(fill.color, opacity);
+  };
+  var getColorAndVariable = (fill) => {
+    var _a, _b;
+    if (fill.type === "SOLID") {
+      return {
+        color: fill.color,
+        opacity: (_a = fill.opacity) != null ? _a : 1,
+        variableColorName: fill.variableColorName
+      };
+    } else if ((fill.type === "GRADIENT_LINEAR" || fill.type === "GRADIENT_RADIAL" || fill.type === "GRADIENT_ANGULAR" || fill.type === "GRADIENT_DIAMOND") && fill.gradientStops.length > 0) {
+      const firstStop = fill.gradientStops[0];
+      if (!firstStop) {
+        return { color: { r: 0, g: 0, b: 0 }, opacity: 0 };
+      }
+      return {
+        color: firstStop.color,
+        opacity: (_b = fill.opacity) != null ? _b : 1,
+        variableColorName: firstStop.variableColorName
+      };
+    }
+    return { color: { r: 0, g: 0, b: 0 }, opacity: 0 };
+  };
+  var htmlColorFromFills = (fills) => {
+    const fill = retrieveTopFill(fills);
+    if (fill) {
+      const colorInfo = getColorAndVariable(fill);
+      return processColorWithVariable(colorInfo);
+    }
+    return "";
+  };
+  var htmlColorFromFill = (fill) => {
+    return processColorWithVariable(fill);
+  };
+  var htmlColor = (color, alpha = 1) => {
+    if (color.r === 1 && color.g === 1 && color.b === 1 && alpha === 1) {
+      return "white";
+    }
+    if (color.r === 0 && color.g === 0 && color.b === 0 && alpha === 1) {
+      return "black";
+    }
+    if (alpha === 1) {
+      const r2 = Math.round(color.r * 255);
+      const g2 = Math.round(color.g * 255);
+      const b2 = Math.round(color.b * 255);
+      const toHex = (num) => num.toString(16).padStart(2, "0");
+      return `#${toHex(r2)}${toHex(g2)}${toHex(b2)}`.toUpperCase();
+    }
+    const r = numberToFixedString(color.r * 255);
+    const g = numberToFixedString(color.g * 255);
+    const b = numberToFixedString(color.b * 255);
+    const a = numberToFixedString(alpha);
+    return `rgba(${r}, ${g}, ${b}, ${a})`;
+  };
+  var processGradientStop = (stop, fillOpacity = 1, positionMultiplier = 100, unit = "%") => {
+    const fillInfo = {
+      color: stop.color,
+      opacity: stop.color.a * fillOpacity,
+      boundVariables: stop.boundVariables,
+      variableColorName: stop.variableColorName
+    };
+    const color = processColorWithVariable(fillInfo);
+    const position = `${(stop.position * positionMultiplier).toFixed(0)}${unit}`;
+    return `${color} ${position}`;
+  };
+  var processGradientStops = (stops, fillOpacity = 1, positionMultiplier = 100, unit = "%") => {
+    return stops.map((stop) => processGradientStop(stop, fillOpacity, positionMultiplier, unit)).join(", ");
+  };
+  var htmlGradientFromFills = (fill) => {
+    if (!fill) return "";
+    switch (fill.type) {
+      case "GRADIENT_LINEAR":
+        return htmlLinearGradient(fill);
+      case "GRADIENT_ANGULAR":
+        return htmlAngularGradient(fill);
+      case "GRADIENT_RADIAL":
+        return htmlRadialGradient(fill);
+      case "GRADIENT_DIAMOND":
+        return htmlDiamondGradient(fill);
+      default:
+        return "";
+    }
+  };
+  var htmlLinearGradient = (fill) => {
+    var _a;
+    const [start, end] = fill.gradientHandlePositions;
+    if (!start || !end) return "";
+    const dx = end.x - start.x;
+    const dy = end.y - start.y;
+    let angle = Math.atan2(dy, dx) * (180 / Math.PI);
+    angle = (angle + 360) % 360;
+    const cssAngle = (angle + 90) % 360;
+    const mappedFill = processGradientStops(fill.gradientStops, (_a = fill.opacity) != null ? _a : 1);
+    return `linear-gradient(${cssAngle.toFixed(0)}deg, ${mappedFill})`;
+  };
+  var htmlRadialGradient = (fill) => {
+    var _a;
+    const [center, h1, h2] = fill.gradientHandlePositions;
+    if (!center || !h1 || !h2) return "";
+    const cx = center.x * 100;
+    const cy = center.y * 100;
+    const rx = Math.sqrt(__pow(h1.x - center.x, 2) + __pow(h1.y - center.y, 2)) * 100;
+    const ry = Math.sqrt(__pow(h2.x - center.x, 2) + __pow(h2.y - center.y, 2)) * 100;
+    const mappedStops = processGradientStops(fill.gradientStops, (_a = fill.opacity) != null ? _a : 1);
+    return `radial-gradient(ellipse ${rx.toFixed(2)}% ${ry.toFixed(2)}% at ${cx.toFixed(2)}% ${cy.toFixed(2)}%, ${mappedStops})`;
+  };
+  var htmlAngularGradient = (fill) => {
+    var _a;
+    const [center, _, startDirection] = fill.gradientHandlePositions;
+    if (!center || !startDirection) return "";
+    const cx = center.x * 100;
+    const cy = center.y * 100;
+    const dx = startDirection.x - center.x;
+    const dy = startDirection.y - center.y;
+    let angle = Math.atan2(dy, dx) * (180 / Math.PI);
+    angle = (angle + 360) % 360;
+    const mappedFill = processGradientStops(fill.gradientStops, (_a = fill.opacity) != null ? _a : 1, 360, "deg");
+    return `conic-gradient(from ${angle.toFixed(0)}deg at ${cx.toFixed(2)}% ${cy.toFixed(2)}%, ${mappedFill})`;
+  };
+  var htmlDiamondGradient = (fill) => {
+    var _a;
+    const stops = processGradientStops(fill.gradientStops, (_a = fill.opacity) != null ? _a : 1, 50, "%");
+    const gradientConfigs = [
+      { direction: "to bottom right", position: "bottom right" },
+      { direction: "to bottom left", position: "bottom left" },
+      { direction: "to top left", position: "top left" },
+      { direction: "to top right", position: "top right" }
+    ];
+    return gradientConfigs.map(
+      ({ direction, position }) => `linear-gradient(${direction}, ${stops}) ${position} / 50% 50% no-repeat`
+    ).join(", ");
+  };
+  var buildBackgroundValues = (paintArray) => {
+    if (paintArray === figma.mixed) {
+      return "";
+    }
+    if (paintArray.length === 1) {
+      const paint = paintArray[0];
+      if (!paint) return "";
+      if (paint.type === "SOLID") {
+        return htmlColorFromFills(paintArray);
+      } else if (paint.type === "GRADIENT_LINEAR" || paint.type === "GRADIENT_RADIAL" || paint.type === "GRADIENT_ANGULAR" || paint.type === "GRADIENT_DIAMOND") {
+        return htmlGradientFromFills(paint);
+      }
+      return "";
+    }
+    const styles = [...paintArray].reverse().map((paint, index) => {
+      if (paint.type === "SOLID") {
+        const color = htmlColorFromFills([paint]);
+        if (index === 0) {
+          return `linear-gradient(0deg, ${color} 0%, ${color} 100%)`;
+        }
+        return color;
+      } else if (paint.type === "GRADIENT_LINEAR" || paint.type === "GRADIENT_RADIAL" || paint.type === "GRADIENT_ANGULAR" || paint.type === "GRADIENT_DIAMOND") {
+        return htmlGradientFromFills(paint);
+      }
+      return "";
+    });
+    return styles.filter((value) => value !== "").join(", ");
+  };
+
+  // ../../packages/pluginMain/src/html/builderImpl/htmlShadow.ts
+  var isShadowOrBlurEffect = (effect) => (effect.type === "DROP_SHADOW" || effect.type === "INNER_SHADOW" || effect.type === "LAYER_BLUR") && effect.visible;
+  var htmlShadow = (node) => {
+    if (node.effects && node.effects.length > 0) {
+      const shadowEffects = node.effects.filter(isShadowOrBlurEffect);
+      if (shadowEffects.length > 0) {
+        const shadow = shadowEffects[0];
+        let x = 0;
+        let y = 0;
+        let blur = 0;
+        let spread = "";
+        let inner = "";
+        let color = "";
+        if (shadow.type === "DROP_SHADOW" || shadow.type === "INNER_SHADOW") {
+          x = shadow.offset.x;
+          y = shadow.offset.y;
+          blur = shadow.radius;
+          spread = shadow.spread ? `${formatSizeValue(shadow.spread)} ` : "";
+          inner = shadow.type === "INNER_SHADOW" ? " inset" : "";
+          color = htmlColor(shadow.color, shadow.color.a);
+        } else if (shadow.type === "LAYER_BLUR") {
+          x = shadow.radius;
+          y = shadow.radius;
+          blur = shadow.radius;
+        }
+        return `${formatSizeValue(x)} ${formatSizeValue(y)} ${formatSizeValue(blur)} ${spread}${color}${inner}`;
+      }
+    }
+    return "";
+  };
+
+  // ../../packages/pluginMain/src/html/builderImpl/htmlBlend.ts
+  var htmlOpacity = (node, isJsx) => {
+    if (node.opacity !== void 0 && node.opacity !== 1) {
+      if (isJsx) {
+        return `opacity: ${numberToFixedString(node.opacity)}`;
+      } else {
+        return `opacity: ${numberToFixedString(node.opacity)}`;
+      }
+    }
+    return "";
+  };
+  var htmlBlendMode = (node, isJsx) => {
+    if (node.blendMode !== "NORMAL" && node.blendMode !== "PASS_THROUGH") {
+      let blendMode = "";
+      switch (node.blendMode) {
+        case "MULTIPLY":
+          blendMode = "multiply";
+          break;
+        case "SCREEN":
+          blendMode = "screen";
+          break;
+        case "OVERLAY":
+          blendMode = "overlay";
+          break;
+        case "DARKEN":
+          blendMode = "darken";
+          break;
+        case "LIGHTEN":
+          blendMode = "lighten";
+          break;
+        case "COLOR_DODGE":
+          blendMode = "color-dodge";
+          break;
+        case "COLOR_BURN":
+          blendMode = "color-burn";
+          break;
+        case "HARD_LIGHT":
+          blendMode = "hard-light";
+          break;
+        case "SOFT_LIGHT":
+          blendMode = "soft-light";
+          break;
+        case "DIFFERENCE":
+          blendMode = "difference";
+          break;
+        case "EXCLUSION":
+          blendMode = "exclusion";
+          break;
+        case "HUE":
+          blendMode = "hue";
+          break;
+        case "SATURATION":
+          blendMode = "saturation";
+          break;
+        case "COLOR":
+          blendMode = "color";
+          break;
+        case "LUMINOSITY":
+          blendMode = "luminosity";
+          break;
+      }
+      if (blendMode) {
+        return formatWithJSX("mix-blend-mode", isJsx, blendMode);
+      }
+    }
+    return "";
+  };
+  var htmlVisibility = (node, isJsx) => {
+    if (node.visible !== void 0 && !node.visible) {
+      return formatWithJSX("visibility", isJsx, "hidden");
+    }
+    return "";
+  };
+  var htmlRotation = (node, isJsx) => {
+    const rotation = -Math.round((node.rotation || 0) + (node.cumulativeRotation || 0)) || 0;
+    if (rotation !== 0) {
+      return [
+        formatWithJSX("transform", isJsx, `rotate(${numberToFixedString(rotation)}deg)`),
+        formatWithJSX("transform-origin", isJsx, "top left")
+      ];
+    }
+    return [];
+  };
+
+  // ../../packages/pluginMain/src/common/commonPadding.ts
+  var commonPadding = (node) => {
+    var _a, _b, _c, _d;
+    if ("layoutMode" in node && node.layoutMode !== "NONE") {
+      const paddingLeft = parseFloat(((_a = node.paddingLeft) != null ? _a : 0).toFixed(2));
+      const paddingRight = parseFloat(((_b = node.paddingRight) != null ? _b : 0).toFixed(2));
+      const paddingTop = parseFloat(((_c = node.paddingTop) != null ? _c : 0).toFixed(2));
+      const paddingBottom = parseFloat(((_d = node.paddingBottom) != null ? _d : 0).toFixed(2));
+      if (paddingLeft === paddingRight && paddingLeft === paddingBottom && paddingTop === paddingBottom) {
+        return { all: paddingLeft };
+      } else if (paddingLeft === paddingRight && paddingTop === paddingBottom) {
+        return {
+          horizontal: paddingLeft,
+          vertical: paddingTop
+        };
+      } else {
+        return {
+          left: paddingLeft,
+          right: paddingRight,
+          top: paddingTop,
+          bottom: paddingBottom
+        };
+      }
+    }
+    return null;
+  };
+
+  // ../../packages/pluginMain/src/html/builderImpl/htmlPadding.ts
+  var htmlPadding = (node, isJsx) => {
+    const padding = commonPadding(node);
+    if (padding === null) {
+      return [];
+    }
+    if ("all" in padding) {
+      if (padding.all !== 0) {
+        return [formatWithJSX("padding", isJsx, padding.all)];
+      } else {
+        return [];
+      }
+    }
+    const comp = [];
+    if ("horizontal" in padding) {
+      if (padding.horizontal !== 0) {
+        comp.push(formatWithJSX("padding-left", isJsx, padding.horizontal));
+        comp.push(formatWithJSX("padding-right", isJsx, padding.horizontal));
+      }
+      if (padding.vertical !== 0) {
+        comp.push(formatWithJSX("padding-top", isJsx, padding.vertical));
+        comp.push(formatWithJSX("padding-bottom", isJsx, padding.vertical));
+      }
+      return comp;
+    }
+    if (padding.top !== 0) {
+      comp.push(formatWithJSX("padding-top", isJsx, padding.top));
+    }
+    if (padding.bottom !== 0) {
+      comp.push(formatWithJSX("padding-bottom", isJsx, padding.bottom));
+    }
+    if (padding.left !== 0) {
+      comp.push(formatWithJSX("padding-left", isJsx, padding.left));
+    }
+    if (padding.right !== 0) {
+      comp.push(formatWithJSX("padding-right", isJsx, padding.right));
+    }
+    return comp;
+  };
+
+  // ../../packages/pluginMain/src/common/nodeWidthHeight.ts
+  var nodeSize = (node) => {
+    if ("layoutSizingHorizontal" in node && "layoutSizingVertical" in node) {
+      const width = node.layoutSizingHorizontal === "FILL" ? "fill" : node.layoutSizingHorizontal === "HUG" ? null : node.width;
+      const height = node.layoutSizingVertical === "FILL" ? "fill" : node.layoutSizingVertical === "HUG" ? null : node.height;
+      return { width, height };
+    }
+    return { width: node.width, height: node.height };
+  };
+
+  // ../../packages/pluginMain/src/html/builderImpl/htmlSize.ts
+  var htmlSizePartial = (node, isJsx) => {
+    if (isPreviewGlobal && node.parent === void 0) {
+      return {
+        width: formatWithJSX("width", isJsx, "100%"),
+        height: formatWithJSX("height", isJsx, "100%"),
+        constraints: []
+      };
+    }
+    const size = nodeSize(node);
+    const nodeParent = node.parent;
+    let w = "";
+    if (typeof size.width === "number") {
+      w = formatWithJSX("width", isJsx, size.width);
+    } else if (size.width === "fill") {
+      if (nodeParent && "layoutMode" in nodeParent && nodeParent.layoutMode === "HORIZONTAL") {
+        w = formatWithJSX("flex", isJsx, "1 1 0");
+      } else {
+        if (node.maxWidth) {
+          w = formatWithJSX("width", isJsx, "100%");
+        } else {
+          w = formatWithJSX("align-self", isJsx, "stretch");
+        }
+      }
+    }
+    let h = "";
+    if (typeof size.height === "number") {
+      h = formatWithJSX("height", isJsx, size.height);
+    } else if (typeof size.height === "string") {
+      if (nodeParent && "layoutMode" in nodeParent && nodeParent.layoutMode === "VERTICAL") {
+        h = formatWithJSX("flex", isJsx, "1 1 0");
+      } else {
+        if (node.maxHeight) {
+          h = formatWithJSX("height", isJsx, "100%");
+        } else {
+          h = formatWithJSX("align-self", isJsx, "stretch");
+        }
+      }
+    }
+    const constraints = [];
+    if (node.maxWidth !== void 0 && node.maxWidth !== null) {
+      constraints.push(formatWithJSX("max-width", isJsx, node.maxWidth));
+    }
+    if (node.minWidth !== void 0 && node.minWidth !== null) {
+      constraints.push(formatWithJSX("min-width", isJsx, node.minWidth));
+    }
+    if (node.maxHeight !== void 0 && node.maxHeight !== null) {
+      constraints.push(formatWithJSX("max-height", isJsx, node.maxHeight));
+    }
+    if (node.minHeight !== void 0 && node.minHeight !== null) {
+      constraints.push(formatWithJSX("min-height", isJsx, node.minHeight));
+    }
+    return {
+      width: w,
+      height: h,
+      constraints
+    };
+  };
+
+  // ../../packages/pluginMain/src/common/commonRadius.ts
+  var getCommonRadius = (node) => {
+    if ("rectangleCornerRadii" in node) {
+      const [topLeft, topRight, bottomRight, bottomLeft] = node.rectangleCornerRadii;
+      if (topLeft === topRight && topLeft === bottomRight && topLeft === bottomLeft) {
+        return { all: topLeft };
+      }
+      return {
+        topLeft,
+        topRight,
+        bottomRight,
+        bottomLeft
+      };
+    }
+    if ("cornerRadius" in node && node.cornerRadius !== figma.mixed && node.cornerRadius) {
+      return { all: node.cornerRadius };
+    }
+    if ("topLeftRadius" in node) {
+      if (node.topLeftRadius === node.topRightRadius && node.topLeftRadius === node.bottomRightRadius && node.topLeftRadius === node.bottomLeftRadius) {
+        return { all: node.topLeftRadius };
+      }
+      return {
+        topLeft: node.topLeftRadius,
+        topRight: node.topRightRadius,
+        bottomRight: node.bottomRightRadius,
+        bottomLeft: node.bottomLeftRadius
+      };
+    }
+    return { all: 0 };
+  };
+
+  // ../../packages/pluginMain/src/html/builderImpl/htmlBorderRadius.ts
+  var htmlBorderRadius = (node, isJsx) => {
+    const comp = [];
+    if ("children" in node && node.children.length > 0 && "clipsContent" in node && node.clipsContent) {
+      comp.push(formatWithJSX("overflow", isJsx, "hidden"));
+    }
+    if (node.type === "ELLIPSE") {
+      comp.push(formatWithJSX("border-radius", isJsx, 9999));
+      return comp;
+    }
+    const radius = getCommonRadius(node);
+    if ("all" in radius) {
+      if (radius.all === 0) {
+        return comp;
+      }
+      comp.push(formatWithJSX("border-radius", isJsx, radius.all));
+    } else {
+      const cornerValues = [radius.topLeft, radius.topRight, radius.bottomRight, radius.bottomLeft];
+      const cornerProperties = [
+        "border-top-left-radius",
+        "border-top-right-radius",
+        "border-bottom-right-radius",
+        "border-bottom-left-radius"
+      ];
+      for (let i = 0; i < 4; i++) {
+        const cornerValue = cornerValues[i];
+        const cornerProperty = cornerProperties[i];
+        if (cornerValue !== void 0 && cornerProperty !== void 0 && cornerValue > 0) {
+          comp.push(formatWithJSX(cornerProperty, isJsx, cornerValue));
+        }
+      }
+    }
+    return comp;
+  };
+
+  // ../../packages/pluginMain/src/common/commonPosition.ts
+  var getCommonPositionValue = (node, settings) => {
+    var _a;
+    const parent = node.parent;
+    if (parent && "absoluteBoundingBox" in parent && parent.absoluteBoundingBox && node.absoluteBoundingBox) {
+      if ((settings == null ? void 0 : settings.embedVectors) && "svg" in node && node.svg) {
+        return {
+          x: node.absoluteBoundingBox.x - parent.absoluteBoundingBox.x,
+          y: node.absoluteBoundingBox.y - parent.absoluteBoundingBox.y
+        };
+      }
+      return { x: node.x, y: node.y };
+    }
+    if (((_a = node.parent) == null ? void 0 : _a.type) === "GROUP") {
+      return {
+        x: node.x - node.parent.x,
+        y: node.y - node.parent.y
+      };
+    }
+    return {
+      x: node.x,
+      y: node.y
+    };
+  };
+  function calculateRectangleFromBoundingBox(boundingBox, figmaRotationDegrees) {
+    const cssRotationDegrees = -figmaRotationDegrees;
+    const theta = cssRotationDegrees * Math.PI / 180;
+    const cosTheta = Math.cos(theta);
+    const sinTheta = Math.sin(theta);
+    const absCosTheta = Math.abs(cosTheta);
+    const absSinTheta = Math.abs(sinTheta);
+    const { width: w_b, height: h_b, x: x_b, y: y_b } = boundingBox;
+    const denominator = absCosTheta * absCosTheta - absSinTheta * absSinTheta;
+    const h = (w_b * absSinTheta - h_b * absCosTheta) / -denominator;
+    const w = (w_b - h * absSinTheta) / absCosTheta;
+    const corners = [
+      { x: 0, y: 0 },
+      { x: w, y: 0 },
+      { x: w, y: h },
+      { x: 0, y: h }
+    ];
+    const rotatedCorners = corners.map(({ x, y }) => ({
+      x: x * cosTheta + y * sinTheta,
+      y: -x * sinTheta + y * cosTheta
+    }));
+    const minX = Math.min(...rotatedCorners.map((c) => c.x));
+    const minY = Math.min(...rotatedCorners.map((c) => c.y));
+    const left = x_b - minX;
+    const top = y_b - minY;
+    return {
+      width: parseFloat(w.toFixed(2)),
+      height: parseFloat(h.toFixed(2)),
+      left: parseFloat(left.toFixed(2)),
+      top: parseFloat(top.toFixed(2)),
+      rotation: cssRotationDegrees
+    };
+  }
+  var commonIsAbsolutePosition = (node) => {
+    if ("layoutPositioning" in node && node.layoutPositioning === "ABSOLUTE") {
+      return true;
+    }
+    if (!node.parent || node.parent === void 0) {
+      return false;
+    }
+    if ("layoutMode" in node.parent && node.parent.layoutMode === "NONE" || !("layoutMode" in node.parent)) {
+      return true;
+    }
+    return false;
+  };
+
+  // ../../packages/pluginMain/src/common/commonStroke.ts
+  var commonStroke = (node, divideBy = 1) => {
+    if (!("strokes" in node) || !node.strokes || node.strokes.length === 0) {
+      return null;
+    }
+    if ("strokeTopWeight" in node) {
+      if (node.strokeTopWeight === node.strokeBottomWeight && node.strokeTopWeight === node.strokeLeftWeight && node.strokeTopWeight === node.strokeRightWeight) {
+        return { all: node.strokeTopWeight / divideBy };
+      }
+      return {
+        left: node.strokeLeftWeight / divideBy,
+        top: node.strokeTopWeight / divideBy,
+        right: node.strokeRightWeight / divideBy,
+        bottom: node.strokeBottomWeight / divideBy
+      };
+    } else if (node.strokeWeight !== figma.mixed && node.strokeWeight !== 0) {
+      return { all: node.strokeWeight / divideBy };
+    }
+    return null;
+  };
+
+  // ../../packages/pluginMain/src/common/lowercaseFirstLetter.ts
+  function lowercaseFirstLetter(str) {
+    if (!str || str.length === 0) {
+      return str;
+    }
+    return str.charAt(0).toLowerCase() + str.slice(1);
+  }
+
+  // ../../packages/pluginMain/src/common/commonFormatAttributes.ts
+  var getClassLabel = (isJSX = false) => isJSX ? "className" : "class";
+  var joinStyles = (styles, isJSX) => styles.map((s) => s.trim()).join(isJSX ? ", " : "; ");
+  var formatStyleAttribute = (styles, isJSX) => {
+    const trimmedStyles = joinStyles(styles, isJSX);
+    if (trimmedStyles === "") return "";
+    return ` style=${isJSX ? `{{${trimmedStyles}}}` : `"${trimmedStyles}"`}`;
+  };
+  var formatDataAttribute = (label, value) => ` data-${lowercaseFirstLetter(label).replace(" ", "-")}${value === void 0 ? `` : `="${value}"`}`;
+  var formatClassAttribute = (classes, isJSX) => classes.length === 0 ? "" : ` ${getClassLabel(isJSX)}="${classes.join(" ")}"`;
+  var formatIdAttribute = (id) => id ? ` id="${id}"` : "";
+
+  // ../../packages/pluginMain/src/html/htmlDefaultBuilder.ts
+  var HtmlDefaultBuilder = class {
+    constructor(node, settings) {
+      __publicField(this, "styles");
+      __publicField(this, "data");
+      __publicField(this, "node");
+      __publicField(this, "settings");
+      __publicField(this, "addStyles", (...newStyles) => {
+        this.styles.push(...newStyles.filter((style) => style));
+      });
+      this.node = node;
+      this.settings = settings;
+      this.styles = [];
+      this.data = [];
+    }
+    get name() {
+      return this.settings.showLayerNames ? this.node.name : "";
+    }
+    get visible() {
+      return this.node.visible;
+    }
+    commonPositionStyles() {
+      this.size();
+      this.autoLayoutPadding();
+      this.position();
+      this.blend();
+      return this;
+    }
+    commonShapeStyles() {
+      if ("fills" in this.node) {
+        this.applyFillsToStyle(this.node.fills, this.node.type === "TEXT" ? "text" : "background");
+      }
+      this.shadow();
+      this.border(this.settings);
+      this.blur();
+      return this;
+    }
+    blend() {
+      const { node } = this;
+      this.addStyles(
+        htmlVisibility(node, false),
+        ...htmlRotation(node, false),
+        htmlOpacity(node, false),
+        htmlBlendMode(node, false)
+      );
+      return this;
+    }
+    border(_settings) {
+      const { node } = this;
+      this.addStyles(...htmlBorderRadius(node, false));
+      const commonBorder = commonStroke(node);
+      if (!commonBorder) {
+        return this;
+      }
+      const strokes = "strokes" in node && node.strokes || void 0;
+      const color = htmlColorFromFills(strokes);
+      if (!color) {
+        return this;
+      }
+      const borderStyle = "dashPattern" in node && node.dashPattern.length > 0 ? "dotted" : "solid";
+      const strokeAlign = "strokeAlign" in node ? node.strokeAlign : "INSIDE";
+      const consolidateBorders = (border) => [formatSizeValue(border), color, borderStyle].filter((d) => d).join(" ");
+      if ("all" in commonBorder) {
+        if (commonBorder.all === 0) {
+          return this;
+        }
+        const weight = commonBorder.all;
+        if (strokeAlign === "CENTER" || strokeAlign === "OUTSIDE" || node.type === "FRAME" || node.type === "INSTANCE" || node.type === "COMPONENT") {
+          this.addStyles(formatWithJSX("outline", false, consolidateBorders(weight)));
+          if (strokeAlign === "CENTER") {
+            this.addStyles(formatWithJSX("outline-offset", false, -weight / 2));
+          } else if (strokeAlign === "INSIDE") {
+            this.addStyles(formatWithJSX("outline-offset", false, -weight));
+          }
+        } else {
+          this.addStyles(formatWithJSX("border", false, consolidateBorders(weight)));
+        }
+      } else {
+        if (commonBorder.left !== 0) {
+          this.addStyles(formatWithJSX("border-left", false, consolidateBorders(commonBorder.left)));
+        }
+        if (commonBorder.top !== 0) {
+          this.addStyles(formatWithJSX("border-top", false, consolidateBorders(commonBorder.top)));
+        }
+        if (commonBorder.right !== 0) {
+          this.addStyles(formatWithJSX("border-right", false, consolidateBorders(commonBorder.right)));
+        }
+        if (commonBorder.bottom !== 0) {
+          this.addStyles(
+            formatWithJSX("border-bottom", false, consolidateBorders(commonBorder.bottom))
+          );
+        }
+      }
+      return this;
+    }
+    position() {
+      const { node } = this;
+      const isAbsolutePosition = commonIsAbsolutePosition(node);
+      if (isAbsolutePosition) {
+        const { x, y } = getCommonPositionValue(node, this.settings);
+        this.addStyles(
+          formatWithJSX("left", false, x),
+          formatWithJSX("top", false, y),
+          formatWithJSX("position", false, "absolute")
+        );
+      } else {
+        if (node.type === "GROUP" || node.isRelative) {
+          this.addStyles(formatWithJSX("position", false, "relative"));
+        }
+      }
+      return this;
+    }
+    applyFillsToStyle(paintArray, property) {
+      if (property === "text") {
+        this.addStyles(formatWithJSX("text", false, htmlColorFromFills(paintArray)));
+        return this;
+      }
+      const backgroundValues = buildBackgroundValues(paintArray);
+      if (backgroundValues) {
+        this.addStyles(formatWithJSX("background", false, backgroundValues));
+        if (paintArray !== figma.mixed) {
+          const blendModes = this.buildBackgroundBlendModes(paintArray);
+          if (blendModes) {
+            this.addStyles(formatWithJSX("background-blend-mode", false, blendModes));
+          }
+        }
+      }
+      return this;
+    }
+    buildBackgroundBlendModes(paintArray) {
+      if (paintArray.length === 0 || paintArray.every((d) => d.blendMode === "NORMAL" || d.blendMode === "PASS_THROUGH")) {
+        return "";
+      }
+      const blendModes = [...paintArray].reverse().map((paint) => {
+        var _a;
+        if (paint.blendMode === "PASS_THROUGH") {
+          return "normal";
+        }
+        return (_a = paint.blendMode) == null ? void 0 : _a.toLowerCase();
+      });
+      return blendModes.join(", ");
+    }
+    shadow() {
+      const { node } = this;
+      if ("effects" in node) {
+        const shadow = htmlShadow(node);
+        if (shadow) {
+          this.addStyles(formatWithJSX("box-shadow", false, htmlShadow(node)));
+        }
+      }
+      return this;
+    }
+    size() {
+      const { node } = this;
+      const { width, height, constraints } = htmlSizePartial(node, false);
+      if (node.type === "TEXT") {
+        switch (node.textAutoResize) {
+          case "WIDTH_AND_HEIGHT":
+            break;
+          case "HEIGHT":
+            this.addStyles(width);
+            break;
+          case "NONE":
+          case "TRUNCATE":
+            this.addStyles(width, height);
+            break;
+        }
+      } else {
+        this.addStyles(width, height);
+      }
+      if (constraints.length > 0) {
+        this.addStyles(...constraints);
+      }
+      return this;
+    }
+    autoLayoutPadding() {
+      const { node } = this;
+      if ("paddingLeft" in node) {
+        this.addStyles(...htmlPadding(node, false));
+      }
+      return this;
+    }
+    blur() {
+      const { node } = this;
+      if ("effects" in node && node.effects.length > 0) {
+        const blur = node.effects.find((e) => e.type === "LAYER_BLUR" && e.visible);
+        if (blur) {
+          this.addStyles(formatWithJSX("filter", false, `blur(${formatSizeValue(blur.radius / 2)})`));
+        }
+        const backgroundBlur = node.effects.find(
+          (e) => e.type === "BACKGROUND_BLUR" && e.visible
+        );
+        if (backgroundBlur) {
+          this.addStyles(
+            formatWithJSX(
+              "backdrop-filter",
+              false,
+              `blur(${formatSizeValue(backgroundBlur.radius / 2)})`
+            )
+          );
+        }
+      }
+    }
+    addData(label, value) {
+      const attribute = formatDataAttribute(label, value);
+      this.data.push(attribute);
+      return this;
+    }
+    figmaIdAttribute() {
+      return formatIdAttribute(this.node.id);
+    }
+    build(additionalStyle = []) {
+      var _a;
+      this.addStyles(...additionalStyle);
+      const idAttribute = this.figmaIdAttribute();
+      const classNames = [];
+      if (this.name) {
+        this.addData("layer", this.name.trim());
+        const layerNameClass = stringToClassName(this.name.trim());
+        if (layerNameClass !== "") {
+          classNames.push(layerNameClass);
+        }
+      }
+      if ("componentProperties" in this.node && this.node.componentProperties) {
+        (_a = Object.entries(this.node.componentProperties)) == null ? void 0 : _a.map((prop) => {
+          var _a2, _b;
+          if (prop[1].type === "VARIANT" || prop[1].type === "BOOLEAN") {
+            const cleanName = (_b = (_a2 = prop[0].split("#")[0]) == null ? void 0 : _a2.replace(/\s+/g, "-").toLowerCase()) != null ? _b : "";
+            return formatDataAttribute(cleanName, String(prop[1].value));
+          }
+          return "";
+        }).filter(Boolean).sort().forEach((d) => this.data.push(d));
+      }
+      const dataAttributes = this.data.join("");
+      const classAttribute = formatClassAttribute(classNames, false);
+      const styleAttribute = formatStyleAttribute(this.styles, false);
+      return `${idAttribute}${dataAttributes}${classAttribute}${styleAttribute}`;
+    }
+  };
+
+  // ../../packages/pluginMain/src/common/commonTextHeightSpacing.ts
+  var commonLineHeight = (lineHeight, fontSize) => {
+    switch (lineHeight.unit) {
+      case "AUTO":
+        return 0;
+      case "PIXELS":
+        return lineHeight.value;
+      case "PERCENT":
+        return fontSize * lineHeight.value / 100;
+    }
+  };
+  var commonLetterSpacing = (letterSpacing, fontSize) => {
+    switch (letterSpacing.unit) {
+      case "PIXELS":
+        return letterSpacing.value;
+      case "PERCENT":
+        return fontSize * letterSpacing.value / 100;
+    }
+  };
+
+  // ../../packages/pluginMain/src/html/htmlTextBuilder.ts
+  var HtmlTextBuilder = class extends HtmlDefaultBuilder {
+    // eslint-disable-next-line @typescript-eslint/no-useless-constructor -- required to pass node/settings to HtmlDefaultBuilder
+    constructor(node, settings) {
+      super(node, settings);
+      __publicField(this, "htmlElement", "p");
+    }
+    getTextSegments(node) {
+      const segments = node.styledTextSegments;
+      if (!segments) {
+        return [];
+      }
+      return segments.map((segment) => {
+        const additionalStyles = {};
+        const layerBlurStyle = this.getLayerBlurStyle();
+        if (layerBlurStyle) {
+          additionalStyles.filter = layerBlurStyle;
+        }
+        const textShadowStyle = [this.getTextStrokeShadow(), this.getTextShadowStyle()].filter(Boolean).join(", ");
+        if (textShadowStyle) {
+          additionalStyles["text-shadow"] = textShadowStyle;
+        }
+        const styleAttributes = formatMultipleJSX(
+          __spreadValues({
+            color: htmlColorFromFills(segment.fills),
+            "font-size": segment.fontSize,
+            "font-family": segment.fontName.family,
+            "font-style": this.getFontStyle(segment.fontName.style),
+            "font-weight": `${segment.fontWeight}`,
+            "text-decoration": this.textDecoration(segment.textDecoration),
+            "text-transform": this.textTransform(segment.textCase),
+            "line-height": this.lineHeight(segment.lineHeight, segment.fontSize),
+            "letter-spacing": this.letterSpacing(segment.letterSpacing, segment.fontSize),
+            "word-wrap": "break-word"
+          }, additionalStyles),
+          false
+        );
+        const charsWithLineBreak = segment.characters.split("\n").join("<br/>");
+        return {
+          style: styleAttributes,
+          text: charsWithLineBreak,
+          openTypeFeatures: segment.openTypeFeatures
+        };
+      });
+    }
+    fontSize(node, isUI = false) {
+      if (node.fontSize !== figma.mixed) {
+        const value = isUI ? Math.min(node.fontSize, 24) : node.fontSize;
+        this.addStyles(formatWithJSX("font-size", false, value));
+      }
+      return this;
+    }
+    textTrim() {
+      if ("leadingTrim" in this.node && this.node.leadingTrim === "CAP_HEIGHT") {
+        this.addStyles(formatWithJSX("text-box-trim", false, "trim-both"));
+        this.addStyles(formatWithJSX("text-box-edge", false, "cap alphabetic"));
+      }
+      return this;
+    }
+    textDecoration(textDecoration) {
+      switch (textDecoration) {
+        case "STRIKETHROUGH":
+          return "line-through";
+        case "UNDERLINE":
+          return "underline";
+        case "NONE":
+          return "";
+      }
+    }
+    textTransform(textCase) {
+      switch (textCase) {
+        case "UPPER":
+          return "uppercase";
+        case "LOWER":
+          return "lowercase";
+        case "TITLE":
+          return "capitalize";
+        case "ORIGINAL":
+        case "SMALL_CAPS":
+        case "SMALL_CAPS_FORCED":
+        default:
+          return "";
+      }
+    }
+    letterSpacing(letterSpacing, fontSize) {
+      const letterSpacingProp = commonLetterSpacing(letterSpacing, fontSize);
+      if (letterSpacingProp > 0) {
+        return letterSpacingProp;
+      }
+      return null;
+    }
+    lineHeight(lineHeight, fontSize) {
+      const lineHeightProp = commonLineHeight(lineHeight, fontSize);
+      if (lineHeightProp > 0) {
+        return lineHeightProp;
+      }
+      return null;
+    }
+    getFontStyle(style) {
+      if (/italic/.exec(style.toLowerCase())) {
+        return "italic";
+      }
+      return "";
+    }
+    textAlignHorizontal() {
+      const node = this.node;
+      if (node.textAlignHorizontal && node.textAlignHorizontal !== "LEFT") {
+        let textAlign = "";
+        switch (node.textAlignHorizontal) {
+          case "CENTER":
+            textAlign = "center";
+            break;
+          case "RIGHT":
+            textAlign = "right";
+            break;
+          case "JUSTIFIED":
+            textAlign = "justify";
+            break;
+        }
+        this.addStyles(formatWithJSX("text-align", false, textAlign));
+      }
+      return this;
+    }
+    textAlignVertical() {
+      const node = this.node;
+      if (node.textAlignVertical && node.textAlignVertical !== "TOP") {
+        let alignItems = "";
+        switch (node.textAlignVertical) {
+          case "CENTER":
+            alignItems = "center";
+            break;
+          case "BOTTOM":
+            alignItems = "flex-end";
+            break;
+        }
+        if (alignItems) {
+          this.addStyles(formatWithJSX("justify-content", false, alignItems));
+          this.addStyles(formatWithJSX("display", false, "flex"));
+          this.addStyles(formatWithJSX("flex-direction", false, "column"));
+        }
+      }
+      return this;
+    }
+    getTextStrokeShadow() {
+      const node = this.node;
+      const commonBorder = commonStroke(node);
+      if (!commonBorder) {
+        return "";
+      }
+      const weight = "all" in commonBorder ? commonBorder.all : Math.max(commonBorder.left, commonBorder.top, commonBorder.right, commonBorder.bottom);
+      if (weight === 0) {
+        return "";
+      }
+      const color = htmlColorFromFills("strokes" in node && node.strokes);
+      if (!color) {
+        return "";
+      }
+      const strokeAlign = "strokeAlign" in node ? node.strokeAlign : "CENTER";
+      let radius = weight;
+      if (strokeAlign === "CENTER" || strokeAlign === "INSIDE") {
+        radius = weight / 2;
+      }
+      return this.buildTextStrokeShadow(radius, color);
+    }
+    buildTextStrokeShadow(radius, color) {
+      const r = Math.max(1, Math.ceil(radius));
+      const shadows = [];
+      for (let x = -r; x <= r; x++) {
+        for (let y = -r; y <= r; y++) {
+          if (x === 0 && y === 0) {
+            continue;
+          }
+          if (x * x + y * y <= r * r) {
+            shadows.push(`${formatSizeValue(x)} ${formatSizeValue(y)} 0 ${color}`);
+          }
+        }
+      }
+      return shadows.join(", ");
+    }
+    getLayerBlurStyle() {
+      if (this.node && this.node.effects) {
+        const effects = this.node.effects;
+        const blurEffect = effects.find(
+          (effect) => effect.type === "LAYER_BLUR" && effect.visible && effect.radius > 0
+        );
+        if (blurEffect) {
+          return `blur(${formatSizeValue(blurEffect.radius)})`;
+        }
+      }
+      return "";
+    }
+    getTextShadowStyle() {
+      if (this.node && this.node.effects) {
+        const effects = this.node.effects;
+        const dropShadow = effects.find((effect) => effect.type === "DROP_SHADOW" && effect.visible);
+        if (dropShadow) {
+          const ds = dropShadow;
+          const offsetX = Math.round(ds.offset.x);
+          const offsetY = Math.round(ds.offset.y);
+          const blurRadius = Math.round(ds.radius);
+          const r = Math.round(ds.color.r * 255);
+          const g = Math.round(ds.color.g * 255);
+          const b = Math.round(ds.color.b * 255);
+          const a = ds.color.a;
+          return `${formatSizeValue(offsetX)} ${formatSizeValue(offsetY)} ${formatSizeValue(blurRadius)} rgba(${r}, ${g}, ${b}, ${a.toFixed(2)})`;
+        }
+      }
+      return "";
+    }
+  };
+
+  // ../../packages/pluginMain/src/html/builderImpl/htmlAutoLayout.ts
+  var getFlexDirection = (node) => node.layoutMode === "HORIZONTAL" ? "" : "column";
+  var getJustifyContent = (node) => {
+    switch (node.primaryAxisAlignItems) {
+      case void 0:
+      case "MIN":
+        return "flex-start";
+      case "CENTER":
+        return "center";
+      case "MAX":
+        return "flex-end";
+      case "SPACE_BETWEEN":
+        return "space-between";
+    }
+  };
+  var getAlignItems = (node) => {
+    switch (node.counterAxisAlignItems) {
+      case void 0:
+      case "MIN":
+        return "flex-start";
+      case "CENTER":
+        return "center";
+      case "MAX":
+        return "flex-end";
+      case "BASELINE":
+        return "baseline";
+    }
+  };
+  var getGap = (node) => node.itemSpacing > 0 && node.primaryAxisAlignItems !== "SPACE_BETWEEN" ? node.itemSpacing : "";
+  var getFlexWrap = (node) => node.layoutWrap === "WRAP" ? "wrap" : "";
+  var getAlignContent = (node) => {
+    if (node.layoutWrap !== "WRAP") return "";
+    switch (node.counterAxisAlignItems) {
+      case void 0:
+      case "MIN":
+        return "flex-start";
+      case "CENTER":
+        return "center";
+      case "MAX":
+        return "flex-end";
+      case "BASELINE":
+        return "baseline";
+      default:
+        return "normal";
+    }
+  };
+  var getFlex = (node, autoLayout) => node.parent && "layoutMode" in node.parent && node.parent.layoutMode === autoLayout.layoutMode ? "flex" : "inline-flex";
+  var htmlAutoLayoutProps = (node, _settings) => formatMultipleJSXArray(
+    {
+      "flex-direction": getFlexDirection(node),
+      "justify-content": getJustifyContent(node),
+      "align-items": getAlignItems(node),
+      gap: getGap(node),
+      display: getFlex(node, node),
+      "flex-wrap": getFlexWrap(node),
+      "align-content": getAlignContent(node)
+    },
+    false
+  );
+
+  // ../../packages/pluginMain/src/common/curry.ts
+  function curry(fn, arity = fn.length) {
+    return function curried(...args) {
+      if (args.length >= arity) {
+        return fn(...args);
+      }
+      return function(...moreArgs) {
+        return curried(...args, ...moreArgs);
+      };
+    };
+  }
+
+  // ../../packages/pluginMain/src/common/exportAsyncProxy.ts
+  var isRunning = false;
+  var exportAsyncProxy = (node, settings) => __async(null, null, function* () {
+    if (!isRunning) {
+      isRunning = true;
+      yield new Promise((resolve) => setTimeout(resolve, 30));
+    }
+    const figmaNode = yield figma.getNodeByIdAsync(node.id);
+    if (figmaNode.exportAsync === void 0) {
+      throw new TypeError(
+        "Something went wrong. This node doesn't have an exportAsync() function. Maybe check the type before calling this function."
+      );
+    }
+    let result;
+    if (settings.format === "SVG_STRING") {
+      result = yield figmaNode.exportAsync(settings);
+    } else {
+      result = yield figmaNode.exportAsync(settings);
+    }
+    isRunning = false;
+    return result;
+  });
+
+  // ../../packages/pluginMain/src/common/commonConversionWarnings.ts
+  var warnings = /* @__PURE__ */ new Set();
+  var addWarning = (warning) => {
+    if (!warnings.has(warning)) {
+      console.warn(warning);
+    }
+    warnings.add(warning);
+  };
+  var clearWarnings = () => {
+    warnings.clear();
+  };
+
+  // ../../packages/pluginMain/src/altNodes/altNodeUtils.ts
+  var overrideReadonlyProperty = curry(
+    (prop, value, obj) => Object.defineProperty(obj, prop, {
+      value,
+      writable: true,
+      configurable: true
+    })
+  );
+  var assignParent = overrideReadonlyProperty("parent");
+  var assignChildren = overrideReadonlyProperty("children");
+  var assignType = overrideReadonlyProperty("type");
+  var assignRectangleType = assignType("RECTANGLE");
+  function isNotEmpty(value) {
+    return value !== null && value !== void 0;
+  }
+  var isTypeOrGroupOfTypes = curry((matchTypes, node) => {
+    if (matchTypes.includes(node.type)) return true;
+    if ("children" in node) {
+      for (let i = 0; i < node.children.length; i++) {
+        const childNode = node.children[i];
+        const result = isTypeOrGroupOfTypes(matchTypes, childNode);
+        if (!result) {
+          return false;
+        }
+      }
+      return node.children.length > 0;
+    }
+    return false;
+  });
+  var renderAndAttachSVG = (node) => __async(null, null, function* () {
+    if (node.canBeFlattened) {
+      if (node.svg) {
+        return node;
+      }
+      try {
+        const svg = yield exportAsyncProxy(node, {
+          format: "SVG_STRING"
+        });
+        if (node.colorVariableMappings && node.colorVariableMappings.size > 0) {
+          let processedSvg = svg;
+          const colorAttributeRegex = /(fill|stroke)="([^"]*)"/g;
+          processedSvg = processedSvg.replace(colorAttributeRegex, (match, attribute, colorValue) => {
+            const normalizedColor = colorValue.toLowerCase().trim();
+            const mapping = node.colorVariableMappings.get(normalizedColor);
+            if (mapping) {
+              return `${attribute}="var(--${mapping.variableName}, ${colorValue})"`;
+            }
+            return match;
+          });
+          const styleRegex = /style="([^"]*)(?:(fill|stroke):\s*([^;"]*))(;|\s|")([^"]*)"/g;
+          processedSvg = processedSvg.replace(
+            styleRegex,
+            (match, prefix, property, colorValue, separator, suffix) => {
+              const normalizedColor = colorValue.toLowerCase().trim();
+              const mapping = node.colorVariableMappings.get(normalizedColor);
+              if (mapping) {
+                return `style="${prefix}${property}: var(--${mapping.variableName}, ${colorValue})${separator}${suffix}"`;
+              }
+              return match;
+            }
+          );
+          node.svg = processedSvg;
+        } else {
+          node.svg = svg;
+        }
+      } catch (error) {
+        addWarning(`Failed rendering SVG for ${node.name}`);
+        console.error(`Error rendering SVG for ${node.type}:${node.id}`);
+        console.error(error);
+      }
+    }
+    return node;
+  });
+
+  // ../../packages/pluginMain/src/common/nodeVisibility.ts
+  var getVisibleNodes = (nodes) => nodes.filter((d) => {
+    var _a;
+    return (_a = d.visible) != null ? _a : true;
+  });
+
+  // ../../packages/pluginMain/src/common/images.ts
+  var fillIsImage = ({ type }) => type === "IMAGE";
+  var getImageFills = (node) => {
+    try {
+      return node.fills.filter(fillIsImage);
+    } catch (e) {
+      return [];
+    }
+  };
+  var nodeHasImageFill = (node) => getImageFills(node).length > 0;
+
+  // ../../packages/pluginMain/src/html/htmlMain.ts
+  var selfClosingTags = ["img"];
+  var isPreviewGlobal = false;
+  function stripSvgBase64Images(svg) {
+    return svg.replace(/data:image\/[\w+.-]+;base64,[A-Za-z0-9+/=]+/g, "");
+  }
+  var previousExecutionCache;
+  var htmlMain = (sceneNode, settings, isPreview = false) => __async(null, null, function* () {
+    yield initLayoutUnitFromStorage();
+    isPreviewGlobal = isPreview;
+    previousExecutionCache = [];
+    let htmlContent = yield htmlWidgetGenerator(sceneNode, settings, isPreview);
+    if (htmlContent.length > 0 && htmlContent.startsWith("\n")) {
+      htmlContent = htmlContent.slice(1, htmlContent.length);
+    }
+    return { html: htmlContent };
+  });
+  var htmlWidgetGenerator = (sceneNode, settings, isPreview = false) => __async(null, null, function* () {
+    const promiseOfConvertedCode = getVisibleNodes(sceneNode).map(convertNode(settings, isPreview));
+    const code = (yield Promise.all(promiseOfConvertedCode)).join("");
+    return code;
+  });
+  var convertNode = (settings, isPreview = false) => (node) => __async(null, null, function* () {
+    if (settings.embedVectors && node.canBeFlattened) {
+      const altNode = yield renderAndAttachSVG(node);
+      if (altNode.svg) {
+        return htmlWrapSVG(altNode, settings, isPreview);
+      }
+    }
+    switch (node.type) {
+      case "RECTANGLE":
+      case "ELLIPSE":
+        return yield htmlContainer(node, "", [], settings, isPreview);
+      case "GROUP":
+        return yield htmlGroup(node, settings);
+      case "FRAME":
+      case "COMPONENT":
+      case "INSTANCE":
+      case "COMPONENT_SET":
+        return yield htmlFrame(node, settings, isPreview);
+      case "SECTION":
+        return yield htmlSection(node, settings);
+      case "TEXT":
+        return htmlText(node, settings);
+      case "LINE":
+        return htmlLine(node, settings);
+      case "VECTOR":
+        if (!settings.embedVectors && !isPreviewGlobal) {
+          addWarning("Vector is not supported");
+        }
+        return yield htmlContainer(
+          __spreadProps(__spreadValues({}, node), { type: "RECTANGLE" }),
+          "",
+          [],
+          settings,
+          isPreview
+        );
+      default:
+        addWarning(`${node.type} node is not supported`);
+        return "";
+    }
+  });
+  var htmlWrapSVG = (node, settings, _isPreview = false) => {
+    var _a;
+    if (node.svg === "") return "";
+    const builder = new HtmlDefaultBuilder(node, settings).addData("svg-wrapper").position();
+    const build = builder.build();
+    const svgContent = stripSvgBase64Images((_a = node.svg) != null ? _a : "");
+    return `
+<div${build}>
+${indentString(svgContent)}</div>`;
+  };
+  var htmlGroup = (node, settings) => __async(null, null, function* () {
+    if (node.width < 0 || node.height <= 0 || node.children.length === 0) {
+      return "";
+    }
+    const builder = new HtmlDefaultBuilder(node, settings).commonPositionStyles();
+    if (builder.styles) {
+      const attr = builder.build();
+      const generator = yield htmlWidgetGenerator(node.children, settings);
+      return `
+<div${attr}>${indentString(generator)}
+</div>`;
+    }
+    return yield htmlWidgetGenerator(node.children, settings);
+  });
+  var htmlText = (node, settings) => {
+    var _a, _b, _c, _d, _e, _f;
+    const layoutBuilder = new HtmlTextBuilder(node, settings).commonPositionStyles().textTrim().textAlignHorizontal().textAlignVertical();
+    const styledHtml = layoutBuilder.getTextSegments(node);
+    previousExecutionCache.push(...styledHtml);
+    let content = "";
+    if (styledHtml.length === 1) {
+      layoutBuilder.addStyles((_b = (_a = styledHtml[0]) == null ? void 0 : _a.style) != null ? _b : "");
+      content = (_d = (_c = styledHtml[0]) == null ? void 0 : _c.text) != null ? _d : "";
+      const additionalTag = ((_e = styledHtml[0]) == null ? void 0 : _e.openTypeFeatures.SUBS) === true ? "sub" : ((_f = styledHtml[0]) == null ? void 0 : _f.openTypeFeatures.SUPS) === true ? "sup" : "";
+      if (additionalTag) {
+        content = `<${additionalTag}>${content}</${additionalTag}>`;
+      }
+    } else {
+      content = styledHtml.map((style) => {
+        const tag = style.openTypeFeatures.SUBS === true ? "sub" : style.openTypeFeatures.SUPS === true ? "sup" : "span";
+        return `<${tag} style="${style.style}">${style.text}</${tag}>`;
+      }).join("");
+    }
+    return `
+<div${layoutBuilder.build()}>${content}</div>`;
+  };
+  var htmlFrame = (node, settings, isPreview = false) => __async(null, null, function* () {
+    const childrenStr = yield htmlWidgetGenerator(node.children, settings, isPreview);
+    if (node.layoutMode !== "NONE") {
+      const rowColumn = htmlAutoLayoutProps(node, settings);
+      return yield htmlContainer(node, childrenStr, rowColumn, settings, isPreview);
+    }
+    return yield htmlContainer(node, childrenStr, [], settings, isPreview);
+  });
+  var htmlContainer = (_0, _1, ..._2) => __async(null, [_0, _1, ..._2], function* (node, children, additionalStyles = [], settings, _isPreview = false) {
+    if (node.width <= 0 || node.height <= 0) {
+      return children;
+    }
+    const builder = new HtmlDefaultBuilder(node, settings).commonPositionStyles().commonShapeStyles();
+    if (builder.styles || additionalStyles) {
+      let tag = "div";
+      let src = "";
+      if (nodeHasImageFill(node)) {
+        const hasChildren = "children" in node && node.children.length > 0;
+        const imgUrl = "";
+        if (hasChildren) {
+          builder.addStyles(formatWithJSX("background-image", false, `url(${imgUrl})`));
+        } else {
+          tag = "img";
+          src = ` src="${imgUrl}"`;
+        }
+      }
+      const build = builder.build(additionalStyles);
+      if (children) {
+        return `
+<${tag}${build}${src}>${indentString(children)}
+</${tag}>`;
+      } else if (selfClosingTags.includes(tag)) {
+        return `
+<${tag}${build}${src} />`;
+      } else {
+        return `
+<${tag}${build}${src}></${tag}>`;
+      }
+    }
+    return children;
+  });
+  var htmlSection = (node, settings) => __async(null, null, function* () {
+    const childrenStr = yield htmlWidgetGenerator(node.children, settings);
+    const builder = new HtmlDefaultBuilder(node, settings).size().position().applyFillsToStyle(node.fills, "background");
+    if (childrenStr) {
+      return `
+<div${builder.build()}>${indentString(childrenStr)}
+</div>`;
+    } else {
+      return `
+<div${builder.build()}></div>`;
+    }
+  });
+  var htmlLine = (node, settings) => {
+    const builder = new HtmlDefaultBuilder(node, settings).commonPositionStyles().commonShapeStyles();
+    return `
+<div${builder.build()}></div>`;
+  };
+  var htmlCodeGenTextStyles = () => {
+    const result = previousExecutionCache.map((style) => `// ${style.text}
+${style.style.split(";").join(";\n")}`).join("\n---\n");
+    if (!result) {
+      return "// No text styles in this selection";
+    }
+    return result;
+  };
+
+  // ../../packages/pluginMain/src/common/color.ts
+  var rgbTo6hex = (color) => {
+    const hex = (color.r * 255 | 1 << 8).toString(16).slice(1) + (color.g * 255 | 1 << 8).toString(16).slice(1) + (color.b * 255 | 1 << 8).toString(16).slice(1);
+    return hex;
+  };
+
+  // ../../packages/pluginMain/src/common/retrieveUI/commonUI.ts
+  var calculateContrastRatio = (color1, color2) => {
+    const color1luminance = luminance(color1);
+    const color2luminance = luminance(color2);
+    const contrast = color1luminance > color2luminance ? (color2luminance + 0.05) / (color1luminance + 0.05) : (color1luminance + 0.05) / (color2luminance + 0.05);
+    return 1 / contrast;
+  };
+  function luminance(color) {
+    const a = [color.r * 255, color.g * 255, color.b * 255].map((v) => {
+      v /= 255;
+      return v <= 0.03928 ? v / 12.92 : __pow((v + 0.055) / 1.055, 2.4);
+    });
+    return a[0] * 0.2126 + a[1] * 0.7152 + a[2] * 0.0722;
+  }
+
+  // ../../packages/pluginMain/src/common/variableToColorName.ts
+  var variableToColorName = (id) => __async(null, null, function* () {
+    var _a;
+    const name = (_a = yield figma.variables.getVariableByIdAsync(id)) == null ? void 0 : _a.name;
+    if (name) {
+      return name.replace(/\//g, "-").replace(/ /g, "-");
+    }
+    return id.toLowerCase().replace(/:/g, "-");
+  });
+
+  // ../../packages/pluginMain/src/altNodes/iconDetection.ts
+  var ICON_PRIMITIVE_TYPES = /* @__PURE__ */ new Set([
+    "ELLIPSE",
+    "RECTANGLE",
+    "STAR",
+    "POLYGON",
+    "LINE"
+  ]);
+  var ICON_COMPLEX_VECTOR_TYPES = /* @__PURE__ */ new Set(["VECTOR", "BOOLEAN_OPERATION"]);
+  var ICON_TYPES_IGNORE_SIZE = /* @__PURE__ */ new Set([
+    "VECTOR",
+    "BOOLEAN_OPERATION",
+    "POLYGON",
+    "STAR"
+  ]);
+  var ICON_CONTAINER_TYPES = /* @__PURE__ */ new Set([
+    "FRAME",
+    "GROUP",
+    "COMPONENT",
+    "INSTANCE"
+  ]);
+  var DISALLOWED_ICON_TYPES = /* @__PURE__ */ new Set([
+    "SLICE",
+    "CONNECTOR",
+    "STICKY",
+    "SHAPE_WITH_TEXT",
+    "CODE_BLOCK",
+    "WIDGET",
+    "TEXT",
+    "COMPONENT_SET"
+    // Component sets are containers for components, not icons themselves
+  ]);
+  var DISALLOWED_CHILD_TYPES = /* @__PURE__ */ new Set([
+    "FRAME",
+    // No nested frames
+    "COMPONENT",
+    // No nested components
+    "INSTANCE",
+    // No nested instances
+    "TEXT",
+    // No text
+    "SLICE",
+    "CONNECTOR",
+    "STICKY",
+    "SHAPE_WITH_TEXT",
+    "CODE_BLOCK",
+    "WIDGET",
+    "COMPONENT_SET"
+  ]);
+  function isTypicalIconSize(node, maxSize = 64) {
+    if (!("width" in node && "height" in node && node.width > 0 && node.height > 0)) {
+      return false;
+    }
+    return node.width <= maxSize && node.height <= maxSize;
+  }
+  function hasSvgExportSettings(node) {
+    const settingsToCheck = node.exportSettings || [];
+    return settingsToCheck.some((setting) => setting.format === "SVG");
+  }
+  function checkChildrenRecursively(children) {
+    let hasDisallowedChild = false;
+    let hasValidContent = false;
+    for (const child of children) {
+      if (!child.visible) {
+        continue;
+      }
+      if (DISALLOWED_CHILD_TYPES.has(child.type)) {
+        hasDisallowedChild = true;
+        break;
+      }
+      if (ICON_COMPLEX_VECTOR_TYPES.has(child.type) || ICON_PRIMITIVE_TYPES.has(child.type)) {
+        hasValidContent = true;
+      } else if (child.type === "GROUP" && "children" in child) {
+        const groupResult = checkChildrenRecursively(child.children);
+        if (groupResult.hasDisallowedChild) {
+          hasDisallowedChild = true;
+          break;
+        }
+        if (groupResult.hasValidContent) {
+          hasValidContent = true;
+        }
+      }
+    }
+    return { hasDisallowedChild, hasValidContent };
+  }
+  function isLikelyIcon(node, logDetails = false) {
+    const info = [`Node: ${node.name} (${node.type}, ID: ${node.id})`];
+    let result = false;
+    let reason = "";
+    if (DISALLOWED_ICON_TYPES.has(node.type)) {
+      reason = `Disallowed Type: ${node.type}`;
+      result = false;
+    } else if (hasSvgExportSettings(node)) {
+      reason = "Has SVG export settings";
+      result = true;
+    } else if (!("width" in node && "height" in node && node.width > 0 && node.height > 0)) {
+      if (ICON_TYPES_IGNORE_SIZE.has(node.type)) {
+        reason = `Direct ${node.type} type (no dimensions check needed)`;
+        result = true;
+      } else {
+        reason = "No dimensions";
+        result = false;
+      }
+    } else {
+      if (ICON_TYPES_IGNORE_SIZE.has(node.type)) {
+        reason = `Direct ${node.type} type (size ignored)`;
+        result = true;
+      } else if (ICON_PRIMITIVE_TYPES.has(node.type)) {
+        if (isTypicalIconSize(node)) {
+          reason = `Direct ${node.type} with typical size`;
+          result = true;
+        } else {
+          reason = `Direct ${node.type} but too large (${Math.round(node.width)}x${Math.round(node.height)})`;
+          result = false;
+        }
+      } else if (ICON_CONTAINER_TYPES.has(node.type) && "children" in node) {
+        if (!isTypicalIconSize(node)) {
+          reason = `Container but too large (${Math.round(node.width)}x${Math.round(node.height)})`;
+          result = false;
+        } else {
+          const visibleChildren = node.children.filter((child) => child.visible);
+          if (visibleChildren.length === 0) {
+            const hasVisibleFill = "fills" in node && Array.isArray(node.fills) && node.fills.some(
+              (f) => {
+                var _a;
+                return typeof f === "object" && f !== null && f.visible !== false && ("opacity" in f ? (_a = f.opacity) != null ? _a : 1 : 1) > 0;
+              }
+            );
+            const hasVisibleStroke = "strokes" in node && Array.isArray(node.strokes) && node.strokes.some((s) => s.visible !== false);
+            if (hasVisibleFill || hasVisibleStroke) {
+              reason = "Empty container with visible fill/stroke and typical size";
+              result = true;
+            } else {
+              reason = "Empty container with no visible style";
+              result = false;
+            }
+          } else {
+            const checkResult = checkChildrenRecursively(visibleChildren);
+            if (checkResult.hasDisallowedChild) {
+              reason = "Container has disallowed child type (Text, Frame, Component, Instance, etc.)";
+              result = false;
+            } else if (!checkResult.hasValidContent) {
+              reason = "Container has no vector or primitive content";
+              result = false;
+            } else {
+              reason = "Container with valid children and typical size";
+              result = true;
+            }
+          }
+        }
+      } else {
+        reason = "Not a recognized icon structure (Vector, Primitive, or valid Container)";
+        result = false;
+      }
+    }
+    info.push(`Result: ${result ? "YES" : "NO"} (${reason})`);
+    if (logDetails) console.log(info.join(" | "));
+    return result;
+  }
+
+  // ../../packages/pluginMain/src/altNodes/result.js
+  var AdvancedHierarchyReorganizer = {
+    // 统计信息
+    stats: {
+      totalElements: 0,
+      migratedElements: 0,
+      removedDuplicates: 0,
+      preservedElements: 0,
+      startTime: null
+    },
+    // 初始化统计
+    init() {
+      this.stats = {
+        totalElements: 0,
+        migratedElements: 0,
+        removedDuplicates: 0,
+        preservedElements: 0,
+        startTime: Date.now()
+      };
+      console.log("\u{1F680} \u5F00\u59CB\u9AD8\u7EA7\u5C42\u7EA7\u91CD\u7EC4...");
+    },
+    // 统一的旋转处理函数 - 添加边界检查
+    processRotation(element, relativeX, relativeY, parentElement) {
+      if (!element.rotation || element.rotation === 0) {
+        return { x: relativeX, y: relativeY };
+      }
+      console.log(`\u{1F504} \u68C0\u6D4B\u5230\u65CB\u8F6C\u5143\u7D20: "${element.name}" rotation=${element.rotation}`);
+      let rotationDegrees;
+      if (Math.abs(element.rotation) > 2 * Math.PI) {
+        rotationDegrees = element.rotation;
+      } else {
+        rotationDegrees = element.rotation * (180 / Math.PI);
+      }
+      rotationDegrees = (rotationDegrees + 180) % 360 - 180;
+      console.log(`  \u{1F504} \u6807\u51C6\u5316\u65CB\u8F6C\u89D2\u5EA6: ${rotationDegrees}\xB0`);
+      const elementBounds = this.getElementAbsoluteBounds(element);
+      const parentBounds = this.getElementAbsoluteBounds(parentElement);
+      if (!elementBounds || !parentBounds) {
+        return { x: relativeX, y: relativeY };
+      }
+      const elementWidth = elementBounds.width;
+      const elementHeight = elementBounds.height;
+      const parentWidth = parentBounds.width;
+      const parentHeight = parentBounds.height;
+      let newX, newY;
+      if (Math.abs(rotationDegrees) === 180) {
+        newX = parentWidth - elementWidth - relativeX;
+        newY = parentHeight - elementHeight - relativeY;
+        console.log(
+          `  \u{1F504} 180\u5EA6\u65CB\u8F6C\u8C03\u6574: \u5143\u7D20\u5C3A\u5BF8(${elementWidth}x${elementHeight}), \u7236\u5143\u7D20\u5C3A\u5BF8(${parentWidth}x${parentHeight})`
+        );
+        console.log(`  \u{1F504} \u65CB\u8F6C\u540E\u5750\u6807: (${newX}, ${newY})`);
+      } else if (Math.abs(rotationDegrees) === 90) {
+        if (rotationDegrees === 90) {
+          newX = parentWidth - elementHeight - relativeY;
+          newY = relativeX;
+        } else {
+          newX = relativeY;
+          newY = parentHeight - elementWidth - relativeX;
+        }
+        console.log(
+          `  \u{1F504} 90\u5EA6\u65CB\u8F6C\u8C03\u6574: \u5143\u7D20\u5C3A\u5BF8(${elementWidth}x${elementHeight}), \u7236\u5143\u7D20\u5C3A\u5BF8(${parentWidth}x${parentHeight})`
+        );
+        console.log(`  \u{1F504} \u65CB\u8F6C\u540E\u5750\u6807: (${newX}, ${newY})`);
+      } else {
+        const angleRad = rotationDegrees * (Math.PI / 180);
+        const cos = Math.cos(angleRad);
+        const sin = Math.sin(angleRad);
+        const elementCenterX = elementBounds.x + elementWidth / 2;
+        const elementCenterY = elementBounds.y + elementHeight / 2;
+        const centerRelativeX = elementCenterX - parentBounds.x;
+        const centerRelativeY = elementCenterY - parentBounds.y;
+        newX = centerRelativeX * cos - centerRelativeY * sin;
+        newY = centerRelativeX * sin + centerRelativeY * cos;
+        console.log(
+          `  \u{1F504} \u590D\u6742\u65CB\u8F6C\u8C03\u6574: \u89D2\u5EA6=${rotationDegrees}\xB0, cos=${cos.toFixed(3)}, sin=${sin.toFixed(3)}`
+        );
+        console.log(`  \u{1F504} \u65CB\u8F6C\u540E\u5750\u6807: (${newX.toFixed(1)}, ${newY.toFixed(1)})`);
+      }
+      const tolerance = 2;
+      const isOutOfBounds = newX < -tolerance || newY < -tolerance || newX + elementWidth > parentWidth + tolerance || newY + elementHeight > parentHeight + tolerance;
+      const isUnreasonablePosition = newX < -50 || newY < -50 || newX > parentWidth + 50 || newY > parentHeight + 50;
+      const is180DegreeUnreasonable = Math.abs(rotationDegrees) === 180 && (Math.abs(newX - (parentWidth - elementWidth) / 2) > parentWidth * 0.05 || Math.abs(newY - (parentHeight - elementHeight) / 2) > parentHeight * 0.05);
+      if (isOutOfBounds || isUnreasonablePosition || is180DegreeUnreasonable) {
+        console.log(`  \u26A0\uFE0F \u65CB\u8F6C\u540E\u8D85\u51FA\u7236\u5143\u7D20\u8FB9\u754C\u6216\u4F4D\u7F6E\u4E0D\u5408\u7406\uFF0C\u5220\u9664\u65CB\u8F6C\u5C5E\u6027`);
+        console.log(
+          `    \u65CB\u8F6C\u540E\u8FB9\u754C: (${newX}, ${newY}) -> (${newX + elementWidth}, ${newY + elementHeight})`
+        );
+        console.log(`    \u7236\u5143\u7D20\u8FB9\u754C: (0, 0) -> (${parentWidth}, ${parentHeight})`);
+        console.log(
+          `    \u662F\u5426\u8D85\u51FA\u8FB9\u754C: ${isOutOfBounds}, \u662F\u5426\u4F4D\u7F6E\u4E0D\u5408\u7406: ${isUnreasonablePosition}, \u662F\u5426180\u5EA6\u4E0D\u5408\u7406: ${is180DegreeUnreasonable}`
+        );
+        if (element.rotation !== void 0) {
+          console.log(`  \u{1F5D1}\uFE0F \u5220\u9664rotation\u5C5E\u6027: "${element.name}" ${element.rotation} \u2192 undefined`);
+          delete element.rotation;
+        }
+        if (element.cumulativeRotation !== void 0) {
+          console.log(
+            `  \u{1F5D1}\uFE0F \u5220\u9664cumulativeRotation\u5C5E\u6027: "${element.name}" ${element.cumulativeRotation} \u2192 undefined`
+          );
+          delete element.cumulativeRotation;
+        }
+        return { x: relativeX, y: relativeY };
+      }
+      console.log(`  \u2705 \u65CB\u8F6C\u540E\u5750\u6807\u5728\u7236\u5143\u7D20\u8FB9\u754C\u5185\uFF0C\u4F7F\u7528\u65CB\u8F6C\u540E\u7684\u5750\u6807`);
+      return { x: newX, y: newY };
+    },
+    // 判断元素是否需要绝对定位 - 精确判断
+    needsAbsolutePositioning(element, parentElement = null) {
+      if (element.layoutPositioning === "ABSOLUTE") {
+        return true;
+      }
+      if (!parentElement) {
+        return false;
+      }
+      if (parentElement.layoutMode === "NONE" || !parentElement.layoutMode) {
+        return true;
+      }
+      if (parentElement.layoutMode && parentElement.layoutMode !== "NONE") {
+        if (element.rotation && element.rotation !== 0) {
+          return true;
+        }
+        if (element.constraints) {
+          const { vertical, horizontal } = element.constraints;
+          if (vertical === "TOP" && horizontal === "LEFT") {
+            return true;
+          }
+        }
+      }
+      return false;
+    },
+    // 计算元素的相对坐标 - 使用统一的旋转处理
+    calculateRelativePosition(element, parentElement = null) {
+      if (!parentElement) {
+        return { x: element.x || 0, y: element.y || 0 };
+      }
+      if (element.absoluteBoundingBox && parentElement.absoluteBoundingBox) {
+        let relativeX = element.absoluteBoundingBox.x - parentElement.absoluteBoundingBox.x;
+        let relativeY = element.absoluteBoundingBox.y - parentElement.absoluteBoundingBox.y;
+        const rotationResult = this.processRotation(element, relativeX, relativeY, parentElement);
+        relativeX = rotationResult.x;
+        relativeY = rotationResult.y;
+        if (element.fills && element.fills.length > 0) {
+          const imageFill = element.fills.find((fill) => fill.type === "IMAGE" && fill.imageTransform);
+          if (imageFill && imageFill.imageTransform) {
+            console.log(`\u{1F5BC}\uFE0F \u68C0\u6D4B\u5230\u56FE\u50CF\u53D8\u6362: "${element.name}"`);
+            console.log(`  \u{1F5BC}\uFE0F \u56FE\u50CF\u53D8\u6362\u77E9\u9635:`, imageFill.imageTransform);
+            const matrix = imageFill.imageTransform;
+            if (matrix && matrix.length >= 2) {
+              const [a, b, c] = matrix[0];
+              const [d, e, f] = matrix[1];
+              const transformedX = relativeX * a + relativeY * b + c;
+              const transformedY = relativeX * d + relativeY * e + f;
+              relativeX = transformedX;
+              relativeY = transformedY;
+              console.log(`  \u{1F5BC}\uFE0F \u56FE\u50CF\u53D8\u6362\u540E\u5750\u6807: (${relativeX.toFixed(1)}, ${relativeY.toFixed(1)})`);
+            }
+          }
+        }
+        console.log(`\u{1F522} \u5750\u6807\u8BA1\u7B97: "${element.name}" \u76F8\u5BF9\u4E8E "${parentElement.name}"`);
+        console.log(
+          `  \u5143\u7D20\u7EDD\u5BF9\u5750\u6807: (${element.absoluteBoundingBox.x}, ${element.absoluteBoundingBox.y})`
+        );
+        console.log(
+          `  \u7236\u5143\u7D20\u7EDD\u5BF9\u5750\u6807: (${parentElement.absoluteBoundingBox.x}, ${parentElement.absoluteBoundingBox.y})`
+        );
+        console.log(`  \u6700\u7EC8\u76F8\u5BF9\u5750\u6807: (${relativeX.toFixed(1)}, ${relativeY.toFixed(1)})`);
+        return { x: relativeX, y: relativeY };
+      }
+      return { x: element.x || 0, y: element.y || 0 };
+    },
+    // 判断包含关系（使用绝对边界框）- 精确判断
+    isElementContainedIn(element, container, tolerance = 0) {
+      if (!element || !container) return false;
+      const elementBounds = this.getElementAbsoluteBounds(element);
+      const containerBounds = this.getElementAbsoluteBounds(container);
+      const isContained = elementBounds.x >= containerBounds.x - tolerance && elementBounds.y >= containerBounds.y - tolerance && elementBounds.x + elementBounds.width <= containerBounds.x + containerBounds.width + tolerance && elementBounds.y + elementBounds.height <= containerBounds.y + containerBounds.height + tolerance;
+      if (isContained) {
+        if (element.id && container.id && element.id.includes(container.id)) {
+          return false;
+        }
+        if (container.children && container.children.some((child) => child.id === element.id)) {
+          return false;
+        }
+      }
+      return isContained;
+    },
+    // 获取元素的绝对边界
+    getElementAbsoluteBounds(element) {
+      if (element.absoluteBoundingBox) {
+        return {
+          x: element.absoluteBoundingBox.x || 0,
+          y: element.absoluteBoundingBox.y || 0,
+          width: element.absoluteBoundingBox.width || element.width || 0,
+          height: element.absoluteBoundingBox.height || element.height || 0
+        };
+      }
+      return {
+        x: element.x || 0,
+        y: element.y || 0,
+        width: element.width || 0,
+        height: element.height || 0
+      };
+    },
+    // 检查元素是否应该被迁移
+    shouldMigrateElement(element, currentParent, potentialParent) {
+      if (!element || !potentialParent) return false;
+      const isContained = this.isElementContainedIn(element, potentialParent);
+      if (!isContained) return false;
+      const needsAbsolute = this.needsAbsolutePositioning(element, potentialParent);
+      if (!needsAbsolute) return false;
+      if (currentParent && currentParent.id === potentialParent.id) return false;
+      if (!this.isCompatibleParent(element, potentialParent)) return false;
+      return true;
+    },
+    // 检查父元素兼容性 - 考虑type属性
+    isCompatibleParent(element, parent) {
+      if (!parent || !element) return false;
+      if (parent.id === element.id) return false;
+      const parentType = parent.type;
+      const elementType = element.type;
+      const containerTypes = ["FRAME", "COMPONENT", "INSTANCE", "COMPONENT_SET", "GROUP", "SECTION"];
+      if (!containerTypes.includes(parentType)) {
+        console.log(`\u26A0\uFE0F \u7236\u5143\u7D20\u7C7B\u578B\u4E0D\u517C\u5BB9: "${parent.name}" (${parentType}) \u4E0D\u80FD\u4F5C\u4E3A\u5BB9\u5668`);
+        return false;
+      }
+      return true;
+    },
+    // 迁移元素到新的父元素 - 精确迁移
+    migrateElement(element, newParent, originalParent = null) {
+      if (!element || !newParent) return;
+      console.log(`\u{1F504} \u8FC1\u79FB\u5143\u7D20: "${element.name}" \u2192 "${newParent.name}"`);
+      if (originalParent && originalParent.children) {
+        const index = originalParent.children.indexOf(element);
+        if (index > -1) {
+          originalParent.children.splice(index, 1);
+          console.log(`  \u{1F4E4} \u4ECE "${originalParent.name}" \u79FB\u9664`);
+        }
+      }
+      if (!newParent.children) {
+        newParent.children = [];
+      }
+      newParent.children.push(element);
+      element.parent = newParent;
+      console.log(`  \u{1F4E5} \u6DFB\u52A0\u5230 "${newParent.name}"`);
+      this.updateRotationProperties(element, newParent, originalParent);
+      const newPosition = this.calculateRelativePosition(element, newParent);
+      const oldX = element.x || 0;
+      const oldY = element.y || 0;
+      element.x = newPosition.x;
+      element.y = newPosition.y;
+      console.log(`  \u{1F4CD} \u5750\u6807\u66F4\u65B0: (${oldX}, ${oldY}) \u2192 (${newPosition.x}, ${newPosition.y})`);
+      this.updateElementPositioning(element, newParent);
+      this.ensureCorrectType(element, newParent);
+      this.stats.migratedElements++;
+    },
+    // 更新旋转属性 - 处理rotation和cumulativeRotation
+    updateRotationProperties(element, newParent, originalParent) {
+      if (!element || !newParent) return;
+      console.log(`\u{1F504} \u65CB\u8F6C\u5C5E\u6027\u66F4\u65B0: "${element.name}"`);
+      console.log(`  \u539F\u7236\u5143\u7D20: "${(originalParent == null ? void 0 : originalParent.name) || "\u65E0"}"`);
+      console.log(`  \u65B0\u7236\u5143\u7D20: "${newParent.name}"`);
+      let originalCumulativeRotation = 0;
+      if (originalParent) {
+        let currentParent2 = originalParent;
+        while (currentParent2) {
+          if (currentParent2.rotation !== void 0 && currentParent2.rotation !== 0) {
+            originalCumulativeRotation += currentParent2.rotation;
+          }
+          currentParent2 = currentParent2.parent;
+        }
+      }
+      let newCumulativeRotation = 0;
+      let currentParent = newParent;
+      while (currentParent) {
+        if (currentParent.rotation !== void 0 && currentParent.rotation !== 0) {
+          newCumulativeRotation += currentParent.rotation;
+        }
+        currentParent = currentParent.parent;
+      }
+      const originalRotation = element.rotation || 0;
+      const originalCumulativeRotationValue = element.cumulativeRotation || 0;
+      const newParentHasRotation = newParent.rotation !== void 0 && newParent.rotation !== 0;
+      const newParentChainHasRotation = newCumulativeRotation !== 0;
+      if (!newParentHasRotation && !newParentChainHasRotation) {
+        if (element.rotation !== void 0) {
+          console.log(`  \u{1F5D1}\uFE0F \u5220\u9664rotation\u5C5E\u6027: "${element.name}" ${element.rotation} \u2192 undefined`);
+          delete element.rotation;
+        }
+        if (element.cumulativeRotation !== void 0) {
+          console.log(
+            `  \u{1F5D1}\uFE0F \u5220\u9664cumulativeRotation\u5C5E\u6027: "${element.name}" ${element.cumulativeRotation} \u2192 undefined`
+          );
+          delete element.cumulativeRotation;
+        }
+      } else {
+        const totalOriginalRotation = originalRotation + originalCumulativeRotationValue;
+        const newRotation = totalOriginalRotation - newCumulativeRotation;
+        if (newRotation !== 0) {
+          element.rotation = newRotation;
+          console.log(`  \u{1F504} \u66F4\u65B0rotation: "${element.name}" ${originalRotation} \u2192 ${newRotation}`);
+        } else {
+          if (element.rotation !== void 0) {
+            console.log(`  \u{1F5D1}\uFE0F \u5220\u9664rotation\u5C5E\u6027: "${element.name}" ${element.rotation} \u2192 undefined`);
+            delete element.rotation;
+          }
+        }
+        element.cumulativeRotation = newCumulativeRotation;
+        console.log(
+          `  \u{1F504} \u66F4\u65B0cumulativeRotation: "${element.name}" ${originalCumulativeRotationValue} \u2192 ${newCumulativeRotation}`
+        );
+      }
+      const totalRotation = (element.rotation || 0) + (element.cumulativeRotation || 0);
+      if (Math.abs(totalRotation) > 360) {
+        console.warn(`\u26A0\uFE0F \u65CB\u8F6C\u89D2\u5EA6\u5F02\u5E38: "${element.name}" totalRotation=${totalRotation}`);
+      }
+      console.log(`  \u2705 \u65CB\u8F6C\u5C5E\u6027\u66F4\u65B0\u5B8C\u6210: "${element.name}"`);
+      console.log(`    rotation: ${element.rotation !== void 0 ? element.rotation : "undefined"}`);
+      console.log(
+        `    cumulativeRotation: ${element.cumulativeRotation !== void 0 ? element.cumulativeRotation : "undefined"}`
+      );
+      console.log(`    \u603B\u65CB\u8F6C\u89D2\u5EA6: ${totalRotation}\xB0`);
+    },
+    // 更新元素的定位属性 - 精确处理所有关键属性
+    updateElementPositioning(element, parentElement) {
+      if (!element || !parentElement) return;
+      if (!element.id) {
+        console.warn(`\u26A0\uFE0F \u5143\u7D20\u7F3A\u5C11ID: "${element.name}"`);
+      }
+      if (!element.absoluteBoundingBox) {
+        console.warn(`\u26A0\uFE0F \u5143\u7D20\u7F3A\u5C11absoluteBoundingBox: "${element.name}"`);
+      } else {
+        const { x, y, width, height } = element.absoluteBoundingBox;
+        if (x === void 0 || y === void 0 || width === void 0 || height === void 0) {
+          console.warn(`\u26A0\uFE0F absoluteBoundingBox\u4E0D\u5B8C\u6574: "${element.name}"`, element.absoluteBoundingBox);
+        }
+      }
+      if (!element.absoluteRenderBounds) {
+        if (element.absoluteBoundingBox) {
+          element.absoluteRenderBounds = __spreadValues({}, element.absoluteBoundingBox);
+        }
+      }
+      if (parentElement.layoutMode && parentElement.layoutMode !== "NONE") {
+        delete element.layoutPositioning;
+        element.layoutGrow = element.layoutGrow || 0;
+        element.layoutSizingHorizontal = element.layoutSizingHorizontal || "FIXED";
+        element.layoutSizingVertical = element.layoutSizingVertical || "FIXED";
+      } else {
+        element.layoutPositioning = "ABSOLUTE";
+        delete element.layoutGrow;
+        delete element.layoutSizingHorizontal;
+        delete element.layoutSizingVertical;
+      }
+      if (element.x === void 0 || element.y === void 0) {
+        console.warn(`\u26A0\uFE0F \u5143\u7D20\u7F3A\u5C11\u5750\u6807: "${element.name}" x=${element.x}, y=${element.y}`);
+      }
+      if (!element.constraints) {
+        element.constraints = {
+          vertical: "TOP",
+          horizontal: "LEFT"
+        };
+      }
+      console.log(
+        `  \u{1F527} \u66F4\u65B0\u5B9A\u4F4D\u5C5E\u6027: "${element.name}" layoutPositioning=${element.layoutPositioning || "undefined"}, x=${element.x}, y=${element.y}`
+      );
+    },
+    // 确保type属性正确 - 根据HTML生成逻辑
+    ensureCorrectType(element, parentElement) {
+      if (!element) return;
+      const hasChildren = element.children && element.children.length > 0;
+      const originalType = element.type;
+      let newType = originalType;
+      if (hasChildren) {
+        switch (originalType) {
+          case "RECTANGLE":
+          case "ELLIPSE":
+          case "LINE":
+          case "VECTOR":
+          case "TEXT":
+            newType = "FRAME";
+            break;
+          case "FRAME":
+          case "COMPONENT":
+          case "INSTANCE":
+          case "COMPONENT_SET":
+          case "GROUP":
+          case "SECTION":
+            break;
+          default:
+            newType = "FRAME";
+            break;
+        }
+      } else {
+        switch (originalType) {
+          case "FRAME":
+          case "COMPONENT":
+          case "INSTANCE":
+          case "COMPONENT_SET":
+          case "GROUP":
+          case "SECTION":
+            newType = "RECTANGLE";
+            break;
+          case "RECTANGLE":
+          case "ELLIPSE":
+          case "TEXT":
+          case "LINE":
+          case "VECTOR":
+            break;
+          default:
+            newType = "RECTANGLE";
+            break;
+        }
+      }
+      if (newType !== originalType) {
+        console.log(
+          `  \u{1F504} \u8C03\u6574type: "${element.name}" ${originalType} \u2192 ${newType} (${hasChildren ? "\u6709\u5B50\u5143\u7D20" : "\u65E0\u5B50\u5143\u7D20"})`
+        );
+        element.type = newType;
+      }
+    },
+    // 移除重复元素
+    removeDuplicateElements(elements) {
+      const uniqueElements = [];
+      const seen = /* @__PURE__ */ new Set();
+      for (const element of elements) {
+        if (!seen.has(element.id)) {
+          seen.add(element.id);
+          uniqueElements.push(element);
+        } else {
+          this.stats.removedDuplicates++;
+          console.log(`\u{1F5D1}\uFE0F \u79FB\u9664\u91CD\u590D\u5143\u7D20: "${element.name}"`);
+        }
+      }
+      return uniqueElements;
+    },
+    // 处理单个层级的元素
+    processLevel(elements, parentChain = []) {
+      if (!elements || elements.length === 0) return elements;
+      this.stats.totalElements += elements.length;
+      const uniqueElements = this.removeDuplicateElements(elements);
+      for (let i = 0; i < uniqueElements.length; i++) {
+        const element = uniqueElements[i];
+        for (let j = 0; j < uniqueElements.length; j++) {
+          if (i === j) continue;
+          const potentialParent = uniqueElements[j];
+          if (this.shouldMigrateElement(element, element.parent, potentialParent)) {
+            this.migrateElement(element, potentialParent, element.parent);
+            uniqueElements.splice(i, 1);
+            i--;
+            break;
+          }
+        }
+      }
+      return uniqueElements;
+    },
+    // 递归处理层级结构
+    processHierarchy(element, parentChain = []) {
+      if (!element) return;
+      if (element.children && element.children.length > 0) {
+        element.children = this.processLevel(element.children, [...parentChain, element]);
+        for (const child of element.children) {
+          this.processHierarchy(child, [...parentChain, element]);
+        }
+      }
+    },
+    // 重新计算所有元素的坐标
+    recalculateAllCoordinates(rootElement) {
+      console.log(`\u{1F3AF} \u91CD\u65B0\u8BA1\u7B97\u5750\u6807: "${rootElement.name}"`);
+      this.recalculateElementCoordinates(rootElement, null);
+      console.log("\u2705 \u5750\u6807\u91CD\u8BA1\u7B97\u5B8C\u6210!");
+    },
+    // 递归计算元素及其子元素的坐标
+    recalculateElementCoordinates(element, parentElement = null, visited = /* @__PURE__ */ new Set()) {
+      if (!element) return;
+      if (visited.has(element.id)) {
+        console.warn(`\u26A0\uFE0F \u68C0\u6D4B\u5230\u5FAA\u73AF\u5F15\u7528\uFF0C\u8DF3\u8FC7\u5143\u7D20: "${element.name}" (${element.id})`);
+        return;
+      }
+      visited.add(element.id);
+      if (parentElement) {
+        const needsAbsolute = this.needsAbsolutePositioning(element, parentElement);
+        if (needsAbsolute) {
+          const newPosition = this.calculateRelativePosition(element, parentElement);
+          if (element.x !== newPosition.x || element.y !== newPosition.y) {
+            const oldX = element.x || 0;
+            const oldY = element.y || 0;
+            element.x = newPosition.x;
+            element.y = newPosition.y;
+            if (Math.abs(oldX - newPosition.x) > 1 || Math.abs(oldY - newPosition.y) > 1) {
+              console.log(
+                `\u{1F4CD} \u5750\u6807\u66F4\u65B0: "${element.name}" (${oldX}, ${oldY}) \u2192 (${newPosition.x}, ${newPosition.y})`
+              );
+            }
+          }
+          if (!element.layoutPositioning) {
+            element.layoutPositioning = "ABSOLUTE";
+          }
+        } else {
+          if (element.layoutPositioning === "ABSOLUTE") {
+            delete element.layoutPositioning;
+            console.log(`\u{1F504} \u79FB\u9664\u7EDD\u5BF9\u5B9A\u4F4D: "${element.name}"`);
+          }
+        }
+      }
+      if (element.children && element.children.length > 0) {
+        for (const child of element.children) {
+          this.recalculateElementCoordinates(child, element, visited);
+        }
+      }
+      visited.delete(element.id);
+    },
+    // 同步父子元素属性 - 精确同步
+    syncParentChildProperties(rootElement) {
+      const visited = /* @__PURE__ */ new Set();
+      const syncRecursive = (element, parentElement = null) => {
+        if (!element || visited.has(element.id)) return;
+        visited.add(element.id);
+        if (parentElement) {
+          element.parent = parentElement;
+          if (!parentElement.children) {
+            parentElement.children = [];
+          }
+          if (!parentElement.children.find((child) => child.id === element.id)) {
+            parentElement.children.push(element);
+          }
+        } else {
+          element.parent = null;
+        }
+        this.syncLayoutProperties(element, parentElement);
+        this.syncConstraints(element, parentElement);
+        this.syncPositioningProperties(element, parentElement);
+        this.syncRotationProperties(element, parentElement);
+        if (element.children && element.children.length > 0) {
+          for (const child of element.children) {
+            syncRecursive(child, element);
+          }
+        }
+      };
+      syncRecursive(rootElement);
+      console.log("\u2705 \u7236\u5B50\u5C5E\u6027\u540C\u6B65\u5B8C\u6210");
+    },
+    // 同步旋转属性 - 确保rotation和cumulativeRotation正确
+    syncRotationProperties(element, parentElement) {
+      if (!element) return;
+      if (element.rotation === void 0) {
+        element.rotation = 0;
+      }
+      if (element.cumulativeRotation === void 0) {
+        element.cumulativeRotation = 0;
+      }
+      if (isNaN(element.rotation) || isNaN(element.cumulativeRotation)) {
+        element.rotation = 0;
+        element.cumulativeRotation = 0;
+        console.log(`\u{1F527} \u4FEE\u590D\u65E0\u6548\u65CB\u8F6C\u5C5E\u6027: "${element.name}"`);
+      }
+      const totalRotation = (element.rotation || 0) + (element.cumulativeRotation || 0);
+      if (Math.abs(totalRotation) > 360) {
+        console.warn(`\u26A0\uFE0F \u65CB\u8F6C\u89D2\u5EA6\u5F02\u5E38: "${element.name}" totalRotation=${totalRotation}`);
+      }
+      if (parentElement) {
+        let expectedCumulativeRotation = 0;
+        let currentParent = parentElement;
+        while (currentParent) {
+          if (currentParent.rotation !== void 0 && currentParent.rotation !== 0) {
+            expectedCumulativeRotation += currentParent.rotation;
+          }
+          currentParent = currentParent.parent;
+        }
+        if (Math.abs(element.cumulativeRotation - expectedCumulativeRotation) > 0.1) {
+          const oldCumulativeRotation = element.cumulativeRotation;
+          element.cumulativeRotation = expectedCumulativeRotation;
+          console.log(
+            `\u{1F527} \u4FEE\u590DcumulativeRotation: "${element.name}" ${oldCumulativeRotation} \u2192 ${expectedCumulativeRotation}`
+          );
+        }
+      }
+    },
+    // 同步定位属性 - 精确处理所有关键属性
+    syncPositioningProperties(element, parentElement) {
+      if (!element) return;
+      if (!element.id) {
+        console.warn(`\u26A0\uFE0F \u5143\u7D20\u7F3A\u5C11ID: "${element.name}"`);
+      }
+      if (!element.absoluteBoundingBox) {
+        console.warn(`\u26A0\uFE0F \u5143\u7D20\u7F3A\u5C11absoluteBoundingBox: "${element.name}"`);
+      } else {
+        const { x, y, width, height } = element.absoluteBoundingBox;
+        if (x === void 0 || y === void 0 || width === void 0 || height === void 0) {
+          console.warn(`\u26A0\uFE0F absoluteBoundingBox\u4E0D\u5B8C\u6574: "${element.name}"`, element.absoluteBoundingBox);
+        }
+      }
+      if (!element.absoluteRenderBounds) {
+        if (element.absoluteBoundingBox) {
+          element.absoluteRenderBounds = __spreadValues({}, element.absoluteBoundingBox);
+        }
+      }
+      if (element.x === void 0 || element.y === void 0) {
+        if (element.absoluteBoundingBox) {
+          if (parentElement && parentElement.absoluteBoundingBox) {
+            element.x = element.absoluteBoundingBox.x - parentElement.absoluteBoundingBox.x;
+            element.y = element.absoluteBoundingBox.y - parentElement.absoluteBoundingBox.y;
+          } else {
+            element.x = element.absoluteBoundingBox.x;
+            element.y = element.absoluteBoundingBox.y;
+          }
+        } else {
+          element.x = 0;
+          element.y = 0;
+        }
+      }
+      if (element.width === void 0 || element.height === void 0) {
+        if (element.absoluteBoundingBox) {
+          element.width = element.absoluteBoundingBox.width;
+          element.height = element.absoluteBoundingBox.height;
+        } else {
+          element.width = 0;
+          element.height = 0;
+        }
+      }
+      if (parentElement) {
+        const needsAbsolute = this.needsAbsolutePositioning(element, parentElement);
+        if (needsAbsolute) {
+          element.layoutPositioning = "ABSOLUTE";
+          if (!element.constraints) {
+            element.constraints = {
+              vertical: "TOP",
+              horizontal: "LEFT"
+            };
+          }
+        } else {
+          delete element.layoutPositioning;
+          if (!element.constraints) {
+            element.constraints = {
+              vertical: "TOP",
+              horizontal: "LEFT"
+            };
+          }
+        }
+      }
+      this.validateElementProperties(element);
+    },
+    // 验证元素属性的完整性
+    validateElementProperties(element) {
+      const requiredProps = ["id", "name", "type"];
+      const missingProps = requiredProps.filter((prop) => !element[prop]);
+      if (missingProps.length > 0) {
+        console.warn(`\u26A0\uFE0F \u5143\u7D20\u7F3A\u5C11\u5FC5\u8981\u5C5E\u6027: "${element.name}" \u7F3A\u5C11: ${missingProps.join(", ")}`);
+      }
+      if (element.type) {
+        const validTypes = [
+          "RECTANGLE",
+          "ELLIPSE",
+          "TEXT",
+          "FRAME",
+          "GROUP",
+          "INSTANCE",
+          "COMPONENT",
+          "COMPONENT_SET",
+          "SECTION",
+          "LINE",
+          "VECTOR"
+        ];
+        if (!validTypes.includes(element.type)) {
+          console.warn(`\u26A0\uFE0F \u5143\u7D20type\u5C5E\u6027\u65E0\u6548: "${element.name}" type=${element.type}`);
+        }
+      }
+      if (typeof element.x !== "number" || typeof element.y !== "number") {
+        console.warn(
+          `\u26A0\uFE0F \u5143\u7D20\u5750\u6807\u7C7B\u578B\u9519\u8BEF: "${element.name}" x=${typeof element.x}, y=${typeof element.y}`
+        );
+      }
+      if (typeof element.width !== "number" || typeof element.height !== "number") {
+        console.warn(
+          `\u26A0\uFE0F \u5143\u7D20\u5C3A\u5BF8\u7C7B\u578B\u9519\u8BEF: "${element.name}" width=${typeof element.width}, height=${typeof element.height}`
+        );
+      }
+      if (element.absoluteBoundingBox) {
+        const { x, y, width, height } = element.absoluteBoundingBox;
+        if (typeof x !== "number" || typeof y !== "number" || typeof width !== "number" || typeof height !== "number") {
+          console.warn(
+            `\u26A0\uFE0F absoluteBoundingBox\u7C7B\u578B\u9519\u8BEF: "${element.name}"`,
+            element.absoluteBoundingBox
+          );
+        }
+      }
+    },
+    // 同步布局相关属性
+    syncLayoutProperties(element, parentElement) {
+      if (!parentElement) {
+        element.layoutMode = element.layoutMode || "NONE";
+        element.layoutGrow = 0;
+        element.layoutSizingHorizontal = "FIXED";
+        element.layoutSizingVertical = "FIXED";
+        element.primaryAxisAlignItems = "MIN";
+        element.counterAxisAlignItems = "MIN";
+        return;
+      }
+      if (parentElement.layoutMode && parentElement.layoutMode !== "NONE") {
+        element.layoutGrow = element.layoutGrow || 0;
+        element.layoutSizingHorizontal = element.layoutSizingHorizontal || "FIXED";
+        element.layoutSizingVertical = element.layoutSizingVertical || "FIXED";
+        if (element.layoutPositioning === "ABSOLUTE") {
+          delete element.layoutPositioning;
+        }
+      } else {
+        if (this.needsAbsolutePositioning(element, parentElement)) {
+          element.layoutPositioning = "ABSOLUTE";
+        }
+      }
+    },
+    // 同步约束属性
+    syncConstraints(element, parentElement) {
+      if (!element.constraints) {
+        element.constraints = {
+          vertical: "TOP",
+          horizontal: "LEFT"
+        };
+      }
+      if (element.layoutPositioning === "ABSOLUTE") {
+        element.constraints.vertical = "TOP";
+        element.constraints.horizontal = "LEFT";
+      }
+    },
+    // 确保层级健康性 - 精确处理所有关键属性
+    ensureHierarchyHealth(rootElement) {
+      let healthIssues = 0;
+      const visited = /* @__PURE__ */ new Set();
+      const checkRecursive = (element, parentElement = null, level = 0) => {
+        if (!element || visited.has(element.id)) return;
+        visited.add(element.id);
+        if (!element.id) {
+          console.warn(`\u26A0\uFE0F \u5143\u7D20\u7F3A\u5C11ID: "${element.name}"`);
+          healthIssues++;
+        }
+        if (!element.absoluteBoundingBox) {
+          console.warn(`\u26A0\uFE0F \u5143\u7D20\u7F3A\u5C11absoluteBoundingBox: "${element.name}"`);
+          healthIssues++;
+        } else {
+          const { x, y, width, height } = element.absoluteBoundingBox;
+          if (x === void 0 || y === void 0 || width === void 0 || height === void 0) {
+            console.warn(
+              `\u26A0\uFE0F absoluteBoundingBox\u4E0D\u5B8C\u6574: "${element.name}"`,
+              element.absoluteBoundingBox
+            );
+            healthIssues++;
+          }
+        }
+        if (!element.absoluteRenderBounds) {
+          if (element.absoluteBoundingBox) {
+            element.absoluteRenderBounds = __spreadValues({}, element.absoluteBoundingBox);
+            console.log(`\u{1F527} \u4FEE\u590DabsoluteRenderBounds: "${element.name}"`);
+            healthIssues++;
+          }
+        }
+        if (parentElement && element.parent !== parentElement) {
+          element.parent = parentElement;
+          healthIssues++;
+          console.log(`\u{1F527} \u4FEE\u590D\u7236\u5B50\u5173\u7CFB: "${element.name}" \u2192 "${parentElement.name}"`);
+        }
+        if (element.children) {
+          for (let i = element.children.length - 1; i >= 0; i--) {
+            const child = element.children[i];
+            if (!child || typeof child !== "object") {
+              element.children.splice(i, 1);
+              healthIssues++;
+              console.log(`\u{1F527} \u79FB\u9664\u65E0\u6548\u5B50\u5143\u7D20: "${element.name}"`);
+              continue;
+            }
+            if (child.parent !== element) {
+              child.parent = element;
+              healthIssues++;
+            }
+          }
+        }
+        if (element.x !== void 0 && element.y !== void 0) {
+          if (isNaN(element.x) || isNaN(element.y)) {
+            element.x = 0;
+            element.y = 0;
+            healthIssues++;
+            console.log(`\u{1F527} \u4FEE\u590D\u65E0\u6548\u5750\u6807: "${element.name}"`);
+          }
+        }
+        if (element.width !== void 0 && element.height !== void 0) {
+          if (isNaN(element.width) || isNaN(element.height) || element.width < 0 || element.height < 0) {
+            if (element.absoluteBoundingBox) {
+              element.width = element.absoluteBoundingBox.width;
+              element.height = element.absoluteBoundingBox.height;
+            } else {
+              element.width = Math.max(element.width || 0, 0);
+              element.height = Math.max(element.height || 0, 0);
+            }
+            healthIssues++;
+            console.log(`\u{1F527} \u4FEE\u590D\u65E0\u6548\u5C3A\u5BF8: "${element.name}"`);
+          }
+        }
+        if (element.layoutMode === void 0) {
+          element.layoutMode = "NONE";
+          console.log(`\u{1F527} \u8BBE\u7F6E\u9ED8\u8BA4layoutMode: "${element.name}"`);
+          healthIssues++;
+        }
+        this.validateRotationProperties(element);
+        this.validateElementProperties(element);
+        this.ensureCorrectType(element, parentElement);
+        if (element.children && element.children.length > 0) {
+          for (const child of element.children) {
+            checkRecursive(child, element, level + 1);
+          }
+        }
+      };
+      checkRecursive(rootElement);
+      if (healthIssues === 0) {
+        console.log("\u2705 \u5C42\u7EA7\u7ED3\u6784\u5B8C\u5168\u5065\u5EB7");
+      } else {
+        console.log(`\u26A0\uFE0F \u53D1\u73B0 ${healthIssues} \u4E2A\u5065\u5EB7\u95EE\u9898\uFF0C\u5DF2\u4FEE\u590D`);
+      }
+    },
+    // 验证布局属性一致性
+    validateLayoutConsistency(element, parentElement) {
+      if (!parentElement) return;
+      if (parentElement.layoutMode && parentElement.layoutMode !== "NONE") {
+        if (element.layoutPositioning === "ABSOLUTE") {
+          delete element.layoutPositioning;
+          console.log(`\u{1F527} \u79FB\u9664\u4E0D\u4E00\u81F4\u7684\u7EDD\u5BF9\u5B9A\u4F4D: "${element.name}"`);
+        }
+      } else {
+        if (this.needsAbsolutePositioning(element, parentElement) && !element.layoutPositioning) {
+          element.layoutPositioning = "ABSOLUTE";
+          console.log(`\u{1F527} \u6DFB\u52A0\u7F3A\u5931\u7684\u7EDD\u5BF9\u5B9A\u4F4D: "${element.name}"`);
+        }
+      }
+    },
+    // 验证旋转属性 - 确保rotation和cumulativeRotation正确
+    validateRotationProperties(element) {
+      if (!element) return;
+      if (element.rotation !== void 0 && isNaN(element.rotation)) {
+        element.rotation = 0;
+        console.warn(`\u26A0\uFE0F \u4FEE\u590D\u65E0\u6548rotation: "${element.name}"`);
+      }
+      if (element.cumulativeRotation !== void 0 && isNaN(element.cumulativeRotation)) {
+        element.cumulativeRotation = 0;
+        console.warn(`\u26A0\uFE0F \u4FEE\u590D\u65E0\u6548cumulativeRotation: "${element.name}"`);
+      }
+      const totalRotation = (element.rotation || 0) + (element.cumulativeRotation || 0);
+      if (Math.abs(totalRotation) > 360) {
+        console.warn(`\u26A0\uFE0F \u65CB\u8F6C\u89D2\u5EA6\u5F02\u5E38: "${element.name}" totalRotation=${totalRotation}`);
+      }
+      if (element.parent) {
+        let expectedCumulativeRotation = 0;
+        let currentParent = element.parent;
+        while (currentParent) {
+          if (currentParent.rotation !== void 0 && currentParent.rotation !== 0) {
+            expectedCumulativeRotation += currentParent.rotation;
+          }
+          currentParent = currentParent.parent;
+        }
+        if (Math.abs((element.cumulativeRotation || 0) - expectedCumulativeRotation) > 0.1) {
+          const oldCumulativeRotation = element.cumulativeRotation || 0;
+          element.cumulativeRotation = expectedCumulativeRotation;
+          console.log(
+            `\u{1F527} \u4FEE\u590DcumulativeRotation\u7EE7\u627F: "${element.name}" ${oldCumulativeRotation} \u2192 ${expectedCumulativeRotation}`
+          );
+        }
+      }
+    },
+    // 主处理函数
+    reorganize(rootElement) {
+      this.init();
+      if (!rootElement) {
+        console.log("\u274C \u6CA1\u6709\u6839\u5143\u7D20\u53EF\u5904\u7406");
+        return rootElement;
+      }
+      console.log(`\u{1F3AF} \u5F00\u59CB\u91CD\u7EC4\u5C42\u7EA7\u7ED3\u6784: "${rootElement.name}"`);
+      this.processHierarchy(rootElement);
+      console.log("\n\u{1F504} \u5F00\u59CB\u91CD\u65B0\u8BA1\u7B97\u6240\u6709\u5143\u7D20\u5750\u6807...");
+      this.recalculateAllCoordinates(rootElement);
+      console.log("\n\u{1F517} \u540C\u6B65\u7236\u5B50\u5143\u7D20\u5C5E\u6027...");
+      this.syncParentChildProperties(rootElement);
+      console.log("\n\u{1F3E5} \u68C0\u67E5\u5C42\u7EA7\u5065\u5EB7\u6027...");
+      this.ensureHierarchyHealth(rootElement);
+      this.printStats();
+      return rootElement;
+    },
+    // 打印统计信息
+    printStats() {
+      const duration = Date.now() - this.stats.startTime;
+      console.log("\n\u{1F4C8} \u5C42\u7EA7\u91CD\u7EC4\u7EDF\u8BA1:");
+      console.log(`  \u603B\u5143\u7D20\u6570: ${this.stats.totalElements}`);
+      console.log(`  \u8FC1\u79FB\u5143\u7D20: ${this.stats.migratedElements}`);
+      console.log(`  \u79FB\u9664\u91CD\u590D: ${this.stats.removedDuplicates}`);
+      console.log(`  \u4FDD\u7559\u5143\u7D20: ${this.stats.preservedElements}`);
+      console.log(`  \u5904\u7406\u65F6\u95F4: ${duration}ms`);
+      console.log("\u2705 \u5C42\u7EA7\u91CD\u7EC4\u5B8C\u6210!\n");
+    }
+  };
+  console.log("\u{1F680} \u5F00\u59CB\u6267\u884C\u9AD8\u7EA7\u5C42\u7EA7\u91CD\u7EC4...");
+
+  // ../../packages/pluginMain/src/altNodes/jsonNodeConversion.ts
+  var getNodeByIdAsyncTime = 0;
+  var getNodeByIdAsyncCalls = 0;
+  var getStyledTextSegmentsTime = 0;
+  var getStyledTextSegmentsCalls = 0;
+  var processColorVariablesTime = 0;
+  var processColorVariablesCalls = 0;
+  var resetPerformanceCounters = () => {
+    getNodeByIdAsyncTime = 0;
+    getNodeByIdAsyncCalls = 0;
+    getStyledTextSegmentsTime = 0;
+    getStyledTextSegmentsCalls = 0;
+    processColorVariablesTime = 0;
+    processColorVariablesCalls = 0;
+  };
+  var nodeNameCounters = /* @__PURE__ */ new Map();
+  var variableCache = /* @__PURE__ */ new Map();
+  var memoizedVariableToColorName = (variableId) => __async(null, null, function* () {
+    if (!variableCache.has(variableId)) {
+      const colorName = (yield variableToColorName(variableId)).replaceAll(",", "");
+      variableCache.set(variableId, colorName);
+      return colorName;
+    }
+    return variableCache.get(variableId);
+  });
+  var collectNodeColorVariables = (node) => __async(null, null, function* () {
+    const colorMappings = /* @__PURE__ */ new Map();
+    const addMappingFromPaint = (paint) => {
+      var _a;
+      if (paint.type === "SOLID" && paint.variableColorName && paint.color && ((_a = paint.boundVariables) == null ? void 0 : _a.color)) {
+        const variableName = paint.boundVariables.color.name || paint.variableColorName;
+        if (variableName) {
+          const sanitizedVarName = variableName.replace(/[^a-zA-Z0-9_-]/g, "-");
+          const colorInfo = {
+            variableId: paint.boundVariables.color.id,
+            variableName: sanitizedVarName
+          };
+          const r = Math.round(paint.color.r * 255);
+          const g = Math.round(paint.color.g * 255);
+          const b = Math.round(paint.color.b * 255);
+          const hexColor = `#${r.toString(16).padStart(2, "0")}${g.toString(16).padStart(2, "0")}${b.toString(16).padStart(2, "0")}`.toLowerCase();
+          colorMappings.set(hexColor, colorInfo);
+          if (r === 255 && g === 255 && b === 255) {
+            colorMappings.set("white", colorInfo);
+            colorMappings.set("rgb(255,255,255)", colorInfo);
+          } else if (r === 0 && g === 0 && b === 0) {
+            colorMappings.set("black", colorInfo);
+            colorMappings.set("rgb(0,0,0)", colorInfo);
+          }
+        }
+      }
+    };
+    if (node.fills && Array.isArray(node.fills)) {
+      node.fills.forEach(addMappingFromPaint);
+    }
+    if (node.strokes && Array.isArray(node.strokes)) {
+      node.strokes.forEach(addMappingFromPaint);
+    }
+    if (node.children && Array.isArray(node.children)) {
+      for (const child of node.children) {
+        const childMappings = yield collectNodeColorVariables(child);
+        childMappings.forEach((value, key) => {
+          colorMappings.set(key, value);
+        });
+      }
+    }
+    return colorMappings;
+  });
+  var processColorVariables = (paint) => __async(null, null, function* () {
+    var _a;
+    const start = Date.now();
+    processColorVariablesCalls++;
+    if (paint.type === "GRADIENT_ANGULAR" || paint.type === "GRADIENT_DIAMOND" || paint.type === "GRADIENT_LINEAR" || paint.type === "GRADIENT_RADIAL") {
+      const stopsWithVariables = paint.gradientStops.filter((stop) => {
+        var _a2;
+        return (_a2 = stop.boundVariables) == null ? void 0 : _a2.color;
+      });
+      if (stopsWithVariables.length > 0) {
+        yield Promise.all(
+          stopsWithVariables.map((stop) => __async(null, null, function* () {
+            ;
+            stop.variableColorName = yield memoizedVariableToColorName(
+              stop.boundVariables.color.id
+            );
+          }))
+        );
+      }
+    } else if (paint.type === "SOLID" && ((_a = paint.boundVariables) == null ? void 0 : _a.color)) {
+      ;
+      paint.variableColorName = yield memoizedVariableToColorName(
+        paint.boundVariables.color.id
+      );
+    }
+    processColorVariablesTime += Date.now() - start;
+  });
+  var processEffectVariables = (paint) => __async(null, null, function* () {
+    var _a;
+    const start = Date.now();
+    processColorVariablesCalls++;
+    if ((_a = paint.boundVariables) == null ? void 0 : _a.color) {
+      ;
+      paint.variableColorName = yield memoizedVariableToColorName(
+        paint.boundVariables.color.id
+      );
+    }
+    processColorVariablesTime += Date.now() - start;
+  });
+  var getColorVariables = (node, settings) => __async(null, null, function* () {
+    if (settings.useColorVariables) {
+      if (node.fills && Array.isArray(node.fills)) {
+        yield Promise.all(node.fills.map((fill) => processColorVariables(fill)));
+      }
+      if (node.strokes && Array.isArray(node.strokes)) {
+        yield Promise.all(node.strokes.map((stroke) => processColorVariables(stroke)));
+      }
+      if ("effects" in node && node.effects && Array.isArray(node.effects)) {
+        yield Promise.all(
+          node.effects.filter(
+            (effect) => effect.type === "DROP_SHADOW" || effect.type === "INNER_SHADOW"
+          ).map((effect) => processEffectVariables(effect))
+        );
+      }
+    }
+  });
+  function adjustChildrenOrder(node) {
+    if (!node.itemReverseZIndex || !node.children || node.layoutMode === "NONE") {
+      return;
+    }
+    const children = node.children;
+    const absoluteChildren = [];
+    const fixedChildren = [];
+    for (let i = children.length - 1; i >= 0; i--) {
+      const child = children[i];
+      if (child.layoutPositioning === "ABSOLUTE") {
+        absoluteChildren.push(child);
+      } else {
+        fixedChildren.unshift(child);
+      }
+    }
+    node.children = [...absoluteChildren, ...fixedChildren];
+  }
+  var getParentBBoxOrigin = (parent) => {
+    if (parent && "absoluteBoundingBox" in parent && parent.absoluteBoundingBox) {
+      return { x: parent.absoluteBoundingBox.x, y: parent.absoluteBoundingBox.y };
+    }
+    return { x: 0, y: 0 };
+  };
+  function toProcessingAltNode(node) {
+    return node;
+  }
+  var processNodePair = (jsonNode, figmaNode, settings, parentNode, parentCumulativeRotation = 0) => __async(null, null, function* () {
+    var _a, _b;
+    if (!jsonNode.id) return null;
+    if (jsonNode.visible === false) return null;
+    const nodeType = jsonNode.type;
+    if (parentNode) {
+      jsonNode.cumulativeRotation = parentCumulativeRotation;
+    }
+    if ((nodeType === "FRAME" || nodeType === "INSTANCE" || nodeType === "COMPONENT" || nodeType === "COMPONENT_SET") && (!jsonNode.children || jsonNode.children.length === 0)) {
+      ;
+      jsonNode.type = "RECTANGLE";
+      return processNodePair(jsonNode, figmaNode, settings, parentNode, parentCumulativeRotation);
+    }
+    if ("rotation" in jsonNode && jsonNode.rotation) {
+      jsonNode.rotation = -jsonNode.rotation * (180 / Math.PI);
+    }
+    if (nodeType === "GROUP" && jsonNode.children) {
+      const processedChildren = [];
+      if (Array.isArray(jsonNode.children) && figmaNode && "children" in figmaNode) {
+        const visibleJsonChildren = jsonNode.children.filter((child) => child.visible !== false);
+        const figmaChildrenById = /* @__PURE__ */ new Map();
+        figmaNode.children.forEach((child) => {
+          figmaChildrenById.set(child.id, child);
+        });
+        for (const child of visibleJsonChildren) {
+          const figmaChild = figmaChildrenById.get(child.id);
+          if (!figmaChild) continue;
+          const processedChild = yield processNodePair(
+            toProcessingAltNode(child),
+            figmaChild,
+            settings,
+            parentNode,
+            // The group's parent
+            parentCumulativeRotation + (jsonNode.rotation || 0)
+          );
+          if (processedChild !== null) {
+            if (Array.isArray(processedChild)) {
+              processedChildren.push(...processedChild);
+            } else {
+              processedChildren.push(processedChild);
+            }
+          }
+        }
+      }
+      return processedChildren;
+    }
+    if (nodeType === "SLICE") {
+      return null;
+    }
+    if (parentNode) {
+      jsonNode.parent = parentNode;
+    }
+    const cleanName = jsonNode.name.trim();
+    const count = nodeNameCounters.get(cleanName) || 0;
+    nodeNameCounters.set(cleanName, count + 1);
+    jsonNode.uniqueName = count === 0 ? cleanName : `${cleanName}_${count.toString().padStart(2, "0")}`;
+    if (figmaNode.type === "TEXT") {
+      const getSegmentsStart = Date.now();
+      getStyledTextSegmentsCalls++;
+      let styledTextSegments = figmaNode.getStyledTextSegments([
+        "fontName",
+        "fills",
+        "fontSize",
+        "fontWeight",
+        "hyperlink",
+        "indentation",
+        "letterSpacing",
+        "lineHeight",
+        "listOptions",
+        "textCase",
+        "textDecoration",
+        "textStyleId",
+        "fillStyleId",
+        "openTypeFeatures"
+      ]);
+      getStyledTextSegmentsTime += Date.now() - getSegmentsStart;
+      if (styledTextSegments.length > 0) {
+        const baseSegmentName = (jsonNode.uniqueName || jsonNode.name).replace(/[^a-zA-Z0-9_-]/g, "").toLowerCase();
+        styledTextSegments = yield Promise.all(
+          styledTextSegments.map((segment, index) => __async(null, null, function* () {
+            const mutableSegment = Object.assign({}, segment);
+            if (settings.useColorVariables && segment.fills) {
+              mutableSegment.fills = yield Promise.all(
+                segment.fills.map((d) => __async(null, null, function* () {
+                  if (d.blendMode !== "PASS_THROUGH" && d.blendMode !== "NORMAL") {
+                    addWarning("BlendMode is not supported in Text colors");
+                  }
+                  const fill = __spreadValues({}, d);
+                  yield processColorVariables(fill);
+                  return fill;
+                }))
+              );
+            }
+            if (styledTextSegments.length === 1) {
+              mutableSegment.uniqueId = `${baseSegmentName}_span`;
+            } else {
+              mutableSegment.uniqueId = `${baseSegmentName}_span_${(index + 1).toString().padStart(2, "0")}`;
+            }
+            return mutableSegment;
+          }))
+        );
+        jsonNode.styledTextSegments = styledTextSegments;
+      }
+      if (jsonNode.style) {
+        Object.assign(jsonNode, jsonNode.style);
+      }
+      if (!jsonNode.textAutoResize) {
+        jsonNode.textAutoResize = "NONE";
+      }
+    }
+    if ("absoluteBoundingBox" in jsonNode && jsonNode.absoluteBoundingBox) {
+      if (jsonNode.parent) {
+        const parentOrigin = getParentBBoxOrigin(jsonNode.parent);
+        const rect = calculateRectangleFromBoundingBox(
+          {
+            width: jsonNode.absoluteBoundingBox.width,
+            height: jsonNode.absoluteBoundingBox.height,
+            x: jsonNode.absoluteBoundingBox.x - parentOrigin.x,
+            y: jsonNode.absoluteBoundingBox.y - parentOrigin.y
+          },
+          -((jsonNode.rotation || 0) + (jsonNode.cumulativeRotation || 0))
+        );
+        jsonNode.width = rect.width;
+        jsonNode.height = rect.height;
+        jsonNode.x = rect.left;
+        jsonNode.y = rect.top;
+      } else {
+        jsonNode.width = jsonNode.absoluteBoundingBox.width;
+        jsonNode.height = jsonNode.absoluteBoundingBox.height;
+        jsonNode.x = 0;
+        jsonNode.y = 0;
+      }
+    }
+    if (settings.embedVectors && !(parentNode == null ? void 0 : parentNode.canBeFlattened)) {
+      const isIcon = isLikelyIcon(jsonNode);
+      jsonNode.canBeFlattened = isIcon;
+      if (isIcon && settings.useColorVariables) {
+        ;
+        jsonNode._collectColorMappings = true;
+      }
+    } else {
+      ;
+      jsonNode.canBeFlattened = false;
+    }
+    if ("individualStrokeWeights" in jsonNode && jsonNode.individualStrokeWeights) {
+      ;
+      jsonNode.strokeTopWeight = jsonNode.individualStrokeWeights.top;
+      jsonNode.strokeBottomWeight = jsonNode.individualStrokeWeights.bottom;
+      jsonNode.strokeLeftWeight = jsonNode.individualStrokeWeights.left;
+      jsonNode.strokeRightWeight = jsonNode.individualStrokeWeights.right;
+    }
+    if ("fills" in jsonNode) {
+      yield getColorVariables(jsonNode, settings);
+    }
+    if ("layoutMode" in jsonNode && jsonNode.layoutMode) {
+      if (jsonNode.paddingLeft === void 0) {
+        jsonNode.paddingLeft = 0;
+      }
+      if (jsonNode.paddingRight === void 0) {
+        jsonNode.paddingRight = 0;
+      }
+      if (jsonNode.paddingTop === void 0) {
+        jsonNode.paddingTop = 0;
+      }
+      if (jsonNode.paddingBottom === void 0) {
+        jsonNode.paddingBottom = 0;
+      }
+    }
+    if (!jsonNode.layoutMode) jsonNode.layoutMode = "NONE";
+    if (!jsonNode.layoutGrow) jsonNode.layoutGrow = 0;
+    if (!jsonNode.layoutSizingHorizontal) jsonNode.layoutSizingHorizontal = "FIXED";
+    if (!jsonNode.layoutSizingVertical) jsonNode.layoutSizingVertical = "FIXED";
+    if (!jsonNode.primaryAxisAlignItems) {
+      jsonNode.primaryAxisAlignItems = "MIN";
+    }
+    if (!jsonNode.counterAxisAlignItems) {
+      jsonNode.counterAxisAlignItems = "MIN";
+    }
+    const hasChildren = "children" in jsonNode && jsonNode.children && Array.isArray(jsonNode.children) && jsonNode.children.length > 0;
+    if (jsonNode.layoutSizingHorizontal === "HUG" && !hasChildren) {
+      jsonNode.layoutSizingHorizontal = "FIXED";
+    }
+    if (jsonNode.layoutSizingVertical === "HUG" && !hasChildren) {
+      jsonNode.layoutSizingVertical = "FIXED";
+    }
+    if ("children" in jsonNode && jsonNode.children && Array.isArray(jsonNode.children) && "children" in figmaNode) {
+      const visibleJsonChildren = jsonNode.children.filter((child) => child.visible !== false);
+      const figmaChildrenById = /* @__PURE__ */ new Map();
+      figmaNode.children.forEach((child) => {
+        figmaChildrenById.set(child.id, child);
+      });
+      const cumulative = parentCumulativeRotation + (jsonNode.type === "GROUP" ? jsonNode.rotation || 0 : 0);
+      const processedChildren = [];
+      for (const child of visibleJsonChildren) {
+        const figmaChild = figmaChildrenById.get(child.id);
+        if (!figmaChild) continue;
+        const processedChild = yield processNodePair(
+          toProcessingAltNode(child),
+          figmaChild,
+          settings,
+          jsonNode,
+          cumulative
+        );
+        if (processedChild !== null) {
+          if (Array.isArray(processedChild)) {
+            processedChildren.push(...processedChild);
+          } else {
+            processedChildren.push(processedChild);
+          }
+        }
+      }
+      ;
+      jsonNode.children = processedChildren;
+      if (jsonNode.layoutMode === "NONE" || ((_b = (_a = jsonNode.children) == null ? void 0 : _a.some(
+        (d) => "layoutPositioning" in d && d.layoutPositioning === "ABSOLUTE"
+      )) != null ? _b : false)) {
+        jsonNode.isRelative = true;
+      }
+      adjustChildrenOrder(jsonNode);
+    }
+    if (jsonNode._collectColorMappings) {
+      ;
+      jsonNode.colorVariableMappings = yield collectNodeColorVariables(jsonNode);
+      delete jsonNode._collectColorMappings;
+    }
+    return jsonNode;
+  });
+  var nodesToJSON = (nodes, settings) => __async(null, null, function* () {
+    nodeNameCounters.clear();
+    const exportJsonStart = Date.now();
+    console.log("[debug] nodesToJSON - nodes", nodes);
+    const nodeResults = yield Promise.all(
+      nodes.map((node) => __async(null, null, function* () {
+        const nodeDoc = (yield node.exportAsync({
+          format: "JSON_REST_V1"
+        })).document;
+        console.log(
+          "[debug] nodeDoc",
+          node.type,
+          node,
+          nodeDoc,
+          yield node.exportAsync({
+            format: "JSON_REST_V1"
+          })
+        );
+        let nodeCumulativeRotation = 0;
+        if (node.type === "GROUP") {
+          nodeDoc.type = "FRAME";
+          if ("rotation" in nodeDoc && nodeDoc.rotation) {
+            nodeCumulativeRotation = -nodeDoc.rotation * (180 / Math.PI);
+            nodeDoc.rotation = 0;
+          }
+        }
+        return {
+          nodeDoc,
+          nodeCumulativeRotation
+        };
+      }))
+    );
+    console.log("[debug] initial nodeJson", __spreadValues({}, nodes[0]));
+    console.log(
+      `[benchmark][inside nodesToJSON] JSON_REST_V1 export: ${Date.now() - exportJsonStart}ms`
+    );
+    const processNodesStart = Date.now();
+    const result = [];
+    for (let i = 0; i < nodes.length; i++) {
+      const nodeResult = nodeResults[i];
+      const figmaNode = nodes[i];
+      if (!nodeResult || !figmaNode) continue;
+      const processedNode = yield processNodePair(
+        nodeResult.nodeDoc,
+        figmaNode,
+        settings,
+        void 0,
+        nodeResult.nodeCumulativeRotation
+      );
+      if (processedNode !== null) {
+        if (Array.isArray(processedNode)) {
+          result.push(...processedNode);
+        } else {
+          result.push(processedNode);
+        }
+      }
+    }
+    console.log(
+      `[benchmark][inside nodesToJSON] Process node pairs: ${Date.now() - processNodesStart}ms`
+    );
+    console.log("[debug] final nodeJson for result", result);
+    const reorganizedResults = result.map((node) => {
+      console.log(`[debug] \u5F00\u59CB\u91CD\u7EC4\u8282\u70B9: ${node.name}`);
+      return AdvancedHierarchyReorganizer.reorganize(node);
+    });
+    console.log("[debug] reorganizedResults", reorganizedResults);
+    return reorganizedResults;
+  });
+
+  // ../../packages/pluginMain/src/common/retrieveUI/retrieveColors.ts
+  var retrieveGenericSolidUIColors = () => __async(null, null, function* () {
+    const selectionColors = figma.getSelectionColors();
+    if (!selectionColors || selectionColors.paints.length === 0) return [];
+    const colors = [];
+    yield Promise.all(
+      selectionColors.paints.map((d) => __async(null, null, function* () {
+        const paint = __spreadValues({}, d);
+        yield processColorVariables(paint);
+        const fill = convertSolidColor(paint);
+        if (fill) {
+          const exists = colors.find((col) => col.exportValue === fill.exportValue);
+          if (!exists) {
+            colors.push(fill);
+          }
+        }
+      }))
+    );
+    return colors.sort((a, b) => a.hex.localeCompare(b.hex));
+  });
+  var convertSolidColor = (fill) => {
+    const black = { r: 0, g: 0, b: 0 };
+    const white = { r: 1, g: 1, b: 1 };
+    if (fill.type !== "SOLID") return null;
+    const output = {
+      hex: rgbTo6hex(fill.color).toUpperCase(),
+      colorName: "",
+      exportValue: htmlColorFromFill(fill),
+      contrastBlack: calculateContrastRatio(fill.color, black),
+      contrastWhite: calculateContrastRatio(fill.color, white)
+    };
+    return output;
+  };
+  var retrieveGenericLinearGradients = () => {
+    var _a, _b;
+    const selectionColors = figma.getSelectionColors();
+    const colorStr = [];
+    if (!selectionColors || selectionColors.paints.length === 0) return Promise.resolve([]);
+    for (const paint of selectionColors.paints) {
+      if (paint.type === "GRADIENT_LINEAR") {
+        const t = paint.gradientTransform;
+        const fill = __spreadProps(__spreadValues({}, paint), {
+          gradientStops: [...paint.gradientStops],
+          gradientHandlePositions: [
+            { x: t[0][2], y: t[1][2] },
+            { x: t[0][0] + t[0][2], y: t[1][0] + t[1][2] }
+          ],
+          blendMode: (_a = paint.blendMode) != null ? _a : "NORMAL"
+        });
+        if (fill.gradientStops) {
+          for (const stop of fill.gradientStops) {
+            if ((_b = stop.boundVariables) == null ? void 0 : _b.color) {
+              try {
+                const variableId = stop.boundVariables.color.id;
+                const variable = figma.variables.getVariableById(variableId);
+                if (variable) {
+                  ;
+                  stop.variableColorName = variable.name.replace(/\s+/g, "-").toLowerCase();
+                }
+              } catch (e) {
+                console.error("Error retrieving variable for gradient stop:", e);
+              }
+            }
+          }
+        }
+        colorStr.push({
+          cssPreview: htmlGradientFromFills(fill),
+          exportValue: htmlGradientFromFills(fill)
+        });
+      }
+    }
+    return Promise.resolve(colorStr);
+  };
+
+  // ../../packages/pluginMain/src/messaging.ts
+  var sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+  var postBackendMessage = (message) => {
+    figma.ui.postMessage(message);
+  };
+  var postEmptyMessage = () => {
+    postBackendMessage({ type: "empty" });
+  };
+  var postConversionComplete = (conversionData) => {
+    postBackendMessage(__spreadProps(__spreadValues({}, conversionData), { type: "code" }));
+  };
+  var postSettingsChanged = (settings) => {
+    postBackendMessage({
+      type: "pluginSettingsChanged",
+      settings
+    });
+  };
+  var postLoadingAsync = (_0, ..._1) => __async(null, [_0, ..._1], function* (loading, options = {}) {
+    const { sleepBefore = 10, sleepAfter = 10 } = options;
+    if (sleepBefore) {
+      yield sleep(sleepBefore);
+    }
+    postBackendMessage({ type: "loading", loading });
+    if (sleepAfter) {
+      yield sleep(sleepAfter);
+    }
+  });
+
+  // ../../packages/pluginMain/src/common/retrieveUI/convertToCode.ts
+  var convertToCode = (nodes, settings) => __async(null, null, function* () {
+    const data = yield htmlMain(nodes, settings);
+    return __spreadProps(__spreadValues({}, data), { base64ImageList: [] });
+  });
+
+  // ../../packages/pluginMain/src/altNodes/oldAltConversion.ts
+  var isTypeOrGroupOfTypes2 = curry((matchTypes, node) => {
+    if (!node.visible || matchTypes.includes(node.type)) return true;
+    if ("children" in node) {
+      for (let i = 0; i < node.children.length; i++) {
+        const childNode = node.children[i];
+        const result = isTypeOrGroupOfTypes2(matchTypes, childNode);
+        if (result) continue;
+        return false;
+      }
+      return true;
+    }
+    return false;
+  });
+  var globalTextStyleSegments = {};
+  var canBeFlattened = isTypeOrGroupOfTypes2(["VECTOR", "STAR", "POLYGON", "BOOLEAN_OPERATION"]);
+  var convertNodeToAltNode = (parent) => (node) => {
+    const type = node.type;
+    switch (type) {
+      // Standard nodes
+      case "RECTANGLE":
+      case "ELLIPSE":
+      case "LINE":
+      case "STAR":
+      case "POLYGON":
+      case "VECTOR":
+      case "BOOLEAN_OPERATION":
+        return cloneNode(node, parent);
+      // Group nodes
+      case "FRAME":
+      case "INSTANCE":
+      case "COMPONENT":
+      case "COMPONENT_SET":
+        if (node.children.length === 0) return cloneAsRectangleNode(node, parent);
+      // goto SECTION
+      case "GROUP":
+        if (type === "GROUP" && node.children.length === 1 && node.visible) {
+          const child = node.children[0];
+          if (child) return convertNodeToAltNode(parent)(child);
+        }
+      // goto SECTION
+      case "SECTION":
+        const group = cloneNode(node, parent);
+        const groupChildren = oldConvertNodesToAltNodes(node.children, group);
+        return assignChildren(groupChildren, group);
+      // Text Nodes
+      case "TEXT":
+        globalTextStyleSegments[node.id] = extractStyledTextSegments(
+          node
+        );
+        return cloneNode(node, parent);
+      // Unsupported Nodes
+      case "SLICE":
+        throw new Error(`Sorry, Slices are not supported. Type:${node.type} id:${node.id}`);
+      default:
+        throw new Error(
+          `Sorry, an unsupported node type was selected. Type:${node.type} id:${node.id}`
+        );
+    }
+  };
+  var oldConvertNodesToAltNodes = (sceneNode, parent) => sceneNode.map(convertNodeToAltNode(parent)).filter(isNotEmpty);
+  var cloneNode = (node, parent) => {
+    const cloned = {};
+    for (const prop in node) {
+      if (prop !== "parent" && prop !== "children" && prop !== "horizontalPadding" && prop !== "verticalPadding" && prop !== "mainComponent" && prop !== "masterComponent" && prop !== "variantProperties" && prop !== "get_annotations" && prop !== "componentPropertyDefinitions" && prop !== "exposedInstances" && prop !== "instances" && prop !== "componentProperties" && prop !== "componenPropertyReferences" && prop !== "constrainProportions") {
+        cloned[prop] = node[prop];
+      }
+    }
+    assignParent(parent, cloned);
+    const altNode = __spreadProps(__spreadValues({}, cloned), {
+      parent: cloned.parent,
+      originalNode: node,
+      canBeFlattened: canBeFlattened(node)
+    });
+    if (globalTextStyleSegments[node.id]) {
+      ;
+      altNode.styledTextSegments = globalTextStyleSegments[node.id];
+    }
+    console.log("altnode:", altNode.parent, cloned.parent);
+    return altNode;
+  };
+  var cloneAsRectangleNode = (node, parent) => {
+    const clonedNode = cloneNode(node, parent);
+    assignRectangleType(clonedNode);
+    return clonedNode;
+  };
+  var extractStyledTextSegments = (node) => node.getStyledTextSegments([
+    "fontName",
+    "fills",
+    "fontSize",
+    "fontWeight",
+    "hyperlink",
+    "indentation",
+    "letterSpacing",
+    "lineHeight",
+    "listOptions",
+    "textCase",
+    "textDecoration",
+    "textStyleId",
+    "fillStyleId",
+    "openTypeFeatures"
+  ]);
+
+  // ../../packages/pluginMain/src/common/formatNodeName.ts
+  function formatNodeName(name) {
+    let lastName = name;
+    lastName = lastName.replace(/\s+/g, "-");
+    lastName = lastName.replace(/\//g, "-");
+    return lastName;
+  }
+
+  // ../../packages/pluginMain/src/code.ts
+  var run = (settings) => __async(null, null, function* () {
+    yield postLoadingAsync(true, { sleepAfter: 50 });
+    resetPerformanceCounters();
+    clearWarnings();
+    const { useOldPluginVersion2025 } = settings;
+    const selection = figma.currentPage.selection;
+    if (selection.length === 0) {
+      postEmptyMessage();
+      return;
+    }
+    const nodeToJSONStart = Date.now();
+    let convertedSelection;
+    if (useOldPluginVersion2025) {
+      convertedSelection = oldConvertNodesToAltNodes(selection, null);
+      console.log("convertedSelection", convertedSelection);
+    } else {
+      convertedSelection = yield nodesToJSON(selection, settings);
+      console.log(`[benchmark] nodesToJSON: ${Date.now() - nodeToJSONStart}ms`);
+      console.log("nodeJson", convertedSelection);
+    }
+    console.log("[debug] convertedSelection", __spreadValues({}, convertedSelection[0]));
+    if (convertedSelection.length === 0) {
+      postEmptyMessage();
+      return;
+    }
+    const selectedNode = selection[0];
+    const selectedNodeImageBytes = yield selectedNode.exportAsync({
+      format: "PNG",
+      constraint: { type: "SCALE", value: 1 }
+    });
+    const convertToCodeStart = Date.now();
+    const { html: code } = yield convertToCode(convertedSelection, settings);
+    console.log(`[benchmark] convertToCode: ${Date.now() - convertToCodeStart}ms`);
+    const colorPanelStart = Date.now();
+    const colors = yield retrieveGenericSolidUIColors();
+    const gradients = yield retrieveGenericLinearGradients();
+    console.log(`[benchmark] color and gradient panel: ${Date.now() - colorPanelStart}ms`);
+    console.log(`[benchmark] total generation time: ${Date.now() - nodeToJSONStart}ms`);
+    console.log(
+      `[benchmark] getNodeByIdAsync: ${getNodeByIdAsyncTime}ms (${getNodeByIdAsyncCalls} calls, avg: ${(getNodeByIdAsyncTime / getNodeByIdAsyncCalls || 1).toFixed(2)}ms)`
+    );
+    console.log(
+      `[benchmark] getStyledTextSegments: ${getStyledTextSegmentsTime}ms (${getStyledTextSegmentsCalls} calls, avg: ${getStyledTextSegmentsCalls > 0 ? (getStyledTextSegmentsTime / getStyledTextSegmentsCalls).toFixed(2) : 0}ms)`
+    );
+    console.log(
+      `[benchmark] processColorVariables: ${processColorVariablesTime}ms (${processColorVariablesCalls} calls, avg: ${processColorVariablesCalls > 0 ? (processColorVariablesTime / processColorVariablesCalls).toFixed(2) : 0}ms)`
+    );
+    postConversionComplete({
+      selectedNodeImageBytes,
+      selectedNodeName: `${formatNodeName(selectedNode.name)}-1x-${selectedNode.id}.png`,
+      code,
+      base64ImageList: [],
+      colors,
+      gradients,
+      settings,
+      warnings: [...warnings]
+    });
+    yield postLoadingAsync(false, { sleepBefore: 50 });
+  });
+
+  // plugin-src/markUp.ts
+  var currentImageScale = 2;
+  var updateImageScale = (scale) => {
+    currentImageScale = scale;
+    console.log("[MarkUp] \u56FE\u7247\u5BFC\u51FA\u500D\u6570\u5DF2\u66F4\u65B0\u4E3A:", currentImageScale);
+  };
+  var initImageScale = () => __async(null, null, function* () {
+    currentImageScale = yield getClientStorageWithDefault("image-scale", 2, PREFIX);
+    console.log("[MarkUp] \u521D\u59CB\u5316\u56FE\u7247\u5BFC\u51FA\u500D\u6570:", currentImageScale);
+  });
+  var isProcessing = false;
+  var runMarkUp = (extraType) => __async(null, null, function* () {
+    const nodes = figma.currentPage.selection;
+    if (nodes.length === 0) {
+      figma.ui.postMessage({
+        type: "markup-images",
+        data: []
+      });
+      return;
+    }
+    if (isProcessing) {
+      return;
+    }
+    isProcessing = true;
+    yield postLoadingAsync(true, { sleepAfter: 50 });
+    let imageDataList = [];
+    if (extraType === "sliceBatch" /* SLICE_BATCH */) {
+      const firstNode = nodes[0];
+      if (firstNode && "children" in firstNode) {
+        console.log(firstNode, firstNode.type, "nodes[0]");
+        imageDataList = yield exportAllPngBytes(firstNode.children);
+      }
+    } else {
+      imageDataList = yield exportAllPngBytes(nodes);
+    }
+    const transferableData = imageDataList.map((item) => {
+      return {
+        id: item.id,
+        name: item.name,
+        bytes: item.bytes,
+        // Uint8Array 会自动作为 Transferable 传输
+        width: item.width,
+        height: item.height
+      };
+    });
+    console.log("transferableData", transferableData);
+    figma.ui.postMessage({
+      type: "markup-images",
+      data: transferableData,
+      extraValue: extraType
+    });
+    console.log("postLoadingAsync", false);
+    yield postLoadingAsync(false, { sleepBefore: 50 });
+    isProcessing = false;
+  });
+  function exportAllPngBytes(nodes, options) {
+    return __async(this, null, function* () {
+      const _a = options || {
+        format: "PNG"
+      }, {
+        format,
+        constraint = { type: "SCALE", value: currentImageScale }
+      } = _a, rest = __objRest(_a, [
+        "format",
+        "constraint"
+      ]);
+      const imageDataList = [];
+      const bytesPromises = [];
+      for (const node of nodes) {
+        console.log("nodeType", node.type);
+        const bytesPromise = node.exportAsync(__spreadValues({
+          format,
+          constraint
+        }, rest));
+        bytesPromises.push(bytesPromise);
+      }
+      const nodeImageDataList = yield Promise.all(bytesPromises);
+      nodeImageDataList.forEach((nodeImageData, index) => {
+        const node = nodes[index];
+        if (nodeImageData && node) {
+          imageDataList.push({
+            id: node.id,
+            // 替换所有空格
+            name: `${formatNodeName(node.name)}-${constraint.value}x-${node.id}.png`,
+            bytes: nodeImageData,
+            width: node.width,
+            height: node.height,
+            x: `${constraint.value}x`
+          });
+        }
+      });
+      return imageDataList;
+    });
+  }
+
+  // plugin-src/code.ts
+  var currentTab = "bind" /* BIND */;
+  var currentMarkUpTabExtraType;
+  var userPluginSettings;
+  var defaultPluginSettings = {
+    framework: "HTML",
+    showLayerNames: false,
+    useOldPluginVersion2025: false,
+    responsiveRoot: false,
+    useColorVariables: true,
+    embedImages: true,
+    embedVectors: true,
+    htmlGenerationMode: "html"
+  };
+  var getUserSettings = () => __async(null, null, function* () {
+    var _a;
+    console.log("[DEBUG] getUserSettings - Starting to fetch user settings");
+    const possiblePluginSrcSettings = (_a = yield figma.clientStorage.getAsync("userPluginSettings")) != null ? _a : {};
+    console.log("[DEBUG] getUserSettings - Raw settings from storage:", possiblePluginSrcSettings);
+    const updatedPluginSrcSettings = __spreadValues(__spreadValues({}, defaultPluginSettings), possiblePluginSrcSettings);
+    userPluginSettings = __spreadProps(__spreadValues({}, updatedPluginSrcSettings), {
+      framework: "HTML",
+      htmlGenerationMode: "html"
+    });
+    console.log("[DEBUG] getUserSettings - Final settings:", userPluginSettings);
+    return userPluginSettings;
+  });
+  var initSettings = () => __async(null, null, function* () {
+    console.log("[DEBUG] initSettings - Initializing plugin settings");
+    yield getUserSettings();
+    postSettingsChanged(userPluginSettings);
+    console.log("[DEBUG] initSettings - Calling safeRun with settings");
+    safeRun(userPluginSettings);
+  });
+  var isLoading = false;
+  var safeRun = (settings) => __async(null, null, function* () {
+    console.log(
+      "[DEBUG] safeRun - Called with isLoading =",
+      isLoading,
+      "selection =",
+      figma.currentPage.selection
+    );
+    if (isLoading === false) {
+      try {
+        isLoading = true;
+        console.log("[DEBUG] safeRun - Starting run execution");
+        yield run(settings);
+        console.log("[DEBUG] safeRun - Run execution completed");
+        setTimeout(() => {
+          console.log("[DEBUG] safeRun - Resetting isLoading to false");
+          isLoading = false;
+        }, 1);
+      } catch (e) {
+        console.log("[DEBUG] safeRun - Error caught in execution");
+        isLoading = false;
+        if (e && typeof e === "object" && "message" in e) {
+          const error = e;
+          console.log("error: ", error.stack);
+          figma.ui.postMessage({ type: "error", error: error.message });
+        } else {
+          const errorMessage = String(e);
+          console.log("Unknown error: ", errorMessage);
+          figma.ui.postMessage({
+            type: "error",
+            error: errorMessage || "Unknown error occurred"
+          });
+        }
+        figma.ui.postMessage({ type: "conversion-complete", success: false });
+      }
+    } else {
+      console.log("[DEBUG] safeRun - Skipping execution because isLoading =", isLoading);
+    }
+  });
+  var newRun = () => {
+    switch (currentTab) {
+      case "code" /* CODE */:
+        safeRun(userPluginSettings);
+        break;
+      case "markUp" /* MARK_UP */:
+        console.log("[DEBUG] runMarkUp", currentMarkUpTabExtraType);
+        runMarkUp(currentMarkUpTabExtraType);
+        break;
+    }
+  };
+  var standardMode = () => __async(null, null, function* () {
+    console.log("[DEBUG] standardMode - Starting standard mode initialization");
+    figma.showUI(__html__, { width: 450, height: 700, themeColors: true });
+    yield initImageScale();
+    newRun();
+    figma.on("selectionchange", () => {
+      console.log("[DEBUG] selectionchange event - New selection:", figma.currentPage.selection);
+      newRun();
+    });
+    figma.loadAllPagesAsync();
+    figma.on("documentchange", () => {
+    });
+    figma.ui.onmessage = (msg) => __async(null, null, function* () {
+      console.log("[DEBUG] figma.ui.onmessage", msg);
+      if (msg.type === "updateImageScale") {
+        console.log("[DEBUG] updateImageScale", msg.scale);
+        updateImageScale(msg.scale);
+      } else if (msg.type === "regenerateSliceImages") {
+        console.log("[DEBUG] regenerateSliceImages");
+        runMarkUp(currentMarkUpTabExtraType);
+      } else if (msg.type === "clientStorageChange") {
+        console.log("[DEBUG] clientStorageChange", msg);
+        yield handleClientStorageMessage({
+          action: msg.action,
+          key: msg.key,
+          value: msg.value
+        });
+        if (msg.key === `${PREFIX}${LAYOUT_UNIT_STORAGE_KEY}` && currentTab === "code" /* CODE */) {
+          safeRun(userPluginSettings);
+        }
+      } else if (msg.type === "clientStorageGet") {
+        console.log("[DEBUG] clientStorageGet", msg);
+        const value = yield figma.clientStorage.getAsync(msg.key);
+        figma.ui.postMessage({
+          type: "clientStorageResponse",
+          requestId: msg.requestId,
+          value: value !== void 0 ? value : null
+        });
+      } else if (msg.type === "tab-changed") {
+        console.log("[DEBUG] currentTab", currentTab);
+        const { value, extraValue } = msg;
+        currentTab = value;
+        currentMarkUpTabExtraType = extraValue;
+        if (currentTab === "code" /* CODE */) {
+          yield initSettings();
+        } else {
+          newRun();
+        }
+      } else if (msg.type === "pluginSettingWillChange") {
+        const { key, value } = msg;
+        if (key === "htmlGenerationMode") {
+          return;
+        }
+        console.log(`[DEBUG] Setting changed: ${key} = ${String(value)}`);
+        userPluginSettings[key] = value;
+        figma.clientStorage.setAsync("userPluginSettings", userPluginSettings);
+        safeRun(userPluginSettings);
+      } else if (msg.type === "get-selection-json") {
+        console.log("[DEBUG] get-selection-json message received");
+        const nodes = figma.currentPage.selection;
+        if (nodes.length === 0) {
+          figma.ui.postMessage({
+            type: "selection-json",
+            data: { message: "No nodes selected" }
+          });
+          return;
+        }
+        const result = {};
+        try {
+          result.json = yield Promise.all(
+            nodes.map(
+              (node) => __async(null, null, function* () {
+                return (yield node.exportAsync({
+                  format: "JSON_REST_V1"
+                })).document;
+              })
+            )
+          );
+        } catch (error) {
+          console.error("Error exporting JSON:", error);
+        }
+        try {
+          const newNodes = yield nodesToJSON(nodes, userPluginSettings);
+          const removeParent = (node) => {
+            if (node.parent) {
+              delete node.parent;
+            }
+            if (node.children) {
+              node.children.forEach(removeParent);
+            }
+          };
+          newNodes.forEach(removeParent);
+          result.newConversion = newNodes;
+        } catch (error) {
+          console.error("Error in new conversion:", error);
+        }
+        figma.ui.postMessage({
+          type: "selection-json",
+          data: result
+        });
+      }
+    });
+  });
+  var codegenMode = () => __async(null, null, function* () {
+    console.log("[DEBUG] codegenMode - Starting codegen mode initialization");
+    yield getUserSettings();
+    figma.codegen.on(
+      "generate",
+      (_0) => __async(null, [_0], function* ({ language, node }) {
+        console.log(`[DEBUG] codegen.generate - Language: ${language}, Node:`, node);
+        if (language !== "html") {
+          return [];
+        }
+        const convertedSelection = yield nodesToJSON([node], userPluginSettings);
+        return [
+          {
+            title: "Code",
+            code: (yield htmlMain(convertedSelection, userPluginSettings, true)).html,
+            language: "HTML"
+          },
+          {
+            title: "Text Styles",
+            code: htmlCodeGenTextStyles(),
+            language: "HTML"
+          }
+        ];
+      })
+    );
+  });
+  switch (figma.mode) {
+    case "default":
+    case "inspect":
+      console.log("[DEBUG] Starting plugin in", figma.mode, "mode");
+      standardMode();
+      break;
+    case "codegen":
+      console.log("[DEBUG] Starting plugin in codegen mode");
+      codegenMode();
+      break;
+    default:
+      console.log("[DEBUG] Unknown plugin mode:", figma.mode);
+      break;
+  }
+})();