@l3mpire/tokens 0.16.0 → 0.18.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.
Files changed (4) hide show
  1. package/dist/css/components.css +41 -0
  2. package/dist/css/tokens.css +41 -0
  3. package/dist/ts/tokens.ts +41 -0
  4. package/package.json +1 -1
package/dist/css/components.css CHANGED
@@ -25,6 +25,34 @@
25
25
  --comp-btn-ghost-alert-border-pressed: rgba(0, 0, 0, 0);
26
26
  --comp-btn-disabled-ghost-bg: rgba(0, 0, 0, 0);
27
27
  --comp-btn-disabled-ghost-border: rgba(0, 0, 0, 0);
28
+ --comp-avatar-tone-orange-bg: var(--orange-500);
29
+ --comp-avatar-tone-orange-text: var(--grey-white);
30
+ --comp-avatar-tone-amber-bg: var(--amber-500);
31
+ --comp-avatar-tone-amber-text: var(--grey-white);
32
+ --comp-avatar-tone-yellow-bg: var(--yellow-500);
33
+ --comp-avatar-tone-yellow-text: var(--grey-white);
34
+ --comp-avatar-tone-green-bg: var(--green-500);
35
+ --comp-avatar-tone-green-text: var(--grey-white);
36
+ --comp-avatar-tone-teal-bg: var(--teal-500);
37
+ --comp-avatar-tone-teal-text: var(--grey-white);
38
+ --comp-avatar-tone-cyan-bg: var(--cyan-500);
39
+ --comp-avatar-tone-cyan-text: var(--grey-white);
40
+ --comp-avatar-tone-sky-bg: var(--sky-500);
41
+ --comp-avatar-tone-sky-text: var(--grey-white);
42
+ --comp-avatar-tone-blue-bg: var(--blue-500);
43
+ --comp-avatar-tone-blue-text: var(--grey-white);
44
+ --comp-avatar-tone-indigo-bg: var(--indigo-500);
45
+ --comp-avatar-tone-indigo-text: var(--grey-white);
46
+ --comp-avatar-tone-violet-bg: var(--violet-500);
47
+ --comp-avatar-tone-violet-text: var(--grey-white);
48
+ --comp-avatar-tone-purple-bg: var(--purple-500);
49
+ --comp-avatar-tone-purple-text: var(--grey-white);
50
+ --comp-avatar-tone-fuchsia-bg: var(--fuchsia-500);
51
+ --comp-avatar-tone-fuchsia-text: var(--grey-white);
52
+ --comp-avatar-tone-pink-bg: var(--pink-500);
53
+ --comp-avatar-tone-pink-text: var(--grey-white);
54
+ --comp-avatar-tone-red-bg: var(--red-500);
55
+ --comp-avatar-tone-red-text: var(--grey-white);
28
56
  --comp-badge-solid-indigo-text: var(--core-text-specific-tags-on-solid);
29
57
  --comp-badge-solid-violet-text: var(--core-text-specific-tags-on-solid);
30
58
  --comp-badge-solid-cyan-text: var(--core-text-specific-tags-on-solid);
@@ -303,6 +331,19 @@
303
331
  --comp-info-message-title: var(--core-text-main-primary);
304
332
  --comp-info-message-description: var(--core-text-main-secondary);
305
333
  --comp-info-message-close: var(--core-text-main-secondary);
334
+ --comp-inline-field-value-text: var(--core-text-main-primary);
335
+ --comp-inline-field-value-muted: var(--core-text-main-tertiary);
336
+ --comp-inline-field-pill-bg-hover: var(--core-bg-main-tertiary);
337
+ --comp-inline-field-pill-bg-outline: var(--core-bg-main-primary);
338
+ --comp-inline-field-pill-border-outline: var(--core-border-main-primary);
339
+ --comp-inline-field-affordance-icon: var(--core-text-main-tertiary);
340
+ --comp-inline-field-affordance-spinner: var(--core-text-main-tertiary);
341
+ --comp-inline-field-affordance-saved: var(--core-text-functional-success);
342
+ --comp-inline-field-accent-default: var(--interactive-bg-primary-dark-default);
343
+ --comp-inline-field-accent-hover: var(--interactive-bg-primary-dark-hover);
344
+ --comp-inline-field-link-text: var(--interactive-bg-primary-dark-default);
345
+ --comp-inline-field-error-text: var(--core-text-functional-critical);
346
+ --comp-inline-field-error-border: var(--core-border-functional-critical);
306
347
  --comp-input-label-text: var(--core-text-main-secondary);
