@stylix/core 3.1.0

package/dist/plugins/defaultUnits.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultPixelUnits = exports.defaultUnits = exports.defaultIgnoreUnits = void 0;
+const mapObjectRecursive_1 = require("../util/mapObjectRecursive");
+exports.defaultIgnoreUnits = [
+    'columns',
+    'column-count',
+    'fill-opacity',
+    'flex',
+    'flex-grow',
+    'flex-shrink',
+    'font-weight',
+    'line-height',
+    'opacity',
+    'orphans',
+    'stroke-opacity',
+    'widows',
+    'z-index',
+    'zoom',
+    'order',
+];
+/**
+ * Adds unit (px, em, etc) to numeric values for any style properties not included in `ignoreProps`..
+ */
+const defaultUnits = (unit = 'px', ignoreProps = exports.defaultIgnoreUnits) => {
+    return {
+        name: 'defaultUnits',
+        type: 'processStyles',
+        plugin(ctx, styles) {
+            return mapObjectRecursive_1.mapObjectRecursive(styles, defaultUnitsMap, { unit, ignoreProps });
+        },
+    };
+};
+exports.defaultUnits = defaultUnits;
+const defaultUnitsMap = (key, value, object, ctx) => {
+    if (typeof value === 'number' && !ctx.ignoreProps.includes(key)) {
+        return { [key]: String(value) + ctx.unit };
+    }
+};
+exports.defaultPixelUnits = exports.defaultUnits();
+//# sourceMappingURL=defaultUnits.js.map

package/dist/plugins/defaultUnits.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaultUnits.js","sourceRoot":"","sources":["../../src/plugins/defaultUnits.ts"],"names":[],"mappings":";;;AAAA,mEAAgE;AAGnD,QAAA,kBAAkB,GAAG;IAChC,SAAS;IACT,cAAc;IACd,cAAc;IACd,MAAM;IACN,WAAW;IACX,aAAa;IACb,aAAa;IACb,aAAa;IACb,SAAS;IACT,SAAS;IACT,gBAAgB;IAChB,QAAQ;IACR,SAAS;IACT,MAAM;IACN,OAAO;CACR,CAAC;AAEF;;GAEG;AACI,MAAM,YAAY,GAAG,CAAC,IAAI,GAAG,IAAI,EAAE,WAAW,GAAG,0BAAkB,EAAgB,EAAE;IAC1F,OAAO;QACL,IAAI,EAAE,cAAc;QACpB,IAAI,EAAE,eAAe;QACrB,MAAM,CAAC,GAAG,EAAE,MAAW;YACrB,OAAO,uCAAkB,CAAC,MAAM,EAAE,eAAe,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,CAAC;QAC5E,CAAC;KACF,CAAC;AACJ,CAAC,CAAC;AARW,QAAA,YAAY,gBAQvB;AAEF,MAAM,eAAe,GAAG,CAAC,GAAoB,EAAE,KAAU,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE;IACxE,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,GAAG,CAAC,WAAW,CAAC,QAAQ,CAAC,GAAa,CAAC,EAAE;QACzE,OAAO,EAAE,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,IAAI,EAAE,CAAC;KAC5C;AACH,CAAC,CAAC;AAEW,QAAA,iBAAiB,GAAG,oBAAY,EAAE,CAAC"}

package/dist/plugins/flattenNestedStyles.d.ts

@@ -0,0 +1,5 @@
+import { StylixPlugin } from './index';
+/**
+ * Flattens nested style objects that use `&` to reference parent class.
+ */
+export declare const flattenNestedStyles: StylixPlugin;

package/dist/plugins/flattenNestedStyles.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.flattenNestedStyles = void 0;
+const isPlainObject_1 = require("../util/isPlainObject");
+const flatten = function flatten(styles, parent, selector, root, mediaRoot) {
+    for (let key in styles) {
+        const value = styles[key];
+        if (key.startsWith('@media')) {
+            // Flatten media queries, but nest them under the root object
+            root[key] = root[key] || {};
+            flatten(value, root[key], selector, root, root[key]);
+        }
+        else if (key.startsWith('@keyframes')) {
+            // Add keyframe rules as-is directly to mediaRoot object
+            mediaRoot[key] = value;
+        }
+        else if (isPlainObject_1.isPlainObject(styles[key])) {
+            // Concatenate or replace & in selectors and then continue flattening styles
+            if (key.includes('&')) {
+                key = key.replace(/&/g, selector);
+            }
+            else {
+                key = (selector + ' ' + key).trim();
+            }
+            parent[key] = parent[key] || {};
+            flatten(value, parent, key, root, mediaRoot);
+        }
+        else {
+            // Selector is just a css property
+            parent[selector] = parent[selector] || {};
+            parent[selector][key] = styles[key];
+        }
+    }
+};
+/**
+ * Flattens nested style objects that use `&` to reference parent class.
+ */
+exports.flattenNestedStyles = {
+    name: 'flattenNestedStyles',
+    type: 'processStyles',
+    plugin(ctx, styles) {
+        const flattened = {};
+        flatten(styles, flattened, '', flattened, flattened);
+        return flattened;
+    },
+};
+//# sourceMappingURL=flattenNestedStyles.js.map

