@a4ui/core 0.29.0 → 0.30.0

package/dist/elements.css

@@ -1355,9 +1355,22 @@ video {
     max-width: 1536px;
   }
 }
+.\!pressed {
+  box-shadow: inset 0 1px 2px hsl(var(--shadow) / 0.18) !important;
+}
 .pressed {
   box-shadow: inset 0 1px 2px hsl(var(--shadow) / 0.18);
 }
+.\!card {
+  position: relative !important;
+  background: hsl(var(--card) / 0.55) !important;
+  backdrop-filter: blur(8px) saturate(150%) !important;
+  -webkit-backdrop-filter: blur(8px) saturate(150%) !important;
+  border: 1px solid hsl(var(--foreground) / 0.16) !important;
+  border-radius: var(--radius-xl, 1rem) !important;
+  box-shadow: 0 1px 2px hsl(var(--shadow) / 0.05), 0 4px 12px hsl(var(--shadow) / 0.1) !important;
+  transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s ease, border-color .2s ease !important;
+}
 .card {
   position: relative;
   background: hsl(var(--card) / 0.55);
@@ -1368,10 +1381,28 @@ video {
   box-shadow: 0 1px 2px hsl(var(--shadow) / 0.05), 0 4px 12px hsl(var(--shadow) / 0.1);
   transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s ease, border-color .2s ease;
 }
+[data-theme='light'] .\!card {
+  background: hsl(var(--card) / 0.6) !important;
+  border: 1px solid hsl(var(--border)) !important;
+}
 [data-theme='light'] .card {
   background: hsl(var(--card) / 0.6);
   border: 1px solid hsl(var(--border));
 }
+.\!card.glow-edge::before {
+  content: '' !important;
+  position: absolute !important;
+  inset: 0 !important;
+  border-radius: inherit !important;
+  padding: 1px !important;
+  background: radial-gradient(220px circle at var(--mx, 50%) var(--my, 50%), hsl(var(--primary) / .9), hsl(var(--accent) / .25) 45%, transparent 70%) !important;
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important;
+  -webkit-mask-composite: xor !important;
+  mask-composite: exclude !important;
+  opacity: 0 !important;
+  transition: opacity .35s ease !important;
+  pointer-events: none !important;
+}
 .card.glow-edge::before {
   content: '';
   position: absolute;
@@ -1386,15 +1417,26 @@ video {
   transition: opacity .35s ease;
   pointer-events: none;
 }
+.\!card.glow-edge:hover::before {
+  opacity: 1 !important;
+}
 .card.glow-edge:hover::before {
   opacity: 1;
 }
 @media (prefers-reduced-motion: reduce) {
 
+  .\!card.glow-edge::before {
+    display: none !important;
+  }
+
   .card.glow-edge::before {
     display: none;
   }
 }
+[data-theme='light'] .\!card.glow-edge::before {
+  padding: 1.5px !important;
+  background: radial-gradient(240px circle at var(--mx, 50%) var(--my, 50%), hsl(var(--primary) / 1), hsl(var(--accent) / 0.55) 42%, transparent 72%) !important;
+}
 [data-theme='light'] .card.glow-edge::before {
   padding: 1.5px;
   background: radial-gradient(240px circle at var(--mx, 50%) var(--my, 50%), hsl(var(--primary) / 1), hsl(var(--accent) / 0.55) 42%, transparent 72%);
@@ -1441,12 +1483,25 @@ html.calm .card, html.calm .bg-glass {
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
 }
+html.calm .\!card {
+  background: hsl(var(--card)) !important;
+  backdrop-filter: none !important;
+  -webkit-backdrop-filter: none !important;
+}
 html.calm .tile-glass {
   background: hsl(var(--muted));
   border-color: hsl(var(--border));
 }
 @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
 
+  .\!card {
+    background: hsl(var(--card) / 0.92) !important;
+  }
+
+  [data-theme='light'] .\!card {
+    background: hsl(var(--card) / 0.96) !important;
+  }
+
   .card {
     background: hsl(var(--card) / 0.92);
   }
@@ -1462,9 +1517,25 @@ html.calm .tile-glass {
   [data-theme='light'] .bg-glass {
     background: hsl(var(--card) / 0.97);
   }
+
+  .\!card {
+    background: hsl(var(--card) / 0.92) !important;
+  }
+
+  [data-theme='light'] .\!card {
+    background: hsl(var(--card) / 0.96) !important;
+  }
 }
 @media (prefers-reduced-transparency: reduce) {
 
+  .\!card {
+    background: hsl(var(--card) / 0.92) !important;
+  }
+
+  [data-theme='light'] .\!card {
+    background: hsl(var(--card) / 0.96) !important;
+  }
+
   .card {
     background: hsl(var(--card) / 0.92);
   }
@@ -1480,6 +1551,14 @@ html.calm .tile-glass {
   [data-theme='light'] .bg-glass {
     background: hsl(var(--card) / 0.97);
   }
+
+  .\!card {
+    background: hsl(var(--card) / 0.92) !important;
+  }
+
+  [data-theme='light'] .\!card {
+    background: hsl(var(--card) / 0.96) !important;
+  }
 }
 .sr-only {
   position: absolute;
@@ -1678,6 +1757,12 @@ html.calm .tile-glass {
 .z-\[9999\] {
   z-index: 9999;
 }
+.col-start-1 {
+  grid-column-start: 1;
+}
+.row-start-1 {
+  grid-row-start: 1;
+}
 .m-0 {
   margin: 0px;
 }
@@ -1824,6 +1909,9 @@ html.calm .tile-glass {
 .h-2 {
   height: 0.5rem;
 }
+.h-2\.5 {
+  height: 0.625rem;
+}
 .h-3 {
   height: 0.75rem;
 }
@@ -1836,6 +1924,9 @@ html.calm .tile-glass {
 .h-5 {
   height: 1.25rem;
 }
+.h-56 {
+  height: 14rem;
+}
 .h-6 {
   height: 1.5rem;
 }
@@ -1848,6 +1939,9 @@ html.calm .tile-glass {
 .h-8 {
   height: 2rem;
 }
+.h-80 {
+  height: 20rem;
+}
 .h-9 {
   height: 2.25rem;
 }
@@ -1950,6 +2044,9 @@ html.calm .tile-glass {
 .w-1\/2 {
   width: 50%;
 }
+.w-1\/3 {
+  width: 33.333333%;
+}
 .w-10 {
   width: 2.5rem;
 }
@@ -1968,6 +2065,9 @@ html.calm .tile-glass {
 .w-2 {
   width: 0.5rem;
 }
+.w-2\.5 {
+  width: 0.625rem;
+}
 .w-20 {
   width: 5rem;
 }
@@ -1983,6 +2083,9 @@ html.calm .tile-glass {
 .w-4 {
   width: 1rem;
 }
+.w-40 {
+  width: 10rem;
+}
 .w-44 {
   width: 11rem;
 }
@@ -2145,6 +2248,9 @@ html.calm .tile-glass {
 .border-collapse {
   border-collapse: collapse;
 }
+.origin-bottom {
+  transform-origin: bottom;
+}
 .origin-left {
   transform-origin: left;
 }
@@ -2155,10 +2261,18 @@ html.calm .tile-glass {
   --tw-translate-x: -50%;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+.-translate-x-full {
+  --tw-translate-x: -100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .-translate-y-1\/2 {
   --tw-translate-y: -50%;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+.translate-x-full {
+  --tw-translate-x: 100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .-rotate-90 {
   --tw-rotate: -90deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -2175,6 +2289,10 @@ html.calm .tile-glass {
   --tw-rotate: 90deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+.-skew-x-12 {
+  --tw-skew-x: -12deg;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .scale-100 {
   --tw-scale-x: 1;
   --tw-scale-y: 1;
@@ -2518,6 +2636,9 @@ html.calm .tile-glass {
 .border-border\/60 {
   border-color: hsl(var(--border) / 0.6);
 }
+.border-current {
+  border-color: currentColor;
+}
 .border-destructive\/30 {
   border-color: hsl(var(--destructive) / 0.3);
 }
@@ -2699,9 +2820,24 @@ html.calm .tile-glass {
   --tw-gradient-to: hsl(var(--primary) / 0) var(--tw-gradient-to-position);
   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
 }
+.from-transparent {
+  --tw-gradient-from: transparent var(--tw-gradient-from-position);
+  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
+.via-foreground\/25 {
+  --tw-gradient-to: hsl(var(--foreground) / 0)  var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), hsl(var(--foreground) / 0.25) var(--tw-gradient-via-position), var(--tw-gradient-to);
+}
 .to-primary {
   --tw-gradient-to: hsl(var(--primary) / 1) var(--tw-gradient-to-position);
 }
+.to-transparent {
+  --tw-gradient-to: transparent var(--tw-gradient-to-position);
+}
+.fill-current {
+  fill: currentColor;
+}
 .fill-muted {
   fill: hsl(var(--muted) / 1);
 }
@@ -3469,6 +3605,9 @@ html.calm .tile-glass {
   --tw-bg-opacity: 1;
   background-color: hsl(var(--muted) / var(--tw-bg-opacity, 1));
 }
+.hover\:bg-muted-foreground\/40:hover {
+  background-color: hsl(var(--muted-foreground) / 0.4);
+}
 .hover\:bg-muted\/40:hover {
   background-color: hsl(var(--muted) / 0.4);
 }
@@ -3600,9 +3739,24 @@ html.calm .tile-glass {
 .disabled\:opacity-50:disabled {
   opacity: 0.5;
 }
+.group:hover .group-hover\:-translate-x-full {
+  --tw-translate-x: -100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.group:hover .group-hover\:translate-x-0 {
+  --tw-translate-x: 0px;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.group:hover .group-hover\:translate-x-full {
+  --tw-translate-x: 100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .group\/block:hover .group-hover\/block\:opacity-100 {
   opacity: 1;
 }
+.group:hover .group-hover\:opacity-100 {
+  opacity: 1;
+}
 .group:focus-visible .group-focus-visible\:ring-2 {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);

package/dist/full.css

@@ -1355,9 +1355,22 @@ video {
     max-width: 1536px;
   }
 }
+.\!pressed {
+  box-shadow: inset 0 1px 2px hsl(var(--shadow) / 0.18) !important;
+}
 .pressed {
   box-shadow: inset 0 1px 2px hsl(var(--shadow) / 0.18);
 }
+.\!card {
+  position: relative !important;
+  background: hsl(var(--card) / 0.55) !important;
+  backdrop-filter: blur(8px) saturate(150%) !important;
+  -webkit-backdrop-filter: blur(8px) saturate(150%) !important;
+  border: 1px solid hsl(var(--foreground) / 0.16) !important;
+  border-radius: var(--radius-xl, 1rem) !important;
+  box-shadow: 0 1px 2px hsl(var(--shadow) / 0.05), 0 4px 12px hsl(var(--shadow) / 0.1) !important;
+  transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s ease, border-color .2s ease !important;
+}
 .card {
   position: relative;
   background: hsl(var(--card) / 0.55);
@@ -1368,10 +1381,28 @@ video {
   box-shadow: 0 1px 2px hsl(var(--shadow) / 0.05), 0 4px 12px hsl(var(--shadow) / 0.1);
   transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s ease, border-color .2s ease;
 }
+[data-theme='light'] .\!card {
+  background: hsl(var(--card) / 0.6) !important;
+  border: 1px solid hsl(var(--border)) !important;
+}
 [data-theme='light'] .card {
   background: hsl(var(--card) / 0.6);
   border: 1px solid hsl(var(--border));
 }
+.\!card.glow-edge::before {
+  content: '' !important;
+  position: absolute !important;
+  inset: 0 !important;
+  border-radius: inherit !important;
+  padding: 1px !important;
+  background: radial-gradient(220px circle at var(--mx, 50%) var(--my, 50%), hsl(var(--primary) / .9), hsl(var(--accent) / .25) 45%, transparent 70%) !important;
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important;
+  -webkit-mask-composite: xor !important;
+  mask-composite: exclude !important;
+  opacity: 0 !important;
+  transition: opacity .35s ease !important;
+  pointer-events: none !important;
+}
 .card.glow-edge::before {
   content: '';
   position: absolute;
@@ -1386,15 +1417,26 @@ video {
   transition: opacity .35s ease;
   pointer-events: none;
 }
+.\!card.glow-edge:hover::before {
+  opacity: 1 !important;
+}
 .card.glow-edge:hover::before {
   opacity: 1;
 }
 @media (prefers-reduced-motion: reduce) {
 
+  .\!card.glow-edge::before {
+    display: none !important;
+  }
+
   .card.glow-edge::before {
     display: none;
   }
 }
+[data-theme='light'] .\!card.glow-edge::before {
+  padding: 1.5px !important;
+  background: radial-gradient(240px circle at var(--mx, 50%) var(--my, 50%), hsl(var(--primary) / 1), hsl(var(--accent) / 0.55) 42%, transparent 72%) !important;
+}
 [data-theme='light'] .card.glow-edge::before {
   padding: 1.5px;
   background: radial-gradient(240px circle at var(--mx, 50%) var(--my, 50%), hsl(var(--primary) / 1), hsl(var(--accent) / 0.55) 42%, transparent 72%);
@@ -1441,12 +1483,25 @@ html.calm .card, html.calm .bg-glass {
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
 }
+html.calm .\!card {
+  background: hsl(var(--card)) !important;
+  backdrop-filter: none !important;
+  -webkit-backdrop-filter: none !important;
+}
 html.calm .tile-glass {
   background: hsl(var(--muted));
   border-color: hsl(var(--border));
 }
 @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
 
+  .\!card {
+    background: hsl(var(--card) / 0.92) !important;
+  }
+
+  [data-theme='light'] .\!card {
+    background: hsl(var(--card) / 0.96) !important;
+  }
+
   .card {
     background: hsl(var(--card) / 0.92);
   }
@@ -1462,9 +1517,25 @@ html.calm .tile-glass {
   [data-theme='light'] .bg-glass {
     background: hsl(var(--card) / 0.97);
   }
+
+  .\!card {
+    background: hsl(var(--card) / 0.92) !important;
+  }
+
+  [data-theme='light'] .\!card {
+    background: hsl(var(--card) / 0.96) !important;
+  }
 }
 @media (prefers-reduced-transparency: reduce) {
 
+  .\!card {
+    background: hsl(var(--card) / 0.92) !important;
+  }
+
+  [data-theme='light'] .\!card {
+    background: hsl(var(--card) / 0.96) !important;
+  }
+
   .card {
     background: hsl(var(--card) / 0.92);
   }
@@ -1480,6 +1551,14 @@ html.calm .tile-glass {
   [data-theme='light'] .bg-glass {
     background: hsl(var(--card) / 0.97);
   }
+
+  .\!card {
+    background: hsl(var(--card) / 0.92) !important;
+  }
+
+  [data-theme='light'] .\!card {
+    background: hsl(var(--card) / 0.96) !important;
+  }
 }
 .sr-only {
   position: absolute;
@@ -1678,6 +1757,12 @@ html.calm .tile-glass {
 .z-\[9999\] {
   z-index: 9999;
 }
+.col-start-1 {
+  grid-column-start: 1;
+}
+.row-start-1 {
+  grid-row-start: 1;
+}
 .m-0 {
   margin: 0px;
 }
@@ -1824,6 +1909,9 @@ html.calm .tile-glass {
 .h-2 {
   height: 0.5rem;
 }
+.h-2\.5 {
+  height: 0.625rem;
+}
 .h-3 {
   height: 0.75rem;
 }
@@ -1836,6 +1924,9 @@ html.calm .tile-glass {
 .h-5 {
   height: 1.25rem;
 }
+.h-56 {
+  height: 14rem;
+}
 .h-6 {
   height: 1.5rem;
 }
@@ -1848,6 +1939,9 @@ html.calm .tile-glass {
 .h-8 {
   height: 2rem;
 }
+.h-80 {
+  height: 20rem;
+}
 .h-9 {
   height: 2.25rem;
 }
@@ -1950,6 +2044,9 @@ html.calm .tile-glass {
 .w-1\/2 {
   width: 50%;
 }
+.w-1\/3 {
+  width: 33.333333%;
+}
 .w-10 {
   width: 2.5rem;
 }
@@ -1968,6 +2065,9 @@ html.calm .tile-glass {
 .w-2 {
   width: 0.5rem;
 }
+.w-2\.5 {
+  width: 0.625rem;
+}
 .w-20 {
   width: 5rem;
 }
@@ -1983,6 +2083,9 @@ html.calm .tile-glass {
 .w-4 {
   width: 1rem;
 }
+.w-40 {
+  width: 10rem;
+}
 .w-44 {
   width: 11rem;
 }
@@ -2145,6 +2248,9 @@ html.calm .tile-glass {
 .border-collapse {
   border-collapse: collapse;
 }
+.origin-bottom {
+  transform-origin: bottom;
+}
 .origin-left {
   transform-origin: left;
 }
@@ -2155,10 +2261,18 @@ html.calm .tile-glass {
   --tw-translate-x: -50%;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+.-translate-x-full {
+  --tw-translate-x: -100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .-translate-y-1\/2 {
   --tw-translate-y: -50%;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+.translate-x-full {
+  --tw-translate-x: 100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .-rotate-90 {
   --tw-rotate: -90deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -2175,6 +2289,10 @@ html.calm .tile-glass {
   --tw-rotate: 90deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+.-skew-x-12 {
+  --tw-skew-x: -12deg;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .scale-100 {
   --tw-scale-x: 1;
   --tw-scale-y: 1;
@@ -2518,6 +2636,9 @@ html.calm .tile-glass {
 .border-border\/60 {
   border-color: hsl(var(--border) / 0.6);
 }
+.border-current {
+  border-color: currentColor;
+}
 .border-destructive\/30 {
   border-color: hsl(var(--destructive) / 0.3);
 }
@@ -2699,9 +2820,24 @@ html.calm .tile-glass {
   --tw-gradient-to: hsl(var(--primary) / 0) var(--tw-gradient-to-position);
   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
 }
+.from-transparent {
+  --tw-gradient-from: transparent var(--tw-gradient-from-position);
+  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
+.via-foreground\/25 {
+  --tw-gradient-to: hsl(var(--foreground) / 0)  var(--tw-gradient-to-position);
+  --tw-gradient-stops: var(--tw-gradient-from), hsl(var(--foreground) / 0.25) var(--tw-gradient-via-position), var(--tw-gradient-to);
+}
 .to-primary {
   --tw-gradient-to: hsl(var(--primary) / 1) var(--tw-gradient-to-position);
 }
+.to-transparent {
+  --tw-gradient-to: transparent var(--tw-gradient-to-position);
+}
+.fill-current {
+  fill: currentColor;
+}
 .fill-muted {
   fill: hsl(var(--muted) / 1);
 }
@@ -3469,6 +3605,9 @@ html.calm .tile-glass {
   --tw-bg-opacity: 1;
   background-color: hsl(var(--muted) / var(--tw-bg-opacity, 1));
 }
+.hover\:bg-muted-foreground\/40:hover {
+  background-color: hsl(var(--muted-foreground) / 0.4);
+}
 .hover\:bg-muted\/40:hover {
   background-color: hsl(var(--muted) / 0.4);
 }
@@ -3600,9 +3739,24 @@ html.calm .tile-glass {
 .disabled\:opacity-50:disabled {
   opacity: 0.5;
 }
+.group:hover .group-hover\:-translate-x-full {
+  --tw-translate-x: -100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.group:hover .group-hover\:translate-x-0 {
+  --tw-translate-x: 0px;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.group:hover .group-hover\:translate-x-full {
+  --tw-translate-x: 100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .group\/block:hover .group-hover\/block\:opacity-100 {
   opacity: 1;
 }
+.group:hover .group-hover\:opacity-100 {
+  opacity: 1;
+}
 .group:focus-visible .group-focus-visible\:ring-2 {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export declare const A4UI_VERSION = "0.29.0";
+export declare const A4UI_VERSION = "0.30.0";
 export { cn } from './lib/cn';
 export { useTheme, toggleTheme, setTheme, storedTheme, applyTheme, toggled, type Theme } from './lib/theme';
 export { useEffects, isCalm, setEffects } from './lib/effects';
@@ -112,6 +112,14 @@ export { ArtifactPanel, type ArtifactPanelProps } from './ui/ArtifactPanel';
 export { FloatingToolbar, type FloatingToolbarProps } from './ui/FloatingToolbar';
 export { PageTransition, type PageTransitionProps } from './ui/PageTransition';
 export { InlineSelect, type InlineSelectProps, type InlineSelectOption } from './ui/InlineSelect';
+export { MicroButton, type MicroButtonProps, type MicroButtonEffect, type MicroButtonVariant, } from './ui/MicroButton';
+export { IconMorphButton, type IconMorphButtonProps, type IconMorphButtonVariant } from './ui/IconMorphButton';
+export { LikeButton, type LikeButtonProps, type LikeButtonIcon } from './ui/LikeButton';
+export { SlideArrowButton, type SlideArrowButtonProps, type SlideArrowButtonVariant, type SlideArrowDirection, } from './ui/SlideArrowButton';
+export { FocusBlurGroup, type FocusBlurGroupProps } from './ui/FocusBlurGroup';
+export { CardSpread, type CardSpreadProps, type CardSpreadLayout } from './ui/CardSpread';
+export { Carousel3D, type Carousel3DProps, type Carousel3DVariant } from './ui/Carousel3D';
+export { TimeMachineStack, type TimeMachineStackProps } from './ui/TimeMachineStack';
 export { CodeTabs, type CodeTabsProps, type CodeTab } from './ui/CodeTabs';
 export { PillSearch, type PillSearchProps, type PillField } from './ui/PillSearch';
 export { CategoryStrip, type CategoryStripProps, type CategoryItem } from './ui/CategoryStrip';