307
348
  --comp-input-label-optional: var(--core-text-main-tertiary);
308
349
  --comp-input-label-mandatory: var(--core-text-functional-critical);
package/dist/css/tokens.css CHANGED
@@ -536,6 +536,34 @@
536
536
  --interactive-border-warning-light-default: var(--grey-white);
537
537
  --interactive-border-warning-light-hover: var(--yellow-100);
538
538
  --interactive-border-warning-light-pressed: var(--yellow-200);
539
+ --comp-avatar-tone-orange-bg: var(--orange-500);
540
+ --comp-avatar-tone-orange-text: var(--grey-white);
541
+ --comp-avatar-tone-amber-bg: var(--amber-500);
542
+ --comp-avatar-tone-amber-text: var(--grey-white);
543
+ --comp-avatar-tone-yellow-bg: var(--yellow-500);
544
+ --comp-avatar-tone-yellow-text: var(--grey-white);
545
+ --comp-avatar-tone-green-bg: var(--green-500);
546
+ --comp-avatar-tone-green-text: var(--grey-white);
547
+ --comp-avatar-tone-teal-bg: var(--teal-500);
548
+ --comp-avatar-tone-teal-text: var(--grey-white);
549
+ --comp-avatar-tone-cyan-bg: var(--cyan-500);
550
+ --comp-avatar-tone-cyan-text: var(--grey-white);
551
+ --comp-avatar-tone-sky-bg: var(--sky-500);
552
+ --comp-avatar-tone-sky-text: var(--grey-white);
553
+ --comp-avatar-tone-blue-bg: var(--blue-500);
554
+ --comp-avatar-tone-blue-text: var(--grey-white);
555
+ --comp-avatar-tone-indigo-bg: var(--indigo-500);
556
+ --comp-avatar-tone-indigo-text: var(--grey-white);
557
+ --comp-avatar-tone-violet-bg: var(--violet-500);
558
+ --comp-avatar-tone-violet-text: var(--grey-white);
559
+ --comp-avatar-tone-purple-bg: var(--purple-500);
560
+ --comp-avatar-tone-purple-text: var(--grey-white);
561
+ --comp-avatar-tone-fuchsia-bg: var(--fuchsia-500);
562
+ --comp-avatar-tone-fuchsia-text: var(--grey-white);
563
+ --comp-avatar-tone-pink-bg: var(--pink-500);
564
+ --comp-avatar-tone-pink-text: var(--grey-white);
565
+ --comp-avatar-tone-red-bg: var(--red-500);
566
+ --comp-avatar-tone-red-text: var(--grey-white);
539
567
  --comp-badge-solid-indigo-text: var(--core-text-specific-tags-on-solid);
540
568
  --comp-badge-solid-violet-text: var(--core-text-specific-tags-on-solid);
541
569
  --comp-badge-solid-cyan-text: var(--core-text-specific-tags-on-solid);
@@ -814,6 +842,19 @@
814
842
  --comp-info-message-title: var(--core-text-main-primary);
815
843
  --comp-info-message-description: var(--core-text-main-secondary);
816
844
  --comp-info-message-close: var(--core-text-main-secondary);
845
+ --comp-inline-field-value-text: var(--core-text-main-primary);
846
+ --comp-inline-field-value-muted: var(--core-text-main-tertiary);
847
+ --comp-inline-field-pill-bg-hover: var(--core-bg-main-tertiary);
848
+ --comp-inline-field-pill-bg-outline: var(--core-bg-main-primary);
849
+ --comp-inline-field-pill-border-outline: var(--core-border-main-primary);
850
+ --comp-inline-field-affordance-icon: var(--core-text-main-tertiary);
851
+ --comp-inline-field-affordance-spinner: var(--core-text-main-tertiary);
852
+ --comp-inline-field-affordance-saved: var(--core-text-functional-success);
853
+ --comp-inline-field-accent-default: var(--interactive-bg-primary-dark-default);
854
+ --comp-inline-field-accent-hover: var(--interactive-bg-primary-dark-hover);
855
+ --comp-inline-field-link-text: var(--interactive-bg-primary-dark-default);
856
+ --comp-inline-field-error-text: var(--core-text-functional-critical);
857
+ --comp-inline-field-error-border: var(--core-border-functional-critical);
817
858
  --comp-input-label-text: var(--core-text-main-secondary);
