@keboola/design 4.3.1 → 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/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",
@@ -2310,7 +2310,10 @@ var DropdownMenuRadioItem = ({
2310
2310
  "data-[state=checked]:tw-cursor-default",
2311
2311
  {
2312
2312
  "data-[state=checked]:tw-bg-neutral-100": indicator === "none",
2313
- "group-data-[variant=argo]/dropdown-menu-content:data-[state=checked]:tw-bg-sky-100": indicator === "check"
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"
2314
2317
  },
2315
2318
  className
2316
2319
  ),
@@ -2900,10 +2903,10 @@ var AlertModalIcon = ({ variant, icon }) => {
2900
2903
  "div",
2901
2904
  {
2902
2905
  className: cn("tw-relative", "tw-rounded-full", "tw-size-12", {
2903
- "tw-bg-secondary-500": variant === "info",
2906
+ "tw-bg-blue-500": variant === "info",
2904
2907
  "tw-bg-warning-500": variant === "warning",
2905
2908
  "tw-bg-error-500": variant === "danger",
2906
- "tw-bg-primary-500": variant === "success"
2909
+ "tw-bg-green-500": variant === "success"
2907
2910
  }),
2908
2911
  children: /* @__PURE__ */ jsxRuntime.jsx(
2909
2912
  "span",
@@ -2943,10 +2946,10 @@ var AlertModalIcon = ({ variant, icon }) => {
2943
2946
  "tw-size-8",
2944
2947
  '[&_svg:not([class*="tw-size-"])]:tw-size-5',
2945
2948
  {
2946
- "tw-bg-secondary-100 tw-text-secondary-600": variant === "info",
2949
+ "tw-bg-blue-100 tw-text-blue-600": variant === "info",
2947
2950
  "tw-bg-warning-100 tw-text-warning-500": variant === "warning",
2948
2951
  "tw-bg-error-100 tw-text-error-500": variant === "danger",
2949
- "tw-bg-primary-100 tw-text-primary-900": variant === "success"
2952
+ "tw-bg-green-100 tw-text-green-900": variant === "success"
2950
2953
  }
2951
2954
  ),
2952
2955
  children: glyph
@@ -3441,8 +3444,8 @@ var ModalIcon = (props) => {
3441
3444
  {
3442
3445
  className: cn("tw-relative", "tw-rounded-full", "tw-size-12", {
3443
3446
  "tw-bg-warning-500": props.color === "orange",
3444
- "tw-bg-secondary-500": props.color === "blue",
3445
- "tw-bg-primary-500": props.color === "green",
3447
+ "tw-bg-blue-500": props.color === "blue",
3448
+ "tw-bg-green-500": props.color === "green",
3446
3449
  "tw-bg-error-500": props.color === "red",
3447
3450
  "tw-bg-neutral-150": props.color === "gray",
3448
3451
  "tw-bg-purple-100": props.color === "violet"
@@ -8729,7 +8732,7 @@ var inputGroupVariants = classVarianceAuthority.cva(
8729
8732
  "tw-flex",
8730
8733
  "tw-items-center",
8731
8734
  // base
8732
- "tw-rounded",
8735
+ "tw-rounded-[var(--radius-lg,0.25rem)]",
8733
8736
  "tw-border",
8734
8737
  "tw-border-solid",
8735
8738
  "tw-border-neutral-200",
@@ -8850,7 +8853,6 @@ var inputGroupVariants = classVarianceAuthority.cva(
8850
8853
  // muted filled input surface — gray, distinct from white containers; not the app-background token
8851
8854
  "tw-bg-muted",
8852
8855
  "tw-border-input",
8853
- "tw-rounded-lg",
8854
8856
  "tw-text-foreground",
8855
8857
  "has-[:is(input,textarea):disabled]:tw-opacity-50",
8856
8858
  // higher specificity than has-[:is(input,textarea):focus] — prevents focus border on readonly
@@ -11249,7 +11251,7 @@ function Checkbox({
11249
11251
  description && /* @__PURE__ */ jsxRuntime.jsx(FieldBox.Description, { children: description })
11250
11252
  ] });
11251
11253
  if (!tooltip) return rendered;
11252
- return /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { tooltip, placement: tooltipPlacement, triggerAsChild: true, children: rendered });
11254
+ return /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { tooltip, placement: tooltipPlacement, triggerAsChild: !!children, children: rendered });
11253
11255
  }
11254
11256
  var addonVariants2 = classVarianceAuthority.cva(
11255
11257
  [
@@ -12328,7 +12330,7 @@ var AutoSaveTextarea = ({
12328
12330
  " Saving"
12329
12331
  ] }),
12330
12332
  !isOverLimit && value !== null && !isChanged && !isSaving && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
12331
- /* @__PURE__ */ jsxRuntime.jsx(icons_exports.CircleCheck, { className: "tw-size-4 tw-text-primary-500" }),
12333
+ /* @__PURE__ */ jsxRuntime.jsx(icons_exports.CircleCheck, { className: "tw-size-4 tw-text-green-500" }),
12332
12334
  " Saved"
12333
12335
  ] })
12334
12336
  ] })
@@ -16197,7 +16199,7 @@ var ThinkingIndicator = ({ label = "Thinking..." }) => {
16197
16199
  // src/blocks/AIKit/usageStatsHelpers.ts
16198
16200
  var clampPercentage = (value) => Number.isFinite(value) ? Math.min(100, Math.max(0, value)) : 0;
16199
16201
  var UsageStatsRing = ({ value, size = 16, strokeWidth = 2.5, className }) => {
16200
- const radius = Math.max(0, (size - strokeWidth) / 2);
16202
+ const radius = Math.max(0, (size - strokeWidth) / 2 - 1);
16201
16203
  const circumference = 2 * Math.PI * radius;
16202
16204
  const offset = circumference * (1 - clampPercentage(value) / 100);
16203
16205
  return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -16325,10 +16327,10 @@ var AlertCollapsibleIcon = ({ open }) => /* @__PURE__ */ jsxRuntime.jsx(Tooltip,
16325
16327
  "tw-size-5",
16326
16328
  "tw-text-neutral-400",
16327
16329
  "group-data-[state=open]/alert:tw-rotate-180",
16328
- "group-data-[variant=info]/alert:group-hover:tw-text-secondary-600",
16330
+ "group-data-[variant=info]/alert:group-hover:tw-text-blue-600",
16329
16331
  "group-data-[variant=warning]/alert:group-hover:tw-text-warning-600",
16330
16332
  "group-data-[variant=error]/alert:group-hover:tw-text-error-600",
16331
- "group-data-[variant=success]/alert:group-hover:tw-text-primary-600"
16333
+ "group-data-[variant=success]/alert:group-hover:tw-text-green-600"
16332
16334
  )
16333
16335
  }
16334
16336
  ) });
