@workday/canvas-kit-styling-transform 13.2.1 → 13.2.3

package/dist/commonjs/index.d.ts

@@ -0,0 +1,14 @@
+import styleTransformer from './lib/styleTransform';
+import type { Config } from './lib/utils/types';
+export type * from './lib/utils/types';
+export { parseNodeToStaticValue } from './lib/utils/parseNodeToStaticValue';
+export { parseObjectToStaticValue } from './lib/utils/parseObjectToStaticValue';
+export { createObjectTransform } from './lib/createObjectTransform';
+export { createPropertyTransform } from './lib/createPropertyTransform';
+export { styleTransformer };
+export { withDefaultContext } from './lib/styleTransform';
+export { getClassName } from './lib/utils/handleCreateStencil';
+export { StylingWebpackPlugin } from './lib/webpackPlugin';
+export default styleTransformer;
+export declare function createConfig(config: Config): Config;
+//# sourceMappingURL=index.d.ts.map

package/dist/commonjs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../index.ts"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,MAAM,sBAAsB,CAAC;AACpD,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,mBAAmB,CAAC;AAE9C,mBAAmB,mBAAmB,CAAC;AACvC,OAAO,EAAC,sBAAsB,EAAC,MAAM,oCAAoC,CAAC;AAC1E,OAAO,EAAC,wBAAwB,EAAC,MAAM,sCAAsC,CAAC;AAC9E,OAAO,EAAC,qBAAqB,EAAC,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAC,uBAAuB,EAAC,MAAM,+BAA+B,CAAC;AACtE,OAAO,EAAC,gBAAgB,EAAC,CAAC;AAC1B,OAAO,EAAC,kBAAkB,EAAC,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAC,YAAY,EAAC,MAAM,iCAAiC,CAAC;AAC7D,OAAO,EAAC,oBAAoB,EAAC,MAAM,qBAAqB,CAAC;AAGzD,eAAe,gBAAgB,CAAC;AAEhC,wBAAgB,YAAY,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAEnD"}

package/dist/commonjs/index.js

@@ -0,0 +1,28 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createConfig = exports.StylingWebpackPlugin = exports.getClassName = exports.withDefaultContext = exports.styleTransformer = exports.createPropertyTransform = exports.createObjectTransform = exports.parseObjectToStaticValue = exports.parseNodeToStaticValue = void 0;
+const styleTransform_1 = __importDefault(require("./lib/styleTransform"));
+exports.styleTransformer = styleTransform_1.default;
+var parseNodeToStaticValue_1 = require("./lib/utils/parseNodeToStaticValue");
+Object.defineProperty(exports, "parseNodeToStaticValue", { enumerable: true, get: function () { return parseNodeToStaticValue_1.parseNodeToStaticValue; } });
+var parseObjectToStaticValue_1 = require("./lib/utils/parseObjectToStaticValue");
+Object.defineProperty(exports, "parseObjectToStaticValue", { enumerable: true, get: function () { return parseObjectToStaticValue_1.parseObjectToStaticValue; } });
+var createObjectTransform_1 = require("./lib/createObjectTransform");
+Object.defineProperty(exports, "createObjectTransform", { enumerable: true, get: function () { return createObjectTransform_1.createObjectTransform; } });
+var createPropertyTransform_1 = require("./lib/createPropertyTransform");
+Object.defineProperty(exports, "createPropertyTransform", { enumerable: true, get: function () { return createPropertyTransform_1.createPropertyTransform; } });
+var styleTransform_2 = require("./lib/styleTransform");
+Object.defineProperty(exports, "withDefaultContext", { enumerable: true, get: function () { return styleTransform_2.withDefaultContext; } });
+var handleCreateStencil_1 = require("./lib/utils/handleCreateStencil");
+Object.defineProperty(exports, "getClassName", { enumerable: true, get: function () { return handleCreateStencil_1.getClassName; } });
+var webpackPlugin_1 = require("./lib/webpackPlugin");
+Object.defineProperty(exports, "StylingWebpackPlugin", { enumerable: true, get: function () { return webpackPlugin_1.StylingWebpackPlugin; } });
+// be compatible with ts-patch which expects a default export
+exports.default = styleTransform_1.default;
+function createConfig(config) {
+    return config;
+}
+exports.createConfig = createConfig;

package/dist/commonjs/lib/createObjectTransform.d.ts

