@clickhouse/click-ui 0.0.146 → 0.0.147

package/dist/click-ui.es.js

@@ -1494,6 +1494,12 @@ const Bell = (props) => /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "
   /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M13.833 5.751V4.833C13.833 3.821 13.013 3 12 3V3C10.987 3 10.167 3.821 10.167 4.833V5.751", stroke: "#161517", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
   /* @__PURE__ */ jsxRuntimeExports.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6.563 10.1882V10.1882C6.563 7.68523 8.592 5.65723 11.094 5.65723H12.907C15.41 5.65723 17.438 7.68623 17.438 10.1882V10.1882V12.9852C17.438 13.5152 17.649 14.0242 18.024 14.3992L18.665 15.0402C19.04 15.4152 19.251 15.9242 19.251 16.4542V16.4542C19.251 17.4982 18.405 18.3442 17.361 18.3442H6.64C5.596 18.3442 4.75 17.4982 4.75 16.4542V16.4542C4.75 15.9242 4.961 15.4152 5.336 15.0402L5.977 14.3992C6.352 14.0242 6.563 13.5152 6.563 12.9852V10.1882Z", stroke: "#161517", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
 ] });
+const DoubleCheckIcon = (props) => /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
+  /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M8 12L13 17", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
+  /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M17 7L12.5 11.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
+  /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M8 17L3 12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
+  /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M21 9L13 17L7 11", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
+] });
 const ICONS_MAP = {
   activity: Activity,
   alarm: Alarm,
@@ -1546,6 +1552,7 @@ const ICONS_MAP = {
   "dots-triangle": DotsTriangle,
   "dots-vertical": DotsVertical,
   "dots-vertical-double": DotsVerticalDouble,
+  "double-check": DoubleCheckIcon,
   download: Download,
   "download-in-circle": DownloadInCircle,
   email: Email,
@@ -10034,7 +10041,7 @@ const Button$1 = styled.button.attrs((props) => ({
   "aria-pressed": props.$active
 })).withConfig({
   componentId: "sc-ukgugp-1"
-})(["box-sizing:border-box;display:flex;flex-direction:row;justify-content:center;align-items:center;border:none;background:", ";color:", ";font:", ";padding:", " ", ";gap:", ";", " cursor:pointer;&:hover{background:", ";font:", ";}&:disabled{cursor:not-allowed;font:", ";background:", ";}&:active,&:focus{background:", ";font:", ";&:disabled{background:", ";}}border-radius:", ";"], ({
+})(["box-sizing:border-box;display:flex;flex-direction:row;justify-content:center;align-items:center;border:none;background:", ";color:", ";font:", ";padding:", " ", ";gap:", ";", ";cursor:pointer;&:hover{background:", ";font:", ";color:", ";}&:disabled{cursor:not-allowed;font:", ";color:", ";background:", ';&:active,&:focus,&[aria-pressed="true"]{color:', ';}}&:active,&:focus,&[aria-pressed="true"]{background:', ";font:", ";color:", ";&:disabled{background:", ";}}border-radius:", ";"], ({
   $active,
   theme: theme2
 }) => $active ? theme2.click.button.group.color.background.active : theme2.click.button.group.color.background.default, ({
@@ -10055,15 +10062,23 @@ const Button$1 = styled.button.attrs((props) => ({
   theme: theme2
 }) => theme2.click.button.group.typography.label.hover, ({
   theme: theme2
+}) => theme2.click.button.group.color.text.hover, ({
+  theme: theme2
 }) => theme2.click.button.group.typography.label.disabled, ({
+  theme: theme2
+}) => theme2.click.button.group.color.text.disabled, ({
   theme: theme2,
   $active
 }) => theme2.click.button.group.color.background[$active ? "disabled-active" : "disabled"], ({
   theme: theme2
+}) => theme2.click.button.group.color.text.disabled, ({
+  theme: theme2
 }) => theme2.click.button.group.color.background.active, ({
   theme: theme2
 }) => theme2.click.button.group.typography.label.active, ({
   theme: theme2
+}) => theme2.click.button.group.color.text.active, ({
+  theme: theme2
 }) => theme2.click.button.group.color.background["disabled-active"], ({
   theme: theme2,
   $type,
@@ -32482,6 +32497,11 @@ const InputElement = styled.input.withConfig({
     &::placeholder {
       color: ${theme2.click.field.color.placeholder.default};
     }
+
+    &:disabled, &.disabled {
+      &::placeholder {
+      color: ${theme2.click.field.color.placeholder.disabled};
+    }
   `);
 const NumberInputElement = styled(InputElement).withConfig({
   componentId: "sc-1pvd2nj-2"
@@ -42231,15 +42251,15 @@ const click$2 = {
           "default": "rgba(0,0,0,0)",
           hover: "#282828",
           active: "lch(18.2 0 0)",
-          disabled: "#414141",
-          "disabled-active": "lch(22 0 0)",
+          disabled: "rgba(0,0,0,0)",
+          "disabled-active": "lch(0 0 0 / 0)",
           panel: "rgba(0,0,0,0)"
         },
         text: {
-          "default": "#ffffff",
-          hover: "#ffffff",
+          "default": "#c0c0c0",
+          hover: "#c0c0c0",
           active: "#ffffff",
-          disabled: "#808080",
+          disabled: "#414141",
           "disabled-active": "#808080"
         },
         stroke: {
@@ -42449,7 +42469,7 @@ const click$2 = {
         "default": "#ffffff",
         hover: "#ffffff",
         active: "#ffffff",
-        disabled: "#a0a0a0"
+        disabled: "#606060"
       }
     }
   },
@@ -42551,21 +42571,25 @@ const click$2 = {
         "default": "#b3b6bd",
         hover: "#b3b6bd",
         active: "#ffffff",
-        disabled: "#a0a0a0",
+        disabled: "#606060",
         error: "#ffbaba"
       },
       format: {
-        "default": "lch(72 4.18 268)",
-        hover: "lch(72 4.18 268)",
-        active: "lch(72 4.18 268)",
+        "default": "lch(62.9 0 0)",
+        hover: "lch(62.9 0 0)",
+        active: "lch(62.9 0 0)",
         disabled: "#808080",
-        error: "lch(72 4.18 268)"
+        error: "lch(62.9 0 0)"
       },
       genericLabel: {
         "default": "#ffffff",
         hover: "#ffffff",
         active: "#ffffff",
         disabled: "#a0a0a0"
+      },
+      placeholder: {
+        "default": "#808080",
+        disabled: "#606060"
       }
     }
   },
@@ -42586,11 +42610,11 @@ const click$2 = {
           disabled: "#414141"
         },
         format: {
-          "default": "lch(72 4.18 268)",
-          hover: "lch(72 4.18 268)",
-          active: "lch(72 4.18 268)",
+          "default": "lch(62.9 0 0)",
+          hover: "lch(62.9 0 0)",
+          active: "lch(62.9 0 0)",
           disabled: "#808080",
-          error: "lch(72 4.18 268)"
+          error: "lch(62.9 0 0)"
         },
         stroke: {
           "default": "#323232"
@@ -42629,7 +42653,7 @@ const click$2 = {
     autocomplete: {
       color: {
         placeholder: {
-          "default": "#9a9ea7"
+          "default": "#808080"
         },
         searchTerm: {
           "default": "#ffffff"
@@ -43701,16 +43725,16 @@ const click$1 = {
           "default": "rgba(0,0,0,0)",
           hover: "#f6f7fa",
           active: "lch(97.3 1.53 272)",
-          disabled: "#dfdfdf",
-          "disabled-active": "lch(71.1 0 0)",
+          disabled: "rgba(0,0,0,0)",
+          "disabled-active": "lch(77.8 1.22 272)",
           panel: "rgba(0,0,0,0)"
         },
         text: {
-          "default": "#161517",
-          hover: "#161517",
+          "default": "#505050",
+          hover: "#505050",
           active: "#161517",
           disabled: "#a0a0a0",
-          "disabled-active": "#808080"
+          "disabled-active": "#a0a0a0"
         },
         stroke: {
           "default": "rgba(0,0,0,0)",
@@ -44032,7 +44056,8 @@ const click$1 = {
         disabled: "#a0a0a0"
       },
       placeholder: {
-        "default": "#9a9ea7"
+        "default": "#9a9ea7",
+        disabled: "#b3b6bd"
       }
     }
   },
@@ -45487,16 +45512,16 @@ const click = {
           "default": "rgba(0,0,0,0)",
           hover: "#f6f7fa",
           active: "lch(97.3 1.53 272)",
-          disabled: "#dfdfdf",
-          "disabled-active": "lch(71.1 0 0)",
+          disabled: "rgba(0,0,0,0)",
+          "disabled-active": "lch(77.8 1.22 272)",
           panel: "rgba(0,0,0,0)"
         },
         text: {
-          "default": "#161517",
-          hover: "#161517",
+          "default": "#505050",
+          hover: "#505050",
           active: "#161517",
           disabled: "#a0a0a0",
-          "disabled-active": "#808080"
+          "disabled-active": "#a0a0a0"
         },
         stroke: {
           "default": "rgba(0,0,0,0)",
@@ -46088,7 +46113,8 @@ const click = {
         disabled: "#a0a0a0"
       },
       placeholder: {
-        "default": "#9a9ea7"
+        "default": "#9a9ea7",
+        disabled: "#b3b6bd"
       }
     }
   },
@@ -47636,6 +47662,7 @@ const palette = {
     "400": "#a0a0a0",
     "500": "#808080",
     "600": "#606060",
+    "650": "#505050",
     "700": "#414141",
     "712": "#323232",
     "725": "#282828",
@@ -47948,8 +47975,9 @@ const themes = {
 const useCUITheme = () => {
   const theme2 = useTheme();
   return {
-    name: theme2.name,
+    breakpoint: theme2.breakpoint,
     global: theme2.global,
+    name: theme2.name,
     sizes: theme2.sizes
   };
 };

package/dist/click-ui.umd.js

@@ -1511,6 +1511,12 @@ var __publicField = (obj, key, value) => {
     /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M13.833 5.751V4.833C13.833 3.821 13.013 3 12 3V3C10.987 3 10.167 3.821 10.167 4.833V5.751", stroke: "#161517", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
     /* @__PURE__ */ jsxRuntimeExports.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6.563 10.1882V10.1882C6.563 7.68523 8.592 5.65723 11.094 5.65723H12.907C15.41 5.65723 17.438 7.68623 17.438 10.1882V10.1882V12.9852C17.438 13.5152 17.649 14.0242 18.024 14.3992L18.665 15.0402C19.04 15.4152 19.251 15.9242 19.251 16.4542V16.4542C19.251 17.4982 18.405 18.3442 17.361 18.3442H6.64C5.596 18.3442 4.75 17.4982 4.75 16.4542V16.4542C4.75 15.9242 4.961 15.4152 5.336 15.0402L5.977 14.3992C6.352 14.0242 6.563 13.5152 6.563 12.9852V10.1882Z", stroke: "#161517", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
   ] });
+  const DoubleCheckIcon = (props) => /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M8 12L13 17", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M17 7L12.5 11.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M8 17L3 12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M21 9L13 17L7 11", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
+  ] });
   const ICONS_MAP = {
     activity: Activity,
     alarm: Alarm,
@@ -1563,6 +1569,7 @@ var __publicField = (obj, key, value) => {
     "dots-triangle": DotsTriangle,
     "dots-vertical": DotsVertical,
     "dots-vertical-double": DotsVerticalDouble,
+    "double-check": DoubleCheckIcon,
     download: Download,
     "download-in-circle": DownloadInCircle,
     email: Email,
@@ -10051,7 +10058,7 @@ var __publicField = (obj, key, value) => {
     "aria-pressed": props.$active
   })).withConfig({
     componentId: "sc-ukgugp-1"
-  })(["box-sizing:border-box;display:flex;flex-direction:row;justify-content:center;align-items:center;border:none;background:", ";color:", ";font:", ";padding:", " ", ";gap:", ";", " cursor:pointer;&:hover{background:", ";font:", ";}&:disabled{cursor:not-allowed;font:", ";background:", ";}&:active,&:focus{background:", ";font:", ";&:disabled{background:", ";}}border-radius:", ";"], ({
+  })(["box-sizing:border-box;display:flex;flex-direction:row;justify-content:center;align-items:center;border:none;background:", ";color:", ";font:", ";padding:", " ", ";gap:", ";", ";cursor:pointer;&:hover{background:", ";font:", ";color:", ";}&:disabled{cursor:not-allowed;font:", ";color:", ";background:", ';&:active,&:focus,&[aria-pressed="true"]{color:', ';}}&:active,&:focus,&[aria-pressed="true"]{background:', ";font:", ";color:", ";&:disabled{background:", ";}}border-radius:", ";"], ({
     $active,
     theme: theme2
   }) => $active ? theme2.click.button.group.color.background.active : theme2.click.button.group.color.background.default, ({
@@ -10072,15 +10079,23 @@ var __publicField = (obj, key, value) => {
     theme: theme2
   }) => theme2.click.button.group.typography.label.hover, ({
     theme: theme2
+  }) => theme2.click.button.group.color.text.hover, ({
+    theme: theme2
   }) => theme2.click.button.group.typography.label.disabled, ({
+    theme: theme2
+  }) => theme2.click.button.group.color.text.disabled, ({
     theme: theme2,
     $active
   }) => theme2.click.button.group.color.background[$active ? "disabled-active" : "disabled"], ({
     theme: theme2
+  }) => theme2.click.button.group.color.text.disabled, ({
+    theme: theme2
   }) => theme2.click.button.group.color.background.active, ({
     theme: theme2
   }) => theme2.click.button.group.typography.label.active, ({
     theme: theme2
+  }) => theme2.click.button.group.color.text.active, ({
+    theme: theme2
   }) => theme2.click.button.group.color.background["disabled-active"], ({
     theme: theme2,
     $type,
@@ -32499,6 +32514,11 @@ var __publicField = (obj, key, value) => {
     &::placeholder {
       color: ${theme2.click.field.color.placeholder.default};
     }
+
+    &:disabled, &.disabled {
+      &::placeholder {
+      color: ${theme2.click.field.color.placeholder.disabled};
+    }
   `);
   const NumberInputElement = styled(InputElement).withConfig({
     componentId: "sc-1pvd2nj-2"
@@ -42248,15 +42268,15 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
             "default": "rgba(0,0,0,0)",
             hover: "#282828",
             active: "lch(18.2 0 0)",
-            disabled: "#414141",
-            "disabled-active": "lch(22 0 0)",
+            disabled: "rgba(0,0,0,0)",
+            "disabled-active": "lch(0 0 0 / 0)",
             panel: "rgba(0,0,0,0)"
           },
           text: {
-            "default": "#ffffff",
-            hover: "#ffffff",
+            "default": "#c0c0c0",
+            hover: "#c0c0c0",
             active: "#ffffff",
-            disabled: "#808080",
+            disabled: "#414141",
             "disabled-active": "#808080"
           },
           stroke: {
@@ -42466,7 +42486,7 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
           "default": "#ffffff",
           hover: "#ffffff",
           active: "#ffffff",
-          disabled: "#a0a0a0"
+          disabled: "#606060"
         }
       }
     },
@@ -42568,21 +42588,25 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
           "default": "#b3b6bd",
           hover: "#b3b6bd",
           active: "#ffffff",
-          disabled: "#a0a0a0",
+          disabled: "#606060",
           error: "#ffbaba"
         },
         format: {
-          "default": "lch(72 4.18 268)",
-          hover: "lch(72 4.18 268)",
-          active: "lch(72 4.18 268)",
+          "default": "lch(62.9 0 0)",
+          hover: "lch(62.9 0 0)",
+          active: "lch(62.9 0 0)",
           disabled: "#808080",
-          error: "lch(72 4.18 268)"
+          error: "lch(62.9 0 0)"
         },
         genericLabel: {
           "default": "#ffffff",
           hover: "#ffffff",
           active: "#ffffff",
           disabled: "#a0a0a0"
+        },
+        placeholder: {
+          "default": "#808080",
+          disabled: "#606060"
         }
       }
     },
@@ -42603,11 +42627,11 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
             disabled: "#414141"
           },
           format: {
-            "default": "lch(72 4.18 268)",
-            hover: "lch(72 4.18 268)",
-            active: "lch(72 4.18 268)",
+            "default": "lch(62.9 0 0)",
+            hover: "lch(62.9 0 0)",
+            active: "lch(62.9 0 0)",
             disabled: "#808080",
-            error: "lch(72 4.18 268)"
+            error: "lch(62.9 0 0)"
           },
           stroke: {
             "default": "#323232"
@@ -42646,7 +42670,7 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
       autocomplete: {
         color: {
           placeholder: {
-            "default": "#9a9ea7"
+            "default": "#808080"
           },
           searchTerm: {
             "default": "#ffffff"
@@ -43718,16 +43742,16 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
             "default": "rgba(0,0,0,0)",
             hover: "#f6f7fa",
             active: "lch(97.3 1.53 272)",
-            disabled: "#dfdfdf",
-            "disabled-active": "lch(71.1 0 0)",
+            disabled: "rgba(0,0,0,0)",
+            "disabled-active": "lch(77.8 1.22 272)",
             panel: "rgba(0,0,0,0)"
           },
           text: {
-            "default": "#161517",
-            hover: "#161517",
+            "default": "#505050",
+            hover: "#505050",
             active: "#161517",
             disabled: "#a0a0a0",
-            "disabled-active": "#808080"
+            "disabled-active": "#a0a0a0"
           },
           stroke: {
             "default": "rgba(0,0,0,0)",
@@ -44049,7 +44073,8 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
           disabled: "#a0a0a0"
         },
         placeholder: {
-          "default": "#9a9ea7"
+          "default": "#9a9ea7",
+          disabled: "#b3b6bd"
         }
       }
     },
@@ -45504,16 +45529,16 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
             "default": "rgba(0,0,0,0)",
             hover: "#f6f7fa",
             active: "lch(97.3 1.53 272)",
-            disabled: "#dfdfdf",
-            "disabled-active": "lch(71.1 0 0)",
+            disabled: "rgba(0,0,0,0)",
+            "disabled-active": "lch(77.8 1.22 272)",
             panel: "rgba(0,0,0,0)"
           },
           text: {
-            "default": "#161517",
-            hover: "#161517",
+            "default": "#505050",
+            hover: "#505050",
             active: "#161517",
             disabled: "#a0a0a0",
-            "disabled-active": "#808080"
+            "disabled-active": "#a0a0a0"
           },
           stroke: {
             "default": "rgba(0,0,0,0)",
@@ -46105,7 +46130,8 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
           disabled: "#a0a0a0"
         },
         placeholder: {
-          "default": "#9a9ea7"
+          "default": "#9a9ea7",
+          disabled: "#b3b6bd"
         }
       }
     },
@@ -47653,6 +47679,7 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
       "400": "#a0a0a0",
       "500": "#808080",
       "600": "#606060",
+      "650": "#505050",
       "700": "#414141",
       "712": "#323232",
       "725": "#282828",
@@ -47965,8 +47992,9 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
   const useCUITheme = () => {
     const theme2 = styled.useTheme();
     return {
-      name: theme2.name,
+      breakpoint: theme2.breakpoint,
       global: theme2.global,
+      name: theme2.name,
       sizes: theme2.sizes
     };
   };

package/dist/components/Icon/IconCommon.d.ts

@@ -51,6 +51,7 @@ export declare const ICONS_MAP: {
     "dots-triangle": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     "dots-vertical": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     "dots-vertical-double": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
+    "double-check": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     download: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     "download-in-circle": (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
     email: (props: import('react').SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icon/types.d.ts

@@ -5,7 +5,7 @@ import { LogoName } from '../Logos/types';
 import { PaymentName, PaymentProps } from '../icons/Payments';
 
 export type IconSize = "xs" | "sm" | "md" | "lg" | "xl" | "xxl";
-export declare const ICON_NAMES: readonly ["activity", "alarm", "arrow-down", "arrow-left", "arrow-right", "arrow-triangle", "arrow-directions", "arrow-up", "auth-app", "auth-sms", "backups", "bar-chart", "bell", "beta", "blog", "book", "brackets", "briefcase", "building", "burger-menu", "cards", "cell-tower", "chat", "check", "check-in-circle", "chevron-down", "chevron-left", "chevron-right", "chevron-up", "circle", "clock", "cloud", "cloud-keys", "code", "code-in-square", "connect", "connect-alt", "console", "copy", "cross", "credit-card", "data", "database", "disk", "display", "document", "dot", "dots-horizontal", "dots-triangle", "dots-vertical", "dots-vertical-double", "download", "download-in-circle", "email", "empty", "enter", "eye", "eye-closed", "filter", "fire", "flag", "flask", "folder-closed", "folder-open", "gear", "gift", "git-merge", "history", "horizontal-loading", "home", "http", "http-monitoring", "info-in-circle", "information", "insert-row", "integrations", "key", "keys", "lifebuoy", "light-bulb", "lightening", "line-in-circle", "loading", "loading-animated", "lock", "metrics", "metrics-alt", "no-cloud", "pause", "payment", "pencil", "pie-chart", "play", "play-in-circle", "plus", "popout", "puzzle-piece", "query", "question", "refresh", "rocket", "search", "secure", "server", "services", "settings", "share", "share-arrow", "share-network", "slide-in", "slide-out", "sort-alt", "sort", "sparkle", "speaker", "speed", "star", "stop", "support", "table", "taxi", "trash", "upload", "url", "user", "users", "warning", "waves"];
+export declare const ICON_NAMES: readonly ["activity", "alarm", "arrow-down", "arrow-left", "arrow-right", "arrow-triangle", "arrow-directions", "arrow-up", "auth-app", "auth-sms", "backups", "bar-chart", "bell", "beta", "blog", "book", "brackets", "briefcase", "building", "burger-menu", "cards", "cell-tower", "chat", "check", "check-in-circle", "chevron-down", "chevron-left", "chevron-right", "chevron-up", "circle", "clock", "cloud", "cloud-keys", "code", "code-in-square", "connect", "connect-alt", "console", "copy", "cross", "credit-card", "data", "database", "disk", "display", "document", "dot", "dots-horizontal", "dots-triangle", "dots-vertical", "dots-vertical-double", "double-check", "download", "download-in-circle", "email", "empty", "enter", "eye", "eye-closed", "filter", "fire", "flag", "flask", "folder-closed", "folder-open", "gear", "gift", "git-merge", "history", "horizontal-loading", "home", "http", "http-monitoring", "info-in-circle", "information", "insert-row", "integrations", "key", "keys", "lifebuoy", "light-bulb", "lightening", "line-in-circle", "loading", "loading-animated", "lock", "metrics", "metrics-alt", "no-cloud", "pause", "payment", "pencil", "pie-chart", "play", "play-in-circle", "plus", "popout", "puzzle-piece", "query", "question", "refresh", "rocket", "search", "secure", "server", "services", "settings", "share", "share-arrow", "share-network", "slide-in", "slide-out", "sort-alt", "sort", "sparkle", "speaker", "speed", "star", "stop", "support", "table", "taxi", "trash", "upload", "url", "user", "users", "warning", "waves"];
 export type IconName = (typeof ICON_NAMES)[number];
 export interface IconProps extends SVGAttributes<HTMLOrSVGElement> {
     name: IconName;

package/dist/components/icons/DoubleCheckIcon.d.ts

@@ -0,0 +1,4 @@
+import { SVGAttributes } from 'react';
+
+declare const DoubleCheckIcon: (props: SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
+export default DoubleCheckIcon;

package/dist/styles/types.d.ts

@@ -1309,6 +1309,7 @@ export interface Theme {
                 };
                 "placeholder": {
                     "default": string;
+                    "disabled": string;
                 };
             };
         };
@@ -2856,6 +2857,7 @@ export interface Theme {
             "400": string;
             "500": string;
             "600": string;
+            "650": string;
             "700": string;
             "712": string;
             "725": string;

package/dist/styles/variables.dark.json.d.ts

@@ -387,15 +387,15 @@ declare const _default: {
             "default": "rgba(0,0,0,0)",
             "hover": "#282828",
             "active": "lch(18.2 0 0)",
-            "disabled": "#414141",
-            "disabled-active": "lch(22 0 0)",
+            "disabled": "rgba(0,0,0,0)",
+            "disabled-active": "lch(0 0 0 / 0)",
             "panel": "rgba(0,0,0,0)"
           },
           "text": {
-            "default": "#ffffff",
-            "hover": "#ffffff",
+            "default": "#c0c0c0",
+            "hover": "#c0c0c0",
             "active": "#ffffff",
-            "disabled": "#808080",
+            "disabled": "#414141",
             "disabled-active": "#808080"
           },
           "stroke": {
@@ -605,7 +605,7 @@ declare const _default: {
           "default": "#ffffff",
           "hover": "#ffffff",
           "active": "#ffffff",
-          "disabled": "#a0a0a0"
+          "disabled": "#606060"
         }
       }
     },
@@ -707,21 +707,25 @@ declare const _default: {
           "default": "#b3b6bd",
           "hover": "#b3b6bd",
           "active": "#ffffff",
-          "disabled": "#a0a0a0",
+          "disabled": "#606060",
           "error": "#ffbaba"
         },
         "format": {
-          "default": "lch(72 4.18 268)",
-          "hover": "lch(72 4.18 268)",
-          "active": "lch(72 4.18 268)",
+          "default": "lch(62.9 0 0)",
+          "hover": "lch(62.9 0 0)",
+          "active": "lch(62.9 0 0)",
           "disabled": "#808080",
-          "error": "lch(72 4.18 268)"
+          "error": "lch(62.9 0 0)"
         },
         "genericLabel": {
           "default": "#ffffff",
           "hover": "#ffffff",
           "active": "#ffffff",
           "disabled": "#a0a0a0"
+        },
+        "placeholder": {
+          "default": "#808080",
+          "disabled": "#606060"
         }
       }
     },
@@ -742,11 +746,11 @@ declare const _default: {
             "disabled": "#414141"
           },
           "format": {
-            "default": "lch(72 4.18 268)",
-            "hover": "lch(72 4.18 268)",
-            "active": "lch(72 4.18 268)",
+            "default": "lch(62.9 0 0)",
+            "hover": "lch(62.9 0 0)",
+            "active": "lch(62.9 0 0)",
             "disabled": "#808080",
-            "error": "lch(72 4.18 268)"
+            "error": "lch(62.9 0 0)"
           },
           "stroke": {
             "default": "#323232"
@@ -785,7 +789,7 @@ declare const _default: {
       "autocomplete": {
         "color": {
           "placeholder": {
-            "default": "#9a9ea7"
+            "default": "#808080"
           },
           "searchTerm": {
             "default": "#ffffff"

package/dist/styles/variables.json.d.ts

@@ -707,16 +707,16 @@ declare const _default: {
             "default": "rgba(0,0,0,0)",
             "hover": "#f6f7fa",
             "active": "lch(97.3 1.53 272)",
-            "disabled": "#dfdfdf",
-            "disabled-active": "lch(71.1 0 0)",
+            "disabled": "rgba(0,0,0,0)",
+            "disabled-active": "lch(77.8 1.22 272)",
             "panel": "rgba(0,0,0,0)"
           },
           "text": {
-            "default": "#161517",
-            "hover": "#161517",
+            "default": "#505050",
+            "hover": "#505050",
             "active": "#161517",
             "disabled": "#a0a0a0",
-            "disabled-active": "#808080"
+            "disabled-active": "#a0a0a0"
           },
           "stroke": {
             "default": "rgba(0,0,0,0)",
@@ -1308,7 +1308,8 @@ declare const _default: {
           "disabled": "#a0a0a0"
         },
         "placeholder": {
-          "default": "#9a9ea7"
+          "default": "#9a9ea7",
+          "disabled": "#b3b6bd"
         }
       }
     },
@@ -2856,6 +2857,7 @@ declare const _default: {
       "400": "#a0a0a0",
       "500": "#808080",
       "600": "#606060",
+      "650": "#505050",
       "700": "#414141",
       "712": "#323232",
       "725": "#282828",

package/dist/styles/variables.light.json.d.ts

@@ -387,16 +387,16 @@ declare const _default: {
             "default": "rgba(0,0,0,0)",
             "hover": "#f6f7fa",
             "active": "lch(97.3 1.53 272)",
-            "disabled": "#dfdfdf",
-            "disabled-active": "lch(71.1 0 0)",
+            "disabled": "rgba(0,0,0,0)",
+            "disabled-active": "lch(77.8 1.22 272)",
             "panel": "rgba(0,0,0,0)"
           },
           "text": {
-            "default": "#161517",
-            "hover": "#161517",
+            "default": "#505050",
+            "hover": "#505050",
             "active": "#161517",
             "disabled": "#a0a0a0",
-            "disabled-active": "#808080"
+            "disabled-active": "#a0a0a0"
           },
           "stroke": {
             "default": "rgba(0,0,0,0)",
@@ -718,7 +718,8 @@ declare const _default: {
           "disabled": "#a0a0a0"
         },
         "placeholder": {
-          "default": "#9a9ea7"
+          "default": "#9a9ea7",
+          "disabled": "#b3b6bd"
         }
       }
     },

package/dist/theme/index.d.ts

@@ -6,7 +6,7 @@ declare module "styled-components" {
     interface DefaultTheme extends Theme {
     }
 }
-type CUIThemeType = Pick<Theme, "global" | "sizes" | "name">;
+type CUIThemeType = Pick<Theme, "breakpoint" | "global" | "name" | "sizes">;
 declare const useCUITheme: () => CUIThemeType;
 export type { ThemeName, CUIThemeType };
 export { useCUITheme };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clickhouse/click-ui",
-  "version": "0.0.146",
+  "version": "0.0.147",
   "description": "Official ClickHouse design system react library",
   "type": "module",
   "license": "Apache-2.0",