@marigold/theme-rui 1.4.1 → 2.0.1

package/dist/styles.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */
 @layer properties;
 @layer theme, base, components, utilities;
 @layer theme {
@@ -24,7 +24,6 @@
     --color-orange-900: #7c3712;
     --color-orange-950: #431a07;
     --color-yellow-100: oklch(97.3% 0.071 103.193);
-    --color-yellow-200: oklch(94.5% 0.129 101.54);
     --color-yellow-300: oklch(90.5% 0.182 98.111);
     --color-yellow-400: oklch(85.2% 0.199 91.936);
     --color-yellow-500: oklch(79.5% 0.184 86.047);
@@ -42,13 +41,11 @@
     --color-green-700: oklch(52.7% 0.154 150.069);
     --color-green-800: oklch(44.8% 0.119 151.328);
     --color-green-950: oklch(26.6% 0.065 152.934);
-    --color-teal-300: oklch(85.5% 0.138 181.071);
     --color-blue-100: oklch(93.2% 0.032 255.585);
     --color-blue-500: oklch(62.3% 0.214 259.815);
     --color-blue-600: oklch(54.6% 0.245 262.881);
     --color-blue-700: oklch(48.8% 0.243 264.376);
     --color-blue-800: oklch(42.4% 0.199 265.638);
-    --color-blue-900: oklch(37.9% 0.146 265.522);
     --color-blue-950: oklch(28.2% 0.091 267.935);
     --color-violet-500: oklch(60.6% 0.25 292.717);
     --color-purple-100: oklch(94.6% 0.033 307.174);
@@ -223,6 +220,15 @@
     --animate-slide-in-right: slide-in-right var(--slide-in-duration)
     var(--ease-out-expo);
     --animate-slide-out-right: slide-in-right var(--slide-out-duration) reverse;
+    --animate-slide-in-left: slide-in-left var(--slide-in-duration)
+    var(--ease-out-expo);
+    --animate-slide-out-left: slide-in-left var(--slide-out-duration) reverse;
+    --animate-slide-in-top: slide-in-top var(--slide-in-duration)
+    var(--ease-out-expo);
+    --animate-slide-out-top: slide-in-top var(--slide-out-duration) reverse;
+    --animate-slide-in-bottom: slide-in-bottom var(--slide-in-duration)
+    var(--ease-out-expo);
+    --animate-slide-out-bottom: slide-in-bottom var(--slide-out-duration) reverse;
     --animate-rotate-spinner: rotate-spinner 2s linear infinite;
     --animate-progress-cycle: progress-cycle 1.5s linear infinite;
   }
@@ -359,6 +365,9 @@
   [data-theme="rui"] ::-webkit-datetime-edit, [data-theme="rui"] ::-webkit-datetime-edit-year-field, [data-theme="rui"] ::-webkit-datetime-edit-month-field, [data-theme="rui"] ::-webkit-datetime-edit-day-field, [data-theme="rui"] ::-webkit-datetime-edit-hour-field, [data-theme="rui"] ::-webkit-datetime-edit-minute-field, [data-theme="rui"] ::-webkit-datetime-edit-second-field, [data-theme="rui"] ::-webkit-datetime-edit-millisecond-field, [data-theme="rui"] ::-webkit-datetime-edit-meridiem-field {
     padding-block: 0;
   }
+  [data-theme="rui"] ::-webkit-calendar-picker-indicator {
+    line-height: 1;
+  }
   [data-theme="rui"] :-moz-ui-invalid {
     box-shadow: none;
   }
@@ -391,6 +400,22 @@
   [data-theme="rui"] .visible\! {
     visibility: visible !important;
   }
+  [data-theme="rui"] .util-touch-hitbox {
+    position: relative;
+    [data-theme="rui"] &:before {
+      content: '';
+      position: absolute;
+      display: block;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      width: 100%;
+      height: 100%;
+      min-height: 24px;
+      min-width: 24px;
+      z-index: 9999;
+    }
+  }
   [data-theme="rui"] .absolute {
     position: absolute;
   }
@@ -457,9 +482,6 @@
   [data-theme="rui"] .right-auto {
     right: auto;
   }
-  [data-theme="rui"] .bottom-0 {
-    bottom: calc(var(--spacing) * 0);
-  }
   [data-theme="rui"] .bottom-0\! {
     bottom: calc(var(--spacing) * 0) !important;
   }
