@kubuild/renderer 0.1.0 → 0.3.0

package/dist/index.cjs

@@ -1,331 +1,5 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/index.ts
-var index_exports = {};
-__export(index_exports, {
-  ANIMATION_KEYFRAMES_CSS: () => ANIMATION_KEYFRAMES_CSS,
-  ComponentErrorBoundary: () => ComponentErrorBoundary,
-  DEFAULT_BREAKPOINTS: () => DEFAULT_BREAKPOINTS,
-  DEFAULT_CSS_RESET: () => DEFAULT_CSS_RESET,
-  DEFAULT_RENDER_CONTEXT: () => DEFAULT_RENDER_CONTEXT,
-  DEFAULT_VIEWPORT_CONFIGS: () => DEFAULT_VIEWPORT_CONFIGS,
-  EditableText: () => EditableText,
-  HtmlEmbedView: () => HtmlEmbedView,
-  KubuildPreviewViewport: () => KubuildPreviewViewport,
-  KubuildRenderer: () => KubuildRenderer,
-  NodeRenderer: () => NodeRenderer,
-  PreviewViewportAdapter: () => PreviewViewportAdapter,
-  RenderContextProvider: () => RenderContextProvider,
-  collectAnimationStylesCss: () => collectAnimationStylesCss,
-  collectStateStylesCss: () => collectStateStylesCss,
-  createMinimalRenderContext: () => createMinimalRenderContext,
-  createRenderContext: () => createRenderContext,
-  dispatchAction: () => dispatchAction,
-  generateDocumentCss: () => generateDocumentCss,
-  generateSemanticHtml: () => generateSemanticHtml,
-  generateStandaloneHtml: () => generateStandaloneHtml,
-  getEntranceAnimationCss: () => getEntranceAnimationCss,
-  getHoverEffectCss: () => getHoverEffectCss,
-  getLoopEffectCss: () => getLoopEffectCss,
-  isActionRegistered: () => isActionRegistered,
-  replayNodeAnimation: () => replayNodeAnimation,
-  resolveActionPayload: () => resolveActionPayload,
-  resolveActionPayloadDetailed: () => resolveActionPayloadDetailed,
-  resolveAssetSync: () => resolveAssetSync,
-  resolveNodeStyles: () => resolveNodeStyles,
-  resolveVariable: () => resolveVariable,
-  resolveViewportContainerStyle: () => resolveViewportContainerStyle,
-  resolveViewportDimensions: () => resolveViewportDimensions,
-  resolveViewportFromWidth: () => resolveViewportFromWidth,
-  styleDefinitionToCssDeclarations: () => styleDefinitionToCssDeclarations,
-  transformEmbedHtml: () => transformEmbedHtml,
-  useRenderContext: () => useRenderContext
-});
-module.exports = __toCommonJS(index_exports);
-
-// src/renderer.tsx
-var import_react3 = require("react");
-var import_schema3 = require("@kubuild/schema");
-var import_components2 = require("@kubuild/components");
-
-// src/render-context.tsx
-var import_react = require("react");
-var import_core = require("@kubuild/core");
-var import_schema = require("@kubuild/schema");
-var import_jsx_runtime = require("react/jsx-runtime");
-var DEFAULT_RENDER_CONTEXT = Object.freeze({});
-var RenderContextReact = (0, import_react.createContext)(DEFAULT_RENDER_CONTEXT);
-function createRenderContext(options) {
-  if (!options) {
-    return DEFAULT_RENDER_CONTEXT;
-  }
-  const frozenVariables = options.variables ? Object.freeze({ ...options.variables }) : void 0;
-  return Object.freeze({
-    variables: frozenVariables,
-    ...options.assetProvider ? { assetProvider: options.assetProvider } : {},
-    ...options.actionRegistry ? { actionRegistry: options.actionRegistry } : {},
-    ...options.onDiagnostic ? { onDiagnostic: options.onDiagnostic } : {}
-  });
-}
-function createMinimalRenderContext(options) {
-  const assetsMap = new Map(Object.entries(options?.assets ?? {}));
-  const actionsMap = new Map(Object.entries(options?.actions ?? {}));
-  const assetProvider = {
-    resolve: (assetIdOrUri) => {
-      return assetsMap.get(assetIdOrUri) || assetIdOrUri;
-    }
-  };
-  const actionRegistry = {
-    get: (type) => actionsMap.get(type),
-    register: (type, handler) => {
-      actionsMap.set(type, handler);
-    },
-    unregister: (type) => {
-      actionsMap.delete(type);
-    }
-  };
-  return createRenderContext({
-    variables: options?.variables,
-    assetProvider,
-    actionRegistry,
-    onDiagnostic: options?.onDiagnostic
-  });
-}
-var RenderContextProvider = ({ value, children }) => {
-  const contextValue = (0, import_react.useMemo)(() => value || DEFAULT_RENDER_CONTEXT, [value]);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RenderContextReact.Provider, { value: contextValue, children });
-};
-function useRenderContext() {
-  return (0, import_react.useContext)(RenderContextReact);
-}
-function resolveAssetSync(assetProvider, assetIdOrUri) {
-  if (!assetProvider || !assetIdOrUri) {
-    return void 0;
-  }
-  try {
-    const result = assetProvider.resolve(assetIdOrUri);
-    return typeof result === "string" ? result : void 0;
-  } catch {
-    return void 0;
-  }
-}
-function resolveVariable(context, value) {
-  if (value === null || value === void 0) {
-    return value;
-  }
-  if ((0, import_schema.isVariableBinding)(value)) {
-    return (0, import_core.resolveBinding)(value, context).value;
-  }
-  if (typeof value === "string" && value.includes("{{")) {
-    return value.replace(/\{\{\s*([\w.-]+)\s*\}\}/g, (match, key) => {
-      const outcome = (0, import_core.resolveBinding)({ key }, context);
-      if (outcome.status === "resolved") {
-        return String(outcome.value);
-      }
-      return match;
-    });
-  }
-  return value;
-}
-function resolveActionPayloadDetailed(context, payload) {
-  if (!payload || typeof payload !== "object") {
-    return { value: payload, invalidPaths: [] };
-  }
-  const invalidPaths = [];
-  const resolveValueRecursively = (val, path) => {
-    if (val === null || val === void 0) {
-      return val;
-    }
-    if ((0, import_schema.isVariableBinding)(val)) {
-      const outcome = (0, import_core.resolveBinding)(val, context);
-      if (outcome.status === "empty") {
-        invalidPaths.push(path);
-      }
-      return outcome.value;
-    }
-    if (typeof val === "string") {
-      if (val.includes("{{")) {
-        return val.replace(/\{\{\s*([\w.-]+)\s*\}\}/g, (match, key) => {
-          const outcome = (0, import_core.resolveBinding)({ key }, context);
-          if (outcome.status !== "resolved") {
-            invalidPaths.push(path);
-            return match;
-          }
-          return String(outcome.value);
-        });
-      }
-      return val;
-    }
-    if (Array.isArray(val)) {
-      return val.map((item, index) => resolveValueRecursively(item, `${path}[${index}]`));
-    }
-    if (typeof val === "object") {
-      const copy = {};
-      for (const [k, v] of Object.entries(val)) {
-        copy[k] = resolveValueRecursively(v, path ? `${path}.${k}` : k);
-      }
-      return copy;
-    }
-    return val;
-  };
-  const resolved = {};
-  for (const [key, value] of Object.entries(payload)) {
-    resolved[key] = resolveValueRecursively(value, key);
-  }
-  return { value: resolved, invalidPaths };
-}
-function resolveActionPayload(context, payload) {
-  return resolveActionPayloadDetailed(context, payload).value;
-}
-function isActionRegistered(actionRegistry, actionType) {
-  if (!actionRegistry || !actionType) {
-    return false;
-  }
-  return Boolean(actionRegistry.get(actionType));
-}
-function dispatchAction(options) {
-  const { action, nodeId, document, context, onDiagnostic } = options;
-  if (!(0, import_schema.isActionBinding)(action)) {
-    const diagnostic = {
-      code: "INVALID_ACTION_PAYLOAD",
-      actionType: typeof action?.type === "string" ? action.type : "unknown",
-      nodeId,
-      message: `Invalid action binding on node ${nodeId || "unknown"}.`
-    };
-    onDiagnostic?.(diagnostic);
-    context?.onDiagnostic?.(diagnostic);
-    return false;
-  }
-  const handler = context?.actionRegistry?.get(action.type);
-  if (!handler) {
-    const diagnostic = {
-      code: "UNKNOWN_ACTION",
-      actionType: action.type,
-      nodeId,
-      message: `No action handler registered for action type "${action.type}".`
-    };
-    onDiagnostic?.(diagnostic);
-    context?.onDiagnostic?.(diagnostic);
-    return false;
-  }
-  const { value: resolvedPayload, invalidPaths } = resolveActionPayloadDetailed(context, action.payload);
-  if (invalidPaths.length > 0) {
-    const diagnostic = {
-      code: "INVALID_ACTION_BINDING",
-      actionType: action.type,
-      nodeId,
-      message: `Action "${action.type}" payload has unresolved binding path(s) [${invalidPaths.join(
-        ", "
-      )}] on node ${nodeId || "unknown"}; handler was not invoked.`,
-      invalidPaths
-    };
-    onDiagnostic?.(diagnostic);
-    context?.onDiagnostic?.(diagnostic);
-    return false;
-  }
-  const executionContext = {
-    nodeId,
-    document,
-    variables: context?.variables
-  };
-  try {
-    const result = handler(resolvedPayload, executionContext);
-    if (result && typeof result.catch === "function") {
-      result.catch((error) => {
-        const diagnostic = {
-          code: "ACTION_EXECUTION_ERROR",
-          actionType: action.type,
-          nodeId,
-          message: `Action "${action.type}" handler threw an asynchronous error: ${error instanceof Error ? error.message : String(error)}`,
-          error
-        };
-        onDiagnostic?.(diagnostic);
-        context?.onDiagnostic?.(diagnostic);
-      });
-    }
-    return true;
-  } catch (error) {
-    const diagnostic = {
-      code: "ACTION_EXECUTION_ERROR",
-      actionType: action.type,
-      nodeId,
-      message: `Action "${action.type}" handler threw a synchronous error: ${error instanceof Error ? error.message : String(error)}`,
-      error
-    };
-    onDiagnostic?.(diagnostic);
-    context?.onDiagnostic?.(diagnostic);
-    return false;
-  }
-}
-
-// src/renderer.tsx
-var import_core3 = require("@kubuild/core");
-var import_lucide_react2 = require("lucide-react");
-
-// src/styles.ts
-function resolveNodeStyles(styles, viewport = "desktop") {
-  if (!styles) return {};
-  const base = styles.base || {};
-  const override = styles[viewport] || {};
-  return { ...base, ...override };
-}
-function escapeCssValue(value) {
-  return String(value).replace(/[{};]+/g, "");
-}
-function escapeCssIdent(value) {
-  return value.replace(/["\\\]]/g, "\\$&");
-}
-function styleDefinitionToCssDeclarations(styleDefinition, options) {
-  if (!styleDefinition || typeof styleDefinition !== "object") return "";
-  const declarations = [];
-  const suffix = options?.important ? " !important" : "";
-  for (const [key, value] of Object.entries(styleDefinition)) {
-    if (value === null || value === void 0 || value === "") continue;
-    const property = key.replace(/[A-Z]/g, (c) => `-${c.toLowerCase()}`);
-    declarations.push(`${property}: ${escapeCssValue(value)}${suffix};`);
-  }
-  return declarations.join(" ");
-}
-function collectStateStylesCss(document, options = { important: true }) {
-  if (!document?.document) return "";
-  const rules = [];
-  const walk = (node) => {
-    const states = node.styles?.states;
-    if (states && typeof states === "object") {
-      for (const [state, styleDefinition] of Object.entries(states)) {
-        const declarations = styleDefinitionToCssDeclarations(
-          styleDefinition,
-          { important: options.important !== false }
-        );
-        if (!declarations) continue;
-        const safeState = /^::?[a-zA-Z-]+$/.test(state) ? state : null;
-        if (!safeState) continue;
-        rules.push(`[data-kubuild-node="${escapeCssIdent(node.id)}"]${safeState} { ${declarations} }`);
-      }
-    }
-    node.children?.forEach(walk);
-  };
-  walk(document.document);
-  return rules.join("\n");
-}
-var DEFAULT_CSS_RESET = `
+"use strict";var Bn=Object.create;var Ae=Object.defineProperty;var Hn=Object.getOwnPropertyDescriptor;var _n=Object.getOwnPropertyNames;var Ln=Object.getPrototypeOf,qn=Object.prototype.hasOwnProperty;var jn=(o,e)=>{for(var i in e)Ae(o,i,{get:e[i],enumerable:!0})},_t=(o,e,i,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of _n(e))!qn.call(o,n)&&n!==i&&Ae(o,n,{get:()=>e[n],enumerable:!(r=Hn(e,n))||r.enumerable});return o};var fe=(o,e,i)=>(i=o!=null?Bn(Ln(o)):{},_t(e||!o||!o.__esModule?Ae(i,"default",{value:o,enumerable:!0}):i,o)),zn=o=>_t(Ae({},"__esModule",{value:!0}),o);var fo={};jn(fo,{ANIMATION_KEYFRAMES_CSS:()=>zt,ApiRequestError:()=>ie,ArtboardPortalHost:()=>_e,ComponentErrorBoundary:()=>we,DEFAULT_BREAKPOINTS:()=>Nn,DEFAULT_CSS_RESET:()=>Ze,DEFAULT_RENDER_CONTEXT:()=>de,DEFAULT_VIEWPORT_CONFIGS:()=>It,EditableText:()=>Y,FormCheckboxNode:()=>vt,FormContainerNode:()=>bt,FormInputNode:()=>yt,FormRadioNode:()=>Rt,FormRuntimeContext:()=>Be,FormRuntimeProvider:()=>ut,FormSelectNode:()=>xt,FormSubmitButtonNode:()=>kt,FormTextareaNode:()=>ht,HtmlEmbedView:()=>gt,KubuildPreviewViewport:()=>lo,KubuildProjectRenderer:()=>ao,KubuildRenderer:()=>Te,ModalManager:()=>Oe,NodeRenderer:()=>be,PreviewViewportAdapter:()=>Dn,RenderContextProvider:()=>qe,ToastCard:()=>sn,ToastContainer:()=>ct,ToastManager:()=>De,apiRequestRunner:()=>et,aspectRatioToCss:()=>St,buildApiUrl:()=>en,closeModalRunner:()=>at,collectAnimationStylesCss:()=>Ce,collectStateStylesCss:()=>Je,copyClipboardRunner:()=>lt,copyToClipboard:()=>on,createApiRequestHandler:()=>Fe,createDefaultActionRunners:()=>ln,createMinimalRenderContext:()=>Un,createRenderContext:()=>qt,dispatchAction:()=>Ye,executeNodeActions:()=>H,generateDocumentCss:()=>On,generateSemanticHtml:()=>Mn,generateStandaloneHtml:()=>po,getArtboardContentNode:()=>At,getEntranceAnimationCss:()=>Kt,getHoverEffectCss:()=>Ut,getLoopEffectCss:()=>Wt,getVimeoId:()=>$t,getYouTubeId:()=>wt,handleFormButtonClick:()=>fn,isActionRegistered:()=>Ke,modalManager:()=>Z,navigateRunner:()=>st,normalizeStyleObject:()=>Xe,openModalRunner:()=>Ve,prepareRequestBody:()=>tn,registerDefaultActionRunners:()=>$e,renderCollectionNode:()=>Cn,renderCustomComponent:()=>bn,renderFallbackNode:()=>wn,renderFormNode:()=>kn,renderInteractiveNode:()=>Tt,renderLayoutNode:()=>yn,renderListNode:()=>xn,renderMediaNode:()=>Rn,renderNodeContent:()=>Et,renderTableNode:()=>vn,renderTypographyNode:()=>hn,replayNodeAnimation:()=>Yn,resetFormRunner:()=>dt,resolveActionPayload:()=>We,resolveActionPayloadDetailed:()=>Ue,resolveAssetSync:()=>Ie,resolveNodeStyles:()=>Ge,resolveVariable:()=>ze,resolveViewportContainerStyle:()=>Fn,resolveViewportDimensions:()=>Nt,resolveViewportFromWidth:()=>so,selectOpenComponentArtboards:()=>In,showToastRunner:()=>rt,styleDefinitionToCssDeclarations:()=>pe,toPascalCase:()=>Ct,toastManager:()=>ue,toggleModalRunner:()=>it,transformEmbedHtml:()=>un,useFormContext:()=>to,useFormField:()=>oo,useFormRuntime:()=>Q,useFormStatus:()=>no,useModal:()=>nt,useModals:()=>ot,useNodeLoadActions:()=>mt,useRenderContext:()=>je,useToasts:()=>tt});module.exports=zn(fo);var $n=fe(require("react"),1),Sn=require("@kubuild/schema"),Tn=require("@kubuild/components");var ge=require("react"),Re=require("@kubuild/core"),ke=require("@kubuild/schema"),jt=require("react/jsx-runtime"),de=Object.freeze({}),Lt=(0,ge.createContext)(de);function qt(o){if(!o)return de;let e=o.variables?Object.freeze({...o.variables}):void 0,i=o.componentArtboards?Object.freeze([...o.componentArtboards]):void 0,r=o.resolveArtboard??(i?n=>i.find(t=>t.artboardType==="component"&&t.triggerId===n):void 0);return Object.freeze({variables:e,...o.assetProvider?{assetProvider:o.assetProvider}:{},...o.actionRegistry?{actionRegistry:o.actionRegistry}:{},...o.onDiagnostic?{onDiagnostic:o.onDiagnostic}:{},...i?{componentArtboards:i}:{},...r?{resolveArtboard:r}:{},...o.artboardSurface?{artboardSurface:o.artboardSurface}:{}})}function Un(o){let e=new Map(Object.entries(o?.assets??{})),i=new Map(Object.entries(o?.actions??{})),r={resolve:t=>e.get(t)||t},n={get:t=>i.get(t),register:(t,l)=>{i.set(t,l)},unregister:t=>{i.delete(t)}};return qt({variables:o?.variables,assetProvider:r,actionRegistry:n,onDiagnostic:o?.onDiagnostic})}var qe=({value:o,children:e})=>{let i=(0,ge.useMemo)(()=>o||de,[o]);return(0,jt.jsx)(Lt.Provider,{value:i,children:e})};function je(){return(0,ge.useContext)(Lt)}function Ie(o,e){if(!(!o||!e))try{let i=o.resolve(e);return typeof i=="string"?i:void 0}catch{return}}function ze(o,e){return e==null?e:(0,ke.isVariableBinding)(e)?(0,Re.resolveBinding)(e,o).value:typeof e=="string"&&e.includes("{{")?e.replace(/\{\{\s*([\w.-]+)\s*\}\}/g,(i,r)=>{let n=(0,Re.resolveBinding)({key:r},o);return n.status==="resolved"?String(n.value):i}):e}function Ue(o,e){if(!e||typeof e!="object")return{value:e,invalidPaths:[]};let i=[],r=(t,l)=>{if(t==null)return t;if((0,ke.isVariableBinding)(t)){let p=(0,Re.resolveBinding)(t,o);return p.status==="empty"&&i.push(l),p.value}if(typeof t=="string")return t.includes("{{")?t.replace(/\{\{\s*([\w.-]+)\s*\}\}/g,(p,f)=>{let u=(0,Re.resolveBinding)({key:f},o);return u.status!=="resolved"?(i.push(l),p):String(u.value)}):t;if(Array.isArray(t))return t.map((p,f)=>r(p,`${l}[${f}]`));if(typeof t=="object"){let p={};for(let[f,u]of Object.entries(t))p[f]=r(u,l?`${l}.${f}`:f);return p}return t},n={};for(let[t,l]of Object.entries(e))n[t]=r(l,t);return{value:n,invalidPaths:i}}function We(o,e){return Ue(o,e).value}function Ke(o,e){return!o||!e?!1:!!o.get(e)}function Ye(o){let{action:e,nodeId:i,document:r,context:n,onDiagnostic:t}=o;if(!(0,ke.isActionBinding)(e)){let c={code:"INVALID_ACTION_PAYLOAD",actionType:typeof e?.type=="string"?e.type:"unknown",nodeId:i,message:`Invalid action binding on node ${i||"unknown"}.`};return t?.(c),n?.onDiagnostic?.(c),!1}let l=n?.actionRegistry?.get(e.type);if(!l){let c={code:"UNKNOWN_ACTION",actionType:e.type,nodeId:i,message:`No action handler registered for action type "${e.type}".`};return t?.(c),n?.onDiagnostic?.(c),!1}let{value:p,invalidPaths:f}=Ue(n,e.payload);if(f.length>0){let c={code:"INVALID_ACTION_BINDING",actionType:e.type,nodeId:i,message:`Action "${e.type}" payload has unresolved binding path(s) [${f.join(", ")}] on node ${i||"unknown"}; handler was not invoked.`,invalidPaths:f};return t?.(c),n?.onDiagnostic?.(c),!1}let u={nodeId:i,document:r,variables:n?.variables};try{let c=l(p,u);return c&&typeof c.catch=="function"&&c.catch(a=>{let s={code:"ACTION_EXECUTION_ERROR",actionType:e.type,nodeId:i,message:`Action "${e.type}" handler threw an asynchronous error: ${a instanceof Error?a.message:String(a)}`,error:a};t?.(s),n?.onDiagnostic?.(s)}),!0}catch(c){let a={code:"ACTION_EXECUTION_ERROR",actionType:e.type,nodeId:i,message:`Action "${e.type}" handler threw a synchronous error: ${c instanceof Error?c.message:String(c)}`,error:c};return t?.(a),n?.onDiagnostic?.(a),!1}}var En=require("lucide-react");function Xe(o){if(!o||typeof o!="object")return{};let e={...o};if(e.colSpan!==void 0&&e.colSpan!==null&&e.colSpan!==""){if(!e.gridColumn){let i=String(e.colSpan).trim();e.gridColumn=i.startsWith("span")?i:`span ${i}`}delete e.colSpan}if(e.rowSpan!==void 0&&e.rowSpan!==null&&e.rowSpan!==""){if(!e.gridRow){let i=String(e.rowSpan).trim();e.gridRow=i.startsWith("span")?i:`span ${i}`}delete e.rowSpan}if(e.width==="hug"?e.width="fit-content":e.width==="fill"&&(e.width="100%",e.flex||(e.flex="1 1 0%")),e.height==="hug"?e.height="fit-content":e.height==="fill"&&(e.height="100%",e.flex||(e.flex="1 1 0%")),e.sizingMode==="hug"?(e.width=e.width||"fit-content",delete e.sizingMode):e.sizingMode==="fill"&&(e.flex||(e.flex="1 1 0%"),delete e.sizingMode),typeof e.gap=="number"&&(e.gap=`${e.gap}px`),typeof e.rowGap=="number"&&(e.rowGap=`${e.rowGap}px`),typeof e.columnGap=="number"&&(e.columnGap=`${e.columnGap}px`),typeof e.borderTopLeftRadius=="number"&&(e.borderTopLeftRadius=`${e.borderTopLeftRadius}px`),typeof e.borderTopRightRadius=="number"&&(e.borderTopRightRadius=`${e.borderTopRightRadius}px`),typeof e.borderBottomRightRadius=="number"&&(e.borderBottomRightRadius=`${e.borderBottomRightRadius}px`),typeof e.borderBottomLeftRadius=="number"&&(e.borderBottomLeftRadius=`${e.borderBottomLeftRadius}px`),typeof e.borderRadius=="number"&&(e.borderRadius=`${e.borderRadius}px`),e.backdropBlur!==void 0&&e.backdropBlur!==null&&e.backdropBlur!==""){let i=String(e.backdropBlur).trim(),n=`blur(${typeof e.backdropBlur=="number"||/^\d+$/.test(i)?`${i}px`:i})`;e.backdropFilter=n,e.WebkitBackdropFilter=n,delete e.backdropBlur}else e.backdropFilter&&typeof e.backdropFilter=="string"&&(e.WebkitBackdropFilter=e.backdropFilter);return e.gradient&&typeof e.gradient=="string"?(e.backgroundImage=e.gradient,delete e.gradient):e.backgroundGradient&&typeof e.backgroundGradient=="string"&&(e.backgroundImage=e.backgroundGradient,delete e.backgroundGradient),e}function Ge(o,e="desktop"){if(!o)return{};let i=o.base||{},r=o[e]||{},n={...i,...r};return Xe(n)}function Wn(o){return String(o).replace(/[{};]+/g,"")}function Kn(o){return o.replace(/["\\\]]/g,"\\$&")}function pe(o,e){if(!o||typeof o!="object")return"";let i=Xe(o),r=[],n=e?.important?" !important":"";for(let[t,l]of Object.entries(i)){if(l==null||l==="")continue;let p=t.replace(/[A-Z]/g,f=>`-${f.toLowerCase()}`);p.startsWith("--")||p.startsWith("-webkit-")||p.startsWith("-moz-")||p.startsWith("-")&&(p=p.substring(1)),r.push(`${p}: ${Wn(l)}${n};`)}return r.join(" ")}function Je(o,e={important:!0}){if(!o?.document)return"";let i=[],r=n=>{let t=n.styles?.states;if(t&&typeof t=="object")for(let[l,p]of Object.entries(t)){let f=pe(p,{important:e.important!==!1});if(!f)continue;let u=/^::?[a-zA-Z-]+$/.test(l)?l:null;u&&i.push(`[data-kubuild-node="${Kn(n.id)}"]${u} { ${f} }`)}n.children?.forEach(r)};return r(o.document),i.join(`
+`)}var Ze=`
 *, *::before, *::after {
   box-sizing: border-box;
 }
@@ -351,10 +25,7 @@ input, button, textarea, select {
 p, h1, h2, h3, h4, h5, h6 {
   overflow-wrap: break-word;
 }
-`.trim();
-
-// src/animation.ts
-var ANIMATION_KEYFRAMES_CSS = `
+`.trim();var zt=`
 /* Entrance / AOS Keyframes */
 @keyframes kb-anim-fade {
   from { opacity: 0; }
@@ -430,2386 +101,124 @@ var ANIMATION_KEYFRAMES_CSS = `
   0%, 100% { opacity: 0.75; }
   50% { opacity: 1; }
 }
-`.trim();
-function escapeCssIdent2(value) {
-  return value.replace(/["\\\]]/g, "\\$&");
-}
-function getHoverEffectCss(nodeId, hoverEffect) {
-  const safeId = escapeCssIdent2(nodeId);
-  const rules = [];
-  switch (hoverEffect) {
-    case "lift":
-      rules.push(
-        `[data-kubuild-node="${safeId}"] { transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease !important; will-change: transform; }`,
-        `[data-kubuild-node="${safeId}"]:hover { transform: translateY(-4px) !important; box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1) !important; }`
-      );
-      break;
-    case "scale":
-      rules.push(
-        `[data-kubuild-node="${safeId}"] { transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important; will-change: transform; }`,
-        `[data-kubuild-node="${safeId}"]:hover { transform: scale(1.04) !important; }`
-      );
-      break;
-    case "glow":
-      rules.push(
-        `[data-kubuild-node="${safeId}"] { transition: box-shadow 0.25s ease !important; }`,
-        `[data-kubuild-node="${safeId}"]:hover { box-shadow: 0 0 20px 2px rgba(59, 130, 246, 0.5) !important; }`
-      );
-      break;
-    case "tilt":
-      rules.push(
-        `[data-kubuild-node="${safeId}"] { transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important; will-change: transform; }`,
-        `[data-kubuild-node="${safeId}"]:hover { transform: rotate(2deg) scale(1.02) !important; }`
-      );
-      break;
-    default:
-      break;
-  }
-  return rules;
-}
-function getLoopEffectCss(nodeId, loopEffect) {
-  const safeId = escapeCssIdent2(nodeId);
-  const rules = [];
-  switch (loopEffect) {
-    case "pulse":
-      rules.push(
-        `[data-kubuild-node="${safeId}"] { animation: kb-loop-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite !important; }`
-      );
-      break;
-    case "bounce":
-      rules.push(
-        `[data-kubuild-node="${safeId}"] { animation: kb-loop-bounce 1.5s ease-in-out infinite !important; }`
-      );
-      break;
-    case "spin":
-      rules.push(
-        `[data-kubuild-node="${safeId}"] { animation: kb-loop-spin 3s linear infinite !important; }`
-      );
-      break;
-    case "float":
-      rules.push(
-        `[data-kubuild-node="${safeId}"] { animation: kb-loop-float 3s ease-in-out infinite !important; }`
-      );
-      break;
-    case "shimmer":
-      rules.push(
-        `[data-kubuild-node="${safeId}"] { animation: kb-loop-shimmer 2s ease-in-out infinite !important; }`
-      );
-      break;
-    default:
-      break;
-  }
-  return rules;
-}
-function getEntranceAnimationCss(nodeId, anim) {
-  if (!anim.type || anim.type === "none") return [];
-  const safeId = escapeCssIdent2(nodeId);
-  const duration = typeof anim.duration === "number" ? anim.duration : 600;
-  const delay = typeof anim.delay === "number" ? anim.delay : 0;
-  const easing = anim.easing || "ease-out";
-  return [
-    `[data-kubuild-node="${safeId}"] { animation-name: kb-anim-${anim.type} !important; animation-duration: ${duration}ms !important; animation-delay: ${delay}ms !important; animation-timing-function: ${easing} !important; animation-fill-mode: both !important; }`
-  ];
-}
-function collectAnimationStylesCss(document) {
-  if (!document?.document) return "";
-  const rules = [];
-  let hasAnyAnimation = false;
-  const walk = (node) => {
-    const anim = node.animation;
-    if (anim) {
-      if (anim.hoverEffect && anim.hoverEffect !== "none") {
-        rules.push(...getHoverEffectCss(node.id, anim.hoverEffect));
-        hasAnyAnimation = true;
-      }
-      if (anim.loopEffect && anim.loopEffect !== "none") {
-        rules.push(...getLoopEffectCss(node.id, anim.loopEffect));
-        hasAnyAnimation = true;
-      }
-      if (anim.type && anim.type !== "none") {
-        rules.push(...getEntranceAnimationCss(node.id, anim));
-        hasAnyAnimation = true;
-      }
-    }
-    node.children?.forEach(walk);
-  };
-  walk(document.document);
-  if (!hasAnyAnimation) return "";
-  return `${ANIMATION_KEYFRAMES_CSS}
-
-${rules.join("\n")}`;
-}
-function replayNodeAnimation(nodeId, rootElement) {
-  const root = rootElement || (typeof window !== "undefined" ? window.document : null);
-  if (!root) return false;
-  const el = root.querySelector(`[data-kubuild-node="${escapeCssIdent2(nodeId)}"]`);
-  if (!el) return false;
-  const currentAnimation = el.style.animation;
-  el.style.animation = "none";
-  void el.offsetWidth;
-  el.style.animation = currentAnimation;
-  el.dispatchEvent(new CustomEvent("kubuild:replay-animation", { bubbles: true, detail: { nodeId } }));
-  return true;
-}
-
-// src/error-boundary.tsx
-var import_react2 = require("react");
-var import_lucide_react = require("lucide-react");
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var ComponentErrorBoundary = class extends import_react2.Component {
-  constructor(props) {
-    super(props);
-    this.state = { hasError: false };
-  }
-  static getDerivedStateFromError(error) {
-    return { hasError: true, error };
-  }
-  componentDidCatch(error, errorInfo) {
-    if (this.props.onError) {
-      this.props.onError(error, errorInfo);
-    }
-  }
-  render() {
-    if (this.state.hasError) {
-      const { nodeId, componentType, mode = "runtime" } = this.props;
-      const errorMessage = this.state.error?.message || "Unknown render error";
-      if (mode === "editor") {
-        return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
-          "div",
-          {
-            "data-kubuild-node": nodeId,
-            "data-kubuild-error": componentType,
-            style: {
-              padding: "12px 16px",
-              margin: "4px 0",
-              backgroundColor: "#fef2f2",
-              border: "1px solid #ef4444",
-              borderRadius: "6px",
-              color: "#b91c1c",
-              fontFamily: "system-ui, -apple-system, sans-serif",
-              fontSize: "13px",
-              lineHeight: "1.4"
-            },
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: { fontWeight: 600, marginBottom: "4px", display: "flex", alignItems: "center", gap: "6px" }, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react.AlertTriangle, { size: 14, "aria-hidden": "true" }),
-                /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { children: [
-                  "Component Render Error: <",
-                  componentType,
-                  ">"
-                ] })
-              ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: { fontSize: "11px", color: "#7f1d1d", wordBreak: "break-all" }, children: [
-                "Node ID: ",
-                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("code", { children: nodeId }),
-                " \u2014 ",
-                errorMessage
-              ] })
-            ]
-          }
-        );
-      }
-      return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        "div",
-        {
-          "data-kubuild-node": nodeId,
-          "data-kubuild-error": componentType,
-          style: { display: "none" },
-          "aria-hidden": "true"
-        }
-      );
-    }
-    return this.props.children;
-  }
-};
-
-// src/prop-resolution.ts
-var import_schema2 = require("@kubuild/schema");
-var import_components = require("@kubuild/components");
-var import_core2 = require("@kubuild/core");
-function emptyValueFor(primitiveType) {
-  switch (primitiveType) {
-    case "string":
-      return "";
-    case "number":
-      return 0;
-    case "boolean":
-      return false;
-  }
-}
-function resolveBindableField(node, field, definition, context, diagnostics) {
-  const rawValue = node.props?.[field.name];
-  const expectedType = (0, import_components.primitiveTypeForField)(field);
-  if (expectedType === void 0 || rawValue === void 0) {
-    return rawValue;
-  }
-  const fallbackValue = definition.defaultProps?.[field.name] ?? field.defaultValue ?? emptyValueFor(expectedType);
-  if ((0, import_schema2.isVariableBinding)(rawValue)) {
-    const outcome = (0, import_core2.resolveBinding)(rawValue, context);
-    if (typeof outcome.value === expectedType) {
-      return outcome.value;
-    }
-    diagnostics.push({
-      code: "INCOMPATIBLE_BINDING_TYPE",
-      nodeId: node.id,
-      propName: field.name,
-      expectedType,
-      actualType: typeof outcome.value,
-      message: `Prop "${field.name}" on node "${node.id}" expected a ${expectedType} but resolved binding "${rawValue.key}" produced a ${typeof outcome.value}.`
-    });
-    return fallbackValue;
-  }
-  if (expectedType === "string" && typeof rawValue === "string" && rawValue.includes("{{")) {
-    return resolveVariable(context, rawValue);
-  }
-  return rawValue;
-}
-function resolvePropsForNode(node, definition, context) {
-  const rawProps = node.props || {};
-  if (!definition || !definition.propFields || definition.propFields.length === 0) {
-    return { props: rawProps, diagnostics: [] };
-  }
-  const diagnostics = [];
-  const resolved = { ...rawProps };
-  for (const field of definition.propFields) {
-    if ((0, import_components.primitiveTypeForField)(field) === void 0) {
-      continue;
-    }
-    resolved[field.name] = resolveBindableField(node, field, definition, context, diagnostics);
-  }
-  return { props: resolved, diagnostics };
-}
-
-// src/renderer.tsx
-var import_jsx_runtime3 = require("react/jsx-runtime");
-function toPascalCase(str) {
-  if (!str) return "";
-  return str.replace(/[-_](\w)/g, (_, c) => c.toUpperCase()).replace(/^\w/, (c) => c.toUpperCase());
-}
-function getYouTubeId(url) {
-  if (!url || typeof url !== "string") return null;
-  const match = url.match(
-    /(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/\s]{11})/i
-  );
-  return match ? match[1] : null;
-}
-function getVimeoId(url) {
-  if (!url || typeof url !== "string") return null;
-  const match = url.match(
-    /(?:vimeo\.com\/(?:channels\/(?:\w+\/)?|groups\/([^\/]*)\/videos\/|album\/(\d+)\/video\/|video\/|))(\d+)/i
-  );
-  return match ? match[3] : null;
-}
-function aspectRatioToCss(ratio) {
-  if (ratio === "16:9") return "16 / 9";
-  if (ratio === "4:3") return "4 / 3";
-  if (ratio === "1:1") return "1 / 1";
-  if (ratio === "9:16") return "9 / 16";
-  if (typeof ratio === "string" && ratio !== "auto") return ratio.replace(":", " / ");
-  return void 0;
-}
-var EditableText = ({
-  as = "p",
-  id,
-  className,
-  style,
-  value,
-  isEditable,
-  nodeId,
-  onClick,
-  onChange,
-  ...rest
-}) => {
-  const isEditingRef = (0, import_react3.useRef)(false);
-  const Tag = as;
-  if (!isEditable) {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-      Tag,
-      {
-        id,
-        className,
-        style,
-        onClick,
-        "data-kubuild-node": nodeId,
-        ...rest,
-        children: value
-      }
-    );
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    Tag,
-    {
-      id,
-      className,
-      style: {
-        ...style,
-        outline: "none",
-        cursor: "text"
-      },
-      contentEditable: true,
-      suppressContentEditableWarning: true,
-      "data-kubuild-node": nodeId,
-      onClick: (e) => {
-        onClick?.(e);
-      },
-      onFocus: () => {
-        isEditingRef.current = true;
-      },
-      onInput: (e) => {
-        const text = e.currentTarget.textContent ?? "";
-        onChange?.(text, false);
-      },
-      onBlur: (e) => {
-        isEditingRef.current = false;
-        const text = e.currentTarget.textContent ?? "";
-        onChange?.(text, true);
-      },
-      onKeyDown: (e) => {
-        if (e.key === "Escape") {
-          e.currentTarget.blur();
-        }
-      },
-      ...rest,
-      children: value
-    }
-  );
-};
-var useIsomorphicLayoutEffect = typeof window !== "undefined" ? import_react3.useLayoutEffect : import_react3.useEffect;
-function transformEmbedHtml(rawHtml) {
-  if (!rawHtml) return "";
-  return rawHtml.replace(/<style\b([^>]*)>([\s\S]*?)<\/style>/gi, (_match, attrs, cssContent) => {
-    let transformedCss = cssContent;
-    transformedCss = transformedCss.replace(/(^|[\s,{}])body(?=[\s,{])/g, "$1:host, body");
-    transformedCss = transformedCss.replace(/(^|[\s,{}])html(?=[\s,{])/g, "$1:host, html");
-    return `<style${attrs}>
-:host { display: block; }
-${transformedCss}</style>`;
-  });
-}
-var HtmlEmbedView = ({
-  id,
-  style,
-  onClick,
-  dataKubuildNode,
-  html,
-  role
-}) => {
-  const hostRef = (0, import_react3.useRef)(null);
-  const shadowRootRef = (0, import_react3.useRef)(null);
-  const scopedHtml = (0, import_react3.useMemo)(() => transformEmbedHtml(html), [html]);
-  useIsomorphicLayoutEffect(() => {
-    const host = hostRef.current;
-    if (!host) return;
-    if (typeof host.attachShadow === "function") {
-      if (!shadowRootRef.current) {
-        if (host.shadowRoot) {
-          shadowRootRef.current = host.shadowRoot;
-        } else {
-          try {
-            shadowRootRef.current = host.attachShadow({ mode: "open" });
-          } catch {
-            shadowRootRef.current = host.shadowRoot;
-          }
-        }
-      }
-      if (shadowRootRef.current) {
-        shadowRootRef.current.innerHTML = scopedHtml;
-        return;
-      }
-    }
-    host.innerHTML = scopedHtml;
-  }, [scopedHtml]);
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    "div",
-    {
-      ref: hostRef,
-      id,
-      style,
-      onClick,
-      "data-kubuild-node": dataKubuildNode,
-      role,
-      children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-        "template",
-        {
-          shadowrootmode: "open",
-          dangerouslySetInnerHTML: { __html: scopedHtml }
-        }
-      )
-    }
-  );
-};
-function NodeRenderer({
-  node,
-  document,
-  registry,
-  context: propContext,
-  viewport = "desktop",
-  mode = "runtime",
-  onNodeClick,
-  onDiagnostic,
-  onActionDispatch,
-  onNodePropChange,
-  instanceSuffix = ""
-}) {
-  const context = propContext || DEFAULT_RENDER_CONTEXT;
-  const styles = resolveNodeStyles(node.styles, viewport);
-  const props = node.props || {};
-  const definition = registry.get(node.type);
-  const domId = instanceSuffix ? `${node.id}${instanceSuffix}` : node.id;
-  const { props: resolvedProps, diagnostics } = resolvePropsForNode(node, definition, context);
-  diagnostics.forEach((diagnostic) => {
-    onDiagnostic?.(diagnostic);
-    context?.onDiagnostic?.(diagnostic);
-  });
-  const handleClick = (e) => {
-    e.stopPropagation();
-    if (onNodeClick) {
-      onNodeClick(node.id, e);
-    }
-    if (props.action && !props.disabled) {
-      dispatchAction({
-        action: props.action,
-        nodeId: node.id,
-        document,
-        context,
-        onDiagnostic
-      });
-      if (onActionDispatch && (0, import_schema3.isActionBinding)(props.action)) {
-        onActionDispatch(props.action.type, resolveActionPayload(context, props.action.payload), node.id);
-      }
-    }
-  };
-  const childrenElements = node.children?.map((child) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    NodeRenderer,
-    {
-      node: child,
-      document,
-      registry,
-      context,
-      viewport,
-      mode,
-      onNodeClick,
-      onDiagnostic,
-      onActionDispatch,
-      onNodePropChange,
-      instanceSuffix
-    },
-    `${child.id}${instanceSuffix}`
-  ));
-  const renderNodeContent = () => {
-    if (definition?.renderer && typeof definition.renderer === "function") {
-      const CustomRenderer = definition.renderer;
-      try {
-        if (typeof CustomRenderer === "function" && !CustomRenderer.prototype?.isReactComponent) {
-          return CustomRenderer({
-            node,
-            document,
-            props: resolvedProps,
-            styles,
-            context,
-            children: childrenElements,
-            onClick: handleClick
-          });
-        }
-      } catch (err) {
-        throw err;
-      }
-      return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-        CustomRenderer,
-        {
-          node,
-          document,
-          props: resolvedProps,
-          styles,
-          context,
-          onClick: handleClick,
-          children: childrenElements
-        }
-      );
-    }
-    switch (node.type) {
-      case "page":
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { id: domId, style: styles, onClick: handleClick, "data-kubuild-node": node.id, children: childrenElements });
-      case "section":
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "section",
-          {
-            id: domId,
-            style: styles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            "aria-label": typeof resolvedProps.ariaLabel === "string" ? resolvedProps.ariaLabel : void 0,
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-            children: childrenElements
-          }
-        );
-      case "container":
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "div",
-          {
-            id: domId,
-            style: styles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-            children: childrenElements
-          }
-        );
-      case "columns":
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "div",
-          {
-            id: domId,
-            style: styles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-            children: childrenElements
-          }
-        );
-      case "heading": {
-        const rawLevel = typeof resolvedProps.level === "number" ? resolvedProps.level : typeof props.level === "number" ? props.level : 2;
-        const clampedLevel = Math.min(Math.max(rawLevel, 1), 6);
-        const text = String(resolvedProps.text ?? "");
-        const Tag = `h${clampedLevel}`;
-        const isEditable = mode === "editor" && !(0, import_schema3.isVariableBinding)(props.text);
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          EditableText,
-          {
-            as: Tag,
-            id: domId,
-            style: styles,
-            value: text,
-            isEditable,
-            nodeId: node.id,
-            onClick: handleClick,
-            onChange: (val, isBlur) => onNodePropChange?.(node.id, "text", val, isBlur),
-            "aria-label": typeof resolvedProps.ariaLabel === "string" ? resolvedProps.ariaLabel : void 0
-          }
-        );
-      }
-      case "text": {
-        const content2 = String(resolvedProps.content ?? "");
-        const isEditable = mode === "editor" && !(0, import_schema3.isVariableBinding)(props.content);
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          EditableText,
-          {
-            as: "p",
-            id: domId,
-            style: styles,
-            value: content2,
-            isEditable,
-            nodeId: node.id,
-            onClick: handleClick,
-            onChange: (val, isBlur) => onNodePropChange?.(node.id, "content", val, isBlur),
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0
-          }
-        );
-      }
-      case "paragraph": {
-        const text = String(resolvedProps.text ?? resolvedProps.content ?? props.text ?? props.content ?? "");
-        const isEditable = mode === "editor" && !(0, import_schema3.isVariableBinding)(props.text) && !(0, import_schema3.isVariableBinding)(props.content);
-        const propName = props.content !== void 0 ? "content" : "text";
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          EditableText,
-          {
-            as: "p",
-            id: domId,
-            style: styles,
-            value: text,
-            isEditable,
-            nodeId: node.id,
-            onClick: handleClick,
-            onChange: (val, isBlur) => onNodePropChange?.(node.id, propName, val, isBlur),
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0
-          }
-        );
-      }
-      case "link": {
-        const text = String(resolvedProps.text ?? props.text ?? "");
-        const rawHref = typeof resolvedProps.href === "string" ? resolvedProps.href : typeof props.href === "string" ? props.href : void 0;
-        const href = rawHref ? (0, import_core3.sanitizeUrl)(rawHref, "#") : "#";
-        const rawTarget = typeof resolvedProps.target === "string" ? resolvedProps.target : void 0;
-        const rawRel = typeof resolvedProps.rel === "string" ? resolvedProps.rel : void 0;
-        const rel = rawTarget === "_blank" && !rawRel ? "noopener noreferrer" : rawRel;
-        const isEditable = mode === "editor" && !(0, import_schema3.isVariableBinding)(props.text);
-        if (isEditable) {
-          return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-            EditableText,
-            {
-              as: "a",
-              id: domId,
-              href: void 0,
-              target: rawTarget,
-              rel,
-              style: styles,
-              value: text,
-              isEditable,
-              nodeId: node.id,
-              onClick: handleClick,
-              onChange: (val, isBlur) => onNodePropChange?.(node.id, "text", val, isBlur),
-              role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0
-            }
-          );
-        }
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "a",
-          {
-            id: domId,
-            href,
-            target: rawTarget,
-            rel,
-            style: styles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-            children: text
-          }
-        );
-      }
-      case "blockquote": {
-        const text = resolvedProps.text !== void 0 ? String(resolvedProps.text) : props.text !== void 0 ? String(props.text) : "";
-        const rawCite = typeof resolvedProps.cite === "string" ? resolvedProps.cite : typeof props.cite === "string" ? props.cite : void 0;
-        const safeCite = rawCite ? (0, import_core3.sanitizeUrl)(rawCite) : void 0;
-        const hasChildren = Boolean(childrenElements && childrenElements.length > 0);
-        const isEditable = mode === "editor" && !(0, import_schema3.isVariableBinding)(props.text);
-        if (hasChildren) {
-          return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-            "blockquote",
-            {
-              id: domId,
-              cite: safeCite,
-              style: styles,
-              onClick: handleClick,
-              "data-kubuild-node": node.id,
-              role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-              children: [
-                text ? isEditable ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                  EditableText,
-                  {
-                    as: "p",
-                    value: text,
-                    isEditable,
-                    nodeId: node.id,
-                    onClick: handleClick,
-                    onChange: (val, isBlur) => onNodePropChange?.(node.id, "text", val, isBlur)
-                  }
-                ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { children: text }) : null,
-                childrenElements
-              ]
-            }
-          );
-        }
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          EditableText,
-          {
-            as: "blockquote",
-            id: domId,
-            cite: safeCite,
-            style: styles,
-            value: text,
-            isEditable,
-            nodeId: node.id,
-            onClick: handleClick,
-            onChange: (val, isBlur) => onNodePropChange?.(node.id, "text", val, isBlur),
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0
-          }
-        );
-      }
-      case "badge": {
-        const text = String(resolvedProps.text ?? props.text ?? "Badge");
-        const variant = typeof resolvedProps.variant === "string" ? resolvedProps.variant : "default";
-        const isEditable = mode === "editor" && !(0, import_schema3.isVariableBinding)(props.text);
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          EditableText,
-          {
-            as: "span",
-            id: domId,
-            style: styles,
-            value: text,
-            isEditable,
-            nodeId: node.id,
-            "data-variant": variant,
-            onClick: handleClick,
-            onChange: (val, isBlur) => onNodePropChange?.(node.id, "text", val, isBlur),
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0
-          }
-        );
-      }
-      case "code-block": {
-        const code = String(resolvedProps.code ?? props.code ?? "");
-        const language = typeof resolvedProps.language === "string" ? resolvedProps.language : typeof props.language === "string" ? props.language : void 0;
-        const isEditable = mode === "editor" && !(0, import_schema3.isVariableBinding)(props.code);
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "pre",
-          {
-            id: domId,
-            style: styles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            "data-language": language,
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-              EditableText,
-              {
-                as: "code",
-                className: language ? `language-${language}` : void 0,
-                style: { fontFamily: "inherit", color: "inherit", display: "block", whiteSpace: "pre" },
-                value: code,
-                isEditable,
-                nodeId: node.id,
-                onClick: handleClick,
-                onChange: (val, isBlur) => onNodePropChange?.(node.id, "code", val, isBlur)
-              }
-            )
-          }
-        );
-      }
-      case "list": {
-        const rawTag = resolvedProps.tag;
-        const Tag = rawTag === "ol" ? "ol" : "ul";
-        const rawListStyle = resolvedProps.listStyleType;
-        const listStyleType = rawListStyle === "custom-icon" ? "none" : rawListStyle;
-        const listStyles = {
-          ...styles,
-          ...listStyleType ? { listStyleType } : {}
-        };
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          Tag,
-          {
-            id: domId,
-            style: listStyles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            "data-list-style": rawListStyle,
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-            children: childrenElements
-          }
-        );
-      }
-      case "list-item": {
-        const text = resolvedProps.text !== void 0 ? String(resolvedProps.text) : "";
-        const hasChildren = Boolean(childrenElements && childrenElements.length > 0);
-        const isEditable = mode === "editor" && !(0, import_schema3.isVariableBinding)(props.text);
-        if (hasChildren) {
-          return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-            "li",
-            {
-              id: domId,
-              style: styles,
-              onClick: handleClick,
-              "data-kubuild-node": node.id,
-              role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-              children: [
-                text ? isEditable ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                  EditableText,
-                  {
-                    as: "span",
-                    value: text,
-                    isEditable,
-                    nodeId: node.id,
-                    onClick: handleClick,
-                    onChange: (val, isBlur) => onNodePropChange?.(node.id, "text", val, isBlur)
-                  }
-                ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: text }) : null,
-                childrenElements
-              ]
-            }
-          );
-        }
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          EditableText,
-          {
-            as: "li",
-            id: domId,
-            style: styles,
-            value: text,
-            isEditable,
-            nodeId: node.id,
-            onClick: handleClick,
-            onChange: (val, isBlur) => onNodePropChange?.(node.id, "text", val, isBlur),
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0
-          }
-        );
-      }
-      case "table": {
-        const isStriped = resolvedProps.striped === true;
-        const isBordered = resolvedProps.bordered !== false;
-        const isCompact = resolvedProps.compact === true;
-        const tableStyles = {
-          width: "100%",
-          borderCollapse: "collapse",
-          ...styles,
-          ...isBordered ? { border: styles.border || "1px solid #e2e8f0" } : {}
-        };
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "table",
-          {
-            id: domId,
-            style: tableStyles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            "data-striped": isStriped ? "true" : void 0,
-            "data-bordered": isBordered ? "true" : void 0,
-            "data-compact": isCompact ? "true" : void 0,
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("tbody", { children: childrenElements })
-          }
-        );
-      }
-      case "table-row": {
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "tr",
-          {
-            id: domId,
-            style: styles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-            children: childrenElements
-          }
-        );
-      }
-      case "table-cell": {
-        const rawTag = resolvedProps.tag;
-        const Tag = rawTag === "th" ? "th" : "td";
-        const colSpan = typeof resolvedProps.colSpan === "number" && resolvedProps.colSpan > 1 ? resolvedProps.colSpan : void 0;
-        const rowSpan = typeof resolvedProps.rowSpan === "number" && resolvedProps.rowSpan > 1 ? resolvedProps.rowSpan : void 0;
-        const text = resolvedProps.text !== void 0 ? String(resolvedProps.text) : "";
-        const hasChildren = Boolean(childrenElements && childrenElements.length > 0);
-        const isEditable = mode === "editor" && !(0, import_schema3.isVariableBinding)(props.text);
-        const cellStyles = {
-          padding: "8px 12px",
-          border: "1px solid #e2e8f0",
-          textAlign: "left",
-          ...styles,
-          ...Tag === "th" ? {
-            fontWeight: styles.fontWeight || "600",
-            backgroundColor: styles.backgroundColor || "#f8fafc"
-          } : {}
-        };
-        if (hasChildren) {
-          return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-            Tag,
-            {
-              id: domId,
-              colSpan,
-              rowSpan,
-              style: cellStyles,
-              onClick: handleClick,
-              "data-kubuild-node": node.id,
-              role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-              children: [
-                text ? isEditable ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                  EditableText,
-                  {
-                    as: "span",
-                    value: text,
-                    isEditable,
-                    nodeId: node.id,
-                    onClick: handleClick,
-                    onChange: (val, isBlur) => onNodePropChange?.(node.id, "text", val, isBlur)
-                  }
-                ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: text }) : null,
-                childrenElements
-              ]
-            }
-          );
-        }
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          EditableText,
-          {
-            as: Tag,
-            id: domId,
-            colSpan,
-            rowSpan,
-            style: cellStyles,
-            value: text,
-            isEditable,
-            nodeId: node.id,
-            onClick: handleClick,
-            onChange: (val, isBlur) => onNodePropChange?.(node.id, "text", val, isBlur),
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0
-          }
-        );
-      }
-      case "image": {
-        const rawSrc = typeof resolvedProps.src === "string" && resolvedProps.src.length > 0 ? resolvedProps.src : void 0;
-        const directSrc = rawSrc ?? void 0;
-        const asset = (0, import_schema3.isAssetReference)(props.asset) ? props.asset : void 0;
-        const resolvedSrc = !directSrc && asset && context?.assetProvider ? resolveAssetSync(context.assetProvider, asset.assetId) : void 0;
-        const fallbackSrc = asset?.fallbackUrl;
-        const rawUrl = directSrc || resolvedSrc || fallbackSrc;
-        const safeSrc = rawUrl ? (0, import_core3.sanitizeUrl)(rawUrl, "", { allowBlobMedia: true }) : void 0;
-        const alt = typeof resolvedProps.alt === "string" ? resolvedProps.alt : "";
-        const loading = resolvedProps.loading === "eager" ? "eager" : "lazy";
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "img",
-          {
-            id: domId,
-            src: safeSrc || void 0,
-            alt,
-            role: alt.length === 0 ? "presentation" : void 0,
-            loading,
-            width: resolvedProps.width,
-            height: resolvedProps.height,
-            style: styles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id
-          }
-        );
-      }
-      case "video": {
-        const rawSrc = typeof resolvedProps.src === "string" ? resolvedProps.src : typeof props.src === "string" ? props.src : "";
-        const provider = typeof resolvedProps.provider === "string" ? resolvedProps.provider : typeof props.provider === "string" ? props.provider : "auto";
-        const rawPoster = typeof resolvedProps.poster === "string" ? resolvedProps.poster : typeof props.poster === "string" ? props.poster : void 0;
-        const poster = rawPoster ? (0, import_core3.sanitizeUrl)(rawPoster) : void 0;
-        const controls = resolvedProps.controls !== false && props.controls !== false;
-        const autoplay = resolvedProps.autoplay === true || props.autoplay === true;
-        const loop = resolvedProps.loop === true || props.loop === true;
-        const muted = resolvedProps.muted === true || props.muted === true;
-        const aspectRatio = aspectRatioToCss(resolvedProps.aspectRatio ?? props.aspectRatio ?? "16:9");
-        const ytId = provider === "youtube" ? getYouTubeId(rawSrc) || rawSrc : provider === "auto" ? getYouTubeId(rawSrc) : null;
-        const vimeoId = provider === "vimeo" ? getVimeoId(rawSrc) || rawSrc : provider === "auto" ? getVimeoId(rawSrc) : null;
-        const videoStyles = {
-          width: "100%",
-          maxWidth: "100%",
-          display: "block",
-          ...aspectRatio ? { aspectRatio } : {},
-          ...styles
-        };
-        if (ytId) {
-          const autoplayParam = autoplay ? "1" : "0";
-          const loopParam = loop ? `1&playlist=${ytId}` : "0";
-          const muteParam = muted ? "1" : "0";
-          const controlsParam = controls ? "1" : "0";
-          const embedUrl = `https://www.youtube.com/embed/${ytId}?autoplay=${autoplayParam}&loop=${loopParam}&mute=${muteParam}&controls=${controlsParam}`;
-          return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-            "div",
-            {
-              id: domId,
-              style: { ...videoStyles, position: "relative", overflow: "hidden" },
-              onClick: handleClick,
-              "data-kubuild-node": node.id,
-              "data-video-provider": "youtube",
-              role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-              children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                "iframe",
-                {
-                  src: embedUrl,
-                  title: "YouTube video",
-                  style: { width: "100%", height: "100%", border: "none", minHeight: "240px" },
-                  allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",
-                  allowFullScreen: true
-                }
-              )
-            }
-          );
-        }
-        if (vimeoId) {
-          const autoplayParam = autoplay ? "1" : "0";
-          const loopParam = loop ? "1" : "0";
-          const muteParam = muted ? "1" : "0";
-          const embedUrl = `https://player.vimeo.com/video/${vimeoId}?autoplay=${autoplayParam}&loop=${loopParam}&muted=${muteParam}`;
-          return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-            "div",
-            {
-              id: domId,
-              style: { ...videoStyles, position: "relative", overflow: "hidden" },
-              onClick: handleClick,
-              "data-kubuild-node": node.id,
-              "data-video-provider": "vimeo",
-              role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0,
-              children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                "iframe",
-                {
-                  src: embedUrl,
-                  title: "Vimeo video",
-                  style: { width: "100%", height: "100%", border: "none", minHeight: "240px" },
-                  allow: "autoplay; fullscreen; picture-in-picture",
-                  allowFullScreen: true
-                }
-              )
-            }
-          );
-        }
-        const safeSrc = (0, import_core3.sanitizeUrl)(rawSrc, "", { allowBlobMedia: true });
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "video",
-          {
-            id: domId,
-            src: safeSrc || void 0,
-            poster: poster || void 0,
-            controls,
-            autoPlay: autoplay,
-            loop,
-            muted,
-            style: videoStyles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            "data-video-provider": "html5",
-            playsInline: true,
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0
-          }
-        );
-      }
-      case "icon": {
-        const name = typeof resolvedProps.name === "string" && resolvedProps.name.trim().length > 0 ? resolvedProps.name.trim() : typeof props.name === "string" && props.name.trim().length > 0 ? props.name.trim() : "star";
-        const size = typeof resolvedProps.size === "number" ? resolvedProps.size : typeof props.size === "number" ? props.size : 24;
-        const color = typeof resolvedProps.color === "string" ? resolvedProps.color : typeof props.color === "string" ? props.color : "currentColor";
-        const strokeWidth = typeof resolvedProps.strokeWidth === "number" ? resolvedProps.strokeWidth : typeof props.strokeWidth === "number" ? props.strokeWidth : 2;
-        const pascalName = toPascalCase(name);
-        const IconComponent = import_lucide_react2.icons[pascalName];
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "span",
-          {
-            id: domId,
-            style: { display: "inline-flex", alignItems: "center", justifyContent: "center", color, ...styles },
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            "data-icon-name": name,
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : "img",
-            "aria-label": typeof resolvedProps.ariaLabel === "string" ? resolvedProps.ariaLabel : name,
-            children: IconComponent ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(IconComponent, { size, color, strokeWidth }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("polygon", { points: "12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2" }) })
-          }
-        );
-      }
-      case "html-embed": {
-        const rawHtml = typeof resolvedProps.html === "string" ? resolvedProps.html : typeof props.html === "string" ? props.html : "";
-        const sanitized = (0, import_core3.sanitizeHtml)(rawHtml);
-        if (mode === "editor" && !rawHtml.trim()) {
-          return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-            "div",
-            {
-              id: domId,
-              style: {
-                padding: "16px",
-                border: "2px dashed #94a3b8",
-                borderRadius: "8px",
-                backgroundColor: "#f8fafc",
-                color: "#64748b",
-                textAlign: "center",
-                fontSize: "13px",
-                fontFamily: "sans-serif",
-                ...styles
-              },
-              onClick: handleClick,
-              "data-kubuild-node": node.id,
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { style: { fontWeight: 600 }, children: "</> HTML Embed" }),
-                /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { style: { fontSize: "11px", marginTop: "4px" }, children: "Click to configure HTML code in Inspector Panel" })
-              ]
-            }
-          );
-        }
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          HtmlEmbedView,
-          {
-            id: domId,
-            style: styles,
-            onClick: handleClick,
-            dataKubuildNode: node.id,
-            html: sanitized,
-            role: typeof resolvedProps.role === "string" ? resolvedProps.role : void 0
-          }
-        );
-      }
-      case "button": {
-        const label = String(resolvedProps.label ?? "Button");
-        const disabled = resolvedProps.disabled === true;
-        const rawHref = typeof resolvedProps.href === "string" ? resolvedProps.href : void 0;
-        const href = rawHref ? (0, import_core3.sanitizeUrl)(rawHref, "#") : void 0;
-        const rawTarget = typeof resolvedProps.target === "string" ? resolvedProps.target : void 0;
-        const rawRel = typeof resolvedProps.rel === "string" ? resolvedProps.rel : void 0;
-        const rel = rawTarget === "_blank" && !rawRel ? "noopener noreferrer" : rawRel;
-        const action = (0, import_schema3.isActionBinding)(props.action) ? props.action : void 0;
-        const actionResolved = action ? isActionRegistered(context?.actionRegistry, action.type) : void 0;
-        const actionAttrs = action ? { "data-kubuild-action": action.type, "data-kubuild-action-resolved": actionResolved } : {};
-        const ariaLabel = typeof resolvedProps.ariaLabel === "string" ? resolvedProps.ariaLabel : void 0;
-        const isEditable = mode === "editor" && !(0, import_schema3.isVariableBinding)(props.label);
-        const rawButtonType = typeof resolvedProps.buttonType === "string" ? resolvedProps.buttonType : "button";
-        const buttonType = rawButtonType === "submit" || rawButtonType === "reset" ? rawButtonType : "button";
-        if (href && !disabled) {
-          if (isEditable) {
-            return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-              EditableText,
-              {
-                as: "a",
-                id: domId,
-                href: mode === "editor" ? void 0 : href,
-                target: rawTarget,
-                rel,
-                style: styles,
-                value: label,
-                isEditable,
-                nodeId: node.id,
-                onClick: handleClick,
-                onChange: (val, isBlur) => onNodePropChange?.(node.id, "label", val, isBlur),
-                "aria-label": ariaLabel,
-                tabIndex: 0,
-                ...actionAttrs
-              }
-            );
-          }
-          return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-            "a",
-            {
-              id: domId,
-              href,
-              target: rawTarget,
-              rel,
-              style: styles,
-              onClick: handleClick,
-              "data-kubuild-node": node.id,
-              "aria-label": ariaLabel,
-              tabIndex: 0,
-              ...actionAttrs,
-              children: label
-            }
-          );
-        }
-        if (isEditable) {
-          return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-            EditableText,
-            {
-              as: "button",
-              id: domId,
-              type: mode === "editor" ? "button" : buttonType,
-              disabled,
-              "aria-disabled": disabled ? true : void 0,
-              "aria-label": ariaLabel,
-              tabIndex: disabled ? -1 : 0,
-              style: styles,
-              value: label,
-              isEditable,
-              nodeId: node.id,
-              onClick: disabled ? void 0 : handleClick,
-              onChange: (val, isBlur) => onNodePropChange?.(node.id, "label", val, isBlur),
-              ...actionAttrs
-            }
-          );
-        }
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "button",
-          {
-            id: domId,
-            type: mode === "editor" ? "button" : buttonType,
-            disabled,
-            "aria-disabled": disabled ? true : void 0,
-            "aria-label": ariaLabel,
-            tabIndex: disabled ? -1 : 0,
-            style: styles,
-            onClick: disabled ? void 0 : handleClick,
-            "data-kubuild-node": node.id,
-            ...actionAttrs,
-            children: label
-          }
-        );
-      }
-      case "form": {
-        const action = typeof resolvedProps.action === "string" ? resolvedProps.action : void 0;
-        const method = typeof resolvedProps.method === "string" ? resolvedProps.method : "POST";
-        const target = typeof resolvedProps.target === "string" ? resolvedProps.target : void 0;
-        const autoComplete = typeof resolvedProps.autoComplete === "string" ? resolvedProps.autoComplete : void 0;
-        const name = typeof resolvedProps.name === "string" ? resolvedProps.name : void 0;
-        const handleSubmit = (e) => {
-          if (mode === "editor") {
-            e.preventDefault();
-          }
-        };
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "form",
-          {
-            id: domId,
-            name,
-            action: action && mode !== "editor" ? (0, import_core3.sanitizeUrl)(action, "") : void 0,
-            method,
-            target,
-            autoComplete,
-            style: styles,
-            onClick: handleClick,
-            onSubmit: handleSubmit,
-            "data-kubuild-node": node.id,
-            role: "form",
-            "aria-label": name,
-            children: childrenElements
-          }
-        );
-      }
-      case "input": {
-        const name = typeof resolvedProps.name === "string" ? resolvedProps.name : void 0;
-        const inputType = typeof resolvedProps.type === "string" ? resolvedProps.type : "text";
-        const placeholder = typeof resolvedProps.placeholder === "string" ? resolvedProps.placeholder : void 0;
-        const defaultValue = resolvedProps.defaultValue !== void 0 ? String(resolvedProps.defaultValue) : void 0;
-        const required = resolvedProps.required === true;
-        const disabled = resolvedProps.disabled === true;
-        const readOnly = resolvedProps.readOnly === true;
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "input",
-          {
-            id: domId,
-            type: inputType,
-            name,
-            placeholder,
-            defaultValue,
-            required,
-            disabled,
-            readOnly,
-            style: styles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id
-          }
-        );
-      }
-      case "textarea": {
-        const name = typeof resolvedProps.name === "string" ? resolvedProps.name : void 0;
-        const placeholder = typeof resolvedProps.placeholder === "string" ? resolvedProps.placeholder : void 0;
-        const defaultValue = resolvedProps.defaultValue !== void 0 ? String(resolvedProps.defaultValue) : void 0;
-        const rows = typeof resolvedProps.rows === "number" ? resolvedProps.rows : 4;
-        const required = resolvedProps.required === true;
-        const disabled = resolvedProps.disabled === true;
-        const readOnly = resolvedProps.readOnly === true;
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "textarea",
-          {
-            id: domId,
-            name,
-            placeholder,
-            defaultValue,
-            rows,
-            required,
-            disabled,
-            readOnly,
-            style: styles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id
-          }
-        );
-      }
-      case "select": {
-        const name = typeof resolvedProps.name === "string" ? resolvedProps.name : void 0;
-        const placeholder = typeof resolvedProps.placeholder === "string" ? resolvedProps.placeholder : void 0;
-        const defaultValue = resolvedProps.defaultValue !== void 0 ? String(resolvedProps.defaultValue) : void 0;
-        const required = resolvedProps.required === true;
-        const disabled = resolvedProps.disabled === true;
-        let optionsList = [];
-        const rawOptions = resolvedProps.options ?? props.options;
-        if (Array.isArray(rawOptions)) {
-          optionsList = rawOptions.map((opt) => {
-            if (typeof opt === "object" && opt !== null) {
-              const record = opt;
-              return {
-                label: String(record.label ?? record.value ?? ""),
-                value: String(record.value ?? record.label ?? "")
-              };
-            }
-            return { label: String(opt), value: String(opt) };
-          });
-        } else if (typeof rawOptions === "string") {
-          try {
-            const parsed = JSON.parse(rawOptions);
-            if (Array.isArray(parsed)) {
-              optionsList = parsed.map((opt) => {
-                if (typeof opt === "object" && opt !== null) {
-                  const record = opt;
-                  return {
-                    label: String(record.label ?? record.value ?? ""),
-                    value: String(record.value ?? record.label ?? "")
-                  };
-                }
-                return { label: String(opt), value: String(opt) };
-              });
-            }
-          } catch {
-          }
-        }
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-          "select",
-          {
-            id: domId,
-            name,
-            defaultValue,
-            required,
-            disabled,
-            style: styles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            children: [
-              placeholder && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: "", disabled: required, children: placeholder }),
-              optionsList.map((opt, idx) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("option", { value: opt.value, children: opt.label }, `${opt.value}-${idx}`))
-            ]
-          }
-        );
-      }
-      case "checkbox": {
-        const name = typeof resolvedProps.name === "string" ? resolvedProps.name : void 0;
-        const label = String(resolvedProps.label ?? "Checkbox");
-        const value = resolvedProps.value !== void 0 ? String(resolvedProps.value) : "yes";
-        const defaultChecked = resolvedProps.defaultChecked === true;
-        const required = resolvedProps.required === true;
-        const disabled = resolvedProps.disabled === true;
-        const isEditable = mode === "editor" && !(0, import_schema3.isVariableBinding)(props.label);
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-          "label",
-          {
-            id: domId,
-            style: styles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                "input",
-                {
-                  type: "checkbox",
-                  name,
-                  value,
-                  defaultChecked,
-                  required,
-                  disabled,
-                  style: { cursor: disabled ? "not-allowed" : "pointer" }
-                }
-              ),
-              isEditable ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                EditableText,
-                {
-                  as: "span",
-                  value: label,
-                  isEditable,
-                  nodeId: node.id,
-                  onChange: (val, isBlur) => onNodePropChange?.(node.id, "label", val, isBlur)
-                }
-              ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: label })
-            ]
-          }
-        );
-      }
-      case "radio": {
-        const name = typeof resolvedProps.name === "string" ? resolvedProps.name : void 0;
-        const label = String(resolvedProps.label ?? "Radio");
-        const value = resolvedProps.value !== void 0 ? String(resolvedProps.value) : "option";
-        const defaultChecked = resolvedProps.defaultChecked === true;
-        const required = resolvedProps.required === true;
-        const disabled = resolvedProps.disabled === true;
-        const isEditable = mode === "editor" && !(0, import_schema3.isVariableBinding)(props.label);
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-          "label",
-          {
-            id: domId,
-            style: styles,
-            onClick: handleClick,
-            "data-kubuild-node": node.id,
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                "input",
-                {
-                  type: "radio",
-                  name,
-                  value,
-                  defaultChecked,
-                  required,
-                  disabled,
-                  style: { cursor: disabled ? "not-allowed" : "pointer" }
-                }
-              ),
-              isEditable ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-                EditableText,
-                {
-                  as: "span",
-                  value: label,
-                  isEditable,
-                  nodeId: node.id,
-                  onChange: (val, isBlur) => onNodePropChange?.(node.id, "label", val, isBlur)
-                }
-              ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: label })
-            ]
-          }
-        );
-      }
-      case "collection": {
-        const sourceKey = typeof props.sourceKey === "string" ? props.sourceKey : void 0;
-        const itemAlias = typeof props.itemAlias === "string" && props.itemAlias.length > 0 ? props.itemAlias : "item";
-        const indexKey = `${itemAlias}Index`;
-        const sourceValue = sourceKey ? (0, import_core3.resolveBinding)({ key: sourceKey }, context).value : void 0;
-        if (!Array.isArray(sourceValue)) {
-          const collectionDiagnostic = {
-            code: "INVALID_COLLECTION_SOURCE",
-            nodeId: node.id,
-            propName: "sourceKey",
-            message: `Collection node "${node.id}" expected an array at variable path "${sourceKey ?? "(missing sourceKey)"}" but found ${sourceValue === void 0 ? "nothing" : typeof sourceValue}.`
-          };
-          onDiagnostic?.(collectionDiagnostic);
-          context?.onDiagnostic?.(collectionDiagnostic);
-          if (mode === "editor") {
-            return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-              "div",
-              {
-                id: domId,
-                "data-kubuild-node": node.id,
-                "data-kubuild-collection-invalid": node.type,
-                style: {
-                  ...styles,
-                  border: "2px dashed #f59e0b",
-                  backgroundColor: "#fffbeb",
-                  color: "#92400e",
-                  padding: "12px",
-                  borderRadius: "6px",
-                  fontFamily: "system-ui, -apple-system, sans-serif"
-                },
-                onClick: handleClick,
-                children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { fontWeight: 600, fontSize: "13px", display: "flex", alignItems: "center", gap: "6px" }, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react2.Package, { size: 14, "aria-hidden": "true" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { children: [
-                    "Collection: expected an array at ",
-                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("code", { children: sourceKey ?? "(missing sourceKey)" })
-                  ] })
-                ] })
-              }
-            );
-          }
-          return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { id: domId, "data-kubuild-node": node.id, style: styles, onClick: handleClick, "aria-hidden": "true" });
-        }
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { id: domId, "data-kubuild-node": node.id, style: styles, onClick: handleClick, children: sourceValue.map((item, index) => {
-          const childContext = {
-            ...context,
-            variables: { ...context?.variables ?? {}, [itemAlias]: item, [indexKey]: index }
-          };
-          const itemSuffix = `${instanceSuffix}--${index}`;
-          return node.children?.map((child) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-            NodeRenderer,
-            {
-              node: child,
-              document,
-              registry,
-              context: childContext,
-              viewport,
-              mode,
-              onNodeClick,
-              onDiagnostic,
-              onActionDispatch,
-              onNodePropChange,
-              instanceSuffix: itemSuffix
-            },
-            `${child.id}${itemSuffix}`
-          ));
-        }) });
-      }
-      default:
-        if (mode === "editor") {
-          return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-            "div",
-            {
-              id: domId,
-              "data-kubuild-node": node.id,
-              "data-kubuild-unknown": node.type,
-              style: {
-                ...styles,
-                border: "2px dashed #f59e0b",
-                backgroundColor: "#fffbeb",
-                color: "#92400e",
-                padding: "12px",
-                borderRadius: "6px",
-                fontFamily: "system-ui, -apple-system, sans-serif"
-              },
-              onClick: handleClick,
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { fontWeight: 600, fontSize: "13px", marginBottom: "4px", display: "flex", alignItems: "center", gap: "6px" }, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react2.Puzzle, { size: 14, "aria-hidden": "true" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { children: [
-                    "Unknown Component: ",
-                    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("code", { children: node.type })
-                  ] })
-                ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { fontSize: "11px", color: "#b45309", marginBottom: childrenElements ? "8px" : 0 }, children: [
-                  "Node ID: ",
-                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("code", { children: node.id })
-                ] }),
-                childrenElements
-              ]
-            }
-          );
-        }
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          "div",
-          {
-            id: domId,
-            "data-kubuild-node": node.id,
-            "data-kubuild-unknown": node.type,
-            style: styles,
-            onClick: handleClick,
-            children: childrenElements
-          }
-        );
-    }
-  };
-  let content;
-  try {
-    content = renderNodeContent();
-  } catch (error) {
-    if (mode === "editor") {
-      content = /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
-        "div",
-        {
-          "data-kubuild-node": node.id,
-          "data-kubuild-error": node.type,
-          style: {
-            padding: "12px 16px",
-            margin: "4px 0",
-            backgroundColor: "#fef2f2",
-            border: "1px solid #ef4444",
-            borderRadius: "6px",
-            color: "#b91c1c",
-            fontFamily: "system-ui, -apple-system, sans-serif",
-            fontSize: "13px",
-            lineHeight: "1.4"
-          },
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { fontWeight: 600, marginBottom: "4px", display: "flex", alignItems: "center", gap: "6px" }, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react2.AlertTriangle, { size: 14, "aria-hidden": "true" }),
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("span", { children: [
-                "Component Render Error: <",
-                node.type,
-                ">"
-              ] })
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { fontSize: "11px", color: "#7f1d1d", wordBreak: "break-all" }, children: [
-              "Node ID: ",
-              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("code", { children: node.id }),
-              " \u2014 ",
-              error instanceof Error ? error.message : String(error)
-            ] })
-          ]
-        }
-      );
-    } else {
-      content = /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-        "div",
-        {
-          "data-kubuild-node": node.id,
-          "data-kubuild-error": node.type,
-          style: { display: "none" },
-          "aria-hidden": "true"
-        }
-      );
-    }
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ComponentErrorBoundary, { nodeId: node.id, componentType: node.type, mode, children: content });
-}
-var KubuildRenderer = ({
-  document,
-  registry = (0, import_components2.createDefaultComponentRegistry)(),
-  context,
-  viewport = "desktop",
-  mode = "runtime",
-  className,
-  onNodeClick,
-  onDiagnostic,
-  onActionDispatch,
-  onNodePropChange
-}) => {
-  if (!document || !document.document) {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className, children: "Empty Document" });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(RenderContextProvider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: `kubuild-canvas-root ${className || ""}`, children: [
-    (() => {
-      const css = collectStateStylesCss(document);
-      return css ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("style", { "data-kubuild-state-styles": true, children: css }) : null;
-    })(),
-    (() => {
-      const animCss = collectAnimationStylesCss(document);
-      return animCss ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("style", { "data-kubuild-animation-styles": true, children: animCss }) : null;
-    })(),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-      NodeRenderer,
-      {
-        node: document.document,
-        document,
-        registry,
-        context,
-        viewport,
-        mode,
-        onNodeClick,
-        onDiagnostic,
-        onActionDispatch,
-        onNodePropChange
-      }
-    )
-  ] }) });
-};
+`.trim();function Ne(o){return o.replace(/["\\\]]/g,"\\$&")}function Ut(o,e){let i=Ne(o),r=[];switch(e){case"lift":r.push(`[data-kubuild-node="${i}"] { transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease !important; will-change: transform; }`,`[data-kubuild-node="${i}"]:hover { transform: translateY(-4px) !important; box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1) !important; }`);break;case"scale":r.push(`[data-kubuild-node="${i}"] { transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important; will-change: transform; }`,`[data-kubuild-node="${i}"]:hover { transform: scale(1.04) !important; }`);break;case"glow":r.push(`[data-kubuild-node="${i}"] { transition: box-shadow 0.25s ease !important; }`,`[data-kubuild-node="${i}"]:hover { box-shadow: 0 0 20px 2px rgba(59, 130, 246, 0.5) !important; }`);break;case"tilt":r.push(`[data-kubuild-node="${i}"] { transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important; will-change: transform; }`,`[data-kubuild-node="${i}"]:hover { transform: rotate(2deg) scale(1.02) !important; }`);break;default:break}return r}function Wt(o,e){let i=Ne(o),r=[];switch(e){case"pulse":r.push(`[data-kubuild-node="${i}"] { animation: kb-loop-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite !important; }`);break;case"bounce":r.push(`[data-kubuild-node="${i}"] { animation: kb-loop-bounce 1.5s ease-in-out infinite !important; }`);break;case"spin":r.push(`[data-kubuild-node="${i}"] { animation: kb-loop-spin 3s linear infinite !important; }`);break;case"float":r.push(`[data-kubuild-node="${i}"] { animation: kb-loop-float 3s ease-in-out infinite !important; }`);break;case"shimmer":r.push(`[data-kubuild-node="${i}"] { animation: kb-loop-shimmer 2s ease-in-out infinite !important; }`);break;default:break}return r}function Kt(o,e){if(!e.type||e.type==="none")return[];let i=Ne(o),r=typeof e.duration=="number"?e.duration:600,n=typeof e.delay=="number"?e.delay:0,t=e.easing||"ease-out";return[`[data-kubuild-node="${i}"] { animation-name: kb-anim-${e.type} !important; animation-duration: ${r}ms !important; animation-delay: ${n}ms !important; animation-timing-function: ${t} !important; animation-fill-mode: both !important; }`]}function Ce(o){if(!o?.document)return"";let e=[],i=!1,r=n=>{let t=n.animation;t&&(t.hoverEffect&&t.hoverEffect!=="none"&&(e.push(...Ut(n.id,t.hoverEffect)),i=!0),t.loopEffect&&t.loopEffect!=="none"&&(e.push(...Wt(n.id,t.loopEffect)),i=!0),t.type&&t.type!=="none"&&(e.push(...Kt(n.id,t)),i=!0)),n.children?.forEach(r)};return r(o.document),i?`${zt}
 
