@bubo-squared/ui-framework 0.2.33 → 0.2.35
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 +214 -156
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +28 -1
- package/dist/index.d.ts +28 -1
- package/dist/index.js +211 -154
- package/dist/index.js.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1367,7 +1367,7 @@ import { ChevronRightIcon } from "@bubo-squared/icons";
|
|
|
1367
1367
|
|
|
1368
1368
|
// src/components/ui/dropdown-styles.ts
|
|
1369
1369
|
import { cva as cva13 } from "class-variance-authority";
|
|
1370
|
-
var dropdownSurfaceClass = "z-50 rounded-
|
|
1370
|
+
var dropdownSurfaceClass = "z-50 rounded-8 border border-secondary-hover bg-(--background-neutral) shadow-card-md";
|
|
1371
1371
|
var dropdownScrollClass = "max-h-79 overflow-y-auto dropdown-scrollbar";
|
|
1372
1372
|
var dropdownRowVariants = cva13(
|
|
1373
1373
|
"flex w-full items-center gap-2 pl-(--space-8) pr-(--space-16) text-left text-primary cursor-pointer hover:bg-(--background-secondary)",
|
|
@@ -3263,7 +3263,9 @@ var SearchInput = React33.forwardRef((props, forwardedRef) => {
|
|
|
3263
3263
|
disabled: disabled ?? void 0,
|
|
3264
3264
|
variant: "bare",
|
|
3265
3265
|
className: cn(
|
|
3266
|
-
searchTextVariants({ size })
|
|
3266
|
+
searchTextVariants({ size }),
|
|
3267
|
+
"[&::-webkit-search-cancel-button]:appearance-none",
|
|
3268
|
+
"[&::-webkit-search-cancel-button]:hidden"
|
|
3267
3269
|
),
|
|
3268
3270
|
...inputProps
|
|
3269
3271
|
}
|
|
@@ -3275,13 +3277,67 @@ var SearchInput = React33.forwardRef((props, forwardedRef) => {
|
|
|
3275
3277
|
});
|
|
3276
3278
|
SearchInput.displayName = "SearchInput";
|
|
3277
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
|
+
|
|
3278
3334
|
// src/components/Inputs/Slider.tsx
|
|
3279
|
-
import * as
|
|
3335
|
+
import * as React36 from "react";
|
|
3280
3336
|
|
|
3281
3337
|
// src/components/Feedback/Tooltip.tsx
|
|
3282
|
-
import * as
|
|
3338
|
+
import * as React35 from "react";
|
|
3283
3339
|
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
3284
|
-
import { jsx as
|
|
3340
|
+
import { jsx as jsx37, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
3285
3341
|
var TooltipArrow = TooltipPrimitive.Arrow;
|
|
3286
3342
|
var REACT_FORWARD_REF_TYPE = /* @__PURE__ */ Symbol.for("react.forward_ref");
|
|
3287
3343
|
var REACT_MEMO_TYPE = /* @__PURE__ */ Symbol.for("react.memo");
|
|
@@ -3333,20 +3389,20 @@ var Tooltip = (props) => {
|
|
|
3333
3389
|
className,
|
|
3334
3390
|
placement = "top",
|
|
3335
3391
|
offset = 10,
|
|
3336
|
-
disableHoverableContent,
|
|
3392
|
+
disableHoverableContent = false,
|
|
3337
3393
|
open,
|
|
3338
3394
|
defaultOpen,
|
|
3339
3395
|
onOpenChange,
|
|
3340
3396
|
children,
|
|
3341
3397
|
delayDuration = 200
|
|
3342
3398
|
} = props;
|
|
3343
|
-
const trigger =
|
|
3399
|
+
const trigger = React35.isValidElement(children) && canAcceptRef(children) ? children : /* @__PURE__ */ jsx37("span", { className: "inline-flex", tabIndex: 0, children });
|
|
3344
3400
|
const hasStrapline = typeof strapline === "string" ? strapline.trim() !== "" : strapline != null;
|
|
3345
3401
|
const hasDescription = typeof description === "string" ? description.trim() !== "" : description != null;
|
|
3346
3402
|
const { side, align } = mapPlacementToSideAndAlign(placement);
|
|
3347
|
-
const tooltipClasses = "group bg-(--background-tooltip) max-w-[calc(100vw-2rem)] shadow-card-md border-none rounded-
|
|
3403
|
+
const tooltipClasses = "group bg-(--background-tooltip) max-w-[calc(100vw-2rem)] shadow-card-md border-none rounded-8 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";
|
|
3348
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)]";
|
|
3349
|
-
return /* @__PURE__ */
|
|
3405
|
+
return /* @__PURE__ */ jsxs24(
|
|
3350
3406
|
TooltipPrimitive.Root,
|
|
3351
3407
|
{
|
|
3352
3408
|
open,
|
|
@@ -3355,8 +3411,8 @@ var Tooltip = (props) => {
|
|
|
3355
3411
|
disableHoverableContent,
|
|
3356
3412
|
delayDuration,
|
|
3357
3413
|
children: [
|
|
3358
|
-
/* @__PURE__ */
|
|
3359
|
-
/* @__PURE__ */
|
|
3414
|
+
/* @__PURE__ */ jsx37(TooltipPrimitive.Trigger, { asChild: true, children: trigger }),
|
|
3415
|
+
/* @__PURE__ */ jsx37(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs24(
|
|
3360
3416
|
TooltipPrimitive.Content,
|
|
3361
3417
|
{
|
|
3362
3418
|
side,
|
|
@@ -3364,11 +3420,11 @@ var Tooltip = (props) => {
|
|
|
3364
3420
|
sideOffset: offset,
|
|
3365
3421
|
className: cn(tooltipClasses, className),
|
|
3366
3422
|
children: [
|
|
3367
|
-
showArrow && /* @__PURE__ */
|
|
3368
|
-
/* @__PURE__ */
|
|
3369
|
-
hasStrapline && /* @__PURE__ */
|
|
3370
|
-
/* @__PURE__ */
|
|
3371
|
-
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 })
|
|
3372
3428
|
] })
|
|
3373
3429
|
]
|
|
3374
3430
|
}
|
|
@@ -3380,7 +3436,7 @@ var Tooltip = (props) => {
|
|
|
3380
3436
|
Tooltip.displayName = "Tooltip";
|
|
3381
3437
|
|
|
3382
3438
|
// src/components/Inputs/Slider.tsx
|
|
3383
|
-
import { Fragment, jsx as
|
|
3439
|
+
import { Fragment, jsx as jsx38, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
3384
3440
|
var wrapperBase = "flex flex-col gap-2 items-start";
|
|
3385
3441
|
var isRangeProps = (props) => {
|
|
3386
3442
|
return Array.isArray(props.value) || Array.isArray(props.defaultValue);
|
|
@@ -3389,7 +3445,7 @@ var toArray = (value) => {
|
|
|
3389
3445
|
if (value === void 0) return void 0;
|
|
3390
3446
|
return Array.isArray(value) ? value : [value];
|
|
3391
3447
|
};
|
|
3392
|
-
var Slider =
|
|
3448
|
+
var Slider = React36.forwardRef((props, forwardedRef) => {
|
|
3393
3449
|
const {
|
|
3394
3450
|
name,
|
|
3395
3451
|
display = "flat",
|
|
@@ -3407,7 +3463,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3407
3463
|
const isRange = isRangeProps(props);
|
|
3408
3464
|
const isControlled = value !== void 0;
|
|
3409
3465
|
const expectedLength = isRange ? 2 : 1;
|
|
3410
|
-
const normalizeArray =
|
|
3466
|
+
const normalizeArray = React36.useCallback(
|
|
3411
3467
|
(arr, fallback) => {
|
|
3412
3468
|
if (!arr || arr.length === 0) return fallback;
|
|
3413
3469
|
if (arr.length === expectedLength) return arr;
|
|
@@ -3419,16 +3475,16 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3419
3475
|
},
|
|
3420
3476
|
[expectedLength, max]
|
|
3421
3477
|
);
|
|
3422
|
-
const defaultInternal =
|
|
3478
|
+
const defaultInternal = React36.useMemo(() => {
|
|
3423
3479
|
const defaultValueArray = toArray(defaultValue);
|
|
3424
3480
|
if (defaultValueArray) return normalizeArray(defaultValueArray, []);
|
|
3425
3481
|
if (isRange) return [min, Math.min(min + (max - min) / 4, max)];
|
|
3426
3482
|
return [min + (max - min) / 3];
|
|
3427
3483
|
}, [defaultValue, min, max, isRange, normalizeArray]);
|
|
3428
|
-
const [internalValue, setInternalValue] =
|
|
3484
|
+
const [internalValue, setInternalValue] = React36.useState(
|
|
3429
3485
|
() => normalizeArray(isControlled ? toArray(value) : defaultInternal, defaultInternal)
|
|
3430
3486
|
);
|
|
3431
|
-
|
|
3487
|
+
React36.useEffect(() => {
|
|
3432
3488
|
if (isControlled) {
|
|
3433
3489
|
setInternalValue(
|
|
3434
3490
|
(current2) => normalizeArray(toArray(value), current2.length ? current2 : defaultInternal)
|
|
@@ -3436,16 +3492,16 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3436
3492
|
}
|
|
3437
3493
|
}, [isControlled, value, normalizeArray, defaultInternal]);
|
|
3438
3494
|
const current = internalValue;
|
|
3439
|
-
const trackRef =
|
|
3440
|
-
const [draggingThumbIndex, setDraggingThumbIndex] =
|
|
3441
|
-
const [hoveredThumbIndex, setHoveredThumbIndex] =
|
|
3442
|
-
const [focusedThumbIndex, setFocusedThumbIndex] =
|
|
3443
|
-
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) => {
|
|
3444
3500
|
if (val < min) return min;
|
|
3445
3501
|
if (val > max) return max;
|
|
3446
3502
|
return val;
|
|
3447
3503
|
}, [min, max]);
|
|
3448
|
-
const enforceMinGap =
|
|
3504
|
+
const enforceMinGap = React36.useCallback((next, prev) => {
|
|
3449
3505
|
if (!isRange || next.length !== 2 || step <= 0) return next;
|
|
3450
3506
|
let [low, high] = next;
|
|
3451
3507
|
const [prevLow, prevHigh] = prev.length === 2 ? prev : next;
|
|
@@ -3469,7 +3525,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3469
3525
|
}
|
|
3470
3526
|
return [low, high];
|
|
3471
3527
|
}, [isRange, step, clamp]);
|
|
3472
|
-
|
|
3528
|
+
React36.useEffect(() => {
|
|
3473
3529
|
if (!isControlled) {
|
|
3474
3530
|
setInternalValue((prev) => {
|
|
3475
3531
|
const clamped = prev.map((v) => clamp(v));
|
|
@@ -3642,7 +3698,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3642
3698
|
const second = formatNumber(valueToPercent(secondary));
|
|
3643
3699
|
return `${first} - ${second}`;
|
|
3644
3700
|
}
|
|
3645
|
-
return /* @__PURE__ */
|
|
3701
|
+
return /* @__PURE__ */ jsxs25(Fragment, { children: [
|
|
3646
3702
|
formatDisplayNode(primary),
|
|
3647
3703
|
" - ",
|
|
3648
3704
|
formatDisplayNode(secondary)
|
|
@@ -3657,7 +3713,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3657
3713
|
const val = index === 0 ? primary : secondary;
|
|
3658
3714
|
const isDragging = draggingThumbIndex === index;
|
|
3659
3715
|
const isTooltipVisible = showTooltip && (hoveredThumbIndex === index || draggingThumbIndex === index || focusedThumbIndex === index);
|
|
3660
|
-
const handle = /* @__PURE__ */
|
|
3716
|
+
const handle = /* @__PURE__ */ jsx38(
|
|
3661
3717
|
"button",
|
|
3662
3718
|
{
|
|
3663
3719
|
type: "button",
|
|
@@ -3703,7 +3759,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3703
3759
|
index
|
|
3704
3760
|
);
|
|
3705
3761
|
if (!showTooltip) return handle;
|
|
3706
|
-
return /* @__PURE__ */
|
|
3762
|
+
return /* @__PURE__ */ jsx38(
|
|
3707
3763
|
Tooltip,
|
|
3708
3764
|
{
|
|
3709
3765
|
title: tooltipContent,
|
|
@@ -3716,15 +3772,15 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3716
3772
|
}
|
|
3717
3773
|
);
|
|
3718
3774
|
};
|
|
3719
|
-
return /* @__PURE__ */
|
|
3775
|
+
return /* @__PURE__ */ jsxs25(
|
|
3720
3776
|
"div",
|
|
3721
3777
|
{
|
|
3722
3778
|
className: wrapperBase,
|
|
3723
3779
|
style: { marginInline: `${thumbRadius}px` },
|
|
3724
3780
|
ref: forwardedRef,
|
|
3725
3781
|
children: [
|
|
3726
|
-
name && /* @__PURE__ */
|
|
3727
|
-
/* @__PURE__ */
|
|
3782
|
+
name && /* @__PURE__ */ jsxs25(Fragment, { children: [
|
|
3783
|
+
/* @__PURE__ */ jsx38(
|
|
3728
3784
|
"input",
|
|
3729
3785
|
{
|
|
3730
3786
|
type: "hidden",
|
|
@@ -3733,7 +3789,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3733
3789
|
disabled
|
|
3734
3790
|
}
|
|
3735
3791
|
),
|
|
3736
|
-
isRange && secondary !== void 0 && /* @__PURE__ */
|
|
3792
|
+
isRange && secondary !== void 0 && /* @__PURE__ */ jsx38(
|
|
3737
3793
|
"input",
|
|
3738
3794
|
{
|
|
3739
3795
|
type: "hidden",
|
|
@@ -3743,8 +3799,8 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3743
3799
|
}
|
|
3744
3800
|
)
|
|
3745
3801
|
] }),
|
|
3746
|
-
/* @__PURE__ */
|
|
3747
|
-
/* @__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(
|
|
3748
3804
|
"div",
|
|
3749
3805
|
{
|
|
3750
3806
|
className: cn(
|
|
@@ -3755,7 +3811,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3755
3811
|
ref: trackRef,
|
|
3756
3812
|
onPointerDown: handleTrackPointerDown,
|
|
3757
3813
|
children: [
|
|
3758
|
-
/* @__PURE__ */
|
|
3814
|
+
/* @__PURE__ */ jsx38(
|
|
3759
3815
|
"div",
|
|
3760
3816
|
{
|
|
3761
3817
|
className: cn(
|
|
@@ -3783,7 +3839,7 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3783
3839
|
]
|
|
3784
3840
|
}
|
|
3785
3841
|
) }),
|
|
3786
|
-
showNumeric && /* @__PURE__ */
|
|
3842
|
+
showNumeric && /* @__PURE__ */ jsx38(
|
|
3787
3843
|
"p",
|
|
3788
3844
|
{
|
|
3789
3845
|
className: cn(
|
|
@@ -3801,10 +3857,10 @@ var Slider = React35.forwardRef((props, forwardedRef) => {
|
|
|
3801
3857
|
Slider.displayName = "Slider";
|
|
3802
3858
|
|
|
3803
3859
|
// src/components/Inputs/TextArea.tsx
|
|
3804
|
-
import * as
|
|
3860
|
+
import * as React37 from "react";
|
|
3805
3861
|
import { MaximizeIcon } from "@bubo-squared/icons";
|
|
3806
|
-
import { jsx as
|
|
3807
|
-
var TextArea =
|
|
3862
|
+
import { jsx as jsx39, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3863
|
+
var TextArea = React37.forwardRef((props, forwardedRef) => {
|
|
3808
3864
|
const {
|
|
3809
3865
|
label,
|
|
3810
3866
|
hint,
|
|
@@ -3823,7 +3879,7 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3823
3879
|
...textareaProps
|
|
3824
3880
|
} = props;
|
|
3825
3881
|
const isControlled = value !== void 0;
|
|
3826
|
-
const [internalValue, setInternalValue] =
|
|
3882
|
+
const [internalValue, setInternalValue] = React37.useState(
|
|
3827
3883
|
defaultValue ?? ""
|
|
3828
3884
|
);
|
|
3829
3885
|
const currentValue = (isControlled ? value : internalValue) ?? "";
|
|
@@ -3831,9 +3887,9 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3831
3887
|
const currentLength = currentValue.length;
|
|
3832
3888
|
const effectiveMaxLength = type === "character-limit" ? maxLength ?? 144 : void 0;
|
|
3833
3889
|
const showCharacterLimit = type === "character-limit" && typeof effectiveMaxLength === "number";
|
|
3834
|
-
const textareaRef =
|
|
3835
|
-
const containerRef =
|
|
3836
|
-
const setTextareaRef =
|
|
3890
|
+
const textareaRef = React37.useRef(null);
|
|
3891
|
+
const containerRef = React37.useRef(null);
|
|
3892
|
+
const setTextareaRef = React37.useCallback(
|
|
3837
3893
|
(node) => {
|
|
3838
3894
|
textareaRef.current = node;
|
|
3839
3895
|
if (!forwardedRef) return;
|
|
@@ -3845,8 +3901,8 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3845
3901
|
},
|
|
3846
3902
|
[forwardedRef]
|
|
3847
3903
|
);
|
|
3848
|
-
const [height, setHeight] =
|
|
3849
|
-
const [width, setWidth] =
|
|
3904
|
+
const [height, setHeight] = React37.useState(void 0);
|
|
3905
|
+
const [width, setWidth] = React37.useState(void 0);
|
|
3850
3906
|
const minHeight = 80;
|
|
3851
3907
|
const minWidth = 240;
|
|
3852
3908
|
const handleContainerClick = () => {
|
|
@@ -3859,7 +3915,7 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3859
3915
|
}
|
|
3860
3916
|
onChange?.(event);
|
|
3861
3917
|
};
|
|
3862
|
-
const generatedId =
|
|
3918
|
+
const generatedId = React37.useId();
|
|
3863
3919
|
const textareaId = id ?? generatedId;
|
|
3864
3920
|
const statusBorderClass = {
|
|
3865
3921
|
default: "",
|
|
@@ -3896,7 +3952,7 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3896
3952
|
window.addEventListener("pointermove", handlePointerMove);
|
|
3897
3953
|
window.addEventListener("pointerup", handlePointerUp);
|
|
3898
3954
|
};
|
|
3899
|
-
return /* @__PURE__ */
|
|
3955
|
+
return /* @__PURE__ */ jsx39(
|
|
3900
3956
|
Field,
|
|
3901
3957
|
{
|
|
3902
3958
|
className: "w-full",
|
|
@@ -3905,7 +3961,7 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3905
3961
|
hideHint,
|
|
3906
3962
|
status,
|
|
3907
3963
|
disabled,
|
|
3908
|
-
children: /* @__PURE__ */
|
|
3964
|
+
children: /* @__PURE__ */ jsxs26(
|
|
3909
3965
|
"div",
|
|
3910
3966
|
{
|
|
3911
3967
|
className: cn(
|
|
@@ -3924,7 +3980,7 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3924
3980
|
onClick: handleContainerClick,
|
|
3925
3981
|
"aria-disabled": disabled || void 0,
|
|
3926
3982
|
children: [
|
|
3927
|
-
/* @__PURE__ */
|
|
3983
|
+
/* @__PURE__ */ jsx39(
|
|
3928
3984
|
"textarea",
|
|
3929
3985
|
{
|
|
3930
3986
|
id: textareaId,
|
|
@@ -3944,7 +4000,7 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3944
4000
|
...textareaProps
|
|
3945
4001
|
}
|
|
3946
4002
|
),
|
|
3947
|
-
showCharacterLimit && /* @__PURE__ */
|
|
4003
|
+
showCharacterLimit && /* @__PURE__ */ jsxs26(
|
|
3948
4004
|
"span",
|
|
3949
4005
|
{
|
|
3950
4006
|
className: cn(
|
|
@@ -3958,19 +4014,19 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3958
4014
|
]
|
|
3959
4015
|
}
|
|
3960
4016
|
),
|
|
3961
|
-
type === "responsive" && /* @__PURE__ */
|
|
4017
|
+
type === "responsive" && /* @__PURE__ */ jsx39(
|
|
3962
4018
|
"div",
|
|
3963
4019
|
{
|
|
3964
4020
|
className: "absolute bottom-1 right-1 h-3 w-3 " + (disabled ? "cursor-auto" : "cursor-nwse-resize"),
|
|
3965
4021
|
onPointerDown: disabled ? void 0 : handleResizePointerDown,
|
|
3966
|
-
children: /* @__PURE__ */
|
|
4022
|
+
children: /* @__PURE__ */ jsx39(
|
|
3967
4023
|
"span",
|
|
3968
4024
|
{
|
|
3969
4025
|
className: cn(
|
|
3970
4026
|
"absolute bottom-0 right-0 flex h-4 w-4 items-center justify-center text-(--icon-primary)",
|
|
3971
4027
|
disabled && "text-(--icon-primary-disabled)"
|
|
3972
4028
|
),
|
|
3973
|
-
children: /* @__PURE__ */
|
|
4029
|
+
children: /* @__PURE__ */ jsx39(MaximizeIcon, {})
|
|
3974
4030
|
}
|
|
3975
4031
|
)
|
|
3976
4032
|
}
|
|
@@ -3984,9 +4040,9 @@ var TextArea = React36.forwardRef((props, forwardedRef) => {
|
|
|
3984
4040
|
TextArea.displayName = "TextArea";
|
|
3985
4041
|
|
|
3986
4042
|
// src/components/Inputs/TextInput.tsx
|
|
3987
|
-
import * as
|
|
4043
|
+
import * as React38 from "react";
|
|
3988
4044
|
import { cva as cva20 } from "class-variance-authority";
|
|
3989
|
-
import { jsx as
|
|
4045
|
+
import { jsx as jsx40, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3990
4046
|
var inputTextVariants3 = cva20("truncate", {
|
|
3991
4047
|
variants: {
|
|
3992
4048
|
size: {
|
|
@@ -4019,7 +4075,7 @@ var iconWrapperVariants4 = cva20(
|
|
|
4019
4075
|
}
|
|
4020
4076
|
}
|
|
4021
4077
|
);
|
|
4022
|
-
var TextInput =
|
|
4078
|
+
var TextInput = React38.forwardRef((props, forwardedRef) => {
|
|
4023
4079
|
const {
|
|
4024
4080
|
label,
|
|
4025
4081
|
hint,
|
|
@@ -4037,12 +4093,12 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4037
4093
|
...inputProps
|
|
4038
4094
|
} = props;
|
|
4039
4095
|
const isControlled = value !== void 0;
|
|
4040
|
-
const [internalValue, setInternalValue] =
|
|
4096
|
+
const [internalValue, setInternalValue] = React38.useState(
|
|
4041
4097
|
defaultValue ?? ""
|
|
4042
4098
|
);
|
|
4043
4099
|
const currentValue = (isControlled ? value : internalValue) ?? "";
|
|
4044
|
-
const inputRef =
|
|
4045
|
-
const setInputRef =
|
|
4100
|
+
const inputRef = React38.useRef(null);
|
|
4101
|
+
const setInputRef = React38.useCallback(
|
|
4046
4102
|
(node) => {
|
|
4047
4103
|
inputRef.current = node;
|
|
4048
4104
|
if (!forwardedRef) return;
|
|
@@ -4066,7 +4122,7 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4066
4122
|
};
|
|
4067
4123
|
const showLeadingIcon = !!leadingIcon;
|
|
4068
4124
|
const showTrailingIcon = !!trailingIcon;
|
|
4069
|
-
return /* @__PURE__ */
|
|
4125
|
+
return /* @__PURE__ */ jsx40(
|
|
4070
4126
|
Field,
|
|
4071
4127
|
{
|
|
4072
4128
|
label,
|
|
@@ -4074,7 +4130,7 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4074
4130
|
hideHint,
|
|
4075
4131
|
status,
|
|
4076
4132
|
disabled,
|
|
4077
|
-
children: /* @__PURE__ */
|
|
4133
|
+
children: /* @__PURE__ */ jsxs27(
|
|
4078
4134
|
InputShell,
|
|
4079
4135
|
{
|
|
4080
4136
|
size,
|
|
@@ -4083,7 +4139,7 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4083
4139
|
className,
|
|
4084
4140
|
onClick: handleContainerClick,
|
|
4085
4141
|
children: [
|
|
4086
|
-
showLeadingIcon && /* @__PURE__ */
|
|
4142
|
+
showLeadingIcon && /* @__PURE__ */ jsx40(
|
|
4087
4143
|
"span",
|
|
4088
4144
|
{
|
|
4089
4145
|
className: cn(
|
|
@@ -4092,7 +4148,7 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4092
4148
|
children: leadingIcon
|
|
4093
4149
|
}
|
|
4094
4150
|
),
|
|
4095
|
-
/* @__PURE__ */
|
|
4151
|
+
/* @__PURE__ */ jsx40(
|
|
4096
4152
|
Input,
|
|
4097
4153
|
{
|
|
4098
4154
|
ref: setInputRef,
|
|
@@ -4110,7 +4166,7 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4110
4166
|
...inputProps
|
|
4111
4167
|
}
|
|
4112
4168
|
),
|
|
4113
|
-
showTrailingIcon && /* @__PURE__ */
|
|
4169
|
+
showTrailingIcon && /* @__PURE__ */ jsx40(
|
|
4114
4170
|
"span",
|
|
4115
4171
|
{
|
|
4116
4172
|
className: cn(
|
|
@@ -4128,11 +4184,11 @@ var TextInput = React37.forwardRef((props, forwardedRef) => {
|
|
|
4128
4184
|
TextInput.displayName = "TextInput";
|
|
4129
4185
|
|
|
4130
4186
|
// src/components/Inputs/Toggle.tsx
|
|
4131
|
-
import * as
|
|
4132
|
-
import { jsx as
|
|
4133
|
-
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) => {
|
|
4134
4190
|
const { label, className, disabled, ...inputProps } = props;
|
|
4135
|
-
return /* @__PURE__ */
|
|
4191
|
+
return /* @__PURE__ */ jsxs28(
|
|
4136
4192
|
"label",
|
|
4137
4193
|
{
|
|
4138
4194
|
className: cn(
|
|
@@ -4140,8 +4196,8 @@ var Toggle = React38.forwardRef((props, forwardedRef) => {
|
|
|
4140
4196
|
disabled ? "cursor-default" : "cursor-pointer"
|
|
4141
4197
|
),
|
|
4142
4198
|
children: [
|
|
4143
|
-
/* @__PURE__ */
|
|
4144
|
-
/* @__PURE__ */
|
|
4199
|
+
/* @__PURE__ */ jsxs28("span", { className: "relative inline-flex items-center", children: [
|
|
4200
|
+
/* @__PURE__ */ jsx41(
|
|
4145
4201
|
"input",
|
|
4146
4202
|
{
|
|
4147
4203
|
ref: forwardedRef,
|
|
@@ -4151,7 +4207,7 @@ var Toggle = React38.forwardRef((props, forwardedRef) => {
|
|
|
4151
4207
|
...inputProps
|
|
4152
4208
|
}
|
|
4153
4209
|
),
|
|
4154
|
-
/* @__PURE__ */
|
|
4210
|
+
/* @__PURE__ */ jsx41(
|
|
4155
4211
|
"span",
|
|
4156
4212
|
{
|
|
4157
4213
|
className: cn(
|
|
@@ -4191,7 +4247,7 @@ var Toggle = React38.forwardRef((props, forwardedRef) => {
|
|
|
4191
4247
|
"peer-disabled:[&>.knob]:peer-checked:bg-(--background-primary-hover)",
|
|
4192
4248
|
className
|
|
4193
4249
|
),
|
|
4194
|
-
children: /* @__PURE__ */
|
|
4250
|
+
children: /* @__PURE__ */ jsx41(
|
|
4195
4251
|
"span",
|
|
4196
4252
|
{
|
|
4197
4253
|
className: cn(
|
|
@@ -4203,7 +4259,7 @@ var Toggle = React38.forwardRef((props, forwardedRef) => {
|
|
|
4203
4259
|
}
|
|
4204
4260
|
)
|
|
4205
4261
|
] }),
|
|
4206
|
-
label && /* @__PURE__ */
|
|
4262
|
+
label && /* @__PURE__ */ jsx41(
|
|
4207
4263
|
"span",
|
|
4208
4264
|
{
|
|
4209
4265
|
className: cn(
|
|
@@ -4220,9 +4276,9 @@ var Toggle = React38.forwardRef((props, forwardedRef) => {
|
|
|
4220
4276
|
Toggle.displayName = "Toggle";
|
|
4221
4277
|
|
|
4222
4278
|
// src/components/Inputs/WebsiteInput.tsx
|
|
4223
|
-
import * as
|
|
4224
|
-
import { jsx as
|
|
4225
|
-
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) => {
|
|
4226
4282
|
const {
|
|
4227
4283
|
hierarchy = "leading",
|
|
4228
4284
|
protocolLabel = "http://",
|
|
@@ -4258,15 +4314,15 @@ var WebsiteInput = React39.forwardRef((props, forwardedRef) => {
|
|
|
4258
4314
|
size === "xl" ? "[&>svg]:w-6 [&>svg]:h-6" : size === "sm" ? "[&>svg]:w-4 [&>svg]:h-4" : "[&>svg]:w-5 [&>svg]:h-5",
|
|
4259
4315
|
disabled ? "text-(--icon-primary-disabled)" : "text-(--icon-primary) group-hover:text-(--icon-primary-hover) group-focus-within:text-(--icon-primary-focus)"
|
|
4260
4316
|
);
|
|
4261
|
-
const leadingAddon = /* @__PURE__ */
|
|
4262
|
-
/* @__PURE__ */
|
|
4263
|
-
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 })
|
|
4264
4320
|
] });
|
|
4265
|
-
const trailingAddon = /* @__PURE__ */
|
|
4266
|
-
icon != null && /* @__PURE__ */
|
|
4267
|
-
/* @__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 })
|
|
4268
4324
|
] });
|
|
4269
|
-
return /* @__PURE__ */
|
|
4325
|
+
return /* @__PURE__ */ jsx42(
|
|
4270
4326
|
TextInput,
|
|
4271
4327
|
{
|
|
4272
4328
|
ref: forwardedRef,
|
|
@@ -4282,9 +4338,9 @@ var WebsiteInput = React39.forwardRef((props, forwardedRef) => {
|
|
|
4282
4338
|
WebsiteInput.displayName = "WebsiteInput";
|
|
4283
4339
|
|
|
4284
4340
|
// src/components/Feedback/Popover.tsx
|
|
4285
|
-
import * as
|
|
4341
|
+
import * as React41 from "react";
|
|
4286
4342
|
import * as PopoverPrimitive2 from "@radix-ui/react-popover";
|
|
4287
|
-
import { jsx as
|
|
4343
|
+
import { jsx as jsx43, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
4288
4344
|
var PopoverArrow = PopoverPrimitive2.Arrow;
|
|
4289
4345
|
var Popover2 = (props) => {
|
|
4290
4346
|
const {
|
|
@@ -4306,7 +4362,7 @@ var Popover2 = (props) => {
|
|
|
4306
4362
|
} = props;
|
|
4307
4363
|
const hasStrapline = typeof strapline === "string" ? strapline.trim() !== "" : strapline != null;
|
|
4308
4364
|
const hasDescription = typeof description === "string" ? description.trim() !== "" : description != null;
|
|
4309
|
-
const [open, setOpen] =
|
|
4365
|
+
const [open, setOpen] = React41.useState(false);
|
|
4310
4366
|
const handleOpenChange = (nextOpen) => {
|
|
4311
4367
|
setOpen(nextOpen);
|
|
4312
4368
|
onOpenChange?.(nextOpen);
|
|
@@ -4352,9 +4408,9 @@ var Popover2 = (props) => {
|
|
|
4352
4408
|
}
|
|
4353
4409
|
};
|
|
4354
4410
|
const { side, align } = mapPlacementToSideAndAlign2(placement);
|
|
4355
|
-
return /* @__PURE__ */
|
|
4356
|
-
/* @__PURE__ */
|
|
4357
|
-
/* @__PURE__ */
|
|
4411
|
+
return /* @__PURE__ */ jsxs30(Popover, { open, onOpenChange: handleOpenChange, children: [
|
|
4412
|
+
/* @__PURE__ */ jsx43(PopoverTrigger, { asChild: true, children }),
|
|
4413
|
+
/* @__PURE__ */ jsxs30(
|
|
4358
4414
|
PopoverContent,
|
|
4359
4415
|
{
|
|
4360
4416
|
side,
|
|
@@ -4363,16 +4419,16 @@ var Popover2 = (props) => {
|
|
|
4363
4419
|
className: cn(popoverClasses, className),
|
|
4364
4420
|
...rest,
|
|
4365
4421
|
children: [
|
|
4366
|
-
showArrow && /* @__PURE__ */
|
|
4367
|
-
customContent ? typeof customContent === "function" ? customContent({ close: () => handleOpenChange(false), ok: handleOk, cancel: handleCancel }) : customContent : /* @__PURE__ */
|
|
4368
|
-
/* @__PURE__ */
|
|
4369
|
-
hasStrapline && /* @__PURE__ */
|
|
4370
|
-
/* @__PURE__ */
|
|
4371
|
-
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 })
|
|
4372
4428
|
] }),
|
|
4373
|
-
/* @__PURE__ */
|
|
4374
|
-
/* @__PURE__ */
|
|
4375
|
-
/* @__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" })
|
|
4376
4432
|
] })
|
|
4377
4433
|
] })
|
|
4378
4434
|
]
|
|
@@ -4385,7 +4441,7 @@ Popover2.displayName = "Popover";
|
|
|
4385
4441
|
// src/components/Feedback/TooltipProvider.tsx
|
|
4386
4442
|
import "react";
|
|
4387
4443
|
import * as TooltipPrimitive2 from "@radix-ui/react-tooltip";
|
|
4388
|
-
import { jsx as
|
|
4444
|
+
import { jsx as jsx44 } from "react/jsx-runtime";
|
|
4389
4445
|
var TooltipProvider = (props) => {
|
|
4390
4446
|
const {
|
|
4391
4447
|
children,
|
|
@@ -4393,7 +4449,7 @@ var TooltipProvider = (props) => {
|
|
|
4393
4449
|
skipDelayDuration = 300,
|
|
4394
4450
|
disableHoverableContent = false
|
|
4395
4451
|
} = props;
|
|
4396
|
-
return /* @__PURE__ */
|
|
4452
|
+
return /* @__PURE__ */ jsx44(
|
|
4397
4453
|
TooltipPrimitive2.Provider,
|
|
4398
4454
|
{
|
|
4399
4455
|
delayDuration,
|
|
@@ -4406,19 +4462,19 @@ var TooltipProvider = (props) => {
|
|
|
4406
4462
|
TooltipProvider.displayName = "TooltipProvider";
|
|
4407
4463
|
|
|
4408
4464
|
// src/components/Navigation/Breadcrumbs.tsx
|
|
4409
|
-
import * as
|
|
4465
|
+
import * as React44 from "react";
|
|
4410
4466
|
|
|
4411
4467
|
// src/components/ui/breadcrumb.tsx
|
|
4412
4468
|
import "react";
|
|
4413
4469
|
import { Slot as Slot6 } from "@radix-ui/react-slot";
|
|
4414
|
-
import { jsx as
|
|
4470
|
+
import { jsx as jsx45 } from "react/jsx-runtime";
|
|
4415
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";
|
|
4416
4472
|
var disabledItemClasses = "text-primary-disabled cursor-default pointer-events-none";
|
|
4417
4473
|
function Breadcrumb({ ...props }) {
|
|
4418
|
-
return /* @__PURE__ */
|
|
4474
|
+
return /* @__PURE__ */ jsx45("nav", { "aria-label": "breadcrumb", "data-slot": "breadcrumb", ...props });
|
|
4419
4475
|
}
|
|
4420
4476
|
function BreadcrumbList({ className, ...props }) {
|
|
4421
|
-
return /* @__PURE__ */
|
|
4477
|
+
return /* @__PURE__ */ jsx45(
|
|
4422
4478
|
"ol",
|
|
4423
4479
|
{
|
|
4424
4480
|
"data-slot": "breadcrumb-list",
|
|
@@ -4431,7 +4487,7 @@ function BreadcrumbList({ className, ...props }) {
|
|
|
4431
4487
|
);
|
|
4432
4488
|
}
|
|
4433
4489
|
function BreadcrumbItem({ className, disabled, ...props }) {
|
|
4434
|
-
return /* @__PURE__ */
|
|
4490
|
+
return /* @__PURE__ */ jsx45(
|
|
4435
4491
|
"li",
|
|
4436
4492
|
{
|
|
4437
4493
|
"data-slot": "breadcrumb-item",
|
|
@@ -4441,7 +4497,7 @@ function BreadcrumbItem({ className, disabled, ...props }) {
|
|
|
4441
4497
|
);
|
|
4442
4498
|
}
|
|
4443
4499
|
function BreadcrumbPage({ className, ...props }) {
|
|
4444
|
-
return /* @__PURE__ */
|
|
4500
|
+
return /* @__PURE__ */ jsx45(
|
|
4445
4501
|
"span",
|
|
4446
4502
|
{
|
|
4447
4503
|
"data-slot": "breadcrumb-page",
|
|
@@ -4458,7 +4514,7 @@ function BreadcrumbSeparator({
|
|
|
4458
4514
|
className,
|
|
4459
4515
|
...props
|
|
4460
4516
|
}) {
|
|
4461
|
-
return /* @__PURE__ */
|
|
4517
|
+
return /* @__PURE__ */ jsx45(
|
|
4462
4518
|
"li",
|
|
4463
4519
|
{
|
|
4464
4520
|
"data-slot": "breadcrumb-separator",
|
|
@@ -4466,15 +4522,15 @@ function BreadcrumbSeparator({
|
|
|
4466
4522
|
"aria-hidden": "true",
|
|
4467
4523
|
className: cn("text-secondary", className),
|
|
4468
4524
|
...props,
|
|
4469
|
-
children: children ?? /* @__PURE__ */
|
|
4525
|
+
children: children ?? /* @__PURE__ */ jsx45(ChevronRight, {})
|
|
4470
4526
|
}
|
|
4471
4527
|
);
|
|
4472
4528
|
}
|
|
4473
4529
|
|
|
4474
4530
|
// src/components/Navigation/Breadcrumbs.tsx
|
|
4475
4531
|
import { MoreHorizFullIcon } from "@bubo-squared/icons";
|
|
4476
|
-
import { jsx as
|
|
4477
|
-
var Breadcrumbs =
|
|
4532
|
+
import { jsx as jsx46, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
4533
|
+
var Breadcrumbs = React44.forwardRef(
|
|
4478
4534
|
(props, ref) => {
|
|
4479
4535
|
const {
|
|
4480
4536
|
separator,
|
|
@@ -4493,17 +4549,17 @@ var Breadcrumbs = React43.forwardRef(
|
|
|
4493
4549
|
ellipsisAriaLabel = "Open breadcrumb menu",
|
|
4494
4550
|
...rest
|
|
4495
4551
|
} = props;
|
|
4496
|
-
const items =
|
|
4552
|
+
const items = React44.Children.toArray(children).filter(Boolean);
|
|
4497
4553
|
const shouldCollapse = Boolean(ellipsis) && items.length >= 5;
|
|
4498
4554
|
const hiddenItems = shouldCollapse ? items.slice(1, -2) : [];
|
|
4499
4555
|
const displayItems = shouldCollapse ? [items[0], "__ELLIPSIS__", items[items.length - 2], items[items.length - 1]] : items;
|
|
4500
|
-
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) => {
|
|
4501
4557
|
const isEllipsis = child === "__ELLIPSIS__";
|
|
4502
|
-
const key = isEllipsis ? "__ellipsis" :
|
|
4558
|
+
const key = isEllipsis ? "__ellipsis" : React44.isValidElement(child) && child.key != null ? String(child.key) : String(index);
|
|
4503
4559
|
const isLast = index === displayItems.length - 1;
|
|
4504
|
-
return /* @__PURE__ */
|
|
4505
|
-
isEllipsis ? /* @__PURE__ */
|
|
4506
|
-
/* @__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(
|
|
4507
4563
|
Button,
|
|
4508
4564
|
{
|
|
4509
4565
|
variant: "ghost",
|
|
@@ -4515,18 +4571,18 @@ var Breadcrumbs = React43.forwardRef(
|
|
|
4515
4571
|
"data-slot": "breadcrumb-ellipsis",
|
|
4516
4572
|
role: "presentation",
|
|
4517
4573
|
"aria-hidden": "true",
|
|
4518
|
-
children: /* @__PURE__ */
|
|
4574
|
+
children: /* @__PURE__ */ jsx46(MoreHorizFullIcon, {})
|
|
4519
4575
|
}
|
|
4520
4576
|
) }),
|
|
4521
|
-
/* @__PURE__ */
|
|
4577
|
+
/* @__PURE__ */ jsx46(
|
|
4522
4578
|
DropdownMenuContent,
|
|
4523
4579
|
{
|
|
4524
4580
|
align: "start",
|
|
4525
4581
|
className: ellipsisContentClassName,
|
|
4526
|
-
children: /* @__PURE__ */
|
|
4527
|
-
const hiddenKey =
|
|
4528
|
-
if (
|
|
4529
|
-
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(
|
|
4530
4586
|
DropdownMenuItem,
|
|
4531
4587
|
{
|
|
4532
4588
|
asChild: true,
|
|
@@ -4536,7 +4592,7 @@ var Breadcrumbs = React43.forwardRef(
|
|
|
4536
4592
|
hiddenKey
|
|
4537
4593
|
);
|
|
4538
4594
|
}
|
|
4539
|
-
return /* @__PURE__ */
|
|
4595
|
+
return /* @__PURE__ */ jsx46(
|
|
4540
4596
|
DropdownMenuItem,
|
|
4541
4597
|
{
|
|
4542
4598
|
className: ellipsisMenuItemClassName,
|
|
@@ -4547,8 +4603,8 @@ var Breadcrumbs = React43.forwardRef(
|
|
|
4547
4603
|
}) })
|
|
4548
4604
|
}
|
|
4549
4605
|
)
|
|
4550
|
-
] }) }) : isLast ? /* @__PURE__ */
|
|
4551
|
-
!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 })
|
|
4552
4608
|
] }, key);
|
|
4553
4609
|
}) }) });
|
|
4554
4610
|
}
|
|
@@ -4557,13 +4613,13 @@ Breadcrumbs.displayName = "Breadcrumbs";
|
|
|
4557
4613
|
|
|
4558
4614
|
// src/components/Logo/LogoIcon.tsx
|
|
4559
4615
|
import { cva as cva21 } from "class-variance-authority";
|
|
4560
|
-
import { jsx as
|
|
4561
|
-
var LogoIconSvg = (props) => /* @__PURE__ */
|
|
4562
|
-
/* @__PURE__ */
|
|
4563
|
-
/* @__PURE__ */
|
|
4564
|
-
/* @__PURE__ */
|
|
4565
|
-
/* @__PURE__ */
|
|
4566
|
-
/* @__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" })
|
|
4567
4623
|
] });
|
|
4568
4624
|
var logoIconVariants = cva21(
|
|
4569
4625
|
"relative bg-linear-to-t from-gray-800 to-gray-950 overflow-hidden flex justify-center items-center",
|
|
@@ -4590,26 +4646,26 @@ var logoIconSizeClass = {
|
|
|
4590
4646
|
xl: "size-96"
|
|
4591
4647
|
};
|
|
4592
4648
|
var LogoIcon = ({ className, size = "md" }) => {
|
|
4593
|
-
return /* @__PURE__ */
|
|
4649
|
+
return /* @__PURE__ */ jsx47("div", { className: cn(logoIconVariants({ size }), className), children: /* @__PURE__ */ jsx47(LogoIconSvg, { className: logoIconSizeClass[size] }) });
|
|
4594
4650
|
};
|
|
4595
4651
|
|
|
4596
4652
|
// src/components/Logo/Logo.tsx
|
|
4597
4653
|
import { cva as cva22 } from "class-variance-authority";
|
|
4598
|
-
import { jsx as
|
|
4599
|
-
var LogoIconSvg2 = (props) => /* @__PURE__ */
|
|
4600
|
-
/* @__PURE__ */
|
|
4601
|
-
/* @__PURE__ */
|
|
4602
|
-
/* @__PURE__ */
|
|
4603
|
-
/* @__PURE__ */
|
|
4604
|
-
/* @__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" })
|
|
4605
4661
|
] });
|
|
4606
|
-
var LogoTextSvg = (props) => /* @__PURE__ */
|
|
4607
|
-
/* @__PURE__ */
|
|
4608
|
-
/* @__PURE__ */
|
|
4609
|
-
/* @__PURE__ */
|
|
4610
|
-
/* @__PURE__ */
|
|
4611
|
-
/* @__PURE__ */
|
|
4612
|
-
/* @__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" })
|
|
4613
4669
|
] });
|
|
4614
4670
|
var logoWrapperVariants = cva22("inline-flex", {
|
|
4615
4671
|
variants: {
|
|
@@ -4649,9 +4705,9 @@ var logoTextSizeVariants = cva22("", {
|
|
|
4649
4705
|
});
|
|
4650
4706
|
var Logo = ({ className, textColor, variant = "inline" }) => {
|
|
4651
4707
|
const textColorClass = textColor === "light" ? "text-(--color-b-white)" : textColor === "dark" ? "text-(--color-b-black)" : "text-primary";
|
|
4652
|
-
return /* @__PURE__ */
|
|
4653
|
-
/* @__PURE__ */
|
|
4654
|
-
/* @__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) })
|
|
4655
4711
|
] });
|
|
4656
4712
|
};
|
|
4657
4713
|
export {
|
|
@@ -4690,6 +4746,7 @@ export {
|
|
|
4690
4746
|
Progress,
|
|
4691
4747
|
RadioGroup,
|
|
4692
4748
|
SearchInput,
|
|
4749
|
+
SegmentedSwitch,
|
|
4693
4750
|
Select,
|
|
4694
4751
|
Slider,
|
|
4695
4752
|
StatusAvatar,
|