@codecademy/variance 0.19.1-alpha.a809e8.0 → 1.0.0-alpha.2627a4.0

package/dist/createTheme/createTheme.test.js

@@ -0,0 +1,192 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import { mapValues } from 'lodash';
+import { createTheme } from './createTheme';
+describe('createTheme', function () {
+  var base = {
+    breakpoints: {
+      xs: '1',
+      sm: '2',
+      md: '3',
+      lg: '4',
+      xl: '5'
+    }
+  };
+  it('works', function () {
+    expect(createTheme(base).build()).toEqual(_objectSpread(_objectSpread({}, base), {}, {
+      _variables: {},
+      _tokens: {}
+    }));
+  });
+  it('adds a scale', function () {
+    var theme = createTheme(base).addScale('test', function () {
+      return {
+        test: 1,
+        test2: 2
+      };
+    }).build();
+    expect(theme.test).toEqual({
+      test: 1,
+      test2: 2
+    });
+  });
+  it('updates a scale', function () {
+    var builder = createTheme(base).addScale('test', function () {
+      return {
+        test: 1,
+        test2: 2
+      };
+    });
+    expect(builder.build().test).toEqual({
+      test: 1,
+      test2: 2
+    });
+    builder.updateScale('test', function () {
+      return {
+        test3: 3
+      };
+    });
+    expect(builder.build().test).toEqual({
+      test: 1,
+      test2: 2,
+      test3: 3
+    });
+  });
+  it('serializes variables', function () {
+    var theme = createTheme(base).addScale('test', function () {
+      return {
+        test: 1,
+        test2: 2
+      };
+    }).createScaleVariables('test').build();
+    expect(theme.test).toEqual({
+      test: 'var(--test-test)',
+      test2: 'var(--test-test2)'
+    });
+    expect(theme._variables.root).toEqual({
+      '--test-test': 1,
+      '--test-test2': 2
+    });
+  });
+  describe('colors', function () {
+    var staticColors = {
+      white: 'white',
+      black: 'black',
+      blue: 'blue',
+      green: 'green',
+      red: 'red'
+    };
+    var cssVariableReferences = mapValues(staticColors, function (val) {
+      return "var(--color-".concat(val, ")");
+    });
+    var builder = createTheme(base);
+    it('creates color variables', function () {
+      var theme = builder.addColors(staticColors).build();
+      expect(theme.colors).toEqual(cssVariableReferences);
+    });
+    it('adds colorModes', function () {
+      var theme = builder.addColors(staticColors).addColorModes('light', {
+        light: {
+          primary: 'red'
+        },
+        dark: {
+          primary: 'blue'
+        }
+      }).build();
+      expect(theme.colors).toEqual(_objectSpread(_objectSpread({}, mapValues(staticColors, function (val) {
+        return "var(--color-".concat(val, ")");
+      })), {}, {
+        primary: 'var(--color-primary)'
+      }));
+      expect(theme._variables.mode).toEqual({
+        '--color-primary': 'var(--color-red)'
+      });
+    });
+    it('returns value checker for colors', function () {
+      var theme = builder.addColors({
+        black: '#000000',
+        white: '#FFFFFF'
+      }).addColorModes('light', {
+        light: {
+          primary: 'black'
+        },
+        dark: {
+          primary: 'white'
+        }
+      }).build();
+      expect(theme._getColorValue('white')).toEqual('#FFFFFF');
+      expect(theme._getColorValue(theme.modes.light.primary)).toEqual('#000000');
+    });
+    it('returns value checker for colors with deep values', function () {
+      var theme = builder.addColors({
+        black: '#000000',
+        white: '#FFFFFF',
+        gray: {
+          200: '#eeeeee',
+          300: '#666666'
+        }
+      }).addColorModes('light', {
+        light: {
+          primary: {
+            "default": 'gray-200',
+            cool: {
+              _: 'gray-300',
+              town: 'black'
+            }
+          }
+        }
+      }).build();
+      expect(theme._getColorValue('gray-300')).toEqual('#666666');
+      expect(theme._getColorValue(theme.modes.light['primary-default'])).toEqual('#eeeeee');
+    });
+    it('merges color mode configurations when overriden', function () {
+      var theme = builder.addColors({
+        black: '#000000',
+        white: '#FFFFFF'
+      }).addColorModes('light', {
+        light: {
+          primary: {
+            _: 'black',
+            hover: 'white'
+          }
+        }
+      }).build();
+      var override = createTheme(theme).addColorModes('light', {
+        light: {
+          primary: {
+            _: 'white',
+            hover: 'black'
+          }
+        }
+      }).build();
+      expect(override.modes.light.primary).toEqual('white');
+    });
+    it('returns the raw values of color mode colors on the tokens object', function () {
+      var theme = createTheme(base).addColors({
+        black: '#000000',
+        gray: {
+          300: '#666666'
+        }
+      }).addColorModes('light', {
+        light: {
+          primary: {
+            cool: {
+              _: 'gray-300',
+              town: 'black'
+            }
+          }
+        }
+      }).build();
+      expect(theme._tokens.modes).toEqual({
+        light: {
+          'primary-cool': '#666666',
+          'primary-cool-town': '#000000'
+        }
+      });
+    });
+  });
+});

