@clickhouse/click-ui 0.0.0 → 0.0.2

package/src/styles/variables.dark.json

@@ -14,55 +14,164 @@
         }
       }
     },
+    "alert": {
+      "color": {
+        "background": {
+          "default": "#1F1F1C",
+          "success": "#0e421d",
+          "neutral": "#414141",
+          "danger": "#610000",
+          "warning": "#4f2b00",
+          "info": "#092e73"
+        },
+        "text": {
+          "default": "#b3b6bd",
+          "success": "#81e59d",
+          "neutral": "#c0c0c0",
+          "danger": "#ff7575",
+          "warning": "#ff9416",
+          "info": "#91b3f6"
+        },
+        "iconBackground": {
+          "default": "#1F1F1C",
+          "success": "lch(23.2 29.3 145)",
+          "neutral": "lch(26.7 0 0)",
+          "danger": "lch(18.1 47.8 36)",
+          "warning": "lch(21.2 33.5 64.7)",
+          "info": "lch(19.7 44.1 284)"
+        },
+        "iconForeground": {
+          "default": "#b3b6bd",
+          "success": "lch(83.5 49.5 149 / 0.75)",
+          "neutral": "lch(77.7 0 0 / 0.75)",
+          "danger": "lch(66.6 60.1 26.8 / 0.75)",
+          "warning": "lch(71.9 82.2 64 / 0.75)",
+          "info": "lch(72.4 37.5 271 / 0.75)"
+        }
+      }
+    },
+    "avatar": {
+      "color": {
+        "background": {
+          "default": "#53575f",
+          "hover": "#696e79",
+          "active": "#696e79"
+        },
+        "text": {
+          "default": "#1F1F1C",
+          "hover": "#1F1F1C",
+          "active": "#1F1F1C"
+        }
+      }
+    },
+    "badge": {
+      "color": {
+        "background": {
+          "default": "#1F1F1C",
+          "success": "#0e421d",
+          "neutral": "#414141",
+          "danger": "#610000",
+          "disabled": "#414141",
+          "info": "#092e73",
+          "warning": "#4f2b00"
+        },
+        "text": {
+          "default": "#b3b6bd",
+          "success": "#81e59d",
+          "neutral": "#c0c0c0",
+          "danger": "#ff7575",
+          "disabled": "#808080",
+          "info": "#91b3f6",
+          "warning": "#ff9416"
+        },
+        "stroke": {
+          "default": "lch(27.5 0 0 / 0.3)",
+          "success": "#0e421d",
+          "neutral": "#414141",
+          "danger": "#610000",
+          "disabled": "lch(26.2 0 0)",
+          "info": "#092e73",
+          "warning": "#4f2b00"
+        }
+      }
+    },
+    "bigStat": {
+      "color": {
+        "stroke": {
+          "default": "lch(27.5 0 0 / 0.3)"
+        },
+        "background": {
+          "default": "#1F1F1C"
+        },
+        "label": {
+          "default": "#b3b6bd"
+        },
+        "title": {
+          "default": "#ffffff"
+        }
+      }
+    },
     "button": {
       "basic": {
         "color": {
           "primary": {
             "background": {
-              "default": "#fcff74",
-              "hover": "lch(98.5 46.2 102)",
-              "active": "lch(90.5 61.1 102)"
+              "default": "#FAFF69",
+              "hover": "lch(98.3 49.3 103)",
+              "active": "lch(90.2 65.2 103)",
+              "disabled": "#414141"
             },
             "text": {
-              "default": "#1F1F1C"
+              "default": "#1F1F1C",
+              "hover": "#1F1F1C",
+              "active": "#1F1F1C",
+              "disabled": "#808080"
             },
             "stroke": {
-              "default": "#fcff74",
-              "hover": "#fcff74",
-              "active": "lch(82.8 55.9 102)"
+              "default": "#FAFF69",
+              "hover": "#FAFF69",
+              "active": "lch(82.5 59.7 103)",
+              "disabled": "#414141"
             }
           },
           "secondary": {
             "background": {
               "default": "#1F1F1C",
               "hover": "#282828",
-              "active": "lch(20.3 0 0)"
+              "active": "lch(20.3 0 0)",
+              "disabled": "#414141"
             },
             "stroke": {
               "default": "#414141",
-              "hover": "#808691",
-              "active": "lch(23.3 2.63 306)"
+              "hover": "#53575f",
+              "active": "lch(23.3 2.63 306)",
+              "disabled": "#414141"
             },
             "text": {
-              "default": "#ffffff"
-            }
-          },
-          "disabled": {
-            "background": {
-              "default": "#414141"
-            },
-            "text": {
-              "default": "#808080"
+              "default": "#ffffff",
+              "hover": "#ffffff",
+              "active": "#ffffff",
+              "disabled": "#808080"
             }
           },
           "danger": {
             "background": {
               "default": "#610000",
               "hover": "#910000",
-              "active": "#910000"
+              "active": "lch(28.6 65.8 40)",
+              "disabled": "#414141"
             },
             "text": {
-              "default": "#ff7575"
+              "default": "#ff7575",
+              "hover": "#ff7575",
+              "active": "#ff7575",
+              "disabled": "#808080"
+            },
+            "stroke": {
+              "default": "#610000",
+              "hover": "#910000",
+              "active": "lch(28.6 65.8 40)",
+              "disabled": "#414141"
             }
           }
         }
@@ -70,20 +179,20 @@
       "split": {
         "primary": {
           "stroke": {
-            "default": "lch(97.9 62.7 102)",
-            "active": "lch(83.1 56.1 102)",
-            "hover": "lch(84.6 35 102)"
+            "default": "lch(97.7 67 103)",
+            "active": "lch(82.9 59.9 103)",
+            "hover": "lch(84.4 37.4 103)"
           },
           "background": {
             "main": {
-              "default": "lch(89.5 60.4 102)",
-              "hover": "lch(90.1 42.3 102)",
-              "active": "lch(82.8 55.9 102)"
+              "default": "lch(89.3 64.5 103)",
+              "hover": "lch(89.9 45.1 103)",
+              "active": "lch(82.5 59.7 103)"
             },
             "action": {
-              "default": "lch(89.5 60.4 102)",
-              "hover": "lch(82.9 38.9 102)",
-              "active": "lch(72.9 49.2 102)"
+              "default": "lch(89.3 64.5 103)",
+              "hover": "lch(82.7 41.5 103)",
+              "active": "lch(72.6 52.5 103)"
             }
           },
           "text": {
@@ -108,28 +217,143 @@
             "panel": "lch(27.5 0 0 / 0.3)"
           }
         }
+      },
+      "alignedLeft": {
+        "color": {
+          "background": {
+            "default": "rgba(0,0,0,0)",
+            "hover": "#282828",
+            "active": "lch(15.8 0 0)"
+          },
+          "stroke": {
+            "default": "lch(27.5 0 0 / 0.3)",
+            "hover": "#53575f",
+            "active": "lch(23.3 2.63 306)"
+          },
+          "text": {
+            "default": "#ffffff",
+            "hover": "#ffffff",
+            "active": "#ffffff"
+          }
+        }
+      }
+    },
+    "card": {
+      "secondary": {
+        "color": {
+          "background": {
+            "default": "#1F1F1C",
+            "hover": "#282828",
+            "active": "lch(15.3 0 0)",
+            "disabled": "#414141"
+          },
+          "title": {
+            "default": "#ffffff",
+            "hover": "#ffffff",
+            "active": "#ffffff",
+            "disabled": "#808080"
+          },
+          "description": {
+            "default": "#b3b6bd",
+            "hover": "#b3b6bd",
+            "active": "#b3b6bd",
+            "disabled": "#808080"
+          },
+          "link": {
+            "default": "#ffffff",
+            "hover": "#FAFF69",
+            "active": "#ffffff",
+            "disabled": "#808080"
+          },
+          "stroke": {
+            "default": "lch(27.5 0 0 / 0.3)",
+            "hover": "lch(27.5 0 0 / 0.3)",
+            "active": "lch(26.1 0 0 / 0.3)",
+            "disabled": "#414141"
+          }
+        }
+      },
+      "primary": {
+        "color": {
+          "background": {
+            "default": "#1F1F1C",
+            "hover": "#282828",
+            "active": "lch(15.3 0 0)",
+            "disabled": "#414141"
+          },
+          "title": {
+            "default": "#ffffff",
+            "hover": "#ffffff",
+            "active": "#ffffff",
+            "disabled": "#808080"
+          },
+          "description": {
+            "default": "#b3b6bd",
+            "hover": "#b3b6bd",
+            "active": "#b3b6bd",
+            "disabled": "#808080"
+          },
+          "stroke": {
+            "default": "lch(27.5 0 0 / 0.3)",
+            "hover": "lch(27.5 0 0 / 0.3)",
+            "active": "lch(26.1 0 0 / 0.3)",
+            "disabled": "#414141"
+          }
+        }
+      },
+      "horizontal": {
+        "color": {
+          "background": {
+            "default": "#1F1F1C",
+            "hover": "#282828",
+            "active": "lch(15.3 0 0)",
+            "disabled": "#414141"
+          },
+          "title": {
+            "default": "#ffffff",
+            "hover": "#ffffff",
+            "active": "#ffffff",
+            "disabled": "#808080"
+          },
+          "description": {
+            "default": "#b3b6bd",
+            "hover": "#b3b6bd",
+            "active": "#b3b6bd",
+            "disabled": "#808080"
+          },
+          "stroke": {
+            "default": "lch(27.5 0 0 / 0.3)",
+            "hover": "lch(27.5 0 0 / 0.3)",
+            "active": "lch(26.1 0 0 / 0.3)",
+            "disabled": "#414141"
+          }
+        }
       }
     },
     "checkbox": {
       "color": {
         "background": {
           "default": "#282828",
-          "active": "#fcff74",
-          "disabled-checked": "#414141"
+          "hover": "#282828",
+          "active": "#FAFF69",
+          "disabled": "#414141"
         },
         "stroke": {
           "default": "#414141",
-          "active": "#fcff74",
+          "hover": "#414141",
+          "active": "#FAFF69",
           "disabled": "#606060"
         },
         "check": {
           "default": "#ffffff",
+          "hover": "#ffffff",
           "active": "#151515",
-          "disabled": "#c0c0c0"
+          "disabled": "#a0a0a0"
         },
         "label": {
           "default": "#ffffff",
-          "off": "#696e79",
+          "hover": "#ffffff",
+          "active": "#ffffff",
           "disabled": "#a0a0a0"
         }
       }
@@ -199,45 +423,35 @@
         }
       }
     },