818
859
  --comp-input-label-optional: var(--core-text-main-tertiary);
819
860
  --comp-input-label-mandatory: var(--core-text-functional-critical);
package/dist/ts/tokens.ts CHANGED
@@ -512,6 +512,34 @@ export const tokens = {
512
512
  "font-weight-solid": "700",
513
513
  "comp-avatar-fallback-bg": "#316bff",
514
514
  "comp-avatar-fallback-text": "#ffffff",
515
+ "comp-avatar-tone-orange-bg": "#f97316",
516
+ "comp-avatar-tone-orange-text": "#ffffff",
517
+ "comp-avatar-tone-amber-bg": "#f59e0b",
518
+ "comp-avatar-tone-amber-text": "#ffffff",
519
+ "comp-avatar-tone-yellow-bg": "#eab308",
520
+ "comp-avatar-tone-yellow-text": "#ffffff",
521
+ "comp-avatar-tone-green-bg": "#22c55e",
522
+ "comp-avatar-tone-green-text": "#ffffff",
523
+ "comp-avatar-tone-teal-bg": "#14b8a6",
524
+ "comp-avatar-tone-teal-text": "#ffffff",
525
+ "comp-avatar-tone-cyan-bg": "#06b6d4",
526
+ "comp-avatar-tone-cyan-text": "#ffffff",
527
+ "comp-avatar-tone-sky-bg": "#0ea5e9",
528
+ "comp-avatar-tone-sky-text": "#ffffff",
529
+ "comp-avatar-tone-blue-bg": "#3b82f6",
530
+ "comp-avatar-tone-blue-text": "#ffffff",
531
+ "comp-avatar-tone-indigo-bg": "#6366f1",
532
+ "comp-avatar-tone-indigo-text": "#ffffff",
533
+ "comp-avatar-tone-violet-bg": "#8b5cf6",
534
+ "comp-avatar-tone-violet-text": "#ffffff",
535
+ "comp-avatar-tone-purple-bg": "#a855f7",
536
+ "comp-avatar-tone-purple-text": "#ffffff",
537
+ "comp-avatar-tone-fuchsia-bg": "#d946ef",
538
+ "comp-avatar-tone-fuchsia-text": "#ffffff",
539
+ "comp-avatar-tone-pink-bg": "#ec4899",
540
+ "comp-avatar-tone-pink-text": "#ffffff",
541
+ "comp-avatar-tone-red-bg": "#ef4444",
542
+ "comp-avatar-tone-red-text": "#ffffff",
515
543
  "comp-badge-solid-primary-bg": "#316bff",
516
544
  "comp-badge-solid-primary-text": "#ffffff",
517
545
  "comp-badge-solid-success-bg": "#22c55e",
@@ -795,6 +823,19 @@ export const tokens = {
795
823
  "comp-info-message-title": "#1f2937",
796
824
  "comp-info-message-description": "#5a6472",
797
825
  "comp-info-message-close": "#5a6472",
826
+ "comp-inline-field-value-text": "#1f2937",
827
+ "comp-inline-field-value-muted": "#6b7280",
828
+ "comp-inline-field-pill-bg-hover": "#f3f4f6",
829
+ "comp-inline-field-pill-bg-outline": "#ffffff",
830
+ "comp-inline-field-pill-border-outline": "rgba(31, 41, 55, 0.1)",
831
+ "comp-inline-field-affordance-icon": "#6b7280",
832
+ "comp-inline-field-affordance-spinner": "#6b7280",
833
+ "comp-inline-field-affordance-saved": "#15803d",
834
+ "comp-inline-field-accent-default": "#316bff",
835
+ "comp-inline-field-accent-hover": "#1f5eff",
836
+ "comp-inline-field-link-text": "#316bff",
837
+ "comp-inline-field-error-text": "#b91c1c",
838
+ "comp-inline-field-error-border": "#b91c1c",
798
839
  "comp-input-label-text": "#5a6472",
799
840
  "comp-input-label-optional": "#6b7280",
800
841
  "comp-input-label-mandatory": "#b91c1c",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@l3mpire/tokens",
3
- "version": "0.16.0",
3
+ "version": "0.18.0",
4
4
  "publishConfig": {
5
5
  "registry": "https://registry.npmjs.org",
6
6
  "access": "public"