@texturehq/edges 1.4.0 → 1.5.1

package/dist/styles.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */
 @layer properties;
 :root, :host {
   --color-white: #ffffff;
@@ -62,8 +62,6 @@
   --color-brand-light: #f7f7ff;
   --color-brand-dark: #363ccb;
   --color-brand-background: #f6f7ff;
-  --color-skeleton-base: #e5e7eb;
-  --color-skeleton-highlight: #f3f4f6;
   --color-neutral-white: #ffffff;
   --color-neutral-black: #000000;
   --color-viz-default: #444ae1;
@@ -181,6 +179,7 @@
   --color-purple-100: oklch(94.6% 0.033 307.174);
   --color-purple-500: oklch(62.7% 0.265 303.9);
   --color-purple-600: oklch(55.8% 0.288 302.321);
+  --color-purple-800: oklch(43.8% 0.218 303.724);
   --color-pink-500: oklch(65.6% 0.241 354.308);
   --color-slate-300: oklch(86.9% 0.022 252.894);
   --color-slate-600: oklch(44.6% 0.043 257.281);
@@ -220,7 +219,6 @@
   --text-4xl: 2.25rem;
   --text-4xl--line-height: calc(2.5 / 2.25);
   --tracking-tight: -0.025em;
-  --tracking-wide: 0.025em;
   --tracking-wider: 0.05em;
   --leading-relaxed: 1.625;
   --drop-shadow-lg: 0 4px 4px rgb(0 0 0 / 0.15);
@@ -1235,6 +1233,9 @@
   .-my-2 {
     margin-block: calc(var(--spacing-2) * -1);
   }
+  .my-2 {
+    margin-block: var(--spacing-2);
+  }
   .my-4 {
     margin-block: var(--spacing-4);
   }
@@ -1256,6 +1257,9 @@
   .mt-1 {
     margin-top: var(--spacing-1);
   }
+  .mt-1\.5 {
+    margin-top: calc(var(--spacing) * 1.5);
+  }
   .mt-2 {
     margin-top: var(--spacing-2);
   }
@@ -1427,6 +1431,9 @@
   .h-\[60px\] {
     height: 60px;
   }
+  .h-\[100dvh\] {
+    height: 100dvh;
+  }
   .h-\[120px\] {
     height: 120px;
   }
@@ -1439,11 +1446,8 @@
   .h-\[600px\] {
     height: 600px;
   }
-  .h-\[calc\(100vh-60px\)\] {
-    height: calc(100vh - 60px);
-  }
-  .h-\[calc\(100vh-73px\)\] {
-    height: calc(100vh - 73px);
+  .h-\[calc\(100dvh-60px\)\] {
+    height: calc(100dvh - 60px);
   }
   .h-\[var\(--control-lg-height\)\] {
     height: var(--control-lg-height);
@@ -1484,6 +1488,9 @@
   .min-h-\[44px\] {
     min-height: 44px;
   }
+  .min-h-\[100dvh\] {
+    min-height: 100dvh;
+  }
   .min-h-\[100px\] {
     min-height: 100px;
   }
@@ -1577,6 +1584,15 @@
   .w-\[32rem\] {
     width: 32rem;
   }
+  .w-\[40rem\] {
+    width: 40rem;
+  }
+  .w-\[48rem\] {
+    width: 48rem;
+  }
+  .w-\[56rem\] {
+    width: 56rem;
+  }
   .w-\[200px\] {
     width: 200px;
   }
@@ -1677,6 +1693,9 @@
   .shrink-0 {
     flex-shrink: 0;
   }
+  .grow {
+    flex-grow: 1;
+  }
   .table-auto {
     table-layout: auto;
   }
@@ -1947,6 +1966,13 @@
       margin-block-end: calc(var(--spacing-0) * calc(1 - var(--tw-space-y-reverse)));
     }
   }
+  .space-y-0\.5 {
+    :where(& > :not(:last-child)) {
+      --tw-space-y-reverse: 0;
+      margin-block-start: calc(calc(var(--spacing) * 0.5) * var(--tw-space-y-reverse));
+      margin-block-end: calc(calc(var(--spacing) * 0.5) * calc(1 - var(--tw-space-y-reverse)));
+    }
+  }
   .space-y-1 {
     :where(& > :not(:last-child)) {
       --tw-space-y-reverse: 0;
@@ -2137,9 +2163,6 @@
   .rounded-\[var\(--control-border-radius\)\] {
     border-radius: var(--control-border-radius);
   }
-  .rounded-full {
-    border-radius: calc(infinity * 1px);
-  }
   .rounded-full {
     border-radius: var(--radius-full);
   }
@@ -2149,9 +2172,6 @@
   .rounded-md {
     border-radius: var(--radius-md);
   }
-  .rounded-none {
-    border-radius: 0;
-  }
   .rounded-none {
     border-radius: var(--radius-none);
   }
@@ -2161,10 +2181,6 @@
   .rounded-xl {
     border-radius: var(--radius-xl);
   }
-  .rounded-t-none {
-    border-top-left-radius: 0;
-    border-top-right-radius: 0;
-  }
   .rounded-t-none {
     border-top-left-radius: var(--radius-none);
     border-top-right-radius: var(--radius-none);
@@ -2181,17 +2197,10 @@
     border-top-right-radius: var(--radius-sm);
     border-bottom-right-radius: var(--radius-sm);
   }
-  .rounded-b-none {
-    border-bottom-right-radius: 0;
-    border-bottom-left-radius: 0;
-  }
   .rounded-b-none {
     border-bottom-right-radius: var(--radius-none);
     border-bottom-left-radius: var(--radius-none);
   }
-  .rounded-bl-none {
-    border-bottom-left-radius: 0;
-  }
   .rounded-bl-none {
     border-bottom-left-radius: var(--radius-none);
   }
@@ -2448,6 +2457,12 @@
       background-color: color-mix(in oklab, var(--color-background-surface) 80%, transparent);
     }
   }
+  .bg-background-surface\/90 {
+    background-color: color-mix(in srgb, #ffffff 90%, transparent);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-background-surface) 90%, transparent);
+    }
+  }
   .bg-black\/50 {
     background-color: color-mix(in srgb, #000000 50%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2617,6 +2632,10 @@
     --tw-gradient-from: var(--color-action-primary);
     --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
   }
+  .from-blue-100 {
+    --tw-gradient-from: var(--color-blue-100);
+    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
+  }
   .from-green-500 {
     --tw-gradient-from: var(--color-green-500);
     --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@@ -2634,6 +2653,10 @@
     --tw-gradient-to: var(--skeleton-base);
     --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
   }
+  .to-blue-200 {
+    --tw-gradient-to: var(--color-blue-200);
+    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
+  }
   .to-blue-500 {
     --tw-gradient-to: var(--color-blue-500);
     --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@@ -2789,14 +2812,17 @@
   .py-4 {
     padding-block: var(--spacing-4);
   }
+  .py-5 {
+    padding-block: var(--spacing-5);
+  }
   .py-6 {
     padding-block: var(--spacing-6);
   }
   .py-12 {
     padding-block: var(--spacing-12);
   }
-  .pt-3 {
-    padding-top: var(--spacing-3);
+  .pt-1 {
+    padding-top: var(--spacing-1);
   }
   .pt-4 {
     padding-top: var(--spacing-4);
@@ -2828,9 +2854,6 @@
   .pb-2 {
     padding-bottom: var(--spacing-2);
   }
-  .pb-3 {
-    padding-bottom: var(--spacing-3);
-  }
   .pb-4 {
     padding-bottom: var(--spacing-4);
   }
@@ -2982,10 +3005,6 @@
     --tw-tracking: var(--tracking-tight);
     letter-spacing: var(--tracking-tight);
   }
-  .tracking-wide {
-    --tw-tracking: var(--tracking-wide);
-    letter-spacing: var(--tracking-wide);
-  }
   .tracking-wider {
     --tw-tracking: var(--tracking-wider);
     letter-spacing: var(--tracking-wider);
@@ -3098,6 +3117,9 @@
   .text-purple-600 {
     color: var(--color-purple-600);
   }
+  .text-purple-800 {
+    color: var(--color-purple-800);
+  }
   .text-red-500 {
     color: var(--color-red-500);
   }
@@ -3736,13 +3758,6 @@
       }
     }
   }
-  .hover\:border-border-muted {
-    &:hover {
-      @media (hover: hover) {
-        border-color: var(--color-border-muted);
-      }
-    }
-  }
   .hover\:bg-action-primary-hover {
     &:hover {
       @media (hover: hover) {
@@ -3805,6 +3820,13 @@
       }
     }
   }
+  .hover\:bg-gray-50 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-gray-50);
+      }
+    }
+  }
   .hover\:bg-gray-100 {
     &:hover {
       @media (hover: hover) {
@@ -3948,13 +3970,6 @@
       }
     }
   }