package/dist/createTheme/createTheme.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createTheme.test.js","sourceRoot":"","sources":["../../src/createTheme/createTheme.test.ts"],"names":[],"mappings":"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"}

package/dist/createTheme/index.d.ts

@@ -0,0 +1,3 @@
+export * from './createTheme';
+export * from '../utils/serializeTokens';
+export * from '../utils/flattenScale';

package/dist/createTheme/index.js

@@ -0,0 +1,3 @@
+export * from './createTheme';
+export * from '../utils/serializeTokens';
+export * from '../utils/flattenScale';

package/dist/createTheme/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/createTheme/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC"}

package/dist/createTheme/types.d.ts

@@ -0,0 +1,42 @@
+import { CSSObject } from '../types/props';
+import { AbstractTheme } from '../types/theme';
+/**
+ * This is a custom generic that ensures the safety of adding additional values to a theme object without accidentally wiping out
+ * required keys like `breakpoints`.  It works by creating a new mapped type and merging the values of the union of Base & Next:
+ * 1. If the key exists on both Base and Next return the intersection of both values
+ * 2. If the key exists on next use the value on next.
+ * 3. If the key exists on base but nothing else use the value on base.
+ *
+ * The resulting type is then rejoined with keys that cannot be mutated (breakpoints) as the next version of Theme
+ */
+export declare type MergeTheme<Base extends AbstractTheme, Next, Unmergable = Record<'breakpoints', Base['breakpoints']>> = Unmergable & Merge<Base, Next>;
+/** This merges at 2 levels of depth */
+export declare type Merge<A, B> = {
+    [K in keyof (A & B)]: K extends keyof B ? K extends keyof A ? AssignValueIfUnmergable<A[K], B[K]> : B[K] : K extends keyof A ? A[K] : never;
+};
+/** Extract mergable objects */
+export declare type Mergable<T> = Exclude<T, ((...args: any) => any) | string | boolean | symbol | number | any[]>;
+/** Return B if either A or B is unmergable */
+export declare type AssignValueIfUnmergable<A, B> = Mergable<A> extends never ? B : Mergable<B> extends never ? B : Assign<A, B>;
+/** Prefer all values from B */
+export declare type Assign<A, B> = {
+    [K in keyof A | keyof B]: K extends keyof B ? B[K] : K extends keyof A ? A[K] : never;
+};
+/** These are keys that are consistent for all theme builds - they are loosely typed as they are not meant to be accessed directly */
+export declare type PrivateThemeKeys = {
+    _variables: Record<string, CSSObject>;
+    _tokens: Record<string | number, any>;
+};
+/** This allows 3 layers of color aliases to be constructed when adding colorModes
+ * @example
+ * {
+ *   button: {
+ *     bg: {
+ *       hover: 'someAlias'
+ *     }
+ *   }
+ * }
+ *
+ * `button-bg-hover`
+ * */
+export declare type ColorModeConfig<Colors> = Record<string, Colors | Record<string, Colors> | Record<string, Colors | Record<string, Colors>>>;

package/dist/createTheme/types.js.map

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

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+export { variance } from './core';
+export * from './createTheme';
+export * from './types/props';
+export * from './transforms';
+export * from './scales/createScale';

package/dist/index.js

@@ -0,0 +1,5 @@
+export { variance } from './core';
+export * from './createTheme';
+export * from './types/props';
+export * from './transforms';
+export * from './scales/createScale';

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAClC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,sBAAsB,CAAC"}

package/dist/scales/createScale.d.ts

@@ -0,0 +1,3 @@
+export declare const createScale: <T extends string | number>() => readonly T[] & {
+    length: 0;
+};

package/dist/scales/createScale.js

@@ -0,0 +1,3 @@
+export var createScale = function createScale() {
+  return [];
+};

package/dist/scales/createScale.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createScale.js","sourceRoot":"","sources":["../../src/scales/createScale.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,WAAW,GAAG,GAA8B,EAAE,CACzD,EAAkC,CAAC"}

