@breadstone/mosaik-themes 0.0.231 → 0.0.233

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 (16) hide show
  1. package/index.cjs +2155 -2041
  2. package/index.cjs.map +1 -1
  3. package/index.d.mts +525 -372
  4. package/index.d.ts +525 -372
  5. package/index.js +2153 -2037
  6. package/index.js.map +1 -1
  7. package/package.json +3 -4
  8. package/tailwind/v3/plugins/joyTailwindPlugin.js +4 -0
  9. package/tailwind/v3/plugins/joyTailwindPlugin.js.map +1 -1
  10. package/tailwind/v3/presets/joyTailwindPresets.js +4 -0
  11. package/tailwind/v3/presets/joyTailwindPresets.js.map +1 -1
  12. package/themes/___joy-tokens.css +8 -0
  13. package/themes/cosmopolitan.scss +670 -36
  14. package/themes/joy-tokens.scss +8 -0
  15. package/themes/joy.scss +1111 -474
  16. package/themes/memphis.scss +717 -83
package/index.js CHANGED
@@ -1,203 +1,558 @@
1
+ import chroma7 from 'chroma-js';
1
2
  import { PureEventEmitter } from '@breadstone/mosaik-elements';
2
- import chroma from 'chroma-js';
3
3
 
4
4
  var __defProp = Object.defineProperty;
5
5
  var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
6
+ function adjust(color, amount) {
7
+ return Math.min(255, Math.max(0, color + amount));
8
+ }
9
+ __name(adjust, "adjust");
10
+ function darken(hex, factor) {
11
+ const [r, g, b] = chroma7(hex).rgb().map((x) => adjust(x, -factor));
12
+ return chroma7(r, g, b, "rgb").hex();
13
+ }
14
+ __name(darken, "darken");
15
+ function lighten(hex, factor) {
16
+ const [r, g, b] = chroma7(hex).rgb().map((x) => adjust(x, factor));
17
+ return chroma7(r, g, b, "rgb").hex();
18
+ }
19
+ __name(lighten, "lighten");
6
20
 
