@codenhub/styles 0.2.0 → 0.3.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 (17) hide show
  1. package/dist/components.css +1 -1
  2. package/dist/index.css +1 -1
  3. package/dist/native.css +1 -1
  4. package/dist/palette.css +1 -0
  5. package/dist/theme.css +1 -1
  6. package/dist/tw/components/feedback.css +43 -21
  7. package/dist/tw/palette.css +451 -0
  8. package/dist/tw/theme.css +14 -1
  9. package/docs/accessibility.md +8 -7
  10. package/docs/changelog/0.3.0.md +15 -0
  11. package/docs/changelog/index.md +1 -0
  12. package/docs/setup.md +23 -22
  13. package/docs/usage/composing.md +16 -13
  14. package/docs/usage/customizing.md +27 -0
  15. package/docs/usage/feedback.md +2 -1
  16. package/llms-full.txt +89 -43
  17. package/package.json +9 -2
package/dist/tw/palette.css ADDED
@@ -0,0 +1,451 @@
1
+ /* Generated by `pnpm generate` from `src/index.css`, through
2
+ `scripts/generate-palette.mjs`. Do not hand-edit -- see
3
+ `docs/internal/generated-palette.md` for what this is and why it exists. */
4
+
5
+ :root {
6
+ --palette-neutral-solid-bg: oklab(0.145 0 0 / 0.2);
7
+ --palette-neutral-solid-fg: oklab(0.205 0 0);
8
+ --palette-neutral-solid-edge: oklab(0.145 0 0 / 0.2);
9
+ --palette-neutral-solid-bg-hover: oklab(0.371 0 0 / 0.34);
10
+ --palette-neutral-solid-edge-hover: oklab(0.371 0 0 / 0.34);
11
+ --palette-neutral-soft-fg: oklab(0.205 0 0);
12
+ --palette-neutral-soft-bg: oklab(0.145 0 0 / 0.12);
13
+ --palette-neutral-soft-edge: oklab(0.698936 0 0 / 0.8944);
14
+ --palette-neutral-soft-bg-hover: oklab(0.371 0 0 / 0.26);
15
+ --palette-neutral-soft-edge-hover: oklab(0.371 0 0 / 0.9112);
16
+ --palette-neutral-soft-page-bg: oklab(0.8842 0 0);
17
+ --palette-neutral-soft-page-edge: oklab(0.729144 0 0);
18
+ --palette-neutral-soft-page-bg-hover: oklab(0.82536 0 0);
19
+ --palette-neutral-soft-page-edge-hover: oklab(0.425523 0 0);
20
+ --palette-neutral-soft-subtle-bg: oklab(0.82876 0 0);
21
+ --palette-neutral-soft-subtle-edge: oklab(0.722491 0 0);
22
+ --palette-neutral-soft-subtle-bg-hover: oklab(0.77874 0 0);
23
+ --palette-neutral-soft-subtle-edge-hover: oklab(0.419929 0 0);
24
+ --palette-neutral-ghost-fg: oklab(0.205 0 0);
25
+ --palette-neutral-ghost-bg: oklab(0 0 0 / 0);
26
+ --palette-neutral-ghost-edge: oklab(0.708 0 0);
27
+ --palette-neutral-ghost-bg-hover: oklab(0.371 0 0 / 0.14);
28
+ --palette-neutral-ghost-edge-hover: oklab(0.371 0 0);
29
+ --palette-neutral-ghost-page-bg: oklab(0.985 0 0);
30
+ --palette-neutral-ghost-page-edge: oklab(0.708 0 0);
31
+ --palette-neutral-ghost-page-bg-hover: oklab(0.89904 0 0);
32
+ --palette-neutral-ghost-page-edge-hover: oklab(0.371 0 0);
33
+ --palette-neutral-ghost-subtle-bg: oklab(0.922 0 0);
34
+ --palette-neutral-ghost-subtle-edge: oklab(0.708 0 0);
35
+ --palette-neutral-ghost-subtle-bg-hover: oklab(0.84486 0 0);
36
+ --palette-neutral-ghost-subtle-edge-hover: oklab(0.371 0 0);
37
+ --palette-primary-solid-bg: oklab(0.145 0 0);
38
+ --palette-primary-solid-fg: oklab(0.985 0 0);
39
+ --palette-primary-solid-edge: oklab(0.145 0 0);
40
+ --palette-primary-solid-bg-hover: oklab(0.371 0 0);
41
+ --palette-primary-solid-edge-hover: oklab(0.371 0 0);
42
+ --palette-primary-soft-fg: oklab(0.205 0 0);
43
+ --palette-primary-soft-bg: oklab(0.145 0 0 / 0.12);
44
+ --palette-primary-soft-edge: oklab(0.145 0 0 / 0.8944);
45
+ --palette-primary-soft-bg-hover: oklab(0.371 0 0 / 0.26);
46
+ --palette-primary-soft-edge-hover: oklab(0.371 0 0 / 0.9112);
47
+ --palette-primary-soft-page-bg: oklab(0.8842 0 0);
48
+ --palette-primary-soft-page-edge: oklab(0.233704 0 0);
49
+ --palette-primary-soft-page-bg-hover: oklab(0.82536 0 0);
50
+ --palette-primary-soft-page-edge-hover: oklab(0.425523 0 0);
51
+ --palette-primary-soft-subtle-bg: oklab(0.82876 0 0);
52
+ --palette-primary-soft-subtle-edge: oklab(0.227051 0 0);
53
+ --palette-primary-soft-subtle-bg-hover: oklab(0.77874 0 0);
54
+ --palette-primary-soft-subtle-edge-hover: oklab(0.419929 0 0);
55
+ --palette-primary-ghost-fg: oklab(0.205 0 0);
56
+ --palette-primary-ghost-bg: oklab(0 0 0 / 0);
57
+ --palette-primary-ghost-edge: oklab(0.145 0 0);
58
+ --palette-primary-ghost-bg-hover: oklab(0.371 0 0 / 0.14);
59
+ --palette-primary-ghost-edge-hover: oklab(0.371 0 0);
60
+ --palette-primary-ghost-page-bg: oklab(0.985 0 0);
61
+ --palette-primary-ghost-page-edge: oklab(0.145 0 0);
62
+ --palette-primary-ghost-page-bg-hover: oklab(0.89904 0 0);
63
+ --palette-primary-ghost-page-edge-hover: oklab(0.371 0 0);
64
+ --palette-primary-ghost-subtle-bg: oklab(0.922 0 0);
65
+ --palette-primary-ghost-subtle-edge: oklab(0.145 0 0);
66
+ --palette-primary-ghost-subtle-bg-hover: oklab(0.84486 0 0);
67
+ --palette-primary-ghost-subtle-edge-hover: oklab(0.371 0 0);
68
+ --palette-secondary-solid-bg: oklab(0.439 0 0);
69
+ --palette-secondary-solid-fg: oklab(0.985 0 0);
70
+ --palette-secondary-solid-edge: oklab(0.439 0 0);
71
+ --palette-secondary-solid-bg-hover: oklab(0.371 0 0);
72
+ --palette-secondary-solid-edge-hover: oklab(0.371 0 0);
73
+ --palette-secondary-soft-fg: oklab(0.269 0 0);
74
+ --palette-secondary-soft-bg: oklab(0.439 0 0 / 0.12);
75
+ --palette-secondary-soft-edge: oklab(0.439 0 0 / 0.8944);
76
+ --palette-secondary-soft-bg-hover: oklab(0.371 0 0 / 0.26);
77
+ --palette-secondary-soft-edge-hover: oklab(0.371 0 0 / 0.9112);
78
+ --palette-secondary-soft-page-bg: oklab(0.91948 0 0);
79
+ --palette-secondary-soft-page-edge: oklab(0.496658 0 0);
80
+ --palette-secondary-soft-page-bg-hover: oklab(0.82536 0 0);
81
+ --palette-secondary-soft-page-edge-hover: oklab(0.425523 0 0);
82
+ --palette-secondary-soft-subtle-bg: oklab(0.90628 0 0);
83
+ --palette-secondary-soft-subtle-edge: oklab(0.495074 0 0);
84
+ --palette-secondary-soft-subtle-bg-hover: oklab(0.81426 0 0);
85
+ --palette-secondary-soft-subtle-edge-hover: oklab(0.424191 0 0);
86
+ --palette-secondary-ghost-fg: oklab(0.269 0 0);
87
+ --palette-secondary-ghost-bg: oklab(0 0 0 / 0);
88
+ --palette-secondary-ghost-edge: oklab(0.439 0 0);
89
+ --palette-secondary-ghost-bg-hover: oklab(0.371 0 0 / 0.14);
90
+ --palette-secondary-ghost-edge-hover: oklab(0.371 0 0);
91
+ --palette-secondary-ghost-page-bg: oklab(0.985 0 0);
92
+ --palette-secondary-ghost-page-edge: oklab(0.439 0 0);
93
+ --palette-secondary-ghost-page-bg-hover: oklab(0.89904 0 0);
94
+ --palette-secondary-ghost-page-edge-hover: oklab(0.371 0 0);
95
+ --palette-secondary-ghost-subtle-bg: oklab(0.97 0 0);
96
+ --palette-secondary-ghost-subtle-edge: oklab(0.439 0 0);
97
+ --palette-secondary-ghost-subtle-bg-hover: oklab(0.88614 0 0);
98
+ --palette-secondary-ghost-subtle-edge-hover: oklab(0.371 0 0);
99
+ --palette-success-solid-bg: oklab(0.508 -0.114299 0.0293215);
100
+ --palette-success-solid-fg: oklab(0.985 0 0);
101
+ --palette-success-solid-edge: oklab(0.508 -0.114299 0.0293215);
102
+ --palette-success-solid-bg-hover: oklab(0.497872 -0.101989 0.029308);
103
+ --palette-success-solid-edge-hover: oklab(0.497872 -0.101989 0.029308);
104
+ --palette-success-soft-fg: oklab(0.432 -0.0925326 0.0215109);
105
+ --palette-success-soft-bg: oklab(0.508 -0.114299 0.0293215 / 0.12);
106
+ --palette-success-soft-edge: oklab(0.508 -0.114299 0.0293215 / 0.8944);
107
+ --palette-success-soft-bg-hover: oklab(0.497872 -0.101989 0.029308 / 0.26);
108
+ --palette-success-soft-edge-hover: oklab(0.497872 -0.101989 0.029308 / 0.9112);
109
+ --palette-success-soft-page-bg: oklab(0.92776 -0.0137159 0.00351857);
110
+ --palette-success-soft-page-edge: oklab(0.558371 -0.102229 0.0262251);
111
+ --palette-success-soft-page-bg-hover: oklab(0.858347 -0.0265171 0.00762008);
112
+ --palette-success-soft-page-edge-hover: oklab(0.541129 -0.0929323 0.0267054);
113
+ --palette-success-soft-subtle-bg: oklab(0.89696 -0.0574883 0.0168585);
114
+ --palette-success-soft-subtle-edge: oklab(0.554675 -0.107482 0.0278259);
115
+ --palette-success-soft-subtle-bg-hover: oklab(0.832447 -0.0633257 0.0188378);
116
+ --palette-success-soft-subtle-edge-hover: oklab(0.538021 -0.0973493 0.0280516);
117
+ --palette-success-ghost-fg: oklab(0.432 -0.0925326 0.0215109);
118
+ --palette-success-ghost-bg: oklab(0 0 0 / 0);
119
+ --palette-success-ghost-edge: oklab(0.508 -0.114299 0.0293215);
120
+ --palette-success-ghost-bg-hover: oklab(0.497872 -0.101989 0.029308 / 0.14);
121
+ --palette-success-ghost-edge-hover: oklab(0.497872 -0.101989 0.029308);
122
+ --palette-success-ghost-page-bg: oklab(0.985 0 0);
123
+ --palette-success-ghost-page-edge: oklab(0.508 -0.114299 0.0293215);
124
+ --palette-success-ghost-page-bg-hover: oklab(0.916802 -0.0142784 0.00410312);
125
+ --palette-success-ghost-page-edge-hover: oklab(0.497872 -0.101989 0.029308);
126
+ --palette-success-ghost-subtle-bg: oklab(0.95 -0.0497414 0.0151591);
127
+ --palette-success-ghost-subtle-edge: oklab(0.508 -0.114299 0.0293215);
128
+ --palette-success-ghost-subtle-bg-hover: oklab(0.886702 -0.057056 0.0171399);
129
+ --palette-success-ghost-subtle-edge-hover: oklab(0.497872 -0.101989 0.029308);
130
+ --palette-warning-solid-bg: oklab(0.666 0.0940116 0.152325);
131
+ --palette-warning-solid-fg: oklab(0.145 0 0);
132
+ --palette-warning-solid-edge: oklab(0.666 0.0940116 0.152325);
133
+ --palette-warning-solid-bg-hover: oklab(0.633155 0.100794 0.128308);
134
+ --palette-warning-solid-edge-hover: oklab(0.633155 0.100794 0.128308);
135
+ --palette-warning-soft-fg: oklab(0.473 0.0948219 0.0988828);
136
+ --palette-warning-soft-bg: oklab(0.666 0.0940116 0.152325 / 0.12);
137
+ --palette-warning-soft-edge: oklab(0.666 0.0940116 0.152325 / 0.8944);
138
+ --palette-warning-soft-bg-hover: oklab(0.633155 0.100794 0.128308 / 0.26);
139
+ --palette-warning-soft-edge-hover: oklab(0.633155 0.100794 0.128308 / 0.9112);
140
+ --palette-warning-soft-page-bg: oklab(0.94672 0.0112814 0.018279);
141
+ --palette-warning-soft-page-edge: oklab(0.699686 0.0840839 0.136239);
142
+ --palette-warning-soft-page-bg-hover: oklab(0.89352 0.0262064 0.0333601);
143
+ --palette-warning-soft-page-edge-hover: oklab(0.664399 0.0918435 0.116914);
144
+ --palette-warning-soft-subtle-bg: oklab(0.92648 0.00619956 0.0699497);
145
+ --palette-warning-soft-subtle-edge: oklab(0.697258 0.0834741 0.14244);
146
+ --palette-warning-soft-subtle-bg-hover: oklab(0.8765 0.0219331 0.0768105);
147
+ --palette-warning-soft-subtle-edge-hover: oklab(0.662356 0.0913307 0.122128);
148
+ --palette-warning-ghost-fg: oklab(0.473 0.0948219 0.0988828);
149
+ --palette-warning-ghost-bg: oklab(0 0 0 / 0);
150
+ --palette-warning-ghost-edge: oklab(0.666 0.0940116 0.152325);
151
+ --palette-warning-ghost-bg-hover: oklab(0.633155 0.100794 0.128308 / 0.14);
152
+ --palette-warning-ghost-edge-hover: oklab(0.633155 0.100794 0.128308);
153
+ --palette-warning-ghost-page-bg: oklab(0.985 0 0);
154
+ --palette-warning-ghost-page-edge: oklab(0.666 0.0940116 0.152325);
155
+ --palette-warning-ghost-page-bg-hover: oklab(0.935742 0.0141112 0.0179631);
156
+ --palette-warning-ghost-page-edge-hover: oklab(0.633155 0.100794 0.128308);
157
+ --palette-warning-ghost-subtle-bg: oklab(0.962 -0.0057748 0.0587167);
158
+ --palette-warning-ghost-subtle-edge: oklab(0.666 0.0940116 0.152325);
159
+ --palette-warning-ghost-subtle-bg-hover: oklab(0.915962 0.00914482 0.0684595);
160
+ --palette-warning-ghost-subtle-edge-hover: oklab(0.633155 0.100794 0.128308);
161
+ --palette-destructive-solid-bg: oklab(0.514 0.212373 0.0646656);
162
+ --palette-destructive-solid-fg: oklab(0.985 0 0);
163
+ --palette-destructive-solid-edge: oklab(0.514 0.212373 0.0646656);
164
+ --palette-destructive-solid-bg-hover: oklab(0.51189 0.194868 0.0640785);
165
+ --palette-destructive-solid-edge-hover: oklab(0.51189 0.194868 0.0640785);
166
+ --palette-destructive-soft-fg: oklab(0.455 0.182654 0.044516);
167
+ --palette-destructive-soft-bg: oklab(0.514 0.212373 0.0646656 / 0.12);
168
+ --palette-destructive-soft-edge: oklab(0.514 0.212373 0.0646656 / 0.8944);
169
+ --palette-destructive-soft-bg-hover: oklab(0.51189 0.194868 0.0640785 / 0.26);
170
+ --palette-destructive-soft-edge-hover: oklab(0.51189 0.194868 0.0640785 / 0.9112);
171
+ --palette-destructive-soft-page-bg: oklab(0.92848 0.0254848 0.00775988);
172
+ --palette-destructive-soft-page-edge: oklab(0.563738 0.189947 0.0578369);
173
+ --palette-destructive-soft-page-bg-hover: oklab(0.861991 0.0506656 0.0166604);
174
+ --palette-destructive-soft-page-edge-hover: oklab(0.553902 0.177564 0.0583884);
175
+ --palette-destructive-soft-subtle-bg: oklab(0.88976 0.051251 0.0135099);
176
+ --palette-destructive-soft-subtle-edge: oklab(0.559091 0.193038 0.0585269);
177
+ --palette-destructive-soft-subtle-bg-hover: oklab(0.829431 0.0723327 0.0214956);
178
+ --palette-destructive-soft-subtle-edge-hover: oklab(0.549995 0.180164 0.0589686);
179
+ --palette-destructive-ghost-fg: oklab(0.455 0.182654 0.044516);
180
+ --palette-destructive-ghost-bg: oklab(0 0 0 / 0);
181
+ --palette-destructive-ghost-edge: oklab(0.514 0.212373 0.0646656);
182
+ --palette-destructive-ghost-bg-hover: oklab(0.51189 0.194868 0.0640785 / 0.14);
183
+ --palette-destructive-ghost-edge-hover: oklab(0.51189 0.194868 0.0640785);
184
+ --palette-destructive-ghost-page-bg: oklab(0.985 0 0);
185
+ --palette-destructive-ghost-page-edge: oklab(0.514 0.212373 0.0646656);
186
+ --palette-destructive-ghost-page-bg-hover: oklab(0.918765 0.0272815 0.00897099);
187
+ --palette-destructive-ghost-page-edge-hover: oklab(0.51189 0.194868 0.0640785);
188
+ --palette-destructive-ghost-subtle-bg: oklab(0.941 0.0292798 0.00653408);
189
+ --palette-destructive-ghost-subtle-edge: oklab(0.514 0.212373 0.0646656);
190
+ --palette-destructive-ghost-subtle-bg-hover: oklab(0.880925 0.0524621 0.0145903);
191
+ --palette-destructive-ghost-subtle-edge-hover: oklab(0.51189 0.194868 0.0640785);
192
+ --palette-info-solid-bg: oklab(0.511 0.0317755 -0.260066);
193
+ --palette-info-solid-fg: oklab(0.985 0 0);
194
+ --palette-info-solid-edge: oklab(0.511 0.0317755 -0.260066);
195
+ --palette-info-solid-bg-hover: oklab(0.490714 0.0309565 -0.24875);
196
+ --palette-info-solid-edge-hover: oklab(0.490714 0.0309565 -0.24875);
197
+ --palette-info-soft-fg: oklab(0.398 0.0250004 -0.193391);
198
+ --palette-info-soft-bg: oklab(0.511 0.0317755 -0.260066 / 0.12);
199
+ --palette-info-soft-edge: oklab(0.511 0.0317755 -0.260066 / 0.8944);
200
+ --palette-info-soft-bg-hover: oklab(0.490714 0.0309565 -0.24875 / 0.26);
201
+ --palette-info-soft-edge-hover: oklab(0.490714 0.0309565 -0.24875 / 0.9112);
202
+ --palette-info-soft-page-bg: oklab(0.92812 0.00381305 -0.0312079);
203
+ --palette-info-soft-page-edge: oklab(0.561054 0.02842 -0.232603);
204
+ --palette-info-soft-page-bg-hover: oklab(0.856486 0.0080487 -0.0646751);
205
+ --palette-info-soft-page-edge-hover: oklab(0.534607 0.0282076 -0.226661);
206
+ --palette-info-soft-subtle-bg: oklab(0.87972 0.00526838 -0.0610925);
207
+ --palette-info-soft-subtle-edge: oklab(0.555246 0.0285946 -0.236189);
208
+ --palette-info-soft-subtle-bg-hover: oklab(0.815786 0.0092725 -0.0898053);
209
+ --palette-info-soft-subtle-edge-hover: oklab(0.529723 0.0283545 -0.229677);
210
+ --palette-info-ghost-fg: oklab(0.398 0.0250004 -0.193391);
211
+ --palette-info-ghost-bg: oklab(0 0 0 / 0);
212
+ --palette-info-ghost-edge: oklab(0.511 0.0317755 -0.260066);
213
+ --palette-info-ghost-bg-hover: oklab(0.490714 0.0309565 -0.24875 / 0.14);
214
+ --palette-info-ghost-edge-hover: oklab(0.490714 0.0309565 -0.24875);
215
+ --palette-info-ghost-page-bg: oklab(0.985 0 0);
216
+ --palette-info-ghost-page-edge: oklab(0.511 0.0317755 -0.260066);
217
+ --palette-info-ghost-page-bg-hover: oklab(0.9158 0.00433391 -0.034825);
218
+ --palette-info-ghost-page-edge-hover: oklab(0.490714 0.0309565 -0.24875);
219
+ --palette-info-ghost-subtle-bg: oklab(0.93 0.00165378 -0.0339598);
220
+ --palette-info-ghost-subtle-edge: oklab(0.511 0.0317755 -0.260066);
221
+ --palette-info-ghost-subtle-bg-hover: oklab(0.8685 0.00575617 -0.0640304);
222
+ --palette-info-ghost-subtle-edge-hover: oklab(0.490714 0.0309565 -0.24875);
223
+ --palette-border: oklch(0.708 0 0);
224
+ --palette-surface: oklch(0.922 0 0);
225
+ --palette-text: oklch(0.145 0 0);
226
+ }
227
+
228
+ .dark,
229
+ .theme-dark,
230
+ [data-theme="dark"] {
231
+ --palette-neutral-solid-bg: oklab(0.985 0 0 / 0.2);
232
+ --palette-neutral-solid-fg: oklab(0.97 0 0);
233
+ --palette-neutral-solid-edge: oklab(0.985 0 0 / 0.2);
234
+ --palette-neutral-solid-bg-hover: oklab(0.922 0 0 / 0.34);
235
+ --palette-neutral-solid-edge-hover: oklab(0.922 0 0 / 0.34);
236
+ --palette-neutral-soft-fg: oklab(0.97 0 0);
237
+ --palette-neutral-soft-bg: oklab(0.985 0 0 / 0.12);
238
+ --palette-neutral-soft-edge: oklab(0.380886 0 0 / 0.8944);
239
+ --palette-neutral-soft-bg-hover: oklab(0.922 0 0 / 0.26);
240
+ --palette-neutral-soft-edge-hover: oklab(0.922 0 0 / 0.9112);
241
+ --palette-neutral-soft-page-bg: oklab(0.2458 0 0);
242
+ --palette-neutral-soft-page-edge: oklab(0.355976 0 0);
243
+ --palette-neutral-soft-page-bg-hover: oklab(0.34702 0 0);
244
+ --palette-neutral-soft-page-edge-hover: oklab(0.853002 0 0);
245
+ --palette-neutral-soft-subtle-bg: oklab(0.35492 0 0);
246
+ --palette-neutral-soft-subtle-edge: oklab(0.36907 0 0);
247
+ --palette-neutral-soft-subtle-bg-hover: oklab(0.43878 0 0);
248
+ --palette-neutral-soft-subtle-edge-hover: oklab(0.864014 0 0);
249
+ --palette-neutral-ghost-fg: oklab(0.97 0 0);
250
+ --palette-neutral-ghost-bg: oklab(0 0 0 / 0);
251
+ --palette-neutral-ghost-edge: oklab(0.371 0 0);
252
+ --palette-neutral-ghost-bg-hover: oklab(0.922 0 0 / 0.14);
253
+ --palette-neutral-ghost-edge-hover: oklab(0.922 0 0);
254
+ --palette-neutral-ghost-page-bg: oklab(0.145 0 0);
255
+ --palette-neutral-ghost-page-edge: oklab(0.371 0 0);
256
+ --palette-neutral-ghost-page-bg-hover: oklab(0.25378 0 0);
257
+ --palette-neutral-ghost-page-edge-hover: oklab(0.922 0 0);
258
+ --palette-neutral-ghost-subtle-bg: oklab(0.269 0 0);
259
+ --palette-neutral-ghost-subtle-edge: oklab(0.371 0 0);
260
+ --palette-neutral-ghost-subtle-bg-hover: oklab(0.36042 0 0);
261
+ --palette-neutral-ghost-subtle-edge-hover: oklab(0.922 0 0);
262
+ --palette-primary-solid-bg: oklab(0.985 0 0);
263
+ --palette-primary-solid-fg: oklab(0.145 0 0);
264
+ --palette-primary-solid-edge: oklab(0.985 0 0);
265
+ --palette-primary-solid-bg-hover: oklab(0.922 0 0);
266
+ --palette-primary-solid-edge-hover: oklab(0.922 0 0);
267
+ --palette-primary-soft-fg: oklab(0.97 0 0);
268
+ --palette-primary-soft-bg: oklab(0.985 0 0 / 0.12);
269
+ --palette-primary-soft-edge: oklab(0.985 0 0 / 0.8944);
270
+ --palette-primary-soft-bg-hover: oklab(0.922 0 0 / 0.26);
271
+ --palette-primary-soft-edge-hover: oklab(0.922 0 0 / 0.9112);
272
+ --palette-primary-soft-page-bg: oklab(0.2458 0 0);
273
+ --palette-primary-soft-page-edge: oklab(0.896296 0 0);
274
+ --palette-primary-soft-page-bg-hover: oklab(0.34702 0 0);
275
+ --palette-primary-soft-page-edge-hover: oklab(0.853002 0 0);
276
+ --palette-primary-soft-subtle-bg: oklab(0.2986 0 0);
277
+ --palette-primary-soft-subtle-edge: oklab(0.902632 0 0);
278
+ --palette-primary-soft-subtle-bg-hover: oklab(0.39142 0 0);
279
+ --palette-primary-soft-subtle-edge-hover: oklab(0.85833 0 0);
280
+ --palette-primary-ghost-fg: oklab(0.97 0 0);
281
+ --palette-primary-ghost-bg: oklab(0 0 0 / 0);
282
+ --palette-primary-ghost-edge: oklab(0.985 0 0);
283
+ --palette-primary-ghost-bg-hover: oklab(0.922 0 0 / 0.14);
284
+ --palette-primary-ghost-edge-hover: oklab(0.922 0 0);
285
+ --palette-primary-ghost-page-bg: oklab(0.145 0 0);
286
+ --palette-primary-ghost-page-edge: oklab(0.985 0 0);
287
+ --palette-primary-ghost-page-bg-hover: oklab(0.25378 0 0);
288
+ --palette-primary-ghost-page-edge-hover: oklab(0.922 0 0);
289
+ --palette-primary-ghost-subtle-bg: oklab(0.205 0 0);
290
+ --palette-primary-ghost-subtle-edge: oklab(0.985 0 0);
291
+ --palette-primary-ghost-subtle-bg-hover: oklab(0.30538 0 0);
292
+ --palette-primary-ghost-subtle-edge-hover: oklab(0.922 0 0);
293
+ --palette-secondary-solid-bg: oklab(0.708 0 0);
294
+ --palette-secondary-solid-fg: oklab(0.145 0 0);
295
+ --palette-secondary-solid-edge: oklab(0.708 0 0);
296
+ --palette-secondary-solid-bg-hover: oklab(0.87 0 0);
297
+ --palette-secondary-solid-edge-hover: oklab(0.87 0 0);
298
+ --palette-secondary-soft-fg: oklab(0.922 0 0);
299
+ --palette-secondary-soft-bg: oklab(0.708 0 0 / 0.12);
300
+ --palette-secondary-soft-edge: oklab(0.708 0 0 / 0.8944);
301
+ --palette-secondary-soft-bg-hover: oklab(0.87 0 0 / 0.26);
302
+ --palette-secondary-soft-edge-hover: oklab(0.87 0 0 / 0.9112);
303
+ --palette-secondary-soft-page-bg: oklab(0.21256 0 0);
304
+ --palette-secondary-soft-page-edge: oklab(0.648547 0 0);
305
+ --palette-secondary-soft-page-bg-hover: oklab(0.3335 0 0);
306
+ --palette-secondary-soft-page-edge-hover: oklab(0.80562 0 0);
307
+ --palette-secondary-soft-subtle-bg: oklab(0.32168 0 0);
308
+ --palette-secondary-soft-subtle-edge: oklab(0.661642 0 0);
309
+ --palette-secondary-soft-subtle-bg-hover: oklab(0.42526 0 0);
310
+ --palette-secondary-soft-subtle-edge-hover: oklab(0.816631 0 0);
311
+ --palette-secondary-ghost-fg: oklab(0.922 0 0);
312
+ --palette-secondary-ghost-bg: oklab(0 0 0 / 0);
313
+ --palette-secondary-ghost-edge: oklab(0.708 0 0);
314
+ --palette-secondary-ghost-bg-hover: oklab(0.87 0 0 / 0.14);
315
+ --palette-secondary-ghost-edge-hover: oklab(0.87 0 0);
316
+ --palette-secondary-ghost-page-bg: oklab(0.145 0 0);
317
+ --palette-secondary-ghost-page-edge: oklab(0.708 0 0);
318
+ --palette-secondary-ghost-page-bg-hover: oklab(0.2465 0 0);
319
+ --palette-secondary-ghost-page-edge-hover: oklab(0.87 0 0);
320
+ --palette-secondary-ghost-subtle-bg: oklab(0.269 0 0);
321
+ --palette-secondary-ghost-subtle-edge: oklab(0.708 0 0);
322
+ --palette-secondary-ghost-subtle-bg-hover: oklab(0.35314 0 0);
323
+ --palette-secondary-ghost-subtle-edge-hover: oklab(0.87 0 0);
324
+ --palette-success-solid-bg: oklab(0.508 -0.114299 0.0293215);
325
+ --palette-success-solid-fg: oklab(0.985 0 0);
326
+ --palette-success-solid-edge: oklab(0.508 -0.114299 0.0293215);
327
+ --palette-success-solid-bg-hover: oklab(0.572945 -0.116429 0.0314383);
328
+ --palette-success-solid-edge-hover: oklab(0.572945 -0.116429 0.0314383);
329
+ --palette-success-soft-fg: oklab(0.845 -0.138113 0.0370641);
330
+ --palette-success-soft-bg: oklab(0.508 -0.114299 0.0293215 / 0.12);
331
+ --palette-success-soft-edge: oklab(0.508 -0.114299 0.0293215 / 0.8944);
332
+ --palette-success-soft-bg-hover: oklab(0.572945 -0.116429 0.0314383 / 0.26);
333
+ --palette-success-soft-edge-hover: oklab(0.572945 -0.116429 0.0314383 / 0.9112);
334
+ --palette-success-soft-page-bg: oklab(0.18856 -0.0137159 0.00351857);
335
+ --palette-success-soft-page-edge: oklab(0.469667 -0.102229 0.0262251);
336
+ --palette-success-soft-page-bg-hover: oklab(0.256266 -0.0302715 0.00817395);
337
+ --palette-success-soft-page-edge-hover: oklab(0.534944 -0.10609 0.0286465);
338
+ --palette-success-soft-subtle-bg: oklab(0.3936 -0.0802174 0.0165174);
339
+ --palette-success-soft-subtle-edge: oklab(0.494272 -0.110209 0.027785);
340
+ --palette-success-soft-subtle-bg-hover: oklab(0.428686 -0.0861932 0.0191048);
341
+ --palette-success-soft-subtle-edge-hover: oklab(0.555634 -0.1128 0.0299582);
342
+ --palette-success-ghost-fg: oklab(0.845 -0.138113 0.0370641);
343
+ --palette-success-ghost-bg: oklab(0 0 0 / 0);
344
+ --palette-success-ghost-edge: oklab(0.508 -0.114299 0.0293215);
345
+ --palette-success-ghost-bg-hover: oklab(0.572945 -0.116429 0.0314383 / 0.14);
346
+ --palette-success-ghost-edge-hover: oklab(0.572945 -0.116429 0.0314383);
347
+ --palette-success-ghost-page-bg: oklab(0.145 0 0);
348
+ --palette-success-ghost-page-edge: oklab(0.508 -0.114299 0.0293215);
349
+ --palette-success-ghost-page-bg-hover: oklab(0.204912 -0.0163 0.00440136);
350
+ --palette-success-ghost-page-edge-hover: oklab(0.572945 -0.116429 0.0314383);
351
+ --palette-success-ghost-subtle-bg: oklab(0.378 -0.0755699 0.0147714);
352
+ --palette-success-ghost-subtle-edge: oklab(0.508 -0.114299 0.0293215);
353
+ --palette-success-ghost-subtle-bg-hover: oklab(0.405292 -0.0812901 0.0171048);
354
+ --palette-success-ghost-subtle-edge-hover: oklab(0.572945 -0.116429 0.0314383);
355
+ --palette-warning-solid-bg: oklab(0.666 0.0940116 0.152325);
356
+ --palette-warning-solid-fg: oklab(0.145 0 0);
357
+ --palette-warning-solid-edge: oklab(0.666 0.0940116 0.152325);
358
+ --palette-warning-solid-bg-hover: oklab(0.70431 0.0802 0.143076);
359
+ --palette-warning-solid-edge-hover: oklab(0.70431 0.0802 0.143076);
360
+ --palette-warning-soft-fg: oklab(0.879 -0.00473352 0.168934);
361
+ --palette-warning-soft-bg: oklab(0.666 0.0940116 0.152325 / 0.12);
362
+ --palette-warning-soft-edge: oklab(0.666 0.0940116 0.152325 / 0.8944);
363
+ --palette-warning-soft-bg-hover: oklab(0.70431 0.0802 0.143076 / 0.26);
364
+ --palette-warning-soft-edge-hover: oklab(0.70431 0.0802 0.143076 / 0.9112);
365
+ --palette-warning-soft-page-bg: oklab(0.20752 0.0112814 0.018279);
366
+ --palette-warning-soft-page-edge: oklab(0.610982 0.0840839 0.136239);
367
+ --palette-warning-soft-page-bg-hover: oklab(0.290421 0.020852 0.0371997);
368
+ --palette-warning-soft-page-edge-hover: oklab(0.654644 0.0730783 0.130371);
369
+ --palette-warning-soft-subtle-bg: oklab(0.44424 0.0798656 0.0890623);
370
+ --palette-warning-soft-subtle-edge: oklab(0.639389 0.092314 0.144733);
371
+ --palette-warning-soft-subtle-bg-hover: oklab(0.489481 0.0785251 0.0967221);
372
+ --palette-warning-soft-subtle-edge-hover: oklab(0.678531 0.079999 0.137513);
373
+ --palette-warning-ghost-fg: oklab(0.879 -0.00473352 0.168934);
374
+ --palette-warning-ghost-bg: oklab(0 0 0 / 0);
375
+ --palette-warning-ghost-edge: oklab(0.666 0.0940116 0.152325);
376
+ --palette-warning-ghost-bg-hover: oklab(0.70431 0.0802 0.143076 / 0.14);
377
+ --palette-warning-ghost-edge-hover: oklab(0.70431 0.0802 0.143076);
378
+ --palette-warning-ghost-page-bg: oklab(0.145 0 0);
379
+ --palette-warning-ghost-page-edge: oklab(0.666 0.0940116 0.152325);
380
+ --palette-warning-ghost-page-bg-hover: oklab(0.223303 0.011228 0.0200306);
381
+ --palette-warning-ghost-page-edge-hover: oklab(0.70431 0.0802 0.143076);
382
+ --palette-warning-ghost-subtle-bg: oklab(0.414 0.0779366 0.0804356);
383
+ --palette-warning-ghost-subtle-edge: oklab(0.666 0.0940116 0.152325);
384
+ --palette-warning-ghost-subtle-bg-hover: oklab(0.454643 0.0782535 0.0892052);
385
+ --palette-warning-ghost-subtle-edge-hover: oklab(0.70431 0.0802 0.143076);
386
+ --palette-destructive-solid-bg: oklab(0.514 0.212373 0.0646656);
387
+ --palette-destructive-solid-fg: oklab(0.985 0 0);
388
+ --palette-destructive-solid-edge: oklab(0.514 0.212373 0.0646656);
389
+ --palette-destructive-solid-bg-hover: oklab(0.549356 0.21195 0.0500346);
390
+ --palette-destructive-solid-edge-hover: oklab(0.549356 0.21195 0.0500346);
391
+ --palette-destructive-soft-fg: oklab(0.81 0.114595 0.0236021);
392
+ --palette-destructive-soft-bg: oklab(0.514 0.212373 0.0646656 / 0.12);
393
+ --palette-destructive-soft-edge: oklab(0.514 0.212373 0.0646656 / 0.8944);
394
+ --palette-destructive-soft-bg-hover: oklab(0.549356 0.21195 0.0500346 / 0.26);
395
+ --palette-destructive-soft-edge-hover: oklab(0.549356 0.21195 0.0500346 / 0.9112);
396
+ --palette-destructive-soft-page-bg: oklab(0.18928 0.0254848 0.00775988);
397
+ --palette-destructive-soft-page-edge: oklab(0.475034 0.189947 0.0578369);
398
+ --palette-destructive-soft-page-bg-hover: oklab(0.250132 0.0551069 0.013009);
399
+ --palette-destructive-soft-page-edge-hover: oklab(0.513449 0.193128 0.0455916);
400
+ --palette-destructive-soft-subtle-bg: oklab(0.42248 0.163162 0.0327106);
401
+ --palette-destructive-soft-subtle-edge: oklab(0.503018 0.206468 0.060831);
402
+ --palette-destructive-soft-subtle-bg-hover: oklab(0.446232 0.170881 0.0339903);
403
+ --palette-destructive-soft-subtle-edge-hover: oklab(0.536981 0.207021 0.0481093);
404
+ --palette-destructive-ghost-fg: oklab(0.81 0.114595 0.0236021);
405
+ --palette-destructive-ghost-bg: oklab(0 0 0 / 0);
406
+ --palette-destructive-ghost-edge: oklab(0.514 0.212373 0.0646656);
407
+ --palette-destructive-ghost-bg-hover: oklab(0.549356 0.21195 0.0500346 / 0.14);
408
+ --palette-destructive-ghost-edge-hover: oklab(0.549356 0.21195 0.0500346);
409
+ --palette-destructive-ghost-page-bg: oklab(0.145 0 0);
410
+ --palette-destructive-ghost-page-edge: oklab(0.514 0.212373 0.0646656);
411
+ --palette-destructive-ghost-page-bg-hover: oklab(0.20161 0.0296729 0.00700485);
412
+ --palette-destructive-ghost-page-edge-hover: oklab(0.549356 0.21195 0.0500346);
413
+ --palette-destructive-ghost-subtle-bg: oklab(0.41 0.156452 0.0283531);
414
+ --palette-destructive-ghost-subtle-edge: oklab(0.514 0.212373 0.0646656);
415
+ --palette-destructive-ghost-subtle-bg-hover: oklab(0.42951 0.164221 0.0313885);
416
+ --palette-destructive-ghost-subtle-edge-hover: oklab(0.549356 0.21195 0.0500346);
417
+ --palette-info-solid-bg: oklab(0.511 0.0317755 -0.260066);
418
+ --palette-info-solid-fg: oklab(0.985 0 0);
419
+ --palette-info-solid-edge: oklab(0.511 0.0317755 -0.260066);
420
+ --palette-info-solid-bg-hover: oklab(0.551929 0.0373722 -0.238521);
421
+ --palette-info-solid-edge-hover: oklab(0.551929 0.0373722 -0.238521);
422
+ --palette-info-soft-fg: oklab(0.785 0.00944898 -0.114611);
423
+ --palette-info-soft-bg: oklab(0.511 0.0317755 -0.260066 / 0.12);
424
+ --palette-info-soft-edge: oklab(0.511 0.0317755 -0.260066 / 0.8944);
425
+ --palette-info-soft-bg-hover: oklab(0.551929 0.0373722 -0.238521 / 0.26);
426
+ --palette-info-soft-edge-hover: oklab(0.551929 0.0373722 -0.238521 / 0.9112);
427
+ --palette-info-soft-page-bg: oklab(0.18892 0.00381305 -0.0312079);
428
+ --palette-info-soft-page-edge: oklab(0.47235 0.02842 -0.232603);
429
+ --palette-info-soft-page-bg-hover: oklab(0.250801 0.00971677 -0.0620155);
430
+ --palette-info-soft-page-edge-hover: oklab(0.515793 0.0340535 -0.217341);
431
+ --palette-info-soft-subtle-bg: oklab(0.37724 0.0229742 -0.156471);
432
+ --palette-info-soft-subtle-edge: oklab(0.494949 0.0307193 -0.247635);
433
+ --palette-info-soft-subtle-bg-hover: oklab(0.409161 0.0258296 -0.16735);
434
+ --palette-info-soft-subtle-edge-hover: oklab(0.534797 0.0359871 -0.229981);
435
+ --palette-info-ghost-fg: oklab(0.785 0.00944898 -0.114611);
436
+ --palette-info-ghost-bg: oklab(0 0 0 / 0);
437
+ --palette-info-ghost-edge: oklab(0.511 0.0317755 -0.260066);
438
+ --palette-info-ghost-bg-hover: oklab(0.551929 0.0373722 -0.238521 / 0.14);
439
+ --palette-info-ghost-edge-hover: oklab(0.551929 0.0373722 -0.238521);
440
+ --palette-info-ghost-page-bg: oklab(0.145 0 0);
441
+ --palette-info-ghost-page-edge: oklab(0.511 0.0317755 -0.260066);
442
+ --palette-info-ghost-page-bg-hover: oklab(0.20197 0.00523211 -0.033393);
443
+ --palette-info-ghost-page-edge-hover: oklab(0.551929 0.0373722 -0.238521);
444
+ --palette-info-ghost-subtle-bg: oklab(0.359 0.0217741 -0.142344);
445
+ --palette-info-ghost-subtle-edge: oklab(0.511 0.0317755 -0.260066);
446
+ --palette-info-ghost-subtle-bg-hover: oklab(0.38601 0.0239578 -0.155809);
447
+ --palette-info-ghost-subtle-edge-hover: oklab(0.551929 0.0373722 -0.238521);
448
+ --palette-border: oklch(0.371 0 0);
449
+ --palette-surface: oklch(0.269 0 0);
450
+ --palette-text: oklch(0.985 0 0);
451
+ }
package/dist/tw/theme.css CHANGED
@@ -35,7 +35,6 @@
35
35
  page and picked it for the same reason, "the heaviest grey that still
