@ohhwells/bridge 0.1.139-next.379 → 0.1.139-next.381

package/dist/index.cjs

@@ -5033,10 +5033,9 @@ function getLinkHref3(el) {
 }
 function collectEditableNodes(extraContent, root = document) {
   const isScoped = root !== document;
-  const editableEls = Array.from(
-    root.querySelectorAll('[data-ohw-editable]:not([data-ohw-editable="form"])')
-  );
-  if (isScoped && root instanceof HTMLElement && root.matches('[data-ohw-editable]:not([data-ohw-editable="form"])')) {
+  const EDITABLE_SELECTOR = '[data-ohw-editable]:not([data-ohw-editable="form"]):not([data-ai-icon])';
+  const editableEls = Array.from(root.querySelectorAll(EDITABLE_SELECTOR));
+  if (isScoped && root instanceof HTMLElement && root.matches(EDITABLE_SELECTOR)) {
     editableEls.unshift(root);
   }
   const nodes = editableEls.map((el) => {
@@ -6303,6 +6302,274 @@ function reapRemovedAiSections(state, store, removedIds, excludeIds = /* @__PURE
   return { state: nextState, store: nextStore, reapedIds, slotPrefixes, changed: true };
 }
 
+// src/lib/ai-pricing-tree.ts
+var PRICING_MIN_CARDS = 1;
+var PRICING_MAX_CARDS = 4;
+function isPricingCard(node) {
+  return typeof node === "object" && node !== null && node.type === "card" && node.slots?.preset === "pricing";
+}
+function isPricingCollection(node) {
+  return node.type === "collection" && Array.isArray(node.children) && node.children.length > 0 && isPricingCard(node.children[0]);
+}
+function findCollection(node) {
+  if (isPricingCollection(node)) return node;
+  for (const child of node.children ?? []) {
+    const found = findCollection(child);
+    if (found) return found;
+  }
+  return null;
+}
+function findPricingCollection(tree) {
+  for (const row of tree.rows ?? []) {
+    for (const block of row.blocks ?? []) {
+      const found = findCollection(block);
+      if (found) return found;
+    }
+  }
+  return null;
+}
+function pricingCardCount(tree) {
+  return findPricingCollection(tree)?.children?.length ?? 0;
+}
+function withPricingCollection(tree, mutate) {
+  const next = JSON.parse(JSON.stringify(tree));
+  const collection = findPricingCollection(next);
+  if (!collection || !collection.children) return null;
+  for (const card of collection.children) {
+    if (isPricingCard(card)) upgradeLegacyPricingSlots(card);
+  }
+  return mutate(collection) ? next : null;
+}
+function upgradeLegacyPricingSlots(card) {
+  const slots = card.slots = card.slots ?? {};
+  if (typeof slots.features === "string") {
+    const rows = pricingFeatureList(card);
+    if (rows.length > 0) slots.features = rows.slice(0, PRICING_FEATURES_MAX);
+  }
+  if (slots.featured === true) slots.featured = { enabled: true };
+  else if (slots.featured === false) delete slots.featured;
+}
+function addPricingTier(tree) {
+  return withPricingCollection(tree, (collection) => {
+    const children = collection.children;
+    if (children.length >= PRICING_MAX_CARDS) return false;
+    const clone = JSON.parse(JSON.stringify(children[children.length - 1]));
+    clone.slots = clone.slots ?? {};
+    delete clone.slots.featured;
+    clone.slots.heading = "New tier";
+    children.push(clone);
+    collection.slots = { ...collection.slots, itemsPerRow: children.length };
+    return true;
+  });
+}
+function removePricingTier(tree, index) {
+  return withPricingCollection(tree, (collection) => {
+    const children = collection.children;
+    if (children.length <= PRICING_MIN_CARDS) return false;
+    if (index < 0 || index >= children.length) return false;
+    children.splice(index, 1);
+    collection.slots = { ...collection.slots, itemsPerRow: children.length };
+    return true;
+  });
+}
+var PRICING_CARD_STYLES = [
+  { value: "outline", label: "Outline", treatment: null },
+  { value: "lift", label: "Lift", treatment: "lifted" },
+  { value: "invert", label: "Invert", treatment: "inverted" },
+  { value: "header", label: "Header", treatment: "accent-header" }
+];
+var DEFAULT_FEATURED_BADGE = "Most popular";
+function featuredOf(target) {
+  const raw = target?.slots?.featured;
+  if (raw === true) return { enabled: true, treatment: "outlined" };
+  return typeof raw === "object" && raw !== null ? raw : {};
+}
+function badgeOf(featured) {
+  return typeof featured.badge === "string" ? featured.badge.trim() : "";
+}
+function pricingCardStyle(tree, index) {
+  const featured = featuredOf(findPricingCollection(tree)?.children?.[index]);
+  if (featured.enabled !== true) return "outline";
+  return PRICING_CARD_STYLES.find((s) => s.treatment === featured.treatment)?.value ?? "outline";
+}
+function pricingCardFeaturedTag(tree, index) {
+  const featured = featuredOf(findPricingCollection(tree)?.children?.[index]);
+  return featured.enabled === true && badgeOf(featured).length > 0;
+}
+function composeFeatured(style, tagOn, badgeText) {
+  const treatment = PRICING_CARD_STYLES.find((s) => s.value === style)?.treatment ?? null;
+  if (tagOn) return { enabled: true, badge: badgeText || DEFAULT_FEATURED_BADGE, treatment: treatment ?? "outlined" };
+  if (treatment) return { enabled: true, treatment };
+  return badgeText.length > 0 ? { enabled: false, badge: badgeText } : { enabled: false };
+}
+function withPricingCard(tree, index, mutate) {
+  return withPricingCollection(tree, (collection) => {
+    const children = collection.children;
+    if (index < 0 || index >= children.length) return false;
+    const target = children[index];
+    target.slots = target.slots ?? {};
+    mutate(target);
+    return true;
+  });
+}
+function setPricingCardStyle(tree, index, style) {
+  if (!PRICING_CARD_STYLES.some((s) => s.value === style)) return null;
+  return withPricingCard(tree, index, (target) => {
+    const prev = featuredOf(target);
+    const tagOn = prev.enabled === true && badgeOf(prev).length > 0;
+    target.slots.featured = composeFeatured(style, tagOn, badgeOf(prev));
+  });
+}
+function setPricingCardFeaturedTag(tree, index, on) {
+  return withPricingCollection(tree, (collection) => {
+    const children = collection.children;
+    if (index < 0 || index >= children.length) return false;
+    if (on) {
+      children.forEach((card, i) => {
+        if (i === index) return;
+        const prev2 = featuredOf(card);
+        if (prev2.enabled !== true || badgeOf(prev2).length === 0) return;
+        card.slots = card.slots ?? {};
+        card.slots.featured = composeFeatured(pricingCardStyleOf(prev2), false, badgeOf(prev2));
+      });
+    }
+    const target = children[index];
+    target.slots = target.slots ?? {};
+    const prev = featuredOf(target);
+    target.slots.featured = composeFeatured(pricingCardStyleOf(prev), on, badgeOf(prev));
+    return true;
+  });
+}
+function pricingCardStyleOf(featured) {
+  if (featured.enabled !== true) return "outline";
+  return PRICING_CARD_STYLES.find((s) => s.treatment === featured.treatment)?.value ?? "outline";
+}
+function addPricingCardButton(tree, index, label) {
+  return withPricingCollection(tree, (collection) => {
+    const children = collection.children;
+    if (index < 0 || index >= children.length) return false;
+    const target = children[index];
+    const buttons = (target.children ?? []).filter((c) => c.type === "button");
+    if (buttons.length >= 2) return false;
+    const hasPrimary = buttons.some((b) => b.slots?.variant === "primary");
+    target.children = [
+      ...target.children ?? [],
+      { type: "button", span: 12, slots: { label, href: "#", variant: hasPrimary ? "secondary" : "primary" } }
+    ];
+    return true;
+  });
+}
+function removePricingCardButton(tree, index) {
+  return withPricingCollection(tree, (collection) => {
+    const children = collection.children;
+    if (index < 0 || index >= children.length) return false;
+    const target = children[index];
+    const buttons = (target.children ?? []).filter((c) => c.type === "button");
+    if (buttons.length === 0) return false;
+    const lastButton = buttons[buttons.length - 1];
+    target.children = (target.children ?? []).filter((c) => c !== lastButton);
+    return true;
+  });
+}
+var PRICING_FEATURES_MIN = 1;
+var PRICING_FEATURES_MAX = 10;
+var PRICING_FEATURE_ICONS = [
+  "check",
+  "check-circle",
+  "x",
+  "star",
+  "zap",
+  "shield",
+  "clock",
+  "users",
+  "infinity"
+];
+function pricingFeatureList(target) {
+  const raw = target.slots?.features;
+  if (Array.isArray(raw)) {
+    return raw.filter((item) => !!item && typeof item === "object" && typeof item.text === "string").map((item) => ({
+      text: item.text,
+      ...typeof item.icon === "string" ? { icon: item.icon } : {},
+      ...typeof item.iconColor === "string" ? { iconColor: item.iconColor } : {}
+    }));
+  }
+  if (typeof raw === "string") {
+    return raw.split(/\n|<br\s*\/?>/i).map((line) => line.replace(/<[^>]+>/g, "").replace(/^[-*•]\s*/, "").trim().slice(0, 120)).filter(Boolean).map((text) => ({ text }));
+  }
+  return [];
+}
+function pricingCardFeatureCount(tree, index) {
+  const target = findPricingCollection(tree)?.children?.[index];
+  return target ? pricingFeatureList(target).length : 0;
+}
+function addPricingCardFeature(tree, index, text) {
+  return withPricingCollection(tree, (collection) => {
+    const children = collection.children;
+    if (index < 0 || index >= children.length) return false;
+    const target = children[index];
+    const features = pricingFeatureList(target);
+    if (features.length >= PRICING_FEATURES_MAX) return false;
+    target.slots = target.slots ?? {};
+    target.slots.features = [...features, { text }];
+    return true;
+  });
+}
+function setPricingCardFeatureIcon(tree, index, featureIndex, icon) {
+  if (!PRICING_FEATURE_ICONS.includes(icon)) return null;
+  return withPricingCollection(tree, (collection) => {
+    const children = collection.children;
+    if (index < 0 || index >= children.length) return false;
+    const target = children[index];
+    const features = pricingFeatureList(target);
+    if (featureIndex < 0 || featureIndex >= features.length) return false;
+    target.slots = target.slots ?? {};
+    target.slots.features = features.map((row, i) => i === featureIndex ? { ...row, icon } : row);
+    return true;
+  });
+}
+function removePricingCardFeature(tree, index) {
+  return withPricingCollection(tree, (collection) => {
+    const children = collection.children;
+    if (index < 0 || index >= children.length) return false;
+    const target = children[index];
+    const features = pricingFeatureList(target);
+    if (features.length <= PRICING_FEATURES_MIN) return false;
+    target.slots = target.slots ?? {};
+    target.slots.features = features.slice(0, -1);
+    return true;
+  });
+}
+
+// src/lib/ai-icon-edit.ts
+var FEATURE_ICON_PATH = /\.c(\d+)\.features\.(\d+)\.icon$/;
+var NODE_SEGMENT = /^[rbc]\d+$/;
+function nodeAtPath(tree, segments) {
+  if (segments.length < 2 || segments.some((s) => !NODE_SEGMENT.test(s))) return null;
+  if (!segments[0].startsWith("r") || !segments[1].startsWith("b")) return null;
+  let node = tree.rows?.[Number(segments[0].slice(1))]?.blocks?.[Number(segments[1].slice(1))];
+  for (const segment of segments.slice(2)) {
+    if (!segment.startsWith("c")) return null;
+    node = node?.children?.[Number(segment.slice(1))];
+  }
+  return node ?? null;
+}
+function applyIconNameToTree(tree, path, icon) {
+  const feature = path.match(FEATURE_ICON_PATH);
+  if (feature) {
+    return setPricingCardFeatureIcon(tree, Number(feature[1]), Number(feature[2]), icon);
+  }
+  const segments = path.split(".");
+  const slot = segments.pop();
+  if (!slot || NODE_SEGMENT.test(slot)) return null;
+  const next = JSON.parse(JSON.stringify(tree));
+  const node = nodeAtPath(next, segments);
+  if (!node) return null;
+  const current = node.slots?.[slot];
+  if (typeof current !== "string" || !/^(lucide|simple):/.test(current)) return null;
+  node.slots = { ...node.slots, [slot]: `lucide:${icon}` };
+  return next;
+}
+
 // src/lib/ai-footer-tree.ts
 var FOOTER_COLUMN_SPANS = [12, 6, 4, 3];
 var FOOTER_COLUMN_BLOCKS = [
@@ -7688,17 +7955,18 @@ function MediaBox({
   const url = refValue ? ctx.resolveMedia(refValue) : null;
   const isIcon = /^(lucide|simple):/.test(refValue);
   const aspectRatio = aspect && /^\d+:\d+$/.test(aspect) ? aspect.replace(":", " / ") : void 0;
-  const editAttrs = ctx.keyFor && editPath ? {
+  const editAttrs = ctx.keyFor && editPath && !isIcon ? {
     "data-ohw-key": ctx.keyFor(editPath),
-    ...isIcon ? { "data-ohw-editable": "icon" } : genericImageEdit ? { "data-ohw-editable": "image" } : {}
+    ...genericImageEdit ? { "data-ohw-editable": "image" } : {}
   } : {};
   if (isIcon) {
     const Icon = refValue.startsWith("lucide:") ? lucideByName(refValue.slice(7)) : null;
+    const iconEditAttrs = ctx.keyFor && editPath && genericImageEdit ? { "data-ohw-key": ctx.keyFor(editPath), "data-ohw-editable": "icon" } : {};
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "span",
       {
         "data-ai-icon": refValue,
-        ...editAttrs,
+        ...iconEditAttrs,
         style: {
           display: "inline-flex",
           width: 48,
@@ -8195,8 +8463,20 @@ function PricingCard({ node, ctx, path }) {
             /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { "data-ai-features": "", style: { display: "flex", flexDirection: "column", gap: AI_TREE_TOKENS.spacing4, padding: `${AI_TREE_TOKENS.spacing2}px 0` }, children: features.map((item, i) => {
               const Icon = lucideByName(item.icon || "check");
               const iconColor = pricingIconColor(item.iconColor, ctx.brand, fg);
+              const iconAttrs = ctx.keyFor && !item.html ? {
+                "data-ohw-key": ctx.keyFor(`${path}.features.${i}.icon`),
+                "data-ohw-editable": "icon"
+              } : {};
               return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "flex", alignItems: "flex-start", gap: AI_TREE_TOKENS.spacing3 }, children: [
-                Icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { size: 20, color: iconColor }),
+                Icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  "span",
+                  {
+                    "data-ai-icon": `lucide:${item.icon || "check"}`,
+                    ...iconAttrs,
+                    style: { display: "inline-flex", flexShrink: 0 },
+                    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { size: 20, color: iconColor })
+                  }
+                ),
                 item.html ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                   "span",
                   {
@@ -18442,222 +18722,6 @@ function AiMediaStripOverlay({
 // src/ui/ai-section/AiPricingCardOverlay.tsx
 var import_react11 = require("react");
 var import_lucide_react9 = require("lucide-react");
-
-// src/lib/ai-pricing-tree.ts
-var PRICING_MIN_CARDS = 1;
-var PRICING_MAX_CARDS = 4;
-function isPricingCard(node) {
-  return typeof node === "object" && node !== null && node.type === "card" && node.slots?.preset === "pricing";
-}
-function isPricingCollection(node) {
-  return node.type === "collection" && Array.isArray(node.children) && node.children.length > 0 && isPricingCard(node.children[0]);
-}
-function findCollection(node) {
-  if (isPricingCollection(node)) return node;
-  for (const child of node.children ?? []) {
-    const found = findCollection(child);
-    if (found) return found;
-  }
-  return null;
-}
-function findPricingCollection(tree) {
-  for (const row of tree.rows ?? []) {
-    for (const block of row.blocks ?? []) {
-      const found = findCollection(block);
-      if (found) return found;
-    }
-  }
-  return null;
-}
-function pricingCardCount(tree) {
-  return findPricingCollection(tree)?.children?.length ?? 0;
-}
-function withPricingCollection(tree, mutate) {
-  const next = JSON.parse(JSON.stringify(tree));
-  const collection = findPricingCollection(next);
-  if (!collection || !collection.children) return null;
-  for (const card of collection.children) {
-    if (isPricingCard(card)) upgradeLegacyPricingSlots(card);
-  }
-  return mutate(collection) ? next : null;
-}
-function upgradeLegacyPricingSlots(card) {
-  const slots = card.slots = card.slots ?? {};
-  if (typeof slots.features === "string") {
-    const rows = pricingFeatureList(card);
-    if (rows.length > 0) slots.features = rows.slice(0, PRICING_FEATURES_MAX);
-  }
-  if (slots.featured === true) slots.featured = { enabled: true };
-  else if (slots.featured === false) delete slots.featured;
-}
-function addPricingTier(tree) {
-  return withPricingCollection(tree, (collection) => {
-    const children = collection.children;
-    if (children.length >= PRICING_MAX_CARDS) return false;
-    const clone = JSON.parse(JSON.stringify(children[children.length - 1]));
-    clone.slots = clone.slots ?? {};
-    delete clone.slots.featured;
-    clone.slots.heading = "New tier";
-    children.push(clone);
-    collection.slots = { ...collection.slots, itemsPerRow: children.length };
-    return true;
-  });
-}
-function removePricingTier(tree, index) {
-  return withPricingCollection(tree, (collection) => {
-    const children = collection.children;
-    if (children.length <= PRICING_MIN_CARDS) return false;
-    if (index < 0 || index >= children.length) return false;
-    children.splice(index, 1);
-    collection.slots = { ...collection.slots, itemsPerRow: children.length };
-    return true;
-  });
-}
-var PRICING_CARD_STYLES = [
-  { value: "outline", label: "Outline", treatment: null },
-  { value: "lift", label: "Lift", treatment: "lifted" },
-  { value: "invert", label: "Invert", treatment: "inverted" },
-  { value: "header", label: "Header", treatment: "accent-header" }
-];
-var DEFAULT_FEATURED_BADGE = "Most popular";
-function featuredOf(target) {
-  const raw = target?.slots?.featured;
-  if (raw === true) return { enabled: true, treatment: "outlined" };
-  return typeof raw === "object" && raw !== null ? raw : {};
-}
-function badgeOf(featured) {
-  return typeof featured.badge === "string" ? featured.badge.trim() : "";
-}
-function pricingCardStyle(tree, index) {
-  const featured = featuredOf(findPricingCollection(tree)?.children?.[index]);
-  if (featured.enabled !== true) return "outline";
-  return PRICING_CARD_STYLES.find((s) => s.treatment === featured.treatment)?.value ?? "outline";
-}
-function pricingCardFeaturedTag(tree, index) {
-  const featured = featuredOf(findPricingCollection(tree)?.children?.[index]);
-  return featured.enabled === true && badgeOf(featured).length > 0;
-}
-function composeFeatured(style, tagOn, badgeText) {
-  const treatment = PRICING_CARD_STYLES.find((s) => s.value === style)?.treatment ?? null;
-  if (tagOn) return { enabled: true, badge: badgeText || DEFAULT_FEATURED_BADGE, treatment: treatment ?? "outlined" };
-  if (treatment) return { enabled: true, treatment };
-  return badgeText.length > 0 ? { enabled: false, badge: badgeText } : { enabled: false };
-}
-function withPricingCard(tree, index, mutate) {
-  return withPricingCollection(tree, (collection) => {
-    const children = collection.children;
-    if (index < 0 || index >= children.length) return false;
-    const target = children[index];
-    target.slots = target.slots ?? {};
-    mutate(target);
-    return true;
-  });
-}
-function setPricingCardStyle(tree, index, style) {
-  if (!PRICING_CARD_STYLES.some((s) => s.value === style)) return null;
-  return withPricingCard(tree, index, (target) => {
-    const prev = featuredOf(target);
-    const tagOn = prev.enabled === true && badgeOf(prev).length > 0;
-    target.slots.featured = composeFeatured(style, tagOn, badgeOf(prev));
-  });
-}
-function setPricingCardFeaturedTag(tree, index, on) {
-  return withPricingCollection(tree, (collection) => {
-    const children = collection.children;
-    if (index < 0 || index >= children.length) return false;
-    if (on) {
-      children.forEach((card, i) => {
-        if (i === index) return;
-        const prev2 = featuredOf(card);
-        if (prev2.enabled !== true || badgeOf(prev2).length === 0) return;
-        card.slots = card.slots ?? {};
-        card.slots.featured = composeFeatured(pricingCardStyleOf(prev2), false, badgeOf(prev2));
-      });
-    }
-    const target = children[index];
-    target.slots = target.slots ?? {};
-    const prev = featuredOf(target);
-    target.slots.featured = composeFeatured(pricingCardStyleOf(prev), on, badgeOf(prev));
-    return true;
-  });
-}
-function pricingCardStyleOf(featured) {
-  if (featured.enabled !== true) return "outline";
-  return PRICING_CARD_STYLES.find((s) => s.treatment === featured.treatment)?.value ?? "outline";
-}
-function addPricingCardButton(tree, index, label) {
-  return withPricingCollection(tree, (collection) => {
-    const children = collection.children;
-    if (index < 0 || index >= children.length) return false;
-    const target = children[index];
-    const buttons = (target.children ?? []).filter((c) => c.type === "button");
-    if (buttons.length >= 2) return false;
-    const hasPrimary = buttons.some((b) => b.slots?.variant === "primary");
-    target.children = [
-      ...target.children ?? [],
-      { type: "button", span: 12, slots: { label, href: "#", variant: hasPrimary ? "secondary" : "primary" } }
-    ];
-    return true;
-  });
-}
-function removePricingCardButton(tree, index) {
-  return withPricingCollection(tree, (collection) => {
-    const children = collection.children;
-    if (index < 0 || index >= children.length) return false;
-    const target = children[index];
-    const buttons = (target.children ?? []).filter((c) => c.type === "button");
-    if (buttons.length === 0) return false;
-    const lastButton = buttons[buttons.length - 1];
-    target.children = (target.children ?? []).filter((c) => c !== lastButton);
-    return true;
-  });
-}
-var PRICING_FEATURES_MIN = 1;
-var PRICING_FEATURES_MAX = 10;
-function pricingFeatureList(target) {
-  const raw = target.slots?.features;
-  if (Array.isArray(raw)) {
-    return raw.filter((item) => !!item && typeof item === "object" && typeof item.text === "string").map((item) => ({
-      text: item.text,
-      ...typeof item.icon === "string" ? { icon: item.icon } : {},
-      ...typeof item.iconColor === "string" ? { iconColor: item.iconColor } : {}
-    }));
-  }
-  if (typeof raw === "string") {
-    return raw.split(/\n|<br\s*\/?>/i).map((line) => line.replace(/<[^>]+>/g, "").replace(/^[-*•]\s*/, "").trim().slice(0, 120)).filter(Boolean).map((text) => ({ text }));
-  }
-  return [];
-}
-function pricingCardFeatureCount(tree, index) {
-  const target = findPricingCollection(tree)?.children?.[index];
-  return target ? pricingFeatureList(target).length : 0;
-}
-function addPricingCardFeature(tree, index, text) {
-  return withPricingCollection(tree, (collection) => {
-    const children = collection.children;
-    if (index < 0 || index >= children.length) return false;
-    const target = children[index];
-    const features = pricingFeatureList(target);
-    if (features.length >= PRICING_FEATURES_MAX) return false;
-    target.slots = target.slots ?? {};
-    target.slots.features = [...features, { text }];
-    return true;
-  });
-}
-function removePricingCardFeature(tree, index) {
-  return withPricingCollection(tree, (collection) => {
-    const children = collection.children;
-    if (index < 0 || index >= children.length) return false;
-    const target = children[index];
-    const features = pricingFeatureList(target);
-    if (features.length <= PRICING_FEATURES_MIN) return false;
-    target.slots = target.slots ?? {};
-    target.slots.features = features.slice(0, -1);
-    return true;
-  });
-}
-
-// src/ui/ai-section/AiPricingCardOverlay.tsx
 var import_jsx_runtime20 = require("react/jsx-runtime");
 var PRIMARY4 = "var(--ohw-primary, #0885FE)";
 var CHROME_SELECTOR = "[data-ohw-toolbar], [data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-link-modal-root], [data-ohw-section-picker], [data-ohw-ai-review], [data-ohw-more-menu]";
@@ -23784,6 +23848,23 @@ function currentIconRef(el) {
   );
   return named ? `lucide:${named.slice("lucide-".length)}` : "";
 }
+function requestValidateTree5(postToParent2, tree) {
+  return new Promise((resolve) => {
+    const id = `ai-validate-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}`;
+    const timeout = window.setTimeout(() => {
+      window.removeEventListener("message", onMessage);
+      resolve({ ok: false, reasons: ["Validation request timed out."] });
+    }, 8e3);
+    function onMessage(e) {
+      if (e.data?.type !== "ow:ai-validate-tree-result" || e.data.id !== id) return;
+      window.clearTimeout(timeout);
+      window.removeEventListener("message", onMessage);
+      resolve({ ok: e.data.ok === true, reasons: Array.isArray(e.data.reasons) ? e.data.reasons : [] });
+    }
+    window.addEventListener("message", onMessage);
+    postToParent2({ type: "ow:ai-validate-tree-request", id, tree });
+  });
+}
 function getEditMeasureEl(editable) {
   return editable.closest("[data-ohw-href-key]") ?? editable;
 }
@@ -27781,8 +27862,11 @@ function OhhwellsBridge() {
         display: none !important;
       }
       /* Body text (no item-action toolbar) \u2014 first click enters text edit \u2192 I-beam.
-         Exclude select-first nav/footer labels so grab/default on [data-ohw-href-key] can win. */
-      [data-ohw-editable]:not([contenteditable]):not([data-ohw-editable="image"]):not([data-ohw-editable="bg-image"]):not([data-ohw-editable="video"]):not([data-ohw-editable="link"]):not(:is([data-ohw-href-key] *)) {
+         Exclude select-first nav/footer labels so grab/default on [data-ohw-href-key] can win.
+         Icons are excluded too: a glyph is replaced by a click, never typed into (OHH-623),
+         so it takes the picker's pointer below, not an I-beam \u2014 this blanket !important used
+         to beat the stylesheet's own non-!important icon rule (OHH-718). */
+      [data-ohw-editable]:not([contenteditable]):not([data-ohw-editable="image"]):not([data-ohw-editable="bg-image"]):not([data-ohw-editable="video"]):not([data-ohw-editable="link"]):not([data-ohw-editable="icon"]):not(:is([data-ohw-href-key] *)) {
         cursor: text !important;
       }
       /* Select-first items: default arrow; grab only when drag-start is allowed (data-ohw-can-drag). */
@@ -27803,6 +27887,7 @@ function OhhwellsBridge() {
       [data-ohw-editable="video"], [data-ohw-editable="video"] *,
       [data-ohw-editable="bg-image"], [data-ohw-editable="bg-image"] * { cursor: pointer !important; }
       [data-ohw-editable="link"], [data-ohw-editable="link"] * { cursor: pointer !important; }
+      [data-ohw-editable="icon"], [data-ohw-editable="icon"] * { cursor: pointer !important; }
       /* A text/plain editable nested inside a media editable (e.g. a placeholder's fallback
          label inside its bg-image box) is its own click target, not the media picker \u2014 the
          blanket media cursor rule above would otherwise show pointer where a click actually
@@ -28132,10 +28217,14 @@ function OhhwellsBridge() {
           e.preventDefault();
           e.stopPropagation();
           aiSectionApiRef.current?.selectFromElement(editable);
+          const aiIcon = editable.hasAttribute("data-ai-icon");
+          const featureIcon = aiIcon && /\.features\.\d+\.icon$/.test(editable.dataset.ohwKey ?? "");
           postToParentRef.current({
             type: "ow:icon-pick",
             key: editable.dataset.ohwKey ?? "",
-            current: currentIconRef(editable)
+            current: currentIconRef(editable),
+            ...aiIcon ? { iconMode: "name" } : {},
+            ...featureIcon ? { options: [...PRICING_FEATURE_ICONS] } : {}
           });
           return;
         }
@@ -29397,15 +29486,39 @@ function OhhwellsBridge() {
       if (e.data?.type !== "ow:icon-markup") return;
       const { key, markup } = e.data;
       if (!key || typeof markup !== "string") return;
-      const targets = document.querySelectorAll(
-        `[data-ohw-key="${key}"][data-ohw-editable="icon"]`
-      );
+      const targets = Array.from(
+        document.querySelectorAll(`[data-ohw-key="${key}"][data-ohw-editable="icon"]`)
+      ).filter((el) => !el.hasAttribute("data-ai-icon"));
       if (!targets.length) return;
       targets.forEach((el) => {
         applyIconMarkup(el, markup);
       });
       postToParentRef.current({ type: "ow:change", nodes: [{ key, text: markup }], flush: true });
     };
+    const handleIconName = (e) => {
+      if (e.data?.type !== "ow:icon-name") return;
+      const { key, icon } = e.data;
+      if (!key || typeof icon !== "string" || !/^[a-z0-9-]+$/.test(icon)) return;
+      const state = parseAiSectionsState(aiSectionsRef.current);
+      const entry = state.sections.find((s) => key.startsWith(aiSlotKeyPrefixFor(s.id)));
+      if (!entry) return;
+      const nextTree = applyIconNameToTree(entry.tree, key.slice(aiSlotKeyPrefixFor(entry.id).length), icon);
+      if (!nextTree) return;
+      void requestValidateTree5(postToParentRef.current, nextTree).then(({ ok }) => {
+        if (!ok) return;
+        applyTreeLocalRef.current?.({
+          id: entry.id,
+          mode: "replace",
+          targetSectionId: entry.id,
+          tree: nextTree,
+          label: entry.label,
+          media: entry.media,
+          ...entry.brand ? { brand: entry.brand } : {},
+          // The user is looking at the icon they just changed — no need to recenter on it.
+          skipScrollIntoView: true
+        });
+      });
+    };
     const handleImageUrl = (e) => {
       if (e.data?.type !== "ow:image-url") return;
       const { key, url } = e.data;
@@ -30861,6 +30974,7 @@ function OhhwellsBridge() {
     window.addEventListener("message", handleSocialCancel);
     window.addEventListener("message", handleSocialUpdate);
     window.addEventListener("message", handleIconMarkup);
+    window.addEventListener("message", handleIconName);
     window.addEventListener("message", handleImageUrl);
     window.addEventListener("message", handleImageUploading);
     window.addEventListener("message", handleCarouselChange);
@@ -30945,6 +31059,7 @@ function OhhwellsBridge() {
       window.removeEventListener("message", handleSocialCancel);
       window.removeEventListener("message", handleSocialUpdate);
       window.removeEventListener("message", handleIconMarkup);
+      window.removeEventListener("message", handleIconName);
       window.removeEventListener("message", handleImageUrl);
       window.removeEventListener("message", handleImageUploading);
       window.removeEventListener("message", handleCarouselChange);