-  .hover\:opacity-90 {
-    &:hover {
-      @media (hover: hover) {
-        opacity: 90%;
-      }
-    }
-  }
   .hover\:opacity-100 {
     &:hover {
       @media (hover: hover) {
@@ -4459,14 +4474,14 @@
       height: var(--spacing-96);
     }
   }
-  .md\:h-full {
+  .md\:h-\[100dvh\] {
     @media (width >= 48rem) {
-      height: 100%;
+      height: 100dvh;
     }
   }
-  .md\:h-screen {
+  .md\:h-full {
     @media (width >= 48rem) {
-      height: 100vh;
+      height: 100%;
     }
   }
   .md\:w-64 {
@@ -4748,16 +4763,6 @@
       border-bottom-width: 1px;
     }
   }
-  .lg\:px-10 {
-    @media (width >= 64rem) {
-      padding-inline: var(--spacing-10);
-    }
-  }
-  .lg\:py-10 {
-    @media (width >= 64rem) {
-      padding-block: var(--spacing-10);
-    }
-  }
   .xl\:col-auto {
     @media (width >= 80rem) {
       grid-column: auto;
@@ -5705,11 +5710,6 @@
       width: var(--spacing-4);
     }
   }
-  .\[\&\:\:-moz-range-thumb\]\:rounded-full {
-    &::-moz-range-thumb {
-      border-radius: calc(infinity * 1px);
-    }
-  }
   .\[\&\:\:-moz-range-thumb\]\:rounded-full {
     &::-moz-range-thumb {
       border-radius: var(--radius-full);
@@ -5784,11 +5784,6 @@
               appearance: none;
     }
   }
-  .\[\&\:\:-webkit-slider-thumb\]\:rounded-full {
-    &::-webkit-slider-thumb {
-      border-radius: calc(infinity * 1px);
-    }
-  }
   .\[\&\:\:-webkit-slider-thumb\]\:rounded-full {
     &::-webkit-slider-thumb {
       border-radius: var(--radius-full);
@@ -5864,11 +5859,6 @@
       justify-content: flex-start !important;
     }
   }
-  .\[\&\>\*\]\:rounded-none {
-    &>* {
-      border-radius: 0;
-    }
-  }
   .\[\&\>\*\]\:rounded-none {
     &>* {
       border-radius: var(--radius-none);
@@ -5905,12 +5895,6 @@
       padding: var(--spacing-4);
     }
   }
-  .\[td\:first-child_\&\]\:rounded-s-full {
-    td:first-child & {
-      border-start-start-radius: calc(infinity * 1px);
-      border-end-start-radius: calc(infinity * 1px);
-    }
-  }
   .\[td\:first-child_\&\]\:rounded-s-full {
     td:first-child & {
       border-start-start-radius: var(--radius-full);

package/dist/utilities.manifest.json

@@ -1,6 +1,6 @@
 {
-  "version": "1.4.0",
-  "generatedAt": "2025-10-09T18:20:15.870Z",
+  "version": "1.5.1",
+  "generatedAt": "2025-10-10T17:36:16.957Z",
   "categories": {
     "hooks": {
       "description": "React hooks for common functionality like debouncing, local storage, and time controls",
@@ -2061,6 +2061,14 @@
           "category": "colors",
           "file": "utils/colors.ts"
         },
+        {
+          "name": "MapboxExpression",
+          "type": "type",
+          "description": "Type for Mapbox GL JS expressions Represents nested array structures used by Mapbox for data-driven styling",
+          "example": null,
+          "category": "colors",
+          "file": "utils/colors.ts"
+        },
         {
           "name": "mapValuesToCategoricalColors",
           "type": "constant",
@@ -2110,7 +2118,7 @@
     }
   },
   "summary": {
-    "totalUtilities": 207,
+    "totalUtilities": 208,
     "totalCategories": 5,
     "categories": [
       {
@@ -2127,7 +2135,7 @@
       },
       {
         "name": "colors",
-        "count": 20
+        "count": 21
       },
       {
         "name": "general",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@texturehq/edges",
-  "version": "1.4.0",
+  "version": "1.5.1",
   "author": "Nicholas Brown <nick@texturehq.com>",
   "description": "A shared component library for Texture",
   "type": "module",
@@ -35,7 +35,7 @@
     "watch": "tsup --watch",
     "build": "yarn tokens:build && tsup && yarn build:post",
     "build:post": "postcss src/styles.css -o dist/styles.css && node scripts/copy-assets.js && node scripts/generate-components-manifest.js && node scripts/generate-utilities-manifest.js",
-    "tokens:build": "node style-dictionary.config.mjs",
+    "tokens:build": "node style-dictionary.config.mjs && node scripts/generate-viz-runtime.js",
     "tokens:build:tailwind": "node style-dictionary.config.mjs",
     "tokens:watch": "nodemon --watch tokens --ext json --exec 'yarn tokens:build'",
     "tokens:watch:tailwind": "nodemon --watch tokens --ext json --exec 'yarn tokens:build:tailwind'",
@@ -53,7 +53,7 @@
     "test:watch": "vitest",
     "test:coverage": "vitest run --coverage",
     "test:ui": "vitest --ui",
-    "storybook": "storybook dev -p 6010 --no-open",
+    "storybook": "VITE_MAPBOX_ACCESS_TOKEN=pk.eyJ1IjoidmljdG9yLXRleHR1cmUiLCJhIjoiY2x1cXM5dnVqMDFvYTJrcWszbnZmdGo4cCJ9.uEu0gqmITLtBMKEVW0aFtA storybook dev -p 6010 --no-open",
     "build-storybook": "storybook build",
     "postinstall": "node scripts/setup-cursor-rules.js || echo \"! setup-cursor-rules: non-fatal error\""
   },