@dimasbaguspm/versaur 0.0.0 → 0.0.2
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.
- package/dist/components/bottom-bar/bottom-bar.atoms.d.ts +1 -1
- package/dist/components/bottom-bar/bottom-bar.d.ts +1 -1
- package/dist/components/bottom-bar/types.d.ts +3 -2
- package/dist/components/index.d.ts +1 -0
- package/dist/index.js +6996 -66
- package/package.json +2 -10
- package/dist/alert-DzSPXqwS.js +0 -167
- package/dist/app-bar-B4nQkgdL.js +0 -92
- package/dist/avatar-Bsn24V6g.js +0 -91
- package/dist/badge-DqLCHm9q.js +0 -184
- package/dist/bottom-bar-DOQ3gVwW.js +0 -73
- package/dist/breadcrumbs-PJV3izUu.js +0 -59
- package/dist/button-C8OibEPE.js +0 -81
- package/dist/button-float-B8tdLJkX.js +0 -107
- package/dist/button-icon-CWji4cBA.js +0 -89
- package/dist/calendar-CkLj89o2.js +0 -112
- package/dist/checkbox-input-CSboebwt.js +0 -167
- package/dist/chip-input-C1PJPDFq.js +0 -189
- package/dist/cn-Ca4KprQ1.js +0 -2730
- package/dist/components/alert.js +0 -4
- package/dist/components/app-bar.js +0 -4
- package/dist/components/avatar.js +0 -4
- package/dist/components/badge.js +0 -4
- package/dist/components/bottom-bar.js +0 -4
- package/dist/components/breadcrumbs.js +0 -4
- package/dist/components/button-float.js +0 -4
- package/dist/components/button-icon.js +0 -4
- package/dist/components/button.js +0 -4
- package/dist/components/calendar.js +0 -4
- package/dist/components/checkbox-input.js +0 -4
- package/dist/components/chip-input.js +0 -4
- package/dist/components/date-single-picker-input.js +0 -4
- package/dist/components/drawer.js +0 -9
- package/dist/components/icon.js +0 -4
- package/dist/components/loading-indicator.js +0 -4
- package/dist/components/menu.js +0 -4
- package/dist/components/modal.js +0 -4
- package/dist/components/radio-input.js +0 -4
- package/dist/components/segment-multiple-input.js +0 -4
- package/dist/components/segment-single-input.js +0 -4
- package/dist/components/select-input.js +0 -4
- package/dist/components/skeleton.js +0 -4
- package/dist/components/snackbar.js +0 -4
- package/dist/components/switch-input.js +0 -7
- package/dist/components/tabs.js +0 -4
- package/dist/components/text-input.js +0 -4
- package/dist/components/text.js +0 -4
- package/dist/components/textarea-input.js +0 -4
- package/dist/components/tile.js +0 -4
- package/dist/components/top-bar.js +0 -4
- package/dist/date-single-picker-input--Ew0O9NQ.js +0 -252
- package/dist/drawer-DrnAR2a4.js +0 -218
- package/dist/helpers-CEDtBUGM.js +0 -37
- package/dist/hooks/index.js +0 -1
- package/dist/icon-D-lTZMHY.js +0 -44
- package/dist/index-DU1SCUkk.js +0 -329
- package/dist/loading-indicator-BZMnT5PA.js +0 -168
- package/dist/menu-BZvilMF7.js +0 -174
- package/dist/modal-BGAtqMl9.js +0 -149
- package/dist/radio-input-BRGoevZY.js +0 -173
- package/dist/segment-multiple-input-VwHCqFd6.js +0 -229
- package/dist/segment-single-input-Cqoo7-C2.js +0 -228
- package/dist/select-input-DCb0usvK.js +0 -108
- package/dist/skeleton-D4X5USf_.js +0 -59
- package/dist/snackbar-CYias-fJ.js +0 -79
- package/dist/switch-input-C5s1lvYh.js +0 -186
- package/dist/tabs-C8aRKfxS.js +0 -216
- package/dist/text-B7e-au41.js +0 -120
- package/dist/text-input-BsWvUk_H.js +0 -73
- package/dist/textarea-input-DZExXEE8.js +0 -102
- package/dist/tile-Du7YciCG.js +0 -51
- package/dist/top-bar-ErHvwR4K.js +0 -62
package/dist/menu-BZvilMF7.js
DELETED
|
@@ -1,174 +0,0 @@
|
|
|
1
|
-
import { c as b, j as l } from "./index-DU1SCUkk.js";
|
|
2
|
-
import { createContext as h, useContext as w, forwardRef as f, useId as M, useEffect as m, useRef as g } from "react";
|
|
3
|
-
import { c as y } from "./cn-Ca4KprQ1.js";
|
|
4
|
-
const x = h(null), p = () => {
|
|
5
|
-
const n = w(x);
|
|
6
|
-
if (!n)
|
|
7
|
-
throw new Error("useMenuContext must be used within a Menu component");
|
|
8
|
-
return n;
|
|
9
|
-
}, E = b(
|
|
10
|
-
// Modern, clean, accessible base style
|
|
11
|
-
"z-50 min-w-40 bg-neutral-50 text-black rounded-lg shadow-md border border-transparent",
|
|
12
|
-
{
|
|
13
|
-
variants: {
|
|
14
|
-
variant: {
|
|
15
|
-
default: "",
|
|
16
|
-
outline: "border bg-transparent"
|
|
17
|
-
},
|
|
18
|
-
size: {
|
|
19
|
-
sm: "py-2",
|
|
20
|
-
md: "py-2.5"
|
|
21
|
-
}
|
|
22
|
-
},
|
|
23
|
-
defaultVariants: {
|
|
24
|
-
variant: "default",
|
|
25
|
-
size: "md"
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
), z = b(
|
|
29
|
-
"w-full text-left px-4 rounded-md cursor-pointer transition-colors duration-150 font-medium select-none focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-coral/70 hover:bg-slate-100 active:bg-slate-200 disabled:opacity-50 disabled:cursor-not-allowed",
|
|
30
|
-
{
|
|
31
|
-
variants: {
|
|
32
|
-
variant: {
|
|
33
|
-
default: "",
|
|
34
|
-
outline: "border border-color-neutral"
|
|
35
|
-
},
|
|
36
|
-
size: {
|
|
37
|
-
sm: "text-sm py-2",
|
|
38
|
-
md: "text-base py-2.5"
|
|
39
|
-
}
|
|
40
|
-
},
|
|
41
|
-
defaultVariants: {
|
|
42
|
-
variant: "default",
|
|
43
|
-
size: "md"
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
), I = f(
|
|
47
|
-
({ children: n, ...e }, t) => {
|
|
48
|
-
const { open: u, triggerRef: r } = p();
|
|
49
|
-
return /* @__PURE__ */ l.jsx(
|
|
50
|
-
"button",
|
|
51
|
-
{
|
|
52
|
-
ref: (o) => {
|
|
53
|
-
r.current = o, typeof t == "function" ? t(o) : t && (t.current = o);
|
|
54
|
-
},
|
|
55
|
-
"aria-haspopup": "menu",
|
|
56
|
-
"aria-expanded": u,
|
|
57
|
-
"aria-controls": "menu-content",
|
|
58
|
-
type: "button",
|
|
59
|
-
...e,
|
|
60
|
-
children: n
|
|
61
|
-
}
|
|
62
|
-
);
|
|
63
|
-
}
|
|
64
|
-
), j = f(
|
|
65
|
-
({ children: n, className: e, ...t }, u) => {
|
|
66
|
-
const { open: r, contentRef: o, triggerRef: i, size: s } = p(), d = M();
|
|
67
|
-
let c = 0, v = 0;
|
|
68
|
-
if (i.current) {
|
|
69
|
-
const a = i.current.getBoundingClientRect();
|
|
70
|
-
c = a.bottom + window.scrollY + 4, v = a.left + window.scrollX;
|
|
71
|
-
}
|
|
72
|
-
return /* @__PURE__ */ l.jsx(
|
|
73
|
-
"div",
|
|
74
|
-
{
|
|
75
|
-
ref: (a) => {
|
|
76
|
-
o.current = a, typeof u == "function" ? u(a) : u && (u.current = a);
|
|
77
|
-
},
|
|
78
|
-
id: `menu-content-${d}`,
|
|
79
|
-
role: "menu",
|
|
80
|
-
tabIndex: -1,
|
|
81
|
-
"aria-hidden": !r,
|
|
82
|
-
className: y(
|
|
83
|
-
E({
|
|
84
|
-
size: s
|
|
85
|
-
}),
|
|
86
|
-
"absolute z-50 transition-opacity duration-150 ease-out",
|
|
87
|
-
r ? "opacity-100" : "opacity-0",
|
|
88
|
-
e
|
|
89
|
-
),
|
|
90
|
-
style: {
|
|
91
|
-
minWidth: i.current?.offsetWidth,
|
|
92
|
-
top: c,
|
|
93
|
-
left: v
|
|
94
|
-
},
|
|
95
|
-
...t,
|
|
96
|
-
children: r && n
|
|
97
|
-
}
|
|
98
|
-
);
|
|
99
|
-
}
|
|
100
|
-
), k = f(
|
|
101
|
-
({ children: n, disabled: e, className: t, ...u }, r) => {
|
|
102
|
-
const { size: o } = p();
|
|
103
|
-
return /* @__PURE__ */ l.jsx(
|
|
104
|
-
"button",
|
|
105
|
-
{
|
|
106
|
-
ref: r,
|
|
107
|
-
role: "menuitem",
|
|
108
|
-
tabIndex: 0,
|
|
109
|
-
disabled: e,
|
|
110
|
-
"aria-disabled": e,
|
|
111
|
-
className: y(
|
|
112
|
-
z({
|
|
113
|
-
size: o
|
|
114
|
-
}),
|
|
115
|
-
t
|
|
116
|
-
),
|
|
117
|
-
...u,
|
|
118
|
-
children: n
|
|
119
|
-
}
|
|
120
|
-
);
|
|
121
|
-
}
|
|
122
|
-
);
|
|
123
|
-
function C(n, e, t, u) {
|
|
124
|
-
m(() => {
|
|
125
|
-
if (!n) return;
|
|
126
|
-
function r(o) {
|
|
127
|
-
!e.current?.contains(o.target) && !t.current?.contains(o.target) && u();
|
|
128
|
-
}
|
|
129
|
-
return document.addEventListener("mousedown", r), () => document.removeEventListener("mousedown", r);
|
|
130
|
-
}, [n, u, e, t]);
|
|
131
|
-
}
|
|
132
|
-
function D(n, e) {
|
|
133
|
-
m(() => {
|
|
134
|
-
if (n && e.current) {
|
|
135
|
-
const t = e.current.querySelectorAll('[role="menuitem"]');
|
|
136
|
-
t.length && t[0].focus();
|
|
137
|
-
}
|
|
138
|
-
}, [n, e]);
|
|
139
|
-
}
|
|
140
|
-
function A(n, e, t, u) {
|
|
141
|
-
m(() => {
|
|
142
|
-
if (!n || !e.current) return;
|
|
143
|
-
const r = e.current;
|
|
144
|
-
function o(i) {
|
|
145
|
-
const s = Array.from(
|
|
146
|
-
r.querySelectorAll('[role="menuitem"]')
|
|
147
|
-
), d = document.activeElement, c = s.indexOf(d);
|
|
148
|
-
i.key === "ArrowDown" ? (i.preventDefault(), s.length && s[(c + 1) % s.length].focus()) : i.key === "ArrowUp" ? (i.preventDefault(), s.length && s[(c - 1 + s.length) % s.length].focus()) : i.key === "Home" ? (i.preventDefault(), s.length && s[0].focus()) : i.key === "End" ? (i.preventDefault(), s.length && s[s.length - 1].focus()) : i.key === "Escape" && (i.preventDefault(), u(), t.current?.focus());
|
|
149
|
-
}
|
|
150
|
-
return r.addEventListener("keydown", o), () => r.removeEventListener("keydown", o);
|
|
151
|
-
}, [n, u, e, t]);
|
|
152
|
-
}
|
|
153
|
-
const L = ({
|
|
154
|
-
children: n,
|
|
155
|
-
isOpen: e,
|
|
156
|
-
onOutsideClick: t,
|
|
157
|
-
size: u = "md"
|
|
158
|
-
}) => {
|
|
159
|
-
const r = g(null), o = g(null);
|
|
160
|
-
return C(e, o, r, t), D(e, o), A(e, o, r, t), /* @__PURE__ */ l.jsx(
|
|
161
|
-
x.Provider,
|
|
162
|
-
{
|
|
163
|
-
value: { open: e, triggerRef: r, contentRef: o, size: u },
|
|
164
|
-
children: n
|
|
165
|
-
}
|
|
166
|
-
);
|
|
167
|
-
}, q = Object.assign(L, {
|
|
168
|
-
Trigger: I,
|
|
169
|
-
Content: j,
|
|
170
|
-
Item: k
|
|
171
|
-
});
|
|
172
|
-
export {
|
|
173
|
-
q as M
|
|
174
|
-
};
|
package/dist/modal-BGAtqMl9.js
DELETED
|
@@ -1,149 +0,0 @@
|
|
|
1
|
-
import { j as o, c as y } from "./index-DU1SCUkk.js";
|
|
2
|
-
import { forwardRef as s, useEffect as d, useRef as x, useState as p } from "react";
|
|
3
|
-
import { c as u } from "./cn-Ca4KprQ1.js";
|
|
4
|
-
const E = s(
|
|
5
|
-
({ className: e, ...t }, a) => /* @__PURE__ */ o.jsx(
|
|
6
|
-
"div",
|
|
7
|
-
{
|
|
8
|
-
ref: a,
|
|
9
|
-
className: u("px-6 pt-6 pb-2 text-lg font-semibold", e),
|
|
10
|
-
...t
|
|
11
|
-
}
|
|
12
|
-
)
|
|
13
|
-
), k = s(
|
|
14
|
-
({ className: e, ...t }, a) => /* @__PURE__ */ o.jsx(
|
|
15
|
-
"div",
|
|
16
|
-
{
|
|
17
|
-
ref: a,
|
|
18
|
-
className: u("px-6 py-4 flex justify-end gap-2", e),
|
|
19
|
-
...t
|
|
20
|
-
}
|
|
21
|
-
)
|
|
22
|
-
), M = s(
|
|
23
|
-
({ className: e, ...t }, a) => /* @__PURE__ */ o.jsx("div", { ref: a, className: u("px-6 py-2", e), ...t })
|
|
24
|
-
), R = s(
|
|
25
|
-
({ onOverlayClick: e, ...t }, a) => /* @__PURE__ */ o.jsx(
|
|
26
|
-
"div",
|
|
27
|
-
{
|
|
28
|
-
ref: a,
|
|
29
|
-
role: "presentation",
|
|
30
|
-
tabIndex: -1,
|
|
31
|
-
"aria-modal": "true",
|
|
32
|
-
onClick: e,
|
|
33
|
-
...t
|
|
34
|
-
}
|
|
35
|
-
)
|
|
36
|
-
), N = y(
|
|
37
|
-
"fixed inset-0 z-51 transition-opacity duration-300 bg-black/30 backdrop-blur-md flex items-center justify-center transition-opacity duration-200 ease-in-out",
|
|
38
|
-
{
|
|
39
|
-
variants: {
|
|
40
|
-
placement: {
|
|
41
|
-
top: "items-start",
|
|
42
|
-
center: "items-center"
|
|
43
|
-
}
|
|
44
|
-
},
|
|
45
|
-
defaultVariants: {
|
|
46
|
-
placement: "center"
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
), V = y(
|
|
50
|
-
[
|
|
51
|
-
"bg-white rounded-lg shadow-xl relative",
|
|
52
|
-
"flex flex-col",
|
|
53
|
-
"outline-none",
|
|
54
|
-
"mx-4",
|
|
55
|
-
"transition-all duration-200 ease-in-out "
|
|
56
|
-
],
|
|
57
|
-
{
|
|
58
|
-
variants: {
|
|
59
|
-
size: {
|
|
60
|
-
sm: "w-[20rem] max-w-sm",
|
|
61
|
-
// 20rem, 320px
|
|
62
|
-
md: "w-[28rem] max-w-md",
|
|
63
|
-
// 28rem, 448px
|
|
64
|
-
lg: "w-[36rem] max-w-lg"
|
|
65
|
-
// 36rem, 576px
|
|
66
|
-
},
|
|
67
|
-
placement: {
|
|
68
|
-
top: "mt-4",
|
|
69
|
-
center: ""
|
|
70
|
-
}
|
|
71
|
-
},
|
|
72
|
-
defaultVariants: {
|
|
73
|
-
size: "md",
|
|
74
|
-
placement: "center"
|
|
75
|
-
}
|
|
76
|
-
}
|
|
77
|
-
);
|
|
78
|
-
function A(e, t) {
|
|
79
|
-
d(() => {
|
|
80
|
-
if (t && e.current) {
|
|
81
|
-
const a = e.current.querySelectorAll(
|
|
82
|
-
'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
|
|
83
|
-
);
|
|
84
|
-
a.length && a[0].focus();
|
|
85
|
-
}
|
|
86
|
-
}, [t, e]);
|
|
87
|
-
}
|
|
88
|
-
function F(e, t) {
|
|
89
|
-
d(() => {
|
|
90
|
-
if (!e) return;
|
|
91
|
-
const a = (n) => {
|
|
92
|
-
n.key === "Escape" && t();
|
|
93
|
-
};
|
|
94
|
-
return document.addEventListener("keydown", a), () => document.removeEventListener("keydown", a);
|
|
95
|
-
}, [e, t]);
|
|
96
|
-
}
|
|
97
|
-
const I = 200, T = ({
|
|
98
|
-
isOpen: e,
|
|
99
|
-
onOpenChange: t,
|
|
100
|
-
size: a = "md",
|
|
101
|
-
placement: n = "center",
|
|
102
|
-
children: v,
|
|
103
|
-
disableOverlayClose: b,
|
|
104
|
-
disableEscClose: w,
|
|
105
|
-
...j
|
|
106
|
-
}) => {
|
|
107
|
-
const r = x(null), i = x(null), [g, m] = p(e), [f, c] = p(!1);
|
|
108
|
-
return d(() => {
|
|
109
|
-
if (e)
|
|
110
|
-
m(!0), c(!1), r.current = document.activeElement;
|
|
111
|
-
else if (g) {
|
|
112
|
-
c(!0);
|
|
113
|
-
const l = setTimeout(() => {
|
|
114
|
-
m(!1), c(!1), r.current && r.current.focus();
|
|
115
|
-
}, I);
|
|
116
|
-
return () => clearTimeout(l);
|
|
117
|
-
}
|
|
118
|
-
}, [e]), F(e && !w, () => {
|
|
119
|
-
t && t(!1);
|
|
120
|
-
}), A(i, e), /* @__PURE__ */ o.jsx(
|
|
121
|
-
R,
|
|
122
|
-
{
|
|
123
|
-
ref: i,
|
|
124
|
-
className: `${N({ placement: n })} transition-opacity duration-200 ease-in-out ` + (e && !f ? "opacity-100" : "opacity-0 pointer-events-none"),
|
|
125
|
-
onOverlayClick: (l) => {
|
|
126
|
-
l.target === i.current && !b && t && t(!1);
|
|
127
|
-
},
|
|
128
|
-
placement: n,
|
|
129
|
-
children: /* @__PURE__ */ o.jsx(
|
|
130
|
-
"div",
|
|
131
|
-
{
|
|
132
|
-
className: `${V({ size: a, placement: n })} transition-all duration-200 ease-in-out ` + (e && !f ? "opacity-100 scale-100" : "opacity-0 scale-95 pointer-events-none"),
|
|
133
|
-
role: "dialog",
|
|
134
|
-
...j,
|
|
135
|
-
tabIndex: 0,
|
|
136
|
-
"aria-hidden": !e,
|
|
137
|
-
children: v
|
|
138
|
-
}
|
|
139
|
-
)
|
|
140
|
-
}
|
|
141
|
-
);
|
|
142
|
-
}, B = Object.assign(T, {
|
|
143
|
-
Header: E,
|
|
144
|
-
Body: M,
|
|
145
|
-
Footer: k
|
|
146
|
-
});
|
|
147
|
-
export {
|
|
148
|
-
B as M
|
|
149
|
-
};
|
|
@@ -1,173 +0,0 @@
|
|
|
1
|
-
import { c as m, j as r } from "./index-DU1SCUkk.js";
|
|
2
|
-
import f, { createContext as k, useContext as w } from "react";
|
|
3
|
-
import { c as h } from "./cn-Ca4KprQ1.js";
|
|
4
|
-
const y = m("space-y-2", {
|
|
5
|
-
variants: {
|
|
6
|
-
direction: {
|
|
7
|
-
vertical: "space-y-2 space-x-0",
|
|
8
|
-
horizontal: "flex flex-wrap gap-4 space-y-0"
|
|
9
|
-
}
|
|
10
|
-
},
|
|
11
|
-
defaultVariants: {
|
|
12
|
-
direction: "vertical"
|
|
13
|
-
}
|
|
14
|
-
}), v = m(
|
|
15
|
-
"relative h-4 w-4 rounded-full border cursor-pointer transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed appearance-none bg-white",
|
|
16
|
-
{
|
|
17
|
-
variants: {
|
|
18
|
-
variant: {
|
|
19
|
-
// Core variants using Versaur color system
|
|
20
|
-
primary: "border-coral/40 checked:bg-coral checked:border-coral focus:ring-coral/20",
|
|
21
|
-
secondary: "border-sage/40 checked:bg-sage checked:border-sage focus:ring-sage/20",
|
|
22
|
-
tertiary: "border-mist/40 checked:bg-mist checked:border-mist focus:ring-mist/20",
|
|
23
|
-
ghost: "border-slate/40 checked:bg-slate checked:border-slate focus:ring-slate/20",
|
|
24
|
-
neutral: "border-gray-300 checked:bg-gray-500 checked:border-gray-500 focus:ring-gray-400/20",
|
|
25
|
-
// Outline variants
|
|
26
|
-
"primary-outline": "border-coral checked:bg-white checked:border-coral focus:ring-coral/20",
|
|
27
|
-
"secondary-outline": "border-sage checked:bg-white checked:border-sage focus:ring-sage/20",
|
|
28
|
-
"tertiary-outline": "border-mist checked:bg-white checked:border-mist focus:ring-mist/20",
|
|
29
|
-
"ghost-outline": "border-slate checked:bg-white checked:border-slate focus:ring-slate/20",
|
|
30
|
-
"neutral-outline": "border-gray-400 checked:bg-white checked:border-gray-400 focus:ring-gray-500/20",
|
|
31
|
-
// Semantic variants
|
|
32
|
-
success: "border-success/40 checked:bg-success checked:border-success focus:ring-success/20",
|
|
33
|
-
"success-outline": "border-success checked:bg-white checked:border-success focus:ring-success/20",
|
|
34
|
-
info: "border-info/40 checked:bg-info checked:border-info focus:ring-info/20",
|
|
35
|
-
"info-outline": "border-info checked:bg-white checked:border-info focus:ring-info/20",
|
|
36
|
-
warning: "border-warning/40 checked:bg-warning checked:border-warning focus:ring-warning/20",
|
|
37
|
-
"warning-outline": "border-warning checked:bg-white checked:border-warning focus:ring-warning/20",
|
|
38
|
-
danger: "border-danger/40 checked:bg-danger checked:border-danger focus:ring-danger/20",
|
|
39
|
-
"danger-outline": "border-danger checked:bg-white checked:border-danger focus:ring-danger/20"
|
|
40
|
-
},
|
|
41
|
-
size: {
|
|
42
|
-
sm: "h-3 w-3",
|
|
43
|
-
md: "h-4 w-4",
|
|
44
|
-
lg: "h-5 w-5"
|
|
45
|
-
}
|
|
46
|
-
},
|
|
47
|
-
defaultVariants: {
|
|
48
|
-
variant: "primary",
|
|
49
|
-
size: "md"
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
), j = m(
|
|
53
|
-
"text-foreground cursor-pointer select-none",
|
|
54
|
-
{
|
|
55
|
-
variants: {
|
|
56
|
-
size: {
|
|
57
|
-
sm: "text-xs",
|
|
58
|
-
md: "text-sm",
|
|
59
|
-
lg: "text-base"
|
|
60
|
-
},
|
|
61
|
-
disabled: {
|
|
62
|
-
true: "opacity-50 cursor-not-allowed",
|
|
63
|
-
false: ""
|
|
64
|
-
}
|
|
65
|
-
},
|
|
66
|
-
defaultVariants: {
|
|
67
|
-
size: "md",
|
|
68
|
-
disabled: !1
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
), x = k(
|
|
72
|
-
null
|
|
73
|
-
), z = () => {
|
|
74
|
-
const o = w(x);
|
|
75
|
-
if (!o)
|
|
76
|
-
throw new Error(
|
|
77
|
-
"useRadioInputContext must be used within RadioInputContext"
|
|
78
|
-
);
|
|
79
|
-
return o;
|
|
80
|
-
}, R = f.forwardRef(
|
|
81
|
-
({ children: o, description: c, className: a, disabled: i, id: n, value: l, ...b }, g) => {
|
|
82
|
-
const e = z(), u = f.useId(), d = n || u, t = i || e.disabled, s = e.error ? "danger" : e.variant || "primary";
|
|
83
|
-
return /* @__PURE__ */ r.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
84
|
-
/* @__PURE__ */ r.jsx("div", { className: "relative flex items-center", children: /* @__PURE__ */ r.jsx(
|
|
85
|
-
"input",
|
|
86
|
-
{
|
|
87
|
-
ref: g,
|
|
88
|
-
type: "radio",
|
|
89
|
-
id: d,
|
|
90
|
-
name: e.name,
|
|
91
|
-
value: l,
|
|
92
|
-
disabled: t,
|
|
93
|
-
className: h(
|
|
94
|
-
v({
|
|
95
|
-
variant: s,
|
|
96
|
-
size: e.size
|
|
97
|
-
}),
|
|
98
|
-
// Custom radio dot styling using ::before - centered positioning with size variants
|
|
99
|
-
'before:content-[""] before:absolute before:left-1/2 before:top-1/2 before:-translate-x-1/2 before:-translate-y-1/2 before:rounded-full before:bg-white before:opacity-0 before:transition-opacity before:duration-200',
|
|
100
|
-
// Size-specific radio dot dimensions
|
|
101
|
-
e.size === "sm" && "before:w-[6px] before:h-[6px]",
|
|
102
|
-
e.size === "md" && "before:w-[8px] before:h-[8px]",
|
|
103
|
-
e.size === "lg" && "before:w-[10px] before:h-[10px]",
|
|
104
|
-
"checked:before:opacity-100",
|
|
105
|
-
// Outline variants use colored radio dot
|
|
106
|
-
s?.includes("outline") && "checked:before:bg-current",
|
|
107
|
-
a
|
|
108
|
-
),
|
|
109
|
-
...b
|
|
110
|
-
}
|
|
111
|
-
) }),
|
|
112
|
-
/* @__PURE__ */ r.jsxs("div", { className: "flex-1", children: [
|
|
113
|
-
/* @__PURE__ */ r.jsx(
|
|
114
|
-
"label",
|
|
115
|
-
{
|
|
116
|
-
htmlFor: d,
|
|
117
|
-
className: j({
|
|
118
|
-
size: e.size,
|
|
119
|
-
disabled: t
|
|
120
|
-
}),
|
|
121
|
-
children: o
|
|
122
|
-
}
|
|
123
|
-
),
|
|
124
|
-
c && /* @__PURE__ */ r.jsx(
|
|
125
|
-
"div",
|
|
126
|
-
{
|
|
127
|
-
className: h(
|
|
128
|
-
"text-gray-600 mt-1",
|
|
129
|
-
e.size === "sm" && "text-xs",
|
|
130
|
-
e.size === "md" && "text-xs",
|
|
131
|
-
e.size === "lg" && "text-sm",
|
|
132
|
-
t && "opacity-50"
|
|
133
|
-
),
|
|
134
|
-
children: c
|
|
135
|
-
}
|
|
136
|
-
)
|
|
137
|
-
] })
|
|
138
|
-
] });
|
|
139
|
-
}
|
|
140
|
-
), N = f.forwardRef(
|
|
141
|
-
({
|
|
142
|
-
variant: o = "primary",
|
|
143
|
-
size: c = "md",
|
|
144
|
-
label: a,
|
|
145
|
-
helperText: i,
|
|
146
|
-
error: n,
|
|
147
|
-
direction: l = "vertical",
|
|
148
|
-
className: b,
|
|
149
|
-
disabled: g,
|
|
150
|
-
name: e,
|
|
151
|
-
children: u,
|
|
152
|
-
...d
|
|
153
|
-
}, t) => {
|
|
154
|
-
const s = !!n, p = {
|
|
155
|
-
variant: o,
|
|
156
|
-
size: c,
|
|
157
|
-
disabled: g,
|
|
158
|
-
error: s,
|
|
159
|
-
name: e
|
|
160
|
-
};
|
|
161
|
-
return /* @__PURE__ */ r.jsx(x.Provider, { value: p, children: /* @__PURE__ */ r.jsxs("div", { ref: t, className: h("w-full", b), ...d, children: [
|
|
162
|
-
a && /* @__PURE__ */ r.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: a }),
|
|
163
|
-
/* @__PURE__ */ r.jsx("div", { className: y({ direction: l }), children: u }),
|
|
164
|
-
s && /* @__PURE__ */ r.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: n }),
|
|
165
|
-
!s && i && /* @__PURE__ */ r.jsx("div", { className: "mt-2 text-sm text-gray-600", children: i })
|
|
166
|
-
] }) });
|
|
167
|
-
}
|
|
168
|
-
), O = Object.assign(N, {
|
|
169
|
-
Option: R
|
|
170
|
-
});
|
|
171
|
-
export {
|
|
172
|
-
O as R
|
|
173
|
-
};
|