phaser-wind 0.6.0 → 0.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -3
- package/dist/phaser-wind.js +1228 -0
- package/dist/phaser-wind.min.js +1 -0
- package/dist/theme/theme-manager.d.ts.map +1 -1
- package/dist/theme/theme-manager.js +1 -1
- package/dist/theme/theme-manager.js.map +1 -1
- package/dist/utils/__tests__/merge.test.d.ts +2 -0
- package/dist/utils/__tests__/merge.test.d.ts.map +1 -0
- package/dist/utils/__tests__/merge.test.js +433 -0
- package/dist/utils/__tests__/merge.test.js.map +1 -0
- package/dist/utils/index.d.ts +2 -1
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/index.js +2 -1
- package/dist/utils/index.js.map +1 -1
- package/dist/utils/merge.d.ts +24 -0
- package/dist/utils/merge.d.ts.map +1 -0
- package/dist/utils/merge.js +79 -0
- package/dist/utils/merge.js.map +1 -0
- package/package.json +9 -3
|
@@ -0,0 +1,1228 @@
|
|
|
1
|
+
(function (global, factory) {
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('phaser')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define(['exports', 'phaser'], factory) :
|
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.PhaserWind = {}, global.Phaser));
|
|
5
|
+
})(this, (function (exports, phaser) { 'use strict';
|
|
6
|
+
|
|
7
|
+
/******************************************************************************
|
|
8
|
+
Copyright (c) Microsoft Corporation.
|
|
9
|
+
|
|
10
|
+
Permission to use, copy, modify, and/or distribute this software for any
|
|
11
|
+
purpose with or without fee is hereby granted.
|
|
12
|
+
|
|
13
|
+
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
|
14
|
+
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
|
15
|
+
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
|
16
|
+
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
|
17
|
+
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
18
|
+
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
19
|
+
PERFORMANCE OF THIS SOFTWARE.
|
|
20
|
+
***************************************************************************** */
|
|
21
|
+
/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
|
|
22
|
+
|
|
23
|
+
var extendStatics = function(d, b) {
|
|
24
|
+
extendStatics = Object.setPrototypeOf ||
|
|
25
|
+
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
26
|
+
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
|
|
27
|
+
return extendStatics(d, b);
|
|
28
|
+
};
|
|
29
|
+
|
|
30
|
+
function __extends(d, b) {
|
|
31
|
+
if (typeof b !== "function" && b !== null)
|
|
32
|
+
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
33
|
+
extendStatics(d, b);
|
|
34
|
+
function __() { this.constructor = d; }
|
|
35
|
+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
var __assign = function() {
|
|
39
|
+
__assign = Object.assign || function __assign(t) {
|
|
40
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
41
|
+
s = arguments[i];
|
|
42
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
43
|
+
}
|
|
44
|
+
return t;
|
|
45
|
+
};
|
|
46
|
+
return __assign.apply(this, arguments);
|
|
47
|
+
};
|
|
48
|
+
|
|
49
|
+
function __spreadArray(to, from, pack) {
|
|
50
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
51
|
+
if (ar || !(i in from)) {
|
|
52
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
53
|
+
ar[i] = from[i];
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
|
|
60
|
+
var e = new Error(message);
|
|
61
|
+
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
62
|
+
};
|
|
63
|
+
|
|
64
|
+
/**
|
|
65
|
+
* Deep merge utility function that recursively merges objects
|
|
66
|
+
* Similar to lodash.merge but implemented natively
|
|
67
|
+
*/
|
|
68
|
+
/**
|
|
69
|
+
* Checks if a value is a plain object (not array, null, or other types)
|
|
70
|
+
*/
|
|
71
|
+
var isPlainObject = function (value) {
|
|
72
|
+
return (value !== null &&
|
|
73
|
+
typeof value === 'object' &&
|
|
74
|
+
!Array.isArray(value) &&
|
|
75
|
+
Object.prototype.toString.call(value) === '[object Object]');
|
|
76
|
+
};
|
|
77
|
+
/**
|
|
78
|
+
* Deep clone utility function that creates new references for all nested objects
|
|
79
|
+
* @param obj - The object to clone
|
|
80
|
+
* @returns A deep clone of the object with new references
|
|
81
|
+
*/
|
|
82
|
+
var deepClone = function (obj) {
|
|
83
|
+
if (obj === null || typeof obj !== 'object') {
|
|
84
|
+
return obj;
|
|
85
|
+
}
|
|
86
|
+
if (Array.isArray(obj)) {
|
|
87
|
+
return obj.map(function (item) { return deepClone(item); });
|
|
88
|
+
}
|
|
89
|
+
if (isPlainObject(obj)) {
|
|
90
|
+
var cloned = {};
|
|
91
|
+
for (var key in obj) {
|
|
92
|
+
if (Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
93
|
+
cloned[key] = deepClone(obj[key]);
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
return cloned;
|
|
97
|
+
}
|
|
98
|
+
return obj;
|
|
99
|
+
};
|
|
100
|
+
/**
|
|
101
|
+
* Deep merge multiple objects into the first one
|
|
102
|
+
* @param target - The target object to merge into
|
|
103
|
+
* @param sources - Source objects to merge from
|
|
104
|
+
* @returns The merged object
|
|
105
|
+
*/
|
|
106
|
+
var merge = function (target) {
|
|
107
|
+
var sources = [];
|
|
108
|
+
for (var _i = 1; _i < arguments.length; _i++) {
|
|
109
|
+
sources[_i - 1] = arguments[_i];
|
|
110
|
+
}
|
|
111
|
+
if (!isPlainObject(target)) {
|
|
112
|
+
return target;
|
|
113
|
+
}
|
|
114
|
+
// Start with a deep clone of the target
|
|
115
|
+
var result = deepClone(target);
|
|
116
|
+
for (var _a = 0, sources_1 = sources; _a < sources_1.length; _a++) {
|
|
117
|
+
var source = sources_1[_a];
|
|
118
|
+
if (!isPlainObject(source)) {
|
|
119
|
+
continue;
|
|
120
|
+
}
|
|
121
|
+
// Deep clone the source to ensure we create new references
|
|
122
|
+
var clonedSource = deepClone(source);
|
|
123
|
+
for (var key in clonedSource) {
|
|
124
|
+
if (Object.prototype.hasOwnProperty.call(clonedSource, key)) {
|
|
125
|
+
var sourceValue = clonedSource[key];
|
|
126
|
+
var targetValue = result[key];
|
|
127
|
+
if (isPlainObject(sourceValue) && isPlainObject(targetValue)) {
|
|
128
|
+
result[key] = merge(targetValue, sourceValue);
|
|
129
|
+
}
|
|
130
|
+
else if (sourceValue !== undefined) {
|
|
131
|
+
result[key] = sourceValue;
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
}
|
|
136
|
+
return result;
|
|
137
|
+
};
|
|
138
|
+
/**
|
|
139
|
+
* Deep merge that creates a new object without mutating the original
|
|
140
|
+
* @param target - The target object
|
|
141
|
+
* @param sources - Source objects to merge from
|
|
142
|
+
* @returns A new merged object
|
|
143
|
+
*/
|
|
144
|
+
var mergeDeep = function (target) {
|
|
145
|
+
var sources = [];
|
|
146
|
+
for (var _i = 1; _i < arguments.length; _i++) {
|
|
147
|
+
sources[_i - 1] = arguments[_i];
|
|
148
|
+
}
|
|
149
|
+
return merge.apply(void 0, __spreadArray([{}, target], sources, false));
|
|
150
|
+
};
|
|
151
|
+
|
|
152
|
+
/* eslint-disable security/detect-unsafe-regex */
|
|
153
|
+
/**
|
|
154
|
+
* Checks if a string is a valid CSS color value
|
|
155
|
+
* @param color - The color string to validate
|
|
156
|
+
* @returns True if the color string is valid, false otherwise
|
|
157
|
+
*
|
|
158
|
+
* Supports the following formats:
|
|
159
|
+
* - Hex colors (#RRGGBB or #RGB)
|
|
160
|
+
* - RGB colors (rgb(r, g, b))
|
|
161
|
+
* - RGBA colors (rgba(r, g, b, a))
|
|
162
|
+
* - OKLCH colors (oklch(l c h [/ a]))
|
|
163
|
+
*/
|
|
164
|
+
var isValidColor = function (color) {
|
|
165
|
+
if (typeof color !== 'string') {
|
|
166
|
+
return false;
|
|
167
|
+
}
|
|
168
|
+
var trimmedColor = color.trim();
|
|
169
|
+
if (/^#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})$/.test(trimmedColor)) {
|
|
170
|
+
return true;
|
|
171
|
+
}
|
|
172
|
+
if (/^rgb\(\s*(\d{1,3}%?)\s*,\s*(\d{1,3}%?)\s*,\s*(\d{1,3}%?)\s*\)$/.test(trimmedColor)) {
|
|
173
|
+
return true;
|
|
174
|
+
}
|
|
175
|
+
if (/^rgba\(\s*(\d{1,3}%?)\s*,\s*(\d{1,3}%?)\s*,\s*(\d{1,3}%?)\s*,\s*([01]|0?\.\d+)\s*\)$/.test(trimmedColor)) {
|
|
176
|
+
return true;
|
|
177
|
+
}
|
|
178
|
+
if (/^oklch\(\s*(\d*\.?\d+%?)\s+(\d*\.?\d+)\s+(\d*\.?\d+)(?:\s*\/\s*([01]|0?\.\d+))?\s*\)$/.test(trimmedColor)) {
|
|
179
|
+
return true;
|
|
180
|
+
}
|
|
181
|
+
return false;
|
|
182
|
+
};
|
|
183
|
+
|
|
184
|
+
// https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/compat/colors.ts
|
|
185
|
+
var palette = {
|
|
186
|
+
black: '#000',
|
|
187
|
+
white: '#fff',
|
|
188
|
+
slate: {
|
|
189
|
+
'50': 'rgb(248, 250, 252)',
|
|
190
|
+
'100': 'rgb(241, 245, 249)',
|
|
191
|
+
'200': 'rgb(226, 232, 240)',
|
|
192
|
+
'300': 'rgb(203, 213, 225)',
|
|
193
|
+
'400': 'rgb(148, 163, 184)',
|
|
194
|
+
'500': 'rgb(100, 116, 139)',
|
|
195
|
+
'600': 'rgb(71, 85, 105)',
|
|
196
|
+
'700': 'rgb(51, 65, 85)',
|
|
197
|
+
'800': 'rgb(30, 41, 59)',
|
|
198
|
+
'900': 'rgb(15, 23, 42)',
|
|
199
|
+
'950': 'rgb(2, 6, 23)',
|
|
200
|
+
},
|
|
201
|
+
gray: {
|
|
202
|
+
'50': 'rgb(249, 250, 251)',
|
|
203
|
+
'100': 'rgb(243, 244, 246)',
|
|
204
|
+
'200': 'rgb(229, 231, 235)',
|
|
205
|
+
'300': 'rgb(209, 213, 219)',
|
|
206
|
+
'400': 'rgb(156, 163, 175)',
|
|
207
|
+
'500': 'rgb(107, 114, 128)',
|
|
208
|
+
'600': 'rgb(75, 85, 99)',
|
|
209
|
+
'700': 'rgb(55, 65, 81)',
|
|
210
|
+
'800': 'rgb(31, 41, 55)',
|
|
211
|
+
'900': 'rgb(17, 24, 39)',
|
|
212
|
+
'950': 'rgb(3, 7, 18)',
|
|
213
|
+
},
|
|
214
|
+
zinc: {
|
|
215
|
+
'50': 'rgb(250, 250, 250)',
|
|
216
|
+
'100': 'rgb(244, 244, 245)',
|
|
217
|
+
'200': 'rgb(228, 228, 231)',
|
|
218
|
+
'300': 'rgb(212, 212, 216)',
|
|
219
|
+
'400': 'rgb(161, 161, 170)',
|
|
220
|
+
'500': 'rgb(113, 113, 122)',
|
|
221
|
+
'600': 'rgb(82, 82, 91)',
|
|
222
|
+
'700': 'rgb(63, 63, 70)',
|
|
223
|
+
'800': 'rgb(39, 39, 42)',
|
|
224
|
+
'900': 'rgb(24, 24, 27)',
|
|
225
|
+
'950': 'rgb(9, 9, 11)',
|
|
226
|
+
},
|
|
227
|
+
neutral: {
|
|
228
|
+
'50': 'rgb(250, 250, 250)',
|
|
229
|
+
'100': 'rgb(245, 245, 245)',
|
|
230
|
+
'200': 'rgb(229, 229, 229)',
|
|
231
|
+
'300': 'rgb(212, 212, 212)',
|
|
232
|
+
'400': 'rgb(163, 163, 163)',
|
|
233
|
+
'500': 'rgb(115, 115, 115)',
|
|
234
|
+
'600': 'rgb(82, 82, 82)',
|
|
235
|
+
'700': 'rgb(64, 64, 64)',
|
|
236
|
+
'800': 'rgb(38, 38, 38)',
|
|
237
|
+
'900': 'rgb(23, 23, 23)',
|
|
238
|
+
'950': 'rgb(10, 10, 10)',
|
|
239
|
+
},
|
|
240
|
+
stone: {
|
|
241
|
+
'50': 'rgb(250, 250, 249)',
|
|
242
|
+
'100': 'rgb(245, 245, 244)',
|
|
243
|
+
'200': 'rgb(231, 229, 228)',
|
|
244
|
+
'300': 'rgb(214, 211, 209)',
|
|
245
|
+
'400': 'rgb(168, 162, 158)',
|
|
246
|
+
'500': 'rgb(120, 113, 108)',
|
|
247
|
+
'600': 'rgb(87, 83, 78)',
|
|
248
|
+
'700': 'rgb(68, 64, 60)',
|
|
249
|
+
'800': 'rgb(41, 37, 36)',
|
|
250
|
+
'900': 'rgb(28, 25, 23)',
|
|
251
|
+
'950': 'rgb(12, 10, 9)',
|
|
252
|
+
},
|
|
253
|
+
red: {
|
|
254
|
+
'50': 'rgb(254, 242, 242)',
|
|
255
|
+
'100': 'rgb(254, 226, 226)',
|
|
256
|
+
'200': 'rgb(254, 202, 202)',
|
|
257
|
+
'300': 'rgb(252, 165, 165)',
|
|
258
|
+
'400': 'rgb(248, 113, 113)',
|
|
259
|
+
'500': 'rgb(239, 68, 68)',
|
|
260
|
+
'600': 'rgb(220, 38, 38)',
|
|
261
|
+
'700': 'rgb(185, 28, 28)',
|
|
262
|
+
'800': 'rgb(153, 27, 27)',
|
|
263
|
+
'900': 'rgb(127, 29, 29)',
|
|
264
|
+
'950': 'rgb(69, 10, 10)',
|
|
265
|
+
},
|
|
266
|
+
orange: {
|
|
267
|
+
'50': 'rgb(255, 247, 237)',
|
|
268
|
+
'100': 'rgb(255, 237, 213)',
|
|
269
|
+
'200': 'rgb(254, 215, 170)',
|
|
270
|
+
'300': 'rgb(253, 186, 116)',
|
|
271
|
+
'400': 'rgb(251, 146, 60)',
|
|
272
|
+
'500': 'rgb(249, 115, 22)',
|
|
273
|
+
'600': 'rgb(234, 88, 12)',
|
|
274
|
+
'700': 'rgb(194, 65, 12)',
|
|
275
|
+
'800': 'rgb(154, 52, 18)',
|
|
276
|
+
'900': 'rgb(124, 45, 18)',
|
|
277
|
+
'950': 'rgb(67, 20, 7)',
|
|
278
|
+
},
|
|
279
|
+
amber: {
|
|
280
|
+
'50': 'rgb(255, 251, 235)',
|
|
281
|
+
'100': 'rgb(254, 243, 199)',
|
|
282
|
+
'200': 'rgb(253, 230, 138)',
|
|
283
|
+
'300': 'rgb(252, 211, 77)',
|
|
284
|
+
'400': 'rgb(251, 191, 36)',
|
|
285
|
+
'500': 'rgb(245, 158, 11)',
|
|
286
|
+
'600': 'rgb(217, 119, 6)',
|
|
287
|
+
'700': 'rgb(180, 83, 9)',
|
|
288
|
+
'800': 'rgb(146, 64, 14)',
|
|
289
|
+
'900': 'rgb(120, 53, 15)',
|
|
290
|
+
'950': 'rgb(69, 26, 3)',
|
|
291
|
+
},
|
|
292
|
+
yellow: {
|
|
293
|
+
'50': 'rgb(254, 252, 232)',
|
|
294
|
+
'100': 'rgb(254, 249, 195)',
|
|
295
|
+
'200': 'rgb(254, 240, 138)',
|
|
296
|
+
'300': 'rgb(253, 224, 71)',
|
|
297
|
+
'400': 'rgb(250, 204, 21)',
|
|
298
|
+
'500': 'rgb(234, 179, 8)',
|
|
299
|
+
'600': 'rgb(202, 138, 4)',
|
|
300
|
+
'700': 'rgb(161, 98, 7)',
|
|
301
|
+
'800': 'rgb(133, 77, 14)',
|
|
302
|
+
'900': 'rgb(113, 63, 18)',
|
|
303
|
+
'950': 'rgb(66, 32, 6)',
|
|
304
|
+
},
|
|
305
|
+
lime: {
|
|
306
|
+
'50': 'rgb(247, 254, 231)',
|
|
307
|
+
'100': 'rgb(236, 252, 203)',
|
|
308
|
+
'200': 'rgb(217, 249, 157)',
|
|
309
|
+
'300': 'rgb(190, 242, 100)',
|
|
310
|
+
'400': 'rgb(163, 230, 53)',
|
|
311
|
+
'500': 'rgb(132, 204, 22)',
|
|
312
|
+
'600': 'rgb(101, 163, 13)',
|
|
313
|
+
'700': 'rgb(77, 124, 15)',
|
|
314
|
+
'800': 'rgb(63, 98, 18)',
|
|
315
|
+
'900': 'rgb(54, 83, 20)',
|
|
316
|
+
'950': 'rgb(26, 46, 5)',
|
|
317
|
+
},
|
|
318
|
+
green: {
|
|
319
|
+
'50': 'rgb(240, 253, 244)',
|
|
320
|
+
'100': 'rgb(220, 252, 231)',
|
|
321
|
+
'200': 'rgb(187, 247, 208)',
|
|
322
|
+
'300': 'rgb(134, 239, 172)',
|
|
323
|
+
'400': 'rgb(74, 222, 128)',
|
|
324
|
+
'500': 'rgb(34, 197, 94)',
|
|
325
|
+
'600': 'rgb(22, 163, 74)',
|
|
326
|
+
'700': 'rgb(21, 128, 61)',
|
|
327
|
+
'800': 'rgb(22, 101, 52)',
|
|
328
|
+
'900': 'rgb(20, 83, 45)',
|
|
329
|
+
'950': 'rgb(5, 46, 22)',
|
|
330
|
+
},
|
|
331
|
+
emerald: {
|
|
332
|
+
'50': 'rgb(236, 253, 245)',
|
|
333
|
+
'100': 'rgb(209, 250, 229)',
|
|
334
|
+
'200': 'rgb(167, 243, 208)',
|
|
335
|
+
'300': 'rgb(110, 231, 183)',
|
|
336
|
+
'400': 'rgb(52, 211, 153)',
|
|
337
|
+
'500': 'rgb(16, 185, 129)',
|
|
338
|
+
'600': 'rgb(5, 150, 105)',
|
|
339
|
+
'700': 'rgb(4, 120, 87)',
|
|
340
|
+
'800': 'rgb(6, 95, 70)',
|
|
341
|
+
'900': 'rgb(6, 78, 59)',
|
|
342
|
+
'950': 'rgb(2, 44, 34)',
|
|
343
|
+
},
|
|
344
|
+
teal: {
|
|
345
|
+
'50': 'rgb(240, 253, 250)',
|
|
346
|
+
'100': 'rgb(204, 251, 241)',
|
|
347
|
+
'200': 'rgb(153, 246, 228)',
|
|
348
|
+
'300': 'rgb(94, 234, 212)',
|
|
349
|
+
'400': 'rgb(45, 212, 191)',
|
|
350
|
+
'500': 'rgb(20, 184, 166)',
|
|
351
|
+
'600': 'rgb(13, 148, 136)',
|
|
352
|
+
'700': 'rgb(15, 118, 110)',
|
|
353
|
+
'800': 'rgb(17, 94, 89)',
|
|
354
|
+
'900': 'rgb(19, 78, 74)',
|
|
355
|
+
'950': 'rgb(4, 47, 46)',
|
|
356
|
+
},
|
|
357
|
+
cyan: {
|
|
358
|
+
'50': 'rgb(236, 254, 255)',
|
|
359
|
+
'100': 'rgb(207, 250, 254)',
|
|
360
|
+
'200': 'rgb(165, 243, 252)',
|
|
361
|
+
'300': 'rgb(103, 232, 249)',
|
|
362
|
+
'400': 'rgb(34, 211, 238)',
|
|
363
|
+
'500': 'rgb(6, 182, 212)',
|
|
364
|
+
'600': 'rgb(8, 145, 178)',
|
|
365
|
+
'700': 'rgb(14, 116, 144)',
|
|
366
|
+
'800': 'rgb(21, 94, 117)',
|
|
367
|
+
'900': 'rgb(22, 78, 99)',
|
|
368
|
+
'950': 'rgb(8, 51, 68)',
|
|
369
|
+
},
|
|
370
|
+
sky: {
|
|
371
|
+
'50': 'rgb(240, 249, 255)',
|
|
372
|
+
'100': 'rgb(224, 242, 254)',
|
|
373
|
+
'200': 'rgb(186, 230, 253)',
|
|
374
|
+
'300': 'rgb(125, 211, 252)',
|
|
375
|
+
'400': 'rgb(56, 189, 248)',
|
|
376
|
+
'500': 'rgb(14, 165, 233)',
|
|
377
|
+
'600': 'rgb(2, 132, 199)',
|
|
378
|
+
'700': 'rgb(3, 105, 161)',
|
|
379
|
+
'800': 'rgb(7, 89, 133)',
|
|
380
|
+
'900': 'rgb(12, 74, 110)',
|
|
381
|
+
'950': 'rgb(8, 47, 73)',
|
|
382
|
+
},
|
|
383
|
+
blue: {
|
|
384
|
+
'50': 'rgb(239, 246, 255)',
|
|
385
|
+
'100': 'rgb(219, 234, 254)',
|
|
386
|
+
'200': 'rgb(191, 219, 254)',
|
|
387
|
+
'300': 'rgb(147, 197, 253)',
|
|
388
|
+
'400': 'rgb(96, 165, 250)',
|
|
389
|
+
'500': 'rgb(59, 130, 246)',
|
|
390
|
+
'600': 'rgb(37, 99, 235)',
|
|
391
|
+
'700': 'rgb(29, 78, 216)',
|
|
392
|
+
'800': 'rgb(30, 64, 175)',
|
|
393
|
+
'900': 'rgb(30, 58, 138)',
|
|
394
|
+
'950': 'rgb(23, 37, 84)',
|
|
395
|
+
},
|
|
396
|
+
indigo: {
|
|
397
|
+
'50': 'rgb(238, 242, 255)',
|
|
398
|
+
'100': 'rgb(224, 231, 255)',
|
|
399
|
+
'200': 'rgb(199, 210, 254)',
|
|
400
|
+
'300': 'rgb(165, 180, 252)',
|
|
401
|
+
'400': 'rgb(129, 140, 248)',
|
|
402
|
+
'500': 'rgb(99, 102, 241)',
|
|
403
|
+
'600': 'rgb(79, 70, 229)',
|
|
404
|
+
'700': 'rgb(67, 56, 202)',
|
|
405
|
+
'800': 'rgb(55, 48, 163)',
|
|
406
|
+
'900': 'rgb(49, 46, 129)',
|
|
407
|
+
'950': 'rgb(30, 27, 75)',
|
|
408
|
+
},
|
|
409
|
+
violet: {
|
|
410
|
+
'50': 'rgb(245, 243, 255)',
|
|
411
|
+
'100': 'rgb(237, 233, 254)',
|
|
412
|
+
'200': 'rgb(221, 214, 254)',
|
|
413
|
+
'300': 'rgb(196, 181, 253)',
|
|
414
|
+
'400': 'rgb(167, 139, 250)',
|
|
415
|
+
'500': 'rgb(139, 92, 246)',
|
|
416
|
+
'600': 'rgb(124, 58, 237)',
|
|
417
|
+
'700': 'rgb(109, 40, 217)',
|
|
418
|
+
'800': 'rgb(91, 33, 182)',
|
|
419
|
+
'900': 'rgb(76, 29, 149)',
|
|
420
|
+
'950': 'rgb(46, 16, 101)',
|
|
421
|
+
},
|
|
422
|
+
purple: {
|
|
423
|
+
'50': 'rgb(250, 245, 255)',
|
|
424
|
+
'100': 'rgb(243, 232, 255)',
|
|
425
|
+
'200': 'rgb(233, 213, 255)',
|
|
426
|
+
'300': 'rgb(216, 180, 254)',
|
|
427
|
+
'400': 'rgb(192, 132, 252)',
|
|
428
|
+
'500': 'rgb(168, 85, 247)',
|
|
429
|
+
'600': 'rgb(147, 51, 234)',
|
|
430
|
+
'700': 'rgb(126, 34, 206)',
|
|
431
|
+
'800': 'rgb(107, 33, 168)',
|
|
432
|
+
'900': 'rgb(88, 28, 135)',
|
|
433
|
+
'950': 'rgb(59, 7, 100)',
|
|
434
|
+
},
|
|
435
|
+
fuchsia: {
|
|
436
|
+
'50': 'rgb(253, 244, 255)',
|
|
437
|
+
'100': 'rgb(250, 232, 255)',
|
|
438
|
+
'200': 'rgb(245, 208, 254)',
|
|
439
|
+
'300': 'rgb(240, 171, 252)',
|
|
440
|
+
'400': 'rgb(232, 121, 249)',
|
|
441
|
+
'500': 'rgb(217, 70, 239)',
|
|
442
|
+
'600': 'rgb(192, 38, 211)',
|
|
443
|
+
'700': 'rgb(162, 28, 175)',
|
|
444
|
+
'800': 'rgb(134, 25, 143)',
|
|
445
|
+
'900': 'rgb(112, 26, 117)',
|
|
446
|
+
'950': 'rgb(74, 4, 78)',
|
|
447
|
+
},
|
|
448
|
+
pink: {
|
|
449
|
+
'50': 'rgb(253, 242, 248)',
|
|
450
|
+
'100': 'rgb(252, 231, 243)',
|
|
451
|
+
'200': 'rgb(251, 207, 232)',
|
|
452
|
+
'300': 'rgb(249, 168, 212)',
|
|
453
|
+
'400': 'rgb(244, 114, 182)',
|
|
454
|
+
'500': 'rgb(236, 72, 153)',
|
|
455
|
+
'600': 'rgb(219, 39, 119)',
|
|
456
|
+
'700': 'rgb(190, 24, 93)',
|
|
457
|
+
'800': 'rgb(157, 23, 77)',
|
|
458
|
+
'900': 'rgb(131, 24, 67)',
|
|
459
|
+
'950': 'rgb(80, 7, 36)',
|
|
460
|
+
},
|
|
461
|
+
rose: {
|
|
462
|
+
'50': 'rgb(255, 241, 242)',
|
|
463
|
+
'100': 'rgb(255, 228, 230)',
|
|
464
|
+
'200': 'rgb(254, 205, 211)',
|
|
465
|
+
'300': 'rgb(253, 164, 175)',
|
|
466
|
+
'400': 'rgb(251, 113, 133)',
|
|
467
|
+
'500': 'rgb(244, 63, 94)',
|
|
468
|
+
'600': 'rgb(225, 29, 72)',
|
|
469
|
+
'700': 'rgb(190, 18, 60)',
|
|
470
|
+
'800': 'rgb(159, 18, 57)',
|
|
471
|
+
'900': 'rgb(136, 19, 55)',
|
|
472
|
+
'950': 'rgb(76, 5, 25)',
|
|
473
|
+
},
|
|
474
|
+
};
|
|
475
|
+
|
|
476
|
+
/** Regular expression to match RGB color format */
|
|
477
|
+
var RGB_REGEX = /rgb\((\d+),\s*(\d+),\s*(\d+)\)/;
|
|
478
|
+
/**
|
|
479
|
+
* Convert hex color value to number
|
|
480
|
+
* @param hexValue - Hex color value (e.g., '#ff0000')
|
|
481
|
+
* @returns Number representation of hex color
|
|
482
|
+
*/
|
|
483
|
+
var convertHexToNumber = function (hexValue) {
|
|
484
|
+
var hex = hexValue.slice(1);
|
|
485
|
+
if (hex.length === 3) {
|
|
486
|
+
var r = parseInt(hex[0] + hex[0], 16);
|
|
487
|
+
var g = parseInt(hex[1] + hex[1], 16);
|
|
488
|
+
var b = parseInt(hex[2] + hex[2], 16);
|
|
489
|
+
return (r << 16) + (g << 8) + b;
|
|
490
|
+
}
|
|
491
|
+
return parseInt(hex, 16);
|
|
492
|
+
};
|
|
493
|
+
/**
|
|
494
|
+
* Convert RGB color value to number
|
|
495
|
+
* @param rgbValue - RGB color value (e.g., 'rgb(255, 0, 0)')
|
|
496
|
+
* @returns Number representation of RGB color
|
|
497
|
+
* @throws {Error} If RGB format is invalid
|
|
498
|
+
*/
|
|
499
|
+
var convertRgbToNumber = function (rgbValue) {
|
|
500
|
+
var matches = rgbValue.match(RGB_REGEX);
|
|
501
|
+
if (!matches) {
|
|
502
|
+
throw new Error("Invalid RGB format: ".concat(rgbValue));
|
|
503
|
+
}
|
|
504
|
+
var r = parseInt(matches[1]);
|
|
505
|
+
var g = parseInt(matches[2]);
|
|
506
|
+
var b = parseInt(matches[3]);
|
|
507
|
+
return (r << 16) + (g << 8) + b;
|
|
508
|
+
};
|
|
509
|
+
/**
|
|
510
|
+
* Convert color value to number
|
|
511
|
+
* @param colorValue - Color value (e.g., '#ff0000' or 'rgb(255, 0, 0)')
|
|
512
|
+
* @returns Number representation of color
|
|
513
|
+
*/
|
|
514
|
+
var convertColorValueToNumber = function (colorValue) {
|
|
515
|
+
if (colorValue.startsWith('#')) {
|
|
516
|
+
return convertHexToNumber(colorValue);
|
|
517
|
+
}
|
|
518
|
+
return convertRgbToNumber(colorValue);
|
|
519
|
+
};
|
|
520
|
+
/**
|
|
521
|
+
* Factory that creates a color utility API based on the provided theme colors
|
|
522
|
+
* @param themeColors - Theme colors configuration
|
|
523
|
+
* @returns Color utility API instance
|
|
524
|
+
*/
|
|
525
|
+
/**
|
|
526
|
+
* Create a color API bound to an optional theme colors map.
|
|
527
|
+
* If a key exists in `themeColors`, it will be resolved to a palette token and then to RGB/Hex.
|
|
528
|
+
*
|
|
529
|
+
* @typeParam T - Theme colors map
|
|
530
|
+
* @param themeColors - Optional map of theme color tokens
|
|
531
|
+
* @example
|
|
532
|
+
* const c = createColor({ primary: 'blue-500' });
|
|
533
|
+
* c.rgb('primary'); // rgb(59, 130, 246)
|
|
534
|
+
*/
|
|
535
|
+
var createColor = function (themeColors) {
|
|
536
|
+
/**
|
|
537
|
+
* Get color value from theme configuration
|
|
538
|
+
* @param key - Color token or theme color key
|
|
539
|
+
* @returns Color value from theme or null if not found
|
|
540
|
+
*/
|
|
541
|
+
var getValueFromTheme = function (key) {
|
|
542
|
+
if (themeColors && key in themeColors) {
|
|
543
|
+
return themeColors[key];
|
|
544
|
+
}
|
|
545
|
+
return null;
|
|
546
|
+
};
|
|
547
|
+
/**
|
|
548
|
+
* Get RGB string representation of a color
|
|
549
|
+
* @param color - Color token, theme color key or valid color string
|
|
550
|
+
* @returns RGB color string
|
|
551
|
+
* @throws {Error} If color token is not found
|
|
552
|
+
*/
|
|
553
|
+
var rgb = function (color) {
|
|
554
|
+
var _a;
|
|
555
|
+
// Runtime supports direct CSS strings for flexibility, but
|
|
556
|
+
// the public type restricts to palette tokens or theme keys.
|
|
557
|
+
if (typeof color === 'string' && isValidColor(color)) {
|
|
558
|
+
return color;
|
|
559
|
+
}
|
|
560
|
+
var colorFromTheme = getValueFromTheme(color);
|
|
561
|
+
if (colorFromTheme) {
|
|
562
|
+
return rgb(colorFromTheme);
|
|
563
|
+
}
|
|
564
|
+
var parts = color.split('-');
|
|
565
|
+
if (parts.length === 2) {
|
|
566
|
+
var colorKey = parts[0];
|
|
567
|
+
var shade = parts[1];
|
|
568
|
+
var colorValue_1 = (_a = palette[colorKey]) === null || _a === void 0 ? void 0 : _a[shade];
|
|
569
|
+
if (!colorValue_1) {
|
|
570
|
+
if (isValidColor(color)) {
|
|
571
|
+
return color;
|
|
572
|
+
}
|
|
573
|
+
throw new Error("Color token \"".concat(colorKey, "-").concat(shade, "\" not found"));
|
|
574
|
+
}
|
|
575
|
+
return colorValue_1;
|
|
576
|
+
}
|
|
577
|
+
var colorValue = palette[color];
|
|
578
|
+
if (!colorValue) {
|
|
579
|
+
if (isValidColor(color)) {
|
|
580
|
+
return color;
|
|
581
|
+
}
|
|
582
|
+
throw new Error("Color token \"".concat(color, "\" not found"));
|
|
583
|
+
}
|
|
584
|
+
return colorValue;
|
|
585
|
+
};
|
|
586
|
+
/**
|
|
587
|
+
* Get hex number representation of a color
|
|
588
|
+
* @param color - Color token, theme color key or valid color string
|
|
589
|
+
* @returns Hex color number
|
|
590
|
+
* @throws {Error} If color token is not found
|
|
591
|
+
*/
|
|
592
|
+
var hex = function (color) {
|
|
593
|
+
var _a;
|
|
594
|
+
// See note in rgb()
|
|
595
|
+
if (typeof color === 'string' && isValidColor(color)) {
|
|
596
|
+
return convertColorValueToNumber(color);
|
|
597
|
+
}
|
|
598
|
+
var colorFromTheme = getValueFromTheme(color);
|
|
599
|
+
if (colorFromTheme) {
|
|
600
|
+
return hex(colorFromTheme);
|
|
601
|
+
}
|
|
602
|
+
var parts = color.split('-');
|
|
603
|
+
if (parts.length === 2) {
|
|
604
|
+
var colorKey = parts[0];
|
|
605
|
+
var shade = parts[1];
|
|
606
|
+
var colorValue = (_a = palette[colorKey]) === null || _a === void 0 ? void 0 : _a[shade];
|
|
607
|
+
if (!colorValue) {
|
|
608
|
+
if (isValidColor(color)) {
|
|
609
|
+
return convertColorValueToNumber(color);
|
|
610
|
+
}
|
|
611
|
+
throw new Error("Color token \"".concat(colorKey, "-").concat(shade, "\" not found"));
|
|
612
|
+
}
|
|
613
|
+
return convertColorValueToNumber(colorValue);
|
|
614
|
+
}
|
|
615
|
+
var colorToConvert = palette[color];
|
|
616
|
+
if (isValidColor(colorToConvert)) {
|
|
617
|
+
return convertColorValueToNumber(colorToConvert);
|
|
618
|
+
}
|
|
619
|
+
throw new Error("Color token \"".concat(color, "\" not found"));
|
|
620
|
+
};
|
|
621
|
+
var api = {
|
|
622
|
+
rgb: rgb,
|
|
623
|
+
hex: hex,
|
|
624
|
+
black: function () { return rgb('black'); },
|
|
625
|
+
white: function () { return rgb('white'); },
|
|
626
|
+
slate: function (shade) { return rgb("slate-".concat(shade)); },
|
|
627
|
+
gray: function (shade) { return rgb("gray-".concat(shade)); },
|
|
628
|
+
zinc: function (shade) { return rgb("zinc-".concat(shade)); },
|
|
629
|
+
neutral: function (shade) { return rgb("neutral-".concat(shade)); },
|
|
630
|
+
stone: function (shade) { return rgb("stone-".concat(shade)); },
|
|
631
|
+
red: function (shade) { return rgb("red-".concat(shade)); },
|
|
632
|
+
orange: function (shade) { return rgb("orange-".concat(shade)); },
|
|
633
|
+
amber: function (shade) { return rgb("amber-".concat(shade)); },
|
|
634
|
+
yellow: function (shade) { return rgb("yellow-".concat(shade)); },
|
|
635
|
+
lime: function (shade) { return rgb("lime-".concat(shade)); },
|
|
636
|
+
green: function (shade) { return rgb("green-".concat(shade)); },
|
|
637
|
+
emerald: function (shade) { return rgb("emerald-".concat(shade)); },
|
|
638
|
+
teal: function (shade) { return rgb("teal-".concat(shade)); },
|
|
639
|
+
cyan: function (shade) { return rgb("cyan-".concat(shade)); },
|
|
640
|
+
sky: function (shade) { return rgb("sky-".concat(shade)); },
|
|
641
|
+
blue: function (shade) { return rgb("blue-".concat(shade)); },
|
|
642
|
+
indigo: function (shade) { return rgb("indigo-".concat(shade)); },
|
|
643
|
+
violet: function (shade) { return rgb("violet-".concat(shade)); },
|
|
644
|
+
purple: function (shade) { return rgb("purple-".concat(shade)); },
|
|
645
|
+
fuchsia: function (shade) { return rgb("fuchsia-".concat(shade)); },
|
|
646
|
+
pink: function (shade) { return rgb("pink-".concat(shade)); },
|
|
647
|
+
rose: function (shade) { return rgb("rose-".concat(shade)); },
|
|
648
|
+
blackHex: function () { return hex('black'); },
|
|
649
|
+
whiteHex: function () { return hex('white'); },
|
|
650
|
+
slateHex: function (shade) { return hex("slate-".concat(shade)); },
|
|
651
|
+
grayHex: function (shade) { return hex("gray-".concat(shade)); },
|
|
652
|
+
zincHex: function (shade) { return hex("zinc-".concat(shade)); },
|
|
653
|
+
neutralHex: function (shade) { return hex("neutral-".concat(shade)); },
|
|
654
|
+
stoneHex: function (shade) { return hex("stone-".concat(shade)); },
|
|
655
|
+
redHex: function (shade) { return hex("red-".concat(shade)); },
|
|
656
|
+
orangeHex: function (shade) { return hex("orange-".concat(shade)); },
|
|
657
|
+
amberHex: function (shade) { return hex("amber-".concat(shade)); },
|
|
658
|
+
yellowHex: function (shade) { return hex("yellow-".concat(shade)); },
|
|
659
|
+
limeHex: function (shade) { return hex("lime-".concat(shade)); },
|
|
660
|
+
greenHex: function (shade) { return hex("green-".concat(shade)); },
|
|
661
|
+
emeraldHex: function (shade) { return hex("emerald-".concat(shade)); },
|
|
662
|
+
tealHex: function (shade) { return hex("teal-".concat(shade)); },
|
|
663
|
+
cyanHex: function (shade) { return hex("cyan-".concat(shade)); },
|
|
664
|
+
skyHex: function (shade) { return hex("sky-".concat(shade)); },
|
|
665
|
+
blueHex: function (shade) { return hex("blue-".concat(shade)); },
|
|
666
|
+
indigoHex: function (shade) { return hex("indigo-".concat(shade)); },
|
|
667
|
+
violetHex: function (shade) { return hex("violet-".concat(shade)); },
|
|
668
|
+
purpleHex: function (shade) { return hex("purple-".concat(shade)); },
|
|
669
|
+
fuchsiaHex: function (shade) { return hex("fuchsia-".concat(shade)); },
|
|
670
|
+
pinkHex: function (shade) { return hex("pink-".concat(shade)); },
|
|
671
|
+
roseHex: function (shade) { return hex("rose-".concat(shade)); },
|
|
672
|
+
};
|
|
673
|
+
return api;
|
|
674
|
+
};
|
|
675
|
+
/**
|
|
676
|
+
* Convenience instance using only the default palette tokens (no theme).
|
|
677
|
+
*
|
|
678
|
+
* @example
|
|
679
|
+
* Color.rgb('emerald-400')
|
|
680
|
+
* Color.hex('black')
|
|
681
|
+
*/
|
|
682
|
+
// eslint-disable-next-line no-redeclare
|
|
683
|
+
var Color = createColor({});
|
|
684
|
+
|
|
685
|
+
/**
|
|
686
|
+
* Default mapping of font size keys to their pixel values in pixels
|
|
687
|
+
*/
|
|
688
|
+
/** Default font-size scale mapping (in pixels). */
|
|
689
|
+
var fontSizeMap = {
|
|
690
|
+
xs: 12,
|
|
691
|
+
sm: 14,
|
|
692
|
+
base: 16,
|
|
693
|
+
lg: 18,
|
|
694
|
+
xl: 20,
|
|
695
|
+
'2xl': 24,
|
|
696
|
+
'3xl': 30,
|
|
697
|
+
'4xl': 36,
|
|
698
|
+
'5xl': 48,
|
|
699
|
+
'6xl': 60,
|
|
700
|
+
'7xl': 72,
|
|
701
|
+
'8xl': 96,
|
|
702
|
+
'9xl': 128,
|
|
703
|
+
};
|
|
704
|
+
/**
|
|
705
|
+
* Creates a font size conversion API with optional custom font sizes
|
|
706
|
+
* @template T - Optional custom font size map type
|
|
707
|
+
* @param themeFontSizes - Optional custom font size mappings to extend defaults
|
|
708
|
+
* @returns Font size conversion API
|
|
709
|
+
*/
|
|
710
|
+
/**
|
|
711
|
+
* Create a font-size API bound to an optional custom map.
|
|
712
|
+
* @example
|
|
713
|
+
* const f = createFontSize({ xxl: 28 });
|
|
714
|
+
* f.css('xxl'); // '28px'
|
|
715
|
+
*/
|
|
716
|
+
var createFontSize = function (themeFontSizes) {
|
|
717
|
+
var fontmap = __assign(__assign({}, fontSizeMap), themeFontSizes);
|
|
718
|
+
return {
|
|
719
|
+
px: function (key) {
|
|
720
|
+
var value = fontmap[key];
|
|
721
|
+
if (typeof value === 'number') {
|
|
722
|
+
return value;
|
|
723
|
+
}
|
|
724
|
+
return 0;
|
|
725
|
+
},
|
|
726
|
+
rem: function (key) {
|
|
727
|
+
var value = fontmap[key];
|
|
728
|
+
if (typeof value === 'number') {
|
|
729
|
+
return value / 16;
|
|
730
|
+
}
|
|
731
|
+
return 0;
|
|
732
|
+
},
|
|
733
|
+
css: function (key) {
|
|
734
|
+
var value = fontmap[key];
|
|
735
|
+
if (typeof value === 'number') {
|
|
736
|
+
return "".concat(value, "px");
|
|
737
|
+
}
|
|
738
|
+
return '0px';
|
|
739
|
+
},
|
|
740
|
+
};
|
|
741
|
+
};
|
|
742
|
+
// Convenience instance using default font sizes (no theme)
|
|
743
|
+
var FontSize = createFontSize(undefined);
|
|
744
|
+
|
|
745
|
+
var fontMap = {
|
|
746
|
+
primary: 'Inter, system-ui, sans-serif',
|
|
747
|
+
secondary: 'Roboto, Arial, sans-serif',
|
|
748
|
+
monospace: 'Fira Code, Consolas, monospace',
|
|
749
|
+
display: 'Poppins, Inter, sans-serif',
|
|
750
|
+
};
|
|
751
|
+
var createFont = function (fonts, fontSizes) {
|
|
752
|
+
var map = __assign(__assign({}, fontMap), fonts);
|
|
753
|
+
var fontSizeApi = createFontSize(fontSizes);
|
|
754
|
+
var getFamily = function (key) {
|
|
755
|
+
if (key.includes('.')) {
|
|
756
|
+
var _a = key.split('.'), short = _a[1];
|
|
757
|
+
if (short && typeof map[short] === 'string') {
|
|
758
|
+
return map[short];
|
|
759
|
+
}
|
|
760
|
+
}
|
|
761
|
+
return typeof map[key] === 'string' ? map[key] : key;
|
|
762
|
+
};
|
|
763
|
+
return {
|
|
764
|
+
size: function (key) {
|
|
765
|
+
var _a;
|
|
766
|
+
return (_a = fontSizeApi.px(key)) !== null && _a !== void 0 ? _a : 0;
|
|
767
|
+
},
|
|
768
|
+
format: function (_a) {
|
|
769
|
+
var _b;
|
|
770
|
+
var size = _a.size, family = _a.family;
|
|
771
|
+
var sizePx = (_b = fontSizeApi.px(size)) !== null && _b !== void 0 ? _b : 0;
|
|
772
|
+
return "".concat(sizePx, "px '").concat(getFamily(family), "'");
|
|
773
|
+
},
|
|
774
|
+
family: function (key) { return getFamily(key); },
|
|
775
|
+
getAvailableFonts: function () {
|
|
776
|
+
return Array.from(new Set(__spreadArray(__spreadArray([], Object.keys(fontMap), true), Object.keys(map), true)));
|
|
777
|
+
},
|
|
778
|
+
};
|
|
779
|
+
};
|
|
780
|
+
|
|
781
|
+
/**
|
|
782
|
+
* Mapping of radius keys to their pixel values
|
|
783
|
+
*/
|
|
784
|
+
/** Default radius scale mapping (in pixels). */
|
|
785
|
+
var radiusMap = {
|
|
786
|
+
none: 0,
|
|
787
|
+
sm: 2,
|
|
788
|
+
default: 4,
|
|
789
|
+
md: 6,
|
|
790
|
+
lg: 8,
|
|
791
|
+
xl: 12,
|
|
792
|
+
'2xl': 16,
|
|
793
|
+
'3xl': 24,
|
|
794
|
+
full: 9999,
|
|
795
|
+
};
|
|
796
|
+
/**
|
|
797
|
+
* Create a radius API bound to an optional theme radius map.
|
|
798
|
+
* @example
|
|
799
|
+
* const r = createRadius({ card: 12 });
|
|
800
|
+
* r.css('card'); // '12px'
|
|
801
|
+
*/
|
|
802
|
+
var createRadius = function (themeRadius) {
|
|
803
|
+
var map = __assign(__assign({}, radiusMap), themeRadius);
|
|
804
|
+
var get = function (key) {
|
|
805
|
+
return typeof map[key] === 'number' ? map[key] : 0;
|
|
806
|
+
};
|
|
807
|
+
return {
|
|
808
|
+
px: function (key) {
|
|
809
|
+
return get(key);
|
|
810
|
+
},
|
|
811
|
+
rem: function (key) {
|
|
812
|
+
return get(key) / 16;
|
|
813
|
+
},
|
|
814
|
+
css: function (key) {
|
|
815
|
+
return "".concat(get(key), "px");
|
|
816
|
+
},
|
|
817
|
+
};
|
|
818
|
+
};
|
|
819
|
+
/** Convenience instance using default radius map (no theme). */
|
|
820
|
+
var Radius = createRadius(undefined);
|
|
821
|
+
|
|
822
|
+
/** Default shadow presets. */
|
|
823
|
+
var defaultShadowMap = {
|
|
824
|
+
sm: { blur: 2, offsetX: 1, offsetY: 1, alpha: 0.15 },
|
|
825
|
+
md: { blur: 4, offsetX: 2, offsetY: 2, alpha: 0.2 },
|
|
826
|
+
lg: { blur: 6, offsetX: 4, offsetY: 4, alpha: 0.25 },
|
|
827
|
+
xl: { blur: 8, offsetX: 6, offsetY: 6, alpha: 0.3 },
|
|
828
|
+
'2xl': { blur: 12, offsetX: 8, offsetY: 8, alpha: 0.35 },
|
|
829
|
+
inner: { blur: 4, offsetX: -2, offsetY: -2, alpha: 0.2 },
|
|
830
|
+
};
|
|
831
|
+
/**
|
|
832
|
+
* Create a shadow API bound to an optional effects map.
|
|
833
|
+
* @example
|
|
834
|
+
* const sh = createShadow({ glow: { blur: 8, offsetX: 0, offsetY: 0, alpha: .6 } });
|
|
835
|
+
* sh.get('glow');
|
|
836
|
+
*/
|
|
837
|
+
var createShadow = function (effects) {
|
|
838
|
+
var map = __assign(__assign({}, defaultShadowMap), effects);
|
|
839
|
+
var getConfig = function (key) {
|
|
840
|
+
var cfg = map[key];
|
|
841
|
+
if (cfg && typeof cfg === 'object')
|
|
842
|
+
return cfg;
|
|
843
|
+
return defaultShadowMap['md'];
|
|
844
|
+
};
|
|
845
|
+
return {
|
|
846
|
+
get: function (key) { return getConfig(key); },
|
|
847
|
+
};
|
|
848
|
+
};
|
|
849
|
+
/** Convenience instance using default shadows (no theme). */
|
|
850
|
+
var Shadow = createShadow(undefined);
|
|
851
|
+
|
|
852
|
+
/**
|
|
853
|
+
* Spacing scale mapping following Tailwind's spacing scale.
|
|
854
|
+
* Values are in pixels, with a base unit of 4px (1 = 4px).
|
|
855
|
+
*/
|
|
856
|
+
var spacingMap = {
|
|
857
|
+
'0': 0,
|
|
858
|
+
px: 1,
|
|
859
|
+
'0.5': 2,
|
|
860
|
+
'1': 4,
|
|
861
|
+
'1.5': 6,
|
|
862
|
+
'2': 8,
|
|
863
|
+
'2.5': 10,
|
|
864
|
+
'3': 12,
|
|
865
|
+
'3.5': 14,
|
|
866
|
+
'4': 16,
|
|
867
|
+
'5': 20,
|
|
868
|
+
'6': 24,
|
|
869
|
+
'7': 28,
|
|
870
|
+
'8': 32,
|
|
871
|
+
'9': 36,
|
|
872
|
+
'10': 40,
|
|
873
|
+
'11': 44,
|
|
874
|
+
'12': 48,
|
|
875
|
+
'14': 56,
|
|
876
|
+
'16': 64,
|
|
877
|
+
'20': 80,
|
|
878
|
+
'24': 96,
|
|
879
|
+
'28': 112,
|
|
880
|
+
'32': 128,
|
|
881
|
+
'36': 144,
|
|
882
|
+
'40': 160,
|
|
883
|
+
'44': 176,
|
|
884
|
+
'48': 192,
|
|
885
|
+
'52': 208,
|
|
886
|
+
'56': 224,
|
|
887
|
+
'60': 240,
|
|
888
|
+
'64': 256,
|
|
889
|
+
'72': 288,
|
|
890
|
+
'80': 320,
|
|
891
|
+
'96': 384,
|
|
892
|
+
};
|
|
893
|
+
/**
|
|
894
|
+
* Create a spacing API bound to an optional theme spacing map.
|
|
895
|
+
* @example
|
|
896
|
+
* const s = createSpacing({ gutter: 24 });
|
|
897
|
+
* s.px('gutter'); // 24
|
|
898
|
+
*/
|
|
899
|
+
var createSpacing = function (themeSpacing) {
|
|
900
|
+
var map = __assign(__assign({}, spacingMap), themeSpacing);
|
|
901
|
+
var get = function (key) {
|
|
902
|
+
return typeof map[key] === 'number' ? map[key] : 0;
|
|
903
|
+
};
|
|
904
|
+
return {
|
|
905
|
+
px: function (key) {
|
|
906
|
+
return get(key);
|
|
907
|
+
},
|
|
908
|
+
rem: function (key) {
|
|
909
|
+
return get(key) / 16;
|
|
910
|
+
},
|
|
911
|
+
css: function (key) {
|
|
912
|
+
return "".concat(get(key), "px");
|
|
913
|
+
},
|
|
914
|
+
};
|
|
915
|
+
};
|
|
916
|
+
/** Convenience instance using default spacing map (no theme). */
|
|
917
|
+
var Spacing = createSpacing(undefined);
|
|
918
|
+
|
|
919
|
+
/**
|
|
920
|
+
* Example theme configurations with structured design tokens
|
|
921
|
+
*/
|
|
922
|
+
var defaultLightTheme = {
|
|
923
|
+
fonts: {
|
|
924
|
+
primary: 'Inter, system-ui, sans-serif',
|
|
925
|
+
secondary: 'Roboto, Arial, sans-serif',
|
|
926
|
+
monospace: 'Fira Code, Consolas, monospace',
|
|
927
|
+
display: 'Poppins, Inter, sans-serif',
|
|
928
|
+
},
|
|
929
|
+
fontSizes: __assign({}, fontSizeMap),
|
|
930
|
+
colors: {
|
|
931
|
+
// Primary colors
|
|
932
|
+
primary: 'blue-600',
|
|
933
|
+
secondary: 'gray-600',
|
|
934
|
+
// Semantic colors
|
|
935
|
+
success: 'green-500',
|
|
936
|
+
warning: 'yellow-500',
|
|
937
|
+
error: 'red-500',
|
|
938
|
+
info: 'blue-400',
|
|
939
|
+
// Background colors
|
|
940
|
+
background: 'white',
|
|
941
|
+
// Text colors
|
|
942
|
+
text: 'gray-900',
|
|
943
|
+
// UI elements
|
|
944
|
+
shadow: 'black',
|
|
945
|
+
overlay: 'black',
|
|
946
|
+
},
|
|
947
|
+
spacing: __assign({}, spacingMap),
|
|
948
|
+
typography: {
|
|
949
|
+
heading: {
|
|
950
|
+
fontSize: '2xl',
|
|
951
|
+
fontFamily: 'fonts.display',
|
|
952
|
+
fontWeight: 600,
|
|
953
|
+
lineHeight: 1.2,
|
|
954
|
+
},
|
|
955
|
+
'heading-large': {
|
|
956
|
+
fontSize: '4xl',
|
|
957
|
+
fontFamily: 'fonts.display',
|
|
958
|
+
fontWeight: 700,
|
|
959
|
+
lineHeight: 1.1,
|
|
960
|
+
},
|
|
961
|
+
body: {
|
|
962
|
+
fontSize: 'base',
|
|
963
|
+
fontFamily: 'fonts.primary',
|
|
964
|
+
fontWeight: 400,
|
|
965
|
+
lineHeight: 1.5,
|
|
966
|
+
},
|
|
967
|
+
caption: {
|
|
968
|
+
fontSize: 'sm',
|
|
969
|
+
fontFamily: 'fonts.primary',
|
|
970
|
+
fontWeight: 400,
|
|
971
|
+
lineHeight: 1.4,
|
|
972
|
+
},
|
|
973
|
+
},
|
|
974
|
+
// TODO: Check this implementation
|
|
975
|
+
effects: {
|
|
976
|
+
'shadow-sm': {
|
|
977
|
+
blur: 2,
|
|
978
|
+
offsetY: 1,
|
|
979
|
+
color: 'colors.shadow',
|
|
980
|
+
alpha: 0.05,
|
|
981
|
+
},
|
|
982
|
+
'shadow-md': {
|
|
983
|
+
blur: 4,
|
|
984
|
+
offsetY: 2,
|
|
985
|
+
color: 'colors.shadow',
|
|
986
|
+
alpha: 0.1,
|
|
987
|
+
},
|
|
988
|
+
'shadow-lg': {
|
|
989
|
+
blur: 8,
|
|
990
|
+
offsetY: 4,
|
|
991
|
+
color: 'colors.shadow',
|
|
992
|
+
alpha: 0.1,
|
|
993
|
+
},
|
|
994
|
+
},
|
|
995
|
+
custom: {},
|
|
996
|
+
};
|
|
997
|
+
var defaultDarkTheme = {
|
|
998
|
+
fonts: {
|
|
999
|
+
primary: 'Inter, system-ui, sans-serif',
|
|
1000
|
+
secondary: 'Roboto, Arial, sans-serif',
|
|
1001
|
+
monospace: 'Fira Code, Consolas, monospace',
|
|
1002
|
+
display: 'Poppins, Inter, sans-serif',
|
|
1003
|
+
},
|
|
1004
|
+
fontSizes: __assign({}, fontSizeMap),
|
|
1005
|
+
radius: __assign({}, radiusMap),
|
|
1006
|
+
colors: {
|
|
1007
|
+
// Primary colors
|
|
1008
|
+
primary: 'blue-400',
|
|
1009
|
+
secondary: 'gray-400',
|
|
1010
|
+
// Semantic colors
|
|
1011
|
+
success: 'green-400',
|
|
1012
|
+
warning: 'yellow-400',
|
|
1013
|
+
error: 'red-400',
|
|
1014
|
+
info: 'blue-300',
|
|
1015
|
+
// Background colors
|
|
1016
|
+
background: 'gray-900',
|
|
1017
|
+
// Text colors
|
|
1018
|
+
text: 'white',
|
|
1019
|
+
// UI elements
|
|
1020
|
+
shadow: 'black',
|
|
1021
|
+
overlay: 'black',
|
|
1022
|
+
},
|
|
1023
|
+
spacing: __assign({}, spacingMap),
|
|
1024
|
+
typography: {
|
|
1025
|
+
heading: {
|
|
1026
|
+
fontSize: '2xl',
|
|
1027
|
+
fontFamily: 'fonts.display',
|
|
1028
|
+
fontWeight: 600,
|
|
1029
|
+
lineHeight: 1.2,
|
|
1030
|
+
},
|
|
1031
|
+
'heading-large': {
|
|
1032
|
+
fontSize: '4xl',
|
|
1033
|
+
fontFamily: 'fonts.display',
|
|
1034
|
+
fontWeight: 700,
|
|
1035
|
+
lineHeight: 1.1,
|
|
1036
|
+
},
|
|
1037
|
+
body: {
|
|
1038
|
+
fontSize: 'base',
|
|
1039
|
+
fontFamily: 'fonts.primary',
|
|
1040
|
+
fontWeight: 400,
|
|
1041
|
+
lineHeight: 1.5,
|
|
1042
|
+
},
|
|
1043
|
+
caption: {
|
|
1044
|
+
fontSize: 'sm',
|
|
1045
|
+
fontFamily: 'fonts.primary',
|
|
1046
|
+
fontWeight: 400,
|
|
1047
|
+
lineHeight: 1.4,
|
|
1048
|
+
},
|
|
1049
|
+
},
|
|
1050
|
+
effects: {
|
|
1051
|
+
'shadow-sm': {
|
|
1052
|
+
blur: 2,
|
|
1053
|
+
offsetY: 1,
|
|
1054
|
+
color: 'colors.shadow',
|
|
1055
|
+
alpha: 0.1,
|
|
1056
|
+
},
|
|
1057
|
+
'shadow-md': {
|
|
1058
|
+
blur: 4,
|
|
1059
|
+
offsetY: 2,
|
|
1060
|
+
color: 'colors.shadow',
|
|
1061
|
+
alpha: 0.15,
|
|
1062
|
+
},
|
|
1063
|
+
'shadow-lg': {
|
|
1064
|
+
blur: 8,
|
|
1065
|
+
offsetY: 4,
|
|
1066
|
+
color: 'colors.shadow',
|
|
1067
|
+
alpha: 0.2,
|
|
1068
|
+
},
|
|
1069
|
+
},
|
|
1070
|
+
custom: {},
|
|
1071
|
+
};
|
|
1072
|
+
|
|
1073
|
+
var createTheme = function (theme) {
|
|
1074
|
+
return merge({}, defaultLightTheme, theme);
|
|
1075
|
+
};
|
|
1076
|
+
|
|
1077
|
+
var PHASER_WIND_KEY = 'pw';
|
|
1078
|
+
/**
|
|
1079
|
+
* Phaser Wind Plugin class that manages theme configuration
|
|
1080
|
+
* @extends Plugins.BasePlugin
|
|
1081
|
+
*/
|
|
1082
|
+
var PhaserWindPlugin = /** @class */ (function (_super) {
|
|
1083
|
+
__extends(PhaserWindPlugin, _super);
|
|
1084
|
+
/**
|
|
1085
|
+
* Creates an instance of PhaserWindPlugin
|
|
1086
|
+
* @param pluginManager - Phaser plugin manager instance
|
|
1087
|
+
*/
|
|
1088
|
+
function PhaserWindPlugin(pluginManager) {
|
|
1089
|
+
var _this = _super.call(this, pluginManager) || this;
|
|
1090
|
+
_this.colorInstance = null;
|
|
1091
|
+
_this.fontSizeInstance = null;
|
|
1092
|
+
_this.spacingInstance = null;
|
|
1093
|
+
_this.radiusInstance = null;
|
|
1094
|
+
_this.fontInstance = null;
|
|
1095
|
+
_this.shadowInstance = null;
|
|
1096
|
+
_this.theme = defaultLightTheme;
|
|
1097
|
+
return _this;
|
|
1098
|
+
}
|
|
1099
|
+
/**
|
|
1100
|
+
* Initializes the plugin with theme configuration
|
|
1101
|
+
* @param theme - Custom theme configuration
|
|
1102
|
+
* @param darkMode - Whether to use dark mode theme when no custom theme provided
|
|
1103
|
+
* @example
|
|
1104
|
+
* ```typescript
|
|
1105
|
+
* const game = new Phaser.Game({
|
|
1106
|
+
* plugins: {
|
|
1107
|
+
* global: [
|
|
1108
|
+
* {
|
|
1109
|
+
* key: PHASER_WIND_KEY,
|
|
1110
|
+
* plugin: PhaserWindPlugin,
|
|
1111
|
+
* mapping: PHASER_WIND_KEY,
|
|
1112
|
+
* data: { theme: defaultLightTheme }
|
|
1113
|
+
* },
|
|
1114
|
+
* ],
|
|
1115
|
+
* },
|
|
1116
|
+
* });
|
|
1117
|
+
* ```
|
|
1118
|
+
*/
|
|
1119
|
+
PhaserWindPlugin.prototype.init = function (_a) {
|
|
1120
|
+
var theme = _a.theme, _b = _a.darkMode, darkMode = _b === void 0 ? false : _b;
|
|
1121
|
+
if (!theme) {
|
|
1122
|
+
this.theme = darkMode
|
|
1123
|
+
? defaultDarkTheme
|
|
1124
|
+
: defaultLightTheme;
|
|
1125
|
+
return;
|
|
1126
|
+
}
|
|
1127
|
+
else {
|
|
1128
|
+
this.theme = theme;
|
|
1129
|
+
}
|
|
1130
|
+
this.colorInstance = createColor(this.theme.colors);
|
|
1131
|
+
this.fontSizeInstance = createFontSize(this.theme.fontSizes);
|
|
1132
|
+
this.spacingInstance = createSpacing(this.theme.spacing);
|
|
1133
|
+
this.radiusInstance = createRadius(this.theme.radius);
|
|
1134
|
+
this.fontInstance = createFont(this.theme.fonts, this.theme.fontSizes);
|
|
1135
|
+
this.shadowInstance = createShadow(this.theme.effects);
|
|
1136
|
+
};
|
|
1137
|
+
/**
|
|
1138
|
+
* Returns the current theme configuration
|
|
1139
|
+
* @returns Current BaseThemeConfig
|
|
1140
|
+
*/
|
|
1141
|
+
PhaserWindPlugin.prototype.getTheme = function () {
|
|
1142
|
+
return this.theme;
|
|
1143
|
+
};
|
|
1144
|
+
Object.defineProperty(PhaserWindPlugin.prototype, "color", {
|
|
1145
|
+
get: function () {
|
|
1146
|
+
return this.colorInstance;
|
|
1147
|
+
},
|
|
1148
|
+
enumerable: false,
|
|
1149
|
+
configurable: true
|
|
1150
|
+
});
|
|
1151
|
+
Object.defineProperty(PhaserWindPlugin.prototype, "fontSize", {
|
|
1152
|
+
get: function () {
|
|
1153
|
+
return this.fontSizeInstance;
|
|
1154
|
+
},
|
|
1155
|
+
enumerable: false,
|
|
1156
|
+
configurable: true
|
|
1157
|
+
});
|
|
1158
|
+
Object.defineProperty(PhaserWindPlugin.prototype, "spacing", {
|
|
1159
|
+
get: function () {
|
|
1160
|
+
return this.spacingInstance;
|
|
1161
|
+
},
|
|
1162
|
+
enumerable: false,
|
|
1163
|
+
configurable: true
|
|
1164
|
+
});
|
|
1165
|
+
Object.defineProperty(PhaserWindPlugin.prototype, "radius", {
|
|
1166
|
+
get: function () {
|
|
1167
|
+
return this.radiusInstance;
|
|
1168
|
+
},
|
|
1169
|
+
enumerable: false,
|
|
1170
|
+
configurable: true
|
|
1171
|
+
});
|
|
1172
|
+
Object.defineProperty(PhaserWindPlugin.prototype, "font", {
|
|
1173
|
+
get: function () {
|
|
1174
|
+
return this.fontInstance;
|
|
1175
|
+
},
|
|
1176
|
+
enumerable: false,
|
|
1177
|
+
configurable: true
|
|
1178
|
+
});
|
|
1179
|
+
Object.defineProperty(PhaserWindPlugin.prototype, "shadow", {
|
|
1180
|
+
get: function () {
|
|
1181
|
+
return this.shadowInstance;
|
|
1182
|
+
},
|
|
1183
|
+
enumerable: false,
|
|
1184
|
+
configurable: true
|
|
1185
|
+
});
|
|
1186
|
+
return PhaserWindPlugin;
|
|
1187
|
+
}(phaser.Plugins.BasePlugin));
|
|
1188
|
+
|
|
1189
|
+
var SceneWithPhaserWind = /** @class */ (function (_super) {
|
|
1190
|
+
__extends(SceneWithPhaserWind, _super);
|
|
1191
|
+
/**
|
|
1192
|
+
*
|
|
1193
|
+
* @param config The scene key or scene specific configuration settings.
|
|
1194
|
+
*/
|
|
1195
|
+
function SceneWithPhaserWind(config) {
|
|
1196
|
+
return _super.call(this, config) || this;
|
|
1197
|
+
}
|
|
1198
|
+
return SceneWithPhaserWind;
|
|
1199
|
+
}(Phaser.Scene));
|
|
1200
|
+
|
|
1201
|
+
exports.Color = Color;
|
|
1202
|
+
exports.FontSize = FontSize;
|
|
1203
|
+
exports.PHASER_WIND_KEY = PHASER_WIND_KEY;
|
|
1204
|
+
exports.PhaserWindPlugin = PhaserWindPlugin;
|
|
1205
|
+
exports.Radius = Radius;
|
|
1206
|
+
exports.SceneWithPhaserWind = SceneWithPhaserWind;
|
|
1207
|
+
exports.Shadow = Shadow;
|
|
1208
|
+
exports.Spacing = Spacing;
|
|
1209
|
+
exports.createColor = createColor;
|
|
1210
|
+
exports.createFont = createFont;
|
|
1211
|
+
exports.createFontSize = createFontSize;
|
|
1212
|
+
exports.createRadius = createRadius;
|
|
1213
|
+
exports.createShadow = createShadow;
|
|
1214
|
+
exports.createSpacing = createSpacing;
|
|
1215
|
+
exports.createTheme = createTheme;
|
|
1216
|
+
exports.defaultDarkTheme = defaultDarkTheme;
|
|
1217
|
+
exports.defaultLightTheme = defaultLightTheme;
|
|
1218
|
+
exports.defaultShadowMap = defaultShadowMap;
|
|
1219
|
+
exports.fontMap = fontMap;
|
|
1220
|
+
exports.fontSizeMap = fontSizeMap;
|
|
1221
|
+
exports.isValidColor = isValidColor;
|
|
1222
|
+
exports.merge = merge;
|
|
1223
|
+
exports.mergeDeep = mergeDeep;
|
|
1224
|
+
exports.palette = palette;
|
|
1225
|
+
exports.radiusMap = radiusMap;
|
|
1226
|
+
exports.spacingMap = spacingMap;
|
|
1227
|
+
|
|
1228
|
+
}));
|