7
- // src/Theming/ThemeFactory.ts
8
- var ThemeFactory = class {
9
- static {
10
- __name(this, "ThemeFactory");
11
- }
12
- /**
13
- * Creates a new theme.
14
- *
15
- * @public
16
- * @static
17
- */
18
- static create(init) {
19
- return {
20
- name: init.name,
21
- scheme: init.scheme,
22
- palette: init.palette,
23
- fontFamily: init.fontFamily,
24
- typography: init.typography,
25
- layout: init.layout,
26
- elevation: init.elevation
27
- };
21
+ // src/Colors/common.ts
22
+ function hexToHSL(hex) {
23
+ const r = parseInt(hex.slice(1, 3), 16) / 255;
24
+ const g = parseInt(hex.slice(3, 5), 16) / 255;
25
+ const b = parseInt(hex.slice(5, 7), 16) / 255;
26
+ const max = Math.max(r, g, b);
27
+ const min = Math.min(r, g, b);
28
+ let h = 0;
29
+ let s = 0;
30
+ const l = (max + min) / 2;
31
+ if (max === min) {
32
+ h = 0;
33
+ s = 0;
34
+ } else {
35
+ const d = max - min;
36
+ s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
37
+ switch (max) {
38
+ case r:
39
+ h = (g - b) / d + (g < b ? 6 : 0);
40
+ break;
41
+ case g:
42
+ h = (b - r) / d + 2;
43
+ break;
44
+ case b:
45
+ h = (r - g) / d + 4;
46
+ break;
47
+ }
48
+ h /= 6;
28
49
  }
29
- /**
30
- * Merges the given theme with the initial theme.
31
- *
32
- * @public
33
- * @static
34
- */
35
- static merge(init, theme) {
36
- return {
37
- name: init.name,
38
- scheme: {
39
- ...theme.scheme,
40
- ...init.scheme
41
- },
42
- palette: {
43
- ...theme.palette,
44
- ...init.palette
45
- },
46
- fontFamily: init.fontFamily.length > 0 ? init.fontFamily : theme.fontFamily,
47
- typography: {
48
- ...theme.typography,
49
- ...init.typography
50
- },
51
- layout: {
52
- ...theme.layout,
53
- ...init.layout
54
- },
55
- elevation: {
56
- ...theme.elevation,
57
- ...init.elevation
58
- }
59
- };
50
+ return [
51
+ h,
52
+ s,
53
+ l
54
+ ];
55
+ }
56
+ __name(hexToHSL, "hexToHSL");
57
+ function hslToHex(h, s, l) {
58
+ const hue2rgb = /* @__PURE__ */ __name((p, q, t) => {
59
+ if (t < 0) {
60
+ t += 1;
61
+ }
62
+ if (t > 1) {
63
+ t -= 1;
64
+ }
65
+ if (t < 1 / 6) {
66
+ return p + (q - p) * 6 * t;
67
+ }
68
+ if (t < 1 / 2) {
69
+ return q;
70
+ }
71
+ if (t < 2 / 3) {
72
+ return p + (q - p) * (2 / 3 - t) * 6;
73
+ }
74
+ return p;
75
+ }, "hue2rgb");
76
+ let r = 0;
77
+ let g = 0;
78
+ let b = 0;
79
+ if (s === 0) {
80
+ r = l;
81
+ g = l;
82
+ b = l;
83
+ } else {
84
+ const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
85
+ const p = 2 * l - q;
86
+ r = hue2rgb(p, q, h + 1 / 3);
87
+ g = hue2rgb(p, q, h);
88
+ b = hue2rgb(p, q, h - 1 / 3);
60
89
  }
61
- };
90
+ return `#${Math.round(r * 255).toString(16).padStart(2, "0")}${Math.round(g * 255).toString(16).padStart(2, "0")}${Math.round(b * 255).toString(16).padStart(2, "0")}`;
91
+ }
92
+ __name(hslToHex, "hslToHex");
93
+ function adjustHue(hsl, adjustment) {
94
+ return [
95
+ (hsl[0] + adjustment + 1) % 1,
96
+ hsl[1],
97
+ hsl[2]
98
+ ];
99
+ }
100
+ __name(adjustHue, "adjustHue");
62
101
 
63
- // src/Theming/Tokens/JoyTokens.ts
64
- var NAME = "joy";
65
- var FONT_FAMILY = "Nunito, sans-serif";
66
- var LAYOUT_RADIUS = "12px";
67
- var LAYOUT_SPACE = "8px";
68
- var LAYOUT_THICKNESS = "2px";
69
- var SCHEME_LIGHT_SURFACE = "#f5f5f5";
70
- var SCHEME_LIGHT_BACKGROUND = "#eaeaea";
71
- var SCHEME_LIGHT_FOREGROUND = "#3c454f";
72
- var SCHEME_LIGHT_HIGHLIGHT = "#d1d1d1";
73
- var SCHEME_LIGHT_MIDDLELIGHT = "#8a8a8a";
74
- var SCHEME_LIGHT_LOWLIGHT = "#5c5c5c";
75
- var SCHEME_LIGHT_TRANSPARENT = "rgba(255, 255, 255, 0)";
76
- var SCHEME_LIGHT_SEMI_TRANSPARENT = "rgba(255, 255, 255, 0.67)";
77
- var SCHEME_LIGHT_DISABLED = "#686868";
78
- var SCHEME_LIGHT_CONTRAST = "#ffffff";
79
- var SCHEME_LIGHT_SELECTION = "rgba(204, 204, 204, 0.44)";
80
- var SCHEME_DARK_SURFACE = "#1e1e1e";
81
- var SCHEME_DARK_BACKGROUND = "#151515";
82
- var SCHEME_DARK_FOREGROUND = "#c3bab0";
83
- var SCHEME_DARK_HIGHLIGHT = "#2e2e2e";
84
- var SCHEME_DARK_MIDDLELIGHT = "#757575";
85
- var SCHEME_DARK_LOWLIGHT = "#a3a3a3";
86
- var SCHEME_DARK_TRANSPARENT = "rgba(255, 255, 255, 0)";
87
- var SCHEME_DARK_SEMI_TRANSPARENT = "rgba(255, 255, 255, 0.03)";
88
- var SCHEME_DARK_DISABLED = "#474747";
89
- var SCHEME_DARK_CONTRAST = "#000000";
90
- var SCHEME_DARK_SELECTION = "rgba(204, 204, 204, 0.44)";
91
- var COLOR_LIGHT_PRIMARY_0 = "#ffffff";
92
- var COLOR_LIGHT_PRIMARY_50 = "#fce4ec";
93
- var COLOR_LIGHT_PRIMARY_100 = "#f8bcd0";
94
- var COLOR_LIGHT_PRIMARY_200 = "#f48fb1";
95
- var COLOR_LIGHT_PRIMARY_300 = "#f06292";
96
- var COLOR_LIGHT_PRIMARY_400 = "#ec407a";
97
- var COLOR_LIGHT_PRIMARY_500 = "#e91e63";
98
- var COLOR_LIGHT_PRIMARY_600 = "#cb1a56";
99
- var COLOR_LIGHT_PRIMARY_700 = "#a31545";
100
- var COLOR_LIGHT_PRIMARY_800 = "#7e1035";
101
- var COLOR_LIGHT_PRIMARY_900 = "#3a0819";
102
- var COLOR_LIGHT_SECONDARY_0 = "#ffffff";
103
- var COLOR_LIGHT_SECONDARY_50 = "#e6f6e9";
104
- var COLOR_LIGHT_SECONDARY_100 = "#c3e8c9";
105
- var COLOR_LIGHT_SECONDARY_200 = "#9bd9a7";
106
- var COLOR_LIGHT_SECONDARY_300 = "#70cb83";
107
- var COLOR_LIGHT_SECONDARY_400 = "#4dbf68";
108
- var COLOR_LIGHT_SECONDARY_500 = "#21b34d";
109
- var COLOR_LIGHT_SECONDARY_600 = "#16a444";
110
- var COLOR_LIGHT_SECONDARY_700 = "#009238";
111
- var COLOR_LIGHT_SECONDARY_800 = "#00812d";
112
- var COLOR_LIGHT_SECONDARY_900 = "#006218";
113
- var COLOR_LIGHT_TERTIARY_0 = "#ffffff";
114
- var COLOR_LIGHT_TERTIARY_50 = "#e1f5fc";
115
- var COLOR_LIGHT_TERTIARY_100 = "#b4e6f7";
116
- var COLOR_LIGHT_TERTIARY_200 = "#84d5f3";
117
- var COLOR_LIGHT_TERTIARY_300 = "#56c5ee";
118
- var COLOR_LIGHT_TERTIARY_400 = "#35b8eb";
119
- var COLOR_LIGHT_TERTIARY_500 = "#19ace9";
120
- var COLOR_LIGHT_TERTIARY_600 = "#139edb";
121
- var COLOR_LIGHT_TERTIARY_700 = "#098bc7";
122
- var COLOR_LIGHT_TERTIARY_800 = "#087ab4";
123
- var COLOR_LIGHT_TERTIARY_900 = "#005a92";
124
- var COLOR_LIGHT_INFO_0 = "#ffffff";
125
- var COLOR_LIGHT_INFO_50 = "#f4faff";
126
- var COLOR_LIGHT_INFO_100 = "#ddf1ff";
127
- var COLOR_LIGHT_INFO_200 = "#addbff";
128
- var COLOR_LIGHT_INFO_300 = "#6fb6ff";
129
- var COLOR_LIGHT_INFO_400 = "#3990ff";
130
- var COLOR_LIGHT_INFO_500 = "#096bde";
131
- var COLOR_LIGHT_INFO_600 = "#054da7";
132
- var COLOR_LIGHT_INFO_700 = "#02367d";
133
- var COLOR_LIGHT_INFO_800 = "#072859";
134
- var COLOR_LIGHT_INFO_900 = "#00153c";
135
- var COLOR_LIGHT_WARNING_0 = "#ffffff";
136
- var COLOR_LIGHT_WARNING_50 = "#fff8c5";
137
- var COLOR_LIGHT_WARNING_100 = "#fae17d";
138
- var COLOR_LIGHT_WARNING_200 = "#eac54f";
139
- var COLOR_LIGHT_WARNING_300 = "#d4a72c";
140
- var COLOR_LIGHT_WARNING_400 = "#bf8700";
141
- var COLOR_LIGHT_WARNING_500 = "#9a6700";
142
- var COLOR_LIGHT_WARNING_600 = "#7d4e00";
143
- var COLOR_LIGHT_WARNING_700 = "#633c01";
144
- var COLOR_LIGHT_WARNING_800 = "#4d2d00";
145
- var COLOR_LIGHT_WARNING_900 = "#3b2300";
146
- var COLOR_LIGHT_DANGER_0 = "#ffffff";
147
- var COLOR_LIGHT_DANGER_50 = "#fff8f6";
148
- var COLOR_LIGHT_DANGER_100 = "#ffe9e8";
149
- var COLOR_LIGHT_DANGER_200 = "#ffc7c5";
150
- var COLOR_LIGHT_DANGER_300 = "#ff9192";
151
- var COLOR_LIGHT_DANGER_400 = "#fa5255";
152
- var COLOR_LIGHT_DANGER_500 = "#d3232f";
153
- var COLOR_LIGHT_DANGER_600 = "#a10e25";
154
- var COLOR_LIGHT_DANGER_700 = "#77061b";
155
- var COLOR_LIGHT_DANGER_800 = "#580013";
156
- var COLOR_LIGHT_DANGER_900 = "#39000d";
157
- var COLOR_LIGHT_SUCCESS_0 = "#ffffff";
158
- var COLOR_LIGHT_SUCCESS_50 = "#f3fef5";
159
- var COLOR_LIGHT_SUCCESS_100 = "#d7f5dd";
160
- var COLOR_LIGHT_SUCCESS_200 = "#77ec95";
161
- var COLOR_LIGHT_SUCCESS_300 = "#4cc76e";
162
- var COLOR_LIGHT_SUCCESS_400 = "#2ca24d";
163
- var COLOR_LIGHT_SUCCESS_500 = "#1a7d36";
164
- var COLOR_LIGHT_SUCCESS_600 = "#0f5d26";
165
- var COLOR_LIGHT_SUCCESS_700 = "#034318";
166
- var COLOR_LIGHT_SUCCESS_800 = "#002f0f";
167
- var COLOR_LIGHT_SUCCESS_900 = "#001d09";
168
- var COLOR_LIGHT_HIGHLIGHT_0 = "#ffffff";
169
- var COLOR_LIGHT_HIGHLIGHT_50 = "#fdf7ff";
170
- var COLOR_LIGHT_HIGHLIGHT_100 = "#f4eaff";
171
- var COLOR_LIGHT_HIGHLIGHT_200 = "#e1cbff";
172
- var COLOR_LIGHT_HIGHLIGHT_300 = "#c69eff";
173
- var COLOR_LIGHT_HIGHLIGHT_400 = "#a374f9";
174
- var COLOR_LIGHT_HIGHLIGHT_500 = "#814dde";
175
- var COLOR_LIGHT_HIGHLIGHT_600 = "#5f35ae";
176
- var COLOR_LIGHT_HIGHLIGHT_700 = "#452382";
177
- var COLOR_LIGHT_HIGHLIGHT_800 = "#301761";
178
- var COLOR_LIGHT_HIGHLIGHT_900 = "#1d0a42";
179
- var COLOR_LIGHT_NEUTRAL_0 = "#ffffff";
180
- var COLOR_LIGHT_NEUTRAL_50 = "#f7f7f8";
181
- var COLOR_LIGHT_NEUTRAL_100 = "#ebebef";
182
- var COLOR_LIGHT_NEUTRAL_200 = "#d8d8df";
183
- var COLOR_LIGHT_NEUTRAL_300 = "#b9b9c6";
184
- var COLOR_LIGHT_NEUTRAL_400 = "#8f8fa3";
185
- var COLOR_LIGHT_NEUTRAL_500 = "#73738c";
186
- var COLOR_LIGHT_NEUTRAL_600 = "#5a5a72";
187
- var COLOR_LIGHT_NEUTRAL_700 = "#434356";
188
- var COLOR_LIGHT_NEUTRAL_800 = "#25252d";
189
- var COLOR_LIGHT_NEUTRAL_900 = "#131318";
190
- var COLOR_DARK_PRIMARY_0 = "#000000";
191
- var COLOR_DARK_PRIMARY_50 = "#3a0819";
192
- var COLOR_DARK_PRIMARY_100 = "#7e1035";
193
- var COLOR_DARK_PRIMARY_200 = "#a31545";
194
- var COLOR_DARK_PRIMARY_300 = "#cb1a56";
195
- var COLOR_DARK_PRIMARY_400 = "#e91e63";
196
- var COLOR_DARK_PRIMARY_500 = "#ec407a";
197
- var COLOR_DARK_PRIMARY_600 = "#f06292";
198
- var COLOR_DARK_PRIMARY_700 = "#f48fb1";
199
- var COLOR_DARK_PRIMARY_800 = "#f8bcd0";
200
- var COLOR_DARK_PRIMARY_900 = "#fce4ec";
102
+ // src/Colors/generators/analogous.ts
103
+ function generateAnalogousPalette(baseHex, adjustment) {
104
+ const baseHSL = hexToHSL(baseHex);
105
+ const adjustedHSL = adjustHue(baseHSL, adjustment);
106
+ const palette = {};
107
+ const steps = [
108
+ 0,
109
+ 50,
110
+ 100,
111
+ 200,
112
+ 300,
113
+ 400,
114
+ 500,
115
+ 600,
116
+ 700,
117
+ 800,
118
+ 900
119
+ ];
120
+ steps.forEach((step) => {
121
+ let [h, s, l] = adjustedHSL;
122
+ if (step === 0) {
123
+ l = 1;
124
+ } else {
125
+ l = 1 - step / 1e3;
126
+ }
127
+ palette[`${step}`] = hslToHex(h, s, Math.max(0, Math.min(1, l)));
128
+ });
129
+ return palette;
130
+ }
131
+ __name(generateAnalogousPalette, "generateAnalogousPalette");
132
+ function generateAnalogousColor(baseHex, adjustment) {
133
+ const baseHSL = hexToHSL(baseHex);
134
+ const adjustedHSL = adjustHue(baseHSL, adjustment);
135
+ const [h, s] = adjustedHSL;
136
+ return hslToHex(h, s, 0.5);
137
+ }
138
+ __name(generateAnalogousColor, "generateAnalogousColor");
139
+ function generateMaterialPalette(hexColor) {
140
+ const baseLight = chroma7("#ffffff");
141
+ const baseDark = chroma7("#000000");
142
+ const palette = {};
143
+ const steps = [
144
+ 0,
145
+ 50,
146
+ 100,
147
+ 200,
148
+ 300,
149
+ 400,
150
+ 500,
151
+ 600,
152
+ 700,
153
+ 800,
154
+ 900
155
+ ];
156
+ const amounts = [
157
+ 0,
158
+ 12,
159
+ 30,
160
+ 50,
161
+ 70,
162
+ 85,
163
+ 100,
164
+ 87,
165
+ 70,
166
+ 54,
167
+ 25
168
+ ];
169
+ steps.forEach((step, i) => {
170
+ const base = step <= 500 ? baseLight : baseDark;
171
+ palette[`${step}`] = chroma7.mix(base, hexColor, amounts[i] / 100, "rgb").hex();
172
+ });
173
+ return palette;
174
+ }
175
+ __name(generateMaterialPalette, "generateMaterialPalette");
176
+
177
+ // src/Colors/generators/complementary.ts
178
+ function generateComplementaryPalette(baseHex) {
179
+ const [h, s, l] = chroma7(baseHex).hsl();
180
+ const complementaryH = (h + 180) % 360;
181
+ return generateMaterialPalette(chroma7.hsl(complementaryH, s, l).hex());
182
+ }
183
+ __name(generateComplementaryPalette, "generateComplementaryPalette");
184
+ function generateComplementaryColor(baseHex) {
185
+ const [h, s, l] = chroma7(baseHex).hsl();
186
+ const complementaryH = (h + 180) % 360;
187
+ return chroma7.hsl(complementaryH, s, l).hex();
188
+ }
189
+ __name(generateComplementaryColor, "generateComplementaryColor");
190
+ function generateSplitComplementaryColors(baseHex) {
191
+ const [h, s, l] = chroma7(baseHex).hsl();
192
+ const splitH1 = (h + 150) % 360;
193
+ const splitH2 = (h + 210) % 360;
194
+ return [
195
+ chroma7.hsl(splitH1, s, l).hex(),
196
+ chroma7.hsl(splitH2, s, l).hex()
197
+ ];
198
+ }
199
+ __name(generateSplitComplementaryColors, "generateSplitComplementaryColors");
200
+ function generateSplitComplementaryColor1(baseHex) {
201
+ const [h, s, l] = chroma7(baseHex).hsl();
202
+ const splitH = (h + 150) % 360;
203
+ return chroma7.hsl(splitH, s, l).hex();
204
+ }
205
+ __name(generateSplitComplementaryColor1, "generateSplitComplementaryColor1");
206
+ function generateSplitComplementaryColor2(baseHex) {
207
+ const [h, s, l] = chroma7(baseHex).hsl();
208
+ const splitH = (h + 210) % 360;
209
+ return chroma7.hsl(splitH, s, l).hex();
210
+ }
211
+ __name(generateSplitComplementaryColor2, "generateSplitComplementaryColor2");
212
+ function generateTetradicColors(baseHex) {
213
+ const [h, s, l] = chroma7(baseHex).hsl();
214
+ return [
215
+ chroma7.hsl((h + 90) % 360, s, l).hex(),
216
+ chroma7.hsl((h + 180) % 360, s, l).hex(),
217
+ chroma7.hsl((h + 270) % 360, s, l).hex()
218
+ ];
219
+ }
220
+ __name(generateTetradicColors, "generateTetradicColors");
221
+ function generateTetradicColor1(baseHex) {
222
+ const [h, s, l] = chroma7(baseHex).hsl();
223
+ return chroma7.hsl((h + 90) % 360, s, l).hex();
224
+ }
225
+ __name(generateTetradicColor1, "generateTetradicColor1");
226
+ function generateTetradicColor3(baseHex) {
227
+ const [h, s, l] = chroma7(baseHex).hsl();
228
+ return chroma7.hsl((h + 270) % 360, s, l).hex();
229
+ }
230
+ __name(generateTetradicColor3, "generateTetradicColor3");
231
+
232
+ // src/Colors/generators/triadic.ts
233
+ function generateTriadicPalette(baseHex, adjustment) {
234
+ const baseHSL = hexToHSL(baseHex);
235
+ const triadicHSL = adjustHue(baseHSL, adjustment);
236
+ const palette = {};
237
+ const steps = [
238
+ 0,
239
+ 50,
240
+ 100,
241
+ 200,
242
+ 300,
243
+ 400,
244
+ 500,
245
+ 600,
246
+ 700,
247
+ 800,
248
+ 900
249
+ ];
250
+ steps.forEach((step) => {
251
+ let [h, s, l] = triadicHSL;
252
+ if (step === 0) {
253
+ l = 1;
254
+ } else {
255
+ l = 1 - step / 1e3;
256
+ }
257
+ palette[`${step}`] = hslToHex(h, s, Math.max(0, Math.min(1, l)));
258
+ });
259
+ return palette;
260
+ }
261
+ __name(generateTriadicPalette, "generateTriadicPalette");
262
+ function generateTriadicColor(baseHex, adjustment) {
263
+ const baseHSL = hexToHSL(baseHex);
264
+ const triadicHSL = adjustHue(baseHSL, adjustment);
265
+ const [h, s] = triadicHSL;
266
+ return hslToHex(h, s, 0.5);
267
+ }
268
+ __name(generateTriadicColor, "generateTriadicColor");
269
+
270
+ // src/Colors/index.ts
271
+ (function(Colors2) {
272
+ Colors2.toDarken = darken;
273
+ Colors2.toLighten = lighten;
274
+ Colors2.toMaterialPalette = generateMaterialPalette;
275
+ Colors2.toComplementaryPalette = generateComplementaryPalette;
276
+ Colors2.toComplementaryColor = generateComplementaryColor;
277
+ Colors2.toAnalogousPalette = generateAnalogousPalette;
278
+ Colors2.toAnalogousColor = generateAnalogousColor;
279
+ Colors2.toTriadicPalette = generateTriadicPalette;
280
+ Colors2.toTriadicColor = generateTriadicColor;
281
+ Colors2.toSplitComplementaryColors = generateSplitComplementaryColors;
282
+ Colors2.toSplitComplementaryColor1 = generateSplitComplementaryColor1;
283
+ Colors2.toSplitComplementaryColor2 = generateSplitComplementaryColor2;
284
+ Colors2.toTetradicColors = generateTetradicColors;
285
+ Colors2.toTetradicColor1 = generateTetradicColor1;
286
+ Colors2.toTetradicColor3 = generateTetradicColor3;
287
+ })(Colors || (Colors = {}));
288
+ var Colors;
289
+
290
+ // src/Theming/Adapters/BrowserPlatformAdapter.ts
291
+ var BrowserPlatformAdapter = class {
292
+ static {
293
+ __name(this, "BrowserPlatformAdapter");
294
+ }
295
+ // #region Methods
296
+ matchMedia(query) {
297
+ return window.matchMedia(query).matches;
298
+ }
299
+ setDocumentAttribute(name, value) {
300
+ document.documentElement.setAttribute(name, value);
301
+ }
302
+ getDocumentAttribute(name) {
303
+ return document.documentElement.getAttribute(name);
304
+ }
305
+ observeDocumentAttributes(attributes, callback) {
306
+ const observer = new MutationObserver((mutations) => {
307
+ mutations.forEach((mutation) => {
308
+ if (mutation.type === "attributes" && mutation.attributeName) {
309
+ const newValue = document.documentElement.getAttribute(mutation.attributeName);
310
+ callback(mutation.attributeName, newValue);
311
+ }
312
+ });
313
+ });
314
+ observer.observe(document.documentElement, {
315
+ attributes: true,
316
+ attributeFilter: attributes
317
+ });
318
+ return () => observer.disconnect();
319
+ }
320
+ };
321
+
322
+ // src/Theming/Adapters/NodePlatformAdapter.ts
323
+ var NodePlatformAdapter = class {
324
+ static {
325
+ __name(this, "NodePlatformAdapter");
326
+ }
327
+ // #region Methods
328
+ matchMedia(_query) {
329
+ return false;
330
+ }
331
+ setDocumentAttribute(_name, _value) {
332
+ }
333
+ getDocumentAttribute(_name) {
334
+ return null;
335
+ }
336
+ observeDocumentAttributes(_attributes, _callback) {
337
+ return () => {
338
+ };
339
+ }
340
+ };
341
+
342
+ // src/Theming/Adapters/PlatformAdapterFactory.ts
343
+ var PlatformAdapterFactory = class {
344
+ static {
345
+ __name(this, "PlatformAdapterFactory");
346
+ }
347
+ // #region Methods
348
+ /**
349
+ * Creates the appropriate platform adapter based on the current environment.
350
+ * Automatically detects if running in browser or Node.js.
351
+ *
352
+ * @public
353
+ */
354
+ static create() {
355
+ if (typeof window !== "undefined" && typeof document !== "undefined") {
356
+ return new BrowserPlatformAdapter();
357
+ }
358
+ return new NodePlatformAdapter();
359
+ }
360
+ };
361
+
362
+ // src/Theming/ThemeFactory.ts
363
+ var ThemeFactory = class {
364
+ static {
365
+ __name(this, "ThemeFactory");
366
+ }
367
+ /**
368
+ * Creates a new theme.
369
+ *
370
+ * @public
371
+ * @static
372
+ */
373
+ static create(init) {
374
+ return {
375
+ name: init.name,
376
+ scheme: init.scheme,
377
+ palette: init.palette,
378
+ fontFamily: init.fontFamily,
379
+ typography: init.typography,
380
+ layout: init.layout,
381
+ elevation: init.elevation
382
+ };
383
+ }
384
+ /**
385
+ * Merges the given theme with the initial theme.
386
+ *
387
+ * @public
388
+ * @static
389
+ */
390
+ static merge(init, theme) {
391
+ return {
392
+ name: init.name,
393
+ scheme: {
394
+ ...theme.scheme,
395
+ ...init.scheme
396
+ },
397
+ palette: {
398
+ ...theme.palette,
399
+ ...init.palette
400
+ },
401
+ fontFamily: init.fontFamily.length > 0 ? init.fontFamily : theme.fontFamily,
402
+ typography: {
403
+ ...theme.typography,
404
+ ...init.typography
405
+ },
406
+ layout: {
407
+ ...theme.layout,
408
+ ...init.layout
409
+ },
410
+ elevation: {
411
+ ...theme.elevation,
412
+ ...init.elevation
413
+ }
414
+ };
415
+ }
416
+ };
417
+
418
+ // src/Theming/Tokens/CosmopolitanTokens.ts
419
+ var NAME = "cosmopolitan";
420
+ var FONT_FAMILY = "'Noto Sans', sans-serif";
421
+ var LAYOUT_RADIUS = "3px";
422
+ var LAYOUT_SPACE = "8px";
423
+ var LAYOUT_THICKNESS = "1px";
424
+ var SCHEME_LIGHT_SURFACE = "#fefefe";
425
+ var SCHEME_LIGHT_CONTRAST = "#ffffff";
426
+ var SCHEME_LIGHT_BACKGROUND = "#ffffff";
427
+ var SCHEME_LIGHT_FOREGROUND = "#000000";
428
+ var SCHEME_LIGHT_HIGHLIGHT = "#e2e2e2";
429
+ var SCHEME_LIGHT_MIDDLELIGHT = "#777777";
430
+ var SCHEME_LIGHT_LOWLIGHT = "#4d4d4d";
431
+ var SCHEME_LIGHT_TRANSPARENT = "rgba(255, 255, 255, 0)";
432
+ var SCHEME_LIGHT_SEMI_TRANSPARENT = "rgba(255, 255, 255, 0.67)";
433
+ var SCHEME_LIGHT_DISABLED = "#b8b5b2";
434
+ var SCHEME_LIGHT_SELECTION = "#ffaad4";
435
+ var SCHEME_DARK_SURFACE = "#2e2d2d";
436
+ var SCHEME_DARK_CONTRAST = "#ffffff";
437
+ var SCHEME_DARK_BACKGROUND = "#2e2d2d";
438
+ var SCHEME_DARK_FOREGROUND = "#ffffff";
439
+ var SCHEME_DARK_HIGHLIGHT = "#333333";
440
+ var SCHEME_DARK_MIDDLELIGHT = "#666666";
441
+ var SCHEME_DARK_LOWLIGHT = "#999999";
442
+ var SCHEME_DARK_TRANSPARENT = "rgba(23, 23, 23, 0)";
443
+ var SCHEME_DARK_SEMI_TRANSPARENT = "rgba(23, 23, 23, 0.67)";
444
+ var SCHEME_DARK_DISABLED = "#5c5956";
445
+ var SCHEME_DARK_SELECTION = "#ff66aa";
446
+ var COLOR_LIGHT_PRIMARY_0 = "#ffffff";
447
+ var COLOR_LIGHT_PRIMARY_50 = "#fce4ec";
448
+ var COLOR_LIGHT_PRIMARY_100 = "#f8bcd0";
449
+ var COLOR_LIGHT_PRIMARY_200 = "#f48fb1";
450
+ var COLOR_LIGHT_PRIMARY_300 = "#f06292";
451
+ var COLOR_LIGHT_PRIMARY_400 = "#ec407a";
452
+ var COLOR_LIGHT_PRIMARY_500 = "#e91e63";
453
+ var COLOR_LIGHT_PRIMARY_600 = "#cb1a56";
454
+ var COLOR_LIGHT_PRIMARY_700 = "#a31545";
455
+ var COLOR_LIGHT_PRIMARY_800 = "#7e1035";
456
+ var COLOR_LIGHT_PRIMARY_900 = "#3a0819";
457
+ var COLOR_LIGHT_SECONDARY_0 = "#ffffff";
458
+ var COLOR_LIGHT_SECONDARY_50 = "#e6f6e9";
459
+ var COLOR_LIGHT_SECONDARY_100 = "#c3e8c9";
460
+ var COLOR_LIGHT_SECONDARY_200 = "#9bd9a7";
461
+ var COLOR_LIGHT_SECONDARY_300 = "#70cb83";
462
+ var COLOR_LIGHT_SECONDARY_400 = "#4dbf68";
463
+ var COLOR_LIGHT_SECONDARY_500 = "#21b34d";
464
+ var COLOR_LIGHT_SECONDARY_600 = "#16a444";
465
+ var COLOR_LIGHT_SECONDARY_700 = "#009238";
466
+ var COLOR_LIGHT_SECONDARY_800 = "#00812d";
467
+ var COLOR_LIGHT_SECONDARY_900 = "#006218";
468
+ var COLOR_LIGHT_TERTIARY_0 = "#ffffff";
469
+ var COLOR_LIGHT_TERTIARY_50 = "#e1f5fc";
470
+ var COLOR_LIGHT_TERTIARY_100 = "#b4e6f7";
471
+ var COLOR_LIGHT_TERTIARY_200 = "#84d5f3";
472
+ var COLOR_LIGHT_TERTIARY_300 = "#56c5ee";
473
+ var COLOR_LIGHT_TERTIARY_400 = "#35b8eb";
474
+ var COLOR_LIGHT_TERTIARY_500 = "#19ace9";
475
+ var COLOR_LIGHT_TERTIARY_600 = "#139edb";
476
+ var COLOR_LIGHT_TERTIARY_700 = "#098bc7";
477
+ var COLOR_LIGHT_TERTIARY_800 = "#087ab4";
478
+ var COLOR_LIGHT_TERTIARY_900 = "#005a92";
479
+ var COLOR_LIGHT_INFO_0 = "#ffffff";
480
+ var COLOR_LIGHT_INFO_50 = "#f4faff";
481
+ var COLOR_LIGHT_INFO_100 = "#ddf1ff";
482
+ var COLOR_LIGHT_INFO_200 = "#addbff";
483
+ var COLOR_LIGHT_INFO_300 = "#6fb6ff";
484
+ var COLOR_LIGHT_INFO_400 = "#3990ff";
485
+ var COLOR_LIGHT_INFO_500 = "#096bde";
486
+ var COLOR_LIGHT_INFO_600 = "#054da7";
487
+ var COLOR_LIGHT_INFO_700 = "#02367d";
488
+ var COLOR_LIGHT_INFO_800 = "#072859";
489
+ var COLOR_LIGHT_INFO_900 = "#00153c";
490
+ var COLOR_LIGHT_WARNING_0 = "#ffffff";
491
+ var COLOR_LIGHT_WARNING_50 = "#fff8c5";
492
+ var COLOR_LIGHT_WARNING_100 = "#fae17d";
493
+ var COLOR_LIGHT_WARNING_200 = "#eac54f";
494
+ var COLOR_LIGHT_WARNING_300 = "#d4a72c";
495
+ var COLOR_LIGHT_WARNING_400 = "#bf8700";
496
+ var COLOR_LIGHT_WARNING_500 = "#9a6700";
497
+ var COLOR_LIGHT_WARNING_600 = "#7d4e00";
498
+ var COLOR_LIGHT_WARNING_700 = "#633c01";
499
+ var COLOR_LIGHT_WARNING_800 = "#4d2d00";
500
+ var COLOR_LIGHT_WARNING_900 = "#3b2300";
501
+ var COLOR_LIGHT_DANGER_0 = "#ffffff";
502
+ var COLOR_LIGHT_DANGER_50 = "#fff8f6";
503
+ var COLOR_LIGHT_DANGER_100 = "#ffe9e8";
504
+ var COLOR_LIGHT_DANGER_200 = "#ffc7c5";
505
+ var COLOR_LIGHT_DANGER_300 = "#ff9192";
506
+ var COLOR_LIGHT_DANGER_400 = "#fa5255";
507
+ var COLOR_LIGHT_DANGER_500 = "#d3232f";
508
+ var COLOR_LIGHT_DANGER_600 = "#a10e25";
509
+ var COLOR_LIGHT_DANGER_700 = "#77061b";
510
+ var COLOR_LIGHT_DANGER_800 = "#580013";
511
+ var COLOR_LIGHT_DANGER_900 = "#39000d";
512
+ var COLOR_LIGHT_SUCCESS_0 = "#ffffff";
513
+ var COLOR_LIGHT_SUCCESS_50 = "#f3fef5";
514
+ var COLOR_LIGHT_SUCCESS_100 = "#d7f5dd";
515
+ var COLOR_LIGHT_SUCCESS_200 = "#77ec95";
516
+ var COLOR_LIGHT_SUCCESS_300 = "#4cc76e";
517
+ var COLOR_LIGHT_SUCCESS_400 = "#2ca24d";
518
+ var COLOR_LIGHT_SUCCESS_500 = "#1a7d36";
519
+ var COLOR_LIGHT_SUCCESS_600 = "#0f5d26";
520
+ var COLOR_LIGHT_SUCCESS_700 = "#034318";
521
+ var COLOR_LIGHT_SUCCESS_800 = "#002f0f";
522
+ var COLOR_LIGHT_SUCCESS_900 = "#001d09";
523
+ var COLOR_LIGHT_HIGHLIGHT_0 = "#ffffff";
524
+ var COLOR_LIGHT_HIGHLIGHT_50 = "#fdf7ff";
525
+ var COLOR_LIGHT_HIGHLIGHT_100 = "#f4eaff";
526
+ var COLOR_LIGHT_HIGHLIGHT_200 = "#e1cbff";
527
+ var COLOR_LIGHT_HIGHLIGHT_300 = "#c69eff";
528
+ var COLOR_LIGHT_HIGHLIGHT_400 = "#a374f9";
529
+ var COLOR_LIGHT_HIGHLIGHT_500 = "#814dde";
530
+ var COLOR_LIGHT_HIGHLIGHT_600 = "#5f35ae";
531
+ var COLOR_LIGHT_HIGHLIGHT_700 = "#452382";
532
+ var COLOR_LIGHT_HIGHLIGHT_800 = "#301761";
533
+ var COLOR_LIGHT_HIGHLIGHT_900 = "#1d0a42";
534
+ var COLOR_LIGHT_NEUTRAL_0 = "#ffffff";
535
+ var COLOR_LIGHT_NEUTRAL_50 = "#f7f7f8";
536
+ var COLOR_LIGHT_NEUTRAL_100 = "#ebebef";
537
+ var COLOR_LIGHT_NEUTRAL_200 = "#d8d8df";
538
+ var COLOR_LIGHT_NEUTRAL_300 = "#b9b9c6";
539
+ var COLOR_LIGHT_NEUTRAL_400 = "#8f8fa3";
540
+ var COLOR_LIGHT_NEUTRAL_500 = "#73738c";
541
+ var COLOR_LIGHT_NEUTRAL_600 = "#5a5a72";
542
+ var COLOR_LIGHT_NEUTRAL_700 = "#434356";
543
+ var COLOR_LIGHT_NEUTRAL_800 = "#25252d";
544
+ var COLOR_LIGHT_NEUTRAL_900 = "#131318";
545
+ var COLOR_DARK_PRIMARY_0 = "#000000";
546
+ var COLOR_DARK_PRIMARY_50 = "#3a0819";
547
+ var COLOR_DARK_PRIMARY_100 = "#7e1035";
548
+ var COLOR_DARK_PRIMARY_200 = "#a31545";
549
+ var COLOR_DARK_PRIMARY_300 = "#cb1a56";
550
+ var COLOR_DARK_PRIMARY_400 = "#e91e63";
551
+ var COLOR_DARK_PRIMARY_500 = "#ec407a";
552
+ var COLOR_DARK_PRIMARY_600 = "#f06292";
553
+ var COLOR_DARK_PRIMARY_700 = "#f48fb1";
554
+ var COLOR_DARK_PRIMARY_800 = "#f8bcd0";
555
+ var COLOR_DARK_PRIMARY_900 = "#fce4ec";
201
556
  var COLOR_DARK_SECONDARY_0 = "#000000";
202
557
  var COLOR_DARK_SECONDARY_50 = "#006218";
203
558
  var COLOR_DARK_SECONDARY_100 = "#00812d";
@@ -286,97 +641,70 @@ var COLOR_DARK_NEUTRAL_600 = "#b9b9c6";
286
641
  var COLOR_DARK_NEUTRAL_700 = "#d8d8df";
287
642
  var COLOR_DARK_NEUTRAL_800 = "#ebebef";
288
643
  var COLOR_DARK_NEUTRAL_900 = "#f7f7f8";
289
- var TYPOGRAPHY_HEADLINE1_FONT_FAMILY = "Nunito, sans-serif";
290
- var TYPOGRAPHY_HEADLINE1_FONT_SIZE = "96px";
291
- var TYPOGRAPHY_HEADLINE1_LINE_HEIGHT = "100px";
644
+ var TYPOGRAPHY_HEADLINE1_FONT_FAMILY = "'Noto Sans', sans-serif";
645
+ var TYPOGRAPHY_HEADLINE1_FONT_SIZE = "24px";
646
+ var TYPOGRAPHY_HEADLINE1_LINE_HEIGHT = "28px";
292
647
  var TYPOGRAPHY_HEADLINE1_FONT_WEIGHT = "300";
293
648
  var TYPOGRAPHY_HEADLINE1_LETTER_SPACING = "-0.25px";
294
649
  var TYPOGRAPHY_HEADLINE1_TEXT_DECORATION = "none";
295
650
  var TYPOGRAPHY_HEADLINE1_TEXT_TRANSFORM = "none";
296
- var TYPOGRAPHY_HEADLINE2_FONT_FAMILY = "Nunito, sans-serif";
297
- var TYPOGRAPHY_HEADLINE2_FONT_SIZE = "60px";
298
- var TYPOGRAPHY_HEADLINE2_LINE_HEIGHT = "64px";
651
+ var TYPOGRAPHY_HEADLINE2_FONT_FAMILY = "'Noto Sans', sans-serif";
652
+ var TYPOGRAPHY_HEADLINE2_FONT_SIZE = "24px";
653
+ var TYPOGRAPHY_HEADLINE2_LINE_HEIGHT = "28px";
299
654
  var TYPOGRAPHY_HEADLINE2_FONT_WEIGHT = "300";
300
- var TYPOGRAPHY_HEADLINE2_LETTER_SPACING = "-0.13333333333333333px";
655
+ var TYPOGRAPHY_HEADLINE2_LETTER_SPACING = "-0.25px";
301
656
  var TYPOGRAPHY_HEADLINE2_TEXT_DECORATION = "none";
302
657
  var TYPOGRAPHY_HEADLINE2_TEXT_TRANSFORM = "none";
303
- var TYPOGRAPHY_HEADLINE3_FONT_FAMILY = "Nunito, sans-serif";
304
- var TYPOGRAPHY_HEADLINE3_FONT_SIZE = "48px";
305
- var TYPOGRAPHY_HEADLINE3_LINE_HEIGHT = "52px";
306
- var TYPOGRAPHY_HEADLINE3_FONT_WEIGHT = "400";
307
- var TYPOGRAPHY_HEADLINE3_LETTER_SPACING = "normal";
658
+ var TYPOGRAPHY_HEADLINE3_FONT_FAMILY = "'Noto Sans', sans-serif";
659
+ var TYPOGRAPHY_HEADLINE3_FONT_SIZE = "24px";
660
+ var TYPOGRAPHY_HEADLINE3_LINE_HEIGHT = "28px";
661
+ var TYPOGRAPHY_HEADLINE3_FONT_WEIGHT = "300";
662
+ var TYPOGRAPHY_HEADLINE3_LETTER_SPACING = "-0.25px";
308
663
  var TYPOGRAPHY_HEADLINE3_TEXT_DECORATION = "none";
309
664
  var TYPOGRAPHY_HEADLINE3_TEXT_TRANSFORM = "none";
310
- var TYPOGRAPHY_HEADLINE4_FONT_FAMILY = "Nunito, sans-serif";
311
- var TYPOGRAPHY_HEADLINE4_FONT_SIZE = "34px";
312
- var TYPOGRAPHY_HEADLINE4_LINE_HEIGHT = "38px";
313
- var TYPOGRAPHY_HEADLINE4_FONT_WEIGHT = "400";
314
- var TYPOGRAPHY_HEADLINE4_LETTER_SPACING = "0.11764705882352941px";
665
+ var TYPOGRAPHY_HEADLINE4_FONT_FAMILY = "'Noto Sans', sans-serif";
666
+ var TYPOGRAPHY_HEADLINE4_FONT_SIZE = "24px";
667
+ var TYPOGRAPHY_HEADLINE4_LINE_HEIGHT = "28px";
668
+ var TYPOGRAPHY_HEADLINE4_FONT_WEIGHT = "300";
669
+ var TYPOGRAPHY_HEADLINE4_LETTER_SPACING = "-0.25px";
315
670
  var TYPOGRAPHY_HEADLINE4_TEXT_DECORATION = "none";
316
671
  var TYPOGRAPHY_HEADLINE4_TEXT_TRANSFORM = "none";
317
- var TYPOGRAPHY_HEADLINE5_FONT_FAMILY = "Nunito, sans-serif";
672
+ var TYPOGRAPHY_HEADLINE5_FONT_FAMILY = "'Noto Sans', sans-serif";
318
673
  var TYPOGRAPHY_HEADLINE5_FONT_SIZE = "24px";
319
674
  var TYPOGRAPHY_HEADLINE5_LINE_HEIGHT = "28px";
320
- var TYPOGRAPHY_HEADLINE5_FONT_WEIGHT = "400";
321
- var TYPOGRAPHY_HEADLINE5_LETTER_SPACING = "normal";
675
+ var TYPOGRAPHY_HEADLINE5_FONT_WEIGHT = "300";
676
+ var TYPOGRAPHY_HEADLINE5_LETTER_SPACING = "-0.25px";
322
677
  var TYPOGRAPHY_HEADLINE5_TEXT_DECORATION = "none";
323
678
  var TYPOGRAPHY_HEADLINE5_TEXT_TRANSFORM = "none";
324
- var TYPOGRAPHY_HEADLINE6_FONT_FAMILY = "Nunito, sans-serif";
325
- var TYPOGRAPHY_HEADLINE6_FONT_SIZE = "20px";
326
- var TYPOGRAPHY_HEADLINE6_LINE_HEIGHT = "24px";
327
- var TYPOGRAPHY_HEADLINE6_FONT_WEIGHT = "500";
328
- var TYPOGRAPHY_HEADLINE6_LETTER_SPACING = "0.2px";
329
- var TYPOGRAPHY_HEADLINE6_TEXT_DECORATION = "none";
330
- var TYPOGRAPHY_HEADLINE6_TEXT_TRANSFORM = "none";
331
- var TYPOGRAPHY_SUBTITLE1_FONT_FAMILY = "Nunito, sans-serif";
332
- var TYPOGRAPHY_SUBTITLE1_FONT_SIZE = "16px";
333
- var TYPOGRAPHY_SUBTITLE1_LINE_HEIGHT = "20px";
334
- var TYPOGRAPHY_SUBTITLE1_FONT_WEIGHT = "400";
335
- var TYPOGRAPHY_SUBTITLE1_LETTER_SPACING = "0.15px";
336
- var TYPOGRAPHY_SUBTITLE1_TEXT_DECORATION = "none";
337
- var TYPOGRAPHY_SUBTITLE1_TEXT_TRANSFORM = "none";
338
- var TYPOGRAPHY_SUBTITLE2_FONT_FAMILY = "Nunito, sans-serif";
339
- var TYPOGRAPHY_SUBTITLE2_FONT_SIZE = "14px";
340
- var TYPOGRAPHY_SUBTITLE2_LINE_HEIGHT = "18px";
341
- var TYPOGRAPHY_SUBTITLE2_FONT_WEIGHT = "500";
342
- var TYPOGRAPHY_SUBTITLE2_LETTER_SPACING = "0.1142857142857143px";
343
- var TYPOGRAPHY_SUBTITLE2_TEXT_DECORATION = "none";
344
- var TYPOGRAPHY_SUBTITLE2_TEXT_TRANSFORM = "none";
345
- var TYPOGRAPHY_BODY1_FONT_FAMILY = "Nunito, sans-serif";
679
+ var TYPOGRAPHY_HEADLINE6_FONT_FAMILY = "'Noto Sans', sans-serif";
680
+ var TYPOGRAPHY_HEADLINE6_FONT_SIZE = "24px";
681
+ var TYPOGRAPHY_HEADLINE6_LINE_HEIGHT = "28px";
682
+ var TYPOGRAPHY_HEADLINE6_FONT_WEIGHT = "300";
683
+ var TYPOGRAPHY_HEADLINE6_LETTER_SPACING = "-0.25px";
684
+ var TYPOGRAPHY_HEADLINE6_TEXT_DECORATION = "none";
685
+ var TYPOGRAPHY_HEADLINE6_TEXT_TRANSFORM = "none";
686
+ var TYPOGRAPHY_BODY1_FONT_FAMILY = "'Noto Sans', sans-serif";
346
687
  var TYPOGRAPHY_BODY1_FONT_SIZE = "16px";
347
688
  var TYPOGRAPHY_BODY1_LINE_HEIGHT = "20px";
348
- var TYPOGRAPHY_BODY1_FONT_WEIGHT = "400";
349
- var TYPOGRAPHY_BODY1_LETTER_SPACING = "0.5px";
689
+ var TYPOGRAPHY_BODY1_FONT_WEIGHT = "300";
690
+ var TYPOGRAPHY_BODY1_LETTER_SPACING = "-0.25px";
350
691
  var TYPOGRAPHY_BODY1_TEXT_DECORATION = "none";
351
692
  var TYPOGRAPHY_BODY1_TEXT_TRANSFORM = "none";
352
- var TYPOGRAPHY_BODY2_FONT_FAMILY = "Nunito, sans-serif";
353
- var TYPOGRAPHY_BODY2_FONT_SIZE = "14px";
354
- var TYPOGRAPHY_BODY2_LINE_HEIGHT = "18px";
355
- var TYPOGRAPHY_BODY2_FONT_WEIGHT = "400";
356
- var TYPOGRAPHY_BODY2_LETTER_SPACING = "0.2857142857142857px";
693
+ var TYPOGRAPHY_BODY2_FONT_FAMILY = "'Noto Sans', sans-serif";
694
+ var TYPOGRAPHY_BODY2_FONT_SIZE = "16px";
695
+ var TYPOGRAPHY_BODY2_LINE_HEIGHT = "20px";
696
+ var TYPOGRAPHY_BODY2_FONT_WEIGHT = "300";
697
+ var TYPOGRAPHY_BODY2_LETTER_SPACING = "-0.25px";
357
698
  var TYPOGRAPHY_BODY2_TEXT_DECORATION = "none";
358
699
  var TYPOGRAPHY_BODY2_TEXT_TRANSFORM = "none";
359
- var TYPOGRAPHY_CAPTION_FONT_FAMILY = "Nunito, sans-serif";
360
- var TYPOGRAPHY_CAPTION_FONT_SIZE = "12px";
361
- var TYPOGRAPHY_CAPTION_LINE_HEIGHT = "16px";
362
- var TYPOGRAPHY_CAPTION_FONT_WEIGHT = "400";
363
- var TYPOGRAPHY_CAPTION_LETTER_SPACING = "0.5333333333333333px";
364
- var TYPOGRAPHY_CAPTION_TEXT_DECORATION = "none";
365
- var TYPOGRAPHY_CAPTION_TEXT_TRANSFORM = "none";
366
- var TYPOGRAPHY_BUTTON_FONT_FAMILY = "Nunito, sans-serif";
367
- var TYPOGRAPHY_BUTTON_FONT_SIZE = "14px";
368
- var TYPOGRAPHY_BUTTON_LINE_HEIGHT = "18px";
700
+ var TYPOGRAPHY_BUTTON_FONT_FAMILY = "'Noto Sans', sans-serif";
701
+ var TYPOGRAPHY_BUTTON_FONT_SIZE = "16px";
702
+ var TYPOGRAPHY_BUTTON_LINE_HEIGHT = "20px";
369
703
  var TYPOGRAPHY_BUTTON_FONT_WEIGHT = "700";
370
- var TYPOGRAPHY_BUTTON_LETTER_SPACING = "1.4285714285714286px";
704
+ var TYPOGRAPHY_BUTTON_LETTER_SPACING = "-0.25px";
371
705
  var TYPOGRAPHY_BUTTON_TEXT_DECORATION = "none";
372
- var TYPOGRAPHY_BUTTON_TEXT_TRANSFORM = "none";
373
- var TYPOGRAPHY_OVERLINE_FONT_FAMILY = "Nunito, sans-serif";
374
- var TYPOGRAPHY_OVERLINE_FONT_SIZE = "12px";
375
- var TYPOGRAPHY_OVERLINE_LINE_HEIGHT = "16px";
376
- var TYPOGRAPHY_OVERLINE_FONT_WEIGHT = "500";
377
- var TYPOGRAPHY_OVERLINE_LETTER_SPACING = "2.6666666666666665px";
378
- var TYPOGRAPHY_OVERLINE_TEXT_DECORATION = "none";
379
- var TYPOGRAPHY_OVERLINE_TEXT_TRANSFORM = "none";
706
+ var TYPOGRAPHY_BUTTON_TEXT_TRANSFORM = "uppercase";
707
+ var ELEVATION_NONE = "none";
380
708
  var ELEVATION_LIGHT_LIGHT = "0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 1px 2px 0px rgba(0, 0, 0, 0.14)";
381
709
  var ELEVATION_LIGHT_SEMILIGHT = "0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 2px 4px 0px rgba(0, 0, 0, 0.14)";
382
710
  var ELEVATION_LIGHT_REGULAR = "0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 4px 8px 0px rgba(0, 0, 0, 0.14)";
@@ -395,13 +723,9 @@ var TYPOGRAPHY_KEY_HEADLINE3 = "headline3";
395
723
  var TYPOGRAPHY_KEY_HEADLINE4 = "headline4";
396
724
  var TYPOGRAPHY_KEY_HEADLINE5 = "headline5";
397
725
  var TYPOGRAPHY_KEY_HEADLINE6 = "headline6";
398
- var TYPOGRAPHY_KEY_SUBTITLE1 = "subtitle1";
399
- var TYPOGRAPHY_KEY_SUBTITLE2 = "subtitle2";
400
726
  var TYPOGRAPHY_KEY_BODY1 = "body1";
401
727
  var TYPOGRAPHY_KEY_BODY2 = "body2";
402
- var TYPOGRAPHY_KEY_CAPTION = "caption";
403
728
  var TYPOGRAPHY_KEY_BUTTON = "button";
404
- var TYPOGRAPHY_KEY_OVERLINE = "overline";
405
729
  var ELEVATION_KEY_LIGHT = "light";
406
730
  var ELEVATION_KEY_SEMILIGHT = "semilight";
407
731
  var ELEVATION_KEY_REGULAR = "regular";
@@ -411,20 +735,15 @@ var ELEVATION_KEY_EXTRABOLD = "extrabold";
411
735
  var VARIANT_PRIMARY = "primary";
412
736
  var VARIANT_SECONDARY = "secondary";
413
737
  var VARIANT_TERTIARY = "tertiary";
414
- var VARIANT_DANGER = "danger";
415
- var VARIANT_WARNING = "warning";
416
- var VARIANT_SUCCESS = "success";
417
- var VARIANT_INFO = "info";
418
- var VARIANT_HIGHLIGHT = "highlight";
419
- var VARIANT_NEUTRAL = "neutral";
420
738
 
421
- // src/Theming/JoyTheme.ts
422
- (function(JoyTheme2) {
423
- JoyTheme2.JOY_THEME = ThemeFactory.create({
739
+ // src/Theming/CosmopolitanTheme.ts
740
+ (function(CosmopolitanTheme2) {
741
+ CosmopolitanTheme2.COSMOPOLITAN_THEME = ThemeFactory.create({
424
742
  name: NAME,
425
743
  scheme: {
426
744
  light: {
427
745
  surface: SCHEME_LIGHT_SURFACE,
746
+ contrast: SCHEME_LIGHT_CONTRAST,
428
747
  background: SCHEME_LIGHT_BACKGROUND,
429
748
  foreground: SCHEME_LIGHT_FOREGROUND,
430
749
  highlight: SCHEME_LIGHT_HIGHLIGHT,
@@ -433,11 +752,11 @@ var VARIANT_NEUTRAL = "neutral";
433
752
  transparent: SCHEME_LIGHT_TRANSPARENT,
434
753
  semiTransparent: SCHEME_LIGHT_SEMI_TRANSPARENT,
435
754
  disabled: SCHEME_LIGHT_DISABLED,
436
- contrast: SCHEME_LIGHT_CONTRAST,
437
755
  selection: SCHEME_LIGHT_SELECTION
438
756
  },
439
757
  dark: {
440
758
  surface: SCHEME_DARK_SURFACE,
759
+ contrast: SCHEME_DARK_CONTRAST,
441
760
  background: SCHEME_DARK_BACKGROUND,
442
761
  foreground: SCHEME_DARK_FOREGROUND,
443
762
  highlight: SCHEME_DARK_HIGHLIGHT,
@@ -446,7 +765,6 @@ var VARIANT_NEUTRAL = "neutral";
446
765
  transparent: SCHEME_DARK_TRANSPARENT,
447
766
  semiTransparent: SCHEME_DARK_SEMI_TRANSPARENT,
448
767
  disabled: SCHEME_DARK_DISABLED,
449
- contrast: SCHEME_DARK_CONTRAST,
450
768
  selection: SCHEME_DARK_SELECTION
451
769
  }
452
770
  },
@@ -746,24 +1064,6 @@ var VARIANT_NEUTRAL = "neutral";
746
1064
  textDecoration: TYPOGRAPHY_HEADLINE6_TEXT_DECORATION,
747
1065
  textTransform: TYPOGRAPHY_HEADLINE6_TEXT_TRANSFORM
748
1066
  },
749
- subtitle1: {
750
- fontFamily: TYPOGRAPHY_SUBTITLE1_FONT_FAMILY,
751
- fontSize: TYPOGRAPHY_SUBTITLE1_FONT_SIZE,
752
- lineHeight: TYPOGRAPHY_SUBTITLE1_LINE_HEIGHT,
753
- fontWeight: TYPOGRAPHY_SUBTITLE1_FONT_WEIGHT,
754
- letterSpacing: TYPOGRAPHY_SUBTITLE1_LETTER_SPACING,
755
- textDecoration: TYPOGRAPHY_SUBTITLE1_TEXT_DECORATION,
756
- textTransform: TYPOGRAPHY_SUBTITLE1_TEXT_TRANSFORM
757
- },
758
- subtitle2: {
759
- fontFamily: TYPOGRAPHY_SUBTITLE2_FONT_FAMILY,
760
- fontSize: TYPOGRAPHY_SUBTITLE2_FONT_SIZE,
761
- lineHeight: TYPOGRAPHY_SUBTITLE2_LINE_HEIGHT,
762
- fontWeight: TYPOGRAPHY_SUBTITLE2_FONT_WEIGHT,
763
- letterSpacing: TYPOGRAPHY_SUBTITLE2_LETTER_SPACING,
764
- textDecoration: TYPOGRAPHY_SUBTITLE2_TEXT_DECORATION,
765
- textTransform: TYPOGRAPHY_SUBTITLE2_TEXT_TRANSFORM
766
- },
767
1067
  body1: {
768
1068
  fontFamily: TYPOGRAPHY_BODY1_FONT_FAMILY,
769
1069
  fontSize: TYPOGRAPHY_BODY1_FONT_SIZE,
@@ -782,24 +1082,6 @@ var VARIANT_NEUTRAL = "neutral";
782
1082
  textDecoration: TYPOGRAPHY_BODY2_TEXT_DECORATION,
783
1083
  textTransform: TYPOGRAPHY_BODY2_TEXT_TRANSFORM
784
1084
  },
785
- caption: {
786
- fontFamily: TYPOGRAPHY_CAPTION_FONT_FAMILY,
787
- fontSize: TYPOGRAPHY_CAPTION_FONT_SIZE,
788
- lineHeight: TYPOGRAPHY_CAPTION_LINE_HEIGHT,
789
- fontWeight: TYPOGRAPHY_CAPTION_FONT_WEIGHT,
790
- letterSpacing: TYPOGRAPHY_CAPTION_LETTER_SPACING,
791
- textDecoration: TYPOGRAPHY_CAPTION_TEXT_DECORATION,
792
- textTransform: TYPOGRAPHY_CAPTION_TEXT_TRANSFORM
793
- },
794
- overline: {
795
- fontFamily: TYPOGRAPHY_OVERLINE_FONT_FAMILY,
796
- fontSize: TYPOGRAPHY_OVERLINE_FONT_SIZE,
797
- lineHeight: TYPOGRAPHY_OVERLINE_LINE_HEIGHT,
798
- fontWeight: TYPOGRAPHY_OVERLINE_FONT_WEIGHT,
799
- letterSpacing: TYPOGRAPHY_OVERLINE_LETTER_SPACING,
800
- textDecoration: TYPOGRAPHY_OVERLINE_TEXT_DECORATION,
801
- textTransform: TYPOGRAPHY_OVERLINE_TEXT_TRANSFORM
802
- },
803
1085
  button: {
804
1086
  fontFamily: TYPOGRAPHY_BUTTON_FONT_FAMILY,
805
1087
  fontSize: TYPOGRAPHY_BUTTON_FONT_SIZE,
@@ -822,7 +1104,8 @@ var VARIANT_NEUTRAL = "neutral";
822
1104
  regular: ELEVATION_LIGHT_REGULAR,
823
1105
  semibold: ELEVATION_LIGHT_SEMIBOLD,
824
1106
  bold: ELEVATION_LIGHT_BOLD,
825
- extrabold: ELEVATION_LIGHT_EXTRABOLD
1107
+ extrabold: ELEVATION_LIGHT_EXTRABOLD,
1108
+ none: ELEVATION_NONE
826
1109
  },
827
1110
  dark: {
828
1111
  light: ELEVATION_DARK_LIGHT,
@@ -830,22 +1113,17 @@ var VARIANT_NEUTRAL = "neutral";
830
1113
  regular: ELEVATION_DARK_REGULAR,
831
1114
  semibold: ELEVATION_DARK_SEMIBOLD,
832
1115
  bold: ELEVATION_DARK_BOLD,
833
- extrabold: ELEVATION_DARK_EXTRABOLD
1116
+ extrabold: ELEVATION_DARK_EXTRABOLD,
1117
+ none: ELEVATION_NONE
834
1118
  }
835
1119
  }
836
1120
  });
837
- JoyTheme2.JOY_THEME_PALETTES = [
1121
+ CosmopolitanTheme2.COSMOPOLITAN_THEME_PALETTES = [
838
1122
  VARIANT_PRIMARY,
839
1123
  VARIANT_SECONDARY,
840
- VARIANT_TERTIARY,
841
- VARIANT_DANGER,
842
- VARIANT_INFO,
843
- VARIANT_WARNING,
844
- VARIANT_SUCCESS,
845
- VARIANT_HIGHLIGHT,
846
- VARIANT_NEUTRAL
1124
+ VARIANT_TERTIARY
847
1125
  ];
848
- JoyTheme2.JOY_THEME_PALETTE_VARIANTS = [
1126
+ CosmopolitanTheme2.COSMOPOLITAN_THEME_PALETTE_VARIANTS = [
849
1127
  "0",
850
1128
  "50",
851
1129
  "100",
@@ -858,11 +1136,11 @@ var VARIANT_NEUTRAL = "neutral";
858
1136
  "800",
859
1137
  "900"
860
1138
  ];
861
- JoyTheme2.JOY_THEME_SCHEMES = [
1139
+ CosmopolitanTheme2.COSMOPOLITAN_THEME_SCHEMES = [
862
1140
  "light",
863
1141
  "dark"
864
1142
  ];
865
- JoyTheme2.JOY_THEME_SCHEME_VARIANTS = [
1143
+ CosmopolitanTheme2.COSMOPOLITAN_THEME_SCHEME_VARIANTS = [
866
1144
  "surface",
867
1145
  "background",
868
1146
  "foreground",
@@ -875,11 +1153,11 @@ var VARIANT_NEUTRAL = "neutral";
875
1153
  "contrast",
876
1154
  "selection"
877
1155
  ];
878
- JoyTheme2.JOY_THEME_ELEVATION = [
1156
+ CosmopolitanTheme2.COSMOPOLITAN_THEME_ELEVATION = [
879
1157
  "light",
880
1158
  "dark"
881
1159
  ];
882
- JoyTheme2.JOY_THEME_ELEVATION_VARIANTS = [
1160
+ CosmopolitanTheme2.COSMOPOLITAN_THEME_ELEVATION_VARIANTS = [
883
1161
  ELEVATION_KEY_LIGHT,
884
1162
  ELEVATION_KEY_SEMILIGHT,
885
1163
  ELEVATION_KEY_REGULAR,
@@ -887,41 +1165,37 @@ var VARIANT_NEUTRAL = "neutral";
887
1165
  ELEVATION_KEY_BOLD,
888
1166
  ELEVATION_KEY_EXTRABOLD
889
1167
  ];
890
- JoyTheme2.JOY_THEME_TYPOGRAPHY = [
1168
+ CosmopolitanTheme2.COSMOPOLITAN_THEME_TYPOGRAPHY = [
891
1169
  TYPOGRAPHY_KEY_HEADLINE1,
892
1170
  TYPOGRAPHY_KEY_HEADLINE2,
893
1171
  TYPOGRAPHY_KEY_HEADLINE3,
894
1172
  TYPOGRAPHY_KEY_HEADLINE4,
895
1173
  TYPOGRAPHY_KEY_HEADLINE5,
896
1174
  TYPOGRAPHY_KEY_HEADLINE6,
897
- TYPOGRAPHY_KEY_SUBTITLE1,
898
- TYPOGRAPHY_KEY_SUBTITLE2,
899
1175
  TYPOGRAPHY_KEY_BODY1,
900
1176
  TYPOGRAPHY_KEY_BODY2,
901
- TYPOGRAPHY_KEY_CAPTION,
902
- TYPOGRAPHY_KEY_OVERLINE,
903
1177
  TYPOGRAPHY_KEY_BUTTON
904
1178
  ];
905
- JoyTheme2.JOY_THEME_METADATA = {
906
- theme: JoyTheme2.JOY_THEME,
907
- palettes: JoyTheme2.JOY_THEME_PALETTES,
908
- paletteVariants: JoyTheme2.JOY_THEME_PALETTE_VARIANTS,
909
- schemes: JoyTheme2.JOY_THEME_SCHEMES,
910
- schemeVariants: JoyTheme2.JOY_THEME_SCHEME_VARIANTS,
911
- elevation: JoyTheme2.JOY_THEME_ELEVATION,
912
- elevationVariants: JoyTheme2.JOY_THEME_ELEVATION_VARIANTS,
913
- typographies: JoyTheme2.JOY_THEME_TYPOGRAPHY
1179
+ CosmopolitanTheme2.COSMOPOLITAN_THEME_METADATA = {
1180
+ theme: CosmopolitanTheme2.COSMOPOLITAN_THEME,
1181
+ palettes: CosmopolitanTheme2.COSMOPOLITAN_THEME_PALETTES,
1182
+ paletteVariants: CosmopolitanTheme2.COSMOPOLITAN_THEME_PALETTE_VARIANTS,
1183
+ schemes: CosmopolitanTheme2.COSMOPOLITAN_THEME_SCHEMES,
1184
+ schemeVariants: CosmopolitanTheme2.COSMOPOLITAN_THEME_SCHEME_VARIANTS,
1185
+ elevation: CosmopolitanTheme2.COSMOPOLITAN_THEME_ELEVATION,
1186
+ elevationVariants: CosmopolitanTheme2.COSMOPOLITAN_THEME_ELEVATION_VARIANTS,
1187
+ typographies: CosmopolitanTheme2.COSMOPOLITAN_THEME_TYPOGRAPHY
914
1188
  };
915
- })(JoyTheme || (JoyTheme = {}));
916
- var JoyTheme;
1189
+ })(CosmopolitanTheme || (CosmopolitanTheme = {}));
1190
+ var CosmopolitanTheme;
917
1191
 
918
- // src/Theming/Tokens/MemphisTokens.ts
919
- var NAME2 = "memphis";
1192
+ // src/Theming/Tokens/JoyTokens.ts
1193
+ var NAME2 = "joy";
920
1194
  var FONT_FAMILY2 = "Nunito, sans-serif";
921
- var LAYOUT_RADIUS2 = "0px";
922
- var LAYOUT_SPACE2 = "10px";
923
- var LAYOUT_THICKNESS2 = "3px";
924
- var SCHEME_LIGHT_SURFACE2 = "#ffffff";
1195
+ var LAYOUT_RADIUS2 = "12px";
1196
+ var LAYOUT_SPACE2 = "8px";
1197
+ var LAYOUT_THICKNESS2 = "2px";
1198
+ var SCHEME_LIGHT_SURFACE2 = "#f5f5f5";
925
1199
  var SCHEME_LIGHT_BACKGROUND2 = "#eaeaea";
926
1200
  var SCHEME_LIGHT_FOREGROUND2 = "#3c454f";
927
1201
  var SCHEME_LIGHT_HIGHLIGHT2 = "#d1d1d1";
@@ -930,19 +1204,19 @@ var SCHEME_LIGHT_LOWLIGHT2 = "#5c5c5c";
930
1204
  var SCHEME_LIGHT_TRANSPARENT2 = "rgba(255, 255, 255, 0)";
931
1205
  var SCHEME_LIGHT_SEMI_TRANSPARENT2 = "rgba(255, 255, 255, 0.67)";
932
1206
  var SCHEME_LIGHT_DISABLED2 = "#686868";
933
- var SCHEME_LIGHT_CONTRAST2 = "#333333";
934
- var SCHEME_LIGHT_SELECTION2 = "#a8c0ff";
935
- var SCHEME_DARK_SURFACE2 = "#2e2e2e";
1207
+ var SCHEME_LIGHT_CONTRAST2 = "#ffffff";
1208
+ var SCHEME_LIGHT_SELECTION2 = "rgba(204, 204, 204, 0.44)";
1209
+ var SCHEME_DARK_SURFACE2 = "#1e1e1e";
936
1210
  var SCHEME_DARK_BACKGROUND2 = "#151515";
937
1211
  var SCHEME_DARK_FOREGROUND2 = "#c3bab0";
938
1212
  var SCHEME_DARK_HIGHLIGHT2 = "#2e2e2e";
939
1213
  var SCHEME_DARK_MIDDLELIGHT2 = "#757575";
940
1214
  var SCHEME_DARK_LOWLIGHT2 = "#a3a3a3";
941
1215
  var SCHEME_DARK_TRANSPARENT2 = "rgba(255, 255, 255, 0)";
942
- var SCHEME_DARK_SEMI_TRANSPARENT2 = "rgba(0, 0, 0, 0.67)";
1216
+ var SCHEME_DARK_SEMI_TRANSPARENT2 = "rgba(255, 255, 255, 0.03)";
943
1217
  var SCHEME_DARK_DISABLED2 = "#474747";
944
- var SCHEME_DARK_CONTRAST2 = "#ffffff";
945
- var SCHEME_DARK_SELECTION2 = "#6666ff";
1218
+ var SCHEME_DARK_CONTRAST2 = "#000000";
1219
+ var SCHEME_DARK_SELECTION2 = "rgba(204, 204, 204, 0.44)";
946
1220
  var COLOR_LIGHT_PRIMARY_02 = "#ffffff";
947
1221
  var COLOR_LIGHT_PRIMARY_502 = "#fce4ec";
948
1222
  var COLOR_LIGHT_PRIMARY_1002 = "#f8bcd0";
@@ -1183,20 +1457,20 @@ var TYPOGRAPHY_HEADLINE6_FONT_WEIGHT2 = "500";
1183
1457
  var TYPOGRAPHY_HEADLINE6_LETTER_SPACING2 = "0.2px";
1184
1458
  var TYPOGRAPHY_HEADLINE6_TEXT_DECORATION2 = "none";
1185
1459
  var TYPOGRAPHY_HEADLINE6_TEXT_TRANSFORM2 = "none";
1186
- var TYPOGRAPHY_SUBTITLE1_FONT_FAMILY2 = "Nunito, sans-serif";
1187
- var TYPOGRAPHY_SUBTITLE1_FONT_SIZE2 = "16px";
1188
- var TYPOGRAPHY_SUBTITLE1_LINE_HEIGHT2 = "20px";
1189
- var TYPOGRAPHY_SUBTITLE1_FONT_WEIGHT2 = "400";
1190
- var TYPOGRAPHY_SUBTITLE1_LETTER_SPACING2 = "0.15px";
1191
- var TYPOGRAPHY_SUBTITLE1_TEXT_DECORATION2 = "none";
1192
- var TYPOGRAPHY_SUBTITLE1_TEXT_TRANSFORM2 = "none";
1193
- var TYPOGRAPHY_SUBTITLE2_FONT_FAMILY2 = "Nunito, sans-serif";
1194
- var TYPOGRAPHY_SUBTITLE2_FONT_SIZE2 = "14px";
1195
- var TYPOGRAPHY_SUBTITLE2_LINE_HEIGHT2 = "18px";
1196
- var TYPOGRAPHY_SUBTITLE2_FONT_WEIGHT2 = "500";
1197
- var TYPOGRAPHY_SUBTITLE2_LETTER_SPACING2 = "0.1142857142857143px";
1198
- var TYPOGRAPHY_SUBTITLE2_TEXT_DECORATION2 = "none";
1199
- var TYPOGRAPHY_SUBTITLE2_TEXT_TRANSFORM2 = "none";
1460
+ var TYPOGRAPHY_SUBTITLE1_FONT_FAMILY = "Nunito, sans-serif";
1461
+ var TYPOGRAPHY_SUBTITLE1_FONT_SIZE = "16px";
1462
+ var TYPOGRAPHY_SUBTITLE1_LINE_HEIGHT = "20px";
1463
+ var TYPOGRAPHY_SUBTITLE1_FONT_WEIGHT = "400";
1464
+ var TYPOGRAPHY_SUBTITLE1_LETTER_SPACING = "0.15px";
1465
+ var TYPOGRAPHY_SUBTITLE1_TEXT_DECORATION = "none";
1466
+ var TYPOGRAPHY_SUBTITLE1_TEXT_TRANSFORM = "none";
1467
+ var TYPOGRAPHY_SUBTITLE2_FONT_FAMILY = "Nunito, sans-serif";
1468
+ var TYPOGRAPHY_SUBTITLE2_FONT_SIZE = "14px";
1469
+ var TYPOGRAPHY_SUBTITLE2_LINE_HEIGHT = "18px";
1470
+ var TYPOGRAPHY_SUBTITLE2_FONT_WEIGHT = "500";
1471
+ var TYPOGRAPHY_SUBTITLE2_LETTER_SPACING = "0.1142857142857143px";
1472
+ var TYPOGRAPHY_SUBTITLE2_TEXT_DECORATION = "none";
1473
+ var TYPOGRAPHY_SUBTITLE2_TEXT_TRANSFORM = "none";
1200
1474
  var TYPOGRAPHY_BODY1_FONT_FAMILY2 = "Nunito, sans-serif";
1201
1475
  var TYPOGRAPHY_BODY1_FONT_SIZE2 = "16px";
1202
1476
  var TYPOGRAPHY_BODY1_LINE_HEIGHT2 = "20px";
@@ -1211,13 +1485,20 @@ var TYPOGRAPHY_BODY2_FONT_WEIGHT2 = "400";
1211
1485
  var TYPOGRAPHY_BODY2_LETTER_SPACING2 = "0.2857142857142857px";
1212
1486
  var TYPOGRAPHY_BODY2_TEXT_DECORATION2 = "none";
1213
1487
  var TYPOGRAPHY_BODY2_TEXT_TRANSFORM2 = "none";
1214
- var TYPOGRAPHY_CAPTION_FONT_FAMILY2 = "Nunito, sans-serif";
1215
- var TYPOGRAPHY_CAPTION_FONT_SIZE2 = "12px";
1216
- var TYPOGRAPHY_CAPTION_LINE_HEIGHT2 = "16px";
1217
- var TYPOGRAPHY_CAPTION_FONT_WEIGHT2 = "400";
1218
- var TYPOGRAPHY_CAPTION_LETTER_SPACING2 = "0.5333333333333333px";
1219
- var TYPOGRAPHY_CAPTION_TEXT_DECORATION2 = "none";
1220
- var TYPOGRAPHY_CAPTION_TEXT_TRANSFORM2 = "none";
1488
+ var TYPOGRAPHY_SUPPORTING_FONT_FAMILY = "Nunito, sans-serif";
1489
+ var TYPOGRAPHY_SUPPORTING_FONT_SIZE = "12px";
1490
+ var TYPOGRAPHY_SUPPORTING_LINE_HEIGHT = "14px";
1491
+ var TYPOGRAPHY_SUPPORTING_FONT_WEIGHT = "400";
1492
+ var TYPOGRAPHY_SUPPORTING_LETTER_SPACING = "0.2857142857142857px";
1493
+ var TYPOGRAPHY_SUPPORTING_TEXT_DECORATION = "none";
1494
+ var TYPOGRAPHY_SUPPORTING_TEXT_TRANSFORM = "none";
1495
+ var TYPOGRAPHY_CAPTION_FONT_FAMILY = "Nunito, sans-serif";
1496
+ var TYPOGRAPHY_CAPTION_FONT_SIZE = "12px";
1497
+ var TYPOGRAPHY_CAPTION_LINE_HEIGHT = "16px";
1498
+ var TYPOGRAPHY_CAPTION_FONT_WEIGHT = "400";
1499
+ var TYPOGRAPHY_CAPTION_LETTER_SPACING = "0.5333333333333333px";
1500
+ var TYPOGRAPHY_CAPTION_TEXT_DECORATION = "none";
1501
+ var TYPOGRAPHY_CAPTION_TEXT_TRANSFORM = "none";
1221
1502
  var TYPOGRAPHY_BUTTON_FONT_FAMILY2 = "Nunito, sans-serif";
1222
1503
  var TYPOGRAPHY_BUTTON_FONT_SIZE2 = "14px";
1223
1504
  var TYPOGRAPHY_BUTTON_LINE_HEIGHT2 = "18px";
@@ -1225,38 +1506,39 @@ var TYPOGRAPHY_BUTTON_FONT_WEIGHT2 = "700";
1225
1506
  var TYPOGRAPHY_BUTTON_LETTER_SPACING2 = "1.4285714285714286px";
1226
1507
  var TYPOGRAPHY_BUTTON_TEXT_DECORATION2 = "none";
1227
1508
  var TYPOGRAPHY_BUTTON_TEXT_TRANSFORM2 = "none";
1228
- var TYPOGRAPHY_OVERLINE_FONT_FAMILY2 = "Nunito, sans-serif";
1229
- var TYPOGRAPHY_OVERLINE_FONT_SIZE2 = "12px";
1230
- var TYPOGRAPHY_OVERLINE_LINE_HEIGHT2 = "16px";
1231
- var TYPOGRAPHY_OVERLINE_FONT_WEIGHT2 = "500";
1232
- var TYPOGRAPHY_OVERLINE_LETTER_SPACING2 = "2.6666666666666665px";
1233
- var TYPOGRAPHY_OVERLINE_TEXT_DECORATION2 = "none";
1234
- var TYPOGRAPHY_OVERLINE_TEXT_TRANSFORM2 = "none";
1235
- var ELEVATION_LIGHT_LIGHT2 = "2px 2px 0px 0px #333333";
1236
- var ELEVATION_LIGHT_SEMILIGHT2 = "3px 3px 0px 0px #333333";
1237
- var ELEVATION_LIGHT_REGULAR2 = "4px 4px 0px 0px #333333";
1238
- var ELEVATION_LIGHT_SEMIBOLD2 = "5px 5px 0px 0px #333333";
1239
- var ELEVATION_LIGHT_BOLD2 = "6px 6px 0px 0px #333333";
1240
- var ELEVATION_LIGHT_EXTRABOLD2 = "7px 7px 0px 0px #333333";
1241
- var ELEVATION_DARK_LIGHT2 = "2px 2px 0px 0px #ffffff";
1242
- var ELEVATION_DARK_SEMILIGHT2 = "3px 3px 0px 0px #ffffff";
1243
- var ELEVATION_DARK_REGULAR2 = "4px 4px 0px 0px #ffffff";
1244
- var ELEVATION_DARK_SEMIBOLD2 = "5px 5px 0px 0px #ffffff";
1245
- var ELEVATION_DARK_BOLD2 = "6px 6px 0px 0px #ffffff";
1246
- var ELEVATION_DARK_EXTRABOLD2 = "7px 7px 0px 0px #ffffff";
1509
+ var TYPOGRAPHY_OVERLINE_FONT_FAMILY = "Nunito, sans-serif";
1510
+ var TYPOGRAPHY_OVERLINE_FONT_SIZE = "12px";
1511
+ var TYPOGRAPHY_OVERLINE_LINE_HEIGHT = "16px";
1512
+ var TYPOGRAPHY_OVERLINE_FONT_WEIGHT = "500";
1513
+ var TYPOGRAPHY_OVERLINE_LETTER_SPACING = "2.6666666666666665px";
1514
+ var TYPOGRAPHY_OVERLINE_TEXT_DECORATION = "none";
1515
+ var TYPOGRAPHY_OVERLINE_TEXT_TRANSFORM = "none";
1516
+ var ELEVATION_LIGHT_LIGHT2 = "0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 1px 2px 0px rgba(0, 0, 0, 0.14)";
1517
+ var ELEVATION_LIGHT_SEMILIGHT2 = "0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 2px 4px 0px rgba(0, 0, 0, 0.14)";
1518
+ var ELEVATION_LIGHT_REGULAR2 = "0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 4px 8px 0px rgba(0, 0, 0, 0.14)";
1519
+ var ELEVATION_LIGHT_SEMIBOLD2 = "0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 8px 16px 0px rgba(0, 0, 0, 0.14)";
1520
+ var ELEVATION_LIGHT_BOLD2 = "0px 0px 8px 0px rgba(0, 0, 0, 0.12), 0px 14px 28px 0px rgba(0, 0, 0, 0.14)";
1521
+ var ELEVATION_LIGHT_EXTRABOLD2 = "0px 0px 8px 0px rgba(0, 0, 0, 0.12), 0px 32px 64px 0px rgba(0, 0, 0, 0.14)";
1522
+ var ELEVATION_DARK_LIGHT2 = "0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 1px 2px 0px rgba(0, 0, 0, 0.28)";
1523
+ var ELEVATION_DARK_SEMILIGHT2 = "0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 2px 4px 0px rgba(0, 0, 0, 0.28)";
1524
+ var ELEVATION_DARK_REGULAR2 = "0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 4px 8px 0px rgba(0, 0, 0, 0.28)";
1525
+ var ELEVATION_DARK_SEMIBOLD2 = "0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 8px 16px 0px rgba(0, 0, 0, 0.28)";
1526
+ var ELEVATION_DARK_BOLD2 = "0px 0px 8px 0px rgba(0, 0, 0, 0.24), 0px 14px 28px 0px rgba(0, 0, 0, 0.28)";
1527
+ var ELEVATION_DARK_EXTRABOLD2 = "0px 0px 8px 0px rgba(0, 0, 0, 0.24), 0px 32px 64px 0px rgba(0, 0, 0, 0.28)";
1247
1528
  var TYPOGRAPHY_KEY_HEADLINE12 = "headline1";
1248
1529
  var TYPOGRAPHY_KEY_HEADLINE22 = "headline2";
1249
1530
  var TYPOGRAPHY_KEY_HEADLINE32 = "headline3";
1250
1531
  var TYPOGRAPHY_KEY_HEADLINE42 = "headline4";
1251
1532
  var TYPOGRAPHY_KEY_HEADLINE52 = "headline5";
1252
1533
  var TYPOGRAPHY_KEY_HEADLINE62 = "headline6";
1253
- var TYPOGRAPHY_KEY_SUBTITLE12 = "subtitle1";
1254
- var TYPOGRAPHY_KEY_SUBTITLE22 = "subtitle2";
1534
+ var TYPOGRAPHY_KEY_SUBTITLE1 = "subtitle1";
1535
+ var TYPOGRAPHY_KEY_SUBTITLE2 = "subtitle2";
1255
1536
  var TYPOGRAPHY_KEY_BODY12 = "body1";
1256
1537
  var TYPOGRAPHY_KEY_BODY22 = "body2";
1257
- var TYPOGRAPHY_KEY_CAPTION2 = "caption";
1538
+ var TYPOGRAPHY_KEY_SUPPORTING = "supporting";
1539
+ var TYPOGRAPHY_KEY_CAPTION = "caption";
1258
1540
  var TYPOGRAPHY_KEY_BUTTON2 = "button";
1259
- var TYPOGRAPHY_KEY_OVERLINE2 = "overline";
1541
+ var TYPOGRAPHY_KEY_OVERLINE = "overline";
1260
1542
  var ELEVATION_KEY_LIGHT2 = "light";
1261
1543
  var ELEVATION_KEY_SEMILIGHT2 = "semilight";
1262
1544
  var ELEVATION_KEY_REGULAR2 = "regular";
@@ -1265,15 +1547,17 @@ var ELEVATION_KEY_BOLD2 = "bold";
1265
1547
  var ELEVATION_KEY_EXTRABOLD2 = "extrabold";
1266
1548
  var VARIANT_PRIMARY2 = "primary";
1267
1549
  var VARIANT_SECONDARY2 = "secondary";
1268
- var VARIANT_DANGER2 = "danger";
1269
- var VARIANT_WARNING2 = "warning";
1270
- var VARIANT_SUCCESS2 = "success";
1271
- var VARIANT_INFO2 = "info";
1272
- var VARIANT_NEUTRAL2 = "neutral";
1550
+ var VARIANT_TERTIARY2 = "tertiary";
1551
+ var VARIANT_DANGER = "danger";
1552
+ var VARIANT_WARNING = "warning";
1553
+ var VARIANT_SUCCESS = "success";
1554
+ var VARIANT_INFO = "info";
1555
+ var VARIANT_HIGHLIGHT = "highlight";
1556
+ var VARIANT_NEUTRAL = "neutral";
1273
1557
 
1274
- // src/Theming/MemphisTheme.ts
1275
- (function(MemphisTheme2) {
1276
- MemphisTheme2.MEMPHIS_THEME = ThemeFactory.create({
1558
+ // src/Theming/JoyTheme.ts
1559
+ (function(JoyTheme2) {
1560
+ JoyTheme2.JOY_THEME = ThemeFactory.create({
1277
1561
  name: NAME2,
1278
1562
  scheme: {
1279
1563
  light: {
@@ -1600,22 +1884,22 @@ var VARIANT_NEUTRAL2 = "neutral";
1600
1884
  textTransform: TYPOGRAPHY_HEADLINE6_TEXT_TRANSFORM2
1601
1885
  },
1602
1886
  subtitle1: {
1603
- fontFamily: TYPOGRAPHY_SUBTITLE1_FONT_FAMILY2,
1604
- fontSize: TYPOGRAPHY_SUBTITLE1_FONT_SIZE2,
1605
- lineHeight: TYPOGRAPHY_SUBTITLE1_LINE_HEIGHT2,
1606
- fontWeight: TYPOGRAPHY_SUBTITLE1_FONT_WEIGHT2,
1607
- letterSpacing: TYPOGRAPHY_SUBTITLE1_LETTER_SPACING2,
1608
- textDecoration: TYPOGRAPHY_SUBTITLE1_TEXT_DECORATION2,
1609
- textTransform: TYPOGRAPHY_SUBTITLE1_TEXT_TRANSFORM2
1887
+ fontFamily: TYPOGRAPHY_SUBTITLE1_FONT_FAMILY,
1888
+ fontSize: TYPOGRAPHY_SUBTITLE1_FONT_SIZE,
1889
+ lineHeight: TYPOGRAPHY_SUBTITLE1_LINE_HEIGHT,
1890
+ fontWeight: TYPOGRAPHY_SUBTITLE1_FONT_WEIGHT,
1891
+ letterSpacing: TYPOGRAPHY_SUBTITLE1_LETTER_SPACING,
1892
+ textDecoration: TYPOGRAPHY_SUBTITLE1_TEXT_DECORATION,
1893
+ textTransform: TYPOGRAPHY_SUBTITLE1_TEXT_TRANSFORM
1610
1894
  },
1611
1895
  subtitle2: {
1612
- fontFamily: TYPOGRAPHY_SUBTITLE2_FONT_FAMILY2,
1613
- fontSize: TYPOGRAPHY_SUBTITLE2_FONT_SIZE2,
1614
- lineHeight: TYPOGRAPHY_SUBTITLE2_LINE_HEIGHT2,
1615
- fontWeight: TYPOGRAPHY_SUBTITLE2_FONT_WEIGHT2,
1616
- letterSpacing: TYPOGRAPHY_SUBTITLE2_LETTER_SPACING2,
1617
- textDecoration: TYPOGRAPHY_SUBTITLE2_TEXT_DECORATION2,
1618
- textTransform: TYPOGRAPHY_SUBTITLE2_TEXT_TRANSFORM2
1896
+ fontFamily: TYPOGRAPHY_SUBTITLE2_FONT_FAMILY,
1897
+ fontSize: TYPOGRAPHY_SUBTITLE2_FONT_SIZE,
1898
+ lineHeight: TYPOGRAPHY_SUBTITLE2_LINE_HEIGHT,
1899
+ fontWeight: TYPOGRAPHY_SUBTITLE2_FONT_WEIGHT,
1900
+ letterSpacing: TYPOGRAPHY_SUBTITLE2_LETTER_SPACING,
1901
+ textDecoration: TYPOGRAPHY_SUBTITLE2_TEXT_DECORATION,
1902
+ textTransform: TYPOGRAPHY_SUBTITLE2_TEXT_TRANSFORM
1619
1903
  },
1620
1904
  body1: {
1621
1905
  fontFamily: TYPOGRAPHY_BODY1_FONT_FAMILY2,
@@ -1635,23 +1919,32 @@ var VARIANT_NEUTRAL2 = "neutral";
1635
1919
  textDecoration: TYPOGRAPHY_BODY2_TEXT_DECORATION2,
1636
1920
  textTransform: TYPOGRAPHY_BODY2_TEXT_TRANSFORM2
1637
1921
  },
1922
+ supporting: {
1923
+ fontFamily: TYPOGRAPHY_SUPPORTING_FONT_FAMILY,
1924
+ fontSize: TYPOGRAPHY_SUPPORTING_FONT_SIZE,
1925
+ lineHeight: TYPOGRAPHY_SUPPORTING_LINE_HEIGHT,
1926
+ fontWeight: TYPOGRAPHY_SUPPORTING_FONT_WEIGHT,
1927
+ letterSpacing: TYPOGRAPHY_SUPPORTING_LETTER_SPACING,
1928
+ textDecoration: TYPOGRAPHY_SUPPORTING_TEXT_DECORATION,
1929
+ textTransform: TYPOGRAPHY_SUPPORTING_TEXT_TRANSFORM
1930
+ },
1638
1931
  caption: {
1639
- fontFamily: TYPOGRAPHY_CAPTION_FONT_FAMILY2,
1640
- fontSize: TYPOGRAPHY_CAPTION_FONT_SIZE2,
1641
- lineHeight: TYPOGRAPHY_CAPTION_LINE_HEIGHT2,
1642
- fontWeight: TYPOGRAPHY_CAPTION_FONT_WEIGHT2,
1643
- letterSpacing: TYPOGRAPHY_CAPTION_LETTER_SPACING2,
1644
- textDecoration: TYPOGRAPHY_CAPTION_TEXT_DECORATION2,
1645
- textTransform: TYPOGRAPHY_CAPTION_TEXT_TRANSFORM2
1932
+ fontFamily: TYPOGRAPHY_CAPTION_FONT_FAMILY,
1933
+ fontSize: TYPOGRAPHY_CAPTION_FONT_SIZE,
1934
+ lineHeight: TYPOGRAPHY_CAPTION_LINE_HEIGHT,
1935
+ fontWeight: TYPOGRAPHY_CAPTION_FONT_WEIGHT,
1936
+ letterSpacing: TYPOGRAPHY_CAPTION_LETTER_SPACING,
1937
+ textDecoration: TYPOGRAPHY_CAPTION_TEXT_DECORATION,
1938
+ textTransform: TYPOGRAPHY_CAPTION_TEXT_TRANSFORM
1646
1939
  },
1647
1940
  overline: {
1648
- fontFamily: TYPOGRAPHY_OVERLINE_FONT_FAMILY2,
1649
- fontSize: TYPOGRAPHY_OVERLINE_FONT_SIZE2,
1650
- lineHeight: TYPOGRAPHY_OVERLINE_LINE_HEIGHT2,
1651
- fontWeight: TYPOGRAPHY_OVERLINE_FONT_WEIGHT2,
1652
- letterSpacing: TYPOGRAPHY_OVERLINE_LETTER_SPACING2,
1653
- textDecoration: TYPOGRAPHY_OVERLINE_TEXT_DECORATION2,
1654
- textTransform: TYPOGRAPHY_OVERLINE_TEXT_TRANSFORM2
1941
+ fontFamily: TYPOGRAPHY_OVERLINE_FONT_FAMILY,
1942
+ fontSize: TYPOGRAPHY_OVERLINE_FONT_SIZE,
1943
+ lineHeight: TYPOGRAPHY_OVERLINE_LINE_HEIGHT,
1944
+ fontWeight: TYPOGRAPHY_OVERLINE_FONT_WEIGHT,
1945
+ letterSpacing: TYPOGRAPHY_OVERLINE_LETTER_SPACING,
1946
+ textDecoration: TYPOGRAPHY_OVERLINE_TEXT_DECORATION,
1947
+ textTransform: TYPOGRAPHY_OVERLINE_TEXT_TRANSFORM
1655
1948
  },
1656
1949
  button: {
1657
1950
  fontFamily: TYPOGRAPHY_BUTTON_FONT_FAMILY2,
@@ -1687,16 +1980,18 @@ var VARIANT_NEUTRAL2 = "neutral";
1687
1980
  }
1688
1981
  }
1689
1982
  });
1690
- MemphisTheme2.MEMPHIS_THEME_PALETTES = [
1983
+ JoyTheme2.JOY_THEME_PALETTES = [
1691
1984
  VARIANT_PRIMARY2,
1692
1985
  VARIANT_SECONDARY2,
1693
- VARIANT_DANGER2,
1694
- VARIANT_INFO2,
1695
- VARIANT_NEUTRAL2,
1696
- VARIANT_SUCCESS2,
1697
- VARIANT_WARNING2
1986
+ VARIANT_TERTIARY2,
1987
+ VARIANT_DANGER,
1988
+ VARIANT_INFO,
1989
+ VARIANT_WARNING,
1990
+ VARIANT_SUCCESS,
1991
+ VARIANT_HIGHLIGHT,
1992
+ VARIANT_NEUTRAL
1698
1993
  ];
1699
- MemphisTheme2.MEMPHIS_THEME_PALETTE_VARIANTS = [
1994
+ JoyTheme2.JOY_THEME_PALETTE_VARIANTS = [
1700
1995
  "0",
1701
1996
  "50",
1702
1997
  "100",
@@ -1709,11 +2004,11 @@ var VARIANT_NEUTRAL2 = "neutral";
1709
2004
  "800",
1710
2005
  "900"
1711
2006
  ];
1712
- MemphisTheme2.MEMPHIS_THEME_SCHEMES = [
2007
+ JoyTheme2.JOY_THEME_SCHEMES = [
1713
2008
  "light",
1714
2009
  "dark"
1715
2010
  ];
1716
- MemphisTheme2.MEMPHIS_THEME_SCHEME_VARIANTS = [
2011
+ JoyTheme2.JOY_THEME_SCHEME_VARIANTS = [
1717
2012
  "surface",
1718
2013
  "background",
1719
2014
  "foreground",
@@ -1726,11 +2021,11 @@ var VARIANT_NEUTRAL2 = "neutral";
1726
2021
  "contrast",
1727
2022
  "selection"
1728
2023
  ];
1729
- MemphisTheme2.MEMPHIS_THEME_ELEVATION = [
2024
+ JoyTheme2.JOY_THEME_ELEVATION = [
1730
2025
  "light",
1731
2026
  "dark"
1732
2027
  ];
1733
- MemphisTheme2.MEMPHIS_THEME_ELEVATION_VARIANTS = [
2028
+ JoyTheme2.JOY_THEME_ELEVATION_VARIANTS = [
1734
2029
  ELEVATION_KEY_LIGHT2,
1735
2030
  ELEVATION_KEY_SEMILIGHT2,
1736
2031
  ELEVATION_KEY_REGULAR2,
@@ -1738,62 +2033,63 @@ var VARIANT_NEUTRAL2 = "neutral";
1738
2033
  ELEVATION_KEY_BOLD2,
1739
2034
  ELEVATION_KEY_EXTRABOLD2
1740
2035
  ];
1741
- MemphisTheme2.MEMPHIS_THEME_TYPOGRAPHY = [
2036
+ JoyTheme2.JOY_THEME_TYPOGRAPHY = [
1742
2037
  TYPOGRAPHY_KEY_HEADLINE12,
1743
2038
  TYPOGRAPHY_KEY_HEADLINE22,
1744
2039
  TYPOGRAPHY_KEY_HEADLINE32,
1745
2040
  TYPOGRAPHY_KEY_HEADLINE42,
1746
2041
  TYPOGRAPHY_KEY_HEADLINE52,
1747
2042
  TYPOGRAPHY_KEY_HEADLINE62,
1748
- TYPOGRAPHY_KEY_SUBTITLE12,
1749
- TYPOGRAPHY_KEY_SUBTITLE22,
2043
+ TYPOGRAPHY_KEY_SUBTITLE1,
2044
+ TYPOGRAPHY_KEY_SUBTITLE2,
1750
2045
  TYPOGRAPHY_KEY_BODY12,
1751
2046
  TYPOGRAPHY_KEY_BODY22,
1752
- TYPOGRAPHY_KEY_CAPTION2,
1753
- TYPOGRAPHY_KEY_OVERLINE2,
1754
- TYPOGRAPHY_KEY_BUTTON2
2047
+ TYPOGRAPHY_KEY_CAPTION,
2048
+ TYPOGRAPHY_KEY_OVERLINE,
2049
+ TYPOGRAPHY_KEY_BUTTON2,
2050
+ TYPOGRAPHY_KEY_SUPPORTING
1755
2051
  ];
1756
- MemphisTheme2.MEMPHIS_THEME_METADATA = {
1757
- theme: MemphisTheme2.MEMPHIS_THEME,
1758
- palettes: MemphisTheme2.MEMPHIS_THEME_PALETTES,
1759
- paletteVariants: MemphisTheme2.MEMPHIS_THEME_PALETTE_VARIANTS,
1760
- schemes: MemphisTheme2.MEMPHIS_THEME_SCHEMES,
1761
- schemeVariants: MemphisTheme2.MEMPHIS_THEME_SCHEME_VARIANTS,
1762
- elevation: MemphisTheme2.MEMPHIS_THEME_ELEVATION,
1763
- elevationVariants: MemphisTheme2.MEMPHIS_THEME_ELEVATION_VARIANTS,
1764
- typographies: MemphisTheme2.MEMPHIS_THEME_TYPOGRAPHY
2052
+ JoyTheme2.JOY_THEME_METADATA = {
2053
+ theme: JoyTheme2.JOY_THEME,
2054
+ palettes: JoyTheme2.JOY_THEME_PALETTES,
2055
+ paletteVariants: JoyTheme2.JOY_THEME_PALETTE_VARIANTS,
2056
+ schemes: JoyTheme2.JOY_THEME_SCHEMES,
2057
+ schemeVariants: JoyTheme2.JOY_THEME_SCHEME_VARIANTS,
2058
+ elevation: JoyTheme2.JOY_THEME_ELEVATION,
2059
+ elevationVariants: JoyTheme2.JOY_THEME_ELEVATION_VARIANTS,
2060
+ typographies: JoyTheme2.JOY_THEME_TYPOGRAPHY
1765
2061
  };
1766
- })(MemphisTheme || (MemphisTheme = {}));
1767
- var MemphisTheme;
2062
+ })(JoyTheme || (JoyTheme = {}));
2063
+ var JoyTheme;
1768
2064
 
1769
- // src/Theming/Tokens/CosmopolitanTokens.ts
1770
- var NAME3 = "cosmopolitan";
1771
- var FONT_FAMILY3 = "'Noto Sans', sans-serif";
1772
- var LAYOUT_RADIUS3 = "3px";
1773
- var LAYOUT_SPACE3 = "8px";
1774
- var LAYOUT_THICKNESS3 = "1px";
1775
- var SCHEME_LIGHT_SURFACE3 = "#fefefe";
1776
- var SCHEME_LIGHT_CONTRAST3 = "#ffffff";
1777
- var SCHEME_LIGHT_BACKGROUND3 = "#ffffff";
1778
- var SCHEME_LIGHT_FOREGROUND3 = "#000000";
1779
- var SCHEME_LIGHT_HIGHLIGHT3 = "#e2e2e2";
1780
- var SCHEME_LIGHT_MIDDLELIGHT3 = "#777777";
1781
- var SCHEME_LIGHT_LOWLIGHT3 = "#4d4d4d";
2065
+ // src/Theming/Tokens/MemphisTokens.ts
2066
+ var NAME3 = "memphis";
2067
+ var FONT_FAMILY3 = "Nunito, sans-serif";
2068
+ var LAYOUT_RADIUS3 = "0px";
2069
+ var LAYOUT_SPACE3 = "10px";
2070
+ var LAYOUT_THICKNESS3 = "3px";
2071
+ var SCHEME_LIGHT_SURFACE3 = "#ffffff";
2072
+ var SCHEME_LIGHT_BACKGROUND3 = "#eaeaea";
2073
+ var SCHEME_LIGHT_FOREGROUND3 = "#3c454f";
2074
+ var SCHEME_LIGHT_HIGHLIGHT3 = "#d1d1d1";
2075
+ var SCHEME_LIGHT_MIDDLELIGHT3 = "#8a8a8a";
2076
+ var SCHEME_LIGHT_LOWLIGHT3 = "#5c5c5c";
1782
2077
  var SCHEME_LIGHT_TRANSPARENT3 = "rgba(255, 255, 255, 0)";
1783
2078
  var SCHEME_LIGHT_SEMI_TRANSPARENT3 = "rgba(255, 255, 255, 0.67)";
1784
- var SCHEME_LIGHT_DISABLED3 = "#b8b5b2";
1785
- var SCHEME_LIGHT_SELECTION3 = "#ffaad4";
1786
- var SCHEME_DARK_SURFACE3 = "#2e2d2d";
2079
+ var SCHEME_LIGHT_DISABLED3 = "#686868";
2080
+ var SCHEME_LIGHT_CONTRAST3 = "#333333";
2081
+ var SCHEME_LIGHT_SELECTION3 = "#a8c0ff";
2082
+ var SCHEME_DARK_SURFACE3 = "#2e2e2e";
2083
+ var SCHEME_DARK_BACKGROUND3 = "#151515";
2084
+ var SCHEME_DARK_FOREGROUND3 = "#c3bab0";
2085
+ var SCHEME_DARK_HIGHLIGHT3 = "#2e2e2e";
2086
+ var SCHEME_DARK_MIDDLELIGHT3 = "#757575";
2087
+ var SCHEME_DARK_LOWLIGHT3 = "#a3a3a3";
2088
+ var SCHEME_DARK_TRANSPARENT3 = "rgba(255, 255, 255, 0)";
2089
+ var SCHEME_DARK_SEMI_TRANSPARENT3 = "rgba(0, 0, 0, 0.67)";
2090
+ var SCHEME_DARK_DISABLED3 = "#474747";
1787
2091
  var SCHEME_DARK_CONTRAST3 = "#ffffff";
1788
- var SCHEME_DARK_BACKGROUND3 = "#2e2d2d";
1789
- var SCHEME_DARK_FOREGROUND3 = "#ffffff";
1790
- var SCHEME_DARK_HIGHLIGHT3 = "#333333";
1791
- var SCHEME_DARK_MIDDLELIGHT3 = "#666666";
1792
- var SCHEME_DARK_LOWLIGHT3 = "#999999";
1793
- var SCHEME_DARK_TRANSPARENT3 = "rgba(23, 23, 23, 0)";
1794
- var SCHEME_DARK_SEMI_TRANSPARENT3 = "rgba(23, 23, 23, 0.67)";
1795
- var SCHEME_DARK_DISABLED3 = "#5c5956";
1796
- var SCHEME_DARK_SELECTION3 = "#ff66aa";
2092
+ var SCHEME_DARK_SELECTION3 = "#6666ff";
1797
2093
  var COLOR_LIGHT_PRIMARY_03 = "#ffffff";
1798
2094
  var COLOR_LIGHT_PRIMARY_503 = "#fce4ec";
1799
2095
  var COLOR_LIGHT_PRIMARY_1003 = "#f8bcd0";
@@ -1992,844 +2288,579 @@ var COLOR_DARK_NEUTRAL_6003 = "#b9b9c6";
1992
2288
  var COLOR_DARK_NEUTRAL_7003 = "#d8d8df";
1993
2289
  var COLOR_DARK_NEUTRAL_8003 = "#ebebef";
1994
2290
  var COLOR_DARK_NEUTRAL_9003 = "#f7f7f8";
1995
- var TYPOGRAPHY_HEADLINE1_FONT_FAMILY3 = "'Noto Sans', sans-serif";
1996
- var TYPOGRAPHY_HEADLINE1_FONT_SIZE3 = "24px";
1997
- var TYPOGRAPHY_HEADLINE1_LINE_HEIGHT3 = "28px";
2291
+ var TYPOGRAPHY_HEADLINE1_FONT_FAMILY3 = "Nunito, sans-serif";
2292
+ var TYPOGRAPHY_HEADLINE1_FONT_SIZE3 = "96px";
2293
+ var TYPOGRAPHY_HEADLINE1_LINE_HEIGHT3 = "100px";
1998
2294
  var TYPOGRAPHY_HEADLINE1_FONT_WEIGHT3 = "300";
1999
2295
  var TYPOGRAPHY_HEADLINE1_LETTER_SPACING3 = "-0.25px";
2000
2296
  var TYPOGRAPHY_HEADLINE1_TEXT_DECORATION3 = "none";
2001
2297
  var TYPOGRAPHY_HEADLINE1_TEXT_TRANSFORM3 = "none";
2002
- var TYPOGRAPHY_HEADLINE2_FONT_FAMILY3 = "'Noto Sans', sans-serif";
2003
- var TYPOGRAPHY_HEADLINE2_FONT_SIZE3 = "24px";
2004
- var TYPOGRAPHY_HEADLINE2_LINE_HEIGHT3 = "28px";
2298
+ var TYPOGRAPHY_HEADLINE2_FONT_FAMILY3 = "Nunito, sans-serif";
2299
+ var TYPOGRAPHY_HEADLINE2_FONT_SIZE3 = "60px";
2300
+ var TYPOGRAPHY_HEADLINE2_LINE_HEIGHT3 = "64px";
2005
2301
  var TYPOGRAPHY_HEADLINE2_FONT_WEIGHT3 = "300";
2006
- var TYPOGRAPHY_HEADLINE2_LETTER_SPACING3 = "-0.25px";
2302
+ var TYPOGRAPHY_HEADLINE2_LETTER_SPACING3 = "-0.13333333333333333px";
2007
2303
  var TYPOGRAPHY_HEADLINE2_TEXT_DECORATION3 = "none";
2008
2304
  var TYPOGRAPHY_HEADLINE2_TEXT_TRANSFORM3 = "none";
2009
- var TYPOGRAPHY_HEADLINE3_FONT_FAMILY3 = "'Noto Sans', sans-serif";
2010
- var TYPOGRAPHY_HEADLINE3_FONT_SIZE3 = "24px";
2011
- var TYPOGRAPHY_HEADLINE3_LINE_HEIGHT3 = "28px";
2012
- var TYPOGRAPHY_HEADLINE3_FONT_WEIGHT3 = "300";
2013
- var TYPOGRAPHY_HEADLINE3_LETTER_SPACING3 = "-0.25px";
2305
+ var TYPOGRAPHY_HEADLINE3_FONT_FAMILY3 = "Nunito, sans-serif";
2306
+ var TYPOGRAPHY_HEADLINE3_FONT_SIZE3 = "48px";
2307
+ var TYPOGRAPHY_HEADLINE3_LINE_HEIGHT3 = "52px";
2308
+ var TYPOGRAPHY_HEADLINE3_FONT_WEIGHT3 = "400";
2309
+ var TYPOGRAPHY_HEADLINE3_LETTER_SPACING3 = "normal";
2014
2310
  var TYPOGRAPHY_HEADLINE3_TEXT_DECORATION3 = "none";
2015
2311
  var TYPOGRAPHY_HEADLINE3_TEXT_TRANSFORM3 = "none";
2016
- var TYPOGRAPHY_HEADLINE4_FONT_FAMILY3 = "'Noto Sans', sans-serif";
2017
- var TYPOGRAPHY_HEADLINE4_FONT_SIZE3 = "24px";
2018
- var TYPOGRAPHY_HEADLINE4_LINE_HEIGHT3 = "28px";
2019
- var TYPOGRAPHY_HEADLINE4_FONT_WEIGHT3 = "300";
2020
- var TYPOGRAPHY_HEADLINE4_LETTER_SPACING3 = "-0.25px";
2312
+ var TYPOGRAPHY_HEADLINE4_FONT_FAMILY3 = "Nunito, sans-serif";
2313
+ var TYPOGRAPHY_HEADLINE4_FONT_SIZE3 = "34px";
2314
+ var TYPOGRAPHY_HEADLINE4_LINE_HEIGHT3 = "38px";
2315
+ var TYPOGRAPHY_HEADLINE4_FONT_WEIGHT3 = "400";
2316
+ var TYPOGRAPHY_HEADLINE4_LETTER_SPACING3 = "0.11764705882352941px";
2021
2317
  var TYPOGRAPHY_HEADLINE4_TEXT_DECORATION3 = "none";
2022
2318
  var TYPOGRAPHY_HEADLINE4_TEXT_TRANSFORM3 = "none";
2023
- var TYPOGRAPHY_HEADLINE5_FONT_FAMILY3 = "'Noto Sans', sans-serif";
2319
+ var TYPOGRAPHY_HEADLINE5_FONT_FAMILY3 = "Nunito, sans-serif";
2024
2320
  var TYPOGRAPHY_HEADLINE5_FONT_SIZE3 = "24px";
2025
2321
  var TYPOGRAPHY_HEADLINE5_LINE_HEIGHT3 = "28px";
2026
- var TYPOGRAPHY_HEADLINE5_FONT_WEIGHT3 = "300";
2027
- var TYPOGRAPHY_HEADLINE5_LETTER_SPACING3 = "-0.25px";
2322
+ var TYPOGRAPHY_HEADLINE5_FONT_WEIGHT3 = "400";
2323
+ var TYPOGRAPHY_HEADLINE5_LETTER_SPACING3 = "normal";
2028
2324
  var TYPOGRAPHY_HEADLINE5_TEXT_DECORATION3 = "none";
2029
2325
  var TYPOGRAPHY_HEADLINE5_TEXT_TRANSFORM3 = "none";
2030
- var TYPOGRAPHY_HEADLINE6_FONT_FAMILY3 = "'Noto Sans', sans-serif";
2031
- var TYPOGRAPHY_HEADLINE6_FONT_SIZE3 = "24px";
2032
- var TYPOGRAPHY_HEADLINE6_LINE_HEIGHT3 = "28px";
2033
- var TYPOGRAPHY_HEADLINE6_FONT_WEIGHT3 = "300";
2034
- var TYPOGRAPHY_HEADLINE6_LETTER_SPACING3 = "-0.25px";
2326
+ var TYPOGRAPHY_HEADLINE6_FONT_FAMILY3 = "Nunito, sans-serif";
2327
+ var TYPOGRAPHY_HEADLINE6_FONT_SIZE3 = "20px";
2328
+ var TYPOGRAPHY_HEADLINE6_LINE_HEIGHT3 = "24px";
2329
+ var TYPOGRAPHY_HEADLINE6_FONT_WEIGHT3 = "500";
2330
+ var TYPOGRAPHY_HEADLINE6_LETTER_SPACING3 = "0.2px";
2035
2331
  var TYPOGRAPHY_HEADLINE6_TEXT_DECORATION3 = "none";
2036
2332
  var TYPOGRAPHY_HEADLINE6_TEXT_TRANSFORM3 = "none";
2037
- var TYPOGRAPHY_BODY1_FONT_FAMILY3 = "'Noto Sans', sans-serif";
2333
+ var TYPOGRAPHY_SUBTITLE1_FONT_FAMILY2 = "Nunito, sans-serif";
2334
+ var TYPOGRAPHY_SUBTITLE1_FONT_SIZE2 = "16px";
2335
+ var TYPOGRAPHY_SUBTITLE1_LINE_HEIGHT2 = "20px";
2336
+ var TYPOGRAPHY_SUBTITLE1_FONT_WEIGHT2 = "400";
2337
+ var TYPOGRAPHY_SUBTITLE1_LETTER_SPACING2 = "0.15px";
2338
+ var TYPOGRAPHY_SUBTITLE1_TEXT_DECORATION2 = "none";
2339
+ var TYPOGRAPHY_SUBTITLE1_TEXT_TRANSFORM2 = "none";
2340
+ var TYPOGRAPHY_SUBTITLE2_FONT_FAMILY2 = "Nunito, sans-serif";
2341
+ var TYPOGRAPHY_SUBTITLE2_FONT_SIZE2 = "14px";
2342
+ var TYPOGRAPHY_SUBTITLE2_LINE_HEIGHT2 = "18px";
2343
+ var TYPOGRAPHY_SUBTITLE2_FONT_WEIGHT2 = "500";
2344
+ var TYPOGRAPHY_SUBTITLE2_LETTER_SPACING2 = "0.1142857142857143px";
2345
+ var TYPOGRAPHY_SUBTITLE2_TEXT_DECORATION2 = "none";
2346
+ var TYPOGRAPHY_SUBTITLE2_TEXT_TRANSFORM2 = "none";
2347
+ var TYPOGRAPHY_BODY1_FONT_FAMILY3 = "Nunito, sans-serif";
2038
2348
  var TYPOGRAPHY_BODY1_FONT_SIZE3 = "16px";
2039
2349
  var TYPOGRAPHY_BODY1_LINE_HEIGHT3 = "20px";
2040
- var TYPOGRAPHY_BODY1_FONT_WEIGHT3 = "300";
2041
- var TYPOGRAPHY_BODY1_LETTER_SPACING3 = "-0.25px";
2350
+ var TYPOGRAPHY_BODY1_FONT_WEIGHT3 = "400";
2351
+ var TYPOGRAPHY_BODY1_LETTER_SPACING3 = "0.5px";
2042
2352
  var TYPOGRAPHY_BODY1_TEXT_DECORATION3 = "none";
2043
2353
  var TYPOGRAPHY_BODY1_TEXT_TRANSFORM3 = "none";
2044
- var TYPOGRAPHY_BODY2_FONT_FAMILY3 = "'Noto Sans', sans-serif";
2045
- var TYPOGRAPHY_BODY2_FONT_SIZE3 = "16px";
2046
- var TYPOGRAPHY_BODY2_LINE_HEIGHT3 = "20px";
2047
- var TYPOGRAPHY_BODY2_FONT_WEIGHT3 = "300";
2048
- var TYPOGRAPHY_BODY2_LETTER_SPACING3 = "-0.25px";
2354
+ var TYPOGRAPHY_BODY2_FONT_FAMILY3 = "Nunito, sans-serif";
2355
+ var TYPOGRAPHY_BODY2_FONT_SIZE3 = "14px";
2356
+ var TYPOGRAPHY_BODY2_LINE_HEIGHT3 = "18px";
2357
+ var TYPOGRAPHY_BODY2_FONT_WEIGHT3 = "400";
2358
+ var TYPOGRAPHY_BODY2_LETTER_SPACING3 = "0.2857142857142857px";
2049
2359
  var TYPOGRAPHY_BODY2_TEXT_DECORATION3 = "none";
2050
2360
  var TYPOGRAPHY_BODY2_TEXT_TRANSFORM3 = "none";
2051
- var TYPOGRAPHY_BUTTON_FONT_FAMILY3 = "'Noto Sans', sans-serif";
2052
- var TYPOGRAPHY_BUTTON_FONT_SIZE3 = "16px";
2053
- var TYPOGRAPHY_BUTTON_LINE_HEIGHT3 = "20px";
2361
+ var TYPOGRAPHY_CAPTION_FONT_FAMILY2 = "Nunito, sans-serif";
2362
+ var TYPOGRAPHY_CAPTION_FONT_SIZE2 = "12px";
2363
+ var TYPOGRAPHY_CAPTION_LINE_HEIGHT2 = "16px";
2364
+ var TYPOGRAPHY_CAPTION_FONT_WEIGHT2 = "400";
2365
+ var TYPOGRAPHY_CAPTION_LETTER_SPACING2 = "0.5333333333333333px";
2366
+ var TYPOGRAPHY_CAPTION_TEXT_DECORATION2 = "none";
2367
+ var TYPOGRAPHY_CAPTION_TEXT_TRANSFORM2 = "none";
2368
+ var TYPOGRAPHY_BUTTON_FONT_FAMILY3 = "Nunito, sans-serif";
2369
+ var TYPOGRAPHY_BUTTON_FONT_SIZE3 = "14px";
2370
+ var TYPOGRAPHY_BUTTON_LINE_HEIGHT3 = "18px";
2054
2371
  var TYPOGRAPHY_BUTTON_FONT_WEIGHT3 = "700";
2055
- var TYPOGRAPHY_BUTTON_LETTER_SPACING3 = "-0.25px";
2056
- var TYPOGRAPHY_BUTTON_TEXT_DECORATION3 = "none";
2057
- var TYPOGRAPHY_BUTTON_TEXT_TRANSFORM3 = "uppercase";
2058
- var ELEVATION_NONE = "none";
2059
- var ELEVATION_LIGHT_LIGHT3 = "0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 1px 2px 0px rgba(0, 0, 0, 0.14)";
2060
- var ELEVATION_LIGHT_SEMILIGHT3 = "0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 2px 4px 0px rgba(0, 0, 0, 0.14)";
2061
- var ELEVATION_LIGHT_REGULAR3 = "0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 4px 8px 0px rgba(0, 0, 0, 0.14)";
2062
- var ELEVATION_LIGHT_SEMIBOLD3 = "0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 8px 16px 0px rgba(0, 0, 0, 0.14)";
2063
- var ELEVATION_LIGHT_BOLD3 = "0px 0px 8px 0px rgba(0, 0, 0, 0.12), 0px 14px 28px 0px rgba(0, 0, 0, 0.14)";
2064
- var ELEVATION_LIGHT_EXTRABOLD3 = "0px 0px 8px 0px rgba(0, 0, 0, 0.12), 0px 32px 64px 0px rgba(0, 0, 0, 0.14)";
2065
- var ELEVATION_DARK_LIGHT3 = "0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 1px 2px 0px rgba(0, 0, 0, 0.28)";
2066
- var ELEVATION_DARK_SEMILIGHT3 = "0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 2px 4px 0px rgba(0, 0, 0, 0.28)";
2067
- var ELEVATION_DARK_REGULAR3 = "0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 4px 8px 0px rgba(0, 0, 0, 0.28)";
2068
- var ELEVATION_DARK_SEMIBOLD3 = "0px 0px 2px 0px rgba(0, 0, 0, 0.24), 0px 8px 16px 0px rgba(0, 0, 0, 0.28)";
2069
- var ELEVATION_DARK_BOLD3 = "0px 0px 8px 0px rgba(0, 0, 0, 0.24), 0px 14px 28px 0px rgba(0, 0, 0, 0.28)";
2070
- var ELEVATION_DARK_EXTRABOLD3 = "0px 0px 8px 0px rgba(0, 0, 0, 0.24), 0px 32px 64px 0px rgba(0, 0, 0, 0.28)";
2071
- var TYPOGRAPHY_KEY_HEADLINE13 = "headline1";
2072
- var TYPOGRAPHY_KEY_HEADLINE23 = "headline2";
2073
- var TYPOGRAPHY_KEY_HEADLINE33 = "headline3";
2074
- var TYPOGRAPHY_KEY_HEADLINE43 = "headline4";
2075
- var TYPOGRAPHY_KEY_HEADLINE53 = "headline5";
2076
- var TYPOGRAPHY_KEY_HEADLINE63 = "headline6";
2077
- var TYPOGRAPHY_KEY_BODY13 = "body1";
2078
- var TYPOGRAPHY_KEY_BODY23 = "body2";
2079
- var TYPOGRAPHY_KEY_BUTTON3 = "button";
2080
- var ELEVATION_KEY_LIGHT3 = "light";
2081
- var ELEVATION_KEY_SEMILIGHT3 = "semilight";
2082
- var ELEVATION_KEY_REGULAR3 = "regular";
2083
- var ELEVATION_KEY_SEMIBOLD3 = "semibold";
2084
- var ELEVATION_KEY_BOLD3 = "bold";
2085
- var ELEVATION_KEY_EXTRABOLD3 = "extrabold";
2086
- var VARIANT_PRIMARY3 = "primary";
2087
- var VARIANT_SECONDARY3 = "secondary";
2088
- var VARIANT_TERTIARY2 = "tertiary";
2089
-
2090
- // src/Theming/CosmopolitanTheme.ts
2091
- (function(CosmopolitanTheme2) {
2092
- CosmopolitanTheme2.COSMOPOLITAN_THEME = ThemeFactory.create({
2093
- name: NAME3,
2094
- scheme: {
2095
- light: {
2096
- surface: SCHEME_LIGHT_SURFACE3,
2097
- contrast: SCHEME_LIGHT_CONTRAST3,
2098
- background: SCHEME_LIGHT_BACKGROUND3,
2099
- foreground: SCHEME_LIGHT_FOREGROUND3,
2100
- highlight: SCHEME_LIGHT_HIGHLIGHT3,
2101
- middlelight: SCHEME_LIGHT_MIDDLELIGHT3,
2102
- lowlight: SCHEME_LIGHT_LOWLIGHT3,
2103
- transparent: SCHEME_LIGHT_TRANSPARENT3,
2104
- semiTransparent: SCHEME_LIGHT_SEMI_TRANSPARENT3,
2105
- disabled: SCHEME_LIGHT_DISABLED3,
2106
- selection: SCHEME_LIGHT_SELECTION3
2107
- },
2108
- dark: {
2109
- surface: SCHEME_DARK_SURFACE3,
2110
- contrast: SCHEME_DARK_CONTRAST3,
2111
- background: SCHEME_DARK_BACKGROUND3,
2112
- foreground: SCHEME_DARK_FOREGROUND3,
2113
- highlight: SCHEME_DARK_HIGHLIGHT3,
2114
- middlelight: SCHEME_DARK_MIDDLELIGHT3,
2115
- lowlight: SCHEME_DARK_LOWLIGHT3,
2116
- transparent: SCHEME_DARK_TRANSPARENT3,
2117
- semiTransparent: SCHEME_DARK_SEMI_TRANSPARENT3,
2118
- disabled: SCHEME_DARK_DISABLED3,
2119
- selection: SCHEME_DARK_SELECTION3
2120
- }
2121
- },
2122
- palette: {
2123
- light: {
2124
- primary: {
2125
- 0: COLOR_LIGHT_PRIMARY_03,
2126
- 50: COLOR_LIGHT_PRIMARY_503,
2127
- 100: COLOR_LIGHT_PRIMARY_1003,
2128
- 200: COLOR_LIGHT_PRIMARY_2003,
2129
- 300: COLOR_LIGHT_PRIMARY_3003,
2130
- 400: COLOR_LIGHT_PRIMARY_4003,
2131
- 500: COLOR_LIGHT_PRIMARY_5003,
2132
- 600: COLOR_LIGHT_PRIMARY_6003,
2133
- 700: COLOR_LIGHT_PRIMARY_7003,
2134
- 800: COLOR_LIGHT_PRIMARY_8003,
2135
- 900: COLOR_LIGHT_PRIMARY_9003
2136
- },
2137
- secondary: {
2138
- 0: COLOR_LIGHT_SECONDARY_03,
2139
- 50: COLOR_LIGHT_SECONDARY_503,
2140
- 100: COLOR_LIGHT_SECONDARY_1003,
2141
- 200: COLOR_LIGHT_SECONDARY_2003,
2142
- 300: COLOR_LIGHT_SECONDARY_3003,
2143
- 400: COLOR_LIGHT_SECONDARY_4003,
2144
- 500: COLOR_LIGHT_SECONDARY_5003,
2145
- 600: COLOR_LIGHT_SECONDARY_6003,
2146
- 700: COLOR_LIGHT_SECONDARY_7003,
2147
- 800: COLOR_LIGHT_SECONDARY_8003,
2148
- 900: COLOR_LIGHT_SECONDARY_9003
2149
- },
2150
- tertiary: {
2151
- 0: COLOR_LIGHT_TERTIARY_03,
2152
- 50: COLOR_LIGHT_TERTIARY_503,
2153
- 100: COLOR_LIGHT_TERTIARY_1003,
2154
- 200: COLOR_LIGHT_TERTIARY_2003,
2155
- 300: COLOR_LIGHT_TERTIARY_3003,
2156
- 400: COLOR_LIGHT_TERTIARY_4003,
2157
- 500: COLOR_LIGHT_TERTIARY_5003,
2158
- 600: COLOR_LIGHT_TERTIARY_6003,
2159
- 700: COLOR_LIGHT_TERTIARY_7003,
2160
- 800: COLOR_LIGHT_TERTIARY_8003,
2161
- 900: COLOR_LIGHT_TERTIARY_9003
2162
- },
2163
- info: {
2164
- 0: COLOR_LIGHT_INFO_03,
2165
- 50: COLOR_LIGHT_INFO_503,
2166
- 100: COLOR_LIGHT_INFO_1003,
2167
- 200: COLOR_LIGHT_INFO_2003,
2168
- 300: COLOR_LIGHT_INFO_3003,
2169
- 400: COLOR_LIGHT_INFO_4003,
2170
- 500: COLOR_LIGHT_INFO_5003,
2171
- 600: COLOR_LIGHT_INFO_6003,
2172
- 700: COLOR_LIGHT_INFO_7003,
2173
- 800: COLOR_LIGHT_INFO_8003,
2174
- 900: COLOR_LIGHT_INFO_9003
2175
- },
2176
- warning: {
2177
- 0: COLOR_LIGHT_WARNING_03,
2178
- 50: COLOR_LIGHT_WARNING_503,
2179
- 100: COLOR_LIGHT_WARNING_1003,
2180
- 200: COLOR_LIGHT_WARNING_2003,
2181
- 300: COLOR_LIGHT_WARNING_3003,
2182
- 400: COLOR_LIGHT_WARNING_4003,
2183
- 500: COLOR_LIGHT_WARNING_5003,
2184
- 600: COLOR_LIGHT_WARNING_6003,
2185
- 700: COLOR_LIGHT_WARNING_7003,
2186
- 800: COLOR_LIGHT_WARNING_8003,
2187
- 900: COLOR_LIGHT_WARNING_9003
2188
- },
2189
- danger: {
2190
- 0: COLOR_LIGHT_DANGER_03,
2191
- 50: COLOR_LIGHT_DANGER_503,
2192
- 100: COLOR_LIGHT_DANGER_1003,
2193
- 200: COLOR_LIGHT_DANGER_2003,
2194
- 300: COLOR_LIGHT_DANGER_3003,
2195
- 400: COLOR_LIGHT_DANGER_4003,
2196
- 500: COLOR_LIGHT_DANGER_5003,
2197
- 600: COLOR_LIGHT_DANGER_6003,
2198
- 700: COLOR_LIGHT_DANGER_7003,
2199
- 800: COLOR_LIGHT_DANGER_8003,
2200
- 900: COLOR_LIGHT_DANGER_9003
2201
- },
2202
- success: {
2203
- 0: COLOR_LIGHT_SUCCESS_03,
2204
- 50: COLOR_LIGHT_SUCCESS_503,
2205
- 100: COLOR_LIGHT_SUCCESS_1003,
2206
- 200: COLOR_LIGHT_SUCCESS_2003,
2207
- 300: COLOR_LIGHT_SUCCESS_3003,
2208
- 400: COLOR_LIGHT_SUCCESS_4003,
2209
- 500: COLOR_LIGHT_SUCCESS_5003,
2210
- 600: COLOR_LIGHT_SUCCESS_6003,
2211
- 700: COLOR_LIGHT_SUCCESS_7003,
2212
- 800: COLOR_LIGHT_SUCCESS_8003,
2213
- 900: COLOR_LIGHT_SUCCESS_9003
2214
- },
2215
- highlight: {
2216
- 0: COLOR_LIGHT_HIGHLIGHT_03,
2217
- 50: COLOR_LIGHT_HIGHLIGHT_503,
2218
- 100: COLOR_LIGHT_HIGHLIGHT_1003,
2219
- 200: COLOR_LIGHT_HIGHLIGHT_2003,
2220
- 300: COLOR_LIGHT_HIGHLIGHT_3003,
2221
- 400: COLOR_LIGHT_HIGHLIGHT_4003,
2222
- 500: COLOR_LIGHT_HIGHLIGHT_5003,
2223
- 600: COLOR_LIGHT_HIGHLIGHT_6003,
2224
- 700: COLOR_LIGHT_HIGHLIGHT_7003,
2225
- 800: COLOR_LIGHT_HIGHLIGHT_8003,
2226
- 900: COLOR_LIGHT_HIGHLIGHT_9003
2227
- },
2228
- neutral: {
2229
- 0: COLOR_LIGHT_NEUTRAL_03,
2230
- 50: COLOR_LIGHT_NEUTRAL_503,
2231
- 100: COLOR_LIGHT_NEUTRAL_1003,
2232
- 200: COLOR_LIGHT_NEUTRAL_2003,
2233
- 300: COLOR_LIGHT_NEUTRAL_3003,
2234
- 400: COLOR_LIGHT_NEUTRAL_4003,
2235
- 500: COLOR_LIGHT_NEUTRAL_5003,
2236
- 600: COLOR_LIGHT_NEUTRAL_6003,
2237
- 700: COLOR_LIGHT_NEUTRAL_7003,
2238
- 800: COLOR_LIGHT_NEUTRAL_8003,
2239
- 900: COLOR_LIGHT_NEUTRAL_9003
2240
- }
2372
+ var TYPOGRAPHY_BUTTON_LETTER_SPACING3 = "1.4285714285714286px";
2373
+ var TYPOGRAPHY_BUTTON_TEXT_DECORATION3 = "none";
2374
+ var TYPOGRAPHY_BUTTON_TEXT_TRANSFORM3 = "none";
2375
+ var TYPOGRAPHY_OVERLINE_FONT_FAMILY2 = "Nunito, sans-serif";
2376
+ var TYPOGRAPHY_OVERLINE_FONT_SIZE2 = "12px";
2377
+ var TYPOGRAPHY_OVERLINE_LINE_HEIGHT2 = "16px";
2378
+ var TYPOGRAPHY_OVERLINE_FONT_WEIGHT2 = "500";
2379
+ var TYPOGRAPHY_OVERLINE_LETTER_SPACING2 = "2.6666666666666665px";
2380
+ var TYPOGRAPHY_OVERLINE_TEXT_DECORATION2 = "none";
2381
+ var TYPOGRAPHY_OVERLINE_TEXT_TRANSFORM2 = "none";
2382
+ var ELEVATION_LIGHT_LIGHT3 = "2px 2px 0px 0px #333333";
2383
+ var ELEVATION_LIGHT_SEMILIGHT3 = "3px 3px 0px 0px #333333";
2384
+ var ELEVATION_LIGHT_REGULAR3 = "4px 4px 0px 0px #333333";
2385
+ var ELEVATION_LIGHT_SEMIBOLD3 = "5px 5px 0px 0px #333333";
2386
+ var ELEVATION_LIGHT_BOLD3 = "6px 6px 0px 0px #333333";
2387
+ var ELEVATION_LIGHT_EXTRABOLD3 = "7px 7px 0px 0px #333333";
2388
+ var ELEVATION_DARK_LIGHT3 = "2px 2px 0px 0px #ffffff";
2389
+ var ELEVATION_DARK_SEMILIGHT3 = "3px 3px 0px 0px #ffffff";
2390
+ var ELEVATION_DARK_REGULAR3 = "4px 4px 0px 0px #ffffff";
2391
+ var ELEVATION_DARK_SEMIBOLD3 = "5px 5px 0px 0px #ffffff";
2392
+ var ELEVATION_DARK_BOLD3 = "6px 6px 0px 0px #ffffff";
2393
+ var ELEVATION_DARK_EXTRABOLD3 = "7px 7px 0px 0px #ffffff";
2394
+ var TYPOGRAPHY_KEY_HEADLINE13 = "headline1";
2395
+ var TYPOGRAPHY_KEY_HEADLINE23 = "headline2";
2396
+ var TYPOGRAPHY_KEY_HEADLINE33 = "headline3";
2397
+ var TYPOGRAPHY_KEY_HEADLINE43 = "headline4";
2398
+ var TYPOGRAPHY_KEY_HEADLINE53 = "headline5";
2399
+ var TYPOGRAPHY_KEY_HEADLINE63 = "headline6";
2400
+ var TYPOGRAPHY_KEY_SUBTITLE12 = "subtitle1";
2401
+ var TYPOGRAPHY_KEY_SUBTITLE22 = "subtitle2";
2402
+ var TYPOGRAPHY_KEY_BODY13 = "body1";
2403
+ var TYPOGRAPHY_KEY_BODY23 = "body2";
2404
+ var TYPOGRAPHY_KEY_CAPTION2 = "caption";
2405
+ var TYPOGRAPHY_KEY_BUTTON3 = "button";
2406
+ var TYPOGRAPHY_KEY_OVERLINE2 = "overline";
2407
+ var ELEVATION_KEY_LIGHT3 = "light";
2408
+ var ELEVATION_KEY_SEMILIGHT3 = "semilight";
2409
+ var ELEVATION_KEY_REGULAR3 = "regular";
2410
+ var ELEVATION_KEY_SEMIBOLD3 = "semibold";
2411
+ var ELEVATION_KEY_BOLD3 = "bold";
2412
+ var ELEVATION_KEY_EXTRABOLD3 = "extrabold";
2413
+ var VARIANT_PRIMARY3 = "primary";
2414
+ var VARIANT_SECONDARY3 = "secondary";
2415
+ var VARIANT_DANGER2 = "danger";
2416
+ var VARIANT_WARNING2 = "warning";
2417
+ var VARIANT_SUCCESS2 = "success";
2418
+ var VARIANT_INFO2 = "info";
2419
+ var VARIANT_NEUTRAL2 = "neutral";
2420
+
2421
+ // src/Theming/MemphisTheme.ts
2422
+ (function(MemphisTheme2) {
2423
+ MemphisTheme2.MEMPHIS_THEME = ThemeFactory.create({
2424
+ name: NAME3,
2425
+ scheme: {
2426
+ light: {
2427
+ surface: SCHEME_LIGHT_SURFACE3,
2428
+ background: SCHEME_LIGHT_BACKGROUND3,
2429
+ foreground: SCHEME_LIGHT_FOREGROUND3,
2430
+ highlight: SCHEME_LIGHT_HIGHLIGHT3,
2431
+ middlelight: SCHEME_LIGHT_MIDDLELIGHT3,
2432
+ lowlight: SCHEME_LIGHT_LOWLIGHT3,
2433
+ transparent: SCHEME_LIGHT_TRANSPARENT3,
2434
+ semiTransparent: SCHEME_LIGHT_SEMI_TRANSPARENT3,
2435
+ disabled: SCHEME_LIGHT_DISABLED3,
2436
+ contrast: SCHEME_LIGHT_CONTRAST3,
2437
+ selection: SCHEME_LIGHT_SELECTION3
2241
2438
  },
2242
2439
  dark: {
2243
- primary: {
2244
- 0: COLOR_DARK_PRIMARY_03,
2245
- 50: COLOR_DARK_PRIMARY_503,
2246
- 100: COLOR_DARK_PRIMARY_1003,
2247
- 200: COLOR_DARK_PRIMARY_2003,
2248
- 300: COLOR_DARK_PRIMARY_3003,
2249
- 400: COLOR_DARK_PRIMARY_4003,
2250
- 500: COLOR_DARK_PRIMARY_5003,
2251
- 600: COLOR_DARK_PRIMARY_6003,
2252
- 700: COLOR_DARK_PRIMARY_7003,
2253
- 800: COLOR_DARK_PRIMARY_8003,
2254
- 900: COLOR_DARK_PRIMARY_9003
2255
- },
2256
- secondary: {
2257
- 0: COLOR_DARK_SECONDARY_03,
2258
- 50: COLOR_DARK_SECONDARY_503,
2259
- 100: COLOR_DARK_SECONDARY_1003,
2260
- 200: COLOR_DARK_SECONDARY_2003,
2261
- 300: COLOR_DARK_SECONDARY_3003,
2262
- 400: COLOR_DARK_SECONDARY_4003,
2263
- 500: COLOR_DARK_SECONDARY_5003,
2264
- 600: COLOR_DARK_SECONDARY_6003,
2265
- 700: COLOR_DARK_SECONDARY_7003,
2266
- 800: COLOR_DARK_SECONDARY_8003,
2267
- 900: COLOR_DARK_SECONDARY_9003
2268
- },
2269
- tertiary: {
2270
- 0: COLOR_DARK_TERTIARY_03,
2271
- 50: COLOR_DARK_TERTIARY_503,
2272
- 100: COLOR_DARK_TERTIARY_1003,
2273
- 200: COLOR_DARK_TERTIARY_2003,
2274
- 300: COLOR_DARK_TERTIARY_3003,
2275
- 400: COLOR_DARK_TERTIARY_4003,
2276
- 500: COLOR_DARK_TERTIARY_5003,
2277
- 600: COLOR_DARK_TERTIARY_6003,
2278
- 700: COLOR_DARK_TERTIARY_7003,
2279
- 800: COLOR_DARK_TERTIARY_8003,
2280
- 900: COLOR_DARK_TERTIARY_9003
2281
- },
2282
- info: {
2283
- 0: COLOR_DARK_INFO_03,
2284
- 50: COLOR_DARK_INFO_503,
2285
- 100: COLOR_DARK_INFO_1003,
2286
- 200: COLOR_DARK_INFO_2003,
2287
- 300: COLOR_DARK_INFO_3003,
2288
- 400: COLOR_DARK_INFO_4003,
2289
- 500: COLOR_DARK_INFO_5003,
2290
- 600: COLOR_DARK_INFO_6003,
2291
- 700: COLOR_DARK_INFO_7003,
2292
- 800: COLOR_DARK_INFO_8003,
2293
- 900: COLOR_DARK_INFO_9003
2294
- },
2295
- warning: {
2296
- 0: COLOR_DARK_WARNING_03,
2297
- 50: COLOR_DARK_WARNING_503,
2298
- 100: COLOR_DARK_WARNING_1003,
2299
- 200: COLOR_DARK_WARNING_2003,
2300
- 300: COLOR_DARK_WARNING_3003,
2301
- 400: COLOR_DARK_WARNING_4003,
2302
- 500: COLOR_DARK_WARNING_5003,
2303
- 600: COLOR_DARK_WARNING_6003,
2304
- 700: COLOR_DARK_WARNING_7003,
2305
- 800: COLOR_DARK_WARNING_8003,
2306
- 900: COLOR_DARK_WARNING_9003
2307
- },
2308
- danger: {
2309
- 0: COLOR_DARK_DANGER_03,
2310
- 50: COLOR_DARK_DANGER_503,
2311
- 100: COLOR_DARK_DANGER_1003,
2312
- 200: COLOR_DARK_DANGER_2003,
2313
- 300: COLOR_DARK_DANGER_3003,
2314
- 400: COLOR_DARK_DANGER_4003,
2315
- 500: COLOR_DARK_DANGER_5003,
2316
- 600: COLOR_DARK_DANGER_6003,
2317
- 700: COLOR_DARK_DANGER_7003,
2318
- 800: COLOR_DARK_DANGER_8003,
2319
- 900: COLOR_DARK_DANGER_9003
2320
- },
2321
- success: {
2322
- 0: COLOR_DARK_SUCCESS_03,
2323
- 50: COLOR_DARK_SUCCESS_503,
2324
- 100: COLOR_DARK_SUCCESS_1003,
2325
- 200: COLOR_DARK_SUCCESS_2003,
2326
- 300: COLOR_DARK_SUCCESS_3003,
2327
- 400: COLOR_DARK_SUCCESS_4003,
2328
- 500: COLOR_DARK_SUCCESS_5003,
2329
- 600: COLOR_DARK_SUCCESS_6003,
2330
- 700: COLOR_DARK_SUCCESS_7003,
2331
- 800: COLOR_DARK_SUCCESS_8003,
2332
- 900: COLOR_DARK_SUCCESS_9003
2333
- },
2334
- highlight: {
2335
- 0: COLOR_DARK_HIGHLIGHT_03,
2336
- 50: COLOR_DARK_HIGHLIGHT_503,
2337
- 100: COLOR_DARK_HIGHLIGHT_1003,
2338
- 200: COLOR_DARK_HIGHLIGHT_2003,
2339
- 300: COLOR_DARK_HIGHLIGHT_3003,
2340
- 400: COLOR_DARK_HIGHLIGHT_4003,
2341
- 500: COLOR_DARK_HIGHLIGHT_5003,
2342
- 600: COLOR_DARK_HIGHLIGHT_6003,
2343
- 700: COLOR_DARK_HIGHLIGHT_7003,
2344
- 800: COLOR_DARK_HIGHLIGHT_8003,
2345
- 900: COLOR_DARK_HIGHLIGHT_9003
2346
- },
2347
- neutral: {
2348
- 0: COLOR_DARK_NEUTRAL_03,
2349
- 50: COLOR_DARK_NEUTRAL_503,
2350
- 100: COLOR_DARK_NEUTRAL_1003,
2351
- 200: COLOR_DARK_NEUTRAL_2003,
2352
- 300: COLOR_DARK_NEUTRAL_3003,
2353
- 400: COLOR_DARK_NEUTRAL_4003,
2354
- 500: COLOR_DARK_NEUTRAL_5003,
2355
- 600: COLOR_DARK_NEUTRAL_6003,
2356
- 700: COLOR_DARK_NEUTRAL_7003,
2357
- 800: COLOR_DARK_NEUTRAL_8003,
2358
- 900: COLOR_DARK_NEUTRAL_9003
2359
- }
2360
- }
2361
- },
2362
- fontFamily: FONT_FAMILY3,
2363
- typography: {
2364
- headline1: {
2365
- fontFamily: TYPOGRAPHY_HEADLINE1_FONT_FAMILY3,
2366
- fontSize: TYPOGRAPHY_HEADLINE1_FONT_SIZE3,
2367
- lineHeight: TYPOGRAPHY_HEADLINE1_LINE_HEIGHT3,
2368
- fontWeight: TYPOGRAPHY_HEADLINE1_FONT_WEIGHT3,
2369
- letterSpacing: TYPOGRAPHY_HEADLINE1_LETTER_SPACING3,
2370
- textDecoration: TYPOGRAPHY_HEADLINE1_TEXT_DECORATION3,
2371
- textTransform: TYPOGRAPHY_HEADLINE1_TEXT_TRANSFORM3
2372
- },
2373
- headline2: {
2374
- fontFamily: TYPOGRAPHY_HEADLINE2_FONT_FAMILY3,
2375
- fontSize: TYPOGRAPHY_HEADLINE2_FONT_SIZE3,
2376
- lineHeight: TYPOGRAPHY_HEADLINE2_LINE_HEIGHT3,
2377
- fontWeight: TYPOGRAPHY_HEADLINE2_FONT_WEIGHT3,
2378
- letterSpacing: TYPOGRAPHY_HEADLINE2_LETTER_SPACING3,
2379
- textDecoration: TYPOGRAPHY_HEADLINE2_TEXT_DECORATION3,
2380
- textTransform: TYPOGRAPHY_HEADLINE2_TEXT_TRANSFORM3
2381
- },
2382
- headline3: {
2383
- fontFamily: TYPOGRAPHY_HEADLINE3_FONT_FAMILY3,
2384
- fontSize: TYPOGRAPHY_HEADLINE3_FONT_SIZE3,
2385
- lineHeight: TYPOGRAPHY_HEADLINE3_LINE_HEIGHT3,
2386
- fontWeight: TYPOGRAPHY_HEADLINE3_FONT_WEIGHT3,
2387
- letterSpacing: TYPOGRAPHY_HEADLINE3_LETTER_SPACING3,
2388
- textDecoration: TYPOGRAPHY_HEADLINE3_TEXT_DECORATION3,
2389
- textTransform: TYPOGRAPHY_HEADLINE3_TEXT_TRANSFORM3
2390
- },
2391
- headline4: {
2392
- fontFamily: TYPOGRAPHY_HEADLINE4_FONT_FAMILY3,
2393
- fontSize: TYPOGRAPHY_HEADLINE4_FONT_SIZE3,
2394
- lineHeight: TYPOGRAPHY_HEADLINE4_LINE_HEIGHT3,
2395
- fontWeight: TYPOGRAPHY_HEADLINE4_FONT_WEIGHT3,
2396
- letterSpacing: TYPOGRAPHY_HEADLINE4_LETTER_SPACING3,
2397
- textDecoration: TYPOGRAPHY_HEADLINE4_TEXT_DECORATION3,
2398
- textTransform: TYPOGRAPHY_HEADLINE4_TEXT_TRANSFORM3
2399
- },
2400
- headline5: {
2401
- fontFamily: TYPOGRAPHY_HEADLINE5_FONT_FAMILY3,
2402
- fontSize: TYPOGRAPHY_HEADLINE5_FONT_SIZE3,
2403
- lineHeight: TYPOGRAPHY_HEADLINE5_LINE_HEIGHT3,
2404
- fontWeight: TYPOGRAPHY_HEADLINE5_FONT_WEIGHT3,
2405
- letterSpacing: TYPOGRAPHY_HEADLINE5_LETTER_SPACING3,
2406
- textDecoration: TYPOGRAPHY_HEADLINE5_TEXT_DECORATION3,
2407
- textTransform: TYPOGRAPHY_HEADLINE5_TEXT_TRANSFORM3
2408
- },
2409
- headline6: {
2410
- fontFamily: TYPOGRAPHY_HEADLINE6_FONT_FAMILY3,
2411
- fontSize: TYPOGRAPHY_HEADLINE6_FONT_SIZE3,
2412
- lineHeight: TYPOGRAPHY_HEADLINE6_LINE_HEIGHT3,
2413
- fontWeight: TYPOGRAPHY_HEADLINE6_FONT_WEIGHT3,
2414
- letterSpacing: TYPOGRAPHY_HEADLINE6_LETTER_SPACING3,
2415
- textDecoration: TYPOGRAPHY_HEADLINE6_TEXT_DECORATION3,
2416
- textTransform: TYPOGRAPHY_HEADLINE6_TEXT_TRANSFORM3
2417
- },
2418
- body1: {
2419
- fontFamily: TYPOGRAPHY_BODY1_FONT_FAMILY3,
2420
- fontSize: TYPOGRAPHY_BODY1_FONT_SIZE3,
2421
- lineHeight: TYPOGRAPHY_BODY1_LINE_HEIGHT3,
2422
- fontWeight: TYPOGRAPHY_BODY1_FONT_WEIGHT3,
2423
- letterSpacing: TYPOGRAPHY_BODY1_LETTER_SPACING3,
2424
- textDecoration: TYPOGRAPHY_BODY1_TEXT_DECORATION3,
2425
- textTransform: TYPOGRAPHY_BODY1_TEXT_TRANSFORM3
2426
- },
2427
- body2: {
2428
- fontFamily: TYPOGRAPHY_BODY2_FONT_FAMILY3,
2429
- fontSize: TYPOGRAPHY_BODY2_FONT_SIZE3,
2430
- lineHeight: TYPOGRAPHY_BODY2_LINE_HEIGHT3,
2431
- fontWeight: TYPOGRAPHY_BODY2_FONT_WEIGHT3,
2432
- letterSpacing: TYPOGRAPHY_BODY2_LETTER_SPACING3,
2433
- textDecoration: TYPOGRAPHY_BODY2_TEXT_DECORATION3,
2434
- textTransform: TYPOGRAPHY_BODY2_TEXT_TRANSFORM3
2435
- },
2436
- button: {
2437
- fontFamily: TYPOGRAPHY_BUTTON_FONT_FAMILY3,
2438
- fontSize: TYPOGRAPHY_BUTTON_FONT_SIZE3,
2439
- lineHeight: TYPOGRAPHY_BUTTON_LINE_HEIGHT3,
2440
- fontWeight: TYPOGRAPHY_BUTTON_FONT_WEIGHT3,
2441
- letterSpacing: TYPOGRAPHY_BUTTON_LETTER_SPACING3,
2442
- textDecoration: TYPOGRAPHY_BUTTON_TEXT_DECORATION3,
2443
- textTransform: TYPOGRAPHY_BUTTON_TEXT_TRANSFORM3
2440
+ surface: SCHEME_DARK_SURFACE3,
2441
+ background: SCHEME_DARK_BACKGROUND3,
2442
+ foreground: SCHEME_DARK_FOREGROUND3,
2443
+ highlight: SCHEME_DARK_HIGHLIGHT3,
2444
+ middlelight: SCHEME_DARK_MIDDLELIGHT3,
2445
+ lowlight: SCHEME_DARK_LOWLIGHT3,
2446
+ transparent: SCHEME_DARK_TRANSPARENT3,
2447
+ semiTransparent: SCHEME_DARK_SEMI_TRANSPARENT3,
2448
+ disabled: SCHEME_DARK_DISABLED3,
2449
+ contrast: SCHEME_DARK_CONTRAST3,
2450
+ selection: SCHEME_DARK_SELECTION3
2444
2451
  }
2445
2452
  },
2446
- layout: {
2447
- radius: LAYOUT_RADIUS3,
2448
- space: LAYOUT_SPACE3,
2449
- thickness: LAYOUT_THICKNESS3
2450
- },
2451
- elevation: {
2453
+ palette: {
2452
2454
  light: {
2453
- light: ELEVATION_LIGHT_LIGHT3,
2454
- semilight: ELEVATION_LIGHT_SEMILIGHT3,
2455
- regular: ELEVATION_LIGHT_REGULAR3,
2456
- semibold: ELEVATION_LIGHT_SEMIBOLD3,
2457
- bold: ELEVATION_LIGHT_BOLD3,
2458
- extrabold: ELEVATION_LIGHT_EXTRABOLD3,
2459
- none: ELEVATION_NONE
2455
+ primary: {
2456
+ 0: COLOR_LIGHT_PRIMARY_03,
2457
+ 50: COLOR_LIGHT_PRIMARY_503,
2458
+ 100: COLOR_LIGHT_PRIMARY_1003,
2459
+ 200: COLOR_LIGHT_PRIMARY_2003,
2460
+ 300: COLOR_LIGHT_PRIMARY_3003,
2461
+ 400: COLOR_LIGHT_PRIMARY_4003,
2462
+ 500: COLOR_LIGHT_PRIMARY_5003,
2463
+ 600: COLOR_LIGHT_PRIMARY_6003,
2464
+ 700: COLOR_LIGHT_PRIMARY_7003,
2465
+ 800: COLOR_LIGHT_PRIMARY_8003,
2466
+ 900: COLOR_LIGHT_PRIMARY_9003
2467
+ },
2468
+ secondary: {
2469
+ 0: COLOR_LIGHT_SECONDARY_03,
2470
+ 50: COLOR_LIGHT_SECONDARY_503,
2471
+ 100: COLOR_LIGHT_SECONDARY_1003,
2472
+ 200: COLOR_LIGHT_SECONDARY_2003,
2473
+ 300: COLOR_LIGHT_SECONDARY_3003,
2474
+ 400: COLOR_LIGHT_SECONDARY_4003,
2475
+ 500: COLOR_LIGHT_SECONDARY_5003,
2476
+ 600: COLOR_LIGHT_SECONDARY_6003,
2477
+ 700: COLOR_LIGHT_SECONDARY_7003,
2478
+ 800: COLOR_LIGHT_SECONDARY_8003,
2479
+ 900: COLOR_LIGHT_SECONDARY_9003
2480
+ },
2481
+ tertiary: {
2482
+ 0: COLOR_LIGHT_TERTIARY_03,
2483
+ 50: COLOR_LIGHT_TERTIARY_503,
2484
+ 100: COLOR_LIGHT_TERTIARY_1003,
2485
+ 200: COLOR_LIGHT_TERTIARY_2003,
2486
+ 300: COLOR_LIGHT_TERTIARY_3003,
2487
+ 400: COLOR_LIGHT_TERTIARY_4003,
2488
+ 500: COLOR_LIGHT_TERTIARY_5003,
2489
+ 600: COLOR_LIGHT_TERTIARY_6003,
2490
+ 700: COLOR_LIGHT_TERTIARY_7003,
2491
+ 800: COLOR_LIGHT_TERTIARY_8003,
2492
+ 900: COLOR_LIGHT_TERTIARY_9003
2493
+ },
2494
+ info: {
2495
+ 0: COLOR_LIGHT_INFO_03,
2496
+ 50: COLOR_LIGHT_INFO_503,
2497
+ 100: COLOR_LIGHT_INFO_1003,
2498
+ 200: COLOR_LIGHT_INFO_2003,
2499
+ 300: COLOR_LIGHT_INFO_3003,
2500
+ 400: COLOR_LIGHT_INFO_4003,
2501
+ 500: COLOR_LIGHT_INFO_5003,
2502
+ 600: COLOR_LIGHT_INFO_6003,
2503
+ 700: COLOR_LIGHT_INFO_7003,
2504
+ 800: COLOR_LIGHT_INFO_8003,
2505
+ 900: COLOR_LIGHT_INFO_9003
2506
+ },
2507
+ warning: {
2508
+ 0: COLOR_LIGHT_WARNING_03,
2509
+ 50: COLOR_LIGHT_WARNING_503,
2510
+ 100: COLOR_LIGHT_WARNING_1003,
2511
+ 200: COLOR_LIGHT_WARNING_2003,
2512
+ 300: COLOR_LIGHT_WARNING_3003,
2513
+ 400: COLOR_LIGHT_WARNING_4003,
2514
+ 500: COLOR_LIGHT_WARNING_5003,
2515
+ 600: COLOR_LIGHT_WARNING_6003,
2516
+ 700: COLOR_LIGHT_WARNING_7003,
2517
+ 800: COLOR_LIGHT_WARNING_8003,
2518
+ 900: COLOR_LIGHT_WARNING_9003
2519
+ },
2520
+ danger: {
2521
+ 0: COLOR_LIGHT_DANGER_03,
2522
+ 50: COLOR_LIGHT_DANGER_503,
2523
+ 100: COLOR_LIGHT_DANGER_1003,
2524
+ 200: COLOR_LIGHT_DANGER_2003,
2525
+ 300: COLOR_LIGHT_DANGER_3003,
2526
+ 400: COLOR_LIGHT_DANGER_4003,
2527
+ 500: COLOR_LIGHT_DANGER_5003,
2528
+ 600: COLOR_LIGHT_DANGER_6003,
2529
+ 700: COLOR_LIGHT_DANGER_7003,
2530
+ 800: COLOR_LIGHT_DANGER_8003,
2531
+ 900: COLOR_LIGHT_DANGER_9003
2532
+ },
2533
+ success: {
2534
+ 0: COLOR_LIGHT_SUCCESS_03,
2535
+ 50: COLOR_LIGHT_SUCCESS_503,
2536
+ 100: COLOR_LIGHT_SUCCESS_1003,
2537
+ 200: COLOR_LIGHT_SUCCESS_2003,
2538
+ 300: COLOR_LIGHT_SUCCESS_3003,
2539
+ 400: COLOR_LIGHT_SUCCESS_4003,
2540
+ 500: COLOR_LIGHT_SUCCESS_5003,
2541
+ 600: COLOR_LIGHT_SUCCESS_6003,
2542
+ 700: COLOR_LIGHT_SUCCESS_7003,
2543
+ 800: COLOR_LIGHT_SUCCESS_8003,
2544
+ 900: COLOR_LIGHT_SUCCESS_9003
2545
+ },
2546
+ highlight: {
2547
+ 0: COLOR_LIGHT_HIGHLIGHT_03,
2548
+ 50: COLOR_LIGHT_HIGHLIGHT_503,
2549
+ 100: COLOR_LIGHT_HIGHLIGHT_1003,
2550
+ 200: COLOR_LIGHT_HIGHLIGHT_2003,
2551
+ 300: COLOR_LIGHT_HIGHLIGHT_3003,
2552
+ 400: COLOR_LIGHT_HIGHLIGHT_4003,
2553
+ 500: COLOR_LIGHT_HIGHLIGHT_5003,
2554
+ 600: COLOR_LIGHT_HIGHLIGHT_6003,
2555
+ 700: COLOR_LIGHT_HIGHLIGHT_7003,
2556
+ 800: COLOR_LIGHT_HIGHLIGHT_8003,
2557
+ 900: COLOR_LIGHT_HIGHLIGHT_9003
2558
+ },
2559
+ neutral: {
2560
+ 0: COLOR_LIGHT_NEUTRAL_03,
2561
+ 50: COLOR_LIGHT_NEUTRAL_503,
2562
+ 100: COLOR_LIGHT_NEUTRAL_1003,
2563
+ 200: COLOR_LIGHT_NEUTRAL_2003,
2564
+ 300: COLOR_LIGHT_NEUTRAL_3003,
2565
+ 400: COLOR_LIGHT_NEUTRAL_4003,
2566
+ 500: COLOR_LIGHT_NEUTRAL_5003,
2567
+ 600: COLOR_LIGHT_NEUTRAL_6003,
2568
+ 700: COLOR_LIGHT_NEUTRAL_7003,
2569
+ 800: COLOR_LIGHT_NEUTRAL_8003,
2570
+ 900: COLOR_LIGHT_NEUTRAL_9003
2571
+ }
2460
2572
  },
2461
2573
  dark: {
2462
- light: ELEVATION_DARK_LIGHT3,
2463
- semilight: ELEVATION_DARK_SEMILIGHT3,
2464
- regular: ELEVATION_DARK_REGULAR3,
2465
- semibold: ELEVATION_DARK_SEMIBOLD3,
2466
- bold: ELEVATION_DARK_BOLD3,
2467
- extrabold: ELEVATION_DARK_EXTRABOLD3,
2468
- none: ELEVATION_NONE
2469
- }
2470
- }
2471
- });
2472
- CosmopolitanTheme2.COSMOPOLITAN_THEME_PALETTES = [
2473
- VARIANT_PRIMARY3,
2474
- VARIANT_SECONDARY3,
2475
- VARIANT_TERTIARY2
2476
- ];
2477
- CosmopolitanTheme2.COSMOPOLITAN_THEME_PALETTE_VARIANTS = [
2478
- "0",
2479
- "50",
2480
- "100",
2481
- "200",
2482
- "300",
2483
- "400",
2484
- "500",
2485
- "600",
2486
- "700",
2487
- "800",
2488
- "900"
2489
- ];
2490
- CosmopolitanTheme2.COSMOPOLITAN_THEME_SCHEMES = [
2491
- "light",
2492
- "dark"
2493
- ];
2494
- CosmopolitanTheme2.COSMOPOLITAN_THEME_SCHEME_VARIANTS = [
2495
- "surface",
2496
- "background",
2497
- "foreground",
2498
- "highlight",
2499
- "middlelight",
2500
- "lowlight",
2501
- "transparent",
2502
- "semiTransparent",
2503
- "disabled",
2504
- "contrast",
2505
- "selection"
2506
- ];
2507
- CosmopolitanTheme2.COSMOPOLITAN_THEME_ELEVATION = [
2508
- "light",
2509
- "dark"
2510
- ];
2511
- CosmopolitanTheme2.COSMOPOLITAN_THEME_ELEVATION_VARIANTS = [
2512
- ELEVATION_KEY_LIGHT3,
2513
- ELEVATION_KEY_SEMILIGHT3,
2514
- ELEVATION_KEY_REGULAR3,
2515
- ELEVATION_KEY_SEMIBOLD3,
2516
- ELEVATION_KEY_BOLD3,
2517
- ELEVATION_KEY_EXTRABOLD3
2518
- ];
2519
- CosmopolitanTheme2.COSMOPOLITAN_THEME_TYPOGRAPHY = [
2520
- TYPOGRAPHY_KEY_HEADLINE13,
2521
- TYPOGRAPHY_KEY_HEADLINE23,
2522
- TYPOGRAPHY_KEY_HEADLINE33,
2523
- TYPOGRAPHY_KEY_HEADLINE43,
2524
- TYPOGRAPHY_KEY_HEADLINE53,
2525
- TYPOGRAPHY_KEY_HEADLINE63,
2526
- TYPOGRAPHY_KEY_BODY13,
2527
- TYPOGRAPHY_KEY_BODY23,
2528
- TYPOGRAPHY_KEY_BUTTON3
2529
- ];
2530
- CosmopolitanTheme2.COSMOPOLITAN_THEME_METADATA = {
2531
- theme: CosmopolitanTheme2.COSMOPOLITAN_THEME,
2532
- palettes: CosmopolitanTheme2.COSMOPOLITAN_THEME_PALETTES,
2533
- paletteVariants: CosmopolitanTheme2.COSMOPOLITAN_THEME_PALETTE_VARIANTS,
2534
- schemes: CosmopolitanTheme2.COSMOPOLITAN_THEME_SCHEMES,
2535
- schemeVariants: CosmopolitanTheme2.COSMOPOLITAN_THEME_SCHEME_VARIANTS,
2536
- elevation: CosmopolitanTheme2.COSMOPOLITAN_THEME_ELEVATION,
2537
- elevationVariants: CosmopolitanTheme2.COSMOPOLITAN_THEME_ELEVATION_VARIANTS,
2538
- typographies: CosmopolitanTheme2.COSMOPOLITAN_THEME_TYPOGRAPHY
2539
- };
2540
- })(CosmopolitanTheme || (CosmopolitanTheme = {}));
2541
- var CosmopolitanTheme;
2542
-
2543
- // src/Theming/Utils/CssAspectRatio.ts
2544
- (function(CssAspectRatio2) {
2545
- function isCssAspectRatio(value) {
2546
- if (typeof value === "string") {
2547
- if (value.trim() === "") {
2548
- return false;
2549
- }
2550
- if (value === "auto") {
2551
- return true;
2552
- }
2553
- const ratioParts = value.split("/");
2554
- if (ratioParts.length === 1) {
2555
- return !isNaN(Number(ratioParts[0])) && Number(ratioParts[0]) >= 0;
2556
- }
2557
- if (ratioParts.length === 2) {
2558
- return !isNaN(Number(ratioParts[0])) && Number(ratioParts[0]) >= 0 && !isNaN(Number(ratioParts[1])) && Number(ratioParts[1]) >= 0;
2574
+ primary: {
2575
+ 0: COLOR_DARK_PRIMARY_03,
2576
+ 50: COLOR_DARK_PRIMARY_503,
2577
+ 100: COLOR_DARK_PRIMARY_1003,
2578
+ 200: COLOR_DARK_PRIMARY_2003,
2579
+ 300: COLOR_DARK_PRIMARY_3003,
2580
+ 400: COLOR_DARK_PRIMARY_4003,
2581
+ 500: COLOR_DARK_PRIMARY_5003,
2582
+ 600: COLOR_DARK_PRIMARY_6003,
2583
+ 700: COLOR_DARK_PRIMARY_7003,
2584
+ 800: COLOR_DARK_PRIMARY_8003,
2585
+ 900: COLOR_DARK_PRIMARY_9003
2586
+ },
2587
+ secondary: {
2588
+ 0: COLOR_DARK_SECONDARY_03,
2589
+ 50: COLOR_DARK_SECONDARY_503,
2590
+ 100: COLOR_DARK_SECONDARY_1003,
2591
+ 200: COLOR_DARK_SECONDARY_2003,
2592
+ 300: COLOR_DARK_SECONDARY_3003,
2593
+ 400: COLOR_DARK_SECONDARY_4003,
2594
+ 500: COLOR_DARK_SECONDARY_5003,
2595
+ 600: COLOR_DARK_SECONDARY_6003,
2596
+ 700: COLOR_DARK_SECONDARY_7003,
2597
+ 800: COLOR_DARK_SECONDARY_8003,
2598
+ 900: COLOR_DARK_SECONDARY_9003
2599
+ },
2600
+ tertiary: {
2601
+ 0: COLOR_DARK_TERTIARY_03,
2602
+ 50: COLOR_DARK_TERTIARY_503,
2603
+ 100: COLOR_DARK_TERTIARY_1003,
2604
+ 200: COLOR_DARK_TERTIARY_2003,
2605
+ 300: COLOR_DARK_TERTIARY_3003,
2606
+ 400: COLOR_DARK_TERTIARY_4003,
2607
+ 500: COLOR_DARK_TERTIARY_5003,
2608
+ 600: COLOR_DARK_TERTIARY_6003,
2609
+ 700: COLOR_DARK_TERTIARY_7003,
2610
+ 800: COLOR_DARK_TERTIARY_8003,
2611
+ 900: COLOR_DARK_TERTIARY_9003
2612
+ },
2613
+ info: {
2614
+ 0: COLOR_DARK_INFO_03,
2615
+ 50: COLOR_DARK_INFO_503,
2616
+ 100: COLOR_DARK_INFO_1003,
2617
+ 200: COLOR_DARK_INFO_2003,
2618
+ 300: COLOR_DARK_INFO_3003,
2619
+ 400: COLOR_DARK_INFO_4003,
2620
+ 500: COLOR_DARK_INFO_5003,
2621
+ 600: COLOR_DARK_INFO_6003,
2622
+ 700: COLOR_DARK_INFO_7003,
2623
+ 800: COLOR_DARK_INFO_8003,
2624
+ 900: COLOR_DARK_INFO_9003
2625
+ },
2626
+ warning: {
2627
+ 0: COLOR_DARK_WARNING_03,
2628
+ 50: COLOR_DARK_WARNING_503,
2629
+ 100: COLOR_DARK_WARNING_1003,
2630
+ 200: COLOR_DARK_WARNING_2003,
2631
+ 300: COLOR_DARK_WARNING_3003,
2632
+ 400: COLOR_DARK_WARNING_4003,
2633
+ 500: COLOR_DARK_WARNING_5003,
2634
+ 600: COLOR_DARK_WARNING_6003,
2635
+ 700: COLOR_DARK_WARNING_7003,
2636
+ 800: COLOR_DARK_WARNING_8003,
2637
+ 900: COLOR_DARK_WARNING_9003
2638
+ },
2639
+ danger: {
2640
+ 0: COLOR_DARK_DANGER_03,
2641
+ 50: COLOR_DARK_DANGER_503,
2642
+ 100: COLOR_DARK_DANGER_1003,
2643
+ 200: COLOR_DARK_DANGER_2003,
2644
+ 300: COLOR_DARK_DANGER_3003,
2645
+ 400: COLOR_DARK_DANGER_4003,
2646
+ 500: COLOR_DARK_DANGER_5003,
2647
+ 600: COLOR_DARK_DANGER_6003,
2648
+ 700: COLOR_DARK_DANGER_7003,
2649
+ 800: COLOR_DARK_DANGER_8003,
2650
+ 900: COLOR_DARK_DANGER_9003
2651
+ },
2652
+ success: {
2653
+ 0: COLOR_DARK_SUCCESS_03,
2654
+ 50: COLOR_DARK_SUCCESS_503,
2655
+ 100: COLOR_DARK_SUCCESS_1003,
2656
+ 200: COLOR_DARK_SUCCESS_2003,
2657
+ 300: COLOR_DARK_SUCCESS_3003,
2658
+ 400: COLOR_DARK_SUCCESS_4003,
2659
+ 500: COLOR_DARK_SUCCESS_5003,
2660
+ 600: COLOR_DARK_SUCCESS_6003,
2661
+ 700: COLOR_DARK_SUCCESS_7003,
2662
+ 800: COLOR_DARK_SUCCESS_8003,
2663
+ 900: COLOR_DARK_SUCCESS_9003
2664
+ },
2665
+ highlight: {
2666
+ 0: COLOR_DARK_HIGHLIGHT_03,
2667
+ 50: COLOR_DARK_HIGHLIGHT_503,
2668
+ 100: COLOR_DARK_HIGHLIGHT_1003,
2669
+ 200: COLOR_DARK_HIGHLIGHT_2003,
2670
+ 300: COLOR_DARK_HIGHLIGHT_3003,
2671
+ 400: COLOR_DARK_HIGHLIGHT_4003,
2672
+ 500: COLOR_DARK_HIGHLIGHT_5003,
2673
+ 600: COLOR_DARK_HIGHLIGHT_6003,
2674
+ 700: COLOR_DARK_HIGHLIGHT_7003,
2675
+ 800: COLOR_DARK_HIGHLIGHT_8003,
2676
+ 900: COLOR_DARK_HIGHLIGHT_9003
2677
+ },
2678
+ neutral: {
2679
+ 0: COLOR_DARK_NEUTRAL_03,
2680
+ 50: COLOR_DARK_NEUTRAL_503,
2681
+ 100: COLOR_DARK_NEUTRAL_1003,
2682
+ 200: COLOR_DARK_NEUTRAL_2003,
2683
+ 300: COLOR_DARK_NEUTRAL_3003,
2684
+ 400: COLOR_DARK_NEUTRAL_4003,
2685
+ 500: COLOR_DARK_NEUTRAL_5003,
2686
+ 600: COLOR_DARK_NEUTRAL_6003,
2687
+ 700: COLOR_DARK_NEUTRAL_7003,
2688
+ 800: COLOR_DARK_NEUTRAL_8003,
2689
+ 900: COLOR_DARK_NEUTRAL_9003
2690
+ }
2559
2691
  }
2560
- }
2561
- return false;
2562
- }
2563
- __name(isCssAspectRatio, "isCssAspectRatio");
2564
- CssAspectRatio2.isCssAspectRatio = isCssAspectRatio;
2565
- })(CssAspectRatio || (CssAspectRatio = {}));
2566
- var CssAspectRatio;
2567
-
2568
- // src/Theming/Utils/CssColor.ts
2569
- (function(CssColor2) {
2570
- function isCssColor(value) {
2571
- if (typeof value !== "string") {
2572
- return false;
2573
- }
2574
- if (value.trim() === "") {
2575
- return false;
2576
- }
2577
- const rgbRegex = /^rgb\(\d{1,3},\s*\d{1,3},\s*\d{1,3}\)$/;
2578
- const rgbaRegex = /^rgba\(\d{1,3},\s*\d{1,3},\s*\d{1,3},\s*(0(\.\d+)?|1(\.0+)?)\)$/;
2579
- const hexRegex = /^#[0-9a-fA-F]{3,6}$/;
2580
- return rgbRegex.test(value) || rgbaRegex.test(value) || hexRegex.test(value);
2581
- }
2582
- __name(isCssColor, "isCssColor");
2583
- CssColor2.isCssColor = isCssColor;
2584
- })(CssColor || (CssColor = {}));
2585
- var CssColor;
2586
-
2587
- // src/Theming/Utils/CssLength.ts
2588
- (function(CssLength2) {
2589
- function isCssLength(value) {
2590
- if (typeof value === "number" || value === "auto") {
2591
- return true;
2592
- }
2593
- if (typeof value !== "string") {
2594
- return false;
2595
- }
2596
- if (value.trim() === "") {
2597
- return false;
2598
- }
2599
- const lengthRegex = /^-?\d+(\.\d+)?(em|ex|ch|rem|vh|vw|vmin|vmax|svw|svh|dvw|dvh|lvw|lvh|px|mm|cm|in|pt|pc|mozmm|%)/;
2600
- return lengthRegex.test(value);
2601
- }
2602
- __name(isCssLength, "isCssLength");
2603
- CssLength2.isCssLength = isCssLength;
2604
- function isAuto(value) {
2605
- return value === "auto";
2606
- }
2607
- __name(isAuto, "isAuto");
2608
- CssLength2.isAuto = isAuto;
2609
- function isPercentage(value) {
2610
- if (typeof value !== "string") {
2611
- return false;
2612
- }
2613
- if (value.trim() === "") {
2614
- return false;
2615
- }
2616
- const percentageRegex = /^-?\d+(\.\d+)?%/;
2617
- return percentageRegex.test(value);
2618
- }
2619
- __name(isPercentage, "isPercentage");
2620
- CssLength2.isPercentage = isPercentage;
2621
- function isLength(value) {
2622
- if (typeof value !== "string") {
2623
- return false;
2624
- }
2625
- if (value.trim() === "") {
2626
- return false;
2627
- }
2628
- const lengthRegex = /^-?\d+(\.\d+)?(em|ex|ch|rem|vh|vw|vmin|vmax|svw|svh|dvw|dvh|lvw|lvh|px|mm|cm|in|pt|pc|mozmm)/;
2629
- return lengthRegex.test(value);
2630
- }
2631
- __name(isLength, "isLength");
2632
- CssLength2.isLength = isLength;
2633
- function toNumber(value) {
2634
- if (typeof value === "number") {
2635
- return value;
2636
- }
2637
- if (value === "auto") {
2638
- throw new Error('Cannot convert "auto" to a number.');
2639
- }
2640
- const match = /^-?\d*\.?\d+/.exec(value);
2641
- if (!match) {
2642
- throw new Error(`Invalid CSS length: ${value}`);
2643
- }
2644
- return parseFloat(match[0]);
2645
- }
2646
- __name(toNumber, "toNumber");
2647
- CssLength2.toNumber = toNumber;
2648
- function toString(value, defaultUnit = "px") {
2649
- if (value === void 0 || value === null) {
2650
- return "";
2651
- }
2652
- if (typeof value === "number") {
2653
- return `${value}${defaultUnit}`;
2654
- }
2655
- return value;
2656
- }
2657
- __name(toString, "toString");
2658
- CssLength2.toString = toString;
2659
- function extractUnit(cssLength) {
2660
- const match = /[a-z%]+$/i.exec(cssLength);
2661
- const lengt = match ? match[0] : null;
2662
- if (lengt === null) {
2663
- throw new Error(`Invalid value: ${cssLength}`);
2664
- }
2665
- return lengt;
2666
- }
2667
- __name(extractUnit, "extractUnit");
2668
- CssLength2.extractUnit = extractUnit;
2669
- function extractValue(cssLength) {
2670
- const match = /^-?\d*\.?\d+/.exec(cssLength);
2671
- const value = match ? parseFloat(match[0]) : null;
2672
- if (value === null) {
2673
- throw new Error(`Invalid value: ${cssLength}`);
2674
- }
2675
- return value;
2676
- }
2677
- __name(extractValue, "extractValue");
2678
- CssLength2.extractValue = extractValue;
2679
- function pxToRem(pixel) {
2680
- const value = extractValue(pixel);
2681
- const baseSize = 16;
2682
- const sizeInRem = `${value / baseSize}rem`;
2683
- return sizeInRem;
2684
- }
2685
- __name(pxToRem, "pxToRem");
2686
- CssLength2.pxToRem = pxToRem;
2687
- function tryParse(value, defaultUnit = "px") {
2688
- if (value === void 0 || value === null) {
2689
- return void 0;
2690
- }
2691
- if (typeof value === "string") {
2692
- if (isLength(value)) {
2693
- return value;
2692
+ },
2693
+ fontFamily: FONT_FAMILY3,
2694
+ typography: {
2695
+ headline1: {
2696
+ fontFamily: TYPOGRAPHY_HEADLINE1_FONT_FAMILY3,
2697
+ fontSize: TYPOGRAPHY_HEADLINE1_FONT_SIZE3,
2698
+ lineHeight: TYPOGRAPHY_HEADLINE1_LINE_HEIGHT3,
2699
+ fontWeight: TYPOGRAPHY_HEADLINE1_FONT_WEIGHT3,
2700
+ letterSpacing: TYPOGRAPHY_HEADLINE1_LETTER_SPACING3,
2701
+ textDecoration: TYPOGRAPHY_HEADLINE1_TEXT_DECORATION3,
2702
+ textTransform: TYPOGRAPHY_HEADLINE1_TEXT_TRANSFORM3
2703
+ },
2704
+ headline2: {
2705
+ fontFamily: TYPOGRAPHY_HEADLINE2_FONT_FAMILY3,
2706
+ fontSize: TYPOGRAPHY_HEADLINE2_FONT_SIZE3,
2707
+ lineHeight: TYPOGRAPHY_HEADLINE2_LINE_HEIGHT3,
2708
+ fontWeight: TYPOGRAPHY_HEADLINE2_FONT_WEIGHT3,
2709
+ letterSpacing: TYPOGRAPHY_HEADLINE2_LETTER_SPACING3,
2710
+ textDecoration: TYPOGRAPHY_HEADLINE2_TEXT_DECORATION3,
2711
+ textTransform: TYPOGRAPHY_HEADLINE2_TEXT_TRANSFORM3
2712
+ },
2713
+ headline3: {
2714
+ fontFamily: TYPOGRAPHY_HEADLINE3_FONT_FAMILY3,
2715
+ fontSize: TYPOGRAPHY_HEADLINE3_FONT_SIZE3,
2716
+ lineHeight: TYPOGRAPHY_HEADLINE3_LINE_HEIGHT3,
2717
+ fontWeight: TYPOGRAPHY_HEADLINE3_FONT_WEIGHT3,
2718
+ letterSpacing: TYPOGRAPHY_HEADLINE3_LETTER_SPACING3,
2719
+ textDecoration: TYPOGRAPHY_HEADLINE3_TEXT_DECORATION3,
2720
+ textTransform: TYPOGRAPHY_HEADLINE3_TEXT_TRANSFORM3
2721
+ },
2722
+ headline4: {
2723
+ fontFamily: TYPOGRAPHY_HEADLINE4_FONT_FAMILY3,
2724
+ fontSize: TYPOGRAPHY_HEADLINE4_FONT_SIZE3,
2725
+ lineHeight: TYPOGRAPHY_HEADLINE4_LINE_HEIGHT3,
2726
+ fontWeight: TYPOGRAPHY_HEADLINE4_FONT_WEIGHT3,
2727
+ letterSpacing: TYPOGRAPHY_HEADLINE4_LETTER_SPACING3,
2728
+ textDecoration: TYPOGRAPHY_HEADLINE4_TEXT_DECORATION3,
2729
+ textTransform: TYPOGRAPHY_HEADLINE4_TEXT_TRANSFORM3
2730
+ },
2731
+ headline5: {
2732
+ fontFamily: TYPOGRAPHY_HEADLINE5_FONT_FAMILY3,
2733
+ fontSize: TYPOGRAPHY_HEADLINE5_FONT_SIZE3,
2734
+ lineHeight: TYPOGRAPHY_HEADLINE5_LINE_HEIGHT3,
2735
+ fontWeight: TYPOGRAPHY_HEADLINE5_FONT_WEIGHT3,
2736
+ letterSpacing: TYPOGRAPHY_HEADLINE5_LETTER_SPACING3,
2737
+ textDecoration: TYPOGRAPHY_HEADLINE5_TEXT_DECORATION3,
2738
+ textTransform: TYPOGRAPHY_HEADLINE5_TEXT_TRANSFORM3
2739
+ },
2740
+ headline6: {
2741
+ fontFamily: TYPOGRAPHY_HEADLINE6_FONT_FAMILY3,
2742
+ fontSize: TYPOGRAPHY_HEADLINE6_FONT_SIZE3,
2743
+ lineHeight: TYPOGRAPHY_HEADLINE6_LINE_HEIGHT3,
2744
+ fontWeight: TYPOGRAPHY_HEADLINE6_FONT_WEIGHT3,
2745
+ letterSpacing: TYPOGRAPHY_HEADLINE6_LETTER_SPACING3,
2746
+ textDecoration: TYPOGRAPHY_HEADLINE6_TEXT_DECORATION3,
2747
+ textTransform: TYPOGRAPHY_HEADLINE6_TEXT_TRANSFORM3
2748
+ },
2749
+ subtitle1: {
2750
+ fontFamily: TYPOGRAPHY_SUBTITLE1_FONT_FAMILY2,
2751
+ fontSize: TYPOGRAPHY_SUBTITLE1_FONT_SIZE2,
2752
+ lineHeight: TYPOGRAPHY_SUBTITLE1_LINE_HEIGHT2,
2753
+ fontWeight: TYPOGRAPHY_SUBTITLE1_FONT_WEIGHT2,
2754
+ letterSpacing: TYPOGRAPHY_SUBTITLE1_LETTER_SPACING2,
2755
+ textDecoration: TYPOGRAPHY_SUBTITLE1_TEXT_DECORATION2,
2756
+ textTransform: TYPOGRAPHY_SUBTITLE1_TEXT_TRANSFORM2
2757
+ },
2758
+ subtitle2: {
2759
+ fontFamily: TYPOGRAPHY_SUBTITLE2_FONT_FAMILY2,
2760
+ fontSize: TYPOGRAPHY_SUBTITLE2_FONT_SIZE2,
2761
+ lineHeight: TYPOGRAPHY_SUBTITLE2_LINE_HEIGHT2,
2762
+ fontWeight: TYPOGRAPHY_SUBTITLE2_FONT_WEIGHT2,
2763
+ letterSpacing: TYPOGRAPHY_SUBTITLE2_LETTER_SPACING2,
2764
+ textDecoration: TYPOGRAPHY_SUBTITLE2_TEXT_DECORATION2,
2765
+ textTransform: TYPOGRAPHY_SUBTITLE2_TEXT_TRANSFORM2
2766
+ },
2767
+ body1: {
2768
+ fontFamily: TYPOGRAPHY_BODY1_FONT_FAMILY3,
2769
+ fontSize: TYPOGRAPHY_BODY1_FONT_SIZE3,
2770
+ lineHeight: TYPOGRAPHY_BODY1_LINE_HEIGHT3,
2771
+ fontWeight: TYPOGRAPHY_BODY1_FONT_WEIGHT3,
2772
+ letterSpacing: TYPOGRAPHY_BODY1_LETTER_SPACING3,
2773
+ textDecoration: TYPOGRAPHY_BODY1_TEXT_DECORATION3,
2774
+ textTransform: TYPOGRAPHY_BODY1_TEXT_TRANSFORM3
2775
+ },
2776
+ body2: {
2777
+ fontFamily: TYPOGRAPHY_BODY2_FONT_FAMILY3,
2778
+ fontSize: TYPOGRAPHY_BODY2_FONT_SIZE3,
2779
+ lineHeight: TYPOGRAPHY_BODY2_LINE_HEIGHT3,
2780
+ fontWeight: TYPOGRAPHY_BODY2_FONT_WEIGHT3,
2781
+ letterSpacing: TYPOGRAPHY_BODY2_LETTER_SPACING3,
2782
+ textDecoration: TYPOGRAPHY_BODY2_TEXT_DECORATION3,
2783
+ textTransform: TYPOGRAPHY_BODY2_TEXT_TRANSFORM3
2784
+ },
2785
+ caption: {
2786
+ fontFamily: TYPOGRAPHY_CAPTION_FONT_FAMILY2,
2787
+ fontSize: TYPOGRAPHY_CAPTION_FONT_SIZE2,
2788
+ lineHeight: TYPOGRAPHY_CAPTION_LINE_HEIGHT2,
2789
+ fontWeight: TYPOGRAPHY_CAPTION_FONT_WEIGHT2,
2790
+ letterSpacing: TYPOGRAPHY_CAPTION_LETTER_SPACING2,
2791
+ textDecoration: TYPOGRAPHY_CAPTION_TEXT_DECORATION2,
2792
+ textTransform: TYPOGRAPHY_CAPTION_TEXT_TRANSFORM2
2793
+ },
2794
+ overline: {
2795
+ fontFamily: TYPOGRAPHY_OVERLINE_FONT_FAMILY2,
2796
+ fontSize: TYPOGRAPHY_OVERLINE_FONT_SIZE2,
2797
+ lineHeight: TYPOGRAPHY_OVERLINE_LINE_HEIGHT2,
2798
+ fontWeight: TYPOGRAPHY_OVERLINE_FONT_WEIGHT2,
2799
+ letterSpacing: TYPOGRAPHY_OVERLINE_LETTER_SPACING2,
2800
+ textDecoration: TYPOGRAPHY_OVERLINE_TEXT_DECORATION2,
2801
+ textTransform: TYPOGRAPHY_OVERLINE_TEXT_TRANSFORM2
2802
+ },
2803
+ button: {
2804
+ fontFamily: TYPOGRAPHY_BUTTON_FONT_FAMILY3,
2805
+ fontSize: TYPOGRAPHY_BUTTON_FONT_SIZE3,
2806
+ lineHeight: TYPOGRAPHY_BUTTON_LINE_HEIGHT3,
2807
+ fontWeight: TYPOGRAPHY_BUTTON_FONT_WEIGHT3,
2808
+ letterSpacing: TYPOGRAPHY_BUTTON_LETTER_SPACING3,
2809
+ textDecoration: TYPOGRAPHY_BUTTON_TEXT_DECORATION3,
2810
+ textTransform: TYPOGRAPHY_BUTTON_TEXT_TRANSFORM3
2694
2811
  }
2695
- if (value.trim() === "") {
2696
- return void 0;
2812
+ },
2813
+ layout: {
2814
+ radius: LAYOUT_RADIUS3,
2815
+ space: LAYOUT_SPACE3,
2816
+ thickness: LAYOUT_THICKNESS3
2817
+ },
2818
+ elevation: {
2819
+ light: {
2820
+ light: ELEVATION_LIGHT_LIGHT3,
2821
+ semilight: ELEVATION_LIGHT_SEMILIGHT3,
2822
+ regular: ELEVATION_LIGHT_REGULAR3,
2823
+ semibold: ELEVATION_LIGHT_SEMIBOLD3,
2824
+ bold: ELEVATION_LIGHT_BOLD3,
2825
+ extrabold: ELEVATION_LIGHT_EXTRABOLD3
2826
+ },
2827
+ dark: {
2828
+ light: ELEVATION_DARK_LIGHT3,
2829
+ semilight: ELEVATION_DARK_SEMILIGHT3,
2830
+ regular: ELEVATION_DARK_REGULAR3,
2831
+ semibold: ELEVATION_DARK_SEMIBOLD3,
2832
+ bold: ELEVATION_DARK_BOLD3,
2833
+ extrabold: ELEVATION_DARK_EXTRABOLD3
2697
2834
  }
2698
- const num = parseFloat(value);
2699
- return isNaN(num) ? void 0 : `${num}${defaultUnit}`;
2700
- }
2701
- if (typeof value === "number") {
2702
- return `${String(value)}${defaultUnit}`;
2703
- }
2704
- return void 0;
2705
- }
2706
- __name(tryParse, "tryParse");
2707
- CssLength2.tryParse = tryParse;
2708
- })(CssLength || (CssLength = {}));
2709
- var CssLength;
2710
-
2711
- // src/Theming/Utils/CssShadow.ts
2712
- (function(CssShadow2) {
2713
- function isCssShadow(value) {
2714
- if (typeof value !== "string") {
2715
- return false;
2716
- }
2717
- if (value.trim() === "") {
2718
- return false;
2719
- }
2720
- if (value === "none") {
2721
- return true;
2722
- }
2723
- const shadows = value.split(/\s*,\s*/);
2724
- return shadows.every(isCssShadowSingle);
2725
- }
2726
- __name(isCssShadow, "isCssShadow");
2727
- CssShadow2.isCssShadow = isCssShadow;
2728
- function isCssShadowSingle(value) {
2729
- const shadowRegex = new RegExp("^(inset\\s+)?(-?\\d+(\\.\\d+)?(px|em|rem|vh|vw|%)?)\\s+(-?\\d+(\\.\\d+)?(px|em|rem|vh|vw|%)?)\\s+(-?\\d+(\\.\\d+)?(px|em|rem|vh|vw|%)?)?\\s*(-?\\d+(\\.\\d+)?(px|em|rem|vh|vw|%)?)?\\s*(rgba?\\(\\d{1,3},\\s*\\d{1,3},\\s*\\d{1,3}(,\\s*(0|1|0?\\.\\d+))?\\)|#[0-9a-fA-F]{3,6})$", "i");
2730
- return shadowRegex.test(value);
2731
- }
2732
- __name(isCssShadowSingle, "isCssShadowSingle");
2733
- })(CssShadow || (CssShadow = {}));
2734
- var CssShadow;
2735
-
2736
- // src/Theming/Utils/CssTime.ts
2737
- (function(CssTime2) {
2738
- function isCssTime(value) {
2739
- if (typeof value === "number" || value === 0) {
2740
- return true;
2741
- }
2742
- if (typeof value !== "string") {
2743
- return false;
2744
- }
2745
- if (value.trim() === "") {
2746
- return false;
2747
2835
  }
2748
- const timeRegex = /^-?\d+(\.\d+)?(s|ms)/;
2749
- return timeRegex.test(value);
2750
- }
2751
- __name(isCssTime, "isCssTime");
2752
- CssTime2.isCssTime = isCssTime;
2753
- })(CssTime || (CssTime = {}));
2754
- var CssTime;
2755
-
2756
- // src/Theming/Utils/ThemePalette.ts
2757
- (function(ThemePalette2) {
2758
- const THEME_SHADE_NAMES = [
2759
- "0",
2760
- "50",
2761
- "100",
2762
- "200",
2763
- "300",
2764
- "400",
2765
- "500",
2766
- "600",
2767
- "700",
2768
- "800",
2769
- "900"
2836
+ });
2837
+ MemphisTheme2.MEMPHIS_THEME_PALETTES = [
2838
+ VARIANT_PRIMARY3,
2839
+ VARIANT_SECONDARY3,
2840
+ VARIANT_DANGER2,
2841
+ VARIANT_INFO2,
2842
+ VARIANT_NEUTRAL2,
2843
+ VARIANT_SUCCESS2,
2844
+ VARIANT_WARNING2
2770
2845
  ];
2771
- function isThemeShadeName(value) {
2772
- return THEME_SHADE_NAMES.includes(value);
2773
- }
2774
- __name(isThemeShadeName, "isThemeShadeName");
2775
- function isThemePalette(value) {
2776
- if (typeof value !== "object" || value === null) {
2777
- return false;
2778
- }
2779
- return Object.keys(value).every((key) => isThemeShadeName(key) && typeof value[key] === "string");
2780
- }
2781
- __name(isThemePalette, "isThemePalette");
2782
- ThemePalette2.isThemePalette = isThemePalette;
2783
- })(ThemePalette || (ThemePalette = {}));
2784
- var ThemePalette;
2785
-
2786
- // src/Theming/Utils/ITheme.ts
2787
- (function(ITheme2) {
2788
- function getScheme(theme, mode) {
2789
- return theme.scheme[mode];
2790
- }
2791
- __name(getScheme, "getScheme");
2792
- ITheme2.getScheme = getScheme;
2793
- function getPalette(theme, mode, semanticColor) {
2794
- const paletteEntry = theme.palette[mode][semanticColor];
2795
- if (!ThemePalette.isThemePalette(paletteEntry)) {
2796
- throw new Error(`Palette '${semanticColor}' is not a valid theme palette for mode '${mode}'.`);
2797
- }
2798
- return paletteEntry;
2799
- }
2800
- __name(getPalette, "getPalette");
2801
- ITheme2.getPalette = getPalette;
2802
- function getSchemeColor(theme, mode, role) {
2803
- const scheme = theme.scheme[mode];
2804
- const color = scheme[role];
2805
- if (typeof color !== "string") {
2806
- throw new Error(`Scheme color '${role}' is not defined for mode '${mode}'.`);
2807
- }
2808
- return color;
2809
- }
2810
- __name(getSchemeColor, "getSchemeColor");
2811
- ITheme2.getSchemeColor = getSchemeColor;
2812
- function getPaletteColor(theme, mode, semanticColor, shade) {
2813
- const palette = getPalette(theme, mode, semanticColor);
2814
- const color = palette[shade];
2815
- if (typeof color !== "string") {
2816
- throw new Error(`Shade '${shade}' is not defined in palette '${semanticColor}' for mode '${mode}'.`);
2817
- }
2818
- return color;
2819
- }
2820
- __name(getPaletteColor, "getPaletteColor");
2821
- ITheme2.getPaletteColor = getPaletteColor;
2822
- function getElevationShadow(theme, mode, key) {
2823
- return theme.elevation[mode][key];
2824
- }
2825
- __name(getElevationShadow, "getElevationShadow");
2826
- ITheme2.getElevationShadow = getElevationShadow;
2827
- })(ITheme || (ITheme = {}));
2828
- var ITheme;
2829
-
2830
- // src/Theming/Utils/ThemeScheme.ts
2831
- (function(ThemeScheme2) {
2832
- const ROLES = [
2846
+ MemphisTheme2.MEMPHIS_THEME_PALETTE_VARIANTS = [
2847
+ "0",
2848
+ "50",
2849
+ "100",
2850
+ "200",
2851
+ "300",
2852
+ "400",
2853
+ "500",
2854
+ "600",
2855
+ "700",
2856
+ "800",
2857
+ "900"
2858
+ ];
2859
+ MemphisTheme2.MEMPHIS_THEME_SCHEMES = [
2860
+ "light",
2861
+ "dark"
2862
+ ];
2863
+ MemphisTheme2.MEMPHIS_THEME_SCHEME_VARIANTS = [
2833
2864
  "surface",
2834
2865
  "background",
2835
2866
  "foreground",
@@ -2842,254 +2873,218 @@ var ITheme;
2842
2873
  "contrast",
2843
2874
  "selection"
2844
2875
  ];
2845
- function isRole(value) {
2846
- return ROLES.includes(value);
2847
- }
2848
- __name(isRole, "isRole");
2849
- function isThemeScheme(value) {
2850
- if (typeof value !== "object" || value === null) {
2851
- return false;
2852
- }
2853
- return Object.entries(value).every(([key, color]) => isRole(key) && typeof color === "string");
2854
- }
2855
- __name(isThemeScheme, "isThemeScheme");
2856
- ThemeScheme2.isThemeScheme = isThemeScheme;
2857
- })(ThemeScheme || (ThemeScheme = {}));
2858
- var ThemeScheme;
2859
-
2860
- // src/Theming/Utils/ThemeMode.ts
2861
- var THEME_MODES = [
2862
- "dark",
2863
- "light"
2864
- ];
2865
-
2866
- // src/Theming/Adapters/BrowserPlatformAdapter.ts
2867
- var BrowserPlatformAdapter = class {
2868
- static {
2869
- __name(this, "BrowserPlatformAdapter");
2870
- }
2871
- // #region Methods
2872
- matchMedia(query) {
2873
- return window.matchMedia(query).matches;
2874
- }
2875
- setDocumentAttribute(name, value) {
2876
- document.documentElement.setAttribute(name, value);
2877
- }
2878
- getDocumentAttribute(name) {
2879
- return document.documentElement.getAttribute(name);
2880
- }
2881
- observeDocumentAttributes(attributes, callback) {
2882
- const observer = new MutationObserver((mutations) => {
2883
- mutations.forEach((mutation) => {
2884
- if (mutation.type === "attributes" && mutation.attributeName) {
2885
- const newValue = document.documentElement.getAttribute(mutation.attributeName);
2886
- callback(mutation.attributeName, newValue);
2887
- }
2888
- });
2889
- });
2890
- observer.observe(document.documentElement, {
2891
- attributes: true,
2892
- attributeFilter: attributes
2893
- });
2894
- return () => observer.disconnect();
2895
- }
2896
- };
2897
-
2898
- // src/Theming/Adapters/NodePlatformAdapter.ts
2899
- var NodePlatformAdapter = class {
2900
- static {
2901
- __name(this, "NodePlatformAdapter");
2902
- }
2903
- // #region Methods
2904
- matchMedia(_query) {
2905
- return false;
2906
- }
2907
- setDocumentAttribute(_name, _value) {
2908
- }
2909
- getDocumentAttribute(_name) {
2910
- return null;
2911
- }
2912
- observeDocumentAttributes(_attributes, _callback) {
2913
- return () => {
2914
- };
2915
- }
2916
- };
2917
-
2918
- // src/Theming/Adapters/PlatformAdapterFactory.ts
2919
- var PlatformAdapterFactory = class {
2876
+ MemphisTheme2.MEMPHIS_THEME_ELEVATION = [
2877
+ "light",
2878
+ "dark"
2879
+ ];
2880
+ MemphisTheme2.MEMPHIS_THEME_ELEVATION_VARIANTS = [
2881
+ ELEVATION_KEY_LIGHT3,
2882
+ ELEVATION_KEY_SEMILIGHT3,
2883
+ ELEVATION_KEY_REGULAR3,
2884
+ ELEVATION_KEY_SEMIBOLD3,
2885
+ ELEVATION_KEY_BOLD3,
2886
+ ELEVATION_KEY_EXTRABOLD3
2887
+ ];
2888
+ MemphisTheme2.MEMPHIS_THEME_TYPOGRAPHY = [
2889
+ TYPOGRAPHY_KEY_HEADLINE13,
2890
+ TYPOGRAPHY_KEY_HEADLINE23,
2891
+ TYPOGRAPHY_KEY_HEADLINE33,
2892
+ TYPOGRAPHY_KEY_HEADLINE43,
2893
+ TYPOGRAPHY_KEY_HEADLINE53,
2894
+ TYPOGRAPHY_KEY_HEADLINE63,
2895
+ TYPOGRAPHY_KEY_SUBTITLE12,
2896
+ TYPOGRAPHY_KEY_SUBTITLE22,
2897
+ TYPOGRAPHY_KEY_BODY13,
2898
+ TYPOGRAPHY_KEY_BODY23,
2899
+ TYPOGRAPHY_KEY_CAPTION2,
2900
+ TYPOGRAPHY_KEY_OVERLINE2,
2901
+ TYPOGRAPHY_KEY_BUTTON3
2902
+ ];
2903
+ MemphisTheme2.MEMPHIS_THEME_METADATA = {
2904
+ theme: MemphisTheme2.MEMPHIS_THEME,
2905
+ palettes: MemphisTheme2.MEMPHIS_THEME_PALETTES,
2906
+ paletteVariants: MemphisTheme2.MEMPHIS_THEME_PALETTE_VARIANTS,
2907
+ schemes: MemphisTheme2.MEMPHIS_THEME_SCHEMES,
2908
+ schemeVariants: MemphisTheme2.MEMPHIS_THEME_SCHEME_VARIANTS,
2909
+ elevation: MemphisTheme2.MEMPHIS_THEME_ELEVATION,
2910
+ elevationVariants: MemphisTheme2.MEMPHIS_THEME_ELEVATION_VARIANTS,
2911
+ typographies: MemphisTheme2.MEMPHIS_THEME_TYPOGRAPHY
2912
+ };
2913
+ })(MemphisTheme || (MemphisTheme = {}));
2914
+ var MemphisTheme;
2915
+ var HslThemeGeneratorStrategy = class _HslThemeGeneratorStrategy {
2920
2916
  static {
2921
- __name(this, "PlatformAdapterFactory");
2917
+ __name(this, "HslThemeGeneratorStrategy");
2922
2918
  }
2919
+ // #region Fields
2920
+ static _LIGHTNESS_THRESHOLD = 0.5;
2921
+ // #endregion
2923
2922
  // #region Methods
2924
2923
  /**
2925
- * Creates the appropriate platform adapter based on the current environment.
2926
- * Automatically detects if running in browser or Node.js.
2924
+ * Determines whether a color naturally belongs to the given mode's HSL lightness range.
2927
2925
  *
2928
- * @public
2929
- */
2930
- static create() {
2931
- if (typeof window !== "undefined" && typeof document !== "undefined") {
2932
- return new BrowserPlatformAdapter();
2933
- }
2934
- return new NodePlatformAdapter();
2935
- }
2936
- };
2937
-
2938
- // src/Theming/ThemeObserver.ts
2939
- function isThemeMode(value) {
2940
- return value === "system" || value === "dark" || value === "light";
2941
- }
2942
- __name(isThemeMode, "isThemeMode");
2943
- var ThemeObserver = class {
2944
- static {
2945
- __name(this, "ThemeObserver");
2946
- }
2947
- // #region Fields
2948
- _themeChanged;
2949
- _themeModeChanged;
2950
- _platformAdapter;
2951
- _currentTheme;
2952
- _currentThemeMode;
2953
- _unsubscribe;
2954
- // #region Ctor
2955
- /**
2956
- * Constructs a new instance of the `ThemeObserver` class.
2926
+ * @remarks
2927
+ * A color with HSL lightness > 0.5 is considered "light"; ≤ 0.5 is considered "dark".
2957
2928
  *
2958
- * @param platformAdapter - Optional platform adapter. Auto-detects if not provided.
2959
2929
  * @public
2930
+ * @param color - The color to check
2931
+ * @param mode - The target color mode ('dark' | 'light')
2932
+ * @returns `true` if the color is naturally compatible with the given mode
2960
2933
  */
2961
- constructor(platformAdapter) {
2962
- this._themeChanged = new PureEventEmitter();
2963
- this._themeModeChanged = new PureEventEmitter();
2964
- this._platformAdapter = platformAdapter ?? PlatformAdapterFactory.create();
2965
- this._currentTheme = null;
2966
- this._currentThemeMode = null;
2967
- this.observe({
2968
- themeChange: /* @__PURE__ */ __name((theme) => this._themeChanged.emit(theme), "themeChange"),
2969
- themeModeChange: /* @__PURE__ */ __name((themeMode) => this._themeModeChanged.emit(themeMode), "themeModeChange")
2970
- });
2934
+ isColorInModeSpectrum(color, mode) {
2935
+ const [, , l] = chroma7(color).hsl();
2936
+ return mode === "light" ? l > _HslThemeGeneratorStrategy._LIGHTNESS_THRESHOLD : l <= _HslThemeGeneratorStrategy._LIGHTNESS_THRESHOLD;
2971
2937
  }
2972
- // #endregion
2973
- // #region Properties
2974
2938
  /**
2975
- * Fires when the theme changes.
2939
+ * Adapts a color to the opposite mode by symmetrically inverting its HSL lightness
2940
+ * (`L → 1 - L`) while preserving hue and saturation.
2976
2941
  *
2977
- * @public
2978
- * @readonly
2979
- */
2980
- get themeChanged() {
2981
- return this._themeChanged;
2982
- }
2983
- /**
2984
- * Fires when the theme mode changes.
2942
+ * @remarks
2943
+ * The inversion is symmetric: a light color becomes dark and vice-versa, regardless
2944
+ * of the direction. Therefore no target mode parameter is required.
2945
+ *
2946
+ * The inverted lightness is clamped to [0.05, 0.95] to avoid pure black / pure white.
2947
+ * Subclasses may override this method for theme-specific post-processing.
2985
2948
  *
2986
2949
  * @public
2987
- * @readonly
2950
+ * @param color - The color to adapt
2951
+ * @returns The adapted color with inverted lightness
2988
2952
  */
2989
- get themeModeChanged() {
2990
- return this._themeModeChanged;
2953
+ adaptColorToMode(color) {
2954
+ const c = chroma7(color);
2955
+ const [h, s, l] = c.hsl();
2956
+ const invertedL = Math.min(Math.max(1 - l, 0.05), 0.95);
2957
+ return chroma7.hsl(isNaN(h) ? 0 : h, s, invertedL).hex();
2991
2958
  }
2992
- // #endregion
2993
- // #region Methods
2994
2959
  /**
2995
- * Applies the given theme and theme mode to the document.
2960
+ * Generates a palette of shades based on a base/accent color using HSL interpolation.
2996
2961
  *
2997
2962
  * @public
2998
- * @param theme - The theme to apply (joy, cosmopolitan or memphis).
2999
- * @param themeMode - The theme mode to apply.
2963
+ * @param baseColor - The base/accent color (e.g. "#3498db")
2964
+ * @param mode - 'light' or 'dark' mode: determines how light or dark the palette extremes are.
2965
+ * @returns The generated theme palette with shade steps 0–900
3000
2966
  */
3001
- applyTheme(theme, themeMode) {
3002
- this._platformAdapter.setDocumentAttribute("theme", theme);
3003
- switch (themeMode) {
3004
- case "dark":
3005
- case "light":
3006
- this._platformAdapter.setDocumentAttribute("theme-mode", themeMode);
3007
- break;
3008
- case "system":
3009
- default:
3010
- const isDark = this._platformAdapter.matchMedia("(prefers-color-scheme: dark)");
3011
- this._platformAdapter.setDocumentAttribute("theme-mode", isDark ? "dark" : "light");
3012
- break;
3013
- }
3014
- }
3015
- dispose() {
3016
- if (this._unsubscribe) {
3017
- this._unsubscribe();
3018
- this._unsubscribe = void 0;
3019
- }
3020
- }
3021
- observe(cb) {
3022
- this._currentTheme = this._platformAdapter.getDocumentAttribute("theme");
3023
- this._currentThemeMode = this._platformAdapter.getDocumentAttribute("theme-mode");
3024
- this._unsubscribe = this._platformAdapter.observeDocumentAttributes([
3025
- "theme",
3026
- "theme-mode"
3027
- ], (attributeName, newValue) => {
3028
- if (attributeName === "theme" && newValue) {
3029
- const theme = newValue;
3030
- if (this._currentTheme !== theme) {
3031
- this._currentTheme = theme;
3032
- cb.themeChange(theme);
3033
- }
3034
- }
3035
- if (attributeName === "theme-mode") {
3036
- const themeMode = newValue;
3037
- if (!isThemeMode(themeMode)) {
3038
- throw new Error(`Invalid theme mode: ${String(themeMode)}`);
3039
- }
3040
- if (this._currentThemeMode !== themeMode) {
3041
- this._currentThemeMode = themeMode;
3042
- cb.themeModeChange(themeMode);
3043
- }
3044
- }
2967
+ generatePalette(baseColor, mode) {
2968
+ const steps = [
2969
+ 0,
2970
+ 50,
2971
+ 100,
2972
+ 200,
2973
+ 300,
2974
+ 400,
2975
+ 500,
2976
+ 600,
2977
+ 700,
2978
+ 800,
2979
+ 900
2980
+ ];
2981
+ const base = chroma7(baseColor);
2982
+ const [h, s] = base.hsl();
2983
+ const palette = {};
2984
+ steps.forEach((step, idx) => {
2985
+ const t = idx / (steps.length - 1);
2986
+ const lightness = mode === "light" ? 0.95 - t * 0.6 : 0.15 + t * 0.6;
2987
+ const col = chroma7.hsl(h, s, lightness);
2988
+ palette[step.toString()] = col.hex();
3045
2989
  });
2990
+ return {
2991
+ "0": palette["0"],
2992
+ "50": palette["50"],
2993
+ "100": palette["100"],
2994
+ "200": palette["200"],
2995
+ "300": palette["300"],
2996
+ "400": palette["400"],
2997
+ "500": palette["500"],
2998
+ "600": palette["600"],
2999
+ "700": palette["700"],
3000
+ "800": palette["800"],
3001
+ "900": palette["900"]
3002
+ };
3003
+ }
3004
+ /**
3005
+ * Generates a semantic color scheme for UI usage, based on the generated palette.
3006
+ *
3007
+ * @public
3008
+ * @param baseColor - The base/accent color
3009
+ * @param mode - 'light' or 'dark'
3010
+ * @returns The generated theme scheme with semantic color roles
3011
+ */
3012
+ generateScheme(baseColor, mode) {
3013
+ const p = this.generatePalette(baseColor, mode);
3014
+ return {
3015
+ background: p["50"],
3016
+ foreground: p["900"],
3017
+ disabled: p["300"],
3018
+ contrast: p["900"],
3019
+ highlight: p["700"],
3020
+ lowlight: p["300"],
3021
+ middlelight: p["500"],
3022
+ selection: p["500"],
3023
+ semiTransparent: chroma7(p["500"]).alpha(0.5).hex(),
3024
+ surface: p["50"],
3025
+ transparent: chroma7(p["500"]).alpha(0).hex()
3026
+ };
3046
3027
  }
3047
3028
  };
3048
- var ThemeObserverServiceLocator = class _ThemeObserverServiceLocator {
3029
+ var LchThemeGeneratorStrategy = class _LchThemeGeneratorStrategy {
3049
3030
  static {
3050
- __name(this, "ThemeObserverServiceLocator");
3031
+ __name(this, "LchThemeGeneratorStrategy");
3051
3032
  }
3052
3033
  // #region Fields
3053
- static _current = null;
3054
- // #endregion
3055
- // #region Properties
3056
- static get current() {
3057
- if (!_ThemeObserverServiceLocator.isSet()) {
3058
- throw new Error("'ThemeObserver' not set.");
3059
- }
3060
- return _ThemeObserverServiceLocator._current;
3061
- }
3034
+ static _LUMINANCE_THRESHOLD = 0.5;
3062
3035
  // #endregion
3063
3036
  // #region Methods
3064
- static isSet() {
3065
- return _ThemeObserverServiceLocator._current !== null;
3066
- }
3067
- static set(current) {
3068
- _ThemeObserverServiceLocator._current = current;
3069
- }
3070
- };
3071
- ThemeObserverServiceLocator.set(new ThemeObserver());
3072
- var MaterialThemeGeneratorStrategy = class {
3073
- static {
3074
- __name(this, "MaterialThemeGeneratorStrategy");
3037
+ /**
3038
+ * Determines whether a color naturally belongs to the given mode's luminance range.
3039
+ *
3040
+ * @remarks
3041
+ * Uses WCAG relative luminance (0 = black, 1 = white).
3042
+ * A color with luminance > 0.5 is considered "light"; ≤ 0.5 is considered "dark".
3043
+ *
3044
+ * @public
3045
+ * @param color - The color to check
3046
+ * @param mode - The target color mode ('dark' | 'light')
3047
+ * @returns `true` if the color is naturally compatible with the given mode
3048
+ */
3049
+ isColorInModeSpectrum(color, mode) {
3050
+ const luminance = chroma7(color).luminance();
3051
+ return mode === "light" ? luminance > _LchThemeGeneratorStrategy._LUMINANCE_THRESHOLD : luminance <= _LchThemeGeneratorStrategy._LUMINANCE_THRESHOLD;
3075
3052
  }
3076
- // #region Ctor
3077
- constructor() {
3053
+ /**
3054
+ * Adapts a color to the opposite mode by symmetrically inverting its perceptual
3055
+ * lightness in the LCH color space (`L* → 100 - L*`) while preserving hue and chroma.
3056
+ *
3057
+ * @remarks
3058
+ * The inversion is symmetric: a light color becomes dark and vice-versa, regardless
3059
+ * of the direction. Therefore no target mode parameter is required.
3060
+ *
3061
+ * The inverted lightness is clamped to [5, 95] to avoid pure black / pure white,
3062
+ * which cannot carry chromatic information.
3063
+ * Subclasses may override this method to apply theme-specific post-processing
3064
+ * (e.g., chroma reduction for muted palettes).
3065
+ *
3066
+ * @public
3067
+ * @param color - The color to adapt
3068
+ * @returns The adapted color with inverted lightness
3069
+ */
3070
+ adaptColorToMode(color) {
3071
+ const c = chroma7(color);
3072
+ const [l, chromaVal, h] = c.lch();
3073
+ const invertedL = Math.min(Math.max(100 - l, 5), 95);
3074
+ return chroma7.lch(invertedL, chromaVal, isNaN(h) ? 0 : h).hex();
3078
3075
  }
3079
- // #endregion
3080
- // #region Methods
3081
3076
  /**
3082
- * Generates a color palette for the Material theme.
3077
+ * Generates a color palette from a base color for the given mode.
3083
3078
  *
3084
3079
  * @public
3085
- * @param baseColor The base/accent color.
3086
- * @param mode 'light' or 'dark' mode.
3087
- * @returns The generated theme palette.
3080
+ * @param baseColor - The base/accent color
3081
+ * @param mode - 'light' or 'dark' mode
3082
+ * @returns The generated theme palette with shade steps 0–900
3088
3083
  */
3089
3084
  generatePalette(baseColor, mode) {
3090
3085
  if (mode === "light") {
3091
- const baseLight2 = chroma("#ffffff");
3092
- const baseDark2 = chroma("#000000");
3086
+ const baseLight2 = chroma7("#ffffff");
3087
+ const baseDark2 = chroma7("#000000");
3093
3088
  const palette2 = {};
3094
3089
  const steps2 = [
3095
3090
  0,
@@ -3119,12 +3114,24 @@ var MaterialThemeGeneratorStrategy = class {
3119
3114
  ];
3120
3115
  steps2.forEach((step, i) => {
3121
3116
  const base = step <= 500 ? baseLight2 : baseDark2;
3122
- palette2[`${step}`] = chroma.mix(base, baseColor, amounts2[i] / 100, "rgb").hex();
3117
+ palette2[`${step}`] = chroma7.mix(base, baseColor, amounts2[i] / 100, "rgb").hex();
3123
3118
  });
3124
- return palette2;
3119
+ return {
3120
+ "0": palette2["0"],
3121
+ "50": palette2["50"],
3122
+ "100": palette2["100"],
3123
+ "200": palette2["200"],
3124
+ "300": palette2["300"],
3125
+ "400": palette2["400"],
3126
+ "500": palette2["500"],
3127
+ "600": palette2["600"],
3128
+ "700": palette2["700"],
3129
+ "800": palette2["800"],
3130
+ "900": palette2["900"]
3131
+ };
3125
3132
  }
3126
- const baseLight = chroma("#ffffff");
3127
- const baseDark = chroma("#000000");
3133
+ const baseLight = chroma7("#ffffff");
3134
+ const baseDark = chroma7("#000000");
3128
3135
  const palette = {};
3129
3136
  const steps = [
3130
3137
  0,
@@ -3154,30 +3161,42 @@ var MaterialThemeGeneratorStrategy = class {
3154
3161
  ];
3155
3162
  steps.forEach((step, i) => {
3156
3163
  const base = step <= 600 ? baseDark : baseLight;
3157
- palette[`${step}`] = chroma.mix(base, baseColor, amounts[i] / 100, "rgb").hex();
3164
+ palette[`${step}`] = chroma7.mix(base, baseColor, amounts[i] / 100, "rgb").hex();
3158
3165
  });
3159
- return palette;
3166
+ return {
3167
+ "0": palette["0"],
3168
+ "50": palette["50"],
3169
+ "100": palette["100"],
3170
+ "200": palette["200"],
3171
+ "300": palette["300"],
3172
+ "400": palette["400"],
3173
+ "500": palette["500"],
3174
+ "600": palette["600"],
3175
+ "700": palette["700"],
3176
+ "800": palette["800"],
3177
+ "900": palette["900"]
3178
+ };
3160
3179
  }
3161
3180
  /**
3162
- * Generates a semantic color scheme for Material theme usage, based on the generated palette.
3181
+ * Generates a semantic color scheme based on a base color and mode.
3163
3182
  *
3164
3183
  * @public
3165
- * @param baseColor The base/accent color.
3166
- * @param mode 'light' or 'dark' mode.
3167
- * @returns The generated theme scheme.
3184
+ * @param baseColor - The base/accent color
3185
+ * @param mode - 'light' or 'dark' mode
3186
+ * @returns The generated theme scheme with semantic color roles
3168
3187
  */
3169
3188
  generateScheme(baseColor, mode) {
3170
- const baseChroma = chroma(baseColor);
3189
+ const baseChroma = chroma7(baseColor);
3171
3190
  const baseLuminance = baseChroma.luminance();
3172
3191
  const adjustColor = /* @__PURE__ */ __name((color, amount, minLuminance = 0.02, maxLuminance = 0.98) => {
3173
- const c = chroma(color);
3192
+ const c = chroma7(color);
3174
3193
  const factor = Math.abs(amount) / 25.5;
3175
3194
  let result = amount > 0 ? c.brighten(factor) : c.darken(factor);
3176
3195
  const resultLuminance = result.luminance();
3177
3196
  if (resultLuminance < minLuminance) {
3178
- result = chroma(result).luminance(minLuminance);
3197
+ result = chroma7(result).luminance(minLuminance);
3179
3198
  } else if (resultLuminance > maxLuminance) {
3180
- result = chroma(result).luminance(maxLuminance);
3199
+ result = chroma7(result).luminance(maxLuminance);
3181
3200
  }
3182
3201
  return result.hex();
3183
3202
  }, "adjustColor");
@@ -3185,11 +3204,11 @@ var MaterialThemeGeneratorStrategy = class {
3185
3204
  if (mode === "light") {
3186
3205
  const darkened = baseChroma.darken(4).saturate(-0.3);
3187
3206
  const targetLuminance2 = Math.min(darkened.luminance(), 0.08);
3188
- return chroma(darkened).luminance(targetLuminance2).hex();
3207
+ return chroma7(darkened).luminance(targetLuminance2).hex();
3189
3208
  }
3190
3209
  const lightened = baseChroma.brighten(4).saturate(-0.3);
3191
3210
  const targetLuminance = Math.max(lightened.luminance(), 0.85);
3192
- return chroma(lightened).luminance(targetLuminance).hex();
3211
+ return chroma7(lightened).luminance(targetLuminance).hex();
3193
3212
  }, "generateForeground");
3194
3213
  const generateSurface = /* @__PURE__ */ __name(() => {
3195
3214
  if (mode === "light") {
@@ -3202,7 +3221,7 @@ var MaterialThemeGeneratorStrategy = class {
3202
3221
  const generateLowlight = /* @__PURE__ */ __name(() => mode === "light" ? adjustColor(baseColor, -50, 0.15, 0.85) : adjustColor(baseColor, 55, 0.15, 0.85), "generateLowlight");
3203
3222
  const generateDisabled = /* @__PURE__ */ __name(() => {
3204
3223
  const desaturated = baseChroma.desaturate(2);
3205
- return mode === "light" ? chroma(desaturated).darken(0.5).hex() : chroma(desaturated).brighten(0.5).hex();
3224
+ return mode === "light" ? chroma7(desaturated).darken(0.5).hex() : chroma7(desaturated).brighten(0.5).hex();
3206
3225
  }, "generateDisabled");
3207
3226
  const foreground = generateForeground();
3208
3227
  return {
@@ -3213,38 +3232,95 @@ var MaterialThemeGeneratorStrategy = class {
3213
3232
  middlelight: generateMiddlelight(),
3214
3233
  lowlight: generateLowlight(),
3215
3234
  transparent: `${baseColor}00`,
3216
- semiTransparent: chroma(baseColor).alpha(0.67).hex(),
3235
+ semiTransparent: chroma7(baseColor).alpha(0.67).hex(),
3217
3236
  disabled: generateDisabled(),
3218
3237
  contrast: foreground,
3219
3238
  selection: generateHighlight()
3220
3239
  };
3221
3240
  }
3222
3241
  };
3223
- function createMaterialTheme() {
3224
- const strategy = new MaterialThemeGeneratorStrategy();
3225
- return () => strategy;
3226
- }
3227
- __name(createMaterialTheme, "createMaterialTheme");
3228
-
3229
- // src/Theming/Strategies/surface/JoyThemeGeneratorStrategy.ts
3230
- var JoyThemeGeneratorStrategy = class {
3242
+ var CosmopolitanThemeGeneratorStrategy = class _CosmopolitanThemeGeneratorStrategy extends LchThemeGeneratorStrategy {
3231
3243
  static {
3232
- __name(this, "JoyThemeGeneratorStrategy");
3244
+ __name(this, "CosmopolitanThemeGeneratorStrategy");
3233
3245
  }
3234
3246
  // #region Fields
3235
- _materialStrategy;
3236
- // #endregion
3237
- // #region Ctor
3238
- constructor() {
3239
- this._materialStrategy = new MaterialThemeGeneratorStrategy();
3240
- }
3247
+ static _CHROMA_REDUCTION_FACTOR = 0.9;
3241
3248
  // #endregion
3242
3249
  // #region Methods
3250
+ /**
3251
+ * Adapts a color to the target mode by inverting its perceptual lightness (LCH L*)
3252
+ * with a slight chroma reduction for the Cosmopolitan's muted aesthetic.
3253
+ *
3254
+ * @override
3255
+ * @public
3256
+ * @param color - The color to adapt
3257
+ * @returns The adapted color with inverted lightness and reduced chroma
3258
+ */
3259
+ adaptColorToMode(color) {
3260
+ const c = chroma7(color);
3261
+ const [l, chromaVal, h] = c.lch();
3262
+ const invertedL = Math.min(Math.max(100 - l, 5), 95);
3263
+ const reducedChroma = chromaVal * _CosmopolitanThemeGeneratorStrategy._CHROMA_REDUCTION_FACTOR;
3264
+ return chroma7.lch(invertedL, reducedChroma, isNaN(h) ? 0 : h).hex();
3265
+ }
3266
+ /**
3267
+ * Generates a color palette with Cosmopolitan-specific dark-mode mixing.
3268
+ *
3269
+ * @remarks
3270
+ * Light mode uses the standard LCH base class implementation.
3271
+ * Dark mode uses a simplified three-anchor approach (steps 0, 100, 500)
3272
+ * to produce the flat, muted dark palette that defines Cosmopolitan.
3273
+ *
3274
+ * @override
3275
+ * @public
3276
+ * @param baseColor - The base/accent color
3277
+ * @param mode - 'light' or 'dark' mode
3278
+ * @returns The generated theme palette with shade steps 0–900
3279
+ */
3243
3280
  generatePalette(baseColor, mode) {
3244
- return this._materialStrategy.generatePalette(baseColor, mode);
3281
+ if (mode === "light") {
3282
+ return super.generatePalette(baseColor, mode);
3283
+ }
3284
+ const baseDark = chroma7("#000000");
3285
+ const palette = {};
3286
+ const steps = [
3287
+ 0,
3288
+ 100,
3289
+ 500
3290
+ ];
3291
+ const amounts = [
3292
+ 0,
3293
+ 30,
3294
+ 100
3295
+ ];
3296
+ steps.forEach((step, i) => {
3297
+ palette[`${step}`] = chroma7.mix(baseDark, baseColor, amounts[i] / 100, "rgb").hex();
3298
+ });
3299
+ return {
3300
+ "0": palette["0"],
3301
+ "50": palette["0"],
3302
+ "100": palette["100"],
3303
+ "200": palette["100"],
3304
+ "300": palette["100"],
3305
+ "400": palette["100"],
3306
+ "500": palette["500"],
3307
+ "600": palette["500"],
3308
+ "700": palette["500"],
3309
+ "800": palette["500"],
3310
+ "900": palette["500"]
3311
+ };
3245
3312
  }
3246
- generateScheme(baseColor, mode) {
3247
- return this._materialStrategy.generateScheme(baseColor, mode);
3313
+ };
3314
+ function createCosmopolitanTheme() {
3315
+ const strategy = new CosmopolitanThemeGeneratorStrategy();
3316
+ return () => strategy;
3317
+ }
3318
+ __name(createCosmopolitanTheme, "createCosmopolitanTheme");
3319
+
3320
+ // src/Theming/Strategies/surface/JoyThemeGeneratorStrategy.ts
3321
+ var JoyThemeGeneratorStrategy = class extends LchThemeGeneratorStrategy {
3322
+ static {
3323
+ __name(this, "JoyThemeGeneratorStrategy");
3248
3324
  }
3249
3325
  };
3250
3326
  function createJoyTheme() {
@@ -3254,581 +3330,621 @@ function createJoyTheme() {
3254
3330
  __name(createJoyTheme, "createJoyTheme");
3255
3331
 
3256
3332
  // src/Theming/Strategies/surface/MemphisThemeGeneratorStrategy.ts
3257
- var MemphisThemeGeneratorStrategy = class {
3333
+ var MemphisThemeGeneratorStrategy = class extends LchThemeGeneratorStrategy {
3258
3334
  static {
3259
3335
  __name(this, "MemphisThemeGeneratorStrategy");
3260
3336
  }
3337
+ };
3338
+ function createMemphisTheme() {
3339
+ const strategy = new MemphisThemeGeneratorStrategy();
3340
+ return () => strategy;
3341
+ }
3342
+ __name(createMemphisTheme, "createMemphisTheme");
3343
+
3344
+ // src/Theming/ThemeGenerator.ts
3345
+ var ThemeGenerator = class {
3346
+ static {
3347
+ __name(this, "ThemeGenerator");
3348
+ }
3261
3349
  // #region Fields
3262
- _materialStrategy;
3350
+ _strategies;
3351
+ _platformAdapter;
3263
3352
  // #endregion
3264
3353
  // #region Ctor
3265
- constructor() {
3266
- this._materialStrategy = new MaterialThemeGeneratorStrategy();
3354
+ /**
3355
+ * @public
3356
+ * @param platformAdapter - Optional platform adapter. Auto-detects if not provided.
3357
+ */
3358
+ constructor(platformAdapter) {
3359
+ this._strategies = /* @__PURE__ */ new Map([
3360
+ [
3361
+ "joy",
3362
+ new JoyThemeGeneratorStrategy()
3363
+ ],
3364
+ [
3365
+ "memphis",
3366
+ new MemphisThemeGeneratorStrategy()
3367
+ ],
3368
+ [
3369
+ "cosmopolitan",
3370
+ new CosmopolitanThemeGeneratorStrategy()
3371
+ ]
3372
+ ]);
3373
+ this._platformAdapter = platformAdapter ?? PlatformAdapterFactory.create();
3267
3374
  }
3268
3375
  // #endregion
3269
3376
  // #region Methods
3270
- generatePalette(baseColor, mode) {
3271
- return this._materialStrategy.generatePalette(baseColor, mode);
3377
+ /**
3378
+ * Generates a complete theme palette (shades 0–900) for the given theme.
3379
+ *
3380
+ * @remarks
3381
+ * 1. If `mode` is `'system'`, it is resolved to `'dark'` or `'light'` via the
3382
+ * platform adapter's `prefers-color-scheme` media query.
3383
+ * 2. The base color is forwarded as-is to the theme-specific strategy which
3384
+ * produces 11 shade steps from lightest (0) to darkest (900).
3385
+ *
3386
+ * No automatic color adaptation is performed. Callers who need mode-compatible
3387
+ * colors can use {@link IThemeGeneratorStrategy.isColorInModeSpectrum} and
3388
+ * {@link IThemeGeneratorStrategy.adaptColorToMode} explicitly before calling
3389
+ * this method.
3390
+ *
3391
+ * @public
3392
+ * @param themeName - The name of the theme (`'joy'`, `'memphis'`, `'cosmopolitan'`).
3393
+ * @param baseColor - The base accent color (any valid CSS color value).
3394
+ * @param mode - The target mode (`'dark'`, `'light'`, or `'system'`).
3395
+ * @returns A fully populated palette with shade keys `0`–`900`.
3396
+ * @throws Error if `themeName` is not a registered theme.
3397
+ */
3398
+ generatePalette(themeName, baseColor, mode) {
3399
+ const resolvedMode = this.resolveMode(mode);
3400
+ const strategy = this.getStrategy(themeName);
3401
+ return strategy.generatePalette(baseColor, resolvedMode);
3272
3402
  }
3273
- generateScheme(baseColor, mode) {
3274
- return this._materialStrategy.generateScheme(baseColor, mode);
3403
+ /**
3404
+ * Generates a semantic color scheme (surface, foreground, highlight, …) for the given theme.
3405
+ *
3406
+ * @remarks
3407
+ * 1. If `mode` is `'system'`, it is resolved to `'dark'` or `'light'` via the
3408
+ * platform adapter's `prefers-color-scheme` media query.
3409
+ * 2. The base color is forwarded as-is to the theme-specific strategy which
3410
+ * maps it to semantic roles such as `surface`, `foreground`, `highlight`,
3411
+ * `contrast`, `disabled`, etc.
3412
+ *
3413
+ * No automatic color adaptation is performed. Callers who need mode-compatible
3414
+ * colors can use {@link IThemeGeneratorStrategy.isColorInModeSpectrum} and
3415
+ * {@link IThemeGeneratorStrategy.adaptColorToMode} explicitly before calling
3416
+ * this method.
3417
+ *
3418
+ * @public
3419
+ * @param themeName - The name of the theme (`'joy'`, `'memphis'`, `'cosmopolitan'`).
3420
+ * @param baseColor - The base background color (any valid CSS color value).
3421
+ * @param mode - The target mode (`'dark'`, `'light'`, or `'system'`).
3422
+ * @returns A fully populated scheme with all semantic color roles.
3423
+ * @throws Error if `themeName` is not a registered theme.
3424
+ */
3425
+ generateScheme(themeName, baseColor, mode) {
3426
+ const resolvedMode = this.resolveMode(mode);
3427
+ const strategy = this.getStrategy(themeName);
3428
+ return strategy.generateScheme(baseColor, resolvedMode);
3429
+ }
3430
+ /**
3431
+ * Resolves the theme mode, converting 'system' to 'dark' or 'light' based on platform settings.
3432
+ *
3433
+ * @private
3434
+ * @param mode The theme mode to resolve.
3435
+ * @returns The resolved theme mode.
3436
+ */
3437
+ resolveMode(mode) {
3438
+ if (mode === "system") {
3439
+ const isDark = this._platformAdapter.matchMedia("(prefers-color-scheme: dark)");
3440
+ return isDark ? "dark" : "light";
3441
+ }
3442
+ return mode;
3443
+ }
3444
+ /**
3445
+ * Gets the theme generator strategy for the specified theme name.
3446
+ *
3447
+ * @private
3448
+ * @param themeName The name of the theme ('joy', 'memphis', 'cosmopolitan').
3449
+ * @returns The theme generator strategy.
3450
+ */
3451
+ getStrategy(themeName) {
3452
+ const strategy = this._strategies.get(themeName);
3453
+ if (!strategy) {
3454
+ throw new Error(`Theme '${themeName}' is not supported.`);
3455
+ }
3456
+ return strategy;
3275
3457
  }
3276
3458
  };
3277
- function createMemphisTheme() {
3278
- const strategy = new MemphisThemeGeneratorStrategy();
3279
- return () => strategy;
3280
- }
3281
- __name(createMemphisTheme, "createMemphisTheme");
3282
- var CosmopolitanThemeGeneratorStrategy = class {
3459
+ var ThemeGeneratorServiceLocator = class _ThemeGeneratorServiceLocator {
3283
3460
  static {
3284
- __name(this, "CosmopolitanThemeGeneratorStrategy");
3461
+ __name(this, "ThemeGeneratorServiceLocator");
3285
3462
  }
3286
3463
  // #region Fields
3287
- _materialStrategy;
3464
+ static _current = null;
3288
3465
  // #endregion
3289
- // #region Ctor
3290
- constructor() {
3291
- this._materialStrategy = new MaterialThemeGeneratorStrategy();
3466
+ // #region Properties
3467
+ static get current() {
3468
+ if (!_ThemeGeneratorServiceLocator.isSet()) {
3469
+ throw new Error("'ThemeGenerator' not set.");
3470
+ }
3471
+ return _ThemeGeneratorServiceLocator._current;
3292
3472
  }
3293
3473
  // #endregion
3294
3474
  // #region Methods
3295
- generatePalette(baseColor, mode) {
3296
- if (mode === "light") {
3297
- const baseLight2 = chroma("#ffffff");
3298
- const baseDark2 = chroma("#000000");
3299
- const palette2 = {};
3300
- const steps2 = [
3301
- 0,
3302
- 50,
3303
- 100,
3304
- 200,
3305
- 300,
3306
- 400,
3307
- 500,
3308
- 600,
3309
- 700,
3310
- 800,
3311
- 900
3312
- ];
3313
- const amounts2 = [
3314
- 0,
3315
- 12,
3316
- 30,
3317
- 50,
3318
- 70,
3319
- 85,
3320
- 100,
3321
- 87,
3322
- 70,
3323
- 54,
3324
- 25
3325
- ];
3326
- steps2.forEach((step, i) => {
3327
- const base = step <= 500 ? baseLight2 : baseDark2;
3328
- palette2[`${step}`] = chroma.mix(base, baseColor, amounts2[i] / 100, "rgb").hex();
3329
- });
3330
- return palette2;
3331
- }
3332
- const baseLight = chroma("#ffffff");
3333
- const baseDark = chroma("#000000");
3334
- const palette = {};
3335
- const steps = [
3336
- 0,
3337
- 100,
3338
- 500
3339
- ];
3340
- const amounts = [
3341
- 0,
3342
- 30,
3343
- 100
3344
- ];
3345
- steps.forEach((step, i) => {
3346
- const base = step <= 600 ? baseDark : baseLight;
3347
- palette[`${step}`] = chroma.mix(base, baseColor, amounts[i] / 100, "rgb").hex();
3348
- });
3349
- return palette;
3475
+ static isSet() {
3476
+ return _ThemeGeneratorServiceLocator._current !== null;
3350
3477
  }
3351
- generateScheme(baseColor, mode) {
3352
- return this._materialStrategy.generateScheme(baseColor, mode);
3478
+ static set(current) {
3479
+ _ThemeGeneratorServiceLocator._current = current;
3353
3480
  }
3354
3481
  };
3355
- function createCosmopolitanTheme() {
3356
- const strategy = new CosmopolitanThemeGeneratorStrategy();
3357
- return () => strategy;
3482
+ ThemeGeneratorServiceLocator.set(new ThemeGenerator());
3483
+ function isThemeMode(value) {
3484
+ return value === "system" || value === "dark" || value === "light";
3358
3485
  }
3359
- __name(createCosmopolitanTheme, "createCosmopolitanTheme");
3360
-
3361
- // src/Theming/ThemeGenerator.ts
3362
- var ThemeGenerator = class {
3486
+ __name(isThemeMode, "isThemeMode");
3487
+ var ThemeObserver = class {
3363
3488
  static {
3364
- __name(this, "ThemeGenerator");
3489
+ __name(this, "ThemeObserver");
3365
3490
  }
3366
3491
  // #region Fields
3367
- _strategies;
3492
+ _themeChanged;
3493
+ _themeModeChanged;
3368
3494
  _platformAdapter;
3369
- // #endregion
3495
+ _currentTheme;
3496
+ _currentThemeMode;
3497
+ _unsubscribe;
3370
3498
  // #region Ctor
3371
3499
  /**
3372
- * @public
3500
+ * Constructs a new instance of the `ThemeObserver` class.
3501
+ *
3373
3502
  * @param platformAdapter - Optional platform adapter. Auto-detects if not provided.
3503
+ * @public
3374
3504
  */
3375
3505
  constructor(platformAdapter) {
3376
- this._strategies = /* @__PURE__ */ new Map([
3377
- [
3378
- "joy",
3379
- new JoyThemeGeneratorStrategy()
3380
- ],
3381
- [
3382
- "memphis",
3383
- new MemphisThemeGeneratorStrategy()
3384
- ],
3385
- [
3386
- "cosmopolitan",
3387
- new CosmopolitanThemeGeneratorStrategy()
3388
- ]
3389
- ]);
3506
+ this._themeChanged = new PureEventEmitter();
3507
+ this._themeModeChanged = new PureEventEmitter();
3390
3508
  this._platformAdapter = platformAdapter ?? PlatformAdapterFactory.create();
3509
+ this._currentTheme = null;
3510
+ this._currentThemeMode = null;
3511
+ this.observe({
3512
+ themeChange: /* @__PURE__ */ __name((theme) => this._themeChanged.emit(theme), "themeChange"),
3513
+ themeModeChange: /* @__PURE__ */ __name((themeMode) => this._themeModeChanged.emit(themeMode), "themeModeChange")
3514
+ });
3391
3515
  }
3392
3516
  // #endregion
3393
- // #region Methods
3517
+ // #region Properties
3394
3518
  /**
3395
- * Generates a theme palette.
3519
+ * Fires when the theme changes.
3396
3520
  *
3397
3521
  * @public
3398
- * @param themeName The name of the theme.
3399
- * @param baseColor The base color (typically a 500 level shade).
3400
- * @param mode The theme mode ('dark', 'light', or 'system').
3401
- * @returns The generated theme palette.
3522
+ * @readonly
3402
3523
  */
3403
- generatePalette(themeName, baseColor, mode) {
3404
- const resolvedMode = this.resolveMode(mode);
3405
- const strategy = this.getStrategy(themeName);
3406
- return strategy.generatePalette(baseColor, resolvedMode);
3524
+ get themeChanged() {
3525
+ return this._themeChanged;
3407
3526
  }
3408
3527
  /**
3409
- * Generates a theme scheme.
3528
+ * Fires when the theme mode changes.
3410
3529
  *
3411
3530
  * @public
3412
- * @param themeName The name of the theme.
3413
- * @param baseColor The base color (typically a background level shade).
3414
- * @param mode The theme mode ('dark', 'light', or 'system').
3415
- * @returns The generated theme scheme.
3531
+ * @readonly
3416
3532
  */
3417
- generateScheme(themeName, baseColor, mode) {
3418
- const resolvedMode = this.resolveMode(mode);
3419
- const strategy = this.getStrategy(themeName);
3420
- return strategy.generateScheme(baseColor, resolvedMode);
3533
+ get themeModeChanged() {
3534
+ return this._themeModeChanged;
3421
3535
  }
3536
+ // #endregion
3537
+ // #region Methods
3422
3538
  /**
3423
- * Resolves the theme mode, converting 'system' to 'dark' or 'light' based on platform settings.
3539
+ * Applies the given theme and theme mode to the document.
3424
3540
  *
3425
- * @private
3426
- * @param mode The theme mode to resolve.
3427
- * @returns The resolved theme mode.
3541
+ * @public
3542
+ * @param theme - The theme to apply (joy, cosmopolitan or memphis).
3543
+ * @param themeMode - The theme mode to apply.
3428
3544
  */
3429
- resolveMode(mode) {
3430
- if (mode === "system") {
3431
- const isDark = this._platformAdapter.matchMedia("(prefers-color-scheme: dark)");
3432
- return isDark ? "dark" : "light";
3545
+ applyTheme(theme, themeMode) {
3546
+ this._platformAdapter.setDocumentAttribute("theme", theme);
3547
+ switch (themeMode) {
3548
+ case "dark":
3549
+ case "light":
3550
+ this._platformAdapter.setDocumentAttribute("theme-mode", themeMode);
3551
+ break;
3552
+ case "system":
3553
+ default:
3554
+ const isDark = this._platformAdapter.matchMedia("(prefers-color-scheme: dark)");
3555
+ this._platformAdapter.setDocumentAttribute("theme-mode", isDark ? "dark" : "light");
3556
+ break;
3433
3557
  }
3434
- return mode;
3435
3558
  }
3436
3559
  /**
3437
- * Gets the theme generator strategy for the specified theme name.
3560
+ * Stops observing document attribute changes and releases the underlying listener.
3438
3561
  *
3439
- * @private
3440
- * @param themeName The name of the theme.
3441
- * @returns The theme generator strategy.
3562
+ * @remarks
3563
+ * Safe to call multiple times — subsequent calls are no-ops.
3564
+ *
3565
+ * @public
3442
3566
  */
3443
- getStrategy(themeName) {
3444
- const strategy = this._strategies.get(themeName);
3445
- if (!strategy) {
3446
- throw new Error(`Theme '${themeName}' is not supported.`);
3567
+ dispose() {
3568
+ if (this._unsubscribe) {
3569
+ this._unsubscribe();
3570
+ this._unsubscribe = void 0;
3571
+ }
3572
+ }
3573
+ observe(cb) {
3574
+ this._currentTheme = this._platformAdapter.getDocumentAttribute("theme");
3575
+ this._currentThemeMode = this._platformAdapter.getDocumentAttribute("theme-mode");
3576
+ this._unsubscribe = this._platformAdapter.observeDocumentAttributes([
3577
+ "theme",
3578
+ "theme-mode"
3579
+ ], (attributeName, newValue) => {
3580
+ if (attributeName === "theme" && newValue) {
3581
+ const theme = newValue;
3582
+ if (this._currentTheme !== theme) {
3583
+ this._currentTheme = theme;
3584
+ cb.themeChange(theme);
3585
+ }
3586
+ }
3587
+ if (attributeName === "theme-mode") {
3588
+ const themeMode = newValue;
3589
+ if (!isThemeMode(themeMode)) {
3590
+ throw new Error(`Invalid theme mode: ${String(themeMode)}`);
3591
+ }
3592
+ if (this._currentThemeMode !== themeMode) {
3593
+ this._currentThemeMode = themeMode;
3594
+ cb.themeModeChange(themeMode);
3595
+ }
3596
+ }
3597
+ });
3598
+ }
3599
+ };
3600
+ var ThemeObserverServiceLocator = class _ThemeObserverServiceLocator {
3601
+ static {
3602
+ __name(this, "ThemeObserverServiceLocator");
3603
+ }
3604
+ // #region Fields
3605
+ static _current = null;
3606
+ // #endregion
3607
+ // #region Properties
3608
+ static get current() {
3609
+ if (!_ThemeObserverServiceLocator.isSet()) {
3610
+ throw new Error("'ThemeObserver' not set.");
3611
+ }
3612
+ return _ThemeObserverServiceLocator._current;
3613
+ }
3614
+ // #endregion
3615
+ // #region Methods
3616
+ static isSet() {
3617
+ return _ThemeObserverServiceLocator._current !== null;
3618
+ }
3619
+ static set(current) {
3620
+ _ThemeObserverServiceLocator._current = current;
3621
+ }
3622
+ };
3623
+ ThemeObserverServiceLocator.set(new ThemeObserver());
3624
+
3625
+ // src/Theming/Utils/CssAspectRatio.ts
3626
+ (function(CssAspectRatio2) {
3627
+ function isCssAspectRatio(value) {
3628
+ if (typeof value === "string") {
3629
+ if (value.trim() === "") {
3630
+ return false;
3631
+ }
3632
+ if (value === "auto") {
3633
+ return true;
3634
+ }
3635
+ const ratioParts = value.split("/");
3636
+ if (ratioParts.length === 1) {
3637
+ return !isNaN(Number(ratioParts[0])) && Number(ratioParts[0]) >= 0;
3638
+ }
3639
+ if (ratioParts.length === 2) {
3640
+ return !isNaN(Number(ratioParts[0])) && Number(ratioParts[0]) >= 0 && !isNaN(Number(ratioParts[1])) && Number(ratioParts[1]) >= 0;
3641
+ }
3642
+ }
3643
+ return false;
3644
+ }
3645
+ __name(isCssAspectRatio, "isCssAspectRatio");
3646
+ CssAspectRatio2.isCssAspectRatio = isCssAspectRatio;
3647
+ })(CssAspectRatio || (CssAspectRatio = {}));
3648
+ var CssAspectRatio;
3649
+
3650
+ // src/Theming/Utils/CssColor.ts
3651
+ (function(CssColor2) {
3652
+ function isCssColor(value) {
3653
+ if (typeof value !== "string") {
3654
+ return false;
3655
+ }
3656
+ if (value.trim() === "") {
3657
+ return false;
3658
+ }
3659
+ const rgbRegex = /^rgb\(\d{1,3},\s*\d{1,3},\s*\d{1,3}\)$/;
3660
+ const rgbaRegex = /^rgba\(\d{1,3},\s*\d{1,3},\s*\d{1,3},\s*(0(\.\d+)?|1(\.0+)?)\)$/;
3661
+ const hexRegex = /^#[0-9a-fA-F]{3,6}$/;
3662
+ return rgbRegex.test(value) || rgbaRegex.test(value) || hexRegex.test(value);
3663
+ }
3664
+ __name(isCssColor, "isCssColor");
3665
+ CssColor2.isCssColor = isCssColor;
3666
+ })(CssColor || (CssColor = {}));
3667
+ var CssColor;
3668
+
3669
+ // src/Theming/Utils/CssLength.ts
3670
+ (function(CssLength2) {
3671
+ function isCssLength(value) {
3672
+ if (typeof value === "number" || value === "auto") {
3673
+ return true;
3674
+ }
3675
+ if (typeof value !== "string") {
3676
+ return false;
3677
+ }
3678
+ if (value.trim() === "") {
3679
+ return false;
3680
+ }
3681
+ const lengthRegex = /^-?\d+(\.\d+)?(em|ex|ch|rem|vh|vw|vmin|vmax|svw|svh|dvw|dvh|lvw|lvh|px|mm|cm|in|pt|pc|mozmm|%)/;
3682
+ return lengthRegex.test(value);
3683
+ }
3684
+ __name(isCssLength, "isCssLength");
3685
+ CssLength2.isCssLength = isCssLength;
3686
+ function isAuto(value) {
3687
+ return value === "auto";
3688
+ }
3689
+ __name(isAuto, "isAuto");
3690
+ CssLength2.isAuto = isAuto;
3691
+ function isPercentage(value) {
3692
+ if (typeof value !== "string") {
3693
+ return false;
3694
+ }
3695
+ if (value.trim() === "") {
3696
+ return false;
3697
+ }
3698
+ const percentageRegex = /^-?\d+(\.\d+)?%/;
3699
+ return percentageRegex.test(value);
3700
+ }
3701
+ __name(isPercentage, "isPercentage");
3702
+ CssLength2.isPercentage = isPercentage;
3703
+ function isLength(value) {
3704
+ if (typeof value !== "string") {
3705
+ return false;
3706
+ }
3707
+ if (value.trim() === "") {
3708
+ return false;
3709
+ }
3710
+ const lengthRegex = /^-?\d+(\.\d+)?(em|ex|ch|rem|vh|vw|vmin|vmax|svw|svh|dvw|dvh|lvw|lvh|px|mm|cm|in|pt|pc|mozmm)/;
3711
+ return lengthRegex.test(value);
3712
+ }
3713
+ __name(isLength, "isLength");
3714
+ CssLength2.isLength = isLength;
3715
+ function toNumber(value) {
3716
+ if (typeof value === "number") {
3717
+ return value;
3718
+ }
3719
+ if (value === "auto") {
3720
+ throw new Error('Cannot convert "auto" to a number.');
3447
3721
  }
3448
- return strategy;
3722
+ const match = /^-?\d*\.?\d+/.exec(value);
3723
+ if (!match) {
3724
+ throw new Error(`Invalid CSS length: ${value}`);
3725
+ }
3726
+ return parseFloat(match[0]);
3449
3727
  }
3450
- };
3451
- var ThemeGeneratorServiceLocator = class _ThemeGeneratorServiceLocator {
3452
- static {
3453
- __name(this, "ThemeGeneratorServiceLocator");
3728
+ __name(toNumber, "toNumber");
3729
+ CssLength2.toNumber = toNumber;
3730
+ function toString(value, defaultUnit = "px") {
3731
+ if (value === void 0 || value === null) {
3732
+ return "";
3733
+ }
3734
+ if (typeof value === "number") {
3735
+ return `${value}${defaultUnit}`;
3736
+ }
3737
+ return value;
3454
3738
  }
3455
- // #region Fields
3456
- static _current = null;
3457
- // #endregion
3458
- // #region Properties
3459
- static get current() {
3460
- if (!_ThemeGeneratorServiceLocator.isSet()) {
3461
- throw new Error("'ThemeGenerator' not set.");
3739
+ __name(toString, "toString");
3740
+ CssLength2.toString = toString;
3741
+ function extractUnit(cssLength) {
3742
+ const match = /[a-z%]+$/i.exec(cssLength);
3743
+ const lengt = match ? match[0] : null;
3744
+ if (lengt === null) {
3745
+ throw new Error(`Invalid value: ${cssLength}`);
3462
3746
  }
3463
- return _ThemeGeneratorServiceLocator._current;
3747
+ return lengt;
3464
3748
  }
3465
- // #endregion
3466
- // #region Methods
3467
- static isSet() {
3468
- return _ThemeGeneratorServiceLocator._current !== null;
3749
+ __name(extractUnit, "extractUnit");
3750
+ CssLength2.extractUnit = extractUnit;
3751
+ function extractValue(cssLength) {
3752
+ const match = /^-?\d*\.?\d+/.exec(cssLength);
3753
+ const value = match ? parseFloat(match[0]) : null;
3754
+ if (value === null) {
3755
+ throw new Error(`Invalid value: ${cssLength}`);
3756
+ }
3757
+ return value;
3469
3758
  }
3470
- static set(current) {
3471
- _ThemeGeneratorServiceLocator._current = current;
3759
+ __name(extractValue, "extractValue");
3760
+ CssLength2.extractValue = extractValue;
3761
+ function pxToRem(pixel) {
3762
+ const value = extractValue(pixel);
3763
+ const baseSize = 16;
3764
+ const sizeInRem = `${value / baseSize}rem`;
3765
+ return sizeInRem;
3472
3766
  }
3473
- };
3474
- ThemeGeneratorServiceLocator.set(new ThemeGenerator());
3475
- var TailwindThemeGeneratorStrategy = class {
3476
- static {
3477
- __name(this, "TailwindThemeGeneratorStrategy");
3767
+ __name(pxToRem, "pxToRem");
3768
+ CssLength2.pxToRem = pxToRem;
3769
+ function tryParse(value, defaultUnit = "px") {
3770
+ if (value === void 0 || value === null) {
3771
+ return void 0;
3772
+ }
3773
+ if (typeof value === "string") {
3774
+ if (isLength(value)) {
3775
+ return value;
3776
+ }
3777
+ if (value.trim() === "") {
3778
+ return void 0;
3779
+ }
3780
+ const num = parseFloat(value);
3781
+ return isNaN(num) ? void 0 : `${num}${defaultUnit}`;
3782
+ }
3783
+ if (typeof value === "number") {
3784
+ return `${String(value)}${defaultUnit}`;
3785
+ }
3786
+ return void 0;
3478
3787
  }
3479
- /**
3480
- * Generates a palette of shades based on a base/accent color.
3481
- *
3482
- * @param baseColor - The base/accent color (e.g. "#3498db")
3483
- * @param mode - 'light' or 'dark' mode: determines how light or dark the palette extremes are.
3484
- * @returns An IThemePalette mapping each shade step to a hex color.
3485
- *
3486
- * Example (light mode, baseColor = blue-ish):
3487
- * {
3488
- * "50": "#f5faff",
3489
- * "100": "#e1f3ff",
3490
- * ...
3491
- * "500": "#3498db",
3492
- * ...
3493
- * "900": "#0a2d4b"
3494
- * }
3495
- */
3496
- generatePalette(baseColor, mode) {
3497
- const steps = [
3498
- 50,
3499
- 100,
3500
- 200,
3501
- 300,
3502
- 400,
3503
- 500,
3504
- 600,
3505
- 700,
3506
- 800,
3507
- 900
3508
- ];
3509
- const base = chroma(baseColor);
3510
- const [h, s] = base.hsl();
3511
- const palette = {};
3512
- steps.forEach((step, idx) => {
3513
- const t = idx / (steps.length - 1);
3514
- const lightness = mode === "light" ? 0.95 - t * 0.6 : 0.15 + t * 0.6;
3515
- const col = chroma.hsl(h, s, lightness);
3516
- palette[step.toString()] = col.hex();
3517
- });
3518
- return palette;
3788
+ __name(tryParse, "tryParse");
3789
+ CssLength2.tryParse = tryParse;
3790
+ })(CssLength || (CssLength = {}));
3791
+ var CssLength;
3792
+
3793
+ // src/Theming/Utils/CssShadow.ts
3794
+ (function(CssShadow2) {
3795
+ function isCssShadow(value) {
3796
+ if (typeof value !== "string") {
3797
+ return false;
3798
+ }
3799
+ if (value.trim() === "") {
3800
+ return false;
3801
+ }
3802
+ if (value === "none") {
3803
+ return true;
3804
+ }
3805
+ const shadows = value.split(/\s*,\s*/);
3806
+ return shadows.every(isCssShadowSingle);
3519
3807
  }
3520
- /**
3521
- * Generates a semantic color scheme for UI usage, based on the generated palette.
3522
- *
3523
- * @param baseColor - The base/accent color
3524
- * @param mode - 'light' or 'dark'
3525
- * @returns An scheme with semantic color roles.
3526
- *
3527
- * Returned keys:
3528
- * - background → shade "50"
3529
- * - foreground → shade "900"
3530
- * - primary → shade "500"
3531
- * - accent → shade "700"
3532
- * - muted → shade "300"
3533
- */
3534
- generateScheme(baseColor, mode) {
3535
- const p = this.generatePalette(baseColor, mode);
3536
- return {
3537
- background: p["50"],
3538
- foreground: p["900"],
3539
- disabled: p["300"]
3540
- };
3808
+ __name(isCssShadow, "isCssShadow");
3809
+ CssShadow2.isCssShadow = isCssShadow;
3810
+ function isCssShadowSingle(value) {
3811
+ const shadowRegex = new RegExp("^(inset\\s+)?(-?\\d+(\\.\\d+)?(px|em|rem|vh|vw|%)?)\\s+(-?\\d+(\\.\\d+)?(px|em|rem|vh|vw|%)?)\\s+(-?\\d+(\\.\\d+)?(px|em|rem|vh|vw|%)?)?\\s*(-?\\d+(\\.\\d+)?(px|em|rem|vh|vw|%)?)?\\s*(rgba?\\(\\d{1,3},\\s*\\d{1,3},\\s*\\d{1,3}(,\\s*(0|1|0?\\.\\d+))?\\)|#[0-9a-fA-F]{3,6})$", "i");
3812
+ return shadowRegex.test(value);
3541
3813
  }
3542
- };
3543
- function createTailwindTheme() {
3544
- const strategy = new TailwindThemeGeneratorStrategy();
3545
- return () => strategy;
3546
- }
3547
- __name(createTailwindTheme, "createTailwindTheme");
3548
- function adjust(color, amount) {
3549
- return Math.min(255, Math.max(0, color + amount));
3550
- }
3551
- __name(adjust, "adjust");
3552
- function darken(hex, factor) {
3553
- const [r, g, b] = chroma(hex).rgb().map((x) => adjust(x, -factor));
3554
- return chroma(r, g, b, "rgb").hex();
3555
- }
3556
- __name(darken, "darken");
3557
- function lighten(hex, factor) {
3558
- const [r, g, b] = chroma(hex).rgb().map((x) => adjust(x, factor));
3559
- return chroma(r, g, b, "rgb").hex();
3560
- }
3561
- __name(lighten, "lighten");
3814
+ __name(isCssShadowSingle, "isCssShadowSingle");
3815
+ })(CssShadow || (CssShadow = {}));
3816
+ var CssShadow;
3562
3817
 
3563
- // src/Colors/common.ts
3564
- function hexToHSL(hex) {
3565
- const r = parseInt(hex.slice(1, 3), 16) / 255;
3566
- const g = parseInt(hex.slice(3, 5), 16) / 255;
3567
- const b = parseInt(hex.slice(5, 7), 16) / 255;
3568
- const max = Math.max(r, g, b);
3569
- const min = Math.min(r, g, b);
3570
- let h = 0;
3571
- let s = 0;
3572
- const l = (max + min) / 2;
3573
- if (max === min) {
3574
- h = 0;
3575
- s = 0;
3576
- } else {
3577
- const d = max - min;
3578
- s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
3579
- switch (max) {
3580
- case r:
3581
- h = (g - b) / d + (g < b ? 6 : 0);
3582
- break;
3583
- case g:
3584
- h = (b - r) / d + 2;
3585
- break;
3586
- case b:
3587
- h = (r - g) / d + 4;
3588
- break;
3818
+ // src/Theming/Utils/CssTime.ts
3819
+ (function(CssTime2) {
3820
+ function isCssTime(value) {
3821
+ if (typeof value === "number" || value === 0) {
3822
+ return true;
3589
3823
  }
3590
- h /= 6;
3591
- }
3592
- return [
3593
- h,
3594
- s,
3595
- l
3596
- ];
3597
- }
3598
- __name(hexToHSL, "hexToHSL");
3599
- function hslToHex(h, s, l) {
3600
- const hue2rgb = /* @__PURE__ */ __name((p, q, t) => {
3601
- if (t < 0) {
3602
- t += 1;
3824
+ if (typeof value !== "string") {
3825
+ return false;
3603
3826
  }
3604
- if (t > 1) {
3605
- t -= 1;
3827
+ if (value.trim() === "") {
3828
+ return false;
3606
3829
  }
3607
- if (t < 1 / 6) {
3608
- return p + (q - p) * 6 * t;
3830
+ const timeRegex = /^-?\d+(\.\d+)?(s|ms)/;
3831
+ return timeRegex.test(value);
3832
+ }
3833
+ __name(isCssTime, "isCssTime");
3834
+ CssTime2.isCssTime = isCssTime;
3835
+ })(CssTime || (CssTime = {}));
3836
+ var CssTime;
3837
+
3838
+ // src/Theming/Utils/ThemePalette.ts
3839
+ (function(ThemePalette2) {
3840
+ const THEME_SHADE_NAMES = [
3841
+ "0",
3842
+ "50",
3843
+ "100",
3844
+ "200",
3845
+ "300",
3846
+ "400",
3847
+ "500",
3848
+ "600",
3849
+ "700",
3850
+ "800",
3851
+ "900"
3852
+ ];
3853
+ function isThemeShadeName(value) {
3854
+ return THEME_SHADE_NAMES.includes(value);
3855
+ }
3856
+ __name(isThemeShadeName, "isThemeShadeName");
3857
+ function isThemePalette(value) {
3858
+ if (typeof value !== "object" || value === null) {
3859
+ return false;
3609
3860
  }
3610
- if (t < 1 / 2) {
3611
- return q;
3861
+ return Object.keys(value).every((key) => isThemeShadeName(key) && typeof value[key] === "string");
3862
+ }
3863
+ __name(isThemePalette, "isThemePalette");
3864
+ ThemePalette2.isThemePalette = isThemePalette;
3865
+ })(ThemePalette || (ThemePalette = {}));
3866
+ var ThemePalette;
3867
+
3868
+ // src/Theming/Utils/ITheme.ts
3869
+ (function(ITheme2) {
3870
+ function getScheme(theme, mode) {
3871
+ return theme.scheme[mode];
3872
+ }
3873
+ __name(getScheme, "getScheme");
3874
+ ITheme2.getScheme = getScheme;
3875
+ function getPalette(theme, mode, semanticColor) {
3876
+ const paletteEntry = theme.palette[mode][semanticColor];
3877
+ if (!ThemePalette.isThemePalette(paletteEntry)) {
3878
+ throw new Error(`Palette '${semanticColor}' is not a valid theme palette for mode '${mode}'.`);
3612
3879
  }
3613
- if (t < 2 / 3) {
3614
- return p + (q - p) * (2 / 3 - t) * 6;
3880
+ return paletteEntry;
3881
+ }
3882
+ __name(getPalette, "getPalette");
3883
+ ITheme2.getPalette = getPalette;
3884
+ function getSchemeColor(theme, mode, role) {
3885
+ const scheme = theme.scheme[mode];
3886
+ const color = scheme[role];
3887
+ if (typeof color !== "string") {
3888
+ throw new Error(`Scheme color '${role}' is not defined for mode '${mode}'.`);
3615
3889
  }
3616
- return p;
3617
- }, "hue2rgb");
3618
- let r = 0;
3619
- let g = 0;
3620
- let b = 0;
3621
- if (s === 0) {
3622
- r = l;
3623
- g = l;
3624
- b = l;
3625
- } else {
3626
- const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
3627
- const p = 2 * l - q;
3628
- r = hue2rgb(p, q, h + 1 / 3);
3629
- g = hue2rgb(p, q, h);
3630
- b = hue2rgb(p, q, h - 1 / 3);
3890
+ return color;
3631
3891
  }
3632
- return `#${Math.round(r * 255).toString(16).padStart(2, "0")}${Math.round(g * 255).toString(16).padStart(2, "0")}${Math.round(b * 255).toString(16).padStart(2, "0")}`;
3633
- }
3634
- __name(hslToHex, "hslToHex");
3635
- function adjustHue(hsl, adjustment) {
3636
- return [
3637
- (hsl[0] + adjustment + 1) % 1,
3638
- hsl[1],
3639
- hsl[2]
3640
- ];
3641
- }
3642
- __name(adjustHue, "adjustHue");
3643
-
3644
- // src/Colors/generators/analogous.ts
3645
- function generateAnalogousPalette(baseHex, adjustment) {
3646
- const baseHSL = hexToHSL(baseHex);
3647
- const adjustedHSL = adjustHue(baseHSL, adjustment);
3648
- const palette = {};
3649
- const steps = [
3650
- 0,
3651
- 50,
3652
- 100,
3653
- 200,
3654
- 300,
3655
- 400,
3656
- 500,
3657
- 600,
3658
- 700,
3659
- 800,
3660
- 900
3661
- ];
3662
- steps.forEach((step) => {
3663
- let [h, s, l] = adjustedHSL;
3664
- if (step === 0) {
3665
- l = 1;
3666
- } else {
3667
- l = 1 - step / 1e3;
3892
+ __name(getSchemeColor, "getSchemeColor");
3893
+ ITheme2.getSchemeColor = getSchemeColor;
3894
+ function getPaletteColor(theme, mode, semanticColor, shade) {
3895
+ const palette = getPalette(theme, mode, semanticColor);
3896
+ const color = palette[shade];
3897
+ if (typeof color !== "string") {
3898
+ throw new Error(`Shade '${shade}' is not defined in palette '${semanticColor}' for mode '${mode}'.`);
3668
3899
  }
3669
- palette[`${step}`] = hslToHex(h, s, Math.max(0, Math.min(1, l)));
3670
- });
3671
- return palette;
3672
- }
3673
- __name(generateAnalogousPalette, "generateAnalogousPalette");
3674
- function generateAnalogousColor(baseHex, adjustment) {
3675
- const baseHSL = hexToHSL(baseHex);
3676
- const adjustedHSL = adjustHue(baseHSL, adjustment);
3677
- const [h, s] = adjustedHSL;
3678
- return hslToHex(h, s, 0.5);
3679
- }
3680
- __name(generateAnalogousColor, "generateAnalogousColor");
3681
- function generateMaterialPalette(hexColor) {
3682
- const baseLight = chroma("#ffffff");
3683
- const baseDark = chroma("#000000");
3684
- const palette = {};
3685
- const steps = [
3686
- 0,
3687
- 50,
3688
- 100,
3689
- 200,
3690
- 300,
3691
- 400,
3692
- 500,
3693
- 600,
3694
- 700,
3695
- 800,
3696
- 900
3697
- ];
3698
- const amounts = [
3699
- 0,
3700
- 12,
3701
- 30,
3702
- 50,
3703
- 70,
3704
- 85,
3705
- 100,
3706
- 87,
3707
- 70,
3708
- 54,
3709
- 25
3710
- ];
3711
- steps.forEach((step, i) => {
3712
- const base = step <= 500 ? baseLight : baseDark;
3713
- palette[`${step}`] = chroma.mix(base, hexColor, amounts[i] / 100, "rgb").hex();
3714
- });
3715
- return palette;
3716
- }
3717
- __name(generateMaterialPalette, "generateMaterialPalette");
3900
+ return color;
3901
+ }
3902
+ __name(getPaletteColor, "getPaletteColor");
3903
+ ITheme2.getPaletteColor = getPaletteColor;
3904
+ function getElevationShadow(theme, mode, key) {
3905
+ return theme.elevation[mode][key];
3906
+ }
3907
+ __name(getElevationShadow, "getElevationShadow");
3908
+ ITheme2.getElevationShadow = getElevationShadow;
3909
+ })(ITheme || (ITheme = {}));
3910
+ var ITheme;
3718
3911
 
3719
- // src/Colors/generators/complementary.ts
3720
- function generateComplementaryPalette(baseHex) {
3721
- const [h, s, l] = chroma(baseHex).hsl();
3722
- const complementaryH = (h + 180) % 360;
3723
- return generateMaterialPalette(chroma.hsl(complementaryH, s, l).hex());
3724
- }
3725
- __name(generateComplementaryPalette, "generateComplementaryPalette");
3726
- function generateComplementaryColor(baseHex) {
3727
- const [h, s, l] = chroma(baseHex).hsl();
3728
- const complementaryH = (h + 180) % 360;
3729
- return chroma.hsl(complementaryH, s, l).hex();
3730
- }
3731
- __name(generateComplementaryColor, "generateComplementaryColor");
3732
- function generateSplitComplementaryColors(baseHex) {
3733
- const [h, s, l] = chroma(baseHex).hsl();
3734
- const splitH1 = (h + 150) % 360;
3735
- const splitH2 = (h + 210) % 360;
3736
- return [
3737
- chroma.hsl(splitH1, s, l).hex(),
3738
- chroma.hsl(splitH2, s, l).hex()
3739
- ];
3740
- }
3741
- __name(generateSplitComplementaryColors, "generateSplitComplementaryColors");
3742
- function generateSplitComplementaryColor1(baseHex) {
3743
- const [h, s, l] = chroma(baseHex).hsl();
3744
- const splitH = (h + 150) % 360;
3745
- return chroma.hsl(splitH, s, l).hex();
3746
- }
3747
- __name(generateSplitComplementaryColor1, "generateSplitComplementaryColor1");
3748
- function generateSplitComplementaryColor2(baseHex) {
3749
- const [h, s, l] = chroma(baseHex).hsl();
3750
- const splitH = (h + 210) % 360;
3751
- return chroma.hsl(splitH, s, l).hex();
3752
- }
3753
- __name(generateSplitComplementaryColor2, "generateSplitComplementaryColor2");
3754
- function generateTetradicColors(baseHex) {
3755
- const [h, s, l] = chroma(baseHex).hsl();
3756
- return [
3757
- chroma.hsl((h + 90) % 360, s, l).hex(),
3758
- chroma.hsl((h + 180) % 360, s, l).hex(),
3759
- chroma.hsl((h + 270) % 360, s, l).hex()
3760
- ];
3761
- }
3762
- __name(generateTetradicColors, "generateTetradicColors");
3763
- function generateTetradicColor1(baseHex) {
3764
- const [h, s, l] = chroma(baseHex).hsl();
3765
- return chroma.hsl((h + 90) % 360, s, l).hex();
3766
- }
3767
- __name(generateTetradicColor1, "generateTetradicColor1");
3768
- function generateTetradicColor3(baseHex) {
3769
- const [h, s, l] = chroma(baseHex).hsl();
3770
- return chroma.hsl((h + 270) % 360, s, l).hex();
3771
- }
3772
- __name(generateTetradicColor3, "generateTetradicColor3");
3912
+ // src/Theming/Utils/ThemeMode.ts
3913
+ var THEME_MODES = [
3914
+ "dark",
3915
+ "light"
3916
+ ];
3773
3917
 
3774
- // src/Colors/generators/triadic.ts
3775
- function generateTriadicPalette(baseHex, adjustment) {
3776
- const baseHSL = hexToHSL(baseHex);
3777
- const triadicHSL = adjustHue(baseHSL, adjustment);
3778
- const palette = {};
3779
- const steps = [
3780
- 0,
3781
- 50,
3782
- 100,
3783
- 200,
3784
- 300,
3785
- 400,
3786
- 500,
3787
- 600,
3788
- 700,
3789
- 800,
3790
- 900
3918
+ // src/Theming/Utils/ThemeScheme.ts
3919
+ (function(ThemeScheme2) {
3920
+ const ROLES = [
3921
+ "surface",
3922
+ "background",
3923
+ "foreground",
3924
+ "highlight",
3925
+ "middlelight",
3926
+ "lowlight",
3927
+ "transparent",
3928
+ "semiTransparent",
3929
+ "disabled",
3930
+ "contrast",
3931
+ "selection"
3791
3932
  ];
3792
- steps.forEach((step) => {
3793
- let [h, s, l] = triadicHSL;
3794
- if (step === 0) {
3795
- l = 1;
3796
- } else {
3797
- l = 1 - step / 1e3;
3933
+ function isRole(value) {
3934
+ return ROLES.includes(value);
3935
+ }
3936
+ __name(isRole, "isRole");
3937
+ function isThemeScheme(value) {
3938
+ if (typeof value !== "object" || value === null) {
3939
+ return false;
3798
3940
  }
3799
- palette[`${step}`] = hslToHex(h, s, Math.max(0, Math.min(1, l)));
3800
- });
3801
- return palette;
3802
- }
3803
- __name(generateTriadicPalette, "generateTriadicPalette");
3804
- function generateTriadicColor(baseHex, adjustment) {
3805
- const baseHSL = hexToHSL(baseHex);
3806
- const triadicHSL = adjustHue(baseHSL, adjustment);
3807
- const [h, s] = triadicHSL;
3808
- return hslToHex(h, s, 0.5);
3809
- }
3810
- __name(generateTriadicColor, "generateTriadicColor");
3811
-
3812
- // src/Colors/index.ts
3813
- (function(Colors2) {
3814
- Colors2.toDarken = darken;
3815
- Colors2.toLighten = lighten;
3816
- Colors2.toMaterialPalette = generateMaterialPalette;
3817
- Colors2.toComplementaryPalette = generateComplementaryPalette;
3818
- Colors2.toComplementaryColor = generateComplementaryColor;
3819
- Colors2.toAnalogousPalette = generateAnalogousPalette;
3820
- Colors2.toAnalogousColor = generateAnalogousColor;
3821
- Colors2.toTriadicPalette = generateTriadicPalette;
3822
- Colors2.toTriadicColor = generateTriadicColor;
3823
- Colors2.toSplitComplementaryColors = generateSplitComplementaryColors;
3824
- Colors2.toSplitComplementaryColor1 = generateSplitComplementaryColor1;
3825
- Colors2.toSplitComplementaryColor2 = generateSplitComplementaryColor2;
3826
- Colors2.toTetradicColors = generateTetradicColors;
3827
- Colors2.toTetradicColor1 = generateTetradicColor1;
3828
- Colors2.toTetradicColor3 = generateTetradicColor3;
3829
- })(Colors || (Colors = {}));
3830
- var Colors;
3941
+ return Object.entries(value).every(([key, color]) => isRole(key) && typeof color === "string");
3942
+ }
3943
+ __name(isThemeScheme, "isThemeScheme");
3944
+ ThemeScheme2.isThemeScheme = isThemeScheme;
3945
+ })(ThemeScheme || (ThemeScheme = {}));
3946
+ var ThemeScheme;
3831
3947
 
3832
- export { BrowserPlatformAdapter, Colors, CosmopolitanTheme, CosmopolitanThemeGeneratorStrategy, CssAspectRatio, CssColor, CssLength, CssShadow, CssTime, ITheme, JoyTheme, JoyThemeGeneratorStrategy, MaterialThemeGeneratorStrategy, MemphisTheme, MemphisThemeGeneratorStrategy, NodePlatformAdapter, PlatformAdapterFactory, THEME_MODES, TailwindThemeGeneratorStrategy, ThemeGenerator, ThemeGeneratorServiceLocator, ThemeObserver, ThemeObserverServiceLocator, ThemePalette, ThemeScheme, createCosmopolitanTheme, createJoyTheme, createMaterialTheme, createMemphisTheme, createTailwindTheme };
3948
+ export { BrowserPlatformAdapter, Colors, CosmopolitanTheme, CosmopolitanThemeGeneratorStrategy, CssAspectRatio, CssColor, CssLength, CssShadow, CssTime, HslThemeGeneratorStrategy, ITheme, JoyTheme, JoyThemeGeneratorStrategy, LchThemeGeneratorStrategy, MemphisTheme, MemphisThemeGeneratorStrategy, NodePlatformAdapter, PlatformAdapterFactory, THEME_MODES, ThemeGenerator, ThemeGeneratorServiceLocator, ThemeObserver, ThemeObserverServiceLocator, ThemePalette, ThemeScheme, createCosmopolitanTheme, createJoyTheme, createMemphisTheme };
3833
3949
  //# sourceMappingURL=index.js.map
3834
3950
  //# sourceMappingURL=index.js.map