@bubo-squared/ui-framework 0.2.32 → 0.2.34
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.cjs +216 -157
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +29 -3
- package/dist/index.d.ts +29 -3
- package/dist/index.js +213 -155
- package/dist/index.js.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -713,9 +713,10 @@ var badgeVariants = cva8(
|
|
|
713
713
|
xl: "px-4 h6-title"
|
|
714
714
|
},
|
|
715
715
|
variant: {
|
|
716
|
-
primary: "bg-
|
|
717
|
-
|
|
718
|
-
|
|
716
|
+
primary: "bg-primary text-primary",
|
|
717
|
+
primaryInverted: "bg-(--color-primary) text-(--color-primary-inverse)",
|
|
718
|
+
secondary: "bg-(--background-secondary) text-secondary",
|
|
719
|
+
outline: "bg-(--background-secondary) text-secondary shadow-[inset_0_0_0_1px_var(--border-secondary)]",
|
|
719
720
|
active: "bg-ac-lilac text-badge-black",
|
|
720
721
|
informal: "bg-ac-neon-blue text-badge-black",
|
|
721
722
|
success: "bg-ac-neon-green text-badge-black",
|
|
@@ -1366,7 +1367,7 @@ import { ChevronRightIcon } from "@bubo-squared/icons";
|
|
|
1366
1367
|
|
|
1367
1368
|
// src/components/ui/dropdown-styles.ts
|
|
1368
1369
|
import { cva as cva13 } from "class-variance-authority";
|
|
1369
|
-
var dropdownSurfaceClass = "z-50 rounded-
|
|
1370
|
+
var dropdownSurfaceClass = "z-50 rounded-8 border border-secondary-hover bg-(--background-neutral) shadow-card-md";
|
|
1370
1371
|
var dropdownScrollClass = "max-h-79 overflow-y-auto dropdown-scrollbar";
|
|
1371
1372
|
var dropdownRowVariants = cva13(
|
|
1372
1373
|
"flex w-full items-center gap-2 pl-(--space-8) pr-(--space-16) text-left text-primary cursor-pointer hover:bg-(--background-secondary)",
|
|
@@ -3262,7 +3263,9 @@ var SearchInput = React33.forwardRef((props, forwardedRef) => {
|
|
|
3262
3263
|
disabled: disabled ?? void 0,
|
|
3263
3264
|
variant: "bare",
|
|
3264
3265
|
className: cn(
|
|
3265
|
-
searchTextVariants({ size })
|
|
3266
|
+
searchTextVariants({ size }),
|
|
3267
|
+
"[&::-webkit-search-cancel-button]:appearance-none",
|
|
3268
|
+
"[&::-webkit-search-cancel-button]:hidden"
|
|
3266
3269
|
),
|
|
3267
3270
|
...inputProps
|
|
3268
3271
|
}
|
|
@@ -3274,13 +3277,67 @@ var SearchInput = React33.forwardRef((props, forwardedRef) => {
|
|
|
3274
3277
|
});
|
|
3275
3278
|
SearchInput.displayName = "SearchInput";
|
|
3276
3279
|
|
|
3280
|
+
// src/components/Inputs/SegmentedSwitch.tsx
|
|
3281
|
+
import * as React34 from "react";
|
|
3282
|
+
import { jsx as jsx36, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
3283
|
+
var SegmentedSwitch = React34.forwardRef((props, forwardedRef) => {
|
|
3284
|
+
const {
|
|
3285
|
+
name,
|
|
3286
|
+
options,
|
|
3287
|
+
value,
|
|
3288
|
+
onValueChange,
|
|
3289
|
+
disabled = false,
|
|
3290
|
+
className,
|
|
3291
|
+
"aria-label": ariaLabel,
|
|
3292
|
+
pill = false,
|
|
3293
|
+
...divProps
|
|
3294
|
+
} = props;
|
|
3295
|
+
const handleSelect = (nextValue) => {
|
|
3296
|
+
if (disabled || nextValue === value) return;
|
|
3297
|
+
onValueChange(nextValue);
|
|
3298
|
+
};
|
|
3299
|
+
return /* @__PURE__ */ jsxs23("div", { ref: forwardedRef, className: cn("inline-flex items-center", className), ...divProps, children: [
|
|
3300
|
+
/* @__PURE__ */ jsx36(
|
|
3301
|
+
"div",
|
|
3302
|
+
{
|
|
3303
|
+
role: "radiogroup",
|
|
3304
|
+
"aria-label": ariaLabel,
|
|
3305
|
+
className: cn(
|
|
3306
|
+
"inline-flex h-8 items-center rounded-24 border p-px",
|
|
3307
|
+
disabled ? "border-secondary-disabled bg-(--background-primary-disabled)" : "border-secondary bg-(--background-primary)"
|
|
3308
|
+
),
|
|
3309
|
+
children: options.map((option, index) => /* @__PURE__ */ jsx36(
|
|
3310
|
+
"button",
|
|
3311
|
+
{
|
|
3312
|
+
type: "button",
|
|
3313
|
+
role: "radio",
|
|
3314
|
+
"aria-checked": value === option.value,
|
|
3315
|
+
"aria-label": option["aria-label"],
|
|
3316
|
+
disabled,
|
|
3317
|
+
onClick: () => handleSelect(option.value),
|
|
3318
|
+
className: cn(
|
|
3319
|
+
"paragraph-md inline-flex h-full min-w-28 items-center justify-center px-4 transition-colors",
|
|
3320
|
+
!pill ? "rounded-24" : index === 0 ? "rounded-l-24" : "rounded-r-24",
|
|
3321
|
+
value === option.value ? disabled ? "bg-(--background-primary-hover) text-primary-disabled" : "bg-(--background-brand) text-button-white" : disabled ? "text-primary-disabled" : "text-secondary hover:text-(--color-primary-hover)"
|
|
3322
|
+
),
|
|
3323
|
+
children: option.label
|
|
3324
|
+
},
|
|
3325
|
+
option.value
|
|
3326
|
+
))
|
|
3327
|
+
}
|
|
3328
|
+
),
|
|
3329
|
+
name ? /* @__PURE__ */ jsx36("input", { type: "hidden", name, value }) : null
|
|
3330
|
+
] });
|
|
3331
|
+
});
|
|
3332
|
+
SegmentedSwitch.displayName = "SegmentedSwitch";
|
|
3333
|
+
|
|
3277
3334
|
// src/components/Inputs/Slider.tsx
|
|
3278
|
-
import * as
|
|
3335
|
+
import * as React36 from "react";
|
|
3279
3336
|
|
|
3280
3337
|
// src/components/Feedback/Tooltip.tsx
|
|
3281
|
-
import * as
|
|
3338
|
+
import * as React35 from "react";
|
|
3282
3339
|
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
3283
|
-
import { jsx as
|
|
3340
|
+
import { jsx as jsx37, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
3284
3341
|
var TooltipArrow = TooltipPrimitive.Arrow;
|
|
3285
3342
|
var REACT_FORWARD_REF_TYPE = /* @__PURE__ */ Symbol.for("react.forward_ref");
|
|
3286
3343
|
var REACT_MEMO_TYPE = /* @__PURE__ */ Symbol.for("react.memo");
|
|
@@ -3339,13 +3396,13 @@ var Tooltip = (props) => {
|
|
|
3339
3396
|
children,
|
|
3340
3397
|
delayDuration = 200
|
|
3341
3398
|
} = props;
|
|
3342
|
-
const trigger =
|
|
3399
|
+
const trigger = React35.isValidElement(children) && canAcceptRef(children) ? children : /* @__PURE__ */ jsx37("span", { className: "inline-flex", tabIndex: 0, children });
|
|
3343
3400
|
const hasStrapline = typeof strapline === "string" ? strapline.trim() !== "" : strapline != null;
|
|
3344
3401
|
const hasDescription = typeof description === "string" ? description.trim() !== "" : description != null;
|
|
3345
3402
|
const { side, align } = mapPlacementToSideAndAlign(placement);
|
|
3346
3403
|
const tooltipClasses = "group bg-(--background-tooltip) max-w-[calc(100vw-2rem)] shadow-card-md border-none rounded-4 py-1.5 px-2.5 [&>span]:scale-200 data-[state=delayed-open]:animate-in data-[state=instant-open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=delayed-open]:fade-in-0 data-[state=instant-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-[state=instant-open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2";
|
|
3347
3404
|
const tooltipArrowClasses = "relative fill-(--background-tooltip) transition-[filter,transform] group-data-[side=top]:top-[-2px] group-data-[side=top]:drop-shadow-[0px_1px_1px_color-mix(in_srgb,_var(--color-b-black-10)_66%,_transparent)] group-data-[side=bottom]:drop-shadow-[0px_1px_1px_color-mix(in_srgb,_var(--color-b-black-10)_66%,_transparent)] group-data-[side=left]:drop-shadow-[0px_2px_1px_color-mix(in_srgb,_var(--color-b-black-10)_66%,_transparent)] group-data-[side=right]:drop-shadow-[0px_2px_1px_color-mix(in_srgb,_var(--color-b-black-10)_66%,_transparent)]";
|
|
3348
|
-
return /* @__PURE__ */
|
|
3405
|
+
return /* @__PURE__ */ jsxs24(
|
|
3349
3406
|
TooltipPrimitive.Root,
|
|
3350
3407
|
{
|
|
3351
3408
|
open,
|
|
@@ -3354,8 +3411,8 @@ var Tooltip = (props) => {
|
|
|
3354
3411
|
disableHoverableContent,
|
|
3355
3412
|
delayDuration,
|
|
3356
3413
|
children: [
|
|
3357
|
-
/* @__PURE__ */
|
|
3358
|
-
/* @__PURE__ */
|
|
3414
|
+
/* @__PURE__ */ jsx37(TooltipPrimitive.Trigger, { asChild: true, children: trigger }),
|
|
3415
|
+
/* @__PURE__ */ jsx37(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs24(
|
|
3359
3416
|
TooltipPrimitive.Content,
|
|
3360
3417
|
{
|
|
3361
3418
|
side,
|
|
@@ -3363,11 +3420,11 @@ var Tooltip = (props) => {
|
|
|
3363
3420
|
sideOffset: offset,
|
|
3364
3421
|
className: cn(tooltipClasses, className),
|
|
3365
3422
|
children: [
|
|
3366
|
-
showArrow && /* @__PURE__ */
|
|
3367
|
-
/* @__PURE__ */
|
|
3368
|
-
hasStrapline && /* @__PURE__ */
|
|
3369
|
-
/* @__PURE__ */
|
|
3370
|
-
hasDescription && /* @__PURE__ */
|
|
3423
|
+
showArrow && /* @__PURE__ */ jsx37(TooltipArrow, { className: tooltipArrowClasses }),
|
|
3424
|
+
/* @__PURE__ */ jsxs24("div", { className: "grid", children: [
|
|
3425
|
+
hasStrapline && /* @__PURE__ */ jsx37("span", { className: "caption text-secondary", children: strapline }),
|
|
3426
|
+
/* @__PURE__ */ jsx37("h4", { className: "paragraph-md text-primary", children: title }),
|
|
3427
|
+
hasDescription && /* @__PURE__ */ jsx37("p", { className: "paragraph-sm text-primary", children: description })
|
|
3371
3428
|
] })
|
|
3372
3429
|
]
|
|
3373
3430
|
}
|
|
@@ -3379,7 +3436,7 @@ var Tooltip = (props) => {
|
|
|
3379
3436
|
Tooltip.displayName = "Tooltip";
|
|
3380
3437
|
|
|
3381
3438
|
// src/components/Inputs/Slider.tsx
|
|
3382
|
-
import { Fragment, jsx as
|
|
3439
|
+
import { Fragment, jsx as jsx38, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
3383
3440
|
var wrapperBase = "flex flex-col gap-2 items-start";
|
|
3384
3441
|
var isRangeProps = (props) => {
|
|
3385
3442
|
return Array.isArray(props.value) || Array.isArray(props.defaultValue);
|
|
@@ -3388,7 +3445,7 @@ var toArray = (value) => {
|
|
|
3388
3445
|
if (value === void 0) return void 0;
|
|
3389
3446
|
return Array.isArray(value) ? value : [value];
|
|
3390
3447
|
};
|
|
3391
|
-
var Slider =
|
|
3448
|
+
var Slider = React36.forwardRef((props, forwardedRef) => {
|
|
3392
3449
|
const {
|
|
3393
3450
|
name,
|
|
3394
3451
|
display = "flat",
|
|
@@ -3406,7 +3463,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3406
3463
|
const isRange = isRangeProps(props);
|
|
3407
3464
|
const isControlled = value !== void 0;
|
|
3408
3465
|
const expectedLength = isRange ? 2 : 1;
|
|
3409
|
-
const normalizeArray =
|
|
3466
|
+
const normalizeArray = React36.useCallback(
|
|
3410
3467
|
(arr, fallback) => {
|
|
3411
3468
|
if (!arr || arr.length === 0) return fallback;
|
|
3412
3469
|
if (arr.length === expectedLength) return arr;
|
|
@@ -3418,16 +3475,16 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3418
3475
|
},
|
|
3419
3476
|
[expectedLength, max]
|
|
3420
3477
|
);
|
|
3421
|
-
const defaultInternal =
|
|
3478
|
+
const defaultInternal = React36.useMemo(() => {
|
|
3422
3479
|
const defaultValueArray = toArray(defaultValue);
|
|
3423
3480
|
if (defaultValueArray) return normalizeArray(defaultValueArray, []);
|
|
3424
3481
|
if (isRange) return [min, Math.min(min + (max - min) / 4, max)];
|
|
3425
3482
|
return [min + (max - min) / 3];
|
|
3426
3483
|
}, [defaultValue, min, max, isRange, normalizeArray]);
|
|
3427
|
-
const [internalValue, setInternalValue] =
|
|
3484
|
+
const [internalValue, setInternalValue] = React36.useState(
|
|
3428
3485
|
() => normalizeArray(isControlled ? toArray(value) : defaultInternal, defaultInternal)
|
|
3429
3486
|
);
|
|
3430
|
-
|
|
3487
|
+
React36.useEffect(() => {
|
|
3431
3488
|
if (isControlled) {
|
|
3432
3489
|
setInternalValue(
|
|
3433
3490
|
(current2) => normalizeArray(toArray(value), current2.length ? current2 : defaultInternal)
|
|
@@ -3435,16 +3492,16 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3435
3492
|
}
|
|
3436
3493
|
}, [isControlled, value, normalizeArray, defaultInternal]);
|
|
3437
3494
|
const current = internalValue;
|
|
3438
|
-
const trackRef =
|
|
3439
|
-
const [draggingThumbIndex, setDraggingThumbIndex] =
|
|
3440
|
-
const [hoveredThumbIndex, setHoveredThumbIndex] =
|
|
3441
|
-
const [focusedThumbIndex, setFocusedThumbIndex] =
|
|
3442
|
-
const clamp =
|
|
3495
|
+
const trackRef = React36.useRef(null);
|
|
3496
|
+
const [draggingThumbIndex, setDraggingThumbIndex] = React36.useState(null);
|
|
3497
|
+
const [hoveredThumbIndex, setHoveredThumbIndex] = React36.useState(null);
|
|
3498
|
+
const [focusedThumbIndex, setFocusedThumbIndex] = React36.useState(null);
|
|
3499
|
+
const clamp = React36.useCallback((val) => {
|
|
3443
3500
|
if (val < min) return min;
|
|
3444
3501
|
if (val > max) return max;
|
|
3445
3502
|
return val;
|
|
3446
3503
|
}, [min, max]);
|
|
3447
|
-
const enforceMinGap =
|
|
3504
|
+
const enforceMinGap = React36.useCallback((next, prev) => {
|
|
3448
3505
|
if (!isRange || next.length !== 2 || step <= 0) return next;
|
|
3449
3506
|
let [low, high] = next;
|
|
3450
3507
|
const [prevLow, prevHigh] = prev.length === 2 ? prev : next;
|
|
@@ -3468,7 +3525,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3468
3525
|
}
|
|
3469
3526
|
return [low, high];
|
|
3470
3527
|
}, [isRange, step, clamp]);
|
|
3471
|
-
|
|
3528
|
+
React36.useEffect(() => {
|
|
3472
3529
|
if (!isControlled) {
|
|
3473
3530
|
setInternalValue((prev) => {
|
|
3474
3531
|
const clamped = prev.map((v) => clamp(v));
|
|
@@ -3641,7 +3698,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3641
3698
|
const second = formatNumber(valueToPercent(secondary));
|
|
3642
3699
|
return `${first} - ${second}`;
|
|
3643
3700
|
}
|
|
3644
|
-
return /* @__PURE__ */
|
|
3701
|
+
return /* @__PURE__ */ jsxs25(Fragment, { children: [
|
|
3645
3702
|
formatDisplayNode(primary),
|
|
3646
3703
|
" - ",
|
|
3647
3704
|
formatDisplayNode(secondary)
|
|
@@ -3656,7 +3713,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3656
3713
|
const val = index === 0 ? primary : secondary;
|
|
3657
3714
|
const isDragging = draggingThumbIndex === index;
|
|
3658
3715
|
const isTooltipVisible = showTooltip && (hoveredThumbIndex === index || draggingThumbIndex === index || focusedThumbIndex === index);
|
|
3659
|
-
const handle = /* @__PURE__ */
|
|
3716
|
+
const handle = /* @__PURE__ */ jsx38(
|
|
3660
3717
|
"button",
|
|
3661
3718
|
{
|
|
3662
3719
|
type: "button",
|
|
@@ -3702,7 +3759,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3702
3759
|
index
|
|
3703
3760
|
);
|
|
3704
3761
|
if (!showTooltip) return handle;
|
|
3705
|
-
return /* @__PURE__ */
|
|
3762
|
+
return /* @__PURE__ */ jsx38(
|
|
3706
3763
|
Tooltip,
|
|
3707
3764
|
{
|
|
3708
3765
|
title: tooltipContent,
|
|
@@ -3715,15 +3772,15 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3715
3772
|
}
|
|
3716
3773
|
);
|
|
3717
3774
|
};
|
|
3718
|
-
return /* @__PURE__ */
|
|
3775
|
+
return /* @__PURE__ */ jsxs25(
|
|
3719
3776
|
"div",
|
|
3720
3777
|
{
|
|
3721
3778
|
className: wrapperBase,
|
|
3722
3779
|
style: { marginInline: `${thumbRadius}px` },
|
|
3723
3780
|
ref: forwardedRef,
|
|
3724
3781
|
children: [
|
|
3725
|
-
name && /* @__PURE__ */
|
|
3726
|
-
/* @__PURE__ */
|
|
3782
|
+
name && /* @__PURE__ */ jsxs25(Fragment, { children: [
|
|
3783
|
+
/* @__PURE__ */ jsx38(
|
|
3727
3784
|
"input",
|
|
3728
3785
|
{
|
|
3729
3786
|
type: "hidden",
|
|
@@ -3732,7 +3789,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3732
3789
|
disabled
|
|
3733
3790
|
}
|
|
3734
3791
|
),
|
|
3735
|
-
isRange && secondary !== void 0 && /* @__PURE__ */
|
|
3792
|
+
isRange && secondary !== void 0 && /* @__PURE__ */ jsx38(
|
|
3736
3793
|
"input",
|
|
3737
3794
|
{
|
|
3738
3795
|
type: "hidden",
|
|
@@ -3742,8 +3799,8 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3742
3799
|
}
|
|
3743
3800
|
)
|
|
3744
3801
|
] }),
|
|
3745
|
-
/* @__PURE__ */
|
|
3746
|
-
/* @__PURE__ */
|
|
3802
|
+
/* @__PURE__ */ jsxs25("div", { className: cn("w-full flex flex-col gap-1", className), children: [
|
|
3803
|
+
/* @__PURE__ */ jsx38("div", { className: "relative w-full", children: /* @__PURE__ */ jsxs25(
|
|
3747
3804
|
"div",
|
|
3748
3805
|
{
|
|
3749
3806
|
className: cn(
|
|
@@ -3754,7 +3811,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3754
3811
|
ref: trackRef,
|
|
3755
3812
|
onPointerDown: handleTrackPointerDown,
|
|
3756
3813
|
children: [
|
|
3757
|
-
/* @__PURE__ */
|
|
3814
|
+
/* @__PURE__ */ jsx38(
|
|
3758
3815
|
"div",
|
|
3759
3816
|
{
|
|
3760
3817
|
className: cn(
|
|
@@ -3782,7 +3839,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3782
3839
|
]
|
|
3783
3840
|
}
|
|
3784
3841
|
) }),
|
|
3785
|
-
showNumeric && /* @__PURE__ */
|
|
3842
|
+
showNumeric && /* @__PURE__ */ jsx38(
|
|
3786
3843
|
"p",
|
|
3787
3844
|
{
|
|
3788
3845
|
className: cn(
|
|
@@ -3800,10 +3857,10 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3800
3857
|
Slider.displayName = "Slider";
|
|
3801
3858
|
|
|
3802
3859
|
// src/components/Inputs/TextArea.tsx
|
|
3803
|
-
import * as
|
|
3860
|
+
import * as React37 from "react";
|
|
3804
3861
|
import { MaximizeIcon } from "@bubo-squared/icons";
|
|
3805
|
-
import { jsx as
|
|
3806
|
-
var TextArea =
|
|
3862
|
+
import { jsx as jsx39, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3863
|
+
var TextArea = React37.forwardRef((props, forwardedRef) => {
|
|
3807
3864
|
const {
|
|
3808
3865
|
label,
|
|
3809
3866
|
hint,
|
|
@@ -3822,7 +3879,7 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3822
3879
|
...textareaProps
|
|
3823
3880
|
} = props;
|
|
3824
3881
|
const isControlled = value !== void 0;
|
|
3825
|
-
const [internalValue, setInternalValue] =
|
|
3882
|
+
const [internalValue, setInternalValue] = React37.useState(
|
|
3826
3883
|
defaultValue ?? ""
|
|
3827
3884
|
);
|
|
3828
3885
|
const currentValue = (isControlled ? value : internalValue) ?? "";
|
|
@@ -3830,9 +3887,9 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3830
3887
|
const currentLength = currentValue.length;
|
|
3831
3888
|
const effectiveMaxLength = type === "character-limit" ? maxLength ?? 144 : void 0;
|
|
3832
3889
|
const showCharacterLimit = type === "character-limit" && typeof effectiveMaxLength === "number";
|
|
3833
|
-
const textareaRef =
|
|
3834
|
-
const containerRef =
|
|
3835
|
-
const setTextareaRef =
|
|
3890
|
+
const textareaRef = React37.useRef(null);
|
|
3891
|
+
const containerRef = React37.useRef(null);
|
|
3892
|
+
const setTextareaRef = React37.useCallback(
|
|
3836
3893
|
(node) => {
|
|
3837
3894
|
textareaRef.current = node;
|
|
3838
3895
|
if (!forwardedRef) return;
|
|
@@ -3844,8 +3901,8 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3844
3901
|
},
|
|
3845
3902
|
[forwardedRef]
|
|
3846
3903
|
);
|
|
3847
|
-
const [height, setHeight] =
|
|
3848
|
-
const [width, setWidth] =
|
|
3904
|
+
const [height, setHeight] = React37.useState(void 0);
|
|
3905
|
+
const [width, setWidth] = React37.useState(void 0);
|
|
3849
3906
|
const minHeight = 80;
|
|
3850
3907
|
const minWidth = 240;
|
|
3851
3908
|
const handleContainerClick = () => {
|
|
@@ -3858,7 +3915,7 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3858
3915
|
}
|
|
3859
3916
|
onChange?.(event);
|
|
3860
3917
|
};
|
|
3861
|
-
const generatedId =
|
|
3918
|
+
const generatedId = React37.useId();
|
|
3862
3919
|
const textareaId = id ?? generatedId;
|
|
3863
3920
|
const statusBorderClass = {
|
|
3864
3921
|
default: "",
|
|
@@ -3895,7 +3952,7 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3895
3952
|
window.addEventListener("pointermove", handlePointerMove);
|
|
3896
3953
|
window.addEventListener("pointerup", handlePointerUp);
|
|
3897
3954
|
};
|
|
3898
|
-
return /* @__PURE__ */
|
|
3955
|
+
return /* @__PURE__ */ jsx39(
|
|
3899
3956
|
Field,
|
|
3900
3957
|
{
|
|
3901
3958
|
className: "w-full",
|
|
@@ -3904,7 +3961,7 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3904
3961
|
hideHint,
|
|
3905
3962
|
status,
|
|
3906
3963
|
disabled,
|
|
3907
|
-
children: /* @__PURE__ */
|
|
3964
|
+
children: /* @__PURE__ */ jsxs26(
|
|
3908
3965
|
"div",
|
|
3909
3966
|
{
|
|
3910
3967
|
className: cn(
|
|
@@ -3923,7 +3980,7 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3923
3980
|
onClick: handleContainerClick,
|
|
3924
3981
|
"aria-disabled": disabled || void 0,
|
|
3925
3982
|
children: [
|
|
3926
|
-
/* @__PURE__ */
|
|
3983
|
+
/* @__PURE__ */ jsx39(
|
|
3927
3984
|
"textarea",
|
|
3928
3985
|
{
|
|
3929
3986
|
id: textareaId,
|
|
@@ -3943,7 +4000,7 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3943
4000
|
...textareaProps
|
|
3944
4001
|
}
|
|
3945
4002
|
),
|
|
3946
|
-
showCharacterLimit && /* @__PURE__ */
|
|
4003
|
+
showCharacterLimit && /* @__PURE__ */ jsxs26(
|
|
3947
4004
|
"span",
|
|
3948
4005
|
{
|
|
3949
4006
|
className: cn(
|
|
@@ -3957,19 +4014,19 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3957
4014
|
]
|
|
3958
4015
|
}
|
|
3959
4016
|
),
|
|
3960
|
-
type === "responsive" && /* @__PURE__ */
|
|
4017
|
+
type === "responsive" && /* @__PURE__ */ jsx39(
|
|
3961
4018
|
"div",
|
|
3962
4019
|
{
|
|
3963
4020
|
className: "absolute bottom-1 right-1 h-3 w-3 " + (disabled ? "cursor-auto" : "cursor-nwse-resize"),
|
|
3964
4021
|
onPointerDown: disabled ? void 0 : handleResizePointerDown,
|
|
3965
|
-
children: /* @__PURE__ */
|
|
4022
|
+
children: /* @__PURE__ */ jsx39(
|
|
3966
4023
|
"span",
|
|
3967
4024
|
{
|
|
3968
4025
|
className: cn(
|
|
3969
4026
|
"absolute bottom-0 right-0 flex h-4 w-4 items-center justify-center text-(--icon-primary)",
|
|
3970
4027
|
disabled && "text-(--icon-primary-disabled)"
|
|
3971
4028
|
),
|
|
3972
|
-
children: /* @__PURE__ */
|
|
4029
|
+
children: /* @__PURE__ */ jsx39(MaximizeIcon, {})
|
|
3973
4030
|
}
|
|
3974
4031
|
)
|
|
3975
4032
|
}
|
|
@@ -3983,9 +4040,9 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3983
4040
|
TextArea.displayName = "TextArea";
|
|
3984
4041
|
|
|
3985
4042
|
// src/components/Inputs/TextInput.tsx
|
|
3986
|
-
import * as
|
|
4043
|
+
import * as React38 from "react";
|
|
3987
4044
|
import { cva as cva20 } from "class-variance-authority";
|
|
3988
|
-
import { jsx as
|
|
4045
|
+
import { jsx as jsx40, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3989
4046
|
var inputTextVariants3 = cva20("truncate", {
|
|
3990
4047
|
variants: {
|
|
3991
4048
|
size: {
|
|
@@ -4018,7 +4075,7 @@ var iconWrapperVariants4 = cva20(
|
|
|
4018
4075
|
}
|
|
4019
4076
|
}
|
|
4020
4077
|
);
|
|
4021
|
-
var TextInput =
|
|
4078
|
+
var TextInput = React38.forwardRef((props, forwardedRef) => {
|
|
4022
4079
|
const {
|
|
4023
4080
|
label,
|
|
4024
4081
|
hint,
|
|
@@ -4036,12 +4093,12 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4036
4093
|
...inputProps
|
|
4037
4094
|
} = props;
|
|
4038
4095
|
const isControlled = value !== void 0;
|
|
4039
|
-
const [internalValue, setInternalValue] =
|
|
4096
|
+
const [internalValue, setInternalValue] = React38.useState(
|
|
4040
4097
|
defaultValue ?? ""
|
|
4041
4098
|
);
|
|
4042
4099
|
const currentValue = (isControlled ? value : internalValue) ?? "";
|
|
4043
|
-
const inputRef =
|
|
4044
|
-
const setInputRef =
|
|
4100
|
+
const inputRef = React38.useRef(null);
|
|
4101
|
+
const setInputRef = React38.useCallback(
|
|
4045
4102
|
(node) => {
|
|
4046
4103
|
inputRef.current = node;
|
|
4047
4104
|
if (!forwardedRef) return;
|
|
@@ -4065,7 +4122,7 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4065
4122
|
};
|
|
4066
4123
|
const showLeadingIcon = !!leadingIcon;
|
|
4067
4124
|
const showTrailingIcon = !!trailingIcon;
|
|
4068
|
-
return /* @__PURE__ */
|
|
4125
|
+
return /* @__PURE__ */ jsx40(
|
|
4069
4126
|
Field,
|
|
4070
4127
|
{
|
|
4071
4128
|
label,
|
|
@@ -4073,7 +4130,7 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4073
4130
|
hideHint,
|
|
4074
4131
|
status,
|
|
4075
4132
|
disabled,
|
|
4076
|
-
children: /* @__PURE__ */
|
|
4133
|
+
children: /* @__PURE__ */ jsxs27(
|
|
4077
4134
|
InputShell,
|
|
4078
4135
|
{
|
|
4079
4136
|
size,
|
|
@@ -4082,7 +4139,7 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4082
4139
|
className,
|
|
4083
4140
|
onClick: handleContainerClick,
|
|
4084
4141
|
children: [
|
|
4085
|
-
showLeadingIcon && /* @__PURE__ */
|
|
4142
|
+
showLeadingIcon && /* @__PURE__ */ jsx40(
|
|
4086
4143
|
"span",
|
|
4087
4144
|
{
|
|
4088
4145
|
className: cn(
|
|
@@ -4091,7 +4148,7 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4091
4148
|
children: leadingIcon
|
|
4092
4149
|
}
|
|
4093
4150
|
),
|
|
4094
|
-
/* @__PURE__ */
|
|
4151
|
+
/* @__PURE__ */ jsx40(
|
|
4095
4152
|
Input,
|
|
4096
4153
|
{
|
|
4097
4154
|
ref: setInputRef,
|
|
@@ -4109,7 +4166,7 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4109
4166
|
...inputProps
|
|
4110
4167
|
}
|
|
4111
4168
|
),
|
|
4112
|
-
showTrailingIcon && /* @__PURE__ */
|
|
4169
|
+
showTrailingIcon && /* @__PURE__ */ jsx40(
|
|
4113
4170
|
"span",
|
|
4114
4171
|
{
|
|
4115
4172
|
className: cn(
|
|
@@ -4127,11 +4184,11 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4127
4184
|
TextInput.displayName = "TextInput";
|
|
4128
4185
|
|
|
4129
4186
|
// src/components/Inputs/Toggle.tsx
|
|
4130
|
-
import * as
|
|
4131
|
-
import { jsx as
|
|
4132
|
-
var Toggle =
|
|
4187
|
+
import * as React39 from "react";
|
|
4188
|
+
import { jsx as jsx41, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
4189
|
+
var Toggle = React39.forwardRef((props, forwardedRef) => {
|
|
4133
4190
|
const { label, className, disabled, ...inputProps } = props;
|
|
4134
|
-
return /* @__PURE__ */
|
|
4191
|
+
return /* @__PURE__ */ jsxs28(
|
|
4135
4192
|
"label",
|
|
4136
4193
|
{
|
|
4137
4194
|
className: cn(
|
|
@@ -4139,8 +4196,8 @@ var Toggle = React38.forwardRef((props, forwardedRef) => {
|
|
|
4139
4196
|
disabled ? "cursor-default" : "cursor-pointer"
|
|
4140
4197
|
),
|
|
4141
4198
|
children: [
|
|
4142
|
-
/* @__PURE__ */
|
|
4143
|
-
/* @__PURE__ */
|
|
4199
|
+
/* @__PURE__ */ jsxs28("span", { className: "relative inline-flex items-center", children: [
|
|
4200
|
+
/* @__PURE__ */ jsx41(
|
|
4144
4201
|
"input",
|
|
4145
4202
|
{
|
|
4146
4203
|
ref: forwardedRef,
|
|
@@ -4150,7 +4207,7 @@ var Toggle = React38.forwardRef((props, forwardedRef) => {
|
|
|
4150
4207
|
...inputProps
|
|
4151
4208
|
}
|
|
4152
4209
|
),
|
|
4153
|
-
/* @__PURE__ */
|
|
4210
|
+
/* @__PURE__ */ jsx41(
|
|
4154
4211
|
"span",
|
|
4155
4212
|
{
|
|
4156
4213
|
className: cn(
|
|
@@ -4190,7 +4247,7 @@ var Toggle = React38.forwardRef((props, forwardedRef) => {
|
|
|
4190
4247
|
"peer-disabled:[&>.knob]:peer-checked:bg-(--background-primary-hover)",
|
|
4191
4248
|
className
|
|
4192
4249
|
),
|
|
4193
|
-
children: /* @__PURE__ */
|
|
4250
|
+
children: /* @__PURE__ */ jsx41(
|
|
4194
4251
|
"span",
|
|
4195
4252
|
{
|
|
4196
4253
|
className: cn(
|
|
@@ -4202,7 +4259,7 @@ var Toggle = React38.forwardRef((props, forwardedRef) => {
|
|
|
4202
4259
|
}
|
|
4203
4260
|
)
|
|
4204
4261
|
] }),
|
|
4205
|
-
label && /* @__PURE__ */
|
|
4262
|
+
label && /* @__PURE__ */ jsx41(
|
|
4206
4263
|
"span",
|
|
4207
4264
|
{
|
|
4208
4265
|
className: cn(
|
|
@@ -4219,9 +4276,9 @@ var Toggle = React38.forwardRef((props, forwardedRef) => {
|
|
|
4219
4276
|
Toggle.displayName = "Toggle";
|
|
4220
4277
|
|
|
4221
4278
|
// src/components/Inputs/WebsiteInput.tsx
|
|
4222
|
-
import * as
|
|
4223
|
-
import { jsx as
|
|
4224
|
-
var WebsiteInput =
|
|
4279
|
+
import * as React40 from "react";
|
|
4280
|
+
import { jsx as jsx42, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
4281
|
+
var WebsiteInput = React40.forwardRef((props, forwardedRef) => {
|
|
4225
4282
|
const {
|
|
4226
4283
|
hierarchy = "leading",
|
|
4227
4284
|
protocolLabel = "http://",
|
|
@@ -4257,15 +4314,15 @@ var WebsiteInput = React39.forwardRef((props, forwardedRef) => {
|
|
|
4257
4314
|
size === "xl" ? "[&>svg]:w-6 [&>svg]:h-6" : size === "sm" ? "[&>svg]:w-4 [&>svg]:h-4" : "[&>svg]:w-5 [&>svg]:h-5",
|
|
4258
4315
|
disabled ? "text-(--icon-primary-disabled)" : "text-(--icon-primary) group-hover:text-(--icon-primary-hover) group-focus-within:text-(--icon-primary-focus)"
|
|
4259
4316
|
);
|
|
4260
|
-
const leadingAddon = /* @__PURE__ */
|
|
4261
|
-
/* @__PURE__ */
|
|
4262
|
-
icon != null && /* @__PURE__ */
|
|
4317
|
+
const leadingAddon = /* @__PURE__ */ jsxs29("div", { className: baseAddonClass, children: [
|
|
4318
|
+
/* @__PURE__ */ jsx42("div", { className: addonTextClass, children: protocolLabel }),
|
|
4319
|
+
icon != null && /* @__PURE__ */ jsx42("span", { className: iconWrapperClass, children: icon })
|
|
4263
4320
|
] });
|
|
4264
|
-
const trailingAddon = /* @__PURE__ */
|
|
4265
|
-
icon != null && /* @__PURE__ */
|
|
4266
|
-
/* @__PURE__ */
|
|
4321
|
+
const trailingAddon = /* @__PURE__ */ jsxs29("div", { className: baseAddonClass, children: [
|
|
4322
|
+
icon != null && /* @__PURE__ */ jsx42("span", { className: iconWrapperClass, children: icon }),
|
|
4323
|
+
/* @__PURE__ */ jsx42("div", { className: addonTextClass, children: protocolLabel })
|
|
4267
4324
|
] });
|
|
4268
|
-
return /* @__PURE__ */
|
|
4325
|
+
return /* @__PURE__ */ jsx42(
|
|
4269
4326
|
TextInput,
|
|
4270
4327
|
{
|
|
4271
4328
|
ref: forwardedRef,
|
|
@@ -4281,9 +4338,9 @@ var WebsiteInput = React39.forwardRef((props, forwardedRef) => {
|
|
|
4281
4338
|
WebsiteInput.displayName = "WebsiteInput";
|
|
4282
4339
|
|
|
4283
4340
|
// src/components/Feedback/Popover.tsx
|
|
4284
|
-
import * as
|
|
4341
|
+
import * as React41 from "react";
|
|
4285
4342
|
import * as PopoverPrimitive2 from "@radix-ui/react-popover";
|
|
4286
|
-
import { jsx as
|
|
4343
|
+
import { jsx as jsx43, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
4287
4344
|
var PopoverArrow = PopoverPrimitive2.Arrow;
|
|
4288
4345
|
var Popover2 = (props) => {
|
|
4289
4346
|
const {
|
|
@@ -4305,7 +4362,7 @@ var Popover2 = (props) => {
|
|
|
4305
4362
|
} = props;
|
|
4306
4363
|
const hasStrapline = typeof strapline === "string" ? strapline.trim() !== "" : strapline != null;
|
|
4307
4364
|
const hasDescription = typeof description === "string" ? description.trim() !== "" : description != null;
|
|
4308
|
-
const [open, setOpen] =
|
|
4365
|
+
const [open, setOpen] = React41.useState(false);
|
|
4309
4366
|
const handleOpenChange = (nextOpen) => {
|
|
4310
4367
|
setOpen(nextOpen);
|
|
4311
4368
|
onOpenChange?.(nextOpen);
|
|
@@ -4351,9 +4408,9 @@ var Popover2 = (props) => {
|
|
|
4351
4408
|
}
|
|
4352
4409
|
};
|
|
4353
4410
|
const { side, align } = mapPlacementToSideAndAlign2(placement);
|
|
4354
|
-
return /* @__PURE__ */
|
|
4355
|
-
/* @__PURE__ */
|
|
4356
|
-
/* @__PURE__ */
|
|
4411
|
+
return /* @__PURE__ */ jsxs30(Popover, { open, onOpenChange: handleOpenChange, children: [
|
|
4412
|
+
/* @__PURE__ */ jsx43(PopoverTrigger, { asChild: true, children }),
|
|
4413
|
+
/* @__PURE__ */ jsxs30(
|
|
4357
4414
|
PopoverContent,
|
|
4358
4415
|
{
|
|
4359
4416
|
side,
|
|
@@ -4362,16 +4419,16 @@ var Popover2 = (props) => {
|
|
|
4362
4419
|
className: cn(popoverClasses, className),
|
|
4363
4420
|
...rest,
|
|
4364
4421
|
children: [
|
|
4365
|
-
showArrow && /* @__PURE__ */
|
|
4366
|
-
customContent ? typeof customContent === "function" ? customContent({ close: () => handleOpenChange(false), ok: handleOk, cancel: handleCancel }) : customContent : /* @__PURE__ */
|
|
4367
|
-
/* @__PURE__ */
|
|
4368
|
-
hasStrapline && /* @__PURE__ */
|
|
4369
|
-
/* @__PURE__ */
|
|
4370
|
-
hasDescription && /* @__PURE__ */
|
|
4422
|
+
showArrow && /* @__PURE__ */ jsx43(PopoverArrow, { className: popoverArrowClasses }),
|
|
4423
|
+
customContent ? typeof customContent === "function" ? customContent({ close: () => handleOpenChange(false), ok: handleOk, cancel: handleCancel }) : customContent : /* @__PURE__ */ jsxs30("div", { className: "grid gap-4", children: [
|
|
4424
|
+
/* @__PURE__ */ jsxs30("div", { className: "space-y-2", children: [
|
|
4425
|
+
hasStrapline && /* @__PURE__ */ jsx43("span", { className: "caption text-secondary", children: strapline }),
|
|
4426
|
+
/* @__PURE__ */ jsx43("h4", { className: "subtitle-medium text-primary", children: title }),
|
|
4427
|
+
hasDescription && /* @__PURE__ */ jsx43("p", { className: "paragraph-sm text-primary", children: description })
|
|
4371
4428
|
] }),
|
|
4372
|
-
/* @__PURE__ */
|
|
4373
|
-
/* @__PURE__ */
|
|
4374
|
-
/* @__PURE__ */
|
|
4429
|
+
/* @__PURE__ */ jsxs30("div", { className: "flex justify-start items-center gap-4 flex-wrap", children: [
|
|
4430
|
+
/* @__PURE__ */ jsx43(Button2, { size: "sm", variant: "secondary", onClick: handleCancel, children: cancelText || "Cancel" }),
|
|
4431
|
+
/* @__PURE__ */ jsx43(Button2, { size: "sm", variant: "primary", onClick: handleOk, children: okText || "Ok" })
|
|
4375
4432
|
] })
|
|
4376
4433
|
] })
|
|
4377
4434
|
]
|
|
@@ -4384,7 +4441,7 @@ Popover2.displayName = "Popover";
|
|
|
4384
4441
|
// src/components/Feedback/TooltipProvider.tsx
|
|
4385
4442
|
import "react";
|
|
4386
4443
|
import * as TooltipPrimitive2 from "@radix-ui/react-tooltip";
|
|
4387
|
-
import { jsx as
|
|
4444
|
+
import { jsx as jsx44 } from "react/jsx-runtime";
|
|
4388
4445
|
var TooltipProvider = (props) => {
|
|
4389
4446
|
const {
|
|
4390
4447
|
children,
|
|
@@ -4392,7 +4449,7 @@ var TooltipProvider = (props) => {
|
|
|
4392
4449
|
skipDelayDuration = 300,
|
|
4393
4450
|
disableHoverableContent = false
|
|
4394
4451
|
} = props;
|
|
4395
|
-
return /* @__PURE__ */
|
|
4452
|
+
return /* @__PURE__ */ jsx44(
|
|
4396
4453
|
TooltipPrimitive2.Provider,
|
|
4397
4454
|
{
|
|
4398
4455
|
delayDuration,
|
|
@@ -4405,19 +4462,19 @@ var TooltipProvider = (props) => {
|
|
|
4405
4462
|
TooltipProvider.displayName = "TooltipProvider";
|
|
4406
4463
|
|
|
4407
4464
|
// src/components/Navigation/Breadcrumbs.tsx
|
|
4408
|
-
import * as
|
|
4465
|
+
import * as React44 from "react";
|
|
4409
4466
|
|
|
4410
4467
|
// src/components/ui/breadcrumb.tsx
|
|
4411
4468
|
import "react";
|
|
4412
4469
|
import { Slot as Slot6 } from "@radix-ui/react-slot";
|
|
4413
|
-
import { jsx as
|
|
4470
|
+
import { jsx as jsx45 } from "react/jsx-runtime";
|
|
4414
4471
|
var breadcrumbItemClasses = "inline-flex items-center gap-1.5 text-(--color-secondary) hover:text-(--color-primary-hover) focus-within:text-(--color-secondary-focus) [&_[aria-current=page]]:font-medium [&_[aria-current=page]]:text-primary";
|
|
4415
4472
|
var disabledItemClasses = "text-primary-disabled cursor-default pointer-events-none";
|
|
4416
4473
|
function Breadcrumb({ ...props }) {
|
|
4417
|
-
return /* @__PURE__ */
|
|
4474
|
+
return /* @__PURE__ */ jsx45("nav", { "aria-label": "breadcrumb", "data-slot": "breadcrumb", ...props });
|
|
4418
4475
|
}
|
|
4419
4476
|
function BreadcrumbList({ className, ...props }) {
|
|
4420
|
-
return /* @__PURE__ */
|
|
4477
|
+
return /* @__PURE__ */ jsx45(
|
|
4421
4478
|
"ol",
|
|
4422
4479
|
{
|
|
4423
4480
|
"data-slot": "breadcrumb-list",
|
|
@@ -4430,7 +4487,7 @@ function BreadcrumbList({ className, ...props }) {
|
|
|
4430
4487
|
);
|
|
4431
4488
|
}
|
|
4432
4489
|
function BreadcrumbItem({ className, disabled, ...props }) {
|
|
4433
|
-
return /* @__PURE__ */
|
|
4490
|
+
return /* @__PURE__ */ jsx45(
|
|
4434
4491
|
"li",
|
|
4435
4492
|
{
|
|
4436
4493
|
"data-slot": "breadcrumb-item",
|
|
@@ -4440,7 +4497,7 @@ function BreadcrumbItem({ className, disabled, ...props }) {
|
|
|
4440
4497
|
);
|
|
4441
4498
|
}
|
|
4442
4499
|
function BreadcrumbPage({ className, ...props }) {
|
|
4443
|
-
return /* @__PURE__ */
|
|
4500
|
+
return /* @__PURE__ */ jsx45(
|
|
4444
4501
|
"span",
|
|
4445
4502
|
{
|
|
4446
4503
|
"data-slot": "breadcrumb-page",
|
|
@@ -4457,7 +4514,7 @@ function BreadcrumbSeparator({
|
|
|
4457
4514
|
className,
|
|
4458
4515
|
...props
|
|
4459
4516
|
}) {
|
|
4460
|
-
return /* @__PURE__ */
|
|
4517
|
+
return /* @__PURE__ */ jsx45(
|
|
4461
4518
|
"li",
|
|
4462
4519
|
{
|
|
4463
4520
|
"data-slot": "breadcrumb-separator",
|
|
@@ -4465,15 +4522,15 @@ function BreadcrumbSeparator({
|
|
|
4465
4522
|
"aria-hidden": "true",
|
|
4466
4523
|
className: cn("text-secondary", className),
|
|
4467
4524
|
...props,
|
|
4468
|
-
children: children ?? /* @__PURE__ */
|
|
4525
|
+
children: children ?? /* @__PURE__ */ jsx45(ChevronRight, {})
|
|
4469
4526
|
}
|
|
4470
4527
|
);
|
|
4471
4528
|
}
|
|
4472
4529
|
|
|
4473
4530
|
// src/components/Navigation/Breadcrumbs.tsx
|
|
4474
4531
|
import { MoreHorizFullIcon } from "@bubo-squared/icons";
|
|
4475
|
-
import { jsx as
|
|
4476
|
-
var Breadcrumbs =
|
|
4532
|
+
import { jsx as jsx46, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
4533
|
+
var Breadcrumbs = React44.forwardRef(
|
|
4477
4534
|
(props, ref) => {
|
|
4478
4535
|
const {
|
|
4479
4536
|
separator,
|
|
@@ -4492,17 +4549,17 @@ var Breadcrumbs = React43.forwardRef(
|
|
|
4492
4549
|
ellipsisAriaLabel = "Open breadcrumb menu",
|
|
4493
4550
|
...rest
|
|
4494
4551
|
} = props;
|
|
4495
|
-
const items =
|
|
4552
|
+
const items = React44.Children.toArray(children).filter(Boolean);
|
|
4496
4553
|
const shouldCollapse = Boolean(ellipsis) && items.length >= 5;
|
|
4497
4554
|
const hiddenItems = shouldCollapse ? items.slice(1, -2) : [];
|
|
4498
4555
|
const displayItems = shouldCollapse ? [items[0], "__ELLIPSIS__", items[items.length - 2], items[items.length - 1]] : items;
|
|
4499
|
-
return /* @__PURE__ */
|
|
4556
|
+
return /* @__PURE__ */ jsx46(Breadcrumb, { ref, className: cn("mb-1.75", className), ...rest, children: /* @__PURE__ */ jsx46(BreadcrumbList, { className: breadcrumbListClassName, children: displayItems.map((child, index) => {
|
|
4500
4557
|
const isEllipsis = child === "__ELLIPSIS__";
|
|
4501
|
-
const key = isEllipsis ? "__ellipsis" :
|
|
4558
|
+
const key = isEllipsis ? "__ellipsis" : React44.isValidElement(child) && child.key != null ? String(child.key) : String(index);
|
|
4502
4559
|
const isLast = index === displayItems.length - 1;
|
|
4503
|
-
return /* @__PURE__ */
|
|
4504
|
-
isEllipsis ? /* @__PURE__ */
|
|
4505
|
-
/* @__PURE__ */
|
|
4560
|
+
return /* @__PURE__ */ jsxs31(React44.Fragment, { children: [
|
|
4561
|
+
isEllipsis ? /* @__PURE__ */ jsx46(BreadcrumbItem, { className: cn(breadcrumbItemClassName, ellipsisItemClassName), children: /* @__PURE__ */ jsxs31(DropdownMenu, { children: [
|
|
4562
|
+
/* @__PURE__ */ jsx46(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx46(
|
|
4506
4563
|
Button,
|
|
4507
4564
|
{
|
|
4508
4565
|
variant: "ghost",
|
|
@@ -4514,18 +4571,18 @@ var Breadcrumbs = React43.forwardRef(
|
|
|
4514
4571
|
"data-slot": "breadcrumb-ellipsis",
|
|
4515
4572
|
role: "presentation",
|
|
4516
4573
|
"aria-hidden": "true",
|
|
4517
|
-
children: /* @__PURE__ */
|
|
4574
|
+
children: /* @__PURE__ */ jsx46(MoreHorizFullIcon, {})
|
|
4518
4575
|
}
|
|
4519
4576
|
) }),
|
|
4520
|
-
/* @__PURE__ */
|
|
4577
|
+
/* @__PURE__ */ jsx46(
|
|
4521
4578
|
DropdownMenuContent,
|
|
4522
4579
|
{
|
|
4523
4580
|
align: "start",
|
|
4524
4581
|
className: ellipsisContentClassName,
|
|
4525
|
-
children: /* @__PURE__ */
|
|
4526
|
-
const hiddenKey =
|
|
4527
|
-
if (
|
|
4528
|
-
return /* @__PURE__ */
|
|
4582
|
+
children: /* @__PURE__ */ jsx46(DropdownMenuGroup, { className: ellipsisGroupClassName, children: hiddenItems.map((hidden, hiddenIndex) => {
|
|
4583
|
+
const hiddenKey = React44.isValidElement(hidden) && hidden.key != null ? String(hidden.key) : `hidden-${hiddenIndex}`;
|
|
4584
|
+
if (React44.isValidElement(hidden)) {
|
|
4585
|
+
return /* @__PURE__ */ jsx46(
|
|
4529
4586
|
DropdownMenuItem,
|
|
4530
4587
|
{
|
|
4531
4588
|
asChild: true,
|
|
@@ -4535,7 +4592,7 @@ var Breadcrumbs = React43.forwardRef(
|
|
|
4535
4592
|
hiddenKey
|
|
4536
4593
|
);
|
|
4537
4594
|
}
|
|
4538
|
-
return /* @__PURE__ */
|
|
4595
|
+
return /* @__PURE__ */ jsx46(
|
|
4539
4596
|
DropdownMenuItem,
|
|
4540
4597
|
{
|
|
4541
4598
|
className: ellipsisMenuItemClassName,
|
|
@@ -4546,8 +4603,8 @@ var Breadcrumbs = React43.forwardRef(
|
|
|
4546
4603
|
}) })
|
|
4547
4604
|
}
|
|
4548
4605
|
)
|
|
4549
|
-
] }) }) : isLast ? /* @__PURE__ */
|
|
4550
|
-
!isLast && /* @__PURE__ */
|
|
4606
|
+
] }) }) : isLast ? /* @__PURE__ */ jsx46(BreadcrumbItem, { className: breadcrumbItemClassName, children: /* @__PURE__ */ jsx46(BreadcrumbPage, { className: breadcrumbPageClassName, children: child }) }) : /* @__PURE__ */ jsx46(BreadcrumbItem, { className: breadcrumbItemClassName, children: child }),
|
|
4607
|
+
!isLast && /* @__PURE__ */ jsx46(BreadcrumbSeparator, { className: separatorClassName, children: separator })
|
|
4551
4608
|
] }, key);
|
|
4552
4609
|
}) }) });
|
|
4553
4610
|
}
|
|
@@ -4556,13 +4613,13 @@ Breadcrumbs.displayName = "Breadcrumbs";
|
|
|
4556
4613
|
|
|
4557
4614
|
// src/components/Logo/LogoIcon.tsx
|
|
4558
4615
|
import { cva as cva21 } from "class-variance-authority";
|
|
4559
|
-
import { jsx as
|
|
4560
|
-
var LogoIconSvg = (props) => /* @__PURE__ */
|
|
4561
|
-
/* @__PURE__ */
|
|
4562
|
-
/* @__PURE__ */
|
|
4563
|
-
/* @__PURE__ */
|
|
4564
|
-
/* @__PURE__ */
|
|
4565
|
-
/* @__PURE__ */
|
|
4616
|
+
import { jsx as jsx47, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
4617
|
+
var LogoIconSvg = (props) => /* @__PURE__ */ jsxs32("svg", { width: "89", height: "88", viewBox: "0 0 89 88", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
|
|
4618
|
+
/* @__PURE__ */ jsx47("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M83.7156 3.88535C78.5352 -1.29512 70.136 -1.29512 64.9555 3.88535L43.9999 24.8409L43.9995 24.8405L62.3536 6.48637C52.2379 16.5949 35.8584 16.6179 25.7142 6.55523L23.4434 4.28438C18.2629 -0.896082 9.86373 -0.89608 4.68327 4.28438C-0.497191 9.46484 -0.49719 17.864 4.68327 23.0445L6.88526 25.2465C17.0191 35.3875 17.0168 51.8235 6.87859 61.9618L25.2395 43.6008L25.2398 43.601L3.88534 64.9555C-1.29512 70.136 -1.29511 78.5351 3.88535 83.7156C9.06581 88.8961 17.465 88.8961 22.6455 83.7156L25.6458 80.7151L25.6864 80.6747C35.7981 70.6137 52.1313 70.597 62.2636 80.6248L65.7534 84.1146C70.9339 89.2951 79.3331 89.2951 84.5135 84.1146C89.694 78.9342 89.694 70.535 84.5135 65.3545L62.76 43.601L62.7602 43.6009L81.1144 61.9552C70.9806 51.8142 70.9829 35.3782 81.1211 25.24L83.7156 22.6455C88.8961 17.465 88.8961 9.06581 83.7156 3.88535Z", fill: "#1685FF" }),
|
|
4619
|
+
/* @__PURE__ */ jsx47("path", { d: "M44.0667 50.4863C44.1213 50.4317 44.21 50.4317 44.2646 50.4863L48.6465 54.8682C48.6942 54.9158 48.7011 54.9907 48.663 55.0463L44.2812 61.4453C44.2256 61.5265 44.1057 61.5265 44.0501 61.4453L39.6683 55.0463C39.6302 54.9907 39.6371 54.9158 39.6848 54.8682L44.0667 50.4863Z", fill: "white" }),
|
|
4620
|
+
/* @__PURE__ */ jsx47("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M44.107 45.3938C44.0536 45.289 43.9013 45.289 43.8479 45.3938C41.8622 49.293 37.8104 51.9638 33.1347 51.9638C26.4991 51.9638 21.1199 46.5846 21.1199 39.9489C21.1199 33.3133 26.4991 27.9341 33.1347 27.9341C37.8104 27.9341 41.8622 30.6049 43.8479 34.5041C43.9013 34.6089 44.0536 34.6089 44.107 34.5041C46.0926 30.6049 50.1445 27.9341 54.8201 27.9341C61.4558 27.9341 66.835 33.3133 66.835 39.9489C66.835 46.5846 61.4558 51.9638 54.8201 51.9638C50.1445 51.9638 46.0926 49.293 44.107 45.3938Z", fill: "white" }),
|
|
4621
|
+
/* @__PURE__ */ jsx47("path", { d: "M60.1113 40.0006C60.1113 43.052 57.6377 45.5256 54.5863 45.5256C51.535 45.5256 49.0614 43.052 49.0614 40.0006C49.0614 36.9493 51.535 34.4757 54.5863 34.4757C57.6377 34.4757 60.1113 36.9493 60.1113 40.0006Z", fill: "#1685FF" }),
|
|
4622
|
+
/* @__PURE__ */ jsx47("path", { d: "M38.8954 40.0006C38.8954 43.052 36.4218 45.5256 33.3705 45.5256C30.3192 45.5256 27.8456 43.052 27.8456 40.0006C27.8456 36.9493 30.3192 34.4757 33.3705 34.4757C36.4218 34.4757 38.8954 36.9493 38.8954 40.0006Z", fill: "#1685FF" })
|
|
4566
4623
|
] });
|
|
4567
4624
|
var logoIconVariants = cva21(
|
|
4568
4625
|
"relative bg-linear-to-t from-gray-800 to-gray-950 overflow-hidden flex justify-center items-center",
|
|
@@ -4589,26 +4646,26 @@ var logoIconSizeClass = {
|
|
|
4589
4646
|
xl: "size-96"
|
|
4590
4647
|
};
|
|
4591
4648
|
var LogoIcon = ({ className, size = "md" }) => {
|
|
4592
|
-
return /* @__PURE__ */
|
|
4649
|
+
return /* @__PURE__ */ jsx47("div", { className: cn(logoIconVariants({ size }), className), children: /* @__PURE__ */ jsx47(LogoIconSvg, { className: logoIconSizeClass[size] }) });
|
|
4593
4650
|
};
|
|
4594
4651
|
|
|
4595
4652
|
// src/components/Logo/Logo.tsx
|
|
4596
4653
|
import { cva as cva22 } from "class-variance-authority";
|
|
4597
|
-
import { jsx as
|
|
4598
|
-
var LogoIconSvg2 = (props) => /* @__PURE__ */
|
|
4599
|
-
/* @__PURE__ */
|
|
4600
|
-
/* @__PURE__ */
|
|
4601
|
-
/* @__PURE__ */
|
|
4602
|
-
/* @__PURE__ */
|
|
4603
|
-
/* @__PURE__ */
|
|
4654
|
+
import { jsx as jsx48, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
4655
|
+
var LogoIconSvg2 = (props) => /* @__PURE__ */ jsxs33("svg", { width: "89", height: "88", viewBox: "0 0 89 88", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
|
|
4656
|
+
/* @__PURE__ */ jsx48("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M83.7156 3.88535C78.5352 -1.29512 70.136 -1.29512 64.9555 3.88535L43.9999 24.8409L43.9995 24.8405L62.3536 6.48637C52.2379 16.5949 35.8584 16.6179 25.7142 6.55523L23.4434 4.28438C18.2629 -0.896082 9.86373 -0.89608 4.68327 4.28438C-0.497191 9.46484 -0.49719 17.864 4.68327 23.0445L6.88526 25.2465C17.0191 35.3875 17.0168 51.8235 6.87859 61.9618L25.2395 43.6008L25.2398 43.601L3.88534 64.9555C-1.29512 70.136 -1.29511 78.5351 3.88535 83.7156C9.06581 88.8961 17.465 88.8961 22.6455 83.7156L25.6458 80.7151L25.6864 80.6747C35.7981 70.6137 52.1313 70.597 62.2636 80.6248L65.7534 84.1146C70.9339 89.2951 79.3331 89.2951 84.5135 84.1146C89.694 78.9342 89.694 70.535 84.5135 65.3545L62.76 43.601L62.7602 43.6009L81.1144 61.9552C70.9806 51.8142 70.9829 35.3782 81.1211 25.24L83.7156 22.6455C88.8961 17.465 88.8961 9.06581 83.7156 3.88535Z", fill: "#1685FF" }),
|
|
4657
|
+
/* @__PURE__ */ jsx48("path", { d: "M44.0667 50.4863C44.1213 50.4317 44.21 50.4317 44.2646 50.4863L48.6465 54.8682C48.6942 54.9158 48.7011 54.9907 48.663 55.0463L44.2812 61.4453C44.2256 61.5265 44.1057 61.5265 44.0501 61.4453L39.6683 55.0463C39.6302 54.9907 39.6371 54.9158 39.6848 54.8682L44.0667 50.4863Z", fill: "white" }),
|
|
4658
|
+
/* @__PURE__ */ jsx48("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M44.107 45.3938C44.0536 45.289 43.9013 45.289 43.8479 45.3938C41.8622 49.293 37.8104 51.9638 33.1347 51.9638C26.4991 51.9638 21.1199 46.5846 21.1199 39.9489C21.1199 33.3133 26.4991 27.9341 33.1347 27.9341C37.8104 27.9341 41.8622 30.6049 43.8479 34.5041C43.9013 34.6089 44.0536 34.6089 44.107 34.5041C46.0926 30.6049 50.1445 27.9341 54.8201 27.9341C61.4558 27.9341 66.835 33.3133 66.835 39.9489C66.835 46.5846 61.4558 51.9638 54.8201 51.9638C50.1445 51.9638 46.0926 49.293 44.107 45.3938Z", fill: "white" }),
|
|
4659
|
+
/* @__PURE__ */ jsx48("path", { d: "M60.1113 40.0006C60.1113 43.052 57.6377 45.5256 54.5863 45.5256C51.535 45.5256 49.0614 43.052 49.0614 40.0006C49.0614 36.9493 51.535 34.4757 54.5863 34.4757C57.6377 34.4757 60.1113 36.9493 60.1113 40.0006Z", fill: "#1685FF" }),
|
|
4660
|
+
/* @__PURE__ */ jsx48("path", { d: "M38.8954 40.0006C38.8954 43.052 36.4218 45.5256 33.3705 45.5256C30.3192 45.5256 27.8456 43.052 27.8456 40.0006C27.8456 36.9493 30.3192 34.4757 33.3705 34.4757C36.4218 34.4757 38.8954 36.9493 38.8954 40.0006Z", fill: "#1685FF" })
|
|
4604
4661
|
] });
|
|
4605
|
-
var LogoTextSvg = (props) => /* @__PURE__ */
|
|
4606
|
-
/* @__PURE__ */
|
|
4607
|
-
/* @__PURE__ */
|
|
4608
|
-
/* @__PURE__ */
|
|
4609
|
-
/* @__PURE__ */
|
|
4610
|
-
/* @__PURE__ */
|
|
4611
|
-
/* @__PURE__ */
|
|
4662
|
+
var LogoTextSvg = (props) => /* @__PURE__ */ jsxs33("svg", { width: "111", height: "32", viewBox: "0 0 111 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
|
|
4663
|
+
/* @__PURE__ */ jsx48("path", { d: "M72.7324 20.9658C72.7324 14.4559 77.4246 9.9751 83.8922 9.9751C90.3598 9.9751 95.052 14.4559 95.052 20.9658C95.052 27.4757 90.3598 31.9565 83.8922 31.9565C77.4246 31.9565 72.7324 27.4757 72.7324 20.9658ZM77.8896 20.9658C77.8896 24.7703 80.3414 27.3489 83.8922 27.3489C87.4431 27.3489 89.8948 24.7703 89.8948 20.9658C89.8948 17.1613 87.4431 14.5827 83.8922 14.5827C80.3414 14.5827 77.8896 17.1613 77.8896 20.9658Z", fill: "currentColor" }),
|
|
4664
|
+
/* @__PURE__ */ jsx48("path", { d: "M53.4056 31.4503H48.6289V0H53.7861V13.6116C55.1388 11.2866 57.9287 9.89163 61.0991 9.89163C67.0595 9.89163 70.6949 14.5415 70.6949 21.136C70.6949 27.5613 66.7636 31.9998 60.761 31.9998C57.6328 31.9998 54.9697 30.6049 53.7438 28.1954L53.4056 31.4503ZM53.8284 20.9246C53.8284 24.6868 56.1533 27.2654 59.7042 27.2654C63.3395 27.2654 65.4954 24.6445 65.4954 20.9246C65.4954 17.2047 63.3395 14.5415 59.7042 14.5415C56.1533 14.5415 53.8284 17.1624 53.8284 20.9246Z", fill: "currentColor" }),
|
|
4665
|
+
/* @__PURE__ */ jsx48("path", { d: "M38.9929 10.5681H44.15V31.4504H39.3733L38.9929 28.6605C37.7247 30.6473 35.0193 32 32.2293 32C27.4103 32 24.5781 28.745 24.5781 23.6301V10.5681H29.7353V21.8124C29.7353 25.786 31.2994 27.3923 34.1739 27.3923C37.4288 27.3923 38.9929 25.4901 38.9929 21.5165V10.5681Z", fill: "currentColor" }),
|
|
4666
|
+
/* @__PURE__ */ jsx48("path", { d: "M4.77673 31.4503H0V0H5.15718V13.6116C6.50988 11.2866 9.29983 9.89163 12.4702 9.89163C18.4306 9.89163 22.066 14.5415 22.066 21.136C22.066 27.5613 18.1347 31.9998 12.132 31.9998C9.00392 31.9998 6.34079 30.6049 5.1149 28.1954L4.77673 31.4503ZM5.19945 20.9246C5.19945 24.6868 7.52441 27.2654 11.0752 27.2654C14.7106 27.2654 16.8665 24.6445 16.8665 20.9246C16.8665 17.2047 14.7106 14.5415 11.0752 14.5415C7.52441 14.5415 5.19945 17.1624 5.19945 20.9246Z", fill: "currentColor" }),
|
|
4667
|
+
/* @__PURE__ */ jsx48("path", { d: "M103.555 0.5C107.084 0.5 109.944 3.36029 109.944 6.88867C109.944 10.4172 107.084 13.2773 103.555 13.2773C100.027 13.2772 97.1667 10.4171 97.1667 6.88867C97.1669 3.36036 100.027 0.500118 103.555 0.5Z", stroke: "currentColor" }),
|
|
4668
|
+
/* @__PURE__ */ jsx48("path", { d: "M105.778 9.98355L101.687 10.0001V9.00978L103.578 7.33457C104.19 6.79817 104.445 6.41856 104.445 5.91517C104.445 5.29625 104.159 4.96616 103.647 4.96616C103.113 4.96616 102.803 5.35402 102.803 6.03896H101.556C101.556 4.66908 102.377 3.77783 103.64 3.77783C104.949 3.77783 105.731 4.52879 105.731 5.83265C105.731 6.66613 105.259 7.34282 104.546 7.97825L103.686 8.74571H105.778V9.98355Z", fill: "currentColor" })
|
|
4612
4669
|
] });
|
|
4613
4670
|
var logoWrapperVariants = cva22("inline-flex", {
|
|
4614
4671
|
variants: {
|
|
@@ -4648,9 +4705,9 @@ var logoTextSizeVariants = cva22("", {
|
|
|
4648
4705
|
});
|
|
4649
4706
|
var Logo = ({ className, textColor, variant = "inline" }) => {
|
|
4650
4707
|
const textColorClass = textColor === "light" ? "text-(--color-b-white)" : textColor === "dark" ? "text-(--color-b-black)" : "text-primary";
|
|
4651
|
-
return /* @__PURE__ */
|
|
4652
|
-
/* @__PURE__ */
|
|
4653
|
-
/* @__PURE__ */
|
|
4708
|
+
return /* @__PURE__ */ jsxs33("div", { className: cn(logoWrapperVariants({ variant }), className), children: [
|
|
4709
|
+
/* @__PURE__ */ jsx48(LogoIconSvg2, { className: logoIconSizeVariants({ variant }) }),
|
|
4710
|
+
/* @__PURE__ */ jsx48(LogoTextSvg, { className: cn(logoTextSizeVariants({ variant }), textColorClass) })
|
|
4654
4711
|
] });
|
|
4655
4712
|
};
|
|
4656
4713
|
export {
|
|
@@ -4689,6 +4746,7 @@ export {
|
|
|
4689
4746
|
Progress,
|
|
4690
4747
|
RadioGroup,
|
|
4691
4748
|
SearchInput,
|
|
4749
|
+
SegmentedSwitch,
|
|
4692
4750
|
Select,
|
|
4693
4751
|
Slider,
|
|
4694
4752
|
StatusAvatar,
|