package/dist/scales/createScaleLookup.d.ts

@@ -0,0 +1,5 @@
+import { Prop } from '../types/config';
+import { ThemeProps } from '../types/props';
+declare type GetScaleValue = (val: string | number, props: ThemeProps) => string | number | undefined;
+export declare const createScaleLookup: (scale: Prop['scale']) => GetScaleValue;
+export {};

package/dist/scales/createScaleLookup.js

@@ -0,0 +1,24 @@
+import { get, isArray, isObject, isString } from 'lodash';
+export var createScaleLookup = function createScaleLookup(scale) {
+  if (isString(scale)) {
+    return function (val, props) {
+      return get(props, ['theme', scale, val]);
+    };
+  }
+
+  if (isArray(scale)) {
+    return function (val) {
+      return val;
+    };
+  }
+
+  if (isObject(scale)) {
+    return function (val) {
+      return get(scale, val);
+    };
+  }
+
+  return function () {
+    return undefined;
+  };
+};

package/dist/scales/createScaleLookup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createScaleLookup.js","sourceRoot":"","sources":["../../src/scales/createScaleLookup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAU1D,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAAoB,EAAiB,EAAE;IACvE,IAAI,QAAQ,CAAC,KAAK,CAAC,EAAE;QACnB,OAAO,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,OAAO,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC;KAC1D;IACD,IAAI,OAAO,CAAC,KAAK,CAAC,EAAE;QAClB,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC;KACrB;IACD,IAAI,QAAQ,CAAC,KAAK,CAAC,EAAE;QACnB,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;KACjC;IAED,OAAO,GAAG,EAAE,CAAC,SAAS,CAAC;AACzB,CAAC,CAAC"}

package/dist/transforms/index.d.ts

@@ -0,0 +1 @@
+export * from './transformSize';

package/dist/transforms/index.js

@@ -0,0 +1 @@
+export * from './transformSize';

package/dist/transforms/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/transforms/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC"}

package/dist/transforms/transformSize.d.ts

@@ -0,0 +1,2 @@
+export declare const percentageOrAbsolute: (coordinate: number) => string | 0;
+export declare const transformSize: (value: string | number) => string | 0;

package/dist/transforms/transformSize.js

@@ -0,0 +1,47 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]); if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import { isNumber } from 'lodash';
+export var percentageOrAbsolute = function percentageOrAbsolute(coordinate) {
+  if (coordinate === 0) {
+    return coordinate;
+  }
+
+  if (coordinate <= 1 && coordinate >= -1) {
+    return "".concat(coordinate * 100, "%");
+  }
+
+  return "".concat(coordinate, "px");
+};
+var valueWithUnit = /(-?\d*\.?\d+)(%|\w*)/;
+export var transformSize = function transformSize(value) {
+  if (isNumber(value)) {
+    return percentageOrAbsolute(value);
+  }
+
+  if (value.includes('calc')) {
+    return value;
+  }
+
+  var _ref = valueWithUnit.exec(value) || [],
+      _ref2 = _slicedToArray(_ref, 3),
+      match = _ref2[0],
+      number = _ref2[1],
+      unit = _ref2[2];
+
+  if (match === undefined) {
+    return value;
+  }
+
+  var numericValue = parseFloat(number);
+  return !unit ? percentageOrAbsolute(numericValue) : "".concat(numericValue).concat(unit);
+};

package/dist/transforms/transformSize.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transformSize.js","sourceRoot":"","sources":["../../src/transforms/transformSize.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAElC,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,UAAkB,EAAE,EAAE;IACzD,IAAI,UAAU,KAAK,CAAC,EAAE;QACpB,OAAO,UAAU,CAAC;KACnB;IACD,IAAI,UAAU,IAAI,CAAC,IAAI,UAAU,IAAI,CAAC,CAAC,EAAE;QACvC,OAAO,GAAG,UAAU,GAAG,GAAG,GAAG,CAAC;KAC/B;IACD,OAAO,GAAG,UAAU,IAAI,CAAC;AAC3B,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,sBAAsB,CAAC;AAE7C,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAsB,EAAE,EAAE;IACtD,IAAI,QAAQ,CAAC,KAAK,CAAC,EAAE;QACnB,OAAO,oBAAoB,CAAC,KAAK,CAAC,CAAC;KACpC;IAED,IAAI,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;QAC1B,OAAO,KAAK,CAAC;KACd;IAED,MAAM,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,GAAG,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;IAE9D,IAAI,KAAK,KAAK,SAAS,EAAE;QACvB,OAAO,KAAK,CAAC;KACd;IAED,MAAM,YAAY,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC;IAExC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,oBAAoB,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,GAAG,YAAY,GAAG,IAAI,EAAE,CAAC;AAC/E,CAAC,CAAC"}

