@oneplatformdev/ui 0.0.1-beta.135 → 0.0.1-beta.136

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 (2) hide show
  1. package/Dialog/Dialog.mjs +50 -52
  2. package/package.json +1 -1
package/Dialog/Dialog.mjs CHANGED
@@ -1,14 +1,14 @@
1
1
  import { jsx as o, jsxs as c } from "react/jsx-runtime";
2
- import i, { useState as p, useEffect as b, useRef as D, useMemo as h } from "react";
2
+ import i, { useState as u, useEffect as D, useRef as h, useMemo as v } from "react";
3
3
  import * as e from "@radix-ui/react-dialog";
4
- import { XIcon as v } from "lucide-react";
5
- import { cn as n, composeRefs as C } from "@oneplatformdev/utils";
6
- import { DialogOverlayScope as w } from "./DialogOverlayScope.mjs";
7
- const q = e.Root, B = e.Trigger, R = e.Portal, I = e.Close, g = i.forwardRef(({ className: t, ...a }, s) => /* @__PURE__ */ o(
4
+ import { XIcon as C } from "lucide-react";
5
+ import { cn as r, composeRefs as w } from "@oneplatformdev/utils";
6
+ import { DialogOverlayScope as R } from "./DialogOverlayScope.mjs";
7
+ const B = e.Root, I = e.Trigger, E = e.Portal, M = e.Close, g = i.forwardRef(({ className: t, ...a }, s) => /* @__PURE__ */ o(
8
8
  e.Overlay,
9
9
  {
10
10
  ref: s,
11
- className: n(
11
+ className: r(
12
12
  "fixed inset-0 z-40 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
13
13
  t
14
14
  ),
@@ -16,51 +16,49 @@ const q = e.Root, B = e.Trigger, R = e.Portal, I = e.Close, g = i.forwardRef(({
16
16
  }
17
17
  ));
18
18
  g.displayName = e.Overlay.displayName;
19
- const E = i.forwardRef(
19
+ const T = i.forwardRef(
20
20
  ({
21
21
  className: t,
22
22
  children: a,
23
23
  showCloseButton: s = !0,
24
24
  onOpenAutoFocus: d,
25
- preventAutoFocus: u,
26
- ...y
27
- }, m) => {
28
- const [l] = p(() => {
25
+ preventAutoFocus: y,
26
+ ...x
27
+ }, f) => {
28
+ const [n] = u(() => {
29
29
  if (typeof document > "u") return null;
30
- const r = document.createElement("div");
31
- return r.setAttribute("data-dialog-portal", ""), r;
32
- }), [x, N] = p();
33
- b(() => {
34
- if (l)
35
- return document.body.appendChild(l), () => {
36
- l.remove();
30
+ const l = document.createElement("div");
31
+ return l.setAttribute("data-dialog-portal", ""), l;
32
+ }), [m, N] = u();
33
+ D(() => {
34
+ if (n)
35
+ return document.body.appendChild(n), () => {
36
+ n.remove();
37
37
  };
38
- }, [l]);
39
- const f = D(null);
40
- return h(() => C(m, f), [m]), console.log("localRef", f), console.log("portalEl", l), console.log("container", x), l ? /* @__PURE__ */ c(R, { children: [
38
+ }, [n]);
39
+ const p = h(null), b = v(() => w(f, p), [f]);
40
+ return console.log("localRef", p), console.log("portalEl", n), console.log("container", m), n ? /* @__PURE__ */ c(E, { children: [
41
41
  /* @__PURE__ */ o(g, {}),
42
- /* @__PURE__ */ o(w, { value: l, children: /* @__PURE__ */ c(
42
+ /* @__PURE__ */ o(R, { value: m, children: /* @__PURE__ */ c(
43
43
  e.Content,
44
44
  {
45
- ref: (r) => {
46
- N(r);
47
- },
48
- className: n(
45
+ ref: (l) => (N(l), b),
46
+ className: r(
49
47
  "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg",
50
48
  "duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
51
49
  "max-w-[90%] max-h-[90%] overflow-hidden",
52
50
  "bg-[#FCFCFC] border border-[#E8E9EB] rounded-[16px]",
53
51
  t
54
52
  ),
55
- onOpenAutoFocus: (r) => (u && r.preventDefault(), d == null ? void 0 : d(r)),
56
- ...y,
53
+ onOpenAutoFocus: (l) => (y && l.preventDefault(), d == null ? void 0 : d(l)),
54
+ ...x,
57
55
  children: [
58
56
  a,
59
57
  s && /* @__PURE__ */ c(
60
58
  e.Close,
61
59
  {
62
60
  "aria-label": "Close",
63
- className: n(
61
+ className: r(
64
62
  "absolute right-4 top-4 rounded-sm ring-offset-background w-10 aspect-square",
65
63
  "flex items-center justify-center",
66
64
  "data-[state=open]:bg-accent data-[state=open]:text-muted-foreground",
@@ -72,7 +70,7 @@ const E = i.forwardRef(
72
70
  "transition-opacity"
73
71
  ),
74
72
  children: [
75
- /* @__PURE__ */ o(v, { className: "h-4 w-4" }),
73
+ /* @__PURE__ */ o(C, { className: "h-4 w-4" }),
76
74
  /* @__PURE__ */ o("span", { className: "sr-only", children: "Close" })
77
75
  ]
78
76
  }
@@ -83,65 +81,65 @@ const E = i.forwardRef(
83
81
  ] }) : null;
84
82
  }
85
83
  );
86
- E.displayName = e.Content.displayName;
87
- const T = ({
84
+ T.displayName = e.Content.displayName;
85
+ const j = ({
88
86
  className: t,
89
87
  ...a
90
88
  }) => /* @__PURE__ */ o(
91
89
  "div",
92
90
  {
93
- className: n(
91
+ className: r(
94
92
  "flex flex-col space-y-1.5 text-center sm:text-left",
95
93
  t
96
94
  ),
97
95
  ...a
98
96
  }
99
97
  );
100
- T.displayName = "DialogHeader";
101
- const j = ({
98
+ j.displayName = "DialogHeader";
99
+ const k = ({
102
100
  className: t,
103
101
  ...a
104
102
  }) => /* @__PURE__ */ o(
105
103
  "div",
106
104
  {
107
- className: n(
105
+ className: r(
108
106
  "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
109
107
  t
110
108
  ),
111
109
  ...a
112
110
  }
113
111
  );
114
- j.displayName = "DialogFooter";
115
- const k = i.forwardRef(({ className: t, ...a }, s) => /* @__PURE__ */ o(
112
+ k.displayName = "DialogFooter";
113
+ const z = i.forwardRef(({ className: t, ...a }, s) => /* @__PURE__ */ o(
116
114
  e.Title,
117
115
  {
118
116
  ref: s,
119
- className: n(
117
+ className: r(
120
118
  "text-lg font-semibold leading-none tracking-tight",
121
119
  t
122
120
  ),
123
121
  ...a
124
122
  }
125
123
  ));
126
- k.displayName = e.Title.displayName;
127
- const z = i.forwardRef(({ className: t, ...a }, s) => /* @__PURE__ */ o(
124
+ z.displayName = e.Title.displayName;
125
+ const P = i.forwardRef(({ className: t, ...a }, s) => /* @__PURE__ */ o(
128
126
  e.Description,
129
127
  {
130
128
  ref: s,
131
- className: n("text-sm text-muted-foreground", t),
129
+ className: r("text-sm text-muted-foreground", t),
132
130
  ...a
133
131
  }
134
132
  ));
135
- z.displayName = e.Description.displayName;
133
+ P.displayName = e.Description.displayName;
136
134
  export {
137
- q as Dialog,
138
- I as DialogClose,
139
- E as DialogContent,
140
- z as DialogDescription,
141
- j as DialogFooter,
142
- T as DialogHeader,
135
+ B as Dialog,
136
+ M as DialogClose,
137
+ T as DialogContent,
138
+ P as DialogDescription,
139
+ k as DialogFooter,
140
+ j as DialogHeader,
143
141
  g as DialogOverlay,
144
- R as DialogPortal,
145
- k as DialogTitle,
146
- B as DialogTrigger
142
+ E as DialogPortal,
143
+ z as DialogTitle,
144
+ I as DialogTrigger
147
145
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oneplatformdev/ui",
3
- "version": "0.0.1-beta.135",
3
+ "version": "0.0.1-beta.136",
4
4
  "description": "UI React Components.",
5
5
  "author": "One Platform Development Team",
6
6
  "keywords": [