@opencode/theme 0.0.0-reserved → 2.0.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.
@@ -0,0 +1,8 @@
1
+ type OklchColor = {
2
+ l: number;
3
+ c: number;
4
+ h: number;
5
+ };
6
+ export declare function rgbToOklch(red: number, green: number, blue: number): OklchColor;
7
+ export declare function oklchToHex(color: OklchColor): string;
8
+ export {};
@@ -0,0 +1,67 @@
1
+ function clamp(value, min, max) {
2
+ return Math.max(min, Math.min(max, value));
3
+ }
4
+ function hue(value) {
5
+ return ((value % 360) + 360) % 360;
6
+ }
7
+ function linearToSrgb(value) {
8
+ if (value <= 0.0031308)
9
+ return value * 12.92;
10
+ return 1.055 * Math.pow(value, 1 / 2.4) - 0.055;
11
+ }
12
+ function srgbToLinear(value) {
13
+ if (value <= 0.04045)
14
+ return value / 12.92;
15
+ return Math.pow((value + 0.055) / 1.055, 2.4);
16
+ }
17
+ export function rgbToOklch(red, green, blue) {
18
+ const linearRed = srgbToLinear(red);
19
+ const linearGreen = srgbToLinear(green);
20
+ const linearBlue = srgbToLinear(blue);
21
+ const lRoot = Math.cbrt(0.4122214708 * linearRed + 0.5363325363 * linearGreen + 0.0514459929 * linearBlue);
22
+ const mRoot = Math.cbrt(0.2119034982 * linearRed + 0.6806995451 * linearGreen + 0.1073969566 * linearBlue);
23
+ const sRoot = Math.cbrt(0.0883024619 * linearRed + 0.2817188376 * linearGreen + 0.6299787005 * linearBlue);
24
+ const lightness = 0.2104542553 * lRoot + 0.793617785 * mRoot - 0.0040720468 * sRoot;
25
+ const a = 1.9779984951 * lRoot - 2.428592205 * mRoot + 0.4505937099 * sRoot;
26
+ const b = 0.0259040371 * lRoot + 0.7827717662 * mRoot - 0.808675766 * sRoot;
27
+ const chroma = Math.sqrt(a * a + b * b);
28
+ const angle = Math.atan2(b, a) * (180 / Math.PI);
29
+ return { l: lightness, c: chroma, h: angle < 0 ? angle + 360 : angle };
30
+ }
31
+ function oklchToRgb(color) {
32
+ const a = color.c * Math.cos((color.h * Math.PI) / 180);
33
+ const b = color.c * Math.sin((color.h * Math.PI) / 180);
34
+ const lRoot = color.l + 0.3963377774 * a + 0.2158037573 * b;
35
+ const mRoot = color.l - 0.1055613458 * a - 0.0638541728 * b;
36
+ const sRoot = color.l - 0.0894841775 * a - 1.291485548 * b;
37
+ const l = lRoot * lRoot * lRoot;
38
+ const m = mRoot * mRoot * mRoot;
39
+ const s = sRoot * sRoot * sRoot;
40
+ return {
41
+ r: linearToSrgb(4.0767416621 * l - 3.3077115913 * m + 0.2309699292 * s),
42
+ g: linearToSrgb(-1.2684380046 * l + 2.6097574011 * m - 0.3413193965 * s),
43
+ b: linearToSrgb(-0.0041960863 * l - 0.7034186147 * m + 1.707614701 * s),
44
+ };
45
+ }
46
+ function fitOklch(color) {
47
+ const base = { l: clamp(color.l, 0, 1), c: Math.max(0, color.c), h: hue(color.h) };
48
+ const rgb = oklchToRgb(base);
49
+ if (rgb.r >= 0 && rgb.r <= 1 && rgb.g >= 0 && rgb.g <= 1 && rgb.b >= 0 && rgb.b <= 1)
50
+ return base;
51
+ const fitted = Array.from({ length: 24 }).reduce((result, _, index) => {
52
+ if (result)
53
+ return result;
54
+ const next = { ...base, c: base.c * Math.pow(0.9, index + 1) };
55
+ const output = oklchToRgb(next);
56
+ if (output.r >= 0 && output.r <= 1 && output.g >= 0 && output.g <= 1 && output.b >= 0 && output.b <= 1)
57
+ return next;
58
+ }, undefined);
59
+ return fitted ?? { ...base, c: 0 };
60
+ }
61
+ export function oklchToHex(color) {
62
+ const rgb = oklchToRgb(fitOklch(color));
63
+ const toHex = (value) => Math.round(clamp(value, 0, 1) * 255)
64
+ .toString(16)
65
+ .padStart(2, "0");
66
+ return `#${toHex(rgb.r)}${toHex(rgb.g)}${toHex(rgb.b)}`;
67
+ }
@@ -0,0 +1,578 @@
1
+ export declare const DEFAULT_CATEGORICAL: readonly ["blue", "purple", "green", "orange", "red", "cyan"];
2
+ export declare const DEFAULT_THEME: {
3
+ version: 2;
4
+ light: {
5
+ hue: {
6
+ gray: {
7
+ 100: string;
8
+ 200: string;
9
+ 300: string;
10
+ 400: string;
11
+ 500: string;
12
+ 600: string;
13
+ 700: string;
14
+ 800: string;
15
+ 900: string;
16
+ };
17
+ red: {
18
+ 100: string;
19
+ 200: string;
20
+ 300: string;
21
+ 400: string;
22
+ 500: string;
23
+ 600: string;
24
+ 700: string;
25
+ 800: string;
26
+ 900: string;
27
+ };
28
+ orange: {
29
+ 100: string;
30
+ 200: string;
31
+ 300: string;
32
+ 400: string;
33
+ 500: string;
34
+ 600: string;
35
+ 700: string;
36
+ 800: string;
37
+ 900: string;
38
+ };
39
+ yellow: {
40
+ 100: string;
41
+ 200: string;
42
+ 300: string;
43
+ 400: string;
44
+ 500: string;
45
+ 600: string;
46
+ 700: string;
47
+ 800: string;
48
+ 900: string;
49
+ };
50
+ green: {
51
+ 100: string;
52
+ 200: string;
53
+ 300: string;
54
+ 400: string;
55
+ 500: string;
56
+ 600: string;
57
+ 700: string;
58
+ 800: string;
59
+ 900: string;
60
+ };
61
+ cyan: {
62
+ 100: string;
63
+ 200: string;
64
+ 300: string;
65
+ 400: string;
66
+ 500: string;
67
+ 600: string;
68
+ 700: string;
69
+ 800: string;
70
+ 900: string;
71
+ };
72
+ blue: {
73
+ 100: string;
74
+ 200: string;
75
+ 300: string;
76
+ 400: string;
77
+ 500: string;
78
+ 600: string;
79
+ 700: string;
80
+ 800: string;
81
+ 900: string;
82
+ };
83
+ purple: {
84
+ 100: string;
85
+ 200: string;
86
+ 300: string;
87
+ 400: string;
88
+ 500: string;
89
+ 600: string;
90
+ 700: string;
91
+ 800: string;
92
+ 900: string;
93
+ };
94
+ accent: "$hue.blue";
95
+ interactive: "$hue.blue";
96
+ neutral: "$hue.gray";
97
+ };
98
+ categorical: readonly ["blue", "purple", "green", "orange", "red", "cyan"];
99
+ text: {
100
+ default: string;
101
+ subdued: string;
102
+ action: {
103
+ primary: {
104
+ default: string;
105
+ $disabled: string;
106
+ };
107
+ secondary: {
108
+ default: string;
109
+ $hovered: string;
110
+ };
111
+ destructive: {
112
+ default: string;
113
+ $disabled: string;
114
+ };
115
+ };
116
+ formfield: {
117
+ default: string;
118
+ $focused: string;
119
+ $pressed: string;
120
+ $disabled: string;
121
+ $selected: string;
122
+ };
123
+ status: {
124
+ running: string;
125
+ question: string;
126
+ permission: string;
127
+ unread: string;
128
+ };
129
+ feedback: {
130
+ error: {
131
+ default: string;
132
+ subdued: string;
133
+ };
134
+ warning: {
135
+ default: string;
136
+ subdued: string;
137
+ };
138
+ success: {
139
+ default: string;
140
+ subdued: string;
141
+ };
142
+ info: {
143
+ default: string;
144
+ subdued: string;
145
+ };
146
+ };
147
+ };
148
+ background: {
149
+ default: string;
150
+ surface: {
151
+ offset: string;
152
+ overlay: string;
153
+ };
154
+ action: {
155
+ primary: {
156
+ default: string;
157
+ $hovered: string;
158
+ $focused: string;
159
+ $pressed: string;
160
+ $selected: string;
161
+ $disabled: string;
162
+ };
163
+ secondary: {
164
+ default: string;
165
+ };
166
+ destructive: {
167
+ default: string;
168
+ $hovered: string;
169
+ $focused: string;
170
+ $pressed: string;
171
+ $selected: string;
172
+ $disabled: string;
173
+ };
174
+ };
175
+ formfield: {
176
+ default: string;
177
+ $hovered: string;
178
+ $focused: string;
179
+ $pressed: string;
180
+ $disabled: string;
181
+ $selected: string;
182
+ };
183
+ feedback: {
184
+ error: {
185
+ default: string;
186
+ };
187
+ warning: {
188
+ default: string;
189
+ };
190
+ success: {
191
+ default: string;
192
+ };
193
+ info: {
194
+ default: string;
195
+ };
196
+ };
197
+ };
198
+ border: {
199
+ default: string;
200
+ };
201
+ scrollbar: {
202
+ default: string;
203
+ };
204
+ diff: {
205
+ text: {
206
+ added: string;
207
+ removed: string;
208
+ context: string;
209
+ hunkHeader: string;
210
+ };
211
+ background: {
212
+ added: string;
213
+ removed: string;
214
+ context: string;
215
+ };
216
+ highlight: {
217
+ added: string;
218
+ removed: string;
219
+ };
220
+ lineNumber: {
221
+ text: string;
222
+ background: {
223
+ added: string;
224
+ removed: string;
225
+ };
226
+ };
227
+ };
228
+ syntax: {
229
+ comment: string;
230
+ keyword: string;
231
+ function: string;
232
+ variable: string;
233
+ string: string;
234
+ number: string;
235
+ type: string;
236
+ operator: string;
237
+ punctuation: string;
238
+ };
239
+ markdown: {
240
+ text: string;
241
+ heading: string;
242
+ link: string;
243
+ linkText: string;
244
+ code: string;
245
+ blockQuote: string;
246
+ emphasis: string;
247
+ strong: string;
248
+ horizontalRule: string;
249
+ listItem: string;
250
+ listEnumeration: string;
251
+ image: string;
252
+ imageText: string;
253
+ codeBlock: string;
254
+ };
255
+ "@context:elevated": {
256
+ text: {
257
+ action: {
258
+ primary: {
259
+ default: string;
260
+ };
261
+ };
262
+ };
263
+ background: {
264
+ default: string;
265
+ action: {
266
+ primary: {
267
+ default: string;
268
+ $hovered: string;
269
+ };
270
+ };
271
+ };
272
+ };
273
+ "@context:overlay": {
274
+ text: {
275
+ action: {
276
+ primary: {
277
+ default: string;
278
+ };
279
+ };
280
+ };
281
+ background: {
282
+ default: string;
283
+ action: {
284
+ primary: {
285
+ default: string;
286
+ };
287
+ };
288
+ };
289
+ };
290
+ };
291
+ dark: {
292
+ hue: {
293
+ gray: {
294
+ 100: string;
295
+ 200: string;
296
+ 300: string;
297
+ 400: string;
298
+ 500: string;
299
+ 600: string;
300
+ 700: string;
301
+ 800: string;
302
+ 900: string;
303
+ };
304
+ red: {
305
+ 100: string;
306
+ 200: string;
307
+ 300: string;
308
+ 400: string;
309
+ 500: string;
310
+ 600: string;
311
+ 700: string;
312
+ 800: string;
313
+ 900: string;
314
+ };
315
+ orange: {
316
+ 100: string;
317
+ 200: string;
318
+ 300: string;
319
+ 400: string;
320
+ 500: string;
321
+ 600: string;
322
+ 700: string;
323
+ 800: string;
324
+ 900: string;
325
+ };
326
+ yellow: {
327
+ 100: string;
328
+ 200: string;
329
+ 300: string;
330
+ 400: string;
331
+ 500: string;
332
+ 600: string;
333
+ 700: string;
334
+ 800: string;
335
+ 900: string;
336
+ };
337
+ green: {
338
+ 100: string;
339
+ 200: string;
340
+ 300: string;
341
+ 400: string;
342
+ 500: string;
343
+ 600: string;
344
+ 700: string;
345
+ 800: string;
346
+ 900: string;
347
+ };
348
+ cyan: {
349
+ 100: string;
350
+ 200: string;
351
+ 300: string;
352
+ 400: string;
353
+ 500: string;
354
+ 600: string;
355
+ 700: string;
356
+ 800: string;
357
+ 900: string;
358
+ };
359
+ blue: {
360
+ 100: string;
361
+ 200: string;
362
+ 300: string;
363
+ 400: string;
364
+ 500: string;
365
+ 600: string;
366
+ 700: string;
367
+ 800: string;
368
+ 900: string;
369
+ };
370
+ purple: {
371
+ 100: string;
372
+ 200: string;
373
+ 300: string;
374
+ 400: string;
375
+ 500: string;
376
+ 600: string;
377
+ 700: string;
378
+ 800: string;
379
+ 900: string;
380
+ };
381
+ accent: "$hue.blue";
382
+ interactive: "$hue.blue";
383
+ neutral: "$hue.gray";
384
+ };
385
+ categorical: readonly ["blue", "purple", "green", "orange", "red", "cyan"];
386
+ text: {
387
+ default: string;
388
+ subdued: string;
389
+ action: {
390
+ primary: {
391
+ default: string;
392
+ $disabled: string;
393
+ };
394
+ secondary: {
395
+ default: string;
396
+ $hovered: string;
397
+ };
398
+ destructive: {
399
+ default: string;
400
+ $disabled: string;
401
+ };
402
+ };
403
+ formfield: {
404
+ default: string;
405
+ $focused: string;
406
+ $pressed: string;
407
+ $disabled: string;
408
+ $selected: string;
409
+ };
410
+ status: {
411
+ running: string;
412
+ question: string;
413
+ permission: string;
414
+ unread: string;
415
+ };
416
+ feedback: {
417
+ error: {
418
+ default: string;
419
+ subdued: string;
420
+ };
421
+ warning: {
422
+ default: string;
423
+ subdued: string;
424
+ };
425
+ success: {
426
+ default: string;
427
+ subdued: string;
428
+ };
429
+ info: {
430
+ default: string;
431
+ subdued: string;
432
+ };
433
+ };
434
+ };
435
+ background: {
436
+ default: string;
437
+ surface: {
438
+ offset: string;
439
+ overlay: string;
440
+ };
441
+ action: {
442
+ primary: {
443
+ default: string;
444
+ $hovered: string;
445
+ $focused: string;
446
+ $pressed: string;
447
+ $selected: string;
448
+ $disabled: string;
449
+ };
450
+ secondary: {
451
+ default: string;
452
+ };
453
+ destructive: {
454
+ default: string;
455
+ $hovered: string;
456
+ $focused: string;
457
+ $pressed: string;
458
+ $selected: string;
459
+ $disabled: string;
460
+ };
461
+ };
462
+ formfield: {
463
+ default: string;
464
+ $hovered: string;
465
+ $focused: string;
466
+ $pressed: string;
467
+ $disabled: string;
468
+ $selected: string;
469
+ };
470
+ feedback: {
471
+ error: {
472
+ default: string;
473
+ };
474
+ warning: {
475
+ default: string;
476
+ };
477
+ success: {
478
+ default: string;
479
+ };
480
+ info: {
481
+ default: string;
482
+ };
483
+ };
484
+ };
485
+ border: {
486
+ default: string;
487
+ };
488
+ scrollbar: {
489
+ default: string;
490
+ };
491
+ diff: {
492
+ text: {
493
+ added: string;
494
+ removed: string;
495
+ context: string;
496
+ hunkHeader: string;
497
+ };
498
+ background: {
499
+ added: string;
500
+ removed: string;
501
+ context: string;
502
+ };
503
+ highlight: {
504
+ added: string;
505
+ removed: string;
506
+ };
507
+ lineNumber: {
508
+ text: string;
509
+ background: {
510
+ added: string;
511
+ removed: string;
512
+ };
513
+ };
514
+ };
515
+ syntax: {
516
+ comment: string;
517
+ keyword: string;
518
+ function: string;
519
+ variable: string;
520
+ string: string;
521
+ number: string;
522
+ type: string;
523
+ operator: string;
524
+ punctuation: string;
525
+ };
526
+ markdown: {
527
+ text: string;
528
+ heading: string;
529
+ link: string;
530
+ linkText: string;
531
+ code: string;
532
+ blockQuote: string;
533
+ emphasis: string;
534
+ strong: string;
535
+ horizontalRule: string;
536
+ listItem: string;
537
+ listEnumeration: string;
538
+ image: string;
539
+ imageText: string;
540
+ codeBlock: string;
541
+ };
542
+ "@context:elevated": {
543
+ text: {
544
+ action: {
545
+ primary: {
546
+ default: string;
547
+ };
548
+ };
549
+ };
550
+ background: {
551
+ default: string;
552
+ action: {
553
+ primary: {
554
+ default: string;
555
+ $hovered: string;
556
+ };
557
+ };
558
+ };
559
+ };
560
+ "@context:overlay": {
561
+ text: {
562
+ action: {
563
+ primary: {
564
+ default: string;
565
+ };
566
+ };
567
+ };
568
+ background: {
569
+ default: string;
570
+ action: {
571
+ primary: {
572
+ default: string;
573
+ };
574
+ };
575
+ };
576
+ };
577
+ };
578
+ };