package/dist/plugins/flattenNestedStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flattenNestedStyles.js","sourceRoot":"","sources":["../../src/plugins/flattenNestedStyles.ts"],"names":[],"mappings":";;;AAAA,yDAAsD;AAGtD,MAAM,OAAO,GAAG,SAAS,OAAO,CAC9B,MAAW,EACX,MAAW,EACX,QAAgB,EAChB,IAAS,EACT,SAAc;IAEd,KAAK,IAAI,GAAG,IAAI,MAAM,EAAE;QACtB,MAAM,KAAK,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;QAC1B,IAAI,GAAG,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE;YAC5B,6DAA6D;YAC7D,IAAI,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;YAC5B,OAAO,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;SACtD;aAAM,IAAI,GAAG,CAAC,UAAU,CAAC,YAAY,CAAC,EAAE;YACvC,wDAAwD;YACxD,SAAS,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;SACxB;aAAM,IAAI,6BAAa,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE;YACrC,4EAA4E;YAC5E,IAAI,GAAG,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;gBACrB,GAAG,GAAG,GAAG,CAAC,OAAO,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;aACnC;iBAAM;gBACL,GAAG,GAAG,CAAC,QAAQ,GAAG,GAAG,GAAG,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC;aACrC;YACD,MAAM,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;YAChC,OAAO,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC;SAC9C;aAAM;YACL,kCAAkC;YAClC,MAAM,CAAC,QAAQ,CAAC,GAAG,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;YAC1C,MAAM,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;SACrC;KACF;AACH,CAAC,CAAC;AAEF;;GAEG;AACU,QAAA,mBAAmB,GAAiB;IAC/C,IAAI,EAAE,qBAAqB;IAC3B,IAAI,EAAE,eAAe;IACrB,MAAM,CAAC,GAAgC,EAAE,MAAW;QAClD,MAAM,SAAS,GAAG,EAAE,CAAC;QACrB,OAAO,CAAC,MAAM,EAAE,SAAS,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC;QACrD,OAAO,SAAS,CAAC;IACnB,CAAC;CACF,CAAC"}

package/dist/plugins/index.d.ts

@@ -0,0 +1,30 @@
+import { StylixContext, StylixPublicContext } from '../StylixProvider';
+/**
+ * Stylix plugin function context object
+ */
+export declare type StylixPluginFunctionContext = StylixPublicContext & {
+    hash: string;
+};
+/**
+ * Stylix plugin interface
+ */
+export interface StylixPlugin {
+    name: string;
+    type: 'initialize' | 'processStyles' | 'preprocessStyles';
+    plugin(ctx: StylixPluginFunctionContext, styles: any): any;
+    before?: StylixPlugin;
+    after?: StylixPlugin;
+    atIndex?: number;
+}
+export declare function applyPlugins(type: StylixPlugin['type'], styles: any, hash: string, context: StylixContext): any;
+export { customProps } from './customProps';
+export declare const defaultPlugins: {
+    themeFunctions: StylixPlugin;
+    merge$css: StylixPlugin;
+    mediaArrays: StylixPlugin;
+    propCasing: StylixPlugin;
+    flattenNestedStyles: StylixPlugin;
+    replace$$class: StylixPlugin;
+    defaultPixelUnits: StylixPlugin;
+    cleanStyles: StylixPlugin;
+};

package/dist/plugins/index.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultPlugins = exports.customProps = exports.applyPlugins = void 0;
+const cleanStyles_1 = require("./cleanStyles");
+const defaultUnits_1 = require("./defaultUnits");
+const flattenNestedStyles_1 = require("./flattenNestedStyles");
+const mediaArrays_1 = require("./mediaArrays");
+const merge_css_1 = require("./merge$css");
+const propCasing_1 = require("./propCasing");
+const replace__class_1 = require("./replace$$class");
+const themeFunctions_1 = require("./themeFunctions");
+function applyPlugins(type, styles, hash, context) {
+    const pluginContext = {
+        id: context.id,
+        devMode: context.devMode,
+        theme: context.theme,
+        media: context.media,
+        stylesheet: context.stylesheet,
+        styleElement: context.styleElement,
+        styleProps: context.styleProps,
+        hash,
+    };
+    let processedStyles = styles;
+    for (const i in context.plugins) {
+        const plugin = context.plugins[i];
+        if (plugin.type === type)
+            processedStyles = plugin.plugin(pluginContext, processedStyles);
+    }
+    return processedStyles;
+}
+exports.applyPlugins = applyPlugins;
+var customProps_1 = require("./customProps");
+Object.defineProperty(exports, "customProps", { enumerable: true, get: function () { return customProps_1.customProps; } });
+exports.defaultPlugins = {
+    themeFunctions: themeFunctions_1.themeFunctions,
+    merge$css: merge_css_1.merge$css,
+    mediaArrays: mediaArrays_1.mediaArrays,
+    propCasing: propCasing_1.propCasing,
+    flattenNestedStyles: flattenNestedStyles_1.flattenNestedStyles,
+    replace$$class: replace__class_1.replace$$class,
+    defaultPixelUnits: defaultUnits_1.defaultPixelUnits,
+    cleanStyles: cleanStyles_1.cleanStyles,
+};
+//# sourceMappingURL=index.js.map