-    "contextMenu": {
-      "color": {
-        "text": {
-          "default": "#ffffff",
-          "disabled": "#c0c0c0",
-          "muted": "#b3b6bd"
-        },
-        "background": {
-          "default": "lch(17.8 0 0)",
-          "hover": "lch(23.5 0 0)",
-          "active": "lch(23.5 0 0)"
-        }
-      },
-      "stroke": {
-        "default": "lch(27.5 0 0 / 0.3)"
-      }
-    },
     "field": {
       "color": {
         "background": {
           "default": "#282828",
+          "hover": "#282828",
           "active": "#1F1F1C",
-          "disabled": "#414141"
+          "disabled": "#414141",
+          "error": "#1F1F1C"
         },
         "text": {
           "default": "#e6e7e9",
+          "hover": "#e6e7e9",
           "active": "#ffffff",
-          "disabled": "#808080"
+          "disabled": "#808080",
+          "error": "#ff7575"
         },
         "stroke": {
           "default": "lch(31.1 0 0 / 0.3)",
-          "active": "#fcff74",
+          "hover": "lch(34.5 0 0 / 0.3)",
+          "active": "#FAFF69",
           "disabled": "#414141",
-          "hover": "lch(34.5 0 0 / 0.3)"
+          "error": "#ff7575"
         },
         "label": {
           "default": "#b3b6bd",
+          "hover": "#b3b6bd",
           "active": "#ffffff",
-          "disabled": "#a0a0a0"
+          "disabled": "#a0a0a0",
+          "error": "#ff7575"
         },
         "format": {
           "default": "lch(79.2 3.16 269)",
@@ -245,14 +459,86 @@
           "active": "lch(79.2 3.16 269)",
           "disabled": "#808080",
           "error": "lch(79.2 3.16 269)"
+        },
+        "genericLabel": {
+          "default": "#ffffff",
+          "hover": "#ffffff",
+          "active": "#ffffff",
+          "disabled": "#a0a0a0"
         }
       }
     },
