@webstudio-is/sdk-components-react-radix 0.220.0 → 0.221.0

package/lib/__generated__/tabs.props.js

@@ -30,10 +30,10 @@ Mainly so arrow navigation is done accordingly (left & right vs. up & down)
     options: ["horizontal", "vertical"]
   },
   value: {
+    description: "The value for the selected tab, if controlled",
     required: !1,
     control: "text",
-    type: "string",
-    description: "Current value of the element"
+    type: "string"
   }
 }, t = {
   loop: {

package/lib/accordion.js

@@ -1,37 +1,49 @@
 import { jsx as d } from "react/jsx-runtime";
-import { forwardRef as m } from "react";
-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 { forwardRef as m, useState as u, useEffect as f } from "react";
+import { Header as l, Trigger as g, Content as A, Root as p, Item as h } from "@radix-ui/react-accordion";
+import { getIndexWithinAncestorFromProps as P } from "@webstudio-is/sdk/runtime";
 import { getClosestInstance as a } from "@webstudio-is/react-sdk/runtime";
-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(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)
-      if (n.component === `${c}:AccordionContent`) {
-        const i = a(
+const S = m(({ defaultValue: e, ...o }, n) => {
+  const t = o.value ?? e ?? "", [r, c] = u(t);
+  return f(() => c(t), [t]), /* @__PURE__ */ d(
+    p,
+    {
+      ...o,
+      ref: n,
+      type: "single",
+      value: r,
+      onValueChange: c
+    }
+  );
+}), $ = m(({ value: e, ...o }, n) => {
+  const t = P(o);
+  return /* @__PURE__ */ d(h, { ref: n, value: e ?? t ?? "", ...o });
+}), k = l, w = g, y = A, i = "@webstudio-is/sdk-components-react-radix", H = {
+  onNavigatorSelect: (e, o) => {
+    var n;
+    for (const t of o.instancePath)
+      if (t.component === `${i}:AccordionContent`) {
+        const r = a(
           o.instancePath,
-          n,
-          `${c}:Accordion`
-        ), r = a(
+          t,
+          `${i}:Accordion`
+        ), c = a(
           o.instancePath,
-          n,
-          `${c}:AccordionItem`
+          t,
+          `${i}:AccordionItem`
         );
-        if (i && r) {
-          const s = t.getPropValue(r, "value") ?? ((e = t.indexesWithinAncestors.get(r.id)) == null ? void 0 : e.toString());
-          s && t.setMemoryProp(i, "value", s);
+        if (r && c) {
+          const s = e.getPropValue(c, "value") ?? ((n = e.indexesWithinAncestors.get(c.id)) == null ? void 0 : n.toString());
+          s && e.setMemoryProp(r, "value", s);
         }
       }
   }
 };
 export {
-  $ as Accordion,
+  S as Accordion,
   y as AccordionContent,
-  v as AccordionHeader,
-  k as AccordionItem,
+  k as AccordionHeader,
+  $ as AccordionItem,
   w as AccordionTrigger,
   H as hooksAccordion
 };

package/lib/accordion.template.js

@@ -1,7 +1,7 @@
 import { jsxs as r, jsx as e } from "react/jsx-runtime";
 import { $ as o, PlaceholderValue as s, css as t } from "@webstudio-is/template";
 import { radix as i } from "./shared/proxy.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 { height as h, width as m, transition as a, spacing as c, weights as g, fontSize as f, 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,
@@ -25,7 +25,7 @@ const n = (d, l) => /* @__PURE__ */ r(
             align-items: center;
             justify-content: between;
             padding: ${c[4]} 0;
-            font-weight: ${f.medium};
+            font-weight: ${g.medium};
             --accordion-trigger-icon-transform: 0deg;
             &:hover {
               text-decoration-line: underline;
@@ -61,7 +61,7 @@ const n = (d, l) => /* @__PURE__ */ r(
         {
           "ws:style": t`
           overflow: hidden;
-          font-size: ${g.sm};
+          font-size: ${f.sm};
           line-height: ${p.sm};
           transition: ${a.all};
           padding-bottom: ${c[4]};
@@ -75,7 +75,7 @@ const n = (d, l) => /* @__PURE__ */ r(
   category: "radix",
   description: "A vertically stacked set of interactive headings that each reveal an associated section of content. Clicking on the heading will open the item and close other items.",
   order: 3,
-  template: /* @__PURE__ */ r(i.Accordion, { collapsible: !0, defaultValue: "0", children: [
+  template: /* @__PURE__ */ r(i.Accordion, { collapsible: !0, value: "0", children: [
     n(
       "Is it accessible?",
       "Yes. It adheres to the WAI-ARIA design pattern."

package/lib/accordion.ws.js

@@ -1,10 +1,9 @@
 import { AccordionIcon as t, ItemIcon as n, HeaderIcon as r, TriggerIcon as c, ContentIcon as i } from "@webstudio-is/icons/svg";
-import { defaultStates as a } from "@webstudio-is/sdk";
-import { div as o, h3 as p, button as s } from "@webstudio-is/sdk/normalize.css";
+import { div as o, h3 as a, button as p } from "@webstudio-is/sdk/normalize.css";
 import { radix as e } from "./shared/meta.js";
 import { buttonReset as d } from "./shared/preset-styles.js";
-import { propsAccordion as l, propsAccordionItem as m, propsAccordionHeader as g, propsAccordionTrigger as A, propsAccordionContent as y } from "./__generated__/accordion.props.js";
-const x = {
+import { propsAccordion as s, propsAccordionItem as l, propsAccordionHeader as m, propsAccordionTrigger as g, propsAccordionContent as A } from "./__generated__/accordion.props.js";
+const v = {
   icon: t,
   contentModel: {
     category: "instance",
@@ -13,8 +12,8 @@ const x = {
   },
   presetStyle: { div: o },
   initialProps: ["value", "collapsible"],
-  props: l
-}, S = {
+  props: s
+}, x = {
   label: "Item",
   icon: n,
   indexWithinAncestor: e.Accordion,
@@ -25,8 +24,8 @@ const x = {
   },
   presetStyle: { div: o },
   initialProps: ["value"],
-  props: m
-}, C = {
+  props: l
+}, f = {
   label: "Item Header",
   icon: r,
   contentModel: {
@@ -36,7 +35,7 @@ const x = {
   },
   presetStyle: {
     h3: [
-      ...p,
+      ...a,
       {
         property: "margin-top",
         value: { type: "unit", unit: "px", value: 0 }
@@ -47,27 +46,20 @@ const x = {
       }
     ]
   },
-  props: g
-}, H = {
+  props: m
+}, C = {
   label: "Item Trigger",
   icon: c,
   contentModel: {
     category: "none",
     children: ["instance", "rich-text"]
   },
-  states: [
-    ...a,
-    {
-      category: "component-states",
-      label: "Open",
-      selector: "[data-state=open]"
-    }
-  ],
+  states: [{ label: "Open", selector: "[data-state=open]" }],
   presetStyle: {
-    button: [s, d].flat()
+    button: [p, d].flat()
   },
-  props: A
-}, M = {
+  props: g
+}, H = {
   label: "Item Content",
   icon: i,
   contentModel: {
@@ -77,12 +69,12 @@ const x = {
   presetStyle: {
     div: o
   },
-  props: y
+  props: A
 };
 export {
-  x as metaAccordion,
-  M as metaAccordionContent,
-  C as metaAccordionHeader,
-  S as metaAccordionItem,
-  H as metaAccordionTrigger
+  v as metaAccordion,
+  H as metaAccordionContent,
+  f as metaAccordionHeader,
+  x as metaAccordionItem,
+  C as metaAccordionTrigger
 };

package/lib/checkbox.js

@@ -1,23 +1,19 @@
-import { jsx as a } from "react/jsx-runtime";
-import { forwardRef as f } from "react";
-import { Indicator as d, Root as h } from "@radix-ui/react-checkbox";
-import { useControllableState as m } from "@radix-ui/react-use-controllable-state";
-const p = f(({ defaultChecked: e, ...o }, r) => {
-  const [t, c] = m({
-    prop: o.checked ?? e ?? !1,
-    defaultProp: !1
-  });
-  return /* @__PURE__ */ a(
-    h,
+import { jsx as f } from "react/jsx-runtime";
+import { forwardRef as h, useState as s, useEffect as k } from "react";
+import { Indicator as a, Root as m } from "@radix-ui/react-checkbox";
+const x = h(({ defaultChecked: c, ...o }, r) => {
+  const e = o.checked ?? c ?? !1, [n, t] = s(e);
+  return k(() => t(e), [e]), /* @__PURE__ */ f(
+    m,
     {
       ...o,
       ref: r,
-      checked: t,
-      onCheckedChange: (n) => c(n === !0)
+      checked: n,
+      onCheckedChange: (d) => t(d === !0)
     }
   );
-}), s = d;
+}), b = a;
 export {
-  p as Checkbox,
-  s as CheckboxIndicator
+  x as Checkbox,
+  b as CheckboxIndicator
 };

package/lib/checkbox.ws.js

@@ -1,47 +1,36 @@
-import { CheckboxCheckedIcon as t, TriggerIcon as o } from "@webstudio-is/icons/svg";
-import { defaultStates as e } from "@webstudio-is/sdk";
-import { button as c, span as n } from "@webstudio-is/sdk/normalize.css";
-import { radix as r } from "./shared/meta.js";
-import { buttonReset as a } from "./shared/preset-styles.js";
-import { propsCheckbox as s, propsCheckboxIndicator as i } from "./__generated__/checkbox.props.js";
-const b = {
-  icon: t,
+import { CheckboxCheckedIcon as e, TriggerIcon as t } from "@webstudio-is/icons/svg";
+import { button as o, span as c } from "@webstudio-is/sdk/normalize.css";
+import { radix as n } from "./shared/meta.js";
+import { buttonReset as r } from "./shared/preset-styles.js";
+import { propsCheckbox as a, propsCheckboxIndicator as s } from "./__generated__/checkbox.props.js";
+const m = {
+  icon: e,
   contentModel: {
     category: "instance",
     children: ["instance"],
-    descendants: [r.CheckboxIndicator]
+    descendants: [n.CheckboxIndicator]
   },
   states: [
-    ...e,
-    {
-      label: "Checked",
-      selector: "[data-state=checked]",
-      category: "component-states"
-    },
-    {
-      label: "Unchecked",
-      selector: "[data-state=unchecked]",
-      category: "component-states"
-    }
+    { label: "Checked", selector: "[data-state=checked]" },
+    { label: "Unchecked", selector: "[data-state=unchecked]" }
   ],
   presetStyle: {
-    button: [c, a].flat()
+    button: [o, r].flat()
   },
   initialProps: ["id", "class", "name", "value", "required", "checked"],
-  props: s
-}, x = {
-  icon: o,
+  props: a
+}, k = {
+  icon: t,
   contentModel: {
     category: "none",
     children: ["instance", "rich-text"]
   },
-  states: e,
   presetStyle: {
-    span: n
+    span: c
   },
-  props: i
+  props: s
 };
 export {
-  b as metaCheckbox,
-  x as metaCheckboxIndicator
+  m as metaCheckbox,
+  k as metaCheckboxIndicator
 };

package/lib/collapsible.js

@@ -1,37 +1,40 @@
-import { jsx as i } from "react/jsx-runtime";
-import { forwardRef as r, Children as a } from "react";
-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(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`) {
-        const n = l(
-          o.instancePath,
-          t,
+import { jsx as l } from "react/jsx-runtime";
+import { forwardRef as a, useState as c, useEffect as p, Children as f } from "react";
+import { Content as C, Root as m, Trigger as b } from "@radix-ui/react-collapsible";
+import { getClosestInstance as r } from "@webstudio-is/react-sdk/runtime";
+const P = a((n, t) => {
+  const o = n.open ?? !1, [e, i] = c(o);
+  return p(() => i(o), [o]), /* @__PURE__ */ l(m, { ...n, ref: t, open: e, onOpenChange: i });
+}), $ = a(({ children: n, ...t }, o) => {
+  const e = f.toArray(n)[0];
+  return /* @__PURE__ */ l(b, { asChild: !0, ref: o, ...t, children: e ?? /* @__PURE__ */ l("button", { children: "Add button" }) });
+}), x = C, s = "@webstudio-is/sdk-components-react-radix", y = {
+  onNavigatorSelect: (n, t) => {
+    for (const o of t.instancePath)
+      if (o.component === `${s}:CollapsibleContent`) {
+        const e = r(
+          t.instancePath,
+          o,
           `${s}:Collapsible`
         );
-        n && e.setMemoryProp(n, "open", !0);
+        e && n.setMemoryProp(e, "open", !0);
       }
   },
-  onNavigatorUnselect: (e, o) => {
-    for (const t of o.instancePath)
-      if (t.component === `${s}:CollapsibleContent`) {
-        const n = l(
-          o.instancePath,
-          t,
+  onNavigatorUnselect: (n, t) => {
+    for (const o of t.instancePath)
+      if (o.component === `${s}:CollapsibleContent`) {
+        const e = r(
+          t.instancePath,
+          o,
           `${s}:Collapsible`
         );
-        n && e.setMemoryProp(n, "open", void 0);
+        e && n.setMemoryProp(e, "open", void 0);
       }
   }
 };
 export {
-  h as Collapsible,
-  u as CollapsibleContent,
-  g as CollapsibleTrigger,
-  P as hooksCollapsible
+  P as Collapsible,
+  x as CollapsibleContent,
+  $ as CollapsibleTrigger,
+  y as hooksCollapsible
 };

package/lib/dialog.js

@@ -1,92 +1,86 @@
-import { jsx as i } from "react/jsx-runtime";
-import { forwardRef as c, useContext as h, useCallback as D, useEffect as m, Children as v, useRef as k } from "react";
+import { jsx as s } from "react/jsx-runtime";
+import v from "await-interaction-response";
+import { forwardRef as c, useContext as p, useState as k, useEffect as d, useCallback as w, Children as y, useRef as A } from "react";
 import * as a from "@radix-ui/react-dialog";
-import { ReactSdkContext as p, getClosestInstance as d } from "@webstudio-is/react-sdk/runtime";
-import { useControllableState as w } from "@radix-ui/react-use-controllable-state";
-import y from "await-interaction-response";
+import { ReactSdkContext as D, getClosestInstance as m } from "@webstudio-is/react-sdk/runtime";
 const C = (t) => {
   const { target: e } = t;
   return !(!(e instanceof HTMLAnchorElement) || e.hasAttribute("href") === !1 || e.href === "#" || e.hasAttribute("target") && e.target === "_blank" || t.ctrlKey || t.metaKey);
 }, O = c((t, e) => {
-  const { renderer: o } = h(p), [n, s] = w({
-    prop: t.open,
-    defaultProp: !1,
-    onChange: t.onOpenChange
-  }), r = D(
-    async (l) => {
-      await y(), s(l);
-    },
-    [s]
-  );
-  return m(() => {
-    if (o !== void 0 || n === !1)
+  const { renderer: n } = p(D), o = t.open ?? !1, [r, l] = k(o);
+  d(() => l(o), [o]);
+  const i = w(async (f) => {
+    await v(), l(f);
+  }, []);
+  return d(() => {
+    if (n !== void 0 || r === !1)
       return;
-    const l = (u) => {
-      const { target: g } = u;
-      if (C(u) !== !1) {
-        if (!(g instanceof HTMLAnchorElement))
+    const f = (g) => {
+      const { target: h } = g;
+      if (C(g) !== !1) {
+        if (!(h instanceof HTMLAnchorElement))
           return !1;
-        g.closest('[role="dialog"]') && (r == null || r(!1));
+        h.closest('[role="dialog"]') && (i == null || i(!1));
       }
     };
-    return window.addEventListener("click", l), () => window.removeEventListener("click", l);
-  }, [n, r, o]), /* @__PURE__ */ i(
+    return window.addEventListener("click", f), () => window.removeEventListener("click", f);
+  }, [r, i, n]), /* @__PURE__ */ s(
     a.Root,
     {
       ...t,
-      onOpenChange: r,
-      open: n
+      onOpenChange: i,
+      open: r
     }
   );
-}), x = c(({ children: t, ...e }, o) => {
-  const n = v.toArray(t)[0];
-  return /* @__PURE__ */ i(a.Trigger, { ref: o, asChild: !0, ...e, children: n ?? /* @__PURE__ */ i("button", { children: "Add button or link" }) });
-}), M = c((t, e) => /* @__PURE__ */ i(a.DialogPortal, { children: /* @__PURE__ */ i(a.Overlay, { ref: e, ...t }) })), R = c((t, e) => {
-  const o = k(!1), { renderer: n } = h(p);
-  return m(() => {
-    if (n !== void 0)
+}), x = c(({ children: t, ...e }, n) => {
+  const o = y.toArray(t)[0];
+  return /* @__PURE__ */ s(a.Trigger, { ref: n, asChild: !0, ...e, children: o ?? /* @__PURE__ */ s("button", { children: "Add button or link" }) });
+}), M = c((t, e) => /* @__PURE__ */ s(a.DialogPortal, { children: /* @__PURE__ */ s(a.Overlay, { ref: e, ...t }) })), R = c((t, e) => {
+  const n = A(!1), { renderer: o } = p(D);
+  return d(() => {
+    if (o !== void 0)
       return;
-    o.current = !1;
-    const s = (r) => {
-      const { target: l } = r;
-      if (C(r) !== !1) {
-        if (!(l instanceof HTMLAnchorElement))
+    n.current = !1;
+    const r = (l) => {
+      const { target: i } = l;
+      if (C(l) !== !1) {
+        if (!(i instanceof HTMLAnchorElement))
           return !1;
-        l.closest('[role="dialog"]') && (o.current = !0);
+        i.closest('[role="dialog"]') && (n.current = !0);
       }
     };
-    return window.addEventListener("click", s), () => window.removeEventListener("click", s);
-  }, [n]), /* @__PURE__ */ i(
+    return window.addEventListener("click", r), () => window.removeEventListener("click", r);
+  }, [o]), /* @__PURE__ */ s(
     a.Content,
     {
       ref: e,
       ...t,
-      onCloseAutoFocus: (s) => {
-        o.current && s.preventDefault();
+      onCloseAutoFocus: (r) => {
+        n.current && r.preventDefault();
       }
     }
   );
-}), $ = a.Close, A = "h1", N = c(({ tag: t = A, children: e, ...o }, n) => /* @__PURE__ */ i(a.DialogTitle, { asChild: !0, children: /* @__PURE__ */ i(t, { ref: n, ...o, children: e }) })), S = a.Description, f = "@webstudio-is/sdk-components-react-radix", F = {
+}), $ = a.Close, E = "h1", N = c(({ tag: t = E, children: e, ...n }, o) => /* @__PURE__ */ s(a.DialogTitle, { asChild: !0, children: /* @__PURE__ */ s(t, { ref: o, ...n, children: e }) })), S = a.Description, u = "@webstudio-is/sdk-components-react-radix", F = {
   onNavigatorUnselect: (t, e) => {
-    for (const o of e.instancePath)
-      if (o.component === `${f}:DialogOverlay`) {
-        const n = d(
+    for (const n of e.instancePath)
+      if (n.component === `${u}:DialogOverlay`) {
+        const o = m(
           e.instancePath,
-          o,
-          `${f}:Dialog`
+          n,
+          `${u}:Dialog`
         );
-        n && t.setMemoryProp(n, "open", void 0);
+        o && t.setMemoryProp(o, "open", void 0);
       }
   },
   onNavigatorSelect: (t, e) => {
-    for (const o of e.instancePath)
-      if (o.component === `${f}:DialogOverlay`) {
-        const n = d(
+    for (const n of e.instancePath)
+      if (n.component === `${u}:DialogOverlay`) {
+        const o = m(
           e.instancePath,
-          o,
-          `${f}:Dialog`
+          n,
+          `${u}:Dialog`
         );
-        n && t.setMemoryProp(n, "open", !0);
+        o && t.setMemoryProp(o, "open", !0);
       }
   }
 };

package/lib/dialog.ws.js

@@ -1,17 +1,16 @@
-import { DialogIcon as t, TriggerIcon as n, OverlayIcon as i, ContentIcon as r, ButtonElementIcon as c, HeadingIcon as a, TextIcon as l } from "@webstudio-is/icons/svg";
-import { defaultStates as s } from "@webstudio-is/sdk";
-import { div as e, button as p, h2 as g, p as d } from "@webstudio-is/sdk/normalize.css";
+import { DialogIcon as t, TriggerIcon as n, OverlayIcon as i, ContentIcon as r, ButtonElementIcon as c, HeadingIcon as l, TextIcon as a } from "@webstudio-is/icons/svg";
+import { div as e, button as s, h2 as p, p as g } from "@webstudio-is/sdk/normalize.css";
 import { radix as o } from "./shared/meta.js";
-import { propsDialog as D, propsDialogTrigger as m, propsDialogOverlay as y, propsDialogContent as h, propsDialogClose as f, propsDialogTitle as C, propsDialogDescription as T } from "./__generated__/dialog.props.js";
+import { propsDialog as D, propsDialogTrigger as d, propsDialogOverlay as m, propsDialogContent as y, propsDialogClose as h, propsDialogTitle as C, propsDialogDescription as T } from "./__generated__/dialog.props.js";
 import { buttonReset as I } from "./shared/preset-styles.js";
-const O = {
+const S = {
   icon: n,
   contentModel: {
     category: "none",
     children: ["instance"]
   },
-  props: m
-}, B = {
+  props: d
+}, b = {
   icon: i,
   contentModel: {
     category: "none",
@@ -19,8 +18,8 @@ const O = {
     descendants: [o.DialogContent]
   },
   presetStyle: { div: e },
-  props: y
-}, E = {
+  props: m
+}, O = {
   icon: r,
   contentModel: {
     category: "none",
@@ -32,50 +31,50 @@ const O = {
     ]
   },
   presetStyle: { div: e },
-  props: h
-}, H = {
-  icon: a,
+  props: y
+}, B = {
+  icon: l,
   contentModel: {
     category: "none",
     children: ["instance", "rich-text"]
   },
-  presetStyle: { h2: g },
+  presetStyle: { h2: p },
   props: C
-}, R = {
-  icon: l,
+}, E = {
+  icon: a,
   contentModel: {
     category: "none",
     children: ["instance", "rich-text"]
   },
-  presetStyle: { p: d },
+  presetStyle: { p: g },
   props: T
-}, j = {
+}, H = {
   icon: c,
   label: "Close Button",
   contentModel: {
     category: "none",
     children: ["instance", "rich-text"]
   },
-  states: s,
   presetStyle: {
-    button: [I, p].flat()
+    button: [I, s].flat()
   },
-  props: f
-}, k = {
+  props: h
+}, P = {
   icon: t,
   contentModel: {
     category: "instance",
     children: ["instance"],
     descendants: [o.DialogTrigger, o.DialogOverlay]
   },
+  initialProps: ["open"],
   props: D
 };
 export {
-  k as metaDialog,
-  j as metaDialogClose,
-  E as metaDialogContent,
-  R as metaDialogDescription,
-  B as metaDialogOverlay,
-  H as metaDialogTitle,
-  O as metaDialogTrigger
+  P as metaDialog,
+  H as metaDialogClose,
+  O as metaDialogContent,
+  E as metaDialogDescription,
+  b as metaDialogOverlay,
+  B as metaDialogTitle,
+  S as metaDialogTrigger
 };