@lindaui/tokens 0.1.0 → 0.2.1

package/dist/index.css

@@ -220,6 +220,9 @@
   }
 }
 @layer utilities {
+  .pointer-events-auto {
+    pointer-events: auto;
+  }
   .pointer-events-none {
     pointer-events: none;
   }
@@ -229,14 +232,20 @@
   .absolute {
     position: absolute;
   }
+  .fixed {
+    position: fixed;
+  }
   .relative {
     position: relative;
   }
   .inset-0 {
     inset: 0;
   }
-  .top-1\/2 {
-    top: calc(1 / 2 * 100%);
+  .inset-x-0 {
+    inset-inline: 0;
+  }
+  .top-0 {
+    top: 0;
   }
   .top-3 {
     top: calc(var(--spacing) * 3);
@@ -256,15 +265,9 @@
   .bottom-4 {
     bottom: calc(var(--spacing) * 4);
   }
-  .left-2\.5 {
-    left: calc(var(--spacing) * 2.5);
-  }
   .left-3 {
     left: calc(var(--spacing) * 3);
   }
-  .left-3\.5 {
-    left: calc(var(--spacing) * 3.5);
-  }
   .left-4 {
     left: calc(var(--spacing) * 4);
   }
@@ -370,6 +373,9 @@
   .inline {
     display: inline;
   }
+  .inline-block {
+    display: inline-block;
+  }
   .inline-flex {
     display: inline-flex;
   }
@@ -661,10 +667,6 @@
   .shrink-0 {
     flex-shrink: 0;
   }
-  .-translate-y-1\/2 {
-    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
-    translate: var(--tw-translate-x) var(--tw-translate-y);
-  }
   .scale-125 {
     --tw-scale-x: 125%;
     --tw-scale-y: 125%;
@@ -763,6 +765,9 @@
       margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));
     }
   }
+  .gap-x-2 {
+    column-gap: calc(var(--spacing) * 2);
+  }
   .self-center {
     align-self: center;
   }
@@ -846,9 +851,6 @@
       border-color: color-mix(in oklab, var(--destructive) 35%, transparent);
     }
   }
-  .bg-\[oklch\(0\.16_0\.02_240\)\] {
-    background-color: oklch(0.16 0.02 240);
-  }
   .bg-\[var\(--accent\)\]\/10 {
     background-color: var(--accent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -909,6 +911,9 @@
       background-color: color-mix(in oklab, var(--destructive) 15%, transparent);
     }
   }
+  .bg-foreground {
+    background-color: var(--foreground);
+  }
   .bg-green-100 {
     background-color: var(--color-green-100);
   }
@@ -960,6 +965,24 @@
   .bg-yellow-100 {
     background-color: var(--color-yellow-100);
   }
+  .bg-linear-to-b {
+    --tw-gradient-position: to bottom;
+    @supports (background-image: linear-gradient(in lab, red, red)) {
+      --tw-gradient-position: to bottom in oklab;
+    }
+    background-image: linear-gradient(var(--tw-gradient-stops));
+  }
+  .from-black\/25 {
+    --tw-gradient-from: color-mix(in srgb, #000 25%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      --tw-gradient-from: color-mix(in oklab, var(--color-black) 25%, transparent);
+    }
+    --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));
+  }
+  .to-transparent {
+    --tw-gradient-to: transparent;
+    --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));
+  }
   .fill-foreground {
     fill: var(--foreground);
   }
@@ -1059,9 +1082,15 @@
   .pt-4 {
     padding-top: calc(var(--spacing) * 4);
   }
+  .pt-\[max\(0\.75rem\,env\(safe-area-inset-top\)\)\] {
+    padding-top: max(0.75rem, env(safe-area-inset-top));
+  }
   .pt-\[max\(env\(safe-area-inset-top\)\,2rem\)\] {
     padding-top: max(env(safe-area-inset-top), 2rem);
   }
+  .pr-3 {
+    padding-right: calc(var(--spacing) * 3);
+  }
   .pr-8 {
     padding-right: calc(var(--spacing) * 8);
   }
@@ -1074,8 +1103,11 @@
   .pb-4 {
     padding-bottom: calc(var(--spacing) * 4);
   }
