@luxfi/ui 1.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.
Files changed (124) hide show
  1. package/dist/accordion.cjs +213 -0
  2. package/dist/accordion.js +186 -0
  3. package/dist/alert.cjs +553 -0
  4. package/dist/alert.js +531 -0
  5. package/dist/avatar.cjs +149 -0
  6. package/dist/avatar.js +125 -0
  7. package/dist/badge.cjs +611 -0
  8. package/dist/badge.js +589 -0
  9. package/dist/button.cjs +689 -0
  10. package/dist/button.js +664 -0
  11. package/dist/checkbox.cjs +265 -0
  12. package/dist/checkbox.js +241 -0
  13. package/dist/close-button.cjs +73 -0
  14. package/dist/close-button.js +51 -0
  15. package/dist/collapsible.cjs +711 -0
  16. package/dist/collapsible.js +685 -0
  17. package/dist/color-mode.cjs +36 -0
  18. package/dist/color-mode.js +32 -0
  19. package/dist/dialog.cjs +279 -0
  20. package/dist/dialog.js +246 -0
  21. package/dist/drawer.cjs +207 -0
  22. package/dist/drawer.js +175 -0
  23. package/dist/empty-state.cjs +93 -0
  24. package/dist/empty-state.js +71 -0
  25. package/dist/field.cjs +183 -0
  26. package/dist/field.js +160 -0
  27. package/dist/heading.cjs +46 -0
  28. package/dist/heading.js +40 -0
  29. package/dist/icon-button.cjs +491 -0
  30. package/dist/icon-button.js +470 -0
  31. package/dist/image.cjs +572 -0
  32. package/dist/image.js +551 -0
  33. package/dist/index.cjs +5749 -0
  34. package/dist/index.js +5586 -0
  35. package/dist/input-group.cjs +155 -0
  36. package/dist/input-group.js +133 -0
  37. package/dist/input.cjs +65 -0
  38. package/dist/input.js +59 -0
  39. package/dist/link.cjs +639 -0
  40. package/dist/link.js +612 -0
  41. package/dist/menu.cjs +305 -0
  42. package/dist/menu.js +269 -0
  43. package/dist/pin-input.cjs +182 -0
  44. package/dist/pin-input.js +160 -0
  45. package/dist/popover.cjs +327 -0
  46. package/dist/popover.js +294 -0
  47. package/dist/progress-circle.cjs +152 -0
  48. package/dist/progress-circle.js +128 -0
  49. package/dist/progress.cjs +117 -0
  50. package/dist/progress.js +94 -0
  51. package/dist/provider.cjs +22 -0
  52. package/dist/provider.js +20 -0
  53. package/dist/radio.cjs +177 -0
  54. package/dist/radio.js +153 -0
  55. package/dist/rating.cjs +80 -0
  56. package/dist/rating.js +58 -0
  57. package/dist/select.cjs +791 -0
  58. package/dist/select.js +757 -0
  59. package/dist/separator.cjs +57 -0
  60. package/dist/separator.js +51 -0
  61. package/dist/skeleton.cjs +370 -0
  62. package/dist/skeleton.js +346 -0
  63. package/dist/slider.cjs +138 -0
  64. package/dist/slider.js +115 -0
  65. package/dist/switch.cjs +163 -0
  66. package/dist/switch.js +140 -0
  67. package/dist/table.cjs +1053 -0
  68. package/dist/table.js +1019 -0
  69. package/dist/tabs.cjs +240 -0
  70. package/dist/tabs.js +213 -0
  71. package/dist/tag.cjs +651 -0
  72. package/dist/tag.js +628 -0
  73. package/dist/textarea.cjs +65 -0
  74. package/dist/textarea.js +59 -0
  75. package/dist/toaster.cjs +99 -0
  76. package/dist/toaster.js +96 -0
  77. package/dist/tooltip.cjs +171 -0
  78. package/dist/tooltip.js +148 -0
  79. package/dist/utils.cjs +11 -0
  80. package/dist/utils.js +9 -0
  81. package/package.json +296 -0
  82. package/src/accordion.tsx +285 -0
  83. package/src/alert.tsx +221 -0
  84. package/src/avatar.tsx +174 -0
  85. package/src/badge.tsx +158 -0
  86. package/src/button.tsx +411 -0
  87. package/src/checkbox.tsx +307 -0
  88. package/src/close-button.tsx +51 -0
  89. package/src/collapsible.tsx +126 -0
  90. package/src/color-mode.tsx +37 -0
  91. package/src/dialog.tsx +356 -0
  92. package/src/drawer.tsx +186 -0
  93. package/src/empty-state.tsx +97 -0
  94. package/src/field.tsx +202 -0
  95. package/src/heading.tsx +55 -0
  96. package/src/icon-button.tsx +192 -0
  97. package/src/image.tsx +280 -0
  98. package/src/index.ts +192 -0
  99. package/src/input-group.tsx +159 -0
  100. package/src/input.tsx +60 -0
  101. package/src/link.tsx +333 -0
  102. package/src/menu.tsx +471 -0
  103. package/src/pin-input.tsx +187 -0
  104. package/src/popover.tsx +400 -0
  105. package/src/progress-circle.tsx +180 -0
  106. package/src/progress.tsx +109 -0
  107. package/src/provider.tsx +12 -0
  108. package/src/radio.tsx +175 -0
  109. package/src/rating.tsx +79 -0
  110. package/src/select.tsx +696 -0
  111. package/src/separator.tsx +59 -0
  112. package/src/skeleton.tsx +302 -0
  113. package/src/slider.tsx +152 -0
  114. package/src/switch.tsx +158 -0
  115. package/src/table.tsx +621 -0
  116. package/src/tabs.tsx +354 -0
  117. package/src/tag.tsx +159 -0
  118. package/src/textarea.tsx +60 -0
  119. package/src/toaster.tsx +117 -0
  120. package/src/tokens.css +438 -0
  121. package/src/tooltip.tsx +184 -0
  122. package/src/utils/cn.ts +7 -0
  123. package/src/utils.ts +6 -0
  124. package/tokens.css +438 -0
