@texturehq/edges 1.9.0 → 1.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,6 +1,6 @@
1
1
  {
2
- "version": "1.9.0",
3
- "generatedAt": "2025-10-21T19:04:50.170Z",
2
+ "version": "1.10.0",
3
+ "generatedAt": "2025-10-22T14:55:00.107Z",
4
4
  "components": [
5
5
  {
6
6
  "name": "ActionCell",
@@ -248,19 +248,19 @@
248
248
  "storybookPath": "Uncategorized/BooleanCell"
249
249
  },
250
250
  {
251
- "name": "Breadcrumb",
251
+ "name": "BreadcrumbItem",
252
252
  "category": "Navigation",
253
- "description": "Breadcrumbs Navigation breadcrumbs that show the user's current location in the hierarchy",
253
+ "description": "BreadcrumbItem Individual breadcrumb item with optional link The last breadcrumb is automatically styled as the current page (non-interactive, bold)",
254
254
  "importRoot": "@texturehq/edges",
255
- "importPath": "@texturehq/edges/components/Breadcrumb",
255
+ "importPath": "@texturehq/edges/components/BreadcrumbItem",
256
256
  "props": [],
257
257
  "relatedComponents": [],
258
- "storybookPath": "Navigation/Breadcrumb"
258
+ "storybookPath": "Navigation/BreadcrumbItem"
259
259
  },
260
260
  {
261
261
  "name": "Breadcrumbs",
262
262
  "category": "Navigation",
263
- "description": "Breadcrumbs Navigation breadcrumbs that show the user's current location in the hierarchy",
263
+ "description": "Breadcrumbs Navigation breadcrumbs that show the user's current location in the hierarchy Automatically collapses middle items into an ellipsis dropdown when the container width exceeds the maxWidth threshold (default: 600px)",
264
264
  "importRoot": "@texturehq/edges",
265
265
  "importPath": "@texturehq/edges/components/Breadcrumbs",
266
266
  "props": [],
@@ -276,7 +276,7 @@
276
276
  "props": [
277
277
  {
278
278
  "name": "variant",
279
- "type": "| \"default\" | \"primary\" | \"secondary\" | \"destructive\" | \"icon\" | \"link\" | \"unstyled\" | \"ghost\""
279
+ "type": "| \"default\" | \"brand\" | \"secondary\" | \"destructive\" | \"icon\" | \"link\" | \"unstyled\" | \"ghost\" | \"primary\""
280
280
  },
281
281
  {
282
282
  "name": "size",
@@ -366,7 +366,7 @@
366
366
  {
367
367
  "name": "Card",
368
368
  "category": "Layout",
369
- "description": "Card - Enterprise surface container component A flexible, composable card component following enterprise design system best practices. Supports modular content sections with consistent styling and accessibility. Usage: ```tsx <Card variant=\"outlined\" size=\"md\"> <Card.Header title=\"Card Title\" subtitle=\"Optional subtitle\" actions={<Button variant=\"ghost\" icon=\"MoreHorizontal\" />} /> <Card.Media src=\"image.jpg\" alt=\"Description\" /> <Card.Content> <p>Main content goes here</p> </Card.Content> <Card.Footer> <Button variant=\"primary\">Action</Button> </Card.Footer> </Card> ```",
369
+ "description": "Card - Enterprise surface container component A flexible, composable card component following enterprise design system best practices. Supports modular content sections with consistent styling and accessibility. Usage: ```tsx <Card variant=\"outlined\" size=\"md\"> <Card.Header title=\"Card Title\" subtitle=\"Optional subtitle\" actions={<Button variant=\"ghost\" icon=\"MoreHorizontal\" />} /> <Card.Media src=\"image.jpg\" alt=\"Description\" /> <Card.Content> <p>Main content goes here</p> </Card.Content> <Card.Footer> <Button variant=\"brand\">Action</Button> </Card.Footer> </Card> ```",
370
370
  "importRoot": "@texturehq/edges",
371
371
  "importPath": "@texturehq/edges/components/Card",
372
372
  "props": [
@@ -478,7 +478,7 @@
478
478
  {
479
479
  "name": "Checkbox",
480
480
  "category": "Form Controls",
481
- "description": "Checkbox Single checkbox with Edges visuals.",
481
+ "description": "Visual variant of the checkbox @default \"brand\"",
482
482
  "importRoot": "@texturehq/edges",
483
483
  "importPath": "@texturehq/edges/components/Checkbox",
484
484
  "props": [
@@ -495,7 +495,7 @@
495
495
  {
496
496
  "name": "CheckboxGroup",
497
497
  "category": "Form Controls",
498
- "description": "Checkbox Single checkbox with Edges visuals.",
498
+ "description": "Visual variant of the checkbox @default \"brand\"",
499
499
  "importRoot": "@texturehq/edges",
500
500
  "importPath": "@texturehq/edges/components/CheckboxGroup",
501
501
  "props": [
@@ -757,7 +757,7 @@
757
757
  {
758
758
  "name": "EmptyState",
759
759
  "category": "Feedback",
760
- "description": "EmptyState Minimal, composable empty state surface for communicating lack of data. Supports optional icon, description and opinionated action patterns. Use `primaryAction` and `secondaryAction` for consistent styling, or use `actions` for complete control over the action area.",
760
+ "description": "EmptyState Minimal, composable empty state surface for communicating lack of data. Supports optional icon, description and opinionated action patterns. Use `primaryAction` (button) and `secondaryAction` (text link) for consistent styling, or use `actions` for complete control over the action area.",
761
761
  "importRoot": "@texturehq/edges",
762
762
  "importPath": "@texturehq/edges/components/EmptyState",
763
763
  "props": [],
@@ -1367,7 +1367,7 @@
1367
1367
  {
1368
1368
  "name": "Radio",
1369
1369
  "category": "Form Controls",
1370
- "description": "Validation result object for functional errorMessage",
1370
+ "description": "Visual variant of the radio buttons @default \"brand\"",
1371
1371
  "importRoot": "@texturehq/edges",
1372
1372
  "importPath": "@texturehq/edges/components/Radio",
1373
1373
  "props": [],
@@ -1377,7 +1377,7 @@
1377
1377
  {
1378
1378
  "name": "RadioGroup",
1379
1379
  "category": "Form Controls",
1380
- "description": "Validation result object for functional errorMessage",
1380
+ "description": "Visual variant of the radio buttons @default \"brand\"",
1381
1381
  "importRoot": "@texturehq/edges",
1382
1382
  "importPath": "@texturehq/edges/components/RadioGroup",
1383
1383
  "props": [],
@@ -1664,7 +1664,7 @@
1664
1664
  {
1665
1665
  "name": "Tab",
1666
1666
  "category": "Navigation",
1667
- "description": "Tabs Tabbed interface with styled tabs and panels. @param variant - \"default\" for gray styling, \"accent\" for brand color styling",
1667
+ "description": "Tabs Tabbed interface with styled tabs and panels. @param variant - \"default\" for action-default styling, \"brand\" for action-brand styling",
1668
1668
  "importRoot": "@texturehq/edges",
1669
1669
  "importPath": "@texturehq/edges/components/Tab",
1670
1670
  "props": [],
@@ -1709,7 +1709,7 @@
1709
1709
  {
1710
1710
  "name": "Tabs",
1711
1711
  "category": "Navigation",
1712
- "description": "Tabs Tabbed interface with styled tabs and panels. @param variant - \"default\" for gray styling, \"accent\" for brand color styling",
1712
+ "description": "Tabs Tabbed interface with styled tabs and panels. @param variant - \"default\" for action-default styling, \"brand\" for action-brand styling",
1713
1713
  "importRoot": "@texturehq/edges",
1714
1714
  "importPath": "@texturehq/edges/components/Tabs",
1715
1715
  "props": [],
@@ -1837,7 +1837,7 @@
1837
1837
  },
1838
1838
  {
1839
1839
  "name": "chipVariant",
1840
- "type": "\"default\" | \"primary\" | \"secondary\""
1840
+ "type": "\"default\" | \"brand\" | \"secondary\""
1841
1841
  },
1842
1842
  {
1843
1843
  "name": "chipSize",
@@ -2011,7 +2011,7 @@
2011
2011
  "props": [
2012
2012
  {
2013
2013
  "name": "variant",
2014
- "type": "\"default\" | \"primary\""
2014
+ "type": "\"default\" | \"brand\""
2015
2015
  },
2016
2016
  {
2017
2017
  "name": "size",
@@ -2207,7 +2207,7 @@
2207
2207
  "CopyToClipboard"
2208
2208
  ],
2209
2209
  "Navigation": [
2210
- "Breadcrumb",
2210
+ "BreadcrumbItem",
2211
2211
  "Breadcrumbs",
2212
2212
  "SideNav",
2213
2213
  "Tab",
@@ -70,98 +70,8 @@
70
70
  --color-brand-light: #f7f7ff;
71
71
  --color-brand-dark: #363ccb;
72
72
  --color-brand-background: #f6f7ff;
73
- --color-skeleton-base: #e5e7eb;
74
- --color-skeleton-highlight: #f3f4f6;
75
- --color-skeleton-wave: rgba(255, 255, 255, 0.3);
76
73
  --color-neutral-white: #ffffff;
77
74
  --color-neutral-black: #000000;
78
- --color-viz-categorical-1: #a3eae4;
79
- --color-viz-categorical-2: #91a0ff;
80
- --color-viz-categorical-3: #ffd1a3;
81
- --color-viz-categorical-4: #ffabc8;
82
- --color-viz-categorical-5: #c1b8ff;
83
- --color-viz-categorical-6: #e0ffb8;
84
- --color-viz-sequential-viridis-1: #fafa37;
85
- --color-viz-sequential-viridis-2: #d6e654;
86
- --color-viz-sequential-viridis-3: #b2d373;
87
- --color-viz-sequential-viridis-4: #88be8c;
88
- --color-viz-sequential-viridis-5: #5fa2a4;
89
- --color-viz-sequential-viridis-6: #3d7eaa;
90
- --color-viz-sequential-viridis-7: #2a60b1;
91
- --color-viz-sequential-viridis-8: #1b3a99;
92
- --color-viz-sequential-viridis-9: #132353;
93
- --color-viz-sequential-viridis-10: #110f39;
94
- --color-viz-sequential-magma-1: #fcf5cd;
95
- --color-viz-sequential-magma-2: #f5db95;
96
- --color-viz-sequential-magma-3: #e9af7c;
97
- --color-viz-sequential-magma-4: #db7d70;
98
- --color-viz-sequential-magma-5: #b9577a;
99
- --color-viz-sequential-magma-6: #883482;
100
- --color-viz-sequential-magma-7: #6a1f78;
101
- --color-viz-sequential-magma-8: #4b1277;
102
- --color-viz-sequential-magma-9: #2d0b42;
103
- --color-viz-sequential-magma-10: #0b0511;
104
- --color-viz-sequential-rose-1: #fef3e7;
105
- --color-viz-sequential-rose-2: #f5c7e0;
106
- --color-viz-sequential-rose-3: #ec9bce;
107
- --color-viz-sequential-rose-4: #d86db0;
108
- --color-viz-sequential-rose-5: #be4a8b;
109
- --color-viz-sequential-rose-6: #9d2f76;
110
- --color-viz-sequential-rose-7: #78176c;
111
- --color-viz-sequential-rose-8: #56135c;
112
- --color-viz-sequential-rose-9: #371344;
113
- --color-viz-sequential-rose-10: #190b29;
114
- --color-viz-sequential-cerulean-1: #e2f7f2;
115
- --color-viz-sequential-cerulean-2: #b6e4e8;
116
- --color-viz-sequential-cerulean-3: #8bd3d7;
117
- --color-viz-sequential-cerulean-4: #60b2c7;
118
- --color-viz-sequential-cerulean-5: #3d91b6;
119
- --color-viz-sequential-cerulean-6: #22698e;
120
- --color-viz-sequential-cerulean-7: #0e486a;
121
- --color-viz-sequential-cerulean-8: #0a314d;
122
- --color-viz-sequential-cerulean-9: #081e33;
123
- --color-viz-sequential-cerulean-10: #030e1d;
124
- --color-viz-sequential-forest-1: #f4fad8;
125
- --color-viz-sequential-forest-2: #d6e6a5;
126
- --color-viz-sequential-forest-3: #b2cd73;
127
- --color-viz-sequential-forest-4: #88af52;
128
- --color-viz-sequential-forest-5: #5f8835;
129
- --color-viz-sequential-forest-6: #3d6426;
130
- --color-viz-sequential-forest-7: #2a461a;
131
- --color-viz-sequential-forest-8: #1b2e13;
132
- --color-viz-sequential-forest-9: #13200d;
133
- --color-viz-sequential-forest-10: #0b1305;
134
- --color-viz-diverging-orange-yellow-seafoam-1: #6b2c1a;
135
- --color-viz-diverging-orange-yellow-seafoam-2: #a24b1e;
136
- --color-viz-diverging-orange-yellow-seafoam-3: #cb7131;
137
- --color-viz-diverging-orange-yellow-seafoam-4: #e2a05d;
138
- --color-viz-diverging-orange-yellow-seafoam-5: #f3e1a3;
139
- --color-viz-diverging-orange-yellow-seafoam-6: #c1e4d2;
140
- --color-viz-diverging-orange-yellow-seafoam-7: #7eb8b1;
141
- --color-viz-diverging-orange-yellow-seafoam-8: #4c8c89;
142
- --color-viz-diverging-orange-yellow-seafoam-9: #2b6262;
143
- --color-viz-diverging-orange-yellow-seafoam-10: #1b3d3c;
144
- --color-viz-diverging-red-yellow-blue-1: #4e142d;
145
- --color-viz-diverging-red-yellow-blue-2: #8b2d4e;
146
- --color-viz-diverging-red-yellow-blue-3: #c15a4a;
147
- --color-viz-diverging-red-yellow-blue-4: #db8b6a;
148
- --color-viz-diverging-red-yellow-blue-5: #f3e1a3;
149
- --color-viz-diverging-red-yellow-blue-6: #bfd4c7;
150
- --color-viz-diverging-red-yellow-blue-7: #7c9eb9;
151
- --color-viz-diverging-red-yellow-blue-8: #4770a3;
152
- --color-viz-diverging-red-yellow-blue-9: #2e4d8c;
153
- --color-viz-diverging-red-yellow-blue-10: #18274e;
154
- --color-viz-diverging-red-blue-1: #4e142d;
155
- --color-viz-diverging-red-blue-2: #8b2d4e;
156
- --color-viz-diverging-red-blue-3: #c15a7a;
157
- --color-viz-diverging-red-blue-4: #db8b9e;
158
- --color-viz-diverging-red-blue-5: #f3e1f4;
159
- --color-viz-diverging-red-blue-6: #c7bfe2;
160
- --color-viz-diverging-red-blue-7: #9ea7ce;
161
- --color-viz-diverging-red-blue-8: #7080b5;
162
- --color-viz-diverging-red-blue-9: #4d5e99;
163
- --color-viz-diverging-red-blue-10: #2b3d70;
164
- --color-viz-default: #444ae1;
165
75
  --spacing-0: 0px;
166
76
  --spacing-1: 0.25rem;
167
77
  --spacing-2: 0.5rem;
@@ -239,12 +149,12 @@
239
149
  --font-letterspacing-wide: 0.025em;
240
150
  --font-letterspacing-wider: 0.05em;
241
151
  --font-letterspacing-widest: 0.1em;
242
- --action-primary-background: #444ae1;
243
- --action-primary-hover: #363ccb;
244
- --action-primary-text: #ffffff;
245
- --action-secondary-background: #111827;
246
- --action-secondary-hover: #374151;
247
- --action-secondary-text: #ffffff;
152
+ --action-brand-background: #444ae1;
153
+ --action-brand-hover: #363ccb;
154
+ --action-brand-text: #ffffff;
155
+ --action-default-background: #111827;
156
+ --action-default-hover: #374151;
157
+ --action-default-text: #ffffff;
248
158
  --action-destructive-background: oklch(0.505 0.213 27.518);
249
159
  --action-destructive-hover: oklch(0.444 0.177 26.899);
250
160
  --action-destructive-text: #ffffff;
@@ -269,6 +179,9 @@
269
179
  --color-map-streets-border: #000000;
270
180
  --color-map-satellite-border: #ffffff;
271
181
  --color-map-neutral-border: #000000;
182
+ --skeleton-base: #e5e7eb;
183
+ --skeleton-highlight: #f3f4f6;
184
+ --skeleton-wave: rgba(255, 255, 255, 0.5);
272
185
  --color-background-body: #151a30;
273
186
  --color-background-surface: #1a2038;
274
187
  --color-background-muted: #374151;
@@ -301,13 +214,12 @@
301
214
  --color-feedback-info-text: #60a5fa;
302
215
  --color-feedback-info-background: #1e3a8a;
303
216
  --color-feedback-info-border: #2563eb;
304
- --color-action-primary: #7a8ee1;
305
- --color-action-primary-hover: #6a6fcc;
306
- --color-action-primary-text: #ffffff;
307
- --color-action-primary-light: rgba(122, 142, 225, 0.15);
308
- --color-action-secondary: #e5e7eb;
309
- --color-action-secondary-hover: #f3f4f6;
310
- --color-action-secondary-text: #111827;
217
+ --color-action-brand: #7a8ee1;
218
+ --color-action-brand-hover: #6a6fcc;
219
+ --color-action-brand-text: #ffffff;
220
+ --color-action-default: #374151;
221
+ --color-action-default-hover: #4b5563;
222
+ --color-action-default-text: #ffffff;
311
223
  --color-state-charging: #581c87;
312
224
  --color-state-charging-border: #a855f7;
313
225
  --color-state-charging-text: #e9d5ff;
@@ -347,4 +259,94 @@
347
259
  --color-map-streets-border: #ffffff;
348
260
  --color-map-satellite-border: #ffffff;
349
261
  --color-map-neutral-border: #ffffff;
262
+ --color-viz-categorical-1: #7dd3c0;
263
+ --color-viz-categorical-2: #a8b4ff;
264
+ --color-viz-categorical-3: #ffd67a;
265
+ --color-viz-categorical-4: #ffb3d9;
266
+ --color-viz-categorical-5: #d4c4ff;
267
+ --color-viz-categorical-6: #c8ff8e;
268
+ --color-viz-sequential-viridis-1: #fde724;
269
+ --color-viz-sequential-viridis-2: #b5de2b;
270
+ --color-viz-sequential-viridis-3: #6ece58;
271
+ --color-viz-sequential-viridis-4: #35b779;
272
+ --color-viz-sequential-viridis-5: #1f9e89;
273
+ --color-viz-sequential-viridis-6: #26828e;
274
+ --color-viz-sequential-viridis-7: #31688e;
275
+ --color-viz-sequential-viridis-8: #3e4a89;
276
+ --color-viz-sequential-viridis-9: #482878;
277
+ --color-viz-sequential-viridis-10: #440154;
278
+ --color-viz-sequential-magma-1: #fcfdbf;
279
+ --color-viz-sequential-magma-2: #feca8d;
280
+ --color-viz-sequential-magma-3: #fd9668;
281
+ --color-viz-sequential-magma-4: #f1605d;
282
+ --color-viz-sequential-magma-5: #cd4071;
283
+ --color-viz-sequential-magma-6: #9e2f7f;
284
+ --color-viz-sequential-magma-7: #721f81;
285
+ --color-viz-sequential-magma-8: #51127c;
286
+ --color-viz-sequential-magma-9: #2c115f;
287
+ --color-viz-sequential-magma-10: #0c0927;
288
+ --color-viz-sequential-rose-1: #fff5ee;
289
+ --color-viz-sequential-rose-2: #ffc9e8;
290
+ --color-viz-sequential-rose-3: #ff95d5;
291
+ --color-viz-sequential-rose-4: #eb5fb7;
292
+ --color-viz-sequential-rose-5: #d13896;
293
+ --color-viz-sequential-rose-6: #ac2681;
294
+ --color-viz-sequential-rose-7: #841f78;
295
+ --color-viz-sequential-rose-8: #631d67;
296
+ --color-viz-sequential-rose-9: #3f1a4e;
297
+ --color-viz-sequential-rose-10: #1e0f2e;
298
+ --color-viz-sequential-cerulean-1: #e8fafd;
299
+ --color-viz-sequential-cerulean-2: #b3e5f0;
300
+ --color-viz-sequential-cerulean-3: #7fd4e8;
301
+ --color-viz-sequential-cerulean-4: #4db8d8;
302
+ --color-viz-sequential-cerulean-5: #2e9dc6;
303
+ --color-viz-sequential-cerulean-6: #1a7ba3;
304
+ --color-viz-sequential-cerulean-7: #0d5b7e;
305
+ --color-viz-sequential-cerulean-8: #0a4263;
306
+ --color-viz-sequential-cerulean-9: #072d47;
307
+ --color-viz-sequential-cerulean-10: #041a2b;
308
+ --color-viz-sequential-forest-1: #f7fcd4;
309
+ --color-viz-sequential-forest-2: #d5ed99;
310
+ --color-viz-sequential-forest-3: #afd66f;
311
+ --color-viz-sequential-forest-4: #84ba4d;
312
+ --color-viz-sequential-forest-5: #5a9b30;
313
+ --color-viz-sequential-forest-6: #3a7a1e;
314
+ --color-viz-sequential-forest-7: #285714;
315
+ --color-viz-sequential-forest-8: #1a3c0d;
316
+ --color-viz-sequential-forest-9: #0f2808;
317
+ --color-viz-sequential-forest-10: #071403;
318
+ --color-viz-diverging-orange-yellow-seafoam-1: #883a1f;
319
+ --color-viz-diverging-orange-yellow-seafoam-2: #c25f27;
320
+ --color-viz-diverging-orange-yellow-seafoam-3: #e8843d;
321
+ --color-viz-diverging-orange-yellow-seafoam-4: #f5b774;
322
+ --color-viz-diverging-orange-yellow-seafoam-5: #fef4c7;
323
+ --color-viz-diverging-orange-yellow-seafoam-6: #b8e8d5;
324
+ --color-viz-diverging-orange-yellow-seafoam-7: #73d4c5;
325
+ --color-viz-diverging-orange-yellow-seafoam-8: #3db3a8;
326
+ --color-viz-diverging-orange-yellow-seafoam-9: #1f8d82;
327
+ --color-viz-diverging-orange-yellow-seafoam-10: #0d5d56;
328
+ --color-viz-diverging-red-yellow-blue-1: #6b1e3c;
329
+ --color-viz-diverging-red-yellow-blue-2: #a83b5e;
330
+ --color-viz-diverging-red-yellow-blue-3: #d96e68;
331
+ --color-viz-diverging-red-yellow-blue-4: #f0a487;
332
+ --color-viz-diverging-red-yellow-blue-5: #fef4c7;
333
+ --color-viz-diverging-red-yellow-blue-6: #b8ddd3;
334
+ --color-viz-diverging-red-yellow-blue-7: #7bb8cf;
335
+ --color-viz-diverging-red-yellow-blue-8: #4a8ec4;
336
+ --color-viz-diverging-red-yellow-blue-9: #2d6bb0;
337
+ --color-viz-diverging-red-yellow-blue-10: #1a4680;
338
+ --color-viz-diverging-red-blue-1: #6b1e3c;
339
+ --color-viz-diverging-red-blue-2: #a83b5e;
340
+ --color-viz-diverging-red-blue-3: #d9668f;
341
+ --color-viz-diverging-red-blue-4: #f09db8;
342
+ --color-viz-diverging-red-blue-5: #f8e5f9;
343
+ --color-viz-diverging-red-blue-6: #d4c9ed;
344
+ --color-viz-diverging-red-blue-7: #b0b8df;
345
+ --color-viz-diverging-red-blue-8: #8494ca;
346
+ --color-viz-diverging-red-blue-9: #5d6fb0;
347
+ --color-viz-diverging-red-blue-10: #374f88;
348
+ --color-viz-default: #444ae1;
349
+ --theme-skeleton-base: #1f2937;
350
+ --theme-skeleton-highlight: #374151;
351
+ --theme-skeleton-wave: rgba(255, 255, 255, 0.1);
350
352
  }
@@ -70,98 +70,8 @@
70
70
  --color-brand-light: #f7f7ff;
71
71
  --color-brand-dark: #363ccb;
72
72
  --color-brand-background: #f6f7ff;
73
- --color-skeleton-base: #e5e7eb;
74
- --color-skeleton-highlight: #f3f4f6;
75
- --color-skeleton-wave: rgba(255, 255, 255, 0.3);
76
73
  --color-neutral-white: #ffffff;
77
74
  --color-neutral-black: #000000;
78
- --color-viz-categorical-1: #a3eae4;
79
- --color-viz-categorical-2: #91a0ff;
80
- --color-viz-categorical-3: #ffd1a3;
81
- --color-viz-categorical-4: #ffabc8;
82
- --color-viz-categorical-5: #c1b8ff;
83
- --color-viz-categorical-6: #e0ffb8;
84
- --color-viz-sequential-viridis-1: #fafa37;
85
- --color-viz-sequential-viridis-2: #d6e654;
86
- --color-viz-sequential-viridis-3: #b2d373;
87
- --color-viz-sequential-viridis-4: #88be8c;
88
- --color-viz-sequential-viridis-5: #5fa2a4;
89
- --color-viz-sequential-viridis-6: #3d7eaa;
90
- --color-viz-sequential-viridis-7: #2a60b1;
91
- --color-viz-sequential-viridis-8: #1b3a99;
92
- --color-viz-sequential-viridis-9: #132353;
93
- --color-viz-sequential-viridis-10: #110f39;
94
- --color-viz-sequential-magma-1: #fcf5cd;
95
- --color-viz-sequential-magma-2: #f5db95;
96
- --color-viz-sequential-magma-3: #e9af7c;
97
- --color-viz-sequential-magma-4: #db7d70;
98
- --color-viz-sequential-magma-5: #b9577a;
99
- --color-viz-sequential-magma-6: #883482;
100
- --color-viz-sequential-magma-7: #6a1f78;
101
- --color-viz-sequential-magma-8: #4b1277;
102
- --color-viz-sequential-magma-9: #2d0b42;
103
- --color-viz-sequential-magma-10: #0b0511;
104
- --color-viz-sequential-rose-1: #fef3e7;
105
- --color-viz-sequential-rose-2: #f5c7e0;
106
- --color-viz-sequential-rose-3: #ec9bce;
107
- --color-viz-sequential-rose-4: #d86db0;
108
- --color-viz-sequential-rose-5: #be4a8b;
109
- --color-viz-sequential-rose-6: #9d2f76;
110
- --color-viz-sequential-rose-7: #78176c;
111
- --color-viz-sequential-rose-8: #56135c;
112
- --color-viz-sequential-rose-9: #371344;
113
- --color-viz-sequential-rose-10: #190b29;
114
- --color-viz-sequential-cerulean-1: #e2f7f2;
115
- --color-viz-sequential-cerulean-2: #b6e4e8;
116
- --color-viz-sequential-cerulean-3: #8bd3d7;
117
- --color-viz-sequential-cerulean-4: #60b2c7;
118
- --color-viz-sequential-cerulean-5: #3d91b6;
119
- --color-viz-sequential-cerulean-6: #22698e;
120
- --color-viz-sequential-cerulean-7: #0e486a;
121
- --color-viz-sequential-cerulean-8: #0a314d;
122
- --color-viz-sequential-cerulean-9: #081e33;
123
- --color-viz-sequential-cerulean-10: #030e1d;
124
- --color-viz-sequential-forest-1: #f4fad8;
125
- --color-viz-sequential-forest-2: #d6e6a5;
126
- --color-viz-sequential-forest-3: #b2cd73;
127
- --color-viz-sequential-forest-4: #88af52;
128
- --color-viz-sequential-forest-5: #5f8835;
129
- --color-viz-sequential-forest-6: #3d6426;
130
- --color-viz-sequential-forest-7: #2a461a;
131
- --color-viz-sequential-forest-8: #1b2e13;
132
- --color-viz-sequential-forest-9: #13200d;
133
- --color-viz-sequential-forest-10: #0b1305;
134
- --color-viz-diverging-orange-yellow-seafoam-1: #6b2c1a;
135
- --color-viz-diverging-orange-yellow-seafoam-2: #a24b1e;
136
- --color-viz-diverging-orange-yellow-seafoam-3: #cb7131;
137
- --color-viz-diverging-orange-yellow-seafoam-4: #e2a05d;
138
- --color-viz-diverging-orange-yellow-seafoam-5: #f3e1a3;
139
- --color-viz-diverging-orange-yellow-seafoam-6: #c1e4d2;
140
- --color-viz-diverging-orange-yellow-seafoam-7: #7eb8b1;
141
- --color-viz-diverging-orange-yellow-seafoam-8: #4c8c89;
142
- --color-viz-diverging-orange-yellow-seafoam-9: #2b6262;
143
- --color-viz-diverging-orange-yellow-seafoam-10: #1b3d3c;
144
- --color-viz-diverging-red-yellow-blue-1: #4e142d;
145
- --color-viz-diverging-red-yellow-blue-2: #8b2d4e;
146
- --color-viz-diverging-red-yellow-blue-3: #c15a4a;
147
- --color-viz-diverging-red-yellow-blue-4: #db8b6a;
148
- --color-viz-diverging-red-yellow-blue-5: #f3e1a3;
149
- --color-viz-diverging-red-yellow-blue-6: #bfd4c7;
150
- --color-viz-diverging-red-yellow-blue-7: #7c9eb9;
151
- --color-viz-diverging-red-yellow-blue-8: #4770a3;
152
- --color-viz-diverging-red-yellow-blue-9: #2e4d8c;
153
- --color-viz-diverging-red-yellow-blue-10: #18274e;
154
- --color-viz-diverging-red-blue-1: #4e142d;
155
- --color-viz-diverging-red-blue-2: #8b2d4e;
156
- --color-viz-diverging-red-blue-3: #c15a7a;
157
- --color-viz-diverging-red-blue-4: #db8b9e;
158
- --color-viz-diverging-red-blue-5: #f3e1f4;
159
- --color-viz-diverging-red-blue-6: #c7bfe2;
160
- --color-viz-diverging-red-blue-7: #9ea7ce;
161
- --color-viz-diverging-red-blue-8: #7080b5;
162
- --color-viz-diverging-red-blue-9: #4d5e99;
163
- --color-viz-diverging-red-blue-10: #2b3d70;
164
- --color-viz-default: #444ae1;
165
75
  --spacing-0: 0px;
166
76
  --spacing-1: 0.25rem;
167
77
  --spacing-2: 0.5rem;
@@ -239,12 +149,12 @@
239
149
  --font-letterspacing-wide: 0.025em;
240
150
  --font-letterspacing-wider: 0.05em;
241
151
  --font-letterspacing-widest: 0.1em;
242
- --action-primary-background: #444ae1;
243
- --action-primary-hover: #363ccb;
244
- --action-primary-text: #ffffff;
245
- --action-secondary-background: #111827;
246
- --action-secondary-hover: #374151;
247
- --action-secondary-text: #ffffff;
152
+ --action-brand-background: #444ae1;
153
+ --action-brand-hover: #363ccb;
154
+ --action-brand-text: #ffffff;
155
+ --action-default-background: #111827;
156
+ --action-default-hover: #374151;
157
+ --action-default-text: #ffffff;
248
158
  --action-destructive-background: oklch(0.505 0.213 27.518);
249
159
  --action-destructive-hover: oklch(0.444 0.177 26.899);
250
160
  --action-destructive-text: #ffffff;
@@ -269,6 +179,9 @@
269
179
  --color-map-streets-border: #000000;
270
180
  --color-map-satellite-border: #ffffff;
271
181
  --color-map-neutral-border: #000000;
182
+ --skeleton-base: #e5e7eb;
183
+ --skeleton-highlight: #f3f4f6;
184
+ --skeleton-wave: rgba(255, 255, 255, 0.5);
272
185
  --color-background-body: #ffffff;
273
186
  --color-background-surface: #ffffff;
274
187
  --color-background-muted: #f3f4f6;
@@ -301,13 +214,12 @@
301
214
  --color-feedback-info-text: #2563eb;
302
215
  --color-feedback-info-background: #dbeafe;
303
216
  --color-feedback-info-border: #93c5fd;
304
- --color-action-primary: #444ae1;
305
- --color-action-primary-hover: #383ccb;
306
- --color-action-primary-text: #ffffff;
307
- --color-action-primary-light: rgba(68, 74, 225, 0.1);
308
- --color-action-secondary: #333333;
309
- --color-action-secondary-hover: #4b5563;
310
- --color-action-secondary-text: #ffffff;
217
+ --color-action-brand: #444ae1;
218
+ --color-action-brand-hover: #383ccb;
219
+ --color-action-brand-text: #ffffff;
220
+ --color-action-default: #333333;
221
+ --color-action-default-hover: #4b5563;
222
+ --color-action-default-text: #ffffff;
311
223
  --color-state-charging: #f3e8ff;
312
224
  --color-state-charging-border: #c084fc;
313
225
  --color-state-charging-text: #6b21a8;
@@ -344,4 +256,94 @@
344
256
  --color-state-exporting: #f8f8f8;
345
257
  --color-state-exporting-border: #d1d5db;
346
258
  --color-state-exporting-text: #000000;
259
+ --color-viz-categorical-1: #a3eae4;
260
+ --color-viz-categorical-2: #91a0ff;
261
+ --color-viz-categorical-3: #ffd1a3;
262
+ --color-viz-categorical-4: #ffabc8;
263
+ --color-viz-categorical-5: #c1b8ff;
264
+ --color-viz-categorical-6: #e0ffb8;
265
+ --color-viz-sequential-viridis-1: #fafa37;
266
+ --color-viz-sequential-viridis-2: #d6e654;
267
+ --color-viz-sequential-viridis-3: #b2d373;
268
+ --color-viz-sequential-viridis-4: #88be8c;
269
+ --color-viz-sequential-viridis-5: #5fa2a4;
270
+ --color-viz-sequential-viridis-6: #3d7eaa;
271
+ --color-viz-sequential-viridis-7: #2a60b1;
272
+ --color-viz-sequential-viridis-8: #1b3a99;
273
+ --color-viz-sequential-viridis-9: #132353;
274
+ --color-viz-sequential-viridis-10: #110f39;
275
+ --color-viz-sequential-magma-1: #fcf5cd;
276
+ --color-viz-sequential-magma-2: #f5db95;
277
+ --color-viz-sequential-magma-3: #e9af7c;
278
+ --color-viz-sequential-magma-4: #db7d70;
279
+ --color-viz-sequential-magma-5: #b9577a;
280
+ --color-viz-sequential-magma-6: #883482;
281
+ --color-viz-sequential-magma-7: #6a1f78;
282
+ --color-viz-sequential-magma-8: #4b1277;
283
+ --color-viz-sequential-magma-9: #2d0b42;
284
+ --color-viz-sequential-magma-10: #0b0511;
285
+ --color-viz-sequential-rose-1: #fef3e7;
286
+ --color-viz-sequential-rose-2: #f5c7e0;
287
+ --color-viz-sequential-rose-3: #ec9bce;
288
+ --color-viz-sequential-rose-4: #d86db0;
289
+ --color-viz-sequential-rose-5: #be4a8b;
290
+ --color-viz-sequential-rose-6: #9d2f76;
291
+ --color-viz-sequential-rose-7: #78176c;
292
+ --color-viz-sequential-rose-8: #56135c;
293
+ --color-viz-sequential-rose-9: #371344;
294
+ --color-viz-sequential-rose-10: #190b29;
295
+ --color-viz-sequential-cerulean-1: #e2f7f2;
296
+ --color-viz-sequential-cerulean-2: #b6e4e8;
297
+ --color-viz-sequential-cerulean-3: #8bd3d7;
298
+ --color-viz-sequential-cerulean-4: #60b2c7;
299
+ --color-viz-sequential-cerulean-5: #3d91b6;
300
+ --color-viz-sequential-cerulean-6: #22698e;
301
+ --color-viz-sequential-cerulean-7: #0e486a;
302
+ --color-viz-sequential-cerulean-8: #0a314d;
303
+ --color-viz-sequential-cerulean-9: #081e33;
304
+ --color-viz-sequential-cerulean-10: #030e1d;
305
+ --color-viz-sequential-forest-1: #f4fad8;
306
+ --color-viz-sequential-forest-2: #d6e6a5;
307
+ --color-viz-sequential-forest-3: #b2cd73;
308
+ --color-viz-sequential-forest-4: #88af52;
309
+ --color-viz-sequential-forest-5: #5f8835;
310
+ --color-viz-sequential-forest-6: #3d6426;
311
+ --color-viz-sequential-forest-7: #2a461a;
312
+ --color-viz-sequential-forest-8: #1b2e13;
313
+ --color-viz-sequential-forest-9: #13200d;
314
+ --color-viz-sequential-forest-10: #0b1305;
315
+ --color-viz-diverging-orange-yellow-seafoam-1: #6b2c1a;
316
+ --color-viz-diverging-orange-yellow-seafoam-2: #a24b1e;
317
+ --color-viz-diverging-orange-yellow-seafoam-3: #cb7131;
318
+ --color-viz-diverging-orange-yellow-seafoam-4: #e2a05d;
319
+ --color-viz-diverging-orange-yellow-seafoam-5: #f3e1a3;
320
+ --color-viz-diverging-orange-yellow-seafoam-6: #c1e4d2;
321
+ --color-viz-diverging-orange-yellow-seafoam-7: #7eb8b1;
322
+ --color-viz-diverging-orange-yellow-seafoam-8: #4c8c89;
323
+ --color-viz-diverging-orange-yellow-seafoam-9: #2b6262;
324
+ --color-viz-diverging-orange-yellow-seafoam-10: #1b3d3c;
325
+ --color-viz-diverging-red-yellow-blue-1: #4e142d;
326
+ --color-viz-diverging-red-yellow-blue-2: #8b2d4e;
327
+ --color-viz-diverging-red-yellow-blue-3: #c15a4a;
328
+ --color-viz-diverging-red-yellow-blue-4: #db8b6a;
329
+ --color-viz-diverging-red-yellow-blue-5: #f3e1a3;
330
+ --color-viz-diverging-red-yellow-blue-6: #bfd4c7;
331
+ --color-viz-diverging-red-yellow-blue-7: #7c9eb9;
332
+ --color-viz-diverging-red-yellow-blue-8: #4770a3;
333
+ --color-viz-diverging-red-yellow-blue-9: #2e4d8c;
334
+ --color-viz-diverging-red-yellow-blue-10: #18274e;
335
+ --color-viz-diverging-red-blue-1: #4e142d;
336
+ --color-viz-diverging-red-blue-2: #8b2d4e;
337
+ --color-viz-diverging-red-blue-3: #c15a7a;
338
+ --color-viz-diverging-red-blue-4: #db8b9e;
339
+ --color-viz-diverging-red-blue-5: #f3e1f4;
340
+ --color-viz-diverging-red-blue-6: #c7bfe2;
341
+ --color-viz-diverging-red-blue-7: #9ea7ce;
342
+ --color-viz-diverging-red-blue-8: #7080b5;
343
+ --color-viz-diverging-red-blue-9: #4d5e99;
344
+ --color-viz-diverging-red-blue-10: #2b3d70;
345
+ --color-viz-default: #444ae1;
346
+ --theme-skeleton-base: #e5e7eb;
347
+ --theme-skeleton-highlight: #f3f4f6;
348
+ --theme-skeleton-wave: rgba(255, 255, 255, 0.5);
347
349
  }