@keboola/design 6.0.0 → 6.2.0

package/dist/rjsf.js

@@ -793,6 +793,7 @@ var Clipboard = ({
   ] });
 };
 var DEFAULT_ICON = /* @__PURE__ */ jsx(icons_exports.Copy, {});
+var DEFAULT_ARIA_LABEL = "Copy";
 var ClipboardButton = ({
   // clipboard props
   text,
@@ -804,20 +805,24 @@ var ClipboardButton = ({
   variant = "outline",
   children,
   ...rest
-}) => /* @__PURE__ */ jsx(
-  Clipboard,
-  {
-    asChild: true,
-    tooltip,
-    tooltipPlacement,
-    tooltipVariant,
-    text,
-    children: /* @__PURE__ */ jsxs(Button, { ...rest, variant, disabled: !text, children: [
-      icon,
-      children
-    ] })
-  }
-);
+}) => {
+  const defaultAriaLabel = typeof tooltip === "string" && tooltip.trim() ? tooltip : DEFAULT_ARIA_LABEL;
+  const ariaLabel = rest["aria-label"] ?? (children == null ? defaultAriaLabel : void 0);
+  return /* @__PURE__ */ jsx(
+    Clipboard,
+    {
+      asChild: true,
+      tooltip,
+      tooltipPlacement,
+      tooltipVariant,
+      text,
+      children: /* @__PURE__ */ jsxs(Button, { ...rest, "aria-label": ariaLabel, variant, disabled: !text, children: [
+        icon,
+        children
+      ] })
+    }
+  );
+};
 var ButtonToolbar = ({ value, children }) => {
   if (!value && !children) return null;
   return /* @__PURE__ */ jsxs("div", { className: "tw-pointer-events-auto tw-ml-auto tw-mr-4 tw-flex tw-w-fit tw-gap-1 tw-overflow-visible tw-rounded-lg tw-border tw-border-solid tw-border-border !tw-bg-background tw-p-[3px] tw-shadow", children: [
@@ -1260,9 +1265,7 @@ var headerVariants = cva(
     variants: {
       variant: {
         default: "tw-bg-muted",
-        // White surface kept literal until a `card` token exists (UT-4396);
-        // `background` is the page base, not an elevated panel surface.
-        white: "tw-bg-white"
+        white: "tw-bg-card"
       },
       isDisabled: {
         true: "tw-cursor-not-allowed tw-opacity-50",
@@ -1327,7 +1330,7 @@ var CollapsiblePanel = ({
     {
       open,
       className: cn(
-        "tw-rounded !tw-border !tw-border-solid !tw-border-border tw-bg-white",
+        "tw-rounded !tw-border !tw-border-solid !tw-border-border tw-bg-card",
         className
       ),
       header: /* @__PURE__ */ jsxs(
@@ -8320,23 +8323,23 @@ var BadgeLabel = ({
 var badgeColors = {
   gray: "tw-bg-neutral-400 tw-text-white tw-decoration-neutral-400",
   "gray-darker": "tw-bg-neutral-500 tw-text-white tw-decoration-neutral-500",
-  "gray-inverse": "tw-bg-neutral-100 tw-text-neutral-400 tw-decoration-neutral-100",
+  "gray-inverse": "tw-bg-neutral-100 tw-text-neutral-400 tw-decoration-neutral-100 [[data-theme=dark]_&]:tw-bg-neutral-800 [[data-theme=dark]_&]:tw-text-neutral-300 [[data-theme=dark]_&]:tw-decoration-neutral-800",
   green: "tw-bg-green-500 tw-text-white tw-decoration-green-500",
   "green-darker": "tw-bg-green-600 tw-text-white tw-decoration-green-600",
-  "green-inverse": "tw-bg-green-100 tw-text-green-900 tw-decoration-green-100",
+  "green-inverse": "tw-bg-green-100 tw-text-green-900 tw-decoration-green-100 [[data-theme=dark]_&]:tw-bg-green-900 [[data-theme=dark]_&]:tw-text-green-200 [[data-theme=dark]_&]:tw-decoration-green-900",
   blue: "tw-bg-blue-500 tw-text-white tw-decoration-blue-500",
-  "blue-inverse": "tw-bg-blue-100 tw-text-blue-600 tw-decoration-blue-100",
+  "blue-inverse": "tw-bg-blue-100 tw-text-blue-600 tw-decoration-blue-100 [[data-theme=dark]_&]:tw-bg-blue-900 [[data-theme=dark]_&]:tw-text-blue-200 [[data-theme=dark]_&]:tw-decoration-blue-900",
   red: "tw-bg-error-500 tw-text-white tw-decoration-error-500",
   orange: "tw-bg-warning-500 tw-text-white tw-decoration-warning-500",
-  "orange-inverse": "tw-bg-warning-100 tw-text-warning-500 tw-decoration-warning-100",
+  "orange-inverse": "tw-bg-warning-100 tw-text-warning-500 tw-decoration-warning-100 [[data-theme=dark]_&]:tw-bg-warning-900 [[data-theme=dark]_&]:tw-text-warning-200 [[data-theme=dark]_&]:tw-decoration-warning-900",
   amber: "tw-bg-warning-300 tw-text-warning-800 tw-decoration-warning-300",
   "amber-inverse": "tw-bg-warning-100 tw-text-warning-700 tw-decoration-warning-100",
   teal: "tw-bg-teal-500 tw-text-white tw-decoration-teal-500",
-  "teal-inverse": "tw-bg-teal-100 tw-text-teal-800 tw-decoration-teal-100",
+  "teal-inverse": "tw-bg-teal-100 tw-text-teal-800 tw-decoration-teal-100 [[data-theme=dark]_&]:tw-bg-teal-900 [[data-theme=dark]_&]:tw-text-teal-200 [[data-theme=dark]_&]:tw-decoration-teal-900",
   purple: "tw-bg-purple-500 tw-text-white tw-decoration-purple-500",
-  "purple-inverse": "tw-bg-purple-100 tw-text-purple-800 tw-decoration-purple-100",
+  "purple-inverse": "tw-bg-purple-100 tw-text-purple-800 tw-decoration-purple-100 [[data-theme=dark]_&]:tw-bg-purple-900 [[data-theme=dark]_&]:tw-text-purple-200 [[data-theme=dark]_&]:tw-decoration-purple-900",
   cyan: "tw-bg-cyan-500 tw-text-white tw-decoration-cyan-500",
-  "cyan-inverse": "tw-bg-cyan-100 tw-text-cyan-800 tw-decoration-cyan-100",
+  "cyan-inverse": "tw-bg-cyan-100 tw-text-cyan-800 tw-decoration-cyan-100 [[data-theme=dark]_&]:tw-bg-cyan-900 [[data-theme=dark]_&]:tw-text-cyan-200 [[data-theme=dark]_&]:tw-decoration-cyan-900",
   "sidebar-primary": "tw-bg-sidebar-primary tw-text-white tw-decoration-sidebar-primary",
   white: "tw-bg-white/90 tw-text-neutral-600 tw-decoration-white/90"
 };
@@ -9045,14 +9048,18 @@ var DynamicSelectWidget = ({
   const data = useRootFormData();
   const watch = widgetOptions.watch;
   const enumSource = widgetOptions.enumSource;
-  const items = watch ? buildDynamicOptions(watch, enumSource, data) : [];
-  const selectedItem = items.find((item) => item.value === (value == null ? "" : String(value)));
+  const dynamicItems = watch ? buildDynamicOptions(watch, enumSource, data) : [];
+  const stringValue = value == null ? "" : String(value);
+  const matched = dynamicItems.find((item) => item.value === stringValue);
+  const fallbackItem = !matched && stringValue !== "" ? { value: stringValue, label: stringValue } : null;
+  const selectedItem = matched ?? fallbackItem;
+  const items = fallbackItem ? [fallbackItem, ...dynamicItems] : dynamicItems;
   return /* @__PURE__ */ jsx(
     Combobox,
     {
       variant: "secondary",
       items,
-      value: selectedItem ?? null,
+      value: selectedItem,
       disabled: disabled || readonly,
       onValueChange: (selected) => onChange(selected?.value ?? "")
     }