@texturehq/edges 1.13.2 → 1.14.0

package/dist/components.manifest.json

@@ -1,6 +1,6 @@
 {
-  "version": "1.13.2",
-  "generatedAt": "2025-10-28T18:47:55.357Z",
+  "version": "1.14.0",
+  "generatedAt": "2025-10-29T15:33:05.223Z",
   "components": [
     {
       "name": "ActionCell",
@@ -222,7 +222,7 @@
     {
       "name": "Badge",
       "category": "Display",
-      "description": "Badge  A non-interactive label for displaying status, counts, or categories. Use for read-only indicators. For interactive elements, use Chip instead.",
+      "description": "Badge  A non-interactive label for displaying status, counts, or categories. Use for read-only indicators. For interactive elements, use Chip instead.  Supports device states (charging, discharging, heat, cool, etc.) and grid states (importing, exporting) as variant values.",
       "importRoot": "@texturehq/edges",
       "importPath": "@texturehq/edges/components/Badge",
       "props": [],
@@ -789,6 +789,16 @@
       ],
       "storybookPath": "Overlays/Confirm"
     },
+    {
+      "name": "ConnectionStatusBadge",
+      "category": "Display",
+      "description": "ConnectionStatusBadge  Displays device connection status with optional timestamps. - Green \"Connected\" badge with pulsing dot - Gray \"Disconnected\" badge with duration offline - Auto-calculates \"offline for 2 hours\" type strings  @example ```tsx <ConnectionStatusBadge isConnected={true} /> <ConnectionStatusBadge isConnected={false} disconnectedAt={new Date()} showTimestamp /> <ConnectionStatusBadge isConnected={true} connectedAt={new Date()} /> ```",
+      "importRoot": "@texturehq/edges",
+      "importPath": "@texturehq/edges/components/ConnectionStatusBadge",
+      "props": [],
+      "relatedComponents": [],
+      "storybookPath": "Display/ConnectionStatusBadge"
+    },
     {
       "name": "CopyToClipboard",
       "category": "Display",
@@ -857,6 +867,56 @@
       ],
       "storybookPath": "Form Controls/DateRangePicker"
     },
+    {
+      "name": "DeviceHealthBadge",
+      "category": "Display",
+      "description": "DeviceHealthBadge  Displays device health status with optional alert counts. Maps health status to feedback colors (success/warning/error). Pulsing dot for warning/error states.  @example ```tsx <DeviceHealthBadge status=\"healthy\" /> <DeviceHealthBadge status=\"warning\" alertCount={2} showCount /> <DeviceHealthBadge status=\"error\" alertCount={5} showCount /> ```",
+      "importRoot": "@texturehq/edges",
+      "importPath": "@texturehq/edges/components/DeviceHealthBadge",
+      "props": [],
+      "relatedComponents": [],
+      "storybookPath": "Display/DeviceHealthBadge"
+    },
+    {
+      "name": "DeviceMetaDisplay",
+      "category": "Display",
+      "description": "DeviceMetaDisplay  Displays device metadata (manufacturer, model, serial number) with optional logo. Supports compact layout for tables and full layout for headers/cards. Falls back to device type icon if logo fails to load.  @example ```tsx // Table cell <DeviceMetaDisplay manufacturer=\"Tesla\" model=\"Powerwall 2\" logoUrl=\"https://...\" deviceType=\"battery\" layout=\"compact\" />  // Page header <DeviceMetaDisplay manufacturer=\"Tesla\" model=\"Powerwall 2\" serialNumber=\"TG123456789\" logoUrl=\"https://...\" deviceType=\"battery\" layout=\"full\" showDeviceTypeIcon /> ```",
+      "importRoot": "@texturehq/edges",
+      "importPath": "@texturehq/edges/components/DeviceMetaDisplay",
+      "props": [],
+      "relatedComponents": [],
+      "storybookPath": "Display/DeviceMetaDisplay"
+    },
+    {
+      "name": "DeviceStateBadge",
+      "category": "Display",
+      "description": "DeviceStateBadge  A specialized badge component for displaying device states with smart defaults. Auto-enables pulsing dot for active states (charging, discharging, heat, cool, on). Uses semantic device state colors from the theme.  @example ```tsx <DeviceStateBadge state=\"charging\" /> <DeviceStateBadge state=\"heat\" label=\"Heating Mode\" /> <DeviceStateBadge state=\"on\" icon=\"Lightning\" /> ```",
+      "importRoot": "@texturehq/edges",
+      "importPath": "@texturehq/edges/components/DeviceStateBadge",
+      "props": [],
+      "relatedComponents": [],
+      "storybookPath": "Display/DeviceStateBadge"
+    },
+    {
+      "name": "DeviceStateWithMetric",
+      "category": "Display",
+      "description": "DeviceStateWithMetric  Combines a device state badge with a formatted metric display. Uses the existing FieldFormat system for flexible metric formatting. Supports horizontal layout (for tables) and vertical layout (for cards/detail views).  @example ```tsx // Battery: \"Charging | 75%\" <DeviceStateWithMetric state=\"charging\" metric={75} metricFormatter={{ type: \"number\", decimals: 0, suffix: \"%\" }} />  // Inverter: \"On | 5.2 kW\" <DeviceStateWithMetric state=\"on\" metric={5200} metricFormatter={{ type: \"power\", unit: \"kW\" }} />  // Thermostat: \"Cool | 72°F\" <DeviceStateWithMetric state=\"cool\" metric={72} metricFormatter={{ type: \"temperature\", unit: \"F\" }} /> ```",
+      "importRoot": "@texturehq/edges",
+      "importPath": "@texturehq/edges/components/DeviceStateWithMetric",
+      "props": [],
+      "relatedComponents": [],
+      "storybookPath": "Display/DeviceStateWithMetric"
+    },
+    {
+      "name": "DeviceTypeIcon",
+      "category": "Display",
+      "description": "DeviceTypeIcon  Displays a consistent icon for device types across the platform. Maps device types to appropriate Phosphor icons with optional labels.  @example ```tsx <DeviceTypeIcon deviceType=\"battery\" size=\"md\" /> <DeviceTypeIcon deviceType=\"thermostat\" showLabel /> <DeviceTypeIcon deviceType=\"charger\" size={32} /> ```",
+      "importRoot": "@texturehq/edges",
+      "importPath": "@texturehq/edges/components/DeviceTypeIcon",
+      "props": [],
+      "relatedComponents": [],
+      "storybookPath": "Display/DeviceTypeIcon"
+    },
     {
       "name": "Dialog",
       "category": "Overlays",
@@ -913,6 +973,16 @@
       ],
       "storybookPath": "Feedback/EmptyState"
     },