@@ -964,6 +986,9 @@
   [data-theme="rui"] .min-h-\[350px\] {
     min-height: 350px;
   }
+  [data-theme="rui"] .min-h-button-small {
+    min-height: 2rem;
+  }
   [data-theme="rui"] .min-h-input {
     min-height: 2.25rem;
   }
@@ -1168,9 +1193,6 @@
   [data-theme="rui"] .w-\[900px\] {
     width: 900px;
   }
-  [data-theme="rui"] .w-\[1000px\] {
-    width: 1000px;
-  }
   [data-theme="rui"] .w-\[min\(100\%_-_3rem\,60ch\)\] {
     width: min(100% - 3rem, 60ch);
   }
@@ -1876,9 +1898,6 @@
   [data-theme="rui"] .overflow-y-auto {
     overflow-y: auto;
   }
-  [data-theme="rui"] .overflow-y-scroll {
-    overflow-y: scroll;
-  }
   [data-theme="rui"] .overscroll-none {
     overscroll-behavior: none;
   }
@@ -1888,9 +1907,6 @@
   [data-theme="rui"] .rounded-2xl {
     border-radius: var(--radius-2xl);
   }
-  [data-theme="rui"] .rounded-\[2\] {
-    border-radius: 2;
-  }
   [data-theme="rui"] .rounded-\[3px\] {
     border-radius: 3px;
   }
@@ -1934,22 +1950,10 @@
     border-style: var(--tw-border-style);
     border-width: 3px;
   }
-  [data-theme="rui"] .border-4 {
-    border-style: var(--tw-border-style);
-    border-width: 4px;
-  }
-  [data-theme="rui"] .border-y-0\! {
-    border-block-style: var(--tw-border-style) !important;
-    border-block-width: 0px !important;
-  }
   [data-theme="rui"] .border-t {
     border-top-style: var(--tw-border-style);
     border-top-width: 1px;
   }
-  [data-theme="rui"] .border-r-0\! {
-    border-right-style: var(--tw-border-style) !important;
-    border-right-width: 0px !important;
-  }
   [data-theme="rui"] .border-b {
     border-bottom-style: var(--tw-border-style);
     border-bottom-width: 1px;
@@ -1995,9 +1999,6 @@
   [data-theme="rui"] .border-gray-200 {
     border-color: var(--color-gray-200);
   }
-  [data-theme="rui"] .border-gray-500 {
-    border-color: var(--color-gray-500);
-  }
   [data-theme="rui"] .border-gray-700 {
     border-color: var(--color-gray-700);
   }
@@ -2067,12 +2068,6 @@
       background-color: color-mix(in oklab, var(--color-black) 80%, transparent);
     }
   }
-  [data-theme="rui"] .bg-blue-100 {
-    background-color: var(--color-blue-100);
-  }
-  [data-theme="rui"] .bg-blue-600 {
-    background-color: var(--color-blue-600);
-  }
   [data-theme="rui"] .bg-blue-700 {
     background-color: var(--color-blue-700);
   }
@@ -2127,9 +2122,6 @@
   [data-theme="rui"] .bg-red-300 {
     background-color: var(--color-red-300);
   }
-  [data-theme="rui"] .bg-red-500 {
-    background-color: var(--color-red-500);
-  }
   [data-theme="rui"] .bg-slate-100 {
     background-color: var(--color-slate-100);
   }
@@ -2187,9 +2179,6 @@
   [data-theme="rui"] .bg-white {
     background-color: var(--color-white);
   }
-  [data-theme="rui"] .bg-yellow-200 {
-    background-color: var(--color-yellow-200);
-  }
   [data-theme="rui"] .bg-yellow-300 {
     background-color: var(--color-yellow-300);
   }
@@ -2232,48 +2221,21 @@
   [data-theme="rui"] .stroke-transparent {
     stroke: transparent;
   }
-  [data-theme="rui"] .object-contain {
-    object-fit: contain;
-  }
   [data-theme="rui"] .object-cover {
     object-fit: cover;
   }
-  [data-theme="rui"] .object-fill {
-    object-fit: fill;
-  }
   [data-theme="rui"] .object-none {
     object-fit: none;
   }
   [data-theme="rui"] .object-scale-down {
     object-fit: scale-down;
   }
