@wordpress/theme 0.1.1-next.2f1c7c01b.0 → 0.2.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.
- package/bin/terrazzo-plugin-ds-tokens-docs/index.ts +5 -24
- package/bin/terrazzo-plugin-inline-alias-values/index.ts +84 -0
- package/bin/terrazzo-plugin-known-wpds-css-variables/index.ts +19 -39
- package/build/color-ramps/lib/constants.js +4 -4
- package/build/color-ramps/lib/constants.js.map +2 -2
- package/build/color-ramps/lib/default-ramps.js +82 -82
- package/build/color-ramps/lib/default-ramps.js.map +1 -1
- package/build/color-ramps/lib/find-color-with-constraints.js +36 -53
- package/build/color-ramps/lib/find-color-with-constraints.js.map +2 -2
- package/build/color-ramps/lib/index.js +64 -63
- package/build/color-ramps/lib/index.js.map +2 -2
- package/build/color-ramps/lib/ramp-configs.js +3 -3
- package/build/color-ramps/lib/ramp-configs.js.map +1 -1
- package/build/color-ramps/lib/utils.js +63 -2
- package/build/color-ramps/lib/utils.js.map +2 -2
- package/build/prebuilt/js/design-tokens.js +5 -10
- package/build/prebuilt/js/design-tokens.js.map +2 -2
- package/build/prebuilt/json/figma.json +105 -905
- package/build/prebuilt/ts/color-tokens.js +137 -0
- package/build/prebuilt/ts/color-tokens.js.map +7 -0
- package/build/token-id.js +30 -0
- package/build/token-id.js.map +7 -0
- package/build/use-theme-provider-styles.js +18 -27
- package/build/use-theme-provider-styles.js.map +3 -3
- package/build-module/color-ramps/lib/constants.js +3 -3
- package/build-module/color-ramps/lib/constants.js.map +2 -2
- package/build-module/color-ramps/lib/default-ramps.js +82 -82
- package/build-module/color-ramps/lib/default-ramps.js.map +1 -1
- package/build-module/color-ramps/lib/find-color-with-constraints.js +38 -60
- package/build-module/color-ramps/lib/find-color-with-constraints.js.map +2 -2
- package/build-module/color-ramps/lib/index.js +68 -65
- package/build-module/color-ramps/lib/index.js.map +2 -2
- package/build-module/color-ramps/lib/ramp-configs.js +3 -3
- package/build-module/color-ramps/lib/ramp-configs.js.map +1 -1
- package/build-module/color-ramps/lib/utils.js +63 -2
- package/build-module/color-ramps/lib/utils.js.map +2 -2
- package/build-module/prebuilt/js/design-tokens.js +5 -10
- package/build-module/prebuilt/js/design-tokens.js.map +2 -2
- package/build-module/prebuilt/json/figma.json +105 -905
- package/build-module/prebuilt/ts/color-tokens.js +117 -0
- package/build-module/prebuilt/ts/color-tokens.js.map +7 -0
- package/build-module/token-id.js +6 -0
- package/build-module/token-id.js.map +7 -0
- package/build-module/use-theme-provider-styles.js +18 -27
- package/build-module/use-theme-provider-styles.js.map +2 -2
- package/build-types/color-ramps/lib/constants.d.ts +2 -2
- package/build-types/color-ramps/lib/constants.d.ts.map +1 -1
- package/build-types/color-ramps/lib/find-color-with-constraints.d.ts +2 -3
- package/build-types/color-ramps/lib/find-color-with-constraints.d.ts.map +1 -1
- package/build-types/color-ramps/lib/index.d.ts.map +1 -1
- package/build-types/color-ramps/lib/utils.d.ts +21 -2
- package/build-types/color-ramps/lib/utils.d.ts.map +1 -1
- package/build-types/color-ramps/stories/index.story.d.ts.map +1 -1
- package/build-types/prebuilt/ts/color-tokens.d.ts +7 -0
- package/build-types/prebuilt/ts/color-tokens.d.ts.map +1 -0
- package/build-types/stories/index.story.d.ts.map +1 -1
- package/build-types/theme-provider.d.ts.map +1 -1
- package/build-types/token-id.d.ts +9 -0
- package/build-types/token-id.d.ts.map +1 -0
- package/build-types/use-theme-provider-styles.d.ts.map +1 -1
- package/docs/ds-tokens.md +10 -178
- package/package.json +4 -4
- package/src/color-ramps/lib/constants.ts +7 -5
- package/src/color-ramps/lib/default-ramps.ts +82 -82
- package/src/color-ramps/lib/find-color-with-constraints.ts +53 -77
- package/src/color-ramps/lib/index.ts +98 -102
- package/src/color-ramps/lib/ramp-configs.ts +3 -3
- package/src/color-ramps/lib/utils.ts +109 -5
- package/src/color-ramps/test/__snapshots__/index.test.ts.snap +45706 -360
- package/src/color-ramps/test/index.test.ts +41 -14
- package/src/prebuilt/css/design-tokens.css +88 -413
- package/src/prebuilt/js/design-tokens.js +5 -10
- package/src/prebuilt/json/figma.json +105 -905
- package/src/prebuilt/ts/color-tokens.ts +117 -0
- package/src/stories/index.story.tsx +4 -18
- package/src/test/token-id.test.ts +12 -0
- package/src/token-id.ts +9 -0
- package/src/use-theme-provider-styles.ts +20 -35
- package/terrazzo.config.ts +15 -12
- package/tokens/color.json +82 -82
- package/tokens/dimension.json +75 -0
- package/tsconfig.bin.tsbuildinfo +1 -1
- package/tsconfig.src.tsbuildinfo +1 -1
- package/build/prebuilt/ts/design-tokens.js +0 -391
- package/build/prebuilt/ts/design-tokens.js.map +0 -7
- package/build-module/prebuilt/ts/design-tokens.js +0 -371
- package/build-module/prebuilt/ts/design-tokens.js.map +0 -7
- package/build-types/prebuilt/ts/design-tokens.d.ts +0 -7
- package/build-types/prebuilt/ts/design-tokens.d.ts.map +0 -1
- package/src/prebuilt/ts/design-tokens.ts +0 -371
- package/tokens/spacing.json +0 -45
|
@@ -5,23 +5,23 @@ var DEFAULT_RAMPS = {
|
|
|
5
5
|
surface2: { color: "#f8f8f8", warning: false },
|
|
6
6
|
bgFill1: { color: "#555", warning: false },
|
|
7
7
|
fgFill: { color: "#f0f0f0", warning: false },
|
|
8
|
-
bgFill2: { color: "#
|
|
9
|
-
surface6: { color: "#
|
|
10
|
-
surface5: { color: "#
|
|
8
|
+
bgFill2: { color: "#494949", warning: false },
|
|
9
|
+
surface6: { color: "#d3d3d3", warning: false },
|
|
10
|
+
surface5: { color: "#e3e3e3", warning: false },
|
|
11
11
|
surface4: { color: "#eaeaea", warning: false },
|
|
12
12
|
surface3: { color: "#fff", warning: false },
|
|
13
13
|
fgSurface4: { color: "#1e1e1e", warning: false },
|
|
14
|
-
fgSurface3: { color: "#
|
|
15
|
-
fgSurface2: { color: "#
|
|
16
|
-
fgSurface1: { color: "#
|
|
17
|
-
stroke3: { color: "#
|
|
18
|
-
stroke4: { color: "#
|
|
14
|
+
fgSurface3: { color: "#6e6e6e", warning: false },
|
|
15
|
+
fgSurface2: { color: "#8b8b8b", warning: false },
|
|
16
|
+
fgSurface1: { color: "#ababab", warning: false },
|
|
17
|
+
stroke3: { color: "#8b8b8b", warning: false },
|
|
18
|
+
stroke4: { color: "#6d6d6d", warning: false },
|
|
19
19
|
stroke2: { color: "#adadad", warning: false },
|
|
20
|
-
stroke1: { color: "#
|
|
20
|
+
stroke1: { color: "#cfcfcf", warning: false },
|
|
21
21
|
bgFillDark: { color: "#1e1e1e", warning: false },
|
|
22
22
|
fgFillDark: { color: "#f0f0f0", warning: false },
|
|
23
23
|
bgFillInverted2: { color: "#1e1e1e", warning: false },
|
|
24
|
-
bgFillInverted1: { color: "#
|
|
24
|
+
bgFillInverted1: { color: "#2d2d2d", warning: false },
|
|
25
25
|
fgFillInverted: { color: "#f0f0f0", warning: false },
|
|
26
26
|
surface1: { color: "#f0f0f0", warning: false }
|
|
27
27
|
},
|
|
@@ -31,26 +31,26 @@ var DEFAULT_RAMPS = {
|
|
|
31
31
|
ramp: {
|
|
32
32
|
bgFill1: { color: "#3858e9", warning: false },
|
|
33
33
|
fgFill: { color: "#eff0f2", warning: false },
|
|
34
|
-
bgFill2: { color: "#
|
|
34
|
+
bgFill2: { color: "#2e49da", warning: false },
|
|
35
35
|
surface2: { color: "#f6f8fc", warning: false },
|
|
36
|
-
surface6: { color: "#
|
|
37
|
-
surface5: { color: "#
|
|
38
|
-
surface4: { color: "#
|
|
36
|
+
surface6: { color: "#c7d3ef", warning: false },
|
|
37
|
+
surface5: { color: "#dce3f5", warning: false },
|
|
38
|
+
surface4: { color: "#e5ebf7", warning: false },
|
|
39
39
|
surface3: { color: "#fff", warning: false },
|
|
40
40
|
fgSurface4: { color: "#080071", warning: false },
|
|
41
41
|
fgSurface3: { color: "#3858e9", warning: false },
|
|
42
|
-
fgSurface2: { color: "#
|
|
43
|
-
fgSurface1: { color: "#
|
|
42
|
+
fgSurface2: { color: "#5881ff", warning: false },
|
|
43
|
+
fgSurface1: { color: "#84a9ff", warning: false },
|
|
44
44
|
stroke3: { color: "#3858e9", warning: false },
|
|
45
|
-
stroke4: { color: "#
|
|
46
|
-
stroke2: { color: "#
|
|
47
|
-
stroke1: { color: "#
|
|
45
|
+
stroke4: { color: "#2337c8", warning: false },
|
|
46
|
+
stroke2: { color: "#6d83bf", warning: false },
|
|
47
|
+
stroke1: { color: "#91a2cf", warning: false },
|
|
48
48
|
bgFillDark: { color: "#1b1e26", warning: false },
|
|
49
49
|
fgFillDark: { color: "#eff0f2", warning: false },
|
|
50
50
|
bgFillInverted2: { color: "#1b1e26", warning: false },
|
|
51
|
-
bgFillInverted1: { color: "#
|
|
51
|
+
bgFillInverted1: { color: "#12009f", warning: false },
|
|
52
52
|
fgFillInverted: { color: "#eff0f2", warning: false },
|
|
53
|
-
surface1: { color: "#
|
|
53
|
+
surface1: { color: "#edf0fa", warning: false }
|
|
54
54
|
},
|
|
55
55
|
direction: "darker"
|
|
56
56
|
},
|
|
@@ -58,26 +58,26 @@ var DEFAULT_RAMPS = {
|
|
|
58
58
|
ramp: {
|
|
59
59
|
bgFill1: { color: "#0090ff", warning: false },
|
|
60
60
|
fgFill: { color: "#1b1e23", warning: false },
|
|
61
|
-
bgFill2: { color: "#
|
|
61
|
+
bgFill2: { color: "#0081ef", warning: false },
|
|
62
62
|
surface2: { color: "#f5f9fd", warning: false },
|
|
63
|
-
surface6: { color: "#
|
|
64
|
-
surface5: { color: "#
|
|
65
|
-
surface4: { color: "#
|
|
63
|
+
surface6: { color: "#bed6f1", warning: false },
|
|
64
|
+
surface5: { color: "#d5e5f6", warning: false },
|
|
65
|
+
surface4: { color: "#e0ebf8", warning: false },
|
|
66
66
|
surface3: { color: "#fff", warning: false },
|
|
67
67
|
fgSurface4: { color: "#001758", warning: false },
|
|
68
|
-
fgSurface3: { color: "#
|
|
69
|
-
fgSurface2: { color: "#
|
|
70
|
-
fgSurface1: { color: "#
|
|
71
|
-
stroke3: { color: "#
|
|
72
|
-
stroke4: { color: "#
|
|
73
|
-
stroke2: { color: "#
|
|
74
|
-
stroke1: { color: "#
|
|
68
|
+
fgSurface3: { color: "#006dd9", warning: false },
|
|
69
|
+
fgSurface2: { color: "#008cfb", warning: false },
|
|
70
|
+
fgSurface1: { color: "#53b1ff", warning: false },
|
|
71
|
+
stroke3: { color: "#006dd9", warning: false },
|
|
72
|
+
stroke4: { color: "#004eb8", warning: false },
|
|
73
|
+
stroke2: { color: "#5d8fc6", warning: false },
|
|
74
|
+
stroke1: { color: "#8aaed6", warning: false },
|
|
75
75
|
bgFillDark: { color: "#1b1e23", warning: false },
|
|
76
76
|
fgFillDark: { color: "#eff0f2", warning: false },
|
|
77
77
|
bgFillInverted2: { color: "#1b1e23", warning: false },
|
|
78
|
-
bgFillInverted1: { color: "#
|
|
78
|
+
bgFillInverted1: { color: "#002675", warning: false },
|
|
79
79
|
fgFillInverted: { color: "#eff0f2", warning: false },
|
|
80
|
-
surface1: { color: "#
|
|
80
|
+
surface1: { color: "#eaf1fa", warning: false }
|
|
81
81
|
},
|
|
82
82
|
direction: "darker"
|
|
83
83
|
},
|
|
@@ -85,26 +85,26 @@ var DEFAULT_RAMPS = {
|
|
|
85
85
|
ramp: {
|
|
86
86
|
bgFill1: { color: "#4ab866", warning: false },
|
|
87
87
|
fgFill: { color: "#1b1f1c", warning: false },
|
|
88
|
-
bgFill2: { color: "#
|
|
88
|
+
bgFill2: { color: "#37a857", warning: false },
|
|
89
89
|
surface2: { color: "#f0fcf2", warning: false },
|
|
90
|
-
surface6: { color: "#
|
|
91
|
-
surface5: { color: "#
|
|
90
|
+
surface6: { color: "#7eea95", warning: false },
|
|
91
|
+
surface5: { color: "#b7f2c1", warning: false },
|
|
92
92
|
surface4: { color: "#cdf5d3", warning: false },
|
|
93
93
|
surface3: { color: "#fff", warning: false },
|
|
94
94
|
fgSurface4: { color: "#002b00", warning: false },
|
|
95
|
-
fgSurface3: { color: "#
|
|
96
|
-
fgSurface2: { color: "#
|
|
97
|
-
fgSurface1: { color: "#
|
|
98
|
-
stroke3: { color: "#
|
|
99
|
-
stroke4: { color: "#
|
|
100
|
-
stroke2: { color: "#
|
|
101
|
-
stroke1: { color: "#
|
|
95
|
+
fgSurface3: { color: "#008031", warning: false },
|
|
96
|
+
fgSurface2: { color: "#2c9f4e", warning: false },
|
|
97
|
+
fgSurface1: { color: "#54c16f", warning: false },
|
|
98
|
+
stroke3: { color: "#008031", warning: false },
|
|
99
|
+
stroke4: { color: "#006314", warning: false },
|
|
100
|
+
stroke2: { color: "#61986b", warning: false },
|
|
101
|
+
stroke1: { color: "#77ba84", warning: false },
|
|
102
102
|
bgFillDark: { color: "#1b1f1c", warning: false },
|
|
103
103
|
fgFillDark: { color: "#edf2ed", warning: false },
|
|
104
104
|
bgFillInverted2: { color: "#1b1f1c", warning: false },
|
|
105
|
-
bgFillInverted1: { color: "#
|
|
105
|
+
bgFillInverted1: { color: "#003800", warning: false },
|
|
106
106
|
fgFillInverted: { color: "#edf2ed", warning: false },
|
|
107
|
-
surface1: { color: "#
|
|
107
|
+
surface1: { color: "#ddf8e1", warning: false }
|
|
108
108
|
},
|
|
109
109
|
direction: "darker"
|
|
110
110
|
},
|
|
@@ -112,26 +112,26 @@ var DEFAULT_RAMPS = {
|
|
|
112
112
|
ramp: {
|
|
113
113
|
bgFill1: { color: "#f0d149", warning: false },
|
|
114
114
|
fgFill: { color: "#1f1e1b", warning: false },
|
|
115
|
-
bgFill2: { color: "#
|
|
115
|
+
bgFill2: { color: "#ddbe30", warning: false },
|
|
116
116
|
surface2: { color: "#fdf9e7", warning: false },
|
|
117
|
-
surface6: { color: "#
|
|
118
|
-
surface5: { color: "#
|
|
119
|
-
surface4: { color: "#
|
|
117
|
+
surface6: { color: "#ecd367", warning: false },
|
|
118
|
+
surface5: { color: "#f5e399", warning: false },
|
|
119
|
+
surface4: { color: "#f8ebb5", warning: false },
|
|
120
120
|
surface3: { color: "#fff", warning: false },
|
|
121
121
|
fgSurface4: { color: "#291d00", warning: false },
|
|
122
|
-
fgSurface3: { color: "#
|
|
123
|
-
fgSurface2: { color: "#
|
|
124
|
-
fgSurface1: { color: "#
|
|
125
|
-
stroke3: { color: "#
|
|
126
|
-
stroke4: { color: "#
|
|
127
|
-
stroke2: { color: "#
|
|
128
|
-
stroke1: { color: "#
|
|
122
|
+
fgSurface3: { color: "#876b00", warning: false },
|
|
123
|
+
fgSurface2: { color: "#a78900", warning: false },
|
|
124
|
+
fgSurface1: { color: "#c9aa00", warning: false },
|
|
125
|
+
stroke3: { color: "#876b00", warning: false },
|
|
126
|
+
stroke4: { color: "#675000", warning: false },
|
|
127
|
+
stroke2: { color: "#978c60", warning: false },
|
|
128
|
+
stroke1: { color: "#b8ab75", warning: false },
|
|
129
129
|
bgFillDark: { color: "#1f1e1b", warning: false },
|
|
130
130
|
fgFillDark: { color: "#f6f1da", warning: false },
|
|
131
131
|
bgFillInverted2: { color: "#1f1e1b", warning: false },
|
|
132
|
-
bgFillInverted1: { color: "#
|
|
132
|
+
bgFillInverted1: { color: "#3a2b00", warning: false },
|
|
133
133
|
fgFillInverted: { color: "#f6f1da", warning: false },
|
|
134
|
-
surface1: { color: "#
|
|
134
|
+
surface1: { color: "#faf1cd", warning: false }
|
|
135
135
|
},
|
|
136
136
|
direction: "darker"
|
|
137
137
|
},
|
|
@@ -139,26 +139,26 @@ var DEFAULT_RAMPS = {
|
|
|
139
139
|
ramp: {
|
|
140
140
|
bgFill1: { color: "#f0b849", warning: false },
|
|
141
141
|
fgFill: { color: "#1f1e1b", warning: false },
|
|
142
|
-
bgFill2: { color: "#
|
|
142
|
+
bgFill2: { color: "#dea633", warning: false },
|
|
143
143
|
surface2: { color: "#fdf7ee", warning: false },
|
|
144
|
-
surface6: { color: "#
|
|
145
|
-
surface5: { color: "#
|
|
144
|
+
surface6: { color: "#f1ce90", warning: false },
|
|
145
|
+
surface5: { color: "#f6e0bb", warning: false },
|
|
146
146
|
surface4: { color: "#f8e9cd", warning: false },
|
|
147
147
|
surface3: { color: "#fff", warning: false },
|
|
148
148
|
fgSurface4: { color: "#2f1800", warning: false },
|
|
149
|
-
fgSurface3: { color: "#
|
|
150
|
-
fgSurface2: { color: "#
|
|
151
|
-
fgSurface1: { color: "#
|
|
152
|
-
stroke3: { color: "#
|
|
153
|
-
stroke4: { color: "#
|
|
154
|
-
stroke2: { color: "#
|
|
155
|
-
stroke1: { color: "#
|
|
149
|
+
fgSurface3: { color: "#976300", warning: false },
|
|
150
|
+
fgSurface2: { color: "#b78100", warning: false },
|
|
151
|
+
fgSurface1: { color: "#d9a22e", warning: false },
|
|
152
|
+
stroke3: { color: "#976300", warning: false },
|
|
153
|
+
stroke4: { color: "#754900", warning: false },
|
|
154
|
+
stroke2: { color: "#9f8860", warning: false },
|
|
155
|
+
stroke1: { color: "#c2a776", warning: false },
|
|
156
156
|
bgFillDark: { color: "#1f1e1b", warning: false },
|
|
157
157
|
fgFillDark: { color: "#f3f0e9", warning: false },
|
|
158
158
|
bgFillInverted2: { color: "#1f1e1b", warning: false },
|
|
159
|
-
bgFillInverted1: { color: "#
|
|
159
|
+
bgFillInverted1: { color: "#432600", warning: false },
|
|
160
160
|
fgFillInverted: { color: "#f3f0e9", warning: false },
|
|
161
|
-
surface1: { color: "#
|
|
161
|
+
surface1: { color: "#faefdc", warning: false }
|
|
162
162
|
},
|
|
163
163
|
direction: "darker"
|
|
164
164
|
},
|
|
@@ -166,26 +166,26 @@ var DEFAULT_RAMPS = {
|
|
|
166
166
|
ramp: {
|
|
167
167
|
bgFill1: { color: "#cc1818", warning: false },
|
|
168
168
|
fgFill: { color: "#f2efef", warning: false },
|
|
169
|
-
bgFill2: { color: "#
|
|
169
|
+
bgFill2: { color: "#bc0001", warning: false },
|
|
170
170
|
surface2: { color: "#fdf6f5", warning: false },
|
|
171
|
-
surface6: { color: "#
|
|
172
|
-
surface5: { color: "#
|
|
173
|
-
surface4: { color: "#
|
|
171
|
+
surface6: { color: "#f5c9c2", warning: false },
|
|
172
|
+
surface5: { color: "#f9dcd8", warning: false },
|
|
173
|
+
surface4: { color: "#fae5e2", warning: false },
|
|
174
174
|
surface3: { color: "#fff", warning: false },
|
|
175
175
|
fgSurface4: { color: "#4a0000", warning: false },
|
|
176
176
|
fgSurface3: { color: "#cc1818", warning: false },
|
|
177
|
-
fgSurface2: { color: "#
|
|
178
|
-
fgSurface1: { color: "#
|
|
177
|
+
fgSurface2: { color: "#f84d41", warning: false },
|
|
178
|
+
fgSurface1: { color: "#ff8373", warning: false },
|
|
179
179
|
stroke3: { color: "#cc1818", warning: false },
|
|
180
|
-
stroke4: { color: "#
|
|
181
|
-
stroke2: { color: "#
|
|
182
|
-
stroke1: { color: "#
|
|
180
|
+
stroke4: { color: "#a70000", warning: false },
|
|
181
|
+
stroke2: { color: "#ca675c", warning: false },
|
|
182
|
+
stroke1: { color: "#dc8e83", warning: false },
|
|
183
183
|
bgFillDark: { color: "#231c1b", warning: false },
|
|
184
184
|
fgFillDark: { color: "#f2efef", warning: false },
|
|
185
185
|
bgFillInverted2: { color: "#231c1b", warning: false },
|
|
186
|
-
bgFillInverted1: { color: "#
|
|
186
|
+
bgFillInverted1: { color: "#680000", warning: false },
|
|
187
187
|
fgFillInverted: { color: "#f2efef", warning: false },
|
|
188
|
-
surface1: { color: "#
|
|
188
|
+
surface1: { color: "#fcedea", warning: false }
|
|
189
189
|
},
|
|
190
190
|
direction: "darker"
|
|
191
191
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/color-ramps/lib/default-ramps.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { RampResult } from './types';\nimport type { DEFAULT_SEED_COLORS } from './constants';\n\nexport const DEFAULT_RAMPS: Record<\n\tkeyof typeof DEFAULT_SEED_COLORS,\n\tRampResult\n> = {\n\tbg: {\n\t\tramp: {\n\t\t\tsurface2: { color: '#f8f8f8', warning: false },\n\t\t\tbgFill1: { color: '#555', warning: false },\n\t\t\tfgFill: { color: '#f0f0f0', warning: false },\n\t\t\tbgFill2: { color: '#
|
|
4
|
+
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type { RampResult } from './types';\nimport type { DEFAULT_SEED_COLORS } from './constants';\n\nexport const DEFAULT_RAMPS: Record<\n\tkeyof typeof DEFAULT_SEED_COLORS,\n\tRampResult\n> = {\n\tbg: {\n\t\tramp: {\n\t\t\tsurface2: { color: '#f8f8f8', warning: false },\n\t\t\tbgFill1: { color: '#555', warning: false },\n\t\t\tfgFill: { color: '#f0f0f0', warning: false },\n\t\t\tbgFill2: { color: '#494949', warning: false },\n\t\t\tsurface6: { color: '#d3d3d3', warning: false },\n\t\t\tsurface5: { color: '#e3e3e3', warning: false },\n\t\t\tsurface4: { color: '#eaeaea', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#1e1e1e', warning: false },\n\t\t\tfgSurface3: { color: '#6e6e6e', warning: false },\n\t\t\tfgSurface2: { color: '#8b8b8b', warning: false },\n\t\t\tfgSurface1: { color: '#ababab', warning: false },\n\t\t\tstroke3: { color: '#8b8b8b', warning: false },\n\t\t\tstroke4: { color: '#6d6d6d', warning: false },\n\t\t\tstroke2: { color: '#adadad', warning: false },\n\t\t\tstroke1: { color: '#cfcfcf', warning: false },\n\t\t\tbgFillDark: { color: '#1e1e1e', warning: false },\n\t\t\tfgFillDark: { color: '#f0f0f0', warning: false },\n\t\t\tbgFillInverted2: { color: '#1e1e1e', warning: false },\n\t\t\tbgFillInverted1: { color: '#2d2d2d', warning: false },\n\t\t\tfgFillInverted: { color: '#f0f0f0', warning: false },\n\t\t\tsurface1: { color: '#f0f0f0', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n\tprimary: {\n\t\tramp: {\n\t\t\tbgFill1: { color: '#3858e9', warning: false },\n\t\t\tfgFill: { color: '#eff0f2', warning: false },\n\t\t\tbgFill2: { color: '#2e49da', warning: false },\n\t\t\tsurface2: { color: '#f6f8fc', warning: false },\n\t\t\tsurface6: { color: '#c7d3ef', warning: false },\n\t\t\tsurface5: { color: '#dce3f5', warning: false },\n\t\t\tsurface4: { color: '#e5ebf7', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#080071', warning: false },\n\t\t\tfgSurface3: { color: '#3858e9', warning: false },\n\t\t\tfgSurface2: { color: '#5881ff', warning: false },\n\t\t\tfgSurface1: { color: '#84a9ff', warning: false },\n\t\t\tstroke3: { color: '#3858e9', warning: false },\n\t\t\tstroke4: { color: '#2337c8', warning: false },\n\t\t\tstroke2: { color: '#6d83bf', warning: false },\n\t\t\tstroke1: { color: '#91a2cf', warning: false },\n\t\t\tbgFillDark: { color: '#1b1e26', warning: false },\n\t\t\tfgFillDark: { color: '#eff0f2', warning: false },\n\t\t\tbgFillInverted2: { color: '#1b1e26', warning: false },\n\t\t\tbgFillInverted1: { color: '#12009f', warning: false },\n\t\t\tfgFillInverted: { color: '#eff0f2', warning: false },\n\t\t\tsurface1: { color: '#edf0fa', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n\tinfo: {\n\t\tramp: {\n\t\t\tbgFill1: { color: '#0090ff', warning: false },\n\t\t\tfgFill: { color: '#1b1e23', warning: false },\n\t\t\tbgFill2: { color: '#0081ef', warning: false },\n\t\t\tsurface2: { color: '#f5f9fd', warning: false },\n\t\t\tsurface6: { color: '#bed6f1', warning: false },\n\t\t\tsurface5: { color: '#d5e5f6', warning: false },\n\t\t\tsurface4: { color: '#e0ebf8', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#001758', warning: false },\n\t\t\tfgSurface3: { color: '#006dd9', warning: false },\n\t\t\tfgSurface2: { color: '#008cfb', warning: false },\n\t\t\tfgSurface1: { color: '#53b1ff', warning: false },\n\t\t\tstroke3: { color: '#006dd9', warning: false },\n\t\t\tstroke4: { color: '#004eb8', warning: false },\n\t\t\tstroke2: { color: '#5d8fc6', warning: false },\n\t\t\tstroke1: { color: '#8aaed6', warning: false },\n\t\t\tbgFillDark: { color: '#1b1e23', warning: false },\n\t\t\tfgFillDark: { color: '#eff0f2', warning: false },\n\t\t\tbgFillInverted2: { color: '#1b1e23', warning: false },\n\t\t\tbgFillInverted1: { color: '#002675', warning: false },\n\t\t\tfgFillInverted: { color: '#eff0f2', warning: false },\n\t\t\tsurface1: { color: '#eaf1fa', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n\tsuccess: {\n\t\tramp: {\n\t\t\tbgFill1: { color: '#4ab866', warning: false },\n\t\t\tfgFill: { color: '#1b1f1c', warning: false },\n\t\t\tbgFill2: { color: '#37a857', warning: false },\n\t\t\tsurface2: { color: '#f0fcf2', warning: false },\n\t\t\tsurface6: { color: '#7eea95', warning: false },\n\t\t\tsurface5: { color: '#b7f2c1', warning: false },\n\t\t\tsurface4: { color: '#cdf5d3', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#002b00', warning: false },\n\t\t\tfgSurface3: { color: '#008031', warning: false },\n\t\t\tfgSurface2: { color: '#2c9f4e', warning: false },\n\t\t\tfgSurface1: { color: '#54c16f', warning: false },\n\t\t\tstroke3: { color: '#008031', warning: false },\n\t\t\tstroke4: { color: '#006314', warning: false },\n\t\t\tstroke2: { color: '#61986b', warning: false },\n\t\t\tstroke1: { color: '#77ba84', warning: false },\n\t\t\tbgFillDark: { color: '#1b1f1c', warning: false },\n\t\t\tfgFillDark: { color: '#edf2ed', warning: false },\n\t\t\tbgFillInverted2: { color: '#1b1f1c', warning: false },\n\t\t\tbgFillInverted1: { color: '#003800', warning: false },\n\t\t\tfgFillInverted: { color: '#edf2ed', warning: false },\n\t\t\tsurface1: { color: '#ddf8e1', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n\tcaution: {\n\t\tramp: {\n\t\t\tbgFill1: { color: '#f0d149', warning: false },\n\t\t\tfgFill: { color: '#1f1e1b', warning: false },\n\t\t\tbgFill2: { color: '#ddbe30', warning: false },\n\t\t\tsurface2: { color: '#fdf9e7', warning: false },\n\t\t\tsurface6: { color: '#ecd367', warning: false },\n\t\t\tsurface5: { color: '#f5e399', warning: false },\n\t\t\tsurface4: { color: '#f8ebb5', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#291d00', warning: false },\n\t\t\tfgSurface3: { color: '#876b00', warning: false },\n\t\t\tfgSurface2: { color: '#a78900', warning: false },\n\t\t\tfgSurface1: { color: '#c9aa00', warning: false },\n\t\t\tstroke3: { color: '#876b00', warning: false },\n\t\t\tstroke4: { color: '#675000', warning: false },\n\t\t\tstroke2: { color: '#978c60', warning: false },\n\t\t\tstroke1: { color: '#b8ab75', warning: false },\n\t\t\tbgFillDark: { color: '#1f1e1b', warning: false },\n\t\t\tfgFillDark: { color: '#f6f1da', warning: false },\n\t\t\tbgFillInverted2: { color: '#1f1e1b', warning: false },\n\t\t\tbgFillInverted1: { color: '#3a2b00', warning: false },\n\t\t\tfgFillInverted: { color: '#f6f1da', warning: false },\n\t\t\tsurface1: { color: '#faf1cd', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n\twarning: {\n\t\tramp: {\n\t\t\tbgFill1: { color: '#f0b849', warning: false },\n\t\t\tfgFill: { color: '#1f1e1b', warning: false },\n\t\t\tbgFill2: { color: '#dea633', warning: false },\n\t\t\tsurface2: { color: '#fdf7ee', warning: false },\n\t\t\tsurface6: { color: '#f1ce90', warning: false },\n\t\t\tsurface5: { color: '#f6e0bb', warning: false },\n\t\t\tsurface4: { color: '#f8e9cd', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#2f1800', warning: false },\n\t\t\tfgSurface3: { color: '#976300', warning: false },\n\t\t\tfgSurface2: { color: '#b78100', warning: false },\n\t\t\tfgSurface1: { color: '#d9a22e', warning: false },\n\t\t\tstroke3: { color: '#976300', warning: false },\n\t\t\tstroke4: { color: '#754900', warning: false },\n\t\t\tstroke2: { color: '#9f8860', warning: false },\n\t\t\tstroke1: { color: '#c2a776', warning: false },\n\t\t\tbgFillDark: { color: '#1f1e1b', warning: false },\n\t\t\tfgFillDark: { color: '#f3f0e9', warning: false },\n\t\t\tbgFillInverted2: { color: '#1f1e1b', warning: false },\n\t\t\tbgFillInverted1: { color: '#432600', warning: false },\n\t\t\tfgFillInverted: { color: '#f3f0e9', warning: false },\n\t\t\tsurface1: { color: '#faefdc', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n\terror: {\n\t\tramp: {\n\t\t\tbgFill1: { color: '#cc1818', warning: false },\n\t\t\tfgFill: { color: '#f2efef', warning: false },\n\t\t\tbgFill2: { color: '#bc0001', warning: false },\n\t\t\tsurface2: { color: '#fdf6f5', warning: false },\n\t\t\tsurface6: { color: '#f5c9c2', warning: false },\n\t\t\tsurface5: { color: '#f9dcd8', warning: false },\n\t\t\tsurface4: { color: '#fae5e2', warning: false },\n\t\t\tsurface3: { color: '#fff', warning: false },\n\t\t\tfgSurface4: { color: '#4a0000', warning: false },\n\t\t\tfgSurface3: { color: '#cc1818', warning: false },\n\t\t\tfgSurface2: { color: '#f84d41', warning: false },\n\t\t\tfgSurface1: { color: '#ff8373', warning: false },\n\t\t\tstroke3: { color: '#cc1818', warning: false },\n\t\t\tstroke4: { color: '#a70000', warning: false },\n\t\t\tstroke2: { color: '#ca675c', warning: false },\n\t\t\tstroke1: { color: '#dc8e83', warning: false },\n\t\t\tbgFillDark: { color: '#231c1b', warning: false },\n\t\t\tfgFillDark: { color: '#f2efef', warning: false },\n\t\t\tbgFillInverted2: { color: '#231c1b', warning: false },\n\t\t\tbgFillInverted1: { color: '#680000', warning: false },\n\t\t\tfgFillInverted: { color: '#f2efef', warning: false },\n\t\t\tsurface1: { color: '#fcedea', warning: false },\n\t\t},\n\t\tdirection: 'darker',\n\t},\n};\n"],
|
|
5
5
|
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,22 +1,23 @@
|
|
|
1
1
|
// packages/theme/src/color-ramps/lib/find-color-with-constraints.ts
|
|
2
2
|
import { get, OKLCH } from "colorjs.io/fn";
|
|
3
3
|
import "./register-color-spaces";
|
|
4
|
-
import { clampToGamut } from "./utils";
|
|
5
|
-
import {
|
|
6
|
-
WHITE,
|
|
7
|
-
BLACK,
|
|
8
|
-
LIGHTNESS_EPSILON,
|
|
9
|
-
MAX_BISECTION_ITERATIONS
|
|
10
|
-
} from "./constants";
|
|
4
|
+
import { clampToGamut, solveWithBisect } from "./utils";
|
|
5
|
+
import { WHITE, BLACK, CONTRAST_EPSILON } from "./constants";
|
|
11
6
|
import { getContrast } from "./color-utils";
|
|
12
7
|
import { taperChroma } from "./taper-chroma";
|
|
8
|
+
function cdiff(c1, c2) {
|
|
9
|
+
return Math.log(c1 / c2);
|
|
10
|
+
}
|
|
13
11
|
function findColorMeetingRequirements(reference, seed, target, direction, {
|
|
14
12
|
lightnessConstraint,
|
|
15
|
-
taperChromaOptions
|
|
16
|
-
strict = true
|
|
13
|
+
taperChromaOptions
|
|
17
14
|
} = {}) {
|
|
18
15
|
if (target <= 1) {
|
|
19
|
-
return {
|
|
16
|
+
return {
|
|
17
|
+
color: reference,
|
|
18
|
+
reached: true,
|
|
19
|
+
achieved: 1
|
|
20
|
+
};
|
|
20
21
|
}
|
|
21
22
|
function getColorForL(l) {
|
|
22
23
|
let newL = l;
|
|
@@ -35,71 +36,48 @@ function findColorMeetingRequirements(reference, seed, target, direction, {
|
|
|
35
36
|
coords: [newL, newC, get(seed, [OKLCH, "h"])]
|
|
36
37
|
});
|
|
37
38
|
}
|
|
39
|
+
const mostContrastingL = direction === "lighter" ? 1 : 0;
|
|
40
|
+
const mostContrastingColor = direction === "lighter" ? WHITE : BLACK;
|
|
41
|
+
const highestContrast = getContrast(reference, mostContrastingColor);
|
|
38
42
|
if (lightnessConstraint) {
|
|
39
43
|
const colorWithExactL = getColorForL(lightnessConstraint.value);
|
|
40
44
|
const exactLContrast = getContrast(reference, colorWithExactL);
|
|
41
|
-
|
|
45
|
+
const exactLContrastMeetsTarget = cdiff(exactLContrast, target) >= -CONTRAST_EPSILON;
|
|
46
|
+
if (exactLContrastMeetsTarget || lightnessConstraint.type === "force") {
|
|
42
47
|
return {
|
|
43
48
|
color: colorWithExactL,
|
|
44
|
-
reached:
|
|
45
|
-
achieved: exactLContrast
|
|
49
|
+
reached: exactLContrastMeetsTarget,
|
|
50
|
+
achieved: exactLContrast,
|
|
51
|
+
deficit: exactLContrastMeetsTarget ? cdiff(exactLContrast, highestContrast) : cdiff(target, exactLContrast)
|
|
46
52
|
};
|
|
47
53
|
}
|
|
48
54
|
}
|
|
49
|
-
|
|
50
|
-
const mostContrastingColor = direction === "lighter" ? WHITE : BLACK;
|
|
51
|
-
const highestContrast = getContrast(reference, mostContrastingColor);
|
|
52
|
-
if (highestContrast < target) {
|
|
53
|
-
if (strict) {
|
|
54
|
-
throw new Error(
|
|
55
|
-
`Contrast target ${target.toFixed(
|
|
56
|
-
2
|
|
57
|
-
)}:1 unreachable in ${direction} direction(boundary achieves ${highestContrast.toFixed(3)}:1).`
|
|
58
|
-
);
|
|
59
|
-
}
|
|
55
|
+
if (cdiff(highestContrast, target) <= CONTRAST_EPSILON) {
|
|
60
56
|
return {
|
|
61
57
|
color: mostContrastingColor,
|
|
62
|
-
reached:
|
|
63
|
-
achieved: highestContrast
|
|
58
|
+
reached: cdiff(highestContrast, target) >= -CONTRAST_EPSILON,
|
|
59
|
+
achieved: highestContrast,
|
|
60
|
+
deficit: cdiff(target, highestContrast)
|
|
64
61
|
};
|
|
65
62
|
}
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
if (Math.abs(bestContrast - target) <= LIGHTNESS_EPSILON) {
|
|
79
|
-
break;
|
|
80
|
-
}
|
|
81
|
-
if (bestContrast >= target) {
|
|
82
|
-
betterL = newL;
|
|
83
|
-
betterContrast = bestContrast;
|
|
84
|
-
if (replacedBetter) {
|
|
85
|
-
worseContrast = (worseContrast + target) / 2;
|
|
86
|
-
}
|
|
87
|
-
replacedBetter = true;
|
|
88
|
-
replacedWorse = false;
|
|
89
|
-
} else {
|
|
90
|
-
worseL = newL;
|
|
91
|
-
worseContrast = bestContrast;
|
|
92
|
-
if (replacedWorse) {
|
|
93
|
-
betterContrast = (betterContrast + target) / 2;
|
|
94
|
-
}
|
|
95
|
-
replacedWorse = true;
|
|
96
|
-
replacedBetter = false;
|
|
97
|
-
}
|
|
98
|
-
}
|
|
63
|
+
const lowerL = get(reference, [OKLCH, "l"]);
|
|
64
|
+
const lowerContrast = cdiff(1, target);
|
|
65
|
+
const upperL = mostContrastingL;
|
|
66
|
+
const upperContrast = cdiff(highestContrast, target);
|
|
67
|
+
const bestColor = solveWithBisect(
|
|
68
|
+
getColorForL,
|
|
69
|
+
(c) => cdiff(getContrast(reference, c), target),
|
|
70
|
+
lowerL,
|
|
71
|
+
lowerContrast,
|
|
72
|
+
upperL,
|
|
73
|
+
upperContrast
|
|
74
|
+
);
|
|
99
75
|
return {
|
|
100
76
|
color: bestColor,
|
|
101
77
|
reached: true,
|
|
102
|
-
achieved:
|
|
78
|
+
achieved: target,
|
|
79
|
+
// Negative number that specifies how much room we have.
|
|
80
|
+
deficit: cdiff(target, highestContrast)
|
|
103
81
|
};
|
|
104
82
|
}
|
|
105
83
|
export {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/color-ramps/lib/find-color-with-constraints.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport { get, OKLCH, type ColorTypes } from 'colorjs.io/fn';\n\n/**\n * Internal dependencies\n */\nimport './register-color-spaces';\nimport { clampToGamut } from './utils';\nimport {
|
|
5
|
-
"mappings": ";AAGA,SAAS,KAAK,aAA8B;AAK5C,OAAO;AACP,SAAS,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport { get, OKLCH, type ColorTypes } from 'colorjs.io/fn';\n\n/**\n * Internal dependencies\n */\nimport './register-color-spaces';\nimport { clampToGamut, solveWithBisect } from './utils';\nimport { WHITE, BLACK, CONTRAST_EPSILON } from './constants';\nimport { getContrast } from './color-utils';\nimport { type TaperChromaOptions, taperChroma } from './taper-chroma';\n\n/**\n * Difference of contrast values that grows linearly with the Y luminance.\n * We get more precise linear interpolations when we use this.\n * @param c1 First contrast.\n * @param c2 Second contrast.\n * @return Difference of logarithms.\n */\nfunction cdiff( c1: number, c2: number ) {\n\treturn Math.log( c1 / c2 );\n}\n\n/**\n * Solve for L such that:\n * - the L applied to the seed meets the contrast target against the reference\n * - the search is performed in one direction (ie lighter / darker)\n * - more constraints can be applied around lightness\n * - chroma could be tapered\n * @param reference\n * @param seed\n * @param target\n * @param direction\n * @param options\n * @param options.lightnessConstraint\n * @param options.lightnessConstraint.type\n * @param options.lightnessConstraint.value\n * @param options.taperChromaOptions\n */\nexport function findColorMeetingRequirements(\n\treference: ColorTypes,\n\tseed: ColorTypes,\n\ttarget: number,\n\tdirection: 'lighter' | 'darker',\n\t{\n\t\tlightnessConstraint,\n\t\ttaperChromaOptions,\n\t}: {\n\t\tlightnessConstraint?: {\n\t\t\ttype: 'force' | 'onlyIfSucceeds';\n\t\t\tvalue: number;\n\t\t};\n\t\ttaperChromaOptions?: TaperChromaOptions;\n\t} = {}\n): { color: ColorTypes; reached: boolean; achieved: number; deficit?: number } {\n\t// A target of 1 means same color.\n\t// A target lower than 1 doesn't make sense.\n\tif ( target <= 1 ) {\n\t\treturn {\n\t\t\tcolor: reference,\n\t\t\treached: true,\n\t\t\tachieved: 1,\n\t\t};\n\t}\n\n\tfunction getColorForL( l: number ): ColorTypes {\n\t\tlet newL = l;\n\t\tlet newC = get( seed, [ OKLCH, 'c' ] );\n\n\t\tif ( taperChromaOptions ) {\n\t\t\tconst tapered = taperChroma( seed, newL, taperChromaOptions );\n\t\t\t// taperChroma returns either { l, c } or a ColorObject\n\t\t\tif ( 'l' in tapered && 'c' in tapered ) {\n\t\t\t\tnewL = tapered.l;\n\t\t\t\tnewC = tapered.c;\n\t\t\t} else {\n\t\t\t\t// It's already a ColorObject, return it directly\n\t\t\t\treturn tapered;\n\t\t\t}\n\t\t}\n\n\t\treturn clampToGamut( {\n\t\t\tspaceId: 'oklch',\n\t\t\tcoords: [ newL, newC, get( seed, [ OKLCH, 'h' ] ) ],\n\t\t} );\n\t}\n\n\t// Set the boundary based on the direction.\n\tconst mostContrastingL = direction === 'lighter' ? 1 : 0;\n\tconst mostContrastingColor = direction === 'lighter' ? WHITE : BLACK;\n\tconst highestContrast = getContrast( reference, mostContrastingColor );\n\n\tif ( lightnessConstraint ) {\n\t\t// Apply a specific L value.\n\t\t// Useful when pinning a step to a specific lightness, of to specify\n\t\t// min/max L values.\n\t\tconst colorWithExactL = getColorForL( lightnessConstraint.value );\n\t\tconst exactLContrast = getContrast( reference, colorWithExactL );\n\t\tconst exactLContrastMeetsTarget =\n\t\t\tcdiff( exactLContrast, target ) >= -CONTRAST_EPSILON;\n\n\t\t// If the L constraint is of \"force\" type, apply it even when it doesn't\n\t\t// meet the contrast target.\n\t\tif (\n\t\t\texactLContrastMeetsTarget ||\n\t\t\tlightnessConstraint.type === 'force'\n\t\t) {\n\t\t\treturn {\n\t\t\t\tcolor: colorWithExactL,\n\t\t\t\treached: exactLContrastMeetsTarget,\n\t\t\t\tachieved: exactLContrast,\n\t\t\t\tdeficit: exactLContrastMeetsTarget\n\t\t\t\t\t? cdiff( exactLContrast, highestContrast )\n\t\t\t\t\t: cdiff( target, exactLContrast ),\n\t\t\t};\n\t\t}\n\t}\n\n\t// If even the most contrasting color can't reach the target, the target is unreachable.\n\t// On the other hand, if the contrast is very close to the target, we consider it reached.\n\tif ( cdiff( highestContrast, target ) <= CONTRAST_EPSILON ) {\n\t\treturn {\n\t\t\tcolor: mostContrastingColor,\n\t\t\treached: cdiff( highestContrast, target ) >= -CONTRAST_EPSILON,\n\t\t\tachieved: highestContrast,\n\t\t\tdeficit: cdiff( target, highestContrast ),\n\t\t};\n\t}\n\n\t// Bracket: low fails, high meets.\n\t// Originally this was seed.oklch.l \u2014 although it's an assumption that works\n\t// only when we know for sure the direction of the search.\n\t// TODO: can we bring this back to seed.oklch.l ?\n\tconst lowerL = get( reference, [ OKLCH, 'l' ] );\n\tconst lowerContrast = cdiff( 1, target );\n\tconst upperL = mostContrastingL;\n\tconst upperContrast = cdiff( highestContrast, target );\n\n\tconst bestColor = solveWithBisect(\n\t\tgetColorForL,\n\t\t( c: ColorTypes ) => cdiff( getContrast( reference, c ), target ),\n\t\tlowerL,\n\t\tlowerContrast,\n\t\tupperL,\n\t\tupperContrast\n\t);\n\n\treturn {\n\t\tcolor: bestColor,\n\t\treached: true,\n\t\tachieved: target,\n\t\t// Negative number that specifies how much room we have.\n\t\tdeficit: cdiff( target, highestContrast ),\n\t};\n}\n"],
|
|
5
|
+
"mappings": ";AAGA,SAAS,KAAK,aAA8B;AAK5C,OAAO;AACP,SAAS,cAAc,uBAAuB;AAC9C,SAAS,OAAO,OAAO,wBAAwB;AAC/C,SAAS,mBAAmB;AAC5B,SAAkC,mBAAmB;AASrD,SAAS,MAAO,IAAY,IAAa;AACxC,SAAO,KAAK,IAAK,KAAK,EAAG;AAC1B;AAkBO,SAAS,6BACf,WACA,MACA,QACA,WACA;AAAA,EACC;AAAA,EACA;AACD,IAMI,CAAC,GACyE;AAG9E,MAAK,UAAU,GAAI;AAClB,WAAO;AAAA,MACN,OAAO;AAAA,MACP,SAAS;AAAA,MACT,UAAU;AAAA,IACX;AAAA,EACD;AAEA,WAAS,aAAc,GAAwB;AAC9C,QAAI,OAAO;AACX,QAAI,OAAO,IAAK,MAAM,CAAE,OAAO,GAAI,CAAE;AAErC,QAAK,oBAAqB;AACzB,YAAM,UAAU,YAAa,MAAM,MAAM,kBAAmB;AAE5D,UAAK,OAAO,WAAW,OAAO,SAAU;AACvC,eAAO,QAAQ;AACf,eAAO,QAAQ;AAAA,MAChB,OAAO;AAEN,eAAO;AAAA,MACR;AAAA,IACD;AAEA,WAAO,aAAc;AAAA,MACpB,SAAS;AAAA,MACT,QAAQ,CAAE,MAAM,MAAM,IAAK,MAAM,CAAE,OAAO,GAAI,CAAE,CAAE;AAAA,IACnD,CAAE;AAAA,EACH;AAGA,QAAM,mBAAmB,cAAc,YAAY,IAAI;AACvD,QAAM,uBAAuB,cAAc,YAAY,QAAQ;AAC/D,QAAM,kBAAkB,YAAa,WAAW,oBAAqB;AAErE,MAAK,qBAAsB;AAI1B,UAAM,kBAAkB,aAAc,oBAAoB,KAAM;AAChE,UAAM,iBAAiB,YAAa,WAAW,eAAgB;AAC/D,UAAM,4BACL,MAAO,gBAAgB,MAAO,KAAK,CAAC;AAIrC,QACC,6BACA,oBAAoB,SAAS,SAC5B;AACD,aAAO;AAAA,QACN,OAAO;AAAA,QACP,SAAS;AAAA,QACT,UAAU;AAAA,QACV,SAAS,4BACN,MAAO,gBAAgB,eAAgB,IACvC,MAAO,QAAQ,cAAe;AAAA,MAClC;AAAA,IACD;AAAA,EACD;AAIA,MAAK,MAAO,iBAAiB,MAAO,KAAK,kBAAmB;AAC3D,WAAO;AAAA,MACN,OAAO;AAAA,MACP,SAAS,MAAO,iBAAiB,MAAO,KAAK,CAAC;AAAA,MAC9C,UAAU;AAAA,MACV,SAAS,MAAO,QAAQ,eAAgB;AAAA,IACzC;AAAA,EACD;AAMA,QAAM,SAAS,IAAK,WAAW,CAAE,OAAO,GAAI,CAAE;AAC9C,QAAM,gBAAgB,MAAO,GAAG,MAAO;AACvC,QAAM,SAAS;AACf,QAAM,gBAAgB,MAAO,iBAAiB,MAAO;AAErD,QAAM,YAAY;AAAA,IACjB;AAAA,IACA,CAAE,MAAmB,MAAO,YAAa,WAAW,CAAE,GAAG,MAAO;AAAA,IAChE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD;AAEA,SAAO;AAAA,IACN,OAAO;AAAA,IACP,SAAS;AAAA,IACT,UAAU;AAAA;AAAA,IAEV,SAAS,MAAO,QAAQ,eAAgB;AAAA,EACzC;AACD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|