@workday/canvas-kit-styling 10.3.20 → 10.3.22
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/commonjs/lib/cs.d.ts +36 -3
- package/dist/commonjs/lib/cs.d.ts.map +1 -1
- package/dist/commonjs/lib/cs.js +90 -23
- package/dist/es6/lib/cs.d.ts +36 -3
- package/dist/es6/lib/cs.d.ts.map +1 -1
- package/dist/es6/lib/cs.js +63 -22
- package/package.json +3 -4
|
@@ -1,5 +1,8 @@
|
|
|
1
|
+
import * as EmotionCSS from '@emotion/css';
|
|
2
|
+
import _createInstance from '@emotion/css/create-instance';
|
|
1
3
|
import { Keyframes, SerializedStyles, CSSObject } from '@emotion/serialize';
|
|
2
4
|
import { Properties } from 'csstype';
|
|
5
|
+
declare let _instance: ReturnType<typeof _createInstance>;
|
|
3
6
|
export declare const createStylesCache: Record<string, boolean>;
|
|
4
7
|
declare type CSSObjectWithVars<T extends CSSObject = CSSObject> = {
|
|
5
8
|
[P in keyof T]?: T[P] | (string & {});
|
|
@@ -344,8 +347,8 @@ export declare type StencilCompoundConfig<M> = {
|
|
|
344
347
|
};
|
|
345
348
|
styles: SerializedStyles | CSSObjectWithVars;
|
|
346
349
|
};
|
|
347
|
-
declare type ModifierValuesStencil<M extends StencilModifierConfig> = {
|
|
348
|
-
[P in keyof M]?: MaybeBoolean<keyof M[P]>;
|
|
350
|
+
declare type ModifierValuesStencil<M extends StencilModifierConfig, V extends Record<string, string> | Record<string, Record<string, string>> = {}> = {
|
|
351
|
+
[P in keyof M]?: P extends keyof V ? MaybeBoolean<keyof M[P]> | (string & {}) : MaybeBoolean<keyof M[P]>;
|
|
349
352
|
};
|
|
350
353
|
export interface StencilConfig<M extends Record<string, Record<string, StylesReturn<V>>>, V extends Record<string, string> | Record<string, Record<string, string>> = {}, ID extends string | never = never> {
|
|
351
354
|
vars?: V;
|
|
@@ -435,7 +438,7 @@ declare type StencilModifierReturn<M extends StencilModifierConfig<V>, V extends
|
|
|
435
438
|
};
|
|
436
439
|
};
|
|
437
440
|
export declare type Stencil<M extends StencilModifierConfig<V>, V extends Record<string, string> | Record<string, Record<string, string>>, ID extends string = never> = {
|
|
438
|
-
(modifiers?: ModifierValuesStencil<M> & VariableValuesStencil<V>): {
|
|
441
|
+
(modifiers?: ModifierValuesStencil<M, V> & VariableValuesStencil<V>): {
|
|
439
442
|
className: string;
|
|
440
443
|
style?: Record<string, string>;
|
|
441
444
|
};
|
|
@@ -455,9 +458,39 @@ declare type VariableValuesStencil<V extends Record<string, string> | Record<str
|
|
|
455
458
|
* compound modifiers.
|
|
456
459
|
*/
|
|
457
460
|
export declare function createStencil<M extends StencilModifierConfig<V>, V extends Record<string, string> | Record<string, Record<string, string>> = {}, ID extends string = never>(config: StencilConfig<M, V, ID>, id?: ID): Stencil<M, V, ID>;
|
|
461
|
+
/**
|
|
462
|
+
* Gets the current Emotion CSS instance, falling back to the one from `@emotion/css` if one wasn't
|
|
463
|
+
* already created. This allows a custom cache to be created as an opt-in
|
|
464
|
+
*/
|
|
465
|
+
export declare function getInstance(): typeof _instance;
|
|
466
|
+
/**
|
|
467
|
+
* Creates a custom instance of Emotion CSS. If this function is never called, the instance will be
|
|
468
|
+
* what gets imported from `@emotion/css`. This function must be called before any Canvas Kit
|
|
469
|
+
* component is imported or before any other `@workday/canvas-kit-styling` function is called. All
|
|
470
|
+
* the style utility functions need an instance and will automatically create one if one isn't
|
|
471
|
+
* already created.
|
|
472
|
+
*
|
|
473
|
+
* The style utilities inject styles as soon as they are called which means an instance needs to be
|
|
474
|
+
* created before any Canvas Kit components are even imported. Your application bootstrap must
|
|
475
|
+
* import a file that imports `@workday/canvas-kit-styling` and calls `createInstance` _before_ any
|
|
476
|
+
* other Canvas Kit components are imported.
|
|
477
|
+
*/
|
|
478
|
+
export declare const createInstance: typeof _createInstance;
|
|
479
|
+
/**
|
|
480
|
+
* Returns the cache used by all style utilities
|
|
481
|
+
*/
|
|
482
|
+
export declare function getCache(): EmotionCSS.EmotionCache;
|
|
483
|
+
/**
|
|
484
|
+
* Create static keyframes. Use as a drop-in replacement to `keyframes` found in `@emotion/css` or
|
|
485
|
+
* `@emotion/react`
|
|
486
|
+
*/
|
|
458
487
|
export declare function keyframes<ID extends string>(...args: ({
|
|
459
488
|
name: ID;
|
|
460
489
|
styles: string;
|
|
461
490
|
} | StyleProps | TemplateStringsArray)[]): ID;
|
|
491
|
+
/**
|
|
492
|
+
* Allows injecting of global styles.
|
|
493
|
+
*/
|
|
494
|
+
export declare const injectGlobal: typeof EmotionCSS.injectGlobal;
|
|
462
495
|
export {};
|
|
463
496
|
//# sourceMappingURL=cs.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cs.d.ts","sourceRoot":"","sources":["../../../lib/cs.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"cs.d.ts","sourceRoot":"","sources":["../../../lib/cs.ts"],"names":[],"mappings":"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"}
|
package/dist/commonjs/lib/cs.js
CHANGED
|
@@ -1,10 +1,33 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
5
|
+
}) : (function(o, m, k, k2) {
|
|
6
|
+
if (k2 === undefined) k2 = k;
|
|
7
|
+
o[k2] = m[k];
|
|
8
|
+
}));
|
|
9
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
10
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
11
|
+
}) : function(o, v) {
|
|
12
|
+
o["default"] = v;
|
|
13
|
+
});
|
|
14
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
15
|
+
if (mod && mod.__esModule) return mod;
|
|
16
|
+
var result = {};
|
|
17
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
18
|
+
__setModuleDefault(result, mod);
|
|
19
|
+
return result;
|
|
20
|
+
};
|
|
21
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
22
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
23
|
+
};
|
|
2
24
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.keyframes = exports.createStencil = exports.handleCsProp = exports.createStyles = exports.csToProps = exports.createCompoundModifiers = exports.createModifiers = exports.createDefaultedVars = exports.createVars = exports.cssVar = exports.createStylesCache = void 0;
|
|
4
|
-
const
|
|
5
|
-
const
|
|
25
|
+
exports.injectGlobal = exports.keyframes = exports.getCache = exports.createInstance = exports.getInstance = exports.createStencil = exports.handleCsProp = exports.createStyles = exports.csToProps = exports.createCompoundModifiers = exports.createModifiers = exports.createDefaultedVars = exports.createVars = exports.cssVar = exports.createStylesCache = void 0;
|
|
26
|
+
const EmotionCSS = __importStar(require("@emotion/css"));
|
|
27
|
+
const create_instance_1 = __importDefault(require("@emotion/css/create-instance"));
|
|
6
28
|
const serialize_1 = require("@emotion/serialize");
|
|
7
29
|
const uniqueId_1 = require("./uniqueId");
|
|
30
|
+
let _instance;
|
|
8
31
|
exports.createStylesCache = {};
|
|
9
32
|
/**
|
|
10
33
|
* Wrap all unwrapped CSS Variables. For example, `{padding: '--foo'}` will be replaced with
|
|
@@ -260,6 +283,7 @@ function isCsPropsReturn(input) {
|
|
|
260
283
|
* @returns
|
|
261
284
|
*/
|
|
262
285
|
function csToProps(input) {
|
|
286
|
+
const instance = getInstance();
|
|
263
287
|
// input is a string, so it must only be a class name
|
|
264
288
|
if (typeof input === 'string') {
|
|
265
289
|
return { className: input };
|
|
@@ -292,7 +316,7 @@ function csToProps(input) {
|
|
|
292
316
|
}
|
|
293
317
|
}
|
|
294
318
|
if (hasStaticStyles) {
|
|
295
|
-
const className =
|
|
319
|
+
const className = instance.css(staticStyles);
|
|
296
320
|
return { style: cssVars, className };
|
|
297
321
|
}
|
|
298
322
|
return { style: input };
|
|
@@ -331,6 +355,7 @@ exports.csToProps = csToProps;
|
|
|
331
355
|
* > to win are last in your file.
|
|
332
356
|
*/
|
|
333
357
|
function createStyles(...args) {
|
|
358
|
+
const instance = getInstance();
|
|
334
359
|
return args
|
|
335
360
|
.map(input => {
|
|
336
361
|
if (typeof input === 'string') {
|
|
@@ -338,7 +363,7 @@ function createStyles(...args) {
|
|
|
338
363
|
}
|
|
339
364
|
// If we were called with a {name, styles} object, it must be optimized. We'll shortcut here
|
|
340
365
|
if (typeof input === 'object' && input.name) {
|
|
341
|
-
return
|
|
366
|
+
return instance.css(input);
|
|
342
367
|
}
|
|
343
368
|
const convertedStyles = convertAllProperties(input);
|
|
344
369
|
// We want to call `serializeStyles` directly and ignore the hash generated so we can have
|
|
@@ -360,8 +385,8 @@ function createStyles(...args) {
|
|
|
360
385
|
// Without this "fix", anyone using the Emotion babel plugin would get different results than
|
|
361
386
|
// intended when styles are merged.
|
|
362
387
|
const name = uniqueId_1.generateUniqueId();
|
|
363
|
-
exports.createStylesCache[`${
|
|
364
|
-
return
|
|
388
|
+
exports.createStylesCache[`${instance.cache.key}-${name}`] = true;
|
|
389
|
+
return instance.css({ name, styles });
|
|
365
390
|
})
|
|
366
391
|
.join(' ');
|
|
367
392
|
}
|
|
@@ -431,6 +456,7 @@ elemProps,
|
|
|
431
456
|
*/
|
|
432
457
|
localCs) {
|
|
433
458
|
const { cs, style, className, ...restProps } = elemProps;
|
|
459
|
+
const instance = getInstance();
|
|
434
460
|
// We are going to track if any runtime styles are detected
|
|
435
461
|
let shouldRuntimeMergeStyles = false;
|
|
436
462
|
// The order is intentional. The `className` should go first, then the `cs` prop. If we don't do
|
|
@@ -449,12 +475,13 @@ localCs) {
|
|
|
449
475
|
// `@emotion/styled` and `@emotion/react` respectively that merge styles in a similar manner.
|
|
450
476
|
// - https://github.com/emotion-js/emotion/blob/f3b268f7c52103979402da919c9c0dd3f9e0e189/packages/styled/src/base.js#L120C51-L138
|
|
451
477
|
// - https://github.com/emotion-js/emotion/blob/f3b268f7c52103979402da919c9c0dd3f9e0e189/packages/react/src/emotion-element.js#L102-L116
|
|
452
|
-
(returnProps.className || '').split(' ')
|
|
478
|
+
const returnClassNames = (returnProps.className || '').split(' ');
|
|
479
|
+
returnClassNames.forEach(name => {
|
|
453
480
|
// Here we detect if a className is associated with Emotion's cache. Styles created via
|
|
454
481
|
// `createStyles` do not need special runtime merge treatment, but `@emotion/react` and
|
|
455
482
|
// `@emotion/styled` do. The `createStylesCache` tracks all styles injected into the cache via
|
|
456
483
|
// `createStyles`, so those are filtered out.
|
|
457
|
-
if (!exports.createStylesCache[name] &&
|
|
484
|
+
if (!exports.createStylesCache[name] && instance.cache.registered[name]) {
|
|
458
485
|
shouldRuntimeMergeStyles = true;
|
|
459
486
|
}
|
|
460
487
|
});
|
|
@@ -462,19 +489,7 @@ localCs) {
|
|
|
462
489
|
// If runtime styles are detected, we need to do extra work to ensure styles merge according to
|
|
463
490
|
// the rules of Emotion's runtime.
|
|
464
491
|
if (shouldRuntimeMergeStyles) {
|
|
465
|
-
|
|
466
|
-
// We are using the raw `css` instead of `createStyles` because `css` uses style hashing and
|
|
467
|
-
// `createStyles` generates a new ID every time. We could use `createStyles` here, but it would
|
|
468
|
-
// be more wasteful and new styles would be generated each React render cycle. `css` is safe to
|
|
469
|
-
// use inside a render function while `createStyles` should always be used outside the React
|
|
470
|
-
// render cycle. The following is `@emotion/utils` and it mutates the passed in
|
|
471
|
-
// `registeredStyles` array. It uses the cache of registered styles and the original className.
|
|
472
|
-
// It returns a string with found registered class names removed.
|
|
473
|
-
returnProps.className = utils_1.getRegisteredStyles(css_1.cache.registered, registeredStyles, returnProps.className || '');
|
|
474
|
-
// The `className` is mutated again, but with a brand new CSS class name of all the merged
|
|
475
|
-
// registered styles. This is how Emotion merges styles from the `css` prop and `styled`
|
|
476
|
-
// components.
|
|
477
|
-
returnProps.className += css_1.css(registeredStyles);
|
|
492
|
+
returnProps.className = getInstance().cx(returnClassNames);
|
|
478
493
|
}
|
|
479
494
|
return {
|
|
480
495
|
...returnProps,
|
|
@@ -534,7 +549,59 @@ function createStencil(config, id) {
|
|
|
534
549
|
return stencil;
|
|
535
550
|
}
|
|
536
551
|
exports.createStencil = createStencil;
|
|
552
|
+
/**
|
|
553
|
+
* Gets the current Emotion CSS instance, falling back to the one from `@emotion/css` if one wasn't
|
|
554
|
+
* already created. This allows a custom cache to be created as an opt-in
|
|
555
|
+
*/
|
|
556
|
+
function getInstance() {
|
|
557
|
+
if (!_instance) {
|
|
558
|
+
_instance = EmotionCSS;
|
|
559
|
+
}
|
|
560
|
+
return _instance;
|
|
561
|
+
}
|
|
562
|
+
exports.getInstance = getInstance;
|
|
563
|
+
/**
|
|
564
|
+
* Creates a custom instance of Emotion CSS. If this function is never called, the instance will be
|
|
565
|
+
* what gets imported from `@emotion/css`. This function must be called before any Canvas Kit
|
|
566
|
+
* component is imported or before any other `@workday/canvas-kit-styling` function is called. All
|
|
567
|
+
* the style utility functions need an instance and will automatically create one if one isn't
|
|
568
|
+
* already created.
|
|
569
|
+
*
|
|
570
|
+
* The style utilities inject styles as soon as they are called which means an instance needs to be
|
|
571
|
+
* created before any Canvas Kit components are even imported. Your application bootstrap must
|
|
572
|
+
* import a file that imports `@workday/canvas-kit-styling` and calls `createInstance` _before_ any
|
|
573
|
+
* other Canvas Kit components are imported.
|
|
574
|
+
*/
|
|
575
|
+
const createInstance = options => {
|
|
576
|
+
if (!_instance) {
|
|
577
|
+
_instance = create_instance_1.default({ key: 'css', ...options });
|
|
578
|
+
}
|
|
579
|
+
else {
|
|
580
|
+
// @ts-ignore
|
|
581
|
+
if (process && process.env.NODE_ENV === 'development') {
|
|
582
|
+
console.warn('An instance has already been created. `createInstance` cannot be called after styles have already been created. Canvas Kit styles are created immediately, so this function must be called before any Canvas Kit components are even imported.');
|
|
583
|
+
}
|
|
584
|
+
}
|
|
585
|
+
return _instance;
|
|
586
|
+
};
|
|
587
|
+
exports.createInstance = createInstance;
|
|
588
|
+
/**
|
|
589
|
+
* Returns the cache used by all style utilities
|
|
590
|
+
*/
|
|
591
|
+
function getCache() {
|
|
592
|
+
return getInstance().cache;
|
|
593
|
+
}
|
|
594
|
+
exports.getCache = getCache;
|
|
595
|
+
/**
|
|
596
|
+
* Create static keyframes. Use as a drop-in replacement to `keyframes` found in `@emotion/css` or
|
|
597
|
+
* `@emotion/react`
|
|
598
|
+
*/
|
|
537
599
|
function keyframes(...args) {
|
|
538
|
-
return
|
|
600
|
+
return getInstance().keyframes(...args);
|
|
539
601
|
}
|
|
540
602
|
exports.keyframes = keyframes;
|
|
603
|
+
/**
|
|
604
|
+
* Allows injecting of global styles.
|
|
605
|
+
*/
|
|
606
|
+
const injectGlobal = (...args) => getInstance().injectGlobal(...args);
|
|
607
|
+
exports.injectGlobal = injectGlobal;
|
package/dist/es6/lib/cs.d.ts
CHANGED
|
@@ -1,5 +1,8 @@
|
|
|
1
|
+
import * as EmotionCSS from '@emotion/css';
|
|
2
|
+
import _createInstance from '@emotion/css/create-instance';
|
|
1
3
|
import { Keyframes, SerializedStyles, CSSObject } from '@emotion/serialize';
|
|
2
4
|
import { Properties } from 'csstype';
|
|
5
|
+
declare let _instance: ReturnType<typeof _createInstance>;
|
|
3
6
|
export declare const createStylesCache: Record<string, boolean>;
|
|
4
7
|
declare type CSSObjectWithVars<T extends CSSObject = CSSObject> = {
|
|
5
8
|
[P in keyof T]?: T[P] | (string & {});
|
|
@@ -344,8 +347,8 @@ export declare type StencilCompoundConfig<M> = {
|
|
|
344
347
|
};
|
|
345
348
|
styles: SerializedStyles | CSSObjectWithVars;
|
|
346
349
|
};
|
|
347
|
-
declare type ModifierValuesStencil<M extends StencilModifierConfig> = {
|
|
348
|
-
[P in keyof M]?: MaybeBoolean<keyof M[P]>;
|
|
350
|
+
declare type ModifierValuesStencil<M extends StencilModifierConfig, V extends Record<string, string> | Record<string, Record<string, string>> = {}> = {
|
|
351
|
+
[P in keyof M]?: P extends keyof V ? MaybeBoolean<keyof M[P]> | (string & {}) : MaybeBoolean<keyof M[P]>;
|
|
349
352
|
};
|
|
350
353
|
export interface StencilConfig<M extends Record<string, Record<string, StylesReturn<V>>>, V extends Record<string, string> | Record<string, Record<string, string>> = {}, ID extends string | never = never> {
|
|
351
354
|
vars?: V;
|
|
@@ -435,7 +438,7 @@ declare type StencilModifierReturn<M extends StencilModifierConfig<V>, V extends
|
|
|
435
438
|
};
|
|
436
439
|
};
|
|
437
440
|
export declare type Stencil<M extends StencilModifierConfig<V>, V extends Record<string, string> | Record<string, Record<string, string>>, ID extends string = never> = {
|
|
438
|
-
(modifiers?: ModifierValuesStencil<M> & VariableValuesStencil<V>): {
|
|
441
|
+
(modifiers?: ModifierValuesStencil<M, V> & VariableValuesStencil<V>): {
|
|
439
442
|
className: string;
|
|
440
443
|
style?: Record<string, string>;
|
|
441
444
|
};
|
|
@@ -455,9 +458,39 @@ declare type VariableValuesStencil<V extends Record<string, string> | Record<str
|
|
|
455
458
|
* compound modifiers.
|
|
456
459
|
*/
|
|
457
460
|
export declare function createStencil<M extends StencilModifierConfig<V>, V extends Record<string, string> | Record<string, Record<string, string>> = {}, ID extends string = never>(config: StencilConfig<M, V, ID>, id?: ID): Stencil<M, V, ID>;
|
|
461
|
+
/**
|
|
462
|
+
* Gets the current Emotion CSS instance, falling back to the one from `@emotion/css` if one wasn't
|
|
463
|
+
* already created. This allows a custom cache to be created as an opt-in
|
|
464
|
+
*/
|
|
465
|
+
export declare function getInstance(): typeof _instance;
|
|
466
|
+
/**
|
|
467
|
+
* Creates a custom instance of Emotion CSS. If this function is never called, the instance will be
|
|
468
|
+
* what gets imported from `@emotion/css`. This function must be called before any Canvas Kit
|
|
469
|
+
* component is imported or before any other `@workday/canvas-kit-styling` function is called. All
|
|
470
|
+
* the style utility functions need an instance and will automatically create one if one isn't
|
|
471
|
+
* already created.
|
|
472
|
+
*
|
|
473
|
+
* The style utilities inject styles as soon as they are called which means an instance needs to be
|
|
474
|
+
* created before any Canvas Kit components are even imported. Your application bootstrap must
|
|
475
|
+
* import a file that imports `@workday/canvas-kit-styling` and calls `createInstance` _before_ any
|
|
476
|
+
* other Canvas Kit components are imported.
|
|
477
|
+
*/
|
|
478
|
+
export declare const createInstance: typeof _createInstance;
|
|
479
|
+
/**
|
|
480
|
+
* Returns the cache used by all style utilities
|
|
481
|
+
*/
|
|
482
|
+
export declare function getCache(): EmotionCSS.EmotionCache;
|
|
483
|
+
/**
|
|
484
|
+
* Create static keyframes. Use as a drop-in replacement to `keyframes` found in `@emotion/css` or
|
|
485
|
+
* `@emotion/react`
|
|
486
|
+
*/
|
|
458
487
|
export declare function keyframes<ID extends string>(...args: ({
|
|
459
488
|
name: ID;
|
|
460
489
|
styles: string;
|
|
461
490
|
} | StyleProps | TemplateStringsArray)[]): ID;
|
|
491
|
+
/**
|
|
492
|
+
* Allows injecting of global styles.
|
|
493
|
+
*/
|
|
494
|
+
export declare const injectGlobal: typeof EmotionCSS.injectGlobal;
|
|
462
495
|
export {};
|
|
463
496
|
//# sourceMappingURL=cs.d.ts.map
|
package/dist/es6/lib/cs.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cs.d.ts","sourceRoot":"","sources":["../../../lib/cs.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"cs.d.ts","sourceRoot":"","sources":["../../../lib/cs.ts"],"names":[],"mappings":"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"}
|
package/dist/es6/lib/cs.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
1
|
+
import * as EmotionCSS from '@emotion/css';
|
|
2
|
+
import _createInstance from '@emotion/css/create-instance';
|
|
3
3
|
import { serializeStyles } from '@emotion/serialize';
|
|
4
4
|
import { generateUniqueId } from './uniqueId';
|
|
5
|
+
let _instance;
|
|
5
6
|
export const createStylesCache = {};
|
|
6
7
|
/**
|
|
7
8
|
* Wrap all unwrapped CSS Variables. For example, `{padding: '--foo'}` will be replaced with
|
|
@@ -252,6 +253,7 @@ function isCsPropsReturn(input) {
|
|
|
252
253
|
* @returns
|
|
253
254
|
*/
|
|
254
255
|
export function csToProps(input) {
|
|
256
|
+
const instance = getInstance();
|
|
255
257
|
// input is a string, so it must only be a class name
|
|
256
258
|
if (typeof input === 'string') {
|
|
257
259
|
return { className: input };
|
|
@@ -284,7 +286,7 @@ export function csToProps(input) {
|
|
|
284
286
|
}
|
|
285
287
|
}
|
|
286
288
|
if (hasStaticStyles) {
|
|
287
|
-
const className = css(staticStyles);
|
|
289
|
+
const className = instance.css(staticStyles);
|
|
288
290
|
return { style: cssVars, className };
|
|
289
291
|
}
|
|
290
292
|
return { style: input };
|
|
@@ -322,6 +324,7 @@ export function csToProps(input) {
|
|
|
322
324
|
* > to win are last in your file.
|
|
323
325
|
*/
|
|
324
326
|
export function createStyles(...args) {
|
|
327
|
+
const instance = getInstance();
|
|
325
328
|
return args
|
|
326
329
|
.map(input => {
|
|
327
330
|
if (typeof input === 'string') {
|
|
@@ -329,7 +332,7 @@ export function createStyles(...args) {
|
|
|
329
332
|
}
|
|
330
333
|
// If we were called with a {name, styles} object, it must be optimized. We'll shortcut here
|
|
331
334
|
if (typeof input === 'object' && input.name) {
|
|
332
|
-
return css
|
|
335
|
+
return instance.css(input);
|
|
333
336
|
}
|
|
334
337
|
const convertedStyles = convertAllProperties(input);
|
|
335
338
|
// We want to call `serializeStyles` directly and ignore the hash generated so we can have
|
|
@@ -351,8 +354,8 @@ export function createStyles(...args) {
|
|
|
351
354
|
// Without this "fix", anyone using the Emotion babel plugin would get different results than
|
|
352
355
|
// intended when styles are merged.
|
|
353
356
|
const name = generateUniqueId();
|
|
354
|
-
createStylesCache[`${cache.key}-${name}`] = true;
|
|
355
|
-
return css
|
|
357
|
+
createStylesCache[`${instance.cache.key}-${name}`] = true;
|
|
358
|
+
return instance.css({ name, styles });
|
|
356
359
|
})
|
|
357
360
|
.join(' ');
|
|
358
361
|
}
|
|
@@ -421,6 +424,7 @@ elemProps,
|
|
|
421
424
|
*/
|
|
422
425
|
localCs) {
|
|
423
426
|
const { cs, style, className, ...restProps } = elemProps;
|
|
427
|
+
const instance = getInstance();
|
|
424
428
|
// We are going to track if any runtime styles are detected
|
|
425
429
|
let shouldRuntimeMergeStyles = false;
|
|
426
430
|
// The order is intentional. The `className` should go first, then the `cs` prop. If we don't do
|
|
@@ -439,12 +443,13 @@ localCs) {
|
|
|
439
443
|
// `@emotion/styled` and `@emotion/react` respectively that merge styles in a similar manner.
|
|
440
444
|
// - https://github.com/emotion-js/emotion/blob/f3b268f7c52103979402da919c9c0dd3f9e0e189/packages/styled/src/base.js#L120C51-L138
|
|
441
445
|
// - https://github.com/emotion-js/emotion/blob/f3b268f7c52103979402da919c9c0dd3f9e0e189/packages/react/src/emotion-element.js#L102-L116
|
|
442
|
-
(returnProps.className || '').split(' ')
|
|
446
|
+
const returnClassNames = (returnProps.className || '').split(' ');
|
|
447
|
+
returnClassNames.forEach(name => {
|
|
443
448
|
// Here we detect if a className is associated with Emotion's cache. Styles created via
|
|
444
449
|
// `createStyles` do not need special runtime merge treatment, but `@emotion/react` and
|
|
445
450
|
// `@emotion/styled` do. The `createStylesCache` tracks all styles injected into the cache via
|
|
446
451
|
// `createStyles`, so those are filtered out.
|
|
447
|
-
if (!createStylesCache[name] && cache.registered[name]) {
|
|
452
|
+
if (!createStylesCache[name] && instance.cache.registered[name]) {
|
|
448
453
|
shouldRuntimeMergeStyles = true;
|
|
449
454
|
}
|
|
450
455
|
});
|
|
@@ -452,19 +457,7 @@ localCs) {
|
|
|
452
457
|
// If runtime styles are detected, we need to do extra work to ensure styles merge according to
|
|
453
458
|
// the rules of Emotion's runtime.
|
|
454
459
|
if (shouldRuntimeMergeStyles) {
|
|
455
|
-
|
|
456
|
-
// We are using the raw `css` instead of `createStyles` because `css` uses style hashing and
|
|
457
|
-
// `createStyles` generates a new ID every time. We could use `createStyles` here, but it would
|
|
458
|
-
// be more wasteful and new styles would be generated each React render cycle. `css` is safe to
|
|
459
|
-
// use inside a render function while `createStyles` should always be used outside the React
|
|
460
|
-
// render cycle. The following is `@emotion/utils` and it mutates the passed in
|
|
461
|
-
// `registeredStyles` array. It uses the cache of registered styles and the original className.
|
|
462
|
-
// It returns a string with found registered class names removed.
|
|
463
|
-
returnProps.className = getRegisteredStyles(cache.registered, registeredStyles, returnProps.className || '');
|
|
464
|
-
// The `className` is mutated again, but with a brand new CSS class name of all the merged
|
|
465
|
-
// registered styles. This is how Emotion merges styles from the `css` prop and `styled`
|
|
466
|
-
// components.
|
|
467
|
-
returnProps.className += css(registeredStyles);
|
|
460
|
+
returnProps.className = getInstance().cx(returnClassNames);
|
|
468
461
|
}
|
|
469
462
|
return {
|
|
470
463
|
...returnProps,
|
|
@@ -522,6 +515,54 @@ export function createStencil(config, id) {
|
|
|
522
515
|
stencil.modifiers = _modifiers;
|
|
523
516
|
return stencil;
|
|
524
517
|
}
|
|
518
|
+
/**
|
|
519
|
+
* Gets the current Emotion CSS instance, falling back to the one from `@emotion/css` if one wasn't
|
|
520
|
+
* already created. This allows a custom cache to be created as an opt-in
|
|
521
|
+
*/
|
|
522
|
+
export function getInstance() {
|
|
523
|
+
if (!_instance) {
|
|
524
|
+
_instance = EmotionCSS;
|
|
525
|
+
}
|
|
526
|
+
return _instance;
|
|
527
|
+
}
|
|
528
|
+
/**
|
|
529
|
+
* Creates a custom instance of Emotion CSS. If this function is never called, the instance will be
|
|
530
|
+
* what gets imported from `@emotion/css`. This function must be called before any Canvas Kit
|
|
531
|
+
* component is imported or before any other `@workday/canvas-kit-styling` function is called. All
|
|
532
|
+
* the style utility functions need an instance and will automatically create one if one isn't
|
|
533
|
+
* already created.
|
|
534
|
+
*
|
|
535
|
+
* The style utilities inject styles as soon as they are called which means an instance needs to be
|
|
536
|
+
* created before any Canvas Kit components are even imported. Your application bootstrap must
|
|
537
|
+
* import a file that imports `@workday/canvas-kit-styling` and calls `createInstance` _before_ any
|
|
538
|
+
* other Canvas Kit components are imported.
|
|
539
|
+
*/
|
|
540
|
+
export const createInstance = options => {
|
|
541
|
+
if (!_instance) {
|
|
542
|
+
_instance = _createInstance({ key: 'css', ...options });
|
|
543
|
+
}
|
|
544
|
+
else {
|
|
545
|
+
// @ts-ignore
|
|
546
|
+
if (process && process.env.NODE_ENV === 'development') {
|
|
547
|
+
console.warn('An instance has already been created. `createInstance` cannot be called after styles have already been created. Canvas Kit styles are created immediately, so this function must be called before any Canvas Kit components are even imported.');
|
|
548
|
+
}
|
|
549
|
+
}
|
|
550
|
+
return _instance;
|
|
551
|
+
};
|
|
552
|
+
/**
|
|
553
|
+
* Returns the cache used by all style utilities
|
|
554
|
+
*/
|
|
555
|
+
export function getCache() {
|
|
556
|
+
return getInstance().cache;
|
|
557
|
+
}
|
|
558
|
+
/**
|
|
559
|
+
* Create static keyframes. Use as a drop-in replacement to `keyframes` found in `@emotion/css` or
|
|
560
|
+
* `@emotion/react`
|
|
561
|
+
*/
|
|
525
562
|
export function keyframes(...args) {
|
|
526
|
-
return
|
|
563
|
+
return getInstance().keyframes(...args);
|
|
527
564
|
}
|
|
565
|
+
/**
|
|
566
|
+
* Allows injecting of global styles.
|
|
567
|
+
*/
|
|
568
|
+
export const injectGlobal = (...args) => getInstance().injectGlobal(...args);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@workday/canvas-kit-styling",
|
|
3
|
-
"version": "10.3.
|
|
3
|
+
"version": "10.3.22",
|
|
4
4
|
"description": "The custom CSS in JS solution that takes JS styles and turns them into static CSS",
|
|
5
5
|
"author": "Workday, Inc. (https://www.workday.com)",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -53,10 +53,9 @@
|
|
|
53
53
|
"@emotion/react": "^11.7.1",
|
|
54
54
|
"@emotion/serialize": "^1.0.2",
|
|
55
55
|
"@emotion/styled": "^11.6.0",
|
|
56
|
-
"@
|
|
57
|
-
"@workday/canvas-kit-react": "^10.3.20",
|
|
56
|
+
"@workday/canvas-kit-react": "^10.3.22",
|
|
58
57
|
"@workday/canvas-tokens-web": "^1.0.0",
|
|
59
58
|
"typescript": "4.2"
|
|
60
59
|
},
|
|
61
|
-
"gitHead": "
|
|
60
|
+
"gitHead": "987fc75eccf9449f8a4975d71c1eae9fd49596b4"
|
|
62
61
|
}
|