@clickhouse/click-ui 0.0.150 → 0.0.152

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.
Files changed (4) hide show
  1. package/dist/click-ui.es.js +7 -3
  2. package/dist/click-ui.umd.js +7 -3
  3. package/dist/components/Button/Button.d.ts +2 -1
  4. package/package.json +1 -1
package/dist/click-ui.es.js CHANGED
@@ -10094,16 +10094,20 @@ const Button = ({
10094
10094
  label,
10095
10095
  loading = false,
10096
10096
  disabled,
10097
+ showLabelWithLoading = false,
10097
10098
  ...delegated
10098
10099
  }) => /* @__PURE__ */ jsxRuntimeExports.jsxs(StyledButton, { $styleType: type, $align: align, $fillWidth: fillWidth, disabled: disabled || loading, role: "button", ...delegated, children: [
10099
10100
  iconLeft && /* @__PURE__ */ jsxRuntimeExports.jsx(ButtonIcon, { name: iconLeft, "aria-hidden": true, size: "sm" }),
10100
10101
  label ?? children,
10101
10102
  iconRight && /* @__PURE__ */ jsxRuntimeExports.jsx(ButtonIcon, { name: iconRight, "aria-hidden": true, size: "sm" }),
10102
- loading && /* @__PURE__ */ jsxRuntimeExports.jsx(LoadingIconWrapper, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(SvgImage, { name: "loading-animated", "data-testid": "click-ui-loading-icon", "aria-label": "loading" }) })
10103
+ loading && /* @__PURE__ */ jsxRuntimeExports.jsxs(LoadingIconWrapper, { "data-testid": "click-ui-loading-icon-wrapper", children: [
10104
+ /* @__PURE__ */ jsxRuntimeExports.jsx(SvgImage, { name: "loading-animated", "data-testid": "click-ui-loading-icon", "aria-label": "loading" }),
10105
+ showLabelWithLoading ? label ?? children : ""
10106
+ ] })
10103
10107
  ] });
10104
10108
  const LoadingIconWrapper = styled.div.withConfig({
10105
10109
  componentId: "sc-1k4tz4c-0"
10106
- })(["position:absolute;background-color:inherit;top:0;left:0;bottom:0;right:0;display:flex;align-content:center;justify-content:center;"]);
10110
+ })(["position:absolute;background-color:inherit;top:0;left:0;bottom:0;right:0;display:flex;align-content:center;justify-content:center;align-items:center;gap:0.5rem;"]);
10107
10111
  const StyledButton = styled(BaseButton).withConfig({
10108
10112
  componentId: "sc-1k4tz4c-1"
10109
10113
  })(["width:", ";color:", ";background-color:", ";border:", " solid ", ";font:", ";position:relative;display:flex;align-items:center;justify-content:", ";white-space:nowrap;&:hover{background-color:", ";border:", " solid ", ";transition:", ";font:", ";}&:active,&:focus{background-color:", ";border:1px solid ", ";font:", ";}&:disabled,&:disabled:hover,&:disabled:active{background-color:", ";color:", ";border:", " solid ", ";font:", ";}"], ({
@@ -37623,7 +37627,7 @@ const SidebarCollapsibleTitle = ({
37623
37627
  children,
37624
37628
  open: open2,
37625
37629
  onOpenChange,
37626
- iconDir,
37630
+ iconDir = "start",
37627
37631
  icon,
37628
37632
  selected,
37629
37633
  type = "main",
package/dist/click-ui.umd.js CHANGED
@@ -10111,16 +10111,20 @@ var __publicField = (obj, key, value) => {
10111
10111
  label,
10112
10112
  loading = false,
10113
10113
  disabled,
10114
+ showLabelWithLoading = false,
10114
10115
  ...delegated
10115
10116
  }) => /* @__PURE__ */ jsxRuntimeExports.jsxs(StyledButton, { $styleType: type, $align: align, $fillWidth: fillWidth, disabled: disabled || loading, role: "button", ...delegated, children: [
10116
10117
  iconLeft && /* @__PURE__ */ jsxRuntimeExports.jsx(ButtonIcon, { name: iconLeft, "aria-hidden": true, size: "sm" }),
10117
10118
  label ?? children,
10118
10119
  iconRight && /* @__PURE__ */ jsxRuntimeExports.jsx(ButtonIcon, { name: iconRight, "aria-hidden": true, size: "sm" }),
10119
- loading && /* @__PURE__ */ jsxRuntimeExports.jsx(LoadingIconWrapper, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(SvgImage, { name: "loading-animated", "data-testid": "click-ui-loading-icon", "aria-label": "loading" }) })
10120
+ loading && /* @__PURE__ */ jsxRuntimeExports.jsxs(LoadingIconWrapper, { "data-testid": "click-ui-loading-icon-wrapper", children: [
10121
+ /* @__PURE__ */ jsxRuntimeExports.jsx(SvgImage, { name: "loading-animated", "data-testid": "click-ui-loading-icon", "aria-label": "loading" }),
10122
+ showLabelWithLoading ? label ?? children : ""
10123
+ ] })
10120
10124
  ] });
10121
10125
  const LoadingIconWrapper = styled.div.withConfig({
10122
10126
  componentId: "sc-1k4tz4c-0"
10123
- })(["position:absolute;background-color:inherit;top:0;left:0;bottom:0;right:0;display:flex;align-content:center;justify-content:center;"]);
10127
+ })(["position:absolute;background-color:inherit;top:0;left:0;bottom:0;right:0;display:flex;align-content:center;justify-content:center;align-items:center;gap:0.5rem;"]);
10124
10128
  const StyledButton = styled(BaseButton).withConfig({
10125
10129
  componentId: "sc-1k4tz4c-1"
10126
10130
  })(["width:", ";color:", ";background-color:", ";border:", " solid ", ";font:", ";position:relative;display:flex;align-items:center;justify-content:", ";white-space:nowrap;&:hover{background-color:", ";border:", " solid ", ";transition:", ";font:", ";}&:active,&:focus{background-color:", ";border:1px solid ", ";font:", ";}&:disabled,&:disabled:hover,&:disabled:active{background-color:", ";color:", ";border:", " solid ", ";font:", ";}"], ({
@@ -37640,7 +37644,7 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
37640
37644
  children,
37641
37645
  open: open2,
37642
37646
  onOpenChange,
37643
- iconDir,
37647
+ iconDir = "start",
37644
37648
  icon,
37645
37649
  selected,
37646
37650
  type = "main",
package/dist/components/Button/Button.d.ts CHANGED
@@ -13,6 +13,7 @@ export interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
13
13
  fillWidth?: boolean;
14
14
  loading?: boolean;
15
15
  autoFocus?: boolean;
16
+ showLabelWithLoading?: boolean;
16
17
  }
17
- export declare const Button: ({ type, iconLeft, iconRight, align, children, fillWidth, label, loading, disabled, ...delegated }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
18
+ export declare const Button: ({ type, iconLeft, iconRight, align, children, fillWidth, label, loading, disabled, showLabelWithLoading, ...delegated }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
18
19
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@clickhouse/click-ui",
3
- "version": "0.0.150",
3
+ "version": "v0.0.152",
4
4
  "description": "Official ClickHouse design system react library",
5
5
  "type": "module",
6
6
  "license": "Apache-2.0",