@@ -0,0 +1,10 @@
+import { ObjectTransform } from './utils/types';
+/**
+ * Object transforms take an AST node that represents a style object and turn it into a
+ * `NestedStyleObject` or return `void`. If an object transform returns an object, transformation
+ * parsing stops on that node. If `void` is returned, processing continues using
+ * `parseObjectToStaticValue`. These transforms are useful if you have custom utility functions
+ * that are not statically parsable by the static styling transformer.
+ */
+export declare function createObjectTransform(transformFn: ObjectTransform): ObjectTransform;
+//# sourceMappingURL=createObjectTransform.d.ts.map

package/dist/commonjs/lib/createObjectTransform.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createObjectTransform.d.ts","sourceRoot":"","sources":["../../../lib/createObjectTransform.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAC,MAAM,eAAe,CAAC;AAE9C;;;;;;GAMG;AACH,wBAAgB,qBAAqB,CAAC,WAAW,EAAE,eAAe,GAAG,eAAe,CAEnF"}

package/dist/commonjs/lib/createObjectTransform.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createObjectTransform = void 0;
+/**
+ * Object transforms take an AST node that represents a style object and turn it into a
+ * `NestedStyleObject` or return `void`. If an object transform returns an object, transformation
+ * parsing stops on that node. If `void` is returned, processing continues using
+ * `parseObjectToStaticValue`. These transforms are useful if you have custom utility functions
+ * that are not statically parsable by the static styling transformer.
+ */
+function createObjectTransform(transformFn) {
+    return transformFn;
+}
+exports.createObjectTransform = createObjectTransform;

package/dist/commonjs/lib/createPropertyTransform.d.ts

@@ -0,0 +1,7 @@
+import { PropertyTransform } from './utils/types';
+/**
+ * A property transform takes a style property node and will return a string. You can use
+ * `parseNodeToStaticValue` to help you process properties that might be inputs to a function.
+ */
+export declare function createPropertyTransform(transformFn: PropertyTransform): PropertyTransform;
+//# sourceMappingURL=createPropertyTransform.d.ts.map

package/dist/commonjs/lib/createPropertyTransform.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createPropertyTransform.d.ts","sourceRoot":"","sources":["../../../lib/createPropertyTransform.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAEhD;;;GAGG;AACH,wBAAgB,uBAAuB,CAAC,WAAW,EAAE,iBAAiB,GAAG,iBAAiB,CAEzF"}

package/dist/commonjs/lib/createPropertyTransform.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createPropertyTransform = void 0;
+/**
+ * A property transform takes a style property node and will return a string. You can use
+ * `parseNodeToStaticValue` to help you process properties that might be inputs to a function.
+ */
+function createPropertyTransform(transformFn) {
+    return transformFn;
+}
+exports.createPropertyTransform = createPropertyTransform;

package/dist/commonjs/lib/createTypeScriptWatchProgram.d.ts

@@ -0,0 +1,16 @@
+import ts from 'typescript';
+/** Get the contents of the tsconfig in the system */
+export declare function getTSConfigFile(tsconfigPath: string): ts.ParsedCommandLine;
+export declare const getCompilerOptions: (tsconfigPath: string) => ts.CompilerOptions;
+/**
+ * Create a watch program for TypeScript with transformers. It watches the specified
+ * tsconfigPath for changes and updates the program when changes are detected.
+ *
+ * @param compilerOptions - The compiler options to use.
+ * @param tsconfigPath - The path to the tsconfig file.
+ * @param onProgramCreatedOrUpdated - A callback function
+ * that is called when the program is created or updated.
+ * @returns
+ */
+export declare const startWatch: (compilerOptions: ts.CompilerOptions, tsconfigPath: string, onProgramCreatedOrUpdated: (program: ts.BuilderProgram) => void) => [ts.BuilderProgram, () => void];
+//# sourceMappingURL=createTypeScriptWatchProgram.d.ts.map

package/dist/commonjs/lib/createTypeScriptWatchProgram.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createTypeScriptWatchProgram.d.ts","sourceRoot":"","sources":["../../../lib/createTypeScriptWatchProgram.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,YAAY,CAAC;AAE5B,qDAAqD;AACrD,wBAAgB,eAAe,CAAC,YAAY,EAAE,MAAM,wBAKnD;AAED,eAAO,MAAM,kBAAkB,iBAAkB,MAAM,uBAWtD,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,UAAU,oBACJ,GAAG,eAAe,gBACrB,MAAM,uCACiB,GAAG,cAAc,KAAK,IAAI,KAC9D,CAAC,GAAG,cAAc,EAAE,MAAM,IAAI,CAahC,CAAC"}

