@compiled/react 0.6.13 → 0.9.1

package/dist/browser/styled/index.d.ts

@@ -1,29 +1,26 @@
-import { ComponentType } from 'react';
-import { CssFunction, BasicTemplateInterpolations } from '../types';
-export interface FunctionIterpolation<TProps> {
-    (props: TProps): string | number | undefined;
-}
+import type { ComponentType } from 'react';
+import type { BasicTemplateInterpolations, CssFunction, FunctionInterpolation } from '../types';
 /**
  * Typing for the CSS object.
  */
-export declare type CssObject<TProps> = CssFunction<FunctionIterpolation<TProps>>;
+export declare type CssObject<TProps> = CssFunction<FunctionInterpolation<TProps>>;
 /**
  * Extra props added to the output Styled Component.
  */
 export interface StyledProps {
     as?: keyof JSX.IntrinsicElements;
 }
-export declare type Interpolations<TProps extends unknown> = (BasicTemplateInterpolations | FunctionIterpolation<TProps> | CssObject<TProps> | CssObject<TProps>[])[];
+export declare type Interpolations<TProps extends unknown> = (BasicTemplateInterpolations | FunctionInterpolation<TProps> | CssObject<TProps> | CssObject<TProps>[])[];
 /**
  * This allows us to take the generic `TTag` (that will be a valid `DOM` tag) and then use it to
  * define correct props based on it from `JSX.IntrinsicElements`, while also injecting our own
  * props from `StyledProps`.
  */
 export interface StyledFunctionFromTag<TTag extends keyof JSX.IntrinsicElements> {
-    <TProps extends unknown>(css: CssObject<TProps> | CssObject<TProps>[], ...interpoltations: Interpolations<TProps>): React.ComponentType<TProps & JSX.IntrinsicElements[TTag] & StyledProps>;
+    <TProps extends unknown>(css: CssObject<TProps> | CssObject<TProps>[], ...interpolations: Interpolations<TProps>): React.ComponentType<TProps & JSX.IntrinsicElements[TTag] & StyledProps>;
 }
 export interface StyledFunctionFromComponent<TInheritedProps extends unknown> {
-    <TProps extends unknown>(css: CssObject<TProps> | TemplateStringsArray, ...interpoltations: Interpolations<TProps>): React.ComponentType<TProps & StyledProps & TInheritedProps>;
+    <TProps extends unknown>(css: CssObject<TProps> | TemplateStringsArray, ...interpolations: Interpolations<TProps>): React.ComponentType<TProps & StyledProps & TInheritedProps>;
 }
 export declare type StyledComponentMap = {
     [Tag in keyof JSX.IntrinsicElements]: StyledFunctionFromTag<Tag>;

package/dist/browser/styled/index.js.flow

@@ -0,0 +1,69 @@
+/**
+ * Flowtype definitions for index
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.15.0
+ * @flow
+ */
+import type { ComponentType } from 'react';
+import type { BasicTemplateInterpolations, CssFunction, FunctionInterpolation } from '../types';
+/**
+ * Typing for the CSS object.
+ */
+export type CssObject<TProps> = CssFunction<FunctionInterpolation<TProps>>;
+/**
+ * Extra props added to the output Styled Component.
+ */
+export type StyledProps = {
+  as?: $Keys<$JSXIntrinsics>,
+};
+export type Interpolations<TProps: mixed> = (
+  | BasicTemplateInterpolations
+  | FunctionInterpolation<TProps>
+  | CssObject<TProps>
+  | CssObject<TProps>[]
+)[];
+/**
+ * This allows us to take the generic `TTag` (that will be a valid `DOM` tag) and then use it to
+ * define correct props based on it from `$JSXIntrinsics`, while also injecting our own
+ * props from `StyledProps`.
+ */
+export interface StyledFunctionFromTag<TTag: $Keys<$JSXIntrinsics>> {
+  <TProps: mixed>(
+    css: CssObject<TProps> | $ReadOnlyArray<CssObject<TProps>>,
+    ...interpolations: Interpolations<TProps>
+  ): React$ComponentType<{
+    ...TProps,
+    ...$Exact<$ElementType<$JSXIntrinsics, TTag>>,
+    ...StyledProps,
+  }>;
+}
+export interface StyledFunctionFromComponent<TInheritedProps: mixed> {
+  <TProps: mixed>(
+    css: CssObject<TProps> | $ReadOnlyArray<string>,
+    ...interpolations: Interpolations<TProps>
+  ): React$ComponentType<{ ...TProps, ...StyledProps, ...TInheritedProps }>;
+}
+export type StyledComponentMap = $ObjMapi<$JSXIntrinsics, <Tag>(Tag) => StyledFunctionFromTag<Tag>>;
+export type StyledComponentInstantiator = {
+  /**
+   * Typing to enable consumers to compose components, e.g: `styled(Component)`
+   */
+  <TInheritedProps: mixed>(
+    Component: ComponentType<TInheritedProps>
+  ): StyledFunctionFromComponent<TInheritedProps>,
+  ...
+} & StyledComponentMap;
+/**
+ * Create a component that ties styles to an element which comes with built-in behavior such as `ref` and `as` prop support.
+ *
+ * ```
+ * styled.div`font-size: 12px`; // Template literal CSS
+ * styled.div({ fontSize: 12 }); // Object CSS
+ * styled.div([{ fontSize: 12 }, `font-size: 12px;`]) // Array CSS
+ * styled.div({ fontSize: 12 }, `font-size: 12px`) Multi arguments CSS
+ * ```
+ *
+ * For more help, read the docs:
+ * https://compiledcssinjs.com/docs/api-styled
+ */
+declare export var styled: StyledComponentInstantiator;

package/dist/browser/styled/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/styled/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AA6DlD;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,IAAM,MAAM,GAAgC,IAAI,KAAK,CAC1D,EAAE,EACF;IACE,GAAG;QACD,OAAO;YACL,8CAA8C;YAC9C,yDAAyD;YACzD,MAAM,gBAAgB,EAAE,CAAC;QAC3B,CAAC,CAAC;IACJ,CAAC;CACF,CACK,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/styled/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAyDlD;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,IAAM,MAAM,GAAgC,IAAI,KAAK,CAC1D,EAAE,EACF;IACE,GAAG;QACD,OAAO;YACL,8CAA8C;YAC9C,yDAAyD;YACzD,MAAM,gBAAgB,EAAE,CAAC;QAC3B,CAAC,CAAC;IACJ,CAAC;CACF,CACK,CAAC"}

package/dist/browser/types.d.ts

@@ -1,13 +1,16 @@
-import * as CSS from 'csstype';
+import type * as CSS from 'csstype';
 /**
  * Typing for the interpolations.
  */
 export declare type BasicTemplateInterpolations = string | number;
+export interface FunctionInterpolation<TProps> {
+    (props: TProps): CSSProps | BasicTemplateInterpolations | boolean | undefined;
+}
 /**
  * These are all the CSS props that will exist.
  */
-export declare type CSSProps = CSS.Properties<string | number>;
+export declare type CSSProps = CSS.Properties<BasicTemplateInterpolations>;
 export declare type AnyKeyCssProps<TValue> = {
-    [key: string]: AnyKeyCssProps<TValue> | CSSProps | string | number | TValue;
+    [key: string]: AnyKeyCssProps<TValue> | CSSProps | BasicTemplateInterpolations | TValue;
 };
 export declare type CssFunction<TValue = void> = CSSProps | AnyKeyCssProps<TValue> | TemplateStringsArray | string | boolean | undefined;

package/dist/browser/types.js.flow

@@ -0,0 +1,29 @@
+/**
+ * Flowtype definitions for types
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.15.0
+ * @flow
+ */
+import * as CSS from 'csstype';
+/**
+ * Typing for the interpolations.
+ */
+export type BasicTemplateInterpolations = string | number;
+export interface FunctionInterpolation<TProps> {
+  (props: TProps): CSSProps | BasicTemplateInterpolations | boolean | void;
+}
+/**
+ * These are all the CSS props that will exist.
+ */
+export type CSSProps = CSS.Properties<BasicTemplateInterpolations>;
+export type AnyKeyCssProps<TValue> = {
+  [key: string]: AnyKeyCssProps<TValue> | CSSProps | BasicTemplateInterpolations | TValue,
+  ...
+};
+export type CssFunction<TValue = void> =
+  | CSSProps
+  | AnyKeyCssProps<TValue>
+  | $ReadOnlyArray<string>
+  | string
+  | boolean
+  | void;

package/dist/browser/utils/error.js.flow

@@ -0,0 +1,7 @@
+/**
+ * Flowtype definitions for error
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.15.0
+ * @flow
+ */
+declare export var createSetupError: () => Error;

package/dist/cjs/class-names/index.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
-import { CssFunction, BasicTemplateInterpolations } from '../types';
+import type { ReactNode } from 'react';
+import type { CssFunction, BasicTemplateInterpolations } from '../types';
 export declare type Interpolations = (BasicTemplateInterpolations | CssFunction | CssFunction[])[];
 export interface ClassNamesProps {
     children: (opts: {

package/dist/cjs/class-names/index.js.flow

@@ -0,0 +1,45 @@
+/**
+ * Flowtype definitions for index
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.15.0
+ * @flow
+ */
+import type { Node } from 'react';
+import type { CssFunction, BasicTemplateInterpolations } from '../types';
+export type Interpolations = (BasicTemplateInterpolations | CssFunction<> | CssFunction<>[])[];
+export interface ClassNamesProps {
+  children: (opts: {
+    css: (css: CssFunction<> | CssFunction<>[], ...interpolations: Interpolations) => string,
+    style: {
+      [key: string]: string,
+      ...
+    },
+    ...
+  }) => Node;
+}
+/**
+ * Use a component where styles are not necessarily tied to an element.
+ *
+ * ```
+ * // Object CSS
+ * <ClassNames>
+ *   {({ css, style }) => children({ className: css({ fontSize: 12 }) })}
+ * </ClassNames>
+ *
+ * // Template literal CSS
+ * <ClassNames>
+ *   {({ css, style }) => children({ className: css`font-size: 12px;` })}
+ * </ClassNames>
+ *
+ * // Array CSS
+ * <ClassNames>
+ *   {({ css, style }) =>
+ *    children({ className: css([{ fontSize: 12 }, `font-size: 12px`]) })}
+ * </ClassNames>
+ * ```
+ *
+ * For more help, read the docs:
+ * https://compiledcssinjs.com/docs/api-class-names
+ * @param props
+ */
+declare export function ClassNames(_: ClassNamesProps): React$Node;

package/dist/cjs/css/index.d.ts

@@ -1,6 +1,6 @@
-import type { CSSProps } from '../types';
+import type { BasicTemplateInterpolations, CSSProps, FunctionInterpolation } from '../types';
 /**
- * Create styles that can be re-used between components.
+ * Create styles that can be re-used between components with a template literal.
  *
  * ```
  * css`color: red;`;
@@ -12,4 +12,17 @@ import type { CSSProps } from '../types';
  * @param css
  * @param values
  */
-export default function css(_css: TemplateStringsArray, ..._values: (string | number)[]): CSSProps;
+export default function css<T = void>(_css: TemplateStringsArray, ..._values: (BasicTemplateInterpolations | FunctionInterpolation<T>)[]): CSSProps;
+/**
+ * Create styles that can be re-used between components with an object
+ *
+ * ```
+ * css({ color: 'red' });
+ * ```
+ *
+ * For more help, read the docs:
+ * https://compiledcssinjs.com/docs/api-css
+ *
+ * @param css
+ */
+export default function css(_css: CSSProps): CSSProps;

package/dist/cjs/css/index.js

@@ -1,19 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var error_1 = require("../utils/error");
-/**
- * Create styles that can be re-used between components.
- *
- * ```
- * css`color: red;`;
- * ```
- *
- * For more help, read the docs:
- * https://compiledcssinjs.com/docs/api-css
- *
- * @param css
- * @param values
- */
 function css(_css) {
     var _values = [];
     for (var _i = 1; _i < arguments.length; _i++) {

package/dist/cjs/css/index.js.flow

@@ -0,0 +1,35 @@
+/**
+ * Flowtype definitions for index
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.15.0
+ * @flow
+ */
+import type { BasicTemplateInterpolations, CSSProps, FunctionInterpolation } from '../types';
+/**
+ * Create styles that can be re-used between components with a template literal.
+ *
+ * ```
+ * css`color: red;`;
+ * ```
+ *
+ * For more help, read the docs:
+ * https://compiledcssinjs.com/docs/api-css
+ * @param css
+ * @param values
+ */
+declare export default function css<T>(
+  _css: $ReadOnlyArray<string>,
+  ..._values: (BasicTemplateInterpolations | FunctionInterpolation<T>)[]
+): CSSProps;
+/**
+ * Create styles that can be re-used between components with an object
+ *
+ * ```
+ * css({ color: 'red' });
+ * ```
+ *
+ * For more help, read the docs:
+ * https://compiledcssinjs.com/docs/api-css
+ * @param css
+ */
+declare export default function css(_css: CSSProps): CSSProps;

package/dist/cjs/css/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/css/index.tsx"],"names":[],"mappings":";;AAAA,wCAAkD;AAGlD;;;;;;;;;;;;GAYG;AACH,SAAwB,GAAG,CAAC,IAA0B;IAAE,iBAA4B;SAA5B,UAA4B,EAA5B,qBAA4B,EAA5B,IAA4B;QAA5B,gCAA4B;;IAClF,MAAM,wBAAgB,EAAE,CAAC;AAC3B,CAAC;AAFD,sBAEC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/css/index.tsx"],"names":[],"mappings":";;AAAA,wCAAkD;AAmClD,SAAwB,GAAG,CACzB,IAAqC;IACrC,iBAAsE;SAAtE,UAAsE,EAAtE,qBAAsE,EAAtE,IAAsE;QAAtE,gCAAsE;;IAEtE,MAAM,wBAAgB,EAAE,CAAC;AAC3B,CAAC;AALD,sBAKC"}

package/dist/cjs/index.d.ts

@@ -1,7 +1,10 @@
+import type { CssFunction, CSSProps } from './types';
+export { keyframes } from './keyframes';
 export { styled } from './styled';
 export { ClassNames } from './class-names';
 export { default as css } from './css';
-import { CssFunction } from './types';
+export type { CssFunction, CSSProps };
+export type { CssObject } from './styled';
 declare module 'react' {
     interface DOMAttributes<T> {
         css?: CssFunction | CssFunction[];

package/dist/cjs/index.js

@@ -3,7 +3,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.css = exports.ClassNames = exports.styled = void 0;
+exports.css = exports.ClassNames = exports.styled = exports.keyframes = void 0;
+var keyframes_1 = require("./keyframes");
+Object.defineProperty(exports, "keyframes", { enumerable: true, get: function () { return keyframes_1.keyframes; } });
 var styled_1 = require("./styled");
 Object.defineProperty(exports, "styled", { enumerable: true, get: function () { return styled_1.styled; } });
 var class_names_1 = require("./class-names");

package/dist/cjs/index.js.flow

@@ -0,0 +1,40 @@
+/**
+ * Flowtype definitions for index
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.15.0
+ * @flow
+ */
+import type { CssFunction, CSSProps } from './types';
+declare export { keyframes } from './keyframes';
+declare export { styled } from './styled';
+declare export { ClassNames } from './class-names';
+declare export { default as css } from './css';
+export type { CssFunction, CSSProps };
+export type { CssObject } from './styled';
+declare module 'react' {
+  declare interface DOMAttributes<T> {
+    css?: CssFunction<> | CssFunction<>[];
+  }
+}
+declare module 'global' {
+  declare var JSX: typeof npm$namespace$JSX;
+  declare var npm$namespace$JSX: {|
+    IntrinsicAttributes: Class<JSX$IntrinsicAttributes>,
+  |};
+  declare interface JSX$IntrinsicAttributes {
+    /**
+     * Tie styles to an element.
+     * It is available when the `@compiled/react` module is in scope.
+     *
+     * ```
+     * css={{ fontSize: 12 }} // Object CSS
+     * css={`font-size: 12px;`} // Template literal CSS
+     * css={[{ fontSize: 12 }, `font-size: 12px;`]} // Array CSS
+     * ```
+     *
+     * For more help, read the docs:
+     * https://compiledcssinjs.com/docs/api-css-prop
+     */
+    css?: CssFunction<> | CssFunction<>[];
+  }
+}

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":";;;;;;AAAA,mCAAkC;AAAzB,gGAAA,MAAM,OAAA;AACf,6CAA2C;AAAlC,yGAAA,UAAU,OAAA;AACnB,6BAAuC;AAA9B,2GAAA,OAAO,OAAO"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":";;;;;;AAEA,yCAAwC;AAA/B,sGAAA,SAAS,OAAA;AAClB,mCAAkC;AAAzB,gGAAA,MAAM,OAAA;AACf,6CAA2C;AAAlC,yGAAA,UAAU,OAAA;AACnB,6BAAuC;AAA9B,2GAAA,OAAO,OAAO"}

package/dist/cjs/keyframes/__fixtures__/index.d.ts

@@ -0,0 +1,3 @@
+export declare const fadeOut: string;
+export declare const namedFadeOut: string;
+export default fadeOut;

package/dist/cjs/keyframes/__fixtures__/index.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.namedFadeOut = exports.fadeOut = void 0;
+var react_1 = require("@compiled/react");
+exports.fadeOut = react_1.keyframes({
+    from: {
+        opacity: 1,
+    },
+    to: {
+        opacity: 0,
+    },
+});
+exports.namedFadeOut = exports.fadeOut;
+exports.default = exports.fadeOut;
+//# sourceMappingURL=index.js.map

package/dist/cjs/keyframes/__fixtures__/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/keyframes/__fixtures__/index.tsx"],"names":[],"mappings":";;;AAAA,yCAA4C;AAE/B,QAAA,OAAO,GAAG,iBAAS,CAAC;IAC/B,IAAI,EAAE;QACJ,OAAO,EAAE,CAAC;KACX;IACD,EAAE,EAAE;QACF,OAAO,EAAE,CAAC;KACX;CACF,CAAC,CAAC;AAEU,QAAA,YAAY,GAAG,eAAO,CAAC;AAEpC,kBAAe,eAAO,CAAC"}

package/dist/cjs/keyframes/index.d.ts

@@ -0,0 +1,47 @@
+import type { BasicTemplateInterpolations, CSSProps } from '../types';
+export declare type KeyframeSteps = string | Record<string, CSSProps>;
+/**
+ * Create keyframes using a tagged template expression:
+ *
+ * ```
+ * const fadeOut = keyframes`
+ *   from { opacity: 1; }
+ *   to   { opacity: 0; }
+ * `;
+ * ```
+ *
+ * @param _strings The input string values
+ * @param _interpolations The arguments used in the expression
+ */
+export declare function keyframes(_strings: TemplateStringsArray, ..._interpolations: BasicTemplateInterpolations[]): string;
+/**
+ * Create keyframes using:
+ *
+ * 1. An object expression
+ *
+ * ```
+ * const fadeOut = keyframes({
+ *   from: {
+ *     opacity: 1,
+ *   },
+ *   to: {
+ *     opacity: 0,
+ *   },
+ * });
+ * ```
+ *
+ * 2. A string
+ *
+ * ```
+ * const fadeOut = keyframes('from { opacity: 1; } to { opacity: 0; }');
+ * ```
+ *
+ * 3. A template literal
+ *
+ * ```
+ * const fadeOut = keyframes(`from { opacity: 1; } to { opacity: 0; }`);
+ * ```
+ *
+ * @param _steps The waypoints along the animation sequence
+ */
+export declare function keyframes(_steps: KeyframeSteps): string;

package/dist/cjs/keyframes/index.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.keyframes = void 0;
+var error_1 = require("../utils/error");
+function keyframes(_stringsOrSteps) {
+    var _interpolations = [];
+    for (var _i = 1; _i < arguments.length; _i++) {
+        _interpolations[_i - 1] = arguments[_i];
+    }
+    throw error_1.createSetupError();
+}
+exports.keyframes = keyframes;
+//# sourceMappingURL=index.js.map

package/dist/cjs/keyframes/index.js.flow

@@ -0,0 +1,54 @@
+/**
+ * Flowtype definitions for index
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.15.0
+ * @flow
+ */
+import type { BasicTemplateInterpolations, CSSProps } from '../types';
+export type KeyframeSteps = string | { [key: string]: CSSProps, ... };
+/**
+ * Create keyframes using a tagged template expression:
+ *
+ * ```
+ * const fadeOut = keyframes`
+ *   from { opacity: 1; }
+ *   to   { opacity: 0; }
+ * `;
+ * ```
+ * @param _strings The input string values
+ * @param _interpolations The arguments used in the expression
+ */
+declare export function keyframes(
+  _strings: $ReadOnlyArray<string>,
+  ..._interpolations: BasicTemplateInterpolations[]
+): string;
+/**
+ * Create keyframes using:
+ *
+ * 1. An object expression
+ *
+ * ```
+ * const fadeOut = keyframes({
+ *   from: {
+ *     opacity: 1,
+ *   },
+ *   to: {
+ *     opacity: 0,
+ *   },
+ * });
+ * ```
+ *
+ * 2. A string
+ *
+ * ```
+ * const fadeOut = keyframes('from { opacity: 1; } to { opacity: 0; }');
+ * ```
+ *
+ * 3. A template literal
+ *
+ * ```
+ * const fadeOut = keyframes(`from { opacity: 1; } to { opacity: 0; }`);
+ * ```
+ * @param _steps The waypoints along the animation sequence
+ */
+declare export function keyframes(_steps: KeyframeSteps): string;

package/dist/cjs/keyframes/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/keyframes/index.tsx"],"names":[],"mappings":";;;AACA,wCAAkD;AAsDlD,SAAgB,SAAS,CACvB,eAAqD;IACrD,yBAAiD;SAAjD,UAAiD,EAAjD,qBAAiD,EAAjD,IAAiD;QAAjD,wCAAiD;;IAEjD,MAAM,wBAAgB,EAAE,CAAC;AAC3B,CAAC;AALD,8BAKC"}

package/dist/cjs/runtime/ax.js.flow

@@ -0,0 +1,27 @@
+/**
+ * Flowtype definitions for ax
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.15.0
+ * @flow
+ */
+/**
+ * Joins classes together and ensures atomic declarations of a single group exist.
+ * Atomic declarations take the form of `_{group}{value}` (always prefixed with an underscore),
+ * where both `group` and `value` are hashes **four characters long**.
+ * Class names can be of any length,
+ * this function can take both atomic declarations and class names.
+ *
+ * Input:
+ *
+ * ```
+ * ax(['_aaaabbbb', '_aaaacccc'])
+ * ```
+ *
+ * Output:
+ *
+ * ```
+ * '_aaaacccc'
+ * ```
+ * @param classes
+ */
+declare export default function ax(classNames: (string | void | false)[]): string | void;

package/dist/cjs/runtime/css-custom-property.js.flow

@@ -0,0 +1,19 @@
+/**
+ * Flowtype definitions for css-custom-property
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.15.0
+ * @flow
+ */
+/**
+ * Returns a CSS custom property value with an optional suffix & prefix.
+ * Prefix will only be added if there is a suffix.
+ * If the value is undefined a fallback value will be returned to prevent children inheriting parent values.
+ * @param value
+ * @param suffix
+ * @param prefix
+ */
+declare export default function cssCustomPropertyValue(
+  value: string | number | number | null,
+  suffix?: string | void | null,
+  prefix?: string | void | null
+): string | number;

package/dist/cjs/runtime/dev-warnings.d.ts

@@ -1,2 +1 @@
-export declare const warn: (str: string, ...args: any[]) => void;
 export declare const analyzeCssInDev: (sheet: string) => void;

package/dist/cjs/runtime/dev-warnings.js

@@ -5,7 +5,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from) {
     return to;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.analyzeCssInDev = exports.warn = void 0;
+exports.analyzeCssInDev = void 0;
 var selectorsToWarn = [':first-child', ':nth-child'];
 var hasWarned = {};
 var warn = function (str) {
@@ -15,14 +15,13 @@ var warn = function (str) {
     }
     return console.error.apply(console, __spreadArray(["\n \u2588\u2588\u2588\u2588\u2588\u2588\u2557 \u2588\u2588\u2588\u2588\u2588\u2588\u2557 \u2588\u2588\u2588\u2557   \u2588\u2588\u2588\u2557\u2588\u2588\u2588\u2588\u2588\u2588\u2557 \u2588\u2588\u2557\u2588\u2588\u2557     \u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2557\u2588\u2588\u2588\u2588\u2588\u2588\u2557\n\u2588\u2588\u2554\u2550\u2550\u2550\u2550\u255D\u2588\u2588\u2554\u2550\u2550\u2550\u2588\u2588\u2557\u2588\u2588\u2588\u2588\u2557 \u2588\u2588\u2588\u2588\u2551\u2588\u2588\u2554\u2550\u2550\u2588\u2588\u2557\u2588\u2588\u2551\u2588\u2588\u2551     \u2588\u2588\u2554\u2550\u2550\u2550\u2550\u255D\u2588\u2588\u2554\u2550\u2550\u2588\u2588\u2557\n\u2588\u2588\u2551     \u2588\u2588\u2551   \u2588\u2588\u2551\u2588\u2588\u2554\u2588\u2588\u2588\u2588\u2554\u2588\u2588\u2551\u2588\u2588\u2588\u2588\u2588\u2588\u2554\u255D\u2588\u2588\u2551\u2588\u2588\u2551     \u2588\u2588\u2588\u2588\u2588\u2557  \u2588\u2588\u2551  \u2588\u2588\u2551\n\u2588\u2588\u2551     \u2588\u2588\u2551   \u2588\u2588\u2551\u2588\u2588\u2551\u255A\u2588\u2588\u2554\u255D\u2588\u2588\u2551\u2588\u2588\u2554\u2550\u2550\u2550\u255D \u2588\u2588\u2551\u2588\u2588\u2551     \u2588\u2588\u2554\u2550\u2550\u255D  \u2588\u2588\u2551  \u2588\u2588\u2551\n\u255A\u2588\u2588\u2588\u2588\u2588\u2588\u2557\u255A\u2588\u2588\u2588\u2588\u2588\u2588\u2554\u255D\u2588\u2588\u2551 \u255A\u2550\u255D \u2588\u2588\u2551\u2588\u2588\u2551     \u2588\u2588\u2551\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2557\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2557\u2588\u2588\u2588\u2588\u2588\u2588\u2554\u255D\n \u255A\u2550\u2550\u2550\u2550\u2550\u255D \u255A\u2550\u2550\u2550\u2550\u2550\u255D \u255A\u2550\u255D     \u255A\u2550\u255D\u255A\u2550\u255D     \u255A\u2550\u255D\u255A\u2550\u2550\u2550\u2550\u2550\u2550\u255D\u255A\u2550\u2550\u2550\u2550\u2550\u2550\u255D\u255A\u2550\u2550\u2550\u2550\u2550\u255D\n\n  @compiled/react/runtime - DEV WARNING\n\n  " + str + "\n"], args));
 };
-exports.warn = warn;
 var analyzeCssInDev = function (sheet) {
     if (hasWarned[sheet]) {
         return;
     }
     var shouldWarnAboutSelectors = selectorsToWarn.map(function (selector) { return sheet.includes(selector); }).filter(Boolean).length > 0;
     if (shouldWarnAboutSelectors) {
-        exports.warn("Selectors \"" + selectorsToWarn.join(', ') + "\" are dangerous to use when server side rendering.\n  Alternatively try and use \":nth-of-type\", or placing data attributes and targetting those instead.\n  Read https://compiledcssinjs.com/docs/server-side-rendering for more advice.");
+        warn("Selectors \"" + selectorsToWarn.join(', ') + "\" are dangerous to use when server side rendering.\n  Alternatively try and use \":nth-of-type\", or placing data attributes and targetting those instead.\n  Read https://compiledcssinjs.com/docs/server-side-rendering for more advice.");
     }
     hasWarned[sheet] = true;
 };

package/dist/cjs/runtime/dev-warnings.js.flow

@@ -0,0 +1,7 @@
+/**
+ * Flowtype definitions for dev-warnings
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.15.0
+ * @flow
+ */
+declare export var analyzeCssInDev: (sheet: string) => void;

package/dist/cjs/runtime/dev-warnings.js.map

@@ -1 +1 @@
-{"version":3,"file":"dev-warnings.js","sourceRoot":"","sources":["../../../src/runtime/dev-warnings.tsx"],"names":[],"mappings":";;;;;;;;AAAA,IAAM,eAAe,GAAG,CAAC,cAAc,EAAE,YAAY,CAAC,CAAC;AACvD,IAAM,SAAS,GAAyB,EAAE,CAAC;AAEpC,IAAM,IAAI,GAAG,UAAC,GAAW;IAAE,cAAc;SAAd,UAAc,EAAd,qBAAc,EAAd,IAAc;QAAd,6BAAc;;IAC9C,OAAA,OAAO,CAAC,KAAK,OAAb,OAAO,iBACL,q6DAUA,GAAG,OACN,GACM,IAAI;AAbT,CAcC,CAAC;AAfS,QAAA,IAAI,QAeb;AAEG,IAAM,eAAe,GAAG,UAAC,KAAa;IAC3C,IAAI,SAAS,CAAC,KAAK,CAAC,EAAE;QACpB,OAAO;KACR;IAED,IAAM,wBAAwB,GAC5B,eAAe,CAAC,GAAG,CAAC,UAAC,QAAQ,IAAK,OAAA,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAxB,CAAwB,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IAEzF,IAAI,wBAAwB,EAAE;QAC5B,YAAI,CACF,iBAAc,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,gPAEiC,CAC1E,CAAC;KACH;IAED,SAAS,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC;AAC1B,CAAC,CAAC;AAjBW,QAAA,eAAe,mBAiB1B"}
+{"version":3,"file":"dev-warnings.js","sourceRoot":"","sources":["../../../src/runtime/dev-warnings.tsx"],"names":[],"mappings":";;;;;;;;AAAA,IAAM,eAAe,GAAG,CAAC,cAAc,EAAE,YAAY,CAAC,CAAC;AACvD,IAAM,SAAS,GAAyB,EAAE,CAAC;AAE3C,IAAM,IAAI,GAAG,UAAC,GAAW;IAAE,cAAc;SAAd,UAAc,EAAd,qBAAc,EAAd,IAAc;QAAd,6BAAc;;IACvC,OAAA,OAAO,CAAC,KAAK,OAAb,OAAO,iBACL,q6DAUA,GAAG,OACN,GACM,IAAI;AAbT,CAcC,CAAC;AAEG,IAAM,eAAe,GAAG,UAAC,KAAa;IAC3C,IAAI,SAAS,CAAC,KAAK,CAAC,EAAE;QACpB,OAAO;KACR;IAED,IAAM,wBAAwB,GAC5B,eAAe,CAAC,GAAG,CAAC,UAAC,QAAQ,IAAK,OAAA,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAxB,CAAwB,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IAEzF,IAAI,wBAAwB,EAAE;QAC5B,IAAI,CACF,iBAAc,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,gPAEiC,CAC1E,CAAC;KACH;IAED,SAAS,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC;AAC1B,CAAC,CAAC;AAjBW,QAAA,eAAe,mBAiB1B"}

package/dist/cjs/runtime/index.js.flow

@@ -0,0 +1,10 @@
+/**
+ * Flowtype definitions for index
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.15.0
+ * @flow
+ */
+declare export { default as CS } from './style';
+declare export { default as CC } from './style-cache';
+declare export { default as ax } from './ax';
+declare export { default as ix } from './css-custom-property';