@oomol-lab/open-flow 0.1.0-beta.73 → 0.1.0-beta.74

package/dist/browser/ui.css

@@ -855,6 +855,10 @@
     inset-inline: 0;
   }
 
+  :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .-inset-y-0\.5 {
+    inset-block: calc(var(--spacing) * -.5);
+  }
+
   :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .inset-y-0 {
     inset-block: 0;
   }
@@ -1033,6 +1037,10 @@
     margin-inline: calc(var(--spacing) * -1);
   }
 
+  :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .-mx-2 {
+    margin-inline: calc(var(--spacing) * -2);
+  }
+
   :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .-mx-4 {
     margin-inline: calc(var(--spacing) * -4);
   }
@@ -1057,6 +1065,10 @@
     margin-inline: calc(var(--spacing) * 4);
   }
 
+  :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .-my-0\.5 {
+    margin-block: calc(var(--spacing) * -.5);
+  }
+
   :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .-my-1 {
     margin-block: calc(var(--spacing) * -1);
   }
@@ -1893,6 +1905,10 @@
     grid-template-columns: repeat(5, minmax(0, 1fr));
   }
 
+  :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .grid-cols-\[14px_minmax\(0\,1fr\)\] {
+    grid-template-columns: 14px minmax(0, 1fr);
+  }
+
   :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .grid-cols-\[28px_minmax\(0\,1fr\)_28px\] {
     grid-template-columns: 28px minmax(0, 1fr) 28px;
   }
@@ -2451,6 +2467,16 @@
     background-color: var(--ui-card);
   }
 
+  :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .bg-destructive\/5 {
+    background-color: var(--ui-destructive);
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .bg-destructive\/5 {
+      background-color: color-mix(in oklab, var(--ui-destructive) 5%, transparent);
+    }
+  }
+
   :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .bg-destructive\/10 {
     background-color: var(--ui-destructive);
   }
@@ -2525,6 +2551,16 @@
     }
   }
 
+  :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .bg-muted\/60 {
+    background-color: var(--ui-muted);
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .bg-muted\/60 {
+      background-color: color-mix(in oklab, var(--ui-muted) 60%, transparent);
+    }
+  }
+
   :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .bg-popover {
     background-color: var(--ui-popover);
   }
@@ -3296,6 +3332,10 @@
     --ui-control-radius: 6px;
   }
 
+  :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .\[--ui-control-radius\:8px\] {
+    --ui-control-radius: 8px;
+  }
+
   :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .paused {
     animation-play-state: paused;
   }
@@ -3766,10 +3806,16 @@
       background-color: var(--ui-control-hover-background, var(--ui-muted));
     }
 
-    :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .hover\:bg-accent:hover {
+    :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .hover\:bg-accent:hover, :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .hover\:bg-accent\/50:hover {
       background-color: var(--ui-accent);
     }
 
+    @supports (color: color-mix(in lab, red, red)) {
+      :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .hover\:bg-accent\/50:hover {
+        background-color: color-mix(in oklab, var(--ui-accent) 50%, transparent);
+      }
+    }
+
     :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .hover\:bg-destructive\/10:hover {
       background-color: var(--ui-destructive);
     }
@@ -3907,10 +3953,16 @@
     border-color: var(--ui-input);
   }
 
-  :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .focus-visible\:bg-accent:focus-visible {
+  :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .focus-visible\:bg-accent:focus-visible, :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .focus-visible\:bg-accent\/50:focus-visible {
     background-color: var(--ui-accent);
   }
 
+  @supports (color: color-mix(in lab, red, red)) {
+    :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .focus-visible\:bg-accent\/50:focus-visible {
+      background-color: color-mix(in oklab, var(--ui-accent) 50%, transparent);
+    }
+  }
+
   :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .focus-visible\:ring-0:focus-visible {
     --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(0px + 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);
@@ -3989,6 +4041,10 @@
     cursor: var(--ui-disabled-cursor, not-allowed);
   }
 
+  :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .disabled\:cursor-default:disabled {
+    cursor: default;
+  }
+
   :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .disabled\:cursor-not-allowed:disabled {
     cursor: not-allowed;
   }
@@ -4052,6 +4108,10 @@
     }
   }
 
+  :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .has-data-checked\:bg-accent:has([data-checked]) {
+    background-color: var(--ui-accent);
+  }
+
   :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .has-data-checked\:bg-primary\/5:has([data-checked]) {
     background-color: var(--ui-primary);
   }
@@ -5261,6 +5321,16 @@
       }
     }
 
+    :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .dark\:hover\:bg-accent\/50:where([data-theme="dark"], [data-theme="dark"] *):hover {
+      background-color: var(--ui-accent);
+    }
+
+    @supports (color: color-mix(in lab, red, red)) {
+      :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .dark\:hover\:bg-accent\/50:where([data-theme="dark"], [data-theme="dark"] *):hover {
+        background-color: color-mix(in oklab, var(--ui-accent) 50%, transparent);
+      }
+    }
+
     :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .dark\:hover\:bg-destructive\/20:where([data-theme="dark"], [data-theme="dark"] *):hover {
       background-color: var(--ui-destructive);
     }