@clickhouse/click-ui 0.0.231 → 0.0.233

package/dist/click-ui.bundled.umd.js

@@ -10589,9 +10589,10 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
     spacing = "sm",
     state = "default",
     title = "Title",
+    error: error2 = false,
     ...props
-  }) => /* @__PURE__ */ jsxRuntime.jsxs(Wrapper$a, { $height: height, $order: order, $size: size2, $spacing: spacing, $state: state, $fillWidth: fillWidth, $maxWidth: maxWidth, ...props, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Label, { $state: state, $size: size2, children: label }),
+  }) => /* @__PURE__ */ jsxRuntime.jsxs(Wrapper$a, { $height: height, $order: order, $size: size2, $spacing: spacing, $state: state, $fillWidth: fillWidth, $maxWidth: maxWidth, $error: error2, ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Label, { $state: state, $size: size2, $error: error2, children: label }),
     /* @__PURE__ */ jsxRuntime.jsx(Title$3, { $state: state, $size: size2, children: title })
   ] });
   const Wrapper$a = pt.div.withConfig({
@@ -10604,13 +10605,14 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
     $height = "fixed",
     $order,
     $spacing = "sm",
+    $error = false,
     theme: theme2
   }) => `
     background-color: ${theme2.click.bigStat.color.background[$state]};
     color: ${theme2.click.bigStat.color.label[$state]};
     font: ${theme2.click.bigStat.typography[$size].label[$state]};
     border-radius: ${theme2.click.bigStat.radii.all};
-    border: ${theme2.click.bigStat.stroke} solid ${theme2.click.bigStat.color.stroke[$state]};
+    border: ${theme2.click.bigStat.stroke} solid ${$error ? theme2.click.bigStat.color.stroke.danger : theme2.click.bigStat.color.stroke[$state]};
   gap: ${theme2.click.bigStat.space[$spacing].gap};
   padding: ${theme2.click.bigStat.space.all};
   min-height: ${$height !== void 0 ? `${$height}` : "auto"};
@@ -10623,9 +10625,10 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
   })(["", ""], ({
     $state = "default",
     $size = "lg",
+    $error = false,
     theme: theme2
   }) => `
