@webstudio-is/sdk-components-react-radix 0.218.0 → 0.219.0

package/lib/__generated__/tooltip.props.js

@@ -17,20 +17,12 @@ const e = {
     type: "boolean",
     description: "Show or hide the content of this component on the canvas. This will not affect the initial state of the component."
   }
-}, t = {}, r = {
-  about: { required: !1, control: "text", type: "string" },
-  accessKey: {
-    required: !1,
-    control: "text",
-    type: "string",
-    description: "Keyboard shortcut to activate or add focus to the element."
-  },
+}, o = {}, t = {
   align: {
     required: !1,
     control: "radio",
     type: "string",
-    options: ["center", "start", "end"],
-    description: "Specifies the horizontal alignment of the element."
+    options: ["center", "start", "end"]
   },
   alignOffset: {
     required: !1,
@@ -39,131 +31,19 @@ const e = {
     description: "The offset in pixels from the “start“ or “end“ alignment options."
   },
   "aria-label": {
-    description: "Provides the accessible name that describes an interactive element if no other accessible name exists, for example in a button that contains an image with no text.",
+    description: "A more descriptive label for accessibility purpose",
     required: !1,
     control: "text",
     type: "string"
   },
   arrowPadding: { required: !1, control: "number", type: "number" },
-  autoCapitalize: {
-    required: !1,
-    control: "text",
-    type: "string",
-    description: "Sets whether input is automatically capitalized when entered by user."
-  },
-  autoCorrect: { required: !1, control: "text", type: "string" },
-  autoFocus: {
-    required: !1,
-    control: "boolean",
-    type: "boolean",
-    description: "Indicates that an element should be focused on page load, or when its parent dialog is displayed."
-  },
-  autoSave: { required: !1, control: "text", type: "string" },
   avoidCollisions: { required: !1, control: "boolean", type: "boolean" },
-  className: { required: !1, control: "text", type: "string" },
-  color: {
-    required: !1,
-    control: "color",
-    type: "string",
-    description: "This attribute sets the text color using either a named color or a  color specified in the hexadecimal #RRGGBB format. Note: This is a legacy attribute. Please use the CSS color property instead."
-  },
-  content: {
-    required: !1,
-    control: "text",
-    type: "string",
-    description: "A value associated with http-equiv orname depending on the context."
-  },
-  contextMenu: {
-    required: !1,
-    control: "text",
-    type: "string",
-    description: "Defines the ID of a menu element which willserve as the element's context menu."
-  },
-  datatype: { required: !1, control: "text", type: "string" },
-  defaultValue: { required: !1, control: "text", type: "string" },
-  dir: {
-    required: !1,
-    control: "text",
-    type: "string",
-    description: "Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left)"
-  },
-  draggable: {
-    required: !1,
-    control: "boolean",
-    type: "boolean",
-    description: "Defines whether the element can be dragged."
-  },
-  hidden: {
-    required: !1,
-    control: "boolean",
-    type: "boolean",
-    description: "Prevents rendering of given element, while keeping child elements, e.g. script elements, active."
-  },
   hideWhenDetached: {
     required: !1,
     control: "boolean",
     type: "boolean",
     defaultValue: !0
   },
-  id: {
-    required: !1,
-    control: "text",
-    type: "string",
-    description: "Often used with CSS to style a specific element. The value of this attribute must be unique."
-  },
-  inputMode: {
-    description: "Hints at the type of data that might be entered by the user while editing the element or its contents",
-    required: !1,
-    control: "select",
-    type: "string",
-    options: [
-      "search",
-      "text",
-      "none",
-      "tel",
-      "url",
-      "email",
-      "numeric",
-      "decimal"
-    ]
-  },
-  is: {
-    description: "Specify that a standard HTML element should behave like a defined custom built-in element",
-    required: !1,
-    control: "text",
-    type: "string"
-  },
-  itemID: { required: !1, control: "text", type: "string" },
-  itemProp: { required: !1, control: "text", type: "string" },
-  itemRef: { required: !1, control: "text", type: "string" },
-  itemScope: { required: !1, control: "boolean", type: "boolean" },
-  itemType: { required: !1, control: "text", type: "string" },
-  lang: {
-    required: !1,
-    control: "text",
-    type: "string",
-    description: "Defines the language used in the element."
-  },
-  nonce: { required: !1, control: "text", type: "string" },
-  prefix: { required: !1, control: "text", type: "string" },
-  property: { required: !1, control: "text", type: "string" },
-  radioGroup: { required: !1, control: "text", type: "string" },
-  rel: {
-    required: !1,
-    control: "text",
-    type: "string",
-    description: "Specifies the relationship of the target object to the link object."
-  },
-  resource: { required: !1, control: "text", type: "string" },
-  results: { required: !1, control: "number", type: "number" },
-  rev: { required: !1, control: "text", type: "string" },
-  role: {
-    required: !1,
-    control: "text",
-    type: "string",
-    description: "Defines an explicit role for an element for use by assistive technologies."
-  },
-  security: { required: !1, control: "text", type: "string" },
   side: {
     required: !1,
     control: "select",
@@ -178,70 +58,21 @@ const e = {
     defaultValue: 4,
     description: "The distance in pixels between the Content and the Trigger."
   },
-  slot: {
-    required: !1,
-    control: "text",
-    type: "string",
-    description: "Assigns a slot in a shadow DOM shadow tree to an element."
-  },
-  spellCheck: {
-    required: !1,
-    control: "boolean",
-    type: "boolean",
-    description: "Indicates whether spell checking is allowed for the element."
-  },
   sticky: {
     required: !1,
     control: "radio",
     type: "string",
     options: ["partial", "always"]
   },
-  suppressContentEditableWarning: {
-    required: !1,
-    control: "boolean",
-    type: "boolean"
-  },
-  suppressHydrationWarning: {
-    required: !1,
-    control: "boolean",
-    type: "boolean"
-  },
-  tabIndex: {
-    required: !1,
-    control: "number",
-    type: "number",
-    description: "Overrides the browser's default tab order and follows the one specified instead."
-  },
-  title: {
-    required: !1,
-    control: "text",
-    type: "string",
-    description: "Text to be displayed in a tooltip when hovering over the element."
-  },
-  translate: {
-    required: !1,
-    control: "radio",
-    type: "string",
-    options: ["yes", "no"],
-    description: "Specify whether an element's attribute values and the values of its text node children are to be translated when the page is localized, or whether to leave them unchanged."
-  },
-  typeof: { required: !1, control: "text", type: "string" },
-  unselectable: {
-    required: !1,
-    control: "radio",
-    type: "string",
-    options: ["on", "off"]
-  },
   updatePositionStrategy: {
     required: !1,
     control: "radio",
     type: "string",
     options: ["always", "optimized"]
-  },
-  vocab: { required: !1, control: "text", type: "string" }
+  }
 };
 export {
   e as propsTooltip,
-  r as propsTooltipContent,
-  t as propsTooltipTrigger
+  t as propsTooltipContent,
+  o as propsTooltipTrigger
 };

package/lib/accordion.js

@@ -1,12 +1,12 @@
 import { jsx as d } from "react/jsx-runtime";
 import { forwardRef as m } from "react";
-import { Root as f, Item as g, Header as p, Trigger as A, Content as l } from "@radix-ui/react-accordion";
+import { Header as f, Trigger as g, Content as p, Root as A, Item as l } from "@radix-ui/react-accordion";
 import { getIndexWithinAncestorFromProps as u } from "@webstudio-is/sdk/runtime";
 import { getClosestInstance as a } from "@webstudio-is/react-sdk/runtime";
-const $ = m((t, o) => /* @__PURE__ */ d(f, { ref: o, type: "single", ...t })), k = m(({ value: t, ...o }, e) => {
+const $ = m((t, o) => /* @__PURE__ */ d(A, { ref: o, type: "single", ...t })), k = m(({ value: t, ...o }, e) => {
   const n = u(o);
-  return /* @__PURE__ */ d(g, { ref: e, value: t ?? n ?? "", ...o });
-}), v = p, w = A, y = l, c = "@webstudio-is/sdk-components-react-radix", H = {
+  return /* @__PURE__ */ d(l, { ref: e, value: t ?? n ?? "", ...o });
+}), v = f, w = g, y = p, c = "@webstudio-is/sdk-components-react-radix", H = {
   onNavigatorSelect: (t, o) => {
     var e;
     for (const n of o.instancePath)

package/lib/accordion.template.js

@@ -1,13 +1,13 @@
 import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { css as t, $ as o, PlaceholderValue as s } from "@webstudio-is/template";
+import { $ as o, PlaceholderValue as s, css as t } from "@webstudio-is/template";
 import { radix as i } from "./shared/proxy.js";
-import { borderWidth as h, colors as m, spacing as a, weights as f, height as g, width as p, transition as c, fontSize as w, fontSizeLineHeight as y } from "./shared/theme.js";
+import { height as h, width as m, transition as a, spacing as c, weights as f, fontSize as g, fontSizeLineHeight as p, borderWidth as w, colors as y } from "./shared/theme.js";
 import { ChevronDownIcon as b } from "@webstudio-is/icons/svg";
 const n = (d, l) => /* @__PURE__ */ r(
   i.AccordionItem,
   {
     "ws:style": t`
-        border-bottom: ${h.DEFAULT} solid ${m.border};
+        border-bottom: ${w.DEFAULT} solid ${y.border};
       `,
     children: [
       /* @__PURE__ */ e(
@@ -24,7 +24,7 @@ const n = (d, l) => /* @__PURE__ */ r(
             flex: 1 1 0;
             align-items: center;
             justify-content: between;
-            padding: ${a[4]} 0;
+            padding: ${c[4]} 0;
             font-weight: ${f.medium};
             --accordion-trigger-icon-transform: 0deg;
             &:hover {
@@ -41,11 +41,11 @@ const n = (d, l) => /* @__PURE__ */ r(
                   {
                     "ws:label": "Icon Container",
                     "ws:style": t`
-              rotate: --accordion-trigger-icon-transform;
-              height: ${g[4]};
-              width: ${p[4]};
+              rotate: var(--accordion-trigger-icon-transform);
+              height: ${h[4]};
+              width: ${m[4]};
               flex-shrink: 0;
-              transition: ${c.all};
+              transition: ${a.all};
               transition-duration: 200ms;
             `,
                     children: /* @__PURE__ */ e(o.HtmlEmbed, { "ws:label": "Chevron Icon", code: b })
@@ -61,10 +61,10 @@ const n = (d, l) => /* @__PURE__ */ r(
         {
           "ws:style": t`
           overflow: hidden;
-          font-size: ${w.sm};
-          line-height: ${y.sm};
-          transition: ${c.all};
-          padding-bottom: ${a[4]};
+          font-size: ${g.sm};
+          line-height: ${p.sm};
+          transition: ${a.all};
+          padding-bottom: ${c[4]};
         `,
           children: new s(l)
         }

package/lib/checkbox.js

@@ -1,7 +1,7 @@
 import { jsx as c } from "react/jsx-runtime";
 import { forwardRef as f } from "react";
-import { Root as m, Indicator as d } from "@radix-ui/react-checkbox";
-const p = f(({ checked: o, defaultChecked: r, ...t }, e) => /* @__PURE__ */ c(m, { ...t, ref: e, defaultChecked: o ?? r })), x = d;
+import { Indicator as m, Root as d } from "@radix-ui/react-checkbox";
+const p = f(({ checked: o, defaultChecked: r, ...t }, e) => /* @__PURE__ */ c(d, { ...t, ref: e, defaultChecked: o ?? r })), x = m;
 export {
   p as Checkbox,
   x as CheckboxIndicator

package/lib/checkbox.template.js

@@ -1,8 +1,8 @@
 import { jsxs as c, jsx as e } from "react/jsx-runtime";
 import { CheckMarkIcon as a } from "@webstudio-is/icons/svg";
-import { css as o, $ as t, PlaceholderValue as l } from "@webstudio-is/template";
+import { $ as t, css as o, PlaceholderValue as l } from "@webstudio-is/template";
 import { radix as r } from "./shared/proxy.js";
-import { spacing as s, height as d, width as n, borderRadius as h, borderWidth as b, colors as i, boxShadow as m, opacity as p } from "./shared/theme.js";
+import { height as s, width as d, borderRadius as n, borderWidth as h, colors as i, boxShadow as b, opacity as m, spacing as p } from "./shared/theme.js";
 const y = {
   category: "radix",
   description: "Use within a form to allow your users to toggle between checked and not checked. Group checkboxes by matching their “Name” properties. Unlike radios, any number of checkboxes in a group can be checked.",
@@ -13,7 +13,7 @@ const y = {
       "ws:label": "Checkbox Field",
       "ws:style": o`
         display: flex;
-        gap: ${s[2]};
+        gap: ${p[2]};
         align-items: center;
       `,
       children: [
@@ -21,18 +21,18 @@ const y = {
           r.Checkbox,
           {
             "ws:style": o`
-          height: ${d[4]};
-          width: ${n[4]};
+          height: ${s[4]};
+          width: ${d[4]};
           flex-shrink: 0;
-          border-radius: ${h.sm};
-          border: ${b.DEFAULT} solid ${i.primary};
+          border-radius: ${n.sm};
+          border: ${h.DEFAULT} solid ${i.primary};
           &:focus-visible {
             outline: none;
-            box-shadow: ${m.ring};
+            box-shadow: ${b.ring};
           }
           &:disabled {
             cursor: not-allowed;
-            opacity: ${p[50]};
+            opacity: ${m[50]};
           }
           &[data-state="checked"] {
             background-color: ${i.primary};

package/lib/collapsible.js

@@ -1,11 +1,11 @@
 import { jsx as i } from "react/jsx-runtime";
 import { forwardRef as r, Children as a } from "react";
-import { Root as c, Trigger as p, Content as C } from "@radix-ui/react-collapsible";
+import { Root as c, Content as p, Trigger as C } from "@radix-ui/react-collapsible";
 import { getClosestInstance as l } from "@webstudio-is/react-sdk/runtime";
 const h = c, g = r(({ children: e, ...o }, t) => {
   const n = a.toArray(e)[0];
-  return /* @__PURE__ */ i(p, { asChild: !0, ref: t, ...o, children: n ?? /* @__PURE__ */ i("button", { children: "Add button" }) });
-}), u = C, s = "@webstudio-is/sdk-components-react-radix", P = {
+  return /* @__PURE__ */ i(C, { asChild: !0, ref: t, ...o, children: n ?? /* @__PURE__ */ i("button", { children: "Add button" }) });
+}), u = p, s = "@webstudio-is/sdk-components-react-radix", P = {
   onNavigatorSelect: (e, o) => {
     for (const t of o.instancePath)
       if (t.component === `${s}:CollapsibleContent`) {

package/lib/dialog.template.js

@@ -2,7 +2,7 @@ import { jsxs as n, jsx as e } from "react/jsx-runtime";
 import { LargeXIcon as p } from "@webstudio-is/icons/svg";
 import { $ as l, PlaceholderValue as r, css as i } from "@webstudio-is/template";
 import { radix as o } from "./shared/proxy.js";
-import { zIndex as d, blur as m, width as u, spacing as t, maxWidth as w, borderWidth as $, colors as a, boxShadow as s, fontSize as c, lineHeight as y, letterSpacing as b, fontSizeLineHeight as x, borderRadius as f, opacity as g, height as h } from "./shared/theme.js";
+import { fontSize as d, lineHeight as m, letterSpacing as u, fontSizeLineHeight as w, colors as a, spacing as t, borderRadius as $, opacity as s, height as c, boxShadow as g, width as y, zIndex as h, maxWidth as b, borderWidth as x, blur as f } from "./shared/theme.js";
 import { getButtonStyle as D } from "./shared/styles.js";
 const S = {
   category: "radix",
@@ -16,9 +16,9 @@ const S = {
         "ws:style": i`
           position: fixed;
           inset: 0;
-          z-index: ${d[50]};
+          z-index: ${h[50]};
           background-color: rgb(255 255 255 / 0.8);
-          backdrop-filter: ${m.sm};
+          backdrop-filter: ${f.sm};
           /* To allow positioning Content */
           display: flex;
           overflow: auto;
@@ -27,17 +27,17 @@ const S = {
           o.DialogContent,
           {
             "ws:style": i`
-            width: ${u.full};
-            z-index: ${d[50]};
+            width: ${y.full};
+            z-index: ${h[50]};
             display: flex;
             flex-direction: column;
             gap: ${t[4]};
             margin: auto;
-            max-width: ${w.lg};
-            border: ${$.DEFAULT} solid ${a.border};
+            max-width: ${b.lg};
+            border: ${x.DEFAULT} solid ${a.border};
             background-color: ${a.background};
             padding: ${t[6]};
-            box-shadow: ${s.lg};
+            box-shadow: ${g.lg};
             position: relative;
           `,
             children: [
@@ -55,9 +55,9 @@ const S = {
                       o.DialogTitle,
                       {
                         "ws:style": i`
-                font-size: ${c.lg};
-                line-height: ${y.none};
-                letter-spacing: ${b.tight};
+                font-size: ${d.lg};
+                line-height: ${m.none};
+                letter-spacing: ${u.tight};
                 margin: 0;
               `,
                         children: new r("Dialog Title you can edit")
@@ -67,8 +67,8 @@ const S = {
                       o.DialogDescription,
                       {
                         "ws:style": i`
-                font-size: ${c.sm};
-                line-height: ${x.sm};
+                font-size: ${d.sm};
+                line-height: ${w.sm};
                 color: ${a.mutedForeground};
                 margin: 0;
               `,
@@ -87,21 +87,21 @@ const S = {
               position: absolute;
               right: ${t[4]};
               top: ${t[4]};
-              border-radius: ${f.sm};
-              opacity: ${g[70]};
+              border-radius: ${$.sm};
+              opacity: ${s[70]};
               display: flex;
               align-items: center;
               justify-content: center;
-              height: ${h[4]};
-              width: ${h[4]};
+              height: ${c[4]};
+              width: ${c[4]};
               border: 0;
               background-color: transparent;
               outline: none;
               &:hover {
-                opacity: ${g[100]};
+                opacity: ${s[100]};
               }
               &:focus-visible {
-                box-shadow: ${s.ring};
+                box-shadow: ${g.ring};
               }
             `,
                   children: /* @__PURE__ */ e(l.HtmlEmbed, { "ws:label": "Close Icon", code: p })

package/lib/dialog.ws.js

@@ -1,17 +1,17 @@
-import { TriggerIcon as e, OverlayIcon as n, ContentIcon as i, HeadingIcon as r, TextIcon as a, ButtonElementIcon as s, DialogIcon as l } from "@webstudio-is/icons/svg";
+import { DialogIcon as e, TriggerIcon as n, OverlayIcon as i, ContentIcon as r, ButtonElementIcon as a, HeadingIcon as s, TextIcon as l } from "@webstudio-is/icons/svg";
 import { defaultStates as c } from "@webstudio-is/sdk";
-import { div as t, h2 as p, p as g, button as D } from "@webstudio-is/sdk/normalize.css";
+import { div as t, button as p, h2 as g, p as D } from "@webstudio-is/sdk/normalize.css";
 import { radix as o } from "./shared/meta.js";
-import { propsDialog as d, propsDialogTrigger as m, propsDialogContent as y, propsDialogOverlay as M, propsDialogClose as h, propsDialogTitle as C, propsDialogDescription as T } from "./__generated__/dialog.props.js";
+import { propsDialog as d, propsDialogTrigger as m, propsDialogOverlay as y, propsDialogContent as M, propsDialogClose as h, propsDialogTitle as C, propsDialogDescription as T } from "./__generated__/dialog.props.js";
 import { buttonReset as f } from "./shared/preset-styles.js";
 const O = {
-  icon: e,
+  icon: n,
   contentModel: {
     category: "none",
     children: ["instance"]
   }
 }, b = {
-  icon: n,
+  icon: i,
   contentModel: {
     category: "none",
     children: ["instance"],
@@ -21,7 +21,7 @@ const O = {
     div: t
   }
 }, B = {
-  icon: i,
+  icon: r,
   contentModel: {
     category: "none",
     children: ["instance"],
@@ -35,25 +35,25 @@ const O = {
     div: t
   }
 }, E = {
-  icon: r,
+  icon: s,
   contentModel: {
     category: "none",
     children: ["instance", "rich-text"]
   },
   presetStyle: {
-    h2: p
+    h2: g
   }
 }, H = {
-  icon: a,
+  icon: l,
   contentModel: {
     category: "none",
     children: ["instance", "rich-text"]
   },
   presetStyle: {
-    p: g
+    p: D
   }
 }, R = {
-  icon: s,
+  icon: a,
   label: "Close Button",
   contentModel: {
     category: "none",
@@ -61,10 +61,10 @@ const O = {
   },
   states: c,
   presetStyle: {
-    button: [f, D].flat()
+    button: [f, p].flat()
   }
 }, j = {
-  icon: l,
+  icon: e,
   contentModel: {
     category: "instance",
     children: ["instance"],
@@ -76,10 +76,10 @@ const O = {
 }, q = {
   props: m
 }, w = {
-  props: y,
+  props: M,
   initialProps: []
 }, z = {
-  props: M,
+  props: y,
   initialProps: []
 }, A = {
   props: h,

package/lib/label.template.js

@@ -1,5 +1,5 @@
 import { jsx as e } from "react/jsx-runtime";
-import { css as t, PlaceholderValue as o } from "@webstudio-is/template";
+import { PlaceholderValue as t, css as o } from "@webstudio-is/template";
 import { radix as i } from "./shared/proxy.js";
 import { fontSize as r, lineHeight as n, weights as h } from "./shared/theme.js";
 const p = {
@@ -9,12 +9,12 @@ const p = {
   template: /* @__PURE__ */ e(
     i.Label,
     {
-      "ws:style": t`
+      "ws:style": o`
         font-size: ${r.sm};
         line-height: ${n.none};
         font-weight: ${h.medium};
       `,
-      children: new o("Form Label")
+      children: new t("Form Label")
     }
   )
 };

package/lib/navigation-menu.template.js

@@ -1,9 +1,9 @@
 import { jsxs as s, jsx as e } from "react/jsx-runtime";
 import { ChevronDownIcon as w } from "@webstudio-is/icons/svg";
-import { $ as n, css as t, PlaceholderValue as l } from "@webstudio-is/template";
+import { css as t, $ as n, PlaceholderValue as l } from "@webstudio-is/template";
 import { radix as r } from "./shared/proxy.js";
 import { getButtonStyle as u } from "./shared/styles.js";
-import { spacing as i, colors as a, width as h, borderRadius as p, borderWidth as v, boxShadow as b, height as y, transition as x, lineHeight as c, fontSize as m, weights as $ } from "./shared/theme.js";
+import { spacing as i, borderRadius as h, borderWidth as v, colors as a, boxShadow as b, height as y, width as p, transition as x, fontSize as m, weights as $, lineHeight as c } from "./shared/theme.js";
 const k = [
   {
     title: "Sheet",
@@ -60,7 +60,7 @@ const k = [
         flex-direction: column;
         user-select: none;
         gap: ${i[1]};
-        border-radius: ${p.md};
+        border-radius: ${h.md};
         padding: ${i[3]};
         line-height: ${c.none};
         text-decoration-line: none;
@@ -106,7 +106,7 @@ const k = [
   {
     "ws:label": "Flex Column",
     "ws:style": t`
-      width: ${h[64]};
+      width: ${p[64]};
       display: flex;
       gap: ${i[4]};
       flex-direction: column;
@@ -129,8 +129,8 @@ const k = [
           "ws:style": t`
         background-color: ${a.border};
         padding: ${i[4]};
-        width: ${h[48]};
-        border-radius: ${p.md};
+        width: ${p[48]};
+        border-radius: ${h.md};
       `,
           children: new l("")
         }
@@ -174,7 +174,7 @@ const k = [
               margin-left: ${i[1]};
               rotate: var(--navigation-menu-trigger-icon-transform);
               height: ${y[4]};
-              width: ${h[4]};
+              width: ${p[4]};
               flex-shrink: 0;
               transition: ${x.all};
               transition-duration: 200ms;
@@ -262,7 +262,7 @@ const k = [
             position: relative;
             margin-top: ${i[1.5]};
             overflow: hidden;
-            border-radius: ${p.md};
+            border-radius: ${h.md};
             border: ${v.DEFAULT} solid ${a.border};
             background-color: ${a.popover};
             color: ${a.popoverForeground};

package/lib/navigation-menu.ws.js

@@ -1,7 +1,7 @@
 import { NavigationMenuIcon as t, ListIcon as o, ListItemIcon as i, TriggerIcon as a, ContentIcon as r, BoxIcon as s, ViewportIcon as c } from "@webstudio-is/icons/svg";
 import { div as e } from "@webstudio-is/sdk/normalize.css";
 import { radix as n } from "./shared/meta.js";
-import { propsNavigationMenu as p, propsNavigationMenuItem as g, propsNavigationMenuTrigger as M, propsNavigationMenuContent as u, propsNavigationMenuLink as l, propsNavigationMenuList as v, propsNavigationMenuViewport as N } from "./__generated__/navigation-menu.props.js";
+import { propsNavigationMenu as p, propsNavigationMenuList as g, propsNavigationMenuItem as M, propsNavigationMenuTrigger as u, propsNavigationMenuContent as l, propsNavigationMenuLink as v, propsNavigationMenuViewport as N } from "./__generated__/navigation-menu.props.js";
 const y = {
   icon: t,
   contentModel: {
@@ -77,15 +77,15 @@ const y = {
 }, V = {
   props: p
 }, S = {
-  props: g
-}, f = {
   props: M
-}, x = {
+}, f = {
   props: u
-}, A = {
+}, x = {
   props: l
-}, W = {
+}, A = {
   props: v
+}, W = {
+  props: g
 }, B = {
   props: N
 };