-    "popover": {
-      "color": {
-        "background": {
-          "default": "lch(17.8 0 0)"
+    "genericMenu": {
+      "item": {
+        "color": {
+          "text": {
+            "default": "#ffffff",
+            "hover": "#ffffff",
+            "active": "#ffffff",
+            "disabled": "#c0c0c0",
+            "muted": "#b3b6bd"
+          },
+          "background": {
+            "default": "#282828",
+            "hover": "lch(23.5 0 0)",
+            "active": "lch(23.5 0 0)",
+            "disabled": "#414141"
+          },
+          "format": {
+            "default": "lch(79.2 3.16 269)",
+            "hover": "lch(79.2 3.16 269)",
+            "active": "lch(79.2 3.16 269)",
+            "disabled": "#808080",
+            "error": "lch(79.2 3.16 269)"
+          },
+          "stroke": {
+            "default": "lch(27.5 0 0 / 0.3)"
+          }
+        }
+      },
+      "button": {
+        "color": {
+          "background": {
+            "default": "#282828"
+          },
+          "label": {
+            "default": "#b3b6bd"
+          },
+          "stroke": {
+            "default": "lch(27.5 0 0 / 0.3)"
+          }
+        }
+      },
+      "panel": {
+        "color": {
+          "background": {
+            "default": "#282828"
+          },
+          "stroke": {
+            "default": "#414141"
+          }
         }
+      },
+      "autocomplete": {
+        "color": {
+          "placeholder": {
+            "default": "#b3b6bd"
+          },
+          "searchTerm": {
+            "default": "#ffffff"
+          },
+          "background": {
+            "default": "#282828"
+          },
+          "stroke": {
+            "default": "lch(27.5 0 0 / 0.3)"
+          }
+        }
+      }
+    },
+    "image": {
+      "color": {
+        "stroke": "#ffffff"
       }
     },
     "sidebar": {
@@ -326,12 +612,12 @@
       "color": {
         "background": {
           "default": "#606060",
-          "active": "#fcff74",
+          "active": "#FAFF69",
           "disabled": "#808080"
         },
         "stroke": {
           "default": "#606060",
-          "active": "#fcff74",
+          "active": "#FAFF69",
           "disabled": "#808080"
         },
         "indicator": {
@@ -341,56 +627,10 @@
         }
       }
     },
-    "tabs": {
-      "basic": {
-        "color": {
-          "background": {
-            "default": "rgba(0,0,0,0)",
-            "hover": "#282828",
-            "active": "rgba(0,0,0,0)"
-          },
-          "text": {
-            "default": "#b3b6bd",
-            "hover": "#ffffff",
-            "active": "#ffffff"
-          },
-          "stroke": {
-            "default": "rgba(0,0,0,0)",
-            "hover": "rgba(0,0,0,0)",
-            "active": "#fcff74"
-          },
-          "global": {
-            "default": "lch(27.5 0 0 / 0.3)"
-          }
-        }
-      },
-      "file-tabs": {
-        "color": {
-          "background": {
-            "default": "#282828",
-            "hover": "#1F1F1C",
-            "active": "#1F1F1C"
-          },
-          "text": {
-            "default": "#b3b6bd",
-            "hover": "#ffffff",
-            "active": "#ffffff"
-          },
-          "stroke": {
-            "default": "lch(27.5 0 0 / 0.3)",
-            "hover": "lch(27.5 0 0 / 0.3)",
-            "active": "lch(27.5 0 0 / 0.3)"
-          }
-        }
-      }
-    },
-    "tooltip": {
+    "separator": {
       "color": {
-        "background": {
-          "default": "lch(100 0 0 / 0.15)"
-        },
-        "label": {
-          "default": "#ffffff"
+        "stroke": {
+          "default": "lch(27.5 0 0 / 0.3)"
         }
       }
     },
@@ -407,7 +647,7 @@
           "complete": "#ffffff"
         },
         "stroke": {
-          "default": "#ffffff",
+          "default": "#282828",
           "incomplete": "rgba(0,0,0,0)",
           "complete": "rgba(0,0,0,0)"
         }
@@ -446,8 +686,8 @@
         "color": {
           "background": {
             "default": "#1F1F1C",
-            "hover": "#dae6fc",
-            "active": "#dae6fc"
+            "hover": "#1d1d1d",
+            "active": "#1d1d1d"
           },
           "stroke": {
             "default": "lch(27.5 0 0 / 0.3)"
@@ -456,7 +696,7 @@
             "default": "#ffffff"
           },
           "link": {
-            "default": "#fcff74"
+            "default": "#FAFF69"
           },
           "label": {
             "default": "#b3b6bd"
@@ -474,24 +714,99 @@
         }
       }
     },
-    "avatar": {
+    "tabs": {
+      "basic": {
+        "color": {
+          "background": {
+            "default": "rgba(0,0,0,0)",
+            "hover": "#282828",
+            "active": "rgba(0,0,0,0)"
+          },
+          "text": {
+            "default": "#b3b6bd",
+            "hover": "#ffffff",
+            "active": "#ffffff"
+          },
+          "stroke": {
+            "default": "rgba(0,0,0,0)",
+            "hover": "rgba(0,0,0,0)",
+            "active": "#FAFF69"
+          },
+          "global": {
+            "default": "lch(27.5 0 0 / 0.3)"
+          }
+        }
+      },
+      "file-tabs": {
+        "color": {
+          "background": {
+            "default": "#282828",
+            "hover": "#1F1F1C",
+            "active": "#1F1F1C"
+          },
+          "text": {
+            "default": "#b3b6bd",
+            "hover": "#ffffff",
+            "active": "#ffffff"
+          },
+          "stroke": {
+            "default": "lch(27.5 0 0 / 0.3)",
+            "hover": "lch(27.5 0 0 / 0.3)",
+            "active": "lch(27.5 0 0 / 0.3)"
+          }
+        }
+      }
+    },
+    "tooltip": {
       "color": {
         "background": {
-          "default": "#53575f",
-          "hover": "#696e79",
-          "active": "#696e79"
+          "default": "lch(100 0 0 / 0.15)"
         },
-        "text": {
-          "default": "#1F1F1C",
-          "hover": "#1F1F1C",
-          "active": "#1F1F1C"
+        "label": {
+          "default": "#ffffff"
         }
       }
     },
-    "separator": {
+    "radio": {
       "color": {
+        "background": {
+          "default": "#282828",
+          "hover": "#282828",
+          "active": "#FAFF69",
+          "disabled": "#414141"
+        },
         "stroke": {
-          "default": "lch(27.5 0 0 / 0.3)"
+          "default": "#414141",
+          "hover": "#414141",
+          "active": "#151515",
+          "disabled": "#606060"
+        },
+        "indicator": {
+          "default": "#1F1F1C",
+          "hover": "#282828",
+          "active": "#151515",
+          "disabled": "#a0a0a0"
+        }
+      }
+    },
+    "popover": {
+      "color": {
+        "panel": {
+          "background": {
+            "default": "#282828"
+          },
+          "stroke": {
+            "default": "#414141"
+          }
+        }
+      }
+    },
+    "panel": {
+      "color": {
+        "background": {
+          "default": "#1F1F1C",
+          "muted": "#282828",
+          "transparent": "rgba(0,0,0,0)"
         }
       }
     },
@@ -505,7 +820,7 @@
           "default": "#ffffff",
           "muted": "#b3b6bd",
           "link": {
-            "default": "#fcff74",
+            "default": "#FAFF69",
             "hover": "#feffba"
           }
         },
@@ -515,10 +830,13 @@
           "intense": "#414141"
         },
         "accent": {
-          "default": "#fcff74"
+          "default": "#FAFF69"
         },
         "outline": {
-          "default": "#fcff74"
+          "default": "#FAFF69"
+        },
+        "shadow": {
+          "default": "lch(6.77 0 0 / 0.6)"
         }
       }
     },