36
36
  leaves a field legible." Dark is unchanged. */
37
37
  --color-border: light-dark(var(--color-neutral-400), var(--color-neutral-700));
38
- --color-border-hover: light-dark(var(--color-neutral-600), var(--color-neutral-500));
39
38
 
40
39
  /* A text control's line is the only thing identifying it: the box is
41
40
  transparent at rest, so nothing else marks where typing goes.
@@ -138,6 +137,20 @@
138
137
  --breakpoint-2xl: 90rem;
139
138
  }
140
139
 
140
+ /* Tailwind only keeps a `@theme` variable in the compiled output when it
141
+ detects that variable being used somewhere in this package's own source --
142
+ everything above earns its keep that way, through `intent.css` or a
143
+ component reading it. `--color-border-hover` is different: `docs/usage/
144
+ theming.md` documents it as a public override point like every other row
145
+ in that table, but nothing in this package draws a border that darkens on
146
+ hover, so nothing here ever references it, and Tailwind quietly dropped it
147
+ from every compiled stylesheet. `static` forces it to compile regardless,
148
+ so the token a consumer's docs promise is the token their `var()` actually
149
+ resolves. */
150
+ @theme static {
151
+ --color-border-hover: light-dark(var(--color-neutral-600), var(--color-neutral-500));
152
+ }
153
+
141
154
  :root {
142
155
  /* Both keywords: the system preference decides, and the explicit theme
143
156
  selectors below override it at any depth because `color-scheme` inherits. */
package/docs/accessibility.md CHANGED
@@ -26,13 +26,14 @@ This package provides CSS hooks for accessible states. It does not provide seman
26
26
 
27
27
  ### Control boundaries
28
28
 
29
- | Feature | Behavior |
30
- | -------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
31
- | Control boundaries | Text controls rest at `--_line-rest` of their intent, under 3:1 by choice; hover and focus take the tone whole. |
32
- | Toggle boundaries | `.checkbox`, `.radio`, and `.switch` draw their line whole, because it is the only thing marking an unchecked box. |
33
- | Cascaded `.edgeless` | Floored on every text control: a container cannot erase the line of a field or toggle nobody classed. |
34
- | Own `.edgeless` | On the element, `.ipt`, `.textarea`, `.select`, and `.switch` do drop their line and do not meet 1.4.11 at rest, except `.switch.ghost`: `.ghost` already asks for zero fill, so dropping the line too would leave no boundary at all, and `.switch.ghost.edgeless` keeps it up instead. |
35
- | `.checkbox`/`.radio` | Never drop their line, on the element or from a container. `.edgeless` on them is unsupported, not merely discouraged. |
29
+ | Feature | Behavior |
30
+ | -------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
31
+ | Control boundaries | Text controls rest at `--_line-rest` of their intent, under 3:1 by choice; hover and focus take the tone whole. |
32
+ | Toggle boundaries | `.checkbox`, `.radio`, and `.switch` draw their line whole, because it is the only thing marking an unchecked box. |
33
+ | Cascaded `.edgeless` | Floored on every text control: a container cannot erase the line of a field or toggle nobody classed. |
34
+ | Own `.edgeless` | On the element, `.ipt`, `.textarea`, `.select`, and `.switch` do drop their line and do not meet 1.4.11 at rest, except `.switch.ghost`: `.ghost` already asks for zero fill, so dropping the line too would leave no boundary at all, and `.switch.ghost.edgeless` keeps it up instead. |
35
+ | `.checkbox`/`.radio` | Never drop their line, on the element or from a container. `.edgeless` on them is unsupported, not merely discouraged. |
36
+ | Progress track | Known gap. `.progress`'s registered default, `.soft.edgeless`, does not meet 1.4.11 at rest -- measured ~1.1-1.3:1 against the page in both themes and across intents, down from the ~3.6-4.3:1 the prior fixed-neutral track cleared. An `.edged` presentation restores a boundary through the line for most intents (`primary.soft.edged` ~15:1), but not every one clears 3:1 there either (`warning.soft.edged` ~2.7:1). A consumer whose track must meet 1.4.11 should choose an `.edged` presentation and verify the intents they use, until this is resolved. |
36
37
 
37
38
  ### Motion and transparency
38
39
 
package/docs/changelog/0.3.0.md ADDED
@@ -0,0 +1,15 @@
1
+ ---
2
+ title: 0.3.0
3
+ date: 2026-09-17
4
+ ---
5
+
6
+ # 0.3.0
7
+
8
+ ## Added
9
+
10
+ - **`@codenhub/styles/palette`**, a generated, self-contained stylesheet of every `intent x presentation` cell's composed colors -- `--palette-<intent>-<presentation>[-<ground>]-<slot>[-hover]` custom properties, already-composited light and dark values, for a consumer that cannot take this package as a build-time dependency (an optional peer, for example) but wants to look consistent with it. Not a replacement for the components themselves when Tailwind is available. Also includes `--palette-border`/`--palette-surface`/`--palette-text`, flat values for the three neutral surface tokens that sit outside the intent x presentation cross. See [Customizing → Generated palette](../usage/customizing.md#generated-palette).
11
+
12
+ ## Changed
13
+
14
+ - **`.progress`'s track reads presentation.** It used to be intent-only, like `.loader`, `.skeleton`, and `.divider`; now it composes a fill and an edge like `.quote` does, while the moving value fill stays `--intent-color` at full strength, unaffected by presentation. The registered default is `.soft.edgeless`, chosen to stay closest to the previous fixed-neutral look, but it renders differently than before: it now tints by intent instead of a fixed grey, and every existing `.progress` gets that new look with no markup change. `.solid` is unsupported on the track (a fully-filled track and the value fill it carries would become the same color); `.ghost.edgeless` renders but is discouraged, since it leaves the track with neither fill nor line.
15
+ - **Known issue: the new `.progress.soft.edgeless` default does not meet WCAG 1.4.11's 3:1 non-text contrast floor.** Measured at roughly 1.1-1.3:1 against the page, in both themes and across intents -- down from the ~3.6-4.3:1 the prior fixed-neutral track cleared. An `.edged` presentation restores a boundary through the line for most intents, but not all of them clear 3:1 there either (`warning.soft.edged` measured ~2.7:1). A consumer whose track must meet 1.4.11 should choose an `.edged` presentation and verify the intents they use. See [Accessibility](../accessibility.md#control-boundaries).
package/docs/changelog/index.md CHANGED
@@ -6,6 +6,7 @@ group: Changelog
6
6
 
7
7
  # Changelog
8
8
 
9
+ - [0.3.0](0.3.0.md)
9
10
  - [0.2.0](0.2.0.md)
10
11
  - [0.1.1](0.1.1.md)
11
12
  - [0.1.0](0.1.0.md)
package/docs/setup.md CHANGED
@@ -82,28 +82,29 @@ The one place it does not track the token theme: nesting an explicit selector in
82
82
 
83
83
  Compiled entrypoints are ready-to-import CSS and require only tooling that can resolve package CSS imports. `/tw` entrypoints publish copied, uncompiled source from `dist/tw`; a Tailwind v4 build must still process their `@theme`, `@utility`, `@apply`, and related directives. Focused source component entrypoints include theme tokens so their classes can work independently.
84
84
 
85
- | Import path | Composition and effects |
86
- | -------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
87
- | `@codenhub/styles` | Compiled complete surface: Tailwind base/theme output, tokens, typography, utilities, components, and reset. Applies global reset, root theme, and focus rules. |
88
- | `@codenhub/styles/theme` | Compiled Tailwind theme variables, Codenhub tokens, and the presentation classes. Sets root theme properties and system/explicit theme selectors; no reset or component classes. |
89
- | `@codenhub/styles/components` | Compiled theme tokens, typography utilities, and every component class. Includes static reduced-motion loader masks; no reset, layout/content utilities, or native mappings. |
90
- | `@codenhub/styles/native` | Compiled complete surface plus classless mappings for headings, text, content elements, form controls, and buttons. Applies the reset and broad element selectors. |
91
- | `@codenhub/styles/aesthetics` | Compiled `.neobrutalism`, `.glass`, `.pixel`, and `.chunky-tile` classes. Adds no tokens or components of its own; import after the base stylesheet. |
92
- | `@codenhub/styles/aesthetics/*` | One compiled aesthetic: `/neobrutalism`, `/glass`, `/pixel`, or `/chunky-tile`. Same rules and ordering as the combined file. |
93
- | `@codenhub/styles/tw` | Source equivalent of the complete stylesheet. Imports Tailwind itself, theme, typography, utilities, components, and reset; applies the same global rules. |
94
- | `@codenhub/styles/tw/theme` | Source theme, tokens, and presentation classes. Imports Tailwind's theme layer; emits root/system/explicit theme selectors and defines the package's custom `dark:` variant. |
95
- | `@codenhub/styles/tw/components` | Published Tailwind source for theme, typography, buttons, feedback, forms, loaders, surfaces, and tooltips, including static reduced-motion loader masks. No reset, layout/content utilities, or native mappings. |
96
- | `@codenhub/styles/tw/surface` | Source theme plus `.surface`, `.card`, and `.panel`. |
97
- | `@codenhub/styles/tw/button` | Published Tailwind source for theme and `.btn`. Pair it with `/tw/loader` for a loading state composed from `.loader`. |
98
- | `@codenhub/styles/tw/form` | Source theme plus field, public `text-control`, input, textarea, select, checkbox, radio, and switch utilities. |
99
- | `@codenhub/styles/tw/feedback` | Source theme plus alert, badge, skeleton, and progress utilities and their keyframes. |
100
- | `@codenhub/styles/tw/loader` | Published Tailwind source for activity indicators and loaders, including static reduced-motion masks. It has no theme or reset side effects and uses `currentColor`. |
101
- | `@codenhub/styles/tw/tooltip` | Source theme plus tooltip utilities. |
102
- | `@codenhub/styles/tw/reset` | Source theme, typography utilities, and global reset/accessibility rules. It changes root/body/elements and selection, motion, focus, scrollbar, and forced colors. |
103
- | `@codenhub/styles/tw/native` | Source complete surface plus reset and classless native-element mappings; broadest global effects. |
104
- | `@codenhub/styles/tw/typography` | Source theme plus typography utilities; sets theme selectors but no reset or classless mappings. |
105
- | `@codenhub/styles/tw/utilities` | Source theme and typography composition plus layout and content utilities; safelists the package utility names. |
106
- | `@codenhub/styles/tw/aesthetics` | Source aesthetics, combined. `/tw/aesthetics/neobrutalism`, `/glass`, `/pixel`, and `/chunky-tile` publish one apiece. Plain CSS with no theme or reset side effects. |
85
+ | Import path | Composition and effects |
86
+ | -------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
87
+ | `@codenhub/styles` | Compiled complete surface: Tailwind base/theme output, tokens, typography, utilities, components, and reset. Applies global reset, root theme, and focus rules. |
88
+ | `@codenhub/styles/theme` | Compiled Tailwind theme variables, Codenhub tokens, and the presentation classes. Sets root theme properties and system/explicit theme selectors; no reset or component classes. |
89
+ | `@codenhub/styles/palette` | Generated, self-contained `--palette-*` custom properties: every intent/presentation cell's fill, text, and edge color, plus the flat `border`/`surface`/`text` neutral tokens, pre-composed to a flat value. For a consumer that cannot take this package as a build-time dependency (an optional peer, for example) but wants to look consistent with it. Not a replacement for the components themselves when Tailwind is available -- see [Customizing → Generated palette](./usage/customizing.md#generated-palette). |
90
+ | `@codenhub/styles/components` | Compiled theme tokens, typography utilities, and every component class. Includes static reduced-motion loader masks; no reset, layout/content utilities, or native mappings. |
91
+ | `@codenhub/styles/native` | Compiled complete surface plus classless mappings for headings, text, content elements, form controls, and buttons. Applies the reset and broad element selectors. |
92
+ | `@codenhub/styles/aesthetics` | Compiled `.neobrutalism`, `.glass`, `.pixel`, and `.chunky-tile` classes. Adds no tokens or components of its own; import after the base stylesheet. |
93
+ | `@codenhub/styles/aesthetics/*` | One compiled aesthetic: `/neobrutalism`, `/glass`, `/pixel`, or `/chunky-tile`. Same rules and ordering as the combined file. |
94
+ | `@codenhub/styles/tw` | Source equivalent of the complete stylesheet. Imports Tailwind itself, theme, typography, utilities, components, and reset; applies the same global rules. |
95
+ | `@codenhub/styles/tw/theme` | Source theme, tokens, and presentation classes. Imports Tailwind's theme layer; emits root/system/explicit theme selectors and defines the package's custom `dark:` variant. |
96
+ | `@codenhub/styles/tw/components` | Published Tailwind source for theme, typography, buttons, feedback, forms, loaders, surfaces, and tooltips, including static reduced-motion loader masks. No reset, layout/content utilities, or native mappings. |
97
+ | `@codenhub/styles/tw/surface` | Source theme plus `.surface`, `.card`, and `.panel`. |
98
+ | `@codenhub/styles/tw/button` | Published Tailwind source for theme and `.btn`. Pair it with `/tw/loader` for a loading state composed from `.loader`. |
99
+ | `@codenhub/styles/tw/form` | Source theme plus field, public `text-control`, input, textarea, select, checkbox, radio, and switch utilities. |
100
+ | `@codenhub/styles/tw/feedback` | Source theme plus alert, badge, skeleton, and progress utilities and their keyframes. |
101
+ | `@codenhub/styles/tw/loader` | Published Tailwind source for activity indicators and loaders, including static reduced-motion masks. It has no theme or reset side effects and uses `currentColor`. |
102
+ | `@codenhub/styles/tw/tooltip` | Source theme plus tooltip utilities. |
103
+ | `@codenhub/styles/tw/reset` | Source theme, typography utilities, and global reset/accessibility rules. It changes root/body/elements and selection, motion, focus, scrollbar, and forced colors. |
104
+ | `@codenhub/styles/tw/native` | Source complete surface plus reset and classless native-element mappings; broadest global effects. |
105
+ | `@codenhub/styles/tw/typography` | Source theme plus typography utilities; sets theme selectors but no reset or classless mappings. |
106
+ | `@codenhub/styles/tw/utilities` | Source theme and typography composition plus layout and content utilities; safelists the package utility names. |
107
+ | `@codenhub/styles/tw/aesthetics` | Source aesthetics, combined. `/tw/aesthetics/neobrutalism`, `/glass`, `/pixel`, and `/chunky-tile` publish one apiece. Plain CSS with no theme or reset side effects. |
107
108
 
108
109
  Avoid importing overlapping entrypoints in the same build unless duplicate generated CSS is acceptable; pick the narrowest entrypoint that covers what a page needs.
109
110