-    color: ${theme2.click.bigStat.color.label[$state]};
+    color: ${$error ? theme2.click.bigStat.color.label.danger : theme2.click.bigStat.color.label[$state]};
     font: ${theme2.click.bigStat.typography[$size].label[$state]};
   `);
   const Title$3 = pt.div.withConfig({
@@ -36404,7 +36407,11 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
   })(["display:flex;flex-direction:column;width:inherit;max-height:calc(var(--radix-popover-content-available-height) - 1rem);"]);
   const SelectListContent = pt.div.withConfig({
     componentId: "sc-oudbwg-8"
-  })(["width:inherit;overflow:auto;flex:1;"]);
+  })(["width:inherit;overflow:auto;flex:1;", ""], ({
+    $maxHeight
+  }) => $maxHeight && `
+      max-height: ${$maxHeight};
+    `);
   const HiddenSelectElement = pt.select.withConfig({
     componentId: "sc-oudbwg-9"
   })(["visibility:hidden;position:absolute;z-index:-1;height:0;"]);
@@ -39842,6 +39849,7 @@ Please read the updated README.md at https://github.com/SortableJS/react-sortabl
     options: options2,
     sortable = false,
     placeholder = "Select an option",
+    maxHeight,
     multiple,
     checkbox,
     selectLabel,
@@ -40030,7 +40038,7 @@ Please read the updated README.md at https://github.com/SortableJS/react-sortabl
               /* @__PURE__ */ jsxRuntime.jsx(SearchBar, { ref: inputRef, value: search, onChange: (e) => onUpdateSearch(e.target.value), "data-testid": "select-search-input", onKeyDown, $showSearch: showSearch }),
               /* @__PURE__ */ jsxRuntime.jsx(SearchClose, { as: IconButton$1, icon: "cross", onClick: clearSearch, "data-testid": "select-search-close", $showClose: search.length > 0, size: "xs" })
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(SelectListContent, { children: /* @__PURE__ */ jsxRuntime.jsx(OptionContext.Provider, { value: optionContextValue, children: options2 && options2.length > 0 ? options2.map((props2, index2) => {
+            /* @__PURE__ */ jsxRuntime.jsx(SelectListContent, { $maxHeight: maxHeight, children: /* @__PURE__ */ jsxRuntime.jsx(OptionContext.Provider, { value: optionContextValue, children: options2 && options2.length > 0 ? options2.map((props2, index2) => {
               if ("options" in props2) {
                 const {
                   options: itemList = [],
@@ -41405,7 +41413,9 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
   `);
   const HeaderContentWrapper = pt.div.withConfig({
     componentId: "sc-1q458rb-1"
-  })(["display:flex;align-items:center;justify-content:start;gap:inherit;"]);
+  })(["display:flex;align-items:center;justify-content:start;gap:inherit;", ""], ({
+    $interactive
+  }) => $interactive && "cursor: pointer;");
   const SortIcon = pt(SvgImage).withConfig({
     componentId: "sc-1q458rb-2"
   })(["transition:all 200ms;transform:rotate(", ");"], ({
@@ -41422,6 +41432,7 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
     ...delegated
   }) => {
     const isSorted = typeof sortDir === "string";
+    const isInteractive = Boolean(typeof onClick === "function" || isSortable && typeof onSort === "function");
     const onHeaderClick = (e) => {
       if (typeof onClick === "function") {
         onClick(e);
@@ -41430,7 +41441,7 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
         onSort();
       }
     };
-    return /* @__PURE__ */ jsxRuntime.jsx(StyledHeader, { $size: size2, ...delegated, children: /* @__PURE__ */ jsxRuntime.jsxs(HeaderContentWrapper, { onClick: onHeaderClick, children: [
+    return /* @__PURE__ */ jsxRuntime.jsx(StyledHeader, { $size: size2, ...delegated, children: /* @__PURE__ */ jsxRuntime.jsxs(HeaderContentWrapper, { onClick: onHeaderClick, $interactive: isInteractive, children: [
       isSorted && isSortable && sortPosition == "start" && /* @__PURE__ */ jsxRuntime.jsx(SortIcon, { $sortDir: sortDir, name: "arrow-down", size: "sm" }),
       label,
       isSorted && isSortable && sortPosition == "end" && /* @__PURE__ */ jsxRuntime.jsx(SortIcon, { $sortDir: sortDir, name: "arrow-down", size: "sm" })
@@ -45226,7 +45237,8 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
       color: {
         stroke: {
           "default": "#323232",
-          muted: "#323232"
+          muted: "#323232",
+          danger: "#ffbaba"
         },
         background: {
           "default": "#1F1F1C",
@@ -45234,7 +45246,8 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
         },
         label: {
           "default": "#b3b6bd",
-          muted: "#b3b6bd"
+          muted: "#b3b6bd",
+          danger: "#ffbaba"
         },
         title: {
           "default": "rgb(97.5% 97.5% 97.5%)",
@@ -47102,7 +47115,8 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
       color: {
         stroke: {
           "default": "#e6e7e9",
-          muted: "#e6e7e9"
+          muted: "#e6e7e9",
+          danger: "#c10000"
         },
         background: {
           "default": "#ffffff",
@@ -47110,7 +47124,8 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
         },
         label: {
           "default": "#696e79",
-          muted: "#696e79"
+          muted: "#696e79",
+          danger: "#c10000"
         },
         title: {
           "default": "lch(11.1 1.37 305)",
@@ -49161,7 +49176,8 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
       color: {
         stroke: {
           "default": "#e6e7e9",
-          muted: "#e6e7e9"
+          muted: "#e6e7e9",
+          danger: "#c10000"
         },
         background: {
           "default": "#ffffff",
@@ -49169,7 +49185,8 @@ Defaulting to \`${$89eedd556c436f6a$var$DEFAULT_ORIENTATION}\`.`;
         },
         label: {
           "default": "#696e79",
-          muted: "#696e79"
+          muted: "#696e79",
+          danger: "#c10000"
         },
         title: {
           "default": "lch(11.1 1.37 305)",