@kubuild/components 0.2.0 → 0.3.1

package/dist/index.js

@@ -1,3076 +1,119 @@
-// src/registry.ts
-var ComponentRegistry = class {
-  components = /* @__PURE__ */ new Map();
-  register(definition, allowOverride = false) {
-    if (!allowOverride && this.components.has(definition.type)) {
-      throw new Error(`Component type "${definition.type}" is already registered.`);
-    }
-    this.components.set(definition.type, definition);
-  }
-  unregister(type) {
-    return this.components.delete(type);
-  }
-  get(type) {
-    return this.components.get(type);
-  }
-  has(type) {
-    return this.components.has(type);
-  }
-  list() {
-    return Array.from(this.components.values());
-  }
-  listByCategory(category) {
-    return this.list().filter((c) => c.category === category);
-  }
-  /**
-   * Check whether `childType` is a valid insertion target under `parentType`,
-   * covering both directions of child policy: the parent's `acceptsChildren`/
-   * `allowedChildren` (by type, category, or `'*'`) and the child's own
-   * `disallowedParents`. Used by the builder to reject an invalid insertion
-   * before a node is constructed, rather than after the fact via `validateNode`.
-   */
-  canInsertChild(parentType, childType) {
-    const errors = [];
-    const parentDef = this.get(parentType);
-    const childDef = this.get(childType);
-    if (!parentDef) {
-      errors.push(`Unknown target parent type: "${parentType}".`);
-    }
-    if (!childDef) {
-      errors.push(`Unknown component type: "${childType}".`);
-    }
-    if (!parentDef || !childDef) {
-      return { valid: false, errors };
-    }
-    if (!parentDef.acceptsChildren) {
-      errors.push(`"${parentDef.label}" does not accept children.`);
-    } else if (parentDef.allowedChildren) {
-      const allowed = parentDef.allowedChildren.includes("*") || parentDef.allowedChildren.includes(childType) || parentDef.allowedChildren.includes(childDef.category);
-      if (!allowed) {
-        errors.push(`"${parentDef.label}" does not allow "${childDef.label}" as a child.`);
-      }
-    }
-    if (childDef.disallowedParents?.includes(parentType)) {
-      errors.push(`"${childDef.label}" is not allowed inside "${parentDef.label}".`);
-    }
-    return { valid: errors.length === 0, errors };
-  }
-  validateNode(node, parentType) {
-    const def = this.get(node.type);
-    const errors = [];
-    if (!def) {
-      errors.push(`Unknown component type: "${node.type}"`);
-      return { valid: false, errors };
-    }
-    if (!def.acceptsChildren && node.children && node.children.length > 0) {
-      errors.push(`Component "${node.type}" does not accept children.`);
-    }
-    if (def.allowedChildren && node.children) {
-      for (const child of node.children) {
-        const childCategory = this.get(child.type)?.category;
-        const allowed = def.allowedChildren.includes("*") || def.allowedChildren.includes(child.type) || childCategory !== void 0 && def.allowedChildren.includes(childCategory);
-        if (!allowed) {
-          errors.push(`Component "${node.type}" does not allow child type "${child.type}".`);
-        }
-      }
-    }
-    if (parentType && def.disallowedParents?.includes(parentType)) {
-      errors.push(`Component "${node.type}" is not allowed inside parent "${parentType}".`);
-    }
-    if (def.validateProps && node.props) {
-      const propResult = def.validateProps(node.props);
-      if (Array.isArray(propResult) && propResult.length > 0) {
-        errors.push(...propResult);
-      } else if (propResult === false) {
-        errors.push(`Props validation failed for component "${node.type}".`);
-      }
-    }
-    return { valid: errors.length === 0, errors };
-  }
-};
-
-// src/definitions.ts
-import { isActionBinding, isAssetReference, isVariableBinding } from "@kubuild/schema";
-
-// src/traits.ts
-var TRAIT_GROUP_ORDER = [
-  "identity",
-  "link",
-  "media",
-  "form",
-  "behavior",
-  "semantic",
-  "accessibility"
-];
-var TRAIT_GROUP_LABELS = {
-  identity: "Identity",
-  link: "Link",
-  media: "Media",
-  form: "Form",
-  behavior: "Behavior",
-  semantic: "Semantic",
-  accessibility: "Accessibility"
-};
-function withOverrides(base, overrides) {
-  return overrides ? { ...base, ...overrides } : base;
-}
-function hrefTrait(overrides) {
-  return withOverrides(
-    {
-      name: "href",
-      label: "Link URL",
-      type: "string",
-      defaultValue: "#",
-      attribute: "href",
-      group: "link",
-      description: "The destination URL the element navigates to when activated."
-    },
-    overrides
-  );
-}
-function targetTrait(overrides) {
-  return withOverrides(
-    {
-      name: "target",
-      label: "Open In",
-      type: "select",
-      defaultValue: "_self",
-      attribute: "target",
-      group: "link",
-      options: [
-        { label: "Same tab (_self)", value: "_self" },
-        { label: "New tab (_blank)", value: "_blank" },
-        { label: "Parent frame (_parent)", value: "_parent" },
-        { label: "Top frame (_top)", value: "_top" }
-      ],
-      description: "Where the linked resource should open."
-    },
-    overrides
-  );
-}
-function relTrait(overrides) {
-  return withOverrides(
-    {
-      name: "rel",
-      label: "Relationship (rel)",
-      type: "string",
-      defaultValue: "",
-      attribute: "rel",
-      group: "link",
-      description: 'Space-separated relationship tokens (e.g. "noopener noreferrer").'
-    },
-    overrides
-  );
-}
-function altTrait(overrides) {
-  return withOverrides(
-    {
-      name: "alt",
-      label: "Alt Text",
-      type: "string",
-      attribute: "alt",
-      group: "accessibility",
-      required: true,
-      description: "Alternative text describing the media for screen readers and fallback."
-    },
-    overrides
-  );
-}
-function titleTrait(overrides) {
-  return withOverrides(
-    {
-      name: "title",
-      label: "Title",
-      type: "string",
-      attribute: "title",
-      group: "semantic",
-      description: "Advisory title for the element (tooltip / document title)."
-    },
-    overrides
-  );
-}
-function placeholderTrait(overrides) {
-  return withOverrides(
-    {
-      name: "placeholder",
-      label: "Placeholder",
-      type: "string",
-      attribute: "placeholder",
-      group: "form",
-      description: "Hint text shown inside the control when it is empty."
-    },
-    overrides
-  );
-}
-function ariaLabelTrait(overrides) {
-  return withOverrides(
-    {
-      name: "ariaLabel",
-      label: "Accessible Label (aria-label)",
-      type: "string",
-      attribute: "aria-label",
-      group: "accessibility",
-      description: "Accessible name for assistive technology when no visible label exists."
-    },
-    overrides
-  );
-}
-function idTrait(overrides) {
-  return withOverrides(
-    {
-      name: "id",
-      label: "Element ID",
-      type: "string",
-      attribute: "id",
-      group: "identity",
-      description: "A custom, document-unique identifier used for anchors, CSS, and scripting."
-    },
-    overrides
-  );
-}
-function fieldNameTrait(overrides) {
-  return withOverrides(
-    {
-      name: "name",
-      label: "Field Name",
-      type: "string",
-      attribute: "name",
-      group: "form",
-      required: true,
-      description: "The name submitted with the form data for this field."
-    },
-    overrides
-  );
-}
-function requiredTrait(overrides) {
-  return withOverrides(
-    {
-      name: "required",
-      label: "Required",
-      type: "boolean",
-      defaultValue: false,
-      attribute: "required",
-      group: "form",
-      description: "Whether the field must be filled before the form can be submitted."
-    },
-    overrides
-  );
-}
-function disabledTrait(overrides) {
-  return withOverrides(
-    {
-      name: "disabled",
-      label: "Disabled",
-      type: "boolean",
-      defaultValue: false,
-      attribute: "disabled",
-      group: "behavior",
-      description: "Disables the control so it cannot be focused or activated."
-    },
-    overrides
-  );
-}
-function readOnlyTrait(overrides) {
-  return withOverrides(
-    {
-      name: "readOnly",
-      label: "Read Only",
-      type: "boolean",
-      defaultValue: false,
-      attribute: "readonly",
-      group: "behavior",
-      description: "Prevents the user from modifying the control value."
-    },
-    overrides
-  );
-}
-function srcTrait(overrides) {
-  return withOverrides(
-    {
-      name: "src",
-      label: "Source URL",
-      type: "string",
-      attribute: "src",
-      group: "media",
-      required: true,
-      description: "The source URL of the media resource."
-    },
-    overrides
-  );
-}
-function posterTrait(overrides) {
-  return withOverrides(
-    {
-      name: "poster",
-      label: "Poster Image URL",
-      type: "string",
-      attribute: "poster",
-      group: "media",
-      description: "A preview image shown before the video starts playing."
-    },
-    overrides
-  );
-}
-function controlsTrait(overrides) {
-  return withOverrides(
-    {
-      name: "controls",
-      label: "Show Controls",
-      type: "boolean",
-      defaultValue: true,
-      attribute: "controls",
-      group: "media",
-      description: "Whether to show the native play/pause/volume controls."
-    },
-    overrides
-  );
-}
-function autoplayTrait(overrides) {
-  return withOverrides(
-    {
-      name: "autoplay",
-      label: "Autoplay",
-      type: "boolean",
-      defaultValue: false,
-      attribute: "autoplay",
-      group: "media",
-      description: "Whether the media starts playing automatically on load."
-    },
-    overrides
-  );
-}
-function loopTrait(overrides) {
-  return withOverrides(
-    {
-      name: "loop",
-      label: "Loop",
-      type: "boolean",
-      defaultValue: false,
-      attribute: "loop",
-      group: "media",
-      description: "Whether the media restarts automatically when it reaches the end."
-    },
-    overrides
-  );
-}
-function mutedTrait(overrides) {
-  return withOverrides(
-    {
-      name: "muted",
-      label: "Muted",
-      type: "boolean",
-      defaultValue: false,
-      attribute: "muted",
-      group: "media",
-      description: "Whether the media starts with the audio muted."
-    },
-    overrides
-  );
-}
-function citeTrait(overrides) {
-  return withOverrides(
-    {
-      name: "cite",
-      label: "Citation URL (cite)",
-      type: "string",
-      attribute: "cite",
-      group: "semantic",
-      description: "The URL of the source document the quote is taken from."
-    },
-    overrides
-  );
-}
-function loadingTrait(overrides) {
-  return withOverrides(
-    {
-      name: "loading",
-      label: "Loading Mode",
-      type: "select",
-      defaultValue: "lazy",
-      attribute: "loading",
-      group: "media",
-      options: [
-        { label: "Lazy (load when near viewport)", value: "lazy" },
-        { label: "Eager (load immediately)", value: "eager" }
-      ],
-      description: "Native loading hint: lazy defers offscreen images, eager loads immediately."
-    },
-    overrides
-  );
-}
-function actionTrait(overrides) {
-  return withOverrides(
-    {
-      name: "action",
-      label: "Action URL",
-      type: "string",
-      attribute: "action",
-      group: "form",
-      description: "The URL the form data is submitted to."
-    },
-    overrides
-  );
-}
-function methodTrait(overrides) {
-  return withOverrides(
-    {
-      name: "method",
-      label: "Method",
-      type: "select",
-      defaultValue: "POST",
-      attribute: "method",
-      group: "form",
-      options: [
-        { label: "POST", value: "POST" },
-        { label: "GET", value: "GET" }
-      ],
-      description: "The HTTP method used to submit the form."
-    },
-    overrides
-  );
-}
-function autoCompleteTrait(overrides) {
-  return withOverrides(
-    {
-      name: "autoComplete",
-      label: "Auto Complete",
-      type: "select",
-      defaultValue: "on",
-      attribute: "autocomplete",
-      group: "form",
-      options: [
-        { label: "On", value: "on" },
-        { label: "Off", value: "off" }
-      ],
-      description: "Whether the browser may autofill values for this form."
-    },
-    overrides
-  );
-}
-function valueTrait(overrides) {
-  return withOverrides(
-    {
-      name: "value",
-      label: "Value",
-      type: "string",
-      attribute: "value",
-      group: "form",
-      description: "The value submitted with the form data when the control is selected."
-    },
-    overrides
-  );
-}
-function defaultCheckedTrait(overrides) {
-  return withOverrides(
-    {
-      name: "defaultChecked",
-      label: "Default Checked",
-      type: "boolean",
-      defaultValue: false,
-      attribute: "checked",
-      group: "form",
-      description: "Whether the control starts in the checked state."
-    },
-    overrides
-  );
-}
-function defaultValueTrait(overrides) {
-  return withOverrides(
-    {
-      name: "defaultValue",
-      label: "Default Value",
-      type: "string",
-      attribute: "value",
-      group: "form",
-      description: "The initial value of the control before the user edits it."
-    },
-    overrides
-  );
-}
-function rowsTrait(overrides) {
-  return withOverrides(
-    {
-      name: "rows",
-      label: "Rows",
-      type: "number",
-      defaultValue: 4,
-      attribute: "rows",
-      group: "form",
-      description: "The number of visible text lines in the textarea."
-    },
-    overrides
-  );
-}
-function colSpanTrait(overrides) {
-  return withOverrides(
-    {
-      name: "colSpan",
-      label: "Column Span (colSpan)",
-      type: "number",
-      defaultValue: 1,
-      attribute: "colspan",
-      group: "semantic",
-      description: "The number of columns the cell spans."
-    },
-    overrides
-  );
-}
-function rowSpanTrait(overrides) {
-  return withOverrides(
-    {
-      name: "rowSpan",
-      label: "Row Span (rowSpan)",
-      type: "number",
-      defaultValue: 1,
-      attribute: "rowspan",
-      group: "semantic",
-      description: "The number of rows the cell spans."
-    },
-    overrides
-  );
-}
-function tagTrait(overrides) {
-  return withOverrides(
-    {
-      name: "tag",
-      label: "HTML Tag",
-      type: "select",
-      attribute: "tag",
-      group: "semantic",
-      description: "The semantic HTML tag the component renders as."
-    },
-    overrides
-  );
-}
-function inputTypeTrait(overrides) {
-  return withOverrides(
-    {
-      name: "type",
-      label: "Input Type",
-      type: "select",
-      defaultValue: "text",
-      attribute: "type",
-      group: "form",
-      description: "The semantic input type of the control."
-    },
-    overrides
-  );
-}
-function buttonTypeTrait(overrides) {
-  return withOverrides(
-    {
-      name: "buttonType",
-      label: "Button Type",
-      type: "select",
-      defaultValue: "button",
-      attribute: "type",
-      group: "form",
-      options: [
-        { label: "Button", value: "button" },
-        { label: "Submit Form (submit)", value: "submit" },
-        { label: "Reset Form (reset)", value: "reset" }
-      ],
-      description: "The button\u2019s behavior inside a form."
-    },
-    overrides
-  );
-}
-function preventDefaultTrait(overrides) {
-  return withOverrides(
-    {
-      name: "preventDefault",
-      label: "Prevent Default",
-      type: "boolean",
-      defaultValue: true,
-      group: "form",
-      description: "Intercept the native browser submit and handle it via the KUBUILD action pipeline instead."
-    },
-    overrides
-  );
-}
-function scrollToFirstErrorTrait(overrides) {
-  return withOverrides(
-    {
-      name: "scrollToFirstError",
-      label: "Scroll to First Error",
-      type: "boolean",
-      defaultValue: true,
-      group: "form",
-      description: "Automatically scroll to and focus the first invalid field when submission fails validation."
-    },
-    overrides
-  );
-}
-function resetOnSubmitTrait(overrides) {
-  return withOverrides(
-    {
-      name: "resetOnSubmit",
-      label: "Reset on Submit",
-      type: "boolean",
-      defaultValue: false,
-      group: "form",
-      description: "Reset all fields to their initial values after a successful form submission."
-    },
-    overrides
-  );
-}
-function patternTrait(overrides) {
-  return withOverrides(
-    {
-      name: "pattern",
-      label: "Pattern (regex)",
-      type: "string",
-      attribute: "pattern",
-      group: "form",
-      description: "A regular expression the input value must match to pass validation."
-    },
-    overrides
-  );
-}
-function minLengthTrait(overrides) {
-  return withOverrides(
-    {
-      name: "minLength",
-      label: "Min Length",
-      type: "number",
-      attribute: "minlength",
-      group: "form",
-      description: "The minimum number of characters the user must enter."
-    },
-    overrides
-  );
-}
-function maxLengthTrait(overrides) {
-  return withOverrides(
-    {
-      name: "maxLength",
-      label: "Max Length",
-      type: "number",
-      attribute: "maxlength",
-      group: "form",
-      description: "The maximum number of characters the user is allowed to enter."
-    },
-    overrides
-  );
-}
-function prefixIconTrait(overrides) {
-  return withOverrides(
-    {
-      name: "prefixIcon",
-      label: "Prefix Icon",
-      type: "string",
-      group: "form",
-      description: 'Lucide icon name displayed before the input value (e.g. "mail", "search").'
-    },
-    overrides
-  );
-}
-function suffixIconTrait(overrides) {
-  return withOverrides(
-    {
-      name: "suffixIcon",
-      label: "Suffix Icon",
-      type: "string",
-      group: "form",
-      description: 'Lucide icon name displayed after the input value (e.g. "eye", "check").'
-    },
-    overrides
-  );
-}
-function helperTextTrait(overrides) {
-  return withOverrides(
-    {
-      name: "helperText",
-      label: "Helper Text",
-      type: "string",
-      group: "form",
-      description: 'A short message displayed below the input to guide the user (e.g. "Must be at least 8 characters").'
-    },
-    overrides
-  );
-}
-function resizeTrait(overrides) {
-  return withOverrides(
-    {
-      name: "resize",
-      label: "Resize",
-      type: "select",
-      defaultValue: "vertical",
-      group: "form",
-      options: [
-        { label: "Vertical only", value: "vertical" },
-        { label: "Horizontal only", value: "horizontal" },
-        { label: "Both", value: "both" },
-        { label: "None", value: "none" }
-      ],
-      description: "Controls whether and how the user can resize the textarea."
-    },
-    overrides
-  );
-}
-function autoGrowTrait(overrides) {
-  return withOverrides(
-    {
-      name: "autoGrow",
-      label: "Auto Grow",
-      type: "boolean",
-      defaultValue: false,
-      group: "form",
-      description: "Automatically expand the textarea height to fit the content without scrolling."
-    },
-    overrides
-  );
-}
-function maxCharCountTrait(overrides) {
-  return withOverrides(
-    {
-      name: "maxCharCount",
-      label: "Max Character Count",
-      type: "number",
-      group: "form",
-      description: 'Maximum character limit displayed as a counter below the textarea (e.g. "120 / 500").'
-    },
-    overrides
-  );
-}
-function optionsListTrait(overrides) {
-  return withOverrides(
-    {
-      name: "options",
-      label: "Options",
-      type: "string",
-      group: "form",
-      description: "The list of dropdown options, each with a label and value. Editable via the inspector trait panel."
-    },
-    overrides
-  );
-}
-function labelTextTrait(overrides) {
-  return withOverrides(
-    {
-      name: "label",
-      label: "Label Text",
-      type: "string",
-      group: "form",
-      description: "The visible text label displayed alongside the control."
-    },
-    overrides
-  );
-}
-function indeterminateTrait(overrides) {
-  return withOverrides(
-    {
-      name: "indeterminate",
-      label: "Indeterminate",
-      type: "boolean",
-      defaultValue: false,
-      group: "form",
-      description: "Renders the checkbox in a mixed/indeterminate visual state (neither checked nor unchecked)."
-    },
-    overrides
-  );
-}
-function switchSizeTrait(overrides) {
-  return withOverrides(
-    {
-      name: "switchSize",
-      label: "Size",
-      type: "select",
-      defaultValue: "md",
-      group: "form",
-      options: [
-        { label: "Small", value: "sm" },
-        { label: "Medium", value: "md" },
-        { label: "Large", value: "lg" }
-      ],
-      description: "The visual size of the switch toggle."
-    },
-    overrides
-  );
-}
-function orientationTrait(overrides) {
-  return withOverrides(
-    {
-      name: "orientation",
-      label: "Orientation",
-      type: "select",
-      defaultValue: "vertical",
-      group: "form",
-      options: [
-        { label: "Vertical", value: "vertical" },
-        { label: "Horizontal", value: "horizontal" }
-      ],
-      description: "The layout direction of the child controls (vertical stack or horizontal row)."
-    },
-    overrides
-  );
-}
-function defaultSelectedTrait(overrides) {
-  return withOverrides(
-    {
-      name: "defaultSelected",
-      label: "Default Selected",
-      type: "string",
-      group: "form",
-      description: "The value of the radio item that is selected by default."
-    },
-    overrides
-  );
-}
-function acceptTrait(overrides) {
-  return withOverrides(
-    {
-      name: "accept",
-      label: "Accepted File Types",
-      type: "string",
-      attribute: "accept",
-      defaultValue: "*/*",
-      group: "form",
-      description: 'Comma-separated list of MIME types or file extensions accepted (e.g. "image/*,.pdf,.docx").'
-    },
-    overrides
-  );
-}
-function maxFileSizeTrait(overrides) {
-  return withOverrides(
-    {
-      name: "maxFileSize",
-      label: "Max File Size (MB)",
-      type: "number",
-      defaultValue: 10,
-      group: "form",
-      description: "The maximum allowable file size in megabytes (MB)."
-    },
-    overrides
-  );
-}
-function multipleTrait(overrides) {
-  return withOverrides(
-    {
-      name: "multiple",
-      label: "Allow Multiple Files",
-      type: "boolean",
-      attribute: "multiple",
-      defaultValue: false,
-      group: "form",
-      description: "Allow multiple files to be selected and uploaded at once."
-    },
-    overrides
-  );
-}
-function showPreviewTrait(overrides) {
-  return withOverrides(
-    {
-      name: "showPreview",
-      label: "Show Preview",
-      type: "boolean",
-      defaultValue: true,
-      group: "form",
-      description: "Display an interactive preview (image thumbnail or file list with badges) for selected files."
-    },
-    overrides
-  );
-}
-function loadingTextTrait(overrides) {
-  return withOverrides(
-    {
-      name: "loadingText",
-      label: "Loading Text",
-      type: "string",
-      defaultValue: "Submitting...",
-      group: "behavior",
-      description: "Text displayed on the button while the form submission is in progress."
-    },
-    overrides
-  );
-}
-function showSpinnerTrait(overrides) {
-  return withOverrides(
-    {
-      name: "showSpinner",
-      label: "Show Loading Spinner",
-      type: "boolean",
-      defaultValue: true,
-      group: "behavior",
-      description: "Automatically show an animated loading spinner icon while form is submitting."
-    },
-    overrides
-  );
-}
-function autoDisableOnSubmitTrait(overrides) {
-  return withOverrides(
-    {
-      name: "autoDisableOnSubmit",
-      label: "Auto Disable on Submit",
-      type: "boolean",
-      defaultValue: true,
-      group: "behavior",
-      description: "Automatically disable the button to prevent duplicate submissions while the form is submitting."
-    },
-    overrides
-  );
-}
-function sortTraits(traits) {
-  const groupRank = (group) => {
-    if (!group) return Number.MAX_SAFE_INTEGER;
-    const idx = TRAIT_GROUP_ORDER.indexOf(group);
-    return idx === -1 ? Number.MAX_SAFE_INTEGER : idx;
-  };
-  return [...traits].sort((a, b) => groupRank(a.group) - groupRank(b.group));
-}
-function collectTraitNames(traitsList) {
-  const names = /* @__PURE__ */ new Set();
-  for (const traits of traitsList) {
-    for (const trait of traits) {
-      names.add(trait.name);
-    }
-  }
-  return Array.from(names);
-}
-
-// src/definitions.ts
-var LAYOUT_PARENTS = ["page", "section", "container", "columns"];
-var CONTENT_CHILD_TYPES = [
-  "heading",
-  "text",
-  "paragraph",
-  "link",
-  "blockquote",
-  "badge",
-  "code-block",
-  "image",
-  "video",
-  "icon",
-  "html-embed",
-  "button",
-  "button-submit",
-  "form",
-  "input",
-  "textarea",
-  "select",
-  "checkbox",
-  "switch",
-  "radio-group",
-  "radio",
-  "radio-item",
-  "file-upload",
-  "list",
-  "table",
-  "collection",
-  "custom"
-];
-var pageDefinition = {
-  type: "page",
-  label: "Page",
-  category: "layout",
-  icon: "layout",
-  acceptsChildren: true,
-  allowedChildren: ["section", "custom"],
-  disallowedParents: [...LAYOUT_PARENTS, ...CONTENT_CHILD_TYPES, "list-item", "table-row", "table-cell"],
-  defaultProps: { title: "New Page" },
-  traits: [
-    titleTrait({ defaultValue: "New Page", description: "The document title shown in the browser tab and search results." }),
-    idTrait()
-  ],
-  defaultStyles: { base: { minHeight: "100vh", backgroundColor: "#ffffff" } }
-};
-var sectionDefinition = {
-  type: "section",
-  label: "Section",
-  category: "layout",
-  icon: "rows",
-  acceptsChildren: true,
-  allowedChildren: ["container", "columns", ...CONTENT_CHILD_TYPES],
-  defaultProps: {},
-  traits: [
-    idTrait(),
-    ariaLabelTrait({ description: "Accessible name for the section landmark." })
-  ],
-  defaultStyles: {
-    base: {
-      paddingTop: "48px",
-      paddingBottom: "48px",
-      paddingLeft: "16px",
-      paddingRight: "16px"
-    },
-    tablet: {
-      paddingTop: "32px",
-      paddingBottom: "32px"
-    },
-    mobile: {
-      paddingTop: "24px",
-      paddingBottom: "24px",
-      paddingLeft: "16px",
-      paddingRight: "16px"
-    }
-  }
-};
-var containerDefinition = {
-  type: "container",
-  label: "Container",
-  category: "layout",
-  icon: "box",
-  acceptsChildren: true,
-  allowedChildren: ["columns", ...CONTENT_CHILD_TYPES],
-  defaultProps: { maxWidth: "1200px" },
-  traits: [
-    idTrait()
-  ],
-  defaultStyles: {
-    base: {
-      maxWidth: "1200px",
-      margin: "0 auto",
-      width: "100%"
-    },
-    tablet: {
-      maxWidth: "720px"
-    },
-    mobile: {
-      maxWidth: "100%",
-      paddingLeft: "16px",
-      paddingRight: "16px"
-    }
-  }
-};
-var columnsDefinition = {
-  type: "columns",
-  label: "Columns",
-  category: "layout",
-  icon: "columns",
-  acceptsChildren: true,
-  allowedChildren: ["container", ...CONTENT_CHILD_TYPES],
-  defaultProps: { columns: 2, gap: "16px" },
-  traits: [
-    idTrait()
-  ],
-  defaultStyles: {
-    base: {
-      display: "grid",
-      gridTemplateColumns: "repeat(2, minmax(0, 1fr))",
-      gap: "16px"
-    },
-    tablet: {
-      gridTemplateColumns: "repeat(2, minmax(0, 1fr))",
-      gap: "12px"
-    },
-    mobile: {
-      gridTemplateColumns: "repeat(1, minmax(0, 1fr))",
-      gap: "12px"
-    }
-  }
-};
-var headingDefinition = {
-  type: "heading",
-  label: "Heading",
-  category: "typography",
-  icon: "heading",
-  acceptsChildren: false,
-  defaultProps: { text: "Heading Text", level: 2 },
-  propFields: [
-    { name: "text", label: "Text", type: "string", defaultValue: "Heading Text" },
-    {
-      name: "level",
-      label: "Heading Level",
-      type: "select",
-      defaultValue: 2,
-      options: [1, 2, 3, 4, 5, 6].map((level) => ({ label: `H${level}`, value: level }))
-    }
-  ],
-  traits: [
-    idTrait(),
-    titleTrait({ description: "Advisory title shown when hovering the heading." }),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (!isVariableBinding(props.text) && (typeof props.text !== "string" || props.text.trim().length === 0)) {
-      errors.push('Heading requires a non-empty "text".');
-    }
-    if (props.level !== void 0 && (typeof props.level !== "number" || props.level < 1 || props.level > 6)) {
-      errors.push('Heading "level" must be a number between 1 and 6.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      fontSize: "32px",
-      fontWeight: "700",
-      color: "#111827",
-      margin: "0 0 16px 0"
-    }
-  }
-};
-var textDefinition = {
-  type: "text",
-  label: "Text",
-  category: "typography",
-  icon: "type",
-  acceptsChildren: false,
-  defaultProps: { content: "Lorem ipsum dolor sit amet, consectetur adipiscing elit." },
-  propFields: [
-    { name: "content", label: "Content", type: "string", defaultValue: "Lorem ipsum dolor sit amet." }
-  ],
-  traits: [
-    idTrait(),
-    titleTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    if (!isVariableBinding(props.content) && (typeof props.content !== "string" || props.content.trim().length === 0)) {
-      return ['Text requires a non-empty "content".'];
-    }
-    return true;
-  },
-  defaultStyles: {
-    base: {
-      fontSize: "16px",
-      color: "#4b5563",
-      lineHeight: "1.6"
-    }
-  }
-};
-var imageDefinition = {
-  type: "image",
-  label: "Image",
-  category: "media",
-  icon: "image",
-  acceptsChildren: false,
-  capabilities: ["assetProvider"],
-  defaultProps: {
-    src: "https://images.unsplash.com/photo-1579546929518-9e396f3cc809?w=800&auto=format&fit=crop&q=80",
-    alt: "Default image",
-    width: 600,
-    height: 400
-  },
-  propFields: [
-    { name: "src", label: "Image URL", type: "string" },
-    { name: "asset", label: "Asset Reference", type: "json" },
-    { name: "alt", label: "Alt Text", type: "string", defaultValue: "Default image" },
-    { name: "width", label: "Width", type: "number" },
-    { name: "height", label: "Height", type: "number" }
-  ],
-  traits: [
-    srcTrait(),
-    altTrait({ defaultValue: "Default image" }),
-    loadingTrait(),
-    idTrait(),
-    titleTrait(),
-    ariaLabelTrait({ description: "Override the alt text for assistive technology (rarely needed)." })
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    const hasSrc = typeof props.src === "string" && props.src.trim().length > 0 || isVariableBinding(props.src);
-    const hasAsset = isAssetReference(props.asset);
-    if (!hasSrc && !hasAsset) {
-      errors.push('Image requires either a non-empty "src" URL or a valid "asset" reference.');
-    }
-    const hasAlt = typeof props.alt === "string" && props.alt.trim().length > 0 || isVariableBinding(props.alt);
-    if (!hasAlt) {
-      errors.push('Image requires non-empty "alt" text.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      maxWidth: "100%",
-      height: "auto",
-      borderRadius: "8px"
-    }
-  }
-};
-var buttonDefinition = {
-  type: "button",
-  label: "Button",
-  category: "interactive",
-  icon: "mouse-pointer",
-  acceptsChildren: false,
-  capabilities: ["actionRegistry"],
-  defaultProps: {
-    label: "Click Me",
-    variant: "primary"
-  },
-  propFields: [
-    { name: "label", label: "Label", type: "string", defaultValue: "Click Me" },
-    { name: "href", label: "Link URL", type: "string" },
-    { name: "action", label: "Action", type: "action" },
-    { name: "disabled", label: "Disabled", type: "boolean", defaultValue: false },
-    {
-      name: "buttonType",
-      label: "Button Type",
-      type: "select",
-      defaultValue: "button",
-      options: [
-        { label: "Button", value: "button" },
-        { label: "Submit Form (submit)", value: "submit" },
-        { label: "Reset Form (reset)", value: "reset" }
-      ]
-    },
-    {
-      name: "variant",
-      label: "Variant",
-      type: "select",
-      defaultValue: "primary",
-      options: [
-        { label: "Primary", value: "primary" },
-        { label: "Secondary", value: "secondary" }
-      ]
-    }
-  ],
-  traits: [
-    buttonTypeTrait(),
-    disabledTrait(),
-    hrefTrait({ description: "Optional URL \u2014 when set, the button renders as an anchor styled like a button." }),
-    targetTrait({ description: "Where to open the href URL (only used when href is set)." }),
-    relTrait({ description: "Relationship tokens (only used when href is set)." }),
-    idTrait(),
-    titleTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    const hasLabel = typeof props.label === "string" && props.label.trim().length > 0 || isVariableBinding(props.label);
-    if (!hasLabel) {
-      errors.push('Button requires a non-empty "label".');
-    }
-    if (props.href !== void 0 && typeof props.href !== "string" && !isVariableBinding(props.href)) {
-      errors.push('Button "href" must be a string when provided.');
-    }
-    if (props.buttonType !== void 0 && !isVariableBinding(props.buttonType)) {
-      if (!["button", "submit", "reset"].includes(props.buttonType)) {
-        errors.push('Button "buttonType" must be one of: "button", "submit", "reset".');
-      }
-    }
-    if (props.action !== void 0 && !isActionBinding(props.action)) {
-      errors.push('Button "action" must be a valid action binding when provided.');
-    }
-    if (props.disabled !== void 0 && typeof props.disabled !== "boolean" && !isVariableBinding(props.disabled)) {
-      errors.push('Button "disabled" must be a boolean when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      backgroundColor: "#2563eb",
-      color: "#ffffff",
-      paddingTop: "10px",
-      paddingBottom: "10px",
-      paddingLeft: "20px",
-      paddingRight: "20px",
-      borderRadius: "6px",
-      fontWeight: "500",
-      fontSize: "15px",
-      border: "none",
-      cursor: "pointer"
-    }
-  }
-};
-var collectionDefinition = {
-  type: "collection",
-  label: "Collection",
-  category: "data",
-  icon: "database",
-  acceptsChildren: true,
-  defaultProps: {
-    sourceKey: "items",
-    itemAlias: "item"
-  },
-  propFields: [
-    { name: "sourceKey", label: "Source Variable", type: "string", defaultValue: "items" },
-    { name: "itemAlias", label: "Item Alias", type: "string", defaultValue: "item" }
-  ],
-  traits: [
-    idTrait(),
-    ariaLabelTrait({ description: 'Accessible name summarizing the repeated collection (e.g. "Product list").' })
-  ]
-};
-var listDefinition = {
-  type: "list",
-  label: "List",
-  category: "typography",
-  icon: "list",
-  acceptsChildren: true,
-  allowedChildren: ["list-item"],
-  defaultProps: {
-    tag: "ul",
-    listStyleType: "disc"
-  },
-  defaultChildren: [
-    { type: "list-item", props: { text: "List item 1" } },
-    { type: "list-item", props: { text: "List item 2" } },
-    { type: "list-item", props: { text: "List item 3" } }
-  ],
-  propFields: [
-    {
-      name: "tag",
-      label: "Tag",
-      type: "select",
-      defaultValue: "ul",
-      options: [
-        { label: "Unordered (ul)", value: "ul" },
-        { label: "Ordered (ol)", value: "ol" }
-      ]
-    },
-    {
-      name: "listStyleType",
-      label: "List Style Type",
-      type: "select",
-      defaultValue: "disc",
-      options: [
-        { label: "Disc", value: "disc" },
-        { label: "Circle", value: "circle" },
-        { label: "Square", value: "square" },
-        { label: "Decimal", value: "decimal" },
-        { label: "None", value: "none" },
-        { label: "Custom Icon", value: "custom-icon" }
-      ]
-    }
-  ],
-  traits: [
-    idTrait(),
-    ariaLabelTrait({ description: 'Accessible name for the list (e.g. "Navigation menu", "Features").' })
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.tag !== void 0 && !isVariableBinding(props.tag)) {
-      if (props.tag !== "ul" && props.tag !== "ol") {
-        errors.push('List "tag" must be either "ul" or "ol".');
-      }
-    }
-    if (props.listStyleType !== void 0 && !isVariableBinding(props.listStyleType)) {
-      const allowed = ["disc", "circle", "square", "decimal", "none", "custom-icon"];
-      if (typeof props.listStyleType !== "string" || !allowed.includes(props.listStyleType)) {
-        errors.push(`List "listStyleType" must be one of: ${allowed.join(", ")}.`);
-      }
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      margin: "0 0 16px 0",
-      paddingLeft: "24px"
-    }
-  }
-};
-var listItemDefinition = {
-  type: "list-item",
-  label: "List Item",
-  category: "typography",
-  icon: "list-item",
-  acceptsChildren: true,
-  allowedChildren: [
-    "heading",
-    "text",
-    "paragraph",
-    "link",
-    "blockquote",
-    "badge",
-    "code-block",
-    "image",
-    "video",
-    "icon",
-    "html-embed",
-    "button",
-    "list",
-    "custom"
-  ],
-  defaultProps: {
-    text: "List item"
-  },
-  propFields: [
-    {
-      name: "text",
-      label: "Text",
-      type: "string",
-      defaultValue: "List item"
-    }
-  ],
-  traits: [
-    idTrait(),
-    titleTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.text !== void 0 && typeof props.text !== "string" && !isVariableBinding(props.text)) {
-      errors.push('List Item "text" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      margin: "4px 0",
-      fontSize: "16px",
-      color: "#374151",
-      lineHeight: "1.5"
-    }
-  }
-};
-var paragraphDefinition = {
-  type: "paragraph",
-  label: "Paragraph",
-  category: "typography",
-  icon: "paragraph",
-  acceptsChildren: false,
-  defaultProps: {
-    text: "A paragraph of text with clean semantic typography."
-  },
-  propFields: [
-    {
-      name: "text",
-      label: "Text",
-      type: "string",
-      defaultValue: "A paragraph of text with clean semantic typography."
-    }
-  ],
-  traits: [
-    idTrait(),
-    titleTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    const textVal = props.text ?? props.content;
-    if (textVal !== void 0 && !isVariableBinding(textVal) && (typeof textVal !== "string" || textVal.trim().length === 0)) {
-      errors.push('Paragraph requires a non-empty "text".');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      fontSize: "16px",
-      color: "#4b5563",
-      lineHeight: "1.6",
-      margin: "0 0 16px 0"
-    }
-  }
-};
-var linkDefinition = {
-  type: "link",
-  label: "Link",
-  category: "typography",
-  icon: "link",
-  acceptsChildren: false,
-  defaultProps: {
-    text: "Click here",
-    href: "#",
-    target: "_self",
-    rel: ""
-  },
-  propFields: [
-    { name: "text", label: "Link Text", type: "string", defaultValue: "Click here" },
-    { name: "href", label: "URL (href)", type: "string", defaultValue: "#" },
-    {
-      name: "target",
-      label: "Target",
-      type: "select",
-      defaultValue: "_self",
-      options: [
-        { label: "Same tab (_self)", value: "_self" },
-        { label: "New tab (_blank)", value: "_blank" },
-        { label: "Parent (_parent)", value: "_parent" },
-        { label: "Top (_top)", value: "_top" }
-      ]
-    },
-    { name: "rel", label: "Relationship (rel)", type: "string", defaultValue: "" }
-  ],
-  traits: [
-    hrefTrait(),
-    targetTrait(),
-    relTrait(),
-    idTrait(),
-    titleTrait({ description: "Advisory title shown when hovering the link." }),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.text !== void 0 && !isVariableBinding(props.text) && (typeof props.text !== "string" || props.text.trim().length === 0)) {
-      errors.push('Link requires a non-empty "text".');
-    }
-    if (props.href !== void 0 && typeof props.href !== "string" && !isVariableBinding(props.href)) {
-      errors.push('Link "href" must be a string when provided.');
-    }
-    if (props.target !== void 0 && !isVariableBinding(props.target)) {
-      const allowedTargets = ["_self", "_blank", "_parent", "_top"];
-      if (typeof props.target !== "string" || !allowedTargets.includes(props.target)) {
-        errors.push(`Link "target" must be one of: ${allowedTargets.join(", ")}.`);
-      }
-    }
-    if (props.rel !== void 0 && typeof props.rel !== "string" && !isVariableBinding(props.rel)) {
-      errors.push('Link "rel" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      color: "#2563eb",
-      textDecoration: "underline",
-      cursor: "pointer"
-    }
-  }
-};
-var blockquoteDefinition = {
-  type: "blockquote",
-  label: "Blockquote",
-  category: "typography",
-  icon: "blockquote",
-  acceptsChildren: true,
-  allowedChildren: [
-    "paragraph",
-    "text",
-    "heading",
-    "link",
-    "badge",
-    "code-block",
-    "image",
-    "video",
-    "icon",
-    "html-embed",
-    "custom"
-  ],
-  defaultProps: {
-    text: "\u201CSimplicity is the soul of efficiency.\u201D"
-  },
-  propFields: [
-    {
-      name: "text",
-      label: "Quote Text",
-      type: "string",
-      defaultValue: "\u201CSimplicity is the soul of efficiency.\u201D"
-    },
-    { name: "cite", label: "Citation URL (cite)", type: "string" }
-  ],
-  traits: [
-    citeTrait(),
-    idTrait(),
-    titleTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.text !== void 0 && typeof props.text !== "string" && !isVariableBinding(props.text)) {
-      errors.push('Blockquote "text" must be a string when provided.');
-    }
-    if (props.cite !== void 0 && typeof props.cite !== "string" && !isVariableBinding(props.cite)) {
-      errors.push('Blockquote "cite" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      borderLeftWidth: "4px",
-      borderLeftColor: "#3b82f6",
-      borderLeftStyle: "solid",
-      paddingTop: "8px",
-      paddingBottom: "8px",
-      paddingLeft: "16px",
-      paddingRight: "12px",
-      margin: "0 0 16px 0",
-      fontStyle: "italic",
-      color: "#4b5563",
-      backgroundColor: "#f8fafc"
-    }
-  }
-};
-var badgeDefinition = {
-  type: "badge",
-  label: "Badge",
-  category: "typography",
-  icon: "badge",
-  acceptsChildren: false,
-  defaultProps: {
-    text: "Badge",
-    variant: "default"
-  },
-  propFields: [
-    { name: "text", label: "Badge Text", type: "string", defaultValue: "Badge" },
-    {
-      name: "variant",
-      label: "Variant",
-      type: "select",
-      defaultValue: "default",
-      options: [
-        { label: "Default", value: "default" },
-        { label: "Success", value: "success" },
-        { label: "Warning", value: "warning" },
-        { label: "Danger", value: "danger" },
-        { label: "Info", value: "info" }
-      ]
-    }
-  ],
-  traits: [
-    idTrait(),
-    titleTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.text !== void 0 && !isVariableBinding(props.text) && (typeof props.text !== "string" || props.text.trim().length === 0)) {
-      errors.push('Badge requires a non-empty "text".');
-    }
-    if (props.variant !== void 0 && typeof props.variant !== "string" && !isVariableBinding(props.variant)) {
-      errors.push('Badge "variant" must be a string.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      display: "inline-flex",
-      alignItems: "center",
-      paddingLeft: "10px",
-      paddingRight: "10px",
-      paddingTop: "2px",
-      paddingBottom: "2px",
-      borderRadius: "9999px",
-      fontSize: "12px",
-      fontWeight: "500",
-      lineHeight: "1.4",
-      backgroundColor: "#e0e7ff",
-      color: "#3730a3"
-    }
-  }
-};
-var codeBlockDefinition = {
-  type: "code-block",
-  label: "Code Block",
-  category: "typography",
-  icon: "code-block",
-  acceptsChildren: false,
-  defaultProps: {
-    code: 'console.log("Hello, world!");',
-    language: "javascript"
-  },
-  propFields: [
-    {
-      name: "code",
-      label: "Code",
-      type: "textarea",
-      defaultValue: 'console.log("Hello, world!");'
-    },
-    {
-      name: "language",
-      label: "Language",
-      type: "string",
-      defaultValue: "javascript"
-    }
-  ],
-  traits: [
-    idTrait(),
-    titleTrait(),
-    ariaLabelTrait({ description: "Accessible label describing what the code example shows." })
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.code !== void 0 && typeof props.code !== "string" && !isVariableBinding(props.code)) {
-      errors.push('Code Block "code" must be a string when provided.');
-    }
-    if (props.language !== void 0 && typeof props.language !== "string" && !isVariableBinding(props.language)) {
-      errors.push('Code Block "language" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      backgroundColor: "#1e293b",
-      color: "#f8fafc",
-      padding: "16px",
-      borderRadius: "8px",
-      fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace',
-      fontSize: "14px",
-      lineHeight: "1.5",
-      overflowX: "auto",
-      margin: "0 0 16px 0",
-      whiteSpace: "pre"
-    }
-  }
-};
-var videoDefinition = {
-  type: "video",
-  label: "Video",
-  category: "media",
-  icon: "video",
-  acceptsChildren: false,
-  defaultProps: {
-    src: "https://www.youtube.com/watch?v=dQw4w9WgXcQ",
-    provider: "auto",
-    poster: "",
-    controls: true,
-    autoplay: false,
-    loop: false,
-    muted: false,
-    aspectRatio: "16:9"
-  },
-  propFields: [
-    {
-      name: "src",
-      label: "Video URL (HTML5, YouTube, Vimeo)",
-      type: "string",
-      defaultValue: "https://www.youtube.com/watch?v=dQw4w9WgXcQ"
-    },
-    {
-      name: "provider",
-      label: "Provider",
-      type: "select",
-      defaultValue: "auto",
-      options: [
-        { label: "Auto Detect", value: "auto" },
-        { label: "HTML5 Video", value: "html5" },
-        { label: "YouTube Embed", value: "youtube" },
-        { label: "Vimeo Embed", value: "vimeo" }
-      ]
-    },
-    { name: "poster", label: "Poster Image URL", type: "string", defaultValue: "" },
-    { name: "controls", label: "Show Controls", type: "boolean", defaultValue: true },
-    { name: "autoplay", label: "Autoplay", type: "boolean", defaultValue: false },
-    { name: "loop", label: "Loop", type: "boolean", defaultValue: false },
-    { name: "muted", label: "Muted", type: "boolean", defaultValue: false },
-    {
-      name: "aspectRatio",
-      label: "Aspect Ratio",
-      type: "select",
-      defaultValue: "16:9",
-      options: [
-        { label: "16:9 (Widescreen)", value: "16:9" },
-        { label: "4:3 (Standard)", value: "4:3" },
-        { label: "1:1 (Square)", value: "1:1" },
-        { label: "9:16 (Vertical)", value: "9:16" },
-        { label: "Auto", value: "auto" }
-      ]
-    }
-  ],
-  traits: [
-    srcTrait(),
-    posterTrait(),
-    controlsTrait(),
-    autoplayTrait(),
-    loopTrait(),
-    mutedTrait(),
-    idTrait(),
-    titleTrait(),
-    ariaLabelTrait({ description: "Accessible name summarizing the video content." })
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.src !== void 0 && typeof props.src !== "string" && !isVariableBinding(props.src)) {
-      errors.push('Video "src" must be a string when provided.');
-    }
-    if (props.provider !== void 0 && !isVariableBinding(props.provider)) {
-      const allowed = ["auto", "html5", "youtube", "vimeo"];
-      if (typeof props.provider !== "string" || !allowed.includes(props.provider)) {
-        errors.push(`Video "provider" must be one of: ${allowed.join(", ")}.`);
-      }
-    }
-    if (props.controls !== void 0 && typeof props.controls !== "boolean" && !isVariableBinding(props.controls)) {
-      errors.push('Video "controls" must be a boolean.');
-    }
-    if (props.autoplay !== void 0 && typeof props.autoplay !== "boolean" && !isVariableBinding(props.autoplay)) {
-      errors.push('Video "autoplay" must be a boolean.');
-    }
-    if (props.loop !== void 0 && typeof props.loop !== "boolean" && !isVariableBinding(props.loop)) {
-      errors.push('Video "loop" must be a boolean.');
-    }
-    if (props.muted !== void 0 && typeof props.muted !== "boolean" && !isVariableBinding(props.muted)) {
-      errors.push('Video "muted" must be a boolean.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      width: "100%",
-      maxWidth: "800px",
-      borderRadius: "8px",
-      overflow: "hidden",
-      display: "block",
-      margin: "0 0 16px 0"
-    }
-  }
-};
-var iconDefinition = {
-  type: "icon",
-  label: "Icon",
-  category: "media",
-  icon: "sparkles",
-  acceptsChildren: false,
-  defaultProps: {
-    name: "star",
-    size: 24,
-    color: "#2563eb",
-    strokeWidth: 2
-  },
-  propFields: [
-    { name: "name", label: "Icon Name (Lucide)", type: "string", defaultValue: "star" },
-    { name: "size", label: "Size (px)", type: "number", defaultValue: 24 },
-    { name: "color", label: "Color", type: "color", defaultValue: "#2563eb" },
-    { name: "strokeWidth", label: "Stroke Width", type: "number", defaultValue: 2 }
-  ],
-  traits: [
-    idTrait(),
-    titleTrait(),
-    ariaLabelTrait({ required: true, description: "Required: describes what the icon represents for screen readers." })
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.name !== void 0 && !isVariableBinding(props.name) && (typeof props.name !== "string" || props.name.trim().length === 0)) {
-      errors.push('Icon requires a non-empty "name".');
-    }
-    if (props.size !== void 0 && !isVariableBinding(props.size)) {
-      if (typeof props.size !== "number" || props.size < 0) {
-        errors.push('Icon "size" must be a non-negative number.');
-      }
-    }
-    if (props.strokeWidth !== void 0 && !isVariableBinding(props.strokeWidth)) {
-      if (typeof props.strokeWidth !== "number" || props.strokeWidth < 0) {
-        errors.push('Icon "strokeWidth" must be a non-negative number.');
-      }
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      display: "inline-flex",
-      alignItems: "center",
-      justifyContent: "center"
-    }
-  }
-};
-var htmlEmbedDefinition = {
-  type: "html-embed",
-  label: "HTML Embed",
-  category: "custom",
-  icon: "code",
-  acceptsChildren: false,
-  defaultProps: {
-    html: '<div style="padding: 16px; background: #f1f5f9; border-radius: 8px; text-align: center; font-family: sans-serif; color: #475569;">Custom HTML Embed Content</div>'
-  },
-  propFields: [
-    {
-      name: "html",
-      label: "HTML / Embed Code",
-      type: "textarea",
-      defaultValue: '<div style="padding: 16px; background: #f1f5f9; border-radius: 8px; text-align: center; font-family: sans-serif; color: #475569;">Custom HTML Embed Content</div>'
-    }
-  ],
-  traits: [
-    idTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.html !== void 0 && typeof props.html !== "string" && !isVariableBinding(props.html)) {
-      errors.push('HTML Embed "html" must be a string.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      width: "100%",
-      margin: "0 0 16px 0"
-    }
-  }
-};
-var tableDefinition = {
-  type: "table",
-  label: "Table",
-  category: "layout",
-  icon: "table",
-  acceptsChildren: true,
-  allowedChildren: ["table-row"],
-  defaultProps: {
-    striped: false,
-    bordered: true,
-    compact: false
-  },
-  defaultChildren: [
-    {
-      type: "table-row",
-      children: [
-        { type: "table-cell", props: { tag: "th", text: "Header 1" } },
-        { type: "table-cell", props: { tag: "th", text: "Header 2" } }
-      ]
-    },
-    {
-      type: "table-row",
-      children: [
-        { type: "table-cell", props: { tag: "td", text: "Data 1" } },
-        { type: "table-cell", props: { tag: "td", text: "Data 2" } }
-      ]
-    }
-  ],
-  propFields: [
-    { name: "striped", label: "Striped Rows", type: "boolean", defaultValue: false },
-    { name: "bordered", label: "Bordered", type: "boolean", defaultValue: true },
-    { name: "compact", label: "Compact Spacing", type: "boolean", defaultValue: false }
-  ],
-  traits: [
-    idTrait(),
-    ariaLabelTrait({ description: "Required: provides a caption summary for the table when no visible caption exists." })
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.striped !== void 0 && typeof props.striped !== "boolean" && !isVariableBinding(props.striped)) {
-      errors.push('Table "striped" must be a boolean.');
-    }
-    if (props.bordered !== void 0 && typeof props.bordered !== "boolean" && !isVariableBinding(props.bordered)) {
-      errors.push('Table "bordered" must be a boolean.');
-    }
-    if (props.compact !== void 0 && typeof props.compact !== "boolean" && !isVariableBinding(props.compact)) {
-      errors.push('Table "compact" must be a boolean.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      width: "100%",
-      margin: "0 0 16px 0",
-      borderCollapse: "collapse"
-    }
-  }
-};
-var tableRowDefinition = {
-  type: "table-row",
-  label: "Table Row",
-  category: "layout",
-  icon: "table-row",
-  acceptsChildren: true,
-  allowedChildren: ["table-cell"],
-  disallowedParents: ["page"],
-  defaultProps: {},
-  defaultChildren: [
-    { type: "table-cell", props: { tag: "td", text: "Data" } }
-  ],
-  traits: [
-    idTrait(),
-    ariaLabelTrait()
-  ],
-  defaultStyles: {
-    base: {}
-  }
-};
-var tableCellDefinition = {
-  type: "table-cell",
-  label: "Table Cell",
-  category: "layout",
-  icon: "table-cell",
-  acceptsChildren: true,
-  allowedChildren: [
-    "heading",
-    "text",
-    "paragraph",
-    "link",
-    "blockquote",
-    "badge",
-    "code-block",
-    "image",
-    "video",
-    "icon",
-    "html-embed",
-    "button",
-    "list",
-    "custom"
-  ],
-  disallowedParents: ["page"],
-  defaultProps: {
-    tag: "td",
-    text: "Cell",
-    colSpan: 1,
-    rowSpan: 1
-  },
-  propFields: [
-    {
-      name: "tag",
-      label: "Cell Type",
-      type: "select",
-      defaultValue: "td",
-      options: [
-        { label: "Data Cell (td)", value: "td" },
-        { label: "Header Cell (th)", value: "th" }
-      ]
-    },
-    { name: "text", label: "Text", type: "string", defaultValue: "Cell" },
-    { name: "colSpan", label: "Column Span (colSpan)", type: "number", defaultValue: 1 },
-    { name: "rowSpan", label: "Row Span (rowSpan)", type: "number", defaultValue: 1 }
-  ],
-  traits: [
-    colSpanTrait(),
-    rowSpanTrait(),
-    idTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.tag !== void 0 && !isVariableBinding(props.tag)) {
-      if (props.tag !== "td" && props.tag !== "th") {
-        errors.push('Table Cell "tag" must be either "td" or "th".');
-      }
-    }
-    if (props.colSpan !== void 0 && !isVariableBinding(props.colSpan)) {
-      if (typeof props.colSpan !== "number" || props.colSpan < 1 || !Number.isInteger(props.colSpan)) {
-        errors.push('Table Cell "colSpan" must be a positive integer (>= 1).');
-      }
-    }
-    if (props.rowSpan !== void 0 && !isVariableBinding(props.rowSpan)) {
-      if (typeof props.rowSpan !== "number" || props.rowSpan < 1 || !Number.isInteger(props.rowSpan)) {
-        errors.push('Table Cell "rowSpan" must be a positive integer (>= 1).');
-      }
-    }
-    if (props.text !== void 0 && typeof props.text !== "string" && !isVariableBinding(props.text)) {
-      errors.push('Table Cell "text" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      padding: "8px 12px",
-      borderWidth: "1px",
-      borderColor: "#e2e8f0",
-      borderStyle: "solid",
-      textAlign: "left"
-    }
-  }
-};
-var formDefinition = {
-  type: "form",
-  label: "Form",
-  category: "form",
-  icon: "form",
-  acceptsChildren: true,
-  allowedChildren: [
-    ...CONTENT_CHILD_TYPES,
-    "container",
-    "columns",
-    "section"
-  ],
-  disallowedParents: ["page"],
-  defaultProps: {
-    name: "contact_form",
-    method: "POST",
-    action: "",
-    target: "_self",
-    autoComplete: "on",
-    preventDefault: true,
-    scrollToFirstError: true,
-    resetOnSubmit: false
-  },
-  defaultChildren: [
-    { type: "input", props: { name: "name", type: "text", placeholder: "Your Name", required: true } },
-    { type: "input", props: { name: "email", type: "email", placeholder: "Your Email", required: true } },
-    { type: "textarea", props: { name: "message", placeholder: "Your Message", rows: 4, required: true } },
-    { type: "checkbox", props: { name: "agree", label: "I agree to the terms and privacy policy", required: true } },
-    { type: "button", props: { label: "Send Message", variant: "primary", buttonType: "submit" } }
-  ],
-  propFields: [
-    { name: "name", label: "Form Name", type: "string", defaultValue: "contact_form" },
-    { name: "action", label: "Action URL", type: "string" },
-    {
-      name: "method",
-      label: "Method",
-      type: "select",
-      defaultValue: "POST",
-      options: [
-        { label: "POST", value: "POST" },
-        { label: "GET", value: "GET" }
-      ]
-    },
-    {
-      name: "target",
-      label: "Target",
-      type: "select",
-      defaultValue: "_self",
-      options: [
-        { label: "Same Window (_self)", value: "_self" },
-        { label: "New Tab (_blank)", value: "_blank" }
-      ]
-    },
-    {
-      name: "autoComplete",
-      label: "Auto Complete",
-      type: "select",
-      defaultValue: "on",
-      options: [
-        { label: "On", value: "on" },
-        { label: "Off", value: "off" }
-      ]
-    },
-    { name: "preventDefault", label: "Prevent Default", type: "boolean", defaultValue: true },
-    { name: "scrollToFirstError", label: "Scroll to First Error", type: "boolean", defaultValue: true },
-    { name: "resetOnSubmit", label: "Reset on Submit", type: "boolean", defaultValue: false }
-  ],
-  traits: [
-    fieldNameTrait({ defaultValue: "contact_form", required: false }),
-    actionTrait(),
-    methodTrait(),
-    targetTrait({ options: [
-      { label: "Same Window (_self)", value: "_self" },
-      { label: "New Tab (_blank)", value: "_blank" },
-      { label: "Parent (_parent)", value: "_parent" },
-      { label: "Top (_top)", value: "_top" }
-    ] }),
-    autoCompleteTrait(),
-    preventDefaultTrait(),
-    scrollToFirstErrorTrait(),
-    resetOnSubmitTrait(),
-    idTrait(),
-    ariaLabelTrait({ description: "Accessible name for the form landmark." })
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.name !== void 0 && typeof props.name !== "string" && !isVariableBinding(props.name)) {
-      errors.push('Form "name" must be a string when provided.');
-    }
-    if (props.action !== void 0 && typeof props.action !== "string" && !isVariableBinding(props.action)) {
-      errors.push('Form "action" must be a string when provided.');
-    }
-    if (props.method !== void 0 && !isVariableBinding(props.method)) {
-      if (!["GET", "POST", "get", "post"].includes(props.method)) {
-        errors.push('Form "method" must be either "GET" or "POST".');
-      }
-    }
-    if (props.target !== void 0 && !isVariableBinding(props.target)) {
-      if (!["_self", "_blank", "_parent", "_top"].includes(props.target)) {
-        errors.push('Form "target" must be one of: "_self", "_blank", "_parent", "_top".');
-      }
-    }
-    if (props.autoComplete !== void 0 && !isVariableBinding(props.autoComplete)) {
-      if (!["on", "off"].includes(props.autoComplete)) {
-        errors.push('Form "autoComplete" must be either "on" or "off".');
-      }
-    }
-    if (props.preventDefault !== void 0 && typeof props.preventDefault !== "boolean" && !isVariableBinding(props.preventDefault)) {
-      errors.push('Form "preventDefault" must be a boolean when provided.');
-    }
-    if (props.scrollToFirstError !== void 0 && typeof props.scrollToFirstError !== "boolean" && !isVariableBinding(props.scrollToFirstError)) {
-      errors.push('Form "scrollToFirstError" must be a boolean when provided.');
-    }
-    if (props.resetOnSubmit !== void 0 && typeof props.resetOnSubmit !== "boolean" && !isVariableBinding(props.resetOnSubmit)) {
-      errors.push('Form "resetOnSubmit" must be a boolean when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      width: "100%",
-      display: "flex",
-      flexDirection: "column",
-      gap: "16px"
-    }
-  }
-};
-var inputDefinition = {
-  type: "input",
-  label: "Input",
-  category: "form",
-  icon: "input",
-  acceptsChildren: false,
-  disallowedParents: ["page"],
-  defaultProps: {
-    name: "input_field",
-    type: "text",
-    placeholder: "Enter text...",
-    defaultValue: "",
-    required: false,
-    disabled: false,
-    readOnly: false,
-    pattern: "",
-    minLength: void 0,
-    maxLength: void 0,
-    prefixIcon: "",
-    suffixIcon: "",
-    helperText: ""
-  },
-  propFields: [
-    { name: "name", label: "Field Name", type: "string", defaultValue: "input_field" },
-    {
-      name: "type",
-      label: "Input Type",
-      type: "select",
-      defaultValue: "text",
-      options: [
-        { label: "Text", value: "text" },
-        { label: "Email", value: "email" },
-        { label: "Number", value: "number" },
-        { label: "Password", value: "password" },
-        { label: "Phone (tel)", value: "tel" },
-        { label: "URL", value: "url" },
-        { label: "Search", value: "search" },
-        { label: "Date", value: "date" }
-      ]
-    },
-    { name: "placeholder", label: "Placeholder", type: "string", defaultValue: "Enter text..." },
-    { name: "defaultValue", label: "Default Value", type: "string" },
-    { name: "required", label: "Required", type: "boolean", defaultValue: false },
-    { name: "disabled", label: "Disabled", type: "boolean", defaultValue: false },
-    { name: "readOnly", label: "Read Only", type: "boolean", defaultValue: false },
-    { name: "pattern", label: "Pattern (regex)", type: "string" },
-    { name: "minLength", label: "Min Length", type: "number" },
-    { name: "maxLength", label: "Max Length", type: "number" },
-    { name: "prefixIcon", label: "Prefix Icon", type: "string" },
-    { name: "suffixIcon", label: "Suffix Icon", type: "string" },
-    { name: "helperText", label: "Helper Text", type: "string" }
-  ],
-  traits: [
-    inputTypeTrait({ options: [
-      { label: "Text", value: "text" },
-      { label: "Email", value: "email" },
-      { label: "Number", value: "number" },
-      { label: "Password", value: "password" },
-      { label: "Phone (tel)", value: "tel" },
-      { label: "URL", value: "url" },
-      { label: "Search", value: "search" },
-      { label: "Date", value: "date" },
-      { label: "Hidden", value: "hidden" }
-    ] }),
-    fieldNameTrait({ defaultValue: "input_field" }),
-    placeholderTrait({ defaultValue: "Enter text..." }),
-    defaultValueTrait(),
-    requiredTrait(),
-    patternTrait(),
-    minLengthTrait(),
-    maxLengthTrait(),
-    prefixIconTrait(),
-    suffixIconTrait(),
-    helperTextTrait(),
-    disabledTrait(),
-    readOnlyTrait(),
-    idTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.name !== void 0 && typeof props.name !== "string" && !isVariableBinding(props.name)) {
-      errors.push('Input "name" must be a string when provided.');
-    }
-    if (props.type !== void 0 && !isVariableBinding(props.type)) {
-      const validTypes = ["text", "email", "number", "password", "tel", "url", "search", "date", "hidden"];
-      if (!validTypes.includes(props.type)) {
-        errors.push(`Input "type" must be one of: ${validTypes.join(", ")}.`);
-      }
-    }
-    if (props.placeholder !== void 0 && typeof props.placeholder !== "string" && !isVariableBinding(props.placeholder)) {
-      errors.push('Input "placeholder" must be a string when provided.');
-    }
-    if (props.required !== void 0 && typeof props.required !== "boolean" && !isVariableBinding(props.required)) {
-      errors.push('Input "required" must be a boolean when provided.');
-    }
-    if (props.disabled !== void 0 && typeof props.disabled !== "boolean" && !isVariableBinding(props.disabled)) {
-      errors.push('Input "disabled" must be a boolean when provided.');
-    }
-    if (props.readOnly !== void 0 && typeof props.readOnly !== "boolean" && !isVariableBinding(props.readOnly)) {
-      errors.push('Input "readOnly" must be a boolean when provided.');
-    }
-    if (props.pattern !== void 0 && typeof props.pattern !== "string" && !isVariableBinding(props.pattern)) {
-      errors.push('Input "pattern" must be a string when provided.');
-    }
-    if (props.minLength !== void 0 && !isVariableBinding(props.minLength)) {
-      if (typeof props.minLength !== "number" || props.minLength < 0 || !Number.isInteger(props.minLength)) {
-        errors.push('Input "minLength" must be a non-negative integer when provided.');
-      }
-    }
-    if (props.maxLength !== void 0 && !isVariableBinding(props.maxLength)) {
-      if (typeof props.maxLength !== "number" || props.maxLength < 0 || !Number.isInteger(props.maxLength)) {
-        errors.push('Input "maxLength" must be a non-negative integer when provided.');
-      }
-    }
-    if (props.prefixIcon !== void 0 && typeof props.prefixIcon !== "string" && !isVariableBinding(props.prefixIcon)) {
-      errors.push('Input "prefixIcon" must be a string when provided.');
-    }
-    if (props.suffixIcon !== void 0 && typeof props.suffixIcon !== "string" && !isVariableBinding(props.suffixIcon)) {
-      errors.push('Input "suffixIcon" must be a string when provided.');
-    }
-    if (props.helperText !== void 0 && typeof props.helperText !== "string" && !isVariableBinding(props.helperText)) {
-      errors.push('Input "helperText" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      width: "100%",
-      paddingTop: "10px",
-      paddingBottom: "10px",
-      paddingLeft: "14px",
-      paddingRight: "14px",
-      borderRadius: "6px",
-      borderWidth: "1px",
-      borderStyle: "solid",
-      borderColor: "#cbd5e1",
-      fontSize: "14px",
-      backgroundColor: "#ffffff",
-      color: "#1e293b",
-      boxSizing: "border-box"
-    }
-  }
-};
-var textareaDefinition = {
-  type: "textarea",
-  label: "Textarea",
-  category: "form",
-  icon: "textarea",
-  acceptsChildren: false,
-  disallowedParents: ["page"],
-  defaultProps: {
-    name: "message",
-    placeholder: "Enter your message...",
-    defaultValue: "",
-    rows: 4,
-    required: false,
-    disabled: false,
-    readOnly: false,
-    resize: "vertical",
-    autoGrow: false,
-    maxCharCount: void 0,
-    helperText: ""
-  },
-  propFields: [
-    { name: "name", label: "Field Name", type: "string", defaultValue: "message" },
-    { name: "placeholder", label: "Placeholder", type: "string", defaultValue: "Enter your message..." },
-    { name: "defaultValue", label: "Default Value", type: "textarea" },
-    { name: "rows", label: "Rows", type: "number", defaultValue: 4 },
-    { name: "required", label: "Required", type: "boolean", defaultValue: false },
-    { name: "disabled", label: "Disabled", type: "boolean", defaultValue: false },
-    { name: "readOnly", label: "Read Only", type: "boolean", defaultValue: false },
-    {
-      name: "resize",
-      label: "Resize",
-      type: "select",
-      defaultValue: "vertical",
-      options: [
-        { label: "Vertical only", value: "vertical" },
-        { label: "Horizontal only", value: "horizontal" },
-        { label: "Both", value: "both" },
-        { label: "None", value: "none" }
-      ]
-    },
-    { name: "autoGrow", label: "Auto Grow", type: "boolean", defaultValue: false },
-    { name: "maxCharCount", label: "Max Character Count", type: "number" },
-    { name: "helperText", label: "Helper Text", type: "string" }
-  ],
-  traits: [
-    fieldNameTrait({ defaultValue: "message" }),
-    placeholderTrait({ defaultValue: "Enter your message..." }),
-    defaultValueTrait(),
-    rowsTrait(),
-    resizeTrait(),
-    autoGrowTrait(),
-    maxCharCountTrait(),
-    helperTextTrait(),
-    requiredTrait(),
-    disabledTrait(),
-    readOnlyTrait(),
-    idTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.name !== void 0 && typeof props.name !== "string" && !isVariableBinding(props.name)) {
-      errors.push('Textarea "name" must be a string when provided.');
-    }
-    if (props.rows !== void 0 && !isVariableBinding(props.rows)) {
-      if (typeof props.rows !== "number" || props.rows < 1 || !Number.isInteger(props.rows)) {
-        errors.push('Textarea "rows" must be a positive integer (>= 1).');
-      }
-    }
-    if (props.placeholder !== void 0 && typeof props.placeholder !== "string" && !isVariableBinding(props.placeholder)) {
-      errors.push('Textarea "placeholder" must be a string when provided.');
-    }
-    if (props.required !== void 0 && typeof props.required !== "boolean" && !isVariableBinding(props.required)) {
-      errors.push('Textarea "required" must be a boolean when provided.');
-    }
-    if (props.disabled !== void 0 && typeof props.disabled !== "boolean" && !isVariableBinding(props.disabled)) {
-      errors.push('Textarea "disabled" must be a boolean when provided.');
-    }
-    if (props.readOnly !== void 0 && typeof props.readOnly !== "boolean" && !isVariableBinding(props.readOnly)) {
-      errors.push('Textarea "readOnly" must be a boolean when provided.');
-    }
-    if (props.resize !== void 0 && !isVariableBinding(props.resize)) {
-      const allowedResize = ["vertical", "horizontal", "both", "none"];
-      if (typeof props.resize !== "string" || !allowedResize.includes(props.resize)) {
-        errors.push(`Textarea "resize" must be one of: ${allowedResize.join(", ")}.`);
-      }
-    }
-    if (props.autoGrow !== void 0 && typeof props.autoGrow !== "boolean" && !isVariableBinding(props.autoGrow)) {
-      errors.push('Textarea "autoGrow" must be a boolean when provided.');
-    }
-    if (props.maxCharCount !== void 0 && !isVariableBinding(props.maxCharCount)) {
-      if (typeof props.maxCharCount !== "number" || props.maxCharCount < 1 || !Number.isInteger(props.maxCharCount)) {
-        errors.push('Textarea "maxCharCount" must be a positive integer (>= 1) when provided.');
-      }
-    }
-    if (props.helperText !== void 0 && typeof props.helperText !== "string" && !isVariableBinding(props.helperText)) {
-      errors.push('Textarea "helperText" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      width: "100%",
-      paddingTop: "10px",
-      paddingBottom: "10px",
-      paddingLeft: "14px",
-      paddingRight: "14px",
-      borderRadius: "6px",
-      borderWidth: "1px",
-      borderStyle: "solid",
-      borderColor: "#cbd5e1",
-      fontSize: "14px",
-      backgroundColor: "#ffffff",
-      color: "#1e293b",
-      boxSizing: "border-box"
-    }
-  }
-};
-var selectDefinition = {
-  type: "select",
-  label: "Select",
-  category: "form",
-  icon: "select",
-  acceptsChildren: false,
-  disallowedParents: ["page"],
-  defaultProps: {
-    name: "select_field",
-    placeholder: "Select an option...",
-    options: [
-      { label: "Option 1", value: "option1" },
-      { label: "Option 2", value: "option2" },
-      { label: "Option 3", value: "option3" }
-    ],
-    defaultValue: "",
-    required: false,
-    disabled: false,
-    helperText: ""
-  },
-  propFields: [
-    { name: "name", label: "Field Name", type: "string", defaultValue: "select_field" },
-    { name: "placeholder", label: "Placeholder", type: "string", defaultValue: "Select an option..." },
-    {
-      name: "options",
-      label: "Options (JSON list)",
-      type: "json",
-      defaultValue: [
-        { label: "Option 1", value: "option1" },
-        { label: "Option 2", value: "option2" },
-        { label: "Option 3", value: "option3" }
-      ]
-    },
-    { name: "defaultValue", label: "Default Selected Value", type: "string" },
-    { name: "required", label: "Required", type: "boolean", defaultValue: false },
-    { name: "disabled", label: "Disabled", type: "boolean", defaultValue: false },
-    { name: "helperText", label: "Helper Text", type: "string" }
-  ],
-  traits: [
-    fieldNameTrait({ defaultValue: "select_field" }),
-    placeholderTrait({ defaultValue: "Select an option..." }),
-    optionsListTrait({ description: "The list of dropdown choices (label + value pairs). Editable via the inspector trait panel." }),
-    defaultValueTrait({ description: "The initially selected option value (must match one of the option values)." }),
-    helperTextTrait(),
-    requiredTrait(),
-    disabledTrait(),
-    idTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.name !== void 0 && typeof props.name !== "string" && !isVariableBinding(props.name)) {
-      errors.push('Select "name" must be a string when provided.');
-    }
-    if (props.options !== void 0 && !isVariableBinding(props.options)) {
-      if (!Array.isArray(props.options) && typeof props.options !== "string") {
-        errors.push('Select "options" must be an array of option objects or a JSON string.');
-      }
-    }
-    if (props.required !== void 0 && typeof props.required !== "boolean" && !isVariableBinding(props.required)) {
-      errors.push('Select "required" must be a boolean when provided.');
-    }
-    if (props.disabled !== void 0 && typeof props.disabled !== "boolean" && !isVariableBinding(props.disabled)) {
-      errors.push('Select "disabled" must be a boolean when provided.');
-    }
-    if (props.helperText !== void 0 && typeof props.helperText !== "string" && !isVariableBinding(props.helperText)) {
-      errors.push('Select "helperText" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      width: "100%",
-      paddingTop: "10px",
-      paddingBottom: "10px",
-      paddingLeft: "14px",
-      paddingRight: "14px",
-      borderRadius: "6px",
-      borderWidth: "1px",
-      borderStyle: "solid",
-      borderColor: "#cbd5e1",
-      fontSize: "14px",
-      backgroundColor: "#ffffff",
-      color: "#1e293b",
-      boxSizing: "border-box"
-    }
-  }
-};
-var checkboxDefinition = {
-  type: "checkbox",
-  label: "Checkbox",
-  category: "form",
-  icon: "checkbox",
-  acceptsChildren: false,
-  disallowedParents: ["page"],
-  defaultProps: {
-    name: "checkbox_field",
-    label: "I agree to the terms and conditions",
-    value: "yes",
-    defaultChecked: false,
-    indeterminate: false,
-    required: false,
-    disabled: false,
-    helperText: ""
-  },
-  propFields: [
-    { name: "name", label: "Field Name", type: "string", defaultValue: "checkbox_field" },
-    { name: "label", label: "Label Text", type: "string", defaultValue: "I agree to the terms and conditions" },
-    { name: "value", label: "Checked Value", type: "string", defaultValue: "yes" },
-    { name: "defaultChecked", label: "Default Checked", type: "boolean", defaultValue: false },
-    { name: "indeterminate", label: "Indeterminate", type: "boolean", defaultValue: false },
-    { name: "required", label: "Required", type: "boolean", defaultValue: false },
-    { name: "disabled", label: "Disabled", type: "boolean", defaultValue: false },
-    { name: "helperText", label: "Helper Text", type: "string" }
-  ],
-  traits: [
-    fieldNameTrait({ defaultValue: "checkbox_field" }),
-    labelTextTrait({ defaultValue: "I agree to the terms and conditions" }),
-    valueTrait({ defaultValue: "yes" }),
-    defaultCheckedTrait(),
-    indeterminateTrait(),
-    helperTextTrait(),
-    requiredTrait(),
-    disabledTrait(),
-    idTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.label !== void 0 && typeof props.label !== "string" && !isVariableBinding(props.label)) {
-      errors.push('Checkbox "label" must be a string when provided.');
-    }
-    if (props.name !== void 0 && typeof props.name !== "string" && !isVariableBinding(props.name)) {
-      errors.push('Checkbox "name" must be a string when provided.');
-    }
-    if (props.value !== void 0 && typeof props.value !== "string" && !isVariableBinding(props.value)) {
-      errors.push('Checkbox "value" must be a string when provided.');
-    }
-    if (props.defaultChecked !== void 0 && typeof props.defaultChecked !== "boolean" && !isVariableBinding(props.defaultChecked)) {
-      errors.push('Checkbox "defaultChecked" must be a boolean when provided.');
-    }
-    if (props.indeterminate !== void 0 && typeof props.indeterminate !== "boolean" && !isVariableBinding(props.indeterminate)) {
-      errors.push('Checkbox "indeterminate" must be a boolean when provided.');
-    }
-    if (props.required !== void 0 && typeof props.required !== "boolean" && !isVariableBinding(props.required)) {
-      errors.push('Checkbox "required" must be a boolean when provided.');
-    }
-    if (props.disabled !== void 0 && typeof props.disabled !== "boolean" && !isVariableBinding(props.disabled)) {
-      errors.push('Checkbox "disabled" must be a boolean when provided.');
-    }
-    if (props.helperText !== void 0 && typeof props.helperText !== "string" && !isVariableBinding(props.helperText)) {
-      errors.push('Checkbox "helperText" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      display: "inline-flex",
-      alignItems: "center",
-      gap: "8px",
-      fontSize: "14px",
-      color: "#1e293b",
-      cursor: "pointer",
-      userSelect: "none"
-    }
-  }
-};
-var switchDefinition = {
-  type: "switch",
-  label: "Switch",
-  category: "form",
-  icon: "switch",
-  acceptsChildren: false,
-  disallowedParents: ["page"],
-  defaultProps: {
-    name: "switch_field",
-    label: "Enable feature",
-    value: "yes",
-    defaultChecked: false,
-    switchSize: "md",
-    required: false,
-    disabled: false,
-    helperText: ""
-  },
-  propFields: [
-    { name: "name", label: "Field Name", type: "string", defaultValue: "switch_field" },
-    { name: "label", label: "Label Text", type: "string", defaultValue: "Enable feature" },
-    { name: "value", label: "Checked Value", type: "string", defaultValue: "yes" },
-    { name: "defaultChecked", label: "Default Checked", type: "boolean", defaultValue: false },
-    {
-      name: "switchSize",
-      label: "Size",
-      type: "select",
-      defaultValue: "md",
-      options: [
-        { label: "Small", value: "sm" },
-        { label: "Medium", value: "md" },
-        { label: "Large", value: "lg" }
-      ]
-    },
-    { name: "required", label: "Required", type: "boolean", defaultValue: false },
-    { name: "disabled", label: "Disabled", type: "boolean", defaultValue: false },
-    { name: "helperText", label: "Helper Text", type: "string" }
-  ],
-  traits: [
-    fieldNameTrait({ defaultValue: "switch_field" }),
-    labelTextTrait({ defaultValue: "Enable feature" }),
-    valueTrait({ defaultValue: "yes" }),
-    defaultCheckedTrait(),
-    switchSizeTrait(),
-    helperTextTrait(),
-    requiredTrait(),
-    disabledTrait(),
-    idTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.label !== void 0 && typeof props.label !== "string" && !isVariableBinding(props.label)) {
-      errors.push('Switch "label" must be a string when provided.');
-    }
-    if (props.name !== void 0 && typeof props.name !== "string" && !isVariableBinding(props.name)) {
-      errors.push('Switch "name" must be a string when provided.');
-    }
-    if (props.value !== void 0 && typeof props.value !== "string" && !isVariableBinding(props.value)) {
-      errors.push('Switch "value" must be a string when provided.');
-    }
-    if (props.defaultChecked !== void 0 && typeof props.defaultChecked !== "boolean" && !isVariableBinding(props.defaultChecked)) {
-      errors.push('Switch "defaultChecked" must be a boolean when provided.');
-    }
-    if (props.switchSize !== void 0 && !isVariableBinding(props.switchSize)) {
-      const allowedSizes = ["sm", "md", "lg"];
-      if (typeof props.switchSize !== "string" || !allowedSizes.includes(props.switchSize)) {
-        errors.push(`Switch "switchSize" must be one of: ${allowedSizes.join(", ")}.`);
-      }
-    }
-    if (props.required !== void 0 && typeof props.required !== "boolean" && !isVariableBinding(props.required)) {
-      errors.push('Switch "required" must be a boolean when provided.');
-    }
-    if (props.disabled !== void 0 && typeof props.disabled !== "boolean" && !isVariableBinding(props.disabled)) {
-      errors.push('Switch "disabled" must be a boolean when provided.');
-    }
-    if (props.helperText !== void 0 && typeof props.helperText !== "string" && !isVariableBinding(props.helperText)) {
-      errors.push('Switch "helperText" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      display: "inline-flex",
-      alignItems: "center",
-      gap: "8px",
-      fontSize: "14px",
-      color: "#1e293b",
-      cursor: "pointer",
-      userSelect: "none"
-    }
-  }
-};
-var radioGroupDefinition = {
-  type: "radio-group",
-  label: "Radio Group",
-  category: "form",
-  icon: "radio-group",
-  acceptsChildren: true,
-  allowedChildren: ["radio", "radio-item", "custom"],
-  disallowedParents: ["page"],
-  defaultProps: {
-    name: "radio_group",
-    defaultSelected: "option1",
-    orientation: "vertical",
-    required: false,
-    disabled: false,
-    helperText: ""
-  },
-  defaultChildren: [
-    { type: "radio", props: { name: "radio_group", label: "Option 1", value: "option1", defaultChecked: true } },
-    { type: "radio", props: { name: "radio_group", label: "Option 2", value: "option2", defaultChecked: false } },
-    { type: "radio", props: { name: "radio_group", label: "Option 3", value: "option3", defaultChecked: false } }
-  ],
-  propFields: [
-    { name: "name", label: "Group Name", type: "string", defaultValue: "radio_group" },
-    { name: "defaultSelected", label: "Default Selected", type: "string", defaultValue: "option1" },
-    {
-      name: "orientation",
-      label: "Orientation",
-      type: "select",
-      defaultValue: "vertical",
-      options: [
-        { label: "Vertical", value: "vertical" },
-        { label: "Horizontal", value: "horizontal" }
-      ]
-    },
-    { name: "required", label: "Required", type: "boolean", defaultValue: false },
-    { name: "disabled", label: "Disabled", type: "boolean", defaultValue: false },
-    { name: "helperText", label: "Helper Text", type: "string" }
-  ],
-  traits: [
-    fieldNameTrait({ defaultValue: "radio_group", label: "Group Name" }),
-    defaultSelectedTrait({ defaultValue: "option1" }),
-    orientationTrait(),
-    helperTextTrait(),
-    requiredTrait(),
-    disabledTrait(),
-    idTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.name !== void 0 && typeof props.name !== "string" && !isVariableBinding(props.name)) {
-      errors.push('RadioGroup "name" must be a string when provided.');
-    }
-    if (props.defaultSelected !== void 0 && typeof props.defaultSelected !== "string" && !isVariableBinding(props.defaultSelected)) {
-      errors.push('RadioGroup "defaultSelected" must be a string when provided.');
-    }
-    if (props.orientation !== void 0 && !isVariableBinding(props.orientation)) {
-      const allowedOrientations = ["vertical", "horizontal"];
-      if (typeof props.orientation !== "string" || !allowedOrientations.includes(props.orientation)) {
-        errors.push(`RadioGroup "orientation" must be one of: ${allowedOrientations.join(", ")}.`);
-      }
-    }
-    if (props.required !== void 0 && typeof props.required !== "boolean" && !isVariableBinding(props.required)) {
-      errors.push('RadioGroup "required" must be a boolean when provided.');
-    }
-    if (props.disabled !== void 0 && typeof props.disabled !== "boolean" && !isVariableBinding(props.disabled)) {
-      errors.push('RadioGroup "disabled" must be a boolean when provided.');
-    }
-    if (props.helperText !== void 0 && typeof props.helperText !== "string" && !isVariableBinding(props.helperText)) {
-      errors.push('RadioGroup "helperText" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      display: "flex",
-      flexDirection: "column",
-      gap: "8px"
-    }
-  }
-};
-var radioDefinition = {
-  type: "radio",
-  label: "Radio",
-  category: "form",
-  icon: "radio",
-  acceptsChildren: false,
-  disallowedParents: ["page"],
-  defaultProps: {
-    name: "radio_group",
-    label: "Option 1",
-    value: "option1",
-    defaultChecked: false,
-    required: false,
-    disabled: false,
-    helperText: ""
-  },
-  propFields: [
-    { name: "name", label: "Group Name", type: "string", defaultValue: "radio_group" },
-    { name: "label", label: "Label Text", type: "string", defaultValue: "Option 1" },
-    { name: "value", label: "Radio Value", type: "string", defaultValue: "option1" },
-    { name: "defaultChecked", label: "Default Selected", type: "boolean", defaultValue: false },
-    { name: "required", label: "Required", type: "boolean", defaultValue: false },
-    { name: "disabled", label: "Disabled", type: "boolean", defaultValue: false },
-    { name: "helperText", label: "Helper Text", type: "string" }
-  ],
-  traits: [
-    fieldNameTrait({ defaultValue: "radio_group", label: "Group Name" }),
-    labelTextTrait({ defaultValue: "Option 1" }),
-    valueTrait({ defaultValue: "option1" }),
-    defaultCheckedTrait(),
-    helperTextTrait(),
-    requiredTrait(),
-    disabledTrait(),
-    idTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.label !== void 0 && typeof props.label !== "string" && !isVariableBinding(props.label)) {
-      errors.push('Radio "label" must be a string when provided.');
-    }
-    if (props.name !== void 0 && typeof props.name !== "string" && !isVariableBinding(props.name)) {
-      errors.push('Radio "name" must be a string when provided.');
-    }
-    if (props.value !== void 0 && typeof props.value !== "string" && !isVariableBinding(props.value)) {
-      errors.push('Radio "value" must be a string when provided.');
-    }
-    if (props.defaultChecked !== void 0 && typeof props.defaultChecked !== "boolean" && !isVariableBinding(props.defaultChecked)) {
-      errors.push('Radio "defaultChecked" must be a boolean when provided.');
-    }
-    if (props.required !== void 0 && typeof props.required !== "boolean" && !isVariableBinding(props.required)) {
-      errors.push('Radio "required" must be a boolean when provided.');
-    }
-    if (props.disabled !== void 0 && typeof props.disabled !== "boolean" && !isVariableBinding(props.disabled)) {
-      errors.push('Radio "disabled" must be a boolean when provided.');
-    }
-    if (props.helperText !== void 0 && typeof props.helperText !== "string" && !isVariableBinding(props.helperText)) {
-      errors.push('Radio "helperText" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      display: "inline-flex",
-      alignItems: "center",
-      gap: "8px",
-      fontSize: "14px",
-      color: "#1e293b",
-      cursor: "pointer",
-      userSelect: "none"
-    }
-  }
-};
-var radioItemDefinition = {
-  ...radioDefinition,
-  type: "radio-item",
-  label: "Radio Item"
-};
-var fileUploadDefinition = {
-  type: "file-upload",
-  label: "File Upload",
-  category: "form",
-  icon: "upload",
-  acceptsChildren: false,
-  disallowedParents: ["page"],
-  defaultProps: {
-    name: "file_upload",
-    label: "Upload File",
-    accept: "*/*",
-    maxFileSize: 10,
-    multiple: false,
-    showPreview: true,
-    required: false,
-    disabled: false,
-    helperText: ""
-  },
-  propFields: [
-    { name: "name", label: "Field Name", type: "string", defaultValue: "file_upload" },
-    { name: "label", label: "Label Text", type: "string", defaultValue: "Upload File" },
-    { name: "accept", label: "Accepted File Types", type: "string", defaultValue: "*/*" },
-    { name: "maxFileSize", label: "Max File Size (MB)", type: "number", defaultValue: 10 },
-    { name: "multiple", label: "Allow Multiple Files", type: "boolean", defaultValue: false },
-    { name: "showPreview", label: "Show Preview", type: "boolean", defaultValue: true },
-    { name: "required", label: "Required", type: "boolean", defaultValue: false },
-    { name: "disabled", label: "Disabled", type: "boolean", defaultValue: false },
-    { name: "helperText", label: "Helper Text", type: "string" }
-  ],
-  traits: [
-    fieldNameTrait({ defaultValue: "file_upload" }),
-    labelTextTrait({ defaultValue: "Upload File" }),
-    acceptTrait(),
-    maxFileSizeTrait(),
-    multipleTrait(),
-    showPreviewTrait(),
-    helperTextTrait(),
-    requiredTrait(),
-    disabledTrait(),
-    idTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    if (props.label !== void 0 && typeof props.label !== "string" && !isVariableBinding(props.label)) {
-      errors.push('FileUpload "label" must be a string when provided.');
-    }
-    if (props.name !== void 0 && typeof props.name !== "string" && !isVariableBinding(props.name)) {
-      errors.push('FileUpload "name" must be a string when provided.');
-    }
-    if (props.accept !== void 0 && typeof props.accept !== "string" && !isVariableBinding(props.accept)) {
-      errors.push('FileUpload "accept" must be a string when provided.');
-    }
-    if (props.maxFileSize !== void 0 && !isVariableBinding(props.maxFileSize)) {
-      if (typeof props.maxFileSize !== "number" || props.maxFileSize <= 0) {
-        errors.push('FileUpload "maxFileSize" must be a positive number when provided.');
-      }
-    }
-    if (props.multiple !== void 0 && typeof props.multiple !== "boolean" && !isVariableBinding(props.multiple)) {
-      errors.push('FileUpload "multiple" must be a boolean when provided.');
-    }
-    if (props.showPreview !== void 0 && typeof props.showPreview !== "boolean" && !isVariableBinding(props.showPreview)) {
-      errors.push('FileUpload "showPreview" must be a boolean when provided.');
-    }
-    if (props.required !== void 0 && typeof props.required !== "boolean" && !isVariableBinding(props.required)) {
-      errors.push('FileUpload "required" must be a boolean when provided.');
-    }
-    if (props.disabled !== void 0 && typeof props.disabled !== "boolean" && !isVariableBinding(props.disabled)) {
-      errors.push('FileUpload "disabled" must be a boolean when provided.');
-    }
-    if (props.helperText !== void 0 && typeof props.helperText !== "string" && !isVariableBinding(props.helperText)) {
-      errors.push('FileUpload "helperText" must be a string when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      display: "flex",
-      flexDirection: "column",
-      gap: "8px",
-      fontSize: "14px",
-      color: "#1e293b"
-    }
-  }
-};
-var buttonSubmitDefinition = {
-  type: "button-submit",
-  label: "Submit Button",
-  category: "form",
-  icon: "send",
-  acceptsChildren: false,
-  capabilities: ["actionRegistry"],
-  disallowedParents: ["page"],
-  defaultProps: {
-    label: "Submit",
-    loadingText: "Submitting...",
-    showSpinner: true,
-    autoDisableOnSubmit: true,
-    variant: "primary",
-    disabled: false,
-    buttonType: "submit"
-  },
-  propFields: [
-    { name: "label", label: "Label", type: "string", defaultValue: "Submit" },
-    { name: "loadingText", label: "Loading Text", type: "string", defaultValue: "Submitting..." },
-    { name: "showSpinner", label: "Show Loading Spinner", type: "boolean", defaultValue: true },
-    { name: "autoDisableOnSubmit", label: "Auto Disable on Submit", type: "boolean", defaultValue: true },
-    {
-      name: "buttonType",
-      label: "Button Type",
-      type: "select",
-      defaultValue: "submit",
-      options: [
-        { label: "Submit Form (submit)", value: "submit" },
-        { label: "Reset Form (reset)", value: "reset" }
-      ]
-    },
-    {
-      name: "variant",
-      label: "Variant",
-      type: "select",
-      defaultValue: "primary",
-      options: [
-        { label: "Primary", value: "primary" },
-        { label: "Secondary", value: "secondary" }
-      ]
-    },
-    { name: "disabled", label: "Disabled", type: "boolean", defaultValue: false },
-    { name: "prefixIcon", label: "Prefix Icon", type: "string" },
-    { name: "suffixIcon", label: "Suffix Icon", type: "string" }
-  ],
-  traits: [
-    buttonTypeTrait({
-      defaultValue: "submit",
-      options: [
-        { label: "Submit Form (submit)", value: "submit" },
-        { label: "Reset Form (reset)", value: "reset" }
-      ]
-    }),
-    labelTextTrait({ defaultValue: "Submit", label: "Label" }),
-    loadingTextTrait(),
-    showSpinnerTrait(),
-    autoDisableOnSubmitTrait(),
-    disabledTrait(),
-    prefixIconTrait(),
-    suffixIconTrait(),
-    idTrait(),
-    titleTrait(),
-    ariaLabelTrait()
-  ],
-  validateProps: (props) => {
-    const errors = [];
-    const hasLabel = typeof props.label === "string" && props.label.trim().length > 0 || isVariableBinding(props.label);
-    if (!hasLabel) {
-      errors.push('Submit Button requires a non-empty "label".');
-    }
-    if (props.loadingText !== void 0 && typeof props.loadingText !== "string" && !isVariableBinding(props.loadingText)) {
-      errors.push('Submit Button "loadingText" must be a string when provided.');
-    }
-    if (props.showSpinner !== void 0 && typeof props.showSpinner !== "boolean" && !isVariableBinding(props.showSpinner)) {
-      errors.push('Submit Button "showSpinner" must be a boolean when provided.');
-    }
-    if (props.autoDisableOnSubmit !== void 0 && typeof props.autoDisableOnSubmit !== "boolean" && !isVariableBinding(props.autoDisableOnSubmit)) {
-      errors.push('Submit Button "autoDisableOnSubmit" must be a boolean when provided.');
-    }
-    if (props.buttonType !== void 0 && !isVariableBinding(props.buttonType)) {
-      if (!["submit", "reset", "button"].includes(props.buttonType)) {
-        errors.push('Submit Button "buttonType" must be one of: "submit", "reset", "button".');
-      }
-    }
-    if (props.disabled !== void 0 && typeof props.disabled !== "boolean" && !isVariableBinding(props.disabled)) {
-      errors.push('Submit Button "disabled" must be a boolean when provided.');
-    }
-    return errors.length > 0 ? errors : true;
-  },
-  defaultStyles: {
-    base: {
-      backgroundColor: "#2563eb",
-      color: "#ffffff",
-      paddingTop: "10px",
-      paddingBottom: "10px",
-      paddingLeft: "20px",
-      paddingRight: "20px",
-      borderRadius: "6px",
-      fontWeight: "500",
-      fontSize: "15px",
-      border: "none",
-      cursor: "pointer",
-      display: "inline-flex",
-      alignItems: "center",
-      justifyContent: "center",
-      gap: "8px"
-    }
-  }
-};
-var coreComponentDefinitions = [
-  pageDefinition,
-  sectionDefinition,
-  containerDefinition,
-  columnsDefinition,
-  headingDefinition,
-  textDefinition,
-  paragraphDefinition,
-  linkDefinition,
-  blockquoteDefinition,
+import {
+  CONTENT_CHILD_TYPES,
+  ComponentRegistry,
+  LAYOUT_PARENTS,
   badgeDefinition,
-  codeBlockDefinition,
-  imageDefinition,
-  videoDefinition,
-  iconDefinition,
-  htmlEmbedDefinition,
+  blockquoteDefinition,
   buttonDefinition,
   buttonSubmitDefinition,
-  formDefinition,
-  inputDefinition,
-  textareaDefinition,
-  selectDefinition,
   checkboxDefinition,
-  switchDefinition,
-  radioGroupDefinition,
-  radioDefinition,
-  radioItemDefinition,
-  fileUploadDefinition,
+  codeBlockDefinition,
+  collapsibleDefinition,
   collectionDefinition,
+  columnsDefinition,
+  containerDefinition,
+  coreComponentDefinitions,
+  createDefaultComponentRegistry,
+  drawerDefinition,
+  fileUploadDefinition,
+  flexDefinition,
+  formDefinition,
+  gridDefinition,
+  headingDefinition,
+  htmlEmbedDefinition,
+  iconDefinition,
+  imageDefinition,
+  inputDefinition,
+  linkDefinition,
   listDefinition,
   listItemDefinition,
+  modalDefinition,
+  pageDefinition,
+  paragraphDefinition,
+  radioDefinition,
+  radioGroupDefinition,
+  radioItemDefinition,
+  sectionDefinition,
+  selectDefinition,
+  switchDefinition,
+  tableCellDefinition,
   tableDefinition,
   tableRowDefinition,
-  tableCellDefinition
-];
-function createDefaultComponentRegistry() {
-  const registry = new ComponentRegistry();
-  for (const def of coreComponentDefinitions) {
-    registry.register(def);
-  }
-  return registry;
-}
+  textDefinition,
+  textareaDefinition,
+  videoDefinition
+} from "./chunk-K6I6U7F3.js";
+import {
+  TRAIT_GROUP_LABELS,
+  TRAIT_GROUP_ORDER,
+  acceptTrait,
+  actionTrait,
+  altTrait,
+  ariaLabelTrait,
+  autoCompleteTrait,
+  autoDisableOnSubmitTrait,
+  autoGrowTrait,
+  autoplayTrait,
+  buttonTypeTrait,
+  citeTrait,
+  colSpanTrait,
+  collectTraitNames,
+  controlsTrait,
+  defaultCheckedTrait,
+  defaultSelectedTrait,
+  defaultValueTrait,
+  disabledTrait,
+  fieldNameTrait,
+  helperTextTrait,
+  hrefTrait,
+  idTrait,
+  indeterminateTrait,
+  inputTypeTrait,
+  labelTextTrait,
+  loadingTextTrait,
+  loadingTrait,
+  loopTrait,
+  maxCharCountTrait,
+  maxFileSizeTrait,
+  maxLengthTrait,
+  methodTrait,
+  minLengthTrait,
+  multipleTrait,
+  mutedTrait,
+  optionsListTrait,
+  orientationTrait,
+  patternTrait,
+  placeholderTrait,
+  posterTrait,
+  prefixIconTrait,
+  preventDefaultTrait,
+  readOnlyTrait,
+  relTrait,
+  requiredTrait,
+  resetOnSubmitTrait,
+  resizeTrait,
+  rowSpanTrait,
+  rowsTrait,
+  scrollToFirstErrorTrait,
+  showPreviewTrait,
+  showSpinnerTrait,
+  sortTraits,
+  srcTrait,
+  suffixIconTrait,
+  switchSizeTrait,
+  tagTrait,
+  targetTrait,
+  titleTrait,
+  valueTrait,
+  withOverrides
+} from "./chunk-OK53DS7G.js";
+import {
+  FORM_STARTER_BLOCKS,
+  LAYOUT_STARTER_BLOCKS,
+  STARTER_BLOCKS,
+  UI_STARTER_BLOCKS,
+  defaultGenId
+} from "./chunk-JTQ35OQQ.js";
 
 // src/requirements.ts
 function extractComponentRequirements(root, registry) {
@@ -3111,1278 +154,16 @@ function primitiveTypeForField(field) {
 function isBindableField(field) {
   return primitiveTypeForField(field) !== void 0;
 }
-
-// src/blocks.ts
-var nextId = 1;
-function defaultGenId(prefix = "node") {
-  return `${prefix}-${Date.now().toString(36)}-${(nextId++).toString(36)}`;
-}
-var STARTER_BLOCKS = [
-  // --- Layout Blocks (STORA-241) ---
-  {
-    id: "layout-1-col",
-    name: "1 Column",
-    category: "layout",
-    categoryLabel: "Layout Blocks",
-    description: "Full-width single column container inside a section",
-    icon: "layout",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("section"),
-      type: "section",
-      styles: { base: { padding: "40px 20px", width: "100%" } },
-      children: [
-        {
-          id: gen("container"),
-          type: "container",
-          props: { tag: "div" },
-          styles: { base: { maxWidth: "1200px", margin: "0 auto", width: "100%" } },
-          children: []
-        }
-      ]
-    })
-  },
-  {
-    id: "layout-2-col-50-50",
-    name: "2 Columns (50/50)",
-    category: "layout",
-    categoryLabel: "Layout Blocks",
-    description: "Two equal-width 50/50 columns with flexible layout",
-    icon: "columns",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("section"),
-      type: "section",
-      styles: { base: { padding: "40px 20px", width: "100%" } },
-      children: [
-        {
-          id: gen("columns"),
-          type: "columns",
-          props: { columns: 2, gap: "24px" },
-          styles: { base: { display: "flex", gap: "24px", width: "100%", maxWidth: "1200px", margin: "0 auto" } },
-          children: [
-            {
-              id: gen("container"),
-              type: "container",
-              props: { tag: "div" },
-              styles: { base: { flex: "1 1 0%", minWidth: "0" } },
-              children: []
-            },
-            {
-              id: gen("container"),
-              type: "container",
-              props: { tag: "div" },
-              styles: { base: { flex: "1 1 0%", minWidth: "0" } },
-              children: []
-            }
-          ]
-        }
-      ]
-    })
-  },
-  {
-    id: "layout-2-col-30-70",
-    name: "2 Columns (30/70)",
-    category: "layout",
-    categoryLabel: "Layout Blocks",
-    description: "Two asymmetric columns: 30% sidebar and 70% main area",
-    icon: "columns",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("section"),
-      type: "section",
-      styles: { base: { padding: "40px 20px", width: "100%" } },
-      children: [
-        {
-          id: gen("columns"),
-          type: "columns",
-          props: { columns: 2, gap: "24px" },
-          styles: { base: { display: "flex", gap: "24px", width: "100%", maxWidth: "1200px", margin: "0 auto" } },
-          children: [
-            {
-              id: gen("container"),
-              type: "container",
-              props: { tag: "div" },
-              styles: { base: { flex: "0 0 30%", minWidth: "0" } },
-              children: []
-            },
-            {
-              id: gen("container"),
-              type: "container",
-              props: { tag: "div" },
-              styles: { base: { flex: "1 1 0%", minWidth: "0" } },
-              children: []
-            }
-          ]
-        }
-      ]
-    })
-  },
-  {
-    id: "layout-3-col",
-    name: "3 Columns",
-    category: "layout",
-    categoryLabel: "Layout Blocks",
-    description: "Three equal-width columns for grid showcases or card groups",
-    icon: "grid",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("section"),
-      type: "section",
-      styles: { base: { padding: "40px 20px", width: "100%" } },
-      children: [
-        {
-          id: gen("columns"),
-          type: "columns",
-          props: { columns: 3, gap: "24px" },
-          styles: { base: { display: "flex", gap: "24px", width: "100%", maxWidth: "1200px", margin: "0 auto" } },
-          children: [
-            {
-              id: gen("container"),
-              type: "container",
-              props: { tag: "div" },
-              styles: { base: { flex: "1 1 0%", minWidth: "0" } },
-              children: []
-            },
-            {
-              id: gen("container"),
-              type: "container",
-              props: { tag: "div" },
-              styles: { base: { flex: "1 1 0%", minWidth: "0" } },
-              children: []
-            },
-            {
-              id: gen("container"),
-              type: "container",
-              props: { tag: "div" },
-              styles: { base: { flex: "1 1 0%", minWidth: "0" } },
-              children: []
-            }
-          ]
-        }
-      ]
-    })
-  },
-  {
-    id: "layout-4-col",
-    name: "4 Columns",
-    category: "layout",
-    categoryLabel: "Layout Blocks",
-    description: "Four equal columns for metric stats, logos, or compact feature cards",
-    icon: "grid",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("section"),
-      type: "section",
-      styles: { base: { padding: "40px 20px", width: "100%" } },
-      children: [
-        {
-          id: gen("columns"),
-          type: "columns",
-          props: { columns: 4, gap: "16px" },
-          styles: { base: { display: "flex", gap: "16px", width: "100%", maxWidth: "1200px", margin: "0 auto" } },
-          children: [
-            {
-              id: gen("container"),
-              type: "container",
-              props: { tag: "div" },
-              styles: { base: { flex: "1 1 0%", minWidth: "0" } },
-              children: []
-            },
-            {
-              id: gen("container"),
-              type: "container",
-              props: { tag: "div" },
-              styles: { base: { flex: "1 1 0%", minWidth: "0" } },
-              children: []
-            },
-            {
-              id: gen("container"),
-              type: "container",
-              props: { tag: "div" },
-              styles: { base: { flex: "1 1 0%", minWidth: "0" } },
-              children: []
-            },
-            {
-              id: gen("container"),
-              type: "container",
-              props: { tag: "div" },
-              styles: { base: { flex: "1 1 0%", minWidth: "0" } },
-              children: []
-            }
-          ]
-        }
-      ]
-    })
-  },
-  // --- Pre-composed UI Blocks (STORA-242) ---
-  {
-    id: "hero-section",
-    name: "Hero Section",
-    category: "sections",
-    categoryLabel: "Hero & Headers",
-    description: "Engaging hero banner with headline, lead paragraph, and call-to-action button",
-    icon: "layout",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("section"),
-      type: "section",
-      styles: {
-        base: {
-          padding: "80px 24px",
-          backgroundColor: "#f8fafc",
-          textAlign: "center",
-          width: "100%"
-        }
-      },
-      children: [
-        {
-          id: gen("container"),
-          type: "container",
-          props: { tag: "div" },
-          styles: { base: { maxWidth: "768px", margin: "0 auto" } },
-          children: [
-            {
-              id: gen("heading"),
-              type: "heading",
-              props: { text: "Build Remarkable Experiences", level: 1 },
-              styles: {
-                base: {
-                  fontSize: "44px",
-                  fontWeight: "800",
-                  color: "#0f172a",
-                  marginBottom: "16px",
-                  lineHeight: "1.2"
-                }
-              }
-            },
-            {
-              id: gen("paragraph"),
-              type: "paragraph",
-              props: {
-                content: "A visual builder designed for maximum craft, responsiveness, and performance."
-              },
-              styles: {
-                base: {
-                  fontSize: "18px",
-                  color: "#475569",
-                  marginBottom: "32px",
-                  lineHeight: "1.6"
-                }
-              }
-            },
-            {
-              id: gen("button"),
-              type: "button",
-              props: { label: "Get Started Today", href: "#explore" },
-              styles: {
-                base: {
-                  backgroundColor: "#2563eb",
-                  color: "#ffffff",
-                  padding: "12px 28px",
-                  borderRadius: "8px",
-                  fontWeight: "600",
-                  display: "inline-block"
-                },
-                states: {
-                  ":hover": { backgroundColor: "#1d4ed8" }
-                }
-              }
-            }
-          ]
-        }
-      ]
-    })
-  },
-  {
-    id: "feature-card",
-    name: "Feature Card",
-    category: "ui",
-    categoryLabel: "UI Blocks",
-    description: "Clean elevated feature card with badge, title, text, and action link",
-    icon: "box",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("container"),
-      type: "container",
-      props: { tag: "div" },
-      styles: {
-        base: {
-          padding: "24px",
-          backgroundColor: "#ffffff",
-          borderRadius: "12px",
-          border: "1px solid #e2e8f0",
-          boxShadow: "0 4px 6px -1px rgba(0, 0, 0, 0.05)"
-        }
-      },
-      children: [
-        {
-          id: gen("badge"),
-          type: "badge",
-          props: { label: "PRO FEATURE", variant: "primary" },
-          styles: { base: { marginBottom: "12px", display: "inline-block" } }
-        },
-        {
-          id: gen("heading"),
-          type: "heading",
-          props: { text: "Next-Gen Performance", level: 3 },
-          styles: {
-            base: { fontSize: "20px", fontWeight: "700", color: "#1e293b", marginBottom: "8px" }
-          }
-        },
-        {
-          id: gen("paragraph"),
-          type: "paragraph",
-          props: {
-            content: "Engineered for sub-millisecond render updates and zero runtime overhead."
-          },
-          styles: { base: { fontSize: "14px", color: "#64748b", lineHeight: "1.5" } }
-        }
-      ]
-    })
-  },
-  {
-    id: "media-object",
-    name: "Media Object",
-    category: "ui",
-    categoryLabel: "UI Blocks",
-    description: "Horizontal media layout with image beside text content",
-    icon: "image",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("container"),
-      type: "container",
-      props: { tag: "div" },
-      styles: {
-        base: {
-          display: "flex",
-          gap: "16px",
-          alignItems: "flex-start",
-          padding: "16px",
-          backgroundColor: "#ffffff",
-          borderRadius: "8px",
-          border: "1px solid #e2e8f0"
-        }
-      },
-      children: [
-        {
-          id: gen("image"),
-          type: "image",
-          props: {
-            src: "https://images.unsplash.com/photo-1579546929518-9e396f3cc809?w=160&auto=format&fit=crop&q=80",
-            alt: "Visual preview"
-          },
-          styles: {
-            base: {
-              width: "80px",
-              height: "80px",
-              borderRadius: "8px",
-              objectFit: "cover",
-              flexShrink: "0"
-            }
-          }
-        },
-        {
-          id: gen("container"),
-          type: "container",
-          props: { tag: "div" },
-          styles: { base: { flex: "1 1 0%" } },
-          children: [
-            {
-              id: gen("heading"),
-              type: "heading",
-              props: { text: "Creative Studio Asset", level: 4 },
-              styles: {
-                base: { fontSize: "16px", fontWeight: "600", color: "#0f172a", marginBottom: "4px" }
-              }
-            },
-            {
-              id: gen("paragraph"),
-              type: "paragraph",
-              props: { content: "High dynamic range gradients crafted for modern presentations." },
-              styles: { base: { fontSize: "13px", color: "#64748b", lineHeight: "1.4" } }
-            }
-          ]
-        }
-      ]
-    })
-  },
-  {
-    id: "pricing-table",
-    name: "Pricing Table",
-    category: "pricing",
-    categoryLabel: "Pricing",
-    description: "Highlighted subscription pricing plan with price, feature list, and buy button",
-    icon: "table",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("container"),
-      type: "container",
-      props: { tag: "div" },
-      styles: {
-        base: {
-          padding: "32px 24px",
-          backgroundColor: "#ffffff",
-          borderRadius: "16px",
-          border: "2px solid #3b82f6",
-          boxShadow: "0 10px 15px -3px rgba(59, 130, 246, 0.1)",
-          textAlign: "center",
-          maxWidth: "360px"
-        }
-      },
-      children: [
-        {
-          id: gen("badge"),
-          type: "badge",
-          props: { label: "MOST POPULAR", variant: "primary" },
-          styles: { base: { marginBottom: "12px", display: "inline-block" } }
-        },
-        {
-          id: gen("heading"),
-          type: "heading",
-          props: { text: "Professional", level: 3 },
-          styles: { base: { fontSize: "22px", fontWeight: "700", color: "#0f172a" } }
-        },
-        {
-          id: gen("heading"),
-          type: "heading",
-          props: { text: "$29 / mo", level: 2 },
-          styles: {
-            base: { fontSize: "36px", fontWeight: "800", color: "#2563eb", margin: "16px 0 24px 0" }
-          }
-        },
-        {
-          id: gen("paragraph"),
-          type: "paragraph",
-          props: { content: "Includes unlimited pages, custom domains, and team collaboration." },
-          styles: { base: { fontSize: "14px", color: "#64748b", marginBottom: "24px" } }
-        },
-        {
-          id: gen("button"),
-          type: "button",
-          props: { label: "Upgrade to Pro", href: "#checkout" },
-          styles: {
-            base: {
-              width: "100%",
-              backgroundColor: "#2563eb",
-              color: "#ffffff",
-              padding: "12px",
-              borderRadius: "8px",
-              fontWeight: "600",
-              display: "block"
-            },
-            states: {
-              ":hover": { backgroundColor: "#1d4ed8" }
-            }
-          }
-        }
-      ]
-    })
-  },
-  {
-    id: "cta-banner",
-    name: "CTA Banner",
-    category: "cta",
-    categoryLabel: "Call to Action",
-    description: "High-contrast conversion banner with title and action button",
-    icon: "layout",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("section"),
-      type: "section",
-      styles: {
-        base: {
-          padding: "60px 24px",
-          backgroundColor: "#0f172a",
-          color: "#ffffff",
-          borderRadius: "16px",
-          textAlign: "center",
-          width: "100%"
-        }
-      },
-      children: [
-        {
-          id: gen("heading"),
-          type: "heading",
-          props: { text: "Ready to boost your workflow?", level: 2 },
-          styles: {
-            base: { fontSize: "32px", fontWeight: "700", color: "#ffffff", marginBottom: "12px" }
-          }
-        },
-        {
-          id: gen("paragraph"),
-          type: "paragraph",
-          props: { content: "Start building with zero installation and instant live preview." },
-          styles: {
-            base: { fontSize: "16px", color: "#94a3b8", marginBottom: "24px", maxWidth: "600px", margin: "0 auto 24px auto" }
-          }
-        },
-        {
-          id: gen("button"),
-          type: "button",
-          props: { label: "Start Free Trial", href: "#signup" },
-          styles: {
-            base: {
-              backgroundColor: "#ffffff",
-              color: "#0f172a",
-              padding: "12px 28px",
-              borderRadius: "8px",
-              fontWeight: "700",
-              display: "inline-block"
-            },
-            states: {
-              ":hover": { backgroundColor: "#f1f5f9" }
-            }
-          }
-        }
-      ]
-    })
-  },
-  // --- Starter Form Templates (STORA-350) ---
-  {
-    id: "form-contact-us",
-    name: "Contact Us Form",
-    category: "forms",
-    categoryLabel: "Form Templates",
-    description: "Contact form with Name, Email, Subject, Message, and submit action pipeline with API request and toast notifications",
-    icon: "form",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("section"),
-      type: "section",
-      styles: {
-        base: {
-          padding: "64px 20px",
-          backgroundColor: "#f8fafc",
-          width: "100%"
-        }
-      },
-      children: [
-        {
-          id: gen("container"),
-          type: "container",
-          props: { tag: "div", maxWidth: "640px" },
-          styles: {
-            base: {
-              maxWidth: "640px",
-              margin: "0 auto",
-              width: "100%",
-              backgroundColor: "#ffffff",
-              padding: "36px",
-              borderRadius: "16px",
-              boxShadow: "0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05)",
-              border: "1px solid #e2e8f0"
-            }
-          },
-          children: [
-            {
-              id: gen("heading"),
-              type: "heading",
-              props: { text: "Contact Us", level: 2 },
-              styles: {
-                base: {
-                  fontSize: "28px",
-                  fontWeight: "700",
-                  color: "#0f172a",
-                  marginBottom: "8px",
-                  textAlign: "center"
-                }
-              }
-            },
-            {
-              id: gen("paragraph"),
-              type: "paragraph",
-              props: {
-                content: "Have questions or need assistance? Fill out the form below and we will get back to you shortly."
-              },
-              styles: {
-                base: {
-                  fontSize: "15px",
-                  color: "#64748b",
-                  marginBottom: "28px",
-                  textAlign: "center",
-                  lineHeight: "1.5"
-                }
-              }
-            },
-            {
-              id: gen("form"),
-              type: "form",
-              props: {
-                name: "contact_us_form",
-                method: "POST",
-                preventDefault: true,
-                scrollToFirstError: true,
-                resetOnSubmit: true
-              },
-              styles: {
-                base: {
-                  display: "flex",
-                  flexDirection: "column",
-                  gap: "20px",
-                  width: "100%"
-                }
-              },
-              actions: [
-                {
-                  id: gen("pipeline"),
-                  trigger: "submit",
-                  label: "Submit Contact Form",
-                  enabled: true,
-                  steps: [
-                    {
-                      id: gen("step"),
-                      type: "api_request",
-                      label: "Send Contact Message",
-                      payload: {
-                        url: "/api/mock/submit-lead",
-                        method: "POST",
-                        bodyFormat: "json"
-                      },
-                      onSuccess: [
-                        {
-                          id: gen("step"),
-                          type: "show_toast",
-                          label: "Show Success Toast",
-                          payload: {
-                            message: "Thank you! Your message has been sent successfully.",
-                            type: "success",
-                            title: "Message Sent",
-                            duration: 4e3
-                          }
-                        },
-                        {
-                          id: gen("step"),
-                          type: "reset_form",
-                          label: "Reset Form",
-                          payload: {}
-                        }
-                      ],
-                      onError: [
-                        {
-                          id: gen("step"),
-                          type: "show_toast",
-                          label: "Show Error Toast",
-                          payload: {
-                            message: "Failed to send message. Please check your connection and try again.",
-                            type: "error",
-                            title: "Submission Failed",
-                            duration: 5e3
-                          }
-                        }
-                      ]
-                    }
-                  ]
-                }
-              ],
-              children: [
-                {
-                  id: gen("input"),
-                  type: "input",
-                  props: {
-                    name: "name",
-                    label: "Your Name",
-                    type: "text",
-                    placeholder: "Jane Doe",
-                    required: true,
-                    rules: [
-                      { type: "required", message: "Please enter your name" },
-                      { type: "min_length", value: 2, message: "Name must be at least 2 characters" }
-                    ]
-                  },
-                  styles: {
-                    base: {
-                      width: "100%",
-                      padding: "10px 14px",
-                      borderRadius: "8px",
-                      border: "1px solid #cbd5e1",
-                      fontSize: "14px"
-                    }
-                  }
-                },
-                {
-                  id: gen("input"),
-                  type: "input",
-                  props: {
-                    name: "email",
-                    label: "Email Address",
-                    type: "email",
-                    placeholder: "jane@example.com",
-                    required: true,
-                    rules: [
-                      { type: "required", message: "Please enter your email" },
-                      { type: "email", message: "Please enter a valid email address" }
-                    ]
-                  },
-                  styles: {
-                    base: {
-                      width: "100%",
-                      padding: "10px 14px",
-                      borderRadius: "8px",
-                      border: "1px solid #cbd5e1",
-                      fontSize: "14px"
-                    }
-                  }
-                },
-                {
-                  id: gen("input"),
-                  type: "input",
-                  props: {
-                    name: "subject",
-                    label: "Subject",
-                    type: "text",
-                    placeholder: "How can we help you?",
-                    required: true,
-                    rules: [
-                      { type: "required", message: "Please enter a subject" }
-                    ]
-                  },
-                  styles: {
-                    base: {
-                      width: "100%",
-                      padding: "10px 14px",
-                      borderRadius: "8px",
-                      border: "1px solid #cbd5e1",
-                      fontSize: "14px"
-                    }
-                  }
-                },
-                {
-                  id: gen("textarea"),
-                  type: "textarea",
-                  props: {
-                    name: "message",
-                    label: "Message",
-                    placeholder: "Write your message here...",
-                    rows: 4,
-                    required: true,
-                    rules: [
-                      { type: "required", message: "Please enter your message" },
-                      { type: "min_length", value: 10, message: "Message must be at least 10 characters" }
-                    ]
-                  },
-                  styles: {
-                    base: {
-                      width: "100%",
-                      padding: "10px 14px",
-                      borderRadius: "8px",
-                      border: "1px solid #cbd5e1",
-                      fontSize: "14px"
-                    }
-                  }
-                },
-                {
-                  id: gen("button"),
-                  type: "button",
-                  props: {
-                    label: "Send Message",
-                    variant: "primary",
-                    buttonType: "submit"
-                  },
-                  styles: {
-                    base: {
-                      width: "100%",
-                      backgroundColor: "#2563eb",
-                      color: "#ffffff",
-                      padding: "12px",
-                      borderRadius: "8px",
-                      fontWeight: "600",
-                      fontSize: "15px",
-                      display: "inline-block",
-                      textAlign: "center"
-                    },
-                    states: {
-                      ":hover": { backgroundColor: "#1d4ed8" }
-                    }
-                  }
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    })
-  },
-  {
-    id: "form-newsletter",
-    name: "Newsletter Subscribe Form",
-    category: "forms",
-    categoryLabel: "Form Templates",
-    description: "Inline email newsletter subscription form with real-time feedback",
-    icon: "mail",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("section"),
-      type: "section",
-      styles: {
-        base: {
-          padding: "48px 20px",
-          backgroundColor: "#f1f5f9",
-          width: "100%"
-        }
-      },
-      children: [
-        {
-          id: gen("container"),
-          type: "container",
-          props: { tag: "div", maxWidth: "580px" },
-          styles: {
-            base: {
-              maxWidth: "580px",
-              margin: "0 auto",
-              width: "100%",
-              textAlign: "center"
-            }
-          },
-          children: [
-            {
-              id: gen("heading"),
-              type: "heading",
-              props: { text: "Stay in the Loop", level: 3 },
-              styles: {
-                base: {
-                  fontSize: "26px",
-                  fontWeight: "700",
-                  color: "#0f172a",
-                  marginBottom: "8px"
-                }
-              }
-            },
-            {
-              id: gen("paragraph"),
-              type: "paragraph",
-              props: {
-                content: "Subscribe to our newsletter for weekly curated insights, updates, and best practices."
-              },
-              styles: {
-                base: {
-                  fontSize: "15px",
-                  color: "#64748b",
-                  marginBottom: "24px",
-                  lineHeight: "1.5"
-                }
-              }
-            },
-            {
-              id: gen("form"),
-              type: "form",
-              props: {
-                name: "newsletter_form",
-                method: "POST",
-                preventDefault: true,
-                resetOnSubmit: true
-              },
-              styles: {
-                base: {
-                  display: "flex",
-                  flexDirection: "row",
-                  gap: "8px",
-                  alignItems: "center",
-                  width: "100%"
-                },
-                mobile: {
-                  flexDirection: "column"
-                }
-              },
-              actions: [
-                {
-                  id: gen("pipeline"),
-                  trigger: "submit",
-                  label: "Subscribe to Newsletter",
-                  enabled: true,
-                  steps: [
-                    {
-                      id: gen("step"),
-                      type: "api_request",
-                      label: "Submit Subscription",
-                      payload: {
-                        url: "/api/mock/submit-lead",
-                        method: "POST",
-                        bodyFormat: "json"
-                      },
-                      onSuccess: [
-                        {
-                          id: gen("step"),
-                          type: "show_toast",
-                          label: "Show Success Toast",
-                          payload: {
-                            message: "Thank you for subscribing to our newsletter!",
-                            type: "success",
-                            title: "Subscription Confirmed",
-                            duration: 4e3
-                          }
-                        },
-                        {
-                          id: gen("step"),
-                          type: "reset_form",
-                          label: "Reset Form",
-                          payload: {}
-                        }
-                      ],
-                      onError: [
-                        {
-                          id: gen("step"),
-                          type: "show_toast",
-                          label: "Show Error Toast",
-                          payload: {
-                            message: "Unable to subscribe right now. Please try again later.",
-                            type: "error",
-                            title: "Error",
-                            duration: 5e3
-                          }
-                        }
-                      ]
-                    }
-                  ]
-                }
-              ],
-              children: [
-                {
-                  id: gen("input"),
-                  type: "input",
-                  props: {
-                    name: "email",
-                    type: "email",
-                    placeholder: "Enter your email address...",
-                    required: true,
-                    rules: [
-                      { type: "required", message: "Email address is required" },
-                      { type: "email", message: "Please enter a valid email address" }
-                    ]
-                  },
-                  styles: {
-                    base: {
-                      flex: "1 1 0%",
-                      minWidth: "0",
-                      padding: "12px 16px",
-                      borderRadius: "8px",
-                      border: "1px solid #cbd5e1",
-                      backgroundColor: "#ffffff",
-                      fontSize: "14px"
-                    }
-                  }
-                },
-                {
-                  id: gen("button"),
-                  type: "button",
-                  props: {
-                    label: "Subscribe",
-                    variant: "primary",
-                    buttonType: "submit"
-                  },
-                  styles: {
-                    base: {
-                      backgroundColor: "#2563eb",
-                      color: "#ffffff",
-                      padding: "12px 24px",
-                      borderRadius: "8px",
-                      fontWeight: "600",
-                      fontSize: "14px",
-                      whiteSpace: "nowrap"
-                    },
-                    states: {
-                      ":hover": { backgroundColor: "#1d4ed8" }
-                    }
-                  }
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    })
-  },
-  {
-    id: "form-lead-gen",
-    name: "Lead Generation Form",
-    category: "forms",
-    categoryLabel: "Form Templates",
-    description: "Multi-field lead generation form with phone validation, interest dropdown, and API submission pipeline",
-    icon: "users",
-    createNodeTree: (gen = defaultGenId) => ({
-      id: gen("section"),
-      type: "section",
-      styles: {
-        base: {
-          padding: "64px 20px",
-          backgroundColor: "#ffffff",
-          width: "100%"
-        }
-      },
-      children: [
-        {
-          id: gen("container"),
-          type: "container",
-          props: { tag: "div", maxWidth: "640px" },
-          styles: {
-            base: {
-              maxWidth: "640px",
-              margin: "0 auto",
-              width: "100%",
-              backgroundColor: "#ffffff",
-              padding: "36px",
-              borderRadius: "16px",
-              border: "1px solid #e2e8f0",
-              boxShadow: "0 10px 25px -5px rgba(0, 0, 0, 0.05)"
-            }
-          },
-          children: [
-            {
-              id: gen("badge"),
-              type: "badge",
-              props: { label: "FREE CONSULTATION", variant: "primary" },
-              styles: { base: { marginBottom: "12px", display: "inline-block" } }
-            },
-            {
-              id: gen("heading"),
-              type: "heading",
-              props: { text: "Schedule a Consultation", level: 2 },
-              styles: {
-                base: {
-                  fontSize: "28px",
-                  fontWeight: "700",
-                  color: "#0f172a",
-                  marginBottom: "8px"
-                }
-              }
-            },
-            {
-              id: gen("paragraph"),
-              type: "paragraph",
-              props: {
-                content: "Share your project details with our solutions team. We will analyze your needs and provide a personalized roadmap."
-              },
-              styles: {
-                base: {
-                  fontSize: "15px",
-                  color: "#64748b",
-                  marginBottom: "28px",
-                  lineHeight: "1.5"
-                }
-              }
-            },
-            {
-              id: gen("form"),
-              type: "form",
-              props: {
-                name: "lead_generation_form",
-                method: "POST",
-                preventDefault: true,
-                scrollToFirstError: true,
-                resetOnSubmit: true
-              },
-              styles: {
-                base: {
-                  display: "flex",
-                  flexDirection: "column",
-                  gap: "18px",
-                  width: "100%"
-                }
-              },
-              actions: [
-                {
-                  id: gen("pipeline"),
-                  trigger: "submit",
-                  label: "Submit Lead Form",
-                  enabled: true,
-                  steps: [
-                    {
-                      id: gen("step"),
-                      type: "api_request",
-                      label: "Send Lead Data",
-                      payload: {
-                        url: "/api/mock/submit-lead",
-                        method: "POST",
-                        bodyFormat: "json"
-                      },
-                      onSuccess: [
-                        {
-                          id: gen("step"),
-                          type: "show_toast",
-                          label: "Show Success Toast",
-                          payload: {
-                            message: "Thank you! Your request has been received. Our team will contact you shortly.",
-                            type: "success",
-                            title: "Request Submitted",
-                            duration: 4e3
-                          }
-                        },
-                        {
-                          id: gen("step"),
-                          type: "reset_form",
-                          label: "Reset Form",
-                          payload: {}
-                        }
-                      ],
-                      onError: [
-                        {
-                          id: gen("step"),
-                          type: "show_toast",
-                          label: "Show Error Toast",
-                          payload: {
-                            message: "Submission failed. Please verify your information and try again.",
-                            type: "error",
-                            title: "Submission Error",
-                            duration: 5e3
-                          }
-                        }
-                      ]
-                    }
-                  ]
-                }
-              ],
-              children: [
-                {
-                  id: gen("input"),
-                  type: "input",
-                  props: {
-                    name: "full_name",
-                    label: "Full Name",
-                    type: "text",
-                    placeholder: "Alex Morgan",
-                    required: true,
-                    rules: [
-                      { type: "required", message: "Full name is required" },
-                      { type: "min_length", value: 2, message: "Name must be at least 2 characters" }
-                    ]
-                  },
-                  styles: {
-                    base: {
-                      width: "100%",
-                      padding: "10px 14px",
-                      borderRadius: "8px",
-                      border: "1px solid #cbd5e1",
-                      fontSize: "14px"
-                    }
-                  }
-                },
-                {
-                  id: gen("input"),
-                  type: "input",
-                  props: {
-                    name: "email",
-                    label: "Business Email",
-                    type: "email",
-                    placeholder: "alex@company.com",
-                    required: true,
-                    rules: [
-                      { type: "required", message: "Business email is required" },
-                      { type: "email", message: "Please enter a valid email address" }
-                    ]
-                  },
-                  styles: {
-                    base: {
-                      width: "100%",
-                      padding: "10px 14px",
-                      borderRadius: "8px",
-                      border: "1px solid #cbd5e1",
-                      fontSize: "14px"
-                    }
-                  }
-                },
-                {
-                  id: gen("input"),
-                  type: "input",
-                  props: {
-                    name: "phone",
-                    label: "Phone Number",
-                    type: "tel",
-                    placeholder: "+62 812-3456-7890",
-                    required: true,
-                    rules: [
-                      { type: "required", message: "Phone number is required" },
-                      {
-                        type: "custom_regex",
-                        value: "^[+]?[0-9\\s-()]{8,20}$",
-                        message: "Please enter a valid phone number (min 8 digits)"
-                      }
-                    ]
-                  },
-                  styles: {
-                    base: {
-                      width: "100%",
-                      padding: "10px 14px",
-                      borderRadius: "8px",
-                      border: "1px solid #cbd5e1",
-                      fontSize: "14px"
-                    }
-                  }
-                },
-                {
-                  id: gen("select"),
-                  type: "select",
-                  props: {
-                    name: "interest",
-                    label: "Area of Interest",
-                    placeholder: "Select your interest / service...",
-                    required: true,
-                    defaultValue: "",
-                    options: [
-                      { label: "Web Platform Development", value: "web_platform" },
-                      { label: "Mobile Application", value: "mobile_app" },
-                      { label: "Cloud Architecture & DevOps", value: "cloud_devops" },
-                      { label: "UI/UX Product Design", value: "product_design" },
-                      { label: "General Inquiry", value: "general" }
-                    ],
-                    rules: [
-                      { type: "required", message: "Please select an area of interest" }
-                    ]
-                  },
-                  styles: {
-                    base: {
-                      width: "100%",
-                      padding: "10px 14px",
-                      borderRadius: "8px",
-                      border: "1px solid #cbd5e1",
-                      fontSize: "14px",
-                      backgroundColor: "#ffffff"
-                    }
-                  }
-                },
-                {
-                  id: gen("input"),
-                  type: "input",
-                  props: {
-                    name: "company",
-                    label: "Company Name (Optional)",
-                    type: "text",
-                    placeholder: "Company / Organization"
-                  },
-                  styles: {
-                    base: {
-                      width: "100%",
-                      padding: "10px 14px",
-                      borderRadius: "8px",
-                      border: "1px solid #cbd5e1",
-                      fontSize: "14px"
-                    }
-                  }
-                },
-                {
-                  id: gen("button"),
-                  type: "button",
-                  props: {
-                    label: "Request Consultation",
-                    variant: "primary",
-                    buttonType: "submit"
-                  },
-                  styles: {
-                    base: {
-                      width: "100%",
-                      backgroundColor: "#2563eb",
-                      color: "#ffffff",
-                      padding: "12px 24px",
-                      borderRadius: "8px",
-                      fontWeight: "600",
-                      fontSize: "15px",
-                      marginTop: "4px"
-                    },
-                    states: {
-                      ":hover": { backgroundColor: "#1d4ed8" }
-                    }
-                  }
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    })
-  }
-];
 export {
+  CONTENT_CHILD_TYPES,
   ComponentRegistry,
+  FORM_STARTER_BLOCKS,
+  LAYOUT_PARENTS,
+  LAYOUT_STARTER_BLOCKS,
   STARTER_BLOCKS,
   TRAIT_GROUP_LABELS,
   TRAIT_GROUP_ORDER,
+  UI_STARTER_BLOCKS,
   acceptTrait,
   actionTrait,
   altTrait,
@@ -4400,6 +181,7 @@ export {
   citeTrait,
   codeBlockDefinition,
   colSpanTrait,
+  collapsibleDefinition,
   collectTraitNames,
   collectionDefinition,
   columnsDefinition,
@@ -4408,13 +190,17 @@ export {
   coreComponentDefinitions,
   createDefaultComponentRegistry,
   defaultCheckedTrait,
+  defaultGenId,
   defaultSelectedTrait,
   defaultValueTrait,
   disabledTrait,
+  drawerDefinition,
   extractComponentRequirements,
   fieldNameTrait,
   fileUploadDefinition,
+  flexDefinition,
   formDefinition,
+  gridDefinition,
   headingDefinition,
   helperTextTrait,
   hrefTrait,
@@ -4438,6 +224,7 @@ export {
   maxLengthTrait,
   methodTrait,
   minLengthTrait,
+  modalDefinition,
   multipleTrait,
   mutedTrait,
   optionsListTrait,
@@ -4479,6 +266,7 @@ export {
   textareaDefinition,
   titleTrait,
   valueTrait,
-  videoDefinition
+  videoDefinition,
+  withOverrides
 };
 //# sourceMappingURL=index.js.map