+    {
+      "name": "EnrollmentStatusBadge",
+      "category": "Display",
+      "description": "EnrollmentStatusBadge  Displays device enrollment status for programs. Color-coded status with optional program name in tooltip.  Status mapping: - enrolled → success (green) - eligible → info (blue) - pending → warning (yellow) - not_eligible → neutral (gray) - opted_out → neutral (gray)  @example ```tsx <EnrollmentStatusBadge status=\"enrolled\" programName=\"Demand Response Q4\" /> <EnrollmentStatusBadge status=\"eligible\" /> <EnrollmentStatusBadge status=\"pending\" /> ```",
+      "importRoot": "@texturehq/edges",
+      "importPath": "@texturehq/edges/components/EnrollmentStatusBadge",
+      "props": [],
+      "relatedComponents": [],
+      "storybookPath": "Display/EnrollmentStatusBadge"
+    },
     {
       "name": "ErrorBoundary",
       "category": "Feedback",
@@ -958,6 +1028,16 @@
       "relatedComponents": [],
       "storybookPath": "Data/FilterDialog"
     },
+    {
+      "name": "FirmwareVersionBadge",
+      "category": "Display",
+      "description": "FirmwareVersionBadge  Displays firmware version with update status indicators. Green indicator if latest, orange if update available. Compact display suitable for tables.  @example ```tsx <FirmwareVersionBadge version=\"1.2.3\" isLatest /> <FirmwareVersionBadge version=\"1.1.0\" updateAvailable /> <FirmwareVersionBadge version=\"2.0.0-beta\" /> ```",
+      "importRoot": "@texturehq/edges",
+      "importPath": "@texturehq/edges/components/FirmwareVersionBadge",
+      "props": [],
+      "relatedComponents": [],
+      "storybookPath": "Display/FirmwareVersionBadge"
+    },
     {
       "name": "Form",
       "category": "Form Controls",
@@ -990,6 +1070,16 @@
       ],
       "storybookPath": "Layout/Grid"
     },
+    {
+      "name": "GridStateBadge",
+      "category": "Display",
+      "description": "GridStateBadge  A specialized badge component for displaying grid states (importing, exporting). Optionally shows directional icons to indicate power flow direction. Uses semantic grid state colors from the theme.  @example ```tsx <GridStateBadge state=\"importing\" /> <GridStateBadge state=\"exporting\" showIcon /> <GridStateBadge state=\"importing\" label=\"Grid Import\" /> ```",
+      "importRoot": "@texturehq/edges",
+      "importPath": "@texturehq/edges/components/GridStateBadge",
+      "props": [],
+      "relatedComponents": [],
+      "storybookPath": "Display/GridStateBadge"
+    },
     {
       "name": "Heading",
       "category": "Typography",
@@ -2124,7 +2214,7 @@
         },
         {
           "name": "variant",
-          "type": "\"default\" | \"primary\" | \"muted\" | \"unstyled\""
+          "type": "\"default\" | \"brand\" | \"muted\" | \"unstyled\""
         },
         {
           "name": "onClick",
@@ -2399,7 +2489,16 @@
       "Avatar",
       "Badge",
       "Chip",
-      "CopyToClipboard"
+      "ConnectionStatusBadge",
+      "CopyToClipboard",
+      "DeviceHealthBadge",
+      "DeviceMetaDisplay",
+      "DeviceStateBadge",
+      "DeviceStateWithMetric",
+      "DeviceTypeIcon",
+      "EnrollmentStatusBadge",
+      "FirmwareVersionBadge",
+      "GridStateBadge"
     ],
     "Navigation": [
       "BreadcrumbItem",