@mastra/playground-ui 34.1.0-alpha.3 → 35.0.0

package/dist/index.css

@@ -174,7 +174,6 @@
     --radius-lg: 10px;
     --radius-xl: 14px;
     --radius-2xl: 1rem;
-    --ease-in: cubic-bezier(.4, 0, 1, 1);
     --ease-out: cubic-bezier(0, 0, .2, 1);
     --ease-in-out: cubic-bezier(.4, 0, .2, 1);
     --animate-spin: spin 1s linear infinite;
@@ -730,6 +729,14 @@
     right: var(--spacing-0);
   }
 
+  .right-0\.5 {
+    right: var(--spacing-0_5);
+  }
+
+  .right-1 {
+    right: var(--spacing-1);
+  }
+
   .right-2 {
     right: var(--spacing-2);
   }
@@ -762,6 +769,10 @@
     left: var(--spacing-0_5);
   }
 
+  .left-1 {
+    left: var(--spacing-1);
+  }
+
   .left-1\/2 {
     left: 50%;
   }
@@ -798,10 +809,6 @@
     z-index: 20;
   }
 
-  .z-40 {
-    z-index: 40;
-  }
-
   .z-50 {
     z-index: 50;
   }
@@ -1189,6 +1196,11 @@
     height: var(--spacing-7);
   }
 
+  .size-8 {
+    width: var(--spacing-8);
+    height: var(--spacing-8);
+  }
+
   .size-9 {
     width: var(--spacing-9);
     height: var(--spacing-9);
@@ -1279,10 +1291,6 @@
     height: var(--spacing-40);
   }
 
-  .h-48\! {
-    height: var(--spacing-48) !important;
-  }
-
   .h-60 {
     height: var(--spacing-60);
   }
@@ -1848,6 +1856,10 @@
     width: calc(100vw - 1.5rem);
   }
 
+  .w-\[calc\(100vw-2\.5rem\)\] {
+    width: calc(100vw - 2.5rem);
+  }
+
   .w-\[var\(--active-tab-width\)\] {
     width: var(--active-tab-width);
   }
@@ -1941,6 +1953,10 @@
     max-width: 16.5rem;
   }
 
+  .max-w-\[28rem\] {
+    max-width: 28rem;
+  }
+
   .max-w-\[30rem\] {
     max-width: 30rem;
   }
@@ -2109,7 +2125,7 @@
     flex-shrink: 0;
   }
 
-  .grow {
+  .flex-grow, .grow {
     flex-grow: 1;
   }
 
@@ -2121,11 +2137,21 @@
     transform-origin: var(--transform-origin);
   }
 