package/dist/types/config.d.ts

@@ -0,0 +1,71 @@
+import { Theme } from '@emotion/react';
+import { DefaultCSSPropertyValue, PropertyTypes } from './properties';
+import { AbstractProps, CSSObject, CSSPropMap, CSSProps, ResponsiveProp, ThemeProps } from './props';
+import { AllUnionKeys, Key, KeyFromUnion } from './utils';
+export declare type MapScale = Record<string | number, string | number>;
+export declare type ArrayScale = readonly (string | number)[] & {
+    length: 0;
+};
+export interface BaseProperty {
+    property: keyof PropertyTypes;
+    properties?: readonly (keyof PropertyTypes)[];
+}
+export interface Prop extends BaseProperty {
+    scale?: keyof Theme | MapScale | ArrayScale;
+    transform?: (val: string | number, prop?: string, props?: AbstractProps) => string | number | CSSObject;
+}
+export interface AbstractPropTransformer extends Prop {
+    prop: string;
+    styleFn: (value: unknown, prop: string, props: AbstractProps) => CSSObject;
+}
+export interface AbstractParser {
+    (props: AbstractProps): CSSObject;
+    propNames: string[];
+    config: Record<string, AbstractPropTransformer>;
+}
+export declare type PropertyValues<Property extends keyof PropertyTypes, All extends boolean = false> = Exclude<PropertyTypes<All extends true ? DefaultCSSPropertyValue : never>[Property], All extends true ? never : object | any[]>;
+export declare type ScaleValue<Config extends Prop> = Config['scale'] extends keyof Theme ? keyof Theme[Config['scale']] | PropertyValues<Config['property']> : Config['scale'] extends MapScale ? keyof Config['scale'] | PropertyValues<Config['property']> : Config['scale'] extends ArrayScale ? Config['scale'][number] | PropertyValues<Config['property']> : PropertyValues<Config['property'], true>;
+export declare type Scale<Config extends Prop> = ResponsiveProp<ScaleValue<Config> | ((theme: Theme) => ScaleValue<Config>)>;
+export interface TransformFn<P extends string, Config extends Prop> {
+    (value: Scale<Config> | Scale<Config>, prop: P, props: ThemeProps<{
+        [K in P]?: Scale<Config>;
+    }>): CSSObject;
+}
+export interface PropTransformer<P extends string, C extends Prop> extends AbstractPropTransformer, Prop {
+    prop: P;
+    styleFn: TransformFn<P, C>;
+}
+export declare type TransformerMap<Config extends Record<string, Prop>> = {
+    [P in Key<keyof Config>]: PropTransformer<Key<P>, Config[P]>;
+};
+export interface Parser<Config extends Record<string, AbstractPropTransformer>> {
+    (props: ParserProps<Config>): CSSObject;
+    propNames: (keyof Config)[];
+    config: Config;
+}
+export declare type Compose<Args extends AbstractParser[]> = {
+    [K in AllUnionKeys<Args[number]['config']>]: KeyFromUnion<Args[number]['config'], K>;
+};
+export interface Variant<P extends AbstractParser> {
+    <Keys extends keyof Props, Base extends AbstractProps, Props extends Record<Keys, AbstractProps>, PropKey extends Readonly<string> = 'variant'>(options: {
+        prop?: PropKey;
+        defaultVariant?: keyof Props;
+        base?: CSSProps<Base, SystemProps<P>>;
+        variants: CSSPropMap<Props, SystemProps<P>>;
+    }): (props: VariantProps<PropKey, Keys | false> & ThemeProps) => CSSObject;
+}
+export interface States<P extends AbstractParser> {
+    <Props extends Record<string, AbstractProps>>(states: CSSPropMap<Props, SystemProps<P>>): (props: Partial<Record<keyof Props, boolean>> & ThemeProps) => CSSObject;
+}
+export interface CSS<P extends AbstractParser> {
+    <Props extends AbstractProps>(config: CSSProps<Props, SystemProps<P>>): (props: ThemeProps) => CSSObject;
+}
+export declare type ParserProps<Config extends Record<string, AbstractPropTransformer>> = ThemeProps<{
+    [P in keyof Config]?: Parameters<Config[P]['styleFn']>[2][Config[P]['prop']];
+}>;
+export declare type SystemProps<P extends AbstractParser> = {
+    [K in keyof Omit<Parameters<P>[0], 'theme'>]: Omit<Parameters<P>[0], 'theme'>[K];
+};
+export declare type VariantProps<T extends string, V> = {
+    [Key in T]?: V;
+};

