webstudio 0.209.0 → 0.212.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/lib/cli.js +1034 -531
  2. package/package.json +22 -22
  3. package/templates/cloudflare/package.json +2 -2
  4. package/templates/defaults/package.json +12 -12
  5. package/templates/react-router/package.json +11 -11
  6. package/templates/react-router-docker/package.json +3 -3
  7. package/templates/react-router-netlify/package.json +1 -1
  8. package/templates/react-router-vercel/package.json +1 -1
  9. package/templates/ssg/package.json +7 -7
package/lib/cli.js CHANGED
@@ -30,7 +30,7 @@ import reservedIdentifiers from "reserved-identifiers";
30
30
  import { kebabCase, camelCase } from "change-case";
31
31
  import "nanoid";
32
32
  import { parseFragment, defaultTreeAdapter } from "parse5";
33
- import { x as x$2 } from "tinyexec";
33
+ import { x as x$4 } from "tinyexec";
34
34
  import makeCLI from "yargs";
35
35
  const GLOBAL_CONFIG_FOLDER = envPaths("webstudio").config;
36
36
  const GLOBAL_CONFIG_FILE_NAME = "webstudio-config.json";
@@ -1637,6 +1637,7 @@ var generateAtomic = (sheet, options) => {
1637
1637
  };
1638
1638
  var AccordionIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M13.056 8H14.5V4.101a1.3 1.3 0 0 0-1.3-1.299H2.8a1.3 1.3 0 0 0-1.3 1.3V8H13.056ZM13.056 13.198h.145a1.3 1.3 0 0 0 1.299-1.3V8h-13v3.899a1.3 1.3 0 0 0 1.3 1.299h10.256Z"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="m10.026 4.913.975.976.976-.976M10.026 10.111l.975.976.976-.976"/></svg>`;
1639
1639
  var AddTemplateInstanceIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M4.5 2H3.333A1.333 1.333 0 0 0 2 3.333V4.5M14 12.667c0 .021 0 .042-.002.063M11.5 14h1.167a1.333 1.333 0 0 0 1.331-1.27m0 0V11.5M2 11.5v1.167A1.333 1.333 0 0 0 3.333 14H4.5M7 14h2M2 7v2M8.461 4.77H14M11.23 2v5.538"/></svg>`;
1640
+ var AnimationGroupIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M4.5 8.3C6.3 7.7 7.8 8 9.3 11c.3-1.8 1.2-4.5 2.1-6M4.208 1.5H2.944A1.444 1.444 0 0 0 1.5 2.944v1.264m13 0V2.944A1.444 1.444 0 0 0 13.056 1.5h-1.264M14.5 13.056c0 .023 0 .046-.002.069M11.792 14.5h1.264a1.444 1.444 0 0 0 1.442-1.375m0 0v-1.333m-12.998 0v1.264A1.444 1.444 0 0 0 2.944 14.5h1.264m2.709-13h2.166m-2.166 13h2.166M1.5 6.917v2.166m13-2.166v2.166"/></svg>`;
1640
1641
  var BlockquoteIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" d="M6.667 8H3.333a.667.667 0 0 1-.666-.667V5a.667.667 0 0 1 .666-.667H6A.667.667 0 0 1 6.667 5v3Zm0 0C6.667 9.667 6 10.667 4 11.667M13.333 8H10a.667.667 0 0 1-.667-.667V5A.667.667 0 0 1 10 4.333h2.667a.667.667 0 0 1 .666.667v3Zm0 0c0 1.667-.666 2.667-2.666 3.667"/></svg>`;
1641
1642
  var BodyIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M12.667 2H3.333C2.597 2 2 2.597 2 3.333v9.334C2 13.403 2.597 14 3.333 14h9.334c.736 0 1.333-.597 1.333-1.333V3.333C14 2.597 13.403 2 12.667 2ZM2 6h12"/></svg>`;
1642
1643
  var BoldIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M4 8h6a2.667 2.667 0 0 1 0 5.333H4.667A.667.667 0 0 1 4 12.667V3.333a.667.667 0 0 1 .667-.666h4.666a2.667 2.667 0 1 1 0 5.333"/></svg>`;
@@ -1656,6 +1657,7 @@ var FormTextFieldIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" vie
1656
1657
  var FormIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M13.184 5.5h.731a.75.75 0 0 0 .75-.75v-1.5a.75.75 0 0 0-.75-.75H2.085a.75.75 0 0 0-.75.75v1.5c0 .414.336.75.75.75h11.099ZM13.184 10.5h.732a.75.75 0 0 0 .75-.75v-1.5a.75.75 0 0 0-.75-.75H2.084a.75.75 0 0 0-.75.75v1.5c0 .414.336.75.75.75h11.099Z"/><path fill="currentColor" d="M6.613 14.5h.222a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-5.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5H6.613Z"/></svg>`;
1657
1658
  var HeaderIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M12.667 2H3.333C2.597 2 2 2.597 2 3.333v9.334C2 13.403 2.597 14 3.333 14h9.334c.736 0 1.333-.597 1.333-1.333V3.333C14 2.597 13.403 2 12.667 2ZM4 4h8"/></svg>`;
1658
1659
  var HeadingIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M4 8h8M4 13.333V2.667M12 13.333V2.667"/></svg>`;
1660
+ var HtmlElementIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M13.556 2H3.444C2.647 2 2 2.647 2 3.444v10.112C2 14.353 2.647 15 3.444 15h10.112c.797 0 1.444-.647 1.444-1.444V3.444C15 2.647 14.353 2 13.556 2Z"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M10.5 10 12 8.5 10.5 7M6 7 4.5 8.5 6 10m3.188-4.5-1.876 6"/></svg>`;
1659
1661
  var ImageIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M12.667 2H3.333C2.597 2 2 2.597 2 3.333v9.334C2 13.403 2.597 14 3.333 14h9.334c.736 0 1.333-.597 1.333-1.333V3.333C14 2.597 13.403 2 12.667 2Z"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M6 7.333a1.333 1.333 0 1 0 0-2.666 1.333 1.333 0 0 0 0 2.666ZM14 10l-2.057-2.057a1.333 1.333 0 0 0-1.886 0L4 14"/></svg>`;
1660
1662
  var ItemIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M2 6h.007M5.333 10H14M5.333 6H14"/></svg>`;
1661
1663
  var LabelIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M12.667 2H3.333C2.597 2 2 2.597 2 3.333v9.334C2 13.403 2.597 14 3.333 14h9.334c.736 0 1.333-.597 1.333-1.333V3.333C14 2.597 13.403 2 12.667 2Z"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M6.476 11.074V4.926m0 6.148h3.77v-.615m-3.77.615h-.722m.722-6.148h.632m-.632 0h-.722"/></svg>`;
@@ -1675,21 +1677,25 @@ var ResourceIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox=
1675
1677
  var SelectIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M13.184 10.33h.149c.736 0 1.332-.597 1.332-1.332V6.332c0-.735-.596-1.332-1.332-1.332H2.667c-.735 0-1.332.597-1.332 1.332v2.666c0 .735.597 1.332 1.333 1.332h10.516Z"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="m10.078 7.165 1 1 1-1"/></svg>`;
1676
1678
  var SettingsIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M13.987 6H9.32M13.932 6h-12M14 10.5H2"/><rect width="4" height="4" x="1.932" y="8.534" fill="#fff" stroke="currentColor" rx="2"/><rect width="4" height="4" x="10.068" y="4" fill="#fff" stroke="currentColor" rx="2"/></svg>`;
1677
1679
  var SlotComponentIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M4.5 2H3.333A1.333 1.333 0 0 0 2 3.333V4.5M14 4.5V3.333A1.333 1.333 0 0 0 12.667 2H11.5M14 12.667c0 .021 0 .042-.002.063M11.5 14h1.167a1.333 1.333 0 0 0 1.331-1.27m0 0V11.5M2 11.5v1.167A1.333 1.333 0 0 0 3.333 14H4.5M7 2h2M7 14h2M2 7v2M14 7v2"/></svg>`;
1680
+ var StaggerAnimationIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M14.222 5H8.778A.778.778 0 0 0 8 5.778v5.444c0 .43.348.778.778.778h5.444c.43 0 .778-.348.778-.778V5.778A.778.778 0 0 0 14.222 5ZM5.444 6H1.556A.556.556 0 0 0 1 6.556v3.888c0 .307.249.556.556.556h3.888A.556.556 0 0 0 6 10.444V6.556A.556.556 0 0 0 5.444 6Z"/></svg>`;
1678
1681
  var SubscriptIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M2.667 3.333 8 8.667M8 3.333 2.667 8.667M13.333 12.667h-2.666c0-1 .293-1.334 1-1.667.706-.333 1.666-.78 1.666-1.667 0-.313-.113-.62-.32-.86a1.407 1.407 0 0 0-1.746-.293c-.28.16-.494.413-.6.713"/></svg>`;
1679
1682
  var SuperscriptIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M2.667 12.667 8 7.333M8 12.667 2.667 7.333M13.333 8h-2.666c0-1 .294-1.333 1-1.667.705-.333 1.666-.777 1.666-1.665 0-.315-.113-.62-.322-.86a1.403 1.403 0 0 0-1.745-.29c-.28.159-.492.409-.6.706"/></svg>`;
1680
1683
  var SwitchIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M10.667 4H5.333a4 4 0 1 0 0 8h5.334a4 4 0 0 0 0-8Z"/><path fill="currentColor" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M5.333 9.333a1.333 1.333 0 1 0 0-2.666 1.333 1.333 0 0 0 0 2.666Z"/></svg>`;
1681
1684
  var TabsIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M9.75 5H13M9.75 5H7.401A1.684 1.684 0 0 1 6 4.25v0l-.5-.75-.5-.75L4.5 2m5.25 3-1-1.5-.5-.75-.5-.75M4.5 2H3v0a1.5 1.5 0 0 0-1.5 1.5v9A1.5 1.5 0 0 0 3 14h10v0a1.5 1.5 0 0 0 1.5-1.5v0-6A1.5 1.5 0 0 0 13 5v0M4.5 2h3.25m0 0h2.375v0c.547 0 1.057.273 1.36.728l.015.022.5.75L13 5"/></svg>`;
1682
1685
  var TextAlignLeftIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M10 8H2M11.333 12H2M14 4H2"/></svg>`;
1686
+ var TextAnimationIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M7.476 4.3 7.817 3l6.935 1.817-.34 1.3m-6.245 4.386 2.601.682m.517-7.276-1.817 6.935M2 9.938V9h5v.938M3.562 14h1.875M4.5 9v5"/></svg>`;
1683
1687
  var TextItalicIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M12.667 2.667h-6M9.333 13.333h-6M10 2.667 6 13.333"/></svg>`;
1684
1688
  var TextIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M2.667 4.667v-2h10.666v2M6 13.333h4M8 2.667v10.666"/></svg>`;
1685
1689
  var TooltipIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" d="M14 10a1.333 1.333 0 0 1-1.333 1.333h-8L2 14V3.333A1.333 1.333 0 0 1 3.333 2h9.334A1.333 1.333 0 0 1 14 3.333V10Z"/></svg>`;
1686
1690
  var TriggerIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M11.915 7.354v-.647a1.294 1.294 0 1 0-2.587 0"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M9.328 6.707V6.06a1.294 1.294 0 1 0-2.587 0v.647"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M6.74 6.383V2.826a1.293 1.293 0 1 0-2.586 0v6.467"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M11.914 7.353a1.293 1.293 0 0 1 2.587 0v1.94a5.174 5.174 0 0 1-5.174 5.174H8.034c-1.81 0-2.91-.556-3.874-1.513l-2.328-2.328a1.293 1.293 0 0 1 1.83-1.824L4.8 9.94"/></svg>`;
1691
+ var VideoIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path fill="currentColor" fill-rule="evenodd" d="M1.833 5.333c0-.46.373-.833.834-.833h6.666c.46 0 .834.373.834.833v5.334c0 .46-.374.833-.834.833H2.667a.833.833 0 0 1-.834-.833V5.333ZM2.667 3.5C1.654 3.5.833 4.32.833 5.333v5.334c0 1.012.821 1.833 1.834 1.833h6.666c1.013 0 1.834-.82 1.834-1.833V9.6l2.704 1.803a.833.833 0 0 0 1.296-.693V5.247a.833.833 0 0 0-1.254-.72l-2.746 1.602v-.796c0-1.012-.821-1.833-1.834-1.833H2.667Zm8.5 3.787V8.4l3 2V5.537l-3 1.75Z" clip-rule="evenodd"/></svg>`;
1687
1692
  var ViewportIcon = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" width="100%" height="100%" style="display: block;"><path fill-rule="evenodd" d="M5.173 1.35h.157a.65.65 0 0 1 0 1.3H5.2c-.57 0-.96 0-1.26.025-.294.024-.446.068-.553.122a1.35 1.35 0 0 0-.59.59c-.054.107-.098.259-.122.552-.025.301-.025.69-.025 1.261v.13a.65.65 0 0 1-1.3 0v-.157c0-.537 0-.98.03-1.34.03-.373.095-.715.259-1.036a2.65 2.65 0 0 1 1.158-1.158c.32-.164.663-.229 1.036-.26.36-.029.803-.029 1.34-.029Zm6.888 1.325c-.301-.024-.69-.025-1.261-.025h-.13a.65.65 0 1 1 0-1.3h.157c.537 0 .98 0 1.34.03.373.03.715.095 1.036.259.499.254.904.66 1.158 1.158.164.32.229.663.26 1.036.029.36.029.803.029 1.34v.157a.65.65 0 1 1-1.3 0V5.2c0-.57 0-.96-.025-1.26-.024-.294-.068-.446-.122-.553a1.35 1.35 0 0 0-.59-.59c-.107-.054-.26-.098-.552-.122ZM2 10.02a.65.65 0 0 1 .65.65v.13c0 .57 0 .96.025 1.26.024.294.068.446.122.553.13.254.336.46.59.59.107.054.259.098.552.122.301.025.69.025 1.261.025h.13a.65.65 0 1 1 0 1.3h-.157c-.537 0-.98 0-1.34-.03-.373-.03-.715-.095-1.036-.259a2.65 2.65 0 0 1-1.158-1.158c-.164-.32-.23-.663-.26-1.037-.029-.36-.029-.802-.029-1.34v-.156a.65.65 0 0 1 .65-.65Zm12 0a.65.65 0 0 1 .65.65v.157c0 .537 0 .98-.03 1.34-.03.373-.095.715-.259 1.036a2.65 2.65 0 0 1-1.158 1.158c-.32.164-.663.23-1.037.26-.36.029-.802.029-1.34.029h-.156a.65.65 0 1 1 0-1.3h.13c.57 0 .96 0 1.26-.025.294-.024.446-.068.553-.122.254-.13.46-.336.59-.59.054-.107.098-.259.122-.552.025-.301.025-.69.025-1.261v-.13a.65.65 0 0 1 .65-.65ZM8 10.033a2.033 2.033 0 1 0 0-4.066 2.033 2.033 0 0 0 0 4.066Zm0 1.3a3.333 3.333 0 1 0 0-6.666 3.333 3.333 0 0 0 0 6.666Z" clip-rule="evenodd"/></svg>`;
1688
1693
  var VimeoIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M14.993 4.801c-.062 1.363-1.014 3.228-2.855 5.597-1.903 2.473-3.514 3.71-4.83 3.71-.817 0-1.508-.753-2.072-2.26l-1.13-4.143c-.419-1.506-.868-2.259-1.349-2.26a4.332 4.332 0 0 0-1.099.66L1 5.257c.69-.607 1.372-1.214 2.043-1.822.921-.796 1.613-1.215 2.074-1.257 1.09-.105 1.76.64 2.012 2.234.272 1.72.461 2.79.566 3.208.315 1.427.66 2.14 1.038 2.14.292 0 .733-.463 1.32-1.39.586-.925.9-1.63.942-2.113.084-.798-.23-1.198-.942-1.199-.357.005-.71.084-1.036.23.688-2.253 2.002-3.349 3.942-3.285 1.439.042 2.117.975 2.034 2.798Z"/></svg>`;
