@tamagui/core 1.0.1-beta.218 → 1.0.1-beta.220
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/dist/cjs/createFont.js +11 -4
- package/dist/cjs/createFont.js.map +2 -2
- package/dist/cjs/createFont.test.js +125 -0
- package/dist/cjs/createFont.test.js.map +7 -0
- package/dist/cjs/helpers/ThemeManager.js +1 -1
- package/dist/cjs/helpers/ThemeManager.js.map +2 -2
- package/dist/cjs/helpers/ThemeManager.test.js +62 -0
- package/dist/cjs/helpers/ThemeManager.test.js.map +7 -0
- package/dist/cjs/helpers/getSplitStyles.js +0 -2
- package/dist/cjs/helpers/getSplitStyles.js.map +2 -2
- package/dist/cjs/helpers/getStylesAtomic.native.js.map +2 -2
- package/dist/cjs/helpers/themeable.js +5 -10
- package/dist/cjs/helpers/themeable.js.map +2 -2
- package/dist/cjs/views/ThemeInverse.js +24 -16
- package/dist/cjs/views/ThemeInverse.js.map +2 -2
- package/dist/esm/createFont.js +11 -4
- package/dist/esm/createFont.js.map +2 -2
- package/dist/esm/createFont.test.js +124 -0
- package/dist/esm/createFont.test.js.map +7 -0
- package/dist/esm/helpers/ThemeManager.js +1 -1
- package/dist/esm/helpers/ThemeManager.js.map +2 -2
- package/dist/esm/helpers/ThemeManager.test.js +61 -0
- package/dist/esm/helpers/ThemeManager.test.js.map +7 -0
- package/dist/esm/helpers/getSplitStyles.js +0 -2
- package/dist/esm/helpers/getSplitStyles.js.map +2 -2
- package/dist/esm/helpers/getStylesAtomic.native.js.map +2 -2
- package/dist/esm/helpers/themeable.js +5 -10
- package/dist/esm/helpers/themeable.js.map +2 -2
- package/dist/esm/views/ThemeInverse.js +23 -16
- package/dist/esm/views/ThemeInverse.js.map +2 -2
- package/package.json +13 -13
- package/src/createFont.test.ts +129 -0
- package/src/createFont.ts +12 -5
- package/src/helpers/ThemeManager.tsx +1 -1
- package/src/helpers/getSplitStyles.tsx +0 -1
- package/src/helpers/getStylesAtomic.native.ts +1 -0
- package/src/helpers/themeable.tsx +4 -8
- package/src/views/ThemeInverse.tsx +30 -19
- package/types/createFont.test.d.ts +2 -0
- package/types/views/ThemeInverse.d.ts +5 -2
|
@@ -18,7 +18,8 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
19
|
var ThemeInverse_exports = {};
|
|
20
20
|
__export(ThemeInverse_exports, {
|
|
21
|
-
ThemeInverse: () => ThemeInverse
|
|
21
|
+
ThemeInverse: () => ThemeInverse,
|
|
22
|
+
useThemeInverse: () => useThemeInverse
|
|
22
23
|
});
|
|
23
24
|
module.exports = __toCommonJS(ThemeInverse_exports);
|
|
24
25
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
@@ -26,30 +27,37 @@ var import_constants = require("@tamagui/constants");
|
|
|
26
27
|
var import_react = require("react");
|
|
27
28
|
var import_useTheme = require("../hooks/useTheme");
|
|
28
29
|
var import_Theme = require("./Theme");
|
|
29
|
-
const
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
}) => {
|
|
30
|
+
const toggleTheme = (themeName) => {
|
|
31
|
+
return themeName.startsWith("light") ? "dark" : "light";
|
|
32
|
+
};
|
|
33
|
+
const useThemeInverse = (props = {}) => {
|
|
33
34
|
const themeName = (0, import_useTheme.useThemeName)();
|
|
34
35
|
const defaultTheme = (0, import_useTheme.useDefaultThemeName)();
|
|
35
36
|
const [name, setName] = (0, import_react.useState)(null);
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
}, [defaultTheme, themeName]);
|
|
43
|
-
if (disable) {
|
|
44
|
-
return children;
|
|
37
|
+
const curName = themeName || defaultTheme || "";
|
|
38
|
+
if (import_constants.isWeb) {
|
|
39
|
+
(0, import_constants.useIsomorphicLayoutEffect)(() => {
|
|
40
|
+
setName(toggleTheme(curName));
|
|
41
|
+
}, [defaultTheme, themeName]);
|
|
42
|
+
return props.disable ? null : name;
|
|
45
43
|
}
|
|
44
|
+
return props.disable ? null : toggleTheme(curName);
|
|
45
|
+
};
|
|
46
|
+
const ThemeInverse = ({
|
|
47
|
+
children,
|
|
48
|
+
disable
|
|
49
|
+
}) => {
|
|
50
|
+
const inverseTheme = useThemeInverse({
|
|
51
|
+
disable
|
|
52
|
+
});
|
|
46
53
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.Theme, {
|
|
47
|
-
name,
|
|
54
|
+
name: inverseTheme,
|
|
48
55
|
children
|
|
49
56
|
});
|
|
50
57
|
};
|
|
51
58
|
// Annotate the CommonJS export names for ESM import in node:
|
|
52
59
|
0 && (module.exports = {
|
|
53
|
-
ThemeInverse
|
|
60
|
+
ThemeInverse,
|
|
61
|
+
useThemeInverse
|
|
54
62
|
});
|
|
55
63
|
//# sourceMappingURL=ThemeInverse.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/views/ThemeInverse.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useIsomorphicLayoutEffect } from '@tamagui/constants'\nimport React, { useState } from 'react'\n\nimport { useDefaultThemeName, useThemeName } from '../hooks/useTheme'\nimport { Theme } from './Theme'\n\nexport
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import { isWeb, useIsomorphicLayoutEffect } from '@tamagui/constants'\nimport React, { useState } from 'react'\n\nimport { useDefaultThemeName, useThemeName } from '../hooks/useTheme'\nimport { Theme } from './Theme'\n\nexport type ThemeInverseProps = {\n disable?: boolean\n}\n\nconst toggleTheme = (themeName: string) => {\n return themeName.startsWith('light') ? 'dark' : 'light'\n}\n\nexport const useThemeInverse = (props: ThemeInverseProps = {}) => {\n const themeName = useThemeName()\n const defaultTheme = useDefaultThemeName()\n const [name, setName] = useState<null | string>(null)\n const curName = themeName || defaultTheme || ''\n\n if (isWeb) {\n // for SSR must be in effect\n useIsomorphicLayoutEffect(() => {\n setName(toggleTheme(curName))\n }, [defaultTheme, themeName])\n\n return props.disable ? null : name\n }\n\n return props.disable ? null : toggleTheme(curName)\n}\n\nexport const ThemeInverse = ({\n children,\n disable,\n}: ThemeInverseProps & {\n children: React.ReactNode\n}) => {\n const inverseTheme = useThemeInverse({\n disable,\n })\n return <Theme name={inverseTheme}>{children}</Theme>\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyCS;AAzCT,uBAAiD;AACjD,mBAAgC;AAEhC,sBAAkD;AAClD,mBAAsB;AAMtB,MAAM,cAAc,CAAC,cAAsB;AACzC,SAAO,UAAU,WAAW,OAAO,IAAI,SAAS;AAClD;AAEO,MAAM,kBAAkB,CAAC,QAA2B,CAAC,MAAM;AAChE,QAAM,gBAAY,8BAAa;AAC/B,QAAM,mBAAe,qCAAoB;AACzC,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAwB,IAAI;AACpD,QAAM,UAAU,aAAa,gBAAgB;AAE7C,MAAI,wBAAO;AAET,oDAA0B,MAAM;AAC9B,cAAQ,YAAY,OAAO,CAAC;AAAA,IAC9B,GAAG,CAAC,cAAc,SAAS,CAAC;AAE5B,WAAO,MAAM,UAAU,OAAO;AAAA,EAChC;AAEA,SAAO,MAAM,UAAU,OAAO,YAAY,OAAO;AACnD;AAEO,MAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AACF,MAEM;AACJ,QAAM,eAAe,gBAAgB;AAAA,IACnC;AAAA,EACF,CAAC;AACD,SAAO,4CAAC;AAAA,IAAM,MAAM;AAAA,IAAe;AAAA,GAAS;AAC9C;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/createFont.js
CHANGED
|
@@ -9,15 +9,16 @@ const fontWeights = [
|
|
|
9
9
|
"800",
|
|
10
10
|
"900"
|
|
11
11
|
];
|
|
12
|
-
const processSection = (section, keys) => {
|
|
12
|
+
const processSection = (section, keys, defaultValue) => {
|
|
13
13
|
if (typeof section === "string")
|
|
14
14
|
return section;
|
|
15
15
|
const sectionKeys = Object.keys(section);
|
|
16
16
|
let fillValue = section[sectionKeys[0]];
|
|
17
17
|
return Object.fromEntries(
|
|
18
18
|
[.../* @__PURE__ */ new Set([...keys, ...sectionKeys])].map((key) => {
|
|
19
|
-
const value = section[key] ?? fillValue;
|
|
19
|
+
const value = section[key] ?? defaultValue ?? fillValue;
|
|
20
20
|
fillValue = value;
|
|
21
|
+
defaultValue = value;
|
|
21
22
|
return [key, value];
|
|
22
23
|
})
|
|
23
24
|
);
|
|
@@ -26,8 +27,14 @@ const createFont = (font) => {
|
|
|
26
27
|
const sizeKeys = Object.keys(font.size);
|
|
27
28
|
const processedFont = Object.fromEntries(
|
|
28
29
|
Object.entries(font).map(([key, section]) => {
|
|
29
|
-
|
|
30
|
-
|
|
30
|
+
return [
|
|
31
|
+
key,
|
|
32
|
+
processSection(
|
|
33
|
+
section,
|
|
34
|
+
key === "face" ? fontWeights : sizeKeys,
|
|
35
|
+
key === "face" ? { normal: font.family } : void 0
|
|
36
|
+
)
|
|
37
|
+
];
|
|
31
38
|
})
|
|
32
39
|
);
|
|
33
40
|
return Object.freeze(processedFont);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/createFont.ts"],
|
|
4
|
-
"sourcesContent": ["import { FontWeightSteps, GenericFont } from './types'\n\nconst fontWeights: FontWeightSteps[] = [\n '100',\n '200',\n '300',\n '400',\n '500',\n '600',\n '700',\n '800',\n '900',\n]\n\nconst processSection = <T>(\n section: string | Record<string, T>,\n keys: string[]\n): string | Record<string, T> => {\n if (typeof section === 'string') return section\n\n const sectionKeys = Object.keys(section)\n let fillValue = section[sectionKeys[0]]\n\n return Object.fromEntries(\n [...new Set([...keys, ...sectionKeys])].map((key) => {\n const value = section[key] ?? fillValue\n fillValue = value\n return [key, value]\n })\n )\n}\n\nexport const createFont = <A extends GenericFont>(font: A): A => {\n const sizeKeys = Object.keys(font.size)\n\n const processedFont = Object.fromEntries(\n Object.entries(font).map(([key, section]) => {\n
|
|
5
|
-
"mappings": "AAEA,MAAM,cAAiC;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,MAAM,iBAAiB,CACrB,SACA,
|
|
4
|
+
"sourcesContent": ["import { FontWeightSteps, GenericFont } from './types'\n\nconst fontWeights: FontWeightSteps[] = [\n '100',\n '200',\n '300',\n '400',\n '500',\n '600',\n '700',\n '800',\n '900',\n]\n\nconst processSection = <T>(\n section: string | Record<string, T>,\n keys: string[],\n defaultValue?: any\n): string | Record<string, T> => {\n if (typeof section === 'string') return section\n\n const sectionKeys = Object.keys(section)\n let fillValue = section[sectionKeys[0]]\n\n return Object.fromEntries(\n [...new Set([...keys, ...sectionKeys])].map((key) => {\n const value = section[key] ?? defaultValue ?? fillValue\n fillValue = value\n defaultValue = value\n return [key, value]\n })\n )\n}\n\nexport const createFont = <A extends GenericFont>(font: A): A => {\n const sizeKeys = Object.keys(font.size)\n\n const processedFont = Object.fromEntries(\n Object.entries(font).map(([key, section]) => {\n return [\n key,\n processSection(\n section,\n key === 'face' ? fontWeights : sizeKeys,\n key === 'face' ? { normal: font.family } : undefined\n ),\n ]\n })\n )\n\n return Object.freeze(processedFont) as A\n}\n"],
|
|
5
|
+
"mappings": "AAEA,MAAM,cAAiC;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,MAAM,iBAAiB,CACrB,SACA,MACA,iBAC+B;AAC/B,MAAI,OAAO,YAAY;AAAU,WAAO;AAExC,QAAM,cAAc,OAAO,KAAK,OAAO;AACvC,MAAI,YAAY,QAAQ,YAAY;AAEpC,SAAO,OAAO;AAAA,IACZ,CAAC,GAAG,oBAAI,IAAI,CAAC,GAAG,MAAM,GAAG,WAAW,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ;AACnD,YAAM,QAAQ,QAAQ,QAAQ,gBAAgB;AAC9C,kBAAY;AACZ,qBAAe;AACf,aAAO,CAAC,KAAK,KAAK;AAAA,IACpB,CAAC;AAAA,EACH;AACF;AAEO,MAAM,aAAa,CAAwB,SAAe;AAC/D,QAAM,WAAW,OAAO,KAAK,KAAK,IAAI;AAEtC,QAAM,gBAAgB,OAAO;AAAA,IAC3B,OAAO,QAAQ,IAAI,EAAE,IAAI,CAAC,CAAC,KAAK,OAAO,MAAM;AAC3C,aAAO;AAAA,QACL;AAAA,QACA;AAAA,UACE;AAAA,UACA,QAAQ,SAAS,cAAc;AAAA,UAC/B,QAAQ,SAAS,EAAE,QAAQ,KAAK,OAAO,IAAI;AAAA,QAC7C;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SAAO,OAAO,OAAO,aAAa;AACpC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
import { describe, expect, test } from "vitest";
|
|
2
|
+
import { createFont } from "./createFont";
|
|
3
|
+
const font = {
|
|
4
|
+
family: "Inter",
|
|
5
|
+
size: {
|
|
6
|
+
1: 11,
|
|
7
|
+
2: 12,
|
|
8
|
+
3: 14,
|
|
9
|
+
4: 16,
|
|
10
|
+
5: 20,
|
|
11
|
+
6: 24
|
|
12
|
+
},
|
|
13
|
+
lineHeight: {
|
|
14
|
+
1: 14,
|
|
15
|
+
2: 16,
|
|
16
|
+
3: 18,
|
|
17
|
+
4: 20,
|
|
18
|
+
5: 24,
|
|
19
|
+
6: 28
|
|
20
|
+
},
|
|
21
|
+
transform: {
|
|
22
|
+
3: "uppercase",
|
|
23
|
+
4: "none"
|
|
24
|
+
},
|
|
25
|
+
weight: {
|
|
26
|
+
1: "400",
|
|
27
|
+
3: "700"
|
|
28
|
+
},
|
|
29
|
+
color: {
|
|
30
|
+
1: "$colorFocus",
|
|
31
|
+
6: "$color"
|
|
32
|
+
},
|
|
33
|
+
letterSpacing: {
|
|
34
|
+
5: 2,
|
|
35
|
+
6: 1,
|
|
36
|
+
7: 0,
|
|
37
|
+
8: 0,
|
|
38
|
+
9: -1,
|
|
39
|
+
10: -1.5,
|
|
40
|
+
12: -2,
|
|
41
|
+
14: -3,
|
|
42
|
+
15: -4
|
|
43
|
+
},
|
|
44
|
+
face: {
|
|
45
|
+
700: { normal: "InterBold" },
|
|
46
|
+
800: { normal: "InterBold" }
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
const expectedProcessedFont = {
|
|
50
|
+
family: "Inter",
|
|
51
|
+
size: {
|
|
52
|
+
1: 11,
|
|
53
|
+
2: 12,
|
|
54
|
+
3: 14,
|
|
55
|
+
4: 16,
|
|
56
|
+
5: 20,
|
|
57
|
+
6: 24
|
|
58
|
+
},
|
|
59
|
+
lineHeight: {
|
|
60
|
+
1: 14,
|
|
61
|
+
2: 16,
|
|
62
|
+
3: 18,
|
|
63
|
+
4: 20,
|
|
64
|
+
5: 24,
|
|
65
|
+
6: 28
|
|
66
|
+
},
|
|
67
|
+
transform: {
|
|
68
|
+
1: "uppercase",
|
|
69
|
+
2: "uppercase",
|
|
70
|
+
3: "uppercase",
|
|
71
|
+
4: "none",
|
|
72
|
+
5: "none",
|
|
73
|
+
6: "none"
|
|
74
|
+
},
|
|
75
|
+
weight: {
|
|
76
|
+
1: "400",
|
|
77
|
+
2: "400",
|
|
78
|
+
3: "700",
|
|
79
|
+
4: "700",
|
|
80
|
+
5: "700",
|
|
81
|
+
6: "700"
|
|
82
|
+
},
|
|
83
|
+
color: {
|
|
84
|
+
1: "$colorFocus",
|
|
85
|
+
2: "$colorFocus",
|
|
86
|
+
3: "$colorFocus",
|
|
87
|
+
4: "$colorFocus",
|
|
88
|
+
5: "$colorFocus",
|
|
89
|
+
6: "$color"
|
|
90
|
+
},
|
|
91
|
+
letterSpacing: {
|
|
92
|
+
1: 2,
|
|
93
|
+
2: 2,
|
|
94
|
+
3: 2,
|
|
95
|
+
4: 2,
|
|
96
|
+
5: 2,
|
|
97
|
+
6: 1,
|
|
98
|
+
7: 0,
|
|
99
|
+
8: 0,
|
|
100
|
+
9: -1,
|
|
101
|
+
10: -1.5,
|
|
102
|
+
12: -2,
|
|
103
|
+
14: -3,
|
|
104
|
+
15: -4
|
|
105
|
+
},
|
|
106
|
+
face: {
|
|
107
|
+
100: { normal: "Inter" },
|
|
108
|
+
200: { normal: "Inter" },
|
|
109
|
+
300: { normal: "Inter" },
|
|
110
|
+
400: { normal: "Inter" },
|
|
111
|
+
500: { normal: "Inter" },
|
|
112
|
+
600: { normal: "Inter" },
|
|
113
|
+
700: { normal: "InterBold" },
|
|
114
|
+
800: { normal: "InterBold" },
|
|
115
|
+
900: { normal: "InterBold" }
|
|
116
|
+
}
|
|
117
|
+
};
|
|
118
|
+
describe("createFont", () => {
|
|
119
|
+
test("should return a font object with normalised property hashes", () => {
|
|
120
|
+
const processedFont = createFont(font);
|
|
121
|
+
expect(processedFont).toStrictEqual(expectedProcessedFont);
|
|
122
|
+
});
|
|
123
|
+
});
|
|
124
|
+
//# sourceMappingURL=createFont.test.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/createFont.test.ts"],
|
|
4
|
+
"sourcesContent": ["import { describe, expect, test } from 'vitest'\n\nimport { createFont } from './createFont'\nimport { GenericFont } from './types'\n\nconst font: GenericFont = {\n family: 'Inter',\n size: {\n 1: 11,\n 2: 12,\n 3: 14,\n 4: 16,\n 5: 20,\n 6: 24,\n },\n lineHeight: {\n 1: 14,\n 2: 16,\n 3: 18,\n 4: 20,\n 5: 24,\n 6: 28,\n },\n transform: {\n 3: 'uppercase',\n 4: 'none',\n },\n weight: {\n 1: '400',\n 3: '700',\n },\n color: {\n 1: '$colorFocus',\n 6: '$color',\n },\n letterSpacing: {\n 5: 2,\n 6: 1,\n 7: 0,\n 8: 0,\n 9: -1,\n 10: -1.5,\n 12: -2,\n 14: -3,\n 15: -4,\n },\n face: {\n 700: { normal: 'InterBold' },\n 800: { normal: 'InterBold' },\n },\n}\n\nconst expectedProcessedFont: GenericFont = {\n family: 'Inter',\n size: {\n 1: 11,\n 2: 12,\n 3: 14,\n 4: 16,\n 5: 20,\n 6: 24,\n },\n lineHeight: {\n 1: 14,\n 2: 16,\n 3: 18,\n 4: 20,\n 5: 24,\n 6: 28,\n },\n transform: {\n 1: 'uppercase',\n 2: 'uppercase',\n 3: 'uppercase',\n 4: 'none',\n 5: 'none',\n 6: 'none',\n },\n weight: {\n 1: '400',\n 2: '400',\n 3: '700',\n 4: '700',\n 5: '700',\n 6: '700',\n },\n color: {\n 1: '$colorFocus',\n 2: '$colorFocus',\n 3: '$colorFocus',\n 4: '$colorFocus',\n 5: '$colorFocus',\n 6: '$color',\n },\n letterSpacing: {\n 1: 2,\n 2: 2,\n 3: 2,\n 4: 2,\n 5: 2,\n 6: 1,\n 7: 0,\n 8: 0,\n 9: -1,\n 10: -1.5,\n 12: -2,\n 14: -3,\n 15: -4,\n },\n face: {\n 100: { normal: 'Inter' },\n 200: { normal: 'Inter' },\n 300: { normal: 'Inter' },\n 400: { normal: 'Inter' },\n 500: { normal: 'Inter' },\n 600: { normal: 'Inter' },\n 700: { normal: 'InterBold' },\n 800: { normal: 'InterBold' },\n 900: { normal: 'InterBold' },\n },\n}\n\ndescribe('createFont', () => {\n test('should return a font object with normalised property hashes', () => {\n const processedFont = createFont(font)\n\n expect(processedFont).toStrictEqual(expectedProcessedFont)\n })\n})\n"],
|
|
5
|
+
"mappings": "AAAA,SAAS,UAAU,QAAQ,YAAY;AAEvC,SAAS,kBAAkB;AAG3B,MAAM,OAAoB;AAAA,EACxB,QAAQ;AAAA,EACR,MAAM;AAAA,IACJ,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,YAAY;AAAA,IACV,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,WAAW;AAAA,IACT,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,OAAO;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,eAAe;AAAA,IACb,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAAA,EACA,MAAM;AAAA,IACJ,KAAK,EAAE,QAAQ,YAAY;AAAA,IAC3B,KAAK,EAAE,QAAQ,YAAY;AAAA,EAC7B;AACF;AAEA,MAAM,wBAAqC;AAAA,EACzC,QAAQ;AAAA,EACR,MAAM;AAAA,IACJ,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,YAAY;AAAA,IACV,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,WAAW;AAAA,IACT,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,OAAO;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,eAAe;AAAA,IACb,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAAA,EACA,MAAM;AAAA,IACJ,KAAK,EAAE,QAAQ,QAAQ;AAAA,IACvB,KAAK,EAAE,QAAQ,QAAQ;AAAA,IACvB,KAAK,EAAE,QAAQ,QAAQ;AAAA,IACvB,KAAK,EAAE,QAAQ,QAAQ;AAAA,IACvB,KAAK,EAAE,QAAQ,QAAQ;AAAA,IACvB,KAAK,EAAE,QAAQ,QAAQ;AAAA,IACvB,KAAK,EAAE,QAAQ,YAAY;AAAA,IAC3B,KAAK,EAAE,QAAQ,YAAY;AAAA,IAC3B,KAAK,EAAE,QAAQ,YAAY;AAAA,EAC7B;AACF;AAEA,SAAS,cAAc,MAAM;AAC3B,OAAK,+DAA+D,MAAM;AACxE,UAAM,gBAAgB,WAAW,IAAI;AAErC,WAAO,aAAa,EAAE,cAAc,qBAAqB;AAAA,EAC3D,CAAC;AACH,CAAC;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -171,7 +171,7 @@ class ThemeManager {
|
|
|
171
171
|
}
|
|
172
172
|
const ThemeManagerContext = createContext(null);
|
|
173
173
|
const emptyManager = new ThemeManager();
|
|
174
|
-
const withoutComponentName = (name) => name.replace(/(
|
|
174
|
+
const withoutComponentName = (name) => name.replace(/(_[A-Z][a-zA-Z]+)+$/g, "");
|
|
175
175
|
export {
|
|
176
176
|
ThemeManager,
|
|
177
177
|
ThemeManagerContext,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/ThemeManager.tsx"],
|
|
4
|
-
"sourcesContent": ["import { createContext } from 'react'\n\nimport { getThemes } from '../config'\nimport { THEME_CLASSNAME_PREFIX, THEME_NAME_SEPARATOR } from '../constants/constants'\nimport { getThemeUnwrapped } from '../hooks/getThemeUnwrapped'\nimport { ThemeParsed, Themes } from '../types'\n\ntype ThemeListener = (name: string | null, themeManager: ThemeManager) => void\n\nexport type SetActiveThemeProps = {\n className?: string\n parentManager?: ThemeManager | null\n name?: string | null\n theme?: any\n}\n\nexport type GetNextThemeProps = {\n themes?: Themes\n name?: string | null\n componentName?: string | null\n reset?: boolean\n}\n\nexport class ThemeManager {\n keys = new Map<any, Set<string>>()\n listeners = new Map<any, Function>()\n themeListeners = new Set<ThemeListener>()\n\n constructor(\n public name: string = '',\n public className: string = '',\n public theme: ThemeParsed | null = null,\n public parentManager: ThemeManager | null = null,\n public reset: boolean = false\n ) {\n // find the nearest different parentManager\n let parent = parentManager\n let tries = 0\n while (true) {\n tries++\n if (tries > 10) {\n throw new Error(`Nested 10 of the same theme in a row, likely error`)\n }\n if (!parent) break\n if (parent.name === name) {\n // go up if same\n parent = parent.parentManager\n } else {\n this.parentManager = parent\n break\n }\n }\n }\n\n get didChangeTheme() {\n return this.parentManager && this.name !== this.parentManager.fullName\n }\n\n get parentName() {\n return this.parentManager?.name || null\n }\n\n get fullName(): string {\n return this.getNextTheme().name || this.name || ''\n // const parentName = this.parentManager?.fullName || ''\n // const name = this.name || ''\n // const parts = [...new Set([...`${parentName}_${name}`.split('_')])].filter(Boolean)\n // return parts.join('_')\n }\n\n // gets value going up to parents\n getValue(key: string) {\n let theme = this.theme\n let manager = this as ThemeManager | null\n while (true) {\n if (!theme) return\n if (key in theme) {\n return theme[key]\n }\n manager = this.parentManager\n if (!manager || manager.theme === theme) {\n return\n }\n theme = manager.theme\n }\n }\n\n isTracking(uuid: Object) {\n return Boolean(this.keys.get(uuid)?.size)\n }\n\n update({ name, theme, className }: SetActiveThemeProps = {}, force = false, notify = true) {\n if (!force) {\n // className compare on web, avoids light/dark re-renders\n const nameChanged = name !== this.name\n if (!nameChanged) {\n return false\n }\n }\n this.className = className || ''\n this.name = name || ''\n this.theme = theme\n if (notify) {\n this.notify()\n }\n return true\n }\n\n getNextTheme(\n props: GetNextThemeProps = {},\n debug?: any\n ): {\n name: string\n theme: ThemeParsed | null\n className: string | undefined\n } {\n const { themes = getThemes(), name, componentName } = props\n\n if (props.reset && name) {\n return {\n name: name,\n theme: themes[name] as ThemeParsed,\n className: this.getCN(name),\n }\n }\n\n const parentIsReset = this.parentManager?.reset\n\n if (!name) {\n if (componentName) {\n // allow for _Card_Button or just _Button\n const names = [\n `${this.name}_${componentName}`,\n `${withoutComponentName(this.name)}_${componentName}`,\n ]\n for (const name of names) {\n if (name in themes) {\n const className = this.getCN(name)\n return { name, theme: themes[name], className }\n }\n }\n }\n return {\n name: this.name,\n theme: this.theme,\n className: this.className,\n }\n }\n\n let nextName = name || this.name || ''\n let parentName = parentIsReset ? this.parentName || this.fullName : this.fullName\n\n while (true) {\n if (nextName in themes) break\n nextName = `${parentName}_${name}`\n if (nextName in themes) break\n // this is fine - some themes can not have parents\n if (!parentName.includes(THEME_NAME_SEPARATOR)) break\n // go up one\n parentName = parentName.slice(0, parentName.lastIndexOf(THEME_NAME_SEPARATOR))\n }\n\n if (componentName) {\n // allow for _Card_Button or just _Button\n const names = [\n `${nextName}_${componentName}`,\n `${withoutComponentName(nextName)}_${componentName}`,\n ]\n for (const name of names) {\n if (name in themes) {\n nextName = name\n }\n }\n }\n\n let theme = themes[nextName]\n if (!theme) {\n theme = themes[`light_${nextName}`]\n }\n\n if (process.env.NODE_ENV === 'development') {\n if (debug) {\n // eslint-disable-next-line no-console\n console.log('getNextTheme', this.getCN(nextName), { props, nextName, parentName })\n }\n }\n\n return {\n name: nextName,\n theme: getThemeUnwrapped(theme),\n className: this.getCN(nextName),\n }\n }\n\n getCN(name: string) {\n return `${THEME_CLASSNAME_PREFIX}${name} t_Theme`.replace('light_', '').replace('dark_', '')\n }\n\n track(uuid: any, keys: Set<string>) {\n if (!this.name) return\n this.keys.set(uuid, keys)\n }\n\n notify() {\n if (!this.name) {\n this.keys.clear()\n }\n for (const [uuid, keys] of this.keys.entries()) {\n if (keys.size) {\n this.listeners.get(uuid)?.()\n }\n }\n this.themeListeners.forEach((cb) => cb(this.name, this))\n }\n\n onChangeTheme(cb: ThemeListener) {\n this.themeListeners.add(cb)\n return () => {\n this.themeListeners.delete(cb)\n }\n }\n}\n\nexport const ThemeManagerContext = createContext<ThemeManager | null>(null)\nexport const emptyManager = new ThemeManager()\n\nconst withoutComponentName = (name: string) => name.replace(/(
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import { createContext } from 'react'\n\nimport { getThemes } from '../config'\nimport { THEME_CLASSNAME_PREFIX, THEME_NAME_SEPARATOR } from '../constants/constants'\nimport { getThemeUnwrapped } from '../hooks/getThemeUnwrapped'\nimport { ThemeParsed, Themes } from '../types'\n\ntype ThemeListener = (name: string | null, themeManager: ThemeManager) => void\n\nexport type SetActiveThemeProps = {\n className?: string\n parentManager?: ThemeManager | null\n name?: string | null\n theme?: any\n}\n\nexport type GetNextThemeProps = {\n themes?: Themes\n name?: string | null\n componentName?: string | null\n reset?: boolean\n}\n\nexport class ThemeManager {\n keys = new Map<any, Set<string>>()\n listeners = new Map<any, Function>()\n themeListeners = new Set<ThemeListener>()\n\n constructor(\n public name: string = '',\n public className: string = '',\n public theme: ThemeParsed | null = null,\n public parentManager: ThemeManager | null = null,\n public reset: boolean = false\n ) {\n // find the nearest different parentManager\n let parent = parentManager\n let tries = 0\n while (true) {\n tries++\n if (tries > 10) {\n throw new Error(`Nested 10 of the same theme in a row, likely error`)\n }\n if (!parent) break\n if (parent.name === name) {\n // go up if same\n parent = parent.parentManager\n } else {\n this.parentManager = parent\n break\n }\n }\n }\n\n get didChangeTheme() {\n return this.parentManager && this.name !== this.parentManager.fullName\n }\n\n get parentName() {\n return this.parentManager?.name || null\n }\n\n get fullName(): string {\n return this.getNextTheme().name || this.name || ''\n // const parentName = this.parentManager?.fullName || ''\n // const name = this.name || ''\n // const parts = [...new Set([...`${parentName}_${name}`.split('_')])].filter(Boolean)\n // return parts.join('_')\n }\n\n // gets value going up to parents\n getValue(key: string) {\n let theme = this.theme\n let manager = this as ThemeManager | null\n while (true) {\n if (!theme) return\n if (key in theme) {\n return theme[key]\n }\n manager = this.parentManager\n if (!manager || manager.theme === theme) {\n return\n }\n theme = manager.theme\n }\n }\n\n isTracking(uuid: Object) {\n return Boolean(this.keys.get(uuid)?.size)\n }\n\n update({ name, theme, className }: SetActiveThemeProps = {}, force = false, notify = true) {\n if (!force) {\n // className compare on web, avoids light/dark re-renders\n const nameChanged = name !== this.name\n if (!nameChanged) {\n return false\n }\n }\n this.className = className || ''\n this.name = name || ''\n this.theme = theme\n if (notify) {\n this.notify()\n }\n return true\n }\n\n getNextTheme(\n props: GetNextThemeProps = {},\n debug?: any\n ): {\n name: string\n theme: ThemeParsed | null\n className: string | undefined\n } {\n const { themes = getThemes(), name, componentName } = props\n\n if (props.reset && name) {\n return {\n name: name,\n theme: themes[name] as ThemeParsed,\n className: this.getCN(name),\n }\n }\n\n const parentIsReset = this.parentManager?.reset\n\n if (!name) {\n if (componentName) {\n // allow for _Card_Button or just _Button\n const names = [\n `${this.name}_${componentName}`,\n `${withoutComponentName(this.name)}_${componentName}`,\n ]\n for (const name of names) {\n if (name in themes) {\n const className = this.getCN(name)\n return { name, theme: themes[name], className }\n }\n }\n }\n return {\n name: this.name,\n theme: this.theme,\n className: this.className,\n }\n }\n\n let nextName = name || this.name || ''\n let parentName = parentIsReset ? this.parentName || this.fullName : this.fullName\n\n while (true) {\n if (nextName in themes) break\n nextName = `${parentName}_${name}`\n if (nextName in themes) break\n // this is fine - some themes can not have parents\n if (!parentName.includes(THEME_NAME_SEPARATOR)) break\n // go up one\n parentName = parentName.slice(0, parentName.lastIndexOf(THEME_NAME_SEPARATOR))\n }\n\n if (componentName) {\n // allow for _Card_Button or just _Button\n const names = [\n `${nextName}_${componentName}`,\n `${withoutComponentName(nextName)}_${componentName}`,\n ]\n for (const name of names) {\n if (name in themes) {\n nextName = name\n }\n }\n }\n\n let theme = themes[nextName]\n if (!theme) {\n theme = themes[`light_${nextName}`]\n }\n\n if (process.env.NODE_ENV === 'development') {\n if (debug) {\n // eslint-disable-next-line no-console\n console.log('getNextTheme', this.getCN(nextName), { props, nextName, parentName })\n }\n }\n\n return {\n name: nextName,\n theme: getThemeUnwrapped(theme),\n className: this.getCN(nextName),\n }\n }\n\n getCN(name: string) {\n return `${THEME_CLASSNAME_PREFIX}${name} t_Theme`.replace('light_', '').replace('dark_', '')\n }\n\n track(uuid: any, keys: Set<string>) {\n if (!this.name) return\n this.keys.set(uuid, keys)\n }\n\n notify() {\n if (!this.name) {\n this.keys.clear()\n }\n for (const [uuid, keys] of this.keys.entries()) {\n if (keys.size) {\n this.listeners.get(uuid)?.()\n }\n }\n this.themeListeners.forEach((cb) => cb(this.name, this))\n }\n\n onChangeTheme(cb: ThemeListener) {\n this.themeListeners.add(cb)\n return () => {\n this.themeListeners.delete(cb)\n }\n }\n}\n\nexport const ThemeManagerContext = createContext<ThemeManager | null>(null)\nexport const emptyManager = new ThemeManager()\n\nconst withoutComponentName = (name: string) => name.replace(/(_[A-Z][a-zA-Z]+)+$/g, '')\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["name"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import { getDefaultTamaguiConfig } from "@tamagui/config-default-node";
|
|
2
|
+
import { beforeAll, describe, expect, test } from "vitest";
|
|
3
|
+
import { createTamagui } from "../createTamagui";
|
|
4
|
+
import { ThemeManager } from "./ThemeManager";
|
|
5
|
+
describe("ThemeManager", () => {
|
|
6
|
+
beforeAll(() => {
|
|
7
|
+
const conf = getDefaultTamaguiConfig();
|
|
8
|
+
createTamagui(conf);
|
|
9
|
+
});
|
|
10
|
+
test("Changes theme to dark", () => {
|
|
11
|
+
const manager = new ThemeManager(void 0, {
|
|
12
|
+
name: "dark"
|
|
13
|
+
});
|
|
14
|
+
expect(manager.state.name).toBe("dark");
|
|
15
|
+
});
|
|
16
|
+
test('Given parent theme "dark" and child theme "red" to return theme "dark_red"', () => {
|
|
17
|
+
const parent = new ThemeManager(void 0, {
|
|
18
|
+
name: "dark"
|
|
19
|
+
});
|
|
20
|
+
const child = new ThemeManager(parent, {
|
|
21
|
+
name: "red"
|
|
22
|
+
});
|
|
23
|
+
expect(parent.state.name).toBe("dark");
|
|
24
|
+
expect(child.state.name).toBe("dark_red");
|
|
25
|
+
});
|
|
26
|
+
test('Given parent theme "dark", child theme "red_alt2" and component "Button" returns "dark_red_alt2_Button"', () => {
|
|
27
|
+
const parent = new ThemeManager(void 0, {
|
|
28
|
+
name: "dark"
|
|
29
|
+
});
|
|
30
|
+
const child1 = new ThemeManager(parent, {
|
|
31
|
+
name: "red"
|
|
32
|
+
});
|
|
33
|
+
expect(child1.state.name).toBe("dark_red");
|
|
34
|
+
const child2 = new ThemeManager(child1, {
|
|
35
|
+
name: "alt2",
|
|
36
|
+
componentName: "Button"
|
|
37
|
+
});
|
|
38
|
+
expect(child2.state.name).toBe("dark_red_alt2_Button");
|
|
39
|
+
});
|
|
40
|
+
test('Inverts "light" to "dark"', () => {
|
|
41
|
+
const parent = new ThemeManager(void 0, {
|
|
42
|
+
name: "light"
|
|
43
|
+
});
|
|
44
|
+
const child = new ThemeManager(parent, {
|
|
45
|
+
name: "dark"
|
|
46
|
+
});
|
|
47
|
+
expect(parent.state.name).toBe("light");
|
|
48
|
+
expect(child.state.name).toBe("dark");
|
|
49
|
+
});
|
|
50
|
+
test('Inverts "light_red" to "dark_red"', () => {
|
|
51
|
+
const parent = new ThemeManager(void 0, {
|
|
52
|
+
name: "light"
|
|
53
|
+
});
|
|
54
|
+
const child1 = new ThemeManager(parent, {
|
|
55
|
+
name: "red",
|
|
56
|
+
inverse: true
|
|
57
|
+
});
|
|
58
|
+
expect(child1.state.name).toBe("dark_red");
|
|
59
|
+
});
|
|
60
|
+
});
|
|
61
|
+
//# sourceMappingURL=ThemeManager.test.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/helpers/ThemeManager.test.tsx"],
|
|
4
|
+
"sourcesContent": ["import { getDefaultTamaguiConfig } from '@tamagui/config-default-node'\nimport { beforeAll, describe, expect, test } from 'vitest'\n\nimport { createTamagui } from '../createTamagui'\nimport { ThemeManager } from './ThemeManager'\n\ndescribe('ThemeManager', () => {\n beforeAll(() => {\n const conf = getDefaultTamaguiConfig()\n createTamagui(conf)\n })\n\n test('Changes theme to dark', () => {\n const manager = new ThemeManager(undefined, {\n name: 'dark',\n })\n expect(manager.state.name).toBe('dark')\n })\n\n test('Given parent theme \"dark\" and child theme \"red\" to return theme \"dark_red\"', () => {\n const parent = new ThemeManager(undefined, {\n name: 'dark',\n })\n const child = new ThemeManager(parent, {\n name: 'red',\n })\n expect(parent.state.name).toBe('dark')\n expect(child.state.name).toBe('dark_red')\n })\n\n test('Given parent theme \"dark\", child theme \"red_alt2\" and component \"Button\" returns \"dark_red_alt2_Button\"', () => {\n const parent = new ThemeManager(undefined, {\n name: 'dark',\n })\n const child1 = new ThemeManager(parent, {\n name: 'red',\n })\n expect(child1.state.name).toBe('dark_red')\n const child2 = new ThemeManager(child1, {\n name: 'alt2',\n componentName: 'Button',\n })\n expect(child2.state.name).toBe('dark_red_alt2_Button')\n })\n\n test('Inverts \"light\" to \"dark\"', () => {\n const parent = new ThemeManager(undefined, {\n name: 'light',\n })\n const child = new ThemeManager(parent, {\n name: 'dark',\n })\n expect(parent.state.name).toBe('light')\n expect(child.state.name).toBe('dark')\n })\n\n test('Inverts \"light_red\" to \"dark_red\"', () => {\n const parent = new ThemeManager(undefined, {\n name: 'light',\n })\n const child1 = new ThemeManager(parent, {\n name: 'red',\n inverse: true,\n })\n expect(child1.state.name).toBe('dark_red')\n })\n})\n"],
|
|
5
|
+
"mappings": "AAAA,SAAS,+BAA+B;AACxC,SAAS,WAAW,UAAU,QAAQ,YAAY;AAElD,SAAS,qBAAqB;AAC9B,SAAS,oBAAoB;AAE7B,SAAS,gBAAgB,MAAM;AAC7B,YAAU,MAAM;AACd,UAAM,OAAO,wBAAwB;AACrC,kBAAc,IAAI;AAAA,EACpB,CAAC;AAED,OAAK,yBAAyB,MAAM;AAClC,UAAM,UAAU,IAAI,aAAa,QAAW;AAAA,MAC1C,MAAM;AAAA,IACR,CAAC;AACD,WAAO,QAAQ,MAAM,IAAI,EAAE,KAAK,MAAM;AAAA,EACxC,CAAC;AAED,OAAK,8EAA8E,MAAM;AACvF,UAAM,SAAS,IAAI,aAAa,QAAW;AAAA,MACzC,MAAM;AAAA,IACR,CAAC;AACD,UAAM,QAAQ,IAAI,aAAa,QAAQ;AAAA,MACrC,MAAM;AAAA,IACR,CAAC;AACD,WAAO,OAAO,MAAM,IAAI,EAAE,KAAK,MAAM;AACrC,WAAO,MAAM,MAAM,IAAI,EAAE,KAAK,UAAU;AAAA,EAC1C,CAAC;AAED,OAAK,2GAA2G,MAAM;AACpH,UAAM,SAAS,IAAI,aAAa,QAAW;AAAA,MACzC,MAAM;AAAA,IACR,CAAC;AACD,UAAM,SAAS,IAAI,aAAa,QAAQ;AAAA,MACtC,MAAM;AAAA,IACR,CAAC;AACD,WAAO,OAAO,MAAM,IAAI,EAAE,KAAK,UAAU;AACzC,UAAM,SAAS,IAAI,aAAa,QAAQ;AAAA,MACtC,MAAM;AAAA,MACN,eAAe;AAAA,IACjB,CAAC;AACD,WAAO,OAAO,MAAM,IAAI,EAAE,KAAK,sBAAsB;AAAA,EACvD,CAAC;AAED,OAAK,6BAA6B,MAAM;AACtC,UAAM,SAAS,IAAI,aAAa,QAAW;AAAA,MACzC,MAAM;AAAA,IACR,CAAC;AACD,UAAM,QAAQ,IAAI,aAAa,QAAQ;AAAA,MACrC,MAAM;AAAA,IACR,CAAC;AACD,WAAO,OAAO,MAAM,IAAI,EAAE,KAAK,OAAO;AACtC,WAAO,MAAM,MAAM,IAAI,EAAE,KAAK,MAAM;AAAA,EACtC,CAAC;AAED,OAAK,qCAAqC,MAAM;AAC9C,UAAM,SAAS,IAAI,aAAa,QAAW;AAAA,MACzC,MAAM;AAAA,IACR,CAAC;AACD,UAAM,SAAS,IAAI,aAAa,QAAQ;AAAA,MACtC,MAAM;AAAA,MACN,SAAS;AAAA,IACX,CAAC;AACD,WAAO,OAAO,MAAM,IAAI,EAAE,KAAK,UAAU;AAAA,EAC3C,CAAC;AACH,CAAC;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -398,8 +398,6 @@ const getSplitStyles = (props, staticConfig, theme, state, parentSplitStyles, la
|
|
|
398
398
|
}
|
|
399
399
|
if (shouldDoClasses) {
|
|
400
400
|
const pseudoStyles = getAtomicStyle(pseudoStyleObject, descriptor);
|
|
401
|
-
if (debug)
|
|
402
|
-
console.log("pseudoStyles", pseudoStyles);
|
|
403
401
|
for (const psuedoStyle of pseudoStyles) {
|
|
404
402
|
const fullKey = `${psuedoStyle.property}${PROP_SPLIT}${descriptor.name}`;
|
|
405
403
|
if (!usedKeys[fullKey]) {
|