package/dist/plugins/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/plugins/index.ts"],"names":[],"mappings":";;;AACA,+CAA4C;AAC5C,iDAAmD;AACnD,+DAA4D;AAC5D,+CAA4C;AAC5C,2CAAwC;AACxC,6CAA0C;AAC1C,qDAAkD;AAClD,qDAAkD;AAmBlD,SAAgB,YAAY,CAC1B,IAA0B,EAC1B,MAAW,EACX,IAAY,EACZ,OAAsB;IAEtB,MAAM,aAAa,GAAG;QACpB,EAAE,EAAE,OAAO,CAAC,EAAE;QACd,OAAO,EAAE,OAAO,CAAC,OAAO;QACxB,KAAK,EAAE,OAAO,CAAC,KAAK;QACpB,KAAK,EAAE,OAAO,CAAC,KAAK;QACpB,UAAU,EAAE,OAAO,CAAC,UAAU;QAC9B,YAAY,EAAE,OAAO,CAAC,YAAY;QAClC,UAAU,EAAE,OAAO,CAAC,UAAU;QAC9B,IAAI;KACL,CAAC;IAEF,IAAI,eAAe,GAAG,MAAM,CAAC;IAC7B,KAAK,MAAM,CAAC,IAAI,OAAO,CAAC,OAAO,EAAE;QAC/B,MAAM,MAAM,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAClC,IAAI,MAAM,CAAC,IAAI,KAAK,IAAI;YAAE,eAAe,GAAG,MAAM,CAAC,MAAM,CAAC,aAAa,EAAE,eAAe,CAAC,CAAC;KAC3F;IACD,OAAO,eAAe,CAAC;AACzB,CAAC;AAvBD,oCAuBC;AAED,6CAA4C;AAAnC,0GAAA,WAAW,OAAA;AAEP,QAAA,cAAc,GAAG;IAC5B,cAAc,EAAd,+BAAc;IACd,SAAS,EAAT,qBAAS;IACT,WAAW,EAAX,yBAAW;IACX,UAAU,EAAV,uBAAU;IACV,mBAAmB,EAAnB,yCAAmB;IACnB,cAAc,EAAd,+BAAc;IACd,iBAAiB,EAAjB,gCAAiB;IACjB,WAAW,EAAX,yBAAW;CACZ,CAAC"}

package/dist/plugins/mediaArrays.d.ts

@@ -0,0 +1,5 @@
+import { StylixPlugin } from './index';
+/**
+ * Expands arrays as media queries.
+ */
+export declare const mediaArrays: StylixPlugin;

package/dist/plugins/mediaArrays.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mediaArrays = void 0;
+const isPlainObject_1 = require("../util/isPlainObject");
+const mapObjectRecursive_1 = require("../util/mapObjectRecursive");
+const mapDittoValues = (key, value) => {
+    if (Array.isArray(value)) {
+        for (const i in value) {
+            const v = value[i];
+            if (v === '@')
+                value[i] = value[+i - 1];
+        }
+        return { [key]: value };
+    }
+};
+const mapNonMedia = (key, value, object, context) => {
+    if (Array.isArray(value)) {
+        return { [key]: value[context.i] };
+    }
+};
+const mapMediaStyles = (key, value, object, context) => {
+    if (key.startsWith('@keyframes'))
+        context.keyframes = true;
+    if (Array.isArray(value)) {
+        return { [key]: value[context.i] };
+    }
+    if (isPlainObject_1.isPlainObject(value) || context.keyframes) {
+        return;
+    }
+    // delete key/value pair if primitive
+    return { [key]: undefined };
+};
+/**
+ * Expands arrays as media queries.
+ */
+exports.mediaArrays = {
+    name: 'mediaArrays',
+    type: 'processStyles',
+    plugin(ctx, styles) {
+        // Fill out ditto values
+        styles = mapObjectRecursive_1.mapObjectRecursive(styles, mapDittoValues);
+        const mediaStyles = {};
+        let nonMediaStyles = styles;
+        for (const i in ctx.media) {
+            const mediaQuery = ctx.media[i];
+            if (!mediaQuery) {
+                nonMediaStyles = mapObjectRecursive_1.mapObjectRecursive(styles, mapNonMedia, { i });
+            }
+            else {
+                mediaStyles[`@media ${mediaQuery}`] = mapObjectRecursive_1.mapObjectRecursive(styles, mapMediaStyles, { i });
+            }
+        }
+        return Object.assign(Object.assign({}, nonMediaStyles), mediaStyles);
+    },
+};
+//# sourceMappingURL=mediaArrays.js.map