1689
1694
  var WebhookFormIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M12 11.32H8.007c-.734 0-1.3.627-1.654 1.267a2.666 2.666 0 0 1-5.02-1.254A2.62 2.62 0 0 1 1.713 10"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M4 11.333 6.087 7.48c.353-.647.066-1.453-.334-2.067a2.667 2.667 0 1 1 4.594-2.706"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="m8 4 2.087 3.82c.353.647 1.18.847 1.913.847A2.667 2.667 0 0 1 12 14"/></svg>`;
1690
1695
  var WindowInfoIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M12.667 2H3.333C2.597 2 2 2.597 2 3.333v9.334C2 13.403 2.597 14 3.333 14h9.334c.736 0 1.333-.597 1.333-1.333V3.333C14 2.597 13.403 2 12.667 2ZM8 11.516V7.853"/><rect width="1.4" height="1.4" x="7.3" y="4.484" fill="currentColor" rx=".7"/></svg>`;
1691
1696
  var WindowTitleIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M12.667 4H3.333C2.597 4 2 4.497 2 5.111v7.778C2 13.503 2.597 14 3.333 14h9.334c.736 0 1.333-.498 1.333-1.111V5.11C14 4.497 13.403 4 12.667 4ZM4 2h8"/></svg>`;
1692
1697
  var XmlIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M12.163 9.02v-4L8.83 1.686h-5.5A1.333 1.333 0 0 0 1.997 3.02v6"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" d="M8.164 2.186v1.667a1.333 1.333 0 0 0 1.333 1.333h2.667M1.997 11.314l3 3M4.997 11.314l-3 3M6.997 14.314v-3l1.5 1.523 1.5-1.523v3M12.163 11.314v3h1.84"/></svg>`;
1698
+ var Youtube1cIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path fill-rule="evenodd" d="M13.47 3.299a1.771 1.771 0 0 1 1.238 1.263C15 5.675 15 8 15 8s0 2.325-.293 3.438a1.771 1.771 0 0 1-1.238 1.263C12.38 13 8 13 8 13s-4.378 0-5.47-.299a1.771 1.771 0 0 1-1.237-1.263C1 10.325 1 8 1 8s0-2.325.293-3.438A1.771 1.771 0 0 1 2.53 3.299C3.622 3 8 3 8 3s4.378 0 5.47.299Zm-3.232 4.7L6.6 10.144V5.857L10.238 8Z" clip-rule="evenodd"/></svg>`;
1693
1699
  var YoutubeIcon = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" viewBox="0 0 16 16" width="100%" height="100%" style="display: block;"><path d="M.892 11.528a18.047 18.047 0 0 1 0-7.482A1.496 1.496 0 0 1 1.94 3a37.082 37.082 0 0 1 12.12 0 1.497 1.497 0 0 1 1.048 1.047 18.046 18.046 0 0 1 0 7.482 1.497 1.497 0 0 1-1.048 1.048 37.077 37.077 0 0 1-12.12 0 1.497 1.497 0 0 1-1.048-1.048Z"/><path d="m6.5 10.3 4-2.4-4-2.4v4.8Z"/></svg>`;
1694
1700
  var AssetId = z.string();
