@eightshift/ui-components 5.0.10 → 5.1.0

package/dist/assets/style.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.10 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */
 @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 {
@@ -318,7 +318,6 @@
   --es-radius-2xl: 1rem;
   --es-radius-3xl: 1.5rem;
   --es-drop-shadow-sm: 0 1px 2px #00000026;
-  --es-animate-spin: spin 1s linear infinite;
   --es-blur-sm: 8px;
   --es-blur-lg: 16px;
   --es-blur-3xl: 64px;
@@ -1233,24 +1232,16 @@
     top: calc(var(--es-spacing) * 4);
   }
 
-  .es\:right-0 {
-    right: calc(var(--es-spacing) * 0);
-  }
-
   .es\:right-1 {
     right: calc(var(--es-spacing) * 1);
   }
 
-  .es\:right-4 {
-    right: calc(var(--es-spacing) * 4);
+  .es\:right-2 {
+    right: calc(var(--es-spacing) * 2);
   }
 
-  .es\:right-6 {
-    right: calc(var(--es-spacing) * 6);
-  }
-
-  .es\:right-16 {
-    right: calc(var(--es-spacing) * 16);
+  .es\:right-4 {
+    right: calc(var(--es-spacing) * 4);
   }
 
   .es\:-bottom-0\.5 {
@@ -1265,10 +1256,6 @@
     left: calc(var(--es-spacing) * 0);
   }
 
-  .es\:left-2 {
-    left: calc(var(--es-spacing) * 2);
-  }
-
   .es\:left-3\.5 {
     left: calc(var(--es-spacing) * 3.5);
   }
@@ -1349,6 +1336,10 @@
     margin: calc(var(--es-spacing) * .5);
   }
 
+  .es\:m-2 {
+    margin: calc(var(--es-spacing) * 2);
+  }
+
   .es\:m-5 {
     margin: calc(var(--es-spacing) * 5);
   }
@@ -1381,10 +1372,6 @@
     margin-block: calc(var(--es-spacing) * 1);
   }
 
-  .es\:my-4 {
-    margin-block: calc(var(--es-spacing) * 4);
-  }
-
   .es\:my-10 {
     margin-block: calc(var(--es-spacing) * 10);
   }
@@ -1425,10 +1412,6 @@
     margin-right: calc(var(--es-spacing) * 6);
   }
 
-  .es\:mr-7 {
-    margin-right: calc(var(--es-spacing) * 7);
-  }
-
   .es\:mb-1 {
     margin-bottom: calc(var(--es-spacing) * 1);
   }
@@ -1465,6 +1448,10 @@
     margin-left: calc(var(--es-spacing) * 1.5);
   }
 
+  .es\:ml-1\.25 {
+    margin-left: calc(var(--es-spacing) * 1.25);
+  }
+
   .es\:ml-3 {
     margin-left: calc(var(--es-spacing) * 3);
   }
@@ -1473,6 +1460,13 @@
     margin-left: auto;
   }
 
+  .es\:line-clamp-1 {
+    -webkit-line-clamp: 1;
+    -webkit-box-orient: vertical;
+    display: -webkit-box;
+    overflow: hidden;
+  }
+
   .es\:block {
     display: block;
   }
@@ -1698,6 +1692,10 @@
     max-height: calc(var(--es-spacing) * 40);
   }
 
+  .es\:max-h-72 {
+    max-height: calc(var(--es-spacing) * 72);
+  }
+
   .es\:min-h-5 {
     min-height: calc(var(--es-spacing) * 5);
   }
@@ -1734,6 +1732,10 @@
     min-height: calc(var(--es-spacing) * 14);
   }
 
+  .es\:min-h-16 {
+    min-height: calc(var(--es-spacing) * 16);
+  }
+
   .es\:min-h-24 {
     min-height: calc(var(--es-spacing) * 24);
   }
@@ -1826,8 +1828,8 @@
     width: calc(var(--es-spacing) * 52);
   }
 