package/dist/plugins/mediaArrays.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mediaArrays.js","sourceRoot":"","sources":["../../src/plugins/mediaArrays.ts"],"names":[],"mappings":";;;AAAA,yDAAsD;AACtD,mEAAgE;AAGhE,MAAM,cAAc,GAAG,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE;IACpC,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;QACxB,KAAK,MAAM,CAAC,IAAI,KAAK,EAAE;YACrB,MAAM,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;YACnB,IAAI,CAAC,KAAK,GAAG;gBAAE,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;SACzC;QACD,OAAO,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,EAAE,CAAC;KACzB;AACH,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE;IAClD,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;QACxB,OAAO,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;KACpC;AACH,CAAC,CAAC;AAEF,MAAM,cAAc,GAAG,CAAC,GAAW,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE;IAC7D,IAAI,GAAG,CAAC,UAAU,CAAC,YAAY,CAAC;QAAE,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC;IAC3D,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;QACxB,OAAO,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;KACpC;IACD,IAAI,6BAAa,CAAC,KAAK,CAAC,IAAI,OAAO,CAAC,SAAS,EAAE;QAC7C,OAAO;KACR;IACD,qCAAqC;IACrC,OAAO,EAAE,CAAC,GAAG,CAAC,EAAE,SAAS,EAAE,CAAC;AAC9B,CAAC,CAAC;AAEF;;GAEG;AACU,QAAA,WAAW,GAAiB;IACvC,IAAI,EAAE,aAAa;IACnB,IAAI,EAAE,eAAe;IACrB,MAAM,CAAC,GAAgC,EAAE,MAAW;QAClD,wBAAwB;QACxB,MAAM,GAAG,uCAAkB,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;QACpD,MAAM,WAAW,GAAG,EAAE,CAAC;QACvB,IAAI,cAAc,GAAG,MAAM,CAAC;QAC5B,KAAK,MAAM,CAAC,IAAI,GAAG,CAAC,KAAK,EAAE;YACzB,MAAM,UAAU,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;YAChC,IAAI,CAAC,UAAU,EAAE;gBACf,cAAc,GAAG,uCAAkB,CAAC,MAAM,EAAE,WAAW,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC;aACjE;iBAAM;gBACL,WAAW,CAAC,UAAU,UAAU,EAAE,CAAC,GAAG,uCAAkB,CAAC,MAAM,EAAE,cAAc,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC;aACzF;SACF;QACD,uCAAY,cAAc,GAAK,WAAW,EAAG;IAC/C,CAAC;CACF,CAAC"}

package/dist/plugins/merge$css.d.ts

@@ -0,0 +1,6 @@
+import { StylixPlugin } from './index';
+export declare function _merge$css(obj: any, ctx: any): void;
+/**
+ * Merges $css property into parent styles
+ */
+export declare const merge$css: StylixPlugin;

package/dist/plugins/merge$css.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.merge$css = exports._merge$css = void 0;
+const flatten_1 = require("../util/flatten");
+const isPlainObject_1 = require("../util/isPlainObject");
+function _merge$css(obj, ctx) {
+    if (!isPlainObject_1.isPlainObject(obj))
+        return;
+    for (const key in obj) {
+        if (key === '$css') {
+            const $css = obj[key];
+            if (Array.isArray($css)) {
+                const flat$css = flatten_1.flatten($css);
+                for (const val of flat$css) {
+                    _merge$css(val, ctx);
+                }
+            }
+            else {
+                _merge$css($css, ctx);
+            }
+        }
+        else {
+            let value = obj[key];
+            if (isPlainObject_1.isPlainObject(value)) {
+                value = ctx[key] || {};
+                _merge$css(obj[key], value);
+            }
+            ctx[key] = value;
+        }
+    }
+}
+exports._merge$css = _merge$css;
+/**
+ * Merges $css property into parent styles
+ */
+exports.merge$css = {
+    name: 'merge$css',
+    type: 'processStyles',
+    plugin(ctx, styles) {
+        const result = {};
+        _merge$css(styles, result);
+        return result;
+    },
+};
+//# sourceMappingURL=merge$css.js.map