1695
1701
  var baseAsset = {
@@ -1775,10 +1781,7 @@ var HomePage = z.object({
1775
1781
  ...commonPageFields,
1776
1782
  path: HomePagePath
1777
1783
  });
1778
- var PagePath = z.string().refine((path) => path !== "", "Can't be empty").refine((path) => path !== "/", "Can't be just a /").refine(
1779
- (path) => path === "" || path.startsWith("/"),
1780
- "Must start with a / or a full URL e.g. https://website.org"
1781
- ).refine((path) => path.endsWith("/") === false, "Can't end with a /").refine((path) => path.includes("//") === false, "Can't contain repeating /").refine(
1784
+ var DefaultPagePage = z.string().refine((path) => path !== "", "Can't be empty").refine((path) => path !== "/", "Can't be just a /").refine((path) => path.endsWith("/") === false, "Can't end with a /").refine((path) => path.includes("//") === false, "Can't contain repeating /").refine(
1782
1785
  (path) => /^[-_a-z0-9*:?\\/.]*$/.test(path),
1783
1786
  "Only a-z, 0-9, -, _, /, :, ?, . and * are allowed"
1784
1787
  ).refine(
@@ -1791,6 +1794,14 @@ var PagePath = z.string().refine((path) => path !== "", "Can't be empty").refine
1791
1794
  (path) => path !== "/build" && path.startsWith("/build/") === false,
1792
1795
  "/build prefix is reserved for the system"
1793
1796
  );
1797
+ var PagePath = DefaultPagePage.refine(
1798
+ (path) => path === "" || path.startsWith("/"),
1799
+ "Must start with a / or a full URL e.g. https://website.org"
1800
+ );
1801
+ DefaultPagePage.refine(
1802
+ (path) => path === "" || path.startsWith("/"),
1803
+ "Must start with a / and it must be full path e.g. /project/id"
1804
+ );
1794
1805
  var Page = z.object({
1795
1806
  ...commonPageFields,
1796
1807
  path: PagePath
@@ -1851,6 +1862,7 @@ var Instance = z.object({
1851
1862
  type: z.literal("instance"),
1852
1863
  id: InstanceId,
1853
1864
  component: z.string(),
1865
+ tag: z.string().optional(),
1854
1866
  label: z.string().optional(),
1855
1867
  children: z.array(InstanceChild)
1856
1868
  });
@@ -2021,6 +2033,23 @@ var rangeUnitValueSchema = z.union([
2021
2033
  z.object({
2022
2034
  type: z.literal("unparsed"),
2023
2035
  value: z.string()
2036
+ }),
2037
+ z.object({
2038
+ type: z.literal("var"),
2039
+ value: z.string()
2040
+ })
2041
+ ]);
2042
+ var TIME_UNITS = ["ms", "s"];
2043
+ var timeUnitSchema = literalUnion(TIME_UNITS);
2044
+ var durationUnitValueSchema = z.union([
2045
+ z.object({
2046
+ type: z.literal("unit"),
2047
+ value: z.number(),
2048
+ unit: timeUnitSchema
2049
+ }),
2050
+ z.object({
2051
+ type: z.literal("var"),
2052
+ value: z.string()
2024
2053
  })
2025
2054
  ]);
2026
2055
  var insetUnitValueSchema = z.union([
@@ -2042,8 +2071,9 @@ var keyframeEffectOptionsSchema = z.object({
2042
2071
  z.literal("forwards"),
2043
2072
  z.literal("backwards"),
2044
2073
  z.literal("both")
2045
- ]).optional()
2074
+ ]).optional(),
2046
2075
  // FillMode
2076
+ duration: durationUnitValueSchema.optional()
2047
2077
  });
2048
2078
  var scrollNamedRangeSchema = z.union([
2049
2079
  z.literal("start"),
@@ -2292,6 +2322,13 @@ var common = {
2292
2322
  description: z.string().optional(),
2293
2323
  required: z.boolean()
2294
2324
  };
2325
+ var Tag = z.object({
2326
+ ...common,
2327
+ control: z.literal("tag"),
2328
+ type: z.literal("string"),
2329
+ defaultValue: z.undefined().optional(),
2330
+ options: z.array(z.string())
2331
+ });
2295
2332
  var Number = z.object({
2296
2333
  ...common,
2297
2334
  control: z.literal("number"),
@@ -2435,6 +2472,7 @@ var AnimationAction = z.object({
2435
2472
  defaultValue: z.undefined().optional()
2436
2473
  });
2437
2474
  var PropMeta = z.union([
2475
+ Tag,
2438
2476
  Number,
2439
2477
  Range,
2440
2478
  Text,
@@ -2557,6 +2595,7 @@ var componentCategories = [
2557
2595
  "general",
2558
2596
  "typography",
2559
2597
  "media",
2598
+ "animations",
2560
2599
  "data",
2561
2600
  "forms",
2562
2601
  "localization",
@@ -2629,6 +2668,12 @@ var rootMeta = {
2629
2668
  html
2630
2669
  }
2631
2670
  };
2671
+ var elementComponent = "ws:element";
2672
+ var elementMeta = {
2673
+ type: "container",
2674
+ label: "Element",
2675
+ icon: HtmlElementIcon
2676
+ };
2632
2677
  var collectionComponent = "ws:collection";
2633
2678
  var collectionMeta = {
2634
2679
  type: "container",
@@ -2674,12 +2719,13 @@ var blockMeta = {
2674
2719
  };
2675
2720
  var coreMetas = {
2676
2721
  [rootComponent]: rootMeta,
2722
+ [elementComponent]: elementMeta,
2677
2723
  [collectionComponent]: collectionMeta,
2678
2724
  [descendantComponent]: descendantMeta,
2679
2725
  [blockComponent]: blockMeta,
2680
2726
  [blockTemplateComponent]: blockTemplateMeta
2681
2727
  };
2682
- var isCoreComponent = (component) => component === rootComponent || component === collectionComponent || component === descendantComponent || component === blockComponent || component === blockTemplateComponent;
2728
+ var isCoreComponent = (component) => component === rootComponent || component === elementComponent || component === collectionComponent || component === descendantComponent || component === blockComponent || component === blockTemplateComponent;
2683
2729
  var ROOT_INSTANCE_ID = ":root";
2684
2730
  var traverseInstances = (instances, instanceId, callback) => {
2685
2731
  const instance = instances.get(instanceId);
@@ -3424,6 +3470,8 @@ ${userSheet.cssText}`,
3424
3470
  classes
3425
3471
  };
3426
3472
  };
3473
+ var tagProperty = "data-ws-tag";
3474
+ var indexProperty = "data-ws-index";
3427
3475
  var getRemixSegment = (segment) => {
3428
3476
  var _a2, _b2;
3429
3477
  if (segment === "*") {
@@ -3571,7 +3619,6 @@ var normalizeProps = ({
3571
3619
  return newProps;
3572
3620
  };
3573
3621
  var showAttribute = "data-ws-show";
3574
- var indexAttribute = "data-ws-index";
3575
3622
  var attributeNameStartChar = "A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD";
3576
3623
  var attributeNameChar = attributeNameStartChar + ":\\-0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040";
3577
3624
  var validAttributeNameRegex = new RegExp(
@@ -3594,42 +3641,501 @@ var isAttributeNameSafe = (attributeName) => {
3594
3641
  illegalAttributeNameCache.set(attributeName, true);
3595
3642
  return false;
3596
3643
  };
3597
- var namespaceMatcher = (namespace, matcher) => {
3598
- var _a2, _b2, _c2, _d2;
3599
- const newMatcher = structuredClone(matcher);
3600
- if ((_a2 = newMatcher.component) == null ? void 0 : _a2.$eq) {
3601
- newMatcher.component.$eq = `${namespace}:${newMatcher.component.$eq}`;
3602
- }
3603
- if ((_b2 = newMatcher.component) == null ? void 0 : _b2.$neq) {
3604
- newMatcher.component.$neq = `${namespace}:${newMatcher.component.$neq}`;
3605
- }
3606
- if ((_c2 = newMatcher.component) == null ? void 0 : _c2.$in) {
3607
- newMatcher.component.$in = newMatcher.component.$in.map(
3608
- (component) => `${namespace}:${component}`
3609
- );
3610
- }
3611
- if ((_d2 = newMatcher.component) == null ? void 0 : _d2.$nin) {
3612
- newMatcher.component.$nin = newMatcher.component.$nin.map(
3613
- (component) => `${namespace}:${component}`
3614
- );
3615
- }
3616
- return newMatcher;
3617
- };
3618
- var namespaceMeta = (meta, namespace, components) => {
3619
- const newMeta = { ...meta };
3620
- if (newMeta.constraints) {
3621
- if (Array.isArray(newMeta.constraints)) {
3622
- newMeta.constraints = newMeta.constraints.map(
3623
- (matcher) => namespaceMatcher(namespace, matcher)
3624
- );
3625
- } else {
3626
- newMeta.constraints = namespaceMatcher(namespace, newMeta.constraints);
3627
- }
3628
- }
3629
- if (newMeta.indexWithinAncestor) {
3630
- newMeta.indexWithinAncestor = components.has(newMeta.indexWithinAncestor) ? `${namespace}:${newMeta.indexWithinAncestor}` : newMeta.indexWithinAncestor;
3631
- }
3632
- return newMeta;
3644
+ var standardAttributesToReactProps = {
3645
+ // HTML
3646
+ accept: "accept",
3647
+ acceptcharset: "acceptCharset",
3648
+ "accept-charset": "acceptCharset",
3649
+ accesskey: "accessKey",
3650
+ action: "action",
3651
+ allowfullscreen: "allowFullScreen",
3652
+ alt: "alt",
3653
+ as: "as",
3654
+ async: "async",
3655
+ autocapitalize: "autoCapitalize",
3656
+ autocomplete: "autoComplete",
3657
+ autocorrect: "autoCorrect",
3658
+ autofocus: "autoFocus",
3659
+ autoplay: "autoPlay",
3660
+ autosave: "autoSave",
3661
+ capture: "capture",
3662
+ cellpadding: "cellPadding",
3663
+ cellspacing: "cellSpacing",
3664
+ challenge: "challenge",
3665
+ charset: "charSet",
3666
+ checked: "checked",
3667
+ children: "children",
3668
+ cite: "cite",
3669
+ class: "className",
3670
+ classid: "classID",
3671
+ classname: "className",
3672
+ cols: "cols",
3673
+ colspan: "colSpan",
3674
+ content: "content",
3675
+ contenteditable: "contentEditable",
3676
+ contextmenu: "contextMenu",
3677
+ controls: "controls",
3678
+ controlslist: "controlsList",
3679
+ coords: "coords",
3680
+ crossorigin: "crossOrigin",
3681
+ dangerouslysetinnerhtml: "dangerouslySetInnerHTML",
3682
+ data: "data",
3683
+ datetime: "dateTime",
3684
+ default: "default",
3685
+ defaultchecked: "defaultChecked",
3686
+ defaultvalue: "defaultValue",
3687
+ defer: "defer",
3688
+ dir: "dir",
3689
+ disabled: "disabled",
3690
+ disablepictureinpicture: "disablePictureInPicture",
3691
+ disableremoteplayback: "disableRemotePlayback",
3692
+ download: "download",
3693
+ draggable: "draggable",
3694
+ enctype: "encType",
3695
+ enterkeyhint: "enterKeyHint",
3696
+ fetchpriority: "fetchPriority",
3697
+ for: "htmlFor",
3698
+ form: "form",
3699
+ formmethod: "formMethod",
3700
+ formaction: "formAction",
3701
+ formenctype: "formEncType",
3702
+ formnovalidate: "formNoValidate",
3703
+ formtarget: "formTarget",
3704
+ frameborder: "frameBorder",
3705
+ headers: "headers",
3706
+ height: "height",
3707
+ hidden: "hidden",
3708
+ high: "high",
3709
+ href: "href",
3710
+ hreflang: "hrefLang",
3711
+ htmlfor: "htmlFor",
3712
+ httpequiv: "httpEquiv",
3713
+ "http-equiv": "httpEquiv",
3714
+ icon: "icon",
3715
+ id: "id",
3716
+ imagesizes: "imageSizes",
3717
+ imagesrcset: "imageSrcSet",
3718
+ inert: "inert",
3719
+ innerhtml: "innerHTML",
3720
+ inputmode: "inputMode",
3721
+ integrity: "integrity",
3722
+ is: "is",
3723
+ itemid: "itemID",
3724
+ itemprop: "itemProp",
3725
+ itemref: "itemRef",
3726
+ itemscope: "itemScope",
3727
+ itemtype: "itemType",
3728
+ keyparams: "keyParams",
3729
+ keytype: "keyType",
3730
+ kind: "kind",
3731
+ label: "label",
3732
+ lang: "lang",
3733
+ list: "list",
3734
+ loop: "loop",
3735
+ low: "low",
3736
+ manifest: "manifest",
3737
+ marginwidth: "marginWidth",
3738
+ marginheight: "marginHeight",
3739
+ max: "max",
3740
+ maxlength: "maxLength",
3741
+ media: "media",
3742
+ mediagroup: "mediaGroup",
3743
+ method: "method",
3744
+ min: "min",
3745
+ minlength: "minLength",
3746
+ multiple: "multiple",
3747
+ muted: "muted",
3748
+ name: "name",
3749
+ nomodule: "noModule",
3750
+ nonce: "nonce",
3751
+ novalidate: "noValidate",
3752
+ open: "open",
3753
+ optimum: "optimum",
3754
+ pattern: "pattern",
3755
+ placeholder: "placeholder",
3756
+ playsinline: "playsInline",
3757
+ poster: "poster",
3758
+ preload: "preload",
3759
+ profile: "profile",
3760
+ radiogroup: "radioGroup",
3761
+ readonly: "readOnly",
3762
+ referrerpolicy: "referrerPolicy",
3763
+ rel: "rel",
3764
+ required: "required",
3765
+ reversed: "reversed",
3766
+ role: "role",
3767
+ rows: "rows",
3768
+ rowspan: "rowSpan",
3769
+ sandbox: "sandbox",
3770
+ scope: "scope",
3771
+ scoped: "scoped",
3772
+ scrolling: "scrolling",
3773
+ seamless: "seamless",
3774
+ selected: "selected",
3775
+ shape: "shape",
3776
+ size: "size",
3777
+ sizes: "sizes",
3778
+ span: "span",
3779
+ spellcheck: "spellCheck",
3780
+ src: "src",
3781
+ srcdoc: "srcDoc",
3782
+ srclang: "srcLang",
3783
+ srcset: "srcSet",
3784
+ start: "start",
3785
+ step: "step",
3786
+ style: "style",
3787
+ summary: "summary",
3788
+ tabindex: "tabIndex",
3789
+ target: "target",
3790
+ title: "title",
3791
+ type: "type",
3792
+ usemap: "useMap",
3793
+ value: "value",
3794
+ width: "width",
3795
+ wmode: "wmode",
3796
+ wrap: "wrap",
3797
+ // SVG
3798
+ about: "about",
3799
+ accentheight: "accentHeight",
3800
+ "accent-height": "accentHeight",
3801
+ accumulate: "accumulate",
3802
+ additive: "additive",
3803
+ alignmentbaseline: "alignmentBaseline",
3804
+ "alignment-baseline": "alignmentBaseline",
3805
+ allowreorder: "allowReorder",
3806
+ alphabetic: "alphabetic",
3807
+ amplitude: "amplitude",
3808
+ arabicform: "arabicForm",
3809
+ "arabic-form": "arabicForm",
3810
+ ascent: "ascent",
3811
+ attributename: "attributeName",
3812
+ attributetype: "attributeType",
3813
+ autoreverse: "autoReverse",
3814
+ azimuth: "azimuth",
3815
+ basefrequency: "baseFrequency",
3816
+ baselineshift: "baselineShift",
3817
+ "baseline-shift": "baselineShift",
3818
+ baseprofile: "baseProfile",
3819
+ bbox: "bbox",
3820
+ begin: "begin",
3821
+ bias: "bias",
3822
+ by: "by",
3823
+ calcmode: "calcMode",
3824
+ capheight: "capHeight",
3825
+ "cap-height": "capHeight",
3826
+ clip: "clip",
3827
+ clippath: "clipPath",
3828
+ "clip-path": "clipPath",
3829
+ clippathunits: "clipPathUnits",
3830
+ cliprule: "clipRule",
3831
+ "clip-rule": "clipRule",
3832
+ color: "color",
3833
+ colorinterpolation: "colorInterpolation",
3834
+ "color-interpolation": "colorInterpolation",
3835
+ colorinterpolationfilters: "colorInterpolationFilters",
3836
+ "color-interpolation-filters": "colorInterpolationFilters",
3837
+ colorprofile: "colorProfile",
3838
+ "color-profile": "colorProfile",
3839
+ colorrendering: "colorRendering",
3840
+ "color-rendering": "colorRendering",
3841
+ contentscripttype: "contentScriptType",
3842
+ contentstyletype: "contentStyleType",
3843
+ cursor: "cursor",
3844
+ cx: "cx",
3845
+ cy: "cy",
3846
+ d: "d",
3847
+ datatype: "datatype",
3848
+ decelerate: "decelerate",
3849
+ descent: "descent",
3850
+ diffuseconstant: "diffuseConstant",
3851
+ direction: "direction",
3852
+ display: "display",
3853
+ divisor: "divisor",
3854
+ dominantbaseline: "dominantBaseline",
3855
+ "dominant-baseline": "dominantBaseline",
3856
+ dur: "dur",
3857
+ dx: "dx",
3858
+ dy: "dy",
3859
+ edgemode: "edgeMode",
3860
+ elevation: "elevation",
3861
+ enablebackground: "enableBackground",
3862
+ "enable-background": "enableBackground",
3863
+ end: "end",
3864
+ exponent: "exponent",
3865
+ externalresourcesrequired: "externalResourcesRequired",
3866
+ fill: "fill",
3867
+ fillopacity: "fillOpacity",
3868
+ "fill-opacity": "fillOpacity",
3869
+ fillrule: "fillRule",
3870
+ "fill-rule": "fillRule",
3871
+ filter: "filter",
3872
+ filterres: "filterRes",
3873
+ filterunits: "filterUnits",
3874
+ floodopacity: "floodOpacity",
3875
+ "flood-opacity": "floodOpacity",
3876
+ floodcolor: "floodColor",
3877
+ "flood-color": "floodColor",
3878
+ focusable: "focusable",
3879
+ fontfamily: "fontFamily",
3880
+ "font-family": "fontFamily",
3881
+ fontsize: "fontSize",
3882
+ "font-size": "fontSize",
3883
+ fontsizeadjust: "fontSizeAdjust",
3884
+ "font-size-adjust": "fontSizeAdjust",
3885
+ fontstretch: "fontStretch",
3886
+ "font-stretch": "fontStretch",
3887
+ fontstyle: "fontStyle",
3888
+ "font-style": "fontStyle",
3889
+ fontvariant: "fontVariant",
3890
+ "font-variant": "fontVariant",
3891
+ fontweight: "fontWeight",
3892
+ "font-weight": "fontWeight",
3893
+ format: "format",
3894
+ from: "from",
3895
+ fx: "fx",
3896
+ fy: "fy",
3897
+ g1: "g1",
3898
+ g2: "g2",
3899
+ glyphname: "glyphName",
3900
+ "glyph-name": "glyphName",
3901
+ glyphorientationhorizontal: "glyphOrientationHorizontal",
3902
+ "glyph-orientation-horizontal": "glyphOrientationHorizontal",
3903
+ glyphorientationvertical: "glyphOrientationVertical",
3904
+ "glyph-orientation-vertical": "glyphOrientationVertical",
3905
+ glyphref: "glyphRef",
3906
+ gradienttransform: "gradientTransform",
3907
+ gradientunits: "gradientUnits",
3908
+ hanging: "hanging",
3909
+ horizadvx: "horizAdvX",
3910
+ "horiz-adv-x": "horizAdvX",
3911
+ horizoriginx: "horizOriginX",
3912
+ "horiz-origin-x": "horizOriginX",
3913
+ ideographic: "ideographic",
3914
+ imagerendering: "imageRendering",
3915
+ "image-rendering": "imageRendering",
3916
+ in2: "in2",
3917
+ in: "in",
3918
+ inlist: "inlist",
3919
+ intercept: "intercept",
3920
+ k1: "k1",
3921
+ k2: "k2",
3922
+ k3: "k3",
3923
+ k4: "k4",
3924
+ k: "k",
3925
+ kernelmatrix: "kernelMatrix",
3926
+ kernelunitlength: "kernelUnitLength",
3927
+ kerning: "kerning",
3928
+ keypoints: "keyPoints",
3929
+ keysplines: "keySplines",
3930
+ keytimes: "keyTimes",
3931
+ lengthadjust: "lengthAdjust",
3932
+ letterspacing: "letterSpacing",
3933
+ "letter-spacing": "letterSpacing",
3934
+ lightingcolor: "lightingColor",
3935
+ "lighting-color": "lightingColor",
3936
+ limitingconeangle: "limitingConeAngle",
3937
+ local: "local",
3938
+ markerend: "markerEnd",
3939
+ "marker-end": "markerEnd",
3940
+ markerheight: "markerHeight",
3941
+ markermid: "markerMid",
3942
+ "marker-mid": "markerMid",
3943
+ markerstart: "markerStart",
3944
+ "marker-start": "markerStart",
3945
+ markerunits: "markerUnits",
3946
+ markerwidth: "markerWidth",
3947
+ mask: "mask",
3948
+ maskcontentunits: "maskContentUnits",
3949
+ maskunits: "maskUnits",
3950
+ mathematical: "mathematical",
3951
+ mode: "mode",
3952
+ numoctaves: "numOctaves",
3953
+ offset: "offset",
3954
+ opacity: "opacity",
3955
+ operator: "operator",
3956
+ order: "order",
3957
+ orient: "orient",
3958
+ orientation: "orientation",
3959
+ origin: "origin",
3960
+ overflow: "overflow",
3961
+ overlineposition: "overlinePosition",
3962
+ "overline-position": "overlinePosition",
3963
+ overlinethickness: "overlineThickness",
3964
+ "overline-thickness": "overlineThickness",
3965
+ paintorder: "paintOrder",
3966
+ "paint-order": "paintOrder",
3967
+ panose1: "panose1",
3968
+ "panose-1": "panose1",
3969
+ pathlength: "pathLength",
3970
+ patterncontentunits: "patternContentUnits",
3971
+ patterntransform: "patternTransform",
3972
+ patternunits: "patternUnits",
3973
+ pointerevents: "pointerEvents",
3974
+ "pointer-events": "pointerEvents",
3975
+ points: "points",
3976
+ pointsatx: "pointsAtX",
3977
+ pointsaty: "pointsAtY",
3978
+ pointsatz: "pointsAtZ",
3979
+ popover: "popover",
3980
+ popovertarget: "popoverTarget",
3981
+ popovertargetaction: "popoverTargetAction",
3982
+ prefix: "prefix",
3983
+ preservealpha: "preserveAlpha",
3984
+ preserveaspectratio: "preserveAspectRatio",
3985
+ primitiveunits: "primitiveUnits",
3986
+ property: "property",
3987
+ r: "r",
3988
+ radius: "radius",
3989
+ refx: "refX",
3990
+ refy: "refY",
3991
+ renderingintent: "renderingIntent",
3992
+ "rendering-intent": "renderingIntent",
3993
+ repeatcount: "repeatCount",
3994
+ repeatdur: "repeatDur",
3995
+ requiredextensions: "requiredExtensions",
3996
+ requiredfeatures: "requiredFeatures",
3997
+ resource: "resource",
3998
+ restart: "restart",
3999
+ result: "result",
4000
+ results: "results",
4001
+ rotate: "rotate",
4002
+ rx: "rx",
4003
+ ry: "ry",
4004
+ scale: "scale",
4005
+ security: "security",
4006
+ seed: "seed",
4007
+ shaperendering: "shapeRendering",
4008
+ "shape-rendering": "shapeRendering",
4009
+ slope: "slope",
4010
+ spacing: "spacing",
4011
+ specularconstant: "specularConstant",
4012
+ specularexponent: "specularExponent",
4013
+ speed: "speed",
4014
+ spreadmethod: "spreadMethod",
4015
+ startoffset: "startOffset",
4016
+ stddeviation: "stdDeviation",
4017
+ stemh: "stemh",
4018
+ stemv: "stemv",
4019
+ stitchtiles: "stitchTiles",
4020
+ stopcolor: "stopColor",
4021
+ "stop-color": "stopColor",
4022
+ stopopacity: "stopOpacity",
4023
+ "stop-opacity": "stopOpacity",
4024
+ strikethroughposition: "strikethroughPosition",
4025
+ "strikethrough-position": "strikethroughPosition",
4026
+ strikethroughthickness: "strikethroughThickness",
4027
+ "strikethrough-thickness": "strikethroughThickness",
4028
+ string: "string",
4029
+ stroke: "stroke",
4030
+ strokedasharray: "strokeDasharray",
4031
+ "stroke-dasharray": "strokeDasharray",
4032
+ strokedashoffset: "strokeDashoffset",
4033
+ "stroke-dashoffset": "strokeDashoffset",
4034
+ strokelinecap: "strokeLinecap",
4035
+ "stroke-linecap": "strokeLinecap",
4036
+ strokelinejoin: "strokeLinejoin",
4037
+ "stroke-linejoin": "strokeLinejoin",
4038
+ strokemiterlimit: "strokeMiterlimit",
4039
+ "stroke-miterlimit": "strokeMiterlimit",
4040
+ strokewidth: "strokeWidth",
4041
+ "stroke-width": "strokeWidth",
4042
+ strokeopacity: "strokeOpacity",
4043
+ "stroke-opacity": "strokeOpacity",
4044
+ suppresscontenteditablewarning: "suppressContentEditableWarning",
4045
+ suppresshydrationwarning: "suppressHydrationWarning",
4046
+ surfacescale: "surfaceScale",
4047
+ systemlanguage: "systemLanguage",
4048
+ tablevalues: "tableValues",
4049
+ targetx: "targetX",
4050
+ targety: "targetY",
4051
+ textanchor: "textAnchor",
4052
+ "text-anchor": "textAnchor",
4053
+ textdecoration: "textDecoration",
4054
+ "text-decoration": "textDecoration",
4055
+ textlength: "textLength",
4056
+ textrendering: "textRendering",
4057
+ "text-rendering": "textRendering",
4058
+ to: "to",
4059
+ transform: "transform",
4060
+ transformorigin: "transformOrigin",
4061
+ "transform-origin": "transformOrigin",
4062
+ typeof: "typeof",
4063
+ u1: "u1",
4064
+ u2: "u2",
4065
+ underlineposition: "underlinePosition",
4066
+ "underline-position": "underlinePosition",
4067
+ underlinethickness: "underlineThickness",
4068
+ "underline-thickness": "underlineThickness",
4069
+ unicode: "unicode",
4070
+ unicodebidi: "unicodeBidi",
4071
+ "unicode-bidi": "unicodeBidi",
4072
+ unicoderange: "unicodeRange",
4073
+ "unicode-range": "unicodeRange",
4074
+ unitsperem: "unitsPerEm",
4075
+ "units-per-em": "unitsPerEm",
4076
+ unselectable: "unselectable",
4077
+ valphabetic: "vAlphabetic",
4078
+ "v-alphabetic": "vAlphabetic",
4079
+ values: "values",
4080
+ vectoreffect: "vectorEffect",
4081
+ "vector-effect": "vectorEffect",
4082
+ version: "version",
4083
+ vertadvy: "vertAdvY",
4084
+ "vert-adv-y": "vertAdvY",
4085
+ vertoriginx: "vertOriginX",
4086
+ "vert-origin-x": "vertOriginX",
4087
+ vertoriginy: "vertOriginY",
4088
+ "vert-origin-y": "vertOriginY",
4089
+ vhanging: "vHanging",
4090
+ "v-hanging": "vHanging",
4091
+ videographic: "vIdeographic",
4092
+ "v-ideographic": "vIdeographic",
4093
+ viewbox: "viewBox",
4094
+ viewtarget: "viewTarget",
4095
+ visibility: "visibility",
4096
+ vmathematical: "vMathematical",
4097
+ "v-mathematical": "vMathematical",
4098
+ vocab: "vocab",
4099
+ widths: "widths",
4100
+ wordspacing: "wordSpacing",
4101
+ "word-spacing": "wordSpacing",
4102
+ writingmode: "writingMode",
4103
+ "writing-mode": "writingMode",
4104
+ x1: "x1",
4105
+ x2: "x2",
4106
+ x: "x",
4107
+ xchannelselector: "xChannelSelector",
4108
+ xheight: "xHeight",
4109
+ "x-height": "xHeight",
4110
+ xlinkactuate: "xlinkActuate",
4111
+ "xlink:actuate": "xlinkActuate",
4112
+ xlinkarcrole: "xlinkArcrole",
4113
+ "xlink:arcrole": "xlinkArcrole",
4114
+ xlinkhref: "xlinkHref",
4115
+ "xlink:href": "xlinkHref",
4116
+ xlinkrole: "xlinkRole",
4117
+ "xlink:role": "xlinkRole",
4118
+ xlinkshow: "xlinkShow",
4119
+ "xlink:show": "xlinkShow",
4120
+ xlinktitle: "xlinkTitle",
4121
+ "xlink:title": "xlinkTitle",
4122
+ xlinktype: "xlinkType",
4123
+ "xlink:type": "xlinkType",
4124
+ xmlbase: "xmlBase",
4125
+ "xml:base": "xmlBase",
4126
+ xmllang: "xmlLang",
4127
+ "xml:lang": "xmlLang",
4128
+ xmlns: "xmlns",
4129
+ "xml:space": "xmlSpace",
4130
+ xmlnsxlink: "xmlnsXlink",
4131
+ "xmlns:xlink": "xmlnsXlink",
4132
+ xmlspace: "xmlSpace",
4133
+ y1: "y1",
4134
+ y2: "y2",
4135
+ y: "y",
4136
+ ychannelselector: "yChannelSelector",
4137
+ z: "z",
4138
+ zoomandpan: "zoomAndPan"
3633
4139
  };
3634
4140
  var generateAction = ({
3635
4141
  scope,
@@ -3737,7 +4243,11 @@ var generateJsxElement = ({
3737
4243
  const index = indexesWithinAncestors.get(instance.id);
3738
4244
  if (index !== void 0) {
3739
4245
  generatedProps += `
3740
- ${indexAttribute}="${index}"`;
4246
+ ${indexProperty}="${index}"`;
4247
+ }
4248
+ if (instance.tag !== void 0 && instance.component !== elementComponent) {
4249
+ generatedProps += `
4250
+ ${tagProperty}=${JSON.stringify(instance.tag)}`;
3741
4251
  }
3742
4252
  let conditionValue;
3743
4253
  let collectionDataValue;
@@ -3756,6 +4266,10 @@ ${indexAttribute}="${index}"`;
3756
4266
  if (isAttributeNameSafe(prop.name) === false) {
3757
4267
  continue;
3758
4268
  }
4269
+ let name2 = prop.name;
4270
+ if (instance.component === elementComponent) {
4271
+ name2 = standardAttributesToReactProps[prop.name] ?? prop.name;
4272
+ }
3759
4273
  if (prop.name === showAttribute) {
3760
4274
  if (propValue === "true") {
3761
4275
  continue;
@@ -3775,13 +4289,13 @@ ${indexAttribute}="${index}"`;
3775
4289
  }
3776
4290
  continue;
3777
4291
  }
3778
- if (prop.name === "className" && propValue !== void 0) {
4292
+ if (name2 === "className" && propValue !== void 0) {
3779
4293
  classNameValue = propValue;
3780
4294
  continue;
3781
4295
  }
3782
4296
  if (propValue !== void 0) {
3783
4297
  generatedProps += `
3784
- ${prop.name}={${propValue}}`;
4298
+ ${name2}={${propValue}}`;
3785
4299
  }
3786
4300
  }
3787
4301
  const classMapArray = classesMap == null ? void 0 : classesMap.get(instance.id);
@@ -3815,6 +4329,18 @@ ${prop.name}={${propValue}}`;
3815
4329
  `;
3816
4330
  } else if (instance.component === blockComponent) {
3817
4331
  generatedElement += children;
4332
+ } else if (instance.component === elementComponent) {
4333
+ const tagName = instance.tag ?? "div";
4334
+ if (instance.children.length === 0) {
4335
+ generatedElement += `<${tagName}${generatedProps} />
4336
+ `;
4337
+ } else {
4338
+ generatedElement += `<${tagName}${generatedProps}>
4339
+ `;
4340
+ generatedElement += children;
4341
+ generatedElement += `</${tagName}>
4342
+ `;
4343
+ }
3818
4344
  } else {
3819
4345
  const [_namespace, shortName] = parseComponentName(instance.component);
3820
4346
  const componentVariable = scope.getName(instance.component, shortName);
@@ -4128,7 +4654,7 @@ const e$5 = {
4128
4654
  icon: SlotComponentIcon,
4129
4655
  order: 5
4130
4656
  };
4131
- const o$5 = {
4657
+ const o$4 = {
4132
4658
  type: "container",
4133
4659
  icon: ""
4134
4660
  };
@@ -4142,7 +4668,7 @@ const e$4 = {
4142
4668
  type: "boolean"
4143
4669
  }
4144
4670
  };
4145
- const i$7 = {
4671
+ const i$4 = {
4146
4672
  div: [
4147
4673
  {
4148
4674
  property: "display",
@@ -4153,13 +4679,13 @@ const i$7 = {
4153
4679
  value: { type: "keyword", value: "collapse" }
4154
4680
  }
4155
4681
  ]
4156
- }, a$c = {
4682
+ }, a$d = {
4157
4683
  category: "general",
4158
4684
  type: "embed",
4159
4685
  label: "HTML Embed",
4160
4686
  description: "Used to add HTML code to the page, such as an SVG or script.",
4161
4687
  icon: EmbedIcon,
4162
- presetStyle: i$7,
4688
+ presetStyle: i$4,
4163
4689
  order: 2
4164
4690
  };
4165
4691
  ({
@@ -4237,13 +4763,13 @@ var h3 = div;
4237
4763
  var h4 = div;
4238
4764
  var h5 = div;
4239
4765
  var h6 = div;
4240
- var i$6 = div;
4766
+ var i$3 = div;
4241
4767
  var img = div;
4242
- var a$b = div;
4768
+ var a$c = div;
4243
4769
  var li = div;
4244
4770
  var ul = div;
4245
4771
  var ol = div;
4246
- var p$d = div;
4772
+ var p$a = div;
4247
4773
  var span = div;
4248
4774
  var body = [
4249
4775
  { property: "margin-top", value: { type: "unit", unit: "number", value: 0 } },
@@ -4298,7 +4824,7 @@ var hr = [
4298
4824
  value: { type: "unit", unit: "px", value: 1 }
4299
4825
  }
4300
4826
  ];
4301
- var b$5 = [
4827
+ var b$8 = [
4302
4828
  {
4303
4829
  property: "font-weight",
4304
4830
  value: { type: "unit", unit: "number", value: 700 }
@@ -4554,7 +5080,7 @@ var button = [
4554
5080
  { property: "text-transform", value: { type: "keyword", value: "none" } }
4555
5081
  ];
4556
5082
  var select = button;
4557
- const a$a = {
5083
+ const a$b = {
4558
5084
  body: [
4559
5085
  ...body,
4560
5086
  {
@@ -4566,94 +5092,82 @@ const a$a = {
4566
5092
  value: { type: "keyword", value: "grayscale" }
4567
5093
  }
4568
5094
  ]
4569
- }, n$5 = {
5095
+ }, n$7 = {
4570
5096
  type: "container",
4571
5097
  icon: BodyIcon,
4572
5098
  states: defaultStates,
4573
- presetStyle: a$a
4574
- };
4575
- const g = {
4576
- div,
4577
- address,
4578
- article,
4579
- aside,
4580
- figure,
4581
- footer,
4582
- header,
4583
- main: main$1,
4584
- nav,
4585
- section
4586
- }, v$3 = {
5099
+ presetStyle: a$b
5100
+ };
5101
+ const v$2 = {
4587
5102
  category: "general",
4588
5103
  type: "container",
4589
5104
  description: "A container for content. By default this is a Div, but the tag can be changed in settings.",
4590
5105
  icon: BoxIcon,
4591
5106
  states: defaultStates,
4592
- presetStyle: g,
5107
+ presetStyle: {
5108
+ div,
5109
+ address,
5110
+ article,
5111
+ aside,
5112
+ figure,
5113
+ footer,
5114
+ header,
5115
+ main: main$1,
5116
+ nav,
5117
+ section
5118
+ },
4593
5119
  order: 0
4594
5120
  };
4595
- const r$a = {
4596
- div: [
4597
- ...div,
4598
- {
4599
- property: "min-height",
4600
- value: { type: "unit", unit: "em", value: 1 }
4601
- }
4602
- ]
4603
- }, n$4 = {
5121
+ const s$4 = {
4604
5122
  type: "container",
4605
5123
  icon: TextIcon,
4606
5124
  states: defaultStates,
4607
- presetStyle: r$a
4608
- };
4609
- const c$7 = {
4610
- h1,
4611
- h2,
4612
- h3,
4613
- h4,
4614
- h5,
4615
- h6
4616
- }, f$3 = {
5125
+ presetStyle: {
5126
+ div: [
5127
+ ...div,
5128
+ {
5129
+ property: "min-height",
5130
+ value: { type: "unit", unit: "em", value: 1 }
5131
+ }
5132
+ ]
5133
+ }
5134
+ };
5135
+ const d$6 = {
4617
5136
  type: "container",
4618
5137
  placeholder: "Heading",
4619
5138
  icon: HeadingIcon,
4620
- constraints: {
4621
- relation: "ancestor",
4622
- component: { $neq: "Heading" }
4623
- },
4624
5139
  states: defaultStates,
4625
- presetStyle: c$7
5140
+ presetStyle: {
5141
+ h1,
5142
+ h2,
5143
+ h3,
5144
+ h4,
5145
+ h5,
5146
+ h6
5147
+ }
4626
5148
  };
4627
- const a$9 = {
4628
- p: p$d
4629
- }, c$6 = {
5149
+ const p$9 = {
5150
+ p: p$a
5151
+ }, n$6 = {
4630
5152
  type: "container",
4631
5153
  placeholder: "Paragraph",
4632
5154
  icon: TextAlignLeftIcon,
4633
- constraints: {
4634
- relation: "ancestor",
4635
- component: { $neq: "Paragraph" }
4636
- },
4637
5155
  states: defaultStates,
4638
- presetStyle: a$9
5156
+ presetStyle: p$9
4639
5157
  };
4640
- const a$8 = {
5158
+ const a$a = {
4641
5159
  a: [
4642
- ...a$b,
5160
+ ...a$c,
4643
5161
  {
4644
5162
  property: "display",
4645
5163
  value: { type: "keyword", value: "inline-block" }
4646
5164
  }
4647
5165
  ]
4648
- }, l$6 = {
5166
+ }, n$5 = {
4649
5167
  type: "container",
4650
5168
  placeholder: "Link",
4651
5169
  icon: LinkIcon,
4652
- constraints: {
4653
- relation: "ancestor",
4654
- component: { $nin: ["Button", "Link"] }
4655
- },
4656
- presetStyle: a$8,
5170
+ presetStyle: a$a,
4657
5171
  states: [
4658
5172
  ...defaultStates,
4659
5173
  {
@@ -4667,46 +5181,46 @@ const a$8 = {
4667
5181
  }
4668
5182
  ]
4669
5183
  };
4670
- const a$7 = {
4671
- ...l$6,
5184
+ const a$9 = {
5185
+ ...n$5,
4672
5186
  type: "rich-text-child"
4673
5187
  };
4674
5188
  const s$3 = {
4675
5189
  span
4676
- }, c$5 = {
5190
+ }, c$7 = {
4677
5191
  type: "rich-text-child",
4678
5192
  label: "Text",
4679
5193
  icon: PaintBrushIcon,
4680
5194
  states: defaultStates,
4681
5195
  presetStyle: s$3
4682
5196
  };
4683
- const p$c = {
4684
- b: b$5
4685
- }, l$5 = {
5197
+ const p$8 = {
5198
+ b: b$8
5199
+ }, l$6 = {
4686
5200
  type: "rich-text-child",
4687
5201
  label: "Bold Text",
4688
5202
  icon: BoldIcon,
4689
5203
  states: defaultStates,
4690
- presetStyle: p$c
5204
+ presetStyle: p$8
4691
5205
  };
4692
- const r$9 = {
5206
+ const r$d = {
4693
5207
  i: [
4694
- ...i$6,
5208
+ ...i$3,
4695
5209
  {
4696
5210
  property: "font-style",
4697
5211
  value: { type: "keyword", value: "italic" }
4698
5212
  }
4699
5213
  ]
4700
- }, c$4 = {
5214
+ }, c$6 = {
4701
5215
  type: "rich-text-child",
4702
5216
  label: "Italic Text",
4703
5217
  icon: TextItalicIcon,
4704
5218
  states: defaultStates,
4705
- presetStyle: r$9
5219
+ presetStyle: r$d
4706
5220
  };
4707
5221
  const e$3 = {
4708
5222
  sup
4709
- }, a$6 = {
5223
+ }, a$8 = {
4710
5224
  type: "rich-text-child",
4711
5225
  label: "Superscript Text",
4712
5226
  icon: SuperscriptIcon,
@@ -4715,30 +5229,26 @@ const e$3 = {
4715
5229
  };
4716
5230
  const e$2 = {
4717
5231
  sub
4718
- }, a$5 = {
5232
+ }, a$7 = {
4719
5233
  type: "rich-text-child",
4720
5234
  label: "Subscript Text",
4721
5235
  icon: SubscriptIcon,
4722
5236
  states: defaultStates,
4723
5237
  presetStyle: e$2
4724
5238
  };
4725
- const a$4 = {
5239
+ const l$5 = {
4726
5240
  button
4727
- }, p$b = {
5241
+ }, p$7 = {
4728
5242
  icon: ButtonElementIcon,
4729
5243
  type: "container",
4730
- constraints: {
4731
- relation: "ancestor",
4732
- component: { $nin: ["Button", "Link"] }
4733
- },
4734
- presetStyle: a$4,
5244
+ presetStyle: l$5,
4735
5245
  states: [
4736
5246
  ...defaultStates,
4737
5247
  { selector: ":disabled", label: "Disabled" },
4738
5248
  { selector: ":enabled", label: "Enabled" }
4739
5249
  ]
4740
5250
  };
4741
- const r$8 = {
5251
+ const r$c = {
4742
5252
  input: [
4743
5253
  ...input,
4744
5254
  {
@@ -4746,17 +5256,13 @@ const r$8 = {
4746
5256
  value: { type: "keyword", value: "block" }
4747
5257
  }
4748
5258
  ]
4749
- }, p$a = {
5259
+ }, c$5 = {
4750
5260
  category: "forms",
4751
- constraints: {
4752
- relation: "ancestor",
4753
- component: { $nin: ["Button", "Link"] }
4754
- },
4755
5261
  type: "control",
4756
5262
  label: "Text Input",
4757
5263
  description: "A single-line text input for collecting string data from your users.",
4758
5264
  icon: FormTextFieldIcon,
4759
- presetStyle: r$8,
5265
+ presetStyle: r$c,
4760
5266
  order: 3,
4761
5267
  states: [
4762
5268
  ...defaultStates,
@@ -4772,14 +5278,10 @@ const r$8 = {
4772
5278
  //{ selector: ":read-write", label: "Read Write" },
4773
5279
  ]
4774
5280
  };
4775
- const n$3 = {
5281
+ const c$4 = {
4776
5282
  label: "Webhook Form",
4777
5283
  icon: WebhookFormIcon,
4778
5284
  type: "container",
4779
- constraints: {
4780
- relation: "ancestor",
4781
- component: { $nin: ["Form", "Button", "Link"] }
4782
- },
4783
5285
  presetStyle: {
4784
5286
  form
4785
5287
  },
@@ -4788,26 +5290,22 @@ const n$3 = {
4788
5290
  { selector: "[data-state=success]", label: "Success" }
4789
5291
  ]
4790
5292
  };
4791
- const n$2 = {
5293
+ const s$2 = {
4792
5294
  form: [
4793
5295
  ...form,
4794
5296
  { property: "min-height", value: { type: "unit", unit: "px", value: 20 } }
4795
5297
  ]
4796
- }, p$9 = {
5298
+ }, n$4 = {
4797
5299
  category: "forms",
4798
5300
  type: "container",
4799
5301
  label: "Form",
4800
- constraints: {
4801
- relation: "ancestor",
4802
- component: { $nin: ["Form", "Button", "Link"] }
4803
- },
4804
5302
  description: "Create filters, surveys, searches and more.",
4805
5303
  icon: FormIcon,
4806
5304
  states: defaultStates,
4807
- presetStyle: n$2,
5305
+ presetStyle: s$2,
4808
5306
  order: 0
4809
5307
  };
4810
- const a$3 = {
5308
+ const a$6 = {
4811
5309
  img: [
4812
5310
  ...img,
4813
5311
  // Otherwise on new image insert onto canvas it can overfit screen size multiple times
@@ -4835,10 +5333,10 @@ const a$3 = {
4835
5333
  description: "Add an image asset to the page. Webstudio automatically converts images to WebP or AVIF format and makes them responsive for best performance.",
4836
5334
  icon: ImageIcon,
4837
5335
  states: defaultStates,
4838
- presetStyle: a$3,
5336
+ presetStyle: a$6,
4839
5337
  order: 0
4840
5338
  };
4841
- const r$7 = {
5339
+ const r$b = {
4842
5340
  blockquote: [
4843
5341
  {
4844
5342
  property: "margin-top",
@@ -4885,14 +5383,14 @@ const r$7 = {
4885
5383
  value: { type: "rgb", r: 226, g: 226, b: 226, alpha: 1 }
4886
5384
  }
4887
5385
  ]
4888
- }, i$5 = {
5386
+ }, i$2 = {
4889
5387
  type: "container",
4890
5388
  placeholder: "Blockquote",
4891
5389
  icon: BlockquoteIcon,
4892
5390
  states: defaultStates,
4893
- presetStyle: r$7
5391
+ presetStyle: r$b
4894
5392
  };
4895
- const a$2 = {
5393
+ const a$5 = {
4896
5394
  ol: [
4897
5395
  ...ol,
4898
5396
  {
@@ -4923,29 +5421,22 @@ const a$2 = {
4923
5421
  value: { type: "keyword", value: "40px" }
4924
5422
  }
4925
5423
  ]
4926
- }, d$3 = {
5424
+ }, d$5 = {
4927
5425
  type: "container",
4928
5426
  icon: ListIcon,
4929
5427
  states: defaultStates,
4930
- presetStyle: a$2
5428
+ presetStyle: a$5
4931
5429
  };
4932
- const s$2 = {
4933
- li
4934
- }, m$3 = {
5430
+ const a$4 = {
4935
5431
  type: "container",
4936
5432
  placeholder: "List item",
4937
- constraints: {
4938
- // cannot use parent relation here
4939
- // because list item can be put inside of collection or slot
4940
- // perhaps can be eventually fixed with tag matchers
4941
- relation: "ancestor",
4942
- component: { $eq: "List" }
4943
- },
4944
5433
  icon: ListItemIcon,
4945
5434
  states: defaultStates,
4946
- presetStyle: s$2
5435
+ presetStyle: {
5436
+ li
5437
+ }
4947
5438
  };
4948
- const p$8 = {
5439
+ const p$6 = {
4949
5440
  hr: [
4950
5441
  ...hr,
4951
5442
  {
@@ -4973,16 +5464,16 @@ const p$8 = {
4973
5464
  value: { type: "keyword", value: "none" }
4974
5465
  }
4975
5466
  ]
4976
- }, n$1 = {
5467
+ }, n$3 = {
4977
5468
  category: "general",
4978
5469
  type: "embed",
4979
5470
  description: "Used to visually divide sections of content, helping to improve readability and organization within a webpage.",
4980
5471
  icon: MinusIcon,
4981
5472
  states: defaultStates,
4982
- presetStyle: p$8,
5473
+ presetStyle: p$6,
4983
5474
  order: 3
4984
5475
  };
4985
- const p$7 = {
5476
+ const p$5 = {
4986
5477
  code: [
4987
5478
  ...code,
4988
5479
  {
@@ -5010,34 +5501,26 @@ const p$7 = {
5010
5501
  value: { type: "rgb", r: 238, g: 238, b: 238, alpha: 1 }
5011
5502
  }
5012
5503
  ]
5013
- }, i$4 = {
5504
+ }, d$4 = {
5014
5505
  category: "general",
5015
5506
  type: "embed",
5016
5507
  description: "Use this component when you want to display code as text on the page.",
5017
5508
  icon: BracesIcon,
5018
- constraints: {
5019
- relation: "ancestor",
5020
- component: { $neq: "CodeText" }
5021
- },
5022
5509
  states: defaultStates,
5023
- presetStyle: p$7,
5510
+ presetStyle: p$5,
5024
5511
  order: 5
5025
5512
  };
5026
- const a$1 = {
5513
+ const a$3 = {
5027
5514
  label: [
5028
5515
  ...label,
5029
5516
  { property: "display", value: { type: "keyword", value: "block" } }
5030
5517
  ]
5031
- }, i$3 = {
5032
- constraints: {
5033
- relation: "ancestor",
5034
- component: { $nin: ["Button", "Link"] }
5035
- },
5518
+ }, m$3 = {
5036
5519
  type: "container",
5037
5520
  label: "Input Label",
5038
5521
  icon: LabelIcon,
5039
5522
  states: defaultStates,
5040
- presetStyle: a$1
5523
+ presetStyle: a$3
5041
5524
  };
5042
5525
  const l$3 = {
5043
5526
  textarea: [
@@ -5049,7 +5532,7 @@ const l$3 = {
5049
5532
  value: { type: "keyword", value: "block" }
5050
5533
  }
5051
5534
  ]
5052
- }, p$6 = {
5535
+ }, c$3 = {
5053
5536
  category: "forms",
5054
5537
  type: "control",
5055
5538
  label: "Text Area",
@@ -5057,10 +5540,6 @@ const l$3 = {
5057
5540
  icon: FormTextAreaIcon,
5058
5541
  presetStyle: l$3,
5059
5542
  order: 4,
5060
- constraints: {
5061
- relation: "ancestor",
5062
- component: { $nin: ["Button", "Link"] }
5063
- },
5064
5543
  states: [
5065
5544
  ...defaultStates,
5066
5545
  { selector: "::placeholder", label: "Placeholder" },
@@ -5075,7 +5554,7 @@ const l$3 = {
5075
5554
  //{ selector: ":read-write", label: "Read Write" },
5076
5555
  ]
5077
5556
  };
5078
- const i$2 = {
5557
+ const a$2 = {
5079
5558
  input: [
5080
5559
  ...radio,
5081
5560
  {
@@ -5083,15 +5562,11 @@ const i$2 = {
5083
5562
  value: { type: "unit", unit: "em", value: 0.5 }
5084
5563
  }
5085
5564
  ]
5086
- }, p$5 = {
5087
- constraints: {
5088
- relation: "ancestor",
5089
- component: { $nin: ["Button", "Link"] }
5090
- },
5565
+ }, s$1 = {
5091
5566
  type: "control",
5092
5567
  label: "Radio",
5093
5568
  icon: RadioCheckedIcon,
5094
- presetStyle: i$2,
5569
+ presetStyle: a$2,
5095
5570
  states: [
5096
5571
  ...defaultStates,
5097
5572
  { selector: ":checked", label: "Checked" },
@@ -5104,7 +5579,7 @@ const i$2 = {
5104
5579
  //{ selector: ":read-write", label: "Read Write" },
5105
5580
  ]
5106
5581
  };
5107
- const r$6 = {
5582
+ const o$3 = {
5108
5583
  input: [
5109
5584
  ...checkbox,
5110
5585
  {
@@ -5112,14 +5587,10 @@ const r$6 = {
5112
5587
  value: { type: "unit", unit: "em", value: 0.5 }
5113
5588
  }
5114
5589
  ]
5115
- }, s$1 = {
5116
- constraints: {
5117
- relation: "ancestor",
5118
- component: { $nin: ["Button", "Link"] }
5119
- },
5590
+ }, d$3 = {
5120
5591
  type: "control",
5121
5592
  icon: CheckboxCheckedIcon,
5122
- presetStyle: r$6,
5593
+ presetStyle: o$3,
5123
5594
  states: [
5124
5595
  ...defaultStates,
5125
5596
  { selector: ":checked", label: "Checked" },
@@ -5131,13 +5602,13 @@ const r$6 = {
5131
5602
  { selector: ":read-write", label: "Read Write" }
5132
5603
  ]
5133
5604
  };
5134
- const r$5 = {
5605
+ const r$a = {
5135
5606
  div
5136
- }, c$3 = {
5607
+ }, c$2 = {
5137
5608
  type: "container",
5138
5609
  icon: VimeoIcon,
5139
5610
  states: defaultStates,
5140
- presetStyle: r$5,
5611
+ presetStyle: r$a,
5141
5612
  constraints: {
5142
5613
  relation: "ancestor",
5143
5614
  component: { $nin: ["Button", "Link", "Heading"] }
@@ -5145,7 +5616,7 @@ const r$5 = {
5145
5616
  };
5146
5617
  const i$1 = {
5147
5618
  div
5148
- }, c$2 = {
5619
+ }, c$1 = {
5149
5620
  type: "container",
5150
5621
  icon: YoutubeIcon,
5151
5622
  states: defaultStates,
@@ -5164,7 +5635,7 @@ const i = {
5164
5635
  component: { $in: ["Vimeo", "YouTube"] }
5165
5636
  }
5166
5637
  };
5167
- const r$4 = {
5638
+ const r$9 = {
5168
5639
  button
5169
5640
  }, p$4 = {
5170
5641
  category: "hidden",
@@ -5181,10 +5652,10 @@ const r$4 = {
5181
5652
  ],
5182
5653
  label: "Play Button",
5183
5654
  icon: ButtonElementIcon,
5184
- presetStyle: r$4,
5655
+ presetStyle: r$9,
5185
5656
  states: defaultStates
5186
5657
  };
5187
- const n = {
5658
+ const n$2 = {
5188
5659
  div
5189
5660
  }, m$2 = {
5190
5661
  type: "container",
@@ -5194,7 +5665,7 @@ const n = {
5194
5665
  },
5195
5666
  icon: BoxIcon,
5196
5667
  states: defaultStates,
5197
- presetStyle: n,
5668
+ presetStyle: n$2,
5198
5669
  category: "hidden",
5199
5670
  label: "Spinner"
5200
5671
  };
@@ -5205,14 +5676,14 @@ const e$1 = {
5205
5676
  icon: XmlIcon,
5206
5677
  description: "XML Node"
5207
5678
  };
5208
- const a = {
5679
+ const a$1 = {
5209
5680
  category: "xml",
5210
5681
  type: "container",
5211
5682
  description: "Converts machine-readable date and time to ISO format.",
5212
5683
  icon: CalendarIcon,
5213
5684
  order: 7
5214
5685
  };
5215
- const r$3 = {
5686
+ const r$8 = {
5216
5687
  time
5217
5688
  }, s = {
5218
5689
  category: "localization",
@@ -5220,9 +5691,9 @@ const r$3 = {
5220
5691
  description: "Converts machine-readable date and time to a human-readable format.",
5221
5692
  icon: CalendarIcon,
5222
5693
  states: defaultStates,
5223
- presetStyle: r$3
5694
+ presetStyle: r$8
5224
5695
  };
5225
- const r$2 = {
5696
+ const r$7 = {
5226
5697
  select: [
5227
5698
  ...select,
5228
5699
  {
@@ -5230,14 +5701,10 @@ const r$2 = {
5230
5701
  value: { type: "keyword", value: "block" }
5231
5702
  }
5232
5703
  ]
5233
- }, c$1 = {
5234
- constraints: {
5235
- relation: "ancestor",
5236
- component: { $nin: ["Button", "Link"] }
5237
- },
5704
+ }, c = {
5238
5705
  type: "container",
5239
5706
  icon: SelectIcon,
5240
- presetStyle: r$2,
5707
+ presetStyle: r$7,
5241
5708
  states: [
5242
5709
  ...defaultStates,
5243
5710
  { selector: "::placeholder", label: "Placeholder" },
@@ -5247,7 +5714,7 @@ const r$2 = {
5247
5714
  { selector: ":optional", label: "Optional" }
5248
5715
  ]
5249
5716
  };
5250
- const o$4 = {
5717
+ const l$2 = {
5251
5718
  option: [
5252
5719
  {
5253
5720
  property: "background-color",
@@ -5261,16 +5728,12 @@ const o$4 = {
5261
5728
  }
5262
5729
  }
5263
5730
  ]
5264
- }, r$1 = {
5731
+ }, r$6 = {
5265
5732
  category: "hidden",
5266
- constraints: {
5267
- relation: "parent",
5268
- component: { $eq: "Select" }
5269
- },
5270
5733
  type: "control",
5271
5734
  description: "An item within a drop-down menu that users can select as their chosen value.",
5272
5735
  icon: ItemIcon,
5273
- presetStyle: o$4,
5736
+ presetStyle: l$2,
5274
5737
  states: [
5275
5738
  // Applies when option is being activated (clicked)
5276
5739
  { selector: ":active", label: "Active" },
@@ -5282,7 +5745,7 @@ const o$4 = {
5282
5745
  { selector: ":disabled", label: "Disabled" }
5283
5746
  ]
5284
5747
  };
5285
- const r = {
5748
+ const r$5 = {
5286
5749
  icon: HeaderIcon,
5287
5750
  type: "container",
5288
5751
  description: "Inserts children into the head of the document",
@@ -5324,74 +5787,124 @@ const p$1 = {
5324
5787
  component: { $eq: "HeadSlot" }
5325
5788
  }
5326
5789
  };
5790
+ const r$4 = {
5791
+ type: "control",
5792
+ icon: VideoIcon,
5793
+ presetStyle: {
5794
+ video: [
5795
+ {
5796
+ property: "max-width",
5797
+ value: { type: "unit", unit: "%", value: 100 }
5798
+ }
5799
+ ]
5800
+ }
5801
+ };
5327
5802
  const baseComponentMetas = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
5328
5803
  __proto__: null,
5329
- Blockquote: i$5,
5330
- Body: n$5,
5331
- Bold: l$5,
5332
- Box: v$3,
5333
- Button: p$b,
5334
- Checkbox: s$1,
5335
- CodeText: i$4,
5336
- Form: n$3,
5337
- Fragment: o$5,
5804
+ Blockquote: i$2,
5805
+ Body: n$7,
5806
+ Bold: l$6,
5807
+ Box: v$2,
5808
+ Button: p$7,
5809
+ Checkbox: d$3,
5810
+ CodeText: d$4,
5811
+ Form: c$4,
5812
+ Fragment: o$4,
5338
5813
  HeadLink: p$3,
5339
5814
  HeadMeta: p$2,
5340
- HeadSlot: r,
5815
+ HeadSlot: r$5,
5341
5816
  HeadTitle: p$1,
5342
- Heading: f$3,
5343
- HtmlEmbed: a$c,
5817
+ Heading: d$6,
5818
+ HtmlEmbed: a$d,
5344
5819
  Image: l$4,
5345
- Input: p$a,
5346
- Italic: c$4,
5347
- Label: i$3,
5348
- Link: l$6,
5349
- List: d$3,
5350
- ListItem: m$3,
5820
+ Input: c$5,
5821
+ Italic: c$6,
5822
+ Label: m$3,
5823
+ Link: n$5,
5824
+ List: d$5,
5825
+ ListItem: a$4,
5351
5826
  MarkdownEmbed: t$1,
5352
- Option: r$1,
5353
- Paragraph: c$6,
5354
- RadioButton: p$5,
5355
- RemixForm: p$9,
5356
- RichTextLink: a$7,
5357
- Select: c$1,
5358
- Separator: n$1,
5827
+ Option: r$6,
5828
+ Paragraph: n$6,
5829
+ RadioButton: s$1,
5830
+ RemixForm: n$4,
5831
+ RichTextLink: a$9,
5832
+ Select: c,
5833
+ Separator: n$3,
5359
5834
  Slot: e$5,
5360
- Span: c$5,
5361
- Subscript: a$5,
5362
- Superscript: a$6,
5363
- Text: n$4,
5364
- Textarea: p$6,
5835
+ Span: c$7,
5836
+ Subscript: a$7,
5837
+ Superscript: a$8,
5838
+ Text: s$4,
5839
+ Textarea: c$3,
5365
5840
  Time: s,
5366
- Vimeo: c$3,
5841
+ Video: r$4,
5842
+ Vimeo: c$2,
5367
5843
  VimeoPlayButton: p$4,
5368
5844
  VimeoPreviewImage: i,
5369
5845
  VimeoSpinner: m$2,
5370
5846
  XmlNode: e$1,
5371
- XmlTime: a,
5372
- YouTube: c$2
5847
+ XmlTime: a$1,
5848
+ YouTube: c$1
5373
5849
  }, Symbol.toStringTag, { value: "Module" }));
5374
- const o$3 = {
5375
- category: "general",
5850
+ const o$2 = {
5851
+ category: "animations",
5376
5852
  type: "container",
5377
- description: "Animate Children",
5378
- icon: SlotComponentIcon,
5853
+ description: "Animation Group component is designed to animate its children.",
5854
+ icon: AnimationGroupIcon,
5379
5855
  order: 5,
5380
- label: "Animate Children",
5856
+ label: "Animation Group",
5381
5857
  constraints: {
5382
5858
  relation: "child",
5383
5859
  text: false
5384
5860
  }
5385
5861
  };
5386
- const o$2 = {
5387
- category: "general",
5862
+ const n$1 = (t2) => new Proxy(
5863
+ {},
5864
+ {
5865
+ get(o2, e2) {
5866
+ return `${t2}${e2}`;
5867
+ }
5868
+ }
5869
+ ), r$3 = n$1(
5870
+ "@webstudio-is/sdk-components-animation:"
5871
+ );
5872
+ const r$2 = {
5873
+ category: "animations",
5388
5874
  type: "container",
5389
- description: "Animate Text",
5390
- icon: TextIcon,
5875
+ description: "Text animation allows you to split text by char or by word to animate it.",
5876
+ icon: TextAnimationIcon,
5877
+ order: 6,
5878
+ label: "Text Animation",
5879
+ constraints: [
5880
+ { relation: "parent", component: { $eq: r$3.AnimateChildren } },
5881
+ {
5882
+ relation: "child",
5883
+ text: false
5884
+ }
5885
+ ]
5886
+ };
5887
+ const r$1 = {
5888
+ category: "animations",
5889
+ type: "container",
5890
+ description: "Stagger animation allows you to animate children elements with a sliding window.",
5891
+ icon: StaggerAnimationIcon,
5391
5892
  order: 6,
5392
- label: "Animate Text",
5893
+ label: "Stagger Animation",
5894
+ constraints: [
5895
+ { relation: "parent", component: { $eq: r$3.AnimateChildren } },
5896
+ {
5897
+ relation: "child",
5898
+ text: false
5899
+ }
5900
+ ]
5901
+ };
5902
+ const a = {
5903
+ type: "container",
5904
+ icon: Youtube1cIcon,
5905
+ label: "Video Animation",
5393
5906
  constraints: [
5394
- { relation: "parent", component: { $eq: "AnimateChildren" } },
5907
+ { relation: "parent", component: { $eq: r$3.AnimateChildren } },
5395
5908
  {
5396
5909
  relation: "child",
5397
5910
  text: false
@@ -5400,41 +5913,53 @@ const o$2 = {
5400
5913
  };
5401
5914
  const animationComponentMetas = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
5402
5915
  __proto__: null,
5403
- AnimateChildren: o$3,
5404
- AnimateText: o$2
5916
+ AnimateChildren: o$2,
5917
+ AnimateText: r$2,
5918
+ StaggerAnimation: r$1,
5919
+ VideoAnimation: a
5405
5920
  }, Symbol.toStringTag, { value: "Module" }));
5406
5921
  const remixComponentMetas = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
5407
5922
  __proto__: null,
5408
- Body: n$5,
5409
- Form: n$3,
5410
- Link: l$6,
5411
- RemixForm: p$9,
5412
- RichTextLink: a$7
5923
+ Body: n$7,
5924
+ Form: c$4,
5925
+ Link: n$5,
5926
+ RemixForm: n$4,
5927
+ RichTextLink: a$9
5413
5928
  }, Symbol.toStringTag, { value: "Module" }));
5414
- const c = {
5929
+ const r = (t2) => new Proxy(
5930
+ {},
5931
+ {
5932
+ get(o2, e2) {
5933
+ return `${t2}${e2}`;
5934
+ }
5935
+ }
5936
+ ), n = r(
5937
+ "@webstudio-is/sdk-components-react-radix:"
5938
+ );
5939
+ const m$1 = {
5415
5940
  type: "container",
5416
5941
  constraints: [
5417
5942
  {
5418
5943
  relation: "descendant",
5419
- component: { $eq: "CollapsibleTrigger" }
5944
+ component: { $eq: n.CollapsibleTrigger }
5420
5945
  },
5421
5946
  {
5422
5947
  relation: "descendant",
5423
- component: { $eq: "CollapsibleContent" }
5948
+ component: { $eq: n.CollapsibleContent }
5424
5949
  }
5425
5950
  ],
5426
5951
  presetStyle: {
5427
5952
  div
5428
5953
  },
5429
5954
  icon: CollapsibleIcon
5430
- }, C$3 = {
5955
+ }, b$7 = {
5431
5956
  type: "container",
5432
5957
  icon: TriggerIcon,
5433
5958
  constraints: {
5434
5959
  relation: "ancestor",
5435
- component: { $eq: "Collapsible" }
5960
+ component: { $eq: n.Collapsible }
5436
5961
  }
5437
- }, b$4 = {
5962
+ }, g$2 = {
5438
5963
  type: "container",
5439
5964
  presetStyle: {
5440
5965
  div
@@ -5442,7 +5967,7 @@ const c = {
5442
5967
  icon: ContentIcon,
5443
5968
  constraints: {
5444
5969
  relation: "ancestor",
5445
- component: { $eq: "Collapsible" }
5970
+ component: { $eq: n.Collapsible }
5446
5971
  }
5447
5972
  };
5448
5973
  const o$1 = (r2, t2, p2) => ({
@@ -5454,7 +5979,7 @@ const o$1 = (r2, t2, p2) => ({
5454
5979
  }), d$2 = (r2, t2, p2, l2) => ({
5455
5980
  property: r2,
5456
5981
  value: { type: "rgb", alpha: 1, r: t2, g: p2, b: l2 }
5457
- }), b$3 = [
5982
+ }), b$6 = [
5458
5983
  {
5459
5984
  property: "background-color",
5460
5985
  value: { type: "keyword", value: "transparent" }
@@ -5480,14 +6005,14 @@ const o$1 = (r2, t2, p2) => ({
5480
6005
  o$1("padding-bottom", 0, "px"),
5481
6006
  o$1("padding-left", 0, "px")
5482
6007
  ];
5483
- const O = {
6008
+ const S$1 = {
5484
6009
  type: "container",
5485
6010
  icon: TriggerIcon,
5486
6011
  constraints: {
5487
6012
  relation: "ancestor",
5488
- component: { $eq: "Dialog" }
6013
+ component: { $eq: n.Dialog }
5489
6014
  }
5490
- }, P$2 = {
6015
+ }, b$5 = {
5491
6016
  type: "container",
5492
6017
  presetStyle: {
5493
6018
  div
@@ -5496,14 +6021,14 @@ const O = {
5496
6021
  constraints: [
5497
6022
  {
5498
6023
  relation: "ancestor",
5499
- component: { $eq: "Dialog" }
6024
+ component: { $eq: n.Dialog }
5500
6025
  },
5501
6026
  {
5502
6027
  relation: "descendant",
5503
- component: { $eq: "DialogContent" }
6028
+ component: { $eq: n.DialogContent }
5504
6029
  }
5505
6030
  ]
5506
- }, S = {
6031
+ }, x$3 = {
5507
6032
  type: "container",
5508
6033
  presetStyle: {
5509
6034
  div
@@ -5512,26 +6037,26 @@ const O = {
5512
6037
  constraints: [
5513
6038
  {
5514
6039
  relation: "ancestor",
5515
- component: { $eq: "DialogOverlay" }
6040
+ component: { $eq: n.DialogOverlay }
5516
6041
  },
5517
6042
  // often deleted by users
5518
6043
  // though radix starts throwing warnings in console
5519
6044
  /*
5520
6045
  {
5521
6046
  relation: "descendant",
5522
- component: { $eq: "DialogTitle" },
6047
+ component: { $eq: radix.DialogTitle },
5523
6048
  },
5524
6049
  {
5525
6050
  relation: "descendant",
5526
- component: { $eq: "DialogDescription" },
6051
+ component: { $eq: radix.DialogDescription },
5527
6052
  },
5528
6053
  */
5529
6054
  {
5530
6055
  relation: "descendant",
5531
- component: { $eq: "DialogClose" }
6056
+ component: { $eq: n.DialogClose }
5532
6057
  }
5533
6058
  ]
5534
- }, b$2 = {
6059
+ }, B = {
5535
6060
  type: "container",
5536
6061
  presetStyle: {
5537
6062
  h2
@@ -5539,52 +6064,52 @@ const O = {
5539
6064
  icon: HeadingIcon,
5540
6065
  constraints: {
5541
6066
  relation: "ancestor",
5542
- component: { $eq: "DialogContent" }
6067
+ component: { $eq: n.DialogContent }
5543
6068
  }
5544
- }, x$1 = {
6069
+ }, h$1 = {
5545
6070
  type: "container",
5546
6071
  presetStyle: {
5547
- p: p$d
6072
+ p: p$a
5548
6073
  },
5549
6074
  icon: TextIcon,
5550
6075
  constraints: {
5551
6076
  relation: "ancestor",
5552
- component: { $eq: "DialogContent" }
6077
+ component: { $eq: n.DialogContent }
5553
6078
  }
5554
- }, B = {
6079
+ }, E = {
5555
6080
  type: "container",
5556
6081
  presetStyle: {
5557
- button: [b$3, button].flat()
6082
+ button: [b$6, button].flat()
5558
6083
  },
5559
6084
  states: defaultStates,
5560
6085
  icon: ButtonElementIcon,
5561
6086
  label: "Close Button",
5562
6087
  constraints: {
5563
6088
  relation: "ancestor",
5564
- component: { $eq: "DialogContent" }
6089
+ component: { $eq: n.DialogContent }
5565
6090
  }
5566
- }, h = {
6091
+ }, H$1 = {
5567
6092
  type: "container",
5568
6093
  icon: DialogIcon,
5569
6094
  constraints: [
5570
6095
  {
5571
6096
  relation: "descendant",
5572
- component: { $eq: "DialogTrigger" }
6097
+ component: { $eq: n.DialogTrigger }
5573
6098
  },
5574
6099
  {
5575
6100
  relation: "descendant",
5576
- component: { $eq: "DialogOverlay" }
6101
+ component: { $eq: n.DialogOverlay }
5577
6102
  }
5578
6103
  ]
5579
6104
  };
5580
- const P$1 = {
6105
+ const v$1 = {
5581
6106
  type: "container",
5582
6107
  icon: TriggerIcon,
5583
6108
  constraints: {
5584
6109
  relation: "ancestor",
5585
- component: { $eq: "Popover" }
6110
+ component: { $eq: n.Popover }
5586
6111
  }
5587
- }, v$2 = {
6112
+ }, g$1 = {
5588
6113
  type: "container",
5589
6114
  presetStyle: {
5590
6115
  div
@@ -5592,30 +6117,30 @@ const P$1 = {
5592
6117
  icon: ContentIcon,
5593
6118
  constraints: {
5594
6119
  relation: "ancestor",
5595
- component: { $eq: "Popover" }
6120
+ component: { $eq: n.Popover }
5596
6121
  }
5597
- }, m$1 = {
6122
+ }, l$1 = {
5598
6123
  type: "container",
5599
6124
  icon: PopoverIcon,
5600
6125
  constraints: [
5601
6126
  {
5602
6127
  relation: "descendant",
5603
- component: { $eq: "PopoverTrigger" }
6128
+ component: { $eq: n.PopoverTrigger }
5604
6129
  },
5605
6130
  {
5606
6131
  relation: "descendant",
5607
- component: { $eq: "PopoverContent" }
6132
+ component: { $eq: n.PopoverContent }
5608
6133
  }
5609
6134
  ]
5610
6135
  };
5611
- const l$2 = {
6136
+ const m = {
5612
6137
  type: "container",
5613
6138
  icon: TriggerIcon,
5614
6139
  constraints: {
5615
6140
  relation: "ancestor",
5616
- component: { $eq: "Tooltip" }
6141
+ component: { $eq: n.Tooltip }
5617
6142
  }
5618
- }, T$1 = {
6143
+ }, g = {
5619
6144
  type: "container",
5620
6145
  icon: ContentIcon,
5621
6146
  presetStyle: {
@@ -5623,64 +6148,64 @@ const l$2 = {
5623
6148
  },
5624
6149
  constraints: {
5625
6150
  relation: "ancestor",
5626
- component: { $eq: "Tooltip" }
6151
+ component: { $eq: n.Tooltip }
5627
6152
  }
5628
- }, m = {
6153
+ }, d$1 = {
5629
6154
  type: "container",
5630
6155
  constraints: [
5631
6156
  {
5632
6157
  relation: "descendant",
5633
- component: { $eq: "TooltipTrigger" }
6158
+ component: { $eq: n.TooltipTrigger }
5634
6159
  },
5635
6160
  {
5636
6161
  relation: "descendant",
5637
- component: { $eq: "TooltipContent" }
6162
+ component: { $eq: n.TooltipContent }
5638
6163
  }
5639
6164
  ],
5640
6165
  icon: TooltipIcon
5641
6166
  };
5642
- const t = {
6167
+ const o = {
5643
6168
  div
5644
- }, y$2 = {
6169
+ }, C$3 = {
5645
6170
  type: "container",
5646
6171
  icon: TabsIcon,
5647
6172
  constraints: [
5648
6173
  {
5649
6174
  relation: "descendant",
5650
- component: { $eq: "TabsTrigger" }
6175
+ component: { $eq: n.TabsTrigger }
5651
6176
  },
5652
6177
  {
5653
6178
  relation: "descendant",
5654
- component: { $eq: "TabsList" }
6179
+ component: { $eq: n.TabsList }
5655
6180
  },
5656
6181
  {
5657
6182
  relation: "descendant",
5658
- component: { $eq: "TabsContent" }
6183
+ component: { $eq: n.TabsContent }
5659
6184
  }
5660
6185
  ],
5661
- presetStyle: t
5662
- }, $$1 = {
6186
+ presetStyle: o
6187
+ }, L = {
5663
6188
  type: "container",
5664
6189
  icon: HeaderIcon,
5665
6190
  constraints: {
5666
6191
  relation: "ancestor",
5667
- component: { $eq: "Tabs" }
6192
+ component: { $eq: n.Tabs }
5668
6193
  },
5669
- presetStyle: t
5670
- }, C$2 = {
6194
+ presetStyle: o
6195
+ }, u = {
5671
6196
  type: "container",
5672
6197
  icon: TriggerIcon,
5673
6198
  constraints: [
5674
6199
  {
5675
6200
  relation: "ancestor",
5676
- component: { $eq: "TabsList" }
6201
+ component: { $eq: n.TabsList }
5677
6202
  },
5678
6203
  {
5679
6204
  relation: "ancestor",
5680
- component: { $neq: "TabsTrigger" }
6205
+ component: { $neq: n.TabsTrigger }
5681
6206
  }
5682
6207
  ],
5683
- indexWithinAncestor: "Tabs",
6208
+ indexWithinAncestor: n.Tabs,
5684
6209
  label: "Tab Trigger",
5685
6210
  states: [
5686
6211
  ...defaultStates,
@@ -5691,71 +6216,71 @@ const t = {
5691
6216
  }
5692
6217
  ],
5693
6218
  presetStyle: {
5694
- button: [button, b$3].flat()
6219
+ button: [button, b$6].flat()
5695
6220
  }
5696
- }, L$1 = {
6221
+ }, x$2 = {
5697
6222
  type: "container",
5698
6223
  label: "Tab Content",
5699
6224
  icon: ContentIcon,
5700
6225
  constraints: {
5701
6226
  relation: "ancestor",
5702
- component: { $eq: "Tabs" }
6227
+ component: { $eq: n.Tabs }
5703
6228
  },
5704
- indexWithinAncestor: "Tabs",
5705
- presetStyle: t
6229
+ indexWithinAncestor: n.Tabs,
6230
+ presetStyle: o
5706
6231
  };
5707
6232
  const p = {
5708
6233
  label
5709
- }, l$1 = {
6234
+ }, l = {
5710
6235
  type: "container",
5711
6236
  icon: LabelIcon,
5712
6237
  presetStyle: p,
5713
6238
  states: defaultStates
5714
6239
  };
5715
- const o = {
6240
+ const t = {
5716
6241
  div
5717
- }, f$2 = {
6242
+ }, H = {
5718
6243
  type: "container",
5719
6244
  icon: AccordionIcon,
5720
- presetStyle: o,
6245
+ presetStyle: t,
5721
6246
  constraints: [
5722
6247
  {
5723
6248
  relation: "descendant",
5724
- component: { $eq: "AccordionItem" }
6249
+ component: { $eq: n.AccordionItem }
5725
6250
  }
5726
6251
  ]
5727
- }, v$1 = {
6252
+ }, C$2 = {
5728
6253
  type: "container",
5729
6254
  label: "Item",
5730
6255
  icon: ItemIcon,
5731
6256
  constraints: [
5732
6257
  {
5733
6258
  relation: "ancestor",
5734
- component: { $eq: "Accordion" }
6259
+ component: { $eq: n.Accordion }
5735
6260
  },
5736
6261
  {
5737
6262
  relation: "descendant",
5738
- component: { $eq: "AccordionHeader" }
6263
+ component: { $eq: n.AccordionHeader }
5739
6264
  },
5740
6265
  {
5741
6266
  relation: "descendant",
5742
- component: { $eq: "AccordionContent" }
6267
+ component: { $eq: n.AccordionContent }
5743
6268
  }
5744
6269
  ],
5745
- indexWithinAncestor: "Accordion",
5746
- presetStyle: o
5747
- }, H = {
6270
+ indexWithinAncestor: n.Accordion,
6271
+ presetStyle: t
6272
+ }, T = {
5748
6273
  type: "container",
5749
6274
  label: "Item Header",
5750
6275
  icon: HeaderIcon,
5751
6276
  constraints: [
5752
6277
  {
5753
6278
  relation: "ancestor",
5754
- component: { $eq: "AccordionItem" }
6279
+ component: { $eq: n.AccordionItem }
5755
6280
  },
5756
6281
  {
5757
6282
  relation: "descendant",
5758
- component: { $eq: "AccordionTrigger" }
6283
+ component: { $eq: n.AccordionTrigger }
5759
6284
  }
5760
6285
  ],
5761
6286
  presetStyle: {
@@ -5771,13 +6296,13 @@ const o = {
5771
6296
  }
5772
6297
  ]
5773
6298
  }
5774
- }, C$1 = {
6299
+ }, x$1 = {
5775
6300
  type: "container",
5776
6301
  label: "Item Trigger",
5777
6302
  icon: TriggerIcon,
5778
6303
  constraints: {
5779
6304
  relation: "ancestor",
5780
- component: { $eq: "AccordionHeader" }
6305
+ component: { $eq: n.AccordionHeader }
5781
6306
  },
5782
6307
  states: [
5783
6308
  ...defaultStates,
@@ -5788,19 +6313,19 @@ const o = {
5788
6313
  }
5789
6314
  ],
5790
6315
  presetStyle: {
5791
- button: [button, b$3].flat()
6316
+ button: [button, b$6].flat()
5792
6317
  }
5793
- }, T = {
6318
+ }, M = {
5794
6319
  type: "container",
5795
6320
  label: "Item Content",
5796
6321
  icon: ContentIcon,
5797
6322
  constraints: {
5798
6323
  relation: "ancestor",
5799
- component: { $eq: "AccordionItem" }
6324
+ component: { $eq: n.AccordionItem }
5800
6325
  },
5801
- presetStyle: o
6326
+ presetStyle: t
5802
6327
  };
5803
- const y$1 = {
6328
+ const d = {
5804
6329
  type: "container",
5805
6330
  icon: NavigationMenuIcon,
5806
6331
  presetStyle: {
@@ -5809,102 +6334,104 @@ const y$1 = {
5809
6334
  constraints: [
5810
6335
  {
5811
6336
  relation: "descendant",
5812
- component: { $eq: "NavigationMenuList" }
6337
+ component: { $eq: n.NavigationMenuList }
5813
6338
  },
5814
6339
  {
5815
6340
  relation: "descendant",
5816
- component: { $eq: "NavigationMenuViewport" }
6341
+ component: { $eq: n.NavigationMenuViewport }
5817
6342
  }
5818
6343
  ]
5819
- }, L = {
6344
+ }, $ = {
5820
6345
  type: "container",
5821
6346
  icon: ListIcon,
5822
6347
  constraints: [
5823
6348
  {
5824
6349
  relation: "ancestor",
5825
- component: { $eq: "NavigationMenu" }
6350
+ component: { $eq: n.NavigationMenu }
5826
6351
  },
5827
6352
  {
5828
6353
  relation: "descendant",
5829
- component: { $eq: "NavigationMenuItem" }
6354
+ component: { $eq: n.NavigationMenuItem }
5830
6355
  }
5831
6356
  ],
5832
6357
  presetStyle: {
5833
6358
  div
5834
6359
  },
5835
6360
  label: "Menu List"
5836
- }, $ = {
6361
+ }, q$1 = {
5837
6362
  type: "container",
5838
6363
  icon: ListItemIcon,
5839
6364
  constraints: {
5840
6365
  relation: "ancestor",
5841
- component: { $eq: "NavigationMenuList" }
6366
+ component: { $eq: n.NavigationMenuList }
5842
6367
  },
5843
6368
  presetStyle: {
5844
6369
  div
5845
6370
  },
5846
- indexWithinAncestor: "NavigationMenu",
6371
+ indexWithinAncestor: n.NavigationMenu,
5847
6372
  label: "Menu Item"
5848
- }, d$1 = {
6373
+ }, b$4 = {
5849
6374
  type: "container",
5850
6375
  icon: TriggerIcon,
5851
6376
  constraints: {
5852
6377
  relation: "ancestor",
5853
- component: { $eq: "NavigationMenuItem" }
6378
+ component: { $eq: n.NavigationMenuItem }
5854
6379
  },
5855
6380
  label: "Menu Trigger"
5856
- }, q = {
6381
+ }, w$1 = {
5857
6382
  type: "container",
5858
6383
  icon: ContentIcon,
5859
6384
  constraints: {
5860
6385
  relation: "ancestor",
5861
- component: { $eq: "NavigationMenuItem" }
6386
+ component: { $eq: n.NavigationMenuItem }
5862
6387
  },
5863
- indexWithinAncestor: "NavigationMenu",
6388
+ indexWithinAncestor: n.NavigationMenu,
5864
6389
  presetStyle: {
5865
6390
  div
5866
6391
  },
5867
6392
  label: "Menu Content"
5868
- }, b$1 = {
6393
+ }, C$1 = {
5869
6394
  type: "container",
5870
6395
  icon: BoxIcon,
5871
6396
  constraints: [
5872
6397
  {
5873
6398
  relation: "ancestor",
5874
- component: { $eq: "NavigationMenu" }
6399
+ component: { $eq: n.NavigationMenu }
5875
6400
  },
5876
6401
  {
5877
6402
  relation: "ancestor",
5878
- component: { $in: ["NavigationMenuContent", "NavigationMenuItem"] }
6403
+ component: {
6404
+ $in: [n.NavigationMenuContent, n.NavigationMenuItem]
6405
+ }
5879
6406
  }
5880
6407
  ],
5881
6408
  label: "Accessible Link Wrapper"
5882
- }, w$1 = {
6409
+ }, V = {
5883
6410
  type: "container",
5884
6411
  icon: ViewportIcon,
5885
6412
  constraints: {
5886
6413
  relation: "ancestor",
5887
- component: { $eq: "NavigationMenu" }
6414
+ component: { $eq: n.NavigationMenu }
5888
6415
  },
5889
6416
  presetStyle: {
5890
6417
  div
5891
6418
  },
5892
6419
  label: "Menu Viewport"
5893
6420
  };
5894
- const M = {
6421
+ const C = {
5895
6422
  type: "container",
5896
6423
  icon: SelectIcon,
5897
6424
  constraints: [
5898
6425
  {
5899
6426
  relation: "descendant",
5900
- component: { $eq: "SelectTrigger" }
6427
+ component: { $eq: n.SelectTrigger }
5901
6428
  },
5902
6429
  {
5903
6430
  relation: "descendant",
5904
- component: { $eq: "SelectContent" }
6431
+ component: { $eq: n.SelectContent }
5905
6432
  }
5906
6433
  ]
5907
- }, x = {
6434
+ }, w = {
5908
6435
  type: "container",
5909
6436
  icon: TriggerIcon,
5910
6437
  presetStyle: {
@@ -5913,14 +6440,14 @@ const M = {
5913
6440
  constraints: [
5914
6441
  {
5915
6442
  relation: "ancestor",
5916
- component: { $eq: "Select" }
6443
+ component: { $eq: n.Select }
5917
6444
  },
5918
6445
  {
5919
6446
  relation: "descendant",
5920
- component: { $eq: "SelectValue" }
6447
+ component: { $eq: n.SelectValue }
5921
6448
  }
5922
6449
  ]
5923
- }, C = {
6450
+ }, b$3 = {
5924
6451
  type: "container",
5925
6452
  label: "Value",
5926
6453
  icon: FormTextFieldIcon,
@@ -5929,9 +6456,9 @@ const M = {
5929
6456
  },
5930
6457
  constraints: {
5931
6458
  relation: "ancestor",
5932
- component: { $eq: "SelectTrigger" }
6459
+ component: { $eq: n.SelectTrigger }
5933
6460
  }
5934
- }, w = {
6461
+ }, f = {
5935
6462
  type: "container",
5936
6463
  icon: ContentIcon,
5937
6464
  presetStyle: {
@@ -5940,14 +6467,14 @@ const M = {
5940
6467
  constraints: [
5941
6468
  {
5942
6469
  relation: "ancestor",
5943
- component: { $eq: "Select" }
6470
+ component: { $eq: n.Select }
5944
6471
  },
5945
6472
  {
5946
6473
  relation: "descendant",
5947
- component: { $eq: "SelectViewport" }
6474
+ component: { $eq: n.SelectViewport }
5948
6475
  }
5949
6476
  ]
5950
- }, b = {
6477
+ }, v = {
5951
6478
  type: "container",
5952
6479
  icon: ViewportIcon,
5953
6480
  presetStyle: {
@@ -5956,61 +6483,61 @@ const M = {
5956
6483
  constraints: [
5957
6484
  {
5958
6485
  relation: "ancestor",
5959
- component: { $eq: "SelectContent" }
6486
+ component: { $eq: n.SelectContent }
5960
6487
  },
5961
6488
  {
5962
6489
  relation: "descendant",
5963
- component: { $eq: "SelectItem" }
6490
+ component: { $eq: n.SelectItem }
5964
6491
  }
5965
6492
  ]
5966
- }, f$1 = {
6493
+ }, P = {
5967
6494
  type: "container",
5968
6495
  icon: ItemIcon,
5969
6496
  constraints: [
5970
6497
  {
5971
6498
  relation: "ancestor",
5972
- component: { $eq: "SelectViewport" }
6499
+ component: { $eq: n.SelectViewport }
5973
6500
  },
5974
6501
  {
5975
6502
  relation: "descendant",
5976
- component: { $eq: "SelectItemIndicator" }
6503
+ component: { $eq: n.SelectItemIndicator }
5977
6504
  },
5978
6505
  {
5979
6506
  relation: "descendant",
5980
- component: { $eq: "SelectItemText" }
6507
+ component: { $eq: n.SelectItemText }
5981
6508
  }
5982
6509
  ],
5983
6510
  presetStyle: {
5984
6511
  div
5985
6512
  }
5986
- }, v = {
6513
+ }, h = {
5987
6514
  type: "container",
5988
6515
  label: "Indicator",
5989
6516
  icon: CheckMarkIcon,
5990
6517
  constraints: {
5991
6518
  relation: "ancestor",
5992
- component: { $eq: "SelectItem" }
6519
+ component: { $eq: n.SelectItem }
5993
6520
  },
5994
6521
  presetStyle: {
5995
6522
  span
5996
6523
  }
5997
- }, P = {
6524
+ }, k = {
5998
6525
  type: "container",
5999
6526
  label: "Item Text",
6000
6527
  icon: TextIcon,
6001
6528
  constraints: {
6002
6529
  relation: "ancestor",
6003
- component: { $eq: "SelectItem" }
6530
+ component: { $eq: n.SelectItem }
6004
6531
  },
6005
6532
  presetStyle: {
6006
6533
  span
6007
6534
  }
6008
6535
  };
6009
- const d = {
6536
+ const S = {
6010
6537
  type: "container",
6011
6538
  constraints: {
6012
6539
  relation: "descendant",
6013
- component: { $eq: "SwitchThumb" }
6540
+ component: { $eq: n.SwitchThumb }
6014
6541
  },
6015
6542
  icon: SwitchIcon,
6016
6543
  states: [
@@ -6027,13 +6554,13 @@ const d = {
6027
6554
  }
6028
6555
  ],
6029
6556
  presetStyle: {
6030
- button: [button, b$3].flat()
6557
+ button: [button, b$6].flat()
6031
6558
  }
6032
- }, u = {
6559
+ }, b$2 = {
6033
6560
  type: "container",
6034
6561
  constraints: {
6035
6562
  relation: "ancestor",
6036
- component: { $eq: "Switch" }
6563
+ component: { $eq: n.Switch }
6037
6564
  },
6038
6565
  icon: TriggerIcon,
6039
6566
  states: [
@@ -6053,11 +6580,11 @@ const d = {
6053
6580
  span
6054
6581
  }
6055
6582
  };
6056
- const k = {
6583
+ const b$1 = {
6057
6584
  type: "container",
6058
6585
  constraints: {
6059
6586
  relation: "descendant",
6060
- component: { $eq: "CheckboxIndicator" }
6587
+ component: { $eq: n.CheckboxIndicator }
6061
6588
  },
6062
6589
  icon: CheckboxCheckedIcon,
6063
6590
  states: [
@@ -6074,13 +6601,13 @@ const k = {
6074
6601
  }
6075
6602
  ],
6076
6603
  presetStyle: {
6077
- button: [button, b$3].flat()
6604
+ button: [button, b$6].flat()
6078
6605
  }
6079
- }, l = {
6606
+ }, x = {
6080
6607
  type: "container",
6081
6608
  constraints: {
6082
6609
  relation: "ancestor",
6083
- component: { $eq: "Checkbox" }
6610
+ component: { $eq: n.Checkbox }
6084
6611
  },
6085
6612
  icon: TriggerIcon,
6086
6613
  states: defaultStates,
@@ -6088,11 +6615,11 @@ const k = {
6088
6615
  span
6089
6616
  }
6090
6617
  };
6091
- const I = {
6618
+ const y = {
6092
6619
  type: "container",
6093
6620
  constraints: {
6094
6621
  relation: "descendant",
6095
- component: { $eq: "RadioGroupItem" }
6622
+ component: { $eq: n.RadioGroupItem }
6096
6623
  },
6097
6624
  icon: RadioGroupIcon,
6098
6625
  states: [
@@ -6111,29 +6638,29 @@ const I = {
6111
6638
  presetStyle: {
6112
6639
  div
6113
6640
  }
6114
- }, y = {
6641
+ }, b = {
6115
6642
  type: "container",
6116
6643
  constraints: [
6117
6644
  {
6118
6645
  relation: "ancestor",
6119
- component: { $eq: "RadioGroup" }
6646
+ component: { $eq: n.RadioGroup }
6120
6647
  },
6121
6648
  {
6122
6649
  relation: "descendant",
6123
- component: { $eq: "RadioGroupIndicator" }
6650
+ component: { $eq: n.RadioGroupIndicator }
6124
6651
  }
6125
6652
  ],
6126
6653
  icon: ItemIcon,
6127
6654
  states: defaultStates,
6128
6655
  presetStyle: {
6129
- button: [button, b$3].flat()
6656
+ button: [button, b$6].flat()
6130
6657
  }
6131
- }, f = {
6658
+ }, q = {
6132
6659
  type: "container",
6133
6660
  icon: TriggerIcon,
6134
6661
  constraints: {
6135
6662
  relation: "ancestor",
6136
- component: { $eq: "RadioGroupItem" }
6663
+ component: { $eq: n.RadioGroupItem }
6137
6664
  },
6138
6665
  states: defaultStates,
6139
6666
  presetStyle: {
@@ -6142,54 +6669,54 @@ const I = {
6142
6669
  };
6143
6670
  const radixComponentMetas = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
6144
6671
  __proto__: null,
6145
- Accordion: f$2,
6146
- AccordionContent: T,
6147
- AccordionHeader: H,
6148
- AccordionItem: v$1,
6149
- AccordionTrigger: C$1,
6150
- Checkbox: k,
6151
- CheckboxIndicator: l,
6152
- Collapsible: c,
6153
- CollapsibleContent: b$4,
6154
- CollapsibleTrigger: C$3,
6155
- Dialog: h,
6156
- DialogClose: B,
6157
- DialogContent: S,
6158
- DialogDescription: x$1,
6159
- DialogOverlay: P$2,
6160
- DialogTitle: b$2,
6161
- DialogTrigger: O,
6162
- Label: l$1,
6163
- NavigationMenu: y$1,
6164
- NavigationMenuContent: q,
6165
- NavigationMenuItem: $,
6166
- NavigationMenuLink: b$1,
6167
- NavigationMenuList: L,
6168
- NavigationMenuTrigger: d$1,
6169
- NavigationMenuViewport: w$1,
6170
- Popover: m$1,
6171
- PopoverContent: v$2,
6172
- PopoverTrigger: P$1,
6173
- RadioGroup: I,
6174
- RadioGroupIndicator: f,
6175
- RadioGroupItem: y,
6176
- Select: M,
6177
- SelectContent: w,
6178
- SelectItem: f$1,
6179
- SelectItemIndicator: v,
6180
- SelectItemText: P,
6181
- SelectTrigger: x,
6182
- SelectValue: C,
6183
- SelectViewport: b,
6184
- Switch: d,
6185
- SwitchThumb: u,
6186
- Tabs: y$2,
6187
- TabsContent: L$1,
6188
- TabsList: $$1,
6189
- TabsTrigger: C$2,
6190
- Tooltip: m,
6191
- TooltipContent: T$1,
6192
- TooltipTrigger: l$2
6672
+ Accordion: H,
6673
+ AccordionContent: M,
6674
+ AccordionHeader: T,
6675
+ AccordionItem: C$2,
6676
+ AccordionTrigger: x$1,
6677
+ Checkbox: b$1,
6678
+ CheckboxIndicator: x,
6679
+ Collapsible: m$1,
6680
+ CollapsibleContent: g$2,
6681
+ CollapsibleTrigger: b$7,
6682
+ Dialog: H$1,
6683
+ DialogClose: E,
6684
+ DialogContent: x$3,
6685
+ DialogDescription: h$1,
6686
+ DialogOverlay: b$5,
6687
+ DialogTitle: B,
6688
+ DialogTrigger: S$1,
6689
+ Label: l,
6690
+ NavigationMenu: d,
6691
+ NavigationMenuContent: w$1,
6692
+ NavigationMenuItem: q$1,
6693
+ NavigationMenuLink: C$1,
6694
+ NavigationMenuList: $,
6695
+ NavigationMenuTrigger: b$4,
6696
+ NavigationMenuViewport: V,
6697
+ Popover: l$1,
6698
+ PopoverContent: g$1,
6699
+ PopoverTrigger: v$1,
6700
+ RadioGroup: y,
6701
+ RadioGroupIndicator: q,
6702
+ RadioGroupItem: b,
6703
+ Select: C,
6704
+ SelectContent: f,
6705
+ SelectItem: P,
6706
+ SelectItemIndicator: h,
6707
+ SelectItemText: k,
6708
+ SelectTrigger: w,
6709
+ SelectValue: b$3,
6710
+ SelectViewport: v,
6711
+ Switch: S,
6712
+ SwitchThumb: b$2,
6713
+ Tabs: C$3,
6714
+ TabsContent: x$2,
6715
+ TabsList: L,
6716
+ TabsTrigger: u,
6717
+ Tooltip: d$1,
6718
+ TooltipContent: g,
6719
+ TooltipTrigger: m
6193
6720
  }, Symbol.toStringTag, { value: "Module" }));
6194
6721
  const createFramework$2 = async () => {
6195
6722
  const routeTemplatesDir = join("app", "route-templates");
@@ -6213,20 +6740,12 @@ const createFramework$2 = async () => {
6213
6740
  const radixComponentNamespacedMetas = {};
6214
6741
  for (const [name2, meta] of Object.entries(radixComponentMetas)) {
6215
6742
  const namespace = "@webstudio-is/sdk-components-react-radix";
6216
- radixComponentNamespacedMetas[`${namespace}:${name2}`] = namespaceMeta(
6217
- meta,
6218
- namespace,
6219
- new Set(Object.keys(radixComponentMetas))
6220
- );
6743
+ radixComponentNamespacedMetas[`${namespace}:${name2}`] = meta;
6221
6744
  }
6222
6745
  const animationComponentNamespacedMetas = {};
6223
6746
  for (const [name2, meta] of Object.entries(animationComponentMetas)) {
6224
6747
  const namespace = "@webstudio-is/sdk-components-animation";
6225
- animationComponentNamespacedMetas[`${namespace}:${name2}`] = namespaceMeta(
6226
- meta,
6227
- namespace,
6228
- new Set(Object.keys(animationComponentMetas))
6229
- );
6748
+ animationComponentNamespacedMetas[`${namespace}:${name2}`] = meta;
6230
6749
  }
6231
6750
  return {
6232
6751
  components: [
@@ -6279,11 +6798,11 @@ const createFramework$2 = async () => {
6279
6798
  };
6280
6799
  const reactRouterComponentMetas = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
6281
6800
  __proto__: null,
6282
- Body: n$5,
6283
- Form: n$3,
6284
- Link: l$6,
6285
- RemixForm: p$9,
6286
- RichTextLink: a$7
6801
+ Body: n$7,
6802
+ Form: c$4,
6803
+ Link: n$5,
6804
+ RemixForm: n$4,
6805
+ RichTextLink: a$9
6287
6806
  }, Symbol.toStringTag, { value: "Module" }));
6288
6807
  const createFramework$1 = async () => {
6289
6808
  const routeTemplatesDir = join("app", "route-templates");
@@ -6307,20 +6826,12 @@ const createFramework$1 = async () => {
6307
6826
  const radixComponentNamespacedMetas = {};
6308
6827
  for (const [name2, meta] of Object.entries(radixComponentMetas)) {
6309
6828
  const namespace = "@webstudio-is/sdk-components-react-radix";
6310
- radixComponentNamespacedMetas[`${namespace}:${name2}`] = namespaceMeta(
6311
- meta,
6312
- namespace,
6313
- new Set(Object.keys(radixComponentMetas))
6314
- );
6829
+ radixComponentNamespacedMetas[`${namespace}:${name2}`] = meta;
6315
6830
  }
6316
6831
  const animationComponentNamespacedMetas = {};
6317
6832
  for (const [name2, meta] of Object.entries(animationComponentMetas)) {
6318
6833
  const namespace = "@webstudio-is/sdk-components-animation";
6319
- animationComponentNamespacedMetas[`${namespace}:${name2}`] = namespaceMeta(
6320
- meta,
6321
- namespace,
6322
- new Set(Object.keys(animationComponentMetas))
6323
- );
6834
+ animationComponentNamespacedMetas[`${namespace}:${name2}`] = meta;
6324
6835
  }
6325
6836
  return {
6326
6837
  components: [
@@ -6395,20 +6906,12 @@ const createFramework = async () => {
6395
6906
  const radixComponentNamespacedMetas = {};
6396
6907
  for (const [name2, meta] of Object.entries(radixComponentMetas)) {
6397
6908
  const namespace = "@webstudio-is/sdk-components-react-radix";
6398
- radixComponentNamespacedMetas[`${namespace}:${name2}`] = namespaceMeta(
6399
- meta,
6400
- namespace,
6401
- new Set(Object.keys(radixComponentMetas))
6402
- );
6909
+ radixComponentNamespacedMetas[`${namespace}:${name2}`] = meta;
6403
6910
  }
6404
6911
  const animationComponentNamespacedMetas = {};
6405
6912
  for (const [name2, meta] of Object.entries(animationComponentMetas)) {
6406
6913
  const namespace = "@webstudio-is/sdk-components-animation";
6407
- animationComponentNamespacedMetas[`${namespace}:${name2}`] = namespaceMeta(
6408
- meta,
6409
- namespace,
6410
- new Set(Object.keys(animationComponentMetas))
6411
- );
6914
+ animationComponentNamespacedMetas[`${namespace}:${name2}`] = meta;
6412
6915
  }
6413
6916
  return {
6414
6917
  components: [
@@ -7020,7 +7523,7 @@ const build = async (options) => {
7020
7523
  const exitIfCancelled = (value) => {
7021
7524
  if (isCancel(value)) {
7022
7525
  cancel("Project initialization is cancelled");
7023
- process.exit(0);
7526
+ process.exit(1);
7024
7527
  }
7025
7528
  return value;
7026
7529
  };
@@ -7028,7 +7531,7 @@ const initFlow = async (options) => {
7028
7531
  const isProjectConfigured = await isFileExists(".webstudio/config.json");
7029
7532
  let shouldInstallDeps = false;
7030
7533
  let folderName;
7031
- let projectTemplate = void 0;
7534
+ let projectTemplate;
7032
7535
  if (isProjectConfigured === false) {
7033
7536
  const shouldCreateFolder = exitIfCancelled(
7034
7537
  await confirm({
@@ -7057,12 +7560,14 @@ const initFlow = async (options) => {
7057
7560
  })
7058
7561
  );
7059
7562
  await link({ link: shareLink });
7060
- projectTemplate = exitIfCancelled(
7061
- await select$1({
7062
- message: "Where would you like to deploy your project?",
7063
- options: PROJECT_TEMPLATES
7064
- })
7065
- );
7563
+ if (!options.template.length) {
7564
+ projectTemplate = exitIfCancelled(
7565
+ await select$1({
7566
+ message: "Where would you like to deploy your project?",
7567
+ options: PROJECT_TEMPLATES
7568
+ })
7569
+ );
7570
+ }
7066
7571
  shouldInstallDeps = exitIfCancelled(
7067
7572
  await confirm({
7068
7573
  message: "Would you like to install dependencies? (recommended)",
@@ -7070,7 +7575,7 @@ const initFlow = async (options) => {
7070
7575
  })
7071
7576
  );
7072
7577
  }
7073
- if (projectTemplate === void 0) {
7578
+ if (!options.template.length && projectTemplate === void 0) {
7074
7579
  projectTemplate = exitIfCancelled(
7075
7580
  await select$1({
7076
7581
  message: "Where would you like to deploy your project?",
@@ -7081,14 +7586,12 @@ const initFlow = async (options) => {
7081
7586
  await sync({ buildId: void 0, origin: void 0, authToken: void 0 });
7082
7587
  await build({
7083
7588
  ...options,
7084
- ...projectTemplate && {
7085
- template: mapToTemplatesFromOptions([projectTemplate])
7086
- }
7589
+ template: projectTemplate ? mapToTemplatesFromOptions([projectTemplate]) : options.template
7087
7590
  });
7088
7591
  if (shouldInstallDeps === true) {
7089
7592
  const install = spinner();
7090
7593
  install.start("Installing dependencies");
7091
- await x$2("npm", ["install"]);
7594
+ await x$4("npm", ["install"]);
7092
7595
  install.stop("Installed dependencies");
7093
7596
  }
7094
7597
  log.message();
@@ -7119,7 +7622,7 @@ const getDeploymentInstructions = (deployTarget) => {
7119
7622
  }
7120
7623
  };
7121
7624
  const name = "webstudio";
7122
- const version = "0.209.0";
7625
+ const version = "0.212.0";
7123
7626
  const description = "Webstudio CLI";
7124
7627
  const author = "Webstudio <github@webstudio.is>";
7125
7628
  const homepage = "https://webstudio.is";
@@ -7168,14 +7671,14 @@ const dependencies = {
7168
7671
  };
7169
7672
  const devDependencies = {
7170
7673
  "@netlify/vite-plugin-react-router": "^1.0.0",
7171
- "@react-router/dev": "^7.3.0",
7172
- "@react-router/fs-routes": "^7.3.0",
7173
- "@remix-run/cloudflare": "^2.16.0",
7174
- "@remix-run/cloudflare-pages": "^2.16.0",
7175
- "@remix-run/dev": "^2.16.0",
7176
- "@remix-run/node": "^2.16.0",
7177
- "@remix-run/react": "^2.16.0",
7178
- "@remix-run/server-runtime": "^2.16.0",
7674
+ "@react-router/dev": "^7.4.0",
7675
+ "@react-router/fs-routes": "^7.4.0",
7676
+ "@remix-run/cloudflare": "^2.16.2",
7677
+ "@remix-run/cloudflare-pages": "^2.16.2",
7678
+ "@remix-run/dev": "^2.16.2",
7679
+ "@remix-run/node": "^2.16.2",
7680
+ "@remix-run/react": "^2.16.2",
7681
+ "@remix-run/server-runtime": "^2.16.2",
7179
7682
  "@types/react": "^18.2.70",
7180
7683
  "@types/react-dom": "^18.2.25",
7181
7684
  "@types/yargs": "^17.0.33",
@@ -7193,13 +7696,13 @@ const devDependencies = {
7193
7696
  "@webstudio-is/sdk-components-react-router": "workspace:*",
7194
7697
  "@webstudio-is/tsconfig": "workspace:*",
7195
7698
  h3: "^1.15.1",
7196
- ipx: "^3.0.1",
7699
+ ipx: "^3.0.3",
7197
7700
  prettier: "3.5.3",
7198
7701
  react: "18.3.0-canary-14898b6a9-20240318",
7199
7702
  "react-dom": "18.3.0-canary-14898b6a9-20240318",
7200
- "react-router": "^7.3.0",
7703
+ "react-router": "^7.4.0",
7201
7704
  "ts-expect": "^1.3.0",
7202
- vike: "^0.4.224",
7705
+ vike: "^0.4.227",
7203
7706
  vite: "^5.4.11",
7204
7707
  vitest: "^3.0.8",
7205
7708
  wrangler: "^3.63.2"