@versini/ui-bubble 3.0.0 → 3.0.1
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/index.js +144 -148
- package/package.json +3 -3
package/dist/index.js
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { jsx as d, jsxs as
|
|
2
|
-
import
|
|
1
|
+
import { jsx as d, jsxs as f, Fragment as L } from "react/jsx-runtime";
|
|
2
|
+
import i from "clsx";
|
|
3
3
|
import z, { useState as U, useEffect as H } from "react";
|
|
4
4
|
/*!
|
|
5
|
-
@versini/ui-bubble v3.0.
|
|
5
|
+
@versini/ui-bubble v3.0.1
|
|
6
6
|
© 2025 gizmette.com
|
|
7
7
|
*/
|
|
8
8
|
try {
|
|
9
9
|
window.__VERSINI_UI_BUBBLE__ || (window.__VERSINI_UI_BUBBLE__ = {
|
|
10
|
-
version: "3.0.
|
|
11
|
-
buildTime: "01/
|
|
10
|
+
version: "3.0.1",
|
|
11
|
+
buildTime: "01/04/2025 10:03 AM EST",
|
|
12
12
|
homepage: "https://github.com/aversini/ui-components",
|
|
13
13
|
license: "MIT"
|
|
14
14
|
});
|
|
@@ -21,17 +21,17 @@ const O = "av-bubble", C = "av-button", y = "icon", M = "button", I = "link", j
|
|
|
21
21
|
labelLeft: a,
|
|
22
22
|
align: l
|
|
23
23
|
}) => {
|
|
24
|
-
const
|
|
24
|
+
const o = "max-h-8 py-0 px-2", g = "max-h-9 py-1 px-3", s = "max-h-12 py-2 px-4";
|
|
25
25
|
switch (e) {
|
|
26
26
|
case M:
|
|
27
27
|
case I:
|
|
28
|
-
return
|
|
29
|
-
[
|
|
28
|
+
return i({
|
|
29
|
+
[o]: r === "small",
|
|
30
30
|
[g]: r === "medium",
|
|
31
|
-
[
|
|
31
|
+
[s]: r === "large"
|
|
32
32
|
});
|
|
33
33
|
case y:
|
|
34
|
-
return
|
|
34
|
+
return i("inline-flex items-center", {
|
|
35
35
|
"justify-center": l === "center",
|
|
36
36
|
"justify-start": l === "left",
|
|
37
37
|
"justify-end": l === "right",
|
|
@@ -49,20 +49,20 @@ const O = "av-bubble", C = "av-button", y = "icon", M = "button", I = "link", j
|
|
|
49
49
|
labelRight: t,
|
|
50
50
|
labelLeft: a
|
|
51
51
|
}) => {
|
|
52
|
-
const l = "text-sm font-medium",
|
|
52
|
+
const l = "text-sm font-medium", o = "text-base font-medium", g = "text-lg font-medium";
|
|
53
53
|
switch (e) {
|
|
54
54
|
case M:
|
|
55
55
|
case I:
|
|
56
|
-
return
|
|
56
|
+
return i({
|
|
57
57
|
"text-center": e === I,
|
|
58
58
|
[l]: r === "small",
|
|
59
|
-
[
|
|
59
|
+
[o]: r === "medium",
|
|
60
60
|
[g]: r === "large"
|
|
61
61
|
});
|
|
62
62
|
case y:
|
|
63
|
-
return
|
|
63
|
+
return i({
|
|
64
64
|
[l]: r === "small" && (t || a),
|
|
65
|
-
[
|
|
65
|
+
[o]: r === "medium" && (t || a),
|
|
66
66
|
[g]: r === "large" && (t || a)
|
|
67
67
|
});
|
|
68
68
|
}
|
|
@@ -75,36 +75,32 @@ const O = "av-bubble", C = "av-button", y = "icon", M = "button", I = "link", j
|
|
|
75
75
|
if (r)
|
|
76
76
|
return "not-prose";
|
|
77
77
|
if (a === "primary")
|
|
78
|
-
return
|
|
78
|
+
return i("not-prose", {
|
|
79
79
|
truncate: !t,
|
|
80
|
-
"text-copy-light": e === "dark",
|
|
81
|
-
"text-copy-lighter": e === "light",
|
|
82
|
-
"
|
|
83
|
-
"
|
|
80
|
+
"text-copy-light": e === "dark" || e === "system",
|
|
81
|
+
"text-copy-lighter": e === "light" || e === "alt-system",
|
|
82
|
+
"dark:text-copy-lighter": e === "system",
|
|
83
|
+
"dark:text-copy-light": e === "alt-system"
|
|
84
84
|
});
|
|
85
85
|
if (a === "secondary")
|
|
86
|
-
return
|
|
86
|
+
return i("not-prose", {
|
|
87
87
|
truncate: !t,
|
|
88
|
-
"text-copy-light": e === "light",
|
|
89
|
-
"text-copy-lighter": e === "dark",
|
|
90
|
-
"
|
|
91
|
-
"
|
|
88
|
+
"text-copy-light": e === "light" || e === "system",
|
|
89
|
+
"text-copy-lighter": e === "dark" || e === "alt-system",
|
|
90
|
+
"dark:text-copy-lighter": e === "alt-system",
|
|
91
|
+
"dark:text-copy-light": e === "system"
|
|
92
92
|
});
|
|
93
93
|
if (a === "danger")
|
|
94
|
-
return
|
|
94
|
+
return i("not-prose", {
|
|
95
95
|
truncate: !t,
|
|
96
|
-
"text-copy-light": e === "dark",
|
|
97
|
-
"text-copy-lighter": e === "light",
|
|
98
|
-
"
|
|
99
|
-
"
|
|
96
|
+
"text-copy-light": e === "dark" || e === "system",
|
|
97
|
+
"text-copy-lighter": e === "light" || e === "alt-system",
|
|
98
|
+
"dark:text-copy-lighter": e === "system",
|
|
99
|
+
"dark:text-copy-light": e === "alt-system"
|
|
100
100
|
});
|
|
101
101
|
if (a === "selected")
|
|
102
|
-
return
|
|
103
|
-
truncate: !t
|
|
104
|
-
"text-copy-light": e === "dark",
|
|
105
|
-
"text-copy-lighter": e === "light",
|
|
106
|
-
"text-copy-light dark:text-copy-lighter": e === "system",
|
|
107
|
-
"text-copy-lighter dark:text-copy-light": e === "alt-system"
|
|
102
|
+
return i("not-prose text-copy-lighter", {
|
|
103
|
+
truncate: !t
|
|
108
104
|
});
|
|
109
105
|
}, G = ({
|
|
110
106
|
mode: e,
|
|
@@ -113,21 +109,21 @@ const O = "av-bubble", C = "av-button", y = "icon", M = "button", I = "link", j
|
|
|
113
109
|
}) => {
|
|
114
110
|
if (!r) {
|
|
115
111
|
if (t === "primary")
|
|
116
|
-
return
|
|
112
|
+
return i({
|
|
117
113
|
"bg-action-dark": e === "dark",
|
|
118
114
|
"bg-action-light": e === "light",
|
|
119
115
|
"bg-action-dark dark:bg-action-light": e === "system",
|
|
120
116
|
"bg-action-light dark:bg-action-dark": e === "alt-system"
|
|
121
117
|
});
|
|
122
118
|
if (t === "secondary")
|
|
123
|
-
return
|
|
119
|
+
return i({
|
|
124
120
|
"bg-action-dark": e === "light",
|
|
125
121
|
"bg-action-light": e === "dark",
|
|
126
122
|
"bg-action-dark dark:bg-action-light": e === "alt-system",
|
|
127
123
|
"bg-action-light dark:bg-action-dark": e === "system"
|
|
128
124
|
});
|
|
129
125
|
if (t === "danger")
|
|
130
|
-
return
|
|
126
|
+
return i({
|
|
131
127
|
"bg-action-danger-dark": e === "dark",
|
|
132
128
|
"bg-action-danger-light": e === "light",
|
|
133
129
|
"bg-action-danger-dark dark:bg-action-danger-light": e === "system",
|
|
@@ -138,7 +134,7 @@ const O = "av-bubble", C = "av-button", y = "icon", M = "button", I = "link", j
|
|
|
138
134
|
}
|
|
139
135
|
}, q = ({
|
|
140
136
|
radius: e
|
|
141
|
-
}) =>
|
|
137
|
+
}) => i({
|
|
142
138
|
"rounded-full": e === "large",
|
|
143
139
|
"rounded-md": e === "medium",
|
|
144
140
|
"rounded-sm": e === "small"
|
|
@@ -150,21 +146,21 @@ const O = "av-bubble", C = "av-button", y = "icon", M = "button", I = "link", j
|
|
|
150
146
|
if (r)
|
|
151
147
|
return "";
|
|
152
148
|
if (t === "primary")
|
|
153
|
-
return
|
|
149
|
+
return i("hover:text-copy-light-hover", {
|
|
154
150
|
"hover:bg-action-dark-hover": e === "dark",
|
|
155
151
|
"hover:bg-action-light-hover": e === "light",
|
|
156
152
|
"hover:bg-action-dark-hover dark:hover:bg-action-light-hover": e === "system",
|
|
157
153
|
"hover:bg-action-light-hover dark:hover:bg-action-dark-hover": e === "alt-system"
|
|
158
154
|
});
|
|
159
155
|
if (t === "secondary")
|
|
160
|
-
return
|
|
156
|
+
return i("hover:text-copy-light-hover", {
|
|
161
157
|
"hover:bg-action-dark-hover": e === "light",
|
|
162
158
|
"hover:bg-action-light-hover": e === "dark",
|
|
163
159
|
"hover:bg-action-dark-hover dark:hover:bg-action-light-hover": e === "alt-system",
|
|
164
160
|
"hover:bg-action-light-hover dark:hover:bg-action-dark-hover": e === "system"
|
|
165
161
|
});
|
|
166
162
|
if (t === "danger")
|
|
167
|
-
return
|
|
163
|
+
return i("hover:text-copy-light-hover", {
|
|
168
164
|
"hover:bg-action-danger-dark-hover": e === "dark",
|
|
169
165
|
"hover:bg-action-danger-light-hover": e === "light",
|
|
170
166
|
"hover:bg-action-danger-dark-hover dark:hover:bg-action-danger-light-hover": e === "system",
|
|
@@ -180,21 +176,21 @@ const O = "av-bubble", C = "av-button", y = "icon", M = "button", I = "link", j
|
|
|
180
176
|
if (r)
|
|
181
177
|
return "";
|
|
182
178
|
if (t === "primary")
|
|
183
|
-
return
|
|
179
|
+
return i("active:text-copy-light-active", {
|
|
184
180
|
"active:bg-action-dark-active": e === "dark",
|
|
185
181
|
"active:bg-action-light-active": e === "light",
|
|
186
182
|
"active:bg-action-dark-active dark:active:bg-action-light-active": e === "system",
|
|
187
183
|
"active:bg-action-light-active dark:active:bg-action-dark-active": e === "alt-system"
|
|
188
184
|
});
|
|
189
185
|
if (t === "secondary")
|
|
190
|
-
return
|
|
186
|
+
return i("active:text-copy-light-active", {
|
|
191
187
|
"active:bg-action-dark-active": e === "light",
|
|
192
188
|
"active:bg-action-light-active": e === "dark",
|
|
193
189
|
"active:bg-action-dark-active dark:active:bg-action-light-active": e === "alt-system",
|
|
194
190
|
"active:bg-action-light-active dark:active:bg-action-dark-active": e === "system"
|
|
195
191
|
});
|
|
196
192
|
if (t === "danger")
|
|
197
|
-
return
|
|
193
|
+
return i("active:text-copy-lighter-active", {
|
|
198
194
|
"active:bg-action-danger-dark-active": e === "dark",
|
|
199
195
|
"active:bg-action-danger-light-active": e === "light",
|
|
200
196
|
"active:bg-action-danger-dark-active dark:active:bg-action-danger-light-active": e === "system",
|
|
@@ -210,21 +206,21 @@ const O = "av-bubble", C = "av-button", y = "icon", M = "button", I = "link", j
|
|
|
210
206
|
if (r)
|
|
211
207
|
return "border border-transparent";
|
|
212
208
|
if (t === "primary")
|
|
213
|
-
return
|
|
209
|
+
return i("border", {
|
|
214
210
|
"border-border-dark": e === "dark",
|
|
215
211
|
"border-border-accent": e === "light",
|
|
216
212
|
"border-border-dark dark:border-border-accent": e === "system",
|
|
217
213
|
"border-border-accent dark:border-border-dark": e === "alt-system"
|
|
218
214
|
});
|
|
219
215
|
if (t === "secondary")
|
|
220
|
-
return
|
|
216
|
+
return i("border", {
|
|
221
217
|
"border-border-dark": e === "light",
|
|
222
218
|
"border-border-accent": e === "dark",
|
|
223
219
|
"border-border-dark dark:border-border-accent": e === "alt-system",
|
|
224
220
|
"border-border-accent dark:border-border-dark": e === "system"
|
|
225
221
|
});
|
|
226
222
|
if (t === "danger")
|
|
227
|
-
return
|
|
223
|
+
return i("border", {
|
|
228
224
|
"border-border-danger-dark": e === "dark",
|
|
229
225
|
"border-border-danger-medium": e === "light",
|
|
230
226
|
"border-border-danger-dark dark:border-border-danger-medium": e === "system",
|
|
@@ -234,7 +230,7 @@ const O = "av-bubble", C = "av-button", y = "icon", M = "button", I = "link", j
|
|
|
234
230
|
return "border border-border-selected-dark";
|
|
235
231
|
}, J = ({
|
|
236
232
|
focusMode: e
|
|
237
|
-
}) =>
|
|
233
|
+
}) => i("focus:outline", "focus:outline-2", "focus:outline-offset-2", {
|
|
238
234
|
"focus:outline-focus-dark": e === "dark",
|
|
239
235
|
"focus:outline-focus-light": e === "light",
|
|
240
236
|
"focus:outline-focus-light dark:focus:outline-focus-dark": e === "alt-system",
|
|
@@ -245,42 +241,42 @@ const O = "av-bubble", C = "av-button", y = "icon", M = "button", I = "link", j
|
|
|
245
241
|
raw: t,
|
|
246
242
|
mode: a,
|
|
247
243
|
focusMode: l,
|
|
248
|
-
disabled:
|
|
244
|
+
disabled: o,
|
|
249
245
|
fullWidth: g,
|
|
250
|
-
size:
|
|
246
|
+
size: s,
|
|
251
247
|
noBorder: h,
|
|
252
|
-
labelRight:
|
|
253
|
-
labelLeft:
|
|
248
|
+
labelRight: m,
|
|
249
|
+
labelLeft: b,
|
|
254
250
|
noBackground: u,
|
|
255
251
|
variant: n,
|
|
256
|
-
noTruncate:
|
|
257
|
-
align:
|
|
258
|
-
radius:
|
|
259
|
-
}) => (n || (n = "primary"), t ?
|
|
252
|
+
noTruncate: c,
|
|
253
|
+
align: v,
|
|
254
|
+
radius: p
|
|
255
|
+
}) => (n || (n = "primary"), t ? i(C, r) : i(
|
|
260
256
|
C,
|
|
261
257
|
W({
|
|
262
258
|
mode: a,
|
|
263
259
|
variant: n,
|
|
264
260
|
noBackground: u,
|
|
265
|
-
noTruncate:
|
|
261
|
+
noTruncate: c
|
|
266
262
|
}),
|
|
267
263
|
G({ mode: a, noBackground: u, variant: n }),
|
|
268
|
-
q({ radius:
|
|
264
|
+
q({ radius: p }),
|
|
269
265
|
j({
|
|
270
266
|
type: e,
|
|
271
|
-
size:
|
|
272
|
-
labelRight:
|
|
273
|
-
labelLeft:
|
|
274
|
-
align:
|
|
267
|
+
size: s,
|
|
268
|
+
labelRight: m,
|
|
269
|
+
labelLeft: b,
|
|
270
|
+
align: v
|
|
275
271
|
}),
|
|
276
|
-
A({ type: e, size:
|
|
272
|
+
A({ type: e, size: s, labelRight: m, labelLeft: b }),
|
|
277
273
|
F({ mode: a, variant: n, noBorder: h }),
|
|
278
274
|
J({ focusMode: l }),
|
|
279
|
-
P({ mode: a, variant: n, disabled:
|
|
280
|
-
D({ mode: a, variant: n, disabled:
|
|
275
|
+
P({ mode: a, variant: n, disabled: o }),
|
|
276
|
+
D({ mode: a, variant: n, disabled: o }),
|
|
281
277
|
{
|
|
282
278
|
"w-full": g,
|
|
283
|
-
"disabled:cursor-not-allowed disabled:opacity-50":
|
|
279
|
+
"disabled:cursor-not-allowed disabled:opacity-50": o
|
|
284
280
|
},
|
|
285
281
|
r
|
|
286
282
|
)), K = (e, r, t) => {
|
|
@@ -292,8 +288,8 @@ const O = "av-bubble", C = "av-button", y = "icon", M = "button", I = "link", j
|
|
|
292
288
|
"button",
|
|
293
289
|
{
|
|
294
290
|
ref: r,
|
|
295
|
-
onClick: (
|
|
296
|
-
K(
|
|
291
|
+
onClick: (o) => {
|
|
292
|
+
K(o, a, t);
|
|
297
293
|
},
|
|
298
294
|
...l
|
|
299
295
|
}
|
|
@@ -307,17 +303,17 @@ const E = z.forwardRef(
|
|
|
307
303
|
mode: t = "system",
|
|
308
304
|
focusMode: a = "system",
|
|
309
305
|
fullWidth: l = !1,
|
|
310
|
-
className:
|
|
306
|
+
className: o,
|
|
311
307
|
type: g = "button",
|
|
312
|
-
raw:
|
|
308
|
+
raw: s = !1,
|
|
313
309
|
noBorder: h = !1,
|
|
314
|
-
"aria-label":
|
|
315
|
-
label:
|
|
310
|
+
"aria-label": m,
|
|
311
|
+
label: b,
|
|
316
312
|
size: u = "medium",
|
|
317
313
|
labelRight: n,
|
|
318
|
-
labelLeft:
|
|
319
|
-
noBackground:
|
|
320
|
-
align:
|
|
314
|
+
labelLeft: c,
|
|
315
|
+
noBackground: v = !1,
|
|
316
|
+
align: p = "center",
|
|
321
317
|
radius: k = "large",
|
|
322
318
|
variant: x = "primary",
|
|
323
319
|
...w
|
|
@@ -328,33 +324,33 @@ const E = z.forwardRef(
|
|
|
328
324
|
focusMode: a,
|
|
329
325
|
fullWidth: l,
|
|
330
326
|
disabled: r,
|
|
331
|
-
raw:
|
|
332
|
-
className:
|
|
327
|
+
raw: s,
|
|
328
|
+
className: o,
|
|
333
329
|
noBorder: h,
|
|
334
330
|
size: u,
|
|
335
331
|
labelRight: n,
|
|
336
|
-
labelLeft:
|
|
337
|
-
noBackground:
|
|
338
|
-
align:
|
|
332
|
+
labelLeft: c,
|
|
333
|
+
noBackground: v,
|
|
334
|
+
align: p,
|
|
339
335
|
radius: k,
|
|
340
336
|
variant: x
|
|
341
|
-
}), N =
|
|
342
|
-
"text-copy-accent-dark": t === "light" && !
|
|
343
|
-
"text-copy-light": t === "dark" && !
|
|
344
|
-
"text-copy-accent-dark dark:text-copy-light": t === "alt-system" && !
|
|
345
|
-
"text-copy-light dark:text-copy-accent-dark": t === "system" && !
|
|
337
|
+
}), N = i({
|
|
338
|
+
"text-copy-accent-dark": t === "light" && !s,
|
|
339
|
+
"text-copy-light": t === "dark" && !s,
|
|
340
|
+
"text-copy-accent-dark dark:text-copy-light": t === "alt-system" && !s,
|
|
341
|
+
"text-copy-light dark:text-copy-accent-dark": t === "system" && !s
|
|
346
342
|
});
|
|
347
|
-
return /* @__PURE__ */
|
|
343
|
+
return /* @__PURE__ */ f(
|
|
348
344
|
T,
|
|
349
345
|
{
|
|
350
346
|
ref: B,
|
|
351
347
|
className: _,
|
|
352
348
|
disabled: r,
|
|
353
349
|
type: g,
|
|
354
|
-
"aria-label":
|
|
350
|
+
"aria-label": m || b,
|
|
355
351
|
...w,
|
|
356
352
|
children: [
|
|
357
|
-
|
|
353
|
+
c && /* @__PURE__ */ d("span", { className: "pr-2", children: c }),
|
|
358
354
|
/* @__PURE__ */ d("div", { className: N, children: e }),
|
|
359
355
|
n && /* @__PURE__ */ d("span", { className: "pl-2", children: n })
|
|
360
356
|
]
|
|
@@ -364,13 +360,13 @@ const E = z.forwardRef(
|
|
|
364
360
|
);
|
|
365
361
|
E.displayName = "ButtonIcon";
|
|
366
362
|
/*!
|
|
367
|
-
@versini/ui-button v4.0.
|
|
363
|
+
@versini/ui-button v4.0.1
|
|
368
364
|
© 2025 gizmette.com
|
|
369
365
|
*/
|
|
370
366
|
try {
|
|
371
367
|
window.__VERSINI_UI_BUTTON__ || (window.__VERSINI_UI_BUTTON__ = {
|
|
372
|
-
version: "4.0.
|
|
373
|
-
buildTime: "01/
|
|
368
|
+
version: "4.0.1",
|
|
369
|
+
buildTime: "01/04/2025 10:02 AM EST",
|
|
374
370
|
homepage: "https://github.com/aversini/ui-components",
|
|
375
371
|
license: "MIT"
|
|
376
372
|
});
|
|
@@ -383,17 +379,17 @@ const Q = z.forwardRef(
|
|
|
383
379
|
mode: t = "system",
|
|
384
380
|
focusMode: a = "system",
|
|
385
381
|
fullWidth: l = !1,
|
|
386
|
-
className:
|
|
382
|
+
className: o,
|
|
387
383
|
type: g = "button",
|
|
388
|
-
raw:
|
|
384
|
+
raw: s = !1,
|
|
389
385
|
noBorder: h = !1,
|
|
390
|
-
"aria-label":
|
|
391
|
-
label:
|
|
386
|
+
"aria-label": m,
|
|
387
|
+
label: b,
|
|
392
388
|
size: u = "medium",
|
|
393
389
|
labelRight: n,
|
|
394
|
-
labelLeft:
|
|
395
|
-
noBackground:
|
|
396
|
-
align:
|
|
390
|
+
labelLeft: c,
|
|
391
|
+
noBackground: v = !1,
|
|
392
|
+
align: p = "center",
|
|
397
393
|
active: k = !1,
|
|
398
394
|
radius: x = "large",
|
|
399
395
|
...w
|
|
@@ -404,21 +400,21 @@ const Q = z.forwardRef(
|
|
|
404
400
|
focusMode: a,
|
|
405
401
|
fullWidth: l,
|
|
406
402
|
disabled: r,
|
|
407
|
-
raw:
|
|
408
|
-
className:
|
|
403
|
+
raw: s,
|
|
404
|
+
className: o,
|
|
409
405
|
noBorder: h,
|
|
410
406
|
size: u,
|
|
411
407
|
labelRight: n,
|
|
412
|
-
labelLeft:
|
|
413
|
-
noBackground:
|
|
414
|
-
align:
|
|
408
|
+
labelLeft: c,
|
|
409
|
+
noBackground: v,
|
|
410
|
+
align: p,
|
|
415
411
|
radius: x
|
|
416
|
-
}), N =
|
|
417
|
-
"text-copy-accent-dark": t === "light" && !
|
|
418
|
-
"text-copy-light": t === "dark" && !
|
|
419
|
-
"text-copy-accent-dark dark:text-copy-light": t === "alt-system" && !
|
|
420
|
-
"text-copy-light dark:text-copy-accent-dark": t === "system" && !
|
|
421
|
-
}), R = k ?
|
|
412
|
+
}), N = i({
|
|
413
|
+
"text-copy-accent-dark": t === "light" && !s,
|
|
414
|
+
"text-copy-light": t === "dark" && !s,
|
|
415
|
+
"text-copy-accent-dark dark:text-copy-light": t === "alt-system" && !s,
|
|
416
|
+
"text-copy-light dark:text-copy-accent-dark": t === "system" && !s
|
|
417
|
+
}), R = k ? i(
|
|
422
418
|
"relative",
|
|
423
419
|
"focus-within:static",
|
|
424
420
|
"focus-within:after:border-transparent",
|
|
@@ -435,17 +431,17 @@ const Q = z.forwardRef(
|
|
|
435
431
|
"after:border-table-light dark:after:border-table-dark": t === "alt-system"
|
|
436
432
|
}
|
|
437
433
|
) : "";
|
|
438
|
-
return /* @__PURE__ */ d("div", { className: R, children: /* @__PURE__ */
|
|
434
|
+
return /* @__PURE__ */ d("div", { className: R, children: /* @__PURE__ */ f(
|
|
439
435
|
T,
|
|
440
436
|
{
|
|
441
437
|
ref: B,
|
|
442
438
|
className: _,
|
|
443
439
|
disabled: r,
|
|
444
440
|
type: g,
|
|
445
|
-
"aria-label":
|
|
441
|
+
"aria-label": m || b,
|
|
446
442
|
...w,
|
|
447
443
|
children: [
|
|
448
|
-
|
|
444
|
+
c && /* @__PURE__ */ d("span", { className: "pr-2", children: c }),
|
|
449
445
|
/* @__PURE__ */ d("div", { className: N, children: e }),
|
|
450
446
|
n && /* @__PURE__ */ d("span", { className: "pl-2", children: n })
|
|
451
447
|
]
|
|
@@ -460,28 +456,28 @@ const S = ({
|
|
|
460
456
|
viewBox: t,
|
|
461
457
|
className: a,
|
|
462
458
|
defaultViewBox: l,
|
|
463
|
-
size:
|
|
459
|
+
size: o,
|
|
464
460
|
title: g,
|
|
465
|
-
semantic:
|
|
461
|
+
semantic: s = !1,
|
|
466
462
|
...h
|
|
467
463
|
}) => {
|
|
468
|
-
const
|
|
469
|
-
return /* @__PURE__ */
|
|
464
|
+
const m = i(o, a);
|
|
465
|
+
return /* @__PURE__ */ f(L, { children: [
|
|
470
466
|
/* @__PURE__ */ d(
|
|
471
467
|
"svg",
|
|
472
468
|
{
|
|
473
469
|
xmlns: "http://www.w3.org/2000/svg",
|
|
474
|
-
className:
|
|
470
|
+
className: m,
|
|
475
471
|
viewBox: t || l,
|
|
476
472
|
fill: r || "currentColor",
|
|
477
473
|
role: "img",
|
|
478
|
-
"aria-hidden": !
|
|
474
|
+
"aria-hidden": !s,
|
|
479
475
|
focusable: !1,
|
|
480
476
|
...h,
|
|
481
477
|
children: e
|
|
482
478
|
}
|
|
483
479
|
),
|
|
484
|
-
g &&
|
|
480
|
+
g && s && /* @__PURE__ */ d("span", { className: "sr-only", children: g })
|
|
485
481
|
] });
|
|
486
482
|
};
|
|
487
483
|
/*!
|
|
@@ -491,7 +487,7 @@ const S = ({
|
|
|
491
487
|
try {
|
|
492
488
|
window.__VERSINI_UI_SVGICON__ || (window.__VERSINI_UI_SVGICON__ = {
|
|
493
489
|
version: "4.0.0",
|
|
494
|
-
buildTime: "01/
|
|
490
|
+
buildTime: "01/04/2025 10:02 AM EST",
|
|
495
491
|
homepage: "https://github.com/aversini/ui-components",
|
|
496
492
|
license: "MIT"
|
|
497
493
|
});
|
|
@@ -503,7 +499,7 @@ const X = ({
|
|
|
503
499
|
title: t,
|
|
504
500
|
monotone: a,
|
|
505
501
|
...l
|
|
506
|
-
}) => /* @__PURE__ */
|
|
502
|
+
}) => /* @__PURE__ */ f(
|
|
507
503
|
S,
|
|
508
504
|
{
|
|
509
505
|
defaultViewBox: "0 0 448 512",
|
|
@@ -548,41 +544,41 @@ const X = ({
|
|
|
548
544
|
try {
|
|
549
545
|
window.__VERSINI_UI_ICONS__ || (window.__VERSINI_UI_ICONS__ = {
|
|
550
546
|
version: "4.0.0",
|
|
551
|
-
buildTime: "01/
|
|
547
|
+
buildTime: "01/04/2025 10:02 AM EST",
|
|
552
548
|
homepage: "https://github.com/aversini/ui-components",
|
|
553
549
|
license: "MIT"
|
|
554
550
|
});
|
|
555
551
|
} catch {
|
|
556
552
|
}
|
|
557
|
-
const Z = () => "p-4 max-w-xs sm:max-w-md md:max-w-2xl", $ = ({ kind: e }) =>
|
|
553
|
+
const Z = () => "p-4 max-w-xs sm:max-w-md md:max-w-2xl", $ = ({ kind: e }) => i({
|
|
558
554
|
"bg-surface-lighter dark:bg-surface-dark": e === "left",
|
|
559
555
|
"bg-surface-accent": e === "right"
|
|
560
|
-
}), ee = ({ kind: e }) =>
|
|
556
|
+
}), ee = ({ kind: e }) => i(
|
|
561
557
|
"prose prose-dark dark:prose-lighter prose-p:my-3 prose-blockquote:my-3 prose-ol:my-3 prose-ul:my-3 prose-ul:prose-li:marker:text-black",
|
|
562
558
|
{
|
|
563
559
|
"text-copy-lighter": e === "right"
|
|
564
560
|
}
|
|
565
|
-
), te = ({ kind: e }) =>
|
|
561
|
+
), te = ({ kind: e }) => i("rounded-b-xl", {
|
|
566
562
|
"rounded-tr-xl": e === "left",
|
|
567
563
|
"rounded-tl-xl": e === "right"
|
|
568
564
|
}), re = ({
|
|
569
565
|
kind: e,
|
|
570
566
|
className: r
|
|
571
567
|
}) => {
|
|
572
|
-
const t =
|
|
568
|
+
const t = i(
|
|
573
569
|
O,
|
|
574
570
|
"flex items-start",
|
|
575
571
|
{
|
|
576
572
|
"flex-row-reverse": e === "right"
|
|
577
573
|
},
|
|
578
574
|
r
|
|
579
|
-
), a =
|
|
575
|
+
), a = i(
|
|
580
576
|
"flex flex-col empty:hidden",
|
|
581
577
|
Z(),
|
|
582
578
|
ee({ kind: e }),
|
|
583
579
|
$({ kind: e }),
|
|
584
580
|
te({ kind: e })
|
|
585
|
-
), l = "pr-2 pt-1 text-end text-xs text-copy-light",
|
|
581
|
+
), l = "pr-2 pt-1 text-end text-xs text-copy-light", o = i("flex flex-col-reverse gap-2 sm:flex-row", {
|
|
586
582
|
"ml-2": e === "left",
|
|
587
583
|
"mr-2": e === "right"
|
|
588
584
|
});
|
|
@@ -590,7 +586,7 @@ const Z = () => "p-4 max-w-xs sm:max-w-md md:max-w-2xl", $ = ({ kind: e }) => o(
|
|
|
590
586
|
wrapper: t,
|
|
591
587
|
main: a,
|
|
592
588
|
footer: l,
|
|
593
|
-
copyButton:
|
|
589
|
+
copyButton: o
|
|
594
590
|
};
|
|
595
591
|
}, le = ({
|
|
596
592
|
children: e,
|
|
@@ -598,37 +594,37 @@ const Z = () => "p-4 max-w-xs sm:max-w-md md:max-w-2xl", $ = ({ kind: e }) => o(
|
|
|
598
594
|
className: t,
|
|
599
595
|
footer: a,
|
|
600
596
|
rawFooter: l,
|
|
601
|
-
copyToClipboard:
|
|
597
|
+
copyToClipboard: o,
|
|
602
598
|
copyToClipboardFocusMode: g = "system",
|
|
603
|
-
copyToClipboardMode:
|
|
599
|
+
copyToClipboardMode: s = "system"
|
|
604
600
|
}) => {
|
|
605
|
-
const [h,
|
|
606
|
-
|
|
601
|
+
const [h, m] = U(!1), b = re({ kind: r, className: t }), u = !!o && (typeof o == "function" || typeof o == "string" || typeof e == "string"), n = () => {
|
|
602
|
+
m(!0), typeof o == "function" ? o(e) : typeof o == "string" ? navigator.clipboard.writeText(o) : typeof e == "string" && navigator.clipboard.writeText(e);
|
|
607
603
|
};
|
|
608
604
|
return H(() => {
|
|
609
|
-
let
|
|
610
|
-
return h && (
|
|
611
|
-
|
|
605
|
+
let c;
|
|
606
|
+
return h && (c = window.setTimeout(() => {
|
|
607
|
+
m(!1);
|
|
612
608
|
}, 3e3)), () => {
|
|
613
|
-
clearTimeout(
|
|
609
|
+
clearTimeout(c);
|
|
614
610
|
};
|
|
615
|
-
}, [h]), /* @__PURE__ */
|
|
616
|
-
/* @__PURE__ */
|
|
617
|
-
/* @__PURE__ */ d("div", { className:
|
|
618
|
-
a && Object.keys(a).map((
|
|
619
|
-
|
|
611
|
+
}, [h]), /* @__PURE__ */ f("div", { className: b.wrapper, children: [
|
|
612
|
+
/* @__PURE__ */ f("div", { children: [
|
|
613
|
+
/* @__PURE__ */ d("div", { className: b.main, children: e }),
|
|
614
|
+
a && Object.keys(a).map((c) => a[c] ? /* @__PURE__ */ d("div", { className: "prose-p:m-0", children: /* @__PURE__ */ f("p", { className: b.footer, children: [
|
|
615
|
+
c,
|
|
620
616
|
": ",
|
|
621
|
-
a[
|
|
622
|
-
] }) }, `-${
|
|
617
|
+
a[c]
|
|
618
|
+
] }) }, `-${c}`) : null),
|
|
623
619
|
l && l
|
|
624
620
|
] }),
|
|
625
|
-
u && /* @__PURE__ */ d("div", { className:
|
|
621
|
+
u && /* @__PURE__ */ d("div", { className: b.copyButton, children: /* @__PURE__ */ d(
|
|
626
622
|
E,
|
|
627
623
|
{
|
|
628
624
|
noBorder: !0,
|
|
629
625
|
noBackground: !0,
|
|
630
626
|
size: "small",
|
|
631
|
-
mode:
|
|
627
|
+
mode: s,
|
|
632
628
|
focusMode: g,
|
|
633
629
|
label: h ? "Copied to clipboard" : "Copy to clipboard",
|
|
634
630
|
onClick: n,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@versini/ui-bubble",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Arno Versini",
|
|
6
6
|
"publishConfig": {
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
},
|
|
40
40
|
"dependencies": {
|
|
41
41
|
"@tailwindcss/typography": "0.5.15",
|
|
42
|
-
"@versini/ui-button": "4.0.
|
|
42
|
+
"@versini/ui-button": "4.0.1",
|
|
43
43
|
"@versini/ui-icons": "4.0.0",
|
|
44
44
|
"@versini/ui-types": "4.0.0",
|
|
45
45
|
"clsx": "2.1.1",
|
|
@@ -48,5 +48,5 @@
|
|
|
48
48
|
"sideEffects": [
|
|
49
49
|
"**/*.css"
|
|
50
50
|
],
|
|
51
|
-
"gitHead": "
|
|
51
|
+
"gitHead": "8d426172a7405edff487d08c0fae260d4df0b56e"
|
|
52
52
|
}
|