@workerdeck/ui 3.2.0 → 3.4.0

package/build/scoped.css

@@ -56,6 +56,7 @@
     --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
     --default-font-family: var(--cw-font-sans);
     --default-mono-font-family: var(--cw-font-mono);
+    --color-accent: var(--accent);
     --text-body: 0.9375rem;
     --text-body-sm: 0.8125rem;
   }
@@ -445,12 +446,18 @@
   .wd-root .mb-3 {
     margin-bottom: calc(var(--spacing) * 3);
   }
+  .wd-root .-ml-1\.5 {
+    margin-left: calc(var(--spacing) * -1.5);
+  }
   .wd-root .ml-0 {
     margin-left: 0px;
   }
   .wd-root .ml-1 {
     margin-left: var(--spacing);
   }
+  .wd-root .ml-auto {
+    margin-left: auto;
+  }
   .wd-root .block {
     display: block;
   }
@@ -632,6 +639,9 @@
   .wd-root .min-h-0 {
     min-height: 0px;
   }
+  .wd-root .min-h-5 {
+    min-height: calc(var(--spacing) * 5);
+  }
   .wd-root .min-h-28 {
     min-height: calc(var(--spacing) * 28);
   }
@@ -704,6 +714,9 @@
   .wd-root .max-w-12 {
     max-width: calc(var(--spacing) * 12);
   }
+  .wd-root .max-w-32 {
+    max-width: calc(var(--spacing) * 32);
+  }
   .wd-root .max-w-40 {
     max-width: calc(var(--spacing) * 40);
   }
@@ -743,6 +756,9 @@
   .wd-root .min-w-36 {
     min-width: calc(var(--spacing) * 36);
   }
+  .wd-root .min-w-40 {
+    min-width: calc(var(--spacing) * 40);
+  }
   .wd-root .min-w-44 {
     min-width: calc(var(--spacing) * 44);
   }
@@ -964,6 +980,9 @@
   .wd-root .self-center {
     align-self: center;
   }
+  .wd-root .self-start {
+    align-self: flex-start;
+  }
   .wd-root .truncate {
     overflow: hidden;
     text-overflow: ellipsis;
@@ -1038,6 +1057,10 @@
     border-left-style: var(--tw-border-style);
     border-left-width: 4px;
   }
+  .wd-root .border-dashed {
+    --tw-border-style: dashed;
+    border-style: dashed;
+  }
   .wd-root .border-\[var\(--wd-shell-accent\)\] {
     border-color: var(--wd-shell-accent);
   }
@@ -1236,6 +1259,12 @@
   .wd-root .bg-red-100 {
     background-color: var(--color-red-100);
   }
+  .wd-root .bg-row-hover\/50 {
+    background-color: var(--row-hover);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--row-hover) 50%, transparent);
+    }
+  }
   .wd-root .bg-row-selected {
     background-color: var(--row-selected);
   }
@@ -1761,6 +1790,10 @@
     --tw-shadow: var(--shadow-xs);
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
+  .wd-root .shadow-\[inset_0_2px_0_0_var\(--color-accent\)\] {
+    --tw-shadow: inset 0 2px 0 0 var(--tw-shadow-color, var(--color-accent));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
   .wd-root .shadow-lg {
     --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px 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);
@@ -1886,6 +1919,12 @@
     .wd-root .group-hover\:opacity-100:is(:where(.group):hover *) {
       opacity: 100%;
     }
+    .wd-root .group-hover\/heading\:opacity-60:is(:where(.group\/heading):hover *) {
+      opacity: 60%;
+    }
+    .wd-root .group-hover\/heading\:opacity-100:is(:where(.group\/heading):hover *) {
+      opacity: 100%;
+    }
   }
   .wd-root .placeholder\:text-fg-4::placeholder {
     color: var(--fg-4);
@@ -1940,6 +1979,9 @@
   .wd-root .focus-within\:border-ring:focus-within {
     border-color: var(--ring);
   }
+  .wd-root .focus-within\:opacity-100:focus-within {
+    opacity: 100%;
+  }
   .wd-root .focus-within\:ring-2:focus-within {
     --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);
@@ -2522,9 +2564,12 @@
 :is(.wd-root, .wd-root *):is([data-terminal],[data-cards]) [data-slot='transcript-rows'] [data-index]:not(.absolute) {
   position: relative;
 }
-:is(.wd-root, .wd-root *):is([data-terminal],[data-cards]) [data-slot='transcript-rows'] [data-index]:is(:hover,:focus-within) {
+:is(.wd-root, .wd-root *):is([data-terminal],[data-cards]) [data-slot='transcript-rows'] [data-index]:focus-within {
   z-index: 1;
 }
+:is(.wd-root, .wd-root *):is([data-terminal],[data-cards]) [data-slot='transcript-rows'] [data-index]:hover {
+  z-index: 2;
+}
 @media (hover: none) {
   :is(.wd-root, .wd-root *):is([data-terminal],[data-cards]) .term-actions {
     opacity: 1;
@@ -2720,9 +2765,11 @@
   color: var(--term-faint);
 }
 .wd-root [data-terminal] [data-slot='transcript-rows']>[data-sticky-lane] {
-  z-index: 3;
   pointer-events: none;
 }
+.wd-root [data-terminal] [data-slot='transcript-rows']>[data-sticky-lane]:has(>[data-sticky-headlane]>[data-stuck]) {
+  z-index: 3;
+}
 .wd-root [data-terminal] [data-sticky-lane]>[data-index] {
   pointer-events: auto;
 }
@@ -3434,9 +3481,11 @@
   }
 }
 .wd-root [data-slot='transcript-rows']>[data-sticky-lane='cards'] {
-  z-index: 3;
   pointer-events: none;
 }
+.wd-root [data-slot='transcript-rows']>[data-sticky-lane='cards']:has(>[data-sticky-headlane]>[data-stuck]) {
+  z-index: 3;
+}
 .wd-root [data-sticky-lane='cards']>[data-sticky-headlane] {
   position: absolute;
   inset: 0;