@compiled/react 0.7.0 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +68 -1
- package/dist/browser/class-names/index.d.ts +2 -2
- package/dist/browser/class-names/index.js.flow +45 -0
- package/dist/browser/class-names/index.js.map +1 -1
- package/dist/browser/css/index.d.ts +16 -3
- package/dist/browser/css/index.js +1 -13
- package/dist/browser/css/index.js.flow +35 -0
- package/dist/browser/css/index.js.map +1 -1
- package/dist/browser/index.d.ts +15 -23
- package/dist/browser/index.js +4 -0
- package/dist/browser/index.js.flow +15 -0
- package/dist/browser/index.js.map +1 -1
- package/dist/browser/jsx/jsx-dev-runtime.d.ts +2 -0
- package/dist/browser/jsx/jsx-dev-runtime.js +4 -0
- package/dist/browser/jsx/jsx-dev-runtime.js.map +1 -0
- package/dist/browser/jsx/jsx-local-namespace.d.ts +40 -0
- package/dist/browser/jsx/jsx-local-namespace.js +2 -0
- package/dist/browser/jsx/jsx-local-namespace.js.map +1 -0
- package/dist/browser/jsx/jsx-runtime.d.ts +2 -0
- package/dist/browser/jsx/jsx-runtime.js +4 -0
- package/dist/browser/jsx/jsx-runtime.js.map +1 -0
- package/dist/browser/keyframes/index.js.flow +54 -0
- package/dist/browser/runtime/ax.js.flow +27 -0
- package/dist/browser/runtime/css-custom-property.d.ts +1 -1
- package/dist/browser/runtime/css-custom-property.js.flow +19 -0
- package/dist/browser/runtime/css-custom-property.js.map +1 -1
- package/dist/browser/runtime/dev-warnings.d.ts +0 -1
- package/dist/browser/runtime/dev-warnings.js +1 -1
- package/dist/browser/runtime/dev-warnings.js.flow +7 -0
- package/dist/browser/runtime/dev-warnings.js.map +1 -1
- package/dist/browser/runtime/index.js.flow +10 -0
- package/dist/browser/runtime/is-node.js.flow +19 -0
- package/dist/browser/runtime/sheet.d.ts +1 -1
- package/dist/browser/runtime/sheet.js.flow +36 -0
- package/dist/browser/runtime/style-cache.d.ts +1 -1
- package/dist/browser/runtime/style-cache.js.flow +19 -0
- package/dist/browser/runtime/style-cache.js.map +1 -1
- package/dist/browser/runtime/style.d.ts +1 -1
- package/dist/browser/runtime/style.js +2 -2
- package/dist/browser/runtime/style.js.flow +17 -0
- package/dist/browser/runtime/style.js.map +1 -1
- package/dist/browser/runtime/types.js.flow +23 -0
- package/dist/browser/runtime.js.flow +7 -0
- package/dist/browser/styled/index.d.ts +6 -9
- package/dist/browser/styled/index.js.flow +69 -0
- package/dist/browser/styled/index.js.map +1 -1
- package/dist/browser/types.d.ts +6 -3
- package/dist/browser/types.js.flow +29 -0
- package/dist/browser/utils/error.js.flow +7 -0
- package/dist/cjs/class-names/index.d.ts +2 -2
- package/dist/cjs/class-names/index.js.flow +45 -0
- package/dist/cjs/class-names/index.js.map +1 -1
- package/dist/cjs/css/index.d.ts +16 -3
- package/dist/cjs/css/index.js +1 -13
- package/dist/cjs/css/index.js.flow +35 -0
- package/dist/cjs/css/index.js.map +1 -1
- package/dist/cjs/index.d.ts +15 -23
- package/dist/cjs/index.js +5 -1
- package/dist/cjs/index.js.flow +15 -0
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/jsx/jsx-dev-runtime.d.ts +2 -0
- package/dist/cjs/jsx/jsx-dev-runtime.js +16 -0
- package/dist/cjs/jsx/jsx-dev-runtime.js.map +1 -0
- package/dist/cjs/jsx/jsx-local-namespace.d.ts +40 -0
- package/dist/cjs/jsx/jsx-local-namespace.js +3 -0
- package/dist/cjs/jsx/jsx-local-namespace.js.map +1 -0
- package/dist/cjs/jsx/jsx-runtime.d.ts +2 -0
- package/dist/cjs/jsx/jsx-runtime.js +16 -0
- package/dist/cjs/jsx/jsx-runtime.js.map +1 -0
- package/dist/cjs/keyframes/index.js.flow +54 -0
- package/dist/cjs/runtime/ax.js.flow +27 -0
- package/dist/cjs/runtime/css-custom-property.d.ts +1 -1
- package/dist/cjs/runtime/css-custom-property.js.flow +19 -0
- package/dist/cjs/runtime/css-custom-property.js.map +1 -1
- package/dist/cjs/runtime/dev-warnings.d.ts +0 -1
- package/dist/cjs/runtime/dev-warnings.js +2 -3
- package/dist/cjs/runtime/dev-warnings.js.flow +7 -0
- package/dist/cjs/runtime/dev-warnings.js.map +1 -1
- package/dist/cjs/runtime/index.js.flow +10 -0
- package/dist/cjs/runtime/is-node.js.flow +19 -0
- package/dist/cjs/runtime/sheet.d.ts +1 -1
- package/dist/cjs/runtime/sheet.js.flow +36 -0
- package/dist/cjs/runtime/style-cache.d.ts +1 -1
- package/dist/cjs/runtime/style-cache.js.flow +19 -0
- package/dist/cjs/runtime/style-cache.js.map +1 -1
- package/dist/cjs/runtime/style.d.ts +1 -1
- package/dist/cjs/runtime/style.js +2 -2
- package/dist/cjs/runtime/style.js.flow +17 -0
- package/dist/cjs/runtime/style.js.map +1 -1
- package/dist/cjs/runtime/types.js.flow +23 -0
- package/dist/cjs/runtime.js.flow +7 -0
- package/dist/cjs/styled/index.d.ts +6 -9
- package/dist/cjs/styled/index.js.flow +69 -0
- package/dist/cjs/styled/index.js.map +1 -1
- package/dist/cjs/types.d.ts +6 -3
- package/dist/cjs/types.js.flow +29 -0
- package/dist/cjs/utils/error.js.flow +7 -0
- package/dist/esm/class-names/index.d.ts +2 -2
- package/dist/esm/class-names/index.js.flow +45 -0
- package/dist/esm/class-names/index.js.map +1 -1
- package/dist/esm/css/index.d.ts +16 -3
- package/dist/esm/css/index.js +1 -13
- package/dist/esm/css/index.js.flow +35 -0
- package/dist/esm/css/index.js.map +1 -1
- package/dist/esm/index.d.ts +15 -23
- package/dist/esm/index.js +4 -0
- package/dist/esm/index.js.flow +15 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/jsx/jsx-dev-runtime.d.ts +2 -0
- package/dist/esm/jsx/jsx-dev-runtime.js +4 -0
- package/dist/esm/jsx/jsx-dev-runtime.js.map +1 -0
- package/dist/esm/jsx/jsx-local-namespace.d.ts +40 -0
- package/dist/esm/jsx/jsx-local-namespace.js +2 -0
- package/dist/esm/jsx/jsx-local-namespace.js.map +1 -0
- package/dist/esm/jsx/jsx-runtime.d.ts +2 -0
- package/dist/esm/jsx/jsx-runtime.js +4 -0
- package/dist/esm/jsx/jsx-runtime.js.map +1 -0
- package/dist/esm/keyframes/index.js.flow +54 -0
- package/dist/esm/runtime/ax.js.flow +27 -0
- package/dist/esm/runtime/css-custom-property.d.ts +1 -1
- package/dist/esm/runtime/css-custom-property.js.flow +19 -0
- package/dist/esm/runtime/css-custom-property.js.map +1 -1
- package/dist/esm/runtime/dev-warnings.d.ts +0 -1
- package/dist/esm/runtime/dev-warnings.js +1 -1
- package/dist/esm/runtime/dev-warnings.js.flow +7 -0
- package/dist/esm/runtime/dev-warnings.js.map +1 -1
- package/dist/esm/runtime/index.js.flow +10 -0
- package/dist/esm/runtime/is-node.js.flow +19 -0
- package/dist/esm/runtime/sheet.d.ts +1 -1
- package/dist/esm/runtime/sheet.js.flow +36 -0
- package/dist/esm/runtime/style-cache.d.ts +1 -1
- package/dist/esm/runtime/style-cache.js.flow +19 -0
- package/dist/esm/runtime/style-cache.js.map +1 -1
- package/dist/esm/runtime/style.d.ts +1 -1
- package/dist/esm/runtime/style.js +2 -2
- package/dist/esm/runtime/style.js.flow +17 -0
- package/dist/esm/runtime/style.js.map +1 -1
- package/dist/esm/runtime/types.js.flow +23 -0
- package/dist/esm/runtime.js.flow +7 -0
- package/dist/esm/styled/index.d.ts +6 -9
- package/dist/esm/styled/index.js.flow +69 -0
- package/dist/esm/styled/index.js.map +1 -1
- package/dist/esm/types.d.ts +6 -3
- package/dist/esm/types.js.flow +29 -0
- package/dist/esm/utils/error.js.flow +7 -0
- package/jsx-dev-runtime/package.json +6 -0
- package/jsx-runtime/package.json +6 -0
- package/package.json +41 -15
- package/src/__tests__/browser.test.tsx +5 -5
- package/src/__tests__/jest-matcher.test.tsx +197 -0
- package/src/__tests__/server-side-hydrate.test.tsx +1 -0
- package/src/__tests__/ssr.test.tsx +2 -2
- package/src/class-names/__tests__/index.test.tsx +1 -1
- package/src/class-names/__tests__/types.test.js.flow +28 -0
- package/src/class-names/index.js.flow +45 -0
- package/src/class-names/index.tsx +3 -2
- package/src/css/__tests__/index.test.tsx +40 -0
- package/src/css/__tests__/types.test.js.flow +17 -0
- package/src/css/index.js.flow +35 -0
- package/src/css/index.tsx +27 -3
- package/src/index.js.flow +15 -0
- package/src/index.tsx +20 -26
- package/src/jsx/__tests__/index.test.tsx +1 -2
- package/src/jsx/__tests__/jsx-import-source-pragma.test.tsx +37 -0
- package/src/jsx/__tests__/jsx-pragma.test.tsx +39 -0
- package/src/jsx/jsx-dev-runtime.tsx +5 -0
- package/src/jsx/jsx-local-namespace.tsx +49 -0
- package/src/jsx/jsx-runtime.tsx +5 -0
- package/src/keyframes/__tests__/index.test.tsx +2 -1
- package/src/keyframes/__tests__/types.test.js.flow +31 -0
- package/src/keyframes/index.js.flow +54 -0
- package/src/runtime/__perf__/ax.test.ts +42 -0
- package/src/runtime/__perf__/cs.test.tsx +111 -0
- package/src/runtime/__perf__/sheet.test.ts +61 -0
- package/src/runtime/__perf__/utils/cs.tsx +60 -0
- package/src/runtime/__perf__/utils/sheet.tsx +151 -0
- package/src/runtime/__tests__/style-ssr.test.tsx +1 -0
- package/src/runtime/__tests__/style.test.tsx +92 -58
- package/src/runtime/ax.js.flow +27 -0
- package/src/runtime/css-custom-property.js.flow +19 -0
- package/src/runtime/css-custom-property.tsx +1 -1
- package/src/runtime/dev-warnings.js.flow +7 -0
- package/src/runtime/dev-warnings.tsx +1 -1
- package/src/runtime/index.js.flow +10 -0
- package/src/runtime/is-node.js.flow +19 -0
- package/src/runtime/sheet.js.flow +36 -0
- package/src/runtime/sheet.tsx +1 -1
- package/src/runtime/style-cache.js.flow +19 -0
- package/src/runtime/style-cache.tsx +2 -1
- package/src/runtime/style.js.flow +17 -0
- package/src/runtime/style.tsx +4 -3
- package/src/runtime/types.js.flow +23 -0
- package/src/runtime.js.flow +7 -0
- package/src/styled/__tests__/index.test.tsx +3 -3
- package/src/styled/__tests__/types.test.js.flow +30 -0
- package/src/styled/index.js.flow +69 -0
- package/src/styled/index.tsx +7 -10
- package/src/types.js.flow +29 -0
- package/src/types.tsx +7 -3
- package/src/utils/error.js.flow +7 -0
- package/dist/browser/codemods/codemods-helpers.d.ts +0 -60
- package/dist/browser/codemods/codemods-helpers.js +0 -201
- package/dist/browser/codemods/codemods-helpers.js.map +0 -1
- package/dist/browser/codemods/constants.d.ts +0 -3
- package/dist/browser/codemods/constants.js +0 -4
- package/dist/browser/codemods/constants.js.map +0 -1
- package/dist/browser/codemods/emotion-to-compiled/emotion-to-compiled.d.ts +0 -3
- package/dist/browser/codemods/emotion-to-compiled/emotion-to-compiled.js +0 -178
- package/dist/browser/codemods/emotion-to-compiled/emotion-to-compiled.js.map +0 -1
- package/dist/browser/codemods/emotion-to-compiled/index.d.ts +0 -1
- package/dist/browser/codemods/emotion-to-compiled/index.js +0 -2
- package/dist/browser/codemods/emotion-to-compiled/index.js.map +0 -1
- package/dist/browser/codemods/styled-components-to-compiled/index.d.ts +0 -1
- package/dist/browser/codemods/styled-components-to-compiled/index.js +0 -2
- package/dist/browser/codemods/styled-components-to-compiled/index.js.map +0 -1
- package/dist/browser/codemods/styled-components-to-compiled/styled-components-to-compiled.d.ts +0 -3
- package/dist/browser/codemods/styled-components-to-compiled/styled-components-to-compiled.js +0 -33
- package/dist/browser/codemods/styled-components-to-compiled/styled-components-to-compiled.js.map +0 -1
- package/dist/cjs/codemods/codemods-helpers.d.ts +0 -60
- package/dist/cjs/codemods/codemods-helpers.js +0 -217
- package/dist/cjs/codemods/codemods-helpers.js.map +0 -1
- package/dist/cjs/codemods/constants.d.ts +0 -3
- package/dist/cjs/codemods/constants.js +0 -7
- package/dist/cjs/codemods/constants.js.map +0 -1
- package/dist/cjs/codemods/emotion-to-compiled/emotion-to-compiled.d.ts +0 -3
- package/dist/cjs/codemods/emotion-to-compiled/emotion-to-compiled.js +0 -180
- package/dist/cjs/codemods/emotion-to-compiled/emotion-to-compiled.js.map +0 -1
- package/dist/cjs/codemods/emotion-to-compiled/index.d.ts +0 -1
- package/dist/cjs/codemods/emotion-to-compiled/index.js +0 -9
- package/dist/cjs/codemods/emotion-to-compiled/index.js.map +0 -1
- package/dist/cjs/codemods/styled-components-to-compiled/index.d.ts +0 -1
- package/dist/cjs/codemods/styled-components-to-compiled/index.js +0 -9
- package/dist/cjs/codemods/styled-components-to-compiled/index.js.map +0 -1
- package/dist/cjs/codemods/styled-components-to-compiled/styled-components-to-compiled.d.ts +0 -3
- package/dist/cjs/codemods/styled-components-to-compiled/styled-components-to-compiled.js +0 -35
- package/dist/cjs/codemods/styled-components-to-compiled/styled-components-to-compiled.js.map +0 -1
- package/dist/esm/codemods/codemods-helpers.d.ts +0 -60
- package/dist/esm/codemods/codemods-helpers.js +0 -201
- package/dist/esm/codemods/codemods-helpers.js.map +0 -1
- package/dist/esm/codemods/constants.d.ts +0 -3
- package/dist/esm/codemods/constants.js +0 -4
- package/dist/esm/codemods/constants.js.map +0 -1
- package/dist/esm/codemods/emotion-to-compiled/emotion-to-compiled.d.ts +0 -3
- package/dist/esm/codemods/emotion-to-compiled/emotion-to-compiled.js +0 -178
- package/dist/esm/codemods/emotion-to-compiled/emotion-to-compiled.js.map +0 -1
- package/dist/esm/codemods/emotion-to-compiled/index.d.ts +0 -1
- package/dist/esm/codemods/emotion-to-compiled/index.js +0 -2
- package/dist/esm/codemods/emotion-to-compiled/index.js.map +0 -1
- package/dist/esm/codemods/styled-components-to-compiled/index.d.ts +0 -1
- package/dist/esm/codemods/styled-components-to-compiled/index.js +0 -2
- package/dist/esm/codemods/styled-components-to-compiled/index.js.map +0 -1
- package/dist/esm/codemods/styled-components-to-compiled/styled-components-to-compiled.d.ts +0 -3
- package/dist/esm/codemods/styled-components-to-compiled/styled-components-to-compiled.js +0 -33
- package/dist/esm/codemods/styled-components-to-compiled/styled-components-to-compiled.js.map +0 -1
- package/src/codemods/README.md +0 -8
- package/src/codemods/codemods-helpers.tsx +0 -369
- package/src/codemods/constants.tsx +0 -3
- package/src/codemods/emotion-to-compiled/README.md +0 -71
- package/src/codemods/emotion-to-compiled/__tests__/emotion-to-compiled.test.tsx +0 -526
- package/src/codemods/emotion-to-compiled/emotion-to-compiled.tsx +0 -249
- package/src/codemods/emotion-to-compiled/index.tsx +0 -1
- package/src/codemods/styled-components-to-compiled/README.md +0 -37
- package/src/codemods/styled-components-to-compiled/__tests__/styled-components-to-compiled.test.tsx +0 -109
- package/src/codemods/styled-components-to-compiled/index.tsx +0 -1
- package/src/codemods/styled-components-to-compiled/styled-components-to-compiled.tsx +0 -45
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flowtype definitions for index
|
|
3
|
+
* Generated by Flowgen from a Typescript Definition
|
|
4
|
+
* Flowgen v1.15.0
|
|
5
|
+
* @flow
|
|
6
|
+
*/
|
|
7
|
+
import type { BasicTemplateInterpolations, CSSProps } from '../types';
|
|
8
|
+
export type KeyframeSteps = string | { [key: string]: CSSProps, ... };
|
|
9
|
+
/**
|
|
10
|
+
* Create keyframes using a tagged template expression:
|
|
11
|
+
*
|
|
12
|
+
* ```
|
|
13
|
+
* const fadeOut = keyframes`
|
|
14
|
+
* from { opacity: 1; }
|
|
15
|
+
* to { opacity: 0; }
|
|
16
|
+
* `;
|
|
17
|
+
* ```
|
|
18
|
+
* @param _strings The input string values
|
|
19
|
+
* @param _interpolations The arguments used in the expression
|
|
20
|
+
*/
|
|
21
|
+
declare export function keyframes(
|
|
22
|
+
_strings: $ReadOnlyArray<string>,
|
|
23
|
+
..._interpolations: BasicTemplateInterpolations[]
|
|
24
|
+
): string;
|
|
25
|
+
/**
|
|
26
|
+
* Create keyframes using:
|
|
27
|
+
*
|
|
28
|
+
* 1. An object expression
|
|
29
|
+
*
|
|
30
|
+
* ```
|
|
31
|
+
* const fadeOut = keyframes({
|
|
32
|
+
* from: {
|
|
33
|
+
* opacity: 1,
|
|
34
|
+
* },
|
|
35
|
+
* to: {
|
|
36
|
+
* opacity: 0,
|
|
37
|
+
* },
|
|
38
|
+
* });
|
|
39
|
+
* ```
|
|
40
|
+
*
|
|
41
|
+
* 2. A string
|
|
42
|
+
*
|
|
43
|
+
* ```
|
|
44
|
+
* const fadeOut = keyframes('from { opacity: 1; } to { opacity: 0; }');
|
|
45
|
+
* ```
|
|
46
|
+
*
|
|
47
|
+
* 3. A template literal
|
|
48
|
+
*
|
|
49
|
+
* ```
|
|
50
|
+
* const fadeOut = keyframes(`from { opacity: 1; } to { opacity: 0; }`);
|
|
51
|
+
* ```
|
|
52
|
+
* @param _steps The waypoints along the animation sequence
|
|
53
|
+
*/
|
|
54
|
+
declare export function keyframes(_steps: KeyframeSteps): string;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flowtype definitions for ax
|
|
3
|
+
* Generated by Flowgen from a Typescript Definition
|
|
4
|
+
* Flowgen v1.15.0
|
|
5
|
+
* @flow
|
|
6
|
+
*/
|
|
7
|
+
/**
|
|
8
|
+
* Joins classes together and ensures atomic declarations of a single group exist.
|
|
9
|
+
* Atomic declarations take the form of `_{group}{value}` (always prefixed with an underscore),
|
|
10
|
+
* where both `group` and `value` are hashes **four characters long**.
|
|
11
|
+
* Class names can be of any length,
|
|
12
|
+
* this function can take both atomic declarations and class names.
|
|
13
|
+
*
|
|
14
|
+
* Input:
|
|
15
|
+
*
|
|
16
|
+
* ```
|
|
17
|
+
* ax(['_aaaabbbb', '_aaaacccc'])
|
|
18
|
+
* ```
|
|
19
|
+
*
|
|
20
|
+
* Output:
|
|
21
|
+
*
|
|
22
|
+
* ```
|
|
23
|
+
* '_aaaacccc'
|
|
24
|
+
* ```
|
|
25
|
+
* @param classes
|
|
26
|
+
*/
|
|
27
|
+
declare export default function ax(classNames: (string | void | false)[]): string | void;
|
|
@@ -7,4 +7,4 @@
|
|
|
7
7
|
* @param suffix
|
|
8
8
|
* @param prefix
|
|
9
9
|
*/
|
|
10
|
-
export default function cssCustomPropertyValue(value: string | number |
|
|
10
|
+
export default function cssCustomPropertyValue(value: string | number | null | undefined, suffix?: string | undefined | null, prefix?: string | undefined | null): string | number;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flowtype definitions for css-custom-property
|
|
3
|
+
* Generated by Flowgen from a Typescript Definition
|
|
4
|
+
* Flowgen v1.15.0
|
|
5
|
+
* @flow
|
|
6
|
+
*/
|
|
7
|
+
/**
|
|
8
|
+
* Returns a CSS custom property value with an optional suffix & prefix.
|
|
9
|
+
* Prefix will only be added if there is a suffix.
|
|
10
|
+
* If the value is undefined a fallback value will be returned to prevent children inheriting parent values.
|
|
11
|
+
* @param value
|
|
12
|
+
* @param suffix
|
|
13
|
+
* @param prefix
|
|
14
|
+
*/
|
|
15
|
+
declare export default function cssCustomPropertyValue(
|
|
16
|
+
value: string | number | null | void,
|
|
17
|
+
suffix?: string | void | null,
|
|
18
|
+
prefix?: string | void | null
|
|
19
|
+
): string | number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"css-custom-property.js","sourceRoot":"","sources":["../../../src/runtime/css-custom-property.tsx"],"names":[],"mappings":";;AAAA;;;;;;;;GAQG;AACH,SAAwB,sBAAsB,CAC5C,
|
|
1
|
+
{"version":3,"file":"css-custom-property.js","sourceRoot":"","sources":["../../../src/runtime/css-custom-property.tsx"],"names":[],"mappings":";;AAAA;;;;;;;;GAQG;AACH,SAAwB,sBAAsB,CAC5C,KAAyC,EACzC,MAAkC,EAClC,MAAkC;IAElC,IAAI,KAAK,IAAI,SAAS,EAAE;QACtB,IAAI,MAAM,EAAE;YACV,IAAI,MAAM,EAAE;gBACV,OAAO,MAAM,GAAG,KAAK,GAAG,MAAM,CAAC;aAChC;YAED,OAAO,KAAK,GAAG,MAAM,CAAC;SACvB;QAED,OAAO,KAAK,CAAC;KACd;IAED,qFAAqF;IACrF,4EAA4E;IAC5E,kEAAkE;IAClE,OAAO,WAAW,CAAC;AACrB,CAAC;AArBD,yCAqBC"}
|
|
@@ -5,7 +5,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from) {
|
|
|
5
5
|
return to;
|
|
6
6
|
};
|
|
7
7
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
8
|
-
exports.analyzeCssInDev =
|
|
8
|
+
exports.analyzeCssInDev = void 0;
|
|
9
9
|
var selectorsToWarn = [':first-child', ':nth-child'];
|
|
10
10
|
var hasWarned = {};
|
|
11
11
|
var warn = function (str) {
|
|
@@ -15,14 +15,13 @@ var warn = function (str) {
|
|
|
15
15
|
}
|
|
16
16
|
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));
|
|
17
17
|
};
|
|
18
|
-
exports.warn = warn;
|
|
19
18
|
var analyzeCssInDev = function (sheet) {
|
|
20
19
|
if (hasWarned[sheet]) {
|
|
21
20
|
return;
|
|
22
21
|
}
|
|
23
22
|
var shouldWarnAboutSelectors = selectorsToWarn.map(function (selector) { return sheet.includes(selector); }).filter(Boolean).length > 0;
|
|
24
23
|
if (shouldWarnAboutSelectors) {
|
|
25
|
-
|
|
24
|
+
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.");
|
|
26
25
|
}
|
|
27
26
|
hasWarned[sheet] = true;
|
|
28
27
|
};
|
|
@@ -1 +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;
|
|
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;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"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flowtype definitions for index
|
|
3
|
+
* Generated by Flowgen from a Typescript Definition
|
|
4
|
+
* Flowgen v1.15.0
|
|
5
|
+
* @flow
|
|
6
|
+
*/
|
|
7
|
+
declare export { default as CS } from './style';
|
|
8
|
+
declare export { default as CC } from './style-cache';
|
|
9
|
+
declare export { default as ax } from './ax';
|
|
10
|
+
declare export { default as ix } from './css-custom-property';
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flowtype definitions for is-node
|
|
3
|
+
* Generated by Flowgen from a Typescript Definition
|
|
4
|
+
* Flowgen v1.15.0
|
|
5
|
+
* @flow
|
|
6
|
+
*/
|
|
7
|
+
/**
|
|
8
|
+
* Returns `true` when inside a node environment,
|
|
9
|
+
* else `false`.
|
|
10
|
+
*
|
|
11
|
+
* When using this it will remove any node code from the browser bundle - for example:
|
|
12
|
+
*
|
|
13
|
+
* ```js
|
|
14
|
+
* if (isNodeEnvironment()) {
|
|
15
|
+
* // This code will be removed from the browser bundle
|
|
16
|
+
* }
|
|
17
|
+
* ```
|
|
18
|
+
*/
|
|
19
|
+
declare export var isNodeEnvironment: () => boolean;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flowtype definitions for sheet
|
|
3
|
+
* Generated by Flowgen from a Typescript Definition
|
|
4
|
+
* Flowgen v1.15.0
|
|
5
|
+
* @flow
|
|
6
|
+
*/
|
|
7
|
+
import type { Bucket, StyleSheetOpts } from './types';
|
|
8
|
+
/**
|
|
9
|
+
* Ordered style buckets using their short psuedo name.
|
|
10
|
+
* If changes are needed make sure that it aligns with the definition in `sort-at-rule-pseudos.tsx`.
|
|
11
|
+
*/
|
|
12
|
+
declare export var styleBucketOrdering: Bucket[];
|
|
13
|
+
/**
|
|
14
|
+
* Gets the bucket depending on the sheet.
|
|
15
|
+
* This function makes assumptions as to the form of the input class name.
|
|
16
|
+
*
|
|
17
|
+
* Input:
|
|
18
|
+
*
|
|
19
|
+
* ```
|
|
20
|
+
* "._a1234567:hover{ color: red; }"
|
|
21
|
+
* ```
|
|
22
|
+
*
|
|
23
|
+
* Output:
|
|
24
|
+
*
|
|
25
|
+
* ```
|
|
26
|
+
* "h"
|
|
27
|
+
* ```
|
|
28
|
+
* @param sheet styles for which we are getting the bucket
|
|
29
|
+
*/
|
|
30
|
+
declare export var getStyleBucketName: (sheet: string) => Bucket;
|
|
31
|
+
/**
|
|
32
|
+
* Used to move styles to the head of the application during runtime.
|
|
33
|
+
* @param css string
|
|
34
|
+
* @param opts StyleSheetOpts
|
|
35
|
+
*/
|
|
36
|
+
declare export default function insertRule(css: string, opts: StyleSheetOpts): void;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flowtype definitions for style-cache
|
|
3
|
+
* Generated by Flowgen from a Typescript Definition
|
|
4
|
+
* Flowgen v1.15.0
|
|
5
|
+
* @flow
|
|
6
|
+
*/
|
|
7
|
+
import type { ProviderComponent, UseCacheHook } from './types';
|
|
8
|
+
/**
|
|
9
|
+
* Hook using the cache created on the server or client.
|
|
10
|
+
*/
|
|
11
|
+
declare export var useCache: UseCacheHook;
|
|
12
|
+
/**
|
|
13
|
+
* On the server this ensures the minimal amount of styles will be rendered
|
|
14
|
+
* safely using React Context.
|
|
15
|
+
*
|
|
16
|
+
* On the browser this turns into a fragment with no React Context.
|
|
17
|
+
*/
|
|
18
|
+
declare var StyleCacheProvider: ProviderComponent;
|
|
19
|
+
declare export default typeof StyleCacheProvider;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style-cache.js","sourceRoot":"","sources":["../../../src/runtime/style-cache.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,+BAAkD;
|
|
1
|
+
{"version":3,"file":"style-cache.js","sourceRoot":"","sources":["../../../src/runtime/style-cache.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,+BAAkD;AAElD,qCAA8C;AAG9C;;;GAGG;AACH,IAAM,KAAK,GAAQ,2BAAiB,EAAE,CAAC,CAAC,CAAC,qBAAa,CAA8B,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;AAE/F,IAAI,CAAC,2BAAiB,EAAE,EAAE;IACxB;;;;OAIG;IACH,IAAM,SAAS,GAAG,QAAQ,CAAC,gBAAgB,CAAmB,mBAAmB,CAAC,CAAC;IACnF,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QACzC,iGAAiG;QACjG,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;KACzC;CACF;AAED;;GAEG;AACI,IAAM,QAAQ,GAAiB;IACpC,IAAI,2BAAiB,EAAE,EAAE;QACvB,mFAAmF;QACnF,wGAAwG;QACxG,sDAAsD;QACtD,OAAO,kBAAU,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;KAChC;IAED,6CAA6C;IAC7C,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AAVW,QAAA,QAAQ,YAUnB;AAEF;;;;;GAKG;AACH,IAAM,kBAAkB,GAAsB,UAAC,KAAK;IAClD,IAAI,2BAAiB,EAAE,EAAE;QACvB,4EAA4E;QAC5E,sDAAsD;QACtD,IAAM,QAAQ,GAAG,gBAAQ,EAAE,CAAC;QAC5B,OAAO,oBAAC,KAAK,CAAC,QAAQ,IAAC,KAAK,EAAE,QAAQ,IAAG,KAAK,CAAC,QAAQ,CAAkB,CAAC;KAC3E;IAED,OAAO,KAAK,CAAC,QAAuB,CAAC;AACvC,CAAC,CAAC;AAEF,kBAAe,kBAAkB,CAAC"}
|
|
@@ -23,10 +23,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
23
23
|
};
|
|
24
24
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
25
25
|
var react_1 = __importDefault(require("react"));
|
|
26
|
-
var sheet_1 = __importStar(require("./sheet"));
|
|
27
26
|
var dev_warnings_1 = require("./dev-warnings");
|
|
28
|
-
var style_cache_1 = require("./style-cache");
|
|
29
27
|
var is_node_1 = require("./is-node");
|
|
28
|
+
var sheet_1 = __importStar(require("./sheet"));
|
|
29
|
+
var style_cache_1 = require("./style-cache");
|
|
30
30
|
function Style(props) {
|
|
31
31
|
var inserted = style_cache_1.useCache();
|
|
32
32
|
if (process.env.NODE_ENV === 'development') {
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flowtype definitions for style
|
|
3
|
+
* Generated by Flowgen from a Typescript Definition
|
|
4
|
+
* Flowgen v1.15.0
|
|
5
|
+
* @flow
|
|
6
|
+
*/
|
|
7
|
+
import type { StyleSheetOpts } from './types';
|
|
8
|
+
declare type StyleProps = {
|
|
9
|
+
/**
|
|
10
|
+
* CSS Rules.
|
|
11
|
+
* Ensure each rule is a separate element in the array.
|
|
12
|
+
*/
|
|
13
|
+
children: string[],
|
|
14
|
+
...
|
|
15
|
+
} & StyleSheetOpts;
|
|
16
|
+
declare export default function Style(props: StyleProps): React$Node | null;
|
|
17
|
+
declare export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../src/runtime/style.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;
|
|
1
|
+
{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../src/runtime/style.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAE1B,+CAAiD;AACjD,qCAA8C;AAC9C,+CAA8E;AAC9E,6CAAyC;AAWzC,SAAwB,KAAK,CAAC,KAAiB;IAC7C,IAAM,QAAQ,GAAG,sBAAQ,EAAE,CAAC;IAE5B,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,aAAa,EAAE;QAC1C,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,8BAAe,CAAC,CAAC;KACzC;IAED,IAAI,KAAK,CAAC,QAAQ,CAAC,MAAM,EAAE;QACzB,IAAI,2BAAiB,EAAE,EAAE;YACvB,IAAM,gBAAc,GAAoC,EAAE,CAAC;YAC3D,IAAI,SAAS,GAAG,KAAK,CAAC;YAEtB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBAC9C,IAAM,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;gBAChC,IAAI,QAAQ,CAAC,KAAK,CAAC,EAAE;oBACnB,SAAS;iBACV;qBAAM;oBACL,QAAQ,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC;oBACvB,SAAS,GAAG,IAAI,CAAC;iBAClB;gBAED,IAAM,UAAU,GAAG,0BAAkB,CAAC,KAAK,CAAC,CAAC;gBAC7C,gBAAc,CAAC,UAAU,CAAC,GAAG,CAAC,gBAAc,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC,GAAG,KAAK,CAAC;aACzE;YAED,IAAI,CAAC,SAAS,EAAE;gBACd,OAAO,IAAI,CAAC;aACb;YAED,OAAO,CACL,6DAEE,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,uBAAuB,EAAE;oBACvB,MAAM,EAAE,2BAAmB,CAAC,GAAG,CAAC,UAAC,MAAM,IAAK,OAAA,gBAAc,CAAC,MAAM,CAAC,EAAtB,CAAsB,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;iBAC7E,GACD,CACH,CAAC;SACH;aAAM;YACL,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBAC9C,IAAM,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;gBAChC,IAAI,QAAQ,CAAC,KAAK,CAAC,EAAE;oBACnB,SAAS;iBACV;gBAED,QAAQ,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC;gBACvB,eAAU,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;aAC1B;SACF;KACF;IAED,OAAO,IAAI,CAAC;AACd,CAAC;AApDD,wBAoDC"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flowtype definitions for types
|
|
3
|
+
* Generated by Flowgen from a Typescript Definition
|
|
4
|
+
* Flowgen v1.15.0
|
|
5
|
+
* @flow
|
|
6
|
+
*/
|
|
7
|
+
export interface StyleSheetOpts {
|
|
8
|
+
/**
|
|
9
|
+
* Used to set a nonce on the style element.
|
|
10
|
+
* This is needed when using a strict CSP and should be a random hash generated every server load.
|
|
11
|
+
* Check out https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/style-src for more information.
|
|
12
|
+
*/
|
|
13
|
+
nonce?: string;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Buckets under which we will group our stylesheets
|
|
17
|
+
*/
|
|
18
|
+
export type Bucket = '' | 'l' | 'v' | 'w' | 'f' | 'i' | 'h' | 'a' | 'm';
|
|
19
|
+
export type UseCacheHook = () => { [key: string]: true, ... };
|
|
20
|
+
export type ProviderComponent = (props: {
|
|
21
|
+
children: React$Node[] | React$Node,
|
|
22
|
+
...
|
|
23
|
+
}) => React$Node;
|
|
@@ -1,29 +1,26 @@
|
|
|
1
|
-
import { ComponentType } from 'react';
|
|
2
|
-
import { BasicTemplateInterpolations, CssFunction,
|
|
3
|
-
export interface FunctionIterpolation<TProps> {
|
|
4
|
-
(props: TProps): CSSProps | string | number | boolean | undefined;
|
|
5
|
-
}
|
|
1
|
+
import type { ComponentType } from 'react';
|
|
2
|
+
import type { BasicTemplateInterpolations, CssFunction, FunctionInterpolation } from '../types';
|
|
6
3
|
/**
|
|
7
4
|
* Typing for the CSS object.
|
|
8
5
|
*/
|
|
9
|
-
export declare type CssObject<TProps> = CssFunction<
|
|
6
|
+
export declare type CssObject<TProps> = CssFunction<FunctionInterpolation<TProps>>;
|
|
10
7
|
/**
|
|
11
8
|
* Extra props added to the output Styled Component.
|
|
12
9
|
*/
|
|
13
10
|
export interface StyledProps {
|
|
14
11
|
as?: keyof JSX.IntrinsicElements;
|
|
15
12
|
}
|
|
16
|
-
export declare type Interpolations<TProps extends unknown> = (BasicTemplateInterpolations |
|
|
13
|
+
export declare type Interpolations<TProps extends unknown> = (BasicTemplateInterpolations | FunctionInterpolation<TProps> | CssObject<TProps> | CssObject<TProps>[])[];
|
|
17
14
|
/**
|
|
18
15
|
* This allows us to take the generic `TTag` (that will be a valid `DOM` tag) and then use it to
|
|
19
16
|
* define correct props based on it from `JSX.IntrinsicElements`, while also injecting our own
|
|
20
17
|
* props from `StyledProps`.
|
|
21
18
|
*/
|
|
22
19
|
export interface StyledFunctionFromTag<TTag extends keyof JSX.IntrinsicElements> {
|
|
23
|
-
<TProps extends unknown>(css: CssObject<TProps> | CssObject<TProps>[], ...
|
|
20
|
+
<TProps extends unknown>(css: CssObject<TProps> | CssObject<TProps>[], ...interpolations: Interpolations<TProps>): React.ComponentType<TProps & JSX.IntrinsicElements[TTag] & StyledProps>;
|
|
24
21
|
}
|
|
25
22
|
export interface StyledFunctionFromComponent<TInheritedProps extends unknown> {
|
|
26
|
-
<TProps extends unknown>(css: CssObject<TProps> | TemplateStringsArray, ...
|
|
23
|
+
<TProps extends unknown>(css: CssObject<TProps> | TemplateStringsArray, ...interpolations: Interpolations<TProps>): React.ComponentType<TProps & StyledProps & TInheritedProps>;
|
|
27
24
|
}
|
|
28
25
|
export declare type StyledComponentMap = {
|
|
29
26
|
[Tag in keyof JSX.IntrinsicElements]: StyledFunctionFromTag<Tag>;
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flowtype definitions for index
|
|
3
|
+
* Generated by Flowgen from a Typescript Definition
|
|
4
|
+
* Flowgen v1.15.0
|
|
5
|
+
* @flow
|
|
6
|
+
*/
|
|
7
|
+
import type { ComponentType } from 'react';
|
|
8
|
+
import type { BasicTemplateInterpolations, CssFunction, FunctionInterpolation } from '../types';
|
|
9
|
+
/**
|
|
10
|
+
* Typing for the CSS object.
|
|
11
|
+
*/
|
|
12
|
+
export type CssObject<TProps> = CssFunction<FunctionInterpolation<TProps>>;
|
|
13
|
+
/**
|
|
14
|
+
* Extra props added to the output Styled Component.
|
|
15
|
+
*/
|
|
16
|
+
export type StyledProps = {
|
|
17
|
+
as?: $Keys<$JSXIntrinsics>,
|
|
18
|
+
};
|
|
19
|
+
export type Interpolations<TProps: mixed> = (
|
|
20
|
+
| BasicTemplateInterpolations
|
|
21
|
+
| FunctionInterpolation<TProps>
|
|
22
|
+
| CssObject<TProps>
|
|
23
|
+
| CssObject<TProps>[]
|
|
24
|
+
)[];
|
|
25
|
+
/**
|
|
26
|
+
* This allows us to take the generic `TTag` (that will be a valid `DOM` tag) and then use it to
|
|
27
|
+
* define correct props based on it from `$JSXIntrinsics`, while also injecting our own
|
|
28
|
+
* props from `StyledProps`.
|
|
29
|
+
*/
|
|
30
|
+
export interface StyledFunctionFromTag<TTag: $Keys<$JSXIntrinsics>> {
|
|
31
|
+
<TProps: mixed>(
|
|
32
|
+
css: CssObject<TProps> | $ReadOnlyArray<CssObject<TProps>>,
|
|
33
|
+
...interpolations: Interpolations<TProps>
|
|
34
|
+
): React$ComponentType<{
|
|
35
|
+
...TProps,
|
|
36
|
+
...$Exact<$ElementType<$JSXIntrinsics, TTag>>,
|
|
37
|
+
...StyledProps,
|
|
38
|
+
}>;
|
|
39
|
+
}
|
|
40
|
+
export interface StyledFunctionFromComponent<TInheritedProps: mixed> {
|
|
41
|
+
<TProps: mixed>(
|
|
42
|
+
css: CssObject<TProps> | $ReadOnlyArray<string>,
|
|
43
|
+
...interpolations: Interpolations<TProps>
|
|
44
|
+
): React$ComponentType<{ ...TProps, ...StyledProps, ...TInheritedProps }>;
|
|
45
|
+
}
|
|
46
|
+
export type StyledComponentMap = $ObjMapi<$JSXIntrinsics, <Tag>(Tag) => StyledFunctionFromTag<Tag>>;
|
|
47
|
+
export type StyledComponentInstantiator = {
|
|
48
|
+
/**
|
|
49
|
+
* Typing to enable consumers to compose components, e.g: `styled(Component)`
|
|
50
|
+
*/
|
|
51
|
+
<TInheritedProps: mixed>(
|
|
52
|
+
Component: ComponentType<TInheritedProps>
|
|
53
|
+
): StyledFunctionFromComponent<TInheritedProps>,
|
|
54
|
+
...
|
|
55
|
+
} & StyledComponentMap;
|
|
56
|
+
/**
|
|
57
|
+
* Create a component that ties styles to an element which comes with built-in behavior such as `ref` and `as` prop support.
|
|
58
|
+
*
|
|
59
|
+
* ```
|
|
60
|
+
* styled.div`font-size: 12px`; // Template literal CSS
|
|
61
|
+
* styled.div({ fontSize: 12 }); // Object CSS
|
|
62
|
+
* styled.div([{ fontSize: 12 }, `font-size: 12px;`]) // Array CSS
|
|
63
|
+
* styled.div({ fontSize: 12 }, `font-size: 12px`) Multi arguments CSS
|
|
64
|
+
* ```
|
|
65
|
+
*
|
|
66
|
+
* For more help, read the docs:
|
|
67
|
+
* https://compiledcssinjs.com/docs/api-styled
|
|
68
|
+
*/
|
|
69
|
+
declare export var styled: StyledComponentInstantiator;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/styled/index.tsx"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/styled/index.tsx"],"names":[],"mappings":";;;AAGA,wCAAkD;AAwDlD;;;;;;;;;;;;GAYG;AACU,QAAA,MAAM,GAAgC,IAAI,KAAK,CAC1D,EAAE,EACF;IACE,GAAG;QACD,OAAO;YACL,8CAA8C;YAC9C,yDAAyD;YACzD,MAAM,wBAAgB,EAAE,CAAC;QAC3B,CAAC,CAAC;IACJ,CAAC;CACF,CACK,CAAC"}
|
package/dist/cjs/types.d.ts
CHANGED
|
@@ -1,13 +1,16 @@
|
|
|
1
|
-
import * as CSS from 'csstype';
|
|
1
|
+
import type * as CSS from 'csstype';
|
|
2
2
|
/**
|
|
3
3
|
* Typing for the interpolations.
|
|
4
4
|
*/
|
|
5
5
|
export declare type BasicTemplateInterpolations = string | number;
|
|
6
|
+
export interface FunctionInterpolation<TProps> {
|
|
7
|
+
(props: TProps): CSSProps | BasicTemplateInterpolations | boolean | undefined;
|
|
8
|
+
}
|
|
6
9
|
/**
|
|
7
10
|
* These are all the CSS props that will exist.
|
|
8
11
|
*/
|
|
9
|
-
export declare type CSSProps = CSS.Properties<
|
|
12
|
+
export declare type CSSProps = CSS.Properties<BasicTemplateInterpolations>;
|
|
10
13
|
export declare type AnyKeyCssProps<TValue> = {
|
|
11
|
-
[key: string]: AnyKeyCssProps<TValue> | CSSProps |
|
|
14
|
+
[key: string]: AnyKeyCssProps<TValue> | CSSProps | BasicTemplateInterpolations | TValue;
|
|
12
15
|
};
|
|
13
16
|
export declare type CssFunction<TValue = void> = CSSProps | AnyKeyCssProps<TValue> | TemplateStringsArray | string | boolean | undefined;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flowtype definitions for types
|
|
3
|
+
* Generated by Flowgen from a Typescript Definition
|
|
4
|
+
* Flowgen v1.15.0
|
|
5
|
+
* @flow
|
|
6
|
+
*/
|
|
7
|
+
import * as CSS from 'csstype';
|
|
8
|
+
/**
|
|
9
|
+
* Typing for the interpolations.
|
|
10
|
+
*/
|
|
11
|
+
export type BasicTemplateInterpolations = string | number;
|
|
12
|
+
export interface FunctionInterpolation<TProps> {
|
|
13
|
+
(props: TProps): CSSProps | BasicTemplateInterpolations | boolean | void;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* These are all the CSS props that will exist.
|
|
17
|
+
*/
|
|
18
|
+
export type CSSProps = CSS.Properties<BasicTemplateInterpolations>;
|
|
19
|
+
export type AnyKeyCssProps<TValue> = {
|
|
20
|
+
[key: string]: AnyKeyCssProps<TValue> | CSSProps | BasicTemplateInterpolations | TValue,
|
|
21
|
+
...
|
|
22
|
+
};
|
|
23
|
+
export type CssFunction<TValue = void> =
|
|
24
|
+
| CSSProps
|
|
25
|
+
| AnyKeyCssProps<TValue>
|
|
26
|
+
| $ReadOnlyArray<string>
|
|
27
|
+
| string
|
|
28
|
+
| boolean
|
|
29
|
+
| void;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
import {
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
import type { BasicTemplateInterpolations, CssFunction } from '../types';
|
|
3
3
|
export declare type Interpolations = (BasicTemplateInterpolations | CssFunction | CssFunction[])[];
|
|
4
4
|
export interface ClassNamesProps {
|
|
5
5
|
children: (opts: {
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Flowtype definitions for index
|
|
3
|
+
* Generated by Flowgen from a Typescript Definition
|
|
4
|
+
* Flowgen v1.15.0
|
|
5
|
+
* @flow
|
|
6
|
+
*/
|
|
7
|
+
import type { Node } from 'react';
|
|
8
|
+
import type { BasicTemplateInterpolations, CssFunction } from '../types';
|
|
9
|
+
export type Interpolations = (BasicTemplateInterpolations | CssFunction<> | CssFunction<>[])[];
|
|
10
|
+
export interface ClassNamesProps {
|
|
11
|
+
children: (opts: {
|
|
12
|
+
css: (css: CssFunction<> | CssFunction<>[], ...interpolations: Interpolations) => string,
|
|
13
|
+
style: {
|
|
14
|
+
[key: string]: string,
|
|
15
|
+
...
|
|
16
|
+
},
|
|
17
|
+
...
|
|
18
|
+
}) => Node;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* Use a component where styles are not necessarily tied to an element.
|
|
22
|
+
*
|
|
23
|
+
* ```
|
|
24
|
+
* // Object CSS
|
|
25
|
+
* <ClassNames>
|
|
26
|
+
* {({ css, style }) => children({ className: css({ fontSize: 12 }) })}
|
|
27
|
+
* </ClassNames>
|
|
28
|
+
*
|
|
29
|
+
* // Template literal CSS
|
|
30
|
+
* <ClassNames>
|
|
31
|
+
* {({ css, style }) => children({ className: css`font-size: 12px;` })}
|
|
32
|
+
* </ClassNames>
|
|
33
|
+
*
|
|
34
|
+
* // Array CSS
|
|
35
|
+
* <ClassNames>
|
|
36
|
+
* {({ css, style }) =>
|
|
37
|
+
* children({ className: css([{ fontSize: 12 }, `font-size: 12px`]) })}
|
|
38
|
+
* </ClassNames>
|
|
39
|
+
* ```
|
|
40
|
+
*
|
|
41
|
+
* For more help, read the docs:
|
|
42
|
+
* https://compiledcssinjs.com/docs/api-class-names
|
|
43
|
+
* @param props
|
|
44
|
+
*/
|
|
45
|
+
declare export function ClassNames(_: ClassNamesProps): React$Node;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/class-names/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/class-names/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAWlD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,MAAM,UAAU,UAAU,CAAC,CAAkB;IAC3C,MAAM,gBAAgB,EAAE,CAAC;AAC3B,CAAC"}
|
package/dist/esm/css/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import type { CSSProps } from '../types';
|
|
1
|
+
import type { BasicTemplateInterpolations, CSSProps, FunctionInterpolation } from '../types';
|
|
2
2
|
/**
|
|
3
|
-
* Create styles that can be re-used between components.
|
|
3
|
+
* Create styles that can be re-used between components with a template literal.
|
|
4
4
|
*
|
|
5
5
|
* ```
|
|
6
6
|
* css`color: red;`;
|
|
@@ -12,4 +12,17 @@ import type { CSSProps } from '../types';
|
|
|
12
12
|
* @param css
|
|
13
13
|
* @param values
|
|
14
14
|
*/
|
|
15
|
-
export default function css(_css: TemplateStringsArray, ..._values: (
|
|
15
|
+
export default function css<T = void>(_css: TemplateStringsArray, ..._values: (BasicTemplateInterpolations | FunctionInterpolation<T>)[]): CSSProps;
|
|
16
|
+
/**
|
|
17
|
+
* Create styles that can be re-used between components with an object
|
|
18
|
+
*
|
|
19
|
+
* ```
|
|
20
|
+
* css({ color: 'red' });
|
|
21
|
+
* ```
|
|
22
|
+
*
|
|
23
|
+
* For more help, read the docs:
|
|
24
|
+
* https://compiledcssinjs.com/docs/api-css
|
|
25
|
+
*
|
|
26
|
+
* @param css
|
|
27
|
+
*/
|
|
28
|
+
export default function css(_css: CSSProps): CSSProps;
|
package/dist/esm/css/index.js
CHANGED
|
@@ -1,17 +1,5 @@
|
|
|
1
|
+
/* eslint-disable import/export */
|
|
1
2
|
import { createSetupError } from '../utils/error';
|
|
2
|
-
/**
|
|
3
|
-
* Create styles that can be re-used between components.
|
|
4
|
-
*
|
|
5
|
-
* ```
|
|
6
|
-
* css`color: red;`;
|
|
7
|
-
* ```
|
|
8
|
-
*
|
|
9
|
-
* For more help, read the docs:
|
|
10
|
-
* https://compiledcssinjs.com/docs/api-css
|
|
11
|
-
*
|
|
12
|
-
* @param css
|
|
13
|
-
* @param values
|
|
14
|
-
*/
|
|
15
3
|
export default function css(_css) {
|
|
16
4
|
var _values = [];
|
|
17
5
|
for (var _i = 1; _i < arguments.length; _i++) {
|