@texturehq/edges 1.15.1 → 1.15.3

package/dist/styles/computed.css

@@ -120,10 +120,10 @@
      Input Adornments
      ============================================ */
 
-  --control-icon-size-sm: 1rem;
-  --control-icon-size-md: 1.25rem;
-  --control-icon-size-lg: 1.5rem;
-  --control-icon-size-xl: 1.75rem;
+  --control-icon-size-sm: 0.875rem;
+  --control-icon-size-md: 1rem;
+  --control-icon-size-lg: 1.25rem;
+  --control-icon-size-xl: 1.5rem;
   --control-adornment-gap: var(--control-gap-sm);
 
   /* ============================================

package/dist/styles/utilities.css

@@ -28,8 +28,21 @@
   outline: none;
 }
 
-/* Ensure focus-visible still works for interactive elements */
-:focus-visible {
+/**
+ * Remove default focus outlines from menu items and list items
+ * We'll use data-[focused] with custom styling for keyboard focus instead
+ */
+[role="menuitem"],
+[role="option"] {
+  outline: none;
+}
+
+/**
+ * Global focus-visible for keyboard navigation accessibility
+ * Applies to buttons, links, and form controls
+ * Menu/list items use data-[focused] with custom styling instead
+ */
+:focus-visible:not([role="menuitem"]):not([role="option"]) {
   outline: 2px solid var(--color-action-default);
   outline-offset: 2px;
 }

package/dist/styles.css

@@ -1039,7 +1039,10 @@
 [role="dialog"], [role="menu"], [role="listbox"], [data-react-aria-dialog], [data-react-aria-modal] {
   outline: none;
 }
-:focus-visible {
+[role="menuitem"], [role="option"] {
+  outline: none;
+}
+:focus-visible:not([role="menuitem"]):not([role="option"]) {
   outline: 2px solid var(--color-action-default);
   outline-offset: 2px;
 }
@@ -1770,6 +1773,9 @@
   .w-0 {
     width: var(--spacing-0);
   }
+  .w-0\.5 {
+    width: calc(var(--spacing) * 0.5);
+  }
   .w-1 {
     width: var(--spacing-1);
   }
@@ -2787,6 +2793,9 @@
   .border-text-body {
     border-color: var(--color-text-body);
   }
+  .border-text-heading {
+    border-color: var(--color-text-heading);
+  }
   .border-transparent {
     border-color: transparent;
   }
@@ -3048,6 +3057,9 @@
   .bg-state-unknown {
     background-color: var(--color-state-unknown);
   }
+  .bg-text-heading {
+    background-color: var(--color-text-heading);
+  }
   .bg-text-muted {
     background-color: var(--color-text-muted);
   }
@@ -3629,6 +3641,9 @@
   .text-action-default {
     color: var(--color-action-default);
   }
+  .text-background-body {
+    color: var(--color-background-body);
+  }
   .text-blue-400 {
     color: var(--color-blue-400);
   }
@@ -3986,12 +4001,6 @@
     outline-style: var(--tw-outline-style);
     outline-width: 1.5px;
   }
-  .-outline-offset-2 {
-    outline-offset: calc(2px * -1);
-  }
-  .-outline-offset-4 {
-    outline-offset: calc(4px * -1);
-  }
   .outline-offset-0 {
     outline-offset: 0px;
   }
@@ -4004,9 +4013,6 @@
   .outline-border-input {
     outline-color: var(--color-border-input);
   }
-  .outline-white {
-    outline-color: var(--color-white);
-  }
   .blur {
     --tw-blur: blur(8px);
     filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
@@ -4727,16 +4733,6 @@
       left: var(--spacing-4);
     }
   }
-  .focus\:bg-background-hover {
-    &:focus {
-      background-color: var(--color-background-hover);
-    }
-  }
-  .focus\:bg-feedback-error-background {
-    &:focus {
-      background-color: var(--color-feedback-error-background);
-    }
-  }
   .focus\:ring-0 {
     &:focus {
       --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
@@ -4786,12 +4782,6 @@
       outline-color: var(--color-action-default);
     }
   }
-  .focus\:\!outline-none {
-    &:focus {
-      --tw-outline-style: none !important;
-      outline-style: none !important;
-    }
-  }
   .focus\:outline-none {
     &:focus {
       --tw-outline-style: none;
@@ -4825,12 +4815,6 @@
       outline-color: var(--color-action-default);
     }
   }
-  .focus-visible\:\!outline-none {
-    &:focus-visible {
-      --tw-outline-style: none !important;
-      outline-style: none !important;
-    }
-  }
   .disabled\:cursor-not-allowed {
     &:disabled {
       cursor: not-allowed;
@@ -4879,11 +4863,37 @@
       transition-timing-function: var(--ease-in);
     }
   }
+  .data-\[focus-visible\]\:ring-2 {
+    &[data-focus-visible] {
+      --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);
+    }
+  }
+  .data-\[focus-visible\]\:ring-action-default {
+    &[data-focus-visible] {
+      --tw-ring-color: var(--color-action-default);
+    }
+  }
+  .data-\[focus-visible\]\:ring-feedback-error-border {
+    &[data-focus-visible] {
+      --tw-ring-color: var(--color-feedback-error-border);
+    }
+  }
+  .data-\[focus-visible\]\:ring-inset {
+    &[data-focus-visible] {
+      --tw-ring-inset: inset;
+    }
+  }
   .data-\[focused\]\:bg-background-hover {
     &[data-focused] {
       background-color: var(--color-background-hover);
     }
   }
+  .data-\[focused\]\:bg-feedback-error-background {
+    &[data-focused] {
+      background-color: var(--color-feedback-error-background);
+    }
+  }
   .data-\[focused\]\:opacity-100 {
     &[data-focused] {
       opacity: 100%;
@@ -5350,6 +5360,11 @@
       flex-direction: row;
     }
   }
+  .md\:items-center {
+    @media (width >= 48rem) {
+      align-items: center;
+    }
+  }
   .md\:items-start {
     @media (width >= 48rem) {
       align-items: flex-start;
@@ -6071,11 +6086,6 @@
       --tw-ring-color: var(--color-gray-700);
     }
   }
-  .dark\:outline-white {
-    @media (prefers-color-scheme: dark) {
-      outline-color: var(--color-white);
-    }
-  }
   .dark\:backdrop-blur-2xl {
     @media (prefers-color-scheme: dark) {
       --tw-backdrop-blur: blur(var(--blur-2xl));
@@ -6265,11 +6275,6 @@
       outline-color: GrayText;
     }
   }
-  .forced-colors\:outline-\[HighlightText\] {
-    @media (forced-colors: active) {
-      outline-color: HighlightText;
-    }
-  }
   .forced-colors\:group-invalid\:bg-\[Mark\] {
     @media (forced-colors: active) {
       &:is(:where(.group):invalid *) {

package/dist/utilities.manifest.json

@@ -1,6 +1,6 @@
 {
-  "version": "1.15.1",
-  "generatedAt": "2025-10-30T16:22:49.376Z",
+  "version": "1.15.3",
+  "generatedAt": "2025-10-31T11:11:25.558Z",
   "categories": {
     "hooks": {
       "description": "React hooks for common functionality like breakpoints, debouncing, local storage, and media queries",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@texturehq/edges",
-  "version": "1.15.1",
+  "version": "1.15.3",
   "author": "Nicholas Brown <nick@texturehq.com>",
   "description": "A shared component library for Texture",
   "type": "module",