@lokascript/compilation-service 2.0.0

package/dist/chunk-ODJIDVMN.js

@@ -0,0 +1,3322 @@
+// src/diff/diff.ts
+function diffBehaviors(a, b) {
+  const triggerDiff = diffTrigger(a, b);
+  const opDiffs = diffOperations(a.operations, b.operations);
+  const identical = triggerDiff === null && opDiffs.every((d) => d.kind === "unchanged");
+  const summary = generateSummary(triggerDiff, opDiffs);
+  return { identical, trigger: triggerDiff, operations: opDiffs, summary };
+}
+function diffTrigger(a, b) {
+  const changes = [];
+  if (a.trigger.event !== b.trigger.event) {
+    changes.push(`event: ${a.trigger.event} \u2192 ${b.trigger.event}`);
+  }
+  const aModKeys = Object.keys(a.trigger.modifiers ?? {}).sort();
+  const bModKeys = Object.keys(b.trigger.modifiers ?? {}).sort();
+  const aMods = a.trigger.modifiers ?? {};
+  const bMods = b.trigger.modifiers ?? {};
+  for (const key of /* @__PURE__ */ new Set([...aModKeys, ...bModKeys])) {
+    const aVal = aMods[key];
+    const bVal = bMods[key];
+    if (aVal === void 0) {
+      changes.push(`added modifier: ${key}`);
+    } else if (bVal === void 0) {
+      changes.push(`removed modifier: ${key}`);
+    } else if (JSON.stringify(aVal) !== JSON.stringify(bVal)) {
+      changes.push(`modifier ${key}: ${JSON.stringify(aVal)} \u2192 ${JSON.stringify(bVal)}`);
+    }
+  }
+  if (changes.length === 0) return null;
+  return {
+    a: { event: a.trigger.event, modifiers: a.trigger.modifiers },
+    b: { event: b.trigger.event, modifiers: b.trigger.modifiers },
+    changes
+  };
+}
+function diffOperations(a, b) {
+  const aKeys = a.map(canonicalizeOp);
+  const bKeys = b.map(canonicalizeOp);
+  const lcs = computeLCS(aKeys, bKeys);
+  const rawDiffs = buildDiffFromLCS(a, b, aKeys, bKeys, lcs);
+  return detectReorderings(rawDiffs);
+}
+function computeLCS(a, b) {
+  const m = a.length;
+  const n = b.length;
+  const dp = Array.from({ length: m + 1 }, () => new Array(n + 1).fill(0));
+  for (let i = 1; i <= m; i++) {
+    for (let j = 1; j <= n; j++) {
+      if (a[i - 1] === b[j - 1]) {
+        dp[i][j] = dp[i - 1][j - 1] + 1;
+      } else {
+        dp[i][j] = Math.max(dp[i - 1][j], dp[i][j - 1]);
+      }
+    }
+  }
+  return dp;
+}
+function buildDiffFromLCS(a, b, aKeys, bKeys, dp) {
+  const diffs = [];
+  let i = a.length;
+  let j = b.length;
+  while (i > 0 || j > 0) {
+    if (i > 0 && j > 0 && aKeys[i - 1] === bKeys[j - 1]) {
+      diffs.push({
+        kind: "unchanged",
+        index: { a: i - 1, b: j - 1 },
+        a: a[i - 1],
+        b: b[j - 1]
+      });
+      i--;
+      j--;
+    } else if (j > 0 && (i === 0 || dp[i][j - 1] >= dp[i - 1][j])) {
+      diffs.push({
+        kind: "added",
+        index: { b: j - 1 },
+        b: b[j - 1]
+      });
+      j--;
+    } else {
+      diffs.push({
+        kind: "removed",
+        index: { a: i - 1 },
+        a: a[i - 1]
+      });
+      i--;
+    }
+  }
+  return diffs.reverse();
+}
+function detectReorderings(diffs) {
+  const removed = [];
+  const added = [];
+  const result = [];
+  for (const d of diffs) {
+    if (d.kind === "removed") removed.push(d);
+    else if (d.kind === "added") added.push(d);
+    else result.push(d);
+  }
+  const usedRemoved = /* @__PURE__ */ new Set();
+  const usedAdded = /* @__PURE__ */ new Set();
+  for (let ri = 0; ri < removed.length; ri++) {
+    if (usedRemoved.has(ri)) continue;
+    const rKey = canonicalizeOp(removed[ri].a);
+    for (let ai = 0; ai < added.length; ai++) {
+      if (usedAdded.has(ai)) continue;
+      const aKey = canonicalizeOp(added[ai].b);
+      if (rKey === aKey) {
+        usedRemoved.add(ri);
+        usedAdded.add(ai);
+        result.push({
+          kind: "reordered",
+          index: { a: removed[ri].index.a, b: added[ai].index.b },
+          a: removed[ri].a,
+          b: added[ai].b
+        });
+        break;
+      }
+    }
+  }
+  for (let ri = 0; ri < removed.length; ri++) {
+    if (usedRemoved.has(ri)) continue;
+    for (let ai = 0; ai < added.length; ai++) {
+      if (usedAdded.has(ai)) continue;
+      if (removed[ri].a.op === added[ai].b.op) {
+        usedRemoved.add(ri);
+        usedAdded.add(ai);
+        result.push({
+          kind: "changed",
+          index: { a: removed[ri].index.a, b: added[ai].index.b },
+          a: removed[ri].a,
+          b: added[ai].b,
+          changes: describeChanges(removed[ri].a, added[ai].b)
+        });
+        break;
+      }
+    }
+  }
+  for (let ri = 0; ri < removed.length; ri++) {
+    if (!usedRemoved.has(ri)) result.push(removed[ri]);
+  }
+  for (let ai = 0; ai < added.length; ai++) {
+    if (!usedAdded.has(ai)) result.push(added[ai]);
+  }
+  result.sort((x, y) => {
+    const xPos = x.index.a ?? x.index.b ?? 0;
+    const yPos = y.index.a ?? y.index.b ?? 0;
+    return xPos - yPos;
+  });
+  return result;
+}
+function canonicalizeOp(op) {
+  const parts = [op.op];
+  switch (op.op) {
+    case "toggleClass":
+    case "addClass":
+    case "removeClass":
+      parts.push(op.className, canonicalizeTarget(op.target));
+      break;
+    case "setContent":
+      parts.push(op.content, canonicalizeTarget(op.target), op.position);
+      break;
+    case "appendContent":
+      parts.push(op.content, canonicalizeTarget(op.target));
+      break;
+    case "show":
+    case "hide":
+    case "focus":
+    case "blur":
+      parts.push(canonicalizeTarget(op.target));
+      break;
+    case "setVariable":
+      parts.push(op.name, op.value, op.scope);
+      break;
+    case "increment":
+    case "decrement":
+      parts.push(canonicalizeTarget(op.target), String(op.amount));
+      break;
+    case "navigate":
+      parts.push(op.url);
+      break;
+    case "historyBack":
+    case "historyForward":
+      break;
+    case "fetch":
+      parts.push(op.url, op.format, op.target ? canonicalizeTarget(op.target) : "");
+      break;
+    case "wait":
+      parts.push(String(op.durationMs));
+      break;
+    case "triggerEvent":
+      parts.push(op.eventName, canonicalizeTarget(op.target), op.detail ?? "");
+      break;
+    case "log":
+      parts.push(...op.values);
+      break;
+  }
+  return parts.join("|");
+}
+function canonicalizeTarget(t) {
+  return t.kind === "self" ? "self" : `${t.kind}:${t.value ?? ""}`;
+}
+function describeChanges(a, b) {
+  const changes = [];
+  const aObj = a;
+  const bObj = b;
+  const allKeys = /* @__PURE__ */ new Set([...Object.keys(aObj), ...Object.keys(bObj)]);
+  for (const key of allKeys) {
+    if (key === "op") continue;
+    const aVal = JSON.stringify(aObj[key]);
+    const bVal = JSON.stringify(bObj[key]);
+    if (aVal !== bVal) {
+      changes.push(`${key}: ${formatValue(aObj[key])} \u2192 ${formatValue(bObj[key])}`);
+    }
+  }
+  return changes;
+}
+function formatValue(v) {
+  if (v === void 0) return "(none)";
+  if (typeof v === "object" && v !== null) {
+    const obj = v;
+    if ("kind" in obj) return obj.kind === "self" ? "self" : `${obj.kind}:${obj.value ?? ""}`;
+    return JSON.stringify(v);
+  }
+  return String(v);
+}
+function generateSummary(trigger, opDiffs) {
+  const parts = [];
+  if (!trigger && opDiffs.every((d) => d.kind === "unchanged")) {
+    return "No semantic change";
+  }
+  if (trigger) {
+    parts.push(`Trigger: ${trigger.changes.join(", ")}`);
+  }
+  const counts = {
+    added: 0,
+    removed: 0,
+    changed: 0,
+    reordered: 0,
+    unchanged: 0
+  };
+  for (const d of opDiffs) counts[d.kind]++;
+  const opParts = [];
+  if (counts.added > 0) opParts.push(`${counts.added} added`);
+  if (counts.removed > 0) opParts.push(`${counts.removed} removed`);
+  if (counts.changed > 0) opParts.push(`${counts.changed} changed`);
+  if (counts.reordered > 0) opParts.push(`${counts.reordered} reordered`);
+  if (opParts.length > 0) {
+    parts.push(`Operations: ${opParts.join(", ")}`);
+  }
+  return parts.join(". ");
+}
+
+// src/input/detect.ts
+function detectFormat(input) {
+  const trimmed = input.trim();
+  if (trimmed.startsWith("[") && trimmed.endsWith("]")) {
+    return "explicit";
+  }
+  if (trimmed.startsWith("{")) {
+    try {
+      const parsed = JSON.parse(trimmed);
+      if (parsed && typeof parsed === "object" && typeof parsed.action === "string") {
+        return "json";
+      }
+    } catch {
+    }
+  }
+  return "natural";
+}
+
+// src/input/json-schema.ts
+var VALID_VALUE_TYPES = /* @__PURE__ */ new Set(["selector", "literal", "reference", "expression"]);
+function validateSemanticJSON(input) {
+  const diagnostics = [];
+  if (!input.action || typeof input.action !== "string") {
+    diagnostics.push({
+      severity: "error",
+      code: "INVALID_ACTION",
+      message: 'Field "action" is required and must be a string.',
+      suggestion: 'Provide a command name like "toggle", "add", "set", etc.'
+    });
+    return diagnostics;
+  }
+  if (input.roles && typeof input.roles === "object") {
+    for (const [role, value] of Object.entries(input.roles)) {
+      if (!value || typeof value !== "object") {
+        diagnostics.push({
+          severity: "error",
+          code: "INVALID_ROLE_VALUE",
+          message: `Role "${role}" must be an object with "type" and "value" fields.`,
+          suggestion: `Use: { "type": "selector", "value": ".active" }`
+        });
+        continue;
+      }
+      const v = value;
+      if (!VALID_VALUE_TYPES.has(v.type)) {
+        diagnostics.push({
+          severity: "error",
+          code: "INVALID_VALUE_TYPE",
+          message: `Role "${role}" has invalid type "${v.type}".`,
+          suggestion: `Valid types: selector, literal, reference, expression.`
+        });
+      }
+      if (v.value === void 0 || v.value === null) {
+        diagnostics.push({
+          severity: "error",
+          code: "MISSING_VALUE",
+          message: `Role "${role}" is missing the "value" field.`
+        });
+      }
+    }
+  }
+  if (input.trigger) {
+    if (!input.trigger.event || typeof input.trigger.event !== "string") {
+      diagnostics.push({
+        severity: "error",
+        code: "INVALID_TRIGGER",
+        message: 'Trigger "event" is required and must be a string.',
+        suggestion: 'Use an event name like "click", "mouseover", "keydown".'
+      });
+    }
+  }
+  return diagnostics;
+}
+function jsonToSemanticNode(input) {
+  const roles = /* @__PURE__ */ new Map();
+  if (input.roles) {
+    for (const [role, value] of Object.entries(input.roles)) {
+      roles.set(role, convertJSONValue(value));
+    }
+  }
+  if (input.trigger) {
+    roles.set("event", { type: "literal", value: input.trigger.event, dataType: "string" });
+    const bodyNode = {
+      kind: "command",
+      action: input.action,
+      roles: new Map(roles)
+    };
+    bodyNode.roles.delete("event");
+    return {
+      kind: "event-handler",
+      action: "on",
+      roles,
+      body: [bodyNode],
+      eventModifiers: input.trigger.modifiers ?? {}
+    };
+  }
+  return {
+    kind: "command",
+    action: input.action,
+    roles
+  };
+}
+function convertJSONValue(value) {
+  switch (value.type) {
+    case "selector":
+      return {
+        type: "selector",
+        value: String(value.value),
+        selectorKind: detectSelectorKind(String(value.value))
+      };
+    case "literal":
+      return {
+        type: "literal",
+        value: value.value,
+        dataType: typeof value.value === "number" ? "number" : typeof value.value === "boolean" ? "boolean" : "string"
+      };
+    case "reference":
+      return { type: "reference", value: String(value.value) };
+    case "expression":
+      return { type: "expression", raw: String(value.value) };
+    default:
+      return { type: "literal", value: String(value.value), dataType: "string" };
+  }
+}
+function detectSelectorKind(selector) {
+  if (selector.startsWith("#")) return "id";
+  if (selector.startsWith(".")) return "class";
+  if (selector.startsWith("[")) return "attribute";
+  return "complex";
+}
+
+// src/compile/cache.ts
+var SemanticCache = class {
+  constructor(maxSize = 500) {
+    /** Cache hit/miss statistics */
+    this.hits = 0;
+    this.misses = 0;
+    this.maxSize = maxSize;
+    this.cache = /* @__PURE__ */ new Map();
+  }
+  /**
+   * Get a cached response, or undefined if not cached.
+   */
+  get(key) {
+    const entry = this.cache.get(key);
+    if (entry) {
+      this.hits++;
+      this.cache.delete(key);
+      this.cache.set(key, entry);
+      return entry;
+    }
+    this.misses++;
+    return void 0;
+  }
+  /**
+   * Store a response in the cache.
+   */
+  set(key, value) {
+    this.cache.delete(key);
+    if (this.cache.size >= this.maxSize) {
+      const oldest = this.cache.keys().next().value;
+      if (oldest !== void 0) {
+        this.cache.delete(oldest);
+      }
+    }
+    this.cache.set(key, value);
+  }
+  /** Current cache size */
+  get size() {
+    return this.cache.size;
+  }
+  /** Clear all entries */
+  clear() {
+    this.cache.clear();
+    this.hits = 0;
+    this.misses = 0;
+  }
+};
+function generateCacheKey(node, options) {
+  const canonical = canonicalize(node);
+  const optKey = `${options.optimization ?? 2}:${options.target ?? "esm"}:${options.minify ?? false}`;
+  return `${canonical}|${optKey}`;
+}
+function canonicalize(node) {
+  if (!node || typeof node !== "object") return String(node);
+  const n = node;
+  const parts = [];
+  if (n.action) parts.push(`a:${n.action}`);
+  if (n.kind) parts.push(`k:${n.kind}`);
+  if (n.roles && typeof n.roles.entries === "function") {
+    const roles = n.roles;
+    const sortedRoles = [...roles.entries()].sort(([a], [b]) => a.localeCompare(b));
+    for (const [role, value] of sortedRoles) {
+      parts.push(`r:${role}=${canonicalizeValue(value)}`);
+    }
+  }
+  if (Array.isArray(n.body)) {
+    parts.push(`b:[${n.body.map(canonicalize).join(",")}]`);
+  }
+  if (n.eventModifiers && typeof n.eventModifiers === "object") {
+    const mods = Object.entries(n.eventModifiers).sort(([a], [b]) => a.localeCompare(b)).map(([k, v]) => `${k}=${v}`).join(",");
+    if (mods) parts.push(`m:${mods}`);
+  }
+  return parts.join(";");
+}
+function canonicalizeValue(value) {
+  if (!value || typeof value !== "object") return String(value);
+  const v = value;
+  return `${v.type}:${v.value ?? v.raw ?? ""}`;
+}
+
+// src/operations/extract.ts
+function extractOperations(node) {
+  const n = node;
+  if (!n || typeof n !== "object") {
+    return emptySpec();
+  }
+  if (n.kind === "event-handler" || n.action === "on") {
+    return extractEventHandler(n);
+  }
+  const ops = extractCommand(n);
+  return {
+    trigger: { event: "click" },
+    triggerTarget: { kind: "self" },
+    operations: ops,
+    async: ops.some(isAsyncOp),
+    source: n.metadata?.sourceText
+  };
+}
+function extractEventHandler(n) {
+  const eventRole = n.roles?.get("event");
+  const eventName = String(eventRole?.value ?? "click");
+  const operations = [];
+  if (n.body && Array.isArray(n.body)) {
+    for (const child of n.body) {
+      operations.push(...extractCommand(child));
+    }
+  }
+  return {
+    trigger: {
+      event: eventName,
+      modifiers: n.eventModifiers
+    },
+    triggerTarget: { kind: "self" },
+    operations,
+    async: operations.some(isAsyncOp),
+    source: n.metadata?.sourceText
+  };
+}
+function extractCommand(n) {
+  const action = n.action;
+  if (!action || action === "on") return [];
+  const roles = n.roles;
+  switch (action) {
+    // --- DOM Class ---
+    case "toggle":
+      return extractClassOp("toggleClass", roles);
+    case "add":
+      return extractClassOp("addClass", roles);
+    case "remove":
+      return extractClassOp("removeClass", roles);
+    // --- DOM Content ---
+    case "put":
+      return extractPut(roles);
+    case "append":
+      return extractAppend(roles);
+    // --- DOM Visibility ---
+    case "show":
+      return extractVisibility("show", roles);
+    case "hide":
+      return extractVisibility("hide", roles);
+    // --- Variables ---
+    case "set":
+      return extractSet(roles);
+    case "increment":
+      return extractIncrDecr("increment", roles);
+    case "decrement":
+      return extractIncrDecr("decrement", roles);
+    // --- Navigation ---
+    case "go":
+      return extractGo(roles);
+    // --- Async ---
+    case "fetch":
+      return extractFetch(roles);
+    case "wait":
+      return extractWait(roles);
+    // --- Events ---
+    case "send":
+    case "trigger":
+      return extractTriggerEvent(roles);
+    // --- Focus ---
+    case "focus":
+      return [{ op: "focus", target: resolveTarget(roles, "patient") }];
+    case "blur":
+      return [{ op: "blur", target: resolveTarget(roles, "patient") }];
+    // --- Utility ---
+    case "log":
+      return extractLog(roles);
+    default:
+      return [];
+  }
+}
+function extractClassOp(op, roles) {
+  const patient = roles?.get("patient");
+  if (!patient) return [];
+  const value = String(patient.value ?? "");
+  const className = value.startsWith(".") ? value.slice(1) : value;
+  if (!className) return [];
+  const target = resolveTarget(roles, op === "removeClass" ? "source" : "destination");
+  return [{ op, className, target }];
+}
+function extractPut(roles) {
+  const patient = roles?.get("patient");
+  if (!patient) return [];
+  const content = String(patient.value ?? patient.raw ?? "");
+  const target = resolveTarget(roles, "destination");
+  const method = roles?.get("method");
+  let position = "into";
+  if (method?.value) {
+    const m = String(method.value);
+    if (m === "before") position = "before";
+    else if (m === "after") position = "after";
+    else if (m === "start" || m === "at start of") position = "start";
+    else if (m === "end" || m === "at end of") position = "end";
+  }
+  return [{ op: "setContent", content, target, position }];
+}
+function extractAppend(roles) {
+  const patient = roles?.get("patient");
+  if (!patient) return [];
+  const content = String(patient.value ?? patient.raw ?? "");
+  const target = resolveTarget(roles, "destination");
+  return [{ op: "appendContent", content, target }];
+}
+function extractVisibility(op, roles) {
+  const target = resolveTarget(roles, "patient");
+  return [{ op, target }];
+}
+function extractSet(roles) {
+  const destination = roles?.get("destination");
+  const patient = roles?.get("patient");
+  if (!destination && !patient) return [];
+  const targetRole = destination ?? patient;
+  const valueRole = destination ? patient : void 0;
+  const name = String(targetRole?.value ?? "");
+  const value = valueRole ? String(valueRole.value ?? "") : "";
+  const scope = targetRole?.scope ?? "local";
+  return [{ op: "setVariable", name, value, scope }];
+}
+function extractIncrDecr(op, roles) {
+  const target = resolveTarget(roles, "patient");
+  const quantity = roles?.get("quantity");
+  const amount = quantity?.value ? Number(quantity.value) : 1;
+  return [{ op, target, amount }];
+}
+function extractGo(roles) {
+  const destination = roles?.get("destination");
+  if (!destination) return [];
+  const url = String(destination.value ?? "");
+  if (url === "back") return [{ op: "historyBack" }];
+  if (url === "forward") return [{ op: "historyForward" }];
+  return [{ op: "navigate", url }];
+}
+function extractFetch(roles) {
+  const source = roles?.get("source");
+  if (!source) return [];
+  const url = String(source.value ?? source.raw ?? "");
+  const responseType = roles?.get("responseType");
+  let format = "text";
+  if (responseType?.value) {
+    const f = String(responseType.value);
+    if (f === "json") format = "json";
+    else if (f === "html") format = "html";
+  }
+  const destRole = roles?.get("destination");
+  const target = destRole ? resolveTargetFromRole(destRole) : void 0;
+  return [{ op: "fetch", url, format, target }];
+}
+function extractWait(roles) {
+  const duration = roles?.get("duration") ?? roles?.get("patient");
+  if (!duration) return [];
+  let ms = 0;
+  const val = duration.value;
+  if (typeof val === "number") {
+    ms = val;
+  } else if (typeof val === "string") {
+    ms = parseDurationMs(val);
+  }
+  return [{ op: "wait", durationMs: ms }];
+}
+function extractTriggerEvent(roles) {
+  const patient = roles?.get("patient");
+  if (!patient) return [];
+  const eventName = String(patient.value ?? "");
+  const target = resolveTarget(roles, "destination");
+  return [{ op: "triggerEvent", eventName, target }];
+}
+function extractLog(roles) {
+  const patient = roles?.get("patient");
+  const values = [];
+  if (patient) {
+    values.push(String(patient.value ?? patient.raw ?? ""));
+  }
+  return [{ op: "log", values }];
+}
+function resolveTarget(roles, roleName) {
+  const role = roles?.get(roleName);
+  if (!role) return { kind: "self" };
+  return resolveTargetFromRole(role);
+}
+function resolveTargetFromRole(role) {
+  const value = String(role.value ?? "");
+  if (role.type === "reference" && (value === "me" || value === "it")) {
+    return { kind: "self" };
+  }
+  if (value.startsWith(":") || role.scope) {
+    return { kind: "variable", value };
+  }
+  if (role.type === "selector" || value.startsWith("#") || value.startsWith(".") || value.startsWith("[")) {
+    return { kind: "selector", value };
+  }
+  if (value) {
+    return { kind: "selector", value };
+  }
+  return { kind: "self" };
+}
+function isAsyncOp(op) {
+  return op.op === "fetch" || op.op === "wait";
+}
+function parseDurationMs(value) {
+  const match = value.match(/^(\d+(?:\.\d+)?)\s*(ms|s|m|h)?$/);
+  if (!match) return 0;
+  const num = parseFloat(match[1]);
+  const unit = match[2] ?? "ms";
+  switch (unit) {
+    case "ms":
+      return num;
+    case "s":
+      return num * 1e3;
+    case "m":
+      return num * 6e4;
+    case "h":
+      return num * 36e5;
+    default:
+      return num;
+  }
+}
+function emptySpec() {
+  return {
+    trigger: { event: "click" },
+    triggerTarget: { kind: "self" },
+    operations: [],
+    async: false
+  };
+}
+
+// src/renderers/html-fixture.ts
+function generateFixture(spec, hyperscript) {
+  const elements = collectElements(spec);
+  const triggerSelector = targetToSelector(spec.triggerTarget);
+  const triggerIsSeparate = triggerSelector !== null && !elements.some((e) => e.selector === triggerSelector);
+  let hyperscriptPlaced = false;
+  const lines = [];
+  if (needsInitialStyles(spec.operations)) {
+    lines.push("<style>");
+    for (const op of spec.operations) {
+      if (op.op === "hide") {
+        const sel = targetToSelector(op.target);
+        if (sel) lines.push(`  ${sel} { display: block; }`);
+      }
+      if (op.op === "show") {
+        const sel = targetToSelector(op.target);
+        if (sel) lines.push(`  ${sel} { display: none; }`);
+      }
+    }
+    lines.push("</style>");
+  }
+  if (triggerIsSeparate) {
+    const triggerEl = createTriggerElement(triggerSelector, hyperscript);
+    lines.push(triggerEl);
+    hyperscriptPlaced = true;
+  }
+  for (const el of elements) {
+    const isTrigger = !triggerIsSeparate && el.selector === triggerSelector || triggerSelector === null && !hyperscriptPlaced;
+    const attrs = isTrigger && hyperscript ? ` _="${escapeAttr(hyperscript)}"` : "";
+    if (isTrigger && hyperscript) hyperscriptPlaced = true;
+    const extraClasses = getInitialClasses(el.selector, spec.operations);
+    let tag = el.tag;
+    let className = el.className;
+    if (extraClasses.length > 0) {
+      className = className ? `${className} ${extraClasses.join(" ")}` : extraClasses.join(" ");
+    }
+    const classAttr = className ? ` class="${className}"` : "";
+    const idAttr = el.id ? ` id="${el.id}"` : "";
+    if (tag === "input") {
+      lines.push(`<${tag}${idAttr}${classAttr}${attrs} />`);
+    } else {
+      const content = el.defaultContent ?? "";
+      lines.push(`<${tag}${idAttr}${classAttr}${attrs}>${content}</${tag}>`);
+    }
+  }
+  if (elements.length === 0 && spec.triggerTarget.kind === "self") {
+    const attr = hyperscript ? ` _="${escapeAttr(hyperscript)}"` : "";
+    lines.push(`<button id="trigger"${attr}>Click me</button>`);
+  }
+  return lines.join("\n");
+}
+function collectElements(spec) {
+  const seen = /* @__PURE__ */ new Set();
+  const elements = [];
+  for (const op of spec.operations) {
+    for (const ref of getTargetRefs(op)) {
+      if (ref.kind !== "selector") continue;
+      if (seen.has(ref.value)) continue;
+      seen.add(ref.value);
+      elements.push(selectorToElement(ref.value));
+    }
+  }
+  return elements;
+}
+function getTargetRefs(op) {
+  const refs = [];
+  if ("target" in op && op.target) {
+    refs.push(op.target);
+  }
+  return refs;
+}
+function selectorToElement(selector) {
+  if (selector.startsWith("#")) {
+    const id = selector.slice(1);
+    return {
+      selector,
+      id,
+      tag: inferTagFromId(id),
+      defaultContent: inferContent(id)
+    };
+  }
+  if (selector.startsWith(".")) {
+    const className = selector.slice(1);
+    return {
+      selector,
+      className,
+      tag: "div",
+      defaultContent: className
+    };
+  }
+  return {
+    selector,
+    tag: "div",
+    defaultContent: ""
+  };
+}
+var BUTTON_IDS = /* @__PURE__ */ new Set(["btn", "button", "submit", "trigger", "action"]);
+var INPUT_IDS = /* @__PURE__ */ new Set(["input", "search", "email", "text", "field", "query"]);
+var FORM_IDS = /* @__PURE__ */ new Set(["form", "signup", "login"]);
+var DIALOG_IDS = /* @__PURE__ */ new Set(["modal", "dialog", "popup", "overlay"]);
+var LIST_IDS = /* @__PURE__ */ new Set(["list", "items", "results", "options"]);
+function inferTagFromId(id) {
+  const lower = id.toLowerCase();
+  if (BUTTON_IDS.has(lower)) return "button";
+  if (INPUT_IDS.has(lower)) return "input";
+  if (FORM_IDS.has(lower)) return "form";
+  if (DIALOG_IDS.has(lower)) return "div";
+  if (LIST_IDS.has(lower)) return "ul";
+  return "div";
+}
+function inferContent(id) {
+  const lower = id.toLowerCase();
+  if (BUTTON_IDS.has(lower)) return "Click";
+  if (INPUT_IDS.has(lower)) return "";
+  if (LIST_IDS.has(lower)) return "";
+  return id.charAt(0).toUpperCase() + id.slice(1);
+}
+function createTriggerElement(selector, hyperscript) {
+  const attr = hyperscript ? ` _="${escapeAttr(hyperscript)}"` : "";
+  if (selector.startsWith("#")) {
+    const id = selector.slice(1);
+    return `<button id="${id}"${attr}>Click</button>`;
+  }
+  return `<button id="trigger"${attr}>Click</button>`;
+}
+function targetToSelector(ref) {
+  if (ref.kind === "selector") return ref.value;
+  if (ref.kind === "self") return null;
+  return null;
+}
+function needsInitialStyles(ops) {
+  return ops.some((op) => op.op === "hide" || op.op === "show");
+}
+function getInitialClasses(selector, ops) {
+  const classes = [];
+  for (const op of ops) {
+    if (op.op === "removeClass" && "target" in op) {
+      const targetSel = targetToSelector(op.target);
+      if (targetSel === selector || op.target.kind === "self" && selector === null) {
+        classes.push(op.className);
+      }
+    }
+  }
+  return classes;
+}
+function escapeAttr(s) {
+  return s.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+
+// src/renderers/playwright.ts
+var PlaywrightRenderer = class {
+  constructor() {
+    this.framework = "playwright";
+  }
+  render(spec, options = {}) {
+    const testName = options.testName ?? generateTestName(spec);
+    const html = generateFixture(spec, options.hyperscript);
+    const lines = [];
+    lines.push("import { test, expect } from '@playwright/test';");
+    lines.push("");
+    lines.push(`test('${escapeString(testName)}', async ({ page }) => {`);
+    lines.push(`  await page.setContent(\`${escapeTemplate(wrapHtml(html))}\`);`);
+    if (options.executionMode === "compiled" && options.compiledJs) {
+      lines.push(
+        `  await page.addScriptTag({ content: \`${escapeTemplate(options.compiledJs)}\` });`
+      );
+    } else {
+      const bundlePath = options.bundlePath ?? "./node_modules/@hyperfixi/core/dist/lokascript-browser.js";
+      lines.push(`  await page.addScriptTag({ path: '${escapeString(bundlePath)}' });`);
+      lines.push("  await page.waitForFunction(() => document.querySelector('[_]') !== null);");
+      lines.push("  await page.waitForTimeout(100);");
+    }
+    lines.push("");
+    const triggerLocator = getTriggerLocator(spec);
+    for (const op of spec.operations) {
+      const assertions = generateAssertions(op, spec, triggerLocator);
+      lines.push(...assertions.map((l) => `  ${l}`));
+    }
+    lines.push("});");
+    lines.push("");
+    return {
+      name: testName,
+      code: lines.join("\n"),
+      html,
+      framework: "playwright",
+      operations: spec.operations
+    };
+  }
+};
+function generateAssertions(op, spec, triggerLocator) {
+  switch (op.op) {
+    case "toggleClass":
+      return generateToggleClassAssertions(op, spec, triggerLocator);
+    case "addClass":
+      return generateAddClassAssertions(op, spec, triggerLocator);
+    case "removeClass":
+      return generateRemoveClassAssertions(op, spec, triggerLocator);
+    case "setContent":
+      return generateSetContentAssertions(op, spec, triggerLocator);
+    case "appendContent":
+      return generateAppendContentAssertions(op, spec, triggerLocator);
+    case "show":
+      return generateShowAssertions(op, spec, triggerLocator);
+    case "hide":
+      return generateHideAssertions(op, spec, triggerLocator);
+    case "navigate":
+      return generateNavigateAssertions(op, spec, triggerLocator);
+    case "focus":
+      return generateFocusAssertions(op, spec, triggerLocator);
+    case "blur":
+      return generateBlurAssertions(op, spec, triggerLocator);
+    case "triggerEvent":
+      return generateTriggerEventAssertions(op, spec, triggerLocator);
+    case "fetch":
+      return generateFetchAssertions(op, spec, triggerLocator);
+    case "wait":
+      return generateWaitAssertions(op);
+    case "setVariable":
+    case "increment":
+    case "decrement":
+      return generateVariableAssertions(op, spec, triggerLocator);
+    case "log":
+      return generateLogAssertions(op, spec, triggerLocator);
+    default:
+      return [`// Unsupported operation: ${op.op}`];
+  }
+}
+function generateToggleClassAssertions(op, spec, triggerLocator) {
+  const locator = targetToLocator(op.target, spec);
+  const lines = [];
+  lines.push(`// Toggle .${op.className}`);
+  lines.push(`await ${triggerLocator}.${triggerAction(spec)};`);
+  if (spec.async) lines.push("await page.waitForTimeout(100);");
+  lines.push(`await expect(${locator}).toHaveClass(/${op.className}/);`);
+  lines.push("");
+  lines.push(`// Toggle back`);
+  lines.push(`await ${triggerLocator}.${triggerAction(spec)};`);
+  if (spec.async) lines.push("await page.waitForTimeout(100);");
+  lines.push(`await expect(${locator}).not.toHaveClass(/${op.className}/);`);
+  return lines;
+}
+function generateAddClassAssertions(op, spec, triggerLocator) {
+  const locator = targetToLocator(op.target, spec);
+  return [
+    `// Add .${op.className}`,
+    `await ${triggerLocator}.${triggerAction(spec)};`,
+    ...spec.async ? ["await page.waitForTimeout(100);"] : [],
+    `await expect(${locator}).toHaveClass(/${op.className}/);`
+  ];
+}
+function generateRemoveClassAssertions(op, spec, triggerLocator) {
+  const locator = targetToLocator(op.target, spec);
+  return [
+    `// Remove .${op.className} (should have it initially)`,
+    `await expect(${locator}).toHaveClass(/${op.className}/);`,
+    `await ${triggerLocator}.${triggerAction(spec)};`,
+    ...spec.async ? ["await page.waitForTimeout(100);"] : [],
+    `await expect(${locator}).not.toHaveClass(/${op.className}/);`
+  ];
+}
+function generateSetContentAssertions(op, spec, triggerLocator) {
+  const locator = targetToLocator(op.target, spec);
+  return [
+    `// Put "${op.content}" into element`,
+    `await ${triggerLocator}.${triggerAction(spec)};`,
+    ...spec.async ? ["await page.waitForTimeout(100);"] : [],
+    `await expect(${locator}).toContainText('${escapeString(op.content)}');`
+  ];
+}
+function generateAppendContentAssertions(op, spec, triggerLocator) {
+  const locator = targetToLocator(op.target, spec);
+  return [
+    `// Append "${op.content}"`,
+    `await ${triggerLocator}.${triggerAction(spec)};`,
+    ...spec.async ? ["await page.waitForTimeout(100);"] : [],
+    `await expect(${locator}).toContainText('${escapeString(op.content)}');`
+  ];
+}
+function generateShowAssertions(op, spec, triggerLocator) {
+  const locator = targetToLocator(op.target, spec);
+  return [
+    "// Show element (initially hidden)",
+    `await expect(${locator}).not.toBeVisible();`,
+    `await ${triggerLocator}.${triggerAction(spec)};`,
+    ...spec.async ? ["await page.waitForTimeout(100);"] : [],
+    `await expect(${locator}).toBeVisible();`
+  ];
+}
+function generateHideAssertions(op, spec, triggerLocator) {
+  const locator = targetToLocator(op.target, spec);
+  return [
+    "// Hide element (initially visible)",
+    `await expect(${locator}).toBeVisible();`,
+    `await ${triggerLocator}.${triggerAction(spec)};`,
+    ...spec.async ? ["await page.waitForTimeout(100);"] : [],
+    `await expect(${locator}).not.toBeVisible();`
+  ];
+}
+function generateNavigateAssertions(op, spec, triggerLocator) {
+  return [
+    `// Navigate to ${op.url}`,
+    `// Note: Navigation will change the page URL`,
+    `await ${triggerLocator}.${triggerAction(spec)};`,
+    `await page.waitForURL('**${op.url}**');`
+  ];
+}
+function generateFocusAssertions(op, spec, triggerLocator) {
+  const locator = targetToLocator(op.target, spec);
+  return [
+    "// Focus element",
+    `await ${triggerLocator}.${triggerAction(spec)};`,
+    ...spec.async ? ["await page.waitForTimeout(100);"] : [],
+    `await expect(${locator}).toBeFocused();`
+  ];
+}
+function generateBlurAssertions(op, spec, triggerLocator) {
+  const locator = targetToLocator(op.target, spec);
+  return [
+    "// Blur element",
+    `await ${locator}.focus();`,
+    `await expect(${locator}).toBeFocused();`,
+    `await ${triggerLocator}.${triggerAction(spec)};`,
+    ...spec.async ? ["await page.waitForTimeout(100);"] : [],
+    `await expect(${locator}).not.toBeFocused();`
+  ];
+}
+function generateTriggerEventAssertions(op, spec, triggerLocator) {
+  return [
+    `// Trigger '${op.eventName}' event`,
+    `const eventReceived = page.evaluate((sel) => {`,
+    `  return new Promise<boolean>((resolve) => {`,
+    `    const el = document.querySelector(sel) ?? document.body;`,
+    `    el.addEventListener('${escapeString(op.eventName)}', () => resolve(true), { once: true });`,
+    `    setTimeout(() => resolve(false), 2000);`,
+    `  });`,
+    `}, '${escapeString(targetToCssSelector(op.target))}');`,
+    `await ${triggerLocator}.${triggerAction(spec)};`,
+    `expect(await eventReceived).toBe(true);`
+  ];
+}
+function generateFetchAssertions(op, spec, triggerLocator) {
+  const lines = [];
+  lines.push(`// Fetch ${op.url} as ${op.format}`);
+  if (op.format === "json") {
+    lines.push(`await page.route('**${op.url}**', route => {`);
+    lines.push(`  route.fulfill({`);
+    lines.push(`    contentType: 'application/json',`);
+    lines.push(`    body: JSON.stringify({ data: 'mock' }),`);
+    lines.push(`  });`);
+    lines.push(`});`);
+  } else if (op.format === "html") {
+    lines.push(`await page.route('**${op.url}**', route => {`);
+    lines.push(`  route.fulfill({`);
+    lines.push(`    contentType: 'text/html',`);
+    lines.push(`    body: '<div>Mock HTML</div>',`);
+    lines.push(`  });`);
+    lines.push(`});`);
+  } else {
+    lines.push(`await page.route('**${op.url}**', route => {`);
+    lines.push(`  route.fulfill({`);
+    lines.push(`    contentType: 'text/plain',`);
+    lines.push(`    body: 'Mock response',`);
+    lines.push(`  });`);
+    lines.push(`});`);
+  }
+  lines.push(`await ${triggerLocator}.${triggerAction(spec)};`);
+  lines.push("await page.waitForTimeout(500);");
+  if (op.target) {
+    const locator = targetToLocator(op.target, spec);
+    lines.push(`await expect(${locator}).not.toBeEmpty();`);
+  }
+  return lines;
+}
+function generateWaitAssertions(op) {
+  return [`// Wait ${op.durationMs}ms`, `// (no assertion \u2014 wait is a timing operation)`];
+}
+function generateVariableAssertions(op, spec, triggerLocator) {
+  return [
+    `// ${op.op} (variable operation \u2014 verify no errors)`,
+    "const errors: string[] = [];",
+    "page.on('pageerror', (err) => errors.push(err.message));",
+    `await ${triggerLocator}.${triggerAction(spec)};`,
+    ...spec.async ? ["await page.waitForTimeout(100);"] : [],
+    "expect(errors).toHaveLength(0);"
+  ];
+}
+function generateLogAssertions(op, spec, triggerLocator) {
+  return [
+    `// Log: ${op.values.join(", ")}`,
+    "const logs: string[] = [];",
+    "page.on('console', msg => { if (msg.type() === 'log') logs.push(msg.text()); });",
+    `await ${triggerLocator}.${triggerAction(spec)};`,
+    ...spec.async ? ["await page.waitForTimeout(100);"] : [],
+    "expect(logs.length).toBeGreaterThan(0);"
+  ];
+}
+function generateTestName(spec) {
+  if (spec.source) return spec.source;
+  const parts = [];
+  parts.push(`on ${spec.trigger.event}`);
+  for (const op of spec.operations) {
+    parts.push(describeOp(op));
+  }
+  return parts.join(" ");
+}
+function describeOp(op) {
+  switch (op.op) {
+    case "toggleClass":
+      return `toggle .${op.className}${describeTarget(op.target)}`;
+    case "addClass":
+      return `add .${op.className}${describeTarget(op.target)}`;
+    case "removeClass":
+      return `remove .${op.className}${describeTarget(op.target)}`;
+    case "setContent":
+      return `put "${op.content}"${describeTarget(op.target)}`;
+    case "appendContent":
+      return `append "${op.content}"${describeTarget(op.target)}`;
+    case "show":
+      return `show${describeTarget(op.target)}`;
+    case "hide":
+      return `hide${describeTarget(op.target)}`;
+    case "navigate":
+      return `go to ${op.url}`;
+    case "focus":
+      return `focus${describeTarget(op.target)}`;
+    case "blur":
+      return `blur${describeTarget(op.target)}`;
+    case "fetch":
+      return `fetch ${op.url} as ${op.format}`;
+    case "wait":
+      return `wait ${op.durationMs}ms`;
+    case "setVariable":
+      return `set ${op.name} to ${op.value}`;
+    case "increment":
+      return `increment${describeTarget(op.target)}`;
+    case "decrement":
+      return `decrement${describeTarget(op.target)}`;
+    case "triggerEvent":
+      return `trigger ${op.eventName}${describeTarget(op.target)}`;
+    case "log":
+      return `log ${op.values.join(", ")}`;
+    case "historyBack":
+      return "go back";
+    case "historyForward":
+      return "go forward";
+    default:
+      return op.op;
+  }
+}
+function describeTarget(target) {
+  if (target.kind === "self") return "";
+  if (target.kind === "selector") return ` on ${target.value}`;
+  if (target.kind === "variable") return ` on ${target.value}`;
+  return "";
+}
+function getTriggerLocator(spec) {
+  if (spec.triggerTarget.kind === "selector") {
+    return `page.locator('${escapeString(spec.triggerTarget.value)}')`;
+  }
+  for (const op of spec.operations) {
+    if ("target" in op && op.target.kind === "selector") {
+      const t = op.target;
+      if (t.kind === "selector") {
+        return `page.locator('${escapeString(t.value)}')`;
+      }
+    }
+  }
+  return "page.locator('[_]')";
+}
+function targetToLocator(target, spec) {
+  if (target.kind === "selector") {
+    return `page.locator('${escapeString(target.value)}')`;
+  }
+  if (target.kind === "self") {
+    return getTriggerLocator(spec);
+  }
+  return getTriggerLocator(spec);
+}
+function targetToCssSelector(target) {
+  if (target.kind === "selector") return target.value;
+  if (target.kind === "self") return "[_]";
+  return "body";
+}
+function triggerAction(spec) {
+  const event = spec.trigger.event;
+  switch (event) {
+    case "click":
+      return "click()";
+    case "dblclick":
+      return "dblclick()";
+    case "mouseenter":
+      return "hover()";
+    case "mouseover":
+      return "hover()";
+    case "focus":
+      return "focus()";
+    case "blur":
+      return "blur()";
+    case "keydown":
+    case "keyup":
+    case "keypress":
+      return "press('Enter')";
+    case "input":
+    case "change":
+      return "fill('test')";
+    case "submit":
+      return "click()";
+    default:
+      return `dispatchEvent(new Event('${escapeString(event)}'))`;
+  }
+}
+function wrapHtml(body) {
+  return `<!DOCTYPE html>
+<html>
+<body>
+${body}
+</body>
+</html>`;
+}
+function escapeString(s) {
+  return s.replace(/\\/g, "\\\\").replace(/'/g, "\\'");
+}
+function escapeTemplate(s) {
+  return s.replace(/`/g, "\\`").replace(/\$\{/g, "\\${");
+}
+
+// src/renderers/renderer-helpers.ts
+function capitalize(s) {
+  if (!s) return s;
+  return s.charAt(0).toUpperCase() + s.slice(1);
+}
+function escapeString2(s) {
+  return s.replace(/\\/g, "\\\\").replace(/'/g, "\\'");
+}
+function isNumeric(s) {
+  return /^-?\d+(\.\d+)?$/.test(s);
+}
+function cleanVarName(name) {
+  return name.replace(/^:/, "").replace(/[^a-zA-Z0-9]/g, "");
+}
+function targetKey(target) {
+  if (target.kind === "self") return "self";
+  return target.value;
+}
+function stateKey(prefix, name, target) {
+  return `${prefix}:${name}:${targetKey(target)}`;
+}
+function targetStateName(target, suffix) {
+  if (target.kind === "selector") {
+    const clean = target.value.replace(/^[#.]/, "");
+    return clean + suffix;
+  }
+  return suffix.toLowerCase();
+}
+function targetRefName(target) {
+  if (target.kind === "selector") {
+    const clean = target.value.replace(/^[#.]/, "");
+    return clean + "Ref";
+  }
+  return "elementRef";
+}
+function inferType(value) {
+  if (isNumeric(value)) return "<number>";
+  if (value === "true" || value === "false") return "<boolean>";
+  return "<string>";
+}
+function inferInitial(value, typeAnn) {
+  if (typeAnn === "<number>") return isNumeric(value) ? value : "0";
+  if (typeAnn === "<boolean>") return value === "true" ? "true" : "false";
+  return `'${escapeString2(value)}'`;
+}
+function selectorToTag(selector) {
+  if (selector.startsWith("#")) {
+    const id = selector.slice(1).toLowerCase();
+    if (["btn", "button", "submit", "trigger"].includes(id)) return "button";
+    if (["input", "search", "email", "text", "field"].includes(id)) return "input";
+    if (["form", "signup", "login"].includes(id)) return "form";
+    return "div";
+  }
+  return "div";
+}
+function inferTriggerTag(spec) {
+  if (spec.triggerTarget.kind === "selector") {
+    return selectorToTag(spec.triggerTarget.value);
+  }
+  if (spec.trigger.event === "submit") return "form";
+  if (spec.trigger.event === "input" || spec.trigger.event === "change") return "input";
+  return "button";
+}
+function inferTriggerContent(spec) {
+  const tag = inferTriggerTag(spec);
+  if (tag === "input" || tag === "form") return "";
+  if (spec.triggerTarget.kind === "selector") {
+    const id = spec.triggerTarget.value.replace(/^[#.]/, "");
+    return capitalize(id);
+  }
+  return "Click";
+}
+function generateComponentName(spec) {
+  if (spec.operations.length === 0) return "Component";
+  const parts = [];
+  const firstOp = spec.operations[0];
+  switch (firstOp.op) {
+    case "toggleClass":
+      parts.push("Toggle", capitalize(firstOp.className));
+      break;
+    case "addClass":
+      parts.push("Add", capitalize(firstOp.className));
+      break;
+    case "removeClass":
+      parts.push("Remove", capitalize(firstOp.className));
+      break;
+    case "show":
+      parts.push("Show");
+      appendTargetName(parts, firstOp.target);
+      break;
+    case "hide":
+      parts.push("Hide");
+      appendTargetName(parts, firstOp.target);
+      break;
+    case "setContent":
+      parts.push("SetContent");
+      appendTargetName(parts, firstOp.target);
+      break;
+    case "navigate":
+      parts.push("NavigateTo");
+      parts.push(capitalize(firstOp.url.replace(/[^a-zA-Z0-9]/g, "")));
+      break;
+    case "fetch":
+      parts.push("FetchData");
+      break;
+    case "increment":
+      parts.push("Increment");
+      appendTargetName(parts, firstOp.target);
+      break;
+    case "decrement":
+      parts.push("Decrement");
+      appendTargetName(parts, firstOp.target);
+      break;
+    case "focus":
+      parts.push("Focus");
+      appendTargetName(parts, firstOp.target);
+      break;
+    default:
+      parts.push("Component");
+  }
+  if (spec.trigger.event !== "click") {
+    parts.push("On", capitalize(spec.trigger.event));
+  }
+  return parts.join("") || "Component";
+}
+function appendTargetName(parts, target) {
+  if (target.kind === "selector") {
+    const clean = target.value.replace(/^[#.]/, "");
+    parts.push(capitalize(clean));
+  }
+}
+function getSelfClassStates(spec, stateMap) {
+  const result = [];
+  for (const op of spec.operations) {
+    if ((op.op === "toggleClass" || op.op === "addClass" || op.op === "removeClass") && op.target.kind === "self") {
+      const stateVar = stateMap.get("self:class:" + op.className);
+      if (stateVar) {
+        result.push({ stateName: stateVar, className: op.className });
+      }
+    }
+  }
+  return result;
+}
+
+// src/renderers/react.ts
+var ReactRenderer = class {
+  constructor() {
+    this.framework = "react";
+  }
+  render(spec, options = {}) {
+    const componentName = options.componentName ?? generateComponentName(spec);
+    const ts = options.typescript !== false;
+    const analysis = analyzeOperations(spec);
+    const lines = [];
+    const hooksList = [...analysis.hooks];
+    if (hooksList.length > 0) {
+      lines.push(`import { ${hooksList.join(", ")} } from 'react';`);
+    }
+    lines.push("");
+    const propsType = ts ? "()" : "()";
+    lines.push(`export function ${componentName}${propsType} {`);
+    for (const state of analysis.states) {
+      const typeAnn = ts ? state.typeAnnotation : "";
+      lines.push(
+        `  const [${state.name}, ${state.setter}] = useState${typeAnn}(${state.initialValue});`
+      );
+    }
+    for (const ref of analysis.refs) {
+      const typeAnn = ts ? ref.typeAnnotation : "";
+      lines.push(`  const ${ref.name} = useRef${typeAnn}(null);`);
+    }
+    if (analysis.states.length > 0 || analysis.refs.length > 0) {
+      lines.push("");
+    }
+    const handlerName = `handle${capitalize(spec.trigger.event)}`;
+    const asyncPrefix = spec.async ? "async " : "";
+    lines.push(`  const ${handlerName} = useCallback(${asyncPrefix}() => {`);
+    for (const op of spec.operations) {
+      const opLines = generateOperationCode(op, analysis);
+      for (const l of opLines) {
+        lines.push(`    ${l}`);
+      }
+    }
+    lines.push("  }, []);");
+    lines.push("");
+    lines.push("  return (");
+    const jsx = generateJSX(spec, analysis, handlerName);
+    for (const l of jsx) {
+      lines.push(`    ${l}`);
+    }
+    lines.push("  );");
+    lines.push("}");
+    lines.push("");
+    return {
+      name: componentName,
+      code: lines.join("\n"),
+      framework: "react",
+      operations: spec.operations,
+      hooks: hooksList
+    };
+  }
+};
+function analyzeOperations(spec) {
+  const hooks = /* @__PURE__ */ new Set();
+  const states = [];
+  const refs = [];
+  const stateMap = /* @__PURE__ */ new Map();
+  const refMap = /* @__PURE__ */ new Map();
+  const seenStates = /* @__PURE__ */ new Set();
+  hooks.add("useCallback");
+  for (const op of spec.operations) {
+    switch (op.op) {
+      case "toggleClass": {
+        const key = stateKey("has", op.className, op.target);
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          hooks.add("useState");
+          const name = `has${capitalize(op.className)}`;
+          states.push({
+            name,
+            setter: `set${capitalize(name)}`,
+            typeAnnotation: "<boolean>",
+            initialValue: "false",
+            targetKey: targetKey(op.target)
+          });
+          stateMap.set(targetKey(op.target) + ":class:" + op.className, name);
+        }
+        break;
+      }
+      case "addClass":
+      case "removeClass": {
+        const key = stateKey("has", op.className, op.target);
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          hooks.add("useState");
+          const name = `has${capitalize(op.className)}`;
+          const initial = op.op === "removeClass" ? "true" : "false";
+          states.push({
+            name,
+            setter: `set${capitalize(name)}`,
+            typeAnnotation: "<boolean>",
+            initialValue: initial,
+            targetKey: targetKey(op.target)
+          });
+          stateMap.set(targetKey(op.target) + ":class:" + op.className, name);
+        }
+        break;
+      }
+      case "show":
+      case "hide": {
+        const tk = targetKey(op.target);
+        const key = "visible:" + tk;
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          hooks.add("useState");
+          const name = targetStateName(op.target, "Visible");
+          states.push({
+            name,
+            setter: `set${capitalize(name)}`,
+            typeAnnotation: "<boolean>",
+            initialValue: op.op === "hide" ? "true" : "false",
+            targetKey: tk
+          });
+          stateMap.set(tk + ":visible", name);
+        }
+        break;
+      }
+      case "setContent":
+      case "appendContent": {
+        const tk = targetKey(op.target);
+        const key = "content:" + tk;
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          hooks.add("useState");
+          const name = targetStateName(op.target, "Content");
+          states.push({
+            name,
+            setter: `set${capitalize(name)}`,
+            typeAnnotation: "<string>",
+            initialValue: "''",
+            targetKey: tk
+          });
+          stateMap.set(tk + ":content", name);
+        }
+        break;
+      }
+      case "setVariable": {
+        const key = "var:" + op.name;
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          hooks.add("useState");
+          const name = cleanVarName(op.name);
+          const typeAnn = inferType(op.value);
+          states.push({
+            name,
+            setter: `set${capitalize(name)}`,
+            typeAnnotation: typeAnn,
+            initialValue: inferInitial(op.value, typeAnn),
+            targetKey: "var:" + op.name
+          });
+          stateMap.set("var:" + op.name, name);
+        }
+        break;
+      }
+      case "increment":
+      case "decrement": {
+        const tk = targetKey(op.target);
+        const key = "num:" + tk;
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          hooks.add("useState");
+          const name = targetStateName(op.target, "Count");
+          states.push({
+            name,
+            setter: `set${capitalize(name)}`,
+            typeAnnotation: "<number>",
+            initialValue: "0",
+            targetKey: tk
+          });
+          stateMap.set(tk + ":num", name);
+        }
+        break;
+      }
+      case "fetch": {
+        if (op.target) {
+          const tk = targetKey(op.target);
+          const key = "content:" + tk;
+          if (!seenStates.has(key)) {
+            seenStates.add(key);
+            hooks.add("useState");
+            const name = targetStateName(op.target, "Content");
+            states.push({
+              name,
+              setter: `set${capitalize(name)}`,
+              typeAnnotation: "<string>",
+              initialValue: "''",
+              targetKey: tk
+            });
+            stateMap.set(tk + ":content", name);
+          }
+        }
+        break;
+      }
+      case "focus":
+      case "blur": {
+        const tk = targetKey(op.target);
+        if (!refMap.has(tk)) {
+          hooks.add("useRef");
+          const name = targetRefName(op.target);
+          refs.push({
+            name,
+            typeAnnotation: "<HTMLElement>",
+            targetKey: tk
+          });
+          refMap.set(tk, name);
+        }
+        break;
+      }
+      case "triggerEvent": {
+        const tk = targetKey(op.target);
+        if (!refMap.has(tk)) {
+          hooks.add("useRef");
+          const name = targetRefName(op.target);
+          refs.push({
+            name,
+            typeAnnotation: "<HTMLElement>",
+            targetKey: tk
+          });
+          refMap.set(tk, name);
+        }
+        break;
+      }
+    }
+  }
+  return { hooks, states, refs, stateMap, refMap };
+}
+function generateOperationCode(op, analysis) {
+  switch (op.op) {
+    case "toggleClass": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":class:" + op.className);
+      const setter = stateVar ? `set${capitalize(stateVar)}` : "setState";
+      return [`${setter}(prev => !prev);`];
+    }
+    case "addClass": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":class:" + op.className);
+      const setter = stateVar ? `set${capitalize(stateVar)}` : "setState";
+      return [`${setter}(true);`];
+    }
+    case "removeClass": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":class:" + op.className);
+      const setter = stateVar ? `set${capitalize(stateVar)}` : "setState";
+      return [`${setter}(false);`];
+    }
+    case "show": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":visible");
+      const setter = stateVar ? `set${capitalize(stateVar)}` : "setVisible";
+      return [`${setter}(true);`];
+    }
+    case "hide": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":visible");
+      const setter = stateVar ? `set${capitalize(stateVar)}` : "setVisible";
+      return [`${setter}(false);`];
+    }
+    case "setContent": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":content");
+      const setter = stateVar ? `set${capitalize(stateVar)}` : "setContent";
+      return [`${setter}('${escapeString2(op.content)}');`];
+    }
+    case "appendContent": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":content");
+      const setter = stateVar ? `set${capitalize(stateVar)}` : "setContent";
+      return [`${setter}(prev => prev + '${escapeString2(op.content)}');`];
+    }
+    case "setVariable": {
+      const stateVar = analysis.stateMap.get("var:" + op.name);
+      const setter = stateVar ? `set${capitalize(stateVar)}` : "setValue";
+      const val = isNumeric(op.value) ? op.value : `'${escapeString2(op.value)}'`;
+      return [`${setter}(${val});`];
+    }
+    case "increment": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":num");
+      const setter = stateVar ? `set${capitalize(stateVar)}` : "setCount";
+      return [`${setter}(prev => prev + ${op.amount});`];
+    }
+    case "decrement": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":num");
+      const setter = stateVar ? `set${capitalize(stateVar)}` : "setCount";
+      return [`${setter}(prev => prev - ${op.amount});`];
+    }
+    case "navigate":
+      return [`window.location.href = '${escapeString2(op.url)}';`];
+    case "historyBack":
+      return ["window.history.back();"];
+    case "historyForward":
+      return ["window.history.forward();"];
+    case "fetch": {
+      const lines = [];
+      lines.push(`const response = await fetch('${escapeString2(op.url)}');`);
+      if (op.format === "json") {
+        lines.push("const data = await response.json();");
+      } else if (op.format === "html") {
+        lines.push("const data = await response.text();");
+      } else {
+        lines.push("const data = await response.text();");
+      }
+      if (op.target) {
+        const stateVar = analysis.stateMap.get(targetKey(op.target) + ":content");
+        const setter = stateVar ? `set${capitalize(stateVar)}` : "setContent";
+        if (op.format === "json") {
+          lines.push(`${setter}(JSON.stringify(data));`);
+        } else {
+          lines.push(`${setter}(data);`);
+        }
+      }
+      return lines;
+    }
+    case "wait":
+      return [`await new Promise(resolve => setTimeout(resolve, ${op.durationMs}));`];
+    case "focus": {
+      const refName = analysis.refMap.get(targetKey(op.target));
+      return [`${refName ?? "ref"}?.current?.focus();`];
+    }
+    case "blur": {
+      const refName = analysis.refMap.get(targetKey(op.target));
+      return [`${refName ?? "ref"}?.current?.blur();`];
+    }
+    case "triggerEvent": {
+      const refName = analysis.refMap.get(targetKey(op.target));
+      return [
+        `${refName ?? "ref"}?.current?.dispatchEvent(new CustomEvent('${escapeString2(op.eventName)}', { bubbles: true }));`
+      ];
+    }
+    case "log":
+      return [`console.log(${op.values.map((v) => `'${escapeString2(v)}'`).join(", ")});`];
+    default:
+      return [`// Unsupported: ${op.op}`];
+  }
+}
+function generateJSX(spec, analysis, handlerName) {
+  const lines = [];
+  const elements = collectJSXElements(spec, analysis);
+  const eventProp = eventToReactProp(spec.trigger.event);
+  const needsFragment = elements.length > 1 || elements.length === 0;
+  if (needsFragment) lines.push("<>");
+  const triggerTag = inferTriggerTag(spec);
+  const triggerAttrs = [`${eventProp}={${handlerName}}`];
+  const selfClassStates = getSelfClassStates(spec, analysis.stateMap);
+  if (selfClassStates.length > 0) {
+    const classExpr = selfClassStates.map((s) => `\${${s.stateName} ? '${s.className}' : ''}`).join(" ").trim();
+    triggerAttrs.push(`className={\`${classExpr}\`.trim()}`);
+  }
+  const indent = needsFragment ? "  " : "";
+  lines.push(
+    `${indent}<${triggerTag} ${triggerAttrs.join(" ")}>${inferTriggerContent(spec)}</${triggerTag}>`
+  );
+  for (const el of elements) {
+    const elLines = renderJSXElement(el, analysis);
+    for (const l of elLines) {
+      lines.push(`${indent}${l}`);
+    }
+  }
+  if (needsFragment) lines.push("</>");
+  return lines;
+}
+function collectJSXElements(spec, _analysis) {
+  const seen = /* @__PURE__ */ new Set();
+  const elements = [];
+  for (const op of spec.operations) {
+    if (!("target" in op)) continue;
+    const target = op.target;
+    if (target.kind !== "selector") continue;
+    if (spec.triggerTarget.kind === "selector" && spec.triggerTarget.value === target.value)
+      continue;
+    const sel = target.value;
+    if (seen.has(sel)) {
+      const existing = elements.find((e) => e.selector === sel);
+      if (existing) existing.ops.push(op);
+      continue;
+    }
+    seen.add(sel);
+    const tag = selectorToTag(sel);
+    const id = sel.startsWith("#") ? sel.slice(1) : void 0;
+    const cls = sel.startsWith(".") ? sel.slice(1) : void 0;
+    elements.push({
+      selector: sel,
+      tag,
+      id,
+      className: cls,
+      ops: [op]
+    });
+  }
+  return elements;
+}
+function renderJSXElement(el, analysis) {
+  const lines = [];
+  const attrs = [];
+  if (el.id) attrs.push(`id="${el.id}"`);
+  const classStates = [];
+  for (const op of el.ops) {
+    if (op.op === "toggleClass" || op.op === "addClass" || op.op === "removeClass") {
+      const stateVar = analysis.stateMap.get(el.selector + ":class:" + op.className);
+      if (stateVar) {
+        classStates.push({ stateName: stateVar, className: op.className });
+      }
+    }
+  }
+  if (classStates.length > 0) {
+    const parts = classStates.map((s) => `\${${s.stateName} ? '${s.className}' : ''}`);
+    if (el.className) {
+      attrs.push(`className={\`${el.className} ${parts.join(" ")}\`.trim()}`);
+    } else {
+      attrs.push(`className={\`${parts.join(" ")}\`.trim()}`);
+    }
+  } else if (el.className) {
+    attrs.push(`className="${el.className}"`);
+  }
+  const refName = analysis.refMap.get(el.selector);
+  if (refName) {
+    attrs.push(`ref={${refName}}`);
+  }
+  const visState = analysis.stateMap.get(el.selector + ":visible");
+  const contentState = analysis.stateMap.get(el.selector + ":content");
+  const numState = analysis.stateMap.get(el.selector + ":num");
+  const attrStr = attrs.length > 0 ? " " + attrs.join(" ") : "";
+  const content = contentState ? `{${contentState}}` : numState ? `{${numState}}` : el.content ?? el.id ?? "";
+  const elementLine = `<${el.tag}${attrStr}>${content}</${el.tag}>`;
+  if (visState) {
+    lines.push(`{${visState} && ${elementLine}}`);
+  } else {
+    lines.push(elementLine);
+  }
+  return lines;
+}
+function eventToReactProp(event) {
+  switch (event) {
+    case "click":
+      return "onClick";
+    case "dblclick":
+      return "onDoubleClick";
+    case "mouseenter":
+      return "onMouseEnter";
+    case "mouseover":
+      return "onMouseOver";
+    case "mouseleave":
+      return "onMouseLeave";
+    case "focus":
+      return "onFocus";
+    case "blur":
+      return "onBlur";
+    case "keydown":
+      return "onKeyDown";
+    case "keyup":
+      return "onKeyUp";
+    case "keypress":
+      return "onKeyPress";
+    case "input":
+      return "onInput";
+    case "change":
+      return "onChange";
+    case "submit":
+      return "onSubmit";
+    default:
+      return `on${capitalize(event)}`;
+  }
+}
+
+// src/renderers/vue.ts
+var VueRenderer = class {
+  constructor() {
+    this.framework = "vue";
+  }
+  render(spec, options = {}) {
+    const componentName = options.componentName ?? generateComponentName(spec);
+    const ts = options.typescript !== false;
+    const analysis = analyzeOperations2(spec);
+    const scriptLines = [];
+    const vueImports = [];
+    if (analysis.states.length > 0 || analysis.refs.length > 0) {
+      vueImports.push("ref");
+    }
+    if (vueImports.length > 0) {
+      scriptLines.push(`import { ${vueImports.join(", ")} } from 'vue'`);
+      scriptLines.push("");
+    }
+    for (const state of analysis.states) {
+      if (ts) {
+        scriptLines.push(`const ${state.name} = ref${state.typeAnnotation}(${state.initialValue})`);
+      } else {
+        scriptLines.push(`const ${state.name} = ref(${state.initialValue})`);
+      }
+    }
+    for (const r of analysis.refs) {
+      if (ts) {
+        scriptLines.push(`const ${r.name} = ref<HTMLElement | null>(null)`);
+      } else {
+        scriptLines.push(`const ${r.name} = ref(null)`);
+      }
+    }
+    if (analysis.states.length > 0 || analysis.refs.length > 0) {
+      scriptLines.push("");
+    }
+    const handlerName = `handle${capitalize(spec.trigger.event)}`;
+    const asyncPrefix = spec.async ? "async " : "";
+    scriptLines.push(`${asyncPrefix}function ${handlerName}() {`);
+    for (const op of spec.operations) {
+      const opLines = generateOperationCode2(op, analysis);
+      for (const l of opLines) {
+        scriptLines.push(`  ${l}`);
+      }
+    }
+    scriptLines.push("}");
+    const templateLines = generateTemplate(spec, analysis, handlerName);
+    const langAttr = ts ? ' lang="ts"' : "";
+    const lines = [];
+    lines.push(`<script setup${langAttr}>`);
+    for (const l of scriptLines) {
+      lines.push(l);
+    }
+    lines.push("</script>");
+    lines.push("");
+    lines.push("<template>");
+    for (const l of templateLines) {
+      lines.push(`  ${l}`);
+    }
+    lines.push("</template>");
+    lines.push("");
+    const hooks = vueImports.length > 0 ? [...vueImports] : [];
+    return {
+      name: componentName,
+      code: lines.join("\n"),
+      framework: "vue",
+      operations: spec.operations,
+      hooks
+    };
+  }
+};
+function analyzeOperations2(spec) {
+  const states = [];
+  const refs = [];
+  const stateMap = /* @__PURE__ */ new Map();
+  const refMap = /* @__PURE__ */ new Map();
+  const seenStates = /* @__PURE__ */ new Set();
+  for (const op of spec.operations) {
+    switch (op.op) {
+      case "toggleClass": {
+        const key = stateKey("has", op.className, op.target);
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          const name = `has${capitalize(op.className)}`;
+          states.push({
+            name,
+            typeAnnotation: "<boolean>",
+            initialValue: "false",
+            targetKey: targetKey(op.target)
+          });
+          stateMap.set(targetKey(op.target) + ":class:" + op.className, name);
+        }
+        break;
+      }
+      case "addClass":
+      case "removeClass": {
+        const key = stateKey("has", op.className, op.target);
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          const name = `has${capitalize(op.className)}`;
+          const initial = op.op === "removeClass" ? "true" : "false";
+          states.push({
+            name,
+            typeAnnotation: "<boolean>",
+            initialValue: initial,
+            targetKey: targetKey(op.target)
+          });
+          stateMap.set(targetKey(op.target) + ":class:" + op.className, name);
+        }
+        break;
+      }
+      case "show":
+      case "hide": {
+        const tk = targetKey(op.target);
+        const key = "visible:" + tk;
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          const name = targetStateName(op.target, "Visible");
+          states.push({
+            name,
+            typeAnnotation: "<boolean>",
+            initialValue: op.op === "hide" ? "true" : "false",
+            targetKey: tk
+          });
+          stateMap.set(tk + ":visible", name);
+        }
+        break;
+      }
+      case "setContent":
+      case "appendContent": {
+        const tk = targetKey(op.target);
+        const key = "content:" + tk;
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          const name = targetStateName(op.target, "Content");
+          states.push({
+            name,
+            typeAnnotation: "<string>",
+            initialValue: "''",
+            targetKey: tk
+          });
+          stateMap.set(tk + ":content", name);
+        }
+        break;
+      }
+      case "setVariable": {
+        const key = "var:" + op.name;
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          const name = cleanVarName(op.name);
+          const typeAnn = inferType(op.value);
+          states.push({
+            name,
+            typeAnnotation: typeAnn,
+            initialValue: inferInitial(op.value, typeAnn),
+            targetKey: "var:" + op.name
+          });
+          stateMap.set("var:" + op.name, name);
+        }
+        break;
+      }
+      case "increment":
+      case "decrement": {
+        const tk = targetKey(op.target);
+        const key = "num:" + tk;
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          const name = targetStateName(op.target, "Count");
+          states.push({
+            name,
+            typeAnnotation: "<number>",
+            initialValue: "0",
+            targetKey: tk
+          });
+          stateMap.set(tk + ":num", name);
+        }
+        break;
+      }
+      case "fetch": {
+        if (op.target) {
+          const tk = targetKey(op.target);
+          const key = "content:" + tk;
+          if (!seenStates.has(key)) {
+            seenStates.add(key);
+            const name = targetStateName(op.target, "Content");
+            states.push({
+              name,
+              typeAnnotation: "<string>",
+              initialValue: "''",
+              targetKey: tk
+            });
+            stateMap.set(tk + ":content", name);
+          }
+        }
+        break;
+      }
+      case "focus":
+      case "blur": {
+        const tk = targetKey(op.target);
+        if (!refMap.has(tk)) {
+          const name = targetRefName(op.target);
+          refs.push({ name, targetKey: tk });
+          refMap.set(tk, name);
+        }
+        break;
+      }
+      case "triggerEvent": {
+        const tk = targetKey(op.target);
+        if (!refMap.has(tk)) {
+          const name = targetRefName(op.target);
+          refs.push({ name, targetKey: tk });
+          refMap.set(tk, name);
+        }
+        break;
+      }
+    }
+  }
+  return { states, refs, stateMap, refMap };
+}
+function generateOperationCode2(op, analysis) {
+  switch (op.op) {
+    case "toggleClass": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":class:" + op.className);
+      return [`${stateVar ?? "state"}.value = !${stateVar ?? "state"}.value`];
+    }
+    case "addClass": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":class:" + op.className);
+      return [`${stateVar ?? "state"}.value = true`];
+    }
+    case "removeClass": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":class:" + op.className);
+      return [`${stateVar ?? "state"}.value = false`];
+    }
+    case "show": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":visible");
+      return [`${stateVar ?? "visible"}.value = true`];
+    }
+    case "hide": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":visible");
+      return [`${stateVar ?? "visible"}.value = false`];
+    }
+    case "setContent": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":content");
+      return [`${stateVar ?? "content"}.value = '${escapeString2(op.content)}'`];
+    }
+    case "appendContent": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":content");
+      return [`${stateVar ?? "content"}.value += '${escapeString2(op.content)}'`];
+    }
+    case "setVariable": {
+      const stateVar = analysis.stateMap.get("var:" + op.name);
+      const val = isNumeric(op.value) ? op.value : `'${escapeString2(op.value)}'`;
+      return [`${stateVar ?? "value"}.value = ${val}`];
+    }
+    case "increment": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":num");
+      return [`${stateVar ?? "count"}.value += ${op.amount}`];
+    }
+    case "decrement": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":num");
+      return [`${stateVar ?? "count"}.value -= ${op.amount}`];
+    }
+    case "navigate":
+      return [`window.location.href = '${escapeString2(op.url)}'`];
+    case "historyBack":
+      return ["window.history.back()"];
+    case "historyForward":
+      return ["window.history.forward()"];
+    case "fetch": {
+      const lines = [];
+      lines.push(`const response = await fetch('${escapeString2(op.url)}')`);
+      if (op.format === "json") {
+        lines.push("const data = await response.json()");
+      } else {
+        lines.push("const data = await response.text()");
+      }
+      if (op.target) {
+        const stateVar = analysis.stateMap.get(targetKey(op.target) + ":content");
+        if (op.format === "json") {
+          lines.push(`${stateVar ?? "content"}.value = JSON.stringify(data)`);
+        } else {
+          lines.push(`${stateVar ?? "content"}.value = data`);
+        }
+      }
+      return lines;
+    }
+    case "wait":
+      return [`await new Promise(resolve => setTimeout(resolve, ${op.durationMs}))`];
+    case "focus": {
+      const refName = analysis.refMap.get(targetKey(op.target));
+      return [`${refName ?? "ref"}.value?.focus()`];
+    }
+    case "blur": {
+      const refName = analysis.refMap.get(targetKey(op.target));
+      return [`${refName ?? "ref"}.value?.blur()`];
+    }
+    case "triggerEvent": {
+      const refName = analysis.refMap.get(targetKey(op.target));
+      return [
+        `${refName ?? "ref"}.value?.dispatchEvent(new CustomEvent('${escapeString2(op.eventName)}', { bubbles: true }))`
+      ];
+    }
+    case "log":
+      return [`console.log(${op.values.map((v) => `'${escapeString2(v)}'`).join(", ")})`];
+    default:
+      return [`// Unsupported: ${op.op}`];
+  }
+}
+function generateTemplate(spec, analysis, handlerName) {
+  const lines = [];
+  const elements = collectTargetElements(spec);
+  const eventDirective = `@${spec.trigger.event}`;
+  const triggerTag = inferTriggerTag(spec);
+  const triggerAttrs = [`${eventDirective}="${handlerName}"`];
+  const selfClassStates = getSelfClassStates(spec, analysis.stateMap);
+  if (selfClassStates.length > 0) {
+    const classObj = selfClassStates.map((s) => `${s.className}: ${s.stateName}`).join(", ");
+    triggerAttrs.push(`:class="{ ${classObj} }"`);
+  }
+  const triggerContent = inferTriggerContent(spec);
+  lines.push(`<${triggerTag} ${triggerAttrs.join(" ")}>${triggerContent}</${triggerTag}>`);
+  for (const el of elements) {
+    const elLines = renderVueElement(el, analysis);
+    for (const l of elLines) {
+      lines.push(l);
+    }
+  }
+  return lines;
+}
+function collectTargetElements(spec) {
+  const seen = /* @__PURE__ */ new Set();
+  const elements = [];
+  for (const op of spec.operations) {
+    if (!("target" in op)) continue;
+    const target = op.target;
+    if (target.kind !== "selector") continue;
+    if (spec.triggerTarget.kind === "selector" && spec.triggerTarget.value === target.value)
+      continue;
+    const sel = target.value;
+    if (seen.has(sel)) {
+      const existing = elements.find((e) => e.selector === sel);
+      if (existing) existing.ops.push(op);
+      continue;
+    }
+    seen.add(sel);
+    const tag = selectorToTag(sel);
+    const id = sel.startsWith("#") ? sel.slice(1) : void 0;
+    const cls = sel.startsWith(".") ? sel.slice(1) : void 0;
+    elements.push({ selector: sel, tag, id, className: cls, ops: [op] });
+  }
+  return elements;
+}
+function renderVueElement(el, analysis) {
+  const lines = [];
+  const attrs = [];
+  if (el.id) attrs.push(`id="${el.id}"`);
+  const classStates = [];
+  for (const op of el.ops) {
+    if (op.op === "toggleClass" || op.op === "addClass" || op.op === "removeClass") {
+      const stateVar = analysis.stateMap.get(el.selector + ":class:" + op.className);
+      if (stateVar) {
+        classStates.push({ stateName: stateVar, className: op.className });
+      }
+    }
+  }
+  if (classStates.length > 0) {
+    const classObj = classStates.map((s) => `${s.className}: ${s.stateName}`).join(", ");
+    if (el.className) {
+      attrs.push(`class="${el.className}"`);
+      attrs.push(`:class="{ ${classObj} }"`);
+    } else {
+      attrs.push(`:class="{ ${classObj} }"`);
+    }
+  } else if (el.className) {
+    attrs.push(`class="${el.className}"`);
+  }
+  const refName = analysis.refMap.get(el.selector);
+  if (refName) {
+    attrs.push(`ref="${refName}"`);
+  }
+  const visState = analysis.stateMap.get(el.selector + ":visible");
+  const contentState = analysis.stateMap.get(el.selector + ":content");
+  const numState = analysis.stateMap.get(el.selector + ":num");
+  const attrStr = attrs.length > 0 ? " " + attrs.join(" ") : "";
+  const content = contentState ? `{{ ${contentState} }}` : numState ? `{{ ${numState} }}` : el.id ?? "";
+  if (visState) {
+    lines.push(`<${el.tag}${attrStr} v-if="${visState}">${content}</${el.tag}>`);
+  } else {
+    lines.push(`<${el.tag}${attrStr}>${content}</${el.tag}>`);
+  }
+  return lines;
+}
+
+// src/renderers/svelte.ts
+var SvelteRenderer = class {
+  constructor() {
+    this.framework = "svelte";
+  }
+  render(spec, options = {}) {
+    const componentName = options.componentName ?? generateComponentName(spec);
+    const ts = options.typescript !== false;
+    const analysis = analyzeOperations3(spec, ts);
+    const scriptLines = [];
+    for (const state of analysis.states) {
+      scriptLines.push(`let ${state.name} = $state(${state.initialValue})`);
+    }
+    for (const r of analysis.refs) {
+      if (ts) {
+        scriptLines.push(`let ${r.name}: HTMLElement`);
+      } else {
+        scriptLines.push(`let ${r.name}`);
+      }
+    }
+    if (analysis.states.length > 0 || analysis.refs.length > 0) {
+      scriptLines.push("");
+    }
+    const handlerName = `handle${capitalize(spec.trigger.event)}`;
+    const asyncPrefix = spec.async ? "async " : "";
+    scriptLines.push(`${asyncPrefix}function ${handlerName}() {`);
+    for (const op of spec.operations) {
+      const opLines = generateOperationCode3(op, analysis);
+      for (const l of opLines) {
+        scriptLines.push(`  ${l}`);
+      }
+    }
+    scriptLines.push("}");
+    const templateLines = generateTemplate2(spec, analysis, handlerName);
+    const langAttr = ts ? ' lang="ts"' : "";
+    const lines = [];
+    lines.push(`<script${langAttr}>`);
+    for (const l of scriptLines) {
+      lines.push(`  ${l}`);
+    }
+    lines.push("</script>");
+    lines.push("");
+    for (const l of templateLines) {
+      lines.push(l);
+    }
+    lines.push("");
+    const hooks = [];
+    if (analysis.states.length > 0) hooks.push("$state");
+    return {
+      name: componentName,
+      code: lines.join("\n"),
+      framework: "svelte",
+      operations: spec.operations,
+      hooks
+    };
+  }
+};
+function analyzeOperations3(spec, ts) {
+  const states = [];
+  const refs = [];
+  const stateMap = /* @__PURE__ */ new Map();
+  const refMap = /* @__PURE__ */ new Map();
+  const seenStates = /* @__PURE__ */ new Set();
+  for (const op of spec.operations) {
+    switch (op.op) {
+      case "toggleClass": {
+        const key = stateKey("has", op.className, op.target);
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          const name = `has${capitalize(op.className)}`;
+          states.push({ name, initialValue: "false", targetKey: targetKey(op.target) });
+          stateMap.set(targetKey(op.target) + ":class:" + op.className, name);
+        }
+        break;
+      }
+      case "addClass":
+      case "removeClass": {
+        const key = stateKey("has", op.className, op.target);
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          const name = `has${capitalize(op.className)}`;
+          const initial = op.op === "removeClass" ? "true" : "false";
+          states.push({ name, initialValue: initial, targetKey: targetKey(op.target) });
+          stateMap.set(targetKey(op.target) + ":class:" + op.className, name);
+        }
+        break;
+      }
+      case "show":
+      case "hide": {
+        const tk = targetKey(op.target);
+        const key = "visible:" + tk;
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          const name = targetStateName(op.target, "Visible");
+          states.push({
+            name,
+            initialValue: op.op === "hide" ? "true" : "false",
+            targetKey: tk
+          });
+          stateMap.set(tk + ":visible", name);
+        }
+        break;
+      }
+      case "setContent":
+      case "appendContent": {
+        const tk = targetKey(op.target);
+        const key = "content:" + tk;
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          const name = targetStateName(op.target, "Content");
+          states.push({ name, initialValue: "''", targetKey: tk });
+          stateMap.set(tk + ":content", name);
+        }
+        break;
+      }
+      case "setVariable": {
+        const key = "var:" + op.name;
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          const name = cleanVarName(op.name);
+          const typeAnn = inferType(op.value);
+          states.push({
+            name,
+            initialValue: inferInitial(op.value, typeAnn),
+            targetKey: "var:" + op.name
+          });
+          stateMap.set("var:" + op.name, name);
+        }
+        break;
+      }
+      case "increment":
+      case "decrement": {
+        const tk = targetKey(op.target);
+        const key = "num:" + tk;
+        if (!seenStates.has(key)) {
+          seenStates.add(key);
+          const name = targetStateName(op.target, "Count");
+          states.push({ name, initialValue: "0", targetKey: tk });
+          stateMap.set(tk + ":num", name);
+        }
+        break;
+      }
+      case "fetch": {
+        if (op.target) {
+          const tk = targetKey(op.target);
+          const key = "content:" + tk;
+          if (!seenStates.has(key)) {
+            seenStates.add(key);
+            const name = targetStateName(op.target, "Content");
+            states.push({ name, initialValue: "''", targetKey: tk });
+            stateMap.set(tk + ":content", name);
+          }
+        }
+        break;
+      }
+      case "focus":
+      case "blur": {
+        const tk = targetKey(op.target);
+        if (!refMap.has(tk)) {
+          const name = targetRefName(op.target);
+          refs.push({ name, targetKey: tk });
+          refMap.set(tk, name);
+        }
+        break;
+      }
+      case "triggerEvent": {
+        const tk = targetKey(op.target);
+        if (!refMap.has(tk)) {
+          const name = targetRefName(op.target);
+          refs.push({ name, targetKey: tk });
+          refMap.set(tk, name);
+        }
+        break;
+      }
+    }
+  }
+  return { states, refs, stateMap, refMap, ts };
+}
+function generateOperationCode3(op, analysis) {
+  switch (op.op) {
+    case "toggleClass": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":class:" + op.className);
+      return [`${stateVar ?? "state"} = !${stateVar ?? "state"}`];
+    }
+    case "addClass": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":class:" + op.className);
+      return [`${stateVar ?? "state"} = true`];
+    }
+    case "removeClass": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":class:" + op.className);
+      return [`${stateVar ?? "state"} = false`];
+    }
+    case "show": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":visible");
+      return [`${stateVar ?? "visible"} = true`];
+    }
+    case "hide": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":visible");
+      return [`${stateVar ?? "visible"} = false`];
+    }
+    case "setContent": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":content");
+      return [`${stateVar ?? "content"} = '${escapeString2(op.content)}'`];
+    }
+    case "appendContent": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":content");
+      return [`${stateVar ?? "content"} += '${escapeString2(op.content)}'`];
+    }
+    case "setVariable": {
+      const stateVar = analysis.stateMap.get("var:" + op.name);
+      const val = isNumeric(op.value) ? op.value : `'${escapeString2(op.value)}'`;
+      return [`${stateVar ?? "value"} = ${val}`];
+    }
+    case "increment": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":num");
+      return [`${stateVar ?? "count"} += ${op.amount}`];
+    }
+    case "decrement": {
+      const stateVar = analysis.stateMap.get(targetKey(op.target) + ":num");
+      return [`${stateVar ?? "count"} -= ${op.amount}`];
+    }
+    case "navigate":
+      return [`window.location.href = '${escapeString2(op.url)}'`];
+    case "historyBack":
+      return ["window.history.back()"];
+    case "historyForward":
+      return ["window.history.forward()"];
+    case "fetch": {
+      const lines = [];
+      lines.push(`const response = await fetch('${escapeString2(op.url)}')`);
+      if (op.format === "json") {
+        lines.push("const data = await response.json()");
+      } else {
+        lines.push("const data = await response.text()");
+      }
+      if (op.target) {
+        const stateVar = analysis.stateMap.get(targetKey(op.target) + ":content");
+        if (op.format === "json") {
+          lines.push(`${stateVar ?? "content"} = JSON.stringify(data)`);
+        } else {
+          lines.push(`${stateVar ?? "content"} = data`);
+        }
+      }
+      return lines;
+    }
+    case "wait":
+      return [`await new Promise(resolve => setTimeout(resolve, ${op.durationMs}))`];
+    case "focus": {
+      const refName = analysis.refMap.get(targetKey(op.target));
+      return [`${refName ?? "ref"}?.focus()`];
+    }
+    case "blur": {
+      const refName = analysis.refMap.get(targetKey(op.target));
+      return [`${refName ?? "ref"}?.blur()`];
+    }
+    case "triggerEvent": {
+      const refName = analysis.refMap.get(targetKey(op.target));
+      return [
+        `${refName ?? "ref"}?.dispatchEvent(new CustomEvent('${escapeString2(op.eventName)}', { bubbles: true }))`
+      ];
+    }
+    case "log":
+      return [`console.log(${op.values.map((v) => `'${escapeString2(v)}'`).join(", ")})`];
+    default:
+      return [`// Unsupported: ${op.op}`];
+  }
+}
+function generateTemplate2(spec, analysis, handlerName) {
+  const lines = [];
+  const elements = collectTargetElements2(spec);
+  const eventAttr = `on${spec.trigger.event}`;
+  const triggerTag = inferTriggerTag(spec);
+  const triggerAttrs = [`${eventAttr}={${handlerName}}`];
+  const selfClassStates = getSelfClassStates(spec, analysis.stateMap);
+  for (const s of selfClassStates) {
+    triggerAttrs.push(`class:${s.className}={${s.stateName}}`);
+  }
+  const triggerContent = inferTriggerContent(spec);
+  lines.push(`<${triggerTag} ${triggerAttrs.join(" ")}>${triggerContent}</${triggerTag}>`);
+  for (const el of elements) {
+    const elLines = renderSvelteElement(el, analysis);
+    for (const l of elLines) {
+      lines.push(l);
+    }
+  }
+  return lines;
+}
+function collectTargetElements2(spec) {
+  const seen = /* @__PURE__ */ new Set();
+  const elements = [];
+  for (const op of spec.operations) {
+    if (!("target" in op)) continue;
+    const target = op.target;
+    if (target.kind !== "selector") continue;
+    if (spec.triggerTarget.kind === "selector" && spec.triggerTarget.value === target.value)
+      continue;
+    const sel = target.value;
+    if (seen.has(sel)) {
+      const existing = elements.find((e) => e.selector === sel);
+      if (existing) existing.ops.push(op);
+      continue;
+    }
+    seen.add(sel);
+    const tag = selectorToTag(sel);
+    const id = sel.startsWith("#") ? sel.slice(1) : void 0;
+    const cls = sel.startsWith(".") ? sel.slice(1) : void 0;
+    elements.push({ selector: sel, tag, id, className: cls, ops: [op] });
+  }
+  return elements;
+}
+function renderSvelteElement(el, analysis) {
+  const lines = [];
+  const attrs = [];
+  if (el.id) attrs.push(`id="${el.id}"`);
+  const classStates = [];
+  for (const op of el.ops) {
+    if (op.op === "toggleClass" || op.op === "addClass" || op.op === "removeClass") {
+      const stateVar = analysis.stateMap.get(el.selector + ":class:" + op.className);
+      if (stateVar) {
+        classStates.push({ stateName: stateVar, className: op.className });
+      }
+    }
+  }
+  if (el.className) {
+    attrs.push(`class="${el.className}"`);
+  }
+  for (const s of classStates) {
+    attrs.push(`class:${s.className}={${s.stateName}}`);
+  }
+  const refName = analysis.refMap.get(el.selector);
+  if (refName) {
+    attrs.push(`bind:this={${refName}}`);
+  }
+  const visState = analysis.stateMap.get(el.selector + ":visible");
+  const contentState = analysis.stateMap.get(el.selector + ":content");
+  const numState = analysis.stateMap.get(el.selector + ":num");
+  const attrStr = attrs.length > 0 ? " " + attrs.join(" ") : "";
+  const content = contentState ? `{${contentState}}` : numState ? `{${numState}}` : el.id ?? "";
+  const elementLine = `<${el.tag}${attrStr}>${content}</${el.tag}>`;
+  if (visState) {
+    lines.push(`{#if ${visState}}`);
+    lines.push(`  ${elementLine}`);
+    lines.push("{/if}");
+  } else {
+    lines.push(elementLine);
+  }
+  return lines;
+}
+
+// src/input/normalize.ts
+var _semantic = null;
+function initNormalizer(semantic) {
+  _semantic = semantic;
+}
+function normalize(request) {
+  if (!_semantic) {
+    throw new Error("Normalizer not initialized. Call initNormalizer() first.");
+  }
+  if (request.semantic) {
+    return normalizeJSON(request.semantic);
+  }
+  const input = request.code ?? request.explicit;
+  if (!input) {
+    return {
+      node: null,
+      confidence: 0,
+      format: "natural",
+      diagnostics: [
+        {
+          severity: "error",
+          code: "NO_INPUT",
+          message: "No input provided. Supply one of: code, explicit, or semantic."
+        }
+      ]
+    };
+  }
+  const format = request.explicit ? "explicit" : detectFormat(input);
+  switch (format) {
+    case "explicit":
+      return normalizeExplicit(input);
+    case "json":
+      return normalizeJSON(JSON.parse(input.trim()));
+    case "natural":
+      return normalizeNatural(input, request.language ?? "en");
+  }
+}
+function normalizeNatural(code, language) {
+  const diagnostics = [];
+  try {
+    const result = _semantic.parseSemantic(code, language);
+    if (result.error) {
+      diagnostics.push({
+        severity: "error",
+        code: "PARSE_ERROR",
+        message: result.error
+      });
+    }
+    if (!result.node) {
+      diagnostics.push({
+        severity: "error",
+        code: "PARSE_FAILED",
+        message: `Failed to parse "${code}" as ${language} hyperscript.`,
+        suggestion: "Check syntax or try explicit syntax: [command role:value ...]"
+      });
+      return { node: null, confidence: result.confidence, format: "natural", diagnostics };
+    }
+    return {
+      node: result.node,
+      confidence: result.confidence,
+      format: "natural",
+      diagnostics
+    };
+  } catch (error) {
+    diagnostics.push({
+      severity: "error",
+      code: "PARSE_EXCEPTION",
+      message: error instanceof Error ? error.message : String(error)
+    });
+    return { node: null, confidence: 0, format: "natural", diagnostics };
+  }
+}
+function normalizeExplicit(input) {
+  const diagnostics = [];
+  try {
+    const node = _semantic.parseExplicit(input);
+    return {
+      node,
+      confidence: 1,
+      format: "explicit",
+      diagnostics
+    };
+  } catch (error) {
+    const message = error instanceof Error ? error.message : String(error);
+    const hasRoleGuidance = message.includes("Valid roles") || message.includes("Missing required role");
+    diagnostics.push({
+      severity: "error",
+      code: "EXPLICIT_PARSE_ERROR",
+      message,
+      suggestion: hasRoleGuidance ? void 0 : "Use format: [command role:value ...] e.g. [toggle patient:.active]. Use get_command_docs(command) to see valid roles."
+    });
+    return { node: null, confidence: 0, format: "explicit", diagnostics };
+  }
+}
+function normalizeJSON(input) {
+  const validationErrors = validateSemanticJSON(input);
+  if (validationErrors.some((d) => d.severity === "error")) {
+    return {
+      node: null,
+      confidence: 0,
+      format: "json",
+      diagnostics: validationErrors
+    };
+  }
+  const node = jsonToSemanticNode(input);
+  return {
+    node,
+    confidence: 1,
+    format: "json",
+    diagnostics: validationErrors
+    // May contain warnings
+  };
+}
+
+// src/validation/gates.ts
+var _validators = null;
+function initValidation(validators) {
+  _validators = validators;
+}
+function runValidationGates(node, confidence, confidenceThreshold) {
+  const diagnostics = [];
+  let adjustedConfidence = confidence;
+  if (!node) {
+    diagnostics.push({
+      severity: "error",
+      code: "PARSE_FAILED",
+      message: "No semantic node produced from input."
+    });
+    return { pass: false, diagnostics, adjustedConfidence: 0 };
+  }
+  if (confidence < confidenceThreshold) {
+    diagnostics.push({
+      severity: "error",
+      code: "LOW_CONFIDENCE",
+      message: `Parse confidence ${confidence.toFixed(2)} is below threshold ${confidenceThreshold.toFixed(2)}.`,
+      suggestion: "Try explicit syntax [command role:value ...] for unambiguous input."
+    });
+    return { pass: false, diagnostics, adjustedConfidence: confidence };
+  }
+  if (_validators) {
+    const semanticResult = nodeToParseResult(node);
+    if (semanticResult) {
+      const validation = _validators.validateSemanticResult(semanticResult);
+      for (const err of validation.errors) {
+        diagnostics.push({
+          severity: "error",
+          code: err.code,
+          message: err.message
+        });
+      }
+      for (const warn of validation.warnings) {
+        diagnostics.push({
+          severity: "warning",
+          code: warn.code,
+          message: warn.message
+        });
+      }
+      for (const suggestion of validation.suggestions) {
+        diagnostics.push({
+          severity: "info",
+          code: "SUGGESTION",
+          message: suggestion
+        });
+      }
+      adjustedConfidence = Math.max(0, Math.min(1, confidence + validation.confidenceAdjustment));
+      if (!validation.valid) {
+        return { pass: false, diagnostics, adjustedConfidence };
+      }
+    }
+  }
+  return { pass: true, diagnostics, adjustedConfidence };
+}
+function nodeToParseResult(node) {
+  const n = node;
+  if (!n.action) return null;
+  const action = n.action === "on" ? null : n.action;
+  if (!action) return null;
+  const args = [];
+  if (n.roles && typeof n.roles.entries === "function") {
+    for (const [role, value] of n.roles.entries()) {
+      args.push({ role, ...value });
+    }
+  }
+  return {
+    action,
+    arguments: args,
+    confidence: 1
+  };
+}
+
+// src/compile/bridge.ts
+var _bridge = null;
+var _compiler = null;
+function initBridge(bridge, compiler) {
+  _bridge = bridge;
+  _compiler = compiler;
+}
+function compileSemanticNode(node, options = {}) {
+  if (!_bridge || !_compiler) {
+    throw new Error("Bridge not initialized. Call initBridge() first.");
+  }
+  const errors = [];
+  const warnings = [];
+  let semanticAST;
+  try {
+    const builder = new _bridge.ASTBuilder();
+    semanticAST = builder.build(node);
+    warnings.push(...builder.warnings);
+  } catch (error) {
+    errors.push(`AST build failed: ${error instanceof Error ? error.message : String(error)}`);
+    return { success: false, helpers: [], warnings, errors };
+  }
+  let interchangeAST;
+  try {
+    interchangeAST = _bridge.fromSemanticAST(semanticAST);
+  } catch (error) {
+    errors.push(
+      `Interchange conversion failed: ${error instanceof Error ? error.message : String(error)}`
+    );
+    return { success: false, helpers: [], warnings, errors };
+  }
+  try {
+    const result = _compiler.compileAST(interchangeAST, {
+      language: options.language ?? "en",
+      optimizationLevel: options.optimization ?? 2,
+      codegen: {
+        mode: options.target ?? "esm",
+        minify: options.minify ?? false
+      }
+    });
+    if (!result.success) {
+      return {
+        success: false,
+        helpers: [],
+        warnings: [...warnings, ...result.warnings],
+        errors: [...errors, ...result.errors ?? ["Compilation failed"]]
+      };
+    }
+    return {
+      success: true,
+      code: result.code,
+      helpers: result.metadata.runtimeHelpers,
+      warnings: [...warnings, ...result.warnings],
+      errors
+    };
+  } catch (error) {
+    errors.push(
+      `AOT compilation failed: ${error instanceof Error ? error.message : String(error)}`
+    );
+    return { success: false, helpers: [], warnings, errors };
+  }
+}
+
+// src/service.ts
+var CompilationService = class _CompilationService {
+  constructor(options = {}) {
+    this.translateFn = null;
+    this.confidenceThreshold = options.confidenceThreshold ?? 0.7;
+    this.cache = new SemanticCache(options.cacheSize ?? 500);
+    this.testRenderers = new Map(
+      Object.entries(options.testRenderers ?? { playwright: new PlaywrightRenderer() })
+    );
+    this.componentRenderers = new Map(
+      Object.entries(
+        options.componentRenderers ?? {
+          react: new ReactRenderer(),
+          vue: new VueRenderer(),
+          svelte: new SvelteRenderer()
+        }
+      )
+    );
+  }
+  /**
+   * Register a test renderer for a given framework.
+   */
+  registerTestRenderer(framework, renderer) {
+    this.testRenderers.set(framework, renderer);
+  }
+  /**
+   * Register a component renderer for a given framework.
+   */
+  registerComponentRenderer(framework, renderer) {
+    this.componentRenderers.set(framework, renderer);
+  }
+  /**
+   * Create a CompilationService by dynamically importing dependencies.
+   *
+   * This async factory resolves @lokascript/semantic and @hyperfixi/aot-compiler
+   * at runtime, following the same pattern as createMultilingualCompiler().
+   */
+  static async create(options = {}) {
+    const service = new _CompilationService(options);
+    const semantic = await import("@lokascript/semantic");
+    initNormalizer({
+      parseSemantic: semantic.parseSemantic,
+      parseExplicit: semantic.parseExplicit,
+      isExplicitSyntax: semantic.isExplicitSyntax
+    });
+    initValidation({
+      validateSemanticResult: semantic.validateSemanticResult
+    });
+    const aot = await import("./dist-ICUX26U7.js");
+    const compiler = aot.createCompiler();
+    initBridge(
+      {
+        ASTBuilder: semantic.ASTBuilder,
+        fromSemanticAST: semantic.fromSemanticAST
+      },
+      compiler
+    );
+    service.translateFn = semantic.translate;
+    return service;
+  }
+  // ===========================================================================
+  // Public API
+  // ===========================================================================
+  /**
+   * Compile hyperscript to JavaScript.
+   *
+   * Accepts any of three input formats:
+   * - `code` + `language`: Natural language hyperscript
+   * - `explicit`: Bracket syntax [command role:value ...]
+   * - `semantic`: LLM JSON { action, roles, trigger }
+   *
+   * Returns compiled JS, semantic representation, and diagnostics.
+   */
+  compile(request) {
+    const diagnostics = [];
+    const normalized = normalize(request);
+    diagnostics.push(...normalized.diagnostics);
+    if (!normalized.node) {
+      return { ok: false, diagnostics };
+    }
+    const threshold = request.confidence ?? this.confidenceThreshold;
+    const gateResult = runValidationGates(normalized.node, normalized.confidence, threshold);
+    diagnostics.push(...gateResult.diagnostics);
+    if (!gateResult.pass) {
+      return {
+        ok: false,
+        confidence: gateResult.adjustedConfidence,
+        diagnostics
+      };
+    }
+    const cacheKey = generateCacheKey(normalized.node, {
+      optimization: request.optimization,
+      target: request.target,
+      minify: request.minify
+    });
+    const cached = this.cache.get(cacheKey);
+    if (cached) {
+      return {
+        ...cached,
+        confidence: gateResult.adjustedConfidence,
+        diagnostics: [...diagnostics, ...cached.diagnostics.filter((d) => d.severity !== "error")]
+      };
+    }
+    const result = compileSemanticNode(normalized.node, {
+      language: request.language,
+      optimization: request.optimization,
+      target: request.target,
+      minify: request.minify
+    });
+    for (const warning of result.warnings) {
+      diagnostics.push({ severity: "warning", code: "COMPILE_WARNING", message: warning });
+    }
+    for (const error of result.errors) {
+      diagnostics.push({ severity: "error", code: "COMPILE_ERROR", message: error });
+    }
+    if (!result.success) {
+      return { ok: false, diagnostics };
+    }
+    const semanticJSON = nodeToSemanticJSON(normalized.node);
+    const response = {
+      ok: true,
+      js: result.code,
+      helpers: result.helpers,
+      size: result.code ? new TextEncoder().encode(result.code).length : 0,
+      semantic: semanticJSON,
+      confidence: gateResult.adjustedConfidence,
+      diagnostics
+    };
+    this.cache.set(cacheKey, response);
+    return response;
+  }
+  /**
+   * Validate input without compiling.
+   * Returns semantic representation and diagnostics.
+   */
+  validate(request) {
+    const diagnostics = [];
+    const normalized = normalize(request);
+    diagnostics.push(...normalized.diagnostics);
+    if (!normalized.node) {
+      return { ok: false, diagnostics };
+    }
+    const threshold = request.confidence ?? this.confidenceThreshold;
+    const gateResult = runValidationGates(normalized.node, normalized.confidence, threshold);
+    diagnostics.push(...gateResult.diagnostics);
+    const semanticJSON = gateResult.pass ? nodeToSemanticJSON(normalized.node) : void 0;
+    return {
+      ok: gateResult.pass,
+      semantic: semanticJSON,
+      confidence: gateResult.adjustedConfidence,
+      diagnostics
+    };
+  }
+  /**
+   * Translate hyperscript between languages.
+   */
+  translate(request) {
+    if (!this.translateFn) {
+      return {
+        ok: false,
+        diagnostics: [
+          {
+            severity: "error",
+            code: "NOT_INITIALIZED",
+            message: "Translation not available."
+          }
+        ]
+      };
+    }
+    try {
+      const result = this.translateFn(request.code, request.from, request.to);
+      return {
+        ok: true,
+        code: result,
+        diagnostics: []
+      };
+    } catch (error) {
+      return {
+        ok: false,
+        diagnostics: [
+          {
+            severity: "error",
+            code: "TRANSLATE_ERROR",
+            message: error instanceof Error ? error.message : String(error)
+          }
+        ]
+      };
+    }
+  }
+  /**
+   * Generate behavior-level tests from hyperscript.
+   *
+   * Parses the input, extracts abstract operations (what the behavior does),
+   * and renders them as test code in the requested framework.
+   */
+  generateTests(request) {
+    const diagnostics = [];
+    const normalized = normalize({
+      code: request.code,
+      explicit: request.explicit,
+      semantic: request.semantic,
+      language: request.language,
+      confidence: request.confidence
+    });
+    diagnostics.push(...normalized.diagnostics);
+    if (!normalized.node) {
+      return { ok: false, tests: [], operations: [], diagnostics };
+    }
+    const threshold = request.confidence ?? this.confidenceThreshold;
+    const gateResult = runValidationGates(normalized.node, normalized.confidence, threshold);
+    diagnostics.push(...gateResult.diagnostics);
+    if (!gateResult.pass) {
+      return { ok: false, tests: [], operations: [], diagnostics };
+    }
+    const spec = extractOperations(normalized.node);
+    if (spec.operations.length === 0) {
+      diagnostics.push({
+        severity: "warning",
+        code: "NO_OPERATIONS",
+        message: "No testable operations extracted from the input."
+      });
+      return { ok: false, tests: [], operations: [], diagnostics };
+    }
+    if (!spec.source && request.code) {
+      spec.source = request.code;
+    }
+    const frameworkName = request.framework ?? "playwright";
+    const renderer = this.testRenderers.get(frameworkName);
+    if (!renderer) {
+      diagnostics.push({
+        severity: "error",
+        code: "UNKNOWN_FRAMEWORK",
+        message: `No test renderer registered for framework '${frameworkName}'. Available: ${[...this.testRenderers.keys()].join(", ")}`
+      });
+      return { ok: false, tests: [], operations: [], diagnostics };
+    }
+    let compiledJs;
+    if (request.executionMode === "compiled") {
+      const compileResult = this.compile({
+        code: request.code,
+        explicit: request.explicit,
+        semantic: request.semantic,
+        language: request.language
+      });
+      if (compileResult.ok && compileResult.js) {
+        compiledJs = compileResult.js;
+      }
+    }
+    const generated = renderer.render(spec, {
+      testName: request.testName,
+      executionMode: request.executionMode,
+      bundlePath: request.bundlePath,
+      hyperscript: request.code ?? request.explicit,
+      compiledJs
+    });
+    const semanticJSON = nodeToSemanticJSON(normalized.node);
+    return {
+      ok: true,
+      tests: [
+        {
+          name: generated.name,
+          code: generated.code,
+          html: generated.html,
+          framework: generated.framework
+        }
+      ],
+      operations: spec.operations,
+      semantic: semanticJSON,
+      diagnostics
+    };
+  }
+  /**
+   * Generate a framework component from hyperscript.
+   *
+   * Parses the input, extracts abstract operations, and renders
+   * them as a framework-specific component (React, Vue, or Svelte).
+   */
+  generateComponent(request) {
+    const diagnostics = [];
+    const normalized = normalize({
+      code: request.code,
+      explicit: request.explicit,
+      semantic: request.semantic,
+      language: request.language,
+      confidence: request.confidence
+    });
+    diagnostics.push(...normalized.diagnostics);
+    if (!normalized.node) {
+      return { ok: false, operations: [], diagnostics };
+    }
+    const threshold = request.confidence ?? this.confidenceThreshold;
+    const gateResult = runValidationGates(normalized.node, normalized.confidence, threshold);
+    diagnostics.push(...gateResult.diagnostics);
+    if (!gateResult.pass) {
+      return { ok: false, operations: [], diagnostics };
+    }
+    const spec = extractOperations(normalized.node);
+    if (spec.operations.length === 0) {
+      diagnostics.push({
+        severity: "warning",
+        code: "NO_OPERATIONS",
+        message: "No operations extracted from the input."
+      });
+      return { ok: false, operations: [], diagnostics };
+    }
+    if (!spec.source && request.code) {
+      spec.source = request.code;
+    }
+    const frameworkName = request.framework ?? "react";
+    const renderer = this.componentRenderers.get(frameworkName);
+    if (!renderer) {
+      diagnostics.push({
+        severity: "error",
+        code: "UNKNOWN_FRAMEWORK",
+        message: `No component renderer registered for framework '${frameworkName}'. Available: ${[...this.componentRenderers.keys()].join(", ")}`
+      });
+      return { ok: false, operations: [], diagnostics };
+    }
+    const generated = renderer.render(spec, {
+      componentName: request.componentName,
+      typescript: request.typescript
+    });
+    const semanticJSON = nodeToSemanticJSON(normalized.node);
+    return {
+      ok: true,
+      component: {
+        name: generated.name,
+        code: generated.code,
+        hooks: generated.hooks,
+        framework: generated.framework
+      },
+      operations: spec.operations,
+      semantic: semanticJSON,
+      diagnostics
+    };
+  }
+  /**
+   * Compare two hyperscript inputs at the behavior level.
+   *
+   * Both sides are independently normalized and validated, then compared
+   * as abstract operations. Same behavior in different languages → identical.
+   */
+  diff(request) {
+    const diagnostics = [];
+    const threshold = request.confidence ?? this.confidenceThreshold;
+    const normA = normalize({
+      code: request.a.code,
+      explicit: request.a.explicit,
+      semantic: request.a.semantic,
+      language: request.a.language,
+      confidence: request.confidence
+    });
+    diagnostics.push(...normA.diagnostics.map((d) => ({ ...d, message: `[a] ${d.message}` })));
+    const normB = normalize({
+      code: request.b.code,
+      explicit: request.b.explicit,
+      semantic: request.b.semantic,
+      language: request.b.language,
+      confidence: request.confidence
+    });
+    diagnostics.push(...normB.diagnostics.map((d) => ({ ...d, message: `[b] ${d.message}` })));
+    if (!normA.node || !normB.node) {
+      return {
+        ok: false,
+        identical: false,
+        trigger: null,
+        operations: [],
+        summary: "Parse failed",
+        diagnostics
+      };
+    }
+    const gateA = runValidationGates(normA.node, normA.confidence, threshold);
+    diagnostics.push(...gateA.diagnostics.map((d) => ({ ...d, message: `[a] ${d.message}` })));
+    const gateB = runValidationGates(normB.node, normB.confidence, threshold);
+    diagnostics.push(...gateB.diagnostics.map((d) => ({ ...d, message: `[b] ${d.message}` })));
+    if (!gateA.pass || !gateB.pass) {
+      return {
+        ok: false,
+        identical: false,
+        trigger: null,
+        operations: [],
+        summary: "Validation failed",
+        diagnostics
+      };
+    }
+    const specA = extractOperations(normA.node);
+    const specB = extractOperations(normB.node);
+    const result = diffBehaviors(specA, specB);
+    return {
+      ok: true,
+      identical: result.identical,
+      trigger: result.trigger,
+      operations: result.operations,
+      summary: result.summary,
+      diagnostics
+    };
+  }
+  /**
+   * Get cache statistics.
+   */
+  getCacheStats() {
+    const total = this.cache.hits + this.cache.misses;
+    return {
+      size: this.cache.size,
+      hits: this.cache.hits,
+      misses: this.cache.misses,
+      hitRate: total > 0 ? this.cache.hits / total : 0
+    };
+  }
+  /**
+   * Clear the compilation cache.
+   */
+  clearCache() {
+    this.cache.clear();
+  }
+};
+function extractSemanticValueString(v) {
+  if (!v || typeof v !== "object") return "";
+  const sv = v;
+  if (sv.type === "property-path") {
+    return `${extractSemanticValueString(sv.object)}.${sv.property ?? ""}`;
+  }
+  return String(sv.value ?? sv.raw ?? "");
+}
+function nodeToSemanticJSON(node) {
+  if (!node || typeof node !== "object") return void 0;
+  const n = node;
+  if (!n.action) return void 0;
+  const roles = {};
+  if (n.roles && typeof n.roles.entries === "function") {
+    for (const [role, value] of n.roles.entries()) {
+      if (role === "event") continue;
+      const v = value;
+      if (v && v.type) {
+        if (v.type === "property-path") {
+          roles[role] = {
+            type: "property-path",
+            value: extractSemanticValueString(v)
+          };
+        } else {
+          const valueType = v.type;
+          roles[role] = {
+            type: ["selector", "literal", "reference", "expression"].includes(valueType) ? valueType : "literal",
+            value: v.value ?? v.raw ?? ""
+          };
+        }
+      }
+    }
+  }
+  if (n.kind === "event-handler" || n.action === "on") {
+    const eventRole = n.roles && typeof n.roles.get === "function" ? n.roles.get("event") : void 0;
+    if (n.body && n.body.length > 0) {
+      const bodyJSON = nodeToSemanticJSON(n.body[0]);
+      if (bodyJSON) {
+        bodyJSON.trigger = {
+          event: eventRole?.value ?? "click",
+          modifiers: n.eventModifiers
+        };
+        return bodyJSON;
+      }
+    }
+    return {
+      action: n.action,
+      roles,
+      trigger: {
+        event: eventRole?.value ?? "click",
+        modifiers: n.eventModifiers
+      }
+    };
+  }
+  return { action: n.action, roles };
+}
+
+export {
+  diffBehaviors,
+  canonicalizeOp,
+  detectFormat,
+  validateSemanticJSON,
+  jsonToSemanticNode,
+  SemanticCache,
+  generateCacheKey,
+  extractOperations,
+  PlaywrightRenderer,
+  ReactRenderer,
+  VueRenderer,
+  SvelteRenderer,
+  CompilationService
+};
+//# sourceMappingURL=chunk-ODJIDVMN.js.map