-  [data-theme="rui"] .object-bottom {
-    object-position: bottom;
-  }
   [data-theme="rui"] .object-center {
     object-position: center;
   }
-  [data-theme="rui"] .object-left {
-    object-position: left;
-  }
-  [data-theme="rui"] .object-left-bottom {
-    object-position: left bottom;
-  }
   [data-theme="rui"] .object-left-top {
     object-position: left top;
   }
-  [data-theme="rui"] .object-right {
-    object-position: right;
-  }
-  [data-theme="rui"] .object-right-bottom {
-    object-position: right bottom;
-  }
-  [data-theme="rui"] .object-right-top {
-    object-position: right top;
-  }
-  [data-theme="rui"] .object-top {
-    object-position: top;
-  }
   [data-theme="rui"] .p-0 {
     padding: calc(var(--spacing) * 0);
   }
@@ -3088,10 +3050,6 @@
     --tw-leading: calc(var(--spacing) * 6);
     line-height: calc(var(--spacing) * 6);
   }
-  [data-theme="rui"] .leading-\[1\.125\] {
-    --tw-leading: 1.125;
-    line-height: 1.125;
-  }
   [data-theme="rui"] .leading-loose {
     --tw-leading: var(--leading-loose);
     line-height: var(--leading-loose);
@@ -3170,9 +3128,6 @@
   [data-theme="rui"] .text-blue-700 {
     color: var(--color-blue-700);
   }
-  [data-theme="rui"] .text-blue-900 {
-    color: var(--color-blue-900);
-  }
   [data-theme="rui"] .text-brand {
     color: var(--color-stone-950);
   }
@@ -3254,12 +3209,6 @@
   [data-theme="rui"] .text-success-muted-foreground {
     color: var(--color-green-950);
   }
-  [data-theme="rui"] .text-teal-300 {
-    color: var(--color-teal-300);
-  }
-  [data-theme="rui"] .text-transparent {
-    color: transparent;
-  }
   [data-theme="rui"] .text-violet-500 {
     color: var(--color-violet-500);
   }
@@ -3300,6 +3249,9 @@
   [data-theme="rui"] .opacity-5 {
     opacity: 5%;
   }
+  [data-theme="rui"] .opacity-50 {
+    opacity: 50%;
+  }
   [data-theme="rui"] .opacity-60 {
     opacity: 60%;
   }
@@ -3398,6 +3350,11 @@
     -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
     backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
   }
+  [data-theme="rui"] .transition-\[color\,box-shadow\,transform\] {
+    transition-property: color,box-shadow,transform;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+  }
   [data-theme="rui"] .transition-\[color\,box-shadow\] {
     transition-property: color,box-shadow;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -4371,6 +4328,14 @@
       outline-width: 2px;
     }
   }
+  [data-theme="rui"] .active\:scale-\[0\.98\] {
+    [data-theme="rui"] &:where([data-rac])[data-active] {
+      scale: 0.98;
+    }
+    [data-theme="rui"] &:where(:not([data-rac])):active {
+      scale: 0.98;
+    }
+  }
   [data-theme="rui"] .disabled\:pointer-events-none {
     [data-theme="rui"] &:where([data-rac])[data-disabled] {
       pointer-events: none;
@@ -4578,24 +4543,24 @@
       }
     }
   }