package/dist/commonjs/lib/createTypeScriptWatchProgram.js

@@ -0,0 +1,45 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.startWatch = exports.getCompilerOptions = exports.getTSConfigFile = void 0;
+const node_path_1 = __importDefault(require("node:path"));
+const typescript_1 = __importDefault(require("typescript"));
+/** Get the contents of the tsconfig in the system */
+function getTSConfigFile(tsconfigPath) {
+    const basePath = node_path_1.default.dirname(tsconfigPath);
+    const configFile = typescript_1.default.readConfigFile(tsconfigPath, typescript_1.default.sys.readFile);
+    return typescript_1.default.parseJsonConfigFileContent(configFile.config, typescript_1.default.sys, basePath, {}, tsconfigPath);
+}
+exports.getTSConfigFile = getTSConfigFile;
+const getCompilerOptions = (tsconfigPath) => {
+    let compilerOptions = {
+        jsx: typescript_1.default.JsxEmit.React,
+        module: typescript_1.default.ModuleKind.CommonJS,
+        target: typescript_1.default.ScriptTarget.Latest,
+    };
+    const { options: tsOptions } = getTSConfigFile(tsconfigPath);
+    compilerOptions = { ...compilerOptions, ...tsOptions };
+    return compilerOptions;
+};
+exports.getCompilerOptions = getCompilerOptions;
+/**
+ * Create a watch program for TypeScript with transformers. It watches the specified
+ * tsconfigPath for changes and updates the program when changes are detected.
+ *
+ * @param compilerOptions - The compiler options to use.
+ * @param tsconfigPath - The path to the tsconfig file.
+ * @param onProgramCreatedOrUpdated - A callback function
+ * that is called when the program is created or updated.
+ * @returns
+ */
+const startWatch = (compilerOptions, tsconfigPath, onProgramCreatedOrUpdated) => {
+    const host = typescript_1.default.createWatchCompilerHost(tsconfigPath, compilerOptions, typescript_1.default.sys, typescript_1.default.createSemanticDiagnosticsBuilderProgram);
+    host.afterProgramCreate = builderProgram => {
+        onProgramCreatedOrUpdated(builderProgram);
+    };
+    const watch = typescript_1.default.createWatchProgram(host);
+    return [watch.getProgram(), watch.close];
+};
+exports.startWatch = startWatch;

package/dist/commonjs/lib/styleTransform.d.ts

@@ -0,0 +1,23 @@
+import ts from 'typescript';
+import { NodeTransformer, TransformerContext } from './utils/types';
+export type NestedStyleObject = {
+    [key: string]: string | NestedStyleObject;
+};
+export interface StyleTransformerOptions extends TransformerContext {
+    fallbackFiles?: string[];
+    transformers?: NodeTransformer[];
+}
+/**
+ * The reset is used in tests and should not be called normally.
+ */
+export declare function _reset(): void;
+export default styleTransformer;
+export declare function styleTransformer(program: ts.Program, { fallbackFiles, ...options }?: Partial<StyleTransformerOptions>): ts.TransformerFactory<ts.SourceFile>;
+export declare function withDefaultContext(checker: ts.TypeChecker, { transformers, ...input }?: Partial<StyleTransformerOptions>): TransformerContext;
+/**
+ * This function is useful for tests or a custom build. The `styleTransformer` function is used by
+ * the https://www.npmjs.com/package/ts-patch package.
+ */
+export declare function transform(program: ts.Program, fileName?: string, options?: Partial<StyleTransformerOptions>): string;
+export declare function getConfig(basePath?: string): string | undefined;
+//# sourceMappingURL=styleTransform.d.ts.map

