@keboola/design 6.0.0 → 6.2.0

package/dist/markdown-editor.cjs

@@ -1072,13 +1072,14 @@ var init_Clipboard2 = __esm({
     init_Clipboard();
   }
 });
-var DEFAULT_ICON, ClipboardButton;
+var DEFAULT_ICON, DEFAULT_ARIA_LABEL, ClipboardButton;
 var init_ClipboardButton = __esm({
   "src/blocks/ClipboardButton/ClipboardButton.tsx"() {
     init_Button2();
     init_Clipboard2();
     init_icons();
     DEFAULT_ICON = /* @__PURE__ */ jsxRuntime.jsx(icons_exports.Copy, {});
+    DEFAULT_ARIA_LABEL = "Copy";
     ClipboardButton = ({
       // clipboard props
       text,
@@ -1090,20 +1091,24 @@ var init_ClipboardButton = __esm({
       variant = "outline",
       children,
       ...rest
-    }) => /* @__PURE__ */ jsxRuntime.jsx(
-      Clipboard,
-      {
-        asChild: true,
-        tooltip,
-        tooltipPlacement,
-        tooltipVariant,
-        text,
-        children: /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(
+        Clipboard,
+        {
+          asChild: true,
+          tooltip,
+          tooltipPlacement,
+          tooltipVariant,
+          text,
+          children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { ...rest, "aria-label": ariaLabel, variant, disabled: !text, children: [
+            icon,
+            children
+          ] })
+        }
+      );
+    };
   }
 });
 
@@ -2971,8 +2976,8 @@ var AlignmentDropdown = ({
       {
         type: "button",
         className: cn(
-          "tw-flex tw-h-7 tw-cursor-pointer tw-items-center tw-gap-1 tw-rounded tw-border-0 tw-bg-transparent tw-px-1.5 tw-text-xs tw-text-neutral-600",
-          "hover:tw-bg-neutral-100"
+          "tw-flex tw-h-7 tw-cursor-pointer tw-items-center tw-gap-1 tw-rounded tw-border-0 tw-bg-transparent tw-px-1.5 tw-text-xs tw-text-muted-foreground",
+          "hover:tw-bg-accent"
         ),
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(CurrentAlignmentIcon, { className: "tw-size-4" }),
@@ -3057,8 +3062,8 @@ var BlockTypeDropdown = ({
       {
         type: "button",
         className: cn(
-          "tw-flex tw-h-7 tw-cursor-pointer tw-items-center tw-gap-1.5 tw-rounded tw-border-0 tw-bg-transparent tw-px-1.5 tw-text-xs tw-text-neutral-600",
-          "hover:tw-bg-neutral-100"
+          "tw-flex tw-h-7 tw-cursor-pointer tw-items-center tw-gap-1.5 tw-rounded tw-border-0 tw-bg-transparent tw-px-1.5 tw-text-xs tw-text-muted-foreground",
+          "hover:tw-bg-accent"
         ),
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(CurrentBlockIcon, { className: "tw-size-4" }),
@@ -4110,8 +4115,8 @@ var ToolbarButton = ({
     disabled,
     onClick,
     className: cn(
-      "tw-flex tw-h-7 tw-min-w-7 tw-cursor-pointer tw-items-center tw-justify-center tw-rounded tw-border-0 tw-bg-transparent tw-px-1 tw-text-xs tw-text-neutral-600",
-      "hover:tw-bg-neutral-100 disabled:tw-cursor-not-allowed disabled:tw-opacity-30",
+      "tw-flex tw-h-7 tw-min-w-7 tw-cursor-pointer tw-items-center tw-justify-center tw-rounded tw-border-0 tw-bg-transparent tw-px-1 tw-text-xs tw-text-muted-foreground",
+      "hover:tw-bg-accent disabled:tw-cursor-not-allowed disabled:tw-opacity-30",
       active && "tw-bg-secondary-100 tw-text-secondary-500",
       extraClassName
     ),
@@ -4194,7 +4199,7 @@ var LinkPanel = ({ editor, isLink }) => {
       "div",
       {
         ref: panelRef,
-        className: "tw-absolute tw-left-0 tw-top-full tw-z-50 tw-mt-1 tw-w-80 tw-rounded-md tw-border tw-border-neutral-200 tw-bg-white tw-p-3 tw-shadow-lg",
+        className: "tw-absolute tw-left-0 tw-top-full tw-z-50 tw-mt-1 tw-w-80 tw-rounded-md tw-border tw-border-border tw-bg-popover tw-text-popover-foreground tw-p-3 tw-shadow-lg",
         children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "tw-flex tw-flex-col tw-gap-2", children: [
           /* @__PURE__ */ jsxRuntime.jsxs(FormGroup, { children: [
             /* @__PURE__ */ jsxRuntime.jsx(Label2, { htmlFor: "link-label", className: "tw-mb-1 tw-text-xs", children: "Label" }),
@@ -4234,7 +4239,7 @@ var LinkPanel = ({ editor, isLink }) => {
     )
   ] });
 };
-var ToolbarDivider = () => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "tw-mx-0.5 tw-h-5 tw-w-px tw-bg-neutral-200" });
+var ToolbarDivider = () => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "tw-mx-0.5 tw-h-5 tw-w-px tw-bg-border" });
 var ELEMENT_FORMAT_TYPES = ["left", "center", "right", "justify", "start", "end", ""];
 var isElementFormatType = (value) => ELEMENT_FORMAT_TYPES.includes(value);
 var toElementFormatType = (value) => isElementFormatType(value) ? value : "left";
@@ -4343,7 +4348,7 @@ var ToolbarPlugin = () => {
         "aria-label": "Formatting options",
         onMouseDown: (e) => e.preventDefault(),
         style: { top: position.top, left: position.left },
-        className: "tw-absolute tw-z-[1060] tw-flex tw--translate-y-full tw-items-center tw-gap-0.5 tw-rounded-lg tw-border tw-border-neutral-200 tw-bg-white tw-px-1.5 tw-py-1 tw-shadow-lg",
+        className: "tw-absolute tw-z-[1060] tw-flex tw--translate-y-full tw-items-center tw-gap-0.5 tw-rounded-lg tw-border tw-border-border tw-bg-popover tw-text-popover-foreground tw-px-1.5 tw-py-1 tw-shadow-lg",
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(BlockTypeDropdown, { editor, blockType }),
           /* @__PURE__ */ jsxRuntime.jsx(ToolbarDivider, {}),