package/dist/types/config.js.map

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

package/dist/types/properties.d.ts

@@ -0,0 +1,22 @@
+import { Globals, StandardProperties, VendorProperties } from 'csstype';
+declare type ColorProperties = 'color' | `${string}Color`;
+declare type ColorGlobals = {
+    [K in Extract<keyof StandardProperties, ColorProperties>]?: Globals | 'currentColor' | 'transparent' | (string & {});
+};
+declare type SizeProperties = 'left' | 'right' | 'top' | 'bottom' | 'inset' | 'width' | 'height' | `${string}${'Width' | 'Height'}`;
+declare type SizeGlobals = {
+    [K in Extract<keyof StandardProperties, SizeProperties>]?: StandardProperties[K] | (number & {});
+};
+/** This is a placeholder type for CSS properties that may not have any specific global values (outlineOffset).
+ * (string & {}) will allow strings but not generalize the union type to just a string if other string literals exist in the union.
+ *
+ * This ensures that autosuggestions will still work for literal types but still allow any string for certain properties.
+ */
+export declare type DefaultCSSPropertyValue = (string & {}) | 0;
+export interface PropertyTypes<Overrides = DefaultCSSPropertyValue> extends Omit<StandardProperties<Overrides>, keyof ColorGlobals | keyof SizeGlobals>, ColorGlobals, SizeGlobals {
+}
+export interface VendorPropertyTypes<Overrides = DefaultCSSPropertyValue> extends VendorProperties<Overrides> {
+}
+export interface CSSPropertyTypes<Overrides = DefaultCSSPropertyValue> extends PropertyTypes<Overrides>, VendorPropertyTypes<Overrides> {
+}
+export {};

package/dist/types/properties.js.map

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

package/dist/types/props.d.ts

@@ -0,0 +1,47 @@
+import { Theme } from '@emotion/react';
+import { AbstractParser, Scale } from './config';
+import { CSSPropertyTypes } from './properties';
+export declare type AbstractProps = ThemeProps<Record<string, unknown>>;
+interface BreakpointKeys<T = string> {
+    xs: T;
+    sm: T;
+    md: T;
+    lg: T;
+    xl: T;
+}
+export interface BreakpointCache {
+    map: BreakpointKeys;
+    array: string[];
+}
+export declare type ThemeProps<Props = {}> = Props & {
+    theme?: Theme;
+};
+export interface MediaQueryArray<T> {
+    0?: T;
+    1?: T;
+    2?: T;
+    3?: T;
+    4?: T;
+    5?: T;
+}
+export interface MediaQueryMap<T> {
+    _?: T;
+    xs?: T;
+    sm?: T;
+    md?: T;
+    lg?: T;
+    xl?: T;
+}
+export declare type ResponsiveProp<T> = T | MediaQueryMap<T> | MediaQueryArray<T>;
+export interface CSSObject {
+    [key: string]: string | number | CSSObject | undefined;
+}
+export declare type CSSPropMap<Props, System> = {
+    [K in keyof Props]?: CSSProps<Props[K], System>;
+};
+export declare type CSSProps<Props, System> = {
+    [K in keyof Props]?: K extends keyof System ? System[K] : K extends keyof CSSPropertyTypes ? CSSPropertyTypes[K] : Omit<CSSPropertyTypes, keyof System> & Omit<System, 'theme'>;
+};
+export declare type StyleProps<T extends (args: AbstractProps) => CSSObject> = Parameters<T>[0];
+export declare type ScaleValue<P extends AbstractParser, Prop extends keyof P['config']> = Scale<P['config'][Prop]>;
+export {};

package/dist/types/props.js.map

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

package/dist/types/theme.d.ts

@@ -0,0 +1,17 @@
+export interface Breakpoints<T = string> {
+    xs: T;
+    sm: T;
+    md: T;
+    lg: T;
+    xl: T;
+}
+export interface BaseTheme {
+    breakpoints: Breakpoints;
+}
+export interface AbstractTheme extends BaseTheme {
+    readonly [key: string]: any;
+}
+declare module '@emotion/react' {
+    interface Theme extends BaseTheme {
+    }
+}

package/dist/types/theme.js.map

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

package/dist/types/utils.d.ts

@@ -0,0 +1,3 @@
+export declare type AllUnionKeys<T> = T extends any ? keyof T : never;
+export declare type KeyFromUnion<T, K> = T extends any ? K extends keyof T ? T[K] : never : never;
+export declare type Key<T> = T extends string ? T : never;

package/dist/types/utils.js.map

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