@ohhwells/bridge 0.1.31 → 0.1.32-next.35

package/dist/styles.css

@@ -4,6 +4,9 @@
   :root, :host {
     --font-sans: Figtree, sans-serif;
     --color-red-500: oklch(63.7% 0.237 25.331);
+    --color-stone-200: oklch(92.3% 0.003 48.717);
+    --color-stone-500: #78716C;
+    --color-stone-950: #0C0A09;
     --color-black: #000;
     --color-white: #fff;
     --spacing: 0.25rem;
@@ -38,6 +41,7 @@
     --font-body: 'Red Hat Display', system-ui, sans-serif;
     --color-primary: var(--ohw-primary, #0885FE);
     --color-primary-foreground: var(--ohw-primary-foreground, #FAFAF9);
+    --color-primary-50: var(--ohw-primary-50, #EFF6FF);
     --color-background: var(--ohw-background, #ffffff);
     --color-foreground: var(--ohw-foreground, #020617);
     --color-card-foreground: var(--ohw-card-foreground, #020617);
@@ -200,6 +204,10 @@
 .inline-flex {
   display: inline-flex;
 }
+.size-4 {
+  width: calc(var(--spacing) * 4);
+  height: calc(var(--spacing) * 4);
+}
 .h-7 {
   height: calc(var(--spacing) * 7);
 }
@@ -236,6 +244,9 @@
 .max-h-48 {
   max-height: calc(var(--spacing) * 48);
 }
+.max-h-\[30px\] {
+  max-height: 30px;
+}
 .max-h-\[calc\(100\%-32px\)\] {
   max-height: calc(100% - 32px);
 }
@@ -251,6 +262,9 @@
 .w-2 {
   width: calc(var(--spacing) * 2);
 }
+.w-4 {
+  width: calc(var(--spacing) * 4);
+}
 .w-7 {
   width: calc(var(--spacing) * 7);
 }
@@ -323,6 +337,9 @@
 .cursor-default {
   cursor: default;
 }
+.cursor-grab {
+  cursor: grab;
+}
 .cursor-pointer {
   cursor: pointer;
 }
@@ -742,6 +759,9 @@
 .text-secondary-foreground {
   color: var(--color-secondary-foreground);
 }
+.text-stone-500 {
+  color: var(--color-stone-500);
+}
 .italic {
   font-style: italic;
 }
@@ -772,6 +792,10 @@
   --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);
 }
+.shadow-md {
+  --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px 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);
+}
 .shadow-none {
   --tw-shadow: 0 0 #0000;
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -813,11 +837,20 @@
   transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
   transition-duration: var(--tw-duration, var(--default-transition-duration));
 }
+.transition-all {
+  transition-property: all;
+  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+  transition-duration: var(--tw-duration, var(--default-transition-duration));
+}
 .transition-colors {
   transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
   transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
   transition-duration: var(--tw-duration, var(--default-transition-duration));
 }
+.duration-200 {
+  --tw-duration: 200ms;
+  transition-duration: 200ms;
+}
 .outline-none {
   --tw-outline-style: none;
   outline-style: none;
@@ -978,6 +1011,78 @@
     }
   }
 }
+.enabled\:hover\:border {
+  &:enabled {
+    &:hover {
+      @media (hover: hover) {
+        border-style: var(--tw-border-style);
+        border-width: 1px;
+      }
+    }
+  }
+}
+.enabled\:hover\:border-stone-200 {
+  &:enabled {
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--color-stone-200);
+      }
+    }
+  }
+}
+.enabled\:hover\:text-stone-950 {
+  &:enabled {
+    &:hover {
+      @media (hover: hover) {
+        color: var(--color-stone-950);
+      }
+    }
+  }
+}
+.enabled\:active\:cursor-grabbing {
+  &:enabled {
+    &:active {
+      cursor: grabbing;
+    }
+  }
+}
+.enabled\:active\:border {
+  &:enabled {
+    &:active {
+      border-style: var(--tw-border-style);
+      border-width: 1px;
+    }
+  }
+}
+.enabled\:active\:border-primary {
+  &:enabled {
+    &:active {
+      border-color: var(--color-primary);
+    }
+  }
+}
+.enabled\:active\:bg-primary-50 {
+  &:enabled {
+    &:active {
+      background-color: var(--color-primary-50);
+    }
+  }
+}
+.enabled\:active\:text-stone-950 {
+  &:enabled {
+    &:active {
+      color: var(--color-stone-950);
+    }
+  }
+}
+.enabled\:active\:shadow {
+  &:enabled {
+    &:active {
+      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px 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);
+    }
+  }
+}
 .disabled\:pointer-events-none {
   &:disabled {
     pointer-events: none;
@@ -988,6 +1093,16 @@
     cursor: not-allowed;
   }
 }
+.disabled\:text-stone-950 {
+  &:disabled {
+    color: var(--color-stone-950);
+  }
+}
+.disabled\:opacity-40 {
+  &:disabled {
+    opacity: 40%;
+  }
+}
 .disabled\:opacity-50 {
   &:disabled {
     opacity: 50%;
@@ -1127,8 +1242,10 @@
 [data-ohw-bridge-root] {
   --color-primary: var(--ohw-primary, #0885FE);
   --color-primary-foreground: var(--ohw-primary-foreground, #FAFAF9);
+  --color-primary-50: var(--ohw-primary-50, #EFF6FF);
   --ohw-primary: #0885FE;
   --ohw-primary-foreground: #FAFAF9;
+  --ohw-primary-50: #EFF6FF;
   --ohw-background: #ffffff;
   --ohw-foreground: #020617;
   --ohw-card: #ffffff;
@@ -1287,6 +1404,7 @@
   --ohw-popover-foreground: #f8fafc;
   --ohw-primary: #f8fafc;
   --ohw-primary-foreground: #0f172a;
+  --ohw-primary-50: #1e3a5f;
   --ohw-hover-primary: #f1f5f9;
   --ohw-secondary: #1e293b;
   --ohw-secondary-foreground: #f8fafc;
@@ -1502,6 +1620,10 @@
   syntax: "*";
   inherits: false;
 }
+@property --tw-duration {
+  syntax: "*";
+  inherits: false;
+}
 @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 {
@@ -1545,6 +1667,7 @@
       --tw-drop-shadow-color: initial;
       --tw-drop-shadow-alpha: 100%;
       --tw-drop-shadow-size: initial;
+      --tw-duration: initial;
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohhwells/bridge",
-  "version": "0.1.31",
+  "version": "0.1.32-next.35",
   "private": false,
   "type": "module",
   "main": "./dist/index.cjs",
@@ -28,6 +28,7 @@
   },
   "dependencies": {
     "@radix-ui/react-slot": "^1.3.0",
+    "lucide-react": "^1.23.0",
     "radix-ui": "^1.4.3"
   },
   "devDependencies": {