@biela.dev/devices 0.1.0

package/dist/index.js

@@ -0,0 +1,1298 @@
+import { PIXEL_9_PRO_META, PIXEL_9_PRO_XL_META, GALAXY_S25_EDGE_META, GALAXY_S25_META, GALAXY_S25_ULTRA_META, PIXEL_9_PRO_LAYOUT, PIXEL_9_PRO_XL_LAYOUT, GALAXY_S25_EDGE_LAYOUT, GALAXY_S25_LAYOUT, GALAXY_S25_ULTRA_LAYOUT } from './chunk-QQFC4CAP.js';
+export { GALAXY_S25_EDGE_FRAME, GALAXY_S25_EDGE_LAYOUT, GALAXY_S25_EDGE_META, GALAXY_S25_FRAME, GALAXY_S25_LAYOUT, GALAXY_S25_META, GALAXY_S25_ULTRA_FRAME, GALAXY_S25_ULTRA_LAYOUT, GALAXY_S25_ULTRA_META, GalaxyS25EdgeSVG, GalaxyS25SVG, GalaxyS25UltraSVG, PIXEL_9_PRO_FRAME, PIXEL_9_PRO_LAYOUT, PIXEL_9_PRO_META, PIXEL_9_PRO_XL_FRAME, PIXEL_9_PRO_XL_LAYOUT, PIXEL_9_PRO_XL_META, Pixel9ProSVG, Pixel9ProXLSVG } from './chunk-QQFC4CAP.js';
+import { IPHONE_SE_3_META, IPHONE_16E_META, IPHONE_16_META, IPHONE_AIR_META, IPHONE_17_PRO_META, IPHONE_17_PRO_MAX_META, IPHONE_SE_3_LAYOUT, IPHONE_16E_LAYOUT, IPHONE_16_LAYOUT, IPHONE_AIR_LAYOUT, IPHONE_17_PRO_LAYOUT, IPHONE_17_PRO_MAX_LAYOUT } from './chunk-DGX4WRAK.js';
+export { IPHONE_16E_FRAME, IPHONE_16E_LAYOUT, IPHONE_16E_META, IPHONE_16_FRAME, IPHONE_16_LAYOUT, IPHONE_16_META, IPHONE_17_PRO_FRAME, IPHONE_17_PRO_LAYOUT, IPHONE_17_PRO_MAX_FRAME, IPHONE_17_PRO_MAX_LAYOUT, IPHONE_17_PRO_MAX_META, IPHONE_17_PRO_META, IPHONE_AIR_FRAME, IPHONE_AIR_LAYOUT, IPHONE_AIR_META, IPHONE_SE_3_FRAME, IPHONE_SE_3_LAYOUT, IPHONE_SE_3_META, IPhone16SVG, IPhone16eSVG, IPhone17ProMaxSVG, IPhone17ProSVG, IPhoneAirSVG, IPhoneSE3SVG } from './chunk-DGX4WRAK.js';
+
+// src/custom/device-registry.ts
+var STORAGE_KEY = "bielaframe-custom-devices";
+var DeviceRegistry = class {
+  devices = /* @__PURE__ */ new Map();
+  storage;
+  constructor(storage) {
+    this.storage = storage ?? (typeof localStorage !== "undefined" ? localStorage : null);
+    this.load();
+  }
+  /** Register or update a custom device */
+  register(device) {
+    this.devices.set(device.meta.id, {
+      ...device,
+      source: "custom",
+      registeredAt: device.registeredAt || (/* @__PURE__ */ new Date()).toISOString()
+    });
+    this.save();
+  }
+  /** Get a custom device by ID */
+  get(deviceId) {
+    return this.devices.get(deviceId);
+  }
+  /** Get the metadata for a custom device */
+  getMeta(deviceId) {
+    return this.devices.get(deviceId)?.meta;
+  }
+  /** Get the contract for a custom device */
+  getContract(deviceId) {
+    return this.devices.get(deviceId)?.contract;
+  }
+  /** List all custom devices */
+  list() {
+    return Array.from(this.devices.values());
+  }
+  /** List all custom device IDs */
+  listIds() {
+    return Array.from(this.devices.keys());
+  }
+  /** Check if a custom device exists */
+  has(deviceId) {
+    return this.devices.has(deviceId);
+  }
+  /** Remove a custom device */
+  remove(deviceId) {
+    const deleted = this.devices.delete(deviceId);
+    if (deleted) this.save();
+    return deleted;
+  }
+  /** Remove all custom devices */
+  clear() {
+    this.devices.clear();
+    this.save();
+  }
+  /** Get the number of custom devices */
+  get size() {
+    return this.devices.size;
+  }
+  /** Export all custom devices as a JSON string */
+  exportAll() {
+    const entries = Array.from(this.devices.entries());
+    return JSON.stringify(entries, null, 2);
+  }
+  /** Import custom devices from a JSON string (merges with existing) */
+  importAll(json) {
+    const entries = JSON.parse(json);
+    const skipped = [];
+    let imported = 0;
+    for (const [id, device] of entries) {
+      if (this.devices.has(id)) {
+        skipped.push(id);
+        continue;
+      }
+      this.devices.set(id, { ...device, source: "custom" });
+      imported++;
+    }
+    if (imported > 0) this.save();
+    return { imported, skipped };
+  }
+  /** Import and overwrite existing entries */
+  importAllOverwrite(json) {
+    const entries = JSON.parse(json);
+    for (const [id, device] of entries) {
+      this.devices.set(id, { ...device, source: "custom" });
+    }
+    this.save();
+    return entries.length;
+  }
+  // ─── Persistence ───
+  load() {
+    if (!this.storage) return;
+    try {
+      const raw = this.storage.getItem(STORAGE_KEY);
+      if (raw) {
+        const entries = JSON.parse(raw);
+        this.devices = new Map(entries);
+      }
+    } catch {
+      this.devices = /* @__PURE__ */ new Map();
+    }
+  }
+  save() {
+    const json = JSON.stringify(Array.from(this.devices.entries()));
+    if (this.storage) {
+      try {
+        this.storage.setItem(STORAGE_KEY, json);
+      } catch {
+      }
+    }
+    if (typeof fetch !== "undefined") {
+      fetch("/api/storage/custom-devices", {
+        method: "PUT",
+        headers: { "Content-Type": "application/json" },
+        body: json
+      }).catch(() => {
+      });
+    }
+  }
+};
+var _defaultRegistry = null;
+function getDeviceRegistry() {
+  if (!_defaultRegistry) {
+    _defaultRegistry = new DeviceRegistry();
+  }
+  return _defaultRegistry;
+}
+function resetDeviceRegistry() {
+  _defaultRegistry = null;
+}
+
+// src/registry.ts
+var BUILTIN_DEVICES = {
+  // iPhone (latest gen per screen class)
+  "iphone-17-pro-max": IPHONE_17_PRO_MAX_META,
+  "iphone-17-pro": IPHONE_17_PRO_META,
+  "iphone-air": IPHONE_AIR_META,
+  "iphone-16": IPHONE_16_META,
+  "iphone-16e": IPHONE_16E_META,
+  "iphone-se-3": IPHONE_SE_3_META,
+  // Android
+  "galaxy-s25-ultra": GALAXY_S25_ULTRA_META,
+  "galaxy-s25": GALAXY_S25_META,
+  "galaxy-s25-edge": GALAXY_S25_EDGE_META,
+  "pixel-9-pro-xl": PIXEL_9_PRO_XL_META,
+  "pixel-9-pro": PIXEL_9_PRO_META
+};
+var DEVICE_LAYOUTS = {
+  // iPhone
+  "iphone-17-pro-max": IPHONE_17_PRO_MAX_LAYOUT,
+  "iphone-17-pro": IPHONE_17_PRO_LAYOUT,
+  "iphone-air": IPHONE_AIR_LAYOUT,
+  "iphone-16": IPHONE_16_LAYOUT,
+  "iphone-16e": IPHONE_16E_LAYOUT,
+  "iphone-se-3": IPHONE_SE_3_LAYOUT,
+  // Android
+  "galaxy-s25-ultra": GALAXY_S25_ULTRA_LAYOUT,
+  "galaxy-s25": GALAXY_S25_LAYOUT,
+  "galaxy-s25-edge": GALAXY_S25_EDGE_LAYOUT,
+  "pixel-9-pro-xl": PIXEL_9_PRO_XL_LAYOUT,
+  "pixel-9-pro": PIXEL_9_PRO_LAYOUT
+};
+function getDeviceMetadata(deviceId) {
+  const builtin = BUILTIN_DEVICES[deviceId];
+  if (builtin) return builtin;
+  const custom = getDeviceRegistry().getMeta(deviceId);
+  if (custom) return custom;
+  throw new Error(
+    `Device "${deviceId}" not found in built-in library or custom registry. Available devices: ${getAllDeviceIds().join(", ") || "(none yet)"}`
+  );
+}
+function getAllDeviceIds() {
+  return [
+    ...Object.keys(BUILTIN_DEVICES),
+    ...getDeviceRegistry().listIds()
+  ];
+}
+
+// src/contract.ts
+function deriveContentZone(screenWidth, screenHeight, safeArea) {
+  return {
+    x: safeArea.left,
+    y: safeArea.top,
+    width: screenWidth - safeArea.left - safeArea.right,
+    height: screenHeight - safeArea.top - safeArea.bottom
+  };
+}
+function buildCSSVariables(screen, safeArea, statusBar, homeIndicator, hardwareOverlays) {
+  const vars = {
+    "--device-width": `${screen.width}px`,
+    "--device-height": `${screen.height}px`,
+    "--safe-top": `${safeArea.top}px`,
+    "--safe-bottom": `${safeArea.bottom}px`,
+    "--safe-left": `${safeArea.left}px`,
+    "--safe-right": `${safeArea.right}px`,
+    "--status-bar-height": `${statusBar.height}px`,
+    "--home-indicator-height": `${homeIndicator.height}px`,
+    "--corner-radius": `${screen.cornerRadius}px`
+  };
+  if (hardwareOverlays.type !== "none") {
+    vars["--island-width"] = `${hardwareOverlays.portrait.width}px`;
+    vars["--island-height"] = `${hardwareOverlays.portrait.height}px`;
+  }
+  return vars;
+}
+function buildAIPromptConstraints(contract) {
+  const sa = contract.safeArea.portrait;
+  const cz = contract.contentZone.portrait;
+  const overlay = contract.hardwareOverlays;
+  const lines = [
+    `Device: ${contract.device.name} (${contract.device.platform})`,
+    `Screen: ${contract.screen.width}\xD7${contract.screen.height} logical points`,
+    `Content Zone: ${cz.x},${cz.y} \u2192 ${cz.width}\xD7${cz.height}pt`,
+    `Safe Area: top ${sa.top}pt, bottom ${sa.bottom}pt, left ${sa.left}pt, right ${sa.right}pt`,
+    `Corner Radius: ${contract.screen.cornerRadius}pt`
+  ];
+  if (overlay.type === "dynamic-island") {
+    lines.push(
+      `Hardware: Dynamic Island (pill) \u2014 ${overlay.portrait.width}\xD7${overlay.portrait.height}pt at y=${overlay.portrait.y}`
+    );
+  } else if (overlay.type === "punch-hole") {
+    lines.push(
+      `Hardware: Punch-hole camera (circle) \u2014 ${overlay.portrait.width}pt diameter at center top`
+    );
+  }
+  lines.push(
+    `IMPORTANT: DO NOT render a status bar time/clock \u2014 BielaFrame renders a live clock overlay automatically.`
+  );
+  return lines.join("\n");
+}
+function getDeviceContract(deviceId, orientation = "portrait") {
+  const layout = DEVICE_LAYOUTS[deviceId];
+  if (!layout) {
+    const customContract = getDeviceRegistry().getContract(deviceId);
+    if (customContract) return customContract;
+    throw new Error(
+      `Device layout "${deviceId}" not found. Available: ${Object.keys(DEVICE_LAYOUTS).join(", ") || "(none)"}`
+    );
+  }
+  const { meta, safeArea, hardwareOverlays, statusBar, homeIndicator, hardwareButtons } = layout;
+  const contentZone = {
+    portrait: deriveContentZone(meta.screen.width, meta.screen.height, safeArea.portrait),
+    landscape: deriveContentZone(meta.screen.height, meta.screen.width, safeArea.landscape)
+  };
+  const cssVariables = buildCSSVariables(
+    meta.screen,
+    safeArea[orientation],
+    statusBar,
+    homeIndicator,
+    hardwareOverlays
+  );
+  const partialContract = {
+    device: {
+      id: meta.id,
+      name: meta.name,
+      platform: meta.platform,
+      year: meta.year
+    },
+    screen: meta.screen,
+    safeArea,
+    hardwareOverlays,
+    statusBar,
+    homeIndicator,
+    hardwareButtons,
+    contentZone,
+    cssVariables
+  };
+  return {
+    ...partialContract,
+    aiPromptConstraints: buildAIPromptConstraints(partialContract)
+  };
+}
+
+// src/svg/parse-dimensions.ts
+function parseSVGNativeDimensions(svgString) {
+  const svgTagMatch = svgString.match(/<svg\b[^>]*>/i);
+  if (!svgTagMatch) {
+    throw new Error("No <svg> element found in the provided string");
+  }
+  const svgTag = svgTagMatch[0];
+  const viewBoxMatch = svgTag.match(/viewBox\s*=\s*["']([^"']+)["']/i);
+  if (viewBoxMatch) {
+    const parts = viewBoxMatch[1].trim().split(/[\s,]+/).map(Number);
+    if (parts.length >= 4) {
+      const w = parts[2];
+      const h = parts[3];
+      if (!isNaN(w) && !isNaN(h) && w > 0 && h > 0) {
+        return { width: w, height: h, hasViewBox: true, source: "viewBox" };
+      }
+    }
+  }
+  const widthMatch = svgTag.match(/\bwidth\s*=\s*["']?(\d+\.?\d*)/i);
+  const heightMatch = svgTag.match(/\bheight\s*=\s*["']?(\d+\.?\d*)/i);
+  if (widthMatch && heightMatch) {
+    const w = parseFloat(widthMatch[1]);
+    const h = parseFloat(heightMatch[1]);
+    if (w > 0 && h > 0) {
+      return { width: w, height: h, hasViewBox: false, source: "widthHeight" };
+    }
+  }
+  console.warn("[BielaFrame] SVG has no viewBox or width/height. Falling back to 390\xD7844.");
+  return { width: 390, height: 844, hasViewBox: false, source: "fallback" };
+}
+
+// src/svg/normalize.ts
+function normalizeSVGToLogicalPoints(svgString, targetWidth, targetHeight) {
+  const native = parseSVGNativeDimensions(svgString);
+  const scaleX = targetWidth / native.width;
+  const scaleY = targetHeight / native.height;
+  const nativeAspect = native.width / native.height;
+  const targetAspect = targetWidth / targetHeight;
+  const diff = Math.abs(nativeAspect - targetAspect) / targetAspect;
+  const aspectRatioWarning = diff > 0.02 ? `SVG aspect ratio (${nativeAspect.toFixed(3)}) differs from declared device (${targetAspect.toFixed(3)}) by ${(diff * 100).toFixed(1)}%. Wrong SVG?` : null;
+  if (Math.abs(scaleX - 1) < 1e-3 && Math.abs(scaleY - 1) < 1e-3) {
+    return {
+      normalizedSVG: svgString,
+      scaleFactors: { x: 1, y: 1 },
+      aspectRatioWarning,
+      wasAlreadyNormalized: true,
+      nativeDimensions: { width: native.width, height: native.height }
+    };
+  }
+  let result = svgString;
+  result = result.replace(
+    /<svg\b([^>]*)>/i,
+    (_match, attrs) => {
+      if (/viewBox/i.test(attrs)) {
+        attrs = attrs.replace(/viewBox\s*=\s*["'][^"']*["']/i, `viewBox="0 0 ${targetWidth} ${targetHeight}"`);
+      } else {
+        attrs += ` viewBox="0 0 ${targetWidth} ${targetHeight}"`;
+      }
+      if (/\bwidth\s*=/i.test(attrs)) {
+        attrs = attrs.replace(/\bwidth\s*=\s*["']?\d+\.?\d*["']?/i, `width="${targetWidth}"`);
+      } else {
+        attrs += ` width="${targetWidth}"`;
+      }
+      if (/\bheight\s*=/i.test(attrs)) {
+        attrs = attrs.replace(/\bheight\s*=\s*["']?\d+\.?\d*["']?/i, `height="${targetHeight}"`);
+      } else {
+        attrs += ` height="${targetHeight}"`;
+      }
+      return `<svg${attrs}>`;
+    }
+  );
+  const xAttrs = ["x", "cx", "width", "rx"];
+  const yAttrs = ["y", "cy", "height", "ry"];
+  const allAttrs = [...xAttrs, ...yAttrs];
+  result = result.replace(
+    /data-zone\s*=\s*["'][^"']*["'][^>]*/gi,
+    (elementContent) => {
+      let updated = elementContent;
+      for (const attr of allAttrs) {
+        const regex = new RegExp(`\\b${attr}\\s*=\\s*["'](\\d+\\.?\\d*)["']`, "gi");
+        updated = updated.replace(regex, (_, val) => {
+          const num = parseFloat(val);
+          const scale = xAttrs.includes(attr) ? scaleX : scaleY;
+          return `${attr}="${(num * scale).toFixed(2)}"`;
+        });
+      }
+      return updated;
+    }
+  );
+  return {
+    normalizedSVG: result,
+    scaleFactors: { x: scaleX, y: scaleY },
+    aspectRatioWarning,
+    wasAlreadyNormalized: false,
+    nativeDimensions: { width: native.width, height: native.height }
+  };
+}
+
+// src/svg/parse-contract.ts
+function extractZones(svgString) {
+  const zones = [];
+  const regex = /data-zone\s*=\s*["']([^"']+)["'][^>]*/gi;
+  let match;
+  while ((match = regex.exec(svgString)) !== null) {
+    const zoneName = match[1];
+    const element = match[0];
+    const x = parseAttr(element, "x") ?? parseAttr(element, "cx") ?? 0;
+    const y = parseAttr(element, "y") ?? parseAttr(element, "cy") ?? 0;
+    const width = parseAttr(element, "width") ?? 0;
+    const height = parseAttr(element, "height") ?? 0;
+    zones.push({ zone: zoneName, x, y, width, height });
+  }
+  return zones;
+}
+function parseAttr(element, attr) {
+  const re = new RegExp(`\\b${attr}\\s*=\\s*["'](\\d+\\.?\\d*)["']`, "i");
+  const m = element.match(re);
+  return m ? parseFloat(m[1]) : null;
+}
+function parseSVGToContract(normalizedSVG, options) {
+  const { meta } = options;
+  const zones = extractZones(normalizedSVG);
+  const zoneMap = new Map(zones.map((z) => [z.zone, z]));
+  const screenZone = zoneMap.get("screen-area");
+  const screenWidth = screenZone?.width ?? meta.screen.width;
+  const screenHeight = screenZone?.height ?? meta.screen.height;
+  const safeTop = zoneMap.get("safe-area-top");
+  const safeBottom = zoneMap.get("safe-area-bottom");
+  const safeLeft = zoneMap.get("safe-area-left");
+  const safeRight = zoneMap.get("safe-area-right");
+  const portraitSafeArea = {
+    top: safeTop?.height ?? (meta.platform === "ios" ? 59 : 36),
+    bottom: safeBottom?.height ?? (meta.platform === "ios" ? 34 : 0),
+    left: safeLeft?.width ?? 0,
+    right: safeRight?.width ?? 0
+  };
+  const landscapeSafeArea = {
+    top: Math.min(portraitSafeArea.top, 21),
+    bottom: Math.min(portraitSafeArea.bottom, 21),
+    left: portraitSafeArea.top,
+    right: portraitSafeArea.bottom
+  };
+  const overlayZone = zoneMap.get("hardware-overlay");
+  const overlayType = options.overlayType ?? (overlayZone ? guessOverlayType(overlayZone, meta.platform) : "none");
+  const overlayPortrait = overlayZone ? {
+    x: overlayZone.x,
+    y: overlayZone.y,
+    width: overlayZone.width,
+    height: overlayZone.height,
+    shape: options.overlayShape ?? guessOverlayShape(overlayType)
+  } : { x: 0, y: 0, width: 0, height: 0, shape: "pill" };
+  const statusBarZone = zoneMap.get("status-bar");
+  const statusBarHeight = statusBarZone?.height ?? portraitSafeArea.top;
+  const statusBarStyle = options.statusBarStyle ?? (overlayType === "dynamic-island" ? "dynamic-island" : overlayType === "notch" ? "notch" : "fullwidth");
+  const homeZone = zoneMap.get("home-indicator");
+  const homeType = options.homeIndicatorType ?? (meta.platform === "ios" ? "swipe-bar" : "gestureline");
+  const homeHeight = homeZone?.height ?? portraitSafeArea.bottom;
+  const statusBar = {
+    height: statusBarHeight,
+    style: statusBarStyle,
+    hasTime: true,
+    hasBattery: true,
+    hasSignal: true
+  };
+  const homeIndicator = {
+    type: homeType,
+    height: homeHeight,
+    width: homeZone?.width,
+    visible: homeHeight > 0
+  };
+  const contentZone = {
+    portrait: deriveContentZone(screenWidth, screenHeight, portraitSafeArea),
+    landscape: deriveContentZone(screenHeight, screenWidth, landscapeSafeArea)
+  };
+  const cssVariables = buildCSSVariables(
+    meta.screen,
+    portraitSafeArea,
+    statusBar,
+    homeIndicator,
+    { type: overlayType, portrait: overlayPortrait }
+  );
+  const partialContract = {
+    device: {
+      id: meta.id,
+      name: meta.name,
+      platform: meta.platform,
+      year: meta.year
+    },
+    screen: meta.screen,
+    safeArea: {
+      portrait: portraitSafeArea,
+      landscape: landscapeSafeArea
+    },
+    hardwareOverlays: {
+      type: overlayType,
+      portrait: overlayPortrait
+    },
+    statusBar,
+    homeIndicator,
+    contentZone,
+    cssVariables
+  };
+  return {
+    ...partialContract,
+    aiPromptConstraints: buildAIPromptConstraints(partialContract)
+  };
+}
+function guessOverlayType(zone, platform) {
+  if (platform === "ios") {
+    if (zone.width > zone.height * 2) return "dynamic-island";
+    if (zone.width > zone.height) return "notch";
+    return "dynamic-island";
+  }
+  if (Math.abs(zone.width - zone.height) < 4) return "punch-hole";
+  return "pill-cutout";
+}
+function guessOverlayShape(type) {
+  switch (type) {
+    case "dynamic-island":
+      return "pill";
+    case "notch":
+      return "rectangle";
+    case "punch-hole":
+      return "circle";
+    case "pill-cutout":
+      return "pill";
+    default:
+      return "pill";
+  }
+}
+
+// src/svg/validate.ts
+function validateNormalizedSVG(result, targetWidth, targetHeight) {
+  const warnings = [];
+  const errors = [];
+  if (result.aspectRatioWarning) {
+    warnings.push(result.aspectRatioWarning);
+  }
+  const maxScale = Math.max(result.scaleFactors.x, result.scaleFactors.y);
+  if (maxScale > 5) {
+    warnings.push(
+      `Scale factor is ${maxScale.toFixed(1)}x \u2014 the SVG may be authored at a much larger coordinate space than expected. Verify the SVG dimensions.`
+    );
+  }
+  const minScale = Math.min(result.scaleFactors.x, result.scaleFactors.y);
+  if (minScale > 0 && minScale < 0.1) {
+    warnings.push(
+      `Scale factor is ${minScale.toFixed(3)}x \u2014 the SVG appears to be very small. Verify you're using the correct export size.`
+    );
+  }
+  if (result.nativeDimensions.width <= 0 || result.nativeDimensions.height <= 0) {
+    errors.push("SVG has zero or negative dimensions. Check the viewBox or width/height attributes.");
+  }
+  const zones = extractZones(result.normalizedSVG);
+  const zoneNames = new Set(zones.map((z) => z.zone));
+  if (!zoneNames.has("screen-area")) {
+    warnings.push(
+      'No "screen-area" data-zone found. The screen region will use the full device dimensions.'
+    );
+  }
+  if (targetWidth < 100 || targetHeight < 100) {
+    errors.push(
+      `Target dimensions ${targetWidth}\xD7${targetHeight} are unusually small. Expected logical device dimensions (e.g., 390\xD7844).`
+    );
+  }
+  if (targetWidth > 1500 || targetHeight > 3e3) {
+    warnings.push(
+      `Target dimensions ${targetWidth}\xD7${targetHeight} are unusually large. Expected logical points, not physical pixels.`
+    );
+  }
+  if (result.scaleFactors.x > 0 && result.scaleFactors.y > 0) {
+    const scaleDiff = Math.abs(result.scaleFactors.x - result.scaleFactors.y) / Math.max(result.scaleFactors.x, result.scaleFactors.y);
+    if (scaleDiff > 0.05) {
+      warnings.push(
+        `Non-uniform scaling: X=${result.scaleFactors.x.toFixed(3)}, Y=${result.scaleFactors.y.toFixed(3)}. The SVG aspect ratio may not match the target device.`
+      );
+    }
+  }
+  return {
+    passed: errors.length === 0,
+    warnings,
+    errors
+  };
+}
+
+// src/svg/scope-ids.ts
+function scopeSVGIds(svgString, deviceId) {
+  const ids = [];
+  const idRegex = /\bid\s*=\s*["']([^"']+)["']/gi;
+  let match;
+  while ((match = idRegex.exec(svgString)) !== null) {
+    ids.push(match[1]);
+  }
+  if (ids.length === 0) return svgString;
+  let result = svgString;
+  const prefix = `${deviceId}__`;
+  for (const id of ids) {
+    const escapedId = id.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+    result = result.replace(
+      new RegExp(`\\bid\\s*=\\s*["']${escapedId}["']`, "g"),
+      `id="${prefix}${id}"`
+    );
+    result = result.replace(
+      new RegExp(`url\\(\\s*#${escapedId}\\s*\\)`, "g"),
+      `url(#${prefix}${id})`
+    );
+    result = result.replace(
+      new RegExp(`href\\s*=\\s*["']#${escapedId}["']`, "g"),
+      `href="#${prefix}${id}"`
+    );
+  }
+  return result;
+}
+
+// src/svg/auto-detect-zones.ts
+var ZONE_KEYWORDS = [
+  {
+    type: "screen-area",
+    keywords: ["screen", "display", "viewport", "content-area", "screen-area", "screenarea"],
+    highConfidence: ["screen", "screen-area", "display"]
+  },
+  {
+    type: "hardware-overlay",
+    keywords: [
+      "island",
+      "dynamic-island",
+      "dynamicisland",
+      "dynamic_island",
+      "notch",
+      "cutout",
+      "punch-hole",
+      "punchhole",
+      "punch_hole",
+      "camera",
+      "faceid",
+      "face-id",
+      "truedepth",
+      "sensor",
+      "pill",
+      "camera-housing"
+    ],
+    highConfidence: ["island", "dynamic-island", "notch", "cutout", "punch-hole"]
+  },
+  {
+    type: "safe-area-top",
+    keywords: ["safe-area-top", "safe-top", "safeareatop", "status-area", "top-inset"],
+    highConfidence: ["safe-area-top", "safe-top"]
+  },
+  {
+    type: "safe-area-bottom",
+    keywords: ["safe-area-bottom", "safe-bottom", "safeareabottom", "bottom-inset"],
+    highConfidence: ["safe-area-bottom", "safe-bottom"]
+  },
+  {
+    type: "status-bar",
+    keywords: ["status-bar", "statusbar", "status_bar", "status"],
+    highConfidence: ["status-bar", "statusbar"]
+  },
+  {
+    type: "home-indicator",
+    keywords: [
+      "home-indicator",
+      "homeindicator",
+      "home_indicator",
+      "home-bar",
+      "homebar",
+      "swipe-bar",
+      "swipebar",
+      "gesture-bar",
+      "gesturebar",
+      "bottom-bar"
+    ],
+    highConfidence: ["home-indicator", "home-bar", "swipe-bar", "gesture-bar"]
+  },
+  {
+    type: "hardware-button",
+    keywords: [
+      "volume-up",
+      "volume_up",
+      "volumeup",
+      "vol-up",
+      "volume-down",
+      "volume_down",
+      "volumedown",
+      "vol-down",
+      "power",
+      "power-button",
+      "side-button",
+      "sidebutton",
+      "action-button",
+      "action_button",
+      "actionbutton",
+      "mute",
+      "silent",
+      "ringer",
+      "hardware-button",
+      "hardwarebutton",
+      "hw-button"
+    ],
+    highConfidence: ["volume-up", "volume-down", "power", "action-button", "side-button"]
+  }
+];
+function autoDetectZones(svgString) {
+  const nameBasedZones = detectByNames(svgString);
+  if (nameBasedZones.length > 0) return nameBasedZones;
+  const analysis = analyzeSVGGeometry(svgString);
+  return analysis.zones;
+}
+function analyzeSVGGeometry(svgString) {
+  const rects = extractAllRects(svgString);
+  const viewBox = extractViewBox(svgString);
+  const svgW = viewBox?.w ?? 0;
+  const svgH = viewBox?.h ?? 0;
+  const svgArea = svgW * svgH;
+  if (svgArea === 0) {
+    return { zones: [], phoneBody: null, sideButtons: [], allRects: rects };
+  }
+  const phoneBody = findPhoneBody(rects, svgW, svgH);
+  let screenRect = findScreenArea(rects, phoneBody, svgW, svgH);
+  if (!screenRect) {
+    const pathCutout = findPathCutoutScreen(svgString, svgW, svgH);
+    if (pathCutout) {
+      screenRect = pathCutout;
+    }
+  }
+  if (!screenRect && phoneBody) {
+    const insetRatio = 0.043;
+    const insetX = Math.round(phoneBody.width * insetRatio);
+    const insetY = Math.round(phoneBody.height * (insetRatio * 0.5));
+    screenRect = {
+      x: phoneBody.x + insetX,
+      y: phoneBody.y + insetY,
+      width: phoneBody.width - insetX * 2,
+      height: phoneBody.height - insetY * 2,
+      rx: Math.max(phoneBody.rx - insetX, 20),
+      fill: "synthetic",
+      id: null
+    };
+  }
+  const islandRect = findDynamicIsland(rects, screenRect);
+  const sideButtons = findSideButtons(rects, phoneBody);
+  const zones = [];
+  const now = Date.now();
+  if (screenRect) {
+    const isSynthetic = screenRect.fill === "synthetic";
+    zones.push({
+      id: `auto-screen-area-${now}`,
+      type: "screen-area",
+      sourceLabel: isSynthetic ? "geometric: inferred from body" : "geometric: largest white rect",
+      matchedKeyword: "geometry",
+      confidence: isSynthetic ? "medium" : "high",
+      x: screenRect.x,
+      y: screenRect.y,
+      width: screenRect.width,
+      height: screenRect.height,
+      rx: screenRect.rx > 0 ? screenRect.rx : void 0
+    });
+  }
+  if (islandRect) {
+    zones.push({
+      id: `auto-hardware-overlay-${now}`,
+      type: "hardware-overlay",
+      sourceLabel: "geometric: pill near top",
+      matchedKeyword: "geometry",
+      confidence: "medium",
+      x: islandRect.x,
+      y: islandRect.y,
+      width: islandRect.width,
+      height: islandRect.height
+    });
+  }
+  return {
+    zones,
+    phoneBody: phoneBody ? { x: phoneBody.x, y: phoneBody.y, width: phoneBody.width, height: phoneBody.height, rx: phoneBody.rx } : null,
+    sideButtons: sideButtons.map((r) => ({ x: r.x, y: r.y, width: r.width, height: r.height })),
+    allRects: rects
+  };
+}
+function findPhoneBody(rects, svgW, svgH) {
+  const svgArea = svgW * svgH;
+  const candidates = rects.filter((r) => {
+    const area = r.width * r.height;
+    if (area < svgArea * 0.3) return false;
+    if (r.rx < 20) return false;
+    if (r.height < r.width * 1.3) return false;
+    return true;
+  }).sort((a, b) => b.width * b.height - a.width * a.height);
+  return candidates[0] ?? null;
+}
+function findScreenArea(rects, phoneBody, svgW, svgH) {
+  const refRect = phoneBody ?? { x: 0, y: 0, width: svgW, height: svgH };
+  const candidates = rects.filter((r) => {
+    if (!isInsideRect(r, refRect, 0.05)) return false;
+    const bodyArea = refRect.width * refRect.height;
+    const area = r.width * r.height;
+    if (area < bodyArea * 0.5) return false;
+    if (area >= bodyArea * 0.98) return false;
+    if (!isLightFill(r.fill)) return false;
+    if (r.rx < 10) return false;
+    return true;
+  }).sort((a, b) => b.width * b.height - a.width * a.height);
+  if (candidates[0]) return candidates[0];
+  const fallbackCandidates = rects.filter((r) => {
+    if (!isInsideRect(r, refRect, 0.05)) return false;
+    const bodyArea = refRect.width * refRect.height;
+    const area = r.width * r.height;
+    if (area < bodyArea * 0.5) return false;
+    if (area >= bodyArea * 0.98) return false;
+    if (r.rx < 10) return false;
+    if (isDarkFill(r.fill) && r.fill !== "none" && r.fill !== null) return false;
+    return true;
+  }).sort((a, b) => b.width * b.height - a.width * a.height);
+  return fallbackCandidates[0] ?? null;
+}
+function findDynamicIsland(rects, screenRect) {
+  if (!screenRect) return null;
+  const candidates = rects.filter((r) => {
+    if (r.width > screenRect.width * 0.5) return false;
+    if (r.width < screenRect.width * 0.05) return false;
+    if (r.width <= r.height) return false;
+    const ratio = r.width / r.height;
+    if (ratio < 1.5 || ratio > 8) return false;
+    if (r.rx < 5) return false;
+    const topThreshold = screenRect.y + screenRect.height * 0.1;
+    if (r.y > topThreshold) return false;
+    if (r.y < screenRect.y) return false;
+    const rCenterX = r.x + r.width / 2;
+    const screenCenterX = screenRect.x + screenRect.width / 2;
+    const maxOffCenter = screenRect.width * 0.25;
+    if (Math.abs(rCenterX - screenCenterX) > maxOffCenter) return false;
+    if (!isDarkFill(r.fill)) return false;
+    return true;
+  }).sort((a, b) => b.width * b.height - a.width * a.height);
+  return candidates[0] ?? null;
+}
+function findSideButtons(rects, phoneBody) {
+  if (!phoneBody) return [];
+  return rects.filter((r) => {
+    const area = r.width * r.height;
+    const bodyArea = phoneBody.width * phoneBody.height;
+    if (area > bodyArea * 0.02) return false;
+    if (area < 10) return false;
+    const isOutsideLeft = r.x + r.width < phoneBody.x + phoneBody.width * 0.05;
+    const isOutsideRight = r.x > phoneBody.x + phoneBody.width * 0.95;
+    if (!isOutsideLeft && !isOutsideRight) return false;
+    if (r.y + r.height < phoneBody.y) return false;
+    if (r.y > phoneBody.y + phoneBody.height) return false;
+    return true;
+  });
+}
+function classifySideButtons(sideButtons, phoneBody) {
+  if (!phoneBody || sideButtons.length === 0) return [];
+  const bodyMidX = phoneBody.x + phoneBody.width / 2;
+  const classified = [];
+  const leftButtons = sideButtons.filter((b) => b.x + b.width / 2 < bodyMidX).sort((a, b) => a.y - b.y);
+  const rightButtons = sideButtons.filter((b) => b.x + b.width / 2 >= bodyMidX).sort((a, b) => a.y - b.y);
+  if (leftButtons.length >= 2) {
+    let bestPairI = -1;
+    let bestPairJ = -1;
+    let bestScore = Infinity;
+    for (let i = 0; i < leftButtons.length; i++) {
+      for (let j = i + 1; j < leftButtons.length; j++) {
+        const a = leftButtons[i], b = leftButtons[j];
+        const areaA = a.width * a.height;
+        const areaB = b.width * b.height;
+        const sizeDiff = Math.abs(areaA - areaB) / Math.max(areaA, areaB);
+        const gap = b.y - (a.y + a.height);
+        if (sizeDiff < 0.5 && gap < a.height * 3 && gap > -a.height) {
+          const score = sizeDiff * 100 + Math.abs(gap);
+          if (score < bestScore) {
+            bestScore = score;
+            bestPairI = i;
+            bestPairJ = j;
+          }
+        }
+      }
+    }
+    if (bestPairI >= 0 && bestPairJ >= 0) {
+      classified.push({
+        type: "volume-up",
+        side: "left",
+        ...leftButtons[bestPairI]
+      });
+      classified.push({
+        type: "volume-down",
+        side: "left",
+        ...leftButtons[bestPairJ]
+      });
+      for (let i = 0; i < leftButtons.length; i++) {
+        if (i !== bestPairI && i !== bestPairJ) {
+          classified.push({
+            type: "action",
+            side: "left",
+            ...leftButtons[i]
+          });
+        }
+      }
+    } else {
+      classified.push({ type: "volume-up", side: "left", ...leftButtons[0] });
+      classified.push({ type: "volume-down", side: "left", ...leftButtons[1] });
+      for (let i = 2; i < leftButtons.length; i++) {
+        classified.push({ type: "action", side: "left", ...leftButtons[i] });
+      }
+    }
+  } else if (leftButtons.length === 1) {
+    classified.push({ type: "volume-up", side: "left", ...leftButtons[0] });
+  }
+  if (rightButtons.length >= 2) {
+    const sorted = [...rightButtons].sort((a, b) => a.y - b.y);
+    classified.push({ type: "power", side: "right", ...sorted[0] });
+    for (let i = 1; i < sorted.length; i++) {
+      classified.push({ type: "camera", side: "right", ...sorted[i] });
+    }
+  } else if (rightButtons.length === 1) {
+    classified.push({ type: "power", side: "right", ...rightButtons[0] });
+  }
+  return classified;
+}
+function findPathCutoutScreen(svgString, svgW, svgH) {
+  const svgArea = svgW * svgH;
+  const pathRegex = /<path\b([^>]*?)\/>/gi;
+  let match;
+  const candidates = [];
+  while ((match = pathRegex.exec(svgString)) !== null) {
+    const attrs = match[1];
+    const preceding = svgString.slice(0, match.index);
+    if (isInsideNonVisualParent(preceding)) continue;
+    const fill = getAttrValue(attrs, "fill");
+    if (!fill || isDarkFill(fill)) continue;
+    if (fill.startsWith("url(")) continue;
+    const d = getAttrValue(attrs, "d");
+    if (!d) continue;
+    const subpaths = d.split(/[Zz]/).filter((s) => s.trim().length > 0);
+    if (subpaths.length < 2) continue;
+    const outerBB = subpathBBox(subpaths[0]);
+    const innerBB = subpathBBox(subpaths[1]);
+    if (!outerBB || !innerBB) continue;
+    const outerArea = outerBB.w * outerBB.h;
+    if (outerArea < svgArea * 0.3) continue;
+    const innerArea = innerBB.w * innerBB.h;
+    if (innerArea < outerArea * 0.5 || innerArea >= outerArea * 0.98) continue;
+    if (innerBB.h < innerBB.w * 1.3) continue;
+    if (innerBB.x < outerBB.x || innerBB.y < outerBB.y) continue;
+    if (innerBB.x + innerBB.w > outerBB.x + outerBB.w + 5) continue;
+    if (innerBB.y + innerBB.h > outerBB.y + outerBB.h + 5) continue;
+    const estimatedRx = Math.round(Math.min(innerBB.w, innerBB.h) * 0.04);
+    candidates.push({ inner: innerBB, rx: Math.max(estimatedRx, 20), fill });
+  }
+  if (candidates.length === 0) return null;
+  candidates.sort((a, b) => b.inner.w * b.inner.h - a.inner.w * a.inner.h);
+  const best = candidates[0];
+  return {
+    x: best.inner.x,
+    y: best.inner.y,
+    width: best.inner.w,
+    height: best.inner.h,
+    rx: best.rx,
+    fill: "path-cutout",
+    id: null
+  };
+}
+function subpathBBox(subpath) {
+  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+  let curX = 0, curY = 0;
+  function addPoint(x, y) {
+    if (!isFinite(x) || !isFinite(y)) return;
+    minX = Math.min(minX, x);
+    minY = Math.min(minY, y);
+    maxX = Math.max(maxX, x);
+    maxY = Math.max(maxY, y);
+    curX = x;
+    curY = y;
+  }
+  const tokens = subpath.match(/[MmLlHhVvCcSsQqTtAaZz]|-?\d+\.?\d*(?:e[+-]?\d+)?/gi);
+  if (!tokens || tokens.length < 3) return null;
+  const toks = tokens;
+  let i = 0;
+  function nextNum() {
+    return i < toks.length ? parseFloat(toks[i++]) : 0;
+  }
+  while (i < toks.length) {
+    const cmd = toks[i];
+    if (/^[A-Za-z]$/.test(cmd)) {
+      i++;
+      switch (cmd) {
+        case "M":
+        case "L":
+          addPoint(nextNum(), nextNum());
+          break;
+        case "m":
+        case "l":
+          addPoint(curX + nextNum(), curY + nextNum());
+          break;
+        case "H":
+          addPoint(nextNum(), curY);
+          break;
+        case "h":
+          addPoint(curX + nextNum(), curY);
+          break;
+        case "V":
+          addPoint(curX, nextNum());
+          break;
+        case "v":
+          addPoint(curX, curY + nextNum());
+          break;
+        case "C": {
+          nextNum();
+          nextNum();
+          nextNum();
+          nextNum();
+          addPoint(nextNum(), nextNum());
+          break;
+        }
+        case "c": {
+          nextNum();
+          nextNum();
+          nextNum();
+          nextNum();
+          addPoint(curX + nextNum(), curY + nextNum());
+          break;
+        }
+        case "S":
+        case "Q": {
+          nextNum();
+          nextNum();
+          addPoint(nextNum(), nextNum());
+          break;
+        }
+        case "s":
+        case "q": {
+          nextNum();
+          nextNum();
+          addPoint(curX + nextNum(), curY + nextNum());
+          break;
+        }
+        case "T":
+          addPoint(nextNum(), nextNum());
+          break;
+        case "t":
+          addPoint(curX + nextNum(), curY + nextNum());
+          break;
+        case "A": {
+          nextNum();
+          nextNum();
+          nextNum();
+          nextNum();
+          nextNum();
+          addPoint(nextNum(), nextNum());
+          break;
+        }
+        case "a": {
+          nextNum();
+          nextNum();
+          nextNum();
+          nextNum();
+          nextNum();
+          addPoint(curX + nextNum(), curY + nextNum());
+          break;
+        }
+      }
+    } else {
+      i++;
+    }
+  }
+  if (!isFinite(minX) || maxX - minX < 10 || maxY - minY < 10) return null;
+  return { x: minX, y: minY, w: maxX - minX, h: maxY - minY };
+}
+function isLightFill(fill) {
+  if (!fill) return false;
+  const f = fill.toLowerCase().trim();
+  if (f === "white" || f === "#fff" || f === "#ffffff") return true;
+  if (f === "rgb(255,255,255)" || f === "rgb(255, 255, 255)") return true;
+  const hex6 = f.match(/^#([0-9a-f]{6})$/);
+  if (hex6) {
+    const r = parseInt(hex6[1].slice(0, 2), 16);
+    const g = parseInt(hex6[1].slice(2, 4), 16);
+    const b = parseInt(hex6[1].slice(4, 6), 16);
+    return r > 200 && g > 200 && b > 200;
+  }
+  return false;
+}
+function isDarkFill(fill) {
+  if (!fill) return false;
+  const f = fill.toLowerCase().trim();
+  if (f === "black" || f === "#000" || f === "#000000") return true;
+  if (f.startsWith("rgb(0") || f === "rgb(0,0,0)" || f === "rgb(0, 0, 0)") return true;
+  const hex6 = f.match(/^#([0-9a-f]{6})$/);
+  if (hex6) {
+    const r = parseInt(hex6[1].slice(0, 2), 16);
+    const g = parseInt(hex6[1].slice(2, 4), 16);
+    const b = parseInt(hex6[1].slice(4, 6), 16);
+    return r < 50 && g < 50 && b < 50;
+  }
+  return false;
+}
+function isInsideRect(inner, outer, tolerance) {
+  const tolX = outer.width * tolerance;
+  const tolY = outer.height * tolerance;
+  return inner.x >= outer.x - tolX && inner.y >= outer.y - tolY && inner.x + inner.width <= outer.x + outer.width + tolX && inner.y + inner.height <= outer.y + outer.height + tolY;
+}
+function extractViewBox(svgString) {
+  const vbMatch = svgString.match(/<svg\b[^>]*viewBox\s*=\s*["']([^"']*)["']/i);
+  if (vbMatch) {
+    const parts = vbMatch[1].trim().split(/[\s,]+/).map(Number);
+    if (parts.length >= 4 && parts.every((n) => isFinite(n))) {
+      return { x: parts[0], y: parts[1], w: parts[2], h: parts[3] };
+    }
+  }
+  const wMatch = svgString.match(/<svg\b[^>]*\bwidth\s*=\s*["']?(\d+\.?\d*)["']?/i);
+  const hMatch = svgString.match(/<svg\b[^>]*\bheight\s*=\s*["']?(\d+\.?\d*)["']?/i);
+  if (wMatch && hMatch) {
+    return { x: 0, y: 0, w: parseFloat(wMatch[1]), h: parseFloat(hMatch[1]) };
+  }
+  return null;
+}
+function extractAllRects(svgString) {
+  const rects = [];
+  const regex = /<rect\b([^>]*?)(?:\/>|>[^<]*<\/rect>)/gi;
+  let match;
+  while ((match = regex.exec(svgString)) !== null) {
+    const attrs = match[1];
+    const preceding = svgString.slice(0, match.index);
+    if (isInsideNonVisualParent(preceding)) continue;
+    const x = getNumAttr(attrs, "x");
+    const y = getNumAttr(attrs, "y");
+    const width = getNumAttr(attrs, "width");
+    const height = getNumAttr(attrs, "height");
+    if (width <= 0 || height <= 0) continue;
+    const transformedPos = applyTransformToRect(attrs, x, y, width, height);
+    const rx = Math.max(getNumAttr(attrs, "rx"), getNumAttr(attrs, "ry"));
+    const fill = getAttrValue(attrs, "fill");
+    const id = getAttrValue(attrs, "id");
+    rects.push({
+      x: transformedPos.x,
+      y: transformedPos.y,
+      width: transformedPos.width,
+      height: transformedPos.height,
+      rx,
+      fill,
+      id
+    });
+  }
+  return rects;
+}
+function isInsideNonVisualParent(preceding) {
+  const nonVisualTags = ["defs", "clipPath", "mask", "filter"];
+  for (const tag of nonVisualTags) {
+    const openCount = countOccurrences(preceding, `<${tag}`);
+    const closeCount = countOccurrences(preceding, `</${tag}`);
+    if (openCount > closeCount) return true;
+  }
+  return false;
+}
+function countOccurrences(str, substr) {
+  let count = 0;
+  let pos = 0;
+  while ((pos = str.indexOf(substr, pos)) !== -1) {
+    count++;
+    pos += substr.length;
+  }
+  return count;
+}
+function applyTransformToRect(attrs, x, y, width, height) {
+  const transformAttr = getAttrValue(attrs, "transform");
+  if (!transformAttr) return { x, y, width, height };
+  const matrixMatch = transformAttr.match(
+    /matrix\(\s*(-?[\d.]+)\s+(-?[\d.]+)\s+(-?[\d.]+)\s+(-?[\d.]+)\s+(-?[\d.]+)\s+(-?[\d.]+)\s*\)/
+  );
+  if (matrixMatch) {
+    const a = parseFloat(matrixMatch[1]);
+    const d = parseFloat(matrixMatch[4]);
+    const tx = parseFloat(matrixMatch[5]);
+    const ty = parseFloat(matrixMatch[6]);
+    if (a === -1 && d === 1) {
+      return { x: tx - x - width, y: y + ty, width, height };
+    }
+    if (a === 1 && d === -1) {
+      return { x: x + tx, y: ty - y - height, width, height };
+    }
+    if (a === 1 && d === 1) {
+      return { x: x + tx, y: y + ty, width, height };
+    }
+  }
+  return { x, y, width, height };
+}
+function detectByNames(svgString) {
+  const detected = [];
+  const usedTypes = /* @__PURE__ */ new Set();
+  const elements = extractSVGElements(svgString);
+  for (const el of elements) {
+    const identifiers = [
+      el.id,
+      el.className,
+      el.dataName,
+      el.dataZone,
+      el.ariaLabel
+    ].filter(Boolean).map((s) => s.toLowerCase());
+    for (const zoneConfig of ZONE_KEYWORDS) {
+      if (usedTypes.has(zoneConfig.type)) continue;
+      for (const keyword of zoneConfig.keywords) {
+        const matched = identifiers.some(
+          (ident) => ident === keyword || ident.includes(keyword) || ident.replace(/[_\s]/g, "-").includes(keyword)
+        );
+        if (matched) {
+          const confidence = zoneConfig.highConfidence.some(
+            (hk) => identifiers.some((ident) => ident === hk || ident.includes(hk))
+          ) ? "high" : "medium";
+          detected.push({
+            id: `auto-${zoneConfig.type}-${Date.now()}`,
+            type: zoneConfig.type,
+            sourceLabel: el.id || el.dataName || el.className || el.ariaLabel || "unknown",
+            matchedKeyword: keyword,
+            confidence,
+            x: el.x,
+            y: el.y,
+            width: el.width,
+            height: el.height
+          });
+          usedTypes.add(zoneConfig.type);
+          break;
+        }
+      }
+    }
+  }
+  return detected;
+}
+function extractSVGElements(svgString) {
+  const elements = [];
+  const tagRegex = /<(rect|g|path|circle|ellipse|use|foreignObject|image)\b([^>]*?)(?:\/>|>)/gi;
+  let match;
+  while ((match = tagRegex.exec(svgString)) !== null) {
+    const tag = match[1].toLowerCase();
+    const attrs = match[2];
+    const id = getAttrValue(attrs, "id");
+    const className = getAttrValue(attrs, "class");
+    const dataName = getAttrValue(attrs, "data-name");
+    const dataZone = getAttrValue(attrs, "data-zone");
+    const ariaLabel = getAttrValue(attrs, "aria-label");
+    if (!id && !className && !dataName && !dataZone && !ariaLabel) continue;
+    const bbox = extractBBox(tag, attrs);
+    elements.push({ tag, id, className, dataName, dataZone, ariaLabel, ...bbox });
+  }
+  return elements;
+}
+function getAttrValue(attrs, name) {
+  const re = new RegExp(`\\b${name}\\s*=\\s*["']([^"']*)["']`, "i");
+  const m = attrs.match(re);
+  return m ? m[1] : null;
+}
+function getNumAttr(attrs, name) {
+  const re = new RegExp(`\\b${name}\\s*=\\s*["']([\\d.]+)["']`, "i");
+  const m = attrs.match(re);
+  return m ? parseFloat(m[1]) : 0;
+}
+function extractBBox(tag, attrs) {
+  switch (tag) {
+    case "rect":
+    case "foreignobject":
+    case "image":
+      return {
+        x: getNumAttr(attrs, "x"),
+        y: getNumAttr(attrs, "y"),
+        width: getNumAttr(attrs, "width"),
+        height: getNumAttr(attrs, "height")
+      };
+    case "circle": {
+      const cx = getNumAttr(attrs, "cx");
+      const cy = getNumAttr(attrs, "cy");
+      const r = getNumAttr(attrs, "r");
+      return { x: cx - r, y: cy - r, width: r * 2, height: r * 2 };
+    }
+    case "ellipse": {
+      const cx = getNumAttr(attrs, "cx");
+      const cy = getNumAttr(attrs, "cy");
+      const rx = getNumAttr(attrs, "rx");
+      const ry = getNumAttr(attrs, "ry");
+      return { x: cx - rx, y: cy - ry, width: rx * 2, height: ry * 2 };
+    }
+    case "path":
+      return extractPathBBox(attrs);
+    case "g":
+    case "use":
+      return {
+        x: getNumAttr(attrs, "x"),
+        y: getNumAttr(attrs, "y"),
+        width: getNumAttr(attrs, "width"),
+        height: getNumAttr(attrs, "height")
+      };
+    default:
+      return { x: 0, y: 0, width: 0, height: 0 };
+  }
+}
+function extractPathBBox(attrs) {
+  const dAttr = getAttrValue(attrs, "d");
+  if (!dAttr) return { x: 0, y: 0, width: 0, height: 0 };
+  const nums = dAttr.match(/-?\d+\.?\d*/g);
+  if (!nums || nums.length < 4) return { x: 0, y: 0, width: 0, height: 0 };
+  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+  for (let i = 0; i < nums.length - 1; i += 2) {
+    const x = parseFloat(nums[i]);
+    const y = parseFloat(nums[i + 1]);
+    if (isFinite(x) && isFinite(y)) {
+      minX = Math.min(minX, x);
+      minY = Math.min(minY, y);
+      maxX = Math.max(maxX, x);
+      maxY = Math.max(maxY, y);
+    }
+  }
+  if (!isFinite(minX)) return { x: 0, y: 0, width: 0, height: 0 };
+  return { x: minX, y: minY, width: maxX - minX, height: maxY - minY };
+}
+function listSVGLayerNames(svgString) {
+  const elements = extractSVGElements(svgString);
+  return elements.map((el) => ({
+    tag: el.tag,
+    name: el.id || el.dataName || el.className || el.ariaLabel || `<${el.tag}>`
+  }));
+}
+
+export { BUILTIN_DEVICES, DEVICE_LAYOUTS, DeviceRegistry, analyzeSVGGeometry, autoDetectZones, buildAIPromptConstraints, buildCSSVariables, classifySideButtons, deriveContentZone, extractZones, getAllDeviceIds, getDeviceContract, getDeviceMetadata, getDeviceRegistry, listSVGLayerNames, normalizeSVGToLogicalPoints, parseSVGNativeDimensions, parseSVGToContract, resetDeviceRegistry, scopeSVGIds, validateNormalizedSVG };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map