@texturehq/edges 1.1.0 → 1.2.0

package/dist/components.manifest.json

@@ -1,6 +1,6 @@
 {
-  "version": "1.1.0",
-  "generatedAt": "2025-09-29T15:54:18.829Z",
+  "version": "1.2.0",
+  "generatedAt": "2025-10-06T17:53:58.953Z",
   "components": [
     {
       "name": "ActionCell",
@@ -89,7 +89,7 @@
       "name": "AreaSeries",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/AreaSeries",
-      "description": "",
+      "description": "AreaSeries  Chart component for rendering area charts with gradient fill. Displays data as a filled area with optional line path, supporting animations and custom colors.",
       "props": []
     },
     {
@@ -287,7 +287,7 @@
       "name": "BarSeries",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/BarSeries",
-      "description": "",
+      "description": "BarSeries  Chart component for rendering bar/column charts. Displays data as vertical bars with customizable colors, opacity, and category-based coloring.",
       "props": []
     },
     {
@@ -425,28 +425,37 @@
       "name": "ChartAxis",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/ChartAxis",
-      "description": "",
+      "description": "ChartAxis  Chart axis components for rendering X and Y axes. Provides formatted bottom (time) and left (numeric) axes with customizable tick formatting.",
       "props": []
     },
     {
       "name": "ChartBottomBar",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/ChartBottomBar",
-      "description": "",
-      "props": []
+      "description": "ChartBottomBar  Chart footer component with legend and export functionality. Displays color-coded legend items and provides export options for CSV, SVG, and PNG formats.",
+      "props": [
+        {
+          "name": "items",
+          "type": "LegendItem[]"
+        },
+        {
+          "name": "onExport",
+          "type": "(type: ExportType) => void | Promise<void>"
+        }
+      ]
     },
     {
       "name": "ChartContainer",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/ChartContainer",
-      "description": "",
+      "description": "ChartContainer  Main chart wrapper component that provides context and layout for chart visualizations. Handles scaling, tooltips, axes, and data management for area, line, and bar charts.",
       "props": []
     },
     {
       "name": "ChartTooltip",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/ChartTooltip",
-      "description": "",
+      "description": "ChartTooltip  Interactive tooltip component for charts. Displays formatted data values at hover position with automatic positioning and animations.",
       "props": []
     },
     {
@@ -621,7 +630,7 @@
       "name": "DataTable",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/DataTable",
-      "description": "",
+      "description": "DataTable  Advanced table component with sorting, filtering, pagination, and mobile-responsive views. Supports custom cell renderers, column configurations, and multiple display densities.",
       "props": []
     },
     {
@@ -656,14 +665,14 @@
       "name": "DialogHeader",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/DialogHeader",
-      "description": "",
+      "description": "DialogHeader  Header area for dialogs with optional back arrow.",
       "props": []
     },
     {
       "name": "Drawer",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/Drawer",
-      "description": "",
+      "description": "Maximum width of the drawer. Defaults to \"400px\". Can be any valid CSS width value.",
       "props": [
         {
           "name": "title",
@@ -723,7 +732,7 @@
       "name": "ErrorBoundary",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/ErrorBoundary",
-      "description": "",
+      "description": "ErrorBoundary  React error boundary component for graceful error handling. Catches JavaScript errors in child components and displays a fallback UI with retry option.",
       "props": []
     },
     {
@@ -865,7 +874,7 @@
       "name": "Icon",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/Icon",
-      "description": "",
+      "description": "Icon  Phosphor icon wrapper component with standardized sizing and styling. Provides access to the full Phosphor icon library with tree-shaking support and design system presets. - TypeScript autocomplete for all icon names  Usage: ```tsx <Icon name=\"House\" size=\"md\" /> <Icon name=\"User\" size={32} className=\"text-brand\" /> ```",
       "props": []
     },
     {
@@ -890,12 +899,8 @@
           "type": "number | string"
         },
         {
-          "name": "unit",
-          "type": "string"
-        },
-        {
-          "name": "format",
-          "type": "Intl.NumberFormatOptions"
+          "name": "formatter",
+          "type": "KpiFormatter"
         },
         {
           "name": "delta",
@@ -942,12 +947,8 @@
           "type": "number | string"
         },
         {
-          "name": "unit",
-          "type": "string"
-        },
-        {
-          "name": "format",
-          "type": "Intl.NumberFormatOptions"
+          "name": "formatter",
+          "type": "KpiFormatter"
         },
         {
           "name": "delta",
@@ -983,7 +984,7 @@
       "name": "LineSeries",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/LineSeries",
-      "description": "",
+      "description": "LineSeries  Chart component for rendering line charts. Displays data as a continuous line with customizable stroke width, color, and dash patterns.",
       "props": []
     },
     {
@@ -1013,7 +1014,7 @@
       "name": "Loader",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/Loader",
-      "description": "",
+      "description": "Loader  Animated loading spinner component. Displays a circular spinner with customizable size and color for loading states.",
       "props": [
         {
           "name": "className",
@@ -1033,7 +1034,7 @@
       "name": "Logo",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/Logo",
-      "description": "",
+      "description": "Logo  Brand logo component with optional wordmark. Supports customizable sizing and fill colors with theme-aware defaults.",
       "props": [
         {
           "name": "className",
@@ -1612,7 +1613,7 @@
       "name": "SideNav",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/SideNav",
-      "description": "",
+      "description": "SideNav  Vertical navigation component for application sidebars. Supports nested navigation items, sections, collapsible categories, and mobile-responsive behavior.",
       "props": [
         {
           "name": "topItems",
@@ -1652,7 +1653,7 @@
       "name": "Skeleton",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/Skeleton",
-      "description": "",
+      "description": "Skeleton  Loading placeholder component that mimics content structure. Supports various shapes, animations, and responsive configurations for skeleton screens.",
       "props": []
     },
     {
@@ -1777,7 +1778,7 @@
       "name": "StatList",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/StatList",
-      "description": "Copy callback",
+      "description": "Additional CSS classes",
       "props": [
         {
           "name": "items",
@@ -1814,10 +1815,6 @@
         {
           "name": "className",
           "type": "string"
-        },
-        {
-          "name": "onCopy",
-          "type": "(text: string, id: string) => void"
         }
       ]
     },
@@ -1825,7 +1822,7 @@
       "name": "Switch",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/Switch",
-      "description": "",
+      "description": "Switch  Toggle switch component for binary on/off states. Provides an accessible alternative to checkboxes for settings and preferences.",
       "props": [
         {
           "name": "children",
@@ -1837,7 +1834,7 @@
       "name": "Tab",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/Tab",
-      "description": "Tabs  Tabbed interface with styled tabs and panels.",
+      "description": "Tabs  Tabbed interface with styled tabs and panels. @param variant - \"default\" for gray styling, \"accent\" for brand color styling",
       "props": []
     },
     {
@@ -1858,8 +1855,13 @@
       "name": "Tabs",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/Tabs",
-      "description": "Tabs  Tabbed interface with styled tabs and panels.",
-      "props": []
+      "description": "Tabs  Tabbed interface with styled tabs and panels. @param variant - \"default\" for gray styling, \"accent\" for brand color styling",
+      "props": [
+        {
+          "name": "variant",
+          "type": "TabVariant"
+        }
+      ]
     },
     {
       "name": "TextArea",
@@ -1905,7 +1907,7 @@
       "name": "TextAreaWithChips",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/TextAreaWithChips",
-      "description": "",
+      "description": "TextAreaWithChips  Enhanced textarea component with chip/tag support. Enables rich text input with embedded chips for mentions, tags, or structured data entry.",
       "props": [
         {
           "name": "label",
@@ -2032,7 +2034,7 @@
       "name": "TextLink",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/TextLink",
-      "description": "",
+      "description": "TextLink  Styled text link component for navigation and actions. Supports internal/external links, button mode, and multiple visual variants.",
       "props": [
         {
           "name": "href",
@@ -2228,7 +2230,7 @@
       "name": "TopNav",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/TopNav",
-      "description": "",
+      "description": "TopNav  Horizontal navigation bar component for application headers. Includes mobile menu toggle, user avatar, theme switcher, and customizable action areas.",
       "props": [
         {
           "name": "rightContent",

package/dist/generated/tailwind-tokens-dark.css

@@ -70,8 +70,98 @@
   --color-brand-light: #f7f7ff;
   --color-brand-dark: #363ccb;
   --color-brand-background: #f6f7ff;
+  --color-skeleton-base: #e5e7eb;
+  --color-skeleton-highlight: #f3f4f6;
+  --color-skeleton-wave: rgba(255, 255, 255, 0.3);
   --color-neutral-white: #ffffff;
   --color-neutral-black: #000000;
+  --color-data-categorical-1: #a3eae4;
+  --color-data-categorical-2: #91a0ff;
+  --color-data-categorical-3: #ffd1a3;
+  --color-data-categorical-4: #ffabc8;
+  --color-data-categorical-5: #c1b8ff;
+  --color-data-categorical-6: #e0ffb8;
+  --color-data-sequential-viridis-1: #fafa37;
+  --color-data-sequential-viridis-2: #d6e654;
+  --color-data-sequential-viridis-3: #b2d373;
+  --color-data-sequential-viridis-4: #88be8c;
+  --color-data-sequential-viridis-5: #5fa2a4;
+  --color-data-sequential-viridis-6: #3d7eaa;
+  --color-data-sequential-viridis-7: #2a60b1;
+  --color-data-sequential-viridis-8: #1b3a99;
+  --color-data-sequential-viridis-9: #132353;
+  --color-data-sequential-viridis-10: #110f39;
+  --color-data-sequential-magma-1: #fcf5cd;
+  --color-data-sequential-magma-2: #f5db95;
+  --color-data-sequential-magma-3: #e9af7c;
+  --color-data-sequential-magma-4: #db7d70;
+  --color-data-sequential-magma-5: #b9577a;
+  --color-data-sequential-magma-6: #883482;
+  --color-data-sequential-magma-7: #6a1f78;
+  --color-data-sequential-magma-8: #4b1277;
+  --color-data-sequential-magma-9: #2d0b42;
+  --color-data-sequential-magma-10: #0b0511;
+  --color-data-sequential-rose-1: #fef3e7;
+  --color-data-sequential-rose-2: #f5c7e0;
+  --color-data-sequential-rose-3: #ec9bce;
+  --color-data-sequential-rose-4: #d86db0;
+  --color-data-sequential-rose-5: #be4a8b;
+  --color-data-sequential-rose-6: #9d2f76;
+  --color-data-sequential-rose-7: #78176c;
+  --color-data-sequential-rose-8: #56135c;
+  --color-data-sequential-rose-9: #371344;
+  --color-data-sequential-rose-10: #190b29;
+  --color-data-sequential-cerulean-1: #e2f7f2;
+  --color-data-sequential-cerulean-2: #b6e4e8;
+  --color-data-sequential-cerulean-3: #8bd3d7;
+  --color-data-sequential-cerulean-4: #60b2c7;
+  --color-data-sequential-cerulean-5: #3d91b6;
+  --color-data-sequential-cerulean-6: #22698e;
+  --color-data-sequential-cerulean-7: #0e486a;
+  --color-data-sequential-cerulean-8: #0a314d;
+  --color-data-sequential-cerulean-9: #081e33;
+  --color-data-sequential-cerulean-10: #030e1d;
+  --color-data-sequential-forest-1: #f4fad8;
+  --color-data-sequential-forest-2: #d6e6a5;
+  --color-data-sequential-forest-3: #b2cd73;
+  --color-data-sequential-forest-4: #88af52;
+  --color-data-sequential-forest-5: #5f8835;
+  --color-data-sequential-forest-6: #3d6426;
+  --color-data-sequential-forest-7: #2a461a;
+  --color-data-sequential-forest-8: #1b2e13;
+  --color-data-sequential-forest-9: #13200d;
+  --color-data-sequential-forest-10: #0b1305;
+  --color-data-diverging-orange-yellow-seafoam-1: #6b2c1a;
+  --color-data-diverging-orange-yellow-seafoam-2: #a24b1e;
+  --color-data-diverging-orange-yellow-seafoam-3: #cb7131;
+  --color-data-diverging-orange-yellow-seafoam-4: #e2a05d;
+  --color-data-diverging-orange-yellow-seafoam-5: #f3e1a3;
+  --color-data-diverging-orange-yellow-seafoam-6: #c1e4d2;
+  --color-data-diverging-orange-yellow-seafoam-7: #7eb8b1;
+  --color-data-diverging-orange-yellow-seafoam-8: #4c8c89;
+  --color-data-diverging-orange-yellow-seafoam-9: #2b6262;
+  --color-data-diverging-orange-yellow-seafoam-10: #1b3d3c;
+  --color-data-diverging-red-yellow-blue-1: #4e142d;
+  --color-data-diverging-red-yellow-blue-2: #8b2d4e;
+  --color-data-diverging-red-yellow-blue-3: #c15a4a;
+  --color-data-diverging-red-yellow-blue-4: #db8b6a;
+  --color-data-diverging-red-yellow-blue-5: #f3e1a3;
+  --color-data-diverging-red-yellow-blue-6: #bfd4c7;
+  --color-data-diverging-red-yellow-blue-7: #7c9eb9;
+  --color-data-diverging-red-yellow-blue-8: #4770a3;
+  --color-data-diverging-red-yellow-blue-9: #2e4d8c;
+  --color-data-diverging-red-yellow-blue-10: #18274e;
+  --color-data-diverging-red-blue-1: #4e142d;
+  --color-data-diverging-red-blue-2: #8b2d4e;
+  --color-data-diverging-red-blue-3: #c15a7a;
+  --color-data-diverging-red-blue-4: #db8b9e;
+  --color-data-diverging-red-blue-5: #f3e1f4;
+  --color-data-diverging-red-blue-6: #c7bfe2;
+  --color-data-diverging-red-blue-7: #9ea7ce;
+  --color-data-diverging-red-blue-8: #7080b5;
+  --color-data-diverging-red-blue-9: #4d5e99;
+  --color-data-diverging-red-blue-10: #2b3d70;
+  --color-data-default: #444ae1;
   --spacing-0: 0px;
   --spacing-1: 0.25rem;
   --spacing-2: 0.5rem;

package/dist/generated/tailwind-tokens-light.css

@@ -70,8 +70,98 @@
   --color-brand-light: #f7f7ff;
   --color-brand-dark: #363ccb;
   --color-brand-background: #f6f7ff;
+  --color-skeleton-base: #e5e7eb;
+  --color-skeleton-highlight: #f3f4f6;
+  --color-skeleton-wave: rgba(255, 255, 255, 0.3);
   --color-neutral-white: #ffffff;
   --color-neutral-black: #000000;
+  --color-data-categorical-1: #a3eae4;
+  --color-data-categorical-2: #91a0ff;
+  --color-data-categorical-3: #ffd1a3;
+  --color-data-categorical-4: #ffabc8;
+  --color-data-categorical-5: #c1b8ff;
+  --color-data-categorical-6: #e0ffb8;
+  --color-data-sequential-viridis-1: #fafa37;
+  --color-data-sequential-viridis-2: #d6e654;
+  --color-data-sequential-viridis-3: #b2d373;
+  --color-data-sequential-viridis-4: #88be8c;
+  --color-data-sequential-viridis-5: #5fa2a4;
+  --color-data-sequential-viridis-6: #3d7eaa;
+  --color-data-sequential-viridis-7: #2a60b1;
+  --color-data-sequential-viridis-8: #1b3a99;
+  --color-data-sequential-viridis-9: #132353;
+  --color-data-sequential-viridis-10: #110f39;
+  --color-data-sequential-magma-1: #fcf5cd;
+  --color-data-sequential-magma-2: #f5db95;
+  --color-data-sequential-magma-3: #e9af7c;
+  --color-data-sequential-magma-4: #db7d70;
+  --color-data-sequential-magma-5: #b9577a;
+  --color-data-sequential-magma-6: #883482;
+  --color-data-sequential-magma-7: #6a1f78;
+  --color-data-sequential-magma-8: #4b1277;
+  --color-data-sequential-magma-9: #2d0b42;
+  --color-data-sequential-magma-10: #0b0511;
+  --color-data-sequential-rose-1: #fef3e7;
+  --color-data-sequential-rose-2: #f5c7e0;
+  --color-data-sequential-rose-3: #ec9bce;
+  --color-data-sequential-rose-4: #d86db0;
+  --color-data-sequential-rose-5: #be4a8b;
+  --color-data-sequential-rose-6: #9d2f76;
+  --color-data-sequential-rose-7: #78176c;
+  --color-data-sequential-rose-8: #56135c;
+  --color-data-sequential-rose-9: #371344;
+  --color-data-sequential-rose-10: #190b29;
+  --color-data-sequential-cerulean-1: #e2f7f2;
+  --color-data-sequential-cerulean-2: #b6e4e8;
+  --color-data-sequential-cerulean-3: #8bd3d7;
+  --color-data-sequential-cerulean-4: #60b2c7;
+  --color-data-sequential-cerulean-5: #3d91b6;
+  --color-data-sequential-cerulean-6: #22698e;
+  --color-data-sequential-cerulean-7: #0e486a;
+  --color-data-sequential-cerulean-8: #0a314d;
+  --color-data-sequential-cerulean-9: #081e33;
+  --color-data-sequential-cerulean-10: #030e1d;
+  --color-data-sequential-forest-1: #f4fad8;
+  --color-data-sequential-forest-2: #d6e6a5;
+  --color-data-sequential-forest-3: #b2cd73;
+  --color-data-sequential-forest-4: #88af52;
+  --color-data-sequential-forest-5: #5f8835;
+  --color-data-sequential-forest-6: #3d6426;
+  --color-data-sequential-forest-7: #2a461a;
+  --color-data-sequential-forest-8: #1b2e13;
+  --color-data-sequential-forest-9: #13200d;
+  --color-data-sequential-forest-10: #0b1305;
+  --color-data-diverging-orange-yellow-seafoam-1: #6b2c1a;
+  --color-data-diverging-orange-yellow-seafoam-2: #a24b1e;
+  --color-data-diverging-orange-yellow-seafoam-3: #cb7131;
+  --color-data-diverging-orange-yellow-seafoam-4: #e2a05d;
+  --color-data-diverging-orange-yellow-seafoam-5: #f3e1a3;
+  --color-data-diverging-orange-yellow-seafoam-6: #c1e4d2;
+  --color-data-diverging-orange-yellow-seafoam-7: #7eb8b1;
+  --color-data-diverging-orange-yellow-seafoam-8: #4c8c89;
+  --color-data-diverging-orange-yellow-seafoam-9: #2b6262;
+  --color-data-diverging-orange-yellow-seafoam-10: #1b3d3c;
+  --color-data-diverging-red-yellow-blue-1: #4e142d;
+  --color-data-diverging-red-yellow-blue-2: #8b2d4e;
+  --color-data-diverging-red-yellow-blue-3: #c15a4a;
+  --color-data-diverging-red-yellow-blue-4: #db8b6a;
+  --color-data-diverging-red-yellow-blue-5: #f3e1a3;
+  --color-data-diverging-red-yellow-blue-6: #bfd4c7;
+  --color-data-diverging-red-yellow-blue-7: #7c9eb9;
+  --color-data-diverging-red-yellow-blue-8: #4770a3;
+  --color-data-diverging-red-yellow-blue-9: #2e4d8c;
+  --color-data-diverging-red-yellow-blue-10: #18274e;
+  --color-data-diverging-red-blue-1: #4e142d;
+  --color-data-diverging-red-blue-2: #8b2d4e;
+  --color-data-diverging-red-blue-3: #c15a7a;
+  --color-data-diverging-red-blue-4: #db8b9e;
+  --color-data-diverging-red-blue-5: #f3e1f4;
+  --color-data-diverging-red-blue-6: #c7bfe2;
+  --color-data-diverging-red-blue-7: #9ea7ce;
+  --color-data-diverging-red-blue-8: #7080b5;
+  --color-data-diverging-red-blue-9: #4d5e99;
+  --color-data-diverging-red-blue-10: #2b3d70;
+  --color-data-default: #444ae1;
   --spacing-0: 0px;
   --spacing-1: 0.25rem;
   --spacing-2: 0.5rem;