@classic-homes/theme-tokens 0.1.2 → 0.1.4

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.mts CHANGED
@@ -33,6 +33,7 @@ declare const colors: {
33
33
  readonly 800: "#7f1d1d";
34
34
  readonly 900: "#5c1010";
35
35
  readonly 950: "#3d0a0a";
36
+ readonly foreground: "#ffffff";
36
37
  };
37
38
  readonly teal: {
38
39
  readonly 50: "#f0fafa";
@@ -46,6 +47,7 @@ declare const colors: {
46
47
  readonly 800: "#184144";
47
48
  readonly 900: "#0c2123";
48
49
  readonly 950: "#061012";
50
+ readonly foreground: "#ffffff";
49
51
  };
50
52
  readonly navy: {
51
53
  readonly 50: "#f0f4f6";
@@ -59,6 +61,7 @@ declare const colors: {
59
61
  readonly 800: "#00242f";
60
62
  readonly 900: "#001a20";
61
63
  readonly 950: "#000d10";
64
+ readonly foreground: "#ffffff";
62
65
  };
63
66
  readonly plum: {
64
67
  readonly 50: "#f8f4f6";
@@ -72,6 +75,7 @@ declare const colors: {
72
75
  readonly 800: "#4b2334";
73
76
  readonly 900: "#381a27";
74
77
  readonly 950: "#1c0d13";
78
+ readonly foreground: "#ffffff";
75
79
  };
76
80
  readonly sage: {
77
81
  readonly 50: "#f7f7f5";
@@ -98,6 +102,7 @@ declare const colors: {
98
102
  readonly 800: "#4d524f";
99
103
  readonly 900: "#333735";
100
104
  readonly 950: "#1a1b1b";
105
+ readonly foreground: "#ffffff";
101
106
  };
102
107
  readonly forest: {
103
108
  readonly 50: "#f4f7f5";
@@ -111,6 +116,7 @@ declare const colors: {
111
116
  readonly 800: "#2b412e";
112
117
  readonly 900: "#162017";
113
118
  readonly 950: "#0b100c";
119
+ readonly foreground: "#ffffff";
114
120
  };
115
121
  readonly lavender: {
116
122
  readonly 50: "#f7f6f8";
@@ -124,6 +130,7 @@ declare const colors: {
124
130
  readonly 800: "#51445a";
125
131
  readonly 900: "#392e3f";
126
132
  readonly 950: "#1d1720";
133
+ readonly foreground: "#ffffff";
127
134
  };
128
135
  readonly sky: {
129
136
  readonly 50: "#f4f8fb";
@@ -137,6 +144,7 @@ declare const colors: {
137
144
  readonly 800: "#39576e";
138
145
  readonly 900: "#263a49";
139
146
  readonly 950: "#131d25";
147
+ readonly foreground: "#ffffff";
140
148
  };
141
149
  readonly deepTeal: {
142
150
  readonly 50: "#f2f5f5";
@@ -149,6 +157,7 @@ declare const colors: {
149
157
  readonly 800: "#18332f";
150
158
  readonly 900: "#0c1918";
151
159
  readonly 950: "#060c0c";
160
+ readonly foreground: "#ffffff";
152
161
  };
153
162
  readonly charcoal: {
154
163
  readonly 50: "#f5f5f5";
@@ -162,6 +171,7 @@ declare const colors: {
162
171
  readonly 800: "#333333";
163
172
  readonly 900: "#292424";
164
173
  readonly 950: "#141212";
174
+ readonly foreground: "#ffffff";
165
175
  };
166
176
  };
167
177
  /**
@@ -492,6 +502,7 @@ declare const tokens: {
492
502
  readonly 800: "#7f1d1d";
493
503
  readonly 900: "#5c1010";
494
504
  readonly 950: "#3d0a0a";
505
+ readonly foreground: "#ffffff";
495
506
  };
496
507
  readonly teal: {
497
508
  readonly 50: "#f0fafa";
@@ -505,6 +516,7 @@ declare const tokens: {
505
516
  readonly 800: "#184144";
506
517
  readonly 900: "#0c2123";
507
518
  readonly 950: "#061012";
519
+ readonly foreground: "#ffffff";
508
520
  };
509
521
  readonly navy: {
510
522
  readonly 50: "#f0f4f6";
@@ -518,6 +530,7 @@ declare const tokens: {
518
530
  readonly 800: "#00242f";
519
531
  readonly 900: "#001a20";
520
532
  readonly 950: "#000d10";
533
+ readonly foreground: "#ffffff";
521
534
  };
522
535
  readonly plum: {
523
536
  readonly 50: "#f8f4f6";
@@ -531,6 +544,7 @@ declare const tokens: {
531
544
  readonly 800: "#4b2334";
532
545
  readonly 900: "#381a27";
533
546
  readonly 950: "#1c0d13";
547
+ readonly foreground: "#ffffff";
534
548
  };
535
549
  readonly sage: {
536
550
  readonly 50: "#f7f7f5";
@@ -557,6 +571,7 @@ declare const tokens: {
557
571
  readonly 800: "#4d524f";
558
572
  readonly 900: "#333735";
559
573
  readonly 950: "#1a1b1b";
574
+ readonly foreground: "#ffffff";
560
575
  };
561
576
  readonly forest: {
562
577
  readonly 50: "#f4f7f5";
@@ -570,6 +585,7 @@ declare const tokens: {
570
585
  readonly 800: "#2b412e";
571
586
  readonly 900: "#162017";
572
587
  readonly 950: "#0b100c";
588
+ readonly foreground: "#ffffff";
573
589
  };
574
590
  readonly lavender: {
575
591
  readonly 50: "#f7f6f8";
@@ -583,6 +599,7 @@ declare const tokens: {
583
599
  readonly 800: "#51445a";
584
600
  readonly 900: "#392e3f";
585
601
  readonly 950: "#1d1720";
602
+ readonly foreground: "#ffffff";
586
603
  };
587
604
  readonly sky: {
588
605
  readonly 50: "#f4f8fb";
@@ -596,6 +613,7 @@ declare const tokens: {
596
613
  readonly 800: "#39576e";
597
614
  readonly 900: "#263a49";
598
615
  readonly 950: "#131d25";
616
+ readonly foreground: "#ffffff";
599
617
  };
600
618
  readonly deepTeal: {
601
619
  readonly 50: "#f2f5f5";
@@ -608,6 +626,7 @@ declare const tokens: {
608
626
  readonly 800: "#18332f";
609
627
  readonly 900: "#0c1918";
610
628
  readonly 950: "#060c0c";
629
+ readonly foreground: "#ffffff";
611
630
  };
612
631
  readonly charcoal: {
613
632
  readonly 50: "#f5f5f5";
@@ -621,6 +640,7 @@ declare const tokens: {
621
640
  readonly 800: "#333333";
622
641
  readonly 900: "#292424";
623
642
  readonly 950: "#141212";
643
+ readonly foreground: "#ffffff";
624
644
  };
625
645
  };
626
646
  readonly brandColors: {
package/dist/index.d.ts CHANGED
@@ -33,6 +33,7 @@ declare const colors: {
33
33
  readonly 800: "#7f1d1d";
34
34
  readonly 900: "#5c1010";
35
35
  readonly 950: "#3d0a0a";
36
+ readonly foreground: "#ffffff";
36
37
  };
37
38
  readonly teal: {
38
39
  readonly 50: "#f0fafa";
@@ -46,6 +47,7 @@ declare const colors: {
46
47
  readonly 800: "#184144";
47
48
  readonly 900: "#0c2123";
48
49
  readonly 950: "#061012";
50
+ readonly foreground: "#ffffff";
49
51
  };
50
52
  readonly navy: {
51
53
  readonly 50: "#f0f4f6";
@@ -59,6 +61,7 @@ declare const colors: {
59
61
  readonly 800: "#00242f";
60
62
  readonly 900: "#001a20";
61
63
  readonly 950: "#000d10";
64
+ readonly foreground: "#ffffff";
62
65
  };
63
66
  readonly plum: {
64
67
  readonly 50: "#f8f4f6";
@@ -72,6 +75,7 @@ declare const colors: {
72
75
  readonly 800: "#4b2334";
73
76
  readonly 900: "#381a27";
74
77
  readonly 950: "#1c0d13";
78
+ readonly foreground: "#ffffff";
75
79
  };
76
80
  readonly sage: {
77
81
  readonly 50: "#f7f7f5";
@@ -98,6 +102,7 @@ declare const colors: {
98
102
  readonly 800: "#4d524f";
99
103
  readonly 900: "#333735";
100
104
  readonly 950: "#1a1b1b";
105
+ readonly foreground: "#ffffff";
101
106
  };
102
107
  readonly forest: {
103
108
  readonly 50: "#f4f7f5";
@@ -111,6 +116,7 @@ declare const colors: {
111
116
  readonly 800: "#2b412e";
112
117
  readonly 900: "#162017";
113
118
  readonly 950: "#0b100c";
119
+ readonly foreground: "#ffffff";
114
120
  };
115
121
  readonly lavender: {
116
122
  readonly 50: "#f7f6f8";
@@ -124,6 +130,7 @@ declare const colors: {
124
130
  readonly 800: "#51445a";
125
131
  readonly 900: "#392e3f";
126
132
  readonly 950: "#1d1720";
133
+ readonly foreground: "#ffffff";
127
134
  };
128
135
  readonly sky: {
129
136
  readonly 50: "#f4f8fb";
@@ -137,6 +144,7 @@ declare const colors: {
137
144
  readonly 800: "#39576e";
138
145
  readonly 900: "#263a49";
139
146
  readonly 950: "#131d25";
147
+ readonly foreground: "#ffffff";
140
148
  };
141
149
  readonly deepTeal: {
142
150
  readonly 50: "#f2f5f5";
@@ -149,6 +157,7 @@ declare const colors: {
149
157
  readonly 800: "#18332f";
150
158
  readonly 900: "#0c1918";
151
159
  readonly 950: "#060c0c";
160
+ readonly foreground: "#ffffff";
152
161
  };
153
162
  readonly charcoal: {
154
163
  readonly 50: "#f5f5f5";
@@ -162,6 +171,7 @@ declare const colors: {
162
171
  readonly 800: "#333333";
163
172
  readonly 900: "#292424";
164
173
  readonly 950: "#141212";
174
+ readonly foreground: "#ffffff";
165
175
  };
166
176
  };
167
177
  /**
@@ -492,6 +502,7 @@ declare const tokens: {
492
502
  readonly 800: "#7f1d1d";
493
503
  readonly 900: "#5c1010";
494
504
  readonly 950: "#3d0a0a";
505
+ readonly foreground: "#ffffff";
495
506
  };
496
507
  readonly teal: {
497
508
  readonly 50: "#f0fafa";
@@ -505,6 +516,7 @@ declare const tokens: {
505
516
  readonly 800: "#184144";
506
517
  readonly 900: "#0c2123";
507
518
  readonly 950: "#061012";
519
+ readonly foreground: "#ffffff";
508
520
  };
509
521
  readonly navy: {
510
522
  readonly 50: "#f0f4f6";
@@ -518,6 +530,7 @@ declare const tokens: {
518
530
  readonly 800: "#00242f";
519
531
  readonly 900: "#001a20";
520
532
  readonly 950: "#000d10";
533
+ readonly foreground: "#ffffff";
521
534
  };
522
535
  readonly plum: {
523
536
  readonly 50: "#f8f4f6";
@@ -531,6 +544,7 @@ declare const tokens: {
531
544
  readonly 800: "#4b2334";
532
545
  readonly 900: "#381a27";
533
546
  readonly 950: "#1c0d13";
547
+ readonly foreground: "#ffffff";
534
548
  };
535
549
  readonly sage: {
536
550
  readonly 50: "#f7f7f5";
@@ -557,6 +571,7 @@ declare const tokens: {
557
571
  readonly 800: "#4d524f";
558
572
  readonly 900: "#333735";
559
573
  readonly 950: "#1a1b1b";
574
+ readonly foreground: "#ffffff";
560
575
  };
561
576
  readonly forest: {
562
577
  readonly 50: "#f4f7f5";
@@ -570,6 +585,7 @@ declare const tokens: {
570
585
  readonly 800: "#2b412e";
571
586
  readonly 900: "#162017";
572
587
  readonly 950: "#0b100c";
588
+ readonly foreground: "#ffffff";
573
589
  };
574
590
  readonly lavender: {
575
591
  readonly 50: "#f7f6f8";
@@ -583,6 +599,7 @@ declare const tokens: {
583
599
  readonly 800: "#51445a";
584
600
  readonly 900: "#392e3f";
585
601
  readonly 950: "#1d1720";
602
+ readonly foreground: "#ffffff";
586
603
  };
587
604
  readonly sky: {
588
605
  readonly 50: "#f4f8fb";
@@ -596,6 +613,7 @@ declare const tokens: {
596
613
  readonly 800: "#39576e";
597
614
  readonly 900: "#263a49";
598
615
  readonly 950: "#131d25";
616
+ readonly foreground: "#ffffff";
599
617
  };
600
618
  readonly deepTeal: {
601
619
  readonly 50: "#f2f5f5";
@@ -608,6 +626,7 @@ declare const tokens: {
608
626
  readonly 800: "#18332f";
609
627
  readonly 900: "#0c1918";
610
628
  readonly 950: "#060c0c";
629
+ readonly foreground: "#ffffff";
611
630
  };
612
631
  readonly charcoal: {
613
632
  readonly 50: "#f5f5f5";
@@ -621,6 +640,7 @@ declare const tokens: {
621
640
  readonly 800: "#333333";
622
641
  readonly 900: "#292424";
623
642
  readonly 950: "#141212";
643
+ readonly foreground: "#ffffff";
624
644
  };
625
645
  };
626
646
  readonly brandColors: {
package/dist/index.js CHANGED
@@ -72,7 +72,9 @@ var colors = {
72
72
  // Red 2 from brand
73
73
  800: "#7f1d1d",
74
74
  900: "#5c1010",
75
- 950: "#3d0a0a"
75
+ 950: "#3d0a0a",
76
+ foreground: "#ffffff"
77
+ // White text/icons on red backgrounds
76
78
  },
77
79
  // Core 1 - Teal (Primary brand accent)
78
80
  teal: {
@@ -87,7 +89,9 @@ var colors = {
87
89
  700: "#236265",
88
90
  800: "#184144",
89
91
  900: "#0c2123",
90
- 950: "#061012"
92
+ 950: "#061012",
93
+ foreground: "#ffffff"
94
+ // White text/icons on teal backgrounds
91
95
  },
92
96
  // Core 2 - Navy (Dark professional blue)
93
97
  navy: {
@@ -102,7 +106,9 @@ var colors = {
102
106
  // Core 2 from brand
103
107
  800: "#00242f",
104
108
  900: "#001a20",
105
- 950: "#000d10"
109
+ 950: "#000d10",
110
+ foreground: "#ffffff"
111
+ // White text/icons on navy backgrounds
106
112
  },
107
113
  // Core 3 - Plum (Rich burgundy/purple)
108
114
  plum: {
@@ -117,7 +123,9 @@ var colors = {
117
123
  // Core 3 from brand
118
124
  800: "#4b2334",
119
125
  900: "#381a27",
120
- 950: "#1c0d13"
126
+ 950: "#1c0d13",
127
+ foreground: "#ffffff"
128
+ // White text/icons on plum backgrounds
121
129
  },
122
130
  // Core 4 - Sage (Muted green/gray)
123
131
  sage: {
@@ -148,7 +156,9 @@ var colors = {
148
156
  // Collection 1 from brand
149
157
  800: "#4d524f",
150
158
  900: "#333735",
151
- 950: "#1a1b1b"
159
+ 950: "#1a1b1b",
160
+ foreground: "#ffffff"
161
+ // White text/icons on stone backgrounds
152
162
  },
153
163
  // Collection 2 - Forest Green
154
164
  forest: {
@@ -163,7 +173,9 @@ var colors = {
163
173
  700: "#406146",
164
174
  800: "#2b412e",
165
175
  900: "#162017",
166
- 950: "#0b100c"
176
+ 950: "#0b100c",
177
+ foreground: "#ffffff"
178
+ // White text/icons on forest backgrounds
167
179
  },
168
180
  // Collection 3 - Lavender
169
181
  lavender: {
@@ -178,7 +190,9 @@ var colors = {
178
190
  // Collection 3 from brand
179
191
  800: "#51445a",
180
192
  900: "#392e3f",
181
- 950: "#1d1720"
193
+ 950: "#1d1720",
194
+ foreground: "#ffffff"
195
+ // White text/icons on lavender backgrounds
182
196
  },
183
197
  // Collection 4 - Sky Blue
184
198
  sky: {
@@ -193,7 +207,9 @@ var colors = {
193
207
  700: "#4c7493",
194
208
  800: "#39576e",
195
209
  900: "#263a49",
196
- 950: "#131d25"
210
+ 950: "#131d25",
211
+ foreground: "#ffffff"
212
+ // White text/icons on sky backgrounds
197
213
  },
198
214
  // Collection 5 - Deep Teal
199
215
  deepTeal: {
@@ -207,7 +223,9 @@ var colors = {
207
223
  // Collection 5 from brand
208
224
  800: "#18332f",
209
225
  900: "#0c1918",
210
- 950: "#060c0c"
226
+ 950: "#060c0c",
227
+ foreground: "#ffffff"
228
+ // White text/icons on deepTeal backgrounds
211
229
  },
212
230
  // Collection 6 - Charcoal
213
231
  charcoal: {
@@ -222,7 +240,9 @@ var colors = {
222
240
  800: "#333333",
223
241
  900: "#292424",
224
242
  // Collection 6 from brand
225
- 950: "#141212"
243
+ 950: "#141212",
244
+ foreground: "#ffffff"
245
+ // White text/icons on charcoal backgrounds
226
246
  }
227
247
  };
228
248
  var brandColors = {
package/dist/index.mjs CHANGED
@@ -33,7 +33,9 @@ var colors = {
33
33
  // Red 2 from brand
34
34
  800: "#7f1d1d",
35
35
  900: "#5c1010",
36
- 950: "#3d0a0a"
36
+ 950: "#3d0a0a",
37
+ foreground: "#ffffff"
38
+ // White text/icons on red backgrounds
37
39
  },
38
40
  // Core 1 - Teal (Primary brand accent)
39
41
  teal: {
@@ -48,7 +50,9 @@ var colors = {
48
50
  700: "#236265",
49
51
  800: "#184144",
50
52
  900: "#0c2123",
51
- 950: "#061012"
53
+ 950: "#061012",
54
+ foreground: "#ffffff"
55
+ // White text/icons on teal backgrounds
52
56
  },
53
57
  // Core 2 - Navy (Dark professional blue)
54
58
  navy: {
@@ -63,7 +67,9 @@ var colors = {
63
67
  // Core 2 from brand
64
68
  800: "#00242f",
65
69
  900: "#001a20",
66
- 950: "#000d10"
70
+ 950: "#000d10",
71
+ foreground: "#ffffff"
72
+ // White text/icons on navy backgrounds
67
73
  },
68
74
  // Core 3 - Plum (Rich burgundy/purple)
69
75
  plum: {
@@ -78,7 +84,9 @@ var colors = {
78
84
  // Core 3 from brand
79
85
  800: "#4b2334",
80
86
  900: "#381a27",
81
- 950: "#1c0d13"
87
+ 950: "#1c0d13",
88
+ foreground: "#ffffff"
89
+ // White text/icons on plum backgrounds
82
90
  },
83
91
  // Core 4 - Sage (Muted green/gray)
84
92
  sage: {
@@ -109,7 +117,9 @@ var colors = {
109
117
  // Collection 1 from brand
110
118
  800: "#4d524f",
111
119
  900: "#333735",
112
- 950: "#1a1b1b"
120
+ 950: "#1a1b1b",
121
+ foreground: "#ffffff"
122
+ // White text/icons on stone backgrounds
113
123
  },
114
124
  // Collection 2 - Forest Green
115
125
  forest: {
@@ -124,7 +134,9 @@ var colors = {
124
134
  700: "#406146",
125
135
  800: "#2b412e",
126
136
  900: "#162017",
127
- 950: "#0b100c"
137
+ 950: "#0b100c",
138
+ foreground: "#ffffff"
139
+ // White text/icons on forest backgrounds
128
140
  },
129
141
  // Collection 3 - Lavender
130
142
  lavender: {
@@ -139,7 +151,9 @@ var colors = {
139
151
  // Collection 3 from brand
140
152
  800: "#51445a",
141
153
  900: "#392e3f",
142
- 950: "#1d1720"
154
+ 950: "#1d1720",
155
+ foreground: "#ffffff"
156
+ // White text/icons on lavender backgrounds
143
157
  },
144
158
  // Collection 4 - Sky Blue
145
159
  sky: {
@@ -154,7 +168,9 @@ var colors = {
154
168
  700: "#4c7493",
155
169
  800: "#39576e",
156
170
  900: "#263a49",
157
- 950: "#131d25"
171
+ 950: "#131d25",
172
+ foreground: "#ffffff"
173
+ // White text/icons on sky backgrounds
158
174
  },
159
175
  // Collection 5 - Deep Teal
160
176
  deepTeal: {
@@ -168,7 +184,9 @@ var colors = {
168
184
  // Collection 5 from brand
169
185
  800: "#18332f",
170
186
  900: "#0c1918",
171
- 950: "#060c0c"
187
+ 950: "#060c0c",
188
+ foreground: "#ffffff"
189
+ // White text/icons on deepTeal backgrounds
172
190
  },
173
191
  // Collection 6 - Charcoal
174
192
  charcoal: {
@@ -183,7 +201,9 @@ var colors = {
183
201
  800: "#333333",
184
202
  900: "#292424",
185
203
  // Collection 6 from brand
186
- 950: "#141212"
204
+ 950: "#141212",
205
+ foreground: "#ffffff"
206
+ // White text/icons on charcoal backgrounds
187
207
  }
188
208
  };
189
209
  var brandColors = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@classic-homes/theme-tokens",
3
- "version": "0.1.2",
3
+ "version": "0.1.4",
4
4
  "description": "Design tokens for the Classic theme system",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",