package/dist/commonjs/lib/styleTransform.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styleTransform.d.ts","sourceRoot":"","sources":["../../../lib/styleTransform.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,YAAY,CAAC;AAY5B,OAAO,EAAC,eAAe,EAAmB,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAEnF,MAAM,MAAM,iBAAiB,GAAG;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,iBAAiB,CAAA;CAAC,CAAC;AAE5E,MAAM,WAAW,uBAAwB,SAAQ,kBAAkB;IACjE,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,YAAY,CAAC,EAAE,eAAe,EAAE,CAAC;CAClC;AAQD;;GAEG;AACH,wBAAgB,MAAM,SAMrB;AAYD,eAAe,gBAAgB,CAAC;AAChC,wBAAgB,gBAAgB,CAC9B,OAAO,EAAE,EAAE,CAAC,OAAO,EACnB,EAAC,aAAkB,EAAE,GAAG,OAAO,EAAC,GAAE,OAAO,CAAC,uBAAuB,CAAM,GACtE,EAAE,CAAC,kBAAkB,CAAC,EAAE,CAAC,UAAU,CAAC,CAsDtC;AAED,wBAAgB,kBAAkB,CAChC,OAAO,EAAE,EAAE,CAAC,WAAW,EACvB,EAAC,YAAY,EAAE,GAAG,KAAK,EAAC,GAAE,OAAO,CAAC,uBAAuB,CAAM,GAC9D,kBAAkB,CAmBpB;AAED;;;GAGG;AACH,wBAAgB,SAAS,CACvB,OAAO,EAAE,EAAE,CAAC,OAAO,EACnB,QAAQ,SAAY,EACpB,OAAO,CAAC,EAAE,OAAO,CAAC,uBAAuB,CAAC,UAa3C;AAUD,wBAAgB,SAAS,CAAC,QAAQ,SAAM,sBAIvC"}

package/dist/commonjs/lib/styleTransform.js

@@ -0,0 +1,131 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getConfig = exports.transform = exports.withDefaultContext = exports.styleTransformer = exports._reset = void 0;
+/// <reference types="node" />
+const node_path_1 = __importDefault(require("node:path"));
+const typescript_1 = __importDefault(require("typescript"));
+const getCssVariables_1 = require("./utils/getCssVariables");
+const handleCalc_1 = require("./utils/handleCalc");
+const handleCreateStencil_1 = require("./utils/handleCreateStencil");
+const handleCreateStyles_1 = require("./utils/handleCreateStyles");
+const handleCreateVars_1 = require("./utils/handleCreateVars");
+const handleCssVar_1 = require("./utils/handleCssVar");
+const handleInjectGlobal_1 = require("./utils/handleInjectGlobal");
+const handleKeyframes_1 = require("./utils/handleKeyframes");
+const handleParentModifier_1 = require("./utils/handleParentModifier");
+const handlePx2Rem_1 = require("./utils/handlePx2Rem");
+let vars = {};
+let extractedNames = {};
+let styles = {};
+let cache = {};
+let loadedFallbacks = false;
+/**
+ * The reset is used in tests and should not be called normally.
+ */
+function _reset() {
+    vars = {};
+    extractedNames = {};
+    styles = {};
+    cache = {};
+    loadedFallbacks = false;
+}
+exports._reset = _reset;
+/**
+ * Optional list of transformers. Useful to override for tests
+ */
+const defaultTransformers = [
+    handleKeyframes_1.handleKeyframes,
+    handleCreateVars_1.handleCreateVars,
+    handleCreateStyles_1.handleCreateStyles,
+    handleCreateStencil_1.handleCreateStencil,
+    handleInjectGlobal_1.handleInjectGlobal,
+];
+exports.default = styleTransformer;
+function styleTransformer(program, { fallbackFiles = [], ...options } = {}) {
+    const { names, ...transformContext } = withDefaultContext(program.getTypeChecker(), options);
+    if (!loadedFallbacks) {
+        const files = fallbackFiles
+            .filter(file => file) // don't process empty files
+            .map(file => {
+            // Find the fully-qualified path name. This could error which should give "module not found" errors
+            return file.startsWith('.') ? node_path_1.default.resolve(process.cwd(), file) : require.resolve(file);
+        })
+            .map(file => {
+            console.log(`Loading CSS variable fallback file: ${file}`);
+            return typescript_1.default.sys.readFile(file) || '';
+        });
+        const fallbackVars = (0, getCssVariables_1.getVariablesFromFiles)(files);
+        console.log(`Found ${Object.keys(fallbackVars).length} variables.`);
+        // eslint-disable-next-line guard-for-in
+        for (const key in fallbackVars) {
+            names[key] = fallbackVars[key];
+        }
+        loadedFallbacks = true;
+    }
+    return context => {
+        const visit = node => {
+            var _a;
+            if (!transformContext.fileName) {
+                transformContext.fileName = (_a = node.getSourceFile()) === null || _a === void 0 ? void 0 : _a.fileName;
+                transformContext.prefix = transformContext.getPrefix(transformContext.fileName);
+            }
+            if (typescript_1.default.isSourceFile(node) &&
+                node.fileName !== 'test.ts' &&
+                transformContext.styles[transformContext.getFileName(node.fileName)] &&
+                transformContext.extractCSS) {
+                typescript_1.default.sys.writeFile(transformContext.getFileName(transformContext.getFileName(node.fileName)), (transformContext.styles[transformContext.getFileName(node.fileName)] || []).join('\n'));
+            }
+            const newNode = transformContext.transform(node, {
+                names,
+                ...transformContext,
+            });
+            return newNode || typescript_1.default.visitEachChild(node, visit, context);
+        };
+        return (node => typescript_1.default.visitNode(node, visit));
+    };
+}
+exports.styleTransformer = styleTransformer;
+function withDefaultContext(checker, { transformers, ...input } = {}) {
+    return {
+        prefix: 'css',
+        getPrefix: path => input.prefix || 'css',
+        names: vars,
+        extractedNames,
+        styles,
+        cache,
+        checker,
+        seed: '',
+        extractCSS: false,
+        getFileName: path => path.replace(/\.tsx?/, '.css'),
+        objectTransforms: [],
+        transform: handleTransformers(transformers || defaultTransformers),
+        ...input,
+        propertyTransforms: [handleCalc_1.handleCalc, handlePx2Rem_1.handlePx2Rem, handleCssVar_1.handleCssVar, handleParentModifier_1.handleParentModifier].concat(input.propertyTransforms || []),
+    };
+}
+exports.withDefaultContext = withDefaultContext;
+/**
+ * This function is useful for tests or a custom build. The `styleTransformer` function is used by
+ * the https://www.npmjs.com/package/ts-patch package.
+ */
+function transform(program, fileName = 'test.ts', options) {
+    const source = program.getSourceFile(fileName) || typescript_1.default.createSourceFile(fileName, '', typescript_1.default.ScriptTarget.ES2019);
+    const printer = typescript_1.default.createPrinter();
+    const transformers = [styleTransformer(program, options)];
+    return printer.printFile(typescript_1.default.transform(source, transformers).transformed.find(s => s.fileName === source.fileName) ||
+        source);
+}
+exports.transform = transform;
+const handleTransformers = (transformers) => (node, context) => {
+    return transformers.reduce((result, transformer) => {
+        return result || transformer(node, context);
+    }, undefined);
+};
+function getConfig(basePath = '.') {
+    const tsconfigPath = typescript_1.default.findConfigFile(basePath, typescript_1.default.sys.fileExists, 'styling.config.ts');
+    return tsconfigPath;
+}
+exports.getConfig = getConfig;