@@ -0,0 +1,711 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var Collapsible = require('@radix-ui/react-collapsible');
5
+ var React3 = require('react');
6
+ var clsx = require('clsx');
7
+ var tailwindMerge = require('tailwind-merge');
8
+ var NextLink = require('next/link');
9
+ var jsxRuntime = require('react/jsx-runtime');
10
+
11
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
12
+
13
+ function _interopNamespace(e) {
14
+ if (e && e.__esModule) return e;
15
+ var n = Object.create(null);
16
+ if (e) {
17
+ Object.keys(e).forEach(function (k) {
18
+ if (k !== 'default') {
19
+ var d = Object.getOwnPropertyDescriptor(e, k);
20
+ Object.defineProperty(n, k, d.get ? d : {
21
+ enumerable: true,
22
+ get: function () { return e[k]; }
23
+ });
24
+ }
25
+ });
26
+ }
27
+ n.default = e;
28
+ return Object.freeze(n);
29
+ }
30
+
31
+ var Collapsible__namespace = /*#__PURE__*/_interopNamespace(Collapsible);
32
+ var React3__namespace = /*#__PURE__*/_interopNamespace(React3);
33
+ var NextLink__default = /*#__PURE__*/_interopDefault(NextLink);
34
+
35
+ // src/collapsible.tsx
36
+ function cn(...inputs) {
37
+ return tailwindMerge.twMerge(clsx.clsx(inputs));
38
+ }
39
+ var SPACING_SCALE = 4;
40
+ function toStylePx(value) {
41
+ if (value === void 0) return void 0;
42
+ if (typeof value === "string") return value;
43
+ return `${value * SPACING_SCALE}px`;
44
+ }
45
+ function extractSkeletonStyleProps(props) {
46
+ const style = {};
47
+ const rest = {};
48
+ function resolveDimension(value) {
49
+ if (value === void 0 || value === null) return void 0;
50
+ if (typeof value === "number") return `${value * SPACING_SCALE}px`;
51
+ if (typeof value === "string") return value;
52
+ if (typeof value === "object") {
53
+ const obj = value;
54
+ return obj.base ?? obj.lg ?? obj.xl ?? Object.values(obj)[0];
55
+ }
56
+ return void 0;
57
+ }
58
+ for (const [key, value] of Object.entries(props)) {
59
+ if (value === void 0) continue;
60
+ switch (key) {
61
+ case "w": {
62
+ const v = resolveDimension(value);
63
+ if (v) style.width = v;
64
+ break;
65
+ }
66
+ case "h": {
67
+ const v = resolveDimension(value);
68
+ if (v) style.height = v;
69
+ break;
70
+ }
71
+ case "minW": {
72
+ const v = resolveDimension(value);
73
+ if (v) style.minWidth = v;
74
+ break;
75
+ }
76
+ case "maxW": {
77
+ const v = resolveDimension(value);
78
+ if (v) style.maxWidth = v;
79
+ break;
80
+ }
81
+ case "height":
82
+ style.height = value;
83
+ break;
84
+ case "display":
85
+ style.display = value;
86
+ break;
87
+ case "flexGrow":
88
+ style.flexGrow = value;
89
+ break;
90
+ case "flexShrink":
91
+ style.flexShrink = value;
92
+ break;
93
+ case "flexBasis":
94
+ style.flexBasis = value;
95
+ break;
96
+ case "fontWeight":
97
+ style.fontWeight = value;
98
+ break;
99
+ case "borderRadius":
100
+ style.borderRadius = value;
101
+ break;
102
+ case "alignSelf":
103
+ style.alignSelf = value;
104
+ break;
105
+ case "alignItems":
106
+ style.alignItems = value;
107
+ break;
108
+ case "justifyContent":
109
+ style.justifyContent = value;
110
+ break;
111
+ case "color":
112
+ style.color = value;
113
+ break;
114
+ case "mt":
115
+ style.marginTop = toStylePx(value);
116
+ break;
117
+ case "mb":
118
+ style.marginBottom = toStylePx(value);
119
+ break;
120
+ case "ml":
121
+ style.marginLeft = toStylePx(value);
122
+ break;
123
+ case "mr":
124
+ style.marginRight = toStylePx(value);
125
+ break;
126
+ case "overflow":
127
+ style.overflow = value;
128
+ break;
129
+ case "whiteSpace":
130
+ style.whiteSpace = value;
131
+ break;
132
+ case "textOverflow":
133
+ style.textOverflow = value;
134
+ break;
135
+ case "textTransform":
136
+ style.textTransform = value;
137
+ break;
138
+ case "gap":
139
+ style.gap = typeof value === "number" ? `${value * SPACING_SCALE}px` : value;
140
+ break;
141
+ case "gridTemplateColumns":
142
+ style.gridTemplateColumns = value;
143
+ break;
144
+ case "minWidth":
145
+ style.minWidth = value;
146
+ break;
147
+ case "boxSize": {
148
+ const s = typeof value === "number" ? `${value * SPACING_SCALE}px` : value;
149
+ style.width = s;
150
+ style.height = s;
151
+ break;
152
+ }
153
+ case "py": {
154
+ const v = toStylePx(value);
155
+ style.paddingTop = v;
156
+ style.paddingBottom = v;
157
+ break;
158
+ }
159
+ case "px": {
160
+ const v = toStylePx(value);
161
+ style.paddingLeft = v;
162
+ style.paddingRight = v;
163
+ break;
164
+ }
165
+ case "p": {
166
+ const v = toStylePx(value);
167
+ style.padding = v;
168
+ break;
169
+ }
170
+ case "hideBelow":
171
+ break;
172
+ // handled via className
173
+ case "textStyle":
174
+ break;
175
+ // drop textStyle, not directly applicable
176
+ case "fontSize":
177
+ style.fontSize = value;
178
+ break;
179
+ case "flexWrap":
180
+ style.flexWrap = value;
181
+ break;
182
+ case "wordBreak":
183
+ style.wordBreak = value;
184
+ break;
185
+ case "lineHeight":
186
+ style.lineHeight = value;
187
+ break;
188
+ case "marginRight":
189
+ style.marginRight = value;
190
+ break;
191
+ case "position":
192
+ style.position = value;
193
+ break;
194
+ case "background":
195
+ style.background = value;
196
+ break;
197
+ default:
198
+ rest[key] = value;
199
+ break;
200
+ }
201
+ }
202
+ return { style, rest };
203
+ }
204
+ var Skeleton = React3__namespace.forwardRef(
205
+ function Skeleton2(props, ref) {
206
+ const {
207
+ loading = false,
208
+ asChild,
209
+ className,
210
+ children,
211
+ style: styleProp,
212
+ // Destructure style-prop shims so they don't leak into DOM
213
+ w: _w,
214
+ h: _h,
215
+ minW: _minW,
216
+ maxW: _maxW,
217
+ display: _display,
218
+ flexGrow: _flexGrow,
219
+ flexShrink: _flexShrink,
220
+ flexBasis: _flexBasis,
221
+ fontWeight: _fontWeight,
222
+ textStyle: _textStyle,
223
+ borderRadius: _borderRadius,
224
+ alignSelf: _alignSelf,
225
+ alignItems: _alignItems,
226
+ justifyContent: _justifyContent,
227
+ color: _color,
228
+ mt: _mt,
229
+ mb: _mb,
230
+ ml: _ml,
231
+ mr: _mr,
232
+ height: _height,
233
+ overflow: _overflow,
234
+ whiteSpace: _whiteSpace,
235
+ textOverflow: _textOverflow,
236
+ textTransform: _textTransform,
237
+ gap: _gap,
238
+ gridTemplateColumns: _gridTemplateColumns,
239
+ minWidth: _minWidth,
240
+ boxSize: _boxSize,
241
+ py: _py,
242
+ px: _px,
243
+ p: _p,
244
+ hideBelow: _hideBelow,
245
+ fontSize: _fontSize,
246
+ flexWrap: _flexWrap,
247
+ wordBreak: _wordBreak,
248
+ lineHeight: _lineHeight,
249
+ marginRight: _marginRight,
250
+ position: _position,
251
+ background: _background,
252
+ as: Component = "div",
253
+ ...htmlRest
254
+ } = props;
255
+ const { style: shimStyle } = extractSkeletonStyleProps({
256
+ w: _w,
257
+ h: _h,
258
+ minW: _minW,
259
+ maxW: _maxW,
260
+ display: _display,
261
+ flexGrow: _flexGrow,
262
+ flexShrink: _flexShrink,
263
+ flexBasis: _flexBasis,
264
+ fontWeight: _fontWeight,
265
+ textStyle: _textStyle,
266
+ borderRadius: _borderRadius,
267
+ alignSelf: _alignSelf,
268
+ alignItems: _alignItems,
269
+ justifyContent: _justifyContent,
270
+ color: _color,
271
+ mt: _mt,
272
+ mb: _mb,
273
+ ml: _ml,
274
+ mr: _mr,
275
+ height: _height,
276
+ overflow: _overflow,
277
+ whiteSpace: _whiteSpace,
278
+ textOverflow: _textOverflow,
279
+ textTransform: _textTransform,
280
+ gap: _gap,
281
+ gridTemplateColumns: _gridTemplateColumns,
282
+ minWidth: _minWidth,
283
+ boxSize: _boxSize,
284
+ py: _py,
285
+ px: _px,
286
+ p: _p,
287
+ hideBelow: _hideBelow,
288
+ fontSize: _fontSize,
289
+ flexWrap: _flexWrap,
290
+ wordBreak: _wordBreak,
291
+ lineHeight: _lineHeight,
292
+ marginRight: _marginRight,
293
+ position: _position,
294
+ background: _background
295
+ });
296
+ const mergedStyle = Object.keys(shimStyle).length > 0 || styleProp ? { ...shimStyle, ...styleProp } : void 0;
297
+ const HIDE_BELOW_MAP = { lg: "lg:hidden", md: "md:hidden", sm: "sm:hidden" };
298
+ const hideBelowClass = _hideBelow ? HIDE_BELOW_MAP[_hideBelow] : void 0;
299
+ const finalClassName = hideBelowClass ? cn(className, hideBelowClass) : className;
300
+ if (!loading) {
301
+ if (asChild && React3__namespace.isValidElement(children)) {
302
+ return children;
303
+ }
304
+ return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, className: finalClassName, style: mergedStyle, ...htmlRest, children });
305
+ }
306
+ if (asChild && React3__namespace.isValidElement(children)) {
307
+ return /* @__PURE__ */ jsxRuntime.jsx(
308
+ Component,
309
+ {
310
+ ref,
311
+ "data-loading": true,
312
+ className: cn(
313
+ "animate-skeleton-shimmer rounded-sm",
314
+ "bg-[linear-gradient(90deg,var(--color-skeleton-start)_0%,var(--color-skeleton-end)_50%,var(--color-skeleton-start)_100%)]",
315
+ "bg-[length:200%_100%]",
316
+ "text-transparent [&_*]:invisible",
317
+ finalClassName
318
+ ),
319
+ style: mergedStyle,
320
+ ...htmlRest,
321
+ children
322
+ }
323
+ );
324
+ }
325
+ return /* @__PURE__ */ jsxRuntime.jsx(
326
+ Component,
327
+ {
328
+ ref,
329
+ "data-loading": true,
330
+ className: cn(
331
+ "animate-skeleton-shimmer rounded-sm",
332
+ "bg-[linear-gradient(90deg,var(--color-skeleton-start)_0%,var(--color-skeleton-end)_50%,var(--color-skeleton-start)_100%)]",
333
+ "bg-[length:200%_100%]",
334
+ children ? "text-transparent [&_*]:invisible" : "min-h-5",
335
+ finalClassName
336
+ ),
337
+ style: mergedStyle,
338
+ ...htmlRest,
339
+ children
340
+ }
341
+ );
342
+ }
343
+ );
344
+ React3__namespace.forwardRef(
345
+ function SkeletonCircle2(props, ref) {
346
+ const { size = 40, loading = true, className, ...rest } = props;
347
+ const dimension = typeof size === "number" ? `${size}px` : size;
348
+ return /* @__PURE__ */ jsxRuntime.jsx(
349
+ Skeleton,
350
+ {
351
+ ref,
352
+ loading,
353
+ className: cn("rounded-full shrink-0", className),
354
+ style: { width: dimension, height: dimension, ...rest.style },
355
+ ...rest
356
+ }
357
+ );
358
+ }
359
+ );
360
+ React3__namespace.forwardRef(
361
+ function SkeletonText2(props, ref) {
362
+ const { noOfLines = 3, loading = true, className, ...rest } = props;
363
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex w-full flex-col gap-2", className), ...rest, children: Array.from({ length: noOfLines }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
364
+ Skeleton,
365
+ {
366
+ loading,
367
+ className: cn("h-4", index === noOfLines - 1 && "max-w-[80%]")
368
+ },
369
+ index
370
+ )) });
371
+ }
372
+ );
373
+ var ArrowIcon = ({ className, style }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, style, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M11 3h6v6M17 3L7 13M14 11v6H3V6h6", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
374
+ function stripUtmParams(url) {
375
+ try {
376
+ const urlObj = new URL(url);
377
+ for (const param of ["utm_source", "utm_medium", "utm_campaign", "utm_term", "utm_content"]) {
378
+ urlObj.searchParams.delete(param);
379
+ }
380
+ return urlObj.toString();
381
+ } catch {
382
+ return url;
383
+ }
384
+ }
385
+ var VARIANT_CLASSES = {
386
+ primary: cn(
387
+ "text-[var(--color-link-primary)]",
388
+ "hover:no-underline hover:text-[var(--color-link-primary-hover)]",
389
+ "data-[hover]:no-underline data-[hover]:text-[var(--color-link-primary-hover)]"
390
+ ),
391
+ secondary: cn(
392
+ "text-[var(--color-link-secondary)]",
393
+ "hover:no-underline hover:text-[var(--color-hover)]",
394
+ "data-[hover]:no-underline data-[hover]:text-[var(--color-hover)]"
395
+ ),
396
+ subtle: cn(
397
+ "text-[var(--color-link-subtle)]",
398
+ "hover:text-[var(--color-link-subtle-hover)] hover:underline hover:decoration-[var(--color-link-subtle-hover)]",
399
+ "data-[hover]:text-[var(--color-link-subtle-hover)] data-[hover]:underline data-[hover]:decoration-[var(--color-link-subtle-hover)]"
400
+ ),
401
+ underlaid: cn(
402
+ "text-[var(--color-link-primary)] bg-[var(--color-link-underlaid-bg)]",
403
+ "px-2 py-1.5 rounded-md text-sm",
404
+ "hover:text-[var(--color-link-primary-hover)] hover:no-underline",
405
+ "data-[hover]:text-[var(--color-link-primary-hover)] data-[hover]:no-underline"
406
+ ),
407
+ menu: cn(
408
+ "text-[var(--color-link-menu)]",
409
+ "hover:text-[var(--color-hover)] hover:no-underline",
410
+ "data-[hover]:text-[var(--color-hover)] data-[hover]:no-underline"
411
+ ),
412
+ navigation: cn(
413
+ "text-[var(--color-link-nav-fg)] bg-transparent",
414
+ "hover:text-[var(--color-link-nav-fg-hover)] hover:no-underline",
415
+ "data-[hover]:text-[var(--color-link-nav-fg-hover)] data-[hover]:no-underline",
416
+ "data-[selected]:text-[var(--color-link-nav-fg-selected)] data-[selected]:bg-[var(--color-link-nav-bg-selected)]",
417
+ "data-[active]:text-[var(--color-link-nav-fg-active)]"
418
+ ),
419
+ plain: cn(
420
+ "text-inherit",
421
+ "hover:no-underline",
422
+ "data-[hover]:no-underline"
423
+ )
424
+ };
425
+ var BASE_CLASSES = "inline-flex items-center gap-0 cursor-pointer data-[disabled]:cursor-not-allowed";
426
+ var LinkExternalIcon = ({ color }) => /* @__PURE__ */ jsxRuntime.jsx(
427
+ ArrowIcon,
428
+ {
429
+ className: cn(
430
+ "size-3 align-middle shrink-0",
431
+ "group-hover:text-inherit"
432
+ ),
433
+ style: color ? { color } : { color: "var(--color-icon-secondary)" },
434
+ "aria-hidden": "true"
435
+ }
436
+ );
437
+ var splitProps = (props) => {
438
+ const { scroll = true, shallow = false, prefetch = false, ...rest } = props;
439
+ return {
440
+ own: rest,
441
+ next: {
442
+ href: rest.href ?? "",
443
+ scroll,
444
+ shallow,
445
+ prefetch
446
+ }
447
+ };
448
+ };
449
+ var SPACING = 4;
450
+ function resolveSpacing(v) {
451
+ if (v === void 0) return void 0;
452
+ if (typeof v === "number") return `${v * SPACING}px`;
453
+ if (typeof v === "string") return v;
454
+ if (typeof v === "object" && v !== null) {
455
+ const base = v.base;
456
+ if (base !== void 0) return typeof base === "number" ? `${base * SPACING}px` : base;
457
+ const lg = v.lg;
458
+ if (lg !== void 0) return typeof lg === "number" ? `${lg * SPACING}px` : lg;
459
+ }
460
+ return void 0;
461
+ }
462
+ var Link = React3__namespace.default.forwardRef(
463
+ function Link2(props, ref) {
464
+ const { own, next } = splitProps(props);
465
+ const {
466
+ external,
467
+ loading,
468
+ href,
469
+ children,
470
+ disabled,
471
+ noIcon,
472
+ iconColor,
473
+ variant = "primary",
474
+ className,
475
+ asChild: _asChild,
476
+ // Strip Chakra style props
477
+ fontWeight: _fontWeight,
478
+ whiteSpace: _whiteSpace,
479
+ wordBreak: _wordBreak,
480
+ textStyle: _textStyle,
481
+ ml: _ml,
482
+ mr: _mr,
483
+ display: _display,
484
+ alignItems: _alignItems,
485
+ flexShrink: _flexShrink,
486
+ minW: _minW,
487
+ justifyContent: _justifyContent,
488
+ position: _position,
489
+ ...rest
490
+ } = own;
491
+ const shimStyle = {};
492
+ if (_fontWeight !== void 0) shimStyle.fontWeight = _fontWeight;
493
+ if (_whiteSpace) shimStyle.whiteSpace = _whiteSpace;
494
+ if (_wordBreak) shimStyle.wordBreak = _wordBreak;
495
+ if (_ml !== void 0) shimStyle.marginLeft = resolveSpacing(_ml);
496
+ if (_mr !== void 0) shimStyle.marginRight = resolveSpacing(_mr);
497
+ if (_display) shimStyle.display = _display;
498
+ if (_alignItems) shimStyle.alignItems = _alignItems;
499
+ if (_flexShrink !== void 0) shimStyle.flexShrink = _flexShrink;
500
+ if (_minW !== void 0) shimStyle.minWidth = typeof _minW === "number" ? `${_minW * SPACING}px` : _minW;
501
+ if (_justifyContent) shimStyle.justifyContent = _justifyContent;
502
+ if (_position) shimStyle.position = _position;
503
+ const linkClasses = cn(BASE_CLASSES, VARIANT_CLASSES[variant], className);
504
+ const linkStyle = Object.keys(shimStyle).length > 0 ? shimStyle : void 0;
505
+ if (external) {
506
+ const processedHref = typeof href === "string" ? stripUtmParams(href) : href;
507
+ return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { loading, ref, asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
508
+ "a",
509
+ {
510
+ href: processedHref,
511
+ className: cn("group", linkClasses),
512
+ style: linkStyle,
513
+ target: "_blank",
514
+ rel: "noopener noreferrer",
515
+ ...disabled ? { "data-disabled": true } : {},
516
+ ...rest,
517
+ children: [
518
+ children,
519
+ !noIcon && /* @__PURE__ */ jsxRuntime.jsx(LinkExternalIcon, { color: iconColor })
520
+ ]
521
+ }
522
+ ) });
523
+ }
524
+ return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { loading, ref, asChild: true, children: next.href ? /* @__PURE__ */ jsxRuntime.jsx(
525
+ NextLink__default.default,
526
+ {
527
+ ...next,
528
+ className: linkClasses,
529
+ style: linkStyle,
530
+ ...disabled ? { "data-disabled": true } : {},
531
+ ...rest,
532
+ children
533
+ }
534
+ ) : /* @__PURE__ */ jsxRuntime.jsx(
535
+ "span",
536
+ {
537
+ className: linkClasses,
538
+ ...disabled ? { "data-disabled": true } : {},
539
+ ...rest,
540
+ children
541
+ }
542
+ ) });
543
+ }
544
+ );
545
+ React3__namespace.default.forwardRef(
546
+ function LinkBox2(props, ref) {
547
+ const { className, ...rest } = props;
548
+ return /* @__PURE__ */ jsxRuntime.jsx(
549
+ "div",
550
+ {
551
+ ref,
552
+ className: cn("relative", className),
553
+ ...rest
554
+ }
555
+ );
556
+ }
557
+ );
558
+ React3__namespace.default.forwardRef(
559
+ function LinkOverlay2(props, ref) {
560
+ const { own, next } = splitProps(props);
561
+ const {
562
+ children,
563
+ external,
564
+ loading,
565
+ href,
566
+ noIcon,
567
+ iconColor,
568
+ variant = "primary",
569
+ className,
570
+ disabled,
571
+ asChild: _asChild2,
572
+ fontWeight: _fw2,
573
+ whiteSpace: _ws2,
574
+ wordBreak: _wb2,
575
+ textStyle: _ts2,
576
+ ml: _ml2,
577
+ mr: _mr2,
578
+ display: _d2,
579
+ alignItems: _ai2,
580
+ flexShrink: _fs2,
581
+ minW: _mw2,
582
+ justifyContent: _jc2,
583
+ position: _p2,
584
+ ...rest
585
+ } = own;
586
+ const overlayClasses = cn(
587
+ BASE_CLASSES,
588
+ VARIANT_CLASSES[variant],
589
+ // Static positioning with a ::before pseudo-element that covers the LinkBox
590
+ "static",
591
+ 'before:absolute before:inset-0 before:z-0 before:content-[""]',
592
+ className
593
+ );
594
+ if (external) {
595
+ const processedHref = typeof href === "string" ? stripUtmParams(href) : href;
596
+ return /* @__PURE__ */ jsxRuntime.jsx(
597
+ "a",
598
+ {
599
+ ref,
600
+ href: loading ? void 0 : processedHref,
601
+ className: overlayClasses,
602
+ target: "_blank",
603
+ rel: "noopener noreferrer",
604
+ ...rest,
605
+ children: (children || !noIcon && href) && /* @__PURE__ */ jsxRuntime.jsxs(Skeleton, { display: "inline-flex", alignItems: "center", loading, maxW: "100%", h: "100%", children: [
606
+ children,
607
+ !noIcon && href && /* @__PURE__ */ jsxRuntime.jsx(LinkExternalIcon, { color: iconColor })
608
+ ] })
609
+ }
610
+ );
611
+ }
612
+ const content = children ? /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { display: "inline-flex", alignItems: "center", loading, maxW: "100%", h: "100%", children }) : null;
613
+ if (next.href) {
614
+ const anchorRest = rest;
615
+ return /* @__PURE__ */ jsxRuntime.jsx(
616
+ NextLink__default.default,
617
+ {
618
+ ref,
619
+ ...next,
620
+ className: overlayClasses,
621
+ ...anchorRest,
622
+ children: content
623
+ }
624
+ );
625
+ }
626
+ return /* @__PURE__ */ jsxRuntime.jsx(
627
+ "span",
628
+ {
629
+ ref,
630
+ className: overlayClasses,
631
+ ...rest,
632
+ children: content
633
+ }
634
+ );
635
+ }
636
+ );
637
+ function useUpdateEffect(effect, deps) {
638
+ const isFirstMount = React3__namespace.default.useRef(true);
639
+ React3__namespace.default.useEffect(() => {
640
+ if (isFirstMount.current) {
641
+ isFirstMount.current = false;
642
+ return;
643
+ }
644
+ return effect();
645
+ }, deps);
646
+ }
647
+ function scrollToElement(id) {
648
+ const el = document.getElementById(id);
649
+ if (el) {
650
+ el.scrollIntoView({ behavior: "smooth", block: "start" });
651
+ }
652
+ }
653
+ var CUT_ID = "CollapsibleDetails";
654
+ var CollapsibleDetails = (props) => {
655
+ const { children, id = CUT_ID, onClick, isExpanded: isExpandedProp = false, text: textProp, loading, noScroll, ...rest } = props;
656
+ const [isExpanded, setIsExpanded] = React3__namespace.default.useState(isExpandedProp);
657
+ const handleClick = React3__namespace.default.useCallback((event) => {
658
+ setIsExpanded((flag) => !flag);
659
+ if (!noScroll) {
660
+ scrollToElement(id);
661
+ }
662
+ onClick?.(event);
663
+ }, [id, noScroll, onClick]);
664
+ useUpdateEffect(() => {
665
+ setIsExpanded(isExpandedProp);
666
+ if (isExpandedProp && !noScroll) {
667
+ scrollToElement(id);
668
+ }
669
+ }, [isExpandedProp, id, noScroll]);
670
+ const text = isExpanded ? textProp?.[1] ?? "Hide details" : textProp?.[0] ?? "View details";
671
+ return /* @__PURE__ */ jsxRuntime.jsxs(Collapsible__namespace.Root, { open: isExpanded, children: [
672
+ /* @__PURE__ */ jsxRuntime.jsx(Collapsible__namespace.Trigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
673
+ Link,
674
+ {
675
+ className: "text-sm underline decoration-dashed w-fit",
676
+ onClick: handleClick,
677
+ loading,
678
+ ...rest,
679
+ children: /* @__PURE__ */ jsxRuntime.jsx("span", { id, children: text })
680
+ }
681
+ ) }),
682
+ /* @__PURE__ */ jsxRuntime.jsx(Collapsible__namespace.Content, { children })
683
+ ] });
684
+ };
685
+ var CollapsibleList = (props) => {
686
+ const CUT_LENGTH = 3;
687
+ const { items, renderItem, triggerProps, cutLength = CUT_LENGTH, text: textProp, defaultExpanded = false, className, ...rest } = props;
688
+ const [isExpanded, setIsExpanded] = React3__namespace.default.useState(defaultExpanded);
689
+ React3__namespace.default.useEffect(() => {
690
+ setIsExpanded(defaultExpanded);
691
+ }, [defaultExpanded]);
692
+ const handleToggle = React3__namespace.default.useCallback(() => {
693
+ setIsExpanded((flag) => !flag);
694
+ }, []);
695
+ const text = isExpanded ? textProp?.[1] ?? "Hide" : textProp?.[0] ?? "Show all";
696
+ return /* @__PURE__ */ jsxRuntime.jsx(Collapsible__namespace.Root, { open: isExpanded, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col w-full", className), ...rest, children: [
697
+ items.slice(0, isExpanded ? void 0 : cutLength).map(renderItem),
698
+ items.length > cutLength && /* @__PURE__ */ jsxRuntime.jsx(Collapsible__namespace.Trigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
699
+ Link,
700
+ {
701
+ className: "text-sm underline decoration-dashed w-fit min-w-0",
702
+ onClick: handleToggle,
703
+ ...triggerProps,
704
+ children: text
705
+ }
706
+ ) })
707
+ ] }) });
708
+ };
709
+
710
+ exports.CollapsibleDetails = CollapsibleDetails;
711
+ exports.CollapsibleList = CollapsibleList;