package/dist/plugins/merge$css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"merge$css.js","sourceRoot":"","sources":["../../src/plugins/merge$css.ts"],"names":[],"mappings":";;;AAAA,6CAA0C;AAC1C,yDAAsD;AAGtD,SAAgB,UAAU,CAAC,GAAQ,EAAE,GAAQ;IAC3C,IAAI,CAAC,6BAAa,CAAC,GAAG,CAAC;QAAE,OAAO;IAChC,KAAK,MAAM,GAAG,IAAI,GAAG,EAAE;QACrB,IAAI,GAAG,KAAK,MAAM,EAAE;YAClB,MAAM,IAAI,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC;YACtB,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBACvB,MAAM,QAAQ,GAAG,iBAAO,CAAC,IAAI,CAAC,CAAC;gBAC/B,KAAK,MAAM,GAAG,IAAI,QAAQ,EAAE;oBAC1B,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;iBACtB;aACF;iBAAM;gBACL,UAAU,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;aACvB;SACF;aAAM;YACL,IAAI,KAAK,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC;YACrB,IAAI,6BAAa,CAAC,KAAK,CAAC,EAAE;gBACxB,KAAK,GAAG,GAAG,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;gBACvB,UAAU,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,CAAC;aAC7B;YACD,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;SAClB;KACF;AACH,CAAC;AAtBD,gCAsBC;AAED;;GAEG;AACU,QAAA,SAAS,GAAiB;IACrC,IAAI,EAAE,WAAW;IACjB,IAAI,EAAE,eAAe;IACrB,MAAM,CAAC,GAAgC,EAAE,MAAW;QAClD,MAAM,MAAM,GAAG,EAAE,CAAC;QAClB,UAAU,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QAC3B,OAAO,MAAM,CAAC;IAChB,CAAC;CACF,CAAC"}

package/dist/plugins/propCasing.d.ts

@@ -0,0 +1,5 @@
+import { StylixPlugin } from './index';
+/**
+ * Fixes casing and hyphenation on known style props
+ */
+export declare const propCasing: StylixPlugin;

package/dist/plugins/propCasing.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.propCasing = void 0;
+const classifyProps_1 = require("../classifyProps");
+const mapObjectRecursive_1 = require("../util/mapObjectRecursive");
+/**
+ * Fixes casing and hyphenation on known style props
+ */
+exports.propCasing = {
+    name: 'normalizeStyleProps',
+    type: 'processStyles',
+    plugin(ctx, styles) {
+        return mapObjectRecursive_1.mapObjectRecursive(styles, (key, value) => {
+            if (typeof key === 'string' && ctx.styleProps[classifyProps_1.simplifyStylePropName(key)]) {
+                return { [ctx.styleProps[classifyProps_1.simplifyStylePropName(key)]]: value };
+            }
+        });
+    },
+};
+const propCasingMap = (key, value, object, context) => {
+    if (typeof key === 'string' && context.ctx.styleProps[classifyProps_1.simplifyStylePropName(key)]) {
+        return { [context.ctx.styleProps[classifyProps_1.simplifyStylePropName(key)]]: value };
+    }
+};
+//# sourceMappingURL=propCasing.js.map

package/dist/plugins/propCasing.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"propCasing.js","sourceRoot":"","sources":["../../src/plugins/propCasing.ts"],"names":[],"mappings":";;;AAAA,oDAAyD;AACzD,mEAAgE;AAGhE;;GAEG;AACU,QAAA,UAAU,GAAiB;IACtC,IAAI,EAAE,qBAAqB;IAC3B,IAAI,EAAE,eAAe;IACrB,MAAM,CAAC,GAAgC,EAAE,MAAW;QAClD,OAAO,uCAAkB,CAAC,MAAM,EAAE,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE;YAC/C,IAAI,OAAO,GAAG,KAAK,QAAQ,IAAI,GAAG,CAAC,UAAU,CAAC,qCAAqB,CAAC,GAAG,CAAC,CAAC,EAAE;gBACzE,OAAO,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,qCAAqB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC;aAChE;QACH,CAAC,CAAC,CAAC;IACL,CAAC;CACF,CAAC;AAEF,MAAM,aAAa,GAAG,CAAC,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE;IACpD,IAAI,OAAO,GAAG,KAAK,QAAQ,IAAI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,qCAAqB,CAAC,GAAG,CAAC,CAAC,EAAE;QACjF,OAAO,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,qCAAqB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC;KACxE;AACH,CAAC,CAAC"}

package/dist/plugins/replace$$class.d.ts

@@ -0,0 +1,5 @@
+import { StylixPlugin } from './index';
+/**
+ * Replaces $$class with hash in string values
+ */
+export declare const replace$$class: StylixPlugin;

