@keboola/design 4.3.0 → 4.3.2
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/COMPONENT-API.md +166 -1
- package/dist/editors.cjs +5 -2
- package/dist/editors.cjs.map +1 -1
- package/dist/editors.js +5 -2
- package/dist/editors.js.map +1 -1
- package/dist/index.cjs +229 -223
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +94 -85
- package/dist/index.d.ts +94 -85
- package/dist/index.js +229 -223
- package/dist/index.js.map +1 -1
- package/dist/markdown-editor.cjs +12 -7
- package/dist/markdown-editor.cjs.map +1 -1
- package/dist/markdown-editor.js +12 -7
- package/dist/markdown-editor.js.map +1 -1
- package/dist/mermaid.cjs +5 -2
- package/dist/mermaid.cjs.map +1 -1
- package/dist/mermaid.js +5 -2
- package/dist/mermaid.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/testing.cjs +75 -2
- package/dist/testing.cjs.map +1 -1
- package/dist/testing.js +75 -2
- package/dist/testing.js.map +1 -1
- package/package.json +2 -2
package/dist/index.cjs
CHANGED
|
@@ -1433,7 +1433,7 @@ var variants = classVarianceAuthority.cva(
|
|
|
1433
1433
|
"tw-tracking-[1px]",
|
|
1434
1434
|
"tw-uppercase",
|
|
1435
1435
|
// border
|
|
1436
|
-
"tw-rounded",
|
|
1436
|
+
"tw-rounded-[var(--radius-lg,0.25rem)]",
|
|
1437
1437
|
"tw-border",
|
|
1438
1438
|
"tw-border-transparent",
|
|
1439
1439
|
// styling
|
|
@@ -1587,7 +1587,7 @@ var argoVariants = classVarianceAuthority.cva(
|
|
|
1587
1587
|
// border
|
|
1588
1588
|
"tw-border",
|
|
1589
1589
|
"tw-border-transparent",
|
|
1590
|
-
"tw-rounded-lg",
|
|
1590
|
+
"tw-rounded-[var(--radius-lg,0.25rem)]",
|
|
1591
1591
|
// text
|
|
1592
1592
|
"tw-font-medium",
|
|
1593
1593
|
"tw-select-none",
|
|
@@ -1649,6 +1649,9 @@ var argoVariants = classVarianceAuthority.cva(
|
|
|
1649
1649
|
outline: [
|
|
1650
1650
|
"!tw-border-input",
|
|
1651
1651
|
"tw-bg-background",
|
|
1652
|
+
// Semantic base text color so the label/icon flips in dark mode
|
|
1653
|
+
// (matches `invisible`); previously unset → inherited a fixed dark color.
|
|
1654
|
+
"tw-text-foreground",
|
|
1652
1655
|
"hover:not-disabled:tw-bg-accent",
|
|
1653
1656
|
"hover:not-disabled:tw-text-accent-foreground",
|
|
1654
1657
|
"hover:active:tw-bg-background",
|
|
@@ -2307,7 +2310,10 @@ var DropdownMenuRadioItem = ({
|
|
|
2307
2310
|
"data-[state=checked]:tw-cursor-default",
|
|
2308
2311
|
{
|
|
2309
2312
|
"data-[state=checked]:tw-bg-neutral-100": indicator === "none",
|
|
2310
|
-
|
|
2313
|
+
// Semantic brand tint (flips under `[data-theme='dark']`) instead of a
|
|
2314
|
+
// hardcoded `tw-bg-sky-100`, which stayed light in dark mode and left the
|
|
2315
|
+
// checked item's text near-invisible.
|
|
2316
|
+
"group-data-[variant=argo]/dropdown-menu-content:data-[state=checked]:tw-bg-primary/10": indicator === "check"
|
|
2311
2317
|
},
|
|
2312
2318
|
className
|
|
2313
2319
|
),
|
|
@@ -2897,10 +2903,10 @@ var AlertModalIcon = ({ variant, icon }) => {
|
|
|
2897
2903
|
"div",
|
|
2898
2904
|
{
|
|
2899
2905
|
className: cn("tw-relative", "tw-rounded-full", "tw-size-12", {
|
|
2900
|
-
"tw-bg-
|
|
2906
|
+
"tw-bg-blue-500": variant === "info",
|
|
2901
2907
|
"tw-bg-warning-500": variant === "warning",
|
|
2902
2908
|
"tw-bg-error-500": variant === "danger",
|
|
2903
|
-
"tw-bg-
|
|
2909
|
+
"tw-bg-green-500": variant === "success"
|
|
2904
2910
|
}),
|
|
2905
2911
|
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2906
2912
|
"span",
|
|
@@ -2940,10 +2946,10 @@ var AlertModalIcon = ({ variant, icon }) => {
|
|
|
2940
2946
|
"tw-size-8",
|
|
2941
2947
|
'[&_svg:not([class*="tw-size-"])]:tw-size-5',
|
|
2942
2948
|
{
|
|
2943
|
-
"tw-bg-
|
|
2949
|
+
"tw-bg-blue-100 tw-text-blue-600": variant === "info",
|
|
2944
2950
|
"tw-bg-warning-100 tw-text-warning-500": variant === "warning",
|
|
2945
2951
|
"tw-bg-error-100 tw-text-error-500": variant === "danger",
|
|
2946
|
-
"tw-bg-
|
|
2952
|
+
"tw-bg-green-100 tw-text-green-900": variant === "success"
|
|
2947
2953
|
}
|
|
2948
2954
|
),
|
|
2949
2955
|
children: glyph
|
|
@@ -3438,8 +3444,8 @@ var ModalIcon = (props) => {
|
|
|
3438
3444
|
{
|
|
3439
3445
|
className: cn("tw-relative", "tw-rounded-full", "tw-size-12", {
|
|
3440
3446
|
"tw-bg-warning-500": props.color === "orange",
|
|
3441
|
-
"tw-bg-
|
|
3442
|
-
"tw-bg-
|
|
3447
|
+
"tw-bg-blue-500": props.color === "blue",
|
|
3448
|
+
"tw-bg-green-500": props.color === "green",
|
|
3443
3449
|
"tw-bg-error-500": props.color === "red",
|
|
3444
3450
|
"tw-bg-neutral-150": props.color === "gray",
|
|
3445
3451
|
"tw-bg-purple-100": props.color === "violet"
|
|
@@ -8726,7 +8732,7 @@ var inputGroupVariants = classVarianceAuthority.cva(
|
|
|
8726
8732
|
"tw-flex",
|
|
8727
8733
|
"tw-items-center",
|
|
8728
8734
|
// base
|
|
8729
|
-
"tw-rounded",
|
|
8735
|
+
"tw-rounded-[var(--radius-lg,0.25rem)]",
|
|
8730
8736
|
"tw-border",
|
|
8731
8737
|
"tw-border-solid",
|
|
8732
8738
|
"tw-border-neutral-200",
|
|
@@ -8847,7 +8853,6 @@ var inputGroupVariants = classVarianceAuthority.cva(
|
|
|
8847
8853
|
// muted filled input surface — gray, distinct from white containers; not the app-background token
|
|
8848
8854
|
"tw-bg-muted",
|
|
8849
8855
|
"tw-border-input",
|
|
8850
|
-
"tw-rounded-lg",
|
|
8851
8856
|
"tw-text-foreground",
|
|
8852
8857
|
"has-[:is(input,textarea):disabled]:tw-opacity-50",
|
|
8853
8858
|
// higher specificity than has-[:is(input,textarea):focus] — prevents focus border on readonly
|
|
@@ -9353,198 +9358,6 @@ var TextInput = ({
|
|
|
9353
9358
|
}
|
|
9354
9359
|
);
|
|
9355
9360
|
};
|
|
9356
|
-
var TimePickerButton = ({
|
|
9357
|
-
ref,
|
|
9358
|
-
className,
|
|
9359
|
-
children,
|
|
9360
|
-
...rest
|
|
9361
|
-
}) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
9362
|
-
"button",
|
|
9363
|
-
{
|
|
9364
|
-
...rest,
|
|
9365
|
-
ref,
|
|
9366
|
-
type: "button",
|
|
9367
|
-
className: cn(
|
|
9368
|
-
"tailwindcss-preflight",
|
|
9369
|
-
"tw-flex",
|
|
9370
|
-
"tw-items-center",
|
|
9371
|
-
"tw-justify-center",
|
|
9372
|
-
"tw-size-10",
|
|
9373
|
-
"tw-rounded",
|
|
9374
|
-
"tw-transition-colors",
|
|
9375
|
-
"tw-select-none",
|
|
9376
|
-
"hover:tw-bg-accent",
|
|
9377
|
-
"focus-visible:tw-outline",
|
|
9378
|
-
"focus-visible:tw-outline-2",
|
|
9379
|
-
"focus-visible:tw-outline-primary",
|
|
9380
|
-
"aria-selected:tw-bg-primary",
|
|
9381
|
-
"aria-selected:tw-text-primary-foreground",
|
|
9382
|
-
className
|
|
9383
|
-
),
|
|
9384
|
-
children
|
|
9385
|
-
}
|
|
9386
|
-
);
|
|
9387
|
-
|
|
9388
|
-
// src/components/TimePicker/utils.ts
|
|
9389
|
-
var pad = (n) => n.toString().padStart(2, "0");
|
|
9390
|
-
var parseTime = (time) => {
|
|
9391
|
-
if (!time) return { hour: null, minute: null };
|
|
9392
|
-
const match2 = /^(\d{1,2}):(\d{1,2})$/.exec(time.trim());
|
|
9393
|
-
if (!match2) return { hour: null, minute: null };
|
|
9394
|
-
const hour = Number(match2[1]);
|
|
9395
|
-
const minute = Number(match2[2]);
|
|
9396
|
-
if (Number.isNaN(hour) || Number.isNaN(minute) || hour < 0 || hour > 23 || minute < 0 || minute > 59)
|
|
9397
|
-
return { hour: null, minute: null };
|
|
9398
|
-
return { hour, minute };
|
|
9399
|
-
};
|
|
9400
|
-
var scrollToSelected = (viewport) => {
|
|
9401
|
-
if (!viewport) return;
|
|
9402
|
-
requestAnimationFrame(() => {
|
|
9403
|
-
const selected = viewport.querySelector('[aria-selected="true"]');
|
|
9404
|
-
selected?.scrollIntoView({ block: "center" });
|
|
9405
|
-
});
|
|
9406
|
-
};
|
|
9407
|
-
var HOURS = Array.from({ length: 24 }, (_, i) => i);
|
|
9408
|
-
var MINUTES = Array.from({ length: 60 }, (_, i) => i);
|
|
9409
|
-
var TimePicker = ({
|
|
9410
|
-
align = "end",
|
|
9411
|
-
alignOffset = -18,
|
|
9412
|
-
children,
|
|
9413
|
-
defaultOpen,
|
|
9414
|
-
defaultSelected,
|
|
9415
|
-
onOpenChange,
|
|
9416
|
-
onSelect,
|
|
9417
|
-
open,
|
|
9418
|
-
selected,
|
|
9419
|
-
sideOffset = 12
|
|
9420
|
-
}) => {
|
|
9421
|
-
const [internalSelected, setInternalSelected] = React27.useState(defaultSelected ?? null);
|
|
9422
|
-
const isControlled = selected !== void 0;
|
|
9423
|
-
const currentValue = isControlled ? selected : internalSelected;
|
|
9424
|
-
const parsed = parseTime(currentValue);
|
|
9425
|
-
const hour = parsed.hour ?? null;
|
|
9426
|
-
const minute = parsed.minute ?? null;
|
|
9427
|
-
const handleSelect = (time) => {
|
|
9428
|
-
if (!isControlled) {
|
|
9429
|
-
setInternalSelected(time);
|
|
9430
|
-
}
|
|
9431
|
-
onSelect?.(time);
|
|
9432
|
-
};
|
|
9433
|
-
const handleHourSelect = (h) => {
|
|
9434
|
-
const m = minute ?? 0;
|
|
9435
|
-
handleSelect(`${pad(h)}:${pad(m)}`);
|
|
9436
|
-
};
|
|
9437
|
-
const handleMinuteSelect = (m) => {
|
|
9438
|
-
const h = hour ?? 0;
|
|
9439
|
-
handleSelect(`${pad(h)}:${pad(m)}`);
|
|
9440
|
-
};
|
|
9441
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { defaultOpen, onOpenChange, open, children: [
|
|
9442
|
-
/* @__PURE__ */ jsxRuntime.jsx(Popover.Trigger, { asChild: true, children }),
|
|
9443
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
9444
|
-
Popover.Content,
|
|
9445
|
-
{
|
|
9446
|
-
align,
|
|
9447
|
-
alignOffset,
|
|
9448
|
-
sideOffset,
|
|
9449
|
-
className: "tw-flex tw-flex-row",
|
|
9450
|
-
children: [
|
|
9451
|
-
/* @__PURE__ */ jsxRuntime.jsx(ScrollArea, { type: "always", ref: scrollToSelected, viewPortClassName: "tw-h-60 tw-px-3", children: HOURS.map((value) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
9452
|
-
TimePickerButton,
|
|
9453
|
-
{
|
|
9454
|
-
onClick: () => handleHourSelect(value),
|
|
9455
|
-
"aria-selected": value === hour,
|
|
9456
|
-
children: pad(value)
|
|
9457
|
-
},
|
|
9458
|
-
value
|
|
9459
|
-
)) }),
|
|
9460
|
-
/* @__PURE__ */ jsxRuntime.jsx(ScrollArea, { type: "always", ref: scrollToSelected, viewPortClassName: "tw-h-60 tw-px-3", children: MINUTES.map((value) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
9461
|
-
TimePickerButton,
|
|
9462
|
-
{
|
|
9463
|
-
onClick: () => handleMinuteSelect(value),
|
|
9464
|
-
"aria-selected": value === minute,
|
|
9465
|
-
children: pad(value)
|
|
9466
|
-
},
|
|
9467
|
-
value
|
|
9468
|
-
)) })
|
|
9469
|
-
]
|
|
9470
|
-
}
|
|
9471
|
-
)
|
|
9472
|
-
] });
|
|
9473
|
-
};
|
|
9474
|
-
var TimeInput = ({
|
|
9475
|
-
ref,
|
|
9476
|
-
defaultValue,
|
|
9477
|
-
disabled,
|
|
9478
|
-
onBlur,
|
|
9479
|
-
onChange,
|
|
9480
|
-
onValueBlur,
|
|
9481
|
-
onValueChange,
|
|
9482
|
-
placeholder = "Select time",
|
|
9483
|
-
readOnly,
|
|
9484
|
-
value,
|
|
9485
|
-
variant,
|
|
9486
|
-
className,
|
|
9487
|
-
...props
|
|
9488
|
-
}) => {
|
|
9489
|
-
const [isOpen, setIsOpen] = React27.useState(false);
|
|
9490
|
-
const [internalValue, setInternalValue] = React27.useState(defaultValue ?? null);
|
|
9491
|
-
const isControlled = value !== void 0;
|
|
9492
|
-
const currentValue = isControlled ? value : internalValue;
|
|
9493
|
-
const handleChange = (event) => {
|
|
9494
|
-
const newValue = event.target.value || null;
|
|
9495
|
-
onChange?.(event);
|
|
9496
|
-
onValueChange?.(newValue);
|
|
9497
|
-
if (!isControlled) {
|
|
9498
|
-
setInternalValue(newValue);
|
|
9499
|
-
}
|
|
9500
|
-
};
|
|
9501
|
-
const handleBlur = (event) => {
|
|
9502
|
-
const newValue = event.target.value || null;
|
|
9503
|
-
onBlur?.(event);
|
|
9504
|
-
onValueBlur?.(newValue);
|
|
9505
|
-
if (!isControlled) {
|
|
9506
|
-
setInternalValue(newValue);
|
|
9507
|
-
}
|
|
9508
|
-
};
|
|
9509
|
-
const handleTimePickerSelect = (time) => {
|
|
9510
|
-
if (!isControlled) setInternalValue(time);
|
|
9511
|
-
onValueChange?.(time);
|
|
9512
|
-
};
|
|
9513
|
-
const handleClear = () => {
|
|
9514
|
-
if (!isControlled) setInternalValue(null);
|
|
9515
|
-
onValueChange?.(null);
|
|
9516
|
-
};
|
|
9517
|
-
const handleOpenChange = (open) => {
|
|
9518
|
-
setIsOpen(open);
|
|
9519
|
-
};
|
|
9520
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
9521
|
-
Input,
|
|
9522
|
-
{
|
|
9523
|
-
...props,
|
|
9524
|
-
ref,
|
|
9525
|
-
type: "time",
|
|
9526
|
-
disabled,
|
|
9527
|
-
readOnly,
|
|
9528
|
-
placeholder,
|
|
9529
|
-
className: cn("[&_input::-webkit-calendar-picker-indicator]:tw-hidden", className),
|
|
9530
|
-
value: currentValue,
|
|
9531
|
-
variant,
|
|
9532
|
-
onChange: handleChange,
|
|
9533
|
-
onBlur: handleBlur,
|
|
9534
|
-
onClear: currentValue ? handleClear : void 0,
|
|
9535
|
-
rightSuffix: !disabled && !readOnly ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
9536
|
-
TimePicker,
|
|
9537
|
-
{
|
|
9538
|
-
open: isOpen,
|
|
9539
|
-
onOpenChange: handleOpenChange,
|
|
9540
|
-
onSelect: handleTimePickerSelect,
|
|
9541
|
-
selected: currentValue,
|
|
9542
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(Button, { "aria-label": "Select Time", variant: "inline", size: "icon-3xs", children: /* @__PURE__ */ jsxRuntime.jsx(icons_exports.Clock, { className: "tw-size-4" }) })
|
|
9543
|
-
}
|
|
9544
|
-
) : void 0
|
|
9545
|
-
}
|
|
9546
|
-
);
|
|
9547
|
-
};
|
|
9548
9361
|
var CommandInput = ({
|
|
9549
9362
|
ref,
|
|
9550
9363
|
className,
|
|
@@ -9803,6 +9616,97 @@ var DateRangePicker = ({
|
|
|
9803
9616
|
] }) })
|
|
9804
9617
|
] });
|
|
9805
9618
|
DateRangePicker.displayName = "DateRangePicker";
|
|
9619
|
+
|
|
9620
|
+
// src/components/TimePicker/utils.ts
|
|
9621
|
+
var pad = (n) => n.toString().padStart(2, "0");
|
|
9622
|
+
var parseTime = (time) => {
|
|
9623
|
+
if (!time) return { hour: null, minute: null };
|
|
9624
|
+
const match2 = /^(\d{1,2}):(\d{1,2})$/.exec(time.trim());
|
|
9625
|
+
if (!match2) return { hour: null, minute: null };
|
|
9626
|
+
const hour = Number(match2[1]);
|
|
9627
|
+
const minute = Number(match2[2]);
|
|
9628
|
+
if (Number.isNaN(hour) || Number.isNaN(minute) || hour < 0 || hour > 23 || minute < 0 || minute > 59)
|
|
9629
|
+
return { hour: null, minute: null };
|
|
9630
|
+
return { hour, minute };
|
|
9631
|
+
};
|
|
9632
|
+
var scrollToSelected = (viewport) => {
|
|
9633
|
+
if (!viewport) return;
|
|
9634
|
+
requestAnimationFrame(() => {
|
|
9635
|
+
const selected = viewport.querySelector('[aria-pressed="true"]');
|
|
9636
|
+
selected?.scrollIntoView({ block: "center" });
|
|
9637
|
+
});
|
|
9638
|
+
};
|
|
9639
|
+
var HOURS = Array.from({ length: 24 }, (_, i) => i);
|
|
9640
|
+
var MINUTES = Array.from({ length: 60 }, (_, i) => i);
|
|
9641
|
+
var TimePicker = ({
|
|
9642
|
+
align = "end",
|
|
9643
|
+
alignOffset = -18,
|
|
9644
|
+
children,
|
|
9645
|
+
defaultOpen,
|
|
9646
|
+
defaultSelected,
|
|
9647
|
+
onOpenChange,
|
|
9648
|
+
onSelect,
|
|
9649
|
+
open,
|
|
9650
|
+
selected,
|
|
9651
|
+
sideOffset = 12
|
|
9652
|
+
}) => {
|
|
9653
|
+
const [internalSelected, setInternalSelected] = React27.useState(defaultSelected ?? null);
|
|
9654
|
+
const isControlled = selected !== void 0;
|
|
9655
|
+
const currentValue = isControlled ? selected : internalSelected;
|
|
9656
|
+
const parsed = parseTime(currentValue);
|
|
9657
|
+
const hour = parsed.hour ?? null;
|
|
9658
|
+
const minute = parsed.minute ?? null;
|
|
9659
|
+
const handleSelect = (time) => {
|
|
9660
|
+
if (!isControlled) {
|
|
9661
|
+
setInternalSelected(time);
|
|
9662
|
+
}
|
|
9663
|
+
onSelect?.(time);
|
|
9664
|
+
};
|
|
9665
|
+
const handleHourSelect = (h) => {
|
|
9666
|
+
const m = minute ?? 0;
|
|
9667
|
+
handleSelect(`${pad(h)}:${pad(m)}`);
|
|
9668
|
+
};
|
|
9669
|
+
const handleMinuteSelect = (m) => {
|
|
9670
|
+
const h = hour ?? 0;
|
|
9671
|
+
handleSelect(`${pad(h)}:${pad(m)}`);
|
|
9672
|
+
};
|
|
9673
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { defaultOpen, onOpenChange, open, children: [
|
|
9674
|
+
/* @__PURE__ */ jsxRuntime.jsx(Popover.Trigger, { asChild: true, children }),
|
|
9675
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
9676
|
+
Popover.Content,
|
|
9677
|
+
{
|
|
9678
|
+
align,
|
|
9679
|
+
alignOffset,
|
|
9680
|
+
sideOffset,
|
|
9681
|
+
className: "tw-flex tw-flex-row",
|
|
9682
|
+
children: [
|
|
9683
|
+
/* @__PURE__ */ jsxRuntime.jsx(ScrollArea, { type: "always", ref: scrollToSelected, viewPortClassName: "tw-h-60 tw-p-3", children: HOURS.map((value) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
9684
|
+
Toggle,
|
|
9685
|
+
{
|
|
9686
|
+
variant: "ghost",
|
|
9687
|
+
className: "tw-size-10 tw-p-0",
|
|
9688
|
+
pressed: value === hour,
|
|
9689
|
+
onPressedChange: () => handleHourSelect(value),
|
|
9690
|
+
children: pad(value)
|
|
9691
|
+
},
|
|
9692
|
+
value
|
|
9693
|
+
)) }),
|
|
9694
|
+
/* @__PURE__ */ jsxRuntime.jsx(ScrollArea, { type: "always", ref: scrollToSelected, viewPortClassName: "tw-h-60 tw-p-3", children: MINUTES.map((value) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
9695
|
+
Toggle,
|
|
9696
|
+
{
|
|
9697
|
+
variant: "ghost",
|
|
9698
|
+
className: "tw-size-10 tw-p-0",
|
|
9699
|
+
pressed: value === minute,
|
|
9700
|
+
onPressedChange: () => handleMinuteSelect(value),
|
|
9701
|
+
children: pad(value)
|
|
9702
|
+
},
|
|
9703
|
+
value
|
|
9704
|
+
)) })
|
|
9705
|
+
]
|
|
9706
|
+
}
|
|
9707
|
+
)
|
|
9708
|
+
] });
|
|
9709
|
+
};
|
|
9806
9710
|
var Optional = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("tw-text-muted-foreground", className), children: "(optional)" });
|
|
9807
9711
|
var Label2 = ({ className, children, id, htmlFor, ...rest }) => {
|
|
9808
9712
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -11124,10 +11028,10 @@ var variants4 = classVarianceAuthority.cva(
|
|
|
11124
11028
|
]
|
|
11125
11029
|
},
|
|
11126
11030
|
sizing: {
|
|
11127
|
-
// border-inclusive heights: 40 / 36 /
|
|
11031
|
+
// border-inclusive heights: 40 / 36 / 32 px (small matches Button small)
|
|
11128
11032
|
default: ["tw-px-4", "tw-py-2.5", "tw-text-sm/[18px]", "tw-h-10", "tw-min-h-10"],
|
|
11129
11033
|
medium: ["tw-px-4", "tw-py-2", "tw-text-sm/[18px]", "tw-h-9", "tw-min-h-9"],
|
|
11130
|
-
small: ["tw-px-4", "tw-py-2", "tw-text-sm/[16px]", "tw-h-
|
|
11034
|
+
small: ["tw-px-4", "tw-py-2", "tw-text-sm/[16px]", "tw-h-8", "tw-min-h-8"]
|
|
11131
11035
|
},
|
|
11132
11036
|
state: {
|
|
11133
11037
|
default: [
|
|
@@ -11347,7 +11251,7 @@ function Checkbox({
|
|
|
11347
11251
|
description && /* @__PURE__ */ jsxRuntime.jsx(FieldBox.Description, { children: description })
|
|
11348
11252
|
] });
|
|
11349
11253
|
if (!tooltip) return rendered;
|
|
11350
|
-
return /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { tooltip, placement: tooltipPlacement, triggerAsChild:
|
|
11254
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { tooltip, placement: tooltipPlacement, triggerAsChild: !!children, children: rendered });
|
|
11351
11255
|
}
|
|
11352
11256
|
var addonVariants2 = classVarianceAuthority.cva(
|
|
11353
11257
|
[
|
|
@@ -12426,7 +12330,7 @@ var AutoSaveTextarea = ({
|
|
|
12426
12330
|
" Saving"
|
|
12427
12331
|
] }),
|
|
12428
12332
|
!isOverLimit && value !== null && !isChanged && !isSaving && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
12429
|
-
/* @__PURE__ */ jsxRuntime.jsx(icons_exports.CircleCheck, { className: "tw-size-4 tw-text-
|
|
12333
|
+
/* @__PURE__ */ jsxRuntime.jsx(icons_exports.CircleCheck, { className: "tw-size-4 tw-text-green-500" }),
|
|
12430
12334
|
" Saved"
|
|
12431
12335
|
] })
|
|
12432
12336
|
] })
|
|
@@ -12850,6 +12754,107 @@ var PasswordInput = ({
|
|
|
12850
12754
|
}
|
|
12851
12755
|
);
|
|
12852
12756
|
};
|
|
12757
|
+
var TimeInput = ({
|
|
12758
|
+
ref,
|
|
12759
|
+
// group props
|
|
12760
|
+
state,
|
|
12761
|
+
variant,
|
|
12762
|
+
focusVariant,
|
|
12763
|
+
sizing,
|
|
12764
|
+
className,
|
|
12765
|
+
// own props
|
|
12766
|
+
value: valueProp,
|
|
12767
|
+
defaultValue,
|
|
12768
|
+
onValueChange,
|
|
12769
|
+
onValueBlur,
|
|
12770
|
+
onChange,
|
|
12771
|
+
onBlur,
|
|
12772
|
+
allowClear = false,
|
|
12773
|
+
// input props
|
|
12774
|
+
disabled,
|
|
12775
|
+
readOnly,
|
|
12776
|
+
placeholder = "Select time",
|
|
12777
|
+
...restInputProps
|
|
12778
|
+
}) => {
|
|
12779
|
+
const inputRef = React27.useRef(null);
|
|
12780
|
+
const [isOpen, setIsOpen] = React27.useState(false);
|
|
12781
|
+
const [internalValue, setInternalValue] = React27.useState(defaultValue ?? null);
|
|
12782
|
+
const isControlled = valueProp !== void 0;
|
|
12783
|
+
const value = isControlled ? valueProp ?? null : internalValue;
|
|
12784
|
+
const setValue = (next) => {
|
|
12785
|
+
if (!isControlled) setInternalValue(next);
|
|
12786
|
+
onValueChange?.(next);
|
|
12787
|
+
};
|
|
12788
|
+
const canClear = allowClear && !!value && !disabled && !readOnly;
|
|
12789
|
+
const showPicker2 = !disabled && !readOnly;
|
|
12790
|
+
const handleChange = (event) => {
|
|
12791
|
+
setValue(event.target.value || null);
|
|
12792
|
+
onChange?.(event);
|
|
12793
|
+
};
|
|
12794
|
+
const handleBlur = (event) => {
|
|
12795
|
+
const newValue = event.target.value || null;
|
|
12796
|
+
if (!isControlled) setInternalValue(newValue);
|
|
12797
|
+
onValueBlur?.(newValue);
|
|
12798
|
+
onBlur?.(event);
|
|
12799
|
+
};
|
|
12800
|
+
const handleTimePickerSelect = (time) => {
|
|
12801
|
+
setValue(time);
|
|
12802
|
+
};
|
|
12803
|
+
const handleClear = () => {
|
|
12804
|
+
if (!inputRef.current) return;
|
|
12805
|
+
inputRef.current.value = "";
|
|
12806
|
+
setValue(null);
|
|
12807
|
+
onChange?.(createChangeInputEvent(inputRef.current));
|
|
12808
|
+
};
|
|
12809
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
12810
|
+
InputGroup,
|
|
12811
|
+
{
|
|
12812
|
+
state,
|
|
12813
|
+
variant,
|
|
12814
|
+
sizing,
|
|
12815
|
+
focusVariant,
|
|
12816
|
+
className,
|
|
12817
|
+
children: [
|
|
12818
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
12819
|
+
InputGroup.Input,
|
|
12820
|
+
{
|
|
12821
|
+
...restInputProps,
|
|
12822
|
+
ref: mergeRefs(ref ?? null, inputRef),
|
|
12823
|
+
type: "time",
|
|
12824
|
+
className: "[&::-webkit-calendar-picker-indicator]:tw-hidden [&::-webkit-datetime-edit-fields-wrapper]:tw-py-0",
|
|
12825
|
+
value: value ?? "",
|
|
12826
|
+
placeholder,
|
|
12827
|
+
onChange: handleChange,
|
|
12828
|
+
onBlur: handleBlur,
|
|
12829
|
+
disabled,
|
|
12830
|
+
readOnly
|
|
12831
|
+
}
|
|
12832
|
+
),
|
|
12833
|
+
(canClear || showPicker2) && /* @__PURE__ */ jsxRuntime.jsxs(InputGroup.Addon, { align: "inline-end", children: [
|
|
12834
|
+
canClear && /* @__PURE__ */ jsxRuntime.jsx(
|
|
12835
|
+
InputGroup.Button,
|
|
12836
|
+
{
|
|
12837
|
+
"aria-label": "Clear time",
|
|
12838
|
+
onMouseDown: (event) => event.preventDefault(),
|
|
12839
|
+
onClick: handleClear,
|
|
12840
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(icons_exports.X, { className: "tw-size-4" })
|
|
12841
|
+
}
|
|
12842
|
+
),
|
|
12843
|
+
showPicker2 && /* @__PURE__ */ jsxRuntime.jsx(
|
|
12844
|
+
TimePicker,
|
|
12845
|
+
{
|
|
12846
|
+
open: isOpen,
|
|
12847
|
+
onOpenChange: setIsOpen,
|
|
12848
|
+
onSelect: handleTimePickerSelect,
|
|
12849
|
+
selected: value,
|
|
12850
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(InputGroup.Button, { "aria-label": "Select time", children: /* @__PURE__ */ jsxRuntime.jsx(icons_exports.Clock, { className: "tw-size-4" }) })
|
|
12851
|
+
}
|
|
12852
|
+
)
|
|
12853
|
+
] })
|
|
12854
|
+
]
|
|
12855
|
+
}
|
|
12856
|
+
);
|
|
12857
|
+
};
|
|
12853
12858
|
var InputOtpVariantContext = React27.createContext({
|
|
12854
12859
|
sizing: "md",
|
|
12855
12860
|
state: "default"
|
|
@@ -16194,7 +16199,7 @@ var ThinkingIndicator = ({ label = "Thinking..." }) => {
|
|
|
16194
16199
|
// src/blocks/AIKit/usageStatsHelpers.ts
|
|
16195
16200
|
var clampPercentage = (value) => Number.isFinite(value) ? Math.min(100, Math.max(0, value)) : 0;
|
|
16196
16201
|
var UsageStatsRing = ({ value, size = 16, strokeWidth = 2.5, className }) => {
|
|
16197
|
-
const radius = Math.max(0, (size - strokeWidth) / 2);
|
|
16202
|
+
const radius = Math.max(0, (size - strokeWidth) / 2 - 1);
|
|
16198
16203
|
const circumference = 2 * Math.PI * radius;
|
|
16199
16204
|
const offset = circumference * (1 - clampPercentage(value) / 100);
|
|
16200
16205
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -16322,10 +16327,10 @@ var AlertCollapsibleIcon = ({ open }) => /* @__PURE__ */ jsxRuntime.jsx(Tooltip,
|
|
|
16322
16327
|
"tw-size-5",
|
|
16323
16328
|
"tw-text-neutral-400",
|
|
16324
16329
|
"group-data-[state=open]/alert:tw-rotate-180",
|
|
16325
|
-
"group-data-[variant=info]/alert:group-hover:tw-text-
|
|
16330
|
+
"group-data-[variant=info]/alert:group-hover:tw-text-blue-600",
|
|
16326
16331
|
"group-data-[variant=warning]/alert:group-hover:tw-text-warning-600",
|
|
16327
16332
|
"group-data-[variant=error]/alert:group-hover:tw-text-error-600",
|
|
16328
|
-
"group-data-[variant=success]/alert:group-hover:tw-text-
|
|
16333
|
+
"group-data-[variant=success]/alert:group-hover:tw-text-green-600"
|
|
16329
16334
|
)
|
|
16330
16335
|
}
|
|
16331
16336
|
) });
|
|
@@ -16373,10 +16378,10 @@ var AlertIcon = ({ variant, icon, className, ...rest }) => /* @__PURE__ */ jsxRu
|
|
|
16373
16378
|
"tw-self-start",
|
|
16374
16379
|
"tw-p-0.5",
|
|
16375
16380
|
'[&_svg:not([class*="tw-size-"])]:tw-size-4',
|
|
16376
|
-
"group-data-[variant=info]/alert:tw-text-
|
|
16381
|
+
"group-data-[variant=info]/alert:tw-text-blue-500",
|
|
16377
16382
|
"group-data-[variant=warning]/alert:tw-text-warning-500",
|
|
16378
16383
|
"group-data-[variant=error]/alert:tw-text-error-500",
|
|
16379
|
-
"group-data-[variant=success]/alert:tw-text-
|
|
16384
|
+
"group-data-[variant=success]/alert:tw-text-green-500",
|
|
16380
16385
|
className
|
|
16381
16386
|
),
|
|
16382
16387
|
children: icon ?? VARIANT_ICONS2[variant]
|
|
@@ -16415,19 +16420,18 @@ var AlertRoot = ({
|
|
|
16415
16420
|
"tw-text-left",
|
|
16416
16421
|
"tw-p-4",
|
|
16417
16422
|
// border
|
|
16418
|
-
"tw-rounded",
|
|
16419
|
-
"data-[argo=true]:tw-rounded-lg",
|
|
16423
|
+
"tw-rounded-[var(--radius-lg,0.25rem)]",
|
|
16420
16424
|
"tw-border",
|
|
16421
16425
|
"tw-border-solid",
|
|
16422
16426
|
// border variants
|
|
16423
|
-
"data-[variant=info]:tw-bg-
|
|
16424
|
-
"data-[variant=info]:tw-border-
|
|
16427
|
+
"data-[variant=info]:tw-bg-blue-100",
|
|
16428
|
+
"data-[variant=info]:tw-border-blue-200",
|
|
16425
16429
|
"data-[variant=warning]:tw-bg-warning-100",
|
|
16426
16430
|
"data-[variant=warning]:tw-border-warning-300",
|
|
16427
16431
|
"data-[variant=error]:tw-bg-error-100",
|
|
16428
16432
|
"data-[variant=error]:tw-border-error-200",
|
|
16429
|
-
"data-[variant=success]:tw-bg-
|
|
16430
|
-
"data-[variant=success]:tw-border-
|
|
16433
|
+
"data-[variant=success]:tw-bg-green-100",
|
|
16434
|
+
"data-[variant=success]:tw-border-green-200",
|
|
16431
16435
|
className
|
|
16432
16436
|
),
|
|
16433
16437
|
children
|
|
@@ -16687,8 +16691,8 @@ var variants6 = classVarianceAuthority.cva(
|
|
|
16687
16691
|
variant: {
|
|
16688
16692
|
default: "tw-border tw-border-border tw-bg-popover",
|
|
16689
16693
|
error: "tw-bg-error-550",
|
|
16690
|
-
info: "tw-bg-
|
|
16691
|
-
success: "tw-bg-
|
|
16694
|
+
info: "tw-bg-blue-600",
|
|
16695
|
+
success: "tw-bg-green-700",
|
|
16692
16696
|
warning: "tw-bg-warning-550"
|
|
16693
16697
|
}
|
|
16694
16698
|
}
|
|
@@ -17497,7 +17501,7 @@ var ThemeProvider = ({
|
|
|
17497
17501
|
}, [brand, resolvedMode]);
|
|
17498
17502
|
return /* @__PURE__ */ jsxRuntime.jsxs(ThemeContext, { value: { brand, setBrand, colorScheme, resolvedMode }, children: [
|
|
17499
17503
|
isRoot && /* @__PURE__ */ jsxRuntime.jsx(AIGradientsSvg, {}),
|
|
17500
|
-
children
|
|
17504
|
+
isRoot ? /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { children }) : children
|
|
17501
17505
|
] });
|
|
17502
17506
|
};
|
|
17503
17507
|
var useTheme = () => {
|
|
@@ -20371,7 +20375,9 @@ var Table = ({
|
|
|
20371
20375
|
"table",
|
|
20372
20376
|
{
|
|
20373
20377
|
className: cn(
|
|
20374
|
-
|
|
20378
|
+
// `tw-text-foreground` (a semantic token) so header + cell text flips
|
|
20379
|
+
// under `[data-theme='dark']` instead of inheriting a fixed dark color.
|
|
20380
|
+
"tw-w-full tw-caption-bottom tw-text-sm tw-text-foreground",
|
|
20375
20381
|
borderCollapsed ? "tw-border-collapse" : "tw-border-separate tw-border-spacing-y-1",
|
|
20376
20382
|
className
|
|
20377
20383
|
),
|
|
@@ -21143,7 +21149,7 @@ var PaneHeader = ({ label, sublabel }) => /* @__PURE__ */ jsxRuntime.jsxs("div",
|
|
|
21143
21149
|
var ConflictStatusIndicator = ({ remainingConflicts, remainingSafeChanges }) => {
|
|
21144
21150
|
const hasConflicts = remainingConflicts > 0;
|
|
21145
21151
|
const allDone = !hasConflicts && remainingSafeChanges === 0;
|
|
21146
|
-
const colorClass = hasConflicts ? "tw-text-warning-500" : allDone ? "tw-text-
|
|
21152
|
+
const colorClass = hasConflicts ? "tw-text-warning-500" : allDone ? "tw-text-green-500" : "tw-text-muted-foreground";
|
|
21147
21153
|
const parts = [];
|
|
21148
21154
|
if (hasConflicts) {
|
|
21149
21155
|
parts.push(`${remainingConflicts} conflict${remainingConflicts !== 1 ? "s" : ""}`);
|