-  .es\:w-80 {
-    width: calc(var(--es-spacing) * 80);
+  .es\:w-76 {
+    width: calc(var(--es-spacing) * 76);
   }
 
   .es\:w-96 {
@@ -1874,8 +1876,8 @@
     max-width: calc(var(--es-spacing) * 72);
   }
 
-  .es\:max-w-80 {
-    max-width: calc(var(--es-spacing) * 80);
+  .es\:max-w-76 {
+    max-width: calc(var(--es-spacing) * 76);
   }
 
   .es\:max-w-96 {
@@ -2041,6 +2043,22 @@
     rotate: 45deg;
   }
 
+  .es\:motion-preset-slide-down {
+    --motion-origin-translate-y: -25%;
+    --motion-origin-opacity: 0;
+    --motion-opacity-in-animation: motion-opacity-in calc(var(--motion-opacity-duration, var(--motion-duration)) * var(--motion-opacity-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-opacity-timing, var(--motion-timing)) var(--motion-opacity-delay, var(--motion-delay)) both;
+    --motion-translate-in-animation: motion-translate-in calc(var(--motion-translate-duration, var(--motion-duration)) * var(--motion-translate-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-translate-timing, var(--motion-timing)) var(--motion-translate-delay, var(--motion-delay)) both;
+    animation: var(--motion-scale-in-animation), var(--motion-translate-in-animation), var(--motion-rotate-in-animation), var(--motion-filter-in-animation), var(--motion-opacity-in-animation), var(--motion-background-color-in-animation), var(--motion-text-color-in-animation), var(--motion-scale-loop-animation), var(--motion-translate-loop-animation), var(--motion-rotate-loop-animation), var(--motion-filter-loop-animation), var(--motion-opacity-loop-animation), var(--motion-background-color-loop-animation), var(--motion-text-color-loop-animation);
+  }
+
+  .es\:motion-preset-slide-up {
+    --motion-origin-translate-y: 25%;
+    --motion-origin-opacity: 0;
+    --motion-opacity-in-animation: motion-opacity-in calc(var(--motion-opacity-duration, var(--motion-duration)) * var(--motion-opacity-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-opacity-timing, var(--motion-timing)) var(--motion-opacity-delay, var(--motion-delay)) both;
+    --motion-translate-in-animation: motion-translate-in calc(var(--motion-translate-duration, var(--motion-duration)) * var(--motion-translate-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-translate-timing, var(--motion-timing)) var(--motion-translate-delay, var(--motion-delay)) both;
+    animation: var(--motion-scale-in-animation), var(--motion-translate-in-animation), var(--motion-rotate-in-animation), var(--motion-filter-in-animation), var(--motion-opacity-in-animation), var(--motion-background-color-in-animation), var(--motion-text-color-in-animation), var(--motion-scale-loop-animation), var(--motion-translate-loop-animation), var(--motion-rotate-loop-animation), var(--motion-filter-loop-animation), var(--motion-opacity-loop-animation), var(--motion-background-color-loop-animation), var(--motion-text-color-loop-animation);
+  }
+
   .es\:motion-preset-spin {
     --motion-loop-rotate: 360deg;
     --motion-timing: linear;
@@ -2074,6 +2092,12 @@
     animation: var(--motion-scale-in-animation), var(--motion-translate-in-animation), var(--motion-rotate-in-animation), var(--motion-filter-in-animation), var(--motion-opacity-in-animation), var(--motion-background-color-in-animation), var(--motion-text-color-in-animation), var(--motion-scale-loop-animation), var(--motion-translate-loop-animation), var(--motion-rotate-loop-animation), var(--motion-filter-loop-animation), var(--motion-opacity-loop-animation), var(--motion-background-color-loop-animation), var(--motion-text-color-loop-animation);
   }
 
+  .es\:motion-opacity-in-0 {
+    --motion-origin-opacity: .001;
+    --motion-opacity-in-animation: motion-opacity-in calc(var(--motion-opacity-duration, var(--motion-duration)) * var(--motion-opacity-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-opacity-timing, var(--motion-timing)) var(--motion-opacity-delay, var(--motion-delay)) both;
+    animation: var(--motion-scale-in-animation), var(--motion-translate-in-animation), var(--motion-rotate-in-animation), var(--motion-filter-in-animation), var(--motion-opacity-in-animation), var(--motion-background-color-in-animation), var(--motion-text-color-in-animation), var(--motion-scale-loop-animation), var(--motion-translate-loop-animation), var(--motion-rotate-loop-animation), var(--motion-filter-loop-animation), var(--motion-opacity-loop-animation), var(--motion-background-color-loop-animation), var(--motion-text-color-loop-animation);
+  }
+
   .es\:motion-opacity-out {
     --motion-end-opacity: 0;
     --motion-opacity-out-animation: motion-opacity-out calc(var(--motion-opacity-duration, var(--motion-duration)) * var(--motion-opacity-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-opacity-timing, var(--motion-timing)) var(--motion-opacity-delay, var(--motion-delay)) both;
@@ -2098,10 +2122,6 @@
     animation: var(--motion-scale-out-animation), var(--motion-translate-out-animation), var(--motion-rotate-out-animation), var(--motion-filter-out-animation), var(--motion-opacity-out-animation), var(--motion-background-color-out-animation), var(--motion-text-color-out-animation);
   }
 
-  .es\:animate-spin {
-    animation: var(--es-animate-spin);
-  }
-
   .es\:cursor-default {
     cursor: default;
   }
@@ -2118,6 +2138,10 @@
     cursor: pointer;
   }
 
+  .es\:scroll-m-1 {
+    scroll-margin: calc(var(--es-spacing) * 1);
+  }
+
   .es\:list-none {
     list-style-type: none;
   }
@@ -2440,6 +2464,10 @@
     overflow-x: auto;
   }
 
+  .es\:overflow-x-clip {
+    overflow-x: clip;
+  }
+
   .es\:overflow-x-hidden {
     overflow-x: hidden;
   }
@@ -3417,6 +3445,10 @@
     padding-inline: calc(var(--es-spacing) * 5);
   }
 
+  .es\:py-0 {
+    padding-block: calc(var(--es-spacing) * 0);
+  }
+
   .es\:py-0\.5 {
     padding-block: calc(var(--es-spacing) * .5);
   }
@@ -3676,10 +3708,6 @@
     color: var(--es-color-accent-950);
   }
 
-  .es\:text-amber-950 {
-    color: var(--es-color-amber-950);
-  }
-
   .es\:text-black {
     color: var(--es-color-black);
   }
@@ -3846,10 +3874,6 @@
     color: var(--es-color-slate-500);
   }
 
-  .es\:text-transparent {
-    color: #0000;
-  }
-
   .es\:text-white {
     color: var(--es-color-white);
   }
@@ -3965,6 +3989,11 @@
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
 
+  .es\:inset-ring-0 {
+    --tw-inset-ring-shadow: inset 0 0 0 0px var(--tw-inset-ring-color, currentcolor);
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
+
   .es\:shadow-accent-500\/25 {
     --tw-shadow-color: var(--es-color-accent-500);
   }
@@ -4179,16 +4208,6 @@
     }
   }
 
-  .es\:inset-ring-secondary-200\/30 {
-    --tw-inset-ring-color: var(--es-color-secondary-200);
-  }
-
-  @supports (color: color-mix(in lab, red, red)) {
-    .es\:inset-ring-secondary-200\/30 {
-      --tw-inset-ring-color: color-mix(in oklab, var(--es-color-secondary-200) 30%, transparent);
-    }
-  }
-
   .es\:outline-hidden {
     --tw-outline-style: none;
     outline-style: none;
@@ -4331,9 +4350,9 @@
     transition-duration: .3s;
   }
 
-  .es\:ease-\[var\(--motion-spring-snappy\)\] {
-    --tw-ease: var(--motion-spring-snappy);
-    transition-timing-function: var(--motion-spring-snappy);
+  .es\:ease-\[var\(--motion-spring-bouncy\)\] {
+    --tw-ease: var(--motion-spring-bouncy);
+    transition-timing-function: var(--motion-spring-bouncy);
   }
 
   .es\:will-change-\[transform\,opacity\] {
@@ -4344,6 +4363,19 @@
     will-change: transform;
   }
 
+  .es\:motion-ease-spring-bouncy {
+    --motion-timing: var(--motion-spring-bouncy);
+    --motion-perceptual-duration-multiplier: 1.66;
+    --motion-filter-timing: var(--motion-spring-smooth);
+    --motion-opacity-timing: var(--motion-spring-smooth);
+    --motion-background-color-timing: var(--motion-spring-smooth);
+    --motion-text-color-timing: var(--motion-spring-smooth);
+    --motion-filter-perceptual-duration-multiplier: 1.66;
+    --motion-opacity-perceptual-duration-multiplier: 1.66;
+    --motion-background-color-perceptual-duration-multiplier: 1.66;
+    --motion-text-color-perceptual-duration-multiplier: 1.66;
+  }
+
   .es\:motion-ease-linear\/opacity {
     --motion-opacity-timing: linear;
     --motion-opacity-perceptual-duration-multiplier: 1;
@@ -4359,11 +4391,6 @@
     --motion-scale-perceptual-duration-multiplier: 1.66;
   }
 
-  .es\:motion-ease-spring-snappy {
-    --motion-timing: var(--motion-spring-snappy);
-    --motion-perceptual-duration-multiplier: 1.66;
-  }
-
   .es\:motion-ease-spring-snappy\/scale {
     --motion-scale-timing: var(--motion-spring-snappy);
     --motion-scale-perceptual-duration-multiplier: 1.66;
@@ -4454,27 +4481,7 @@
     padding-bottom: calc(var(--es-spacing) * 4);
   }
 
-  .es\:not-disabled\:cursor-pointer:not(:is(:disabled, [data-rac][data-disabled])) {
-    cursor: pointer;
-  }
-
-  @media not all and (prefers-reduced-motion: reduce) {
-    .es\:not-motion-reduce\:motion-preset-slide-down-sm {
-      --motion-origin-translate-y: -5%;
-      --motion-origin-opacity: 0;
-      --motion-opacity-in-animation: motion-opacity-in calc(var(--motion-opacity-duration, var(--motion-duration)) * var(--motion-opacity-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-opacity-timing, var(--motion-timing)) var(--motion-opacity-delay, var(--motion-delay)) both;
-      --motion-translate-in-animation: motion-translate-in calc(var(--motion-translate-duration, var(--motion-duration)) * var(--motion-translate-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-translate-timing, var(--motion-timing)) var(--motion-translate-delay, var(--motion-delay)) both;
-      animation: var(--motion-scale-in-animation), var(--motion-translate-in-animation), var(--motion-rotate-in-animation), var(--motion-filter-in-animation), var(--motion-opacity-in-animation), var(--motion-background-color-in-animation), var(--motion-text-color-in-animation), var(--motion-scale-loop-animation), var(--motion-translate-loop-animation), var(--motion-rotate-loop-animation), var(--motion-filter-loop-animation), var(--motion-opacity-loop-animation), var(--motion-background-color-loop-animation), var(--motion-text-color-loop-animation);
-    }
-
-    .es\:not-motion-reduce\:motion-translate-y-out-\[-2\.5\%\] {
-      --motion-end-translate-y: -2.5%;
-      --motion-translate-out-animation: motion-translate-out calc(var(--motion-translate-duration, var(--motion-duration)) * var(--motion-translate-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-translate-timing, var(--motion-timing)) var(--motion-translate-delay, var(--motion-delay)) both;
-      animation: var(--motion-scale-out-animation), var(--motion-translate-out-animation), var(--motion-rotate-out-animation), var(--motion-filter-out-animation), var(--motion-opacity-out-animation), var(--motion-background-color-out-animation), var(--motion-text-color-out-animation);
-    }
-  }
-
-  .es\:group-not-disabled\:cursor-pointer:is(:where(.es\:group):not(:is(:disabled, [data-rac][data-disabled])) *) {
+  .es\:not-disabled\:cursor-pointer:not(:is(:disabled, [data-rac][data-disabled])), .es\:group-not-disabled\:cursor-pointer:is(:where(.es\:group):not(:is(:disabled, [data-rac][data-disabled])) *) {
     cursor: pointer;
   }
 
@@ -4597,6 +4604,32 @@
     --tw-inset-ring-color: var(--es-color-accent-600);
   }
 
+  .es\:group-not-selected\:group-focus-visible\:bg-secondary-100:is(:where(.es\:group):not([data-selected]) *):is(:where(.es\:group):is(:focus-visible:not(:focus), [data-rac][data-focus-visible]) *) {
+    background-color: var(--es-color-secondary-100);
+  }
+
+  .es\:group-not-selected\:group-focus-visible\:outline-hidden:is(:where(.es\:group):not([data-selected]) *):is(:where(.es\:group):is(:focus-visible:not(:focus), [data-rac][data-focus-visible]) *) {
+    --tw-outline-style: none;
+    outline-style: none;
+  }
+
+  @media (forced-colors: active) {
+    .es\:group-not-selected\:group-focus-visible\:outline-hidden:is(:where(.es\:group):not([data-selected]) *):is(:where(.es\:group):is(:focus-visible:not(:focus), [data-rac][data-focus-visible]) *) {
+      outline-offset: 2px;
+      outline: 2px solid #0000;
+    }
+  }
+
+  .es\:group-active\:bg-accent-700\/15:is(:where(.es\:group):active *) {
+    background-color: var(--es-color-accent-700);
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .es\:group-active\:bg-accent-700\/15:is(:where(.es\:group):active *) {
+      background-color: color-mix(in oklab, var(--es-color-accent-700) 15%, transparent);
+    }
+  }
+
   .es\:group-aria-expanded\:-scale-y-100:is(:where(.es\:group)[aria-expanded="true"] *) {
     --tw-scale-y: calc(100% * -1);
     scale: var(--tw-scale-x) var(--tw-scale-y);
@@ -4628,14 +4661,24 @@
     }
   }
 
-  .es\:group-selected\:bg-accent-600:is(:where(.es\:group)[data-selected] *) {
+  .es\:group-selected\:bg-accent-600:is(:where(.es\:group)[data-selected] *), .es\:group-selected\:bg-accent-600\/15:is(:where(.es\:group)[data-selected] *) {
     background-color: var(--es-color-accent-600);
   }
 
+  @supports (color: color-mix(in lab, red, red)) {
+    .es\:group-selected\:bg-accent-600\/15:is(:where(.es\:group)[data-selected] *) {
+      background-color: color-mix(in oklab, var(--es-color-accent-600) 15%, transparent);
+    }
+  }
+
   .es\:group-selected\:text-accent-900:is(:where(.es\:group)[data-selected] *) {
     color: var(--es-color-accent-900);
   }
 
+  .es\:group-selected\:text-accent-950:is(:where(.es\:group)[data-selected] *) {
+    color: var(--es-color-accent-950);
+  }
+
   .es\:group-selected\:text-white:is(:where(.es\:group)[data-selected] *) {
     color: var(--es-color-white);
   }
@@ -4650,12 +4693,35 @@
     }
   }
 
-  .es\:peer-disabled\:opacity-40:is(:where(.es\:peer):is(:disabled, [data-rac][data-disabled]) ~ *) {
-    opacity: .4;
+  .es\:group-selected\:group-focus-visible\:inset-ring:is(:where(.es\:group)[data-selected] *):is(:where(.es\:group):is(:focus-visible:not(:focus), [data-rac][data-focus-visible]) *) {
+    --tw-inset-ring-shadow: inset 0 0 0 1px var(--tw-inset-ring-color, currentcolor);
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
 
-  .es\:peer-data-\[focused\=true\]\:invisible:is(:where(.es\:peer)[data-focused="true"] ~ *) {
-    visibility: hidden;
+  .es\:group-selected\:group-focus-visible\:inset-ring-accent-600\/30:is(:where(.es\:group)[data-selected] *):is(:where(.es\:group):is(:focus-visible:not(:focus), [data-rac][data-focus-visible]) *) {
+    --tw-inset-ring-color: var(--es-color-accent-600);
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .es\:group-selected\:group-focus-visible\:inset-ring-accent-600\/30:is(:where(.es\:group)[data-selected] *):is(:where(.es\:group):is(:focus-visible:not(:focus), [data-rac][data-focus-visible]) *) {
+      --tw-inset-ring-color: color-mix(in oklab, var(--es-color-accent-600) 30%, transparent);
+    }
+  }
+
+  .es\:group-any-focus\:outline-hidden:is(:where(.es\:group):is(:focus-visible, [data-rac][data-focus-visible], :focus, [data-rac][data-focused]) *) {
+    --tw-outline-style: none;
+    outline-style: none;
+  }
+
+  @media (forced-colors: active) {
+    .es\:group-any-focus\:outline-hidden:is(:where(.es\:group):is(:focus-visible, [data-rac][data-focus-visible], :focus, [data-rac][data-focused]) *) {
+      outline-offset: 2px;
+      outline: 2px solid #0000;
+    }
+  }
+
+  .es\:peer-placeholder-shown\:opacity-0:is(:where(.es\:peer)[data-placeholder] ~ *), .es\:peer-placeholder-shown\:opacity-0:is(:where(.es\:peer):placeholder-shown ~ *) {
+    opacity: 0;
   }
 
   .es\:selection\:bg-accent-500\/20 ::selection {
@@ -4678,14 +4744,6 @@
     }
   }
 
-  .es\:selection\:bg-transparent ::selection {
-    background-color: #0000;
-  }
-
-  .es\:selection\:bg-transparent::selection {
-    background-color: #0000;
-  }
-
   .es\:selection\:text-accent-950 ::selection {
     color: var(--es-color-accent-950);
   }
@@ -4694,12 +4752,8 @@
     color: var(--es-color-accent-950);
   }
 
-  .es\:selection\:text-transparent ::selection {
-    color: #0000;
-  }
-
-  .es\:selection\:text-transparent::selection {
-    color: #0000;
+  .es\:placeholder\:text-secondary-500::placeholder {
+    color: var(--es-color-secondary-500);
   }
 
   .es\:after\:absolute:after {
@@ -5205,49 +5259,59 @@
     }
   }
 
-  .es\:hover\:outline-hidden:where([data-rac])[data-hovered] {
-    --tw-outline-style: none;
-    outline-style: none;
+  .es\:not-disabled\:not-selected\:hover\:bg-secondary-100:not(:is(:disabled, [data-rac][data-disabled])):not([data-selected]):where([data-rac])[data-hovered] {
+    background-color: var(--es-color-secondary-100);
   }
 
-  @media (forced-colors: active) {
-    .es\:hover\:outline-hidden:where([data-rac])[data-hovered] {
-      outline-offset: 2px;
-      outline: 2px solid #0000;
+  @media (hover: hover) {
+    .es\:not-disabled\:not-selected\:hover\:bg-secondary-100:not(:is(:disabled, [data-rac][data-disabled])):not([data-selected]):where(:not([data-rac])):hover {
+      background-color: var(--es-color-secondary-100);
     }
   }
 
-  @media (hover: hover) {
-    .es\:hover\:outline-hidden:where(:not([data-rac])):hover {
-      --tw-outline-style: none;
-      outline-style: none;
-    }
+  .es\:not-disabled\:not-selected\:hover\:text-secondary-900:not(:is(:disabled, [data-rac][data-disabled])):not([data-selected]):where([data-rac])[data-hovered] {
+    color: var(--es-color-secondary-900);
+  }
 
-    @media (forced-colors: active) {
-      .es\:hover\:outline-hidden:where(:not([data-rac])):hover {
-        outline-offset: 2px;
-        outline: 2px solid #0000;
-      }
+  @media (hover: hover) {
+    .es\:not-disabled\:not-selected\:hover\:text-secondary-900:not(:is(:disabled, [data-rac][data-disabled])):not([data-selected]):where(:not([data-rac])):hover {
+      color: var(--es-color-secondary-900);
     }
   }
 
-  .es\:not-disabled\:not-selected\:hover\:bg-secondary-100:not(:is(:disabled, [data-rac][data-disabled])):not([data-selected]):where([data-rac])[data-hovered] {
+  .es\:group-not-selected\:hover\:bg-secondary-100:is(:where(.es\:group):not([data-selected]) *):where([data-rac])[data-hovered] {
     background-color: var(--es-color-secondary-100);
   }
 
   @media (hover: hover) {
-    .es\:not-disabled\:not-selected\:hover\:bg-secondary-100:not(:is(:disabled, [data-rac][data-disabled])):not([data-selected]):where(:not([data-rac])):hover {
+    .es\:group-not-selected\:hover\:bg-secondary-100:is(:where(.es\:group):not([data-selected]) *):where(:not([data-rac])):hover {
       background-color: var(--es-color-secondary-100);
     }
   }
 
-  .es\:not-disabled\:not-selected\:hover\:text-secondary-900:not(:is(:disabled, [data-rac][data-disabled])):not([data-selected]):where([data-rac])[data-hovered] {
-    color: var(--es-color-secondary-900);
+  .es\:group-not-selected\:hover\:outline-hidden:is(:where(.es\:group):not([data-selected]) *):where([data-rac])[data-hovered] {
+    --tw-outline-style: none;
+    outline-style: none;
+  }
+
+  @media (forced-colors: active) {
+    .es\:group-not-selected\:hover\:outline-hidden:is(:where(.es\:group):not([data-selected]) *):where([data-rac])[data-hovered] {
+      outline-offset: 2px;
+      outline: 2px solid #0000;
+    }
   }
 
   @media (hover: hover) {
-    .es\:not-disabled\:not-selected\:hover\:text-secondary-900:not(:is(:disabled, [data-rac][data-disabled])):not([data-selected]):where(:not([data-rac])):hover {
-      color: var(--es-color-secondary-900);
+    .es\:group-not-selected\:hover\:outline-hidden:is(:where(.es\:group):not([data-selected]) *):where(:not([data-rac])):hover {
+      --tw-outline-style: none;
+      outline-style: none;
+    }
+
+    @media (forced-colors: active) {
+      .es\:group-not-selected\:hover\:outline-hidden:is(:where(.es\:group):not([data-selected]) *):where(:not([data-rac])):hover {
+        outline-offset: 2px;
+        outline: 2px solid #0000;
+      }
     }
   }
 
@@ -5295,10 +5359,6 @@
     border-color: var(--es-color-accent-500);
   }
 
-  .es\:focus\:text-current:where([data-rac])[data-focused], .es\:focus\:text-current:where(:not([data-rac])):focus {
-    color: currentColor;
-  }
-
   .es\:focus\:shadow-none\!:where([data-rac])[data-focused], .es\:focus\:shadow-none\!:where(:not([data-rac])):focus {
     --tw-shadow: 0 0 #0000 !important;
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
@@ -5759,10 +5819,6 @@
     }
   }
 
-  .es\:has-\[svg\]\:left-1:has(:is(svg)) {
-    left: calc(var(--es-spacing) * 1);
-  }
-
   .es\:has-\[\>_\:only-child\]\:pb-0:has( > :only-child) {
     padding-bottom: calc(var(--es-spacing) * 0);
   }
@@ -5856,6 +5912,10 @@
       --motion-perceptual-duration-multiplier: 1.66;
     }
 
+    .es\:motion-safe\:motion-duration-200 {
+      --motion-duration: .2s;
+    }
+
     .es\:motion-safe\:motion-duration-300 {
       --motion-duration: .3s;
     }
@@ -5910,7 +5970,7 @@
   }
 
   @media (prefers-reduced-motion: reduce) {
-    .es\:motion-reduce\:motion-preset-fade, .es\:motion-reduce\:motion-preset-fade-md {
+    .es\:motion-reduce\:motion-preset-fade-md {
       --motion-origin-opacity: 0;
       --motion-duration: .5s;
       --motion-opacity-in-animation: motion-opacity-in calc(var(--motion-opacity-duration, var(--motion-duration)) * var(--motion-opacity-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-opacity-timing, var(--motion-timing)) var(--motion-opacity-delay, var(--motion-delay)) both;
@@ -5940,6 +6000,78 @@
     }
   }
 
+  .es\:placement-left\:origin-right[data-placement="left"] {
+    transform-origin: 100%;
+  }
+
+  @media (prefers-reduced-motion: no-preference) {
+    .es\:motion-safe\:placement-left\:motion-translate-x-in-\[5\%\][data-placement="left"] {
+      --motion-origin-translate-x: 5%;
+      --motion-translate-in-animation: motion-translate-in calc(var(--motion-translate-duration, var(--motion-duration)) * var(--motion-translate-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-translate-timing, var(--motion-timing)) var(--motion-translate-delay, var(--motion-delay)) both;
+      animation: var(--motion-scale-in-animation), var(--motion-translate-in-animation), var(--motion-rotate-in-animation), var(--motion-filter-in-animation), var(--motion-opacity-in-animation), var(--motion-background-color-in-animation), var(--motion-text-color-in-animation), var(--motion-scale-loop-animation), var(--motion-translate-loop-animation), var(--motion-rotate-loop-animation), var(--motion-filter-loop-animation), var(--motion-opacity-loop-animation), var(--motion-background-color-loop-animation), var(--motion-text-color-loop-animation);
+    }
+
+    .es\:motion-safe\:placement-left\:motion-translate-x-out-\[5\%\][data-placement="left"] {
+      --motion-end-translate-x: 5%;
+      --motion-translate-out-animation: motion-translate-out calc(var(--motion-translate-duration, var(--motion-duration)) * var(--motion-translate-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-translate-timing, var(--motion-timing)) var(--motion-translate-delay, var(--motion-delay)) both;
+      animation: var(--motion-scale-out-animation), var(--motion-translate-out-animation), var(--motion-rotate-out-animation), var(--motion-filter-out-animation), var(--motion-opacity-out-animation), var(--motion-background-color-out-animation), var(--motion-text-color-out-animation);
+    }
+  }
+
+  .es\:placement-right\:origin-left[data-placement="right"] {
+    transform-origin: 0;
+  }
+
+  @media (prefers-reduced-motion: no-preference) {
+    .es\:motion-safe\:placement-right\:motion-translate-x-in-\[-5\%\][data-placement="right"] {
+      --motion-origin-translate-x: -5%;
+      --motion-translate-in-animation: motion-translate-in calc(var(--motion-translate-duration, var(--motion-duration)) * var(--motion-translate-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-translate-timing, var(--motion-timing)) var(--motion-translate-delay, var(--motion-delay)) both;
+      animation: var(--motion-scale-in-animation), var(--motion-translate-in-animation), var(--motion-rotate-in-animation), var(--motion-filter-in-animation), var(--motion-opacity-in-animation), var(--motion-background-color-in-animation), var(--motion-text-color-in-animation), var(--motion-scale-loop-animation), var(--motion-translate-loop-animation), var(--motion-rotate-loop-animation), var(--motion-filter-loop-animation), var(--motion-opacity-loop-animation), var(--motion-background-color-loop-animation), var(--motion-text-color-loop-animation);
+    }
+
+    .es\:motion-safe\:placement-right\:motion-translate-x-out-\[-5\%\][data-placement="right"] {
+      --motion-end-translate-x: -5%;
+      --motion-translate-out-animation: motion-translate-out calc(var(--motion-translate-duration, var(--motion-duration)) * var(--motion-translate-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-translate-timing, var(--motion-timing)) var(--motion-translate-delay, var(--motion-delay)) both;
+      animation: var(--motion-scale-out-animation), var(--motion-translate-out-animation), var(--motion-rotate-out-animation), var(--motion-filter-out-animation), var(--motion-opacity-out-animation), var(--motion-background-color-out-animation), var(--motion-text-color-out-animation);
+    }
+  }
+
+  .es\:placement-top\:origin-bottom-left[data-placement="top"] {
+    transform-origin: 0 100%;
+  }
+
+  @media (prefers-reduced-motion: no-preference) {
+    .es\:motion-safe\:placement-top\:motion-translate-y-in-\[5\%\][data-placement="top"] {
+      --motion-origin-translate-y: 5%;
+      --motion-translate-in-animation: motion-translate-in calc(var(--motion-translate-duration, var(--motion-duration)) * var(--motion-translate-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-translate-timing, var(--motion-timing)) var(--motion-translate-delay, var(--motion-delay)) both;
+      animation: var(--motion-scale-in-animation), var(--motion-translate-in-animation), var(--motion-rotate-in-animation), var(--motion-filter-in-animation), var(--motion-opacity-in-animation), var(--motion-background-color-in-animation), var(--motion-text-color-in-animation), var(--motion-scale-loop-animation), var(--motion-translate-loop-animation), var(--motion-rotate-loop-animation), var(--motion-filter-loop-animation), var(--motion-opacity-loop-animation), var(--motion-background-color-loop-animation), var(--motion-text-color-loop-animation);
+    }
+
+    .es\:motion-safe\:placement-top\:motion-translate-y-out-\[5\%\][data-placement="top"] {
+      --motion-end-translate-y: 5%;
+      --motion-translate-out-animation: motion-translate-out calc(var(--motion-translate-duration, var(--motion-duration)) * var(--motion-translate-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-translate-timing, var(--motion-timing)) var(--motion-translate-delay, var(--motion-delay)) both;
+      animation: var(--motion-scale-out-animation), var(--motion-translate-out-animation), var(--motion-rotate-out-animation), var(--motion-filter-out-animation), var(--motion-opacity-out-animation), var(--motion-background-color-out-animation), var(--motion-text-color-out-animation);
+    }
+  }
+
+  .es\:placement-bottom\:origin-top-left[data-placement="bottom"] {
+    transform-origin: 0 0;
+  }
+
+  @media (prefers-reduced-motion: no-preference) {
+    .es\:motion-safe\:placement-bottom\:motion-translate-y-in-\[-5\%\][data-placement="bottom"] {
+      --motion-origin-translate-y: -5%;
+      --motion-translate-in-animation: motion-translate-in calc(var(--motion-translate-duration, var(--motion-duration)) * var(--motion-translate-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-translate-timing, var(--motion-timing)) var(--motion-translate-delay, var(--motion-delay)) both;
+      animation: var(--motion-scale-in-animation), var(--motion-translate-in-animation), var(--motion-rotate-in-animation), var(--motion-filter-in-animation), var(--motion-opacity-in-animation), var(--motion-background-color-in-animation), var(--motion-text-color-in-animation), var(--motion-scale-loop-animation), var(--motion-translate-loop-animation), var(--motion-rotate-loop-animation), var(--motion-filter-loop-animation), var(--motion-opacity-loop-animation), var(--motion-background-color-loop-animation), var(--motion-text-color-loop-animation);
+    }
+
+    .es\:motion-safe\:placement-bottom\:motion-translate-y-out-\[-5\%\][data-placement="bottom"] {
+      --motion-end-translate-y: -5%;
+      --motion-translate-out-animation: motion-translate-out calc(var(--motion-translate-duration, var(--motion-duration)) * var(--motion-translate-perceptual-duration-multiplier, var(--motion-perceptual-duration-multiplier))) var(--motion-translate-timing, var(--motion-timing)) var(--motion-translate-delay, var(--motion-delay)) both;
+      animation: var(--motion-scale-out-animation), var(--motion-translate-out-animation), var(--motion-rotate-out-animation), var(--motion-filter-out-animation), var(--motion-opacity-out-animation), var(--motion-background-color-out-animation), var(--motion-text-color-out-animation);
+    }
+  }
+
   .es\:pending\:cursor-wait[data-pending] {
     cursor: wait;
   }
@@ -6315,18 +6447,6 @@
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
   }
 
-  .es\:\[\&_span\]\:overflow-hidden span {
-    overflow: hidden;
-  }
-
-  .es\:\[\&_span\]\:text-nowrap span {
-    text-wrap: nowrap;
-  }
-
-  .es\:\[\&_span\]\:text-ellipsis span {
-    text-overflow: ellipsis;
-  }
-
   .es\:\[\&_svg\]\:size-4\! svg {
     width: calc(var(--es-spacing) * 4) !important;
     height: calc(var(--es-spacing) * 4) !important;
@@ -6336,6 +6456,10 @@
     stroke: var(--es-color-red-500);
   }
 
+  .es\:\[\&\:\:-webkit-search-cancel-button\]\:hidden::-webkit-search-cancel-button {
+    display: none;
+  }
+
   .es\:\[\&\:has\(\>_\[data-focus-visible\=\"true\"\]\)\]\:ring-2:has( > [data-focus-visible="true"]) {
     --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -6716,9 +6840,3 @@
   inherits: false;
   initial-value: "";
 }
-
-@keyframes spin {
-  to {
-    transform: rotate(360deg);
-  }
-}