@versini/ui-panel 0.0.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.
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) Arno Versini
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,3 @@
1
+ # @versini/ui-panel
2
+
3
+ A simple panel component for React.
@@ -0,0 +1,261 @@
1
+ import { jsx as i, jsxs as D, Fragment as M } from "react/jsx-runtime";
2
+ import y from "clsx";
3
+ import * as c from "react";
4
+ import { useRef as A, useReducer as N, useEffect as _, useId as x } from "react";
5
+ import { useFloating as $, useClick as S, useDismiss as O, useRole as P, useInteractions as F, useMergeRefs as k, FloatingPortal as L, FloatingOverlay as U, FloatingFocusManager as V } from "@floating-ui/react";
6
+ const w = "SET_ANNOUNCEMENT", R = "CLEAR_ANNOUNCEMENT", j = {
7
+ alert: null,
8
+ alertdialog: null,
9
+ log: "polite",
10
+ marquee: null,
11
+ progressbar: null,
12
+ status: "polite",
13
+ timer: "assertive"
14
+ }, B = (e, n) => {
15
+ switch (n == null ? void 0 : n.type) {
16
+ case w:
17
+ return {
18
+ ...e,
19
+ announcement: n.payload
20
+ };
21
+ case R:
22
+ return {
23
+ ...e,
24
+ announcement: null
25
+ };
26
+ default:
27
+ return e;
28
+ }
29
+ }, q = ({
30
+ onAnnouncementClear: e,
31
+ dispatch: n
32
+ }) => {
33
+ n({
34
+ type: R
35
+ }), typeof e == "function" && e();
36
+ }, C = ({
37
+ children: e,
38
+ clearAnnouncementDelay: n,
39
+ clearAnnouncementTimeoutRef: o,
40
+ onAnnouncementClear: t,
41
+ dispatch: l
42
+ }) => {
43
+ (o == null ? void 0 : o.current) !== null && clearTimeout(o.current), e !== null && l({
44
+ type: w,
45
+ payload: e
46
+ }), n && (o.current = setTimeout(
47
+ () => q({
48
+ onAnnouncementClear: t,
49
+ dispatch: l
50
+ }),
51
+ n
52
+ ));
53
+ }, H = ({
54
+ children: e,
55
+ announcementTimeoutRef: n,
56
+ announcementDelay: o,
57
+ clearAnnouncementDelay: t,
58
+ clearAnnouncementTimeoutRef: l,
59
+ onAnnouncementClear: r,
60
+ dispatch: a
61
+ }) => {
62
+ clearTimeout(n.current), o ? n.current = setTimeout(C, o, {
63
+ children: e,
64
+ clearAnnouncementDelay: t,
65
+ clearAnnouncementTimeoutRef: l,
66
+ onAnnouncementClear: r,
67
+ dispatch: a
68
+ }) : C({
69
+ children: e,
70
+ clearAnnouncementDelay: t,
71
+ clearAnnouncementTimeoutRef: l,
72
+ onAnnouncementClear: r,
73
+ dispatch: a
74
+ });
75
+ };
76
+ function X({
77
+ children: e,
78
+ className: n,
79
+ politeness: o,
80
+ role: t = null,
81
+ announcementDelay: l,
82
+ clearAnnouncementDelay: r,
83
+ onAnnouncementClear: a,
84
+ visible: s,
85
+ ...f
86
+ }) {
87
+ const u = A(), d = A(), [m, p] = N(B, {
88
+ announcement: null
89
+ });
90
+ let h = o;
91
+ typeof h > "u" && (h = t ? j[t] : "assertive"), _(() => {
92
+ H({
93
+ announcementTimeoutRef: u,
94
+ announcementDelay: l,
95
+ children: e,
96
+ clearAnnouncementDelay: r,
97
+ clearAnnouncementTimeoutRef: d,
98
+ onAnnouncementClear: a,
99
+ dispatch: p
100
+ });
101
+ }, [
102
+ e,
103
+ l,
104
+ r,
105
+ a
106
+ ]);
107
+ const g = y(n, {
108
+ "sr-only": !s
109
+ });
110
+ return /* @__PURE__ */ i(
111
+ "div",
112
+ {
113
+ "aria-live": h,
114
+ ...t && { role: t },
115
+ className: g,
116
+ ...f,
117
+ children: m.announcement
118
+ }
119
+ );
120
+ }
121
+ const E = c.createContext(null);
122
+ function z({
123
+ initialOpen: e = !1,
124
+ open: n,
125
+ onOpenChange: o
126
+ } = {}) {
127
+ const [t, l] = c.useState(e), [r, a] = c.useState(), [s, f] = c.useState(), u = n ?? t, d = o ?? l, m = $({
128
+ open: u,
129
+ onOpenChange: d
130
+ }), p = m.context, h = S(p, {
131
+ enabled: n == null
132
+ }), g = O(p, {
133
+ outsidePress: !1,
134
+ outsidePressEvent: "mousedown"
135
+ }), T = P(p), b = F([h, g, T]);
136
+ return c.useMemo(
137
+ () => ({
138
+ open: u,
139
+ setOpen: d,
140
+ ...b,
141
+ ...m,
142
+ labelId: r,
143
+ descriptionId: s,
144
+ setLabelId: a,
145
+ setDescriptionId: f
146
+ }),
147
+ [u, d, b, m, r, s]
148
+ );
149
+ }
150
+ const v = () => {
151
+ const e = c.useContext(E);
152
+ if (e == null)
153
+ throw new Error("Modal components must be wrapped in <Modal />");
154
+ return e;
155
+ };
156
+ function I(e) {
157
+ return x();
158
+ }
159
+ function Y({
160
+ children: e,
161
+ ...n
162
+ }) {
163
+ const o = z(n);
164
+ return /* @__PURE__ */ i(E.Provider, { value: o, children: e });
165
+ }
166
+ const Z = c.forwardRef(function(e, n) {
167
+ const { context: o, ...t } = v(), l = k([t.refs.setFloating, n]);
168
+ if (!o.open)
169
+ return null;
170
+ const { overlayBackground: r, ...a } = e, s = y("grid place-items-center", {
171
+ [`${r}`]: r,
172
+ "bg-black sm:bg-black/[.8]": !r
173
+ });
174
+ return /* @__PURE__ */ i(L, { children: /* @__PURE__ */ i(U, { className: s, lockScroll: !0, children: /* @__PURE__ */ i(V, { context: o, children: /* @__PURE__ */ i(
175
+ "div",
176
+ {
177
+ ref: l,
178
+ "aria-labelledby": t.labelId,
179
+ "aria-describedby": t.descriptionId,
180
+ ...t.getFloatingProps(a),
181
+ children: a.children
182
+ }
183
+ ) }) }) });
184
+ }), ee = c.forwardRef(function({ children: e, ...n }, o) {
185
+ const { setLabelId: t } = v(), l = I();
186
+ return c.useLayoutEffect(() => (t(l), () => t(void 0)), [l, t]), /* @__PURE__ */ i("h1", { ...n, ref: o, id: l, children: e });
187
+ }), ne = c.forwardRef(function({ children: e, ...n }, o) {
188
+ const { setDescriptionId: t } = v(), l = I();
189
+ return c.useLayoutEffect(() => (t(l), () => t(void 0)), [l, t]), /* @__PURE__ */ i("div", { ...n, ref: o, id: l, children: e });
190
+ }), oe = c.forwardRef(function(e, n) {
191
+ const { setOpen: o } = v(), { trigger: t, className: l, ...r } = e, a = c.useCallback(() => o(!1), [o]);
192
+ return /* @__PURE__ */ i("div", { className: l, children: c.cloneElement(t, {
193
+ ref: n,
194
+ onClick: a,
195
+ ...r
196
+ }) });
197
+ }), G = (e) => {
198
+ let n = "";
199
+ if (typeof e == "number" || typeof e == "string")
200
+ n = "m-" + e;
201
+ else {
202
+ const o = [];
203
+ (e == null ? void 0 : e.t) !== void 0 && o.push(`mt-${e.t}`), (e == null ? void 0 : e.r) !== void 0 && o.push(`mr-${e.r}`), (e == null ? void 0 : e.b) !== void 0 && o.push(`mb-${e.b}`), (e == null ? void 0 : e.l) !== void 0 && o.push(`ml-${e.l}`), n = o.join(" ");
204
+ }
205
+ return n;
206
+ }, te = ({
207
+ children: e,
208
+ fill: n,
209
+ viewBox: o,
210
+ className: t,
211
+ defaultViewBox: l,
212
+ defaultClassName: r,
213
+ spacing: a,
214
+ title: s,
215
+ semantic: f = !1,
216
+ ...u
217
+ }) => {
218
+ const d = G(a), m = y(
219
+ d,
220
+ t || r
221
+ );
222
+ return /* @__PURE__ */ D(M, { children: [
223
+ /* @__PURE__ */ i(
224
+ "svg",
225
+ {
226
+ xmlns: "http://www.w3.org/2000/svg",
227
+ className: m,
228
+ viewBox: o || l,
229
+ fill: n || "currentColor",
230
+ role: "img",
231
+ "aria-hidden": !f,
232
+ focusable: !1,
233
+ ...u,
234
+ children: e
235
+ }
236
+ ),
237
+ s && f && /* @__PURE__ */ i("span", { className: "sr-only", children: s })
238
+ ] });
239
+ };
240
+ /*!
241
+ @versini/ui-private v1.4.9
242
+ © 2024 gizmette.com
243
+ */
244
+ try {
245
+ window.__VERSINI_UI_PRIVATE__ || (window.__VERSINI_UI_PRIVATE__ = {
246
+ version: "1.4.9",
247
+ buildTime: "09/17/2024 06:27 PM EDT",
248
+ homepage: "https://github.com/aversini/ui-components",
249
+ license: "MIT"
250
+ });
251
+ } catch {
252
+ }
253
+ export {
254
+ X as LiveRegion,
255
+ Y as Modal,
256
+ oe as ModalClose,
257
+ Z as ModalContent,
258
+ ne as ModalDescription,
259
+ ee as ModalHeading,
260
+ te as SvgIcon
261
+ };
@@ -0,0 +1,6 @@
1
+ import "react/jsx-runtime";
2
+ import { Panel as t } from "../../index.js";
3
+ import "react";
4
+ export {
5
+ t as Panel
6
+ };
@@ -0,0 +1,45 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+
3
+ declare const MESSAGEBOX_CLASSNAME = "av-messagebox";
4
+ declare const PANEL_CLASSNAME = "av-panel";
5
+
6
+ type PanelProps = {
7
+ /**
8
+ * Class name to apply to the Panel - this will ONLY override the default width styles.
9
+ */
10
+ className?: string;
11
+ /**
12
+ * The children to render.
13
+ */
14
+ children: React.ReactNode;
15
+ /**
16
+ * Callback fired when the component is opened or closed.
17
+ * @param open whether or not the menu is open
18
+ */
19
+ onOpenChange: (open: boolean) => void;
20
+ /**
21
+ * Whether or not to open the component..
22
+ * @default false
23
+ */
24
+ open: boolean;
25
+ /**
26
+ * The title to use for the panel.
27
+ */
28
+ title: string;
29
+ /**
30
+ * The type of Panel border.
31
+ */
32
+ borderMode?: "dark" | "light";
33
+ /**
34
+ * The content to render in the footer.
35
+ */
36
+ footer?: React.ReactNode;
37
+ /**
38
+ * The type of Panel. This will change the layout of the Panel.
39
+ */
40
+ kind?: "panel" | "messagebox";
41
+ };
42
+
43
+ declare const Panel: ({ open, onOpenChange, title, children, footer, borderMode, kind, className, }: PanelProps) => react_jsx_runtime.JSX.Element;
44
+
45
+ export { MESSAGEBOX_CLASSNAME, PANEL_CLASSNAME, Panel };
package/dist/index.js ADDED
@@ -0,0 +1,535 @@
1
+ import { jsx as l, jsxs as y, Fragment as V } from "react/jsx-runtime";
2
+ import o from "clsx";
3
+ import E, { lazy as z, useRef as U, useEffect as j, Suspense as O } from "react";
4
+ /*!
5
+ @versini/ui-panel v0.0.0
6
+ © 2024 gizmette.com
7
+ */
8
+ try {
9
+ window.__VERSINI_UI_PANEL__ || (window.__VERSINI_UI_PANEL__ = {
10
+ version: "0.0.0",
11
+ buildTime: "09/17/2024 06:28 PM EDT",
12
+ homepage: "https://github.com/aversini/ui-components",
13
+ license: "MIT"
14
+ });
15
+ } catch {
16
+ }
17
+ const R = "av-messagebox", C = "av-panel", S = "av-button", D = (e) => {
18
+ let t = "";
19
+ if (typeof e == "number" || typeof e == "string")
20
+ t = "m-" + e;
21
+ else {
22
+ const r = [];
23
+ (e == null ? void 0 : e.t) !== void 0 && r.push(`mt-${e.t}`), (e == null ? void 0 : e.r) !== void 0 && r.push(`mr-${e.r}`), (e == null ? void 0 : e.b) !== void 0 && r.push(`mb-${e.b}`), (e == null ? void 0 : e.l) !== void 0 && r.push(`ml-${e.l}`), t = r.join(" ");
24
+ }
25
+ return t;
26
+ }, T = "icon", W = "button", G = "link", H = ({
27
+ type: e,
28
+ size: t,
29
+ labelRight: r,
30
+ labelLeft: a,
31
+ align: n
32
+ }) => {
33
+ const d = "text-sm font-medium max-h-8 py-0", g = "text-base font-medium max-h-9 py-1", i = "text-lg font-medium max-h-12 py-2";
34
+ switch (e) {
35
+ case W:
36
+ return o("px-4", {
37
+ [d]: t === "small",
38
+ [g]: t === "medium",
39
+ [i]: t === "large"
40
+ });
41
+ case G:
42
+ return o("px-4 text-center", {
43
+ [d]: t === "small",
44
+ [g]: t === "medium",
45
+ [i]: t === "large"
46
+ });
47
+ case T:
48
+ return o("inline-flex items-center", {
49
+ "justify-center": n === "center",
50
+ "justify-start": n === "left",
51
+ "justify-end": n === "right",
52
+ "h-6 w-6 p-0": t === "small" && !(r || a),
53
+ "h-6 px-4 text-sm font-medium": t === "small" && (r || a),
54
+ "h-8 w-8 p-1": t === "medium" && !(r || a),
55
+ "h-8 px-4 text-base font-medium": t === "medium" && (r || a),
56
+ "h-12 w-12 p-2": t === "large" && !(r || a),
57
+ "h-12 px-4 text-lg font-medium": t === "large" && (r || a)
58
+ });
59
+ }
60
+ }, X = ({
61
+ mode: e,
62
+ noBackground: t,
63
+ noTruncate: r,
64
+ variant: a
65
+ }) => {
66
+ if (t)
67
+ return "not-prose rounded-full";
68
+ if (a === "primary")
69
+ return o("not-prose rounded-full", {
70
+ truncate: !r,
71
+ "bg-action-dark text-copy-light": e === "dark",
72
+ "bg-action-light text-copy-lighter": e === "light",
73
+ "bg-action-dark text-copy-light dark:bg-action-light dark:text-copy-lighter": e === "system",
74
+ "bg-action-light text-copy-lighter dark:bg-action-dark dark:text-copy-light": e === "alt-system"
75
+ });
76
+ if (a === "secondary")
77
+ return o("not-prose rounded-full", {
78
+ truncate: !r,
79
+ "bg-action-dark text-copy-light": e === "light",
80
+ "bg-action-light text-copy-lighter": e === "dark",
81
+ "bg-action-dark text-copy-light dark:bg-action-light dark:text-copy-lighter": e === "alt-system",
82
+ "bg-action-light text-copy-lighter dark:bg-action-dark dark:text-copy-light": e === "system"
83
+ });
84
+ if (a === "danger")
85
+ return o("not-prose rounded-full", {
86
+ truncate: !r,
87
+ "bg-action-danger-dark text-copy-light": e === "dark",
88
+ "bg-action-danger-light text-copy-lighter": e === "light",
89
+ "bg-action-danger-dark text-copy-light dark:bg-action-danger-light dark:text-copy-lighter": e === "system",
90
+ "bg-action-danger-light text-copy-lighter dark:bg-action-danger-dark dark:text-copy-light": e === "alt-system"
91
+ });
92
+ }, Y = ({
93
+ mode: e,
94
+ disabled: t,
95
+ variant: r
96
+ }) => {
97
+ if (t)
98
+ return "";
99
+ if (r === "primary")
100
+ return o("hover:text-copy-light-hover", {
101
+ "hover:bg-action-dark-hover": e === "dark",
102
+ "hover:bg-action-light-hover": e === "light",
103
+ "hover:bg-action-dark-hover dark:hover:bg-action-light-hover": e === "system",
104
+ "hover:bg-action-light-hover dark:hover:bg-action-dark-hover": e === "alt-system"
105
+ });
106
+ if (r === "secondary")
107
+ return o("hover:text-copy-light-hover", {
108
+ "hover:bg-action-dark-hover": e === "light",
109
+ "hover:bg-action-light-hover": e === "dark",
110
+ "hover:bg-action-dark-hover dark:hover:bg-action-light-hover": e === "alt-system",
111
+ "hover:bg-action-light-hover dark:hover:bg-action-dark-hover": e === "system"
112
+ });
113
+ if (r === "danger")
114
+ return o("hover:text-copy-light-hover", {
115
+ "hover:bg-action-danger-dark-hover": e === "dark",
116
+ "hover:bg-action-danger-light-hover": e === "light",
117
+ "hover:bg-action-danger-dark-hover dark:hover:bg-action-danger-light-hover": e === "system",
118
+ "hover:bg-action-danger-light-hover dark:hover:bg-action-danger-dark-hover": e === "alt-system"
119
+ });
120
+ }, F = ({
121
+ mode: e,
122
+ disabled: t,
123
+ variant: r
124
+ }) => {
125
+ if (t)
126
+ return "";
127
+ if (r === "primary")
128
+ return o("active:text-copy-light-active", {
129
+ "active:bg-action-dark-active": e === "dark",
130
+ "active:bg-action-light-active": e === "light",
131
+ "active:bg-action-dark-active dark:active:bg-action-light-active": e === "system",
132
+ "active:bg-action-light-active dark:active:bg-action-dark-active": e === "alt-system"
133
+ });
134
+ if (r === "secondary")
135
+ return o("active:text-copy-light-active", {
136
+ "active:bg-action-dark-active": e === "light",
137
+ "active:bg-action-light-active": e === "dark",
138
+ "active:bg-action-dark-active dark:active:bg-action-light-active": e === "alt-system",
139
+ "active:bg-action-light-active dark:active:bg-action-dark-active": e === "system"
140
+ });
141
+ if (r === "danger")
142
+ return o("active:text-copy-lighter-active", {
143
+ "active:bg-action-danger-dark-active": e === "dark",
144
+ "active:bg-action-danger-light-active": e === "light",
145
+ "active:bg-action-danger-dark-active dark:active:bg-action-danger-light-active": e === "system",
146
+ "active:bg-action-danger-light-active dark:active:bg-action-danger-dark-active": e === "alt-system"
147
+ });
148
+ }, q = ({
149
+ mode: e,
150
+ noBorder: t,
151
+ variant: r
152
+ }) => {
153
+ if (t)
154
+ return "border border-transparent";
155
+ if (r === "primary")
156
+ return o("border", {
157
+ "border-border-dark": e === "dark",
158
+ "border-border-accent": e === "light",
159
+ "border-border-dark dark:border-border-accent": e === "system",
160
+ "border-border-accent dark:border-border-dark": e === "alt-system"
161
+ });
162
+ if (r === "secondary")
163
+ return o("border", {
164
+ "border-border-dark": e === "light",
165
+ "border-border-accent": e === "dark",
166
+ "border-border-dark dark:border-border-accent": e === "alt-system",
167
+ "border-border-accent dark:border-border-dark": e === "system"
168
+ });
169
+ if (r === "danger")
170
+ return o("border", {
171
+ "border-border-danger-dark": e === "dark",
172
+ "border-border-danger-medium": e === "light",
173
+ "border-border-danger-dark dark:border-border-danger-medium": e === "system",
174
+ "border-border-danger-medium dark:border-border-danger-dark": e === "alt-system"
175
+ });
176
+ }, J = ({ focusMode: e }) => o("focus:outline", "focus:outline-2", "focus:outline-offset-2", {
177
+ "focus:outline-focus-dark": e === "dark",
178
+ "focus:outline-focus-light": e === "light",
179
+ "focus:outline-focus-light dark:focus:outline-focus-dark": e === "alt-system",
180
+ "focus:outline-focus-dark dark:focus:outline-focus-light": e === "system"
181
+ }), L = ({
182
+ type: e,
183
+ className: t,
184
+ raw: r,
185
+ mode: a,
186
+ focusMode: n,
187
+ disabled: d,
188
+ fullWidth: g,
189
+ size: i,
190
+ noBorder: h,
191
+ labelRight: s,
192
+ labelLeft: u,
193
+ spacing: b,
194
+ noBackground: m,
195
+ variant: c,
196
+ noTruncate: f,
197
+ align: v
198
+ }) => (c || (c = "primary"), r ? o(S, t) : o(
199
+ S,
200
+ t,
201
+ D(b),
202
+ X({ mode: a, variant: c, noBackground: m, noTruncate: f }),
203
+ H({ type: e, size: i, labelRight: s, labelLeft: u, align: v }),
204
+ q({ mode: a, variant: c, noBorder: h }),
205
+ J({ focusMode: n }),
206
+ Y({ mode: a, variant: c, disabled: d }),
207
+ F({ mode: a, variant: c, disabled: d }),
208
+ {
209
+ "w-full": g,
210
+ "disabled:cursor-not-allowed disabled:opacity-50": d
211
+ }
212
+ )), K = (e, t, r) => {
213
+ var a;
214
+ !t && (!document.activeElement || document.activeElement !== e.currentTarget) && typeof ((a = e == null ? void 0 : e.currentTarget) == null ? void 0 : a.focus) == "function" && e.currentTarget.focus(), typeof r == "function" && r(e);
215
+ }, M = E.forwardRef((e, t) => {
216
+ const { onClick: r, noInternalClick: a = !1, ...n } = e;
217
+ return /* @__PURE__ */ l(
218
+ "button",
219
+ {
220
+ ref: t,
221
+ onClick: (d) => {
222
+ K(d, a, r);
223
+ },
224
+ ...n
225
+ }
226
+ );
227
+ });
228
+ M.displayName = "BaseButton";
229
+ const $ = E.forwardRef(
230
+ ({
231
+ children: e,
232
+ disabled: t = !1,
233
+ mode: r = "system",
234
+ focusMode: a = "system",
235
+ fullWidth: n = !1,
236
+ className: d,
237
+ type: g = "button",
238
+ raw: i = !1,
239
+ noBorder: h = !1,
240
+ "aria-label": s,
241
+ label: u,
242
+ size: b = "medium",
243
+ labelRight: m,
244
+ labelLeft: c,
245
+ spacing: f,
246
+ noBackground: v = !1,
247
+ align: _ = "center",
248
+ ...w
249
+ }, N) => {
250
+ const I = L({
251
+ type: T,
252
+ mode: r,
253
+ focusMode: a,
254
+ fullWidth: n,
255
+ disabled: t,
256
+ raw: i,
257
+ className: d,
258
+ noBorder: h,
259
+ size: b,
260
+ labelRight: m,
261
+ labelLeft: c,
262
+ spacing: f,
263
+ noBackground: v,
264
+ align: _
265
+ }), B = o({
266
+ "text-copy-accent-dark": r === "light" && !i,
267
+ "text-copy-light": r === "dark" && !i,
268
+ "text-copy-accent-dark dark:text-copy-light": r === "alt-system" && !i,
269
+ "text-copy-light dark:text-copy-accent-dark": r === "system" && !i
270
+ });
271
+ return /* @__PURE__ */ y(
272
+ M,
273
+ {
274
+ ref: N,
275
+ className: I,
276
+ disabled: t,
277
+ type: g,
278
+ "aria-label": s || u,
279
+ ...w,
280
+ children: [
281
+ c && /* @__PURE__ */ l("span", { className: "pr-2", children: c }),
282
+ /* @__PURE__ */ l("div", { className: B, children: e }),
283
+ m && /* @__PURE__ */ l("span", { className: "pl-2", children: m })
284
+ ]
285
+ }
286
+ );
287
+ }
288
+ );
289
+ $.displayName = "ButtonIcon";
290
+ /*!
291
+ @versini/ui-button v1.1.0
292
+ © 2024 gizmette.com
293
+ */
294
+ try {
295
+ window.__VERSINI_UI_BUTTON__ || (window.__VERSINI_UI_BUTTON__ = {
296
+ version: "1.1.0",
297
+ buildTime: "09/17/2024 06:28 PM EDT",
298
+ homepage: "https://github.com/aversini/ui-components",
299
+ license: "MIT"
300
+ });
301
+ } catch {
302
+ }
303
+ const Q = E.forwardRef(
304
+ ({
305
+ children: e,
306
+ disabled: t = !1,
307
+ mode: r = "system",
308
+ focusMode: a = "system",
309
+ fullWidth: n = !1,
310
+ className: d,
311
+ type: g = "button",
312
+ raw: i = !1,
313
+ noBorder: h = !1,
314
+ "aria-label": s,
315
+ label: u,
316
+ size: b = "medium",
317
+ labelRight: m,
318
+ labelLeft: c,
319
+ spacing: f,
320
+ noBackground: v = !1,
321
+ align: _ = "center",
322
+ active: w = !1,
323
+ ...N
324
+ }, I) => {
325
+ const B = L({
326
+ type: T,
327
+ mode: r,
328
+ focusMode: a,
329
+ fullWidth: n,
330
+ disabled: t,
331
+ raw: i,
332
+ className: d,
333
+ noBorder: h,
334
+ size: b,
335
+ labelRight: m,
336
+ labelLeft: c,
337
+ spacing: f,
338
+ noBackground: v,
339
+ align: _
340
+ }), P = o({
341
+ "text-copy-accent-dark": r === "light" && !i,
342
+ "text-copy-light": r === "dark" && !i,
343
+ "text-copy-accent-dark dark:text-copy-light": r === "alt-system" && !i,
344
+ "text-copy-light dark:text-copy-accent-dark": r === "system" && !i
345
+ }), A = w ? o(
346
+ "relative",
347
+ "focus-within:static",
348
+ "focus-within:after:border-transparent",
349
+ "after:absolute",
350
+ "after:content-['']",
351
+ "after:border-b-2",
352
+ "after:bottom-[-4px]",
353
+ "after:left-0",
354
+ "after:right-0",
355
+ {
356
+ "after:border-table-dark": r === "dark",
357
+ "after:border-table-light": r === "light",
358
+ "after:border-table-dark dark:after:border-table-light": r === "system",
359
+ "after:border-table-light dark:after:border-table-dark": r === "alt-system"
360
+ }
361
+ ) : "";
362
+ return /* @__PURE__ */ l("div", { className: A, children: /* @__PURE__ */ y(
363
+ M,
364
+ {
365
+ ref: I,
366
+ className: B,
367
+ disabled: t,
368
+ type: g,
369
+ "aria-label": s || u,
370
+ ...N,
371
+ children: [
372
+ c && /* @__PURE__ */ l("span", { className: "pr-2", children: c }),
373
+ /* @__PURE__ */ l("div", { className: P, children: e }),
374
+ m && /* @__PURE__ */ l("span", { className: "pl-2", children: m })
375
+ ]
376
+ }
377
+ ) });
378
+ }
379
+ );
380
+ Q.displayName = "ButtonSort";
381
+ const Z = (e) => {
382
+ let t = "";
383
+ if (typeof e == "number" || typeof e == "string")
384
+ t = "m-" + e;
385
+ else {
386
+ const r = [];
387
+ (e == null ? void 0 : e.t) !== void 0 && r.push(`mt-${e.t}`), (e == null ? void 0 : e.r) !== void 0 && r.push(`mr-${e.r}`), (e == null ? void 0 : e.b) !== void 0 && r.push(`mb-${e.b}`), (e == null ? void 0 : e.l) !== void 0 && r.push(`ml-${e.l}`), t = r.join(" ");
388
+ }
389
+ return t;
390
+ }, ee = ({
391
+ children: e,
392
+ fill: t,
393
+ viewBox: r,
394
+ className: a,
395
+ defaultViewBox: n,
396
+ defaultClassName: d,
397
+ spacing: g,
398
+ title: i,
399
+ semantic: h = !1,
400
+ ...s
401
+ }) => {
402
+ const u = Z(g), b = o(
403
+ u,
404
+ a || d
405
+ );
406
+ return /* @__PURE__ */ y(V, { children: [
407
+ /* @__PURE__ */ l(
408
+ "svg",
409
+ {
410
+ xmlns: "http://www.w3.org/2000/svg",
411
+ className: b,
412
+ viewBox: r || n,
413
+ fill: t || "currentColor",
414
+ role: "img",
415
+ "aria-hidden": !h,
416
+ focusable: !1,
417
+ ...s,
418
+ children: e
419
+ }
420
+ ),
421
+ i && h && /* @__PURE__ */ l("span", { className: "sr-only", children: i })
422
+ ] });
423
+ };
424
+ /*!
425
+ @versini/ui-private v1.4.9
426
+ © 2024 gizmette.com
427
+ */
428
+ try {
429
+ window.__VERSINI_UI_PRIVATE__ || (window.__VERSINI_UI_PRIVATE__ = {
430
+ version: "1.4.9",
431
+ buildTime: "09/17/2024 06:27 PM EDT",
432
+ homepage: "https://github.com/aversini/ui-components",
433
+ license: "MIT"
434
+ });
435
+ } catch {
436
+ }
437
+ const re = ({
438
+ className: e,
439
+ viewBox: t,
440
+ spacing: r,
441
+ title: a,
442
+ monotone: n,
443
+ ...d
444
+ }) => /* @__PURE__ */ l(
445
+ ee,
446
+ {
447
+ defaultViewBox: "0 0 384 512",
448
+ defaultClassName: "size-5",
449
+ viewBox: t,
450
+ className: e,
451
+ spacing: r,
452
+ title: a || "Close",
453
+ ...d,
454
+ children: /* @__PURE__ */ l("path", { d: "M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3l105.4 105.3c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256l105.3-105.4z" })
455
+ }
456
+ );
457
+ /*!
458
+ @versini/ui-icons v1.12.1
459
+ © 2024 gizmette.com
460
+ */
461
+ try {
462
+ window.__VERSINI_UI_ICONS__ || (window.__VERSINI_UI_ICONS__ = {
463
+ version: "1.12.1",
464
+ buildTime: "09/17/2024 06:27 PM EDT",
465
+ homepage: "https://github.com/aversini/ui-components",
466
+ license: "MIT"
467
+ });
468
+ } catch {
469
+ }
470
+ const p = "panel", x = "messagebox", te = ({
471
+ className: e,
472
+ kind: t,
473
+ borderMode: r
474
+ }) => ({
475
+ main: o("prose prose-lighter flex flex-col bg-surface-medium", {
476
+ [`${C} h-full min-h-[95%] sm:h-auto sm:min-h-[10rem] sm:rounded-lg sm:border-2`]: t === p,
477
+ [`${C} w-full sm:w-[95%] md:max-w-2xl`]: t === p && !e,
478
+ [`${R} rounded-lg border-2`]: t === x,
479
+ [`${R} w-[95%] sm:w-[50%] md:max-w-2xl`]: t === x && !e,
480
+ [`${e}`]: !!e,
481
+ "sm:border-border-dark": r === "dark" && t === p,
482
+ "sm:border-border-accent": r === "light" && t === p,
483
+ "border-border-dark": r === "dark" && t === x,
484
+ "border-border-accent": r === "light" && t === x
485
+ }),
486
+ content: "flex flex-grow flex-col py-2 sm:py-4 sm:px-4 px-2",
487
+ footer: "flex flex-grow flex-col sm:p-4 p-2",
488
+ header: "sm:p-4 mb-0 p-2",
489
+ close: "sm:p-4 p-2"
490
+ }), k = (e) => z(
491
+ () => import("./chunks/index.DU_h3fBa.js").then((t) => ({
492
+ default: t[e]
493
+ }))
494
+ ), ae = k("Modal"), oe = k("ModalClose"), ie = k("ModalContent"), le = k("ModalDescription"), de = k("ModalHeading"), ge = ({
495
+ open: e,
496
+ onOpenChange: t,
497
+ title: r,
498
+ children: a,
499
+ footer: n,
500
+ borderMode: d = "light",
501
+ kind: g = p,
502
+ className: i
503
+ }) => {
504
+ const h = U(""), s = te({ className: i, kind: g, borderMode: d });
505
+ return j(() => (e && (h.current = document.title, document.title = `${r} | ${h.current}`), () => {
506
+ e && (document.title = h.current);
507
+ }), [r, e]), /* @__PURE__ */ l(O, { fallback: /* @__PURE__ */ l("div", {}), children: e && /* @__PURE__ */ l(ae, { open: e, onOpenChange: t, children: /* @__PURE__ */ y(ie, { className: s.main, children: [
508
+ /* @__PURE__ */ y("div", { className: "flex flex-row-reverse items-center justify-between", children: [
509
+ /* @__PURE__ */ l(
510
+ oe,
511
+ {
512
+ className: s.close,
513
+ trigger: /* @__PURE__ */ l(
514
+ $,
515
+ {
516
+ mode: "dark",
517
+ focusMode: "light",
518
+ noBorder: !0,
519
+ label: "Close",
520
+ children: /* @__PURE__ */ l(re, {})
521
+ }
522
+ )
523
+ }
524
+ ),
525
+ /* @__PURE__ */ l(de, { className: s.header, children: r })
526
+ ] }),
527
+ /* @__PURE__ */ l(le, { className: s.content, children: a }),
528
+ n && /* @__PURE__ */ l("div", { className: s.footer, children: n })
529
+ ] }) }) });
530
+ };
531
+ export {
532
+ R as MESSAGEBOX_CLASSNAME,
533
+ C as PANEL_CLASSNAME,
534
+ ge as Panel
535
+ };
package/dist/style.css ADDED
@@ -0,0 +1 @@
1
+ *,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-ms-input-placeholder,textarea::-ms-input-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::-ms-backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.prose{color:var(--tw-prose-body);max-width:inherit}.prose :where(p):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:1.25em;margin-bottom:1.25em}.prose :where([class~=lead]):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-lead);font-size:1.25em;line-height:1.6;margin-top:1.2em;margin-bottom:1.2em}.prose :where(a):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-links);text-decoration:underline;font-weight:500}.prose :where(strong):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-bold);font-weight:600}.prose :where(a strong):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(blockquote strong):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(thead th strong):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(ol):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:decimal;margin-top:1.25em;margin-bottom:1.25em;-webkit-padding-start:1.625em;padding-inline-start:1.625em}.prose :where(ol[type=A]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:upper-alpha}.prose :where(ol[type=a]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:lower-alpha}.prose :where(ol[type=A s]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:upper-alpha}.prose :where(ol[type=a s]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:lower-alpha}.prose :where(ol[type=I]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:upper-roman}.prose :where(ol[type=i]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:lower-roman}.prose :where(ol[type=I s]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:upper-roman}.prose :where(ol[type=i s]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:lower-roman}.prose :where(ol[type="1"]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:decimal}.prose :where(ul):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:disc;margin-top:1.25em;margin-bottom:1.25em;-webkit-padding-start:1.625em;padding-inline-start:1.625em}.prose :where(ol>li):not(:where([class~=not-prose],[class~=not-prose] *))::marker{font-weight:400;color:var(--tw-prose-counters)}.prose :where(ul>li):not(:where([class~=not-prose],[class~=not-prose] *))::marker{color:var(--tw-prose-bullets)}.prose :where(dt):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;margin-top:1.25em}.prose :where(hr):not(:where([class~=not-prose],[class~=not-prose] *)){border-color:var(--tw-prose-hr);border-top-width:1px;margin-top:3em;margin-bottom:3em}.prose :where(blockquote):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:500;font-style:italic;color:var(--tw-prose-quotes);border-inline-start-width:.25rem;border-inline-start-color:var(--tw-prose-quote-borders);quotes:"“""”""‘""’";margin-top:1.6em;margin-bottom:1.6em;-webkit-padding-start:1em;padding-inline-start:1em;border-left-width:6px}.prose :where(blockquote p:first-of-type):not(:where([class~=not-prose],[class~=not-prose] *)):before{content:open-quote}.prose :where(blockquote p:last-of-type):not(:where([class~=not-prose],[class~=not-prose] *)):after{content:close-quote}.prose :where(h1):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:800;font-size:2.25em;margin-top:0;margin-bottom:.8888889em;line-height:1.1111111}.prose :where(h1 strong):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:900;color:inherit}.prose :where(h2):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:700;font-size:1.5em;margin-top:2em;margin-bottom:1em;line-height:1.3333333}.prose :where(h2 strong):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:800;color:inherit}.prose :where(h3):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;font-size:1.25em;margin-top:1.6em;margin-bottom:.6em;line-height:1.6}.prose :where(h3 strong):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:700;color:inherit}.prose :where(h4):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;margin-top:1.5em;margin-bottom:.5em;line-height:1.5}.prose :where(h4 strong):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:700;color:inherit}.prose :where(img):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(picture):not(:where([class~=not-prose],[class~=not-prose] *)){display:block;margin-top:2em;margin-bottom:2em}.prose :where(video):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(kbd):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:500;font-family:inherit;color:var(--tw-prose-kbd);box-shadow:0 0 0 1px rgb(var(--tw-prose-kbd-shadows) / 10%),0 3px rgb(var(--tw-prose-kbd-shadows) / 10%);font-size:.875em;border-radius:.3125rem;padding-top:.1875em;-webkit-padding-end:.375em;padding-inline-end:.375em;padding-bottom:.1875em;-webkit-padding-start:.375em;padding-inline-start:.375em}.prose :where(code):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-code);font-weight:600;font-size:.875em;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.prose :where(code):not(:where([class~=not-prose],[class~=not-prose] *)):before{content:"`"}.prose :where(code):not(:where([class~=not-prose],[class~=not-prose] *)):after{content:"`"}.prose :where(a code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(h1 code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(h2 code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit;font-size:.875em}.prose :where(h3 code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit;font-size:.9em}.prose :where(h4 code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(blockquote code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(thead th code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(pre):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-pre-code);background-color:var(--tw-prose-pre-bg);overflow-x:auto;font-weight:400;font-size:.875rem;line-height:1.25rem;margin-top:2rem;margin-bottom:2rem;border-radius:.375rem;padding-top:.8571429em;-webkit-padding-end:1.1428571em;padding-inline-end:1.1428571em;padding-bottom:.8571429em;-webkit-padding-start:1.1428571em;padding-inline-start:1.1428571em}.prose :where(pre code):not(:where([class~=not-prose],[class~=not-prose] *)){background-color:transparent;border-width:0;border-radius:0;padding:0;font-weight:inherit;color:inherit;font-size:inherit;font-family:inherit;line-height:inherit}.prose :where(pre code):not(:where([class~=not-prose],[class~=not-prose] *)):before{content:none}.prose :where(pre code):not(:where([class~=not-prose],[class~=not-prose] *)):after{content:none}.prose :where(table):not(:where([class~=not-prose],[class~=not-prose] *)){width:100%;table-layout:auto;margin-top:2em;margin-bottom:2em;font-size:.875em;line-height:1.7142857}.prose :where(thead):not(:where([class~=not-prose],[class~=not-prose] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-th-borders)}.prose :where(thead th):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;vertical-align:bottom;-webkit-padding-end:.5714286em;padding-inline-end:.5714286em;padding-bottom:.5714286em;-webkit-padding-start:.5714286em;padding-inline-start:.5714286em}.prose :where(tbody tr):not(:where([class~=not-prose],[class~=not-prose] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-td-borders)}.prose :where(tbody tr:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){border-bottom-width:0}.prose :where(tbody td):not(:where([class~=not-prose],[class~=not-prose] *)){vertical-align:baseline}.prose :where(tfoot):not(:where([class~=not-prose],[class~=not-prose] *)){border-top-width:1px;border-top-color:var(--tw-prose-th-borders)}.prose :where(tfoot td):not(:where([class~=not-prose],[class~=not-prose] *)){vertical-align:top}.prose :where(th,td):not(:where([class~=not-prose],[class~=not-prose] *)){text-align:start}.prose :where(figure>*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0;margin-bottom:0}.prose :where(figcaption):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-captions);font-size:.875em;line-height:1.4285714;margin-top:.8571429em}.prose{--tw-prose-body: #374151;--tw-prose-headings: #111827;--tw-prose-lead: #4b5563;--tw-prose-links: #111827;--tw-prose-bold: #111827;--tw-prose-counters: #6b7280;--tw-prose-bullets: #d1d5db;--tw-prose-hr: #e5e7eb;--tw-prose-quotes: #111827;--tw-prose-quote-borders: #e5e7eb;--tw-prose-captions: #6b7280;--tw-prose-kbd: #111827;--tw-prose-kbd-shadows: 17 24 39;--tw-prose-code: #111827;--tw-prose-pre-code: #e5e7eb;--tw-prose-pre-bg: #1f2937;--tw-prose-th-borders: #d1d5db;--tw-prose-td-borders: #e5e7eb;--tw-prose-invert-body: #d1d5db;--tw-prose-invert-headings: #fff;--tw-prose-invert-lead: #9ca3af;--tw-prose-invert-links: #fff;--tw-prose-invert-bold: #fff;--tw-prose-invert-counters: #9ca3af;--tw-prose-invert-bullets: #4b5563;--tw-prose-invert-hr: #374151;--tw-prose-invert-quotes: #f3f4f6;--tw-prose-invert-quote-borders: #374151;--tw-prose-invert-captions: #9ca3af;--tw-prose-invert-kbd: #fff;--tw-prose-invert-kbd-shadows: 255 255 255;--tw-prose-invert-code: #fff;--tw-prose-invert-pre-code: #d1d5db;--tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);--tw-prose-invert-th-borders: #4b5563;--tw-prose-invert-td-borders: #374151;font-size:1rem;line-height:1.75}.prose :where(picture>img):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0;margin-bottom:0}.prose :where(li):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:.5em;margin-bottom:.5em;font-size:1rem}.prose :where(ol>li):not(:where([class~=not-prose],[class~=not-prose] *)){-webkit-padding-start:.375em;padding-inline-start:.375em}.prose :where(ul>li):not(:where([class~=not-prose],[class~=not-prose] *)){-webkit-padding-start:.375em;padding-inline-start:.375em}.prose :where(.prose>ul>li p):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose :where(.prose>ul>li>p:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:1.25em}.prose :where(.prose>ul>li>p:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-bottom:1.25em}.prose :where(.prose>ol>li>p:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:1.25em}.prose :where(.prose>ol>li>p:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-bottom:1.25em}.prose :where(ul ul,ul ol,ol ul,ol ol):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose :where(dl):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:1.25em;margin-bottom:1.25em}.prose :where(dd):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:.5em;-webkit-padding-start:1.625em;padding-inline-start:1.625em}.prose :where(hr+*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(h2+*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(h3+*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(h4+*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(thead th:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){-webkit-padding-start:0;padding-inline-start:0}.prose :where(thead th:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){-webkit-padding-end:0;padding-inline-end:0}.prose :where(tbody td,tfoot td):not(:where([class~=not-prose],[class~=not-prose] *)){padding-top:.5714286em;-webkit-padding-end:.5714286em;padding-inline-end:.5714286em;padding-bottom:.5714286em;-webkit-padding-start:.5714286em;padding-inline-start:.5714286em}.prose :where(tbody td:first-child,tfoot td:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){-webkit-padding-start:0;padding-inline-start:0}.prose :where(tbody td:last-child,tfoot td:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){-webkit-padding-end:0;padding-inline-end:0}.prose :where(figure):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(.prose>:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(.prose>:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-bottom:0}.prose :where(h1,h2,h3,h4,h5,h6):not(:where([class~=not-prose],[class~=not-prose] *)){font-family:Open Sans,ui-sans-serif,system-ui,sans-serif;font-weight:400}.prose :where(.av-header h1,.av-header h2,.av-header h3,.av-header h4,.av-header h5,.av-header h6):not(:where([class~=not-prose],[class~=not-prose] *)){margin:0}.prose :where(.av-header p):not(:where([class~=not-prose],[class~=not-prose] *)){margin:0}.prose :where(blockquote p):not(:where([class~=not-prose],[class~=not-prose] *)){font-family:Georgia,Cambria,Times New Roman,Times,serif}.prose-lighter{--tw-prose-body: #ffffff;--tw-prose-headings: #e2e8f0;--tw-prose-lead: #ffffff;--tw-prose-links: #ffffff;--tw-prose-bold: #ffffff;--tw-prose-counters: #e2e8f0;--tw-prose-bullets: #e2e8f0;--tw-prose-hr: #e2e8f0;--tw-prose-quotes: #ffffff;--tw-prose-quote-borders: #ffffff;--tw-prose-captions: #ffffff;--tw-prose-code: #ffffff;--tw-prose-pre-code: #ffffff;--tw-prose-pre-bg: #0f172a;--tw-prose-kbd: #ffffff}.prose-lighter :where(li):not(:where([class~=not-prose],[class~=not-prose] *)){color:#fff}@keyframes blink{50%{fill:transparent}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.m-0{margin:0}.m-1{margin:.25rem}.m-10{margin:2.5rem}.m-11{margin:2.75rem}.m-12{margin:3rem}.m-14{margin:3.5rem}.m-16{margin:4rem}.m-2{margin:.5rem}.m-20{margin:5rem}.m-24{margin:6rem}.m-28{margin:7rem}.m-3{margin:.75rem}.m-32{margin:8rem}.m-36{margin:9rem}.m-4{margin:1rem}.m-44{margin:11rem}.m-48{margin:12rem}.m-5{margin:1.25rem}.m-52{margin:13rem}.m-56{margin:14rem}.m-6{margin:1.5rem}.m-60{margin:15rem}.m-64{margin:16rem}.m-7{margin:1.75rem}.m-72{margin:18rem}.m-8{margin:2rem}.m-80{margin:20rem}.m-9{margin:2.25rem}.m-96{margin:24rem}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25rem}.mb-10{margin-bottom:2.5rem}.mb-11{margin-bottom:2.75rem}.mb-12{margin-bottom:3rem}.mb-14{margin-bottom:3.5rem}.mb-16{margin-bottom:4rem}.mb-2{margin-bottom:.5rem}.mb-20{margin-bottom:5rem}.mb-24{margin-bottom:6rem}.mb-28{margin-bottom:7rem}.mb-3{margin-bottom:.75rem}.mb-32{margin-bottom:8rem}.mb-36{margin-bottom:9rem}.mb-4{margin-bottom:1rem}.mb-44{margin-bottom:11rem}.mb-48{margin-bottom:12rem}.mb-5{margin-bottom:1.25rem}.mb-52{margin-bottom:13rem}.mb-56{margin-bottom:14rem}.mb-6{margin-bottom:1.5rem}.mb-60{margin-bottom:15rem}.mb-64{margin-bottom:16rem}.mb-7{margin-bottom:1.75rem}.mb-72{margin-bottom:18rem}.mb-8{margin-bottom:2rem}.mb-80{margin-bottom:20rem}.mb-9{margin-bottom:2.25rem}.mb-96{margin-bottom:24rem}.ml-0{margin-left:0}.ml-1{margin-left:.25rem}.ml-10{margin-left:2.5rem}.ml-11{margin-left:2.75rem}.ml-12{margin-left:3rem}.ml-14{margin-left:3.5rem}.ml-16{margin-left:4rem}.ml-2{margin-left:.5rem}.ml-20{margin-left:5rem}.ml-24{margin-left:6rem}.ml-28{margin-left:7rem}.ml-3{margin-left:.75rem}.ml-32{margin-left:8rem}.ml-36{margin-left:9rem}.ml-4{margin-left:1rem}.ml-44{margin-left:11rem}.ml-48{margin-left:12rem}.ml-5{margin-left:1.25rem}.ml-52{margin-left:13rem}.ml-56{margin-left:14rem}.ml-6{margin-left:1.5rem}.ml-60{margin-left:15rem}.ml-64{margin-left:16rem}.ml-7{margin-left:1.75rem}.ml-72{margin-left:18rem}.ml-8{margin-left:2rem}.ml-80{margin-left:20rem}.ml-9{margin-left:2.25rem}.ml-96{margin-left:24rem}.mr-0{margin-right:0}.mr-1{margin-right:.25rem}.mr-10{margin-right:2.5rem}.mr-11{margin-right:2.75rem}.mr-12{margin-right:3rem}.mr-14{margin-right:3.5rem}.mr-16{margin-right:4rem}.mr-2{margin-right:.5rem}.mr-20{margin-right:5rem}.mr-24{margin-right:6rem}.mr-28{margin-right:7rem}.mr-3{margin-right:.75rem}.mr-32{margin-right:8rem}.mr-36{margin-right:9rem}.mr-4{margin-right:1rem}.mr-44{margin-right:11rem}.mr-48{margin-right:12rem}.mr-5{margin-right:1.25rem}.mr-52{margin-right:13rem}.mr-56{margin-right:14rem}.mr-6{margin-right:1.5rem}.mr-60{margin-right:15rem}.mr-64{margin-right:16rem}.mr-7{margin-right:1.75rem}.mr-72{margin-right:18rem}.mr-8{margin-right:2rem}.mr-80{margin-right:20rem}.mr-9{margin-right:2.25rem}.mr-96{margin-right:24rem}.mt-0{margin-top:0}.mt-1{margin-top:.25rem}.mt-10{margin-top:2.5rem}.mt-11{margin-top:2.75rem}.mt-12{margin-top:3rem}.mt-14{margin-top:3.5rem}.mt-16{margin-top:4rem}.mt-2{margin-top:.5rem}.mt-20{margin-top:5rem}.mt-24{margin-top:6rem}.mt-28{margin-top:7rem}.mt-3{margin-top:.75rem}.mt-32{margin-top:8rem}.mt-36{margin-top:9rem}.mt-4{margin-top:1rem}.mt-44{margin-top:11rem}.mt-48{margin-top:12rem}.mt-5{margin-top:1.25rem}.mt-52{margin-top:13rem}.mt-56{margin-top:14rem}.mt-6{margin-top:1.5rem}.mt-60{margin-top:15rem}.mt-64{margin-top:16rem}.mt-7{margin-top:1.75rem}.mt-72{margin-top:18rem}.mt-8{margin-top:2rem}.mt-80{margin-top:20rem}.mt-9{margin-top:2.25rem}.mt-96{margin-top:24rem}.flex{display:flex}.size-5{width:1.25rem;height:1.25rem}.h-full{height:100%}.min-h-\[95\%\]{min-height:95%}.w-\[95\%\]{width:95%}.w-full{width:100%}.flex-grow{flex-grow:1}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.rounded-lg{border-radius:.5rem}.border{border-width:1px}.border-2{border-width:2px}.border-border-accent{--tw-border-opacity: 1;border-color:var(--av-border-accent, rgb(169 185 173 / var(--tw-border-opacity)))}.border-border-dark{--tw-border-opacity: 1;border-color:var(--av-border-dark, rgb(15 23 42 / var(--tw-border-opacity)))}.bg-surface-medium{--tw-bg-opacity: 1;background-color:var(--av-surface-medium, rgb(100 116 139 / var(--tw-bg-opacity)))}.p-2{padding:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}@media (min-width: 640px){.sm\:h-auto{height:auto}.sm\:min-h-\[10rem\]{min-height:10rem}.sm\:w-\[50\%\]{width:50%}.sm\:w-\[95\%\]{width:95%}.sm\:rounded-lg{border-radius:.5rem}.sm\:border-2{border-width:2px}.sm\:border-border-accent{--tw-border-opacity: 1;border-color:var(--av-border-accent, rgb(169 185 173 / var(--tw-border-opacity)))}.sm\:border-border-dark{--tw-border-opacity: 1;border-color:var(--av-border-dark, rgb(15 23 42 / var(--tw-border-opacity)))}.sm\:p-4{padding:1rem}.sm\:px-4{padding-left:1rem;padding-right:1rem}.sm\:py-4{padding-top:1rem;padding-bottom:1rem}}@media (min-width: 768px){.md\:max-w-2xl{max-width:42rem}}
package/dist/style.js ADDED
File without changes
package/package.json ADDED
@@ -0,0 +1,55 @@
1
+ {
2
+ "name": "@versini/ui-panel",
3
+ "version": "0.0.0",
4
+ "license": "MIT",
5
+ "author": "Arno Versini",
6
+ "publishConfig": {
7
+ "access": "public"
8
+ },
9
+ "homepage": "https://github.com/aversini/ui-components",
10
+ "repository": {
11
+ "type": "git",
12
+ "url": "git@github.com:aversini/ui-components.git"
13
+ },
14
+ "type": "module",
15
+ "main": "dist/index.js",
16
+ "types": "dist/index.d.ts",
17
+ "files": [
18
+ "dist"
19
+ ],
20
+ "scripts": {
21
+ "build:check": "tsc",
22
+ "build:js": "vite build",
23
+ "build:types": "tsup",
24
+ "build": "npm-run-all --serial clean build:check build:js build:types",
25
+ "clean": "rimraf dist tmp",
26
+ "dev:js": "vite build --watch --mode development",
27
+ "dev:types": "tsup --watch src",
28
+ "dev": "npm-run-all clean --parallel dev:js dev:types",
29
+ "lint": "biome lint src",
30
+ "start": "static-server dist --port 5173",
31
+ "test:coverage:ui": "vitest --coverage --ui",
32
+ "test:coverage": "vitest run --coverage",
33
+ "test:watch": "vitest",
34
+ "test": "vitest run"
35
+ },
36
+ "peerDependencies": {
37
+ "react": "^18.3.1",
38
+ "react-dom": "^18.3.1"
39
+ },
40
+ "devDependencies": {
41
+ "@versini/ui-styles": "1.9.7"
42
+ },
43
+ "dependencies": {
44
+ "@tailwindcss/typography": "0.5.15",
45
+ "@versini/ui-button": "1.1.0",
46
+ "@versini/ui-icons": "1.12.1",
47
+ "@versini/ui-private": "1.4.9",
48
+ "clsx": "2.1.1",
49
+ "tailwindcss": "3.4.11"
50
+ },
51
+ "sideEffects": [
52
+ "**/*.css"
53
+ ],
54
+ "gitHead": "3450a8fd5e72d5a5cb6cccf0dc0836d810850cf2"
55
+ }