asma-ui-core 3.46.1 → 3.47.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.
@@ -1,121 +1,123 @@
1
- import { cn as m } from "../../../helpers/cn.js";
2
- import { resolveSx as k } from "../../../helpers/sx.js";
3
- import { CloseIcon as X } from "../../icons/close-icon/CloseIcon.js";
4
- import { StyledButton as q } from "../../inputs/button/StyledButton.js";
5
- import { useMobileMediaQuery as A } from "../../../hooks/useMediaQuery.hook.js";
6
- import B from "./StyledDialog.module.js";
7
- import { useEffect as F, useLayoutEffect as G, useRef as N } from "react";
8
- import { jsx as l, jsxs as o } from "react/jsx-runtime";
9
- var Q = {
1
+ import { cn as f } from "../../../helpers/cn.js";
2
+ import { resolveSx as D } from "../../../helpers/sx.js";
3
+ import { CloseIcon as B } from "../../icons/close-icon/CloseIcon.js";
4
+ import { StyledButton as F } from "../../inputs/button/StyledButton.js";
5
+ import { useMobileMediaQuery as G } from "../../../hooks/useMediaQuery.hook.js";
6
+ import P from "./StyledDialog.module.js";
7
+ import { useEffect as _, useLayoutEffect as Q, useRef as u } from "react";
8
+ import { jsx as l, jsxs as r } from "react/jsx-runtime";
9
+ var $ = {
10
10
  xs: 444,
11
11
  sm: 600,
12
12
  md: 900,
13
13
  lg: 1200,
14
14
  xl: 1536
15
- }, ee = ({ open: t, onClose: n, children: D, dataTest: a, maxWidth: f = "sm", fullWidth: _, fullScreen: C, scroll: u = "paper", disableEscapeKeyDown: x, className: H, style: S, sx: j, classes: p, PaperProps: E, slotProps: h, onCloseText: y, showCloseIcon: w = !0, dialogLabel: i, dialogTitle: d, dialogHeaderNode: M }) => {
16
- const W = A(), b = N(null), s = N(!1), r = W ? !0 : C;
17
- G(() => {
18
- const e = b.current;
15
+ }, te = ({ open: t, onClose: a, children: C, dataTest: i, maxWidth: x = "sm", fullWidth: E, fullScreen: H, scroll: p = "paper", disableEscapeKeyDown: h, className: S, style: j, sx: M, classes: y, PaperProps: R, slotProps: o, onCloseText: w, showCloseIcon: b = !0, dialogLabel: d, dialogTitle: s, dialogHeaderNode: W }) => {
16
+ const I = G(), v = u(null), c = u(!1), g = u(t), n = I ? !0 : H;
17
+ _(() => {
18
+ g.current && !t && o?.transition?.onExited?.(), g.current = t;
19
+ }, [t, o]), Q(() => {
20
+ const e = v.current;
19
21
  e && t && !e.open && e.showModal();
20
- }, [t]), F(() => {
22
+ }, [t]), _(() => {
21
23
  if (!t) return;
22
- const e = document.body.style.overflow, K = document.documentElement.style.overflow;
24
+ const e = document.body.style.overflow, A = document.documentElement.style.overflow;
23
25
  return document.body.style.overflow = "hidden", document.documentElement.style.overflow = "hidden", () => {
24
- document.body.style.overflow = e, document.documentElement.style.overflow = K;
26
+ document.body.style.overflow = e, document.documentElement.style.overflow = A;
25
27
  };
26
28
  }, [t]);
27
- const c = {
28
- ...E,
29
- ...h?.paper
30
- }, v = f === !1 ? void 0 : Q[f], { className: I, style: R, onClick: z, ...O } = h?.backdrop ?? {}, g = (e) => {
31
- s.current || (s.current = !0, window.setTimeout(() => {
32
- s.current = !1;
33
- }, 0), n?.(e, "escapeKeyDown"));
34
- }, P = (e) => {
35
- e.preventDefault(), x || g(e);
29
+ const m = {
30
+ ...R,
31
+ ...o?.paper
32
+ }, k = x === !1 ? void 0 : $[x], { className: O, style: z, onClick: K, ...X } = o?.backdrop ?? {}, N = (e) => {
33
+ c.current || (c.current = !0, window.setTimeout(() => {
34
+ c.current = !1;
35
+ }, 0), a?.(e, "escapeKeyDown"));
36
+ }, q = (e) => {
37
+ e.preventDefault(), h || N(e);
36
38
  };
37
- return t ? /* @__PURE__ */ o("dialog", {
38
- ref: b,
39
+ return t ? /* @__PURE__ */ r("dialog", {
40
+ ref: v,
39
41
  tabIndex: -1,
40
- "data-testid": a,
41
- "aria-label": a,
42
- onCancel: P,
42
+ "data-testid": i,
43
+ "aria-label": i,
44
+ onCancel: q,
43
45
  onKeyDown: (e) => {
44
- e.key !== "Escape" || x || (e.preventDefault(), g(e));
46
+ e.key !== "Escape" || h || (e.preventDefault(), N(e));
45
47
  },
46
- className: m(B.StyledDialog, "fixed inset-0 m-0 h-full max-h-none w-full max-w-none items-center justify-center overflow-hidden border-0 bg-transparent p-0 outline-none open:flex", u === "body" && "overflow-y-auto", H, p?.root),
48
+ className: f(P.StyledDialog, "fixed inset-0 m-0 h-full max-h-none w-full max-w-none items-center justify-center overflow-hidden border-0 bg-transparent p-0 outline-none open:flex", p === "body" && "overflow-y-auto", S, y?.root),
47
49
  style: {
48
50
  zIndex: 999,
49
- ...k(j),
50
- ...S
51
+ ...D(M),
52
+ ...j
51
53
  },
52
54
  children: [/* @__PURE__ */ l("div", {
53
- ...O,
54
- className: m("absolute inset-0 bg-[#626e7eb2]", I),
55
- style: R,
55
+ ...X,
56
+ className: f("absolute inset-0 bg-[#626e7eb2]", O),
57
+ style: z,
56
58
  onClick: (e) => {
57
- z?.(e), e.defaultPrevented || n?.(e, "backdropClick");
59
+ K?.(e), e.defaultPrevented || a?.(e, "backdropClick");
58
60
  }
59
- }), /* @__PURE__ */ o("div", {
60
- className: m("relative z-[1] flex overflow-hidden rounded-lg border-0 bg-white p-0 text-delta-800 shadow-[0px_4px_40px_0px_#22213366]", u === "paper" && "flex-col", r && "rounded-none", c.className, p?.paper),
61
+ }), /* @__PURE__ */ r("div", {
62
+ className: f("relative z-[1] flex overflow-hidden rounded-lg border-0 bg-white p-0 text-delta-800 shadow-[0px_4px_40px_0px_#22213366]", p === "paper" && "flex-col", n && "rounded-none", m.className, y?.paper),
61
63
  style: {
62
64
  minWidth: 0,
63
65
  minHeight: 0,
64
- ...!r && v ? { maxWidth: v } : {},
65
- ...r ? {
66
+ ...!n && k ? { maxWidth: k } : {},
67
+ ...n ? {
66
68
  width: "100%",
67
69
  maxWidth: "100%",
68
70
  height: "100%",
69
71
  maxHeight: "100%"
70
72
  } : {
71
- width: _ ? "calc(100% - 64px)" : "auto",
73
+ width: E ? "calc(100% - 64px)" : "auto",
72
74
  maxHeight: "100%"
73
75
  },
74
- ...k(c.sx),
75
- ...c.style,
76
- ...r ? {
76
+ ...D(m.sx),
77
+ ...m.style,
78
+ ...n ? {
77
79
  width: "100%",
78
80
  maxWidth: "100%",
79
81
  height: "100%",
80
82
  maxHeight: "100%"
81
83
  } : { maxHeight: "calc(100% - 64px)" }
82
84
  },
83
- children: [(!!i || !!d || w) && /* @__PURE__ */ o("div", {
85
+ children: [(!!d || !!s || b) && /* @__PURE__ */ r("div", {
84
86
  className: "box-border flex w-full min-w-0 max-w-full justify-between px-4 pt-4",
85
- children: [/* @__PURE__ */ o("div", {
87
+ children: [/* @__PURE__ */ r("div", {
86
88
  className: "flex min-w-0 flex-1 flex-col justify-start gap-0.5",
87
- children: [i && /* @__PURE__ */ l("div", {
89
+ children: [d && /* @__PURE__ */ l("div", {
88
90
  className: "flex h-8 items-center text-sm font-normal leading-5 text-delta-600",
89
- children: i
90
- }), d && /* @__PURE__ */ l("div", {
91
- className: "flex text-2xl font-semibold leading-8 text-delta-800",
92
91
  children: d
92
+ }), s && /* @__PURE__ */ l("div", {
93
+ className: "flex text-2xl font-semibold leading-8 text-delta-800",
94
+ children: s
93
95
  })]
94
- }), w && /* @__PURE__ */ o("div", {
96
+ }), b && /* @__PURE__ */ r("div", {
95
97
  className: "flex min-w-0 max-w-full shrink-0 justify-end gap-2",
96
- children: [M, /* @__PURE__ */ l(q, {
97
- dataTest: `close-button-${a}`,
98
- "aria-label": y ? void 0 : "Close",
98
+ children: [W, /* @__PURE__ */ l(F, {
99
+ dataTest: `close-button-${i}`,
100
+ "aria-label": w ? void 0 : "Close",
99
101
  variant: "textGray",
100
102
  size: "small",
101
- endIcon: /* @__PURE__ */ l(X, {
103
+ endIcon: /* @__PURE__ */ l(B, {
102
104
  width: 20,
103
105
  height: 20
104
106
  }),
105
107
  className: "max-w-full shrink-0 whitespace-nowrap",
106
- onClick: (e) => n?.(e, "escapeKeyDown"),
108
+ onClick: (e) => a?.(e, "escapeKeyDown"),
107
109
  style: {
108
110
  color: "var(--colors-delta-800)",
109
111
  paddingRight: "6px",
110
112
  paddingLeft: "6px"
111
113
  },
112
- children: y
114
+ children: w
113
115
  })]
114
116
  })]
115
- }), D]
117
+ }), C]
116
118
  })]
117
119
  }) : null;
118
120
  };
119
121
  export {
120
- ee as StyledDialog
122
+ te as StyledDialog
121
123
  };
@@ -33,14 +33,14 @@ var et = ({ dataTest: u, label: a, value: p, defaultValue: b, onChange: O, onBlu
33
33
  _.current = e instanceof HTMLTextAreaElement ? e : null;
34
34
  }, [])]), { style: E, ...Re } = c, f = !r && !d, Ee = f ? {
35
35
  boxSizing: "border-box",
36
- ...F,
37
36
  height: 40,
38
37
  minHeight: 40,
39
- maxHeight: 40
38
+ maxHeight: 40,
39
+ ...F
40
40
  } : d ? {
41
41
  boxSizing: "border-box",
42
- ...F,
43
- minHeight: 40
42
+ minHeight: 40,
43
+ ...F
44
44
  } : F, Me = f ? {
45
45
  ...E,
46
46
  height: void 0,
@@ -43,6 +43,9 @@ export interface IStyledDialogProps {
43
43
  slotProps?: {
44
44
  paper?: DialogPaperProps;
45
45
  backdrop?: Record<string, unknown>;
46
+ transition?: {
47
+ onExited?: () => void;
48
+ };
46
49
  };
47
50
  onCloseText?: ReactNode;
48
51
  /** @figmaProp none — behavioral */
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "publishConfig": {
4
4
  "access": "public"
5
5
  },
6
- "version": "3.46.1",
6
+ "version": "3.47.0",
7
7
  "type": "module",
8
8
  "sideEffects": [
9
9
  "**/*.css",