package/dist/plugins/replace$$class.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.replace$$class = void 0;
+const mapObjectRecursive_1 = require("../util/mapObjectRecursive");
+/**
+ * Replaces $$class with hash in string values
+ */
+exports.replace$$class = {
+    name: 'replace$$class',
+    type: 'processStyles',
+    plugin(ctx, styles) {
+        return mapObjectRecursive_1.mapObjectRecursive(styles, replace$$classMap, { ctx });
+    },
+};
+const replace$$classMap = (key, value, object, context) => {
+    value = typeof value === 'string' ? value.replace('$$class', context.ctx.hash) : value;
+    key = typeof key === 'string' ? key.replace('$$class', context.ctx.hash) : key;
+    return { [key]: value };
+};
+//# sourceMappingURL=replace$$class.js.map

package/dist/plugins/replace$$class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"replace$$class.js","sourceRoot":"","sources":["../../src/plugins/replace$$class.ts"],"names":[],"mappings":";;;AAAA,mEAAgE;AAGhE;;GAEG;AACU,QAAA,cAAc,GAAiB;IAC1C,IAAI,EAAE,gBAAgB;IACtB,IAAI,EAAE,eAAe;IACrB,MAAM,CAAC,GAAgC,EAAE,MAAW;QAClD,OAAO,uCAAkB,CAAC,MAAM,EAAE,iBAAiB,EAAE,EAAE,GAAG,EAAE,CAAC,CAAC;IAChE,CAAC;CACF,CAAC;AAEF,MAAM,iBAAiB,GAAG,CAAC,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE;IACxD,KAAK,GAAG,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,EAAE,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;IACvF,GAAG,GAAG,OAAO,GAAG,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,EAAE,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;IAC/E,OAAO,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,EAAE,CAAC;AAC1B,CAAC,CAAC"}

package/dist/plugins/themeFunctions.d.ts

@@ -0,0 +1,5 @@
+import { StylixPlugin } from './index';
+/**
+ * Evaluates functions in style objects, providing the theme and media from the current Stylix context.
+ */
+export declare const themeFunctions: StylixPlugin;

package/dist/plugins/themeFunctions.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.themeFunctions = void 0;
+const mapObjectRecursive_1 = require("../util/mapObjectRecursive");
+/**
+ * Evaluates functions in style objects, providing the theme and media from the current Stylix context.
+ */
+exports.themeFunctions = {
+    name: 'themeFunctions',
+    type: 'preprocessStyles',
+    plugin(ctx, styles) {
+        return mapObjectRecursive_1.mapObjectRecursive(styles, themeFunctionsMap, { ctx });
+    },
+};
+const themeFunctionsMap = (key, value, object, context) => {
+    if (typeof value === 'function') {
+        return { [key]: value(context.ctx.theme, context.ctx) };
+    }
+};
+//# sourceMappingURL=themeFunctions.js.map

package/dist/plugins/themeFunctions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeFunctions.js","sourceRoot":"","sources":["../../src/plugins/themeFunctions.ts"],"names":[],"mappings":";;;AAAA,mEAAgE;AAGhE;;GAEG;AACU,QAAA,cAAc,GAAiB;IAC1C,IAAI,EAAE,gBAAgB;IACtB,IAAI,EAAE,kBAAkB;IACxB,MAAM,CAAC,GAAgC,EAAE,MAAW;QAClD,OAAO,uCAAkB,CAAC,MAAM,EAAE,iBAAiB,EAAE,EAAE,GAAG,EAAE,CAAC,CAAC;IAChE,CAAC;CACF,CAAC;AAEF,MAAM,iBAAiB,GAAG,CAAC,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE;IACxD,IAAI,OAAO,KAAK,KAAK,UAAU,EAAE;QAC/B,OAAO,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,EAAE,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC;KACzD;AACH,CAAC,CAAC"}

package/dist/styleCollector.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export interface StyleCollector {
+    collect: (element: React.ReactElement) => React.ReactElement;
+    render: React.FC<React.ComponentProps<'style'>>;
+    styles: string[];
+}
+export declare const styleCollectorContext: React.Context<string[]>;
+export declare function createStyleCollector(): StyleCollector;

package/dist/styleCollector.js

@@ -0,0 +1,36 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createStyleCollector = exports.styleCollectorContext = void 0;
+const react_1 = __importStar(require("react"));
+exports.styleCollectorContext = react_1.createContext(null);
+function createStyleCollector() {
+    const styles = [];
+    const collector = {
+        collect: (element) => (react_1.default.createElement(exports.styleCollectorContext.Provider, { value: styles }, element)),
+        render: (props) => (react_1.default.createElement("style", Object.assign({ type: "text/css", key: props.id || 'stylix' }, props, { dangerouslySetInnerHTML: { __html: collector.styles.join(' ') } }))),
+        styles,
+    };
+    collector.render.displayName = 'StylixStyleCollectorRenderer';
+    return collector;
+}
+exports.createStyleCollector = createStyleCollector;
+//# sourceMappingURL=styleCollector.js.map