package/dist/commonjs/lib/utils/createStyleObjectNode.d.ts

@@ -0,0 +1,35 @@
+import ts from 'typescript';
+import { NestedStyleObject, TransformerContext } from './types';
+/**
+ * Creates an AST node representation of the passed in `styleObj`, but in the format of `{name:
+ * string, styles: serializedStyles}`. The `name` is hard-coded here to work with both server-side
+ * and client-side style injection. This results in a stable style key for Emotion while also
+ * optimizing style serialization.
+ *
+ * If `name` is provided, the name will be whatever `name` is, replacing "{hash}" with the hash
+ * created via `serializeStyles`. For example: 'animation-{hash}' will be converted into
+ * 'animation-abc123'
+ */
+export declare function createStyleObjectNode(styles: string, name?: string): ts.ObjectLiteralExpression;
+/**
+ * Compiles CSS using stylis. Emotion's `serializeStyles` creates an unwrapped string for cache
+ * storage and it often needs to be wrapped by a CSS selector or `@keyframes`. This function does
+ * this the same way Emotion does it internally.
+ */
+export declare function compileCSS(input: string): string;
+/**
+ * Serialize styles and put them to style output. The styles will be serialized via Emotion. Returns
+ * the serialized styles.
+ * @param node
+ * @param input
+ * @param template The template for creating styles for static CSS. There are two placeholders: `%n`
+ * represents the hash name while `%s` represents the string styles.
+ * @param context
+ * @returns
+ */
+export declare function serializeStyles(node: ts.Node, input: NestedStyleObject | string, template: string, context: TransformerContext): import("@emotion/utils").SerializedStyles;
+/**
+ * Generate a deterministic hash that is unique to the seed +
+ */
+export declare function getHash(node: ts.Node, context: TransformerContext): string;
+//# sourceMappingURL=createStyleObjectNode.d.ts.map

