@helixui/tokens 3.0.0-next.65 → 3.0.0-next.67
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.
- package/dist/index.d.ts +33 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/tokens.css +15 -0
- package/dist/tokens.json +24 -0
- package/package.json +1 -1
- package/src/tokens.json +24 -0
package/dist/index.d.ts
CHANGED
|
@@ -292,12 +292,20 @@ export declare const tokens: {
|
|
|
292
292
|
primary: {
|
|
293
293
|
value: string;
|
|
294
294
|
};
|
|
295
|
+
strong: {
|
|
296
|
+
value: string;
|
|
297
|
+
description: string;
|
|
298
|
+
};
|
|
295
299
|
secondary: {
|
|
296
300
|
value: string;
|
|
297
301
|
};
|
|
298
302
|
muted: {
|
|
299
303
|
value: string;
|
|
300
304
|
};
|
|
305
|
+
placeholder: {
|
|
306
|
+
value: string;
|
|
307
|
+
description: string;
|
|
308
|
+
};
|
|
301
309
|
disabled: {
|
|
302
310
|
value: string;
|
|
303
311
|
};
|
|
@@ -353,6 +361,10 @@ export declare const tokens: {
|
|
|
353
361
|
sunken: {
|
|
354
362
|
value: string;
|
|
355
363
|
};
|
|
364
|
+
inverse: {
|
|
365
|
+
value: string;
|
|
366
|
+
description: string;
|
|
367
|
+
};
|
|
356
368
|
overlay: {
|
|
357
369
|
value: string;
|
|
358
370
|
};
|
|
@@ -1084,12 +1096,18 @@ export declare const tokens: {
|
|
|
1084
1096
|
primary: {
|
|
1085
1097
|
value: string;
|
|
1086
1098
|
};
|
|
1099
|
+
strong: {
|
|
1100
|
+
value: string;
|
|
1101
|
+
};
|
|
1087
1102
|
secondary: {
|
|
1088
1103
|
value: string;
|
|
1089
1104
|
};
|
|
1090
1105
|
muted: {
|
|
1091
1106
|
value: string;
|
|
1092
1107
|
};
|
|
1108
|
+
placeholder: {
|
|
1109
|
+
value: string;
|
|
1110
|
+
};
|
|
1093
1111
|
disabled: {
|
|
1094
1112
|
value: string;
|
|
1095
1113
|
};
|
|
@@ -1119,6 +1137,9 @@ export declare const tokens: {
|
|
|
1119
1137
|
sunken: {
|
|
1120
1138
|
value: string;
|
|
1121
1139
|
};
|
|
1140
|
+
inverse: {
|
|
1141
|
+
value: string;
|
|
1142
|
+
};
|
|
1122
1143
|
overlay: {
|
|
1123
1144
|
value: string;
|
|
1124
1145
|
};
|
|
@@ -1254,6 +1275,10 @@ export declare const tokens: {
|
|
|
1254
1275
|
value: string;
|
|
1255
1276
|
description: string;
|
|
1256
1277
|
};
|
|
1278
|
+
strong: {
|
|
1279
|
+
value: string;
|
|
1280
|
+
description: string;
|
|
1281
|
+
};
|
|
1257
1282
|
secondary: {
|
|
1258
1283
|
value: string;
|
|
1259
1284
|
description: string;
|
|
@@ -1262,6 +1287,10 @@ export declare const tokens: {
|
|
|
1262
1287
|
value: string;
|
|
1263
1288
|
description: string;
|
|
1264
1289
|
};
|
|
1290
|
+
placeholder: {
|
|
1291
|
+
value: string;
|
|
1292
|
+
description: string;
|
|
1293
|
+
};
|
|
1265
1294
|
disabled: {
|
|
1266
1295
|
value: string;
|
|
1267
1296
|
description: string;
|
|
@@ -1319,6 +1348,10 @@ export declare const tokens: {
|
|
|
1319
1348
|
sunken: {
|
|
1320
1349
|
value: string;
|
|
1321
1350
|
};
|
|
1351
|
+
inverse: {
|
|
1352
|
+
value: string;
|
|
1353
|
+
description: string;
|
|
1354
|
+
};
|
|
1322
1355
|
overlay: {
|
|
1323
1356
|
value: string;
|
|
1324
1357
|
};
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,UAAU,EAAE,MAAM,YAAY,CAAC;AAE9D,YAAY,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAG9D,OAAO,EACL,kBAAkB,EAClB,uBAAuB,EACvB,wBAAwB,GACzB,MAAM,qBAAqB,CAAC;AAC7B,YAAY,EAAE,aAAa,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AA+C7E,yCAAyC;AACzC,eAAO,MAAM,MAAM
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/tokens.css
CHANGED
|
@@ -89,8 +89,10 @@
|
|
|
89
89
|
--hx-color-info-900: #0A3553;
|
|
90
90
|
--hx-color-info-950: #082F49;
|
|
91
91
|
--hx-color-text-primary: var(--hx-color-neutral-900);
|
|
92
|
+
--hx-color-text-strong: var(--hx-color-neutral-800);
|
|
92
93
|
--hx-color-text-secondary: var(--hx-color-neutral-600);
|
|
93
94
|
--hx-color-text-muted: var(--hx-color-neutral-500);
|
|
95
|
+
--hx-color-text-placeholder: var(--hx-color-neutral-500);
|
|
94
96
|
--hx-color-text-disabled: var(--hx-color-neutral-400);
|
|
95
97
|
--hx-color-text-inverse: var(--hx-color-neutral-0);
|
|
96
98
|
--hx-color-text-on-primary: var(--hx-color-neutral-0);
|
|
@@ -108,6 +110,7 @@
|
|
|
108
110
|
--hx-color-surface-default: var(--hx-color-neutral-0);
|
|
109
111
|
--hx-color-surface-raised: var(--hx-color-neutral-50);
|
|
110
112
|
--hx-color-surface-sunken: var(--hx-color-neutral-100);
|
|
113
|
+
--hx-color-surface-inverse: var(--hx-color-neutral-900);
|
|
111
114
|
--hx-color-surface-overlay: rgba(0, 0, 0, 0.75);
|
|
112
115
|
--hx-color-border-default: var(--hx-color-neutral-200);
|
|
113
116
|
--hx-color-border-subtle: var(--hx-color-neutral-100);
|
|
@@ -326,8 +329,10 @@
|
|
|
326
329
|
--hx-color-error-text: var(--hx-color-error-400);
|
|
327
330
|
--hx-color-success-text: var(--hx-color-success-400);
|
|
328
331
|
--hx-color-text-primary: var(--hx-color-neutral-100);
|
|
332
|
+
--hx-color-text-strong: var(--hx-color-neutral-50);
|
|
329
333
|
--hx-color-text-secondary: var(--hx-color-neutral-300);
|
|
330
334
|
--hx-color-text-muted: var(--hx-color-neutral-400);
|
|
335
|
+
--hx-color-text-placeholder: var(--hx-color-neutral-500);
|
|
331
336
|
--hx-color-text-disabled: var(--hx-color-neutral-600);
|
|
332
337
|
--hx-color-text-inverse: var(--hx-color-neutral-900);
|
|
333
338
|
--hx-color-text-link: var(--hx-color-primary-400);
|
|
@@ -337,6 +342,7 @@
|
|
|
337
342
|
--hx-color-surface-default: var(--hx-color-neutral-900);
|
|
338
343
|
--hx-color-surface-raised: var(--hx-color-neutral-800);
|
|
339
344
|
--hx-color-surface-sunken: var(--hx-color-neutral-950);
|
|
345
|
+
--hx-color-surface-inverse: var(--hx-color-neutral-100);
|
|
340
346
|
--hx-color-surface-overlay: rgba(0, 0, 0, 0.85);
|
|
341
347
|
--hx-color-border-default: var(--hx-color-neutral-700);
|
|
342
348
|
--hx-color-border-subtle: var(--hx-color-neutral-800);
|
|
@@ -359,8 +365,10 @@
|
|
|
359
365
|
--hx-color-error-text: var(--hx-color-error-400);
|
|
360
366
|
--hx-color-success-text: var(--hx-color-success-400);
|
|
361
367
|
--hx-color-text-primary: var(--hx-color-neutral-100);
|
|
368
|
+
--hx-color-text-strong: var(--hx-color-neutral-50);
|
|
362
369
|
--hx-color-text-secondary: var(--hx-color-neutral-300);
|
|
363
370
|
--hx-color-text-muted: var(--hx-color-neutral-400);
|
|
371
|
+
--hx-color-text-placeholder: var(--hx-color-neutral-500);
|
|
364
372
|
--hx-color-text-disabled: var(--hx-color-neutral-600);
|
|
365
373
|
--hx-color-text-inverse: var(--hx-color-neutral-900);
|
|
366
374
|
--hx-color-text-link: var(--hx-color-primary-400);
|
|
@@ -370,6 +378,7 @@
|
|
|
370
378
|
--hx-color-surface-default: var(--hx-color-neutral-900);
|
|
371
379
|
--hx-color-surface-raised: var(--hx-color-neutral-800);
|
|
372
380
|
--hx-color-surface-sunken: var(--hx-color-neutral-950);
|
|
381
|
+
--hx-color-surface-inverse: var(--hx-color-neutral-100);
|
|
373
382
|
--hx-color-surface-overlay: rgba(0, 0, 0, 0.85);
|
|
374
383
|
--hx-color-border-default: var(--hx-color-neutral-700);
|
|
375
384
|
--hx-color-border-subtle: var(--hx-color-neutral-800);
|
|
@@ -405,8 +414,10 @@
|
|
|
405
414
|
--hx-color-info-500: #38BDF8;
|
|
406
415
|
--hx-color-info-600: #7DD3FC;
|
|
407
416
|
--hx-color-text-primary: #FFFFFF;
|
|
417
|
+
--hx-color-text-strong: #FFFFFF;
|
|
408
418
|
--hx-color-text-secondary: #FFFFFF;
|
|
409
419
|
--hx-color-text-muted: #E0E0E0;
|
|
420
|
+
--hx-color-text-placeholder: #B0B0B0;
|
|
410
421
|
--hx-color-text-disabled: #767676;
|
|
411
422
|
--hx-color-text-inverse: #000000;
|
|
412
423
|
--hx-color-text-on-primary: #000000;
|
|
@@ -422,6 +433,7 @@
|
|
|
422
433
|
--hx-color-surface-default: #000000;
|
|
423
434
|
--hx-color-surface-raised: #1A1A1A;
|
|
424
435
|
--hx-color-surface-sunken: #000000;
|
|
436
|
+
--hx-color-surface-inverse: #FFFFFF;
|
|
425
437
|
--hx-color-surface-overlay: rgba(0, 0, 0, 0.95);
|
|
426
438
|
--hx-color-border-default: #FFFFFF;
|
|
427
439
|
--hx-color-border-subtle: #C0C0C0;
|
|
@@ -467,8 +479,10 @@
|
|
|
467
479
|
--hx-color-info-500: #38BDF8;
|
|
468
480
|
--hx-color-info-600: #7DD3FC;
|
|
469
481
|
--hx-color-text-primary: #FFFFFF;
|
|
482
|
+
--hx-color-text-strong: #FFFFFF;
|
|
470
483
|
--hx-color-text-secondary: #FFFFFF;
|
|
471
484
|
--hx-color-text-muted: #E0E0E0;
|
|
485
|
+
--hx-color-text-placeholder: #B0B0B0;
|
|
472
486
|
--hx-color-text-disabled: #767676;
|
|
473
487
|
--hx-color-text-inverse: #000000;
|
|
474
488
|
--hx-color-text-on-primary: #000000;
|
|
@@ -484,6 +498,7 @@
|
|
|
484
498
|
--hx-color-surface-default: #000000;
|
|
485
499
|
--hx-color-surface-raised: #1A1A1A;
|
|
486
500
|
--hx-color-surface-sunken: #000000;
|
|
501
|
+
--hx-color-surface-inverse: #FFFFFF;
|
|
487
502
|
--hx-color-surface-overlay: rgba(0, 0, 0, 0.95);
|
|
488
503
|
--hx-color-border-default: #FFFFFF;
|
|
489
504
|
--hx-color-border-subtle: #C0C0C0;
|
package/dist/tokens.json
CHANGED
|
@@ -107,8 +107,16 @@
|
|
|
107
107
|
},
|
|
108
108
|
"text": {
|
|
109
109
|
"primary": { "value": "var(--hx-color-neutral-900)" },
|
|
110
|
+
"strong": {
|
|
111
|
+
"value": "var(--hx-color-neutral-800)",
|
|
112
|
+
"description": "Strong text for labels and headings. Sits between primary and secondary in weight."
|
|
113
|
+
},
|
|
110
114
|
"secondary": { "value": "var(--hx-color-neutral-600)" },
|
|
111
115
|
"muted": { "value": "var(--hx-color-neutral-500)" },
|
|
116
|
+
"placeholder": {
|
|
117
|
+
"value": "var(--hx-color-neutral-500)",
|
|
118
|
+
"description": "Placeholder text in form inputs. Distinct from muted so it can diverge per mode — placeholders must remain clearly non-value across themes."
|
|
119
|
+
},
|
|
112
120
|
"disabled": { "value": "var(--hx-color-neutral-400)" },
|
|
113
121
|
"inverse": { "value": "var(--hx-color-neutral-0)" },
|
|
114
122
|
"on-primary": { "value": "var(--hx-color-neutral-0)" },
|
|
@@ -134,6 +142,10 @@
|
|
|
134
142
|
"default": { "value": "var(--hx-color-neutral-0)" },
|
|
135
143
|
"raised": { "value": "var(--hx-color-neutral-50)" },
|
|
136
144
|
"sunken": { "value": "var(--hx-color-neutral-100)" },
|
|
145
|
+
"inverse": {
|
|
146
|
+
"value": "var(--hx-color-neutral-900)",
|
|
147
|
+
"description": "Inverse surface for dark-always components (tooltips, inverse nav). Flips to a light surface in dark mode; uses system Canvas in forced-colors."
|
|
148
|
+
},
|
|
137
149
|
"overlay": { "value": "rgba(0, 0, 0, 0.75)" }
|
|
138
150
|
},
|
|
139
151
|
"border": {
|
|
@@ -459,8 +471,10 @@
|
|
|
459
471
|
},
|
|
460
472
|
"text": {
|
|
461
473
|
"primary": { "value": "var(--hx-color-neutral-100)" },
|
|
474
|
+
"strong": { "value": "var(--hx-color-neutral-50)" },
|
|
462
475
|
"secondary": { "value": "var(--hx-color-neutral-300)" },
|
|
463
476
|
"muted": { "value": "var(--hx-color-neutral-400)" },
|
|
477
|
+
"placeholder": { "value": "var(--hx-color-neutral-500)" },
|
|
464
478
|
"disabled": { "value": "var(--hx-color-neutral-600)" },
|
|
465
479
|
"inverse": { "value": "var(--hx-color-neutral-900)" },
|
|
466
480
|
"link": { "value": "var(--hx-color-primary-400)" },
|
|
@@ -472,6 +486,7 @@
|
|
|
472
486
|
"default": { "value": "var(--hx-color-neutral-900)" },
|
|
473
487
|
"raised": { "value": "var(--hx-color-neutral-800)" },
|
|
474
488
|
"sunken": { "value": "var(--hx-color-neutral-950)" },
|
|
489
|
+
"inverse": { "value": "var(--hx-color-neutral-100)" },
|
|
475
490
|
"overlay": { "value": "rgba(0, 0, 0, 0.85)" }
|
|
476
491
|
},
|
|
477
492
|
"border": {
|
|
@@ -538,8 +553,13 @@
|
|
|
538
553
|
},
|
|
539
554
|
"text": {
|
|
540
555
|
"primary": { "value": "#FFFFFF", "description": "21:1 contrast on #000 — WCAG AAA" },
|
|
556
|
+
"strong": { "value": "#FFFFFF", "description": "21:1 contrast on #000 — WCAG AAA" },
|
|
541
557
|
"secondary": { "value": "#FFFFFF", "description": "21:1 contrast on #000" },
|
|
542
558
|
"muted": { "value": "#E0E0E0", "description": "~16:1 contrast on #000" },
|
|
559
|
+
"placeholder": {
|
|
560
|
+
"value": "#B0B0B0",
|
|
561
|
+
"description": "~9:1 contrast on #000 — clearly readable but distinct from entered text at 21:1"
|
|
562
|
+
},
|
|
543
563
|
"disabled": {
|
|
544
564
|
"value": "#767676",
|
|
545
565
|
"description": "4.5:1 contrast on #000 — WCAG AA minimum"
|
|
@@ -560,6 +580,10 @@
|
|
|
560
580
|
"default": { "value": "#000000" },
|
|
561
581
|
"raised": { "value": "#1A1A1A" },
|
|
562
582
|
"sunken": { "value": "#000000" },
|
|
583
|
+
"inverse": {
|
|
584
|
+
"value": "#FFFFFF",
|
|
585
|
+
"description": "Inverse of HC canvas — white surface for dark-always components in HC mode"
|
|
586
|
+
},
|
|
563
587
|
"overlay": { "value": "rgba(0, 0, 0, 0.95)" }
|
|
564
588
|
},
|
|
565
589
|
"border": {
|
package/package.json
CHANGED
package/src/tokens.json
CHANGED
|
@@ -107,8 +107,16 @@
|
|
|
107
107
|
},
|
|
108
108
|
"text": {
|
|
109
109
|
"primary": { "value": "var(--hx-color-neutral-900)" },
|
|
110
|
+
"strong": {
|
|
111
|
+
"value": "var(--hx-color-neutral-800)",
|
|
112
|
+
"description": "Strong text for labels and headings. Sits between primary and secondary in weight."
|
|
113
|
+
},
|
|
110
114
|
"secondary": { "value": "var(--hx-color-neutral-600)" },
|
|
111
115
|
"muted": { "value": "var(--hx-color-neutral-500)" },
|
|
116
|
+
"placeholder": {
|
|
117
|
+
"value": "var(--hx-color-neutral-500)",
|
|
118
|
+
"description": "Placeholder text in form inputs. Distinct from muted so it can diverge per mode — placeholders must remain clearly non-value across themes."
|
|
119
|
+
},
|
|
112
120
|
"disabled": { "value": "var(--hx-color-neutral-400)" },
|
|
113
121
|
"inverse": { "value": "var(--hx-color-neutral-0)" },
|
|
114
122
|
"on-primary": { "value": "var(--hx-color-neutral-0)" },
|
|
@@ -134,6 +142,10 @@
|
|
|
134
142
|
"default": { "value": "var(--hx-color-neutral-0)" },
|
|
135
143
|
"raised": { "value": "var(--hx-color-neutral-50)" },
|
|
136
144
|
"sunken": { "value": "var(--hx-color-neutral-100)" },
|
|
145
|
+
"inverse": {
|
|
146
|
+
"value": "var(--hx-color-neutral-900)",
|
|
147
|
+
"description": "Inverse surface for dark-always components (tooltips, inverse nav). Flips to a light surface in dark mode; uses system Canvas in forced-colors."
|
|
148
|
+
},
|
|
137
149
|
"overlay": { "value": "rgba(0, 0, 0, 0.75)" }
|
|
138
150
|
},
|
|
139
151
|
"border": {
|
|
@@ -459,8 +471,10 @@
|
|
|
459
471
|
},
|
|
460
472
|
"text": {
|
|
461
473
|
"primary": { "value": "var(--hx-color-neutral-100)" },
|
|
474
|
+
"strong": { "value": "var(--hx-color-neutral-50)" },
|
|
462
475
|
"secondary": { "value": "var(--hx-color-neutral-300)" },
|
|
463
476
|
"muted": { "value": "var(--hx-color-neutral-400)" },
|
|
477
|
+
"placeholder": { "value": "var(--hx-color-neutral-500)" },
|
|
464
478
|
"disabled": { "value": "var(--hx-color-neutral-600)" },
|
|
465
479
|
"inverse": { "value": "var(--hx-color-neutral-900)" },
|
|
466
480
|
"link": { "value": "var(--hx-color-primary-400)" },
|
|
@@ -472,6 +486,7 @@
|
|
|
472
486
|
"default": { "value": "var(--hx-color-neutral-900)" },
|
|
473
487
|
"raised": { "value": "var(--hx-color-neutral-800)" },
|
|
474
488
|
"sunken": { "value": "var(--hx-color-neutral-950)" },
|
|
489
|
+
"inverse": { "value": "var(--hx-color-neutral-100)" },
|
|
475
490
|
"overlay": { "value": "rgba(0, 0, 0, 0.85)" }
|
|
476
491
|
},
|
|
477
492
|
"border": {
|
|
@@ -538,8 +553,13 @@
|
|
|
538
553
|
},
|
|
539
554
|
"text": {
|
|
540
555
|
"primary": { "value": "#FFFFFF", "description": "21:1 contrast on #000 — WCAG AAA" },
|
|
556
|
+
"strong": { "value": "#FFFFFF", "description": "21:1 contrast on #000 — WCAG AAA" },
|
|
541
557
|
"secondary": { "value": "#FFFFFF", "description": "21:1 contrast on #000" },
|
|
542
558
|
"muted": { "value": "#E0E0E0", "description": "~16:1 contrast on #000" },
|
|
559
|
+
"placeholder": {
|
|
560
|
+
"value": "#B0B0B0",
|
|
561
|
+
"description": "~9:1 contrast on #000 — clearly readable but distinct from entered text at 21:1"
|
|
562
|
+
},
|
|
543
563
|
"disabled": {
|
|
544
564
|
"value": "#767676",
|
|
545
565
|
"description": "4.5:1 contrast on #000 — WCAG AA minimum"
|
|
@@ -560,6 +580,10 @@
|
|
|
560
580
|
"default": { "value": "#000000" },
|
|
561
581
|
"raised": { "value": "#1A1A1A" },
|
|
562
582
|
"sunken": { "value": "#000000" },
|
|
583
|
+
"inverse": {
|
|
584
|
+
"value": "#FFFFFF",
|
|
585
|
+
"description": "Inverse of HC canvas — white surface for dark-always components in HC mode"
|
|
586
|
+
},
|
|
563
587
|
"overlay": { "value": "rgba(0, 0, 0, 0.95)" }
|
|
564
588
|
},
|
|
565
589
|
"border": {
|