-  [data-theme="rui"] .aria-\[current\=true\]\:bg-brand {
-    [data-theme="rui"] &[aria-current="true"] {
+  [data-theme="rui"] .aria-selected\:bg-brand {
+    [data-theme="rui"] &[aria-selected="true"] {
       background-color: var(--color-stone-950);
     }
   }
-  [data-theme="rui"] .aria-\[current\=true\]\:text-brand-foreground {
-    [data-theme="rui"] &[aria-current="true"] {
+  [data-theme="rui"] .aria-selected\:text-brand-foreground {
+    [data-theme="rui"] &[aria-selected="true"] {
       color: var(--color-stone-50);
     }
   }
-  [data-theme="rui"] .aria-\[current\=true\]\:shadow-xs {
-    [data-theme="rui"] &[aria-current="true"] {
+  [data-theme="rui"] .aria-selected\:shadow-xs {
+    [data-theme="rui"] &[aria-selected="true"] {
       --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
   }
-  [data-theme="rui"] .aria-\[current\=true\]\:hover\:bg-brand\/90 {
-    [data-theme="rui"] &[aria-current="true"] {
+  [data-theme="rui"] .aria-selected\:hover\:bg-brand\/90 {
+    [data-theme="rui"] &[aria-selected="true"] {
       [data-theme="rui"] &:where([data-rac])[data-hovered] {
         background-color: color-mix(in srgb, oklch(14.7% 0.004 49.25) 90%, transparent);
         @supports (color: color-mix(in lab, red, red)) {
@@ -4622,38 +4587,16 @@
       background-color: var(--color-stone-100);
     }
   }
-  [data-theme="rui"] .data-checked\:text-white {
-    [data-theme="rui"] &[data-checked] {
-      color: var(--color-white);
-    }
-  }
   [data-theme="rui"] .data-disabled\:cursor-not-allowed {
     [data-theme="rui"] &[data-disabled] {
       cursor: not-allowed;
     }
   }
-  [data-theme="rui"] .data-focus\:outline {
-    [data-theme="rui"] &[data-focus] {
-      outline-style: var(--tw-outline-style);
-      outline-width: 1px;
-    }
-  }
-  [data-theme="rui"] .data-focus\:outline-2 {
-    [data-theme="rui"] &[data-focus] {
-      outline-style: var(--tw-outline-style);
-      outline-width: 2px;
-    }
-  }
   [data-theme="rui"] .data-focus-visible\:z-10 {
     [data-theme="rui"] &[data-focus-visible] {
       z-index: 10;
     }
   }
-  [data-theme="rui"] .data-indeterminate\:text-white {
-    [data-theme="rui"] &[data-indeterminate] {
-      color: var(--color-white);
-    }
-  }
   [data-theme="rui"] .\*\:data-placeholder\:text-placeholder {
     [data-theme="rui"] :is(& > *) {
       [data-theme="rui"] &[data-placeholder] {
@@ -4868,6 +4811,86 @@
       }
     }
   }
+  [data-theme="rui"] .data-\[placement\=bottom\]\:bottom-0 {
+    [data-theme="rui"] &[data-placement="bottom"] {
+      bottom: calc(var(--spacing) * 0);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=bottom\]\:left-0 {
+    [data-theme="rui"] &[data-placement="bottom"] {
+      left: calc(var(--spacing) * 0);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=bottom\]\:h-48 {
+    [data-theme="rui"] &[data-placement="bottom"] {
+      height: calc(var(--spacing) * 48);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=bottom\]\:h-64 {
+    [data-theme="rui"] &[data-placement="bottom"] {
+      height: calc(var(--spacing) * 64);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=bottom\]\:h-80 {
+    [data-theme="rui"] &[data-placement="bottom"] {
+      height: calc(var(--spacing) * 80);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=bottom\]\:w-full {
+    [data-theme="rui"] &[data-placement="bottom"] {
+      width: 100%;
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=left\]\:top-0 {
+    [data-theme="rui"] &[data-placement="left"] {
+      top: calc(var(--spacing) * 0);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=left\]\:left-0 {
+    [data-theme="rui"] &[data-placement="left"] {
+      left: calc(var(--spacing) * 0);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=right\]\:top-0 {
+    [data-theme="rui"] &[data-placement="right"] {
+      top: calc(var(--spacing) * 0);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=right\]\:right-0 {
+    [data-theme="rui"] &[data-placement="right"] {
+      right: calc(var(--spacing) * 0);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=top\]\:top-0 {
+    [data-theme="rui"] &[data-placement="top"] {
+      top: calc(var(--spacing) * 0);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=top\]\:left-0 {
+    [data-theme="rui"] &[data-placement="top"] {
+      left: calc(var(--spacing) * 0);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=top\]\:h-48 {
+    [data-theme="rui"] &[data-placement="top"] {
+      height: calc(var(--spacing) * 48);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=top\]\:h-64 {
+    [data-theme="rui"] &[data-placement="top"] {
+      height: calc(var(--spacing) * 64);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=top\]\:h-80 {
+    [data-theme="rui"] &[data-placement="top"] {
+      height: calc(var(--spacing) * 80);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=top\]\:w-full {
+    [data-theme="rui"] &[data-placement="top"] {
+      width: 100%;
+    }
+  }
   [data-theme="rui"] .data-\[selected\=true\]\:border {
     [data-theme="rui"] &[data-selected="true"] {
       border-style: var(--tw-border-style);
@@ -5023,6 +5046,14 @@
       margin-top: calc(var(--spacing) * 2);
     }
   }
+  [data-theme="rui"] .expanded\:contents {
+    [data-theme="rui"] &:where([data-rac])[data-expanded] {
+      display: contents;
+    }
+    [data-theme="rui"] &:where(:not([data-rac]))[expanded] {
+      display: contents;
+    }
+  }
   [data-theme="rui"] .expanded\:bg-hover {
     [data-theme="rui"] &:where([data-rac])[data-expanded] {
       background-color: var(--color-stone-100);
@@ -5031,15 +5062,75 @@
       background-color: var(--color-stone-100);
     }
   }
-  [data-theme="rui"] .entering\:animate-slide-in-right {
+  [data-theme="rui"] .entering\:animate-slide-in-left {
     [data-theme="rui"] &[data-entering] {
-      animation: slide-in-right var(--slide-in-duration)
+      animation: slide-in-left var(--slide-in-duration)
+    var(--ease-out-expo);
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=bottom\]\:entering\:animate-slide-in-bottom {
+    [data-theme="rui"] &[data-placement="bottom"] {
+      [data-theme="rui"] &[data-entering] {
+        animation: slide-in-bottom var(--slide-in-duration)
+    var(--ease-out-expo);
+      }
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=left\]\:entering\:animate-slide-in-left {
+    [data-theme="rui"] &[data-placement="left"] {
+      [data-theme="rui"] &[data-entering] {
+        animation: slide-in-left var(--slide-in-duration)
+    var(--ease-out-expo);
+      }
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=right\]\:entering\:animate-slide-in-right {
+    [data-theme="rui"] &[data-placement="right"] {
+      [data-theme="rui"] &[data-entering] {
+        animation: slide-in-right var(--slide-in-duration)
     var(--ease-out-expo);
+      }
     }
   }
-  [data-theme="rui"] .exiting\:animate-slide-out-right {
+  [data-theme="rui"] .data-\[placement\=top\]\:entering\:animate-slide-in-top {
+    [data-theme="rui"] &[data-placement="top"] {
+      [data-theme="rui"] &[data-entering] {
+        animation: slide-in-top var(--slide-in-duration)
+    var(--ease-out-expo);
+      }
+    }
+  }
+  [data-theme="rui"] .exiting\:animate-slide-out-left {
     [data-theme="rui"] &[data-exiting] {
-      animation: slide-in-right var(--slide-out-duration) reverse;
+      animation: slide-in-left var(--slide-out-duration) reverse;
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=bottom\]\:exiting\:animate-slide-out-bottom {
+    [data-theme="rui"] &[data-placement="bottom"] {
+      [data-theme="rui"] &[data-exiting] {
+        animation: slide-in-bottom var(--slide-out-duration) reverse;
+      }
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=left\]\:exiting\:animate-slide-out-left {
+    [data-theme="rui"] &[data-placement="left"] {
+      [data-theme="rui"] &[data-exiting] {
+        animation: slide-in-left var(--slide-out-duration) reverse;
+      }
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=right\]\:exiting\:animate-slide-out-right {
+    [data-theme="rui"] &[data-placement="right"] {
+      [data-theme="rui"] &[data-exiting] {
+        animation: slide-in-right var(--slide-out-duration) reverse;
+      }
+    }
+  }
+  [data-theme="rui"] .data-\[placement\=top\]\:exiting\:animate-slide-out-top {
+    [data-theme="rui"] &[data-placement="top"] {
+      [data-theme="rui"] &[data-exiting] {
+        animation: slide-in-top var(--slide-out-duration) reverse;
+      }
     }
   }
   [data-theme="rui"] .pending\:cursor-not-allowed {
@@ -5063,6 +5154,11 @@
       color: var(--color-stone-400);
     }
   }
+  [data-theme="rui"] .pressed\:scale-\[0\.98\] {
+    [data-theme="rui"] &[data-pressed] {
+      scale: 0.98;
+    }
+  }
   [data-theme="rui"] .selected\:border-b-8 {
     [data-theme="rui"] &[data-selected] {
       border-bottom-style: var(--tw-border-style);
@@ -5112,6 +5208,18 @@
       }
     }
   }
+  [data-theme="rui"] .expanded\:\[\&_\[role\=group\]\]\:contents {
+    [data-theme="rui"] &:where([data-rac])[data-expanded] {
+      [data-theme="rui"] & [role=group] {
+        display: contents;
+      }
+    }
+    [data-theme="rui"] &:where(:not([data-rac]))[expanded] {
+      [data-theme="rui"] & [role=group] {
+        display: contents;
+      }
+    }
+  }
   [data-theme="rui"] .\[\&_button\]\:px-2 {
     [data-theme="rui"] & button {
       padding-inline: calc(var(--spacing) * 2);
@@ -5355,14 +5463,19 @@
       display: none;
     }
   }
-  [data-theme="rui"] .\[\&\:has\(\[slot\=description\]\)\]\:items-center {
+  [data-theme="rui"] .\[\&\:has\(\[slot\=description\]\)\]\:items-end {
     [data-theme="rui"] &:has([slot=description]) {
-      align-items: center;
+      align-items: flex-end;
     }
   }
-  [data-theme="rui"] .\[\&\:has\(\[slot\=errorMessage\]\)\]\:items-center {
+  [data-theme="rui"] .\[\&\:has\(\[slot\=description\]\)_button\]\:mb-6 {
+    [data-theme="rui"] &:has([slot=description]) button {
+      margin-bottom: calc(var(--spacing) * 6);
+    }
+  }
+  [data-theme="rui"] .\[\&\:has\(\[slot\=errorMessage\]\)\]\:mb-6 {
     [data-theme="rui"] &:has([slot=errorMessage]) {
-      align-items: center;
+      margin-bottom: calc(var(--spacing) * 6);
     }
   }
   [data-theme="rui"] .\[\&\:has\(\[type\=checkbox\]\)\]\:pr-0 {
@@ -5767,6 +5880,30 @@
     transform: translateX(0);
   }
 }
+@keyframes slide-in-left {
+  from {
+    transform: translateX(-100%);
+  }
+  to {
+    transform: translateX(0);
+  }
+}
+@keyframes slide-in-top {
+  from {
+    transform: translateY(-100%);
+  }
+  to {
+    transform: translateY(0);
+  }
+}
+@keyframes slide-in-bottom {
+  from {
+    transform: translateY(100%);
+  }
+  to {
+    transform: translateY(0);
+  }
+}
 @keyframes rotate-spinner {
   0% {
     transform: rotate(0deg);

package/dist/theme.css

@@ -211,7 +211,7 @@
     }
   }
 
-  /* animation slide in */
+  /* animation slide in right*/
   --slide-in-duration: 0.3s;
   --slide-out-duration: 0.15s;
 
@@ -229,6 +229,51 @@
     }
   }
 
+  /* animation slide in left*/
+  --animate-slide-in-left: slide-in-left var(--slide-in-duration)
+    var(--ease-out-expo);
+  --animate-slide-out-left: slide-in-left var(--slide-out-duration) reverse;
+
+  @keyframes slide-in-left {
+    from {
+      transform: translateX(-100%);
+    }
+
+    to {
+      transform: translateX(0);
+    }
+  }
+
+  /* animation slide in top*/
+  --animate-slide-in-top: slide-in-top var(--slide-in-duration)
+    var(--ease-out-expo);
+  --animate-slide-out-top: slide-in-top var(--slide-out-duration) reverse;
+
+  @keyframes slide-in-top {
+    from {
+      transform: translateY(-100%);
+    }
+
+    to {
+      transform: translateY(0);
+    }
+  }
+
+  /* animation slide in bottom*/
+  --animate-slide-in-bottom: slide-in-bottom var(--slide-in-duration)
+    var(--ease-out-expo);
+  --animate-slide-out-bottom: slide-in-bottom var(--slide-out-duration) reverse;
+
+  @keyframes slide-in-bottom {
+    from {
+      transform: translateY(100%);
+    }
+
+    to {
+      transform: translateY(0);
+    }
+  }
+
   /* animation and keyframes */
   --animate-rotate-spinner: rotate-spinner 2s linear infinite;
   --animate-progress-cycle: progress-cycle 1.5s linear infinite;