package/dist/commonjs/lib/utils/createStyleObjectNode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createStyleObjectNode.d.ts","sourceRoot":"","sources":["../../../../lib/utils/createStyleObjectNode.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,YAAY,CAAC;AAK5B,OAAO,EAAC,iBAAiB,EAAE,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAE9D;;;;;;;;;GASG;AACH,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,8BAkBlE;AAED;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAEhD;AAED;;;;;;;;;GASG;AACH,wBAAgB,eAAe,CAC7B,IAAI,EAAE,EAAE,CAAC,IAAI,EACb,KAAK,EAAE,iBAAiB,GAAG,MAAM,EACjC,QAAQ,EAAE,MAAM,EAChB,OAAO,EAAE,kBAAkB,6CA8B5B;AAED;;GAEG;AACH,wBAAgB,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,kBAAkB,UAMjE"}

package/dist/commonjs/lib/utils/createStyleObjectNode.js

@@ -0,0 +1,84 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getHash = exports.serializeStyles = exports.compileCSS = exports.createStyleObjectNode = void 0;
+const serialize_1 = require("@emotion/serialize");
+const node_crypto_1 = __importDefault(require("node:crypto"));
+const stylis_1 = require("stylis");
+const typescript_1 = __importDefault(require("typescript"));
+const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
+const stylisFns_1 = require("./stylisFns");
+/**
+ * Creates an AST node representation of the passed in `styleObj`, but in the format of `{name:
+ * string, styles: serializedStyles}`. The `name` is hard-coded here to work with both server-side
+ * and client-side style injection. This results in a stable style key for Emotion while also
+ * optimizing style serialization.
+ *
+ * If `name` is provided, the name will be whatever `name` is, replacing "{hash}" with the hash
+ * created via `serializeStyles`. For example: 'animation-{hash}' will be converted into
+ * 'animation-abc123'
+ */
+function createStyleObjectNode(styles, name) {
+    const styleExpression = typescript_1.default.factory.createStringLiteral(styles);
+    // create an emotion-optimized object: https://github.com/emotion-js/emotion/blob/f3b268f7c52103979402da919c9c0dd3f9e0e189/packages/serialize/src/index.js#L315-L322
+    // Looks like: `{name: $hash, styles: $styleText }`
+    return typescript_1.default.factory.createObjectLiteralExpression([
+        typescript_1.default.factory.createPropertyAssignment(typescript_1.default.factory.createIdentifier('name'), typescript_1.default.factory.createStringLiteral(name || (0, canvas_kit_styling_1.generateUniqueId)()) // We might be using values that are resolved at runtime, but should still be static. We're only supporting the `cs` function running once per file, so a stable id based on a hash is not necessary
+        ),
+        typescript_1.default.factory.createPropertyAssignment(typescript_1.default.factory.createIdentifier('styles'), styleExpression // In the future we can extract CSS from here by running the `stylis` compiler directly. Emotion does this here: https://github.com/emotion-js/emotion/blob/f3b268f7c52103979402da919c9c0dd3f9e0e189/packages/cache/src/index.js#L188-L245
+        ),
+    ], false);
+}
+exports.createStyleObjectNode = createStyleObjectNode;
+/**
+ * Compiles CSS using stylis. Emotion's `serializeStyles` creates an unwrapped string for cache
+ * storage and it often needs to be wrapped by a CSS selector or `@keyframes`. This function does
+ * this the same way Emotion does it internally.
+ */
+function compileCSS(input) {
+    return (0, stylis_1.serialize)((0, stylis_1.compile)(input), stylisFns_1.prettyStringify);
+}
+exports.compileCSS = compileCSS;
+/**
+ * Serialize styles and put them to style output. The styles will be serialized via Emotion. Returns
+ * the serialized styles.
+ * @param node
+ * @param input
+ * @param template The template for creating styles for static CSS. There are two placeholders: `%n`
+ * represents the hash name while `%s` represents the string styles.
+ * @param context
+ * @returns
+ */
+function serializeStyles(node, input, template, context) {
+    const { getFileName, styles, cache, names, extractedNames } = context;
+    const fileName = getFileName(node.getSourceFile().fileName);
+    const serialized = (0, serialize_1.serializeStyles)([input]);
+    const hash = getHash(node, context);
+    serialized.name = hash;
+    if (!cache[hash]) {
+        const styleOutput = compileCSS(template.replace('%s', serialized.styles).replace('%n', serialized.name));
+        let extractedStyleOutput = styleOutput;
+        for (const key in names) {
+            if (extractedNames[names[key]]) {
+                // @ts-ignore replaceAll was added in es2021, but our lib versions don't go past es2019. replaceAll is available in node 15+
+                extractedStyleOutput = extractedStyleOutput.replaceAll(names[key], extractedNames[names[key]]);
+            }
+        }
+        styles[fileName] = styles[fileName] || [];
+        styles[fileName].push(extractedStyleOutput);
+        cache[hash] = styleOutput;
+    }
+    return serialized;
+}
+exports.serializeStyles = serializeStyles;
+/**
+ * Generate a deterministic hash that is unique to the seed +
+ */
+function getHash(node, context) {
+    const content = context.seed + node.getStart() + node.getEnd();
+    // Convert content to a sha256 hash and then convert to a base36 number for better compression
+    return Number(`0x${node_crypto_1.default.createHash('sha256').update(content).digest('hex').slice(0, 7)}`).toString(36);
+}
+exports.getHash = getHash;

