@webstudio-is/sdk-components-react-radix 0.220.0 → 0.222.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.
@@ -30,10 +30,10 @@ Mainly so arrow navigation is done accordingly (left & right vs. up & down)
30
30
  options: ["horizontal", "vertical"]
31
31
  },
32
32
  value: {
33
+ description: "The value for the selected tab, if controlled",
33
34
  required: !1,
34
35
  control: "text",
35
- type: "string",
36
- description: "Current value of the element"
36
+ type: "string"
37
37
  }
38
38
  }, t = {
39
39
  loop: {
package/lib/accordion.js CHANGED
@@ -1,37 +1,49 @@
1
1
  import { jsx as d } from "react/jsx-runtime";
2
- import { forwardRef as m } from "react";
3
- import { Header as f, Trigger as g, Content as p, Root as A, Item as l } from "@radix-ui/react-accordion";
4
- import { getIndexWithinAncestorFromProps as u } from "@webstudio-is/sdk/runtime";
2
+ import { forwardRef as m, useState as u, useEffect as f } from "react";
3
+ import { Header as l, Trigger as g, Content as A, Root as p, Item as h } from "@radix-ui/react-accordion";
4
+ import { getIndexWithinAncestorFromProps as P } from "@webstudio-is/sdk/runtime";
5
5
  import { getClosestInstance as a } from "@webstudio-is/react-sdk/runtime";
6
- const $ = m((t, o) => /* @__PURE__ */ d(A, { ref: o, type: "single", ...t })), k = m(({ value: t, ...o }, e) => {
7
- const n = u(o);
8
- return /* @__PURE__ */ d(l, { ref: e, value: t ?? n ?? "", ...o });
9
- }), v = f, w = g, y = p, c = "@webstudio-is/sdk-components-react-radix", H = {
10
- onNavigatorSelect: (t, o) => {
11
- var e;
12
- for (const n of o.instancePath)
13
- if (n.component === `${c}:AccordionContent`) {
14
- const i = a(
6
+ const S = m(({ defaultValue: e, ...o }, n) => {
7
+ const t = o.value ?? e ?? "", [r, c] = u(t);
8
+ return f(() => c(t), [t]), /* @__PURE__ */ d(
9
+ p,
10
+ {
11
+ ...o,
12
+ ref: n,
13
+ type: "single",
14
+ value: r,
15
+ onValueChange: c
16
+ }
17
+ );
18
+ }), $ = m(({ value: e, ...o }, n) => {
19
+ const t = P(o);
20
+ return /* @__PURE__ */ d(h, { ref: n, value: e ?? t ?? "", ...o });
21
+ }), k = l, w = g, y = A, i = "@webstudio-is/sdk-components-react-radix", H = {
22
+ onNavigatorSelect: (e, o) => {
23
+ var n;
24
+ for (const t of o.instancePath)
25
+ if (t.component === `${i}:AccordionContent`) {
26
+ const r = a(
15
27
  o.instancePath,
16
- n,
17
- `${c}:Accordion`
18
- ), r = a(
28
+ t,
29
+ `${i}:Accordion`
30
+ ), c = a(
19
31
  o.instancePath,
20
- n,
21
- `${c}:AccordionItem`
32
+ t,
33
+ `${i}:AccordionItem`
22
34
  );
23
- if (i && r) {
24
- const s = t.getPropValue(r, "value") ?? ((e = t.indexesWithinAncestors.get(r.id)) == null ? void 0 : e.toString());
25
- s && t.setMemoryProp(i, "value", s);
35
+ if (r && c) {
36
+ const s = e.getPropValue(c, "value") ?? ((n = e.indexesWithinAncestors.get(c.id)) == null ? void 0 : n.toString());
37
+ s && e.setMemoryProp(r, "value", s);
26
38
  }
27
39
  }
28
40
  }
29
41
  };
30
42
  export {
31
- $ as Accordion,
43
+ S as Accordion,
32
44
  y as AccordionContent,
33
- v as AccordionHeader,
34
- k as AccordionItem,
45
+ k as AccordionHeader,
46
+ $ as AccordionItem,
35
47
  w as AccordionTrigger,
36
48
  H as hooksAccordion
37
49
  };
@@ -1,7 +1,7 @@
1
1
  import { jsxs as r, jsx as e } from "react/jsx-runtime";
2
2
  import { $ as o, PlaceholderValue as s, css as t } from "@webstudio-is/template";
3
3
  import { radix as i } from "./shared/proxy.js";
4
- 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";
4
+ 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";
5
5
  import { ChevronDownIcon as b } from "@webstudio-is/icons/svg";
6
6
  const n = (d, l) => /* @__PURE__ */ r(
7
7
  i.AccordionItem,
@@ -25,7 +25,7 @@ const n = (d, l) => /* @__PURE__ */ r(
25
25
  align-items: center;
26
26
  justify-content: between;
27
27
  padding: ${c[4]} 0;
28
- font-weight: ${f.medium};
28
+ font-weight: ${g.medium};
29
29
  --accordion-trigger-icon-transform: 0deg;
30
30
  &:hover {
31
31
  text-decoration-line: underline;
@@ -61,7 +61,7 @@ const n = (d, l) => /* @__PURE__ */ r(
61
61
  {
62
62
  "ws:style": t`
63
63
  overflow: hidden;
64
- font-size: ${g.sm};
64
+ font-size: ${f.sm};
65
65
  line-height: ${p.sm};
66
66
  transition: ${a.all};
67
67
  padding-bottom: ${c[4]};
@@ -75,7 +75,7 @@ const n = (d, l) => /* @__PURE__ */ r(
75
75
  category: "radix",
76
76
  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.",
77
77
  order: 3,
78
- template: /* @__PURE__ */ r(i.Accordion, { collapsible: !0, defaultValue: "0", children: [
78
+ template: /* @__PURE__ */ r(i.Accordion, { collapsible: !0, value: "0", children: [
79
79
  n(
80
80
  "Is it accessible?",
81
81
  "Yes. It adheres to the WAI-ARIA design pattern."
@@ -1,10 +1,9 @@
1
1
  import { AccordionIcon as t, ItemIcon as n, HeaderIcon as r, TriggerIcon as c, ContentIcon as i } from "@webstudio-is/icons/svg";
2
- import { defaultStates as a } from "@webstudio-is/sdk";
3
- import { div as o, h3 as p, button as s } from "@webstudio-is/sdk/normalize.css";
2
+ import { div as o, h3 as a, button as p } from "@webstudio-is/sdk/normalize.css";
4
3
  import { radix as e } from "./shared/meta.js";
5
4
  import { buttonReset as d } from "./shared/preset-styles.js";
6
- import { propsAccordion as l, propsAccordionItem as m, propsAccordionHeader as g, propsAccordionTrigger as A, propsAccordionContent as y } from "./__generated__/accordion.props.js";
7
- const x = {
5
+ import { propsAccordion as s, propsAccordionItem as l, propsAccordionHeader as m, propsAccordionTrigger as g, propsAccordionContent as A } from "./__generated__/accordion.props.js";
6
+ const v = {
8
7
  icon: t,
9
8
  contentModel: {
10
9
  category: "instance",
@@ -13,8 +12,8 @@ const x = {
13
12
  },
14
13
  presetStyle: { div: o },
15
14
  initialProps: ["value", "collapsible"],
16
- props: l
17
- }, S = {
15
+ props: s
16
+ }, x = {
18
17
  label: "Item",
19
18
  icon: n,
20
19
  indexWithinAncestor: e.Accordion,
@@ -25,8 +24,8 @@ const x = {
25
24
  },
26
25
  presetStyle: { div: o },
27
26
  initialProps: ["value"],
28
- props: m
29
- }, C = {
27
+ props: l
28
+ }, f = {
30
29
  label: "Item Header",
31
30
  icon: r,
32
31
  contentModel: {
@@ -36,7 +35,7 @@ const x = {
36
35
  },
37
36
  presetStyle: {
38
37
  h3: [
39
- ...p,
38
+ ...a,
40
39
  {
41
40
  property: "margin-top",
42
41
  value: { type: "unit", unit: "px", value: 0 }
@@ -47,27 +46,20 @@ const x = {
47
46
  }
48
47
  ]
49
48
  },
50
- props: g
51
- }, H = {
49
+ props: m
50
+ }, C = {
52
51
  label: "Item Trigger",
53
52
  icon: c,
54
53
  contentModel: {
55
54
  category: "none",
56
55
  children: ["instance", "rich-text"]
57
56
  },
58
- states: [
59
- ...a,
60
- {
61
- category: "component-states",
62
- label: "Open",
63
- selector: "[data-state=open]"
64
- }
65
- ],
57
+ states: [{ label: "Open", selector: "[data-state=open]" }],
66
58
  presetStyle: {
67
- button: [s, d].flat()
59
+ button: [p, d].flat()
68
60
  },
69
- props: A
70
- }, M = {
61
+ props: g
62
+ }, H = {
71
63
  label: "Item Content",
72
64
  icon: i,
73
65
  contentModel: {
@@ -77,12 +69,12 @@ const x = {
77
69
  presetStyle: {
78
70
  div: o
79
71
  },
80
- props: y
72
+ props: A
81
73
  };
82
74
  export {
83
- x as metaAccordion,
84
- M as metaAccordionContent,
85
- C as metaAccordionHeader,
86
- S as metaAccordionItem,
87
- H as metaAccordionTrigger
75
+ v as metaAccordion,
76
+ H as metaAccordionContent,
77
+ f as metaAccordionHeader,
78
+ x as metaAccordionItem,
79
+ C as metaAccordionTrigger
88
80
  };
package/lib/checkbox.js CHANGED
@@ -1,23 +1,19 @@
1
- import { jsx as a } from "react/jsx-runtime";
2
- import { forwardRef as f } from "react";
3
- import { Indicator as d, Root as h } from "@radix-ui/react-checkbox";
4
- import { useControllableState as m } from "@radix-ui/react-use-controllable-state";
5
- const p = f(({ defaultChecked: e, ...o }, r) => {
6
- const [t, c] = m({
7
- prop: o.checked ?? e ?? !1,
8
- defaultProp: !1
9
- });
10
- return /* @__PURE__ */ a(
11
- h,
1
+ import { jsx as f } from "react/jsx-runtime";
2
+ import { forwardRef as h, useState as s, useEffect as k } from "react";
3
+ import { Indicator as a, Root as m } from "@radix-ui/react-checkbox";
4
+ const x = h(({ defaultChecked: c, ...o }, r) => {
5
+ const e = o.checked ?? c ?? !1, [n, t] = s(e);
6
+ return k(() => t(e), [e]), /* @__PURE__ */ f(
7
+ m,
12
8
  {
13
9
  ...o,
14
10
  ref: r,
15
- checked: t,
16
- onCheckedChange: (n) => c(n === !0)
11
+ checked: n,
12
+ onCheckedChange: (d) => t(d === !0)
17
13
  }
18
14
  );
19
- }), s = d;
15
+ }), b = a;
20
16
  export {
21
- p as Checkbox,
22
- s as CheckboxIndicator
17
+ x as Checkbox,
18
+ b as CheckboxIndicator
23
19
  };
@@ -1,47 +1,36 @@
1
- import { CheckboxCheckedIcon as t, TriggerIcon as o } from "@webstudio-is/icons/svg";
2
- import { defaultStates as e } from "@webstudio-is/sdk";
3
- import { button as c, span as n } from "@webstudio-is/sdk/normalize.css";
4
- import { radix as r } from "./shared/meta.js";
5
- import { buttonReset as a } from "./shared/preset-styles.js";
6
- import { propsCheckbox as s, propsCheckboxIndicator as i } from "./__generated__/checkbox.props.js";
7
- const b = {
8
- icon: t,
1
+ import { CheckboxCheckedIcon as e, TriggerIcon as t } from "@webstudio-is/icons/svg";
2
+ import { button as o, span as c } from "@webstudio-is/sdk/normalize.css";
3
+ import { radix as n } from "./shared/meta.js";
4
+ import { buttonReset as r } from "./shared/preset-styles.js";
5
+ import { propsCheckbox as a, propsCheckboxIndicator as s } from "./__generated__/checkbox.props.js";
6
+ const m = {
7
+ icon: e,
9
8
  contentModel: {
10
9
  category: "instance",
11
10
  children: ["instance"],
12
- descendants: [r.CheckboxIndicator]
11
+ descendants: [n.CheckboxIndicator]
13
12
  },
14
13
  states: [
15
- ...e,
16
- {
17
- label: "Checked",
18
- selector: "[data-state=checked]",
19
- category: "component-states"
20
- },
21
- {
22
- label: "Unchecked",
23
- selector: "[data-state=unchecked]",
24
- category: "component-states"
25
- }
14
+ { label: "Checked", selector: "[data-state=checked]" },
15
+ { label: "Unchecked", selector: "[data-state=unchecked]" }
26
16
  ],
27
17
  presetStyle: {
28
- button: [c, a].flat()
18
+ button: [o, r].flat()
29
19
  },
30
20
  initialProps: ["id", "class", "name", "value", "required", "checked"],
31
- props: s
32
- }, x = {
33
- icon: o,
21
+ props: a
22
+ }, k = {
23
+ icon: t,
34
24
  contentModel: {
35
25
  category: "none",
36
26
  children: ["instance", "rich-text"]
37
27
  },
38
- states: e,
39
28
  presetStyle: {
40
- span: n
29
+ span: c
41
30
  },
42
- props: i
31
+ props: s
43
32
  };
44
33
  export {
45
- b as metaCheckbox,
46
- x as metaCheckboxIndicator
34
+ m as metaCheckbox,
35
+ k as metaCheckboxIndicator
47
36
  };
@@ -1,37 +1,40 @@
1
- import { jsx as i } from "react/jsx-runtime";
2
- import { forwardRef as r, Children as a } from "react";
3
- import { Root as c, Content as p, Trigger as C } from "@radix-ui/react-collapsible";
4
- import { getClosestInstance as l } from "@webstudio-is/react-sdk/runtime";
5
- const h = c, g = r(({ children: e, ...o }, t) => {
6
- const n = a.toArray(e)[0];
7
- return /* @__PURE__ */ i(C, { asChild: !0, ref: t, ...o, children: n ?? /* @__PURE__ */ i("button", { children: "Add button" }) });
8
- }), u = p, s = "@webstudio-is/sdk-components-react-radix", P = {
9
- onNavigatorSelect: (e, o) => {
10
- for (const t of o.instancePath)
11
- if (t.component === `${s}:CollapsibleContent`) {
12
- const n = l(
13
- o.instancePath,
14
- t,
1
+ import { jsx as l } from "react/jsx-runtime";
2
+ import { forwardRef as a, useState as c, useEffect as p, Children as f } from "react";
3
+ import { Content as C, Root as m, Trigger as b } from "@radix-ui/react-collapsible";
4
+ import { getClosestInstance as r } from "@webstudio-is/react-sdk/runtime";
5
+ const P = a((n, t) => {
6
+ const o = n.open ?? !1, [e, i] = c(o);
7
+ return p(() => i(o), [o]), /* @__PURE__ */ l(m, { ...n, ref: t, open: e, onOpenChange: i });
8
+ }), $ = a(({ children: n, ...t }, o) => {
9
+ const e = f.toArray(n)[0];
10
+ return /* @__PURE__ */ l(b, { asChild: !0, ref: o, ...t, children: e ?? /* @__PURE__ */ l("button", { children: "Add button" }) });
11
+ }), x = C, s = "@webstudio-is/sdk-components-react-radix", y = {
12
+ onNavigatorSelect: (n, t) => {
13
+ for (const o of t.instancePath)
14
+ if (o.component === `${s}:CollapsibleContent`) {
15
+ const e = r(
16
+ t.instancePath,
17
+ o,
15
18
  `${s}:Collapsible`
16
19
  );
17
- n && e.setMemoryProp(n, "open", !0);
20
+ e && n.setMemoryProp(e, "open", !0);
18
21
  }
19
22
  },
20
- onNavigatorUnselect: (e, o) => {
21
- for (const t of o.instancePath)
22
- if (t.component === `${s}:CollapsibleContent`) {
23
- const n = l(
24
- o.instancePath,
25
- t,
23
+ onNavigatorUnselect: (n, t) => {
24
+ for (const o of t.instancePath)
25
+ if (o.component === `${s}:CollapsibleContent`) {
26
+ const e = r(
27
+ t.instancePath,
28
+ o,
26
29
  `${s}:Collapsible`
27
30
  );
28
- n && e.setMemoryProp(n, "open", void 0);
31
+ e && n.setMemoryProp(e, "open", void 0);
29
32
  }
30
33
  }
31
34
  };
32
35
  export {
33
- h as Collapsible,
34
- u as CollapsibleContent,
35
- g as CollapsibleTrigger,
36
- P as hooksCollapsible
36
+ P as Collapsible,
37
+ x as CollapsibleContent,
38
+ $ as CollapsibleTrigger,
39
+ y as hooksCollapsible
37
40
  };
package/lib/dialog.js CHANGED
@@ -1,92 +1,86 @@
1
- import { jsx as i } from "react/jsx-runtime";
2
- import { forwardRef as c, useContext as h, useCallback as D, useEffect as m, Children as v, useRef as k } from "react";
1
+ import { jsx as s } from "react/jsx-runtime";
2
+ import v from "await-interaction-response";
3
+ import { forwardRef as c, useContext as p, useState as k, useEffect as d, useCallback as w, Children as y, useRef as A } from "react";
3
4
  import * as a from "@radix-ui/react-dialog";
4
- import { ReactSdkContext as p, getClosestInstance as d } from "@webstudio-is/react-sdk/runtime";
5
- import { useControllableState as w } from "@radix-ui/react-use-controllable-state";
6
- import y from "await-interaction-response";
5
+ import { ReactSdkContext as D, getClosestInstance as m } from "@webstudio-is/react-sdk/runtime";
7
6
  const C = (t) => {
8
7
  const { target: e } = t;
9
8
  return !(!(e instanceof HTMLAnchorElement) || e.hasAttribute("href") === !1 || e.href === "#" || e.hasAttribute("target") && e.target === "_blank" || t.ctrlKey || t.metaKey);
10
9
  }, O = c((t, e) => {
11
- const { renderer: o } = h(p), [n, s] = w({
12
- prop: t.open,
13
- defaultProp: !1,
14
- onChange: t.onOpenChange
15
- }), r = D(
16
- async (l) => {
17
- await y(), s(l);
18
- },
19
- [s]
20
- );
21
- return m(() => {
22
- if (o !== void 0 || n === !1)
10
+ const { renderer: n } = p(D), o = t.open ?? !1, [r, l] = k(o);
11
+ d(() => l(o), [o]);
12
+ const i = w(async (f) => {
13
+ await v(), l(f);
14
+ }, []);
15
+ return d(() => {
16
+ if (n !== void 0 || r === !1)
23
17
  return;
24
- const l = (u) => {
25
- const { target: g } = u;
26
- if (C(u) !== !1) {
27
- if (!(g instanceof HTMLAnchorElement))
18
+ const f = (g) => {
19
+ const { target: h } = g;
20
+ if (C(g) !== !1) {
21
+ if (!(h instanceof HTMLAnchorElement))
28
22
  return !1;
29
- g.closest('[role="dialog"]') && (r == null || r(!1));
23
+ h.closest('[role="dialog"]') && (i == null || i(!1));
30
24
  }
31
25
  };
32
- return window.addEventListener("click", l), () => window.removeEventListener("click", l);
33
- }, [n, r, o]), /* @__PURE__ */ i(
26
+ return window.addEventListener("click", f), () => window.removeEventListener("click", f);
27
+ }, [r, i, n]), /* @__PURE__ */ s(
34
28
  a.Root,
35
29
  {
36
30
  ...t,
37
- onOpenChange: r,
38
- open: n
31
+ onOpenChange: i,
32
+ open: r
39
33
  }
40
34
  );
41
- }), x = c(({ children: t, ...e }, o) => {
42
- const n = v.toArray(t)[0];
43
- return /* @__PURE__ */ i(a.Trigger, { ref: o, asChild: !0, ...e, children: n ?? /* @__PURE__ */ i("button", { children: "Add button or link" }) });
44
- }), M = c((t, e) => /* @__PURE__ */ i(a.DialogPortal, { children: /* @__PURE__ */ i(a.Overlay, { ref: e, ...t }) })), R = c((t, e) => {
45
- const o = k(!1), { renderer: n } = h(p);
46
- return m(() => {
47
- if (n !== void 0)
35
+ }), x = c(({ children: t, ...e }, n) => {
36
+ const o = y.toArray(t)[0];
37
+ return /* @__PURE__ */ s(a.Trigger, { ref: n, asChild: !0, ...e, children: o ?? /* @__PURE__ */ s("button", { children: "Add button or link" }) });
38
+ }), M = c((t, e) => /* @__PURE__ */ s(a.DialogPortal, { children: /* @__PURE__ */ s(a.Overlay, { ref: e, ...t }) })), R = c((t, e) => {
39
+ const n = A(!1), { renderer: o } = p(D);
40
+ return d(() => {
41
+ if (o !== void 0)
48
42
  return;
49
- o.current = !1;
50
- const s = (r) => {
51
- const { target: l } = r;
52
- if (C(r) !== !1) {
53
- if (!(l instanceof HTMLAnchorElement))
43
+ n.current = !1;
44
+ const r = (l) => {
45
+ const { target: i } = l;
46
+ if (C(l) !== !1) {
47
+ if (!(i instanceof HTMLAnchorElement))
54
48
  return !1;
55
- l.closest('[role="dialog"]') && (o.current = !0);
49
+ i.closest('[role="dialog"]') && (n.current = !0);
56
50
  }
57
51
  };
58
- return window.addEventListener("click", s), () => window.removeEventListener("click", s);
59
- }, [n]), /* @__PURE__ */ i(
52
+ return window.addEventListener("click", r), () => window.removeEventListener("click", r);
53
+ }, [o]), /* @__PURE__ */ s(
60
54
  a.Content,
61
55
  {
62
56
  ref: e,
63
57
  ...t,
64
- onCloseAutoFocus: (s) => {
65
- o.current && s.preventDefault();
58
+ onCloseAutoFocus: (r) => {
59
+ n.current && r.preventDefault();
66
60
  }
67
61
  }
68
62
  );
69
- }), $ = 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 = {
63
+ }), $ = 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 = {
70
64
  onNavigatorUnselect: (t, e) => {
71
- for (const o of e.instancePath)
72
- if (o.component === `${f}:DialogOverlay`) {
73
- const n = d(
65
+ for (const n of e.instancePath)
66
+ if (n.component === `${u}:DialogOverlay`) {
67
+ const o = m(
74
68
  e.instancePath,
75
- o,
76
- `${f}:Dialog`
69
+ n,
70
+ `${u}:Dialog`
77
71
  );
78
- n && t.setMemoryProp(n, "open", void 0);
72
+ o && t.setMemoryProp(o, "open", void 0);
79
73
  }
80
74
  },
81
75
  onNavigatorSelect: (t, e) => {
82
- for (const o of e.instancePath)
83
- if (o.component === `${f}:DialogOverlay`) {
84
- const n = d(
76
+ for (const n of e.instancePath)
77
+ if (n.component === `${u}:DialogOverlay`) {
78
+ const o = m(
85
79
  e.instancePath,
86
- o,
87
- `${f}:Dialog`
80
+ n,
81
+ `${u}:Dialog`
88
82
  );
89
- n && t.setMemoryProp(n, "open", !0);
83
+ o && t.setMemoryProp(o, "open", !0);
90
84
  }
91
85
  }
92
86
  };
package/lib/dialog.ws.js CHANGED
@@ -1,17 +1,16 @@
1
- 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";
2
- import { defaultStates as s } from "@webstudio-is/sdk";
3
- import { div as e, button as p, h2 as g, p as d } from "@webstudio-is/sdk/normalize.css";
1
+ 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";
2
+ import { div as e, button as s, h2 as p, p as g } from "@webstudio-is/sdk/normalize.css";
4
3
  import { radix as o } from "./shared/meta.js";
5
- 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";
4
+ 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";
6
5
  import { buttonReset as I } from "./shared/preset-styles.js";
7
- const O = {
6
+ const S = {
8
7
  icon: n,
9
8
  contentModel: {
10
9
  category: "none",
11
10
  children: ["instance"]
12
11
  },
13
- props: m
14
- }, B = {
12
+ props: d
13
+ }, b = {
15
14
  icon: i,
16
15
  contentModel: {
17
16
  category: "none",
@@ -19,8 +18,8 @@ const O = {
19
18
  descendants: [o.DialogContent]
20
19
  },
21
20
  presetStyle: { div: e },
22
- props: y
23
- }, E = {
21
+ props: m
22
+ }, O = {
24
23
  icon: r,
25
24
  contentModel: {
26
25
  category: "none",
@@ -32,50 +31,50 @@ const O = {
32
31
  ]
33
32
  },
34
33
  presetStyle: { div: e },
35
- props: h
36
- }, H = {
37
- icon: a,
34
+ props: y
35
+ }, B = {
36
+ icon: l,
38
37
  contentModel: {
39
38
  category: "none",
40
39
  children: ["instance", "rich-text"]
41
40
  },
42
- presetStyle: { h2: g },
41
+ presetStyle: { h2: p },
43
42
  props: C
44
- }, R = {
45
- icon: l,
43
+ }, E = {
44
+ icon: a,
46
45
  contentModel: {
47
46
  category: "none",
48
47
  children: ["instance", "rich-text"]
49
48
  },
50
- presetStyle: { p: d },
49
+ presetStyle: { p: g },
51
50
  props: T
52
- }, j = {
51
+ }, H = {
53
52
  icon: c,
54
53
  label: "Close Button",
55
54
  contentModel: {
56
55
  category: "none",
57
56
  children: ["instance", "rich-text"]
58
57
  },
59
- states: s,
60
58
  presetStyle: {
61
- button: [I, p].flat()
59
+ button: [I, s].flat()
62
60
  },
63
- props: f
64
- }, k = {
61
+ props: h
62
+ }, P = {
65
63
  icon: t,
66
64
  contentModel: {
67
65
  category: "instance",
68
66
  children: ["instance"],
69
67
  descendants: [o.DialogTrigger, o.DialogOverlay]
70
68
  },
69
+ initialProps: ["open"],
71
70
  props: D
72
71
  };
73
72
  export {
74
- k as metaDialog,
75
- j as metaDialogClose,
76
- E as metaDialogContent,
77
- R as metaDialogDescription,
78
- B as metaDialogOverlay,
79
- H as metaDialogTitle,
80
- O as metaDialogTrigger
73
+ P as metaDialog,
74
+ H as metaDialogClose,
75
+ O as metaDialogContent,
76
+ E as metaDialogDescription,
77
+ b as metaDialogOverlay,
78
+ B as metaDialogTitle,
79
+ S as metaDialogTrigger
81
80
  };