package/dist/styleCollector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styleCollector.js","sourceRoot":"","sources":["../src/styleCollector.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA6C;AAQhC,QAAA,qBAAqB,GAAG,qBAAa,CAAW,IAAI,CAAC,CAAC;AAEnE,SAAgB,oBAAoB;IAClC,MAAM,MAAM,GAAG,EAAE,CAAC;IAClB,MAAM,SAAS,GAAmB;QAChC,OAAO,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,CACpB,8BAAC,6BAAqB,CAAC,QAAQ,IAAC,KAAK,EAAE,MAAM,IAAG,OAAO,CAAkC,CAC1F;QACD,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CACjB,uDACE,IAAI,EAAC,UAAU,EACf,GAAG,EAAE,KAAK,CAAC,EAAE,IAAI,QAAQ,IACrB,KAAK,IACT,uBAAuB,EAAE,EAAE,MAAM,EAAE,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,IAC/D,CACH;QACD,MAAM;KACP,CAAC;IACF,SAAS,CAAC,MAAM,CAAC,WAAW,GAAG,8BAA8B,CAAC;IAC9D,OAAO,SAAS,CAAC;AACnB,CAAC;AAlBD,oDAkBC"}

package/dist/stylesToRuleArray.d.ts

@@ -0,0 +1,5 @@
+import { StylixContext } from './StylixProvider';
+/**
+ * Converts a Stylix CSS object to an array of rules, suitable for passing to StyleSheet#insertRule.
+ */
+export default function stylesToRuleArray(styles: any, hash: string, context: StylixContext): string[];

package/dist/stylesToRuleArray.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const plugins_1 = require("./plugins");
+const isPlainObject_1 = require("./util/isPlainObject");
+/**
+ * Converts a Stylix CSS object to an array of rules, suitable for passing to StyleSheet#insertRule.
+ */
+function stylesToRuleArray(styles, hash, context) {
+    try {
+        const processedStyles = plugins_1.applyPlugins('processStyles', styles, hash, context);
+        // serialize to css rules array
+        const serialize = function serialize(selector, styles) {
+            const lines = [];
+            for (const key in styles) {
+                const value = styles[key];
+                if (isPlainObject_1.isPlainObject(value))
+                    lines.push(serialize(key, value));
+                else
+                    lines.push(`  ${key}: ${value};`);
+            }
+            return `${selector} {\n${lines.join('\n')} }`;
+        };
+        const result = [];
+        for (const key in processedStyles) {
+            const value = processedStyles[key];
+            result.push(serialize(key, value));
+        }
+        return result;
+    }
+    catch (e) {
+        if (e.name && e.reason) {
+            console.error(`${e.name}: ${e.reason}\n`, e.source.replace('\n', ' ').substr(Math.max(0, e.column - 20), 100) + '\n', ' '.repeat(20) + '^');
+        }
+        else {
+            console.error(e);
+        }
+        return [];
+    }
+}
+exports.default = stylesToRuleArray;
+//# sourceMappingURL=stylesToRuleArray.js.map

package/dist/stylesToRuleArray.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stylesToRuleArray.js","sourceRoot":"","sources":["../src/stylesToRuleArray.ts"],"names":[],"mappings":";;AAAA,uCAAyC;AAEzC,wDAAqD;AAErD;;GAEG;AACH,SAAwB,iBAAiB,CACvC,MAAW,EACX,IAAY,EACZ,OAAsB;IAEtB,IAAI;QACF,MAAM,eAAe,GAAG,sBAAY,CAAC,eAAe,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC;QAE7E,+BAA+B;QAC/B,MAAM,SAAS,GAAG,SAAS,SAAS,CAAC,QAAQ,EAAE,MAAM;YACnD,MAAM,KAAK,GAAa,EAAE,CAAC;YAC3B,KAAK,MAAM,GAAG,IAAI,MAAM,EAAE;gBACxB,MAAM,KAAK,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;gBAC1B,IAAI,6BAAa,CAAC,KAAK,CAAC;oBAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC,CAAC;;oBACvD,KAAK,CAAC,IAAI,CAAC,KAAK,GAAG,KAAK,KAAK,GAAG,CAAC,CAAC;aACxC;YACD,OAAO,GAAG,QAAQ,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;QAChD,CAAC,CAAC;QAEF,MAAM,MAAM,GAAa,EAAE,CAAC;QAC5B,KAAK,MAAM,GAAG,IAAI,eAAe,EAAE;YACjC,MAAM,KAAK,GAAG,eAAe,CAAC,GAAG,CAAC,CAAC;YACnC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC,CAAC;SACpC;QACD,OAAO,MAAM,CAAC;KACf;IAAC,OAAO,CAAC,EAAE;QACV,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,MAAM,EAAE;YACtB,OAAO,CAAC,KAAK,CACX,GAAG,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,MAAM,IAAI,EAC1B,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC,GAAG,IAAI,EAC1E,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,GAAG,GAAG,CACrB,CAAC;SACH;aAAM;YACL,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;SAClB;QACD,OAAO,EAAE,CAAC;KACX;AACH,CAAC;AArCD,oCAqCC"}

