@tamagui/core 1.0.1-beta.219 → 1.0.1-beta.221
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/addTheme.js +7 -10
- package/dist/cjs/addTheme.js.map +3 -3
- package/dist/cjs/config.js +8 -4
- package/dist/cjs/config.js.map +2 -2
- package/dist/cjs/{hooks/useUnmountEffect.js → contexts/ButtonNestingContext.js} +7 -9
- package/dist/cjs/contexts/ButtonNestingContext.js.map +7 -0
- package/dist/cjs/createComponent.js +63 -67
- package/dist/cjs/createComponent.js.map +3 -3
- 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/createTamagui.js +13 -12
- package/dist/cjs/createTamagui.js.map +2 -2
- package/dist/cjs/createTokens.js.map +2 -2
- package/dist/cjs/createTokens.test.js +27 -0
- package/dist/cjs/createTokens.test.js.map +7 -0
- package/dist/cjs/createVariable.js +4 -9
- package/dist/cjs/createVariable.js.map +2 -2
- package/dist/cjs/createVariable.test.js +7 -0
- package/dist/cjs/createVariable.test.js.map +7 -0
- package/dist/cjs/createVariables.js +6 -7
- package/dist/cjs/createVariables.js.map +2 -2
- package/dist/cjs/helpers/ThemeManager.js +161 -147
- package/dist/cjs/helpers/ThemeManager.js.map +3 -3
- package/dist/cjs/helpers/ThemeManager.test.js +449 -0
- package/dist/cjs/helpers/ThemeManager.test.js.map +7 -0
- package/dist/cjs/helpers/{getTokens.js → ThemeManagerContext.js} +8 -8
- package/dist/cjs/helpers/ThemeManagerContext.js.map +7 -0
- package/dist/cjs/helpers/createPropMapper.js +4 -4
- package/dist/cjs/helpers/createPropMapper.js.map +2 -2
- package/dist/cjs/helpers/extendStaticConfig.js +2 -4
- package/dist/cjs/helpers/extendStaticConfig.js.map +2 -2
- package/dist/cjs/helpers/{assignNativePropsToWeb.native.js → getBoundingClientRect.js} +15 -8
- package/dist/cjs/helpers/getBoundingClientRect.js.map +7 -0
- package/dist/cjs/{hooks/useConstant.js → helpers/getRect.js} +14 -17
- package/dist/cjs/helpers/getRect.js.map +7 -0
- package/dist/cjs/helpers/getSplitStyles.js +82 -87
- package/dist/cjs/helpers/getSplitStyles.js.map +3 -3
- package/dist/cjs/helpers/getStylesAtomic.native.js.map +2 -2
- package/dist/cjs/helpers/getThemeCSSRules.js +6 -2
- package/dist/cjs/helpers/getThemeCSSRules.js.map +2 -2
- package/dist/cjs/helpers/insertStyleRule.js +1 -1
- package/dist/cjs/helpers/insertStyleRule.js.map +2 -2
- package/dist/cjs/helpers/mergeTransform.js +11 -8
- package/dist/cjs/helpers/mergeTransform.js.map +2 -2
- package/dist/cjs/helpers/pseudoDescriptors.js +1 -0
- package/dist/cjs/helpers/pseudoDescriptors.js.map +2 -2
- package/dist/cjs/helpers/themeable.js +9 -9
- package/dist/cjs/helpers/themeable.js.map +2 -2
- package/dist/cjs/hooks/useElementLayout.js +4 -12
- package/dist/cjs/hooks/useElementLayout.js.map +2 -2
- package/dist/cjs/hooks/useMedia.js +2 -1
- package/dist/cjs/hooks/useMedia.js.map +2 -2
- package/dist/cjs/hooks/useTheme.js +114 -156
- package/dist/cjs/hooks/useTheme.js.map +3 -3
- package/dist/cjs/hooks/{useIsMounted.js → useThemeName.js} +23 -14
- package/dist/cjs/hooks/useThemeName.js.map +7 -0
- package/dist/cjs/index.js +2 -5
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/setupReactNative.js +20 -7
- package/dist/cjs/setupReactNative.js.map +2 -2
- package/dist/cjs/styled.js +2 -19
- package/dist/cjs/styled.js.map +2 -2
- package/dist/cjs/types.js.map +1 -1
- package/dist/cjs/updateTheme.js +9 -9
- package/dist/cjs/updateTheme.js.map +2 -2
- package/dist/cjs/views/TamaguiProvider.js +3 -3
- package/dist/cjs/views/TamaguiProvider.js.map +2 -2
- package/dist/cjs/views/Theme.js +39 -28
- package/dist/cjs/views/Theme.js.map +3 -3
- package/dist/cjs/views/ThemeInverse.js +4 -2
- package/dist/cjs/views/ThemeInverse.js.map +2 -2
- package/dist/cjs/views/ThemeProvider.js +8 -33
- package/dist/cjs/views/ThemeProvider.js.map +3 -3
- package/dist/esm/addTheme.js +7 -10
- package/dist/esm/addTheme.js.map +3 -3
- package/dist/esm/config.js +8 -3
- package/dist/esm/config.js.map +2 -2
- package/dist/esm/contexts/ButtonNestingContext.js +6 -0
- package/dist/esm/contexts/ButtonNestingContext.js.map +7 -0
- package/dist/esm/createComponent.js +65 -70
- package/dist/esm/createComponent.js.map +3 -3
- 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/createTamagui.js +13 -12
- package/dist/esm/createTamagui.js.map +2 -2
- package/dist/esm/createTokens.js.map +2 -2
- package/dist/esm/createTokens.test.js +26 -0
- package/dist/esm/createTokens.test.js.map +7 -0
- package/dist/esm/createVariable.js +4 -9
- package/dist/esm/createVariable.js.map +2 -2
- package/dist/esm/createVariable.test.js +6 -0
- package/dist/esm/createVariable.test.js.map +7 -0
- package/dist/esm/createVariables.js +6 -7
- package/dist/esm/createVariables.js.map +2 -2
- package/dist/esm/helpers/ThemeManager.js +140 -144
- package/dist/esm/helpers/ThemeManager.js.map +3 -3
- package/dist/esm/helpers/ThemeManager.test.js +448 -0
- package/dist/esm/helpers/ThemeManager.test.js.map +7 -0
- package/dist/esm/helpers/ThemeManagerContext.js +6 -0
- package/dist/esm/helpers/ThemeManagerContext.js.map +7 -0
- package/dist/esm/helpers/createPropMapper.js +4 -4
- package/dist/esm/helpers/createPropMapper.js.map +2 -2
- package/dist/esm/helpers/extendStaticConfig.js +2 -4
- package/dist/esm/helpers/extendStaticConfig.js.map +2 -2
- package/dist/esm/helpers/getBoundingClientRect.js +13 -0
- package/dist/esm/helpers/getBoundingClientRect.js.map +7 -0
- package/dist/esm/helpers/getRect.js +12 -0
- package/dist/esm/helpers/getRect.js.map +7 -0
- package/dist/esm/helpers/getSplitStyles.js +90 -89
- package/dist/esm/helpers/getSplitStyles.js.map +3 -3
- package/dist/esm/helpers/getStylesAtomic.native.js.map +2 -2
- package/dist/esm/helpers/getThemeCSSRules.js +6 -2
- package/dist/esm/helpers/getThemeCSSRules.js.map +2 -2
- package/dist/esm/helpers/insertStyleRule.js +1 -1
- package/dist/esm/helpers/insertStyleRule.js.map +2 -2
- package/dist/esm/helpers/mergeTransform.js +8 -6
- package/dist/esm/helpers/mergeTransform.js.map +2 -2
- package/dist/esm/helpers/pseudoDescriptors.js +1 -0
- package/dist/esm/helpers/pseudoDescriptors.js.map +2 -2
- package/dist/esm/helpers/themeable.js +9 -9
- package/dist/esm/helpers/themeable.js.map +2 -2
- package/dist/esm/hooks/useElementLayout.js +2 -9
- package/dist/esm/hooks/useElementLayout.js.map +2 -2
- package/dist/esm/hooks/useMedia.js +3 -2
- package/dist/esm/hooks/useMedia.js.map +2 -2
- package/dist/esm/hooks/useTheme.js +114 -159
- package/dist/esm/hooks/useTheme.js.map +3 -3
- package/dist/esm/hooks/useThemeName.js +25 -0
- package/dist/esm/hooks/useThemeName.js.map +7 -0
- package/dist/esm/index.js +3 -5
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/setupReactNative.js +18 -6
- package/dist/esm/setupReactNative.js.map +2 -2
- package/dist/esm/styled.js +3 -20
- package/dist/esm/styled.js.map +2 -2
- package/dist/esm/updateTheme.js +9 -9
- package/dist/esm/updateTheme.js.map +2 -2
- package/dist/esm/views/TamaguiProvider.js +4 -4
- package/dist/esm/views/TamaguiProvider.js.map +2 -2
- package/dist/esm/views/Theme.js +40 -29
- package/dist/esm/views/Theme.js.map +3 -3
- package/dist/esm/views/ThemeInverse.js +4 -2
- package/dist/esm/views/ThemeInverse.js.map +2 -2
- package/dist/esm/views/ThemeProvider.js +8 -27
- package/dist/esm/views/ThemeProvider.js.map +2 -2
- package/package.json +13 -13
- package/src/__snapshots__/createTokens.test.ts.snap +877 -0
- package/src/addTheme.ts +9 -12
- package/src/config.ts +10 -2
- package/src/contexts/ButtonNestingContext.tsx +3 -0
- package/src/createComponent.tsx +117 -108
- package/src/createFont.test.ts +129 -0
- package/src/createFont.ts +12 -5
- package/src/createTamagui.ts +16 -14
- package/src/createTokens.test.ts +29 -0
- package/src/createTokens.ts +1 -1
- package/src/createVariable.test.ts +7 -0
- package/src/createVariable.ts +4 -10
- package/src/createVariables.ts +7 -7
- package/src/helpers/ThemeManager.test.tsx +480 -0
- package/src/helpers/ThemeManager.tsx +171 -166
- package/src/helpers/ThemeManagerContext.tsx +5 -0
- package/src/helpers/createPropMapper.ts +4 -4
- package/src/helpers/extendStaticConfig.ts +4 -4
- package/src/helpers/getBoundingClientRect.tsx +7 -0
- package/src/helpers/getRect.tsx +8 -0
- package/src/helpers/getSplitStyles.tsx +98 -94
- package/src/helpers/getStylesAtomic.native.ts +1 -0
- package/src/helpers/getThemeCSSRules.ts +9 -2
- package/src/helpers/insertStyleRule.tsx +2 -2
- package/src/helpers/mergeTransform.ts +13 -6
- package/src/helpers/pseudoDescriptors.ts +1 -0
- package/src/helpers/themeable.tsx +17 -9
- package/src/hooks/useElementLayout.tsx +3 -8
- package/src/hooks/useMedia.tsx +3 -3
- package/src/hooks/useTheme.tsx +138 -211
- package/src/hooks/useThemeName.tsx +25 -0
- package/src/index.ts +3 -4
- package/src/setupReactNative.ts +16 -5
- package/src/styled.tsx +4 -23
- package/src/types.tsx +42 -17
- package/src/updateTheme.ts +12 -9
- package/src/views/TamaguiProvider.tsx +5 -5
- package/src/views/Theme.tsx +48 -39
- package/src/views/ThemeProvider.tsx +11 -33
- package/types/Tamagui.d.ts +1 -1
- package/types/addTheme.d.ts +23 -2
- package/types/config.d.ts +0 -1
- package/types/contexts/ButtonNestingContext.d.ts +3 -0
- package/types/createFont.test.d.ts +2 -0
- package/types/createTokens.test.d.ts +2 -0
- package/types/createVariable.d.ts +2 -2
- package/types/createVariable.test.d.ts +2 -0
- package/types/helpers/ThemeManager.d.ts +20 -30
- package/types/helpers/ThemeManager.test.d.ts +2 -0
- package/types/helpers/ThemeManagerContext.d.ts +4 -0
- package/types/helpers/getBoundingClientRect.d.ts +2 -0
- package/types/helpers/getRect.d.ts +9 -0
- package/types/helpers/insertStyleRule.d.ts +1 -1
- package/types/helpers/mergeTransform.d.ts +5 -3
- package/types/helpers/themeable.d.ts +3 -0
- package/types/hooks/useElementLayout.d.ts +0 -8
- package/types/hooks/useTheme.d.ts +10 -20
- package/types/hooks/useThemeName.d.ts +5 -0
- package/types/index.d.ts +3 -4
- package/types/setupReactNative.d.ts +4 -2
- package/types/types.d.ts +35 -10
- package/types/updateTheme.d.ts +23 -2
- package/types/views/Theme.d.ts +3 -4
- package/dist/cjs/constants/platform.js +0 -74
- package/dist/cjs/constants/platform.js.map +0 -7
- package/dist/cjs/constants/platform.native.js +0 -62
- package/dist/cjs/constants/platform.native.js.map +0 -7
- package/dist/cjs/helpers/assignNativePropsToWeb.js +0 -188
- package/dist/cjs/helpers/assignNativePropsToWeb.js.map +0 -7
- package/dist/cjs/helpers/assignNativePropsToWeb.native.js.map +0 -7
- package/dist/cjs/helpers/calc.js +0 -71
- package/dist/cjs/helpers/calc.js.map +0 -7
- package/dist/cjs/helpers/getFont.js +0 -66
- package/dist/cjs/helpers/getFont.js.map +0 -7
- package/dist/cjs/helpers/getStackSize.js +0 -46
- package/dist/cjs/helpers/getStackSize.js.map +0 -7
- package/dist/cjs/helpers/getTokens.js.map +0 -7
- package/dist/cjs/helpers/startTransition.js +0 -36
- package/dist/cjs/helpers/startTransition.js.map +0 -7
- package/dist/cjs/helpers/validate.js +0 -2
- package/dist/cjs/helpers/validate.js.map +0 -7
- package/dist/cjs/hooks/useConstant.js.map +0 -7
- package/dist/cjs/hooks/useIsMounted.js.map +0 -7
- package/dist/cjs/hooks/usePressable.js +0 -36
- package/dist/cjs/hooks/usePressable.js.map +0 -7
- package/dist/cjs/hooks/useUnmountEffect.js.map +0 -7
- package/dist/cjs/injectStyles.js +0 -40
- package/dist/cjs/injectStyles.js.map +0 -7
- package/dist/cjs/react-native.js +0 -22
- package/dist/cjs/react-native.js.map +0 -7
- package/dist/esm/constants/platform.js +0 -39
- package/dist/esm/constants/platform.js.map +0 -7
- package/dist/esm/constants/platform.native.js +0 -28
- package/dist/esm/constants/platform.native.js.map +0 -7
- package/dist/esm/helpers/assignNativePropsToWeb.js +0 -164
- package/dist/esm/helpers/assignNativePropsToWeb.js.map +0 -7
- package/dist/esm/helpers/assignNativePropsToWeb.native.js +0 -6
- package/dist/esm/helpers/assignNativePropsToWeb.native.js.map +0 -7
- package/dist/esm/helpers/calc.js +0 -47
- package/dist/esm/helpers/calc.js.map +0 -7
- package/dist/esm/helpers/getFont.js +0 -42
- package/dist/esm/helpers/getFont.js.map +0 -7
- package/dist/esm/helpers/getStackSize.js +0 -22
- package/dist/esm/helpers/getStackSize.js.map +0 -7
- package/dist/esm/helpers/getTokens.js +0 -6
- package/dist/esm/helpers/getTokens.js.map +0 -7
- package/dist/esm/helpers/startTransition.js +0 -6
- package/dist/esm/helpers/startTransition.js.map +0 -7
- package/dist/esm/helpers/validate.js +0 -1
- package/dist/esm/helpers/validate.js.map +0 -7
- package/dist/esm/hooks/useConstant.js +0 -15
- package/dist/esm/hooks/useConstant.js.map +0 -7
- package/dist/esm/hooks/useIsMounted.js +0 -16
- package/dist/esm/hooks/useIsMounted.js.map +0 -7
- package/dist/esm/hooks/usePressable.js +0 -12
- package/dist/esm/hooks/usePressable.js.map +0 -7
- package/dist/esm/hooks/useUnmountEffect.js +0 -8
- package/dist/esm/hooks/useUnmountEffect.js.map +0 -7
- package/dist/esm/injectStyles.js +0 -16
- package/dist/esm/injectStyles.js.map +0 -7
- package/dist/esm/react-native.js +0 -3
- package/dist/esm/react-native.js.map +0 -7
- package/src/contexts/ButtonInsideButtonContext.tsx +0 -3
- package/src/contexts/ThemeContext.tsx +0 -5
- package/src/helpers/areEqualSets.tsx +0 -9
- package/src/views/ThemeInverse.tsx +0 -40
- package/src/views/ThemeReset.tsx +0 -43
- package/types/constants/platform.d.ts +0 -13
- package/types/constants/platform.native.d.ts +0 -13
- package/types/contexts/ButtonInsideButtonContext.d.ts +0 -3
- package/types/contexts/ThemeContext.d.ts +0 -7
- package/types/helpers/areEqualSets.d.ts +0 -2
- package/types/helpers/assignNativePropsToWeb.d.ts +0 -2
- package/types/helpers/assignNativePropsToWeb.native.d.ts +0 -2
- package/types/helpers/calc.d.ts +0 -1
- package/types/helpers/getFont.d.ts +0 -3
- package/types/helpers/getStackSize.d.ts +0 -8
- package/types/helpers/getTokens.d.ts +0 -2
- package/types/helpers/startTransition.d.ts +0 -3
- package/types/helpers/validate.d.ts +0 -1
- package/types/hooks/useConstant.d.ts +0 -2
- package/types/hooks/useIsMounted.d.ts +0 -3
- package/types/hooks/useMedia.test.d.ts +0 -1
- package/types/hooks/usePressable.d.ts +0 -3
- package/types/hooks/usePressablePressResponder.d.ts +0 -84
- package/types/hooks/useUnmountEffect.d.ts +0 -2
- package/types/injectStyles.d.ts +0 -7
- package/types/react-native.d.ts +0 -8
- package/types/views/AbsoluteFill.d.ts +0 -5
- package/types/views/AbsoluteFill.native.d.ts +0 -3
- package/types/views/ThemeInverse.d.ts +0 -9
- package/types/views/ThemeReset.d.ts +0 -4
|
@@ -0,0 +1,448 @@
|
|
|
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
|
+
const conf = getDefaultTamaguiConfig();
|
|
6
|
+
describe("ThemeManager", () => {
|
|
7
|
+
beforeAll(() => {
|
|
8
|
+
createTamagui(conf);
|
|
9
|
+
});
|
|
10
|
+
test("Changes theme to dark", () => {
|
|
11
|
+
const manager = new ThemeManager(
|
|
12
|
+
{
|
|
13
|
+
name: "dark"
|
|
14
|
+
},
|
|
15
|
+
"root"
|
|
16
|
+
);
|
|
17
|
+
expect(manager.state.name).toBe("dark");
|
|
18
|
+
});
|
|
19
|
+
test('Given parent theme "dark" and child theme "red" to return theme "dark_red"', () => {
|
|
20
|
+
const parent = new ThemeManager(
|
|
21
|
+
{
|
|
22
|
+
name: "dark"
|
|
23
|
+
},
|
|
24
|
+
"root"
|
|
25
|
+
);
|
|
26
|
+
const child = new ThemeManager(
|
|
27
|
+
{
|
|
28
|
+
name: "red"
|
|
29
|
+
},
|
|
30
|
+
parent
|
|
31
|
+
);
|
|
32
|
+
expect(parent.state.name).toBe("dark");
|
|
33
|
+
expect(child.state.name).toBe("dark_red");
|
|
34
|
+
});
|
|
35
|
+
test('Given parent theme "dark", child theme "red_alt2" and component "Button" returns "dark_red_alt2_Button"', () => {
|
|
36
|
+
const parent = new ThemeManager(
|
|
37
|
+
{
|
|
38
|
+
name: "dark"
|
|
39
|
+
},
|
|
40
|
+
"root"
|
|
41
|
+
);
|
|
42
|
+
const child1 = new ThemeManager(
|
|
43
|
+
{
|
|
44
|
+
name: "red"
|
|
45
|
+
},
|
|
46
|
+
parent
|
|
47
|
+
);
|
|
48
|
+
expect(child1.state.name).toBe("dark_red");
|
|
49
|
+
const child2 = new ThemeManager(
|
|
50
|
+
{
|
|
51
|
+
name: "alt2",
|
|
52
|
+
componentName: "Button"
|
|
53
|
+
},
|
|
54
|
+
child1
|
|
55
|
+
);
|
|
56
|
+
expect(child2.state.name).toBe("dark_red_alt2_Button");
|
|
57
|
+
});
|
|
58
|
+
test('Given parent theme "dark", child theme "red" and component "Button" returns "dark_red_Button"', () => {
|
|
59
|
+
const parent = new ThemeManager(
|
|
60
|
+
{
|
|
61
|
+
name: "dark"
|
|
62
|
+
},
|
|
63
|
+
"root"
|
|
64
|
+
);
|
|
65
|
+
const child1 = new ThemeManager(
|
|
66
|
+
{
|
|
67
|
+
name: "red"
|
|
68
|
+
},
|
|
69
|
+
parent
|
|
70
|
+
);
|
|
71
|
+
expect(child1.state.name).toBe("dark_red");
|
|
72
|
+
const child2 = new ThemeManager(
|
|
73
|
+
{
|
|
74
|
+
componentName: "Button"
|
|
75
|
+
},
|
|
76
|
+
child1
|
|
77
|
+
);
|
|
78
|
+
expect(child2.state.name).toBe("dark_red_Button");
|
|
79
|
+
});
|
|
80
|
+
test('Given parent theme "dark", child theme "red" and missing component "Card" returns "dark_red"', () => {
|
|
81
|
+
const parent = new ThemeManager(
|
|
82
|
+
{
|
|
83
|
+
name: "dark"
|
|
84
|
+
},
|
|
85
|
+
"root"
|
|
86
|
+
);
|
|
87
|
+
const child1 = new ThemeManager(
|
|
88
|
+
{
|
|
89
|
+
name: "red"
|
|
90
|
+
},
|
|
91
|
+
parent
|
|
92
|
+
);
|
|
93
|
+
expect(child1.state.name).toBe("dark_red");
|
|
94
|
+
const child2 = new ThemeManager(
|
|
95
|
+
{
|
|
96
|
+
componentName: "Card"
|
|
97
|
+
},
|
|
98
|
+
child1
|
|
99
|
+
);
|
|
100
|
+
expect(child2.state.name).toBe("dark_red");
|
|
101
|
+
});
|
|
102
|
+
test('Changes "light" to "dark"', () => {
|
|
103
|
+
const parent = new ThemeManager(
|
|
104
|
+
{
|
|
105
|
+
name: "light"
|
|
106
|
+
},
|
|
107
|
+
"root"
|
|
108
|
+
);
|
|
109
|
+
const child = new ThemeManager(
|
|
110
|
+
{
|
|
111
|
+
name: "dark"
|
|
112
|
+
},
|
|
113
|
+
parent
|
|
114
|
+
);
|
|
115
|
+
expect(parent.state.name).toBe("light");
|
|
116
|
+
expect(child.state.name).toBe("dark");
|
|
117
|
+
});
|
|
118
|
+
test('Inverts "light" to "dark"', () => {
|
|
119
|
+
const parent = new ThemeManager(
|
|
120
|
+
{
|
|
121
|
+
name: "light"
|
|
122
|
+
},
|
|
123
|
+
"root"
|
|
124
|
+
);
|
|
125
|
+
const child1 = new ThemeManager(
|
|
126
|
+
{
|
|
127
|
+
inverse: true
|
|
128
|
+
},
|
|
129
|
+
parent
|
|
130
|
+
);
|
|
131
|
+
expect(child1.state.name).toBe("dark");
|
|
132
|
+
});
|
|
133
|
+
test('Inverts "light_red" to "dark_red"', () => {
|
|
134
|
+
const parent = new ThemeManager(
|
|
135
|
+
{
|
|
136
|
+
name: "light"
|
|
137
|
+
},
|
|
138
|
+
"root"
|
|
139
|
+
);
|
|
140
|
+
const child1 = new ThemeManager(
|
|
141
|
+
{
|
|
142
|
+
name: "red",
|
|
143
|
+
inverse: true
|
|
144
|
+
},
|
|
145
|
+
parent
|
|
146
|
+
);
|
|
147
|
+
expect(child1.state.name).toBe("dark_red");
|
|
148
|
+
});
|
|
149
|
+
test("Updates state", () => {
|
|
150
|
+
const parent = new ThemeManager(
|
|
151
|
+
{
|
|
152
|
+
name: "light"
|
|
153
|
+
},
|
|
154
|
+
"root"
|
|
155
|
+
);
|
|
156
|
+
const newState = parent.updateState({
|
|
157
|
+
name: "dark"
|
|
158
|
+
});
|
|
159
|
+
expect(newState).toMatchInlineSnapshot(`
|
|
160
|
+
{
|
|
161
|
+
"className": "t_dark",
|
|
162
|
+
"name": "dark",
|
|
163
|
+
"parentName": "",
|
|
164
|
+
"theme": {
|
|
165
|
+
"background": {
|
|
166
|
+
"isVar": true,
|
|
167
|
+
"key": "color-2",
|
|
168
|
+
"name": "background",
|
|
169
|
+
"val": "#000",
|
|
170
|
+
"variable": "",
|
|
171
|
+
},
|
|
172
|
+
"color": {
|
|
173
|
+
"isVar": true,
|
|
174
|
+
"key": "color-1",
|
|
175
|
+
"name": "color",
|
|
176
|
+
"val": "#fff",
|
|
177
|
+
"variable": "",
|
|
178
|
+
},
|
|
179
|
+
},
|
|
180
|
+
}
|
|
181
|
+
`);
|
|
182
|
+
expect(parent.state.name).toBe("dark");
|
|
183
|
+
});
|
|
184
|
+
test("Returns parent on empty", () => {
|
|
185
|
+
const parent = new ThemeManager(
|
|
186
|
+
{
|
|
187
|
+
name: "light"
|
|
188
|
+
},
|
|
189
|
+
"root"
|
|
190
|
+
);
|
|
191
|
+
const child = new ThemeManager(
|
|
192
|
+
{
|
|
193
|
+
name: null
|
|
194
|
+
},
|
|
195
|
+
parent
|
|
196
|
+
);
|
|
197
|
+
expect(child).toBe(parent);
|
|
198
|
+
});
|
|
199
|
+
test("Resets theme", () => {
|
|
200
|
+
const parent = new ThemeManager(
|
|
201
|
+
{
|
|
202
|
+
name: "light"
|
|
203
|
+
},
|
|
204
|
+
"root"
|
|
205
|
+
);
|
|
206
|
+
const child = new ThemeManager(
|
|
207
|
+
{
|
|
208
|
+
name: "dark"
|
|
209
|
+
},
|
|
210
|
+
parent
|
|
211
|
+
);
|
|
212
|
+
expect(child.state.name).toBe("dark");
|
|
213
|
+
expect(child.parentManager).toBe(parent);
|
|
214
|
+
const child2 = new ThemeManager(
|
|
215
|
+
{
|
|
216
|
+
reset: true
|
|
217
|
+
},
|
|
218
|
+
child
|
|
219
|
+
);
|
|
220
|
+
expect(child2.parentManager).toBe(child);
|
|
221
|
+
expect(child2.state.name).toBe("light");
|
|
222
|
+
});
|
|
223
|
+
test("Nested invert and reset", () => {
|
|
224
|
+
const parent = new ThemeManager(
|
|
225
|
+
{
|
|
226
|
+
name: "light"
|
|
227
|
+
},
|
|
228
|
+
"root"
|
|
229
|
+
);
|
|
230
|
+
const child = new ThemeManager(
|
|
231
|
+
{
|
|
232
|
+
name: "dark"
|
|
233
|
+
},
|
|
234
|
+
parent
|
|
235
|
+
);
|
|
236
|
+
const child2 = new ThemeManager(
|
|
237
|
+
{
|
|
238
|
+
reset: true
|
|
239
|
+
},
|
|
240
|
+
child
|
|
241
|
+
);
|
|
242
|
+
const child3 = new ThemeManager(
|
|
243
|
+
{
|
|
244
|
+
inverse: true
|
|
245
|
+
},
|
|
246
|
+
child2
|
|
247
|
+
);
|
|
248
|
+
expect(child3.state.name).toBe("dark");
|
|
249
|
+
});
|
|
250
|
+
test("Updates from null the new theme nested 3 themes", () => {
|
|
251
|
+
const a = new ThemeManager(
|
|
252
|
+
{
|
|
253
|
+
name: "dark"
|
|
254
|
+
},
|
|
255
|
+
"root"
|
|
256
|
+
);
|
|
257
|
+
const b = new ThemeManager(
|
|
258
|
+
{
|
|
259
|
+
name: "red"
|
|
260
|
+
},
|
|
261
|
+
a
|
|
262
|
+
);
|
|
263
|
+
expect(b.state.name).toBe("dark_red");
|
|
264
|
+
const c = new ThemeManager(
|
|
265
|
+
{
|
|
266
|
+
name: "alt2"
|
|
267
|
+
},
|
|
268
|
+
b
|
|
269
|
+
);
|
|
270
|
+
expect(c.state.name).toBe("dark_red_alt2");
|
|
271
|
+
});
|
|
272
|
+
test("Ignored dup themes", () => {
|
|
273
|
+
const a = new ThemeManager(
|
|
274
|
+
{
|
|
275
|
+
name: "dark"
|
|
276
|
+
},
|
|
277
|
+
"root"
|
|
278
|
+
);
|
|
279
|
+
const b = new ThemeManager(
|
|
280
|
+
{
|
|
281
|
+
name: "dark"
|
|
282
|
+
},
|
|
283
|
+
a
|
|
284
|
+
);
|
|
285
|
+
expect(b === a).toBe(true);
|
|
286
|
+
});
|
|
287
|
+
test("Nested component themes fallback to grandparents", () => {
|
|
288
|
+
const parent = new ThemeManager(
|
|
289
|
+
{
|
|
290
|
+
name: "dark"
|
|
291
|
+
},
|
|
292
|
+
"root"
|
|
293
|
+
);
|
|
294
|
+
const child = new ThemeManager(
|
|
295
|
+
{
|
|
296
|
+
name: "red",
|
|
297
|
+
componentName: "Button"
|
|
298
|
+
},
|
|
299
|
+
parent
|
|
300
|
+
);
|
|
301
|
+
const child2 = new ThemeManager(
|
|
302
|
+
{
|
|
303
|
+
name: "blue"
|
|
304
|
+
},
|
|
305
|
+
child
|
|
306
|
+
);
|
|
307
|
+
expect(child2.state.name).toBe("dark_blue");
|
|
308
|
+
const child3 = new ThemeManager(
|
|
309
|
+
{
|
|
310
|
+
componentName: "Button"
|
|
311
|
+
},
|
|
312
|
+
child2
|
|
313
|
+
);
|
|
314
|
+
expect(child3.state.name).toBe("dark_blue_Button");
|
|
315
|
+
});
|
|
316
|
+
test(`Component theme with sub component that doesn't exist keeps same theme`, () => {
|
|
317
|
+
const parent = new ThemeManager(
|
|
318
|
+
{
|
|
319
|
+
name: "dark"
|
|
320
|
+
},
|
|
321
|
+
"root"
|
|
322
|
+
);
|
|
323
|
+
const child = new ThemeManager(
|
|
324
|
+
{
|
|
325
|
+
name: "red",
|
|
326
|
+
componentName: "Button"
|
|
327
|
+
},
|
|
328
|
+
parent
|
|
329
|
+
);
|
|
330
|
+
const child2 = new ThemeManager(
|
|
331
|
+
{
|
|
332
|
+
componentName: "Spacer"
|
|
333
|
+
},
|
|
334
|
+
child
|
|
335
|
+
);
|
|
336
|
+
expect(child2).toBe(child);
|
|
337
|
+
});
|
|
338
|
+
test(`Doesn't find invalid parent when only passing component`, () => {
|
|
339
|
+
expect(!!conf.themes["dark_Card"]).toBeTruthy();
|
|
340
|
+
const parent = new ThemeManager(
|
|
341
|
+
{
|
|
342
|
+
name: "dark_red"
|
|
343
|
+
},
|
|
344
|
+
"root"
|
|
345
|
+
);
|
|
346
|
+
const child = new ThemeManager(
|
|
347
|
+
{
|
|
348
|
+
componentName: "Card"
|
|
349
|
+
},
|
|
350
|
+
parent
|
|
351
|
+
);
|
|
352
|
+
expect(child.state.name).toBe(parent.state.name);
|
|
353
|
+
});
|
|
354
|
+
test(`Finds sub-theme when componentName and name are passed but componentName doesn't exist`, () => {
|
|
355
|
+
const parent = new ThemeManager(
|
|
356
|
+
{
|
|
357
|
+
name: "dark"
|
|
358
|
+
},
|
|
359
|
+
"root"
|
|
360
|
+
);
|
|
361
|
+
const child = new ThemeManager(
|
|
362
|
+
{
|
|
363
|
+
name: "red",
|
|
364
|
+
componentName: "Missing"
|
|
365
|
+
},
|
|
366
|
+
parent
|
|
367
|
+
);
|
|
368
|
+
expect(child.state.name).toBe("dark_red");
|
|
369
|
+
});
|
|
370
|
+
test(`Uses the full className without the light/dark prefix`, () => {
|
|
371
|
+
const parent = new ThemeManager(
|
|
372
|
+
{
|
|
373
|
+
name: "dark"
|
|
374
|
+
},
|
|
375
|
+
"root"
|
|
376
|
+
);
|
|
377
|
+
const child = new ThemeManager(
|
|
378
|
+
{
|
|
379
|
+
name: "red_alt2"
|
|
380
|
+
},
|
|
381
|
+
parent
|
|
382
|
+
);
|
|
383
|
+
expect(child.state.className).toBe("t_red_alt2");
|
|
384
|
+
const child2 = new ThemeManager(
|
|
385
|
+
{
|
|
386
|
+
name: "red"
|
|
387
|
+
},
|
|
388
|
+
parent
|
|
389
|
+
);
|
|
390
|
+
const child3 = new ThemeManager(
|
|
391
|
+
{
|
|
392
|
+
name: "alt2"
|
|
393
|
+
},
|
|
394
|
+
child2
|
|
395
|
+
);
|
|
396
|
+
expect(child3.state.className).toBe("t_red_alt2");
|
|
397
|
+
});
|
|
398
|
+
test(`Finds component dark_red + Button`, () => {
|
|
399
|
+
const parent = new ThemeManager(
|
|
400
|
+
{
|
|
401
|
+
name: "dark_red"
|
|
402
|
+
},
|
|
403
|
+
"root"
|
|
404
|
+
);
|
|
405
|
+
const child = new ThemeManager(
|
|
406
|
+
{
|
|
407
|
+
name: "dark_red",
|
|
408
|
+
componentName: "Button"
|
|
409
|
+
},
|
|
410
|
+
parent
|
|
411
|
+
);
|
|
412
|
+
expect(child.state.className).toBe("t_red_Button");
|
|
413
|
+
expect(child.state.name).toBe("dark_red_Button");
|
|
414
|
+
});
|
|
415
|
+
test(`Drops componentName if only regular name found at stronger level`, () => {
|
|
416
|
+
const parent = new ThemeManager(
|
|
417
|
+
{
|
|
418
|
+
name: "dark_red"
|
|
419
|
+
},
|
|
420
|
+
"root"
|
|
421
|
+
);
|
|
422
|
+
const child = new ThemeManager(
|
|
423
|
+
{
|
|
424
|
+
name: "alt1",
|
|
425
|
+
componentName: "Button"
|
|
426
|
+
},
|
|
427
|
+
parent
|
|
428
|
+
);
|
|
429
|
+
expect(child.state.name).toBe("dark_red_alt1");
|
|
430
|
+
});
|
|
431
|
+
test(`Component name + theme change when nested already`, () => {
|
|
432
|
+
const parent = new ThemeManager(
|
|
433
|
+
{
|
|
434
|
+
name: "dark_red"
|
|
435
|
+
},
|
|
436
|
+
"root"
|
|
437
|
+
);
|
|
438
|
+
const child = new ThemeManager(
|
|
439
|
+
{
|
|
440
|
+
name: "yellow",
|
|
441
|
+
componentName: "Button"
|
|
442
|
+
},
|
|
443
|
+
parent
|
|
444
|
+
);
|
|
445
|
+
expect(child.state.name).toBe("dark_yellow_Button");
|
|
446
|
+
});
|
|
447
|
+
});
|
|
448
|
+
//# 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\nconst conf = getDefaultTamaguiConfig()\n\ndescribe('ThemeManager', () => {\n beforeAll(() => {\n createTamagui(conf)\n })\n\n test('Changes theme to dark', () => {\n const manager = new ThemeManager(\n {\n name: 'dark',\n },\n 'root'\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(\n {\n name: 'dark',\n },\n 'root'\n )\n const child = new ThemeManager(\n {\n name: 'red',\n },\n parent\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(\n {\n name: 'dark',\n },\n 'root'\n )\n const child1 = new ThemeManager(\n {\n name: 'red',\n },\n parent\n )\n expect(child1.state.name).toBe('dark_red')\n const child2 = new ThemeManager(\n {\n name: 'alt2',\n componentName: 'Button',\n },\n child1\n )\n expect(child2.state.name).toBe('dark_red_alt2_Button')\n })\n\n test('Given parent theme \"dark\", child theme \"red\" and component \"Button\" returns \"dark_red_Button\"', () => {\n const parent = new ThemeManager(\n {\n name: 'dark',\n },\n 'root'\n )\n const child1 = new ThemeManager(\n {\n name: 'red',\n },\n parent\n )\n expect(child1.state.name).toBe('dark_red')\n const child2 = new ThemeManager(\n {\n componentName: 'Button',\n },\n child1\n )\n expect(child2.state.name).toBe('dark_red_Button')\n })\n\n test('Given parent theme \"dark\", child theme \"red\" and missing component \"Card\" returns \"dark_red\"', () => {\n const parent = new ThemeManager(\n {\n name: 'dark',\n },\n 'root'\n )\n const child1 = new ThemeManager(\n {\n name: 'red',\n },\n parent\n )\n expect(child1.state.name).toBe('dark_red')\n const child2 = new ThemeManager(\n {\n componentName: 'Card',\n },\n child1\n )\n expect(child2.state.name).toBe('dark_red')\n })\n\n test('Changes \"light\" to \"dark\"', () => {\n const parent = new ThemeManager(\n {\n name: 'light',\n },\n 'root'\n )\n const child = new ThemeManager(\n {\n name: 'dark',\n },\n parent\n )\n expect(parent.state.name).toBe('light')\n expect(child.state.name).toBe('dark')\n })\n\n test('Inverts \"light\" to \"dark\"', () => {\n const parent = new ThemeManager(\n {\n name: 'light',\n },\n 'root'\n )\n const child1 = new ThemeManager(\n {\n inverse: true,\n },\n parent\n )\n expect(child1.state.name).toBe('dark')\n })\n\n test('Inverts \"light_red\" to \"dark_red\"', () => {\n const parent = new ThemeManager(\n {\n name: 'light',\n },\n 'root'\n )\n const child1 = new ThemeManager(\n {\n name: 'red',\n inverse: true,\n },\n parent\n )\n expect(child1.state.name).toBe('dark_red')\n })\n\n test('Updates state', () => {\n const parent = new ThemeManager(\n {\n name: 'light',\n },\n 'root'\n )\n const newState = parent.updateState({\n name: 'dark',\n })\n expect(newState).toMatchInlineSnapshot(`\n {\n \"className\": \"t_dark\",\n \"name\": \"dark\",\n \"parentName\": \"\",\n \"theme\": {\n \"background\": {\n \"isVar\": true,\n \"key\": \"color-2\",\n \"name\": \"background\",\n \"val\": \"#000\",\n \"variable\": \"\",\n },\n \"color\": {\n \"isVar\": true,\n \"key\": \"color-1\",\n \"name\": \"color\",\n \"val\": \"#fff\",\n \"variable\": \"\",\n },\n },\n }\n `)\n expect(parent.state.name).toBe('dark')\n })\n\n test('Returns parent on empty', () => {\n const parent = new ThemeManager(\n {\n name: 'light',\n },\n 'root'\n )\n const child = new ThemeManager(\n {\n name: null,\n },\n parent\n )\n expect(child).toBe(parent)\n })\n\n test('Resets theme', () => {\n const parent = new ThemeManager(\n {\n name: 'light',\n },\n 'root'\n )\n const child = new ThemeManager(\n {\n name: 'dark',\n },\n parent\n )\n expect(child.state.name).toBe('dark')\n expect(child.parentManager).toBe(parent)\n const child2 = new ThemeManager(\n {\n reset: true,\n },\n child\n )\n expect(child2.parentManager).toBe(child)\n expect(child2.state.name).toBe('light')\n })\n\n test('Nested invert and reset', () => {\n const parent = new ThemeManager(\n {\n name: 'light',\n },\n 'root'\n )\n const child = new ThemeManager(\n {\n name: 'dark',\n },\n parent\n )\n const child2 = new ThemeManager(\n {\n reset: true,\n },\n child\n )\n const child3 = new ThemeManager(\n {\n inverse: true,\n },\n child2\n )\n expect(child3.state.name).toBe('dark')\n })\n\n test('Updates from null the new theme nested 3 themes', () => {\n const a = new ThemeManager(\n {\n name: 'dark',\n },\n 'root'\n )\n const b = new ThemeManager(\n {\n name: 'red',\n },\n a\n )\n expect(b.state.name).toBe('dark_red')\n const c = new ThemeManager(\n {\n name: 'alt2',\n },\n b\n )\n expect(c.state.name).toBe('dark_red_alt2')\n })\n\n test('Ignored dup themes', () => {\n const a = new ThemeManager(\n {\n name: 'dark',\n },\n 'root'\n )\n const b = new ThemeManager(\n {\n name: 'dark',\n },\n a\n )\n expect(b === a).toBe(true)\n })\n\n test('Nested component themes fallback to grandparents', () => {\n const parent = new ThemeManager(\n {\n name: 'dark',\n },\n 'root'\n )\n const child = new ThemeManager(\n {\n name: 'red',\n componentName: 'Button',\n },\n parent\n )\n const child2 = new ThemeManager(\n {\n name: 'blue',\n },\n child\n )\n expect(child2.state.name).toBe('dark_blue')\n const child3 = new ThemeManager(\n {\n componentName: 'Button',\n },\n child2\n )\n expect(child3.state.name).toBe('dark_blue_Button')\n })\n\n test(`Component theme with sub component that doesn't exist keeps same theme`, () => {\n const parent = new ThemeManager(\n {\n name: 'dark',\n },\n 'root'\n )\n const child = new ThemeManager(\n {\n name: 'red',\n componentName: 'Button',\n },\n parent\n )\n const child2 = new ThemeManager(\n {\n componentName: 'Spacer',\n },\n child\n )\n expect(child2).toBe(child)\n })\n\n test(`Doesn't find invalid parent when only passing component`, () => {\n expect(!!conf.themes['dark_Card']).toBeTruthy()\n\n const parent = new ThemeManager(\n {\n name: 'dark_red',\n },\n 'root'\n )\n\n const child = new ThemeManager(\n {\n componentName: 'Card',\n },\n parent\n )\n\n // dont find dark_Card because dark_red is highest it should climb\n expect(child.state.name).toBe(parent.state.name)\n })\n\n test(`Finds sub-theme when componentName and name are passed but componentName doesn't exist`, () => {\n const parent = new ThemeManager(\n {\n name: 'dark',\n },\n 'root'\n )\n\n const child = new ThemeManager(\n {\n name: 'red',\n componentName: 'Missing',\n },\n parent\n )\n\n // dont find dark_Card because dark_red is highest it should climb\n expect(child.state.name).toBe('dark_red')\n })\n\n test(`Uses the full className without the light/dark prefix`, () => {\n const parent = new ThemeManager(\n {\n name: 'dark',\n },\n 'root'\n )\n const child = new ThemeManager(\n {\n name: 'red_alt2',\n },\n parent\n )\n expect(child.state.className).toBe('t_red_alt2')\n\n const child2 = new ThemeManager(\n {\n name: 'red',\n },\n parent\n )\n const child3 = new ThemeManager(\n {\n name: 'alt2',\n },\n child2\n )\n expect(child3.state.className).toBe('t_red_alt2')\n })\n\n test(`Finds component dark_red + Button`, () => {\n const parent = new ThemeManager(\n {\n name: 'dark_red',\n },\n 'root'\n )\n const child = new ThemeManager(\n {\n name: 'dark_red',\n componentName: 'Button',\n },\n parent\n )\n expect(child.state.className).toBe('t_red_Button')\n expect(child.state.name).toBe('dark_red_Button')\n })\n\n test(`Drops componentName if only regular name found at stronger level`, () => {\n const parent = new ThemeManager(\n {\n name: 'dark_red',\n },\n 'root'\n )\n const child = new ThemeManager(\n {\n name: 'alt1',\n componentName: 'Button',\n },\n parent\n )\n expect(child.state.name).toBe('dark_red_alt1')\n })\n\n test(`Component name + theme change when nested already`, () => {\n const parent = new ThemeManager(\n {\n name: 'dark_red',\n },\n 'root'\n )\n const child = new ThemeManager(\n {\n name: 'yellow',\n componentName: 'Button',\n },\n parent\n )\n expect(child.state.name).toBe('dark_yellow_Button')\n })\n})\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/helpers/ThemeManagerContext.tsx"],
|
|
4
|
+
"sourcesContent": ["import { createContext } from 'react'\n\nimport { ThemeManager } from './ThemeManager'\n\nexport const ThemeManagerContext = createContext<ThemeManager | null>(null)\n"],
|
|
5
|
+
"mappings": "AAAA,SAAS,qBAAqB;AAIvB,MAAM,sBAAsB,cAAmC,IAAI;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -270,7 +270,7 @@ const getToken = (key, value, conf, theme, fontFamily = "$body", languageContext
|
|
|
270
270
|
const fontsParsed = languageContext ? getFontsForLanguage(conf.fontsParsed, languageContext) : conf.fontsParsed;
|
|
271
271
|
let valOrVar;
|
|
272
272
|
let hasSet = false;
|
|
273
|
-
if (theme
|
|
273
|
+
if (value in theme) {
|
|
274
274
|
valOrVar = theme[value];
|
|
275
275
|
hasSet = true;
|
|
276
276
|
} else {
|
|
@@ -306,14 +306,14 @@ const getToken = (key, value, conf, theme, fontFamily = "$body", languageContext
|
|
|
306
306
|
}
|
|
307
307
|
if (hasSet) {
|
|
308
308
|
if (process.env.NODE_ENV === "development" && isDevTools && debug === "verbose") {
|
|
309
|
-
console.log(` \uFE52 propMapper getToken`, key, valOrVar);
|
|
309
|
+
console.log(` \uFE52 propMapper getToken`, key, valOrVar, theme);
|
|
310
310
|
}
|
|
311
311
|
return resolveVariableValue(key, valOrVar, resolveAs);
|
|
312
312
|
}
|
|
313
313
|
if (process.env.NODE_ENV === "development") {
|
|
314
314
|
if (value && value[0] === "$") {
|
|
315
|
-
console.
|
|
316
|
-
`\u26A0\uFE0F You
|
|
315
|
+
console.warn(
|
|
316
|
+
`\u26A0\uFE0F You passed the value "${value}" to the style property "${key}", but there's no theme or token with the key "${value}". Using theme "${theme.name}".
|
|
317
317
|
|
|
318
318
|
Set the debug prop to true to see more detailed debug information.`
|
|
319
319
|
);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/createPropMapper.ts"],
|
|
4
|
-
"sourcesContent": ["import { isWeb } from '@tamagui/constants'\n\nimport { getConfig } from '../config'\nimport { isDevTools } from '../constants/isDevTools'\nimport { Variable, getVariableValue, isVariable } from '../createVariable'\nimport {\n DebugProp,\n GenericVariantDefinitions,\n PropMapper,\n SplitStyleState,\n StaticConfigParsed,\n TamaguiInternalConfig,\n VariantSpreadFunction,\n} from '../types'\nimport { LanguageContextType } from '../views/FontLanguage.types'\nimport { expandStyle } from './expandStyle'\nimport { expandStyles } from './expandStyles'\nimport { getFontsForLanguage, getVariantExtras } from './getVariantExtras'\nimport { isObj } from './isObj'\nimport { mergeProps } from './mergeProps'\n\nexport type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both' | 'non-color-value'\n\nexport const getReturnVariablesAs = (props: any, state: Partial<SplitStyleState>) => {\n return !!props.animation || state.resolveVariablesAs === 'value'\n ? isWeb\n ? 'non-color-value'\n : 'value'\n : 'auto'\n}\n\nexport const createPropMapper = (staticConfig: StaticConfigParsed) => {\n const variants = staticConfig.variants || {}\n\n // temp remove classnames\n const defaultProps = mergeProps(staticConfig.defaultProps || {}, {}, false)[0]\n\n const mapper: PropMapper = (\n key,\n value,\n theme,\n propsIn,\n state,\n languageContext,\n avoidDefaultProps = false,\n debug\n ) => {\n const conf = getConfig()\n if (!conf) {\n throw new Error(`No tamagui config setup`)\n }\n\n const props = state.fallbackProps || propsIn\n const returnVariablesAs = getReturnVariablesAs(props, state)\n\n // handled here because we need to resolve this off tokens, its the only one-off like this\n const fontFamily =\n props[conf.inverseShorthands.fontFamily] ||\n props.fontFamily ||\n defaultProps.fontFamily ||\n propsIn.fontFamily ||\n '$body'\n\n const variantValue = resolveVariants(\n key,\n value,\n props,\n defaultProps,\n theme,\n variants,\n fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n '',\n languageContext,\n avoidDefaultProps,\n debug\n )\n\n if (variantValue) {\n return variantValue\n }\n\n let shouldReturn = value !== undefined && value !== null\n\n // handle shorthands\n if (conf.shorthands[key]) {\n shouldReturn = true\n key = conf.shorthands[key]\n }\n\n if (value) {\n if (value[0] === '$') {\n value = getToken(\n key,\n value,\n conf,\n theme,\n fontFamily,\n languageContext,\n returnVariablesAs,\n debug\n )\n } else if (isVariable(value)) {\n value = resolveVariableValue(key, value, returnVariablesAs)\n }\n }\n\n if (shouldReturn) {\n return expandStyle(key, value) || [[key, value]]\n }\n }\n\n return mapper\n}\n\ntype StyleResolver = (\n key: string,\n value: any,\n props: Record<string, any>,\n defaultProps: any,\n theme: any,\n variants: GenericVariantDefinitions,\n fontFamily: string,\n conf: TamaguiInternalConfig,\n returnVariablesAs: 'auto' | 'value' | 'non-color-value',\n staticConfig: StaticConfigParsed,\n parentVariantKey: string,\n languageContext?: LanguageContextType,\n avoidDefaultProps?: boolean,\n debug?: DebugProp\n) => any\n\nconst resolveVariants: StyleResolver = (\n key,\n value,\n props,\n defaultProps,\n theme,\n variants,\n fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n parentVariantKey,\n languageContext,\n avoidDefaultProps = false,\n debug\n) => {\n const variant = variants && variants[key]\n if (!variant || value === undefined) {\n return\n }\n\n let variantValue = getVariantDefinition(variant, key, value, conf)\n\n if (!variantValue) {\n // variant at key exists, but no matching variant value, return nothing\n if (process.env.NODE_ENV === 'development') {\n if (staticConfig.validStyles?.[key]) {\n return null\n }\n if (value === false) {\n // don't warn on missing false values, common to only use true\n return null\n }\n const name = staticConfig.componentName || '[UnnamedComponent]'\n // eslint-disable-next-line no-console\n console.warn(\n `No variant found: ${name} has variant \"${key}\", but no matching value \"${value}\"`\n )\n }\n return\n }\n\n if (typeof variantValue === 'function') {\n const fn = variantValue as VariantSpreadFunction<any>\n variantValue = fn(\n value,\n getVariantExtras(props, languageContext, theme, defaultProps, avoidDefaultProps)\n )\n }\n\n let fontFamilyResult: any\n\n if (isObj(variantValue)) {\n const fontFamilyUpdate =\n variantValue.fontFamily || variantValue[conf.inverseShorthands.fontFamily]\n\n if (fontFamilyUpdate) {\n fontFamilyResult = getFontFamilyFromNameOrVariable(fontFamilyUpdate, conf)\n }\n\n variantValue = resolveTokensAndVariants(\n key,\n variantValue,\n props,\n defaultProps,\n theme,\n variants,\n fontFamilyResult || fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n parentVariantKey,\n languageContext,\n avoidDefaultProps,\n debug\n )\n }\n\n if (variantValue) {\n const next = Object.entries(expandStyles(variantValue))\n\n // store any changed font family (only support variables for now)\n if (fontFamilyResult && fontFamilyResult[0] === '$') {\n fontFamilyCache.set(next, getVariableValue(fontFamilyResult))\n }\n\n return next\n }\n}\n\n// handles finding and resolving the fontFamily to the token name\n// this is used as `font_[name]` in className for nice css variable support\nexport function getFontFamilyFromNameOrVariable(input: any, conf: TamaguiInternalConfig) {\n if (isVariable(input)) {\n const val = variableToFontNameCache.get(input)\n if (val) {\n return val\n } else {\n for (const key in conf.fontsParsed) {\n const familyVariable = conf.fontsParsed[key].family\n if (isVariable(familyVariable)) {\n variableToFontNameCache.set(familyVariable, key)\n if (familyVariable === input) {\n return key\n }\n }\n }\n }\n } else if (typeof input === 'string') {\n if (input?.[0] === '$') {\n return input\n } else {\n // this could be mapped back to\n if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.log('[tamagui] should map back', input)\n }\n }\n }\n}\n\nconst variableToFontNameCache = new WeakMap<Variable, string>()\n\n// special helper for special font family\nconst fontFamilyCache = new WeakMap()\nexport const getPropMappedFontFamily = (expanded?: any) => {\n return expanded && fontFamilyCache.get(expanded)\n}\n\nconst resolveTokensAndVariants: StyleResolver = (\n key, // we dont use key assume value is object instead\n value,\n props,\n defaultProps,\n theme,\n variants,\n fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n parentVariantKey,\n languageContext,\n avoidDefaultProps,\n debug\n) => {\n const res = {}\n for (const rKey in value) {\n const fKey = conf.shorthands[rKey] || rKey\n const val = value[rKey]\n\n if (isVariable(val)) {\n res[fKey] = !isWeb || returnVariablesAs === 'value' ? val.val : val.variable\n } else if (variants[fKey]) {\n // avoids infinite loop if variant is matching a style prop\n // eg: { variants: { flex: { true: { flex: 2 } } } }\n if (parentVariantKey === key) {\n res[fKey] = val\n } else {\n Object.assign(\n res,\n Object.fromEntries(\n resolveVariants(\n fKey,\n val,\n props,\n defaultProps,\n theme,\n variants,\n fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n key,\n languageContext,\n avoidDefaultProps,\n debug\n )\n )\n )\n }\n } else if (typeof val === 'string') {\n const fVal =\n val[0] === '$'\n ? getToken(fKey, val, conf, theme, fontFamily, languageContext, returnVariablesAs, debug)\n : val\n res[fKey] = fVal\n } else {\n if (isObj(val)) {\n // sub-objects: media queries, pseudos, shadowOffset\n res[fKey] = resolveTokensAndVariants(\n fKey,\n val,\n props,\n defaultProps,\n theme,\n variants,\n fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n key,\n languageContext,\n avoidDefaultProps,\n debug\n )\n } else {\n // nullish values cant be tokens, need no extra parsing\n res[fKey] = val\n }\n }\n if (process.env.NODE_ENV === 'development') {\n if (debug) {\n if (res[fKey]?.[0] === '$') {\n // eslint-disable-next-line no-console\n console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey], theme)\n }\n }\n }\n }\n\n return res\n}\n\n// goes through specificity finding best matching variant function\nfunction getVariantDefinition(variant: any, key: string, value: any, conf: TamaguiInternalConfig) {\n if (typeof variant === 'function') {\n return variant\n }\n if (variant[value]) {\n return variant[value]\n }\n const { tokensParsed } = conf\n if (variant['...size'] && value in tokensParsed.size) {\n return variant['...size']\n }\n if (variant['...color'] && value in tokensParsed.color) {\n return variant['...color']\n }\n if (variant['...radius'] && value in tokensParsed.radius) {\n return variant['...radius']\n }\n if (variant['...space'] && value in tokensParsed.space) {\n return variant['...space']\n }\n if (variant['...zIndex'] && value in tokensParsed.zIndex) {\n return variant['...zIndex']\n }\n let fn: any\n if (typeof value === 'number') {\n fn = variant[':number']\n } else if (typeof value === 'string') {\n fn = variant[':string']\n } else if (value === true || value === false) {\n fn = variant[':boolean']\n }\n // fallback to catch all or size\n return fn || variant['...'] || variant['...size']\n}\n\nconst fontShorthand = {\n fontSize: 'size',\n fontWeight: 'weight',\n}\n\nconst getToken = (\n key: string,\n value: string,\n conf: TamaguiInternalConfig,\n theme: any,\n fontFamily: string | undefined = '$body',\n languageContext?: LanguageContextType,\n resolveAs?: ResolveVariableTypes,\n debug?: DebugProp\n) => {\n const tokensParsed = conf.tokensParsed\n const fontsParsed = languageContext\n ? getFontsForLanguage(conf.fontsParsed, languageContext)\n : conf.fontsParsed\n let valOrVar: any\n let hasSet = false\n if (theme[value]) {\n valOrVar = theme[value]\n hasSet = true\n } else {\n switch (key) {\n case 'fontFamily':\n valOrVar = fontsParsed[value]?.family || value\n hasSet = true\n break\n case 'fontSize':\n case 'lineHeight':\n case 'letterSpacing':\n case 'fontWeight':\n valOrVar = fontsParsed[fontFamily]?.[fontShorthand[key] || key]?.[value] || value\n hasSet = true\n break\n }\n for (const cat in tokenCategories) {\n if (key in tokenCategories[cat]) {\n const res = tokensParsed[cat][value]\n if (res) {\n valOrVar = res\n hasSet = true\n }\n }\n }\n if (!hasSet) {\n const spaceVar = tokensParsed.space[value]\n if (spaceVar) {\n valOrVar = spaceVar\n hasSet = true\n }\n }\n }\n if (hasSet) {\n if (process.env.NODE_ENV === 'development' && isDevTools && debug === 'verbose') {\n // eslint-disable-next-line no-console\n console.log(` \uFE52 propMapper getToken`, key, valOrVar)\n }\n return resolveVariableValue(key, valOrVar, resolveAs)\n }\n if (process.env.NODE_ENV === 'development') {\n if (value && value[0] === '$') {\n // eslint-disable-next-line no-console\n console.trace(\n `\u26A0\uFE0F You've passed the value \"${value}\" to the style property \"${key}\", but there's no theme or token with the key \"${value}\". Using theme \"${theme.name}\".\n\nSet the debug prop to true to see more detailed debug information.`\n )\n if (debug) {\n if (isDevTools) {\n // eslint-disable-next-line no-console\n console.log('Looked in:', { theme, tokensParsed, fontsParsed })\n }\n }\n return null\n }\n }\n return value\n}\n\nfunction resolveVariableValue(\n key: string,\n valOrVar: Variable | any,\n resolveAs: ResolveVariableTypes = 'auto'\n) {\n if (isVariable(valOrVar)) {\n if (resolveAs === 'variable') {\n return valOrVar\n }\n if (resolveAs === 'non-color-value') {\n if (isWeb) {\n if (key in tokenCategories.color) {\n return valOrVar.variable\n }\n }\n return valOrVar.val\n }\n if (!isWeb || resolveAs === 'value') {\n return valOrVar.val\n }\n return valOrVar.variable\n }\n return valOrVar\n}\n\n// just specificy the least costly, all else go to `space` (most keys - we can exclude)\nconst tokenCategories = {\n radius: {\n borderRadius: true,\n borderTopLeftRadius: true,\n borderTopRightRadius: true,\n borderBottomLeftRadius: true,\n borderBottomRightRadius: true,\n },\n size: {\n width: true,\n height: true,\n minWidth: true,\n minHeight: true,\n maxWidth: true,\n maxHeight: true,\n },\n color: {\n color: true,\n backgroundColor: true,\n borderColor: true,\n borderBottomColor: true,\n borderTopColor: true,\n borderLeftColor: true,\n borderRightColor: true,\n },\n}\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import { isWeb } from '@tamagui/constants'\n\nimport { getConfig } from '../config'\nimport { isDevTools } from '../constants/isDevTools'\nimport { Variable, getVariableValue, isVariable } from '../createVariable'\nimport {\n DebugProp,\n GenericVariantDefinitions,\n PropMapper,\n SplitStyleState,\n StaticConfigParsed,\n TamaguiInternalConfig,\n VariantSpreadFunction,\n} from '../types'\nimport { LanguageContextType } from '../views/FontLanguage.types'\nimport { expandStyle } from './expandStyle'\nimport { expandStyles } from './expandStyles'\nimport { getFontsForLanguage, getVariantExtras } from './getVariantExtras'\nimport { isObj } from './isObj'\nimport { mergeProps } from './mergeProps'\n\nexport type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both' | 'non-color-value'\n\nexport const getReturnVariablesAs = (props: any, state: Partial<SplitStyleState>) => {\n return !!props.animation || state.resolveVariablesAs === 'value'\n ? isWeb\n ? 'non-color-value'\n : 'value'\n : 'auto'\n}\n\nexport const createPropMapper = (staticConfig: StaticConfigParsed) => {\n const variants = staticConfig.variants || {}\n\n // temp remove classnames\n const defaultProps = mergeProps(staticConfig.defaultProps || {}, {}, false)[0]\n\n const mapper: PropMapper = (\n key,\n value,\n theme,\n propsIn,\n state,\n languageContext,\n avoidDefaultProps = false,\n debug\n ) => {\n const conf = getConfig()\n if (!conf) {\n throw new Error(`No tamagui config setup`)\n }\n\n const props = state.fallbackProps || propsIn\n const returnVariablesAs = getReturnVariablesAs(props, state)\n\n // handled here because we need to resolve this off tokens, its the only one-off like this\n const fontFamily =\n props[conf.inverseShorthands.fontFamily] ||\n props.fontFamily ||\n defaultProps.fontFamily ||\n propsIn.fontFamily ||\n '$body'\n\n const variantValue = resolveVariants(\n key,\n value,\n props,\n defaultProps,\n theme,\n variants,\n fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n '',\n languageContext,\n avoidDefaultProps,\n debug\n )\n\n if (variantValue) {\n return variantValue\n }\n\n let shouldReturn = value !== undefined && value !== null\n\n // handle shorthands\n if (conf.shorthands[key]) {\n shouldReturn = true\n key = conf.shorthands[key]\n }\n\n if (value) {\n if (value[0] === '$') {\n value = getToken(\n key,\n value,\n conf,\n theme,\n fontFamily,\n languageContext,\n returnVariablesAs,\n debug\n )\n } else if (isVariable(value)) {\n value = resolveVariableValue(key, value, returnVariablesAs)\n }\n }\n\n if (shouldReturn) {\n return expandStyle(key, value) || [[key, value]]\n }\n }\n\n return mapper\n}\n\ntype StyleResolver = (\n key: string,\n value: any,\n props: Record<string, any>,\n defaultProps: any,\n theme: any,\n variants: GenericVariantDefinitions,\n fontFamily: string,\n conf: TamaguiInternalConfig,\n returnVariablesAs: 'auto' | 'value' | 'non-color-value',\n staticConfig: StaticConfigParsed,\n parentVariantKey: string,\n languageContext?: LanguageContextType,\n avoidDefaultProps?: boolean,\n debug?: DebugProp\n) => any\n\nconst resolveVariants: StyleResolver = (\n key,\n value,\n props,\n defaultProps,\n theme,\n variants,\n fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n parentVariantKey,\n languageContext,\n avoidDefaultProps = false,\n debug\n) => {\n const variant = variants && variants[key]\n if (!variant || value === undefined) {\n return\n }\n\n let variantValue = getVariantDefinition(variant, key, value, conf)\n\n if (!variantValue) {\n // variant at key exists, but no matching variant value, return nothing\n if (process.env.NODE_ENV === 'development') {\n if (staticConfig.validStyles?.[key]) {\n return null\n }\n if (value === false) {\n // don't warn on missing false values, common to only use true\n return null\n }\n const name = staticConfig.componentName || '[UnnamedComponent]'\n // eslint-disable-next-line no-console\n console.warn(\n `No variant found: ${name} has variant \"${key}\", but no matching value \"${value}\"`\n )\n }\n return\n }\n\n if (typeof variantValue === 'function') {\n const fn = variantValue as VariantSpreadFunction<any>\n variantValue = fn(\n value,\n getVariantExtras(props, languageContext, theme, defaultProps, avoidDefaultProps)\n )\n }\n\n let fontFamilyResult: any\n\n if (isObj(variantValue)) {\n const fontFamilyUpdate =\n variantValue.fontFamily || variantValue[conf.inverseShorthands.fontFamily]\n\n if (fontFamilyUpdate) {\n fontFamilyResult = getFontFamilyFromNameOrVariable(fontFamilyUpdate, conf)\n }\n\n variantValue = resolveTokensAndVariants(\n key,\n variantValue,\n props,\n defaultProps,\n theme,\n variants,\n fontFamilyResult || fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n parentVariantKey,\n languageContext,\n avoidDefaultProps,\n debug\n )\n }\n\n if (variantValue) {\n const next = Object.entries(expandStyles(variantValue))\n\n // store any changed font family (only support variables for now)\n if (fontFamilyResult && fontFamilyResult[0] === '$') {\n fontFamilyCache.set(next, getVariableValue(fontFamilyResult))\n }\n\n return next\n }\n}\n\n// handles finding and resolving the fontFamily to the token name\n// this is used as `font_[name]` in className for nice css variable support\nexport function getFontFamilyFromNameOrVariable(input: any, conf: TamaguiInternalConfig) {\n if (isVariable(input)) {\n const val = variableToFontNameCache.get(input)\n if (val) {\n return val\n } else {\n for (const key in conf.fontsParsed) {\n const familyVariable = conf.fontsParsed[key].family\n if (isVariable(familyVariable)) {\n variableToFontNameCache.set(familyVariable, key)\n if (familyVariable === input) {\n return key\n }\n }\n }\n }\n } else if (typeof input === 'string') {\n if (input?.[0] === '$') {\n return input\n } else {\n // this could be mapped back to\n if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.log('[tamagui] should map back', input)\n }\n }\n }\n}\n\nconst variableToFontNameCache = new WeakMap<Variable, string>()\n\n// special helper for special font family\nconst fontFamilyCache = new WeakMap()\nexport const getPropMappedFontFamily = (expanded?: any) => {\n return expanded && fontFamilyCache.get(expanded)\n}\n\nconst resolveTokensAndVariants: StyleResolver = (\n key, // we dont use key assume value is object instead\n value,\n props,\n defaultProps,\n theme,\n variants,\n fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n parentVariantKey,\n languageContext,\n avoidDefaultProps,\n debug\n) => {\n const res = {}\n for (const rKey in value) {\n const fKey = conf.shorthands[rKey] || rKey\n const val = value[rKey]\n\n if (isVariable(val)) {\n res[fKey] = !isWeb || returnVariablesAs === 'value' ? val.val : val.variable\n } else if (variants[fKey]) {\n // avoids infinite loop if variant is matching a style prop\n // eg: { variants: { flex: { true: { flex: 2 } } } }\n if (parentVariantKey === key) {\n res[fKey] = val\n } else {\n Object.assign(\n res,\n Object.fromEntries(\n resolveVariants(\n fKey,\n val,\n props,\n defaultProps,\n theme,\n variants,\n fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n key,\n languageContext,\n avoidDefaultProps,\n debug\n )\n )\n )\n }\n } else if (typeof val === 'string') {\n const fVal =\n val[0] === '$'\n ? getToken(fKey, val, conf, theme, fontFamily, languageContext, returnVariablesAs, debug)\n : val\n res[fKey] = fVal\n } else {\n if (isObj(val)) {\n // sub-objects: media queries, pseudos, shadowOffset\n res[fKey] = resolveTokensAndVariants(\n fKey,\n val,\n props,\n defaultProps,\n theme,\n variants,\n fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n key,\n languageContext,\n avoidDefaultProps,\n debug\n )\n } else {\n // nullish values cant be tokens, need no extra parsing\n res[fKey] = val\n }\n }\n if (process.env.NODE_ENV === 'development') {\n if (debug) {\n if (res[fKey]?.[0] === '$') {\n // eslint-disable-next-line no-console\n console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey], theme)\n }\n }\n }\n }\n\n return res\n}\n\n// goes through specificity finding best matching variant function\nfunction getVariantDefinition(variant: any, key: string, value: any, conf: TamaguiInternalConfig) {\n if (typeof variant === 'function') {\n return variant\n }\n if (variant[value]) {\n return variant[value]\n }\n const { tokensParsed } = conf\n if (variant['...size'] && value in tokensParsed.size) {\n return variant['...size']\n }\n if (variant['...color'] && value in tokensParsed.color) {\n return variant['...color']\n }\n if (variant['...radius'] && value in tokensParsed.radius) {\n return variant['...radius']\n }\n if (variant['...space'] && value in tokensParsed.space) {\n return variant['...space']\n }\n if (variant['...zIndex'] && value in tokensParsed.zIndex) {\n return variant['...zIndex']\n }\n let fn: any\n if (typeof value === 'number') {\n fn = variant[':number']\n } else if (typeof value === 'string') {\n fn = variant[':string']\n } else if (value === true || value === false) {\n fn = variant[':boolean']\n }\n // fallback to catch all or size\n return fn || variant['...'] || variant['...size']\n}\n\nconst fontShorthand = {\n fontSize: 'size',\n fontWeight: 'weight',\n}\n\nconst getToken = (\n key: string,\n value: string,\n conf: TamaguiInternalConfig,\n theme: any,\n fontFamily: string | undefined = '$body',\n languageContext?: LanguageContextType,\n resolveAs?: ResolveVariableTypes,\n debug?: DebugProp\n) => {\n const tokensParsed = conf.tokensParsed\n const fontsParsed = languageContext\n ? getFontsForLanguage(conf.fontsParsed, languageContext)\n : conf.fontsParsed\n let valOrVar: any\n let hasSet = false\n if (value in theme) {\n valOrVar = theme[value]\n hasSet = true\n } else {\n switch (key) {\n case 'fontFamily':\n valOrVar = fontsParsed[value]?.family || value\n hasSet = true\n break\n case 'fontSize':\n case 'lineHeight':\n case 'letterSpacing':\n case 'fontWeight':\n valOrVar = fontsParsed[fontFamily]?.[fontShorthand[key] || key]?.[value] || value\n hasSet = true\n break\n }\n for (const cat in tokenCategories) {\n if (key in tokenCategories[cat]) {\n const res = tokensParsed[cat][value]\n if (res) {\n valOrVar = res\n hasSet = true\n }\n }\n }\n if (!hasSet) {\n const spaceVar = tokensParsed.space[value]\n if (spaceVar) {\n valOrVar = spaceVar\n hasSet = true\n }\n }\n }\n if (hasSet) {\n if (process.env.NODE_ENV === 'development' && isDevTools && debug === 'verbose') {\n // eslint-disable-next-line no-console\n console.log(` \uFE52 propMapper getToken`, key, valOrVar, theme)\n }\n return resolveVariableValue(key, valOrVar, resolveAs)\n }\n if (process.env.NODE_ENV === 'development') {\n if (value && value[0] === '$') {\n // eslint-disable-next-line no-console\n console.warn(\n `\u26A0\uFE0F You passed the value \"${value}\" to the style property \"${key}\", but there's no theme or token with the key \"${value}\". Using theme \"${theme.name}\".\n\nSet the debug prop to true to see more detailed debug information.`\n )\n if (debug) {\n if (isDevTools) {\n // eslint-disable-next-line no-console\n console.log('Looked in:', { theme, tokensParsed, fontsParsed })\n }\n }\n return null\n }\n }\n return value\n}\n\nfunction resolveVariableValue(\n key: string,\n valOrVar: Variable | any,\n resolveAs: ResolveVariableTypes = 'auto'\n) {\n if (isVariable(valOrVar)) {\n if (resolveAs === 'variable') {\n return valOrVar\n }\n if (resolveAs === 'non-color-value') {\n if (isWeb) {\n if (key in tokenCategories.color) {\n return valOrVar.variable\n }\n }\n return valOrVar.val\n }\n if (!isWeb || resolveAs === 'value') {\n return valOrVar.val\n }\n return valOrVar.variable\n }\n return valOrVar\n}\n\n// just specificy the least costly, all else go to `space` (most keys - we can exclude)\nconst tokenCategories = {\n radius: {\n borderRadius: true,\n borderTopLeftRadius: true,\n borderTopRightRadius: true,\n borderBottomLeftRadius: true,\n borderBottomRightRadius: true,\n },\n size: {\n width: true,\n height: true,\n minWidth: true,\n minHeight: true,\n maxWidth: true,\n maxHeight: true,\n },\n color: {\n color: true,\n backgroundColor: true,\n borderColor: true,\n borderBottomColor: true,\n borderTopColor: true,\n borderLeftColor: true,\n borderRightColor: true,\n },\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -25,15 +25,13 @@ function extendStaticConfig(config, parent) {
|
|
|
25
25
|
if (parentStaticConf.componentName) {
|
|
26
26
|
parentNames.push(parentStaticConf.componentName);
|
|
27
27
|
}
|
|
28
|
+
const deoptProps = config.deoptProps || /* @__PURE__ */ new Set();
|
|
28
29
|
return parseStaticConfig({
|
|
29
30
|
...parentStaticConf,
|
|
30
31
|
...config,
|
|
32
|
+
deoptProps,
|
|
31
33
|
variants,
|
|
32
34
|
parentNames,
|
|
33
|
-
isZStack: config.isZStack || parentStaticConf.isZStack,
|
|
34
|
-
isText: config.isText || parentStaticConf.isText || false,
|
|
35
|
-
neverFlatten: config.neverFlatten || parentStaticConf.neverFlatten,
|
|
36
|
-
ensureOverriddenProp: config.ensureOverriddenProp ?? parentStaticConf.ensureOverriddenProp,
|
|
37
35
|
validStyles: config.validStyles ? {
|
|
38
36
|
...parentStaticConf.validStyles,
|
|
39
37
|
...config.validStyles
|