-  .pl-8 {
-    padding-left: calc(var(--spacing) * 8);
+  .pl-2 {
+    padding-left: calc(var(--spacing) * 2);
+  }
+  .pl-\[max\(0\.875rem\,env\(safe-area-inset-left\)\)\] {
+    padding-left: max(0.875rem, env(safe-area-inset-left));
   }
   .text-center {
     text-align: center;
@@ -1184,15 +1216,9 @@
   .text-\[inherit\] {
     color: inherit;
   }
-  .text-\[oklch\(0\.9_0\.01_220\)\] {
-    color: oklch(0.9 0.01 220);
-  }
   .text-\[oklch\(0\.16_0\.02_240\)\] {
     color: oklch(0.16 0.02 240);
   }
-  .text-\[oklch\(0\.72_0\.16_18\)\] {
-    color: oklch(0.72 0.16 18);
-  }
   .text-\[var\(--accent\)\] {
     color: var(--accent);
   }
@@ -1214,6 +1240,9 @@
   .text-\[var\(--warning\)\] {
     color: var(--warning);
   }
+  .text-background {
+    color: var(--background);
+  }
   .text-black {
     color: var(--color-black);
   }
@@ -1268,20 +1297,14 @@
   .text-viewer-foreground {
     color: var(--viewer-foreground);
   }
-  .text-white {
-    color: var(--color-white);
-  }
-  .text-white\/65 {
-    color: color-mix(in srgb, #fff 65%, transparent);
+  .text-viewer-foreground\/70 {
+    color: var(--viewer-foreground);
     @supports (color: color-mix(in lab, red, red)) {
-      color: color-mix(in oklab, var(--color-white) 65%, transparent);
+      color: color-mix(in oklab, var(--viewer-foreground) 70%, transparent);
     }
   }
-  .text-white\/70 {
-    color: color-mix(in srgb, #fff 70%, transparent);
-    @supports (color: color-mix(in lab, red, red)) {
-      color: color-mix(in oklab, var(--color-white) 70%, transparent);
-    }
+  .text-white {
+    color: var(--color-white);
   }
   .text-yellow-800 {
     color: var(--color-yellow-800);
@@ -1327,6 +1350,10 @@
     --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
+  .shadow-sm {
+    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-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,);
   }
@@ -1367,6 +1394,13 @@
       }
     }
   }
+  .hover\:bg-border {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--border);
+      }
+    }
+  }
   .active\:bg-accent {
     &:active {
       background-color: var(--accent);
@@ -12842,6 +12876,14 @@
   --danger-foreground: var(--primary-foreground);
   --separator: var(--border);
   --focus: var(--ring);
+  --field-background: var(--background);
+  --field-foreground: var(--foreground);
+  --field-placeholder: var(--muted-foreground);
+  --field-border: var(--input);
+  --field-border-hover: var(--input);
+  --field-border-focus: var(--ring);
+  --field-focus: var(--ring);
+  --field-radius: var(--radius);
   --accent-soft: var(--primary);
   @supports (color: color-mix(in lab, red, red)) {
     --accent-soft: color-mix(in oklch, var(--primary) 14%, var(--surface));
@@ -12894,20 +12936,45 @@
     font-size: 18px;
   }
 }
-@property --tw-translate-x {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0;
+@keyframes ti-rec-pulse {
+  0% {
+    transform: scale(0.62);
+    opacity: 0.7;
+  }
+  100% {
+    transform: scale(1.25);
+    opacity: 0;
+  }
 }
-@property --tw-translate-y {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0;
+@keyframes ti-rec-blink {
+  0%, 100% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.25;
+  }
 }
-@property --tw-translate-z {
-  syntax: "*";
-  inherits: false;
-  initial-value: 0;
+@keyframes ti-wf {
+  0%, 100% {
+    height: 4px;
+  }
+  50% {
+    height: var(--wfmax);
+  }
+}
+@keyframes ti-fade {
+  from {
+    opacity: 0;
+  }
+}
+.ti-rec-pulse {
+  animation: ti-rec-pulse 1.8s ease-out infinite;
+}
+.ti-rec-blink {
+  animation: ti-rec-blink 1.2s ease-in-out infinite;
+}
+.ti-fade {
+  animation: ti-fade 0.25s ease both;
 }
 @property --tw-scale-x {
   syntax: "*";
@@ -12954,6 +13021,48 @@
   inherits: false;
   initial-value: solid;
 }
+@property --tw-gradient-position {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-gradient-from {
+  syntax: "<color>";
+  inherits: false;
+  initial-value: #0000;
+}
+@property --tw-gradient-via {
+  syntax: "<color>";
+  inherits: false;
+  initial-value: #0000;
+}
+@property --tw-gradient-to {
+  syntax: "<color>";
+  inherits: false;
+  initial-value: #0000;
+}
+@property --tw-gradient-stops {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-gradient-via-stops {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-gradient-from-position {
+  syntax: "<length-percentage>";
+  inherits: false;
+  initial-value: 0%;
+}
+@property --tw-gradient-via-position {
+  syntax: "<length-percentage>";
+  inherits: false;
+  initial-value: 50%;
+}
+@property --tw-gradient-to-position {
+  syntax: "<length-percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
 @property --tw-leading {
   syntax: "*";
   inherits: false;
@@ -13117,62 +13226,35 @@
   initial-value: "";
   inherits: false;
 }
-@property --tw-outline-style {
+@property --tw-translate-x {
   syntax: "*";
   inherits: false;
-  initial-value: solid;
-}
-@property --tw-border-spacing-x {
-  syntax: "<length>";
-  inherits: false;
-  initial-value: 0;
-}
-@property --tw-border-spacing-y {
-  syntax: "<length>";
-  inherits: false;
   initial-value: 0;
 }
-@property --tw-gradient-position {
+@property --tw-translate-y {
   syntax: "*";
   inherits: false;
+  initial-value: 0;
 }
-@property --tw-gradient-from {
-  syntax: "<color>";
-  inherits: false;
-  initial-value: #0000;
-}
-@property --tw-gradient-via {
-  syntax: "<color>";
-  inherits: false;
-  initial-value: #0000;
-}
-@property --tw-gradient-to {
-  syntax: "<color>";
-  inherits: false;
-  initial-value: #0000;
-}
-@property --tw-gradient-stops {
+@property --tw-translate-z {
   syntax: "*";
   inherits: false;
+  initial-value: 0;
 }
-@property --tw-gradient-via-stops {
+@property --tw-outline-style {
   syntax: "*";
   inherits: false;
+  initial-value: solid;
 }
-@property --tw-gradient-from-position {
-  syntax: "<length-percentage>";
-  inherits: false;
-  initial-value: 0%;
-}
-@property --tw-gradient-via-position {
-  syntax: "<length-percentage>";
+@property --tw-border-spacing-x {
+  syntax: "<length>";
   inherits: false;
-  initial-value: 50%;
+  initial-value: 0;
 }
-@property --tw-gradient-to-position {
-  syntax: "<length-percentage>";
+@property --tw-border-spacing-y {
+  syntax: "<length>";
   inherits: false;
-  initial-value: 100%;
+  initial-value: 0;
 }
 @property --tw-backdrop-blur {
   syntax: "*";
@@ -13273,9 +13355,6 @@
 @layer properties {
   @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
     *, ::before, ::after, ::backdrop {
-      --tw-translate-x: 0;
-      --tw-translate-y: 0;
-      --tw-translate-z: 0;
       --tw-scale-x: 1;
       --tw-scale-y: 1;
       --tw-scale-z: 1;
@@ -13286,6 +13365,15 @@
       --tw-skew-y: initial;
       --tw-space-y-reverse: 0;
       --tw-border-style: solid;
+      --tw-gradient-position: initial;
+      --tw-gradient-from: #0000;
+      --tw-gradient-via: #0000;
+      --tw-gradient-to: #0000;
+      --tw-gradient-stops: initial;
+      --tw-gradient-via-stops: initial;
+      --tw-gradient-from-position: 0%;
+      --tw-gradient-via-position: 50%;
+      --tw-gradient-to-position: 100%;
       --tw-leading: initial;
       --tw-font-weight: initial;
       --tw-tracking: initial;
@@ -13341,18 +13429,12 @@
       --tw-exit-translate-x: 0;
       --tw-exit-translate-y: 0;
       --tw-content: "";
+      --tw-translate-x: 0;
+      --tw-translate-y: 0;
+      --tw-translate-z: 0;
       --tw-outline-style: solid;
       --tw-border-spacing-x: 0;
       --tw-border-spacing-y: 0;
-      --tw-gradient-position: initial;
-      --tw-gradient-from: #0000;
-      --tw-gradient-via: #0000;
-      --tw-gradient-to: #0000;
-      --tw-gradient-stops: initial;
-      --tw-gradient-via-stops: initial;
-      --tw-gradient-from-position: 0%;
-      --tw-gradient-via-position: 50%;
-      --tw-gradient-to-position: 100%;
       --tw-backdrop-blur: initial;
       --tw-backdrop-brightness: initial;
       --tw-backdrop-contrast: initial;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lindaui/tokens",
-  "version": "0.1.0",
+  "version": "0.2.1",
   "description": "Brand design tokens (OKLCH light/dark) + HeroUI v3 + Tailwind v4 compiled into a single CSS bundle.",
   "author": "Franco Carballar <francocarballar@gmail.com>",
   "license": "MIT",