package/dist/commonjs/lib/utils/getCssVariables.d.ts

@@ -0,0 +1,4 @@
+import { Element } from 'stylis';
+export declare function getVariablesFromFiles(files: string[]): Record<string, string>;
+export declare function extractVariables(blocks: Element[] | string, variables?: Record<string, string>): Record<string, string>;
+//# sourceMappingURL=getCssVariables.d.ts.map

package/dist/commonjs/lib/utils/getCssVariables.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getCssVariables.d.ts","sourceRoot":"","sources":["../../../../lib/utils/getCssVariables.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,OAAO,EAAC,MAAM,QAAQ,CAAC;AAExC,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAK7E;AAED,wBAAgB,gBAAgB,CAC9B,MAAM,EAAE,OAAO,EAAE,GAAG,MAAM,EAC1B,SAAS,GAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAM,GACrC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAuBxB"}

package/dist/commonjs/lib/utils/getCssVariables.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.extractVariables = exports.getVariablesFromFiles = void 0;
+const stylis_1 = require("stylis");
+function getVariablesFromFiles(files) {
+    return files.reduce((result, file) => {
+        extractVariables((0, stylis_1.compile)(file));
+        return { ...result, ...extractVariables((0, stylis_1.compile)(file)) };
+    }, {});
+}
+exports.getVariablesFromFiles = getVariablesFromFiles;
+function extractVariables(blocks, variables = {}) {
+    if (typeof blocks === 'string') {
+        return variables;
+    }
+    return blocks
+        .filter(block => block.type === 'rule')
+        .reduce((result, rule) => {
+        if (Array.isArray(rule.children)) {
+            rule.children.forEach(child => {
+                if (typeof child.props === 'string' &&
+                    child.props.startsWith('--') &&
+                    typeof child.children === 'string') {
+                    result[child.props] = child.children;
+                }
+            });
+        }
+        return result;
+    }, { ...variables });
+}
+exports.extractVariables = extractVariables;

package/dist/commonjs/lib/utils/getErrorMessage.d.ts

@@ -0,0 +1,16 @@
+import ts from 'typescript';
+import { TransformerContext } from './types';
+/**
+ * Creates an error message around a node. It will look something like:
+ *
+ * ```
+ * Unknown type at: "fontSize".
+ * File: test.ts, Line: 6, Character: 17.
+ * const styles = createStyles({
+ *   fontSize: fontSize
+ *             ========
+ * })
+ * ```
+ */
+export declare function getErrorMessage(node: ts.Node, context: TransformerContext): string;
+//# sourceMappingURL=getErrorMessage.d.ts.map

package/dist/commonjs/lib/utils/getErrorMessage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getErrorMessage.d.ts","sourceRoot":"","sources":["../../../../lib/utils/getErrorMessage.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAC,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAE3C;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,kBAAkB,UAyCzE"}