-// src/preview-adapter.tsx
-var import_react4 = require("react");
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var DEFAULT_VIEWPORT_CONFIGS = Object.freeze({
-  desktop: {
-    width: "100%",
-    maxWidth: "1280px",
-    minHeight: "600px",
-    label: "Desktop (1280px)",
-    isFluid: true
-  },
-  tablet: {
-    width: "768px",
-    height: "1024px",
-    minHeight: "600px",
-    label: "Tablet (768 \xD7 1024)",
-    isFluid: false
-  },
-  mobile: {
-    width: "375px",
-    height: "667px",
-    minHeight: "500px",
-    label: "Mobile (375 \xD7 667)",
-    isFluid: false
-  }
-});
-var DEFAULT_BREAKPOINTS = Object.freeze({
-  mobile: 480,
-  tablet: 768,
-  desktop: 1024
-});
-function resolveViewportFromWidth(width, breakpoints) {
-  const resolved = { ...DEFAULT_BREAKPOINTS, ...breakpoints };
-  if (width <= resolved.mobile) {
-    return "mobile";
-  }
-  if (width <= resolved.tablet) {
-    return "tablet";
-  }
-  return "desktop";
-}
-function resolveViewportDimensions(viewport, customConfigs) {
-  const baseConfig = DEFAULT_VIEWPORT_CONFIGS[viewport] || DEFAULT_VIEWPORT_CONFIGS.desktop;
-  const custom = customConfigs?.[viewport];
-  return { ...baseConfig, ...custom };
-}
-function resolveViewportContainerStyle(viewport, customConfigs, customScale) {
-  const config = resolveViewportDimensions(viewport, customConfigs);
-  const scale = customScale ?? config.scale ?? 1;
-  const toCssVal = (v) => typeof v === "number" ? `${v}px` : v;
-  const style = {
-    width: toCssVal(config.width),
-    maxWidth: toCssVal(config.maxWidth),
-    minWidth: toCssVal(config.minWidth),
-    height: toCssVal(config.height),
-    minHeight: toCssVal(config.minHeight),
-    maxHeight: toCssVal(config.maxHeight),
-    aspectRatio: config.aspectRatio,
-    transition: "width 0.2s ease, max-width 0.2s ease, height 0.2s ease"
-  };
-  if (scale !== 1) {
-    style.transform = `scale(${scale})`;
-    style.transformOrigin = "top center";
-  }
-  return style;
-}
-var PreviewViewportAdapter = ({
-  document,
-  viewport = "desktop",
-  onViewportChange,
-  viewportConfigs,
-  breakpoints,
-  registry,
-  context,
-  mode = "runtime",
-  showChrome = false,
-  chromeTitle,
-  editorOverlay,
-  scale,
-  className,
-  style,
-  canvasClassName,
-  canvasStyle,
-  onNodeClick,
-  onDiagnostic,
-  onActionDispatch
-}) => {
-  const currentConfig = (0, import_react4.useMemo)(
-    () => resolveViewportDimensions(viewport, viewportConfigs),
-    [viewport, viewportConfigs]
-  );
-  const containerStyle = (0, import_react4.useMemo)(
-    () => resolveViewportContainerStyle(viewport, viewportConfigs, scale),
-    [viewport, viewportConfigs, scale]
-  );
-  const mergedCanvasStyle = (0, import_react4.useMemo)(
-    () => ({
-      ...containerStyle,
-      ...canvasStyle,
-      position: "relative",
-      boxSizing: "border-box"
-    }),
-    [containerStyle, canvasStyle]
-  );
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-    "div",
-    {
-      "data-kubuild-preview-container": true,
-      "data-viewport": viewport,
-      className: `kubuild-preview-viewport-adapter ${className || ""}`,
-      style: {
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        justifyContent: "flex-start",
-        width: "100%",
-        height: "100%",
-        boxSizing: "border-box",
-        ...style
-      },
-      children: [
-        showChrome && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-          "div",
-          {
-            "data-kubuild-preview-chrome": true,
-            style: {
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "space-between",
-              width: "100%",
-              maxWidth: containerStyle.maxWidth || containerStyle.width,
-              padding: "8px 12px",
-              marginBottom: "8px",
-              backgroundColor: "#1e293b",
-              color: "#f8fafc",
-              borderRadius: "8px",
-              fontSize: "12px",
-              fontFamily: "system-ui, -apple-system, sans-serif",
-              boxSizing: "border-box"
-            },
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { style: { fontWeight: 600 }, children: chromeTitle || document.metadata?.title || "Preview" }),
-                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-                  "span",
-                  {
-                    "data-testid": "viewport-badge",
-                    style: {
-                      fontSize: "10px",
-                      padding: "2px 6px",
-                      borderRadius: "4px",
-                      backgroundColor: "#334155",
-                      color: "#94a3b8",
-                      textTransform: "uppercase",
-                      fontWeight: 700
-                    },
-                    children: viewport
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { style: { fontSize: "11px", color: "#64748b" }, children: currentConfig.label || `${currentConfig.width} \xD7 ${currentConfig.height || "auto"}` })
-              ] }),
-              onViewportChange && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-                "div",
-                {
-                  "data-testid": "viewport-switcher",
-                  style: { display: "flex", gap: "4px", backgroundColor: "#0f172a", padding: "2px", borderRadius: "6px" },
-                  children: ["desktop", "tablet", "mobile"].map((device) => {
-                    const isActive = viewport === device;
-                    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-                      "button",
-                      {
-                        type: "button",
-                        "data-testid": `viewport-btn-${device}`,
-                        onClick: () => onViewportChange(device),
-                        style: {
-                          padding: "4px 10px",
-                          fontSize: "11px",
-                          fontWeight: 500,
-                          borderRadius: "4px",
-                          border: "none",
-                          cursor: "pointer",
-                          textTransform: "capitalize",
-                          backgroundColor: isActive ? "#3b82f6" : "transparent",
-                          color: isActive ? "#ffffff" : "#94a3b8",
-                          transition: "all 0.15s ease"
-                        },
-                        children: device
-                      },
-                      device
-                    );
-                  })
-                }
-              )
-            ]
+${e.join(`
+`)}`:""}function Yn(o,e){let i=e||(typeof window<"u"?window.document:null);if(!i)return!1;let r=i.querySelector(`[data-kubuild-node="${Ne(o)}"]`);if(!r)return!1;let n=r.style.animation;return r.style.animation="none",r.offsetWidth,r.style.animation=n,r.dispatchEvent(new CustomEvent("kubuild:replay-animation",{bubbles:!0,detail:{nodeId:o}})),!0}var Yt=require("react"),Xt=require("lucide-react"),re=require("react/jsx-runtime"),we=class extends Yt.Component{constructor(e){super(e),this.state={hasError:!1}}static getDerivedStateFromError(e){return{hasError:!0,error:e}}componentDidCatch(e,i){this.props.onError&&this.props.onError(e,i),this.props.onDiagnostic&&this.props.onDiagnostic({code:"ACTION_EXECUTION_ERROR",actionType:"render",nodeId:this.props.nodeId,message:`Render error in <${this.props.componentType}> (ID: ${this.props.nodeId}): ${e.message}`,error:e})}render(){if(this.state.hasError){let{nodeId:e,componentType:i,mode:r="runtime"}=this.props,n=this.state.error?.message||"Unknown render error";return r==="editor"?(0,re.jsxs)("div",{"data-kubuild-node":e,"data-kubuild-error":i,style:{padding:"12px 16px",margin:"4px 0",backgroundColor:"#fef2f2",border:"1px solid #ef4444",borderRadius:"6px",color:"#b91c1c",fontFamily:"system-ui, -apple-system, sans-serif",fontSize:"13px",lineHeight:"1.4"},children:[(0,re.jsxs)("div",{style:{fontWeight:600,marginBottom:"4px",display:"flex",alignItems:"center",gap:"6px"},children:[(0,re.jsx)(Xt.AlertTriangle,{size:14,"aria-hidden":"true"}),(0,re.jsxs)("span",{children:["Component Render Error: <",i,">"]})]}),(0,re.jsxs)("div",{style:{fontSize:"11px",color:"#7f1d1d",wordBreak:"break-all"},children:["Node ID: ",(0,re.jsx)("code",{children:e})," \u2014 ",n]})]}):(0,re.jsx)("div",{"data-kubuild-node":e,"data-kubuild-error":i,style:{display:"none"},"aria-hidden":"true"})}return this.props.children}};var Gt=require("@kubuild/schema"),Qe=require("@kubuild/components"),Jt=require("@kubuild/core");function Xn(o){switch(o){case"string":return"";case"number":return 0;case"boolean":return!1}}function Gn(o,e,i,r,n){let t=o.props?.[e.name],l=(0,Qe.primitiveTypeForField)(e);if(l===void 0||t===void 0)return t;let p=i.defaultProps?.[e.name]??e.defaultValue??Xn(l);if((0,Gt.isVariableBinding)(t)){let f=(0,Jt.resolveBinding)(t,r);return typeof f.value===l?f.value:(n.push({code:"INCOMPATIBLE_BINDING_TYPE",nodeId:o.id,propName:e.name,expectedType:l,actualType:typeof f.value,message:`Prop "${e.name}" on node "${o.id}" expected a ${l} but resolved binding "${t.key}" produced a ${typeof f.value}.`}),p)}return l==="string"&&typeof t=="string"&&t.includes("{{")?ze(r,t):t}function Zt(o,e,i){let r=o.props||{};if(!e||!e.propFields||e.propFields.length===0)return{props:r,diagnostics:[]};let n=[],t={...r};for(let l of e.propFields)(0,Qe.primitiveTypeForField)(l)!==void 0&&(t[l.name]=Gn(o,l,e,i,n));return{props:t,diagnostics:n}}var mn=fe(require("react"),1),M=require("@kubuild/schema"),le=require("lucide-react"),J=require("@kubuild/core");var T=require("react"),ae=require("@kubuild/core");var Qt=require("@kubuild/schema"),ce=require("@kubuild/core"),ie=class extends Error{status;statusText;url;method;data;headers;response;isTimeout;isCancelled;isNetworkError;stepId;cause;constructor(e,i){super(e),this.name="ApiRequestError",this.status=i?.status,this.statusText=i?.statusText,this.url=i?.url,this.method=i?.method,this.data=i?.data,this.headers=i?.headers,this.response=i?.response,this.isTimeout=i?.isTimeout??!1,this.isCancelled=i?.isCancelled??!1,this.isNetworkError=i?.isNetworkError??!1,this.stepId=i?.stepId,this.cause=i?.cause}};function en(o,e,i){if(!o||typeof o!="string")throw new ie("API request URL is required",{url:o});let r=o.trim();if(!(0,Qt.isSafeActionUrl)(r))throw new ie(`Disallowed or unsafe protocol in API request URL: "${r}"`,{url:r});let n=r;if(i&&!r.startsWith("http://")&&!r.startsWith("https://")&&!r.startsWith("//")){let t=i.endsWith("/")?i.slice(0,-1):i,l=r.startsWith("/")?r:`/${r}`;n=`${t}${l}`}if(e&&typeof e=="object"&&Object.keys(e).length>0){let[t,l]=n.split("?"),p=new URLSearchParams(l||"");for(let[u,c]of Object.entries(e))c!=null&&(Array.isArray(c)?c.forEach(a=>p.append(u,String(a))):p.set(u,String(c)));let f=p.toString();n=f?`${t}?${f}`:t}return n}function tn(o,e,i,r={}){let n=o.toUpperCase(),t={...r};if(n==="GET"||n==="HEAD")return{body:void 0,headers:t};if(e==null)return{body:void 0,headers:t};let l=Object.keys(t).find(u=>u.toLowerCase()==="content-type"),p=l?t[l]:void 0,f=(i||"").toLowerCase();if(f==="form-data"||f==="formdata"||f==="multipart"||p&&p.includes("multipart/form-data")){if(typeof FormData<"u"&&e instanceof FormData)return l&&delete t[l],{body:e,headers:t};if(typeof FormData<"u"&&typeof e=="object"&&e!==null){let u=new FormData;for(let[c,a]of Object.entries(e))a!=null&&(typeof Blob<"u"&&a instanceof Blob?u.append(c,a):Array.isArray(a)?a.forEach(s=>u.append(c,typeof s=="object"?JSON.stringify(s):String(s))):typeof a=="object"?u.append(c,JSON.stringify(a)):u.append(c,String(a)));return l&&delete t[l],{body:u,headers:t}}}if(f==="urlencoded"||f==="url-encoded"||p&&p.includes("application/x-www-form-urlencoded")){if(typeof URLSearchParams<"u"&&e instanceof URLSearchParams)return l||(t["Content-Type"]="application/x-www-form-urlencoded;charset=UTF-8"),{body:e,headers:t};if(typeof e=="object"&&e!==null){let u=new URLSearchParams;for(let[c,a]of Object.entries(e))a!=null&&(Array.isArray(a)?a.forEach(s=>u.append(c,String(s))):u.append(c,String(a)));return l||(t["Content-Type"]="application/x-www-form-urlencoded;charset=UTF-8"),{body:u,headers:t}}if(typeof e=="string")return l||(t["Content-Type"]="application/x-www-form-urlencoded;charset=UTF-8"),{body:e,headers:t}}if(f==="raw"||f==="text")return l||(t["Content-Type"]="text/plain;charset=UTF-8"),{body:typeof e=="string"?e:String(e),headers:t};if(typeof e=="object"&&e!==null)return l||(t["Content-Type"]="application/json"),{body:JSON.stringify(e),headers:t};if(typeof e=="string"){if(!l)try{JSON.parse(e),t["Content-Type"]="application/json"}catch{t["Content-Type"]="text/plain;charset=UTF-8"}return{body:e,headers:t}}return{body:String(e),headers:t}}async function Jn(o){let e=o.headers.get("content-type")||"",i=await o.text();if(!i||i.trim()==="")return null;if(e.includes("application/json")||e.includes("+json"))try{return JSON.parse(i)}catch{return i}let r=i.trim();if(r.startsWith("{")&&r.endsWith("}")||r.startsWith("[")&&r.endsWith("]"))try{return JSON.parse(r)}catch{return i}return i}function Fe(o){let e=o?.defaultTimeout,i=o?.baseUrl,r=o?.headers;return async function(t,l,p){let f=l.fetchFn||o?.fetchFn||(typeof globalThis<"u"&&typeof globalThis.fetch=="function"?globalThis.fetch:typeof fetch<"u"?fetch:void 0);if(!f)throw new ie("No fetch implementation available for API request runner",{stepId:t.id});let u=t.payload||{},c=String(u.method||"GET").toUpperCase(),a=u.timeout??e,s=u.baseUrl??i,d=en(String(u.url||""),u.queryParams,s),g={...r||{},...u.headers||{}},{body:b,headers:y}=tn(c,u.body,u.bodyFormat||u.bodyType,g),x=new AbortController,h,v=()=>{x.abort(p?.reason)};if(p){if(p.aborted)throw new ce.ActionCancellationError(p.reason instanceof Error?p.reason.message:"API request cancelled",t.id);p.addEventListener("abort",v,{once:!0})}a!==void 0&&a>0&&(h=setTimeout(()=>{x.abort(new ce.ActionTimeoutError(`API request timed out after ${a}ms`,a,t.id))},a));try{let m=await f(d,{method:c,headers:y,body:b,signal:x.signal}),C={};m.headers&&typeof m.headers.forEach=="function"&&m.headers.forEach((S,P)=>{C[P.toLowerCase()]=S});let k=await Jn(m),w={ok:m.ok,status:m.status,statusText:m.statusText,headers:C,data:k,body:k,url:m.url||d};if(!m.ok){let S=(typeof k=="object"&&k!==null&&"message"in k?String(k.message):void 0)||(typeof k=="string"&&k.length<200?k:void 0)||`HTTP ${m.status} ${m.statusText||"Error"}`;throw new ie(`API request failed: ${S}`,{status:m.status,statusText:m.statusText,url:d,method:c,data:k,headers:C,response:w,stepId:t.id})}return w}catch(m){if(m instanceof ie)throw m;if(x.signal.aborted){let k=x.signal.reason;if(k instanceof ce.ActionTimeoutError||k instanceof Error&&k.name==="ActionTimeoutError"||k instanceof ce.ActionCancellationError||k instanceof Error&&k.name==="ActionCancellationError")throw k;if(m instanceof Error&&(m.name==="AbortError"||m.name==="TimeoutError"))throw h===void 0&&p?.aborted?new ce.ActionCancellationError("API request cancelled",t.id):new ce.ActionTimeoutError(`API request timed out after ${a}ms`,a??0,t.id)}let C=m instanceof Error?m.message:String(m);throw new ie(`Network error during API request: ${C}`,{url:d,method:c,isNetworkError:!0,stepId:t.id,cause:m})}finally{h!==void 0&&clearTimeout(h),p&&p.removeEventListener("abort",v)}}}var et=Fe();var Me=require("react"),Zn=0,De=class{toasts=[];listeners=new Set;timers=new Map;showToast(e){let i=typeof e=="string"?{message:e}:e,r=i.id||`toast_${Date.now()}_${++Zn}`,n=i.type||i.variant||"info",t=i.duration!==void 0?Math.max(0,i.duration):4e3,l=i.position||"top-right",p=i.dismissible!==!1;this.timers.has(r)&&(clearTimeout(this.timers.get(r)),this.timers.delete(r));let f={id:r,type:n,message:i.message,title:i.title,duration:t,position:l,dismissible:p,createdAt:Date.now(),dismiss:()=>this.dismissToast(r)};if(this.toasts=this.toasts.filter(u=>u.id!==r).concat(f),t>0){let u=setTimeout(()=>{this.dismissToast(r)},t);this.timers.set(r,u)}return this.notify(),f}dismissToast(e){this.timers.has(e)&&(clearTimeout(this.timers.get(e)),this.timers.delete(e));let i=this.toasts.length;this.toasts=this.toasts.filter(r=>r.id!==e),this.toasts.length!==i&&this.notify()}clearToasts(){for(let e of this.timers.values())clearTimeout(e);this.timers.clear(),this.toasts=[],this.notify()}getToasts(){return[...this.toasts]}subscribe(e){return this.listeners.add(e),()=>{this.listeners.delete(e)}}notify(){let e=this.getToasts();for(let i of this.listeners)try{i(e)}catch(r){console.error("Error in toast listener callback:",r)}}},ue=new De;function tt(o=ue){let[e,i]=(0,Me.useState)(()=>o.getToasts());return(0,Me.useEffect)(()=>(i(o.getToasts()),o.subscribe(r=>{i(r)})),[o]),{toasts:e,showToast:r=>o.showToast(r),dismissToast:r=>o.dismissToast(r),clearToasts:()=>o.clearToasts()}}var ne=require("react"),Oe=class{modals=new Map;activeStack=[];listeners=new Set;openModal(e){if(!e||typeof e!="string")return;let i=e.trim();if(i){if(this.modals.set(i,!0),this.activeStack=this.activeStack.filter(r=>r!==i).concat(i),typeof window<"u"&&typeof window.dispatchEvent=="function")try{let r=new CustomEvent("kubuild:modal:open",{detail:{modalId:i},bubbles:!0});window.dispatchEvent(r)}catch{}this.notify()}}closeModal(e){if(e&&typeof e=="string"){let i=e.trim();if(this.modals.set(i,!1),this.activeStack=this.activeStack.filter(r=>r!==i),typeof window<"u"&&typeof window.dispatchEvent=="function")try{let r=new CustomEvent("kubuild:modal:close",{detail:{modalId:i},bubbles:!0});window.dispatchEvent(r)}catch{}}else{let i=this.activeStack.pop();if(i){if(this.modals.set(i,!1),typeof window<"u"&&typeof window.dispatchEvent=="function")try{let r=new CustomEvent("kubuild:modal:close",{detail:{modalId:i},bubbles:!0});window.dispatchEvent(r)}catch{}}else for(let r of this.modals.keys())this.modals.set(r,!1)}this.notify()}toggleModal(e){return this.isModalOpen(e)?(this.closeModal(e),!1):(this.openModal(e),!0)}isModalOpen(e){return e?!!this.modals.get(e.trim()):!1}hasState(e){return e?this.modals.has(e.trim()):!1}getState(){let e={};for(let[i,r]of this.modals.entries())e[i]=r;return e}getActiveModals(){return[...this.activeStack]}reset(){this.modals.clear(),this.activeStack=[],this.notify()}subscribe(e){return this.listeners.add(e),()=>{this.listeners.delete(e)}}notify(){let e=this.getState();for(let i of this.listeners)try{i(e)}catch(r){console.error("Error in modal listener callback:",r)}}},Z=new Oe;function nt(o,e=Z){if(!o)return{isOpen:!1,open:()=>{},close:()=>{},toggle:()=>!1};let[i,r]=(0,ne.useState)(()=>e.isModalOpen(o));(0,ne.useEffect)(()=>(r(e.isModalOpen(o)),e.subscribe(p=>{r(!!p[o])})),[o,e]);let n=(0,ne.useCallback)(()=>e.openModal(o),[o,e]),t=(0,ne.useCallback)(()=>e.closeModal(o),[o,e]),l=(0,ne.useCallback)(()=>e.toggleModal(o),[o,e]);return{isOpen:i,open:n,close:t,toggle:l}}function ot(o=Z){let[e,i]=(0,ne.useState)(()=>o.getState());return(0,ne.useEffect)(()=>(i(o.getState()),o.subscribe(r=>{i(r)})),[o]),{modals:e,activeModals:o.getActiveModals(),isOpen:r=>!!e[r],openModal:r=>o.openModal(r),closeModal:r=>o.closeModal(r),toggleModal:r=>o.toggleModal(r)}}var rt=(o,e)=>{let i=o.payload||{},r=String(i.message||"").trim();if(!r)throw new Error("Toast message cannot be empty");let n=i.type||i.variant||"info",t=i.duration!==void 0?i.duration:4e3,l=i.position||"top-right",p=i.title?String(i.title):void 0,u=(e.toastManager||ue).showToast({message:r,type:n,duration:t,position:l,title:p});return{id:u.id,message:u.message,type:u.type,title:u.title,duration:u.duration,position:u.position}},Ve=(o,e)=>{let i=o.payload||{},r=i.modalId||i.modalNodeId||i.targetNodeId||i.nodeId,n=r?String(r).trim():"";if(!n)throw new Error("Modal ID or Modal Node ID is required for open_modal action");let t=e.modalManager||Z,p=!!i.toggle?t.toggleModal(n):(t.openModal(n),!0);if(e.state&&typeof e.state=="object"){let f=e.state.modals||{};e.state.modals={...f,[n]:p},e.state[n]=p}return e.variables&&typeof e.variables=="object"&&(e.variables[`modal_${n}_open`]=p),{modalId:n,open:p}},it=(o,e)=>Ve({...o,payload:{...o.payload||{},toggle:!0}},e),at=(o,e)=>{let i=o.payload||{},r=i.modalId||i.modalNodeId||i.targetNodeId||i.nodeId,n=r?String(r).trim():void 0;if((e.modalManager||Z).closeModal(n),n){if(e.state&&typeof e.state=="object"){let l=e.state.modals||{};e.state.modals={...l,[n]:!1},e.state[n]=!1}e.variables&&typeof e.variables=="object"&&(e.variables[`modal_${n}_open`]=!1)}else e.state&&typeof e.state=="object"&&(e.state.modals={});return{modalId:n||"all",open:!1}};var nn=require("@kubuild/schema");async function on(o,e){if(e?.copyFn)return await e.copyFn(o),!0;if(typeof navigator<"u"&&navigator.clipboard&&typeof navigator.clipboard.writeText=="function")try{return await navigator.clipboard.writeText(o),!0}catch{}if(typeof document<"u")try{let i=document.createElement("textarea");i.value=o,i.setAttribute("readonly",""),i.style.position="fixed",i.style.top="-9999px",i.style.left="-9999px",i.style.opacity="0",document.body.appendChild(i),i.focus(),i.select();let r=document.execCommand("copy");if(document.body.removeChild(i),r)return!0}catch{}return!1}var st=(o,e)=>{let i=o.payload||{},r=String(i.url||"").trim();if(!r)throw new Error("Navigation URL cannot be empty");if(!(0,nn.isSafeActionUrl)(r))throw new Error(`Disallowed or unsafe protocol in navigation URL: "${r}"`);let n=i.target||"_self",t=i.replace??!1,l=i.behavior||"smooth",p=i.scroll??!0;if(r.startsWith("#")){if(typeof document<"u"){try{let u=document.querySelector(r)||document.getElementById(r.slice(1));u&&typeof u.scrollIntoView=="function"&&u.scrollIntoView({behavior:p===!1?"auto":l,block:"start"})}catch{}if(typeof window<"u"&&window.location)try{window.location.hash=r}catch{}}return{url:r,target:"_self",replace:t,scroll:p,behavior:l,navigated:!0,isAnchor:!0}}if(n==="_blank")return typeof window<"u"&&typeof window.open=="function"&&window.open(r,"_blank","noopener,noreferrer"),{url:r,target:n,replace:t,scroll:p,behavior:l,navigated:!0,isAnchor:!1};let f=typeof e.onNavigate=="function"&&e.onNavigate||typeof e.navigateFn=="function"&&e.navigateFn;return f?(f(r,{target:n,replace:t,scroll:p,behavior:l}),{url:r,target:n,replace:t,scroll:p,behavior:l,navigated:!0,isAnchor:!1}):(typeof window<"u"&&window.location&&(t?window.location.replace(r):window.location.assign(r)),{url:r,target:n,replace:t,scroll:p,behavior:l,navigated:!0,isAnchor:!1})},lt=async(o,e)=>{let i=o.payload||{},r=i.text!==void 0?i.text:i.value!==void 0?i.value:"",n=typeof r=="object"&&r!==null?JSON.stringify(r):String(r??""),t=typeof e.copyFn=="function"?e.copyFn:typeof e.clipboardFn=="function"?e.clipboardFn:void 0;return await on(n,{copyFn:t}),i.notify!==!1&&(i.notify===!0||i.toastMessage)&&(e.toastManager||ue).showToast({message:i.toastMessage||"Copied to clipboard!",type:"success",duration:3e3}),{text:n,copied:!0}},dt=(o,e)=>{let r=(o.payload||{}).formId||(typeof e.formId=="string"?e.formId:void 0);if(typeof e.resetForm=="function"&&e.resetForm(),e.form&&typeof e.form=="object")for(let n of Object.keys(e.form))e.form[n]="";if(typeof document<"u")try{let n=r?document.getElementById(r):document.querySelector("form");n&&typeof n.reset=="function"&&n.reset()}catch{}return{formId:r,reset:!0}};var an=require("react");var oe=require("lucide-react"),U=require("react/jsx-runtime"),Qn={"top-right":{top:"16px",right:"16px",alignItems:"flex-end"},"top-left":{top:"16px",left:"16px",alignItems:"flex-start"},"top-center":{top:"16px",left:"50%",transform:"translateX(-50%)",alignItems:"center"},"bottom-right":{bottom:"16px",right:"16px",alignItems:"flex-end"},"bottom-left":{bottom:"16px",left:"16px",alignItems:"flex-start"},"bottom-center":{bottom:"16px",left:"50%",transform:"translateX(-50%)",alignItems:"center"}},rn={success:{bg:"#f0fdf4",border:"#bbf7d0",text:"#166534",titleText:"#14532d",iconColor:"#16a34a",Icon:oe.CheckCircle2},error:{bg:"#fef2f2",border:"#fecaca",text:"#991b1b",titleText:"#7f1d1d",iconColor:"#dc2626",Icon:oe.AlertCircle},warning:{bg:"#fffbeb",border:"#fde68a",text:"#92400e",titleText:"#78350f",iconColor:"#d97706",Icon:oe.AlertTriangle},info:{bg:"#eff6ff",border:"#bfdbfe",text:"#1e40af",titleText:"#1e3a8a",iconColor:"#2563eb",Icon:oe.Info}},sn=({toast:o})=>{let e=rn[o.type]||rn.info,i=e.Icon;return(0,U.jsxs)("div",{role:"alert","aria-live":"polite","data-testid":`toast-${o.id}`,"data-toast-type":o.type,style:{display:"flex",alignItems:"flex-start",gap:"12px",width:"100%",maxWidth:"380px",minWidth:"280px",padding:"12px 14px",backgroundColor:e.bg,border:`1px solid ${e.border}`,borderRadius:"8px",boxShadow:"0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",color:e.text,fontSize:"14px",lineHeight:"1.4",pointerEvents:"auto",animation:"kubuildToastIn 200ms cubic-bezier(0.16, 1, 0.3, 1)",wordBreak:"break-word",boxSizing:"border-box",transition:"all 200ms ease"},children:[(0,U.jsx)("div",{style:{flexShrink:0,marginTop:"2px",color:e.iconColor},children:(0,U.jsx)(i,{size:18,color:e.iconColor})}),(0,U.jsxs)("div",{style:{flex:1,minWidth:0},children:[o.title&&(0,U.jsx)("div",{style:{fontWeight:600,fontSize:"14px",marginBottom:"2px",color:e.titleText},children:o.title}),(0,U.jsx)("div",{style:{color:e.text},children:o.message})]}),o.dismissible&&(0,U.jsx)("button",{type:"button","aria-label":"Close notification",onClick:o.dismiss,"data-testid":`toast-dismiss-${o.id}`,style:{flexShrink:0,background:"none",border:"none",cursor:"pointer",padding:"2px",marginLeft:"4px",color:e.text,opacity:.7,display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"4px"},children:(0,U.jsx)(oe.X,{size:16})})]})},ct=({manager:o=ue,position:e,className:i,maxVisible:r=5})=>{let{toasts:n}=tt(o),t=(0,an.useMemo)(()=>{if(e)return{[e]:n.filter(p=>(p.position||"top-right")===e)};let l={"top-right":[],"top-left":[],"top-center":[],"bottom-right":[],"bottom-left":[],"bottom-center":[]};return n.forEach(p=>{let f=p.position||"top-right";l[f].push(p)}),l},[n,e]);return n.length===0?null:(0,U.jsxs)(U.Fragment,{children:[(0,U.jsx)("style",{children:`
+        @keyframes kubuildToastIn {
+          from {
+            opacity: 0;
+            transform: translateY(-8px) scale(0.96);
           }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
-          "div",
-          {
-            "data-kubuild-preview-canvas": true,
-            "data-viewport": viewport,
-            className: `kubuild-preview-canvas ${canvasClassName || ""}`,
-            style: mergedCanvasStyle,
-            children: [
-              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-                KubuildRenderer,
-                {
-                  document,
-                  registry,
-                  context,
-                  viewport,
-                  mode,
-                  onNodeClick,
-                  onDiagnostic,
-                  onActionDispatch
-                }
-              ),
-              editorOverlay && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-                "div",
-                {
-                  "data-kubuild-preview-overlay": true,
-                  style: {
-                    position: "absolute",
-                    top: 0,
-                    left: 0,
-                    right: 0,
-                    bottom: 0,
-                    pointerEvents: "none",
-                    zIndex: 10
-                  },
-                  children: editorOverlay
-                }
-              )
-            ]
+          to {
+            opacity: 1;
+            transform: translateY(0) scale(1);
           }
