@kaizen/components 1.4.20-canary.2 → 1.4.20-canary.3469
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/dist/iife/Dropdown.module-4CIBZTRZ-4CIBZTRZ.scss +100 -0
- package/dist/iife/Icon.module-VD7NKLAR-VD7NKLAR.scss +72 -0
- package/dist/iife/KaizenProvider/ThemeProvider/ThemeManager.js +362 -494
- package/dist/iife/KaizenProvider/ThemeProvider/ThemeManager.spec.js +365 -500
- package/dist/iife/KaizenProvider/ThemeProvider/index.js +376 -508
- package/dist/iife/KaizenProvider/index.js +378 -510
- package/dist/iife/Layout.module-MZ6JYT46-MZ6JYT46.scss +58 -0
- package/dist/iife/Menu.module-N76N74LN-N76N74LN.scss +111 -0
- package/dist/iife/Text.module-SXGFOHGJ-SXGFOHGJ.scss +173 -0
- package/dist/iife/__future__/index.js +910 -587
- package/dist/iife/index.js +869 -539
- package/package.json +34 -34
- package/dist/styles.css +0 -98
- /package/dist/iife/{Margin.module-DJURK5K7.scss → Margin.module-DJURK5K7-DJURK5K7.scss} +0 -0
- /package/dist/iife/{Padding.module-QSNUEZBU.scss → Padding.module-QSNUEZBU-QSNUEZBU.scss} +0 -0
|
@@ -6,9 +6,16 @@
|
|
|
6
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
7
|
var __getProtoOf = Object.getPrototypeOf;
|
|
8
8
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
+
var __esm = (fn, res) => function __init() {
|
|
10
|
+
return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
|
|
11
|
+
};
|
|
9
12
|
var __commonJS = (cb, mod) => function __require() {
|
|
10
13
|
return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
|
|
11
14
|
};
|
|
15
|
+
var __export = (target, all) => {
|
|
16
|
+
for (var name in all)
|
|
17
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
18
|
+
};
|
|
12
19
|
var __copyProps = (to, from, except, desc) => {
|
|
13
20
|
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
21
|
for (let key of __getOwnPropNames(from))
|
|
@@ -17,6 +24,7 @@
|
|
|
17
24
|
}
|
|
18
25
|
return to;
|
|
19
26
|
};
|
|
27
|
+
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
20
28
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
29
|
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
30
|
// file that has been converted to a CommonJS file using a Babel-
|
|
@@ -1382,7 +1390,7 @@
|
|
|
1382
1390
|
}
|
|
1383
1391
|
return dispatcher.useContext(Context2);
|
|
1384
1392
|
}
|
|
1385
|
-
function
|
|
1393
|
+
function useState3(initialState) {
|
|
1386
1394
|
var dispatcher = resolveDispatcher();
|
|
1387
1395
|
return dispatcher.useState(initialState);
|
|
1388
1396
|
}
|
|
@@ -2184,7 +2192,7 @@
|
|
|
2184
2192
|
exports.useMemo = useMemo;
|
|
2185
2193
|
exports.useReducer = useReducer;
|
|
2186
2194
|
exports.useRef = useRef;
|
|
2187
|
-
exports.useState =
|
|
2195
|
+
exports.useState = useState3;
|
|
2188
2196
|
exports.useSyncExternalStore = useSyncExternalStore;
|
|
2189
2197
|
exports.useTransition = useTransition;
|
|
2190
2198
|
exports.version = ReactVersion;
|
|
@@ -2208,13 +2216,12 @@
|
|
|
2208
2216
|
}
|
|
2209
2217
|
});
|
|
2210
2218
|
|
|
2211
|
-
// ../design-tokens/
|
|
2212
|
-
var
|
|
2213
|
-
|
|
2219
|
+
// ../design-tokens/src/themes/heart.ts
|
|
2220
|
+
var heartTheme;
|
|
2221
|
+
var init_heart = __esm({
|
|
2222
|
+
"../design-tokens/src/themes/heart.ts"() {
|
|
2214
2223
|
"use strict";
|
|
2215
|
-
|
|
2216
|
-
exports.heartTheme = void 0;
|
|
2217
|
-
exports.heartTheme = {
|
|
2224
|
+
heartTheme = {
|
|
2218
2225
|
themeKey: "heart",
|
|
2219
2226
|
animation: {
|
|
2220
2227
|
easingFunction: {
|
|
@@ -2525,26 +2532,21 @@
|
|
|
2525
2532
|
}
|
|
2526
2533
|
});
|
|
2527
2534
|
|
|
2528
|
-
// ../design-tokens/
|
|
2529
|
-
var
|
|
2530
|
-
|
|
2535
|
+
// ../design-tokens/src/themes/index.ts
|
|
2536
|
+
var defaultTheme;
|
|
2537
|
+
var init_themes = __esm({
|
|
2538
|
+
"../design-tokens/src/themes/index.ts"() {
|
|
2531
2539
|
"use strict";
|
|
2532
|
-
|
|
2533
|
-
|
|
2534
|
-
|
|
2535
|
-
var heart_2 = require_heart();
|
|
2536
|
-
Object.defineProperty(exports, "heartTheme", { enumerable: true, get: function() {
|
|
2537
|
-
return heart_2.heartTheme;
|
|
2538
|
-
} });
|
|
2539
|
-
exports.defaultTheme = heart_1.heartTheme;
|
|
2540
|
+
init_heart();
|
|
2541
|
+
init_heart();
|
|
2542
|
+
defaultTheme = heartTheme;
|
|
2540
2543
|
}
|
|
2541
2544
|
});
|
|
2542
2545
|
|
|
2543
|
-
// ../design-tokens/
|
|
2544
|
-
var
|
|
2545
|
-
"../design-tokens/
|
|
2546
|
+
// ../design-tokens/src/types.ts
|
|
2547
|
+
var init_types = __esm({
|
|
2548
|
+
"../design-tokens/src/types.ts"() {
|
|
2546
2549
|
"use strict";
|
|
2547
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
2548
2550
|
}
|
|
2549
2551
|
});
|
|
2550
2552
|
|
|
@@ -3252,384 +3254,270 @@
|
|
|
3252
3254
|
}
|
|
3253
3255
|
});
|
|
3254
3256
|
|
|
3255
|
-
// ../design-tokens/
|
|
3256
|
-
var
|
|
3257
|
-
|
|
3257
|
+
// ../design-tokens/src/lib/cssVariables.ts
|
|
3258
|
+
var import_lodash, objectPathToCssVarFunction, objectPathToCssVarIdentifier;
|
|
3259
|
+
var init_cssVariables = __esm({
|
|
3260
|
+
"../design-tokens/src/lib/cssVariables.ts"() {
|
|
3258
3261
|
"use strict";
|
|
3259
|
-
|
|
3260
|
-
|
|
3261
|
-
}
|
|
3262
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3263
|
-
exports.objectPathToCssVarIdentifier = exports.objectPathToCssVarFunction = void 0;
|
|
3264
|
-
var lodash_kebabcase_1 = __importDefault(require_lodash());
|
|
3265
|
-
var objectPathToCssVarFunction = function(path, value) {
|
|
3266
|
-
return "var(".concat((0, exports.objectPathToCssVarIdentifier)(path), ", ").concat(value, ")");
|
|
3267
|
-
};
|
|
3268
|
-
exports.objectPathToCssVarFunction = objectPathToCssVarFunction;
|
|
3269
|
-
var objectPathToCssVarIdentifier = function(path) {
|
|
3270
|
-
return "--".concat(path.map(lodash_kebabcase_1.default).join("-"));
|
|
3271
|
-
};
|
|
3272
|
-
exports.objectPathToCssVarIdentifier = objectPathToCssVarIdentifier;
|
|
3262
|
+
import_lodash = __toESM(require_lodash());
|
|
3263
|
+
objectPathToCssVarFunction = (path, value) => `var(${objectPathToCssVarIdentifier(path)}, ${value})`;
|
|
3264
|
+
objectPathToCssVarIdentifier = (path) => `--${path.map(import_lodash.default).join("-")}`;
|
|
3273
3265
|
}
|
|
3274
3266
|
});
|
|
3275
3267
|
|
|
3276
|
-
// ../design-tokens/
|
|
3277
|
-
var
|
|
3278
|
-
|
|
3268
|
+
// ../design-tokens/src/lib/addExtraThemeEntries.ts
|
|
3269
|
+
var import_color_string, addExtraThemeEntries;
|
|
3270
|
+
var init_addExtraThemeEntries = __esm({
|
|
3271
|
+
"../design-tokens/src/lib/addExtraThemeEntries.ts"() {
|
|
3279
3272
|
"use strict";
|
|
3280
|
-
|
|
3281
|
-
|
|
3282
|
-
|
|
3283
|
-
|
|
3284
|
-
|
|
3285
|
-
|
|
3286
|
-
|
|
3287
|
-
|
|
3288
|
-
|
|
3289
|
-
return to.concat(ar || Array.prototype.slice.call(from));
|
|
3290
|
-
};
|
|
3291
|
-
var __importDefault = exports && exports.__importDefault || function(mod) {
|
|
3292
|
-
return mod && mod.__esModule ? mod : { "default": mod };
|
|
3293
|
-
};
|
|
3294
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3295
|
-
exports.addExtraThemeEntries = void 0;
|
|
3296
|
-
var color_string_1 = __importDefault(require_color_string());
|
|
3297
|
-
var cssVariables_1 = require_cssVariables();
|
|
3298
|
-
var addExtraThemeEntries = function(path, key, value, printValue, _a) {
|
|
3299
|
-
var _b;
|
|
3300
|
-
var augmentWithId = _a.augmentWithId;
|
|
3301
|
-
var colorRgb = typeof value === "string" ? color_string_1.default.get.rgb(value) : null;
|
|
3302
|
-
var result = (_b = {}, _b[key] = printValue(path, value), _b);
|
|
3273
|
+
import_color_string = __toESM(require_color_string());
|
|
3274
|
+
init_cssVariables();
|
|
3275
|
+
addExtraThemeEntries = (path, key, value, printValue, {
|
|
3276
|
+
augmentWithId
|
|
3277
|
+
}) => {
|
|
3278
|
+
const colorRgb = typeof value === "string" ? import_color_string.default.get.rgb(value) : null;
|
|
3279
|
+
const result = {
|
|
3280
|
+
[key]: printValue(path, value)
|
|
3281
|
+
};
|
|
3303
3282
|
if (colorRgb) {
|
|
3304
3283
|
result[key] = printValue(path, value).toLowerCase();
|
|
3305
|
-
|
|
3306
|
-
|
|
3307
|
-
result[
|
|
3284
|
+
const rgbPath = [...path, "rgb"];
|
|
3285
|
+
const rgbTriple = printValue(rgbPath, colorRgb.slice(0, 3).join(", "));
|
|
3286
|
+
result[`${key}-rgb`] = rgbTriple;
|
|
3308
3287
|
if (augmentWithId) {
|
|
3309
|
-
result[
|
|
3288
|
+
result[`${key}-rgb-id`] = objectPathToCssVarIdentifier(rgbPath);
|
|
3310
3289
|
}
|
|
3311
3290
|
}
|
|
3312
3291
|
if (augmentWithId) {
|
|
3313
|
-
result[
|
|
3292
|
+
result[`${key}-id`] = objectPathToCssVarIdentifier(path);
|
|
3314
3293
|
}
|
|
3315
3294
|
return result;
|
|
3316
3295
|
};
|
|
3317
|
-
exports.addExtraThemeEntries = addExtraThemeEntries;
|
|
3318
3296
|
}
|
|
3319
3297
|
});
|
|
3320
3298
|
|
|
3321
|
-
// ../design-tokens/
|
|
3322
|
-
|
|
3323
|
-
|
|
3324
|
-
|
|
3325
|
-
|
|
3326
|
-
|
|
3327
|
-
|
|
3328
|
-
|
|
3329
|
-
|
|
3330
|
-
if (Object.prototype.hasOwnProperty.call(s, p))
|
|
3331
|
-
t[p] = s[p];
|
|
3332
|
-
}
|
|
3333
|
-
return t;
|
|
3334
|
-
};
|
|
3335
|
-
return __assign.apply(this, arguments);
|
|
3336
|
-
};
|
|
3337
|
-
var __spreadArray = exports && exports.__spreadArray || function(to, from, pack) {
|
|
3338
|
-
if (pack || arguments.length === 2)
|
|
3339
|
-
for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
3340
|
-
if (ar || !(i in from)) {
|
|
3341
|
-
if (!ar)
|
|
3342
|
-
ar = Array.prototype.slice.call(from, 0, i);
|
|
3343
|
-
ar[i] = from[i];
|
|
3344
|
-
}
|
|
3345
|
-
}
|
|
3346
|
-
return to.concat(ar || Array.prototype.slice.call(from));
|
|
3299
|
+
// ../design-tokens/src/lib/mapLeafsOfObject.ts
|
|
3300
|
+
function mapLeafsOfObject(object, mapper) {
|
|
3301
|
+
const recurser = (currentPath, obj) => {
|
|
3302
|
+
const handleEntry = (key, value) => {
|
|
3303
|
+
const pathToKey = [...currentPath, key];
|
|
3304
|
+
if (typeof value === "object" && value !== null && value !== void 0) {
|
|
3305
|
+
return recurser(pathToKey, value);
|
|
3306
|
+
}
|
|
3307
|
+
return mapper(pathToKey, value);
|
|
3347
3308
|
};
|
|
3348
|
-
Object.
|
|
3349
|
-
|
|
3350
|
-
|
|
3351
|
-
|
|
3352
|
-
|
|
3353
|
-
|
|
3354
|
-
|
|
3355
|
-
|
|
3356
|
-
|
|
3357
|
-
|
|
3358
|
-
|
|
3359
|
-
|
|
3360
|
-
|
|
3361
|
-
var nextKey = _a[0], nextValue = _a[1];
|
|
3362
|
-
return __assign(__assign({}, acc), (_b = {}, _b[nextKey] = handleEntry(nextKey, nextValue), _b));
|
|
3363
|
-
}, {});
|
|
3364
|
-
};
|
|
3365
|
-
return recurser([], object);
|
|
3366
|
-
}
|
|
3367
|
-
exports.mapLeafsOfObject = mapLeafsOfObject;
|
|
3309
|
+
return Object.entries(obj).reduce(
|
|
3310
|
+
(acc, [nextKey, nextValue]) => ({
|
|
3311
|
+
...acc,
|
|
3312
|
+
[nextKey]: handleEntry(nextKey, nextValue)
|
|
3313
|
+
}),
|
|
3314
|
+
{}
|
|
3315
|
+
);
|
|
3316
|
+
};
|
|
3317
|
+
return recurser([], object);
|
|
3318
|
+
}
|
|
3319
|
+
var init_mapLeafsOfObject = __esm({
|
|
3320
|
+
"../design-tokens/src/lib/mapLeafsOfObject.ts"() {
|
|
3321
|
+
"use strict";
|
|
3368
3322
|
}
|
|
3369
3323
|
});
|
|
3370
3324
|
|
|
3371
|
-
// ../design-tokens/
|
|
3372
|
-
|
|
3373
|
-
|
|
3374
|
-
|
|
3375
|
-
|
|
3376
|
-
|
|
3377
|
-
|
|
3378
|
-
|
|
3379
|
-
|
|
3380
|
-
|
|
3381
|
-
|
|
3382
|
-
|
|
3383
|
-
|
|
3384
|
-
|
|
3385
|
-
|
|
3325
|
+
// ../design-tokens/src/lib/makeCssVariableDefinitionsMap.ts
|
|
3326
|
+
function makeCssVariableDefinitionsMap(theme) {
|
|
3327
|
+
let accumulatedCssVariables = {};
|
|
3328
|
+
mapLeafsOfObject(theme, (path, value) => {
|
|
3329
|
+
const key = objectPathToCssVarIdentifier(path);
|
|
3330
|
+
const nextCssVariables = addExtraThemeEntries(
|
|
3331
|
+
path,
|
|
3332
|
+
key,
|
|
3333
|
+
value,
|
|
3334
|
+
(_, v) => `${v}`,
|
|
3335
|
+
{ augmentWithId: false }
|
|
3336
|
+
);
|
|
3337
|
+
accumulatedCssVariables = {
|
|
3338
|
+
...accumulatedCssVariables,
|
|
3339
|
+
...nextCssVariables
|
|
3386
3340
|
};
|
|
3387
|
-
|
|
3388
|
-
|
|
3389
|
-
|
|
3390
|
-
|
|
3391
|
-
|
|
3392
|
-
|
|
3393
|
-
|
|
3394
|
-
|
|
3395
|
-
|
|
3396
|
-
var nextCssVariables = (0, addExtraThemeEntries_1.addExtraThemeEntries)(path, key, value, function(_, v) {
|
|
3397
|
-
return "".concat(v);
|
|
3398
|
-
}, { augmentWithId: false });
|
|
3399
|
-
accumulatedCssVariables = __assign(__assign({}, accumulatedCssVariables), nextCssVariables);
|
|
3400
|
-
});
|
|
3401
|
-
return accumulatedCssVariables;
|
|
3402
|
-
}
|
|
3403
|
-
exports.makeCssVariableDefinitionsMap = makeCssVariableDefinitionsMap2;
|
|
3341
|
+
});
|
|
3342
|
+
return accumulatedCssVariables;
|
|
3343
|
+
}
|
|
3344
|
+
var init_makeCssVariableDefinitionsMap = __esm({
|
|
3345
|
+
"../design-tokens/src/lib/makeCssVariableDefinitionsMap.ts"() {
|
|
3346
|
+
"use strict";
|
|
3347
|
+
init_addExtraThemeEntries();
|
|
3348
|
+
init_cssVariables();
|
|
3349
|
+
init_mapLeafsOfObject();
|
|
3404
3350
|
}
|
|
3405
3351
|
});
|
|
3406
3352
|
|
|
3407
|
-
// ../design-tokens/
|
|
3408
|
-
var
|
|
3409
|
-
|
|
3353
|
+
// ../design-tokens/src/ThemeManager.ts
|
|
3354
|
+
var ThemeManager;
|
|
3355
|
+
var init_ThemeManager = __esm({
|
|
3356
|
+
"../design-tokens/src/ThemeManager.ts"() {
|
|
3410
3357
|
"use strict";
|
|
3411
|
-
|
|
3412
|
-
|
|
3413
|
-
|
|
3414
|
-
|
|
3415
|
-
|
|
3416
|
-
|
|
3417
|
-
|
|
3418
|
-
|
|
3419
|
-
|
|
3420
|
-
|
|
3421
|
-
|
|
3422
|
-
|
|
3358
|
+
init_makeCssVariableDefinitionsMap();
|
|
3359
|
+
ThemeManager = class {
|
|
3360
|
+
constructor(theme, rootElementId = "", apply = true) {
|
|
3361
|
+
this.themeChangeListeners = [];
|
|
3362
|
+
this.rootElement = null;
|
|
3363
|
+
this.getRootElement = () => this.rootElement;
|
|
3364
|
+
this.getRootElementId = () => this.rootElementId;
|
|
3365
|
+
this.getCurrentTheme = () => this.theme;
|
|
3366
|
+
this.setRootElement = (element) => {
|
|
3367
|
+
this.rootElement = element;
|
|
3368
|
+
};
|
|
3369
|
+
this.setRootElementId = (rootElementId) => this.rootElementId = rootElementId;
|
|
3370
|
+
this.setAndApplyTheme = (theme, force) => {
|
|
3371
|
+
if (!force) {
|
|
3372
|
+
if (this.theme === theme)
|
|
3373
|
+
return;
|
|
3423
3374
|
}
|
|
3424
|
-
var _this = this;
|
|
3425
|
-
this.themeChangeListeners = [];
|
|
3426
|
-
this.rootElement = null;
|
|
3427
|
-
this.getRootElement = function() {
|
|
3428
|
-
return _this.rootElement;
|
|
3429
|
-
};
|
|
3430
|
-
this.getRootElementId = function() {
|
|
3431
|
-
return _this.rootElementId;
|
|
3432
|
-
};
|
|
3433
|
-
this.getCurrentTheme = function() {
|
|
3434
|
-
return _this.theme;
|
|
3435
|
-
};
|
|
3436
|
-
this.setRootElement = function(element) {
|
|
3437
|
-
_this.rootElement = element;
|
|
3438
|
-
};
|
|
3439
|
-
this.setRootElementId = function(rootElementId2) {
|
|
3440
|
-
return _this.rootElementId = rootElementId2;
|
|
3441
|
-
};
|
|
3442
|
-
this.setAndApplyTheme = function(theme2, force) {
|
|
3443
|
-
if (!force) {
|
|
3444
|
-
if (_this.theme === theme2)
|
|
3445
|
-
return;
|
|
3446
|
-
}
|
|
3447
|
-
_this.theme = theme2;
|
|
3448
|
-
_this.applyCurrentTheme();
|
|
3449
|
-
_this.notifyThemeChangeListeners(theme2);
|
|
3450
|
-
};
|
|
3451
|
-
this.addThemeChangeListener = function(listener) {
|
|
3452
|
-
_this.themeChangeListeners.push(listener);
|
|
3453
|
-
};
|
|
3454
|
-
this.removeThemeChangeListener = function(listener) {
|
|
3455
|
-
_this.themeChangeListeners = _this.themeChangeListeners.filter(function(l) {
|
|
3456
|
-
return l !== listener;
|
|
3457
|
-
});
|
|
3458
|
-
};
|
|
3459
|
-
this.applyCurrentTheme = function() {
|
|
3460
|
-
var _a;
|
|
3461
|
-
if (typeof window !== "undefined") {
|
|
3462
|
-
_this.setRootElement((_a = document.getElementById(_this.rootElementId)) !== null && _a !== void 0 ? _a : document.documentElement);
|
|
3463
|
-
var cssVariableDefinitions = (0, makeCssVariableDefinitionsMap_1.makeCssVariableDefinitionsMap)(_this.theme);
|
|
3464
|
-
Object.entries(cssVariableDefinitions).forEach(function(_a2) {
|
|
3465
|
-
var _b;
|
|
3466
|
-
var key = _a2[0], value = _a2[1];
|
|
3467
|
-
(_b = _this.rootElement) === null || _b === void 0 ? void 0 : _b.style.setProperty(key, value);
|
|
3468
|
-
});
|
|
3469
|
-
}
|
|
3470
|
-
};
|
|
3471
|
-
this.notifyThemeChangeListeners = function(theme2) {
|
|
3472
|
-
_this.themeChangeListeners.forEach(function(listener) {
|
|
3473
|
-
return listener(theme2);
|
|
3474
|
-
});
|
|
3475
|
-
};
|
|
3476
3375
|
this.theme = theme;
|
|
3477
|
-
this.
|
|
3478
|
-
|
|
3479
|
-
|
|
3480
|
-
|
|
3481
|
-
|
|
3482
|
-
|
|
3483
|
-
|
|
3484
|
-
|
|
3376
|
+
this.applyCurrentTheme();
|
|
3377
|
+
this.notifyThemeChangeListeners(theme);
|
|
3378
|
+
};
|
|
3379
|
+
this.addThemeChangeListener = (listener) => {
|
|
3380
|
+
this.themeChangeListeners.push(listener);
|
|
3381
|
+
};
|
|
3382
|
+
this.removeThemeChangeListener = (listener) => {
|
|
3383
|
+
this.themeChangeListeners = this.themeChangeListeners.filter(
|
|
3384
|
+
(l) => l !== listener
|
|
3385
|
+
);
|
|
3386
|
+
};
|
|
3387
|
+
this.applyCurrentTheme = () => {
|
|
3388
|
+
if (typeof window !== "undefined") {
|
|
3389
|
+
this.setRootElement(
|
|
3390
|
+
document.getElementById(this.rootElementId) ?? document.documentElement
|
|
3391
|
+
);
|
|
3392
|
+
const cssVariableDefinitions = makeCssVariableDefinitionsMap(this.theme);
|
|
3393
|
+
Object.entries(cssVariableDefinitions).forEach(([key, value]) => {
|
|
3394
|
+
var _a;
|
|
3395
|
+
(_a = this.rootElement) == null ? void 0 : _a.style.setProperty(key, value);
|
|
3396
|
+
});
|
|
3397
|
+
}
|
|
3398
|
+
};
|
|
3399
|
+
this.notifyThemeChangeListeners = (theme) => {
|
|
3400
|
+
this.themeChangeListeners.forEach((listener) => listener(theme));
|
|
3401
|
+
};
|
|
3402
|
+
this.theme = theme;
|
|
3403
|
+
this.rootElementId = rootElementId;
|
|
3404
|
+
if (apply)
|
|
3405
|
+
this.applyCurrentTheme();
|
|
3406
|
+
}
|
|
3407
|
+
};
|
|
3485
3408
|
}
|
|
3486
3409
|
});
|
|
3487
3410
|
|
|
3488
|
-
// ../design-tokens/
|
|
3489
|
-
var
|
|
3490
|
-
|
|
3411
|
+
// ../design-tokens/src/react/ThemeProvider.tsx
|
|
3412
|
+
var import_react, ThemeContext, ThemeProvider, useTheme;
|
|
3413
|
+
var init_ThemeProvider = __esm({
|
|
3414
|
+
"../design-tokens/src/react/ThemeProvider.tsx"() {
|
|
3491
3415
|
"use strict";
|
|
3492
|
-
|
|
3493
|
-
|
|
3494
|
-
|
|
3495
|
-
|
|
3496
|
-
|
|
3497
|
-
|
|
3498
|
-
|
|
3499
|
-
|
|
3500
|
-
|
|
3501
|
-
|
|
3502
|
-
|
|
3503
|
-
|
|
3504
|
-
|
|
3505
|
-
|
|
3506
|
-
|
|
3507
|
-
|
|
3508
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
3509
|
-
} : function(o, v) {
|
|
3510
|
-
o["default"] = v;
|
|
3511
|
-
});
|
|
3512
|
-
var __importStar = exports && exports.__importStar || function(mod) {
|
|
3513
|
-
if (mod && mod.__esModule)
|
|
3514
|
-
return mod;
|
|
3515
|
-
var result = {};
|
|
3516
|
-
if (mod != null) {
|
|
3517
|
-
for (var k in mod)
|
|
3518
|
-
if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k))
|
|
3519
|
-
__createBinding(result, mod, k);
|
|
3520
|
-
}
|
|
3521
|
-
__setModuleDefault(result, mod);
|
|
3522
|
-
return result;
|
|
3523
|
-
};
|
|
3524
|
-
var __rest = exports && exports.__rest || function(s, e) {
|
|
3525
|
-
var t = {};
|
|
3526
|
-
for (var p in s)
|
|
3527
|
-
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
3528
|
-
t[p] = s[p];
|
|
3529
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
3530
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
3531
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
3532
|
-
t[p[i]] = s[p[i]];
|
|
3533
|
-
}
|
|
3534
|
-
return t;
|
|
3535
|
-
};
|
|
3536
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3537
|
-
exports.useTheme = exports.ThemeProvider = exports.ThemeContext = void 0;
|
|
3538
|
-
var react_1 = __importStar(require_react());
|
|
3539
|
-
var __1 = require_dist();
|
|
3540
|
-
exports.ThemeContext = react_1.default.createContext(__1.defaultTheme);
|
|
3541
|
-
var ThemeProvider2 = function(_a) {
|
|
3542
|
-
var themeManager = _a.themeManager, props = __rest(_a, ["themeManager"]);
|
|
3543
|
-
var themeManagerInstance = (0, react_1.useState)(function() {
|
|
3544
|
-
return themeManager || new __1.ThemeManager(__1.defaultTheme);
|
|
3545
|
-
})[0];
|
|
3546
|
-
var _b = react_1.default.useState(themeManagerInstance.getCurrentTheme()), theme = _b[0], setTheme = _b[1];
|
|
3547
|
-
react_1.default.useEffect(function() {
|
|
3548
|
-
var cancelled = false;
|
|
3549
|
-
var listener = function(newTheme) {
|
|
3416
|
+
import_react = __toESM(require_react());
|
|
3417
|
+
init_src();
|
|
3418
|
+
ThemeContext = import_react.default.createContext(defaultTheme);
|
|
3419
|
+
ThemeProvider = ({
|
|
3420
|
+
themeManager,
|
|
3421
|
+
...props
|
|
3422
|
+
}) => {
|
|
3423
|
+
const [themeManagerInstance] = (0, import_react.useState)(
|
|
3424
|
+
() => themeManager || new ThemeManager(defaultTheme)
|
|
3425
|
+
);
|
|
3426
|
+
const [theme, setTheme] = import_react.default.useState(
|
|
3427
|
+
themeManagerInstance.getCurrentTheme()
|
|
3428
|
+
);
|
|
3429
|
+
import_react.default.useEffect(() => {
|
|
3430
|
+
let cancelled = false;
|
|
3431
|
+
const listener = (newTheme) => {
|
|
3550
3432
|
if (!cancelled)
|
|
3551
3433
|
setTheme(newTheme);
|
|
3552
3434
|
};
|
|
3553
3435
|
themeManagerInstance.addThemeChangeListener(listener);
|
|
3554
|
-
return
|
|
3436
|
+
return () => {
|
|
3555
3437
|
cancelled = true;
|
|
3556
3438
|
themeManagerInstance.removeThemeChangeListener(listener);
|
|
3557
3439
|
};
|
|
3558
3440
|
}, []);
|
|
3559
|
-
return
|
|
3560
|
-
|
|
3561
|
-
|
|
3562
|
-
|
|
3563
|
-
|
|
3564
|
-
|
|
3565
|
-
|
|
3566
|
-
|
|
3567
|
-
|
|
3568
|
-
)
|
|
3569
|
-
|
|
3570
|
-
|
|
3571
|
-
|
|
3572
|
-
|
|
3441
|
+
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(ThemeContext.Provider, { value: theme }, props.children), /* @__PURE__ */ import_react.default.createElement(
|
|
3442
|
+
"link",
|
|
3443
|
+
{
|
|
3444
|
+
rel: "preload",
|
|
3445
|
+
href: "https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-bold.woff2",
|
|
3446
|
+
as: "font",
|
|
3447
|
+
type: "font/woff2",
|
|
3448
|
+
crossOrigin: "anonymous"
|
|
3449
|
+
}
|
|
3450
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
3451
|
+
"link",
|
|
3452
|
+
{
|
|
3453
|
+
rel: "preload",
|
|
3454
|
+
href: "https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-demi-bold.woff2",
|
|
3455
|
+
as: "font",
|
|
3456
|
+
type: "font/woff2",
|
|
3457
|
+
crossOrigin: "anonymous"
|
|
3458
|
+
}
|
|
3459
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
3460
|
+
"link",
|
|
3461
|
+
{
|
|
3462
|
+
rel: "preload",
|
|
3463
|
+
href: "https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-medium.woff2",
|
|
3464
|
+
as: "font",
|
|
3465
|
+
type: "font/woff2",
|
|
3466
|
+
crossOrigin: "anonymous"
|
|
3467
|
+
}
|
|
3468
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
3469
|
+
"link",
|
|
3470
|
+
{
|
|
3471
|
+
rel: "preload",
|
|
3472
|
+
href: "https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-regular.woff2",
|
|
3473
|
+
as: "font",
|
|
3474
|
+
type: "font/woff2",
|
|
3475
|
+
crossOrigin: "anonymous"
|
|
3476
|
+
}
|
|
3477
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
3478
|
+
"link",
|
|
3479
|
+
{
|
|
3480
|
+
rel: "preload",
|
|
3481
|
+
href: "https://d1e7r7b0lb8p4d.cloudfront.net/fonts/tiempos/tiempos-headline-bold.woff2",
|
|
3482
|
+
as: "font",
|
|
3483
|
+
type: "font/woff2",
|
|
3484
|
+
crossOrigin: "anonymous"
|
|
3485
|
+
}
|
|
3486
|
+
));
|
|
3573
3487
|
};
|
|
3574
|
-
|
|
3488
|
+
useTheme = () => import_react.default.useContext(ThemeContext);
|
|
3575
3489
|
}
|
|
3576
3490
|
});
|
|
3577
3491
|
|
|
3578
|
-
// ../design-tokens/
|
|
3579
|
-
var
|
|
3580
|
-
"../design-tokens/
|
|
3492
|
+
// ../design-tokens/src/react/index.tsx
|
|
3493
|
+
var init_react = __esm({
|
|
3494
|
+
"../design-tokens/src/react/index.tsx"() {
|
|
3581
3495
|
"use strict";
|
|
3582
|
-
|
|
3583
|
-
if (k2 === void 0)
|
|
3584
|
-
k2 = k;
|
|
3585
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
3586
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
3587
|
-
desc = { enumerable: true, get: function() {
|
|
3588
|
-
return m[k];
|
|
3589
|
-
} };
|
|
3590
|
-
}
|
|
3591
|
-
Object.defineProperty(o, k2, desc);
|
|
3592
|
-
} : function(o, m, k, k2) {
|
|
3593
|
-
if (k2 === void 0)
|
|
3594
|
-
k2 = k;
|
|
3595
|
-
o[k2] = m[k];
|
|
3596
|
-
});
|
|
3597
|
-
var __exportStar = exports && exports.__exportStar || function(m, exports2) {
|
|
3598
|
-
for (var p in m)
|
|
3599
|
-
if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports2, p))
|
|
3600
|
-
__createBinding(exports2, m, p);
|
|
3601
|
-
};
|
|
3602
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3603
|
-
__exportStar(require_ThemeProvider(), exports);
|
|
3496
|
+
init_ThemeProvider();
|
|
3604
3497
|
}
|
|
3605
3498
|
});
|
|
3606
3499
|
|
|
3607
|
-
// ../design-tokens/
|
|
3500
|
+
// ../design-tokens/src/tailwind/tailwind-presets.ts
|
|
3608
3501
|
var require_tailwind_presets = __commonJS({
|
|
3609
|
-
"../design-tokens/
|
|
3502
|
+
"../design-tokens/src/tailwind/tailwind-presets.ts"(exports, module) {
|
|
3610
3503
|
"use strict";
|
|
3611
|
-
|
|
3612
|
-
__assign = Object.assign || function(t) {
|
|
3613
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
3614
|
-
s = arguments[i];
|
|
3615
|
-
for (var p in s)
|
|
3616
|
-
if (Object.prototype.hasOwnProperty.call(s, p))
|
|
3617
|
-
t[p] = s[p];
|
|
3618
|
-
}
|
|
3619
|
-
return t;
|
|
3620
|
-
};
|
|
3621
|
-
return __assign.apply(this, arguments);
|
|
3622
|
-
};
|
|
3623
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3624
|
-
var __1 = require_dist();
|
|
3504
|
+
init_src();
|
|
3625
3505
|
var preset = {
|
|
3626
3506
|
theme: {
|
|
3627
|
-
colors:
|
|
3628
|
-
|
|
3507
|
+
colors: {
|
|
3508
|
+
transparent: "transparent",
|
|
3509
|
+
current: "currentColor",
|
|
3510
|
+
inherit: "inherit",
|
|
3511
|
+
...defaultTheme.color,
|
|
3512
|
+
...defaultTheme.dataViz
|
|
3513
|
+
},
|
|
3514
|
+
spacing: {
|
|
3515
|
+
...defaultTheme.spacing
|
|
3516
|
+
},
|
|
3629
3517
|
boxShadow: {
|
|
3630
3518
|
none: "none",
|
|
3631
|
-
sm:
|
|
3632
|
-
lg:
|
|
3519
|
+
sm: defaultTheme.shadow.small.boxShadow,
|
|
3520
|
+
lg: defaultTheme.shadow.large.boxShadow
|
|
3633
3521
|
},
|
|
3634
3522
|
borderRadius: {
|
|
3635
3523
|
none: "0px",
|
|
@@ -3644,34 +3532,34 @@
|
|
|
3644
3532
|
// how do we want to handle our focus rings?
|
|
3645
3533
|
// tailwind used a `ring` property
|
|
3646
3534
|
borderColor: {
|
|
3647
|
-
"color-solid":
|
|
3648
|
-
"color-transparent":
|
|
3649
|
-
"color-focus-ring":
|
|
3535
|
+
"color-solid": defaultTheme.border.solid.borderColor,
|
|
3536
|
+
"color-transparent": defaultTheme.border.borderless.borderColor,
|
|
3537
|
+
"color-focus-ring": defaultTheme.color.blue[600]
|
|
3650
3538
|
},
|
|
3651
3539
|
fontFamily: {
|
|
3652
|
-
"family-paragraph":
|
|
3653
|
-
"family-heading":
|
|
3654
|
-
"family-data":
|
|
3655
|
-
"family-display":
|
|
3540
|
+
"family-paragraph": defaultTheme.typography.paragraphBody.fontFamily,
|
|
3541
|
+
"family-heading": defaultTheme.typography.heading1.fontFamily,
|
|
3542
|
+
"family-data": defaultTheme.typography.dataLarge.fontFamily,
|
|
3543
|
+
"family-display": defaultTheme.typography.display0.fontFamily
|
|
3656
3544
|
},
|
|
3657
3545
|
fontSize: {
|
|
3658
|
-
"size-display":
|
|
3659
|
-
"size-heading-1":
|
|
3660
|
-
"size-heading-2":
|
|
3661
|
-
"size-heading-3":
|
|
3662
|
-
"size-heading-4":
|
|
3663
|
-
"size-heading-5":
|
|
3664
|
-
"size-heading-6":
|
|
3665
|
-
"size-paragraph":
|
|
3666
|
-
"size-paragraph-lede":
|
|
3667
|
-
"size-paragraph-sm":
|
|
3668
|
-
"size-paragraph-xs":
|
|
3669
|
-
"size-data-lg":
|
|
3670
|
-
"size-data-md":
|
|
3671
|
-
"size-data-sm":
|
|
3672
|
-
"size-data-units-lg":
|
|
3673
|
-
"size-data-units-md":
|
|
3674
|
-
"size-data-units-sm":
|
|
3546
|
+
"size-display": defaultTheme.typography.display0.fontSize,
|
|
3547
|
+
"size-heading-1": defaultTheme.typography.heading1.fontSize,
|
|
3548
|
+
"size-heading-2": defaultTheme.typography.heading2.fontSize,
|
|
3549
|
+
"size-heading-3": defaultTheme.typography.heading3.fontSize,
|
|
3550
|
+
"size-heading-4": defaultTheme.typography.heading4.fontSize,
|
|
3551
|
+
"size-heading-5": defaultTheme.typography.heading5.fontSize,
|
|
3552
|
+
"size-heading-6": defaultTheme.typography.heading6.fontSize,
|
|
3553
|
+
"size-paragraph": defaultTheme.typography.paragraphBody.fontSize,
|
|
3554
|
+
"size-paragraph-lede": defaultTheme.typography.paragraphIntroLede.fontSize,
|
|
3555
|
+
"size-paragraph-sm": defaultTheme.typography.paragraphSmall.fontSize,
|
|
3556
|
+
"size-paragraph-xs": defaultTheme.typography.paragraphExtraSmall.fontSize,
|
|
3557
|
+
"size-data-lg": defaultTheme.typography.dataLarge.fontSize,
|
|
3558
|
+
"size-data-md": defaultTheme.typography.dataMedium.fontSize,
|
|
3559
|
+
"size-data-sm": defaultTheme.typography.dataSmall.fontSize,
|
|
3560
|
+
"size-data-units-lg": defaultTheme.typography.dataLargeUnits.fontSize,
|
|
3561
|
+
"size-data-units-md": defaultTheme.typography.dataMediumUnits.fontSize,
|
|
3562
|
+
"size-data-units-sm": defaultTheme.typography.dataSmallUnits.fontSize
|
|
3675
3563
|
},
|
|
3676
3564
|
// font weights could have specific tokens (current don't)
|
|
3677
3565
|
fontWeight: {
|
|
@@ -3687,161 +3575,141 @@
|
|
|
3687
3575
|
"weight-display": "800"
|
|
3688
3576
|
},
|
|
3689
3577
|
lineHeight: {
|
|
3690
|
-
"height-display":
|
|
3691
|
-
"height-heading-1":
|
|
3692
|
-
"height-heading-2":
|
|
3693
|
-
"height-heading-3":
|
|
3694
|
-
"height-heading-4":
|
|
3695
|
-
"height-heading-5":
|
|
3696
|
-
"height-heading-6":
|
|
3697
|
-
"height-paragraph":
|
|
3698
|
-
"height-paragraph-lede":
|
|
3699
|
-
"height-paragraph-sm":
|
|
3700
|
-
"height-paragraph-xs":
|
|
3701
|
-
"height-data-lg":
|
|
3702
|
-
"height-data-md":
|
|
3703
|
-
"height-data-sm":
|
|
3704
|
-
"height-data-units-lg":
|
|
3705
|
-
"height-data-units-md":
|
|
3706
|
-
"height-data-units-sm":
|
|
3578
|
+
"height-display": defaultTheme.typography.display0.lineHeight,
|
|
3579
|
+
"height-heading-1": defaultTheme.typography.heading1.lineHeight,
|
|
3580
|
+
"height-heading-2": defaultTheme.typography.heading2.lineHeight,
|
|
3581
|
+
"height-heading-3": defaultTheme.typography.heading3.lineHeight,
|
|
3582
|
+
"height-heading-4": defaultTheme.typography.heading4.lineHeight,
|
|
3583
|
+
"height-heading-5": defaultTheme.typography.heading5.lineHeight,
|
|
3584
|
+
"height-heading-6": defaultTheme.typography.heading6.lineHeight,
|
|
3585
|
+
"height-paragraph": defaultTheme.typography.paragraphBody.lineHeight,
|
|
3586
|
+
"height-paragraph-lede": defaultTheme.typography.paragraphIntroLede.lineHeight,
|
|
3587
|
+
"height-paragraph-sm": defaultTheme.typography.paragraphSmall.lineHeight,
|
|
3588
|
+
"height-paragraph-xs": defaultTheme.typography.paragraphExtraSmall.lineHeight,
|
|
3589
|
+
"height-data-lg": defaultTheme.typography.dataLarge.lineHeight,
|
|
3590
|
+
"height-data-md": defaultTheme.typography.dataMedium.lineHeight,
|
|
3591
|
+
"height-data-sm": defaultTheme.typography.dataSmall.lineHeight,
|
|
3592
|
+
"height-data-units-lg": defaultTheme.typography.dataLargeUnits.lineHeight,
|
|
3593
|
+
"height-data-units-md": defaultTheme.typography.dataMediumUnits.lineHeight,
|
|
3594
|
+
"height-data-units-sm": defaultTheme.typography.dataSmallUnits.lineHeight
|
|
3707
3595
|
},
|
|
3708
3596
|
letterSpacing: {
|
|
3709
3597
|
"spacing-normal": "normal"
|
|
3710
3598
|
},
|
|
3711
3599
|
// A mix of layout styles
|
|
3712
3600
|
maxWidth: {
|
|
3713
|
-
content:
|
|
3714
|
-
"content-with-side":
|
|
3601
|
+
content: defaultTheme.layout.contentMaxWidth,
|
|
3602
|
+
"content-with-side": defaultTheme.layout.contentMaxWidthWithSidebar
|
|
3715
3603
|
},
|
|
3716
3604
|
width: {
|
|
3717
|
-
"content-side-margin":
|
|
3605
|
+
"content-side-margin": defaultTheme.layout.contentSideMargin
|
|
3718
3606
|
},
|
|
3719
3607
|
height: {
|
|
3720
|
-
"mobile-actions-drawer-height":
|
|
3721
|
-
"navigation-bar-height":
|
|
3608
|
+
"mobile-actions-drawer-height": defaultTheme.layout.mobileActionsDrawerHeight,
|
|
3609
|
+
"navigation-bar-height": defaultTheme.layout.navigationBarHeight
|
|
3722
3610
|
},
|
|
3723
3611
|
// we will probably want to review viewport sizing
|
|
3724
|
-
screens:
|
|
3612
|
+
screens: {
|
|
3613
|
+
...defaultTheme.layout.breakpoints
|
|
3614
|
+
}
|
|
3725
3615
|
}
|
|
3726
3616
|
};
|
|
3727
3617
|
module.exports.TailwindPreset = preset;
|
|
3728
3618
|
}
|
|
3729
3619
|
});
|
|
3730
3620
|
|
|
3731
|
-
// ../design-tokens/
|
|
3732
|
-
var
|
|
3733
|
-
|
|
3621
|
+
// ../design-tokens/src/tailwind/index.ts
|
|
3622
|
+
var tailwind_exports = {};
|
|
3623
|
+
var init_tailwind = __esm({
|
|
3624
|
+
"../design-tokens/src/tailwind/index.ts"() {
|
|
3734
3625
|
"use strict";
|
|
3735
|
-
|
|
3736
|
-
if (k2 === void 0)
|
|
3737
|
-
k2 = k;
|
|
3738
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
3739
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
3740
|
-
desc = { enumerable: true, get: function() {
|
|
3741
|
-
return m[k];
|
|
3742
|
-
} };
|
|
3743
|
-
}
|
|
3744
|
-
Object.defineProperty(o, k2, desc);
|
|
3745
|
-
} : function(o, m, k, k2) {
|
|
3746
|
-
if (k2 === void 0)
|
|
3747
|
-
k2 = k;
|
|
3748
|
-
o[k2] = m[k];
|
|
3749
|
-
});
|
|
3750
|
-
var __exportStar = exports && exports.__exportStar || function(m, exports2) {
|
|
3751
|
-
for (var p in m)
|
|
3752
|
-
if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports2, p))
|
|
3753
|
-
__createBinding(exports2, m, p);
|
|
3754
|
-
};
|
|
3755
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3756
|
-
__exportStar(require_tailwind_presets(), exports);
|
|
3626
|
+
__reExport(tailwind_exports, __toESM(require_tailwind_presets()));
|
|
3757
3627
|
}
|
|
3758
3628
|
});
|
|
3759
3629
|
|
|
3760
|
-
// ../design-tokens/
|
|
3761
|
-
|
|
3762
|
-
|
|
3763
|
-
|
|
3764
|
-
|
|
3765
|
-
|
|
3766
|
-
|
|
3767
|
-
|
|
3768
|
-
|
|
3769
|
-
|
|
3770
|
-
|
|
3771
|
-
|
|
3772
|
-
}
|
|
3773
|
-
var augmentedTheme = {};
|
|
3774
|
-
var mapper = function(leafPath, value) {
|
|
3775
|
-
var leafKey = leafPath[leafPath.length - 1];
|
|
3776
|
-
var pathWithoutLast = leafPath.slice(0, leafPath.length - 1);
|
|
3777
|
-
var leafObject = pathWithoutLast.reduce(function(child, segment) {
|
|
3778
|
-
return child[segment] || (child[segment] = {});
|
|
3779
|
-
}, augmentedTheme);
|
|
3780
|
-
if (!leafKey) {
|
|
3781
|
-
throw new Error("leafKey is undefined");
|
|
3782
|
-
}
|
|
3783
|
-
var cssVariablesOfToken = (0, addExtraThemeEntries_1.addExtraThemeEntries)(leafPath, leafKey, value, printValue, { augmentWithId: true });
|
|
3784
|
-
Object.assign(leafObject, cssVariablesOfToken);
|
|
3785
|
-
};
|
|
3786
|
-
(0, mapLeafsOfObject_1.mapLeafsOfObject)(theme, mapper);
|
|
3787
|
-
return augmentedTheme;
|
|
3630
|
+
// ../design-tokens/src/lib/makeCssVariableTheme.ts
|
|
3631
|
+
function makeCSSVariableTheme(theme, printValue = objectPathToCssVarFunction) {
|
|
3632
|
+
const augmentedTheme = {};
|
|
3633
|
+
const mapper = (leafPath, value) => {
|
|
3634
|
+
const leafKey = leafPath[leafPath.length - 1];
|
|
3635
|
+
const pathWithoutLast = leafPath.slice(0, leafPath.length - 1);
|
|
3636
|
+
const leafObject = pathWithoutLast.reduce(
|
|
3637
|
+
(child, segment) => child[segment] || (child[segment] = {}),
|
|
3638
|
+
augmentedTheme
|
|
3639
|
+
);
|
|
3640
|
+
if (!leafKey) {
|
|
3641
|
+
throw new Error("leafKey is undefined");
|
|
3788
3642
|
}
|
|
3789
|
-
|
|
3643
|
+
const cssVariablesOfToken = addExtraThemeEntries(
|
|
3644
|
+
leafPath,
|
|
3645
|
+
leafKey,
|
|
3646
|
+
value,
|
|
3647
|
+
printValue,
|
|
3648
|
+
{ augmentWithId: true }
|
|
3649
|
+
);
|
|
3650
|
+
Object.assign(leafObject, cssVariablesOfToken);
|
|
3651
|
+
};
|
|
3652
|
+
mapLeafsOfObject(theme, mapper);
|
|
3653
|
+
return augmentedTheme;
|
|
3654
|
+
}
|
|
3655
|
+
var init_makeCssVariableTheme = __esm({
|
|
3656
|
+
"../design-tokens/src/lib/makeCssVariableTheme.ts"() {
|
|
3657
|
+
"use strict";
|
|
3658
|
+
init_addExtraThemeEntries();
|
|
3659
|
+
init_cssVariables();
|
|
3660
|
+
init_mapLeafsOfObject();
|
|
3790
3661
|
}
|
|
3791
3662
|
});
|
|
3792
3663
|
|
|
3793
|
-
// ../design-tokens/
|
|
3794
|
-
var
|
|
3795
|
-
|
|
3664
|
+
// ../design-tokens/src/index.ts
|
|
3665
|
+
var src_exports = {};
|
|
3666
|
+
__export(src_exports, {
|
|
3667
|
+
ThemeContext: () => ThemeContext,
|
|
3668
|
+
ThemeManager: () => ThemeManager,
|
|
3669
|
+
ThemeProvider: () => ThemeProvider,
|
|
3670
|
+
defaultTheme: () => defaultTheme,
|
|
3671
|
+
heartTheme: () => heartTheme,
|
|
3672
|
+
makeCSSVariableTheme: () => makeCSSVariableTheme,
|
|
3673
|
+
makeCssVariableDefinitionsMap: () => makeCssVariableDefinitionsMap,
|
|
3674
|
+
mapLeafsOfObject: () => mapLeafsOfObject,
|
|
3675
|
+
useTheme: () => useTheme
|
|
3676
|
+
});
|
|
3677
|
+
var init_src = __esm({
|
|
3678
|
+
"../design-tokens/src/index.ts"() {
|
|
3796
3679
|
"use strict";
|
|
3797
|
-
|
|
3798
|
-
|
|
3799
|
-
|
|
3800
|
-
|
|
3801
|
-
|
|
3802
|
-
|
|
3803
|
-
|
|
3804
|
-
|
|
3805
|
-
|
|
3806
|
-
Object.defineProperty(o, k2, desc);
|
|
3807
|
-
} : function(o, m, k, k2) {
|
|
3808
|
-
if (k2 === void 0)
|
|
3809
|
-
k2 = k;
|
|
3810
|
-
o[k2] = m[k];
|
|
3811
|
-
});
|
|
3812
|
-
var __exportStar = exports && exports.__exportStar || function(m, exports2) {
|
|
3813
|
-
for (var p in m)
|
|
3814
|
-
if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports2, p))
|
|
3815
|
-
__createBinding(exports2, m, p);
|
|
3816
|
-
};
|
|
3817
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3818
|
-
exports.mapLeafsOfObject = exports.makeCSSVariableTheme = exports.makeCssVariableDefinitionsMap = void 0;
|
|
3819
|
-
__exportStar(require_themes(), exports);
|
|
3820
|
-
__exportStar(require_types(), exports);
|
|
3821
|
-
__exportStar(require_ThemeManager(), exports);
|
|
3822
|
-
__exportStar(require_react2(), exports);
|
|
3823
|
-
__exportStar(require_tailwind(), exports);
|
|
3824
|
-
var makeCssVariableDefinitionsMap_1 = require_makeCssVariableDefinitionsMap();
|
|
3825
|
-
Object.defineProperty(exports, "makeCssVariableDefinitionsMap", { enumerable: true, get: function() {
|
|
3826
|
-
return makeCssVariableDefinitionsMap_1.makeCssVariableDefinitionsMap;
|
|
3827
|
-
} });
|
|
3828
|
-
var makeCssVariableTheme_1 = require_makeCssVariableTheme();
|
|
3829
|
-
Object.defineProperty(exports, "makeCSSVariableTheme", { enumerable: true, get: function() {
|
|
3830
|
-
return makeCssVariableTheme_1.makeCSSVariableTheme;
|
|
3831
|
-
} });
|
|
3832
|
-
var mapLeafsOfObject_1 = require_mapLeafsOfObject();
|
|
3833
|
-
Object.defineProperty(exports, "mapLeafsOfObject", { enumerable: true, get: function() {
|
|
3834
|
-
return mapLeafsOfObject_1.mapLeafsOfObject;
|
|
3835
|
-
} });
|
|
3680
|
+
init_themes();
|
|
3681
|
+
init_types();
|
|
3682
|
+
init_ThemeManager();
|
|
3683
|
+
init_react();
|
|
3684
|
+
init_tailwind();
|
|
3685
|
+
__reExport(src_exports, tailwind_exports);
|
|
3686
|
+
init_makeCssVariableDefinitionsMap();
|
|
3687
|
+
init_makeCssVariableTheme();
|
|
3688
|
+
init_mapLeafsOfObject();
|
|
3836
3689
|
}
|
|
3837
3690
|
});
|
|
3838
3691
|
|
|
3839
3692
|
// src/KaizenProvider/ThemeProvider/ThemeProvider.tsx
|
|
3840
|
-
var
|
|
3693
|
+
var import_react2 = __toESM(require_react());
|
|
3694
|
+
|
|
3695
|
+
// ../design-tokens/index.ts
|
|
3696
|
+
var design_tokens_exports = {};
|
|
3697
|
+
__export(design_tokens_exports, {
|
|
3698
|
+
ThemeContext: () => ThemeContext,
|
|
3699
|
+
ThemeManager: () => ThemeManager,
|
|
3700
|
+
ThemeProvider: () => ThemeProvider,
|
|
3701
|
+
defaultTheme: () => defaultTheme,
|
|
3702
|
+
heartTheme: () => heartTheme,
|
|
3703
|
+
makeCSSVariableTheme: () => makeCSSVariableTheme,
|
|
3704
|
+
makeCssVariableDefinitionsMap: () => makeCssVariableDefinitionsMap,
|
|
3705
|
+
mapLeafsOfObject: () => mapLeafsOfObject,
|
|
3706
|
+
useTheme: () => useTheme
|
|
3707
|
+
});
|
|
3708
|
+
init_src();
|
|
3709
|
+
__reExport(design_tokens_exports, src_exports);
|
|
3841
3710
|
|
|
3842
3711
|
// src/KaizenProvider/ThemeProvider/ThemeManager.ts
|
|
3843
|
-
var
|
|
3844
|
-
var ThemeManager = class {
|
|
3712
|
+
var ThemeManager2 = class {
|
|
3845
3713
|
constructor(theme, rootElementId = "", apply = true) {
|
|
3846
3714
|
this.themeChangeListeners = [];
|
|
3847
3715
|
this.rootElement = null;
|
|
@@ -3874,7 +3742,7 @@
|
|
|
3874
3742
|
this.setRootElement(
|
|
3875
3743
|
document.getElementById(this.rootElementId) ?? document.documentElement
|
|
3876
3744
|
);
|
|
3877
|
-
const cssVariableDefinitions =
|
|
3745
|
+
const cssVariableDefinitions = makeCssVariableDefinitionsMap(this.theme);
|
|
3878
3746
|
Object.entries(cssVariableDefinitions).forEach(([key, value]) => {
|
|
3879
3747
|
var _a;
|
|
3880
3748
|
(_a = this.rootElement) == null ? void 0 : _a.style.setProperty(key, value);
|
|
@@ -3892,7 +3760,7 @@
|
|
|
3892
3760
|
};
|
|
3893
3761
|
|
|
3894
3762
|
// src/KaizenProvider/ThemeProvider/themes/heart.ts
|
|
3895
|
-
var
|
|
3763
|
+
var heartTheme2 = {
|
|
3896
3764
|
themeKey: "heart",
|
|
3897
3765
|
animation: {
|
|
3898
3766
|
easingFunction: {
|
|
@@ -4202,21 +4070,21 @@
|
|
|
4202
4070
|
};
|
|
4203
4071
|
|
|
4204
4072
|
// src/KaizenProvider/ThemeProvider/themes/index.ts
|
|
4205
|
-
var
|
|
4073
|
+
var defaultTheme2 = heartTheme2;
|
|
4206
4074
|
|
|
4207
4075
|
// src/KaizenProvider/ThemeProvider/ThemeProvider.tsx
|
|
4208
|
-
var
|
|
4209
|
-
var
|
|
4076
|
+
var ThemeContext2 = (0, import_react2.createContext)(defaultTheme2);
|
|
4077
|
+
var ThemeProvider2 = ({
|
|
4210
4078
|
themeManager,
|
|
4211
4079
|
...props
|
|
4212
4080
|
}) => {
|
|
4213
|
-
const [themeManagerInstance] = (0,
|
|
4214
|
-
() => themeManager || new
|
|
4081
|
+
const [themeManagerInstance] = (0, import_react2.useState)(
|
|
4082
|
+
() => themeManager || new ThemeManager2(defaultTheme2)
|
|
4215
4083
|
);
|
|
4216
|
-
const [theme, setTheme] = (0,
|
|
4084
|
+
const [theme, setTheme] = (0, import_react2.useState)(
|
|
4217
4085
|
themeManagerInstance.getCurrentTheme()
|
|
4218
4086
|
);
|
|
4219
|
-
(0,
|
|
4087
|
+
(0, import_react2.useEffect)(() => {
|
|
4220
4088
|
let cancelled = false;
|
|
4221
4089
|
const listener = (newTheme) => {
|
|
4222
4090
|
if (!cancelled)
|
|
@@ -4228,7 +4096,7 @@
|
|
|
4228
4096
|
themeManagerInstance.removeThemeChangeListener(listener);
|
|
4229
4097
|
};
|
|
4230
4098
|
}, []);
|
|
4231
|
-
return /* @__PURE__ */
|
|
4099
|
+
return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement(ThemeContext2.Provider, { value: theme }, props.children), /* @__PURE__ */ import_react2.default.createElement(
|
|
4232
4100
|
"link",
|
|
4233
4101
|
{
|
|
4234
4102
|
rel: "preload",
|
|
@@ -4237,7 +4105,7 @@
|
|
|
4237
4105
|
type: "font/woff2",
|
|
4238
4106
|
crossOrigin: "anonymous"
|
|
4239
4107
|
}
|
|
4240
|
-
), /* @__PURE__ */
|
|
4108
|
+
), /* @__PURE__ */ import_react2.default.createElement(
|
|
4241
4109
|
"link",
|
|
4242
4110
|
{
|
|
4243
4111
|
rel: "preload",
|
|
@@ -4246,7 +4114,7 @@
|
|
|
4246
4114
|
type: "font/woff2",
|
|
4247
4115
|
crossOrigin: "anonymous"
|
|
4248
4116
|
}
|
|
4249
|
-
), /* @__PURE__ */
|
|
4117
|
+
), /* @__PURE__ */ import_react2.default.createElement(
|
|
4250
4118
|
"link",
|
|
4251
4119
|
{
|
|
4252
4120
|
rel: "preload",
|
|
@@ -4255,7 +4123,7 @@
|
|
|
4255
4123
|
type: "font/woff2",
|
|
4256
4124
|
crossOrigin: "anonymous"
|
|
4257
4125
|
}
|
|
4258
|
-
), /* @__PURE__ */
|
|
4126
|
+
), /* @__PURE__ */ import_react2.default.createElement(
|
|
4259
4127
|
"link",
|
|
4260
4128
|
{
|
|
4261
4129
|
rel: "preload",
|
|
@@ -4264,7 +4132,7 @@
|
|
|
4264
4132
|
type: "font/woff2",
|
|
4265
4133
|
crossOrigin: "anonymous"
|
|
4266
4134
|
}
|
|
4267
|
-
), /* @__PURE__ */
|
|
4135
|
+
), /* @__PURE__ */ import_react2.default.createElement(
|
|
4268
4136
|
"link",
|
|
4269
4137
|
{
|
|
4270
4138
|
rel: "preload",
|
|
@@ -4275,7 +4143,7 @@
|
|
|
4275
4143
|
}
|
|
4276
4144
|
));
|
|
4277
4145
|
};
|
|
4278
|
-
var
|
|
4146
|
+
var useTheme2 = () => (0, import_react2.useContext)(ThemeContext2);
|
|
4279
4147
|
})();
|
|
4280
4148
|
/*! Bundled license information:
|
|
4281
4149
|
|