package/dist/commonjs/lib/utils/getErrorMessage.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getErrorMessage = void 0;
+/**
+ * Creates an error message around a node. It will look something like:
+ *
+ * ```
+ * Unknown type at: "fontSize".
+ * File: test.ts, Line: 6, Character: 17.
+ * const styles = createStyles({
+ *   fontSize: fontSize
+ *             ========
+ * })
+ * ```
+ */
+function getErrorMessage(node, context) {
+    const sourceFile = node.getSourceFile();
+    const { line } = node.getSourceFile().getLineAndCharacterOfPosition(node.pos);
+    const lineStarts = sourceFile.getLineStarts();
+    const lineStartIndex = lineStarts.findIndex(s => s >= node.pos) - 1;
+    // get a whole line's text given a lineStarts index
+    function getLine(sourceFile, startIndex) {
+        const lineStarts = sourceFile.getLineStarts();
+        return sourceFile.text.substring(lineStarts[Math.max(0, startIndex)], startIndex + 1 >= lineStarts.length ? undefined : lineStarts[startIndex + 1]);
+    }
+    // Create a full context message with source code and highlighting
+    const lineBefore = getLine(sourceFile, lineStartIndex - 1);
+    const lineCurrent = getLine(sourceFile, lineStartIndex);
+    const lineAfter = getLine(sourceFile, lineStartIndex + 1);
+    const highlightedLine = ''
+        .padStart(node.getStart() - lineStarts[lineStartIndex], ' ')
+        .padEnd(node.getStart() - lineStarts[lineStartIndex] + node.getWidth(), '=') + '\n';
+    /** This should look something like:
+     * ```
+     * const styles = createStyles({
+     *   fontSize: fontSize
+     *             ========
+     * })
+     * ```
+     */
+    const fullContext = lineBefore + lineCurrent + highlightedLine + lineAfter;
+    const character = node.getStart() - lineStarts[lineStartIndex];
+    return `File: ${sourceFile.fileName}:${line + 1}:${character}.\n${fullContext}\nOriginal File: ${context.fileName}`;
+}
+exports.getErrorMessage = getErrorMessage;

package/dist/commonjs/lib/utils/getFallbackVariable.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Looks for a variable value that doesn't include a fallback and automatically adds one if found in
+ * the current cache of names. This allows fallbacks to be automatically included in environments
+ * without the names defined. This is most useful for Storybook or other sandboxes that may not have
+ * CSS Variables defined. The fallbacks will allow the UI to look correct without additional setup.
+ * Fallbacks come from the `fallbackFiles` transform configuration.
+ */
+export declare function getFallbackVariable(variableName: string, names: Record<string, string>): string | undefined;
+//# sourceMappingURL=getFallbackVariable.d.ts.map

package/dist/commonjs/lib/utils/getFallbackVariable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getFallbackVariable.d.ts","sourceRoot":"","sources":["../../../../lib/utils/getFallbackVariable.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,wBAAgB,mBAAmB,CACjC,YAAY,EAAE,MAAM,EACpB,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAC5B,MAAM,GAAG,SAAS,CAuBpB"}

package/dist/commonjs/lib/utils/getFallbackVariable.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getFallbackVariable = void 0;
+/**
+ * Looks for a variable value that doesn't include a fallback and automatically adds one if found in
+ * the current cache of names. This allows fallbacks to be automatically included in environments
+ * without the names defined. This is most useful for Storybook or other sandboxes that may not have
+ * CSS Variables defined. The fallbacks will allow the UI to look correct without additional setup.
+ * Fallbacks come from the `fallbackFiles` transform configuration.
+ */
+function getFallbackVariable(variableName, names) {
+    const variable = variableName.includes('var(') ? variableName : names[variableName];
+    if (variable && variable.includes('var(')) {
+        return variable.replace(/(var\(([A-Za-z0-9\-_]+)\))/, (
+        /** matched substring "var(--var-name)" */ _, 
+        /** the full match of the first group "var(--var-name)" */ varMatch, 
+        /** the variable name  - match of the second group "--var-name" */ cssVarName) => {
+            const value = names[cssVarName];
+            if (value && value.startsWith('var')) {
+                return getFallbackVariable(value, names);
+            }
+            return value || varMatch;
+        });
+    }
+    if (variable) {
+        return variable;
+    }
+    return;
+}
+exports.getFallbackVariable = getFallbackVariable;

package/dist/commonjs/lib/utils/getHash.d.ts

@@ -0,0 +1,4 @@
+import ts from 'typescript';
+import { TransformerContext } from './types';
+export declare function getHash(node: ts.Node, context: TransformerContext): string;
+//# sourceMappingURL=getHash.d.ts.map

package/dist/commonjs/lib/utils/getHash.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getHash.d.ts","sourceRoot":"","sources":["../../../../lib/utils/getHash.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAG5B,OAAO,EAAC,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAE3C,wBAAgB,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,kBAAkB,UAOjE"}