-        )
-      ]
-    }
-  );
-};
-var KubuildPreviewViewport = PreviewViewportAdapter;
-
-// src/code-generator.ts
-function escapeHtml(str) {
-  if (str === null || str === void 0) return "";
-  return String(str).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
-}
-function escapeAttr(str) {
-  return escapeHtml(str);
-}
-function getYouTubeId2(url) {
-  if (!url || typeof url !== "string") return null;
-  const match = url.match(
-    /(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/\s]{11})/i
-  );
-  return match ? match[1] : null;
-}
-function getVimeoId2(url) {
-  if (!url || typeof url !== "string") return null;
-  const match = url.match(
-    /(?:vimeo\.com\/(?:channels\/(?:\w+\/)?|groups\/([^\/]*)\/videos\/|album\/(\d+)\/video\/|video\/|))(\d+)/i
-  );
-  return match ? match[3] : null;
-}
-function renderNodeToHtml(node, indentLevel, options) {
-  const indent = " ".repeat(indentLevel * (options.indentSize ?? 2));
-  const innerIndent = " ".repeat((indentLevel + 1) * (options.indentSize ?? 2));
-  const props = node.props || {};
-  const children = node.children || [];
-  const includeNodeClass = options.includeNodeClasses !== false;
-  const nodeClass = includeNodeClass ? `kb-node-${node.id}` : "";
-  const buildClass = (...classes) => {
-    return classes.filter(Boolean).join(" ");
-  };
-  const idAttr = props.id ? ` id="${escapeAttr(props.id)}"` : "";
-  switch (node.type) {
-    case "page": {
-      const tag = options.rootTag || "main";
-      const cls = buildClass("kb-page", nodeClass);
-      const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-      if (!childHtml) {
-        return `${indent}<${tag} class="${cls}"${idAttr}></${tag}>`;
-      }
-      return `${indent}<${tag} class="${cls}"${idAttr}>
-${childHtml}
-${indent}</${tag}>`;
-    }
-    case "section": {
-      const ariaLabel = props.ariaLabel ? ` aria-label="${escapeAttr(props.ariaLabel)}"` : "";
-      const cls = buildClass("kb-section", nodeClass);
-      const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-      if (!childHtml) {
-        return `${indent}<section class="${cls}"${idAttr}${ariaLabel}></section>`;
-      }
-      return `${indent}<section class="${cls}"${idAttr}${ariaLabel}>
-${childHtml}
-${indent}</section>`;
-    }
-    case "container": {
-      const cls = buildClass("kb-container", nodeClass);
-      const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-      if (!childHtml) {
-        return `${indent}<div class="${cls}"${idAttr}></div>`;
-      }
-      return `${indent}<div class="${cls}"${idAttr}>
-${childHtml}
-${indent}</div>`;
-    }
-    case "columns": {
-      const cls = buildClass("kb-columns", nodeClass);
-      const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-      if (!childHtml) {
-        return `${indent}<div class="${cls}"${idAttr}></div>`;
-      }
-      return `${indent}<div class="${cls}"${idAttr}>
-${childHtml}
-${indent}</div>`;
-    }
-    case "heading": {
-      let level = "h2";
-      if (typeof props.level === "string" && /^h[1-6]$/i.test(props.level)) {
-        level = props.level.toLowerCase();
-      } else if (typeof props.level === "number" && props.level >= 1 && props.level <= 6) {
-        level = `h${props.level}`;
-      } else if (typeof props.tag === "string" && /^h[1-6]$/i.test(props.tag)) {
-        level = props.tag.toLowerCase();
-      }
-      const text = props.text ?? props.value ?? props.content ?? "Heading";
-      const cls = buildClass("kb-heading", nodeClass);
-      return `${indent}<${level} class="${cls}"${idAttr}>${escapeHtml(text)}</${level}>`;
-    }
-    case "paragraph": {
-      const text = props.text ?? props.value ?? props.content ?? "";
-      const cls = buildClass("kb-paragraph", nodeClass);
-      return `${indent}<p class="${cls}"${idAttr}>${escapeHtml(text)}</p>`;
-    }
-    case "text": {
-      const tag = props.as || "p";
-      const text = props.text ?? props.value ?? props.content ?? "";
-      const cls = buildClass("kb-text", nodeClass);
-      return `${indent}<${tag} class="${cls}"${idAttr}>${escapeHtml(text)}</${tag}>`;
-    }
-    case "link": {
-      const href = props.href ? ` href="${escapeAttr(props.href)}"` : ' href="#"';
-      const target = props.target ? ` target="${escapeAttr(props.target)}"` : "";
-      const rel = props.rel ? ` rel="${escapeAttr(props.rel)}"` : target.includes("_blank") ? ' rel="noopener noreferrer"' : "";
-      const text = props.text ?? props.label ?? props.value;
-      const cls = buildClass("kb-link", nodeClass);
-      if (children.length > 0) {
-        const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-        return `${indent}<a class="${cls}"${idAttr}${href}${target}${rel}>
-${childHtml}
-${indent}</a>`;
-      }
-      return `${indent}<a class="${cls}"${idAttr}${href}${target}${rel}>${escapeHtml(text ?? "Link")}</a>`;
-    }
-    case "blockquote": {
-      const cite = props.cite ? ` cite="${escapeAttr(props.cite)}"` : "";
-      const quote = props.quote ?? props.text ?? props.value;
-      const author = props.author ?? props.citeAuthor;
-      const cls = buildClass("kb-blockquote", nodeClass);
-      if (quote || author) {
-        const quoteHtml = quote ? `${innerIndent}<p>${escapeHtml(quote)}</p>` : "";
-        const authorHtml = author ? `${innerIndent}<cite>${escapeHtml(author)}</cite>` : "";
-        const parts = [quoteHtml, authorHtml].filter(Boolean).join("\n");
-        return `${indent}<blockquote class="${cls}"${idAttr}${cite}>
-${parts}
-${indent}</blockquote>`;
-      }
-      if (children.length > 0) {
-        const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-        return `${indent}<blockquote class="${cls}"${idAttr}${cite}>
-${childHtml}
-${indent}</blockquote>`;
-      }
-      return `${indent}<blockquote class="${cls}"${idAttr}${cite}></blockquote>`;
-    }
-    case "badge": {
-      const text = props.text ?? props.label ?? props.value ?? "Badge";
-      const cls = buildClass("kb-badge", nodeClass);
-      return `${indent}<span class="${cls}"${idAttr}>${escapeHtml(text)}</span>`;
-    }
-    case "code-block": {
-      const code = props.code ?? props.text ?? props.value ?? "";
-      const lang = props.language || props.lang;
-      const langClass = lang ? ` class="language-${escapeAttr(lang)}"` : "";
-      const cls = buildClass("kb-code-block", nodeClass);
-      return `${indent}<pre class="${cls}"${idAttr}><code${langClass}>${escapeHtml(code)}</code></pre>`;
-    }
-    case "divider": {
-      const cls = buildClass("kb-divider", nodeClass);
-      const text = props.text ?? props.label;
-      if (text) {
-        return `${indent}<div class="${cls}"${idAttr} role="separator"><span>${escapeHtml(text)}</span></div>`;
-      }
-      return `${indent}<hr class="${cls}"${idAttr} />`;
-    }
-    case "spacer": {
-      const cls = buildClass("kb-spacer", nodeClass);
-      return `${indent}<div class="${cls}"${idAttr} aria-hidden="true"></div>`;
-    }
-    case "image": {
-      const src = props.src ? ` src="${escapeAttr(props.src)}"` : ' src=""';
-      const alt = props.alt ? ` alt="${escapeAttr(props.alt)}"` : ' alt=""';
-      const loading = props.loading ? ` loading="${escapeAttr(props.loading)}"` : ' loading="lazy"';
-      const cls = buildClass("kb-image", nodeClass);
-      return `${indent}<img class="${cls}"${idAttr}${src}${alt}${loading} />`;
-    }
-    case "video": {
-      const src = props.src || "";
-      const ytId = getYouTubeId2(src);
-      const vmId = getVimeoId2(src);
-      const cls = buildClass("kb-video", nodeClass);
-      if (ytId) {
-        return `${indent}<div class="kb-video-wrapper ${nodeClass}"${idAttr}>
-${innerIndent}<iframe src="https://www.youtube-nocookie.com/embed/${escapeAttr(ytId)}" title="${escapeAttr(props.title || "Video player")}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-${indent}</div>`;
-      }
-      if (vmId) {
-        return `${indent}<div class="kb-video-wrapper ${nodeClass}"${idAttr}>
-${innerIndent}<iframe src="https://player.vimeo.com/video/${escapeAttr(vmId)}" title="${escapeAttr(props.title || "Video player")}" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
-${indent}</div>`;
-      }
-      const poster = props.poster ? ` poster="${escapeAttr(props.poster)}"` : "";
-      const controls = props.controls !== false ? " controls" : "";
-      const autoplay = props.autoplay ? " autoplay" : "";
-      const loop = props.loop ? " loop" : "";
-      const muted = props.muted ? " muted" : "";
-      const videoSrc = src ? ` src="${escapeAttr(src)}"` : "";
-      return `${indent}<video class="${cls}"${idAttr}${videoSrc}${poster}${controls}${autoplay}${loop}${muted}></video>`;
-    }
-    case "icon": {
-      const name = props.name || props.icon || "star";
-      const ariaLabel = props.ariaLabel ? ` aria-label="${escapeAttr(props.ariaLabel)}"` : ' aria-hidden="true"';
-      const cls = buildClass("kb-icon", nodeClass);
-      return `${indent}<span class="${cls}"${idAttr}${ariaLabel} data-icon="${escapeAttr(name)}"></span>`;
-    }
-    case "html-embed": {
-      const rawHtml = props.html ?? props.content ?? "";
-      const cls = buildClass("kb-html-embed", nodeClass);
-      if (!rawHtml) {
-        return `${indent}<div class="${cls}"${idAttr}></div>`;
-      }
-      return `${indent}<div class="${cls}"${idAttr}>
-${innerIndent}${rawHtml}
-${indent}</div>`;
-    }
-    case "button": {
-      const label = props.label ?? props.text ?? props.value ?? "Button";
-      const type = props.type ? ` type="${escapeAttr(props.type)}"` : ' type="button"';
-      const disabled = props.disabled ? " disabled" : "";
-      const cls = buildClass("kb-button", nodeClass);
-      if (props.href) {
-        const href = ` href="${escapeAttr(props.href)}"`;
-        const target = props.target ? ` target="${escapeAttr(props.target)}"` : "";
-        return `${indent}<a class="${cls}"${idAttr}${href}${target}>${escapeHtml(label)}</a>`;
-      }
-      return `${indent}<button class="${cls}"${idAttr}${type}${disabled}>${escapeHtml(label)}</button>`;
-    }
-    case "form": {
-      const action = props.action ? ` action="${escapeAttr(props.action)}"` : "";
-      const method = props.method ? ` method="${escapeAttr(props.method)}"` : ' method="POST"';
-      const cls = buildClass("kb-form", nodeClass);
-      const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-      if (!childHtml) {
-        return `${indent}<form class="${cls}"${idAttr}${action}${method}></form>`;
-      }
-      return `${indent}<form class="${cls}"${idAttr}${action}${method}>
-${childHtml}
-${indent}</form>`;
-    }
-    case "input": {
-      const type = props.type ? ` type="${escapeAttr(props.type)}"` : ' type="text"';
-      const name = props.name ? ` name="${escapeAttr(props.name)}"` : "";
-      const placeholder = props.placeholder ? ` placeholder="${escapeAttr(props.placeholder)}"` : "";
-      const value = props.value !== void 0 ? ` value="${escapeAttr(props.value)}"` : "";
-      const required = props.required ? " required" : "";
-      const disabled = props.disabled ? " disabled" : "";
-      const cls = buildClass("kb-input", nodeClass);
-      return `${indent}<input class="${cls}"${idAttr}${type}${name}${placeholder}${value}${required}${disabled} />`;
-    }
-    case "textarea": {
-      const name = props.name ? ` name="${escapeAttr(props.name)}"` : "";
-      const placeholder = props.placeholder ? ` placeholder="${escapeAttr(props.placeholder)}"` : "";
-      const rows = props.rows ? ` rows="${escapeAttr(props.rows)}"` : ' rows="4"';
-      const value = props.value ?? props.defaultValue ?? "";
-      const required = props.required ? " required" : "";
-      const disabled = props.disabled ? " disabled" : "";
-      const cls = buildClass("kb-textarea", nodeClass);
-      return `${indent}<textarea class="${cls}"${idAttr}${name}${placeholder}${rows}${required}${disabled}>${escapeHtml(value)}</textarea>`;
-    }
-    case "select": {
-      const name = props.name ? ` name="${escapeAttr(props.name)}"` : "";
-      const required = props.required ? " required" : "";
-      const disabled = props.disabled ? " disabled" : "";
-      const cls = buildClass("kb-select", nodeClass);
-      const optionsList = Array.isArray(props.options) ? props.options : [];
-      const optionIndent = " ".repeat((indentLevel + 1) * (options.indentSize ?? 2));
-      const optionsHtml = optionsList.map((opt) => {
-        const optVal = typeof opt === "object" ? opt.value : opt;
-        const optLabel = typeof opt === "object" ? opt.label : opt;
-        const selected = props.value === optVal || props.defaultValue === optVal ? " selected" : "";
-        return `${optionIndent}<option value="${escapeAttr(optVal)}"${selected}>${escapeHtml(optLabel)}</option>`;
-      }).join("\n");
-      if (!optionsHtml) {
-        return `${indent}<select class="${cls}"${idAttr}${name}${required}${disabled}></select>`;
-      }
-      return `${indent}<select class="${cls}"${idAttr}${name}${required}${disabled}>
-${optionsHtml}
-${indent}</select>`;
-    }
-    case "checkbox": {
-      const name = props.name ? ` name="${escapeAttr(props.name)}"` : "";
-      const checked = props.checked || props.defaultChecked ? " checked" : "";
-      const label = props.label ?? props.text ?? "";
-      const cls = buildClass("kb-checkbox-label", nodeClass);
-      return `${indent}<label class="${cls}"${idAttr}><input type="checkbox"${name}${checked} /><span>${escapeHtml(label)}</span></label>`;
-    }
-    case "radio": {
-      const name = props.name ? ` name="${escapeAttr(props.name)}"` : "";
-      const value = props.value ? ` value="${escapeAttr(props.value)}"` : "";
-      const checked = props.checked || props.defaultChecked ? " checked" : "";
-      const label = props.label ?? props.text ?? "";
-      const cls = buildClass("kb-radio-label", nodeClass);
-      return `${indent}<label class="${cls}"${idAttr}><input type="radio"${name}${value}${checked} /><span>${escapeHtml(label)}</span></label>`;
-    }
-    case "list": {
-      const tag = props.tag === "ol" || props.type === "ol" || props.ordered ? "ol" : "ul";
-      const cls = buildClass("kb-list", nodeClass);
-      const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-      if (!childHtml) {
-        return `${indent}<${tag} class="${cls}"${idAttr}></${tag}>`;
-      }
-      return `${indent}<${tag} class="${cls}"${idAttr}>
-${childHtml}
-${indent}</${tag}>`;
-    }
-    case "list-item": {
-      const text = props.text ?? props.value;
-      const cls = buildClass("kb-list-item", nodeClass);
-      if (children.length > 0) {
-        const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-        return `${indent}<li class="${cls}"${idAttr}>
-${childHtml}
-${indent}</li>`;
-      }
-      return `${indent}<li class="${cls}"${idAttr}>${escapeHtml(text ?? "List item")}</li>`;
-    }
-    case "table": {
-      const cls = buildClass("kb-table", nodeClass);
-      const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-      if (!childHtml) {
-        return `${indent}<table class="${cls}"${idAttr}></table>`;
-      }
-      return `${indent}<table class="${cls}"${idAttr}>
-${childHtml}
-${indent}</table>`;
-    }
-    case "table-row": {
-      const cls = buildClass("kb-table-row", nodeClass);
-      const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-      if (!childHtml) {
-        return `${indent}<tr class="${cls}"${idAttr}></tr>`;
-      }
-      return `${indent}<tr class="${cls}"${idAttr}>
-${childHtml}
-${indent}</tr>`;
-    }
-    case "table-cell": {
-      const isHeader = props.isHeader || props.type === "header" || props.tag === "th";
-      const tag = isHeader ? "th" : "td";
-      const colSpan = props.colSpan && Number(props.colSpan) > 1 ? ` colspan="${escapeAttr(props.colSpan)}"` : "";
-      const rowSpan = props.rowSpan && Number(props.rowSpan) > 1 ? ` rowspan="${escapeAttr(props.rowSpan)}"` : "";
-      const text = props.text ?? props.value ?? "";
-      const cls = buildClass("kb-table-cell", nodeClass);
-      if (children.length > 0) {
-        const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-        return `${indent}<${tag} class="${cls}"${idAttr}${colSpan}${rowSpan}>
-${childHtml}
-${indent}</${tag}>`;
-      }
-      return `${indent}<${tag} class="${cls}"${idAttr}${colSpan}${rowSpan}>${escapeHtml(text)}</${tag}>`;
-    }
-    case "collection": {
-      const cls = buildClass("kb-collection", nodeClass);
-      const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-      if (!childHtml) {
-        return `${indent}<div class="${cls}"${idAttr}></div>`;
-      }
-      return `${indent}<div class="${cls}"${idAttr}>
-${childHtml}
-${indent}</div>`;
-    }
-    default: {
-      const cls = buildClass(`kb-${node.type}`, nodeClass);
-      const childHtml = children.map((child) => renderNodeToHtml(child, indentLevel + 1, options)).join("\n");
-      if (!childHtml) {
-        return `${indent}<div class="${cls}"${idAttr}></div>`;
-      }
-      return `${indent}<div class="${cls}"${idAttr}>
-${childHtml}
-${indent}</div>`;
-    }
-  }
-}
-function generateSemanticHtml(docOrNode, options = {}) {
-  const rootNode = "document" in docOrNode ? docOrNode.document : docOrNode;
-  if (!rootNode) return "";
-  return renderNodeToHtml(rootNode, 0, options);
-}
-function formatCssRule(selector, declarationsStr, indent = "") {
-  if (!declarationsStr.trim()) return "";
-  const rules = declarationsStr.split(";").map((r) => r.trim()).filter(Boolean);
-  if (rules.length === 0) return "";
-  const indentedRules = rules.map((r) => `${indent}  ${r};`).join("\n");
-  return `${indent}${selector} {
-${indentedRules}
-${indent}}`;
-}
-function generateDocumentCss(docOrNode, options = {}) {
-  const rootNode = "document" in docOrNode ? docOrNode.document : docOrNode;
-  if (!rootNode) return "";
-  const classPrefix = options.classPrefix || "kb-node-";
-  const baseRules = [];
-  const tabletRules = [];
-  const mobileRules = [];
-  const stateRules = [];
-  const walk = (node) => {
-    const selector = `.${classPrefix}${node.id}`;
-    if (node.styles) {
-      const baseStyles = {
-        ...node.styles.base || {},
-        ...node.styles.desktop || {}
-      };
-      const baseDecls = styleDefinitionToCssDeclarations(baseStyles);
-      if (baseDecls) {
-        baseRules.push(formatCssRule(selector, baseDecls));
-      }
-      if (node.styles.tablet) {
-        const tabletDecls = styleDefinitionToCssDeclarations(node.styles.tablet);
-        if (tabletDecls) {
-          tabletRules.push(formatCssRule(selector, tabletDecls, "  "));
-        }
-      }
-      if (node.styles.mobile) {
-        const mobileDecls = styleDefinitionToCssDeclarations(node.styles.mobile);
-        if (mobileDecls) {
-          mobileRules.push(formatCssRule(selector, mobileDecls, "  "));
         }
-      }
-      if (node.styles.states && typeof node.styles.states === "object") {
-        for (const [state, styleDef] of Object.entries(node.styles.states)) {
-          if (!styleDef) continue;
-          const safeState = /^::?[a-zA-Z-]+$/.test(state) ? state : null;
-          if (!safeState) continue;
-          const stateDecls = styleDefinitionToCssDeclarations(styleDef);
-          if (stateDecls) {
-            stateRules.push(formatCssRule(`${selector}${safeState}`, stateDecls));
-          }
-        }
-      }
-    }
-    node.children?.forEach(walk);
-  };
-  walk(rootNode);
-  const sections = [];
-  if (options.includeReset !== false) {
-    sections.push(`/* ==========================================================================
+      `}),Object.entries(t).map(([l,p])=>{if(!p||p.length===0)return null;let f=p.slice(-r);return(0,U.jsx)("div",{"data-testid":`toast-container-${l}`,className:i,style:{position:"fixed",zIndex:99999,display:"flex",flexDirection:"column",gap:"8px",maxWidth:"calc(100vw - 32px)",pointerEvents:"none",...Qn[l]},children:f.map(u=>(0,U.jsx)(sn,{toast:u},u.id))},l)})]})};function ln(o){return{api_request:o?.apiRequest?Fe(o.apiRequest):et,show_toast:rt,open_modal:Ve,close_modal:at,toggle_modal:it,navigate:st,copy_clipboard:lt,reset_form:dt,...o?.handlers||{}}}function $e(o,e){let i=ln(e);for(let[r,n]of Object.entries(i))(!o.hasHandler(r)||e?.handlers?.[r]||e?.apiRequest)&&o.registerHandler(r,n);return o}var dn=require("react/jsx-runtime"),Be=(0,T.createContext)(null);function eo(o,e){let i=new Set([...Object.keys(o),...Object.keys(e)]);for(let r of i)if(o[r]!==e[r])return!0;return!1}var ut=({formId:o,formConfig:e,initialValues:i,onSubmit:r,onSuccess:n,onError:t,actions:l,nodeId:p,document:f,onDiagnostic:u,children:c})=>{let a=je(),s=(0,T.useMemo)(()=>o||e?.formId||p||"kubuild-form",[o,e?.formId,p]),d=(0,T.useMemo)(()=>({...e?.initialValues||{},...i||{}}),[e?.initialValues,i]),[g,b]=(0,T.useState)(d),[y,x]=(0,T.useState)(d),[h,v]=(0,T.useState)({}),[m,C]=(0,T.useState)({}),[k,w]=(0,T.useState)(!1),S=(0,T.useRef)(new Map),P=(0,T.useRef)({values:y,errors:h,touched:m,initialValues:g,isSubmitting:k,formConfig:e});(0,T.useEffect)(()=>{P.current={values:y,errors:h,touched:m,initialValues:g,isSubmitting:k,formConfig:e}});let O=(0,T.useCallback)($=>{if(!$||!$.name)return()=>{};let F={name:$.name,rules:$.rules||[],validateOn:$.validateOn||"blur",label:$.label,defaultValue:$.defaultValue,transform:$.transform,disabled:$.disabled,required:$.required};return S.current.set($.name,F),$.defaultValue!==void 0&&(P.current.values[$.name]===void 0&&(P.current.values[$.name]=$.defaultValue),x(A=>A[$.name]===void 0?{...A,[$.name]:$.defaultValue}:A)),()=>{S.current.delete($.name)}},[]),N=(0,T.useCallback)($=>S.current.get($),[]),X=(0,T.useCallback)(($,F)=>{let A=S.current.get($),W=P.current.values,te=F!==void 0?F:W[$];A?.transform&&(te=(0,ae.applyFieldTransform)(te,A.transform));let j=[...A?.rules||[]];return A?.required&&!j.some(B=>B.type==="required")&&j.unshift({type:"required",message:`${A.label||$} is required`}),(0,ae.validateFieldValue)(te,j,W)},[]),V=(0,T.useCallback)($=>{let F=$||P.current.values,A=Array.from(S.current.values());return(0,ae.validateForm)(F,A)},[]),I=(0,T.useCallback)(($,F)=>{v(A=>{if(F)return{...A,[$]:F};if(A[$]===void 0)return A;let W={...A};return delete W[$],W})},[]),he=(0,T.useCallback)($=>{v({...$})},[]),Ee=(0,T.useCallback)(($,F,A)=>{let W=S.current.get($),te=F;W?.transform&&(te=(0,ae.applyFieldTransform)(F,W.transform)),x(G=>({...G,[$]:te}));let j=W?.validateOn||e?.validateOn||"blur";if(A!==void 0?A:j==="change"){let G=X($,te);I($,G)}},[e?.validateOn,X,I]),Ft=(0,T.useCallback)(($,F=!0,A)=>{C(B=>({...B,[$]:F}));let te=S.current.get($)?.validateOn||e?.validateOn||"blur";if(A!==void 0?A:te==="blur"&&F){let B=X($);I($,B)}},[e?.validateOn,X,I]),Dt=(0,T.useCallback)(($,F=!1)=>{x(A=>F?{...$}:{...A,...$})},[]),Pe=(0,T.useCallback)($=>{w($)},[]),xe=(0,T.useCallback)($=>{let F=$||g;$&&b($),x({...F}),v({}),C({}),w(!1)},[g]),Mt=(0,T.useCallback)(async $=>{if($&&typeof $.preventDefault=="function"&&$.preventDefault(),P.current.isSubmitting)return!1;let F=P.current.values,A={};for(let j of S.current.keys())A[j]=!0;C(A);let W=V(F);if(v(W),!(Object.keys(W).length===0)){if(t?.(W),e?.scrollToFirstError!==!1&&typeof window<"u"&&typeof f<"u"){let B=Object.keys(W)[0];if(B)try{let G=window.document.querySelector(`[name="${B}"], [data-field="${B}"]`);G&&(G.scrollIntoView({behavior:"smooth",block:"center"}),G.focus?.())}catch{}}return!1}w(!0);try{if(l&&l.length>0){let j=l.filter(B=>B.trigger==="submit"&&B.enabled!==!1);if(j.length>0){let B=new ae.ActionPipelineExecutor;$e(B);for(let G of j){let ve=await B.execute(G,{context:{form:F,variables:a?.variables?{...a.variables}:{},nodeId:p,document:f}});if(!ve.success){let Bt=ve.error instanceof Error?ve.error.message:String(ve.error||"Submit pipeline failed"),Ht={code:"ACTION_EXECUTION_ERROR",actionType:G.steps[0]?.type||"submit",nodeId:p,message:`Form submit pipeline failed: ${Bt}`,error:ve.error};return u?.(Ht),a?.onDiagnostic?.(Ht),t?.({_form:Bt}),w(!1),!1}}}}return r&&await r(F,{formId:s,setSubmitting:Pe,resetForm:xe,setErrors:v}),n?.(F),e?.resetOnSubmit&&xe(),!0}catch(j){let B=j instanceof Error?j.message:String(j),G={code:"ACTION_EXECUTION_ERROR",actionType:"submit",nodeId:p,message:`Form submit execution error: ${B}`,error:j};return u?.(G),a?.onDiagnostic?.(G),t?.({_form:B}),!1}finally{w(!1)}},[e,l,p,f,u,a,r,n,t,s,Pe,xe,V]),Ot=(0,T.useMemo)(()=>Object.keys(h).length===0,[h]),Vt=(0,T.useMemo)(()=>eo(y,g),[y,g]),Vn=(0,T.useMemo)(()=>({formId:s,formConfig:e,initialValues:g,values:y,errors:h,touched:m,isSubmitting:k,isValid:Ot,dirty:Vt,setFieldValue:Ee,setFieldTouched:Ft,setFieldError:I,setErrors:he,setValues:Dt,setSubmitting:Pe,resetForm:xe,validateField:X,validateForm:V,handleFormSubmit:Mt,registerField:O,getFieldBinding:N}),[s,e,g,y,h,m,k,Ot,Vt,Ee,Ft,I,he,Dt,Pe,xe,X,V,Mt,O,N]);return(0,dn.jsx)(Be.Provider,{value:Vn,children:c})};function Q(){return(0,T.useContext)(Be)}function to(){return(0,T.useContext)(Be)}function no(){let o=Q();return{isSubmitting:o?.isSubmitting??!1,isValid:o?.isValid??!0,dirty:o?.dirty??!1,errors:o?.errors??{}}}function oo(o,e){let i=Q();i&&o&&i.registerField(e||{name:o}),(0,T.useEffect)(()=>{if(!i||!o)return;let s=i.registerField(e||{name:o});return()=>{s()}},[i,o,e]);let r=i?.values[o]!==void 0?i.values[o]:e?.defaultValue,n=i?.errors[o],t=!!i?.touched[o],l=!!(n&&t),p=(0,T.useCallback)((s,d)=>{i?.setFieldValue(o,s,d)},[i,o]),f=(0,T.useCallback)((s=!0,d)=>{i?.setFieldTouched(o,s,d)},[i,o]),u=(0,T.useCallback)(s=>{i?.setFieldError(o,s)},[i,o]),c=(0,T.useCallback)(s=>{if(s&&typeof s=="object"&&"target"in s&&s.target){let d=s.target;if(d.type==="checkbox")p(d.checked);else if(d.type==="number"){let g=d.value===""?"":Number(d.value);p(g)}else p(d.value)}else p(s)},[p]),a=(0,T.useCallback)(()=>{f(!0)},[f]);return{value:r,error:n,touched:t,isInvalid:l,setValue:p,setTouched:f,setError:u,onChange:c,onBlur:a}}var cn=require("react"),pt=require("react/jsx-runtime"),Y=({as:o="p",id:e,className:i,style:r,value:n,isEditable:t,nodeId:l,onClick:p,onChange:f,...u})=>{let c=(0,cn.useRef)(!1),a=o;return t?(0,pt.jsx)(a,{id:e,className:i,style:{...r,outline:"none",cursor:"text"},contentEditable:!0,suppressContentEditableWarning:!0,"data-kubuild-node":l,onClick:s=>{p?.(s)},onFocus:()=>{c.current=!0},onInput:s=>{let d=s.currentTarget.textContent??"";f?.(d,!1)},onBlur:s=>{c.current=!1;let d=s.currentTarget.textContent??"";f?.(d,!0)},onKeyDown:s=>{s.key==="Escape"&&s.currentTarget.blur()},...u,children:n}):(0,pt.jsx)(a,{id:e,className:i,style:r,onClick:p,"data-kubuild-node":l,...u,children:n})};var se=require("react"),ft=require("react/jsx-runtime"),ro=typeof window<"u"?se.useLayoutEffect:se.useEffect;function un(o){return o?o.replace(/<style\b([^>]*)>([\s\S]*?)<\/style>/gi,(e,i,r)=>{let n=r;return n=n.replace(/(^|[\s,{}])body(?=[\s,{])/g,"$1:host, body"),n=n.replace(/(^|[\s,{}])html(?=[\s,{])/g,"$1:host, html"),`<style${i}>
+:host { display: block; }
+${n}</style>`}):""}var gt=({id:o,style:e,onClick:i,dataKubuildNode:r,html:n,role:t})=>{let l=(0,se.useRef)(null),p=(0,se.useRef)(null),f=(0,se.useMemo)(()=>un(n),[n]);return ro(()=>{let u=l.current;if(u){if(typeof u.attachShadow=="function"){if(!p.current)if(u.shadowRoot)p.current=u.shadowRoot;else try{p.current=u.attachShadow({mode:"open"})}catch{p.current=u.shadowRoot}if(p.current){p.current.innerHTML=f;return}}u.innerHTML=f}},[f]),(0,ft.jsx)("div",{ref:l,id:o,style:e,onClick:i,"data-kubuild-node":r,role:t,children:(0,ft.jsx)("template",{shadowrootmode:"open",dangerouslySetInnerHTML:{__html:f}})})};var me=require("react");var Se=fe(require("react"),1),pn=require("@kubuild/core");async function H(o){let{node:e,trigger:i,document:r,context:n,formContext:t,extraContext:l,onDiagnostic:p,onActionDispatch:f,executor:u}=o;if(!e.actions||!Array.isArray(e.actions)||e.actions.length===0)return{executed:!1,success:!0};let c=e.actions.filter(d=>d.trigger===i&&d.enabled!==!1);if(c.length===0)return{executed:!1,success:!0};let a=u||new pn.ActionPipelineExecutor;$e(a);let s={form:t?{...t.values}:{},variables:n?.variables?{...n.variables}:{},nodeId:e.id,document:r,toastManager:n?.toastManager,modalManager:n?.modalManager,...l||{}};for(let d of c){let g=await a.execute(d,{context:s});if(f&&d.steps.length>0&&f(d.steps[0].type,d.steps[0].payload,e.id),!g.success){let b=g.error instanceof Error?g.error.message:String(g.error||`Action pipeline "${d.id}" failed`),y={code:"ACTION_EXECUTION_ERROR",actionType:d.steps[0]?.type||i,nodeId:e.id,message:b,error:g.error};return p?.(y),n?.onDiagnostic?.(y),{executed:!0,success:!1,error:g.error}}}return{executed:!0,success:!0}}function mt(o,e){if(!o.actions?.some(t=>t.trigger==="load"&&t.enabled!==!1))return;let r=Se.default?.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE||Se.default?.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;if(r?.H||r?.ReactCurrentDispatcher?.current)try{(0,Se.useEffect)(()=>{e.mode!=="editor"&&H({node:o,trigger:"load",document:e.document,context:e.context,formContext:e.formContext,onDiagnostic:e.onDiagnostic,onActionDispatch:e.onActionDispatch})},[o,e.document,e.context,e.formContext,e.onDiagnostic,e.onActionDispatch,e.mode])}catch{}}var D=require("react/jsx-runtime"),bt=({id:o,name:e,action:i,method:r="POST",target:n,autoComplete:t,style:l,onClick:p,mode:f,dataKubuildNode:u,children:c})=>{let a=Q();return(0,D.jsx)("form",{id:o,name:e,action:i,method:r,target:n,autoComplete:t,style:l,onClick:p,onSubmit:g=>{if(f==="editor"){g.preventDefault();return}a&&a.handleFormSubmit(g)},onReset:()=>{a&&a.resetForm()},"data-kubuild-node":u,role:"form","aria-label":e,children:c})},yt=({id:o,name:e,type:i="text",placeholder:r,defaultValue:n,required:t,disabled:l,readOnly:p,rules:f,validateOn:u,transform:c,style:a,onClick:s,actions:d,nodeId:g,document:b,renderContext:y,onDiagnostic:x,onActionDispatch:h,dataKubuildNode:v})=>{let m=Q();if(m&&e&&m.registerField({name:e,defaultValue:n,required:t,disabled:l,rules:f||[],validateOn:u,transform:c}),(0,me.useEffect)(()=>{if(!m||!e)return;let V=m.registerField({name:e,defaultValue:n,required:t,disabled:l,rules:f||[],validateOn:u,transform:c});return()=>{V()}},[m,e,n,t,l,f,u,c]),!m||!e)return(0,D.jsx)("input",{id:o,type:i,name:e,placeholder:r,defaultValue:n!==void 0?String(n):void 0,required:t,disabled:l,readOnly:p,style:a,onClick:s,"data-kubuild-node":v});let C=m.values[e],k=C!=null?String(C):n!=null?String(n):"",w=m.errors[e],S=!!m.touched[e],P=!!(w&&S);return(0,D.jsx)("input",{id:o,type:i,name:e,placeholder:r,value:k,onChange:V=>{let I=V.target.value;i==="number"&&(I=V.target.value===""?"":Number(V.target.value)),m.setFieldValue(e,I),d&&d.length>0&&H({node:{id:g||o||e,type:"input",actions:d},trigger:"change",document:b,context:y,formContext:m,extraContext:{fieldName:e,fieldValue:I},onDiagnostic:x,onActionDispatch:h})},onBlur:()=>{m.setFieldTouched(e,!0),d&&d.length>0&&H({node:{id:g||o||e,type:"input",actions:d},trigger:"blur",document:b,context:y,formContext:m,extraContext:{fieldName:e,fieldValue:m.values[e]},onDiagnostic:x,onActionDispatch:h})},onFocus:()=>{d&&d.length>0&&H({node:{id:g||o||e,type:"input",actions:d},trigger:"focus",document:b,context:y,formContext:m,extraContext:{fieldName:e,fieldValue:m.values[e]},onDiagnostic:x,onActionDispatch:h})},required:t,disabled:l,readOnly:p,style:a,onClick:s,"data-kubuild-node":v,"data-field":e,"data-invalid":P?"true":void 0,"aria-invalid":P?!0:void 0,"aria-errormessage":w?`${o}-error`:void 0})},ht=({id:o,name:e,placeholder:i,defaultValue:r,rows:n=4,required:t,disabled:l,readOnly:p,rules:f,validateOn:u,transform:c,style:a,onClick:s,actions:d,nodeId:g,document:b,renderContext:y,onDiagnostic:x,onActionDispatch:h,dataKubuildNode:v})=>{let m=Q();if(m&&e&&m.registerField({name:e,defaultValue:r,required:t,disabled:l,rules:f||[],validateOn:u,transform:c}),(0,me.useEffect)(()=>{if(!m||!e)return;let V=m.registerField({name:e,defaultValue:r,required:t,disabled:l,rules:f||[],validateOn:u,transform:c});return()=>{V()}},[m,e,r,t,l,f,u,c]),!m||!e)return(0,D.jsx)("textarea",{id:o,name:e,placeholder:i,defaultValue:r!==void 0?String(r):void 0,rows:n,required:t,disabled:l,readOnly:p,style:a,onClick:s,"data-kubuild-node":v});let C=m.values[e],k=C!=null?String(C):r!=null?String(r):"",w=m.errors[e],S=!!m.touched[e],P=!!(w&&S);return(0,D.jsx)("textarea",{id:o,name:e,placeholder:i,rows:n,value:k,onChange:V=>{m.setFieldValue(e,V.target.value),d&&d.length>0&&H({node:{id:g||o||e,type:"textarea",actions:d},trigger:"change",document:b,context:y,formContext:m,extraContext:{fieldName:e,fieldValue:V.target.value},onDiagnostic:x,onActionDispatch:h})},onBlur:()=>{m.setFieldTouched(e,!0),d&&d.length>0&&H({node:{id:g||o||e,type:"textarea",actions:d},trigger:"blur",document:b,context:y,formContext:m,extraContext:{fieldName:e,fieldValue:m.values[e]},onDiagnostic:x,onActionDispatch:h})},onFocus:()=>{d&&d.length>0&&H({node:{id:g||o||e,type:"textarea",actions:d},trigger:"focus",document:b,context:y,formContext:m,extraContext:{fieldName:e,fieldValue:m.values[e]},onDiagnostic:x,onActionDispatch:h})},required:t,disabled:l,readOnly:p,style:a,onClick:s,"data-kubuild-node":v,"data-field":e,"data-invalid":P?"true":void 0,"aria-invalid":P?!0:void 0,"aria-errormessage":w?`${o}-error`:void 0})},xt=({id:o,name:e,placeholder:i,defaultValue:r,required:n,disabled:t,rules:l,validateOn:p,optionsList:f,style:u,onClick:c,actions:a,nodeId:s,document:d,renderContext:g,onDiagnostic:b,onActionDispatch:y,dataKubuildNode:x})=>{let h=Q();if(h&&e&&h.registerField({name:e,defaultValue:r,required:n,disabled:t,rules:l||[],validateOn:p}),(0,me.useEffect)(()=>{if(!h||!e)return;let N=h.registerField({name:e,defaultValue:r,required:n,disabled:t,rules:l||[],validateOn:p});return()=>{N()}},[h,e,r,n,t,l,p]),!h||!e)return(0,D.jsxs)("select",{id:o,name:e,defaultValue:r!==void 0?String(r):"",required:n,disabled:t,style:u,onClick:c,"data-kubuild-node":x,children:[i&&(0,D.jsx)("option",{value:"",disabled:!0,children:i}),f.map((N,X)=>(0,D.jsx)("option",{value:N.value,children:N.label},X))]});let v=h.values[e],m=v!=null?String(v):r!=null?String(r):"",C=h.errors[e],k=!!h.touched[e],w=!!(C&&k);return(0,D.jsxs)("select",{id:o,name:e,value:m,onChange:N=>{h.setFieldValue(e,N.target.value),a&&a.length>0&&H({node:{id:s||o||e,type:"select",actions:a},trigger:"change",document:d,context:g,formContext:h,extraContext:{fieldName:e,fieldValue:N.target.value},onDiagnostic:b,onActionDispatch:y})},onBlur:()=>{h.setFieldTouched(e,!0),a&&a.length>0&&H({node:{id:s||o||e,type:"select",actions:a},trigger:"blur",document:d,context:g,formContext:h,extraContext:{fieldName:e,fieldValue:h.values[e]},onDiagnostic:b,onActionDispatch:y})},onFocus:()=>{a&&a.length>0&&H({node:{id:s||o||e,type:"select",actions:a},trigger:"focus",document:d,context:g,formContext:h,extraContext:{fieldName:e,fieldValue:h.values[e]},onDiagnostic:b,onActionDispatch:y})},required:n,disabled:t,style:u,onClick:c,"data-kubuild-node":x,"data-field":e,"data-invalid":w?"true":void 0,"aria-invalid":w?!0:void 0,"aria-errormessage":C?`${o}-error`:void 0,children:[i&&(0,D.jsx)("option",{value:"",disabled:!0,children:i}),f.map((N,X)=>(0,D.jsx)("option",{value:N.value,children:N.label},X))]})},vt=({id:o,name:e,label:i="",defaultChecked:r=!1,required:n,disabled:t,rules:l,validateOn:p,style:f,onClick:u,actions:c,nodeId:a,document:s,renderContext:d,onDiagnostic:g,onActionDispatch:b,dataKubuildNode:y,isEditable:x,onNodePropChange:h})=>{let v=Q();v&&e&&v.registerField({name:e,defaultValue:r,required:n,disabled:t,rules:l||[],validateOn:p}),(0,me.useEffect)(()=>{if(!v||!e)return;let w=v.registerField({name:e,defaultValue:r,required:n,disabled:t,rules:l||[],validateOn:p});return()=>{w()}},[v,e,r,n,t,l,p]);let m=v&&e&&v.values[e]!==void 0?!!v.values[e]:r;return(0,D.jsxs)("label",{id:o,style:f,onClick:u,"data-kubuild-node":y,children:[(0,D.jsx)("input",{type:"checkbox",name:e,checked:m,onChange:w=>{v&&e&&(v.setFieldValue(e,w.target.checked),c&&c.length>0&&H({node:{id:a||o||e,type:"checkbox",actions:c},trigger:"change",document:s,context:d,formContext:v,extraContext:{fieldName:e,fieldValue:w.target.checked},onDiagnostic:g,onActionDispatch:b}))},onBlur:()=>{v&&e&&(v.setFieldTouched(e,!0),c&&c.length>0&&H({node:{id:a||o||e,type:"checkbox",actions:c},trigger:"blur",document:s,context:d,formContext:v,extraContext:{fieldName:e,fieldValue:m},onDiagnostic:g,onActionDispatch:b}))},required:n,disabled:t,style:{cursor:t?"not-allowed":"pointer"},"data-field":e}),x?(0,D.jsx)(Y,{as:"span",value:i,isEditable:x,nodeId:y||"",onChange:(w,S)=>h?.(y||"","label",w,S)}):(0,D.jsx)("span",{children:i})]})},Rt=({id:o,name:e,label:i="",value:r="",defaultChecked:n=!1,required:t,disabled:l,rules:p,validateOn:f,style:u,onClick:c,actions:a,nodeId:s,document:d,renderContext:g,onDiagnostic:b,onActionDispatch:y,dataKubuildNode:x,isEditable:h,onNodePropChange:v})=>{let m=Q();m&&e&&m.registerField({name:e,defaultValue:n?r:void 0,required:t,disabled:l,rules:p||[],validateOn:f}),(0,me.useEffect)(()=>{if(!m||!e)return;let S=m.registerField({name:e,defaultValue:n?r:void 0,required:t,disabled:l,rules:p||[],validateOn:f});return()=>{S()}},[m,e,n,r,t,l,p,f]);let C=m&&e&&m.values[e]!==void 0?m.values[e]===r:n;return(0,D.jsxs)("label",{id:o,style:u,onClick:c,"data-kubuild-node":x,children:[(0,D.jsx)("input",{type:"radio",name:e,value:r,checked:C,onChange:()=>{m&&e&&(m.setFieldValue(e,r),a&&a.length>0&&H({node:{id:s||o||e,type:"radio",actions:a},trigger:"change",document:d,context:g,formContext:m,extraContext:{fieldName:e,fieldValue:r},onDiagnostic:b,onActionDispatch:y}))},onBlur:()=>{m&&e&&(m.setFieldTouched(e,!0),a&&a.length>0&&H({node:{id:s||o||e,type:"radio",actions:a},trigger:"blur",document:d,context:g,formContext:m,extraContext:{fieldName:e,fieldValue:r},onDiagnostic:b,onActionDispatch:y}))},required:t,disabled:l,style:{cursor:l?"not-allowed":"pointer"},"data-field":e}),h?(0,D.jsx)(Y,{as:"span",value:i,isEditable:h,nodeId:x||"",onChange:(S,P)=>v?.(x||"","label",S,P)}):(0,D.jsx)("span",{children:i})]})};async function fn(o){let{event:e,buttonType:i,disabled:r,formRuntime:n,onClick:t,node:l,actions:p,document:f,renderContext:u,onDiagnostic:c,onActionDispatch:a,executeActions:s=H}=o;if(r)return;if(i==="submit"){if(n&&!await n.handleFormSubmit(e))return}else i==="reset"&&n?.resetForm();if(t){t(e);return}let d=l||(p?{id:"button",type:"button",actions:p}:void 0);d?.actions&&d.actions.length>0&&await s({node:d,trigger:"click",document:f,context:u,formContext:n,onDiagnostic:c,onActionDispatch:a})}var kt=({id:o,buttonType:e,disabled:i,ariaLabel:r,style:n,onClick:t,actions:l,node:p,document:f,renderContext:u,onDiagnostic:c,onActionDispatch:a,dataKubuildNode:s,actionAttrs:d,children:g})=>{let b=Q(),y=b?.isSubmitting===!0,x=i||e==="submit"&&y;return(0,D.jsx)("button",{id:o,type:e,disabled:x,"aria-disabled":x?!0:void 0,"aria-label":r,"aria-busy":e==="submit"&&y?!0:void 0,tabIndex:x?-1:0,style:n,onClick:x?void 0:async v=>{await fn({event:v,buttonType:e,disabled:x,formRuntime:b,onClick:t,node:p||(l?{id:s||o||"button",type:"button",actions:l}:void 0),document:f,renderContext:u,onDiagnostic:c,onActionDispatch:a})},"data-kubuild-node":s,...d,children:g})};function Ct(o){return o?o.replace(/[-_](\w)/g,(e,i)=>i.toUpperCase()).replace(/^\w/,e=>e.toUpperCase()):""}function wt(o){if(!o||typeof o!="string")return null;let e=o.match(/(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/\s]{11})/i);return e?e[1]:null}function $t(o){if(!o||typeof o!="string")return null;let e=o.match(/(?:vimeo\.com\/(?:channels\/(?:\w+\/)?|groups\/([^\/]*)\/videos\/|album\/(\d+)\/video\/|video\/|))(\d+)/i);return e?e[3]:null}function St(o){if(o==="16:9")return"16 / 9";if(o==="4:3")return"4 / 3";if(o==="1:1")return"1 / 1";if(o==="9:16")return"9 / 16";if(typeof o=="string"&&o!=="auto")return o.replace(":"," / ")}var He=fe(require("react"),1),gn=require("@kubuild/schema");var z=require("react/jsx-runtime");function Tt(o){let{node:e,domId:i,styles:r,resolvedProps:n,props:t,childrenElements:l,handleClick:p,context:f,mode:u,isModalOpen:c}=o,a=n.modalId||t.modalId||e.id,s=String(a).trim(),d=f?.modalManager||Z,g=u==="editor"&&f?.artboardSurface==="component";switch(e.type){case"modal":{if(!c&&u==="runtime")return(0,z.jsx)(He.default.Fragment,{});let b=n.backdrop!==!1&&t.backdrop!==!1,y=n.closeOnBackdrop!==!1&&t.closeOnBackdrop!==!1,x=n.showCloseButton!==!1&&t.showCloseButton!==!1,h=n.title??t.title,v=h!==void 0?String(h):void 0,m=n.size||t.size||"md",C=m==="sm"?"400px":m==="lg"?"768px":m==="fullscreen"?"100%":"560px",k=m==="fullscreen"?"100%":"auto";return(0,z.jsx)("div",{id:`${i}-overlay`,"data-kubuild-overlay":s,"data-kubuild-isolated":g?"true":void 0,style:g?{position:"relative",display:"flex",alignItems:"flex-start",justifyContent:"center",padding:m==="fullscreen"?"0":"16px"}:{position:u==="editor"?"absolute":"fixed",top:0,left:0,right:0,bottom:0,backgroundColor:b?"rgba(15, 23, 42, 0.65)":"transparent",backdropFilter:b?"blur(4px)":"none",display:"flex",alignItems:m==="fullscreen"?"stretch":"center",justifyContent:"center",zIndex:9999,padding:m==="fullscreen"?"0":"16px"},onClick:w=>{w.target===w.currentTarget&&y&&u==="runtime"&&d.closeModal(s)},children:(0,z.jsxs)("div",{id:i,style:{...r,position:"relative",boxSizing:"border-box",maxWidth:C,height:k,width:"100%"},onClick:p,"data-kubuild-node":e.id,role:"dialog","aria-modal":"true","aria-label":typeof v=="string"?v:"Modal Dialog",children:[x&&(0,z.jsx)("button",{type:"button","aria-label":"Close modal",style:{position:"absolute",top:"14px",right:"14px",background:"transparent",border:"none",fontSize:"18px",cursor:"pointer",color:"#64748b",padding:"4px 8px",lineHeight:1},onClick:w=>{w.stopPropagation(),d.closeModal(s)},children:"\u2715"}),v&&(0,z.jsx)("div",{style:{fontWeight:600,fontSize:"18px",marginBottom:"16px",color:"#0f172a"},children:String(v)}),l]})})}case"drawer":{if(!c&&u==="runtime")return(0,z.jsx)(He.default.Fragment,{});let b=n.placement||t.placement||"right",y=n.backdrop!==!1&&t.backdrop!==!1,x=n.closeOnBackdrop!==!1&&t.closeOnBackdrop!==!1,h=n.showCloseButton!==!1&&t.showCloseButton!==!1,v=n.title??t.title,m=v!==void 0?String(v):void 0,C=b==="top"||b==="bottom";return(0,z.jsx)("div",{id:`${i}-overlay`,"data-kubuild-overlay":s,"data-kubuild-isolated":g?"true":void 0,style:g?{position:"relative",display:"flex",justifyContent:b==="left"?"flex-start":b==="right"?"flex-end":"center",alignItems:"flex-start",padding:"16px"}:{position:u==="editor"?"absolute":"fixed",top:0,left:0,right:0,bottom:0,backgroundColor:y?"rgba(15, 23, 42, 0.5)":"transparent",backdropFilter:y?"blur(2px)":"none",display:"flex",justifyContent:b==="left"?"flex-start":b==="right"?"flex-end":"center",alignItems:b==="top"?"flex-start":b==="bottom"?"flex-end":"stretch",zIndex:9999},onClick:k=>{k.target===k.currentTarget&&x&&u==="runtime"&&d.closeModal(s)},children:(0,z.jsxs)("div",{id:i,style:{...r,position:"relative",boxSizing:"border-box",height:g||C?"auto":"100%",...g?{minHeight:"240px"}:{},width:C?"100%":r.width||"320px",maxHeight:g?"none":C?"80vh":"100%",overflowY:"auto"},onClick:p,"data-kubuild-node":e.id,role:"region","aria-label":typeof m=="string"?m:"Drawer",children:[h&&(0,z.jsx)("button",{type:"button","aria-label":"Close drawer",style:{position:"absolute",top:"14px",right:"14px",background:"transparent",border:"none",fontSize:"18px",cursor:"pointer",color:"#64748b",padding:"4px 8px",lineHeight:1},onClick:k=>{k.stopPropagation(),d.closeModal(s)},children:"\u2715"}),m&&(0,z.jsx)("div",{style:{fontWeight:600,fontSize:"18px",marginBottom:"16px",color:"#0f172a"},children:String(m)}),l]})})}case"collapsible":return(0,z.jsx)("div",{id:i,style:{...r,display:(u==="editor"?!0:!!c)?r.display||"block":"none"},onClick:p,"data-kubuild-node":e.id,"data-kubuild-collapsible":s,children:l});case gn.ARTBOARD_REFERENCE_NODE_TYPE:{if(u==="runtime")return(0,z.jsx)(He.default.Fragment,{});let b=typeof t.artboardId=="string"?t.artboardId:void 0,y=(typeof t.label=="string"&&t.label.trim().length>0?t.label:b)||"artboard";return(0,z.jsxs)("div",{id:i,style:{display:"inline-flex",alignItems:"center",gap:"6px",padding:"6px 10px",border:"1px dashed #94a3b8",borderRadius:"6px",backgroundColor:"#f8fafc",color:"#475569",fontSize:"12px",fontFamily:"ui-sans-serif, system-ui, sans-serif",cursor:"pointer",...r},onClick:p,"data-kubuild-node":e.id,"data-kubuild-artboard-reference":b,title:`Opens artboard "${y}" \u2014 edit it on its own canvas surface`,children:[(0,z.jsx)("span",{"aria-hidden":"true",children:"\u29C9"}),(0,z.jsx)("span",{children:`Opens: ${y}`})]})}default:return null}}var R=require("react/jsx-runtime");function bn(o){let{node:e,document:i,definition:r,resolvedProps:n,styles:t,context:l,childrenElements:p,handleClick:f}=o;if(r?.renderer&&typeof r.renderer=="function"){let u=r.renderer;return typeof u=="function"&&!u.prototype?.isReactComponent?u({node:e,document:i,props:n,styles:t,context:l,children:p,onClick:f}):(0,R.jsx)(u,{node:e,document:i,props:n,styles:t,context:l,onClick:f,children:p})}return null}function yn(o){let{node:e,domId:i,styles:r,resolvedProps:n,props:t,handleClick:l,childrenElements:p}=o;switch(e.type){case"page":return(0,R.jsx)("div",{id:i,style:r,onClick:l,"data-kubuild-node":e.id,children:p});case"section":{let f=typeof n.ariaLabel=="string"?n.ariaLabel:typeof t.ariaLabel=="string"?t.ariaLabel:void 0;return(0,R.jsx)("section",{id:i,style:r,onClick:l,"data-kubuild-node":e.id,"aria-label":f,children:p})}case"container":return(0,R.jsx)("div",{id:i,style:r,onClick:l,"data-kubuild-node":e.id,children:p});case"columns":return(0,R.jsx)("div",{id:i,style:r,onClick:l,"data-kubuild-node":e.id,children:p});case"flex":case"grid":{let f=typeof n.ariaLabel=="string"?n.ariaLabel:typeof t.ariaLabel=="string"?t.ariaLabel:void 0;return(0,R.jsx)("div",{id:i,style:r,onClick:l,"data-kubuild-node":e.id,"aria-label":f,children:p})}default:return null}}function hn(o){let{node:e,domId:i,styles:r,resolvedProps:n,props:t,mode:l,handleClick:p,onNodePropChange:f,childrenElements:u}=o;switch(e.type){case"heading":{let c=typeof n.level=="number"?n.level:1,a=`h${Math.min(Math.max(c,1),6)}`||"h1",s=String(n.text??n.content??t.text??t.content??""),d=l==="editor"&&!(0,M.isVariableBinding)(t.text)&&!(0,M.isVariableBinding)(t.content);return(0,R.jsx)(Y,{as:a,id:i,style:r,value:s,isEditable:d,nodeId:e.id,onClick:p,onChange:(g,b)=>f?.(e.id,"text",g,b)})}case"text":{let c=String(n.text??n.content??t.text??t.content??""),a=typeof n.as=="string"?n.as:typeof t.as=="string"?t.as:typeof n.tag=="string"?n.tag:typeof t.tag=="string"?t.tag:(t.content!==void 0||n.content!==void 0)&&t.text===void 0&&n.text===void 0?"p":"span",s=l==="editor"&&!(0,M.isVariableBinding)(t.text)&&!(0,M.isVariableBinding)(t.content);return(0,R.jsx)(Y,{as:a,id:i,style:r,value:c,isEditable:s,nodeId:e.id,onClick:p,onChange:(d,g)=>f?.(e.id,"text",d,g)})}case"paragraph":{let c=String(n.text??n.content??t.text??t.content??""),a=l==="editor"&&!(0,M.isVariableBinding)(t.text)&&!(0,M.isVariableBinding)(t.content);return(0,R.jsx)(Y,{as:"p",id:i,style:r,value:c,isEditable:a,nodeId:e.id,onClick:p,onChange:(s,d)=>f?.(e.id,"text",s,d)})}case"link":{let c=String(n.text??n.label??n.content??t.text??t.label??t.content??""),a=typeof n.href=="string"?n.href:"#",s=typeof n.target=="string"?n.target:void 0,d=l==="editor"&&!(0,M.isVariableBinding)(t.text)&&!(0,M.isVariableBinding)(t.label)&&!(0,M.isVariableBinding)(t.content),g=typeof n.rel=="string"?n.rel:s==="_blank"?"noopener noreferrer":void 0,b=l==="editor"?void 0:(0,J.sanitizeUrl)(a,"#"),y=x=>{l==="editor"&&x.preventDefault(),p(x)};return d?(0,R.jsx)(Y,{as:"a",id:i,style:r,value:c,isEditable:d,nodeId:e.id,onClick:y,onChange:(x,h)=>{let v="text"in t?"text":"label";f?.(e.id,v,x,h)},href:b,target:s,rel:g}):(0,R.jsx)("a",{id:i,style:r,href:b,target:s,rel:g,onClick:y,"data-kubuild-node":e.id,children:c})}case"blockquote":{let c=typeof n.quote=="string"?n.quote:typeof n.text=="string"?n.text:typeof t.quote=="string"?t.quote:typeof t.text=="string"?t.text:void 0,a=typeof n.cite=="string"?n.cite:typeof t.cite=="string"?t.cite:void 0,s=l==="editor"&&!(0,M.isVariableBinding)(t.quote)&&!(0,M.isVariableBinding)(t.text),d={borderLeft:"4px solid #cbd5e1",paddingLeft:"1rem",margin:"1rem 0",fontStyle:"italic",color:"#475569",...r};return(0,R.jsxs)("blockquote",{id:i,style:d,onClick:p,"data-kubuild-node":e.id,cite:a,children:[c!==void 0?s?(0,R.jsx)(Y,{as:"p",value:c,isEditable:s,nodeId:e.id,onChange:(g,b)=>{let y="quote"in t?"quote":"text";f?.(e.id,y,g,b)}}):(0,R.jsx)("p",{children:c}):null,u,a&&(0,R.jsxs)("cite",{style:{display:"block",fontStyle:"normal",fontSize:"0.875rem",marginTop:"0.5rem",color:"#64748b"},children:["\u2014 ",a]})]})}case"badge":{let c=String(n.text??n.label??t.text??t.label??""),a=typeof n.variant=="string"?n.variant:typeof t.variant=="string"?t.variant:"default",s=l==="editor"&&!(0,M.isVariableBinding)(t.text)&&!(0,M.isVariableBinding)(t.label);return(0,R.jsx)("span",{id:i,style:r,onClick:p,"data-kubuild-node":e.id,"data-variant":a,"data-badge-variant":a,children:s?(0,R.jsx)(Y,{as:"span",value:c,isEditable:s,nodeId:e.id,onChange:(d,g)=>{let b="text"in t?"text":"label";f?.(e.id,b,d,g)}}):c})}case"code-block":{let c=String(n.code??t.code??""),a=typeof n.language=="string"?n.language:typeof t.language=="string"?t.language:"plaintext";return l==="editor"?(0,R.jsx)("pre",{id:i,style:r,onClick:p,"data-kubuild-node":e.id,"data-language":a,children:(0,R.jsx)("code",{className:`language-${a}`,contentEditable:!0,suppressContentEditableWarning:!0,onBlur:s=>f?.(e.id,"code",s.currentTarget.textContent??"",!0),children:c})}):(0,R.jsx)("pre",{id:i,style:r,onClick:p,"data-kubuild-node":e.id,"data-language":a,children:(0,R.jsx)("code",{className:`language-${a}`,children:c})})}default:return null}}function xn(o){let{node:e,domId:i,styles:r,resolvedProps:n,props:t,mode:l,handleClick:p,onNodePropChange:f,childrenElements:u}=o;switch(e.type){case"list":{let a=(n.tag||t.tag)==="ol"||n.ordered===!0||t.ordered===!0?"ol":"ul",s=typeof n.listStyleType=="string"?n.listStyleType:typeof n.listStyle=="string"?n.listStyle:typeof t.listStyleType=="string"?t.listStyleType:typeof t.listStyle=="string"?t.listStyle:void 0,d=s==="custom-icon"||s==="none"?"none":s,g={...r,...d?{listStyleType:d}:{}};return(0,R.jsx)(a,{id:i,style:g,onClick:p,"data-kubuild-node":e.id,"data-list-style":s,children:u})}case"list-item":{let c=n.text!==void 0?String(n.text):t.text!==void 0?String(t.text):void 0,a=l==="editor"&&!(0,M.isVariableBinding)(t.text)&&c!==void 0;return(0,R.jsxs)("li",{id:i,style:r,onClick:p,"data-kubuild-node":e.id,children:[c!==void 0&&(a?(0,R.jsx)(Y,{as:"span",value:c,isEditable:a,nodeId:e.id,onChange:(s,d)=>f?.(e.id,"text",s,d)}):c),u]})}default:return null}}function vn(o){let{node:e,domId:i,styles:r,resolvedProps:n,props:t,mode:l,handleClick:p,onNodePropChange:f,childrenElements:u}=o;switch(e.type){case"table":{let c=typeof n.cellPadding=="number"?n.cellPadding:void 0,a=typeof n.cellSpacing=="number"?n.cellSpacing:void 0,s=typeof n.border=="number"?n.border:void 0,d=n.striped===!0||t.striped===!0,g=n.bordered===!0||t.bordered===!0,b=n.hover===!0||t.hover===!0,y=n.compact===!0||t.compact===!0;return(0,R.jsx)("table",{id:i,style:r,cellPadding:c,cellSpacing:a,border:s,onClick:p,"data-kubuild-node":e.id,"data-striped":d?"true":void 0,"data-bordered":g?"true":void 0,"data-hover":b?"true":void 0,"data-compact":y?"true":void 0,children:(0,R.jsx)("tbody",{children:u})})}case"table-row":return(0,R.jsx)("tr",{id:i,style:r,onClick:p,"data-kubuild-node":e.id,children:u});case"table-cell":{let a=n.tag==="th"||t.tag==="th"||n.isHeader===!0||t.isHeader===!0||n.cellType==="header"||t.cellType==="header"||n.type==="th"||t.type==="th"?"th":"td",s=typeof n.colSpan=="number"?n.colSpan:typeof t.colSpan=="number"?t.colSpan:void 0,d=typeof n.rowSpan=="number"?n.rowSpan:typeof t.rowSpan=="number"?t.rowSpan:void 0,g=n.text!==void 0?String(n.text):t.text!==void 0?String(t.text):void 0,b=l==="editor"&&!(0,M.isVariableBinding)(t.text)&&g!==void 0;return(0,R.jsxs)(a,{id:i,colSpan:s,rowSpan:d,style:r,onClick:p,"data-kubuild-node":e.id,children:[g!==void 0&&(b?(0,R.jsx)(Y,{as:"span",value:g,isEditable:b,nodeId:e.id,onChange:(y,x)=>f?.(e.id,"text",y,x)}):g),u]})}default:return null}}function Rn(o){let{node:e,domId:i,styles:r,resolvedProps:n,props:t,context:l,mode:p,handleClick:f}=o;switch(e.type){case"image":{let u=n.src!==void 0?n.src:t.src!==void 0?t.src:t.asset,c;(0,M.isAssetReference)(u)?c=Ie(l?.assetProvider,u.assetId)||u.fallbackUrl:typeof u=="string"&&(c=Ie(l?.assetProvider,u)||u);let a=typeof n.alt=="string"?n.alt:typeof t.alt=="string"?t.alt:"",s=typeof n.fit=="string"?n.fit:void 0,d=n.loading==="eager"?"eager":"lazy",g=typeof n.width=="number"?n.width:void 0,b=typeof n.height=="number"?n.height:void 0,y=c?(0,J.sanitizeUrl)(c,""):void 0,x=r?.objectFit,h={...r,...s&&x===void 0?{objectFit:s}:{}};return(0,R.jsx)("img",{id:i,src:y,alt:a,role:a===""?"presentation":void 0,loading:d,width:g,height:b,style:h,onClick:f,"data-kubuild-node":e.id})}case"video":{let u=n.src??n.url??t.src??t.url,c=typeof u=="string"?u:void 0,a=typeof n.poster=="string"?n.poster:void 0,s=n.controls!==!1,d=n.autoplay===!0,g=n.loop===!0,b=n.muted===!0,y=n.playsInline!==!1,x=n.aspectRatio,h={position:"relative",width:r.width||"100%",...x?{aspectRatio:St(x)}:{},...r},v=c?wt(c):null,m=c?$t(c):null;if(v){let w=`https://www.youtube.com/embed/${v}?autoplay=${d?1:0}&loop=${g?1:0}&mute=${b?1:0}&controls=${s?1:0}`,S=(0,J.sanitizeUrl)(w,"");return(0,R.jsx)("div",{id:i,"data-video-provider":"youtube",style:h,onClick:f,"data-kubuild-node":e.id,children:(0,R.jsx)("iframe",{src:S,title:"YouTube video player",style:{width:"100%",height:"100%",border:0},allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",allowFullScreen:!0})})}if(m){let w=`https://player.vimeo.com/video/${m}?autoplay=${d?1:0}&loop=${g?1:0}&muted=${b?1:0}`,S=(0,J.sanitizeUrl)(w,"");return(0,R.jsx)("div",{id:i,"data-video-provider":"vimeo",style:h,onClick:f,"data-kubuild-node":e.id,children:(0,R.jsx)("iframe",{src:S,title:"Vimeo video player",style:{width:"100%",height:"100%",border:0},allow:"autoplay; fullscreen; picture-in-picture",allowFullScreen:!0})})}let C=c?(0,J.sanitizeUrl)(c,""):void 0,k=a?(0,J.sanitizeUrl)(a,""):void 0;return(0,R.jsx)("video",{id:i,src:C,poster:k,controls:s,autoPlay:d,loop:g,muted:b,playsInline:y,style:h,onClick:f,"data-kubuild-node":e.id})}case"icon":{let u=typeof n.name=="string"?n.name:"Square",c=typeof n.size=="number"?n.size:24,a=typeof n.color=="string"?n.color:"currentColor",s=typeof n.strokeWidth=="number"?n.strokeWidth:2,d=Ct(u),g=le.icons[d]||le.icons[u]||le.Package;return(0,R.jsx)("span",{id:i,"data-icon-name":u,style:{display:"inline-flex",alignItems:"center",justifyContent:"center",...r},onClick:f,"data-kubuild-node":e.id,children:(0,R.jsx)(g,{size:c,color:a,strokeWidth:s})})}case"html-embed":{let u=typeof n.html=="string"?n.html:"",a=n.sanitize!==!1?(0,J.sanitizeHtml)(u):u;return!a.trim()&&p==="editor"?(0,R.jsx)("div",{id:i,style:{...r,minHeight:"60px",border:"1px dashed #94a3b8",borderRadius:"4px",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:"#f8fafc",color:"#64748b",fontSize:"0.875rem"},onClick:f,"data-kubuild-node":e.id,children:(0,R.jsx)("span",{children:"</> HTML Embed \u2014 Click to configure HTML code in Inspector Panel"})}):(0,R.jsx)(gt,{id:i,style:r,html:a,onClick:f,dataKubuildNode:e.id})}default:return null}}function kn(o){let{node:e,domId:i,styles:r,resolvedProps:n,props:t,context:l,mode:p,document:f,onDiagnostic:u,onActionDispatch:c,handleClick:a,onNodePropChange:s,childrenElements:d}=o;switch(e.type){case"button":{let g=n.label??n.text??n.content??t.label??t.text??t.content??"Button",b=n.activeLabel??t.activeLabel,y=String(o.isModalOpen&&b?b:g),x=typeof n.href=="string"?n.href:typeof t.href=="string"?t.href:void 0,h=typeof n.target=="string"?n.target:typeof t.target=="string"?t.target:void 0,v=n.buttonType??n.type??t.buttonType??t.type,m=typeof v=="string"&&["submit","reset","button"].includes(v)?v:"button",C=n.disabled===!0||t.disabled===!0,k=typeof n.ariaLabel=="string"?n.ariaLabel:void 0,w=p==="editor"&&t.isEditable!==!1&&!(0,M.isVariableBinding)(t.label)&&!(0,M.isVariableBinding)(t.text),S=typeof n.rel=="string"?n.rel:typeof t.rel=="string"?t.rel:h==="_blank"?"noopener noreferrer":void 0,P={};if(t.action&&!C){let O=typeof t.action=="object"?t.action.type:t.action;if(P["data-kubuild-action"]=O,l?.actionRegistry){let N=Ke(l.actionRegistry,O);P["data-kubuild-action-resolved"]=N?"true":"false"}}if(x&&!C){let O=p==="editor"?void 0:(0,J.sanitizeUrl)(x,"#");return(0,R.jsx)("a",{id:i,href:O,target:h,rel:S,tabIndex:0,style:r,onClick:a,"data-kubuild-node":e.id,"aria-label":k,...P,children:y})}return w?(0,R.jsx)(Y,{as:"button",id:i,type:p==="editor"?"button":m,disabled:C,"aria-disabled":C?!0:void 0,"aria-label":k,tabIndex:C?-1:0,style:r,value:y,isEditable:w,nodeId:e.id,onClick:C?void 0:a,onChange:(O,N)=>s?.(e.id,"label",O,N),...P}):(0,R.jsx)(kt,{id:i,buttonType:p==="editor"?"button":m,disabled:C,ariaLabel:k,style:r,onClick:C?void 0:a,actions:e.actions,node:e,document:f,renderContext:l,onDiagnostic:u,onActionDispatch:c,dataKubuildNode:e.id,actionAttrs:P,children:y})}case"form":{let g=typeof n.action=="string"?n.action:void 0,b=typeof n.method=="string"?n.method:"POST",y=typeof n.target=="string"?n.target:void 0,x=typeof n.autoComplete=="string"?n.autoComplete:void 0,h=typeof n.name=="string"?n.name:void 0,v=e.formConfig,m={formId:v?.formId||t.formId||h||e.id,resetOnSubmit:n.resetOnSubmit===!0||(v?.resetOnSubmit??!1),scrollToFirstError:n.scrollToFirstError!==!1&&(v?.scrollToFirstError??!0),validateOn:n.validateOn||v?.validateOn||"blur",initialValues:n.initialValues||v?.initialValues};return(0,R.jsx)(ut,{formId:m.formId,formConfig:m,initialValues:m.initialValues,actions:e.actions,nodeId:e.id,document:f,onDiagnostic:u,children:(0,R.jsx)(bt,{id:i,name:h,action:g&&p!=="editor"?(0,J.sanitizeUrl)(g,""):void 0,method:b,target:y,autoComplete:x,style:r,onClick:a,mode:p,dataKubuildNode:e.id,children:d})})}case"input":{let g=typeof n.name=="string"?n.name:void 0,b=typeof n.type=="string"?n.type:"text",y=typeof n.placeholder=="string"?n.placeholder:void 0,x=n.defaultValue!==void 0?n.defaultValue:void 0,h=n.required===!0,v=n.disabled===!0,m=n.readOnly===!0,C=e.formConfig?.rules||n.rules||t.rules||[],k=n.validateOn||t.validateOn,w=n.transform||t.transform;return(0,R.jsx)(yt,{id:i,name:g,type:b,placeholder:y,defaultValue:x,required:h,disabled:v,readOnly:m,rules:C,validateOn:k,transform:w,style:r,onClick:a,actions:e.actions,nodeId:e.id,document:f,renderContext:l,onDiagnostic:u,onActionDispatch:c,dataKubuildNode:e.id})}case"textarea":{let g=typeof n.name=="string"?n.name:void 0,b=typeof n.placeholder=="string"?n.placeholder:void 0,y=n.defaultValue!==void 0?n.defaultValue:void 0,x=typeof n.rows=="number"?n.rows:4,h=n.required===!0,v=n.disabled===!0,m=n.readOnly===!0,C=e.formConfig?.rules||n.rules||t.rules||[],k=n.validateOn||t.validateOn,w=n.transform||t.transform;return(0,R.jsx)(ht,{id:i,name:g,placeholder:b,defaultValue:y,rows:x,required:h,disabled:v,readOnly:m,rules:C,validateOn:k,transform:w,style:r,onClick:a,actions:e.actions,nodeId:e.id,document:f,renderContext:l,onDiagnostic:u,onActionDispatch:c,dataKubuildNode:e.id})}case"select":{let g=typeof n.name=="string"?n.name:void 0,b=typeof n.placeholder=="string"?n.placeholder:void 0,y=n.defaultValue!==void 0?n.defaultValue:void 0,x=n.required===!0,h=n.disabled===!0,v=e.formConfig?.rules||n.rules||t.rules||[],m=n.validateOn||t.validateOn,C=[],k=n.options??t.options;if(Array.isArray(k))C=k.map(w=>{if(typeof w=="object"&&w!==null){let S=w;return{label:String(S.label??S.value??""),value:String(S.value??S.label??"")}}return{label:String(w),value:String(w)}});else if(typeof k=="string")try{let w=JSON.parse(k);Array.isArray(w)&&(C=w.map(S=>{if(typeof S=="object"&&S!==null){let P=S;return{label:String(P.label??P.value??""),value:String(P.value??P.label??"")}}return{label:String(S),value:String(S)}}))}catch{}return(0,R.jsx)(xt,{id:i,name:g,placeholder:b,defaultValue:y,required:x,disabled:h,rules:v,validateOn:m,optionsList:C,style:r,onClick:a,actions:e.actions,nodeId:e.id,document:f,renderContext:l,onDiagnostic:u,onActionDispatch:c,dataKubuildNode:e.id})}case"checkbox":{let g=typeof n.name=="string"?n.name:void 0,b=String(n.label??"Checkbox"),y=n.value!==void 0?String(n.value):"yes",x=n.defaultChecked===!0,h=n.required===!0,v=n.disabled===!0,m=e.formConfig?.rules||n.rules||t.rules||[],C=n.validateOn||t.validateOn,k=p==="editor"&&!(0,M.isVariableBinding)(t.label);return(0,R.jsx)(vt,{id:i,name:g,label:b,value:y,defaultChecked:x,required:h,disabled:v,rules:m,validateOn:C,style:r,onClick:a,actions:e.actions,nodeId:e.id,document:f,renderContext:l,onDiagnostic:u,onActionDispatch:c,dataKubuildNode:e.id,isEditable:k,onNodePropChange:s})}case"radio":{let g=typeof n.name=="string"?n.name:void 0,b=String(n.label??"Radio"),y=n.value!==void 0?String(n.value):"option",x=n.defaultChecked===!0,h=n.required===!0,v=n.disabled===!0,m=n.rules||t.rules||[],C=n.validateOn||t.validateOn,k=p==="editor"&&!(0,M.isVariableBinding)(t.label);return(0,R.jsx)(Rt,{id:i,name:g,label:b,value:y,defaultChecked:x,required:h,disabled:v,rules:m,validateOn:C,style:r,onClick:a,actions:e.actions,nodeId:e.id,document:f,renderContext:l,onDiagnostic:u,onActionDispatch:c,dataKubuildNode:e.id,isEditable:k,onNodePropChange:s})}default:return null}}function Cn(o){let{node:e,domId:i,styles:r,props:n,context:t,mode:l,handleClick:p,onDiagnostic:f,renderChildNode:u}=o;if(e.type!=="collection")return null;let c=typeof n.sourceKey=="string"?n.sourceKey:void 0,a=typeof n.itemAlias=="string"&&n.itemAlias.length>0?n.itemAlias:"item",s=`${a}Index`,d=c?(0,J.resolveBinding)({key:c},t).value:void 0;if(!Array.isArray(d)){let b={code:"INVALID_COLLECTION_SOURCE",nodeId:e.id,propName:"sourceKey",message:`Collection node "${e.id}" expected an array at variable path "${c??"(missing sourceKey)"}" but found ${d===void 0?"nothing":typeof d}.`};return f?.(b),t?.onDiagnostic?.(b),l==="editor"?(0,R.jsxs)("div",{id:i,"data-kubuild-node":e.id,"data-kubuild-collection-invalid":e.type,style:{...r,border:"2px dashed #f59e0b",backgroundColor:"#fffbeb",padding:"12px",color:"#b45309",fontSize:"0.875rem",borderRadius:"4px"},onClick:p,children:[(0,R.jsxs)("div",{style:{display:"flex",alignItems:"center",gap:"8px",marginBottom:"8px"},children:[(0,R.jsx)(le.AlertTriangle,{size:16}),(0,R.jsx)("strong",{children:"Collection: expected an array"})]}),(0,R.jsxs)("div",{children:["Source path ",(0,R.jsx)("code",{children:c??"(none)"})," did not resolve to an array. Found"," ",(0,R.jsx)("code",{children:d===void 0?"nothing":typeof d}),"."]})]}):(0,R.jsx)("div",{id:i,"data-kubuild-node":e.id,style:{display:"contents"},"data-kubuild-empty-collection":"invalid-source"})}let g=e.children||[];return g.length===0||d.length===0?(0,R.jsx)("div",{id:i,style:r,onClick:p,"data-kubuild-node":e.id,"data-kubuild-collection-empty":d.length===0?"true":void 0,children:d.length===0&&l==="editor"&&(0,R.jsxs)("div",{style:{padding:"12px",border:"1px dashed #cbd5e1",borderRadius:"4px",color:"#94a3b8",fontSize:"0.875rem",textAlign:"center"},children:["Empty Collection (",(0,R.jsx)("code",{children:c})," has 0 items)"]})}):(0,R.jsx)("div",{id:i,style:r,onClick:p,"data-kubuild-node":e.id,children:d.map((b,y)=>{let x={...t,variables:{...t.variables,[a]:b,[s]:y}},h=`__iter_${y}`;return(0,R.jsx)(mn.default.Fragment,{children:g.map(v=>u(v,h,x))},`collection-item-${y}`)})})}function wn(o){let{node:e,domId:i,styles:r,handleClick:n,mode:t,childrenElements:l}=o;return t==="editor"?(0,R.jsxs)("div",{id:i,style:{...r,border:"2px dashed #e2e8f0",padding:"16px",backgroundColor:"#f8fafc"},onClick:n,"data-kubuild-node":e.id,"data-kubuild-unknown":e.type,children:[(0,R.jsxs)("div",{style:{display:"flex",alignItems:"center",gap:"8px",color:"#64748b"},children:[(0,R.jsx)(le.Puzzle,{size:16}),(0,R.jsxs)("span",{children:["Unknown Component: ",e.type]}),(0,R.jsxs)("span",{style:{fontSize:"12px",color:"#94a3b8"},children:["(",e.id,")"]})]}),l]}):(0,R.jsx)("div",{id:i,style:r,onClick:n,"data-kubuild-node":e.id,"data-kubuild-unknown":e.type,children:l})}function Et(o){let e=bn(o);if(e)return e;let i=yn(o);if(i)return i;let r=hn(o);if(r)return r;let n=xn(o);if(n)return n;let t=vn(o);if(t)return t;let l=Rn(o);if(l)return l;let p=kn(o);if(p)return p;let f=Cn(o);if(f)return f;let u=Tt(o);return u||wn(o)}var _=require("react/jsx-runtime");function io(o,e){if(!o)return!1;try{let i=$n.default,r=i.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE||i.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;if(!!(r&&(r.H||r.ReactCurrentDispatcher?.current))){let{isOpen:t}=nt(o,e);return t}}catch{}return e.isModalOpen(o)}function be({node:o,document:e,registry:i,context:r,viewport:n="desktop",mode:t="runtime",onNodeClick:l,onDiagnostic:p,onActionDispatch:f,onNodePropChange:u,instanceSuffix:c=""}){let a=r||de,s=Ge(o.styles,n),d=o.props||{},g=i.get(o.type),b=c?`${o.id}${c}`:o.id,{props:y,diagnostics:x}=Zt(o,g,a);x.forEach(I=>{p?.(I),a?.onDiagnostic?.(I)}),mt(o,{document:e,context:a,onDiagnostic:p,onActionDispatch:f,mode:t});let h=async I=>{I.stopPropagation(),l&&l(o.id,I),o.actions&&o.actions.length>0&&!d.disabled&&await H({node:o,trigger:"click",document:e,context:a,onDiagnostic:p,onActionDispatch:f}),d.action&&!d.disabled&&(Ye({action:d.action,nodeId:o.id,document:e,context:a,onDiagnostic:p}),f&&(0,Sn.isActionBinding)(d.action)&&f(d.action.type,We(a,d.action.payload),o.id))},v=o.children?.map(I=>(0,_.jsx)(be,{node:I,document:e,registry:i,context:a,viewport:n,mode:t,onNodeClick:l,onDiagnostic:p,onActionDispatch:f,onNodePropChange:u,instanceSuffix:c},`${I.id}${c}`)),m=(I,he="",Ee=a)=>(0,_.jsx)(be,{node:I,document:e,registry:i,context:Ee,viewport:n,mode:t,onNodeClick:l,onDiagnostic:p,onActionDispatch:f,onNodePropChange:u,instanceSuffix:`${c}${he}`},`${I.id}${c}${he}`),C=d.modalId||d.modalNodeId||d.targetModalId,k=a?.modalManager||Z,w=C?k.hasState(C):!1,S=io(C,k),P=w?S:!!d.defaultOpen,O={...s},N=o.type==="modal"||o.type==="drawer"||o.type==="collapsible";(d.modalId||d.modalNodeId)&&o.type!=="button"&&o.type!=="link"&&!N&&!P&&(O.display="none");let V;try{V=Et({node:o,document:e,registry:i,context:a,viewport:n,mode:t,styles:O,props:d,resolvedProps:y,definition:g,domId:b,childrenElements:v,handleClick:h,onNodeClick:l,onDiagnostic:p,onActionDispatch:f,onNodePropChange:u,instanceSuffix:c,isModalOpen:P,renderChildNode:m})}catch(I){t==="editor"?V=(0,_.jsxs)("div",{"data-kubuild-node":o.id,"data-kubuild-error":o.type,style:{padding:"12px 16px",margin:"4px 0",backgroundColor:"#fef2f2",border:"1px solid #ef4444",borderRadius:"6px",color:"#b91c1c",fontFamily:"system-ui, -apple-system, sans-serif",fontSize:"13px",lineHeight:"1.4"},children:[(0,_.jsxs)("div",{style:{fontWeight:600,marginBottom:"4px",display:"flex",alignItems:"center",gap:"6px"},children:[(0,_.jsx)(En.AlertTriangle,{size:14,"aria-hidden":"true"}),(0,_.jsxs)("span",{children:["Component Render Error: <",o.type,">"]})]}),(0,_.jsxs)("div",{style:{fontSize:"11px",color:"#7f1d1d",wordBreak:"break-all"},children:["Node ID: ",(0,_.jsx)("code",{children:o.id})," \u2014 ",I instanceof Error?I.message:String(I)]})]}):V=(0,_.jsx)("div",{"data-kubuild-node":o.id,"data-kubuild-error":o.type,style:{display:"none"},"aria-hidden":"true"})}return(0,_.jsx)(we,{nodeId:o.id,componentType:o.type,mode:t,onDiagnostic:p,children:V})}var Te=({document:o,registry:e=(0,Tn.createDefaultComponentRegistry)(),context:i,viewport:r="desktop",mode:n="runtime",className:t,showToastContainer:l=!0,onNodeClick:p,onDiagnostic:f,onActionDispatch:u,onNodePropChange:c})=>!o||!o.document?(0,_.jsx)("div",{className:t,children:"Empty Document"}):(0,_.jsx)(qe,{value:i,children:(0,_.jsxs)("div",{className:`kubuild-canvas-root ${t||""}`,children:[(()=>{let a=Je(o);return a?(0,_.jsx)("style",{"data-kubuild-state-styles":!0,children:a}):null})(),(()=>{let a=Ce(o);return a?(0,_.jsx)("style",{"data-kubuild-animation-styles":!0,children:a}):null})(),(0,_.jsx)(be,{node:o.document,document:o,registry:e,context:i,viewport:r,mode:n,onNodeClick:p,onDiagnostic:f,onActionDispatch:u,onNodePropChange:c}),l&&(0,_.jsx)(ct,{})]})});var Pt=fe(require("react"),1),Pn=fe(require("react-dom"),1),An=require("@kubuild/components");var ee=require("react/jsx-runtime");function At(o){let e=o.document?.document;if(e)return e.children?.[0]??void 0}function In(o,e){return o.filter(i=>i.artboardType==="component"&&!!i.triggerId&&!!e[i.triggerId]&&!!At(i))}var _e=({artboards:o,registry:e,context:i=de,viewport:r="desktop",mode:n="runtime",modalManager:t,container:l,onDiagnostic:p,onActionDispatch:f})=>{let u=t||Z,{modals:c}=ot(u),a=Pt.default.useMemo(()=>e||(0,An.createDefaultComponentRegistry)(),[e]),s=Pt.default.useMemo(()=>(o??i.componentArtboards??[]).filter(y=>y.artboardType==="component"),[o,i.componentArtboards]);if(n==="editor")return null;let d=In(s,c);if(d.length===0)return null;let g=l!==void 0?l:typeof globalThis.document<"u"?globalThis.document.body:null;return g?(0,ee.jsx)(ee.Fragment,{children:d.map(b=>{let y=At(b);return y?Pn.default.createPortal((0,ee.jsx)("div",{"data-kubuild-artboard-portal":b.id,style:{pointerEvents:"auto"},children:(0,ee.jsx)(be,{node:y,document:b.document,registry:a,context:i,viewport:r,mode:"runtime",onDiagnostic:p,onActionDispatch:f})},b.id),g,b.id):null})}):null},ao=({componentArtboards:o,modalManager:e,portalContainer:i,...r})=>(0,ee.jsxs)(ee.Fragment,{children:[(0,ee.jsx)(Te,{...r}),(0,ee.jsx)(_e,{artboards:o,registry:r.registry,context:r.context,viewport:r.viewport,mode:r.mode,modalManager:e,container:i,onDiagnostic:r.onDiagnostic,onActionDispatch:r.onActionDispatch})]});var ye=require("react");var q=require("react/jsx-runtime"),It=Object.freeze({desktop:{width:"100%",maxWidth:"1280px",minHeight:"600px",label:"Desktop (1280px)",isFluid:!0},tablet:{width:"768px",height:"1024px",minHeight:"600px",label:"Tablet (768 \xD7 1024)",isFluid:!1},mobile:{width:"375px",height:"667px",minHeight:"500px",label:"Mobile (375 \xD7 667)",isFluid:!1}}),Nn=Object.freeze({mobile:480,tablet:768,desktop:1024});function so(o,e){let i={...Nn,...e};return o<=i.mobile?"mobile":o<=i.tablet?"tablet":"desktop"}function Nt(o,e){let i=It[o]||It.desktop,r=e?.[o];return{...i,...r}}function Fn(o,e,i){let r=Nt(o,e),n=i??r.scale??1,t=p=>typeof p=="number"?`${p}px`:p,l={width:t(r.width),maxWidth:t(r.maxWidth),minWidth:t(r.minWidth),height:t(r.height),minHeight:t(r.minHeight),maxHeight:t(r.maxHeight),aspectRatio:r.aspectRatio,transition:"width 0.2s ease, max-width 0.2s ease, height 0.2s ease"};return n!==1&&(l.transform=`scale(${n})`,l.transformOrigin="top center"),l}var Dn=({document:o,viewport:e="desktop",onViewportChange:i,viewportConfigs:r,breakpoints:n,registry:t,context:l,mode:p="runtime",showChrome:f=!1,chromeTitle:u,editorOverlay:c,scale:a,className:s,style:d,canvasClassName:g,canvasStyle:b,onNodeClick:y,onDiagnostic:x,onActionDispatch:h,componentArtboards:v})=>{let[m,C]=(0,ye.useState)(null),k=v??l?.componentArtboards,w=(0,ye.useMemo)(()=>Nt(e,r),[e,r]),S=(0,ye.useMemo)(()=>Fn(e,r,a),[e,r,a]),P=(0,ye.useMemo)(()=>({...S,...b,position:"relative",boxSizing:"border-box"}),[S,b]);return(0,q.jsxs)("div",{"data-kubuild-preview-container":!0,"data-viewport":e,className:`kubuild-preview-viewport-adapter ${s||""}`,style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"flex-start",width:"100%",height:"100%",boxSizing:"border-box",...d},children:[f&&(0,q.jsxs)("div",{"data-kubuild-preview-chrome":!0,style:{display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%",maxWidth:S.maxWidth||S.width,padding:"8px 12px",marginBottom:"8px",backgroundColor:"#1e293b",color:"#f8fafc",borderRadius:"8px",fontSize:"12px",fontFamily:"system-ui, -apple-system, sans-serif",boxSizing:"border-box"},children:[(0,q.jsxs)("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[(0,q.jsx)("span",{style:{fontWeight:600},children:u||o.metadata?.title||"Preview"}),(0,q.jsx)("span",{"data-testid":"viewport-badge",style:{fontSize:"10px",padding:"2px 6px",borderRadius:"4px",backgroundColor:"#334155",color:"#94a3b8",textTransform:"uppercase",fontWeight:700},children:e}),(0,q.jsx)("span",{style:{fontSize:"11px",color:"#64748b"},children:w.label||`${w.width} \xD7 ${w.height||"auto"}`})]}),i&&(0,q.jsx)("div",{"data-testid":"viewport-switcher",style:{display:"flex",gap:"4px",backgroundColor:"#0f172a",padding:"2px",borderRadius:"6px"},children:["desktop","tablet","mobile"].map(O=>{let N=e===O;return(0,q.jsx)("button",{type:"button","data-testid":`viewport-btn-${O}`,onClick:()=>i(O),style:{padding:"4px 10px",fontSize:"11px",fontWeight:500,borderRadius:"4px",border:"none",cursor:"pointer",textTransform:"capitalize",backgroundColor:N?"#3b82f6":"transparent",color:N?"#ffffff":"#94a3b8",transition:"all 0.15s ease"},children:O},O)})})]}),(0,q.jsxs)("div",{"data-kubuild-preview-canvas":!0,"data-viewport":e,className:`kubuild-preview-canvas ${g||""}`,style:P,children:[(0,q.jsx)(Te,{document:o,registry:t,context:l,viewport:e,mode:p,onNodeClick:y,onDiagnostic:x,onActionDispatch:h}),k&&k.length>0&&(0,q.jsxs)(q.Fragment,{children:[(0,q.jsx)("div",{ref:C,"data-kubuild-preview-overlay-host":!0,style:{position:"absolute",top:0,left:0,right:0,bottom:0,transform:"translate3d(0, 0, 0)",pointerEvents:"none"}}),m&&(0,q.jsx)(_e,{artboards:k,registry:t,context:l,viewport:e,mode:p,container:m,onDiagnostic:x,onActionDispatch:h})]}),c&&(0,q.jsx)("div",{"data-kubuild-preview-overlay":!0,style:{position:"absolute",top:0,left:0,right:0,bottom:0,pointerEvents:"none",zIndex:10},children:c})]})]})},lo=Dn;function L(o){return o==null?"":String(o).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#039;")}function E(o){return L(o)}function co(o){if(!o||typeof o!="string")return null;let e=o.match(/(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/\s]{11})/i);return e?e[1]:null}function uo(o){if(!o||typeof o!="string")return null;let e=o.match(/(?:vimeo\.com\/(?:channels\/(?:\w+\/)?|groups\/([^\/]*)\/videos\/|album\/(\d+)\/video\/|video\/|))(\d+)/i);return e?e[3]:null}function K(o,e,i){let r=" ".repeat(e*(i.indentSize??2)),n=" ".repeat((e+1)*(i.indentSize??2)),t=o.props||{},l=o.children||[],f=i.includeNodeClasses!==!1?`kb-node-${o.id}`:"",u=(...a)=>a.filter(Boolean).join(" "),c=t.id?` id="${E(t.id)}"`:"";switch(o.type){case"page":{let a=i.rootTag||"main",s=u("kb-page",f),d=l.map(g=>K(g,e+1,i)).join(`
+`);return d?`${r}<${a} class="${s}"${c}>
+${d}
+${r}</${a}>`:`${r}<${a} class="${s}"${c}></${a}>`}case"section":{let a=t.ariaLabel?` aria-label="${E(t.ariaLabel)}"`:"",s=u("kb-section",f),d=l.map(g=>K(g,e+1,i)).join(`
+`);return d?`${r}<section class="${s}"${c}${a}>
+${d}
+${r}</section>`:`${r}<section class="${s}"${c}${a}></section>`}case"container":{let a=u("kb-container",f),s=l.map(d=>K(d,e+1,i)).join(`
+`);return s?`${r}<div class="${a}"${c}>
+${s}
+${r}</div>`:`${r}<div class="${a}"${c}></div>`}case"columns":{let a=u("kb-columns",f),s=l.map(d=>K(d,e+1,i)).join(`
+`);return s?`${r}<div class="${a}"${c}>
+${s}
+${r}</div>`:`${r}<div class="${a}"${c}></div>`}case"heading":{let a="h2";typeof t.level=="string"&&/^h[1-6]$/i.test(t.level)?a=t.level.toLowerCase():typeof t.level=="number"&&t.level>=1&&t.level<=6?a=`h${t.level}`:typeof t.tag=="string"&&/^h[1-6]$/i.test(t.tag)&&(a=t.tag.toLowerCase());let s=t.text??t.value??t.content??"Heading",d=u("kb-heading",f);return`${r}<${a} class="${d}"${c}>${L(s)}</${a}>`}case"paragraph":{let a=t.text??t.value??t.content??"",s=u("kb-paragraph",f);return`${r}<p class="${s}"${c}>${L(a)}</p>`}case"text":{let a=t.as||"p",s=t.text??t.value??t.content??"",d=u("kb-text",f);return`${r}<${a} class="${d}"${c}>${L(s)}</${a}>`}case"link":{let a=t.href?` href="${E(t.href)}"`:' href="#"',s=t.target?` target="${E(t.target)}"`:"",d=t.rel?` rel="${E(t.rel)}"`:s.includes("_blank")?' rel="noopener noreferrer"':"",g=t.text??t.label??t.value,b=u("kb-link",f);if(l.length>0){let y=l.map(x=>K(x,e+1,i)).join(`
+`);return`${r}<a class="${b}"${c}${a}${s}${d}>
+${y}
+${r}</a>`}return`${r}<a class="${b}"${c}${a}${s}${d}>${L(g??"Link")}</a>`}case"blockquote":{let a=t.cite?` cite="${E(t.cite)}"`:"",s=t.quote??t.text??t.value,d=t.author??t.citeAuthor,g=u("kb-blockquote",f);if(s||d){let b=s?`${n}<p>${L(s)}</p>`:"",y=d?`${n}<cite>${L(d)}</cite>`:"",x=[b,y].filter(Boolean).join(`
+`);return`${r}<blockquote class="${g}"${c}${a}>
+${x}
+${r}</blockquote>`}if(l.length>0){let b=l.map(y=>K(y,e+1,i)).join(`
+`);return`${r}<blockquote class="${g}"${c}${a}>
+${b}
+${r}</blockquote>`}return`${r}<blockquote class="${g}"${c}${a}></blockquote>`}case"badge":{let a=t.text??t.label??t.value??"Badge",s=u("kb-badge",f);return`${r}<span class="${s}"${c}>${L(a)}</span>`}case"code-block":{let a=t.code??t.text??t.value??"",s=t.language||t.lang,d=s?` class="language-${E(s)}"`:"",g=u("kb-code-block",f);return`${r}<pre class="${g}"${c}><code${d}>${L(a)}</code></pre>`}case"divider":{let a=u("kb-divider",f),s=t.text??t.label;return s?`${r}<div class="${a}"${c} role="separator"><span>${L(s)}</span></div>`:`${r}<hr class="${a}"${c} />`}case"spacer":{let a=u("kb-spacer",f);return`${r}<div class="${a}"${c} aria-hidden="true"></div>`}case"image":{let a=t.src?` src="${E(t.src)}"`:' src=""',s=t.alt?` alt="${E(t.alt)}"`:' alt=""',d=t.loading?` loading="${E(t.loading)}"`:' loading="lazy"',g=u("kb-image",f);return`${r}<img class="${g}"${c}${a}${s}${d} />`}case"video":{let a=t.src||"",s=co(a),d=uo(a),g=u("kb-video",f);if(s)return`${r}<div class="kb-video-wrapper ${f}"${c}>
+${n}<iframe src="https://www.youtube-nocookie.com/embed/${E(s)}" title="${E(t.title||"Video player")}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+${r}</div>`;if(d)return`${r}<div class="kb-video-wrapper ${f}"${c}>
+${n}<iframe src="https://player.vimeo.com/video/${E(d)}" title="${E(t.title||"Video player")}" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>
+${r}</div>`;let b=t.poster?` poster="${E(t.poster)}"`:"",y=t.controls!==!1?" controls":"",x=t.autoplay?" autoplay":"",h=t.loop?" loop":"",v=t.muted?" muted":"",m=a?` src="${E(a)}"`:"";return`${r}<video class="${g}"${c}${m}${b}${y}${x}${h}${v}></video>`}case"icon":{let a=t.name||t.icon||"star",s=t.ariaLabel?` aria-label="${E(t.ariaLabel)}"`:' aria-hidden="true"',d=u("kb-icon",f);return`${r}<span class="${d}"${c}${s} data-icon="${E(a)}"></span>`}case"html-embed":{let a=t.html??t.content??"",s=u("kb-html-embed",f);return a?`${r}<div class="${s}"${c}>
+${n}${a}
+${r}</div>`:`${r}<div class="${s}"${c}></div>`}case"button":{let a=t.label??t.text??t.value??"Button",s=t.type?` type="${E(t.type)}"`:' type="button"',d=t.disabled?" disabled":"",g=u("kb-button",f);if(t.href){let b=` href="${E(t.href)}"`,y=t.target?` target="${E(t.target)}"`:"";return`${r}<a class="${g}"${c}${b}${y}>${L(a)}</a>`}return`${r}<button class="${g}"${c}${s}${d}>${L(a)}</button>`}case"form":{let a=t.action?` action="${E(t.action)}"`:"",s=t.method?` method="${E(t.method)}"`:' method="POST"',d=u("kb-form",f),g=l.map(b=>K(b,e+1,i)).join(`
+`);return g?`${r}<form class="${d}"${c}${a}${s}>
+${g}
+${r}</form>`:`${r}<form class="${d}"${c}${a}${s}></form>`}case"input":{let a=t.type?` type="${E(t.type)}"`:' type="text"',s=t.name?` name="${E(t.name)}"`:"",d=t.placeholder?` placeholder="${E(t.placeholder)}"`:"",g=t.value!==void 0?` value="${E(t.value)}"`:"",b=t.required?" required":"",y=t.disabled?" disabled":"",x=u("kb-input",f);return`${r}<input class="${x}"${c}${a}${s}${d}${g}${b}${y} />`}case"textarea":{let a=t.name?` name="${E(t.name)}"`:"",s=t.placeholder?` placeholder="${E(t.placeholder)}"`:"",d=t.rows?` rows="${E(t.rows)}"`:' rows="4"',g=t.value??t.defaultValue??"",b=t.required?" required":"",y=t.disabled?" disabled":"",x=u("kb-textarea",f);return`${r}<textarea class="${x}"${c}${a}${s}${d}${b}${y}>${L(g)}</textarea>`}case"select":{let a=t.name?` name="${E(t.name)}"`:"",s=t.required?" required":"",d=t.disabled?" disabled":"",g=u("kb-select",f),b=Array.isArray(t.options)?t.options:[],y=" ".repeat((e+1)*(i.indentSize??2)),x=b.map(h=>{let v=typeof h=="object"?h.value:h,m=typeof h=="object"?h.label:h,C=t.value===v||t.defaultValue===v?" selected":"";return`${y}<option value="${E(v)}"${C}>${L(m)}</option>`}).join(`
+`);return x?`${r}<select class="${g}"${c}${a}${s}${d}>
+${x}
+${r}</select>`:`${r}<select class="${g}"${c}${a}${s}${d}></select>`}case"checkbox":{let a=t.name?` name="${E(t.name)}"`:"",s=t.checked||t.defaultChecked?" checked":"",d=t.label??t.text??"",g=u("kb-checkbox-label",f);return`${r}<label class="${g}"${c}><input type="checkbox"${a}${s} /><span>${L(d)}</span></label>`}case"radio":{let a=t.name?` name="${E(t.name)}"`:"",s=t.value?` value="${E(t.value)}"`:"",d=t.checked||t.defaultChecked?" checked":"",g=t.label??t.text??"",b=u("kb-radio-label",f);return`${r}<label class="${b}"${c}><input type="radio"${a}${s}${d} /><span>${L(g)}</span></label>`}case"list":{let a=t.tag==="ol"||t.type==="ol"||t.ordered?"ol":"ul",s=u("kb-list",f),d=l.map(g=>K(g,e+1,i)).join(`
+`);return d?`${r}<${a} class="${s}"${c}>
+${d}
+${r}</${a}>`:`${r}<${a} class="${s}"${c}></${a}>`}case"list-item":{let a=t.text??t.value,s=u("kb-list-item",f);if(l.length>0){let d=l.map(g=>K(g,e+1,i)).join(`
+`);return`${r}<li class="${s}"${c}>
+${d}
+${r}</li>`}return`${r}<li class="${s}"${c}>${L(a??"List item")}</li>`}case"table":{let a=u("kb-table",f),s=l.map(d=>K(d,e+1,i)).join(`
+`);return s?`${r}<table class="${a}"${c}>
+${s}
+${r}</table>`:`${r}<table class="${a}"${c}></table>`}case"table-row":{let a=u("kb-table-row",f),s=l.map(d=>K(d,e+1,i)).join(`
+`);return s?`${r}<tr class="${a}"${c}>
+${s}
+${r}</tr>`:`${r}<tr class="${a}"${c}></tr>`}case"table-cell":{let s=t.isHeader||t.type==="header"||t.tag==="th"?"th":"td",d=t.colSpan&&Number(t.colSpan)>1?` colspan="${E(t.colSpan)}"`:"",g=t.rowSpan&&Number(t.rowSpan)>1?` rowspan="${E(t.rowSpan)}"`:"",b=t.text??t.value??"",y=u("kb-table-cell",f);if(l.length>0){let x=l.map(h=>K(h,e+1,i)).join(`
+`);return`${r}<${s} class="${y}"${c}${d}${g}>
+${x}
+${r}</${s}>`}return`${r}<${s} class="${y}"${c}${d}${g}>${L(b)}</${s}>`}case"collection":{let a=u("kb-collection",f),s=l.map(d=>K(d,e+1,i)).join(`
+`);return s?`${r}<div class="${a}"${c}>
+${s}
+${r}</div>`:`${r}<div class="${a}"${c}></div>`}default:{let a=u(`kb-${o.type}`,f),s=l.map(d=>K(d,e+1,i)).join(`
+`);return s?`${r}<div class="${a}"${c}>
+${s}
+${r}</div>`:`${r}<div class="${a}"${c}></div>`}}}function Mn(o,e={}){let i="document"in o?o.document:o;return i?K(i,0,e):""}function Le(o,e,i=""){if(!e.trim())return"";let r=e.split(";").map(t=>t.trim()).filter(Boolean);if(r.length===0)return"";let n=r.map(t=>`${i}  ${t};`).join(`
+`);return`${i}${o} {
+${n}
+${i}}`}function On(o,e={}){let i="document"in o?o.document:o;if(!i)return"";let r=e.classPrefix||"kb-node-",n=[],t=[],l=[],p=[],f=s=>{let d=`.${r}${s.id}`;if(s.styles){let g={...s.styles.base||{},...s.styles.desktop||{}},b=pe(g);if(b&&n.push(Le(d,b)),s.styles.tablet){let y=pe(s.styles.tablet);y&&t.push(Le(d,y,"  "))}if(s.styles.mobile){let y=pe(s.styles.mobile);y&&l.push(Le(d,y,"  "))}if(s.styles.states&&typeof s.styles.states=="object")for(let[y,x]of Object.entries(s.styles.states)){if(!x)continue;let h=/^::?[a-zA-Z-]+$/.test(y)?y:null;if(!h)continue;let v=pe(x);v&&p.push(Le(`${d}${h}`,v))}}s.children?.forEach(f)};f(i);let u=[];e.includeReset!==!1&&u.push(`/* ==========================================================================
    Baseline Reset & Typography Standards
    ========================================================================== */
-${DEFAULT_CSS_RESET}`);
-  }
-  if (baseRules.length > 0) {
-    sections.push(`/* ==========================================================================
+${Ze}`),n.length>0&&u.push(`/* ==========================================================================
    Component Styles
    ========================================================================== */
-${baseRules.join("\n\n")}`);
-  }
-  if (stateRules.length > 0) {
-    sections.push(`/* ==========================================================================
+${n.join(`
+
+`)}`),p.length>0&&u.push(`/* ==========================================================================
    Interactive & Hover States
    ========================================================================== */
-${stateRules.join("\n\n")}`);
-  }
-  if (tabletRules.length > 0) {
-    sections.push(`/* ==========================================================================
+${p.join(`
+
+`)}`),t.length>0&&u.push(`/* ==========================================================================
    Tablet Breakpoint (max-width: 1024px)
    ========================================================================== */
 @media (max-width: 1024px) {
-${tabletRules.join("\n\n")}
-}`);
-  }
-  if (mobileRules.length > 0) {
-    sections.push(`/* ==========================================================================
+${t.join(`
+
+`)}
+}`),l.length>0&&u.push(`/* ==========================================================================
    Mobile Breakpoint (max-width: 640px)
    ========================================================================== */
 @media (max-width: 640px) {
-${mobileRules.join("\n\n")}
-}`);
-  }
-  const pageDoc = "document" in docOrNode ? docOrNode : { schema: "stora.page", version: "1.0.0", document: rootNode };
-  const animStyles = collectAnimationStylesCss(pageDoc);
-  if (animStyles) {
-    sections.push(`/* ==========================================================================
+${l.join(`
+
+`)}
+}`);let c="document"in o?o:{schema:"stora.page",version:"1.0.0",document:i},a=Ce(c);return a&&u.push(`/* ==========================================================================
    Animations & Motion Keyframes
    ========================================================================== */
-${animStyles}`);
-  }
-  return sections.join("\n\n");
-}
-function generateStandaloneHtml(doc, options = {}) {
-  const title = escapeHtml(doc.metadata?.title || "KUBUILD Page");
-  const description = doc.metadata?.description ? escapeAttr(doc.metadata.description) : "";
-  const author = doc.metadata?.author ? escapeAttr(doc.metadata.author) : "";
-  const lang = options.lang || "en";
-  const css = generateDocumentCss(doc, options.cssOptions);
-  const html = generateSemanticHtml(doc, options.htmlOptions);
-  const metaDescription = description ? `  <meta name="description" content="${description}">
-` : "";
-  const metaAuthor = author ? `  <meta name="author" content="${author}">
-` : "";
-  return `<!DOCTYPE html>
-<html lang="${lang}">
+${a}`),u.join(`
+
+`)}function po(o,e={}){let i=L(o.metadata?.title||"KUBUILD Page"),r=o.metadata?.description?E(o.metadata.description):"",n=o.metadata?.author?E(o.metadata.author):"",t=e.lang||"en",l=On(o,e.cssOptions),p=Mn(o,e.htmlOptions),f=r?`  <meta name="description" content="${r}">
+`:"",u=n?`  <meta name="author" content="${n}">
+`:"";return`<!DOCTYPE html>
+<html lang="${t}">
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>${title}</title>
-${metaDescription}${metaAuthor}  <style>
-${css}
+  <title>${i}</title>
+${f}${u}  <style>
+${l}
   </style>
 </head>
 <body>
-${html}
+${p}
 </body>
-</html>`;
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  ANIMATION_KEYFRAMES_CSS,
-  ComponentErrorBoundary,
-  DEFAULT_BREAKPOINTS,
-  DEFAULT_CSS_RESET,
-  DEFAULT_RENDER_CONTEXT,
-  DEFAULT_VIEWPORT_CONFIGS,
-  EditableText,
-  HtmlEmbedView,
-  KubuildPreviewViewport,
-  KubuildRenderer,
-  NodeRenderer,
-  PreviewViewportAdapter,
-  RenderContextProvider,
-  collectAnimationStylesCss,
-  collectStateStylesCss,
-  createMinimalRenderContext,
-  createRenderContext,
-  dispatchAction,
-  generateDocumentCss,
-  generateSemanticHtml,
-  generateStandaloneHtml,
-  getEntranceAnimationCss,
-  getHoverEffectCss,
-  getLoopEffectCss,
-  isActionRegistered,
-  replayNodeAnimation,
-  resolveActionPayload,
-  resolveActionPayloadDetailed,
-  resolveAssetSync,
-  resolveNodeStyles,
-  resolveVariable,
-  resolveViewportContainerStyle,
-  resolveViewportDimensions,
-  resolveViewportFromWidth,
-  styleDefinitionToCssDeclarations,
-  transformEmbedHtml,
-  useRenderContext
-});
-//# sourceMappingURL=index.cjs.map
+</html>`}0&&(module.exports={ANIMATION_KEYFRAMES_CSS,ApiRequestError,ArtboardPortalHost,ComponentErrorBoundary,DEFAULT_BREAKPOINTS,DEFAULT_CSS_RESET,DEFAULT_RENDER_CONTEXT,DEFAULT_VIEWPORT_CONFIGS,EditableText,FormCheckboxNode,FormContainerNode,FormInputNode,FormRadioNode,FormRuntimeContext,FormRuntimeProvider,FormSelectNode,FormSubmitButtonNode,FormTextareaNode,HtmlEmbedView,KubuildPreviewViewport,KubuildProjectRenderer,KubuildRenderer,ModalManager,NodeRenderer,PreviewViewportAdapter,RenderContextProvider,ToastCard,ToastContainer,ToastManager,apiRequestRunner,aspectRatioToCss,buildApiUrl,closeModalRunner,collectAnimationStylesCss,collectStateStylesCss,copyClipboardRunner,copyToClipboard,createApiRequestHandler,createDefaultActionRunners,createMinimalRenderContext,createRenderContext,dispatchAction,executeNodeActions,generateDocumentCss,generateSemanticHtml,generateStandaloneHtml,getArtboardContentNode,getEntranceAnimationCss,getHoverEffectCss,getLoopEffectCss,getVimeoId,getYouTubeId,handleFormButtonClick,isActionRegistered,modalManager,navigateRunner,normalizeStyleObject,openModalRunner,prepareRequestBody,registerDefaultActionRunners,renderCollectionNode,renderCustomComponent,renderFallbackNode,renderFormNode,renderInteractiveNode,renderLayoutNode,renderListNode,renderMediaNode,renderNodeContent,renderTableNode,renderTypographyNode,replayNodeAnimation,resetFormRunner,resolveActionPayload,resolveActionPayloadDetailed,resolveAssetSync,resolveNodeStyles,resolveVariable,resolveViewportContainerStyle,resolveViewportDimensions,resolveViewportFromWidth,selectOpenComponentArtboards,showToastRunner,styleDefinitionToCssDeclarations,toPascalCase,toastManager,toggleModalRunner,transformEmbedHtml,useFormContext,useFormField,useFormRuntime,useFormStatus,useModal,useModals,useNodeLoadActions,useRenderContext,useToasts});