@clickhouse/click-ui 0.0.231 → 0.0.232

package/dist/click-ui.es.js

@@ -9377,9 +9377,10 @@ const BigStat = ({
   spacing = "sm",
   state = "default",
   title = "Title",
+  error: error2 = false,
   ...props
-}) => /* @__PURE__ */ jsxs(Wrapper$a, { $height: height, $order: order, $size: size2, $spacing: spacing, $state: state, $fillWidth: fillWidth, $maxWidth: maxWidth, ...props, children: [
-  /* @__PURE__ */ jsx(Label, { $state: state, $size: size2, children: label }),
+}) => /* @__PURE__ */ jsxs(Wrapper$a, { $height: height, $order: order, $size: size2, $spacing: spacing, $state: state, $fillWidth: fillWidth, $maxWidth: maxWidth, $error: error2, ...props, children: [
+  /* @__PURE__ */ jsx(Label, { $state: state, $size: size2, $error: error2, children: label }),
   /* @__PURE__ */ jsx(Title$3, { $state: state, $size: size2, children: title })
 ] });
 const Wrapper$a = styled.div.withConfig({
@@ -9392,13 +9393,14 @@ const Wrapper$a = styled.div.withConfig({
   $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"};
@@ -9411,9 +9413,10 @@ const Label = styled.div.withConfig({
 })(["", ""], ({
   $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 = styled.div.withConfig({
@@ -35220,7 +35223,11 @@ const SelectList = styled.div.withConfig({
 })(["display:flex;flex-direction:column;width:inherit;max-height:calc(var(--radix-popover-content-available-height) - 1rem);"]);
 const SelectListContent = styled.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 = styled.select.withConfig({
   componentId: "sc-oudbwg-9"
 })(["visibility:hidden;position:absolute;z-index:-1;height:0;"]);
@@ -38658,6 +38665,7 @@ const InternalSelect = ({
   options,
   sortable = false,
   placeholder = "Select an option",
+  maxHeight,
   multiple,
   checkbox,
   selectLabel,
@@ -38846,7 +38854,7 @@ const InternalSelect = ({
             /* @__PURE__ */ jsx(SearchBar, { ref: inputRef, value: search, onChange: (e) => onUpdateSearch(e.target.value), "data-testid": "select-search-input", onKeyDown, $showSearch: showSearch }),
             /* @__PURE__ */ jsx(SearchClose, { as: IconButton$1, icon: "cross", onClick: clearSearch, "data-testid": "select-search-close", $showClose: search.length > 0, size: "xs" })
           ] }),
-          /* @__PURE__ */ jsx(SelectListContent, { children: /* @__PURE__ */ jsx(OptionContext.Provider, { value: optionContextValue, children: options && options.length > 0 ? options.map((props2, index2) => {
+          /* @__PURE__ */ jsx(SelectListContent, { $maxHeight: maxHeight, children: /* @__PURE__ */ jsx(OptionContext.Provider, { value: optionContextValue, children: options && options.length > 0 ? options.map((props2, index2) => {
             if ("options" in props2) {
               const {
                 options: itemList = [],
@@ -44042,7 +44050,8 @@ const click$2 = {
     color: {
       stroke: {
         "default": "#323232",
-        muted: "#323232"
+        muted: "#323232",
+        danger: "#ffbaba"
       },
       background: {
         "default": "#1F1F1C",
@@ -44050,7 +44059,8 @@ const click$2 = {
       },
       label: {
         "default": "#b3b6bd",
-        muted: "#b3b6bd"
+        muted: "#b3b6bd",
+        danger: "#ffbaba"
       },
       title: {
         "default": "rgb(97.5% 97.5% 97.5%)",
@@ -45918,7 +45928,8 @@ const click$1 = {
     color: {
       stroke: {
         "default": "#e6e7e9",
-        muted: "#e6e7e9"
+        muted: "#e6e7e9",
+        danger: "#c10000"
       },
       background: {
         "default": "#ffffff",
@@ -45926,7 +45937,8 @@ const click$1 = {
       },
       label: {
         "default": "#696e79",
-        muted: "#696e79"
+        muted: "#696e79",
+        danger: "#c10000"
       },
       title: {
         "default": "lch(11.1 1.37 305)",
@@ -47977,7 +47989,8 @@ const click = {
     color: {
       stroke: {
         "default": "#e6e7e9",
-        muted: "#e6e7e9"
+        muted: "#e6e7e9",
+        danger: "#c10000"
       },
       background: {
         "default": "#ffffff",
@@ -47985,7 +47998,8 @@ const click = {
       },
       label: {
         "default": "#696e79",
-        muted: "#696e79"
+        muted: "#696e79",
+        danger: "#c10000"
       },
       title: {
         "default": "lch(11.1 1.37 305)",