+  .-translate-x-1 {
+    --tw-translate-x: calc(var(--spacing-1) * -1);
+    translate: var(--tw-translate-x) var(--tw-translate-y);
+  }
+
   .-translate-x-1\/2 {
     --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
 
+  .translate-x-1 {
+    --tw-translate-x: var(--spacing-1);
+    translate: var(--tw-translate-x) var(--tw-translate-y);
+  }
+
   .translate-x-\[-50\%\] {
     --tw-translate-x: -50%;
     translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -4684,6 +4710,12 @@
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
 
+  .transition-\[color\,background-color\,opacity\] {
+    transition-property: color, background-color, opacity;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+  }
+
   .transition-\[color\,opacity\] {
     transition-property: color, opacity;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -4708,6 +4740,18 @@
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
 
+  .transition-\[opacity\,translate\,top\] {
+    transition-property: opacity, translate, top;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+  }
+
+  .transition-\[opacity\,translate\] {
+    transition-property: opacity, translate;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+  }
+
   .transition-\[stroke-dashoffset\,transform\] {
     transition-property: stroke-dashoffset, transform;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -4756,6 +4800,10 @@
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
 
+  .transition-none {
+    transition-property: none;
+  }
+
   .duration-150 {
     --tw-duration: .15s;
     transition-duration: .15s;
@@ -4882,6 +4930,19 @@
       opacity: 1;
     }
 
+    .group-hover\/expand\:pointer-events-auto:is(:where(.group\/expand):hover *) {
+      pointer-events: auto;
+    }
+
+    .group-hover\/expand\:translate-x-0:is(:where(.group\/expand):hover *) {
+      --tw-translate-x: var(--spacing-0);
+      translate: var(--tw-translate-x) var(--tw-translate-y);
+    }
+
+    .group-hover\/expand\:opacity-100:is(:where(.group\/expand):hover *) {
+      opacity: 1;
+    }
+
     .group-hover\/separator\:h-12:is(:where(.group\/separator):hover *) {
       height: var(--spacing-12);
     }
@@ -4927,6 +4988,16 @@
     background-color: var(--color-surface4);
   }
 
+  .group-active\/expand\:bg-neutral6\/80:is(:where(.group\/expand):active *) {
+    background-color: var(--color-neutral6);
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .group-active\/expand\:bg-neutral6\/80:is(:where(.group\/expand):active *) {
+      background-color: color-mix(in oklab, var(--color-neutral6) 80%, transparent);
+    }
+  }
+
   .group-active\/switch\:w-6:is(:where(.group\/switch):active *) {
     width: var(--spacing-6);
   }
@@ -6260,8 +6331,12 @@
     --tw-exit-scale: .95;
   }
 
-  .data-\[closed\]\:slide-out-to-left[data-closed] {
-    --tw-exit-translate-x: -100%;
+  .data-\[direction\=left\]\:left-0[data-direction="left"] {
+    left: var(--spacing-0);
+  }
+
+  .data-\[direction\=right\]\:right-0[data-direction="right"] {
+    right: var(--spacing-0);
   }
 
   .data-\[disabled\]\:pointer-events-none[data-disabled] {
@@ -6413,6 +6488,23 @@
     opacity: .5;
   }
 
+  .data-\[edge-hovered\=true\]\:pointer-events-auto[data-edge-hovered="true"] {
+    pointer-events: auto;
+  }
+
+  .data-\[edge-hovered\=true\]\:translate-x-0[data-edge-hovered="true"] {
+    --tw-translate-x: var(--spacing-0);
+    translate: var(--tw-translate-x) var(--tw-translate-y);
+  }
+
+  .data-\[edge-hovered\=true\]\:text-neutral6[data-edge-hovered="true"] {
+    color: var(--color-neutral6);
+  }
+
+  .data-\[edge-hovered\=true\]\:opacity-100[data-edge-hovered="true"] {
+    opacity: 1;
+  }
+
   .data-\[ending-style\]\:h-0[data-ending-style] {
     height: var(--spacing-0);
   }
@@ -6442,16 +6534,6 @@
     opacity: 0;
   }
 
-  .data-\[ending-style\]\:duration-150[data-ending-style] {
-    --tw-duration: .15s;
-    transition-duration: .15s;
-  }
-
-  .data-\[ending-style\]\:ease-in[data-ending-style] {
-    --tw-ease: var(--ease-in);
-    transition-timing-function: var(--ease-in);
-  }
-
   .data-\[highlighted\]\:bg-surface4[data-highlighted] {
     background-color: var(--color-surface4);
   }
@@ -6564,10 +6646,6 @@
     --tw-enter-scale: .95;
   }
 
-  .data-\[open\]\:slide-in-from-left[data-open] {
-    --tw-enter-translate-x: -100%;
-  }
-
   .data-\[orientation\=horizontal\]\:h-1\.5[data-orientation="horizontal"] {
     height: var(--spacing-1_5);
   }
@@ -6792,6 +6870,10 @@
     opacity: 0;
   }
 
+  .data-\[state\=collapsed\]\:z-10[data-state="collapsed"] {
+    z-index: 10;
+  }
+
   .data-\[swiping\]\:select-none[data-swiping] {
     -webkit-user-select: none;
     user-select: none;
@@ -7187,6 +7269,12 @@
     }
   }
 
+  @starting-style {
+    .starting\:opacity-0 {
+      opacity: 0;
+    }
+  }
+
   @media (pointer: fine) {
     .pointer-fine\:opacity-0 {
       opacity: 0;