@keboola/design 6.0.0 → 6.2.0

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.
@@ -1043,13 +1043,14 @@ var init_Clipboard2 = __esm({
1043
1043
  init_Clipboard();
1044
1044
  }
1045
1045
  });
1046
- var DEFAULT_ICON, ClipboardButton;
1046
+ var DEFAULT_ICON, DEFAULT_ARIA_LABEL, ClipboardButton;
1047
1047
  var init_ClipboardButton = __esm({
1048
1048
  "src/blocks/ClipboardButton/ClipboardButton.tsx"() {
1049
1049
  init_Button2();
1050
1050
  init_Clipboard2();
1051
1051
  init_icons();
1052
1052
  DEFAULT_ICON = /* @__PURE__ */ jsx(icons_exports.Copy, {});
1053
+ DEFAULT_ARIA_LABEL = "Copy";
1053
1054
  ClipboardButton = ({
1054
1055
  // clipboard props
1055
1056
  text,
@@ -1061,20 +1062,24 @@ var init_ClipboardButton = __esm({
1061
1062
  variant = "outline",
1062
1063
  children,
1063
1064
  ...rest
1064
- }) => /* @__PURE__ */ jsx(
1065
- Clipboard,
1066
- {
1067
- asChild: true,
1068
- tooltip,
1069
- tooltipPlacement,
1070
- tooltipVariant,
1071
- text,
1072
- children: /* @__PURE__ */ jsxs(Button, { ...rest, variant, disabled: !text, children: [
1073
- icon,
1074
- children
1075
- ] })
1076
- }
1077
- );
1065
+ }) => {
1066
+ const defaultAriaLabel = typeof tooltip === "string" && tooltip.trim() ? tooltip : DEFAULT_ARIA_LABEL;
1067
+ const ariaLabel = rest["aria-label"] ?? (children == null ? defaultAriaLabel : void 0);
1068
+ return /* @__PURE__ */ jsx(
1069
+ Clipboard,
1070
+ {
1071
+ asChild: true,
1072
+ tooltip,
1073
+ tooltipPlacement,
1074
+ tooltipVariant,
1075
+ text,
1076
+ children: /* @__PURE__ */ jsxs(Button, { ...rest, "aria-label": ariaLabel, variant, disabled: !text, children: [
1077
+ icon,
1078
+ children
1079
+ ] })
1080
+ }
1081
+ );
1082
+ };
1078
1083
  }
1079
1084
  });
1080
1085
 
@@ -2942,8 +2947,8 @@ var AlignmentDropdown = ({
2942
2947
  {
2943
2948
  type: "button",
2944
2949
  className: cn(
2945
- "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",
2946
- "hover:tw-bg-neutral-100"
2950
+ "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",
2951
+ "hover:tw-bg-accent"
2947
2952
  ),
2948
2953
  children: [
2949
2954
  /* @__PURE__ */ jsx(CurrentAlignmentIcon, { className: "tw-size-4" }),
@@ -3028,8 +3033,8 @@ var BlockTypeDropdown = ({
3028
3033
  {
3029
3034
  type: "button",
3030
3035
  className: cn(
3031
- "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",
3032
- "hover:tw-bg-neutral-100"
3036
+ "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",
3037
+ "hover:tw-bg-accent"
3033
3038
  ),
3034
3039
  children: [
3035
3040
  /* @__PURE__ */ jsx(CurrentBlockIcon, { className: "tw-size-4" }),
@@ -4081,8 +4086,8 @@ var ToolbarButton = ({
4081
4086
  disabled,
4082
4087
  onClick,
4083
4088
  className: cn(
4084
- "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",
4085
- "hover:tw-bg-neutral-100 disabled:tw-cursor-not-allowed disabled:tw-opacity-30",
4089
+ "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",
4090
+ "hover:tw-bg-accent disabled:tw-cursor-not-allowed disabled:tw-opacity-30",
4086
4091
  active && "tw-bg-secondary-100 tw-text-secondary-500",
4087
4092
  extraClassName
4088
4093
  ),
@@ -4165,7 +4170,7 @@ var LinkPanel = ({ editor, isLink }) => {
4165
4170
  "div",
4166
4171
  {
4167
4172
  ref: panelRef,
4168
- 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",
4173
+ 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",
4169
4174
  children: /* @__PURE__ */ jsxs("div", { className: "tw-flex tw-flex-col tw-gap-2", children: [
4170
4175
  /* @__PURE__ */ jsxs(FormGroup, { children: [
4171
4176
  /* @__PURE__ */ jsx(Label2, { htmlFor: "link-label", className: "tw-mb-1 tw-text-xs", children: "Label" }),
@@ -4205,7 +4210,7 @@ var LinkPanel = ({ editor, isLink }) => {
4205
4210
  )
4206
4211
  ] });
4207
4212
  };
4208
- var ToolbarDivider = () => /* @__PURE__ */ jsx("div", { className: "tw-mx-0.5 tw-h-5 tw-w-px tw-bg-neutral-200" });
4213
+ var ToolbarDivider = () => /* @__PURE__ */ jsx("div", { className: "tw-mx-0.5 tw-h-5 tw-w-px tw-bg-border" });
4209
4214
  var ELEMENT_FORMAT_TYPES = ["left", "center", "right", "justify", "start", "end", ""];
4210
4215
  var isElementFormatType = (value) => ELEMENT_FORMAT_TYPES.includes(value);
4211
4216
  var toElementFormatType = (value) => isElementFormatType(value) ? value : "left";
@@ -4314,7 +4319,7 @@ var ToolbarPlugin = () => {
4314
4319
  "aria-label": "Formatting options",
4315
4320
  onMouseDown: (e) => e.preventDefault(),
4316
4321
  style: { top: position.top, left: position.left },
4317
- 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",
4322
+ 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",
4318
4323
  children: [
4319
4324
  /* @__PURE__ */ jsx(BlockTypeDropdown, { editor, blockType }),
4320
4325
  /* @__PURE__ */ jsx(ToolbarDivider, {}),