package/dist/types.d.ts

@@ -0,0 +1,76 @@
+import React, { CSSProperties } from 'react';
+export declare type StylixValue<T> = T | Array<T | '@'> | ((theme: any, media: string[]) => T | Array<T | '@'>);
+/**
+ * All standard CSS properties, custom style props, and the $css prop.
+ */
+declare type StylixStyleProps = {
+    /**
+     * Additional styles.
+     */
+    $css?: any;
+    /**
+     * Disables Stylix for the current element.
+     */
+    $disabled?: boolean;
+} & {
+    [key in keyof CSSProperties]?: StylixValue<CSSProperties[key]>;
+} & {
+    [key in keyof StylixPropsExtensions]?: StylixValue<key extends keyof StylixPropsExtensions ? StylixPropsExtensions[key] : never>;
+};
+/**
+ * Allows users to add custom props to Stylix components:
+ *
+ * declare module 'stylix' {
+ *   interface StylixStyleProperties {
+ *     ...
+ *   }
+ * }
+ */
+export interface StylixPropsExtensions {
+}
+/**
+ * A component's props, without properties that conflict with style properties.
+ */
+declare type ComponentPropsWithoutStyles<TComponent extends React.ElementType> = Omit<React.ComponentPropsWithRef<TComponent>, keyof StylixStyleProps>;
+/**
+ * Allows users to define components that accept Stylix style props.
+ */
+export declare type StylixProps<ElType extends React.ElementType = any> = ComponentPropsWithoutStyles<ElType> & StylixStyleProps;
+/**
+ * Additional properties on Stylix component functions.
+ */
+declare type StylixComponentMeta = {
+    displayName?: string;
+    __isStylix: true;
+};
+export declare type StylixWrappedComponentProps<TComponent extends React.ElementType> = ComponentPropsWithoutStyles<TComponent> & StylixStyleProps;
+export declare type StylixWrappedComponent<TComponent extends React.ElementType, TAdditionalProps = unknown> = React.FunctionComponent<TAdditionalProps & StylixWrappedComponentProps<TComponent>> & StylixComponentMeta;
+/**
+ * Props for main Stylix component (<$>)
+ * `TComponent` is determined automatically by the type of $el.
+ * <$ $el={...}>...</$>
+ */
+export declare type Stylix$Props<TComponent extends React.ElementType | React.ReactElement> = {
+    /**
+     * Specifies the element to render.
+     */
+    $el: TComponent;
+} & ComponentPropsWithoutStyles<TComponent extends React.ElementType ? TComponent : TComponent extends React.ReactElement<infer P> ? P : never> & StylixStyleProps;
+/**
+ * Type of main Stylix component ($)
+ */
+export declare type Stylix$Component = {
+    /**
+     * This is equivalent to React.FunctionComponent, but must be specified explicitly this way to allow
+     * TComponent to be generic here and not directly on Stylix$Component, so that it can be inferred at the time
+     * the component is used.
+     */
+    <TComponent extends React.ElementType | React.ReactElement>(props: Stylix$Props<TComponent>, context?: any): React.ReactElement<any, any> | null;
+    /**
+     * Type for the $.styled() helper function.
+     */
+    styled: <TComponent extends React.ElementType, TPropMap extends Record<string, string> = Record<string, never>>($el: TComponent, conflictingPropMapping?: TPropMap) => StylixWrappedComponent<TComponent, Record<keyof TPropMap, any>>;
+} & StylixComponentMeta & {
+    [key in keyof JSX.IntrinsicElements]: StylixWrappedComponent<key>;
+};
+export {};

package/dist/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":""}

package/dist/useStyles.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Accepts a Stylix CSS object and returns a unique className based on the styles' hash.
+ * The styles are registered with the Stylix context and will be applied to the document.
+ * If `global` is false, provided styles will be nested within the generated classname.
+ * Returns the className hash if enabled, or an empty string.
+ */
+export declare function useStyles(styles: any, options?: {
+    global?: boolean;
+    disabled?: boolean;
+}): string;
+export declare function useKeyframes(keyframes: any, options?: {
+    disabled?: boolean;
+}): string;
+export declare function useGlobalStyles(styles: any, options?: {
+    disabled?: boolean;
+}): string;