@@ -16376,10 +16378,10 @@ var AlertIcon = ({ variant, icon, className, ...rest }) => /* @__PURE__ */ jsxRu
16376
16378
  "tw-self-start",
16377
16379
  "tw-p-0.5",
16378
16380
  '[&_svg:not([class*="tw-size-"])]:tw-size-4',
16379
- "group-data-[variant=info]/alert:tw-text-secondary-500",
16381
+ "group-data-[variant=info]/alert:tw-text-blue-500",
16380
16382
  "group-data-[variant=warning]/alert:tw-text-warning-500",
16381
16383
  "group-data-[variant=error]/alert:tw-text-error-500",
16382
- "group-data-[variant=success]/alert:tw-text-primary-500",
16384
+ "group-data-[variant=success]/alert:tw-text-green-500",
16383
16385
  className
16384
16386
  ),
16385
16387
  children: icon ?? VARIANT_ICONS2[variant]
@@ -16418,19 +16420,18 @@ var AlertRoot = ({
16418
16420
  "tw-text-left",
16419
16421
  "tw-p-4",
16420
16422
  // border
16421
- "tw-rounded",
16422
- "data-[argo=true]:tw-rounded-lg",
16423
+ "tw-rounded-[var(--radius-lg,0.25rem)]",
16423
16424
  "tw-border",
16424
16425
  "tw-border-solid",
16425
16426
  // border variants
16426
- "data-[variant=info]:tw-bg-secondary-100",
16427
- "data-[variant=info]:tw-border-secondary-200",
16427
+ "data-[variant=info]:tw-bg-blue-100",
16428
+ "data-[variant=info]:tw-border-blue-200",
16428
16429
  "data-[variant=warning]:tw-bg-warning-100",
16429
16430
  "data-[variant=warning]:tw-border-warning-300",
16430
16431
  "data-[variant=error]:tw-bg-error-100",
16431
16432
  "data-[variant=error]:tw-border-error-200",
16432
- "data-[variant=success]:tw-bg-primary-100",
16433
- "data-[variant=success]:tw-border-primary-200",
16433
+ "data-[variant=success]:tw-bg-green-100",
16434
+ "data-[variant=success]:tw-border-green-200",
16434
16435
  className
16435
16436
  ),
16436
16437
  children
@@ -16690,8 +16691,8 @@ var variants6 = classVarianceAuthority.cva(
16690
16691
  variant: {
16691
16692
  default: "tw-border tw-border-border tw-bg-popover",
16692
16693
  error: "tw-bg-error-550",
16693
- info: "tw-bg-secondary-600",
16694
- success: "tw-bg-primary-700",
16694
+ info: "tw-bg-blue-600",
16695
+ success: "tw-bg-green-700",
16695
16696
  warning: "tw-bg-warning-550"
16696
16697
  }
16697
16698
  }
@@ -21148,7 +21149,7 @@ var PaneHeader = ({ label, sublabel }) => /* @__PURE__ */ jsxRuntime.jsxs("div",
21148
21149
  var ConflictStatusIndicator = ({ remainingConflicts, remainingSafeChanges }) => {
21149
21150
  const hasConflicts = remainingConflicts > 0;
21150
21151
  const allDone = !hasConflicts && remainingSafeChanges === 0;
21151
- const colorClass = hasConflicts ? "tw-text-warning-500" : allDone ? "tw-text-primary-500" : "tw-text-muted-foreground";
21152
+ const colorClass = hasConflicts ? "tw-text-warning-500" : allDone ? "tw-text-green-500" : "tw-text-muted-foreground";
21152
21153
  const parts = [];
21153
21154
  if (hasConflicts) {
21154
21155
  parts.push(`${remainingConflicts} conflict${remainingConflicts !== 1 ? "s" : ""}`);