@synertech/ui 0.39.1 → 0.40.0

package/dist/styles.css

@@ -207,6 +207,15 @@
     --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     --default-font-family: var(--font-sans);
     --default-mono-font-family: var(--font-mono);
+    --color-chart-1: #155dfc;
+    --color-chart-2: #f54900;
+    --color-chart-3: #e60076;
+    --color-chart-4: #e17100;
+    --color-chart-5: #009689;
+    --color-chart-6: #e7000b;
+    --color-chart-7: #7f22fe;
+    --color-chart-8: #00a63e;
+    --color-chart-muted: #99a1af;
   }
 }
 @layer base {
@@ -997,6 +1006,9 @@
   .w-20 {
     width: calc(var(--spacing) * 20);
   }
+  .w-24 {
+    width: calc(var(--spacing) * 24);
+  }
   .w-48 {
     width: calc(var(--spacing) * 48);
   }
@@ -1109,6 +1121,9 @@
   .min-w-11 {
     min-width: calc(var(--spacing) * 11);
   }
+  .min-w-24 {
+    min-width: calc(var(--spacing) * 24);
+  }
   .min-w-40 {
     min-width: calc(var(--spacing) * 40);
   }
@@ -1154,6 +1169,9 @@
   .shrink-0 {
     flex-shrink: 0;
   }
+  .grow {
+    flex-grow: 1;
+  }
   .border-collapse {
     border-collapse: collapse;
   }
@@ -1259,6 +1277,9 @@
   .cursor-text {
     cursor: text;
   }
+  .touch-none {
+    touch-action: none;
+  }
   .resize {
     resize: both;
   }
@@ -1274,6 +1295,9 @@
   .list-disc {
     list-style-type: disc;
   }
+  .list-none {
+    list-style-type: none;
+  }
   .appearance-none {
     -webkit-appearance: none;
        -moz-appearance: none;
@@ -1521,6 +1545,9 @@
   .overflow-hidden {
     overflow: hidden;
   }
+  .overflow-visible {
+    overflow: visible;
+  }
   .overflow-x-auto {
     overflow-x: auto;
   }
@@ -2529,9 +2556,18 @@
   .fill-gray-300 {
     fill: var(--color-gray-300);
   }
+  .fill-gray-400 {
+    fill: var(--color-gray-400);
+  }
+  .fill-gray-500 {
+    fill: var(--color-gray-500);
+  }
   .fill-gray-600 {
     fill: var(--color-gray-600);
   }
+  .fill-gray-900 {
+    fill: var(--color-gray-900);
+  }
   .stroke-blue-500 {
     stroke: var(--color-blue-500);
   }
@@ -2586,6 +2622,9 @@
   .stroke-teal-500 {
     stroke: var(--color-teal-500);
   }
+  .stroke-white {
+    stroke: var(--color-white);
+  }
   .stroke-yellow-500 {
     stroke: var(--color-yellow-500);
   }
@@ -3190,12 +3229,18 @@
     --tw-numeric-spacing: tabular-nums;
     font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
   }
+  .\[font-variant-numeric\:tabular-nums\] {
+    font-variant-numeric: tabular-nums;
+  }
   .line-through {
     text-decoration-line: line-through;
   }
   .underline {
     text-decoration-line: underline;
   }
+  .underline-offset-2 {
+    text-underline-offset: 2px;
+  }
   .antialiased {
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
@@ -3369,6 +3414,10 @@
     --tw-blur: blur(8px);
     filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
   }
+  .invert {
+    --tw-invert: invert(100%);
+    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
+  }
   .filter {
     filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
   }
@@ -3822,13 +3871,6 @@
       }
     }
   }
-  .hover\:bg-green-600 {
-    &:hover {
-      @media (hover: hover) {
-        background-color: var(--color-green-600);
-      }
-    }
-  }
   .hover\:bg-green-700 {
     &:hover {
       @media (hover: hover) {
@@ -4437,6 +4479,22 @@
       --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
     }
   }
+  .focus-visible\:outline-2 {
+    &:focus-visible {
+      outline-style: var(--tw-outline-style);
+      outline-width: 2px;
+    }
+  }
+  .focus-visible\:outline-offset-2 {
+    &:focus-visible {
+      outline-offset: 2px;
+    }
+  }
+  .focus-visible\:outline-blue-500 {
+    &:focus-visible {
+      outline-color: var(--color-blue-500);
+    }
+  }
   .active\:scale-95 {
     &:active {
       --tw-scale-x: 95%;
@@ -4500,6 +4558,11 @@
       width: calc(var(--spacing) * 52);
     }
   }
+  .sm\:grid-cols-1 {
+    @media (width >= 40rem) {
+      grid-template-columns: repeat(1, minmax(0, 1fr));
+    }
+  }
   .sm\:grid-cols-2 {
     @media (width >= 40rem) {
       grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -5540,11 +5603,26 @@
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
   }
+  .dark\:fill-gray-100 {
+    @media (prefers-color-scheme: dark) {
+      fill: var(--color-gray-100);
+    }
+  }
   .dark\:fill-gray-300 {
     @media (prefers-color-scheme: dark) {
       fill: var(--color-gray-300);
     }
   }
+  .dark\:fill-gray-400 {
+    @media (prefers-color-scheme: dark) {
+      fill: var(--color-gray-400);
+    }
+  }
+  .dark\:fill-gray-500 {
+    @media (prefers-color-scheme: dark) {
+      fill: var(--color-gray-500);
+    }
+  }
   .dark\:fill-gray-600 {
     @media (prefers-color-scheme: dark) {
       fill: var(--color-gray-600);
@@ -5565,11 +5643,26 @@
       stroke: var(--color-gray-400);
     }
   }
+  .dark\:stroke-gray-500 {
+    @media (prefers-color-scheme: dark) {
+      stroke: var(--color-gray-500);
+    }
+  }
+  .dark\:stroke-gray-600 {
+    @media (prefers-color-scheme: dark) {
+      stroke: var(--color-gray-600);
+    }
+  }
   .dark\:stroke-gray-700 {
     @media (prefers-color-scheme: dark) {
       stroke: var(--color-gray-700);
     }
   }
+  .dark\:stroke-gray-800 {
+    @media (prefers-color-scheme: dark) {
+      stroke: var(--color-gray-800);
+    }
+  }
   .dark\:stroke-green-500 {
     @media (prefers-color-scheme: dark) {
       stroke: var(--color-green-500);
@@ -6451,6 +6544,23 @@
     transform: translateX(400%);
   }
 }
+@media (prefers-color-scheme: dark) {
+  :root:not(.light):not([data-theme="light"]) {
+    --color-chart-1: #2b7fff;
+    --color-chart-3: #f6339a;
+    --color-chart-6: #fb2c36;
+    --color-chart-7: #8e51ff;
+    --color-chart-muted: #6a7282;
+  }
+}
+:root.dark,
+:root[data-theme="dark"] {
+  --color-chart-1: #2b7fff;
+  --color-chart-3: #f6339a;
+  --color-chart-6: #fb2c36;
+  --color-chart-7: #8e51ff;
+  --color-chart-muted: #6a7282;
+}
 @property --tw-translate-x {
   syntax: "*";
   inherits: false;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synertech/ui",
-  "version": "0.39.1",
+  "version": "0.40.0",
   "type": "module",
   "description": "Synertech UI component library",
   "main": "./dist/index.cjs",