@tamagui/core 1.0.1-beta.54 → 1.0.1-beta.57
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/Tamagui.js.map +2 -2
- package/dist/cjs/conf.js +11 -2
- package/dist/cjs/conf.js.map +2 -2
- package/dist/cjs/createComponent.js +5 -2
- package/dist/cjs/createComponent.js.map +2 -2
- package/dist/cjs/createTamagui.js +65 -76
- package/dist/cjs/createTamagui.js.map +2 -2
- package/dist/cjs/createVariable.js +8 -0
- package/dist/cjs/createVariable.js.map +2 -2
- package/dist/cjs/createVariables.js +2 -2
- package/dist/cjs/createVariables.js.map +2 -2
- package/dist/cjs/helpers/calc.js +71 -0
- package/dist/cjs/helpers/calc.js.map +7 -0
- package/dist/cjs/helpers/createPropMapper.js +2 -9
- package/dist/cjs/helpers/createPropMapper.js.map +2 -2
- package/dist/cjs/helpers/getSize.js +16 -7
- package/dist/cjs/helpers/getSize.js.map +2 -2
- package/dist/cjs/helpers/getStackSize.js +11 -39
- package/dist/cjs/helpers/getStackSize.js.map +2 -2
- package/dist/cjs/helpers/getTextSize.js +1 -1
- package/dist/cjs/helpers/getTextSize.js.map +2 -2
- package/dist/cjs/helpers/registerCSSVariable.js +41 -0
- package/dist/cjs/helpers/registerCSSVariable.js.map +7 -0
- package/dist/cjs/hooks/useFeatures.js.map +2 -2
- package/dist/cjs/hooks/useTheme.js +3 -15
- package/dist/cjs/hooks/useTheme.js.map +2 -2
- package/dist/cjs/index.js +2 -0
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/insertFont.js +81 -0
- package/dist/cjs/insertFont.js.map +7 -0
- package/dist/cjs/registerCSSVariable.js +41 -0
- package/dist/cjs/registerCSSVariable.js.map +7 -0
- package/dist/cjs/types.js.map +1 -1
- package/dist/esm/Tamagui.js.map +2 -2
- package/dist/esm/conf.js +9 -1
- package/dist/esm/conf.js.map +2 -2
- package/dist/esm/createComponent.js +5 -8
- package/dist/esm/createComponent.js.map +2 -2
- package/dist/esm/createTamagui.js +72 -78
- package/dist/esm/createTamagui.js.map +2 -2
- package/dist/esm/createVariable.js +7 -0
- package/dist/esm/createVariable.js.map +2 -2
- package/dist/esm/createVariables.js +2 -2
- package/dist/esm/createVariables.js.map +2 -2
- package/dist/esm/helpers/calc.js +49 -0
- package/dist/esm/helpers/calc.js.map +7 -0
- package/dist/esm/helpers/createPropMapper.js +2 -9
- package/dist/esm/helpers/createPropMapper.js.map +2 -2
- package/dist/esm/helpers/getSize.js +15 -6
- package/dist/esm/helpers/getSize.js.map +2 -2
- package/dist/esm/helpers/getStackSize.js +10 -36
- package/dist/esm/helpers/getStackSize.js.map +2 -2
- package/dist/esm/helpers/getTextSize.js +1 -1
- package/dist/esm/helpers/getTextSize.js.map +2 -2
- package/dist/esm/helpers/registerCSSVariable.js +17 -0
- package/dist/esm/helpers/registerCSSVariable.js.map +7 -0
- package/dist/esm/hooks/useFeatures.js.map +2 -2
- package/dist/esm/hooks/useTheme.js +3 -15
- package/dist/esm/hooks/useTheme.js.map +2 -2
- package/dist/esm/index.js +2 -0
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/insertFont.js +57 -0
- package/dist/esm/insertFont.js.map +7 -0
- package/dist/esm/registerCSSVariable.js +17 -0
- package/dist/esm/registerCSSVariable.js.map +7 -0
- package/dist/jsx/conf.js +9 -1
- package/dist/jsx/createComponent.js +5 -8
- package/dist/jsx/createTamagui.js +72 -78
- package/dist/jsx/createVariable.js +7 -0
- package/dist/jsx/createVariables.js +2 -2
- package/dist/jsx/helpers/calc.js +48 -0
- package/dist/jsx/helpers/createPropMapper.js +2 -9
- package/dist/jsx/helpers/getSize.js +15 -6
- package/dist/jsx/helpers/getStackSize.js +10 -36
- package/dist/jsx/helpers/getTextSize.js +1 -1
- package/dist/jsx/helpers/registerCSSVariable.js +16 -0
- package/dist/jsx/hooks/useTheme.js +3 -15
- package/dist/jsx/index.js +2 -0
- package/dist/jsx/insertFont.js +56 -0
- package/dist/jsx/registerCSSVariable.js +16 -0
- package/package.json +5 -5
- package/reset.css +8 -0
- package/types/Tamagui.d.ts +2 -5
- package/types/Tamagui.d.ts.map +1 -1
- package/types/conf.d.ts +2 -3
- package/types/conf.d.ts.map +1 -1
- package/types/createComponent.d.ts.map +1 -1
- package/types/createTamagui.d.ts +2 -1
- package/types/createTamagui.d.ts.map +1 -1
- package/types/createVariable.d.ts +1 -0
- package/types/createVariable.d.ts.map +1 -1
- package/types/createVariables.d.ts +1 -1
- package/types/createVariables.d.ts.map +1 -1
- package/types/helpers/calc.d.ts +12 -0
- package/types/helpers/calc.d.ts.map +1 -0
- package/types/helpers/getSize.d.ts +3 -2
- package/types/helpers/getSize.d.ts.map +1 -1
- package/types/helpers/getStackSize.d.ts +4 -28
- package/types/helpers/getStackSize.d.ts.map +1 -1
- package/types/helpers/getVariantExtras.d.ts +1 -3
- package/types/helpers/getVariantExtras.d.ts.map +1 -1
- package/types/helpers/registerCSSVariable.d.ts +5 -0
- package/types/helpers/registerCSSVariable.d.ts.map +1 -0
- package/types/hooks/useTheme.d.ts.map +1 -1
- package/types/index.d.ts +2 -0
- package/types/index.d.ts.map +1 -1
- package/types/insertFont.d.ts +6 -0
- package/types/insertFont.d.ts.map +1 -0
- package/types/registerCSSVariable.d.ts +5 -0
- package/types/registerCSSVariable.d.ts.map +1 -0
- package/types/types.d.ts +1 -1
- package/types/types.d.ts.map +1 -1
|
@@ -3,10 +3,17 @@ var __name = (target, value) => __defProp(target, "name", { value, configurable:
|
|
|
3
3
|
import { configListeners, getHasConfigured, setConfig } from "./conf";
|
|
4
4
|
import { THEME_CLASSNAME_PREFIX } from "./constants/constants";
|
|
5
5
|
import { isWeb } from "./constants/platform";
|
|
6
|
-
import {
|
|
6
|
+
import { createVariable, isVariable } from "./createVariable";
|
|
7
|
+
import { createVariables } from "./createVariables";
|
|
7
8
|
import { createTamaguiProvider } from "./helpers/createTamaguiProvider";
|
|
8
9
|
import { getInsertedRules } from "./helpers/insertStyleRule";
|
|
10
|
+
import {
|
|
11
|
+
registerCSSVariable,
|
|
12
|
+
tokenRules,
|
|
13
|
+
tokensValueToVariable
|
|
14
|
+
} from "./helpers/registerCSSVariable";
|
|
9
15
|
import { configureMedia } from "./hooks/useMedia";
|
|
16
|
+
import { parseFont, registerFontVariables } from "./insertFont";
|
|
10
17
|
const createdConfigs = /* @__PURE__ */ new WeakMap();
|
|
11
18
|
function createTamagui(config) {
|
|
12
19
|
if (createdConfigs.has(config)) {
|
|
@@ -19,55 +26,52 @@ function createTamagui(config) {
|
|
|
19
26
|
if (!config.themes) {
|
|
20
27
|
throw new Error(`No themes provided to Tamagui config`);
|
|
21
28
|
}
|
|
29
|
+
if (!config.fonts) {
|
|
30
|
+
throw new Error(`No fonts provided to Tamagui config`);
|
|
31
|
+
}
|
|
22
32
|
}
|
|
23
33
|
if (getHasConfigured()) {
|
|
24
|
-
console.warn(
|
|
34
|
+
console.warn(`Warning: createTamagui called twice (maybe HMR)`);
|
|
25
35
|
}
|
|
26
36
|
configureMedia({
|
|
27
37
|
queries: config.media,
|
|
28
38
|
defaultActive: config.mediaQueryDefaultActive
|
|
29
39
|
});
|
|
40
|
+
const fontTokens = createVariables(config.fonts);
|
|
41
|
+
const fontsParsed = (() => {
|
|
42
|
+
const res = {};
|
|
43
|
+
for (const familyName in fontTokens) {
|
|
44
|
+
res[`$${familyName}`] = parseFont(fontTokens[familyName]);
|
|
45
|
+
}
|
|
46
|
+
return res;
|
|
47
|
+
})();
|
|
30
48
|
const themeConfig = (() => {
|
|
31
|
-
var _a, _b
|
|
49
|
+
var _a, _b;
|
|
32
50
|
const themes = { ...config.themes };
|
|
33
51
|
let cssRules = [];
|
|
34
|
-
const varsByValue = /* @__PURE__ */ new Map();
|
|
35
52
|
if (isWeb) {
|
|
36
|
-
const tokenRules = /* @__PURE__ */ new Set();
|
|
37
|
-
const addVar = /* @__PURE__ */ __name((v) => {
|
|
38
|
-
varsByValue[v.val] = v;
|
|
39
|
-
const rule = `--${createCSSVariable(v.name, false)}:${typeof v.val === "number" ? `${v.val}px` : v.val}`;
|
|
40
|
-
tokenRules.add(rule);
|
|
41
|
-
}, "addVar");
|
|
42
53
|
for (const key in config.tokens) {
|
|
43
54
|
for (const skey in config.tokens[key]) {
|
|
44
55
|
const val = config.tokens[key][skey];
|
|
45
|
-
|
|
46
|
-
for (const fkey in val) {
|
|
47
|
-
if (fkey === "family") {
|
|
48
|
-
addVar(val[fkey]);
|
|
49
|
-
} else {
|
|
50
|
-
for (const fskey in val[fkey]) {
|
|
51
|
-
addVar(val[fkey][fskey]);
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
} else {
|
|
56
|
-
addVar(val);
|
|
57
|
-
}
|
|
56
|
+
registerCSSVariable(val);
|
|
58
57
|
}
|
|
59
58
|
}
|
|
59
|
+
for (const key in fontsParsed) {
|
|
60
|
+
const val = fontsParsed[key];
|
|
61
|
+
registerFontVariables(val);
|
|
62
|
+
}
|
|
60
63
|
const sep = process.env.NODE_ENV === "development" ? config.cssStyleSeparator || " " : "";
|
|
61
64
|
cssRules.push(`:root {${sep}${[...tokenRules].join(`;${sep}`)}${sep}}`);
|
|
62
65
|
}
|
|
63
66
|
const hasDarkLight = "light" in config.themes && "dark" in config.themes;
|
|
64
67
|
const CNP = `.${THEME_CLASSNAME_PREFIX}`;
|
|
65
|
-
const existing = /* @__PURE__ */ new WeakMap();
|
|
66
68
|
const dedupedThemes = {};
|
|
69
|
+
const existing = /* @__PURE__ */ new WeakMap();
|
|
67
70
|
for (const themeName in themes) {
|
|
68
71
|
const rawTheme = themes[themeName];
|
|
69
72
|
if (existing.has(rawTheme)) {
|
|
70
73
|
const e = existing.get(rawTheme);
|
|
74
|
+
themes[themeName] = e.theme;
|
|
71
75
|
e.names.push(themeName);
|
|
72
76
|
continue;
|
|
73
77
|
}
|
|
@@ -80,33 +84,22 @@ function createTamagui(config) {
|
|
|
80
84
|
names: [themeName],
|
|
81
85
|
theme
|
|
82
86
|
};
|
|
83
|
-
existing.set(
|
|
87
|
+
existing.set(config.themes[themeName], dedupedThemes[themeName]);
|
|
84
88
|
}
|
|
85
|
-
|
|
86
|
-
const
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
const
|
|
91
|
-
let
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
varName = val.key;
|
|
95
|
-
varVal = val.isFloating ? val.val : createCSSVariable(varName);
|
|
89
|
+
if (isWeb) {
|
|
90
|
+
for (const themeName in dedupedThemes) {
|
|
91
|
+
const { theme, names } = dedupedThemes[themeName];
|
|
92
|
+
let vars = "";
|
|
93
|
+
for (const themeKey in theme) {
|
|
94
|
+
const variable = theme[themeKey];
|
|
95
|
+
let value = null;
|
|
96
|
+
if (variable.isFloating || !tokensValueToVariable.has(variable.val)) {
|
|
97
|
+
value = variable.val;
|
|
96
98
|
} else {
|
|
97
|
-
|
|
98
|
-
varVal = varName ? createCSSVariable(varName) : `${val}`;
|
|
99
|
+
value = tokensValueToVariable.get(variable.val).variable;
|
|
99
100
|
}
|
|
100
|
-
|
|
101
|
-
if (!varName) {
|
|
102
|
-
console.warn("no var name in theme", themeName, themeKey);
|
|
103
|
-
continue;
|
|
104
|
-
}
|
|
105
|
-
}
|
|
106
|
-
vars += `--${themeKey}:${varVal};`;
|
|
101
|
+
vars += `--${themeKey}:${value};`;
|
|
107
102
|
}
|
|
108
|
-
}
|
|
109
|
-
if (isWeb) {
|
|
110
103
|
const isDarkOrLightBase = themeName === "dark" || themeName === "light";
|
|
111
104
|
const isDark = themeName.startsWith("dark");
|
|
112
105
|
const selectors = names.map((name) => {
|
|
@@ -120,7 +113,7 @@ function createTamagui(config) {
|
|
|
120
113
|
order.reverse();
|
|
121
114
|
}
|
|
122
115
|
const [stronger, weaker] = order;
|
|
123
|
-
const max = (
|
|
116
|
+
const max = (_a = config.maxDarkLightNesting) != null ? _a : 3;
|
|
124
117
|
new Array(max * 2).fill(void 0).forEach((_, pi) => {
|
|
125
118
|
if (pi % 2 === 1)
|
|
126
119
|
return;
|
|
@@ -133,17 +126,42 @@ function createTamagui(config) {
|
|
|
133
126
|
}
|
|
134
127
|
const rootSep = config.themeClassNameOnRoot ? "" : " ";
|
|
135
128
|
cssRules.push(`${selectors.map((x) => `:root${rootSep}${x}`).join(", ")} {${vars}}`);
|
|
136
|
-
if ((
|
|
129
|
+
if ((_b = config.shouldAddPrefersColorThemes) != null ? _b : true) {
|
|
137
130
|
if (isDarkOrLightBase) {
|
|
138
131
|
cssRules.push(`@media(prefers-color-scheme: ${isDark ? "dark" : "light"}) {
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
132
|
+
body { background:${theme.background}; color: ${theme.color} }
|
|
133
|
+
:root {${vars} }
|
|
134
|
+
}`);
|
|
142
135
|
}
|
|
143
136
|
}
|
|
144
137
|
}
|
|
145
138
|
}
|
|
146
|
-
|
|
139
|
+
for (const themeName in themes) {
|
|
140
|
+
const cur = [];
|
|
141
|
+
const parents = themeName.split("_").slice(0, -1).map((part) => {
|
|
142
|
+
cur.push(part);
|
|
143
|
+
return cur.join("_");
|
|
144
|
+
});
|
|
145
|
+
if (!parents.length)
|
|
146
|
+
continue;
|
|
147
|
+
themes[themeName] = new Proxy(themes[themeName], {
|
|
148
|
+
get(target, key) {
|
|
149
|
+
if (Reflect.has(target, key)) {
|
|
150
|
+
return Reflect.get(target, key);
|
|
151
|
+
}
|
|
152
|
+
for (let i = parents.length - 1; i >= 0; i--) {
|
|
153
|
+
const parent = themes[parents[i]];
|
|
154
|
+
if (!parent) {
|
|
155
|
+
continue;
|
|
156
|
+
}
|
|
157
|
+
if (Reflect.has(parent, key)) {
|
|
158
|
+
return Reflect.get(parent, key);
|
|
159
|
+
}
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
});
|
|
163
|
+
}
|
|
164
|
+
tokensValueToVariable.clear();
|
|
147
165
|
Object.freeze(cssRules);
|
|
148
166
|
const css = cssRules.join("\n");
|
|
149
167
|
return {
|
|
@@ -153,29 +171,6 @@ function createTamagui(config) {
|
|
|
153
171
|
};
|
|
154
172
|
})();
|
|
155
173
|
const tokensParsed = parseTokens(config.tokens);
|
|
156
|
-
const fontsParsed = (() => {
|
|
157
|
-
if (!config.fonts) {
|
|
158
|
-
throw new Error(`No fonts defined!`);
|
|
159
|
-
}
|
|
160
|
-
const res = {};
|
|
161
|
-
for (const familyName in config.fonts) {
|
|
162
|
-
const family = config.fonts[familyName];
|
|
163
|
-
const parsed = {};
|
|
164
|
-
for (const attrKey in family) {
|
|
165
|
-
const attr = family[attrKey];
|
|
166
|
-
if (attrKey === "family") {
|
|
167
|
-
parsed[attrKey] = attr;
|
|
168
|
-
continue;
|
|
169
|
-
}
|
|
170
|
-
parsed[attrKey] = Object.keys(attr).reduce((acc, cur) => {
|
|
171
|
-
acc[`$${cur}`] = attr[cur];
|
|
172
|
-
return acc;
|
|
173
|
-
}, {});
|
|
174
|
-
}
|
|
175
|
-
res[`$${familyName}`] = parsed;
|
|
176
|
-
}
|
|
177
|
-
return res;
|
|
178
|
-
})();
|
|
179
174
|
const getCSS = /* @__PURE__ */ __name(() => {
|
|
180
175
|
return `${themeConfig.css}
|
|
181
176
|
${getInsertedRules().join("\n")}`;
|
|
@@ -231,8 +226,7 @@ function ensureThemeVariable(theme, key) {
|
|
|
231
226
|
theme[key] = createVariable({
|
|
232
227
|
key: themeKey,
|
|
233
228
|
name: themeKey,
|
|
234
|
-
val
|
|
235
|
-
isFloating: true
|
|
229
|
+
val
|
|
236
230
|
});
|
|
237
231
|
} else {
|
|
238
232
|
if (val.name !== themeKey) {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/createTamagui.ts"],
|
|
4
|
-
"sourcesContent": ["import { configListeners, getHasConfigured, setConfig } from './conf'\nimport { THEME_CLASSNAME_PREFIX } from './constants/constants'\nimport { isWeb } from './constants/platform'\nimport { Variable, createCSSVariable, createVariable, isVariable } from './createVariable'\nimport { createTamaguiProvider } from './helpers/createTamaguiProvider'\nimport { getInsertedRules } from './helpers/insertStyleRule'\nimport { configureMedia } from './hooks/useMedia'\nimport {\n AnimationDriver,\n CreateTamaguiConfig,\n GenericTamaguiConfig,\n MediaQueryKey,\n TamaguiInternalConfig,\n ThemeObject,\n} from './types'\n\nexport type CreateTamaguiProps =\n // user then re-defines the types after createTamagui returns the typed object they want\n Partial<Omit<GenericTamaguiConfig, 'themes' | 'tokens' | 'animations'>> & {\n animations?: AnimationDriver<any>\n tokens: GenericTamaguiConfig['tokens']\n themes: {\n [key: string]: {\n [key: string]: string | number | Variable\n }\n }\n\n // for the first render, determines which media queries are true\n // useful for SSR\n mediaQueryDefaultActive?: MediaQueryKey[]\n\n // what's between each CSS style rule, set to \"\\n\" to be easier to read\n // defaults: \"\\n\" when NODE_ENV=development, \"\" otherwise\n cssStyleSeparator?: string\n\n // (Advanced)\n // on the web, tamagui treats `dark` and `light` themes as special and\n // generates extra CSS to avoid having to re-render the entire page.\n // this CSS relies on specificity hacks that multiply by your sub-themes.\n // this sets the maxiumum number of nested dark/light themes you can do\n // defaults to 3 for a balance, but can be higher if you nest them deeply.\n maxDarkLightNesting?: number\n\n // adds @media(prefers-color-scheme) media queries for dark/light\n shouldAddPrefersColorThemes?: boolean\n\n // only if you put the theme classname on the html element we have to generate diff\n themeClassNameOnRoot?: boolean\n }\n\n// config is re-run by the @tamagui/static, dont double validate\nconst createdConfigs = new WeakMap<any, boolean>()\n\nexport function createTamagui<Conf extends CreateTamaguiProps>(\n config: Conf\n): Conf extends Partial<CreateTamaguiConfig<infer A, infer B, infer C, infer D, infer E, infer F>>\n ? TamaguiInternalConfig<A, B, C, D, E, F>\n : unknown {\n if (createdConfigs.has(config)) {\n return config as any\n }\n\n if (process.env.NODE_ENV === 'development') {\n if (!config.tokens) {\n throw new Error(`No tokens provided to Tamagui config`)\n }\n if (!config.themes) {\n throw new Error(`No themes provided to Tamagui config`)\n }\n }\n\n // test env loads a few times as it runs diff tests\n if (getHasConfigured()) {\n console.warn('Called createTamagui twice! Should never do so')\n // throw new Error(`#000 createTamagui called twice`)\n }\n\n configureMedia({\n queries: config.media as any,\n defaultActive: config.mediaQueryDefaultActive,\n })\n\n const themeConfig = (() => {\n const themes = { ...config.themes }\n let cssRules: string[] = []\n const varsByValue = new Map<string, Variable>()\n\n if (isWeb) {\n // tokens\n const tokenRules = new Set<string>()\n\n const addVar = (v: Variable) => {\n varsByValue[v.val] = v\n const rule = `--${createCSSVariable(v.name, false)}:${\n typeof v.val === 'number' ? `${v.val}px` : v.val\n }`\n tokenRules.add(rule)\n }\n\n for (const key in config.tokens) {\n for (const skey in config.tokens[key]) {\n const val = config.tokens[key][skey]\n if (key === 'font') {\n for (const fkey in val) {\n if (fkey === 'family') {\n addVar(val[fkey])\n } else {\n for (const fskey in val[fkey]) {\n addVar(val[fkey][fskey])\n }\n }\n }\n } else {\n addVar(val)\n }\n }\n }\n const sep = process.env.NODE_ENV === 'development' ? config.cssStyleSeparator || ' ' : ''\n cssRules.push(`:root {${sep}${[...tokenRules].join(`;${sep}`)}${sep}}`)\n }\n\n // special case for SSR\n const hasDarkLight = 'light' in config.themes && 'dark' in config.themes\n const CNP = `.${THEME_CLASSNAME_PREFIX}`\n\n // dedupe themes to avoid duplicate CSS generation\n const existing = new WeakMap()\n const dedupedThemes: {\n [key: string]: {\n names: string[]\n theme: ThemeObject\n }\n } = {}\n\n // first, de-dupe and parse them\n for (const themeName in themes) {\n const rawTheme = themes[themeName]\n\n // if existing, avoid\n if (existing.has(rawTheme)) {\n const e = existing.get(rawTheme)\n e.names.push(themeName)\n continue\n }\n\n // parse into variables\n const theme = { ...config.themes[themeName] }\n for (const key in theme) {\n // make sure properly names theme variables\n ensureThemeVariable(theme, key)\n }\n themes[themeName] = theme\n\n // set deduped\n dedupedThemes[themeName] = {\n names: [themeName],\n theme,\n }\n existing.set(theme, dedupedThemes[themeName])\n }\n\n // then, generate from de-duped\n for (const themeName in dedupedThemes) {\n const { theme, names } = dedupedThemes[themeName]\n let vars = ''\n\n for (const themeKey in theme) {\n if (isWeb) {\n const val = theme[themeKey]\n let varName: string\n let varVal: string\n\n if (isVariable(val)) {\n varName = val.key\n varVal = val.isFloating ? val.val : createCSSVariable(varName)\n } else {\n varName = varsByValue[val]?.key\n varVal = varName ? createCSSVariable(varName) : `${val}`\n }\n\n if (process.env.NODE_ENV === 'development') {\n if (!varName) {\n console.warn('no var name in theme', themeName, themeKey)\n continue\n }\n }\n\n vars += `--${themeKey}:${varVal};`\n }\n }\n\n if (isWeb) {\n const isDarkOrLightBase = themeName === 'dark' || themeName === 'light'\n const isDark = themeName.startsWith('dark')\n const selectors = names.map((name) => {\n return `${CNP}${name}`\n })\n\n // since we dont specify dark/light in classnames we have to do an awkward specificity war\n // use config.maxDarkLightNesting to determine how deep you can nest until it breaks\n if (hasDarkLight) {\n for (const subName of names) {\n const childSelector = `${CNP}${subName.replace('dark_', '').replace('light_', '')}`\n const order = isDark ? ['dark', 'light'] : ['light', 'dark']\n if (isDarkOrLightBase) {\n order.reverse()\n }\n const [stronger, weaker] = order\n const max = config.maxDarkLightNesting ?? 3\n new Array(max * 2).fill(undefined).forEach((_, pi) => {\n if (pi % 2 === 1) return\n const parents = new Array(pi + 1).fill(undefined).map((_, psi) => {\n return `${CNP}${psi % 2 === 0 ? stronger : weaker}`\n })\n selectors.push(\n `${(parents.length > 1 ? parents.slice(1) : parents).join(' ')} ${childSelector}`\n )\n })\n }\n }\n\n const rootSep = config.themeClassNameOnRoot ? '' : ' '\n cssRules.push(`${selectors.map((x) => `:root${rootSep}${x}`).join(', ')} {${vars}}`)\n\n if (config.shouldAddPrefersColorThemes ?? true) {\n // add media prefers for dark/light base\n if (isDarkOrLightBase) {\n cssRules.push(\n `@media(prefers-color-scheme: ${isDark ? 'dark' : 'light'}) {\n body { background:${theme.background}; color: ${theme.color} }\n :root {${vars} } \n }`\n )\n }\n }\n }\n }\n\n varsByValue.clear()\n Object.freeze(cssRules)\n const css = cssRules.join('\\n')\n\n return {\n themes,\n cssRules,\n css,\n }\n })()\n\n // faster lookups token keys become $keys to match input\n const tokensParsed: any = parseTokens(config.tokens)\n\n const fontsParsed = (() => {\n if (!config.fonts) {\n throw new Error(`No fonts defined!`)\n }\n const res = {} as typeof config.fonts\n for (const familyName in config.fonts) {\n const family = config.fonts[familyName]\n const parsed = {}\n for (const attrKey in family) {\n const attr = family[attrKey]\n if (attrKey === 'family') {\n parsed[attrKey] = attr\n continue\n }\n parsed[attrKey] = Object.keys(attr).reduce((acc, cur) => {\n acc[`$${cur}`] = attr[cur]\n return acc\n }, {})\n }\n res[`$${familyName}`] = parsed as any\n }\n return res!\n })()\n\n const getCSS = () => {\n return `${themeConfig.css}\\n${getInsertedRules().join('\\n')}`\n }\n\n if (config.shorthands) {\n for (const key in config.shorthands) {\n reversedShorthands[config.shorthands[key]] = key\n }\n }\n\n const next: TamaguiInternalConfig = {\n fonts: {},\n animations: {} as any,\n shorthands: {},\n media: {},\n ...config,\n themes: themeConfig.themes,\n Provider: createTamaguiProvider({\n getCSS,\n defaultTheme: 'light',\n ...config,\n themes: themeConfig.themes,\n }),\n fontsParsed,\n themeConfig,\n tokensParsed,\n parsed: true,\n getCSS,\n }\n\n setConfig(next)\n\n if (configListeners.size) {\n configListeners.forEach((cb) => cb(next))\n configListeners.clear()\n }\n\n createdConfigs.set(next, true)\n\n // @ts-expect-error\n return next\n}\n\nexport const reversedShorthands: Record<string, string> = {}\n\nconst parseTokens = (tokens: any) => {\n const res: any = {}\n for (const key in tokens) {\n res[key] = {}\n for (const skey in tokens[key]) {\n res[key][`$${skey}`] = tokens[key][skey]\n }\n }\n return res\n}\n\n// mutates, freeze after\n// shared by createTamagui so extracted here\nfunction ensureThemeVariable(theme: any, key: string) {\n const val = theme[key]\n const themeKey = key\n if (!isVariable(val)) {\n theme[key] = createVariable({\n key: themeKey,\n name: themeKey,\n val,\n isFloating: true,\n })\n } else {\n if (val.name !== themeKey) {\n // rename to theme name\n theme[key] = createVariable({\n key: val.name,\n name: themeKey,\n val: val.val,\n })\n }\n }\n}\n\n// for quick testing types:\n// const x = createTamagui({\n// shorthands: {},\n// media: {},\n// themes: {},\n// tokens: {\n// font: {},\n// color: {},\n// radius: {},\n// size: {},\n// space: {},\n// zIndex: {},\n// },\n// })\n"],
|
|
5
|
-
"mappings": ";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AA6CA,MAAM,iBAAiB,oBAAI,QAAsB;
|
|
4
|
+
"sourcesContent": ["import { configListeners, getHasConfigured, setConfig } from './conf'\nimport { THEME_CLASSNAME_PREFIX } from './constants/constants'\nimport { isWeb } from './constants/platform'\nimport { Variable, createVariable, isVariable } from './createVariable'\nimport { createVariables } from './createVariables'\nimport { createTamaguiProvider } from './helpers/createTamaguiProvider'\nimport { getInsertedRules } from './helpers/insertStyleRule'\nimport {\n registerCSSVariable,\n tokenRules,\n tokensValueToVariable,\n} from './helpers/registerCSSVariable'\nimport { configureMedia } from './hooks/useMedia'\nimport { parseFont, registerFontVariables } from './insertFont'\nimport {\n AnimationDriver,\n CreateTamaguiConfig,\n GenericTamaguiConfig,\n MediaQueryKey,\n TamaguiInternalConfig,\n ThemeObject,\n} from './types'\n\nexport type CreateTamaguiProps =\n // user then re-defines the types after createTamagui returns the typed object they want\n Partial<Omit<GenericTamaguiConfig, 'themes' | 'tokens' | 'animations'>> & {\n animations?: AnimationDriver<any>\n tokens: GenericTamaguiConfig['tokens']\n themes: {\n [key: string]: {\n [key: string]: string | number | Variable\n }\n }\n\n // for the first render, determines which media queries are true\n // useful for SSR\n mediaQueryDefaultActive?: MediaQueryKey[]\n\n // what's between each CSS style rule, set to \"\\n\" to be easier to read\n // defaults: \"\\n\" when NODE_ENV=development, \"\" otherwise\n cssStyleSeparator?: string\n\n // (Advanced)\n // on the web, tamagui treats `dark` and `light` themes as special and\n // generates extra CSS to avoid having to re-render the entire page.\n // this CSS relies on specificity hacks that multiply by your sub-themes.\n // this sets the maxiumum number of nested dark/light themes you can do\n // defaults to 3 for a balance, but can be higher if you nest them deeply.\n maxDarkLightNesting?: number\n\n // adds @media(prefers-color-scheme) media queries for dark/light\n shouldAddPrefersColorThemes?: boolean\n\n // only if you put the theme classname on the html element we have to generate diff\n themeClassNameOnRoot?: boolean\n }\n\n// config is re-run by the @tamagui/static, dont double validate\nconst createdConfigs = new WeakMap<any, boolean>()\n\nexport type InferTamaguiConfig<Conf extends CreateTamaguiProps> = Conf extends Partial<\n CreateTamaguiConfig<infer A, infer B, infer C, infer D, infer E, infer F>\n>\n ? TamaguiInternalConfig<A, B, C, D, E, F>\n : unknown\n\nexport function createTamagui<Conf extends CreateTamaguiProps>(\n config: Conf\n): InferTamaguiConfig<Conf> {\n if (createdConfigs.has(config)) {\n return config as any\n }\n\n if (process.env.NODE_ENV === 'development') {\n if (!config.tokens) {\n throw new Error(`No tokens provided to Tamagui config`)\n }\n if (!config.themes) {\n throw new Error(`No themes provided to Tamagui config`)\n }\n if (!config.fonts) {\n throw new Error(`No fonts provided to Tamagui config`)\n }\n }\n\n // test env loads a few times as it runs diff tests\n if (getHasConfigured()) {\n console.warn(`Warning: createTamagui called twice (maybe HMR)`)\n }\n\n configureMedia({\n queries: config.media as any,\n defaultActive: config.mediaQueryDefaultActive,\n })\n\n const fontTokens = createVariables(config.fonts!)\n const fontsParsed = (() => {\n const res = {} as typeof fontTokens\n for (const familyName in fontTokens) {\n res[`$${familyName}`] = parseFont(fontTokens[familyName])\n }\n return res!\n })()\n\n const themeConfig = (() => {\n const themes = { ...config.themes }\n let cssRules: string[] = []\n\n if (isWeb) {\n for (const key in config.tokens) {\n for (const skey in config.tokens[key]) {\n const val = config.tokens[key][skey]\n registerCSSVariable(val)\n }\n }\n\n for (const key in fontsParsed) {\n const val = fontsParsed[key]\n registerFontVariables(val)\n }\n\n const sep = process.env.NODE_ENV === 'development' ? config.cssStyleSeparator || ' ' : ''\n cssRules.push(`:root {${sep}${[...tokenRules].join(`;${sep}`)}${sep}}`)\n }\n\n // special case for SSR\n const hasDarkLight = 'light' in config.themes && 'dark' in config.themes\n const CNP = `.${THEME_CLASSNAME_PREFIX}`\n\n // dedupe themes to avoid duplicate CSS generation\n type DedupedTheme = {\n names: string[]\n theme: ThemeObject\n }\n const dedupedThemes: {\n [key: string]: DedupedTheme\n } = {}\n const existing = new WeakMap<ThemeObject, DedupedTheme>()\n\n // first, de-dupe and parse them\n for (const themeName in themes) {\n const rawTheme = themes[themeName]\n\n // if existing, avoid\n if (existing.has(rawTheme)) {\n const e = existing.get(rawTheme)!\n themes[themeName] = e.theme\n e.names.push(themeName)\n continue\n }\n\n // parse into variables\n const theme = { ...config.themes[themeName] }\n for (const key in theme) {\n // make sure properly names theme variables\n ensureThemeVariable(theme, key)\n }\n themes[themeName] = theme\n\n // set deduped\n dedupedThemes[themeName] = {\n names: [themeName],\n theme,\n }\n existing.set(config.themes[themeName], dedupedThemes[themeName])\n }\n\n // then, generate from de-duped\n if (isWeb) {\n for (const themeName in dedupedThemes) {\n const { theme, names } = dedupedThemes[themeName]\n let vars = ''\n\n for (const themeKey in theme) {\n const variable = theme[themeKey] as Variable\n let value: any = null\n if (variable.isFloating || !tokensValueToVariable.has(variable.val)) {\n value = variable.val\n } else {\n value = tokensValueToVariable.get(variable.val)!.variable\n }\n vars += `--${themeKey}:${value};`\n }\n\n const isDarkOrLightBase = themeName === 'dark' || themeName === 'light'\n const isDark = themeName.startsWith('dark')\n const selectors = names.map((name) => {\n return `${CNP}${name}`\n })\n\n // since we dont specify dark/light in classnames we have to do an awkward specificity war\n // use config.maxDarkLightNesting to determine how deep you can nest until it breaks\n if (hasDarkLight) {\n for (const subName of names) {\n const childSelector = `${CNP}${subName.replace('dark_', '').replace('light_', '')}`\n const order = isDark ? ['dark', 'light'] : ['light', 'dark']\n if (isDarkOrLightBase) {\n order.reverse()\n }\n const [stronger, weaker] = order\n const max = config.maxDarkLightNesting ?? 3\n new Array(max * 2).fill(undefined).forEach((_, pi) => {\n if (pi % 2 === 1) return\n const parents = new Array(pi + 1).fill(undefined).map((_, psi) => {\n return `${CNP}${psi % 2 === 0 ? stronger : weaker}`\n })\n selectors.push(\n `${(parents.length > 1 ? parents.slice(1) : parents).join(' ')} ${childSelector}`\n )\n })\n }\n }\n\n const rootSep = config.themeClassNameOnRoot ? '' : ' '\n cssRules.push(`${selectors.map((x) => `:root${rootSep}${x}`).join(', ')} {${vars}}`)\n\n if (config.shouldAddPrefersColorThemes ?? true) {\n // add media prefers for dark/light base\n if (isDarkOrLightBase) {\n cssRules.push(\n `@media(prefers-color-scheme: ${isDark ? 'dark' : 'light'}) {\n body { background:${theme.background}; color: ${theme.color} }\n :root {${vars} } \n }`\n )\n }\n }\n }\n }\n\n // proxy upwards to get parent variables (themes are subset going down)\n for (const themeName in themes) {\n // we could test if this is better as just a straight object spread or fancier proxy\n const cur: string[] = []\n // if theme is dark_blue_alt1_Button\n // this will be the parent names in order: ['dark', 'dark_blue', 'dark_blue_alt1\"]\n const parents = themeName\n .split('_')\n .slice(0, -1)\n .map((part) => {\n cur.push(part)\n return cur.join('_')\n })\n\n if (!parents.length) continue\n\n themes[themeName] = new Proxy(themes[themeName], {\n get(target, key) {\n if (Reflect.has(target, key)) {\n return Reflect.get(target, key)\n }\n // check parents\n for (let i = parents.length - 1; i >= 0; i--) {\n const parent = themes[parents[i]]\n if (!parent) {\n continue\n }\n if (Reflect.has(parent, key)) {\n return Reflect.get(parent, key)\n }\n }\n },\n })\n }\n\n tokensValueToVariable.clear()\n Object.freeze(cssRules)\n const css = cssRules.join('\\n')\n\n return {\n themes,\n cssRules,\n css,\n }\n })()\n\n // faster lookups token keys become $keys to match input\n const tokensParsed: any = parseTokens(config.tokens)\n\n const getCSS = () => {\n return `${themeConfig.css}\\n${getInsertedRules().join('\\n')}`\n }\n\n if (config.shorthands) {\n for (const key in config.shorthands) {\n reversedShorthands[config.shorthands[key]] = key\n }\n }\n\n const next: TamaguiInternalConfig = {\n fonts: {},\n animations: {} as any,\n shorthands: {},\n media: {},\n ...config,\n themes: themeConfig.themes,\n Provider: createTamaguiProvider({\n getCSS,\n defaultTheme: 'light',\n ...config,\n themes: themeConfig.themes,\n }),\n fontsParsed,\n themeConfig,\n tokensParsed,\n parsed: true,\n getCSS,\n }\n\n setConfig(next)\n\n if (configListeners.size) {\n configListeners.forEach((cb) => cb(next))\n configListeners.clear()\n }\n\n createdConfigs.set(next, true)\n\n // @ts-expect-error\n return next\n}\n\nexport const reversedShorthands: Record<string, string> = {}\n\nconst parseTokens = (tokens: any) => {\n const res: any = {}\n for (const key in tokens) {\n res[key] = {}\n for (const skey in tokens[key]) {\n res[key][`$${skey}`] = tokens[key][skey]\n }\n }\n return res\n}\n\n// mutates, freeze after\n// shared by createTamagui so extracted here\nfunction ensureThemeVariable(theme: any, key: string) {\n const val = theme[key]\n const themeKey = key\n if (!isVariable(val)) {\n theme[key] = createVariable({\n key: themeKey,\n name: themeKey,\n val,\n })\n } else {\n if (val.name !== themeKey) {\n // rename to theme name\n theme[key] = createVariable({\n key: val.name,\n name: themeKey,\n val: val.val,\n })\n }\n }\n}\n\n// for quick testing types:\n// const x = createTamagui({\n// shorthands: {},\n// media: {},\n// themes: {},\n// tokens: {\n// font: {},\n// color: {},\n// radius: {},\n// size: {},\n// space: {},\n// zIndex: {},\n// },\n// })\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -44,6 +44,12 @@ function getVariableName(v) {
|
|
|
44
44
|
return v;
|
|
45
45
|
}
|
|
46
46
|
__name(getVariableName, "getVariableName");
|
|
47
|
+
function getVariableVariable(v) {
|
|
48
|
+
if (isVariable(v))
|
|
49
|
+
return v.variable;
|
|
50
|
+
return v;
|
|
51
|
+
}
|
|
52
|
+
__name(getVariableVariable, "getVariableVariable");
|
|
47
53
|
const createCSSVariable = /* @__PURE__ */ __name((nameProp, includeVar = true) => {
|
|
48
54
|
if (process.env.NODE_ENV === "development") {
|
|
49
55
|
if (!nameProp || typeof nameProp !== "string") {
|
|
@@ -60,6 +66,7 @@ export {
|
|
|
60
66
|
createVariable,
|
|
61
67
|
getVariableName,
|
|
62
68
|
getVariableValue,
|
|
69
|
+
getVariableVariable,
|
|
63
70
|
isVariable
|
|
64
71
|
};
|
|
65
72
|
//# sourceMappingURL=createVariable.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/createVariable.ts"],
|
|
4
|
-
"sourcesContent": ["import { isWeb } from './constants/platform'\n\nconst IS_VARIABLE_SYMBOL = '__isVariable__'\n\ntype VariableIn<A extends string | number = any> = {\n val: A\n name: string\n key: string\n isFloating?: boolean\n}\n\nexport class Variable<A extends string | number = any> {\n // because we have a separate node runtime we can't do instanceof\n // ran into issues with this and it's potentially fixable but for now\n // lets just do this\n [IS_VARIABLE_SYMBOL] = true\n\n // original key => in themes maps to the base variable key\n key: string\n\n // CSS name => in themes generic\n name: string\n\n // value\n val: A\n\n // full CSS variable using name\n variable: string\n\n isFloating = false\n\n constructor(props: VariableIn) {\n const { val, name, key, isFloating } = props\n // converting to px breaks rn\n this.val = isVariable(val) ? val.val : val\n this.name = name\n this.key = key\n this.variable = isWeb ? createCSSVariable(name) : ''\n if (isFloating) {\n this.isFloating = true\n }\n }\n\n toString() {\n return `${isWeb ? this.variable : this.val}`\n }\n}\n\nexport const createVariable = <A extends string | number = any>(props: VariableIn<A>) => {\n if (isVariable(props)) {\n return props\n }\n return new Variable<A>(props)\n}\n\nexport function isVariable(v: Variable | any): v is Variable {\n return !!(v instanceof Variable || (v && v[IS_VARIABLE_SYMBOL]))\n}\n\nexport function getVariableValue(v: Variable | any) {\n if (isVariable(v)) return v.val\n return v\n}\n\nexport function getVariableName(v: Variable | any) {\n if (isVariable(v)) return v.name\n return v\n}\n\n// bugfix { space: { 0.5: 10 } } was generating var(--space-0.5) (invalid CSS):\nexport const createCSSVariable = (nameProp: string, includeVar = true) => {\n if (process.env.NODE_ENV === 'development') {\n if (!nameProp || typeof nameProp !== 'string') {\n console.warn('invalid name', nameProp)\n return ``\n }\n }\n const name = nameProp.replace(/[^a-z0-9\\_\\-]+/i, '_')\n return includeVar ? `var(--${name})` : name\n}\n"],
|
|
5
|
-
"mappings": ";;AAAA;AAAA;AAEA,MAAM,qBAAqB;AASpB,MAAM,SAA0C;AAAA,EAoBrD,YAAY,OAAmB;AAhB/B,SAAC,MAAsB;AAcvB,sBAAa;AAGX,UAAM,EAAE,KAAK,MAAM,KAAK,eAAe;AAEvC,SAAK,MAAM,WAAW,GAAG,IAAI,IAAI,MAAM;AACvC,SAAK,OAAO;AACZ,SAAK,MAAM;AACX,SAAK,WAAW,QAAQ,kBAAkB,IAAI,IAAI;AAClD,QAAI,YAAY;AACd,WAAK,aAAa;AAAA,IACpB;AAAA,EACF;AAAA,EAEA,WAAW;AACT,WAAO,GAAG,QAAQ,KAAK,WAAW,KAAK;AAAA,EACzC;AACF;AAnCa;AAXb,AAeG;AAiCI,MAAM,iBAAiB,wBAAkC,UAAyB;AACvF,MAAI,WAAW,KAAK,GAAG;AACrB,WAAO;AAAA,EACT;AACA,SAAO,IAAI,SAAY,KAAK;AAC9B,GAL8B;AAOvB,oBAAoB,GAAkC;AAC3D,SAAO,CAAC,CAAE,cAAa,YAAa,KAAK,EAAE;AAC7C;AAFgB;AAIT,0BAA0B,GAAmB;AAClD,MAAI,WAAW,CAAC;AAAG,WAAO,EAAE;AAC5B,SAAO;AACT;AAHgB;AAKT,yBAAyB,GAAmB;AACjD,MAAI,WAAW,CAAC;AAAG,WAAO,EAAE;AAC5B,SAAO;AACT;AAHgB;AAMT,MAAM,oBAAoB,wBAAC,UAAkB,aAAa,SAAS;AACxE,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,QAAI,CAAC,YAAY,OAAO,aAAa,UAAU;AAC7C,cAAQ,KAAK,gBAAgB,QAAQ;AACrC,aAAO;AAAA,IACT;AAAA,EACF;AACA,QAAM,OAAO,SAAS,QAAQ,mBAAmB,GAAG;AACpD,SAAO,aAAa,SAAS,UAAU;AACzC,GATiC;",
|
|
4
|
+
"sourcesContent": ["import { isWeb } from './constants/platform'\n\nconst IS_VARIABLE_SYMBOL = '__isVariable__'\n\ntype VariableIn<A extends string | number = any> = {\n val: A\n name: string\n key: string\n isFloating?: boolean\n}\n\nexport class Variable<A extends string | number = any> {\n // because we have a separate node runtime we can't do instanceof\n // ran into issues with this and it's potentially fixable but for now\n // lets just do this\n [IS_VARIABLE_SYMBOL] = true\n\n // original key => in themes maps to the base variable key\n key: string\n\n // CSS name => in themes generic\n name: string\n\n // value\n val: A\n\n // full CSS variable using name\n variable: string\n\n isFloating = false\n\n constructor(props: VariableIn) {\n const { val, name, key, isFloating } = props\n // converting to px breaks rn\n this.val = isVariable(val) ? val.val : val\n this.name = name\n this.key = key\n this.variable = isWeb ? createCSSVariable(name) : ''\n if (isFloating) {\n this.isFloating = true\n }\n }\n\n toString() {\n return `${isWeb ? this.variable : this.val}`\n }\n}\n\nexport const createVariable = <A extends string | number = any>(props: VariableIn<A>) => {\n if (isVariable(props)) {\n return props\n }\n return new Variable<A>(props)\n}\n\nexport function isVariable(v: Variable | any): v is Variable {\n return !!(v instanceof Variable || (v && v[IS_VARIABLE_SYMBOL]))\n}\n\nexport function getVariableValue(v: Variable | any) {\n if (isVariable(v)) return v.val\n return v\n}\n\nexport function getVariableName(v: Variable | any) {\n if (isVariable(v)) return v.name\n return v\n}\n\nexport function getVariableVariable(v: Variable | any) {\n if (isVariable(v)) return v.variable\n return v\n}\n\n// bugfix { space: { 0.5: 10 } } was generating var(--space-0.5) (invalid CSS):\nexport const createCSSVariable = (nameProp: string, includeVar = true) => {\n if (process.env.NODE_ENV === 'development') {\n if (!nameProp || typeof nameProp !== 'string') {\n console.warn('invalid name', nameProp)\n return ``\n }\n }\n const name = nameProp.replace(/[^a-z0-9\\_\\-]+/i, '_')\n return includeVar ? `var(--${name})` : name\n}\n"],
|
|
5
|
+
"mappings": ";;AAAA;AAAA;AAEA,MAAM,qBAAqB;AASpB,MAAM,SAA0C;AAAA,EAoBrD,YAAY,OAAmB;AAhB/B,SAAC,MAAsB;AAcvB,sBAAa;AAGX,UAAM,EAAE,KAAK,MAAM,KAAK,eAAe;AAEvC,SAAK,MAAM,WAAW,GAAG,IAAI,IAAI,MAAM;AACvC,SAAK,OAAO;AACZ,SAAK,MAAM;AACX,SAAK,WAAW,QAAQ,kBAAkB,IAAI,IAAI;AAClD,QAAI,YAAY;AACd,WAAK,aAAa;AAAA,IACpB;AAAA,EACF;AAAA,EAEA,WAAW;AACT,WAAO,GAAG,QAAQ,KAAK,WAAW,KAAK;AAAA,EACzC;AACF;AAnCa;AAXb,AAeG;AAiCI,MAAM,iBAAiB,wBAAkC,UAAyB;AACvF,MAAI,WAAW,KAAK,GAAG;AACrB,WAAO;AAAA,EACT;AACA,SAAO,IAAI,SAAY,KAAK;AAC9B,GAL8B;AAOvB,oBAAoB,GAAkC;AAC3D,SAAO,CAAC,CAAE,cAAa,YAAa,KAAK,EAAE;AAC7C;AAFgB;AAIT,0BAA0B,GAAmB;AAClD,MAAI,WAAW,CAAC;AAAG,WAAO,EAAE;AAC5B,SAAO;AACT;AAHgB;AAKT,yBAAyB,GAAmB;AACjD,MAAI,WAAW,CAAC;AAAG,WAAO,EAAE;AAC5B,SAAO;AACT;AAHgB;AAKT,6BAA6B,GAAmB;AACrD,MAAI,WAAW,CAAC;AAAG,WAAO,EAAE;AAC5B,SAAO;AACT;AAHgB;AAMT,MAAM,oBAAoB,wBAAC,UAAkB,aAAa,SAAS;AACxE,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,QAAI,CAAC,YAAY,OAAO,aAAa,UAAU;AAC7C,cAAQ,KAAK,gBAAgB,QAAQ;AACrC,aAAO;AAAA,IACT;AAAA,EACF;AACA,QAAM,OAAO,SAAS,QAAQ,mBAAmB,GAAG;AACpD,SAAO,aAAa,SAAS,UAAU;AACzC,GATiC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -20,10 +20,10 @@ const createVariables = /* @__PURE__ */ __name((tokens, parentPath = "") => {
|
|
|
20
20
|
});
|
|
21
21
|
});
|
|
22
22
|
} else {
|
|
23
|
-
res[key] = createVariables(tokens[key], name);
|
|
23
|
+
res[key] = createVariables(tokens[key], name === "color" ? "" : name);
|
|
24
24
|
}
|
|
25
25
|
} else {
|
|
26
|
-
res[key] = createVariable({ val, name, key });
|
|
26
|
+
res[key] = isVariable(val) ? val : createVariable({ val, name, key });
|
|
27
27
|
}
|
|
28
28
|
}
|
|
29
29
|
return res;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/createVariables.ts"],
|
|
4
|
-
"sourcesContent": ["import { Variable, createVariable, isVariable } from './createVariable'\n\ntype DeepTokenObject<Val extends string | number = any> = {\n [key: string]: Val | DeepTokenObject<Val>\n}\n\
|
|
5
|
-
"mappings": ";;AAAA;AAcO,MAAM,kBAAkB,wBAC7B,QACA,aAAa,OACa;AAC1B,QAAM,MAAW,CAAC;AAClB,aAAW,OAAO,QAAQ;AACxB,QAAI,MAAM,OAAO;AACjB,UAAM,OAAO,aAAa,GAAG,cAAc,QAAQ;AACnD,QAAI,WAAW,GAAG,GAAG;AACnB,UAAI,OAAO;AAAA,IACb,WAAW,OAAO,OAAO,QAAQ,UAAU;AACzC,UAAI,MAAM,QAAQ,GAAG,GAAG;AACtB,YAAI,OAAO,IAAI,IAAI,CAAC,MAAK,MAAM;AAC7B,gBAAM,OAAO,GAAG,OAAO;AACvB,gBAAM,QAAQ,aAAa,GAAG,QAAQ,SAAS;AAC/C,iBAAO,WAAW,IAAG,IACjB,OACA,eAAe;AAAA,YACb;AAAA,YACA,KAAK;AAAA,YACL,MAAM;AAAA,UACR,CAAC;AAAA,QACP,CAAC;AAAA,MACH,OAAO;AACL,YAAI,OAAO,gBAAgB,OAAO,MAAa,IAAI;AAAA,
|
|
4
|
+
"sourcesContent": ["import { Variable, createVariable, isVariable } from './createVariable'\n\ntype DeepTokenObject<Val extends string | number = any> = {\n [key: string]: Val | DeepTokenObject<Val>\n}\n\nexport type DeepVariableObject<A extends DeepTokenObject> = {\n [Key in keyof A]: A[Key] extends string | number\n ? Variable<A[Key]>\n : A[Key] extends DeepTokenObject\n ? DeepVariableObject<A[Key]>\n : never\n}\n\nexport const createVariables = <A extends DeepTokenObject>(\n tokens: A,\n parentPath = ''\n): DeepVariableObject<A> => {\n const res: any = {}\n for (const key in tokens) {\n let val = tokens[key]\n const name = parentPath ? `${parentPath}-${key}` : key\n if (isVariable(val)) {\n res[key] = val\n } else if (val && typeof val === 'object') {\n if (Array.isArray(val)) {\n res[key] = val.map((val, i) => {\n const skey = `${key}-${i}`\n const sname = parentPath ? `${name}-${skey}` : skey\n return isVariable(val)\n ? val\n : createVariable({\n val,\n key: skey,\n name: sname,\n })\n })\n } else {\n res[key] = createVariables(tokens[key] as any, name === 'color' ? '' : name)\n }\n } else {\n res[key] = isVariable(val) ? val : createVariable({ val, name, key })\n }\n }\n return res\n}\n"],
|
|
5
|
+
"mappings": ";;AAAA;AAcO,MAAM,kBAAkB,wBAC7B,QACA,aAAa,OACa;AAC1B,QAAM,MAAW,CAAC;AAClB,aAAW,OAAO,QAAQ;AACxB,QAAI,MAAM,OAAO;AACjB,UAAM,OAAO,aAAa,GAAG,cAAc,QAAQ;AACnD,QAAI,WAAW,GAAG,GAAG;AACnB,UAAI,OAAO;AAAA,IACb,WAAW,OAAO,OAAO,QAAQ,UAAU;AACzC,UAAI,MAAM,QAAQ,GAAG,GAAG;AACtB,YAAI,OAAO,IAAI,IAAI,CAAC,MAAK,MAAM;AAC7B,gBAAM,OAAO,GAAG,OAAO;AACvB,gBAAM,QAAQ,aAAa,GAAG,QAAQ,SAAS;AAC/C,iBAAO,WAAW,IAAG,IACjB,OACA,eAAe;AAAA,YACb;AAAA,YACA,KAAK;AAAA,YACL,MAAM;AAAA,UACR,CAAC;AAAA,QACP,CAAC;AAAA,MACH,OAAO;AACL,YAAI,OAAO,gBAAgB,OAAO,MAAa,SAAS,UAAU,KAAK,IAAI;AAAA,MAC7E;AAAA,IACF,OAAO;AACL,UAAI,OAAO,WAAW,GAAG,IAAI,MAAM,eAAe,EAAE,KAAK,MAAM,IAAI,CAAC;AAAA,IACtE;AAAA,EACF;AACA,SAAO;AACT,GA/B+B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
3
|
+
import { isWeb } from "../constants/platform";
|
|
4
|
+
import { getVariableVariable } from "../createVariable";
|
|
5
|
+
const operators = {
|
|
6
|
+
"+": (a, b) => a + b,
|
|
7
|
+
"-": (a, b) => a - b,
|
|
8
|
+
"/": (a, b) => a / b,
|
|
9
|
+
"*": (a, b) => a * b
|
|
10
|
+
};
|
|
11
|
+
const calc = /* @__PURE__ */ __name((...valuesAndOperators) => {
|
|
12
|
+
if (isWeb) {
|
|
13
|
+
let res2 = "calc(";
|
|
14
|
+
for (const cur of valuesAndOperators) {
|
|
15
|
+
if (operators[cur]) {
|
|
16
|
+
res2 += " " + cur + " ";
|
|
17
|
+
} else {
|
|
18
|
+
res2 += convertToVariableOrNumber(cur);
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
return res2 + ")";
|
|
22
|
+
}
|
|
23
|
+
let res = 0;
|
|
24
|
+
let nextOp = null;
|
|
25
|
+
for (const cur of valuesAndOperators) {
|
|
26
|
+
if (operators[cur]) {
|
|
27
|
+
nextOp = operators[cur];
|
|
28
|
+
} else {
|
|
29
|
+
if (nextOp) {
|
|
30
|
+
res = nextOp(res, cur);
|
|
31
|
+
nextOp = null;
|
|
32
|
+
} else {
|
|
33
|
+
res = +cur;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
return res;
|
|
38
|
+
}, "calc");
|
|
39
|
+
const convertToVariableOrNumber = /* @__PURE__ */ __name((v) => {
|
|
40
|
+
const varOrVal = getVariableVariable(v);
|
|
41
|
+
if (typeof varOrVal === "number") {
|
|
42
|
+
return `${varOrVal}px`;
|
|
43
|
+
}
|
|
44
|
+
return varOrVal;
|
|
45
|
+
}, "convertToVariableOrNumber");
|
|
46
|
+
export {
|
|
47
|
+
calc
|
|
48
|
+
};
|
|
49
|
+
//# sourceMappingURL=calc.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/helpers/calc.ts"],
|
|
4
|
+
"sourcesContent": ["import { isWeb } from '../constants/platform'\nimport { getVariableValue, getVariableVariable } from '../createVariable'\nimport { FontLineHeightTokens, FontSizeTokens, SizeTokens, SpaceTokens } from '../types'\n\n/**\n * Simple calc() that handles native + web\n * on web: outputs a calc() string\n * on native: outputs a plain number\n */\n\nexport type CalcVal =\n | string\n | number\n | SizeTokens\n | SpaceTokens\n | FontSizeTokens\n | FontLineHeightTokens\n\nconst operators = {\n '+': (a: number, b: number) => a + b,\n '-': (a: number, b: number) => a - b,\n '/': (a: number, b: number) => a / b,\n '*': (a: number, b: number) => a * b,\n}\n\ntype Operator = keyof typeof operators\n\nexport const calc = (...valuesAndOperators: (CalcVal | Operator)[]) => {\n if (isWeb) {\n let res = 'calc('\n for (const cur of valuesAndOperators) {\n if (operators[cur as any]) {\n // spaces are significant\n res += ' ' + cur + ' '\n } else {\n res += convertToVariableOrNumber(cur)\n }\n }\n return res + ')'\n }\n\n let res = 0\n let nextOp: any = null\n for (const cur of valuesAndOperators) {\n if (operators[cur as any]) {\n nextOp = operators[cur as any]\n } else {\n if (nextOp) {\n res = nextOp(res, cur)\n nextOp = null\n } else {\n res = +cur\n }\n }\n }\n return res\n}\n\nconst convertToVariableOrNumber = (v: any) => {\n const varOrVal = getVariableVariable(v)\n if (typeof varOrVal === 'number') {\n return `${varOrVal}px`\n }\n return varOrVal\n}\n"],
|
|
5
|
+
"mappings": ";;AAAA;AACA;AAiBA,MAAM,YAAY;AAAA,EAChB,KAAK,CAAC,GAAW,MAAc,IAAI;AAAA,EACnC,KAAK,CAAC,GAAW,MAAc,IAAI;AAAA,EACnC,KAAK,CAAC,GAAW,MAAc,IAAI;AAAA,EACnC,KAAK,CAAC,GAAW,MAAc,IAAI;AACrC;AAIO,MAAM,OAAO,2BAAI,uBAA+C;AACrE,MAAI,OAAO;AACT,QAAI,OAAM;AACV,eAAW,OAAO,oBAAoB;AACpC,UAAI,UAAU,MAAa;AAEzB,gBAAO,MAAM,MAAM;AAAA,MACrB,OAAO;AACL,gBAAO,0BAA0B,GAAG;AAAA,MACtC;AAAA,IACF;AACA,WAAO,OAAM;AAAA,EACf;AAEA,MAAI,MAAM;AACV,MAAI,SAAc;AAClB,aAAW,OAAO,oBAAoB;AACpC,QAAI,UAAU,MAAa;AACzB,eAAS,UAAU;AAAA,IACrB,OAAO;AACL,UAAI,QAAQ;AACV,cAAM,OAAO,KAAK,GAAG;AACrB,iBAAS;AAAA,MACX,OAAO;AACL,cAAM,CAAC;AAAA,MACT;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT,GA7BoB;AA+BpB,MAAM,4BAA4B,wBAAC,MAAW;AAC5C,QAAM,WAAW,oBAAoB,CAAC;AACtC,MAAI,OAAO,aAAa,UAAU;AAChC,WAAO,GAAG;AAAA,EACZ;AACA,SAAO;AACT,GANkC;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -132,7 +132,7 @@ const getToken = /* @__PURE__ */ __name((key, value, { tokensParsed, fontsParsed
|
|
|
132
132
|
var _a, _b, _c;
|
|
133
133
|
let valOrVar;
|
|
134
134
|
let hasSet = false;
|
|
135
|
-
if (value
|
|
135
|
+
if (theme[value]) {
|
|
136
136
|
valOrVar = theme[value];
|
|
137
137
|
hasSet = true;
|
|
138
138
|
} else {
|
|
@@ -200,14 +200,7 @@ const tokenCategories = {
|
|
|
200
200
|
minWidth: true,
|
|
201
201
|
minHeight: true,
|
|
202
202
|
maxWidth: true,
|
|
203
|
-
maxHeight: true
|
|
204
|
-
padding: true,
|
|
205
|
-
paddingLeft: true,
|
|
206
|
-
paddingRight: true,
|
|
207
|
-
paddingTop: true,
|
|
208
|
-
paddingBottom: true,
|
|
209
|
-
paddingVertical: true,
|
|
210
|
-
paddingHorizontal: true
|
|
203
|
+
maxHeight: true
|
|
211
204
|
},
|
|
212
205
|
color: {
|
|
213
206
|
color: true,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/createPropMapper.ts"],
|
|
4
|
-
"sourcesContent": ["import { getConfig } from '../conf'\nimport { isWeb } from '../constants/platform'\nimport { Variable, isVariable } from '../createVariable'\nimport {\n GenericVariantDefinitions,\n PropMapper,\n StaticConfig,\n TamaguiInternalConfig,\n VariantSpreadFunction,\n} from '../types'\nimport { expandStyle, expandStyles } from './generateAtomicStyles'\nimport { getVariantExtras } from './getVariantExtras'\nimport { isObj } from './isObj'\n\nexport type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both'\n\nexport const createPropMapper = (staticConfig: Partial<StaticConfig>) => {\n const variants = staticConfig.variants || {}\n const defaultProps = staticConfig.defaultProps || {}\n\n const mapper: PropMapper = (key, value, theme, propsIn, state, avoidDefaultProps = false) => {\n const conf = getConfig()\n if (!conf) {\n console.trace('no conf! err')\n return\n }\n\n const props = state.fallbackProps || propsIn\n const returnVariablesAs =\n state.resolveVariablesAs === 'value' || !!props.animation ? 'value' : 'auto'\n\n // handled here because we need to resolve this off tokens, its the only one-off like this\n const fontFamily = props.fontFamily || defaultProps.fontFamily || '$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 avoidDefaultProps\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 // prettier-ignore\n value = getToken(key, value, conf, theme, fontFamily, returnVariablesAs)\n } else if (isVariable(value)) {\n value = getVariableValue(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',\n staticConfig: Partial<StaticConfig>,\n parentVariantKey: string,\n avoidDefaultProps?: boolean\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 avoidDefaultProps = false\n) => {\n const variant = variants && variants[key]\n if (variant && value !== undefined) {\n let variantValue = getVariantDefinition(variant, key, value)\n\n if (variantValue) {\n if (typeof variantValue === 'function') {\n const fn = variantValue as VariantSpreadFunction<any>\n variantValue = fn(value, getVariantExtras(props, theme, defaultProps, avoidDefaultProps))\n }\n\n if (isObj(variantValue)) {\n variantValue = resolveTokensAndVariants(\n key,\n variantValue,\n props,\n defaultProps,\n theme,\n variants,\n fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n parentVariantKey,\n avoidDefaultProps\n )\n }\n\n return Object.entries(expandStyles(variantValue))\n } else {\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 console.warn(\n `No variant found: ${\n staticConfig.componentName || '[UnnamedComponent]'\n } has variant \"${key}\", but no matching value \"${value}\"`\n )\n }\n return null\n }\n }\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 avoidDefaultProps\n) => {\n let res = {}\n for (const rKey in value) {\n const fKey = conf.shorthands[rKey] || rKey\n const val = value[rKey]\n if (isVariable(val)) {\n res[fKey] = !isWeb || returnVariablesAs === 'value' ? val.val : val.variable\n // res[fKey] =\n // resolveAs === 'variable' ? val : !isWeb || resolveAs === '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 res = {\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 avoidDefaultProps\n )\n ),\n }\n }\n } else if (typeof val === 'string') {\n const fVal =\n val[0] === '$' ? getToken(fKey, val, conf, theme, fontFamily, returnVariablesAs) : 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 avoidDefaultProps\n )\n } else {\n // nullish values cant be tokens, need no extra parsing\n res[fKey] = value[fKey]\n }\n }\n if (process.env.NODE_ENV === 'development') {\n if (res[fKey]?.[0] === '$') {\n console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey])\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) {\n if (typeof variant === 'function') {\n return variant\n }\n for (const cat in tokenCategories) {\n if (key in tokenCategories[cat]) {\n const spreadVariant = variant[`...${cat}`]\n if (spreadVariant) {\n return spreadVariant\n }\n }\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 fn = fn || variant[value]\n // fallback to size ultimately - could do token level detection\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 { tokensParsed, fontsParsed }: TamaguiInternalConfig,\n theme: any,\n fontFamily: string | undefined = '$body',\n resolveAs?: ResolveVariableTypes\n) => {\n let valOrVar: any\n let hasSet = false\n if (value
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import { getConfig } from '../conf'\nimport { isWeb } from '../constants/platform'\nimport { Variable, isVariable } from '../createVariable'\nimport {\n GenericVariantDefinitions,\n PropMapper,\n StaticConfig,\n TamaguiInternalConfig,\n VariantSpreadFunction,\n} from '../types'\nimport { expandStyle, expandStyles } from './generateAtomicStyles'\nimport { getVariantExtras } from './getVariantExtras'\nimport { isObj } from './isObj'\n\nexport type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both'\n\nexport const createPropMapper = (staticConfig: Partial<StaticConfig>) => {\n const variants = staticConfig.variants || {}\n const defaultProps = staticConfig.defaultProps || {}\n\n const mapper: PropMapper = (key, value, theme, propsIn, state, avoidDefaultProps = false) => {\n const conf = getConfig()\n if (!conf) {\n console.trace('no conf! err')\n return\n }\n\n const props = state.fallbackProps || propsIn\n const returnVariablesAs =\n state.resolveVariablesAs === 'value' || !!props.animation ? 'value' : 'auto'\n\n // handled here because we need to resolve this off tokens, its the only one-off like this\n const fontFamily = props.fontFamily || defaultProps.fontFamily || '$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 avoidDefaultProps\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 // prettier-ignore\n value = getToken(key, value, conf, theme, fontFamily, returnVariablesAs)\n } else if (isVariable(value)) {\n value = getVariableValue(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',\n staticConfig: Partial<StaticConfig>,\n parentVariantKey: string,\n avoidDefaultProps?: boolean\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 avoidDefaultProps = false\n) => {\n const variant = variants && variants[key]\n if (variant && value !== undefined) {\n let variantValue = getVariantDefinition(variant, key, value)\n\n if (variantValue) {\n if (typeof variantValue === 'function') {\n const fn = variantValue as VariantSpreadFunction<any>\n variantValue = fn(value, getVariantExtras(props, theme, defaultProps, avoidDefaultProps))\n }\n\n if (isObj(variantValue)) {\n variantValue = resolveTokensAndVariants(\n key,\n variantValue,\n props,\n defaultProps,\n theme,\n variants,\n fontFamily,\n conf,\n returnVariablesAs,\n staticConfig,\n parentVariantKey,\n avoidDefaultProps\n )\n }\n\n return Object.entries(expandStyles(variantValue))\n } else {\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 console.warn(\n `No variant found: ${\n staticConfig.componentName || '[UnnamedComponent]'\n } has variant \"${key}\", but no matching value \"${value}\"`\n )\n }\n return null\n }\n }\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 avoidDefaultProps\n) => {\n let res = {}\n for (const rKey in value) {\n const fKey = conf.shorthands[rKey] || rKey\n const val = value[rKey]\n if (isVariable(val)) {\n res[fKey] = !isWeb || returnVariablesAs === 'value' ? val.val : val.variable\n // res[fKey] =\n // resolveAs === 'variable' ? val : !isWeb || resolveAs === '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 res = {\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 avoidDefaultProps\n )\n ),\n }\n }\n } else if (typeof val === 'string') {\n const fVal =\n val[0] === '$' ? getToken(fKey, val, conf, theme, fontFamily, returnVariablesAs) : 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 avoidDefaultProps\n )\n } else {\n // nullish values cant be tokens, need no extra parsing\n res[fKey] = value[fKey]\n }\n }\n if (process.env.NODE_ENV === 'development') {\n if (res[fKey]?.[0] === '$') {\n console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey])\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) {\n if (typeof variant === 'function') {\n return variant\n }\n for (const cat in tokenCategories) {\n if (key in tokenCategories[cat]) {\n const spreadVariant = variant[`...${cat}`]\n if (spreadVariant) {\n return spreadVariant\n }\n }\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 fn = fn || variant[value]\n // fallback to size ultimately - could do token level detection\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 { tokensParsed, fontsParsed }: TamaguiInternalConfig,\n theme: any,\n fontFamily: string | undefined = '$body',\n resolveAs?: ResolveVariableTypes\n) => {\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 return getVariableValue(valOrVar, resolveAs)\n }\n if (process.env.NODE_ENV === 'development') {\n if (value && value[0] === '$') {\n console.warn(`\u26A0\uFE0F Missing token:`, key, value, fontFamily, theme, fontsParsed)\n return null\n }\n }\n return value\n}\n\nfunction getVariableValue(valOrVar: Variable | any, resolveAs: ResolveVariableTypes = 'auto') {\n if (isVariable(valOrVar)) {\n if (resolveAs === 'variable') {\n return valOrVar\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 },\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
|
}
|
|
@@ -1,13 +1,22 @@
|
|
|
1
1
|
var __defProp = Object.defineProperty;
|
|
2
2
|
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
3
3
|
import { getTokens } from "../conf";
|
|
4
|
-
const getSize = /* @__PURE__ */ __name((size,
|
|
5
|
-
|
|
6
|
-
const sizeNames = Object.keys(sizes);
|
|
7
|
-
const key = sizeNames[Math.max(0, sizeNames.indexOf(String(size || "$4")) + sizeUpOrDownBy)];
|
|
8
|
-
return sizes[key] || sizes["$4"];
|
|
4
|
+
const getSize = /* @__PURE__ */ __name((size, shift = 0, bounds = [0]) => {
|
|
5
|
+
return stepTokenUpOrDown(getTokens().size, size, shift, bounds);
|
|
9
6
|
}, "getSize");
|
|
7
|
+
const stepTokenUpOrDown = /* @__PURE__ */ __name((tokens, current, shift = 0, bounds = [0]) => {
|
|
8
|
+
var _a, _b;
|
|
9
|
+
const sizeNames = Object.keys(tokens);
|
|
10
|
+
const currentKeyNum = (typeof current === "string" ? current.replace("$", "") : current) || "4";
|
|
11
|
+
const nextKeyName = `$${+currentKeyNum + shift}`;
|
|
12
|
+
const min = (_a = bounds[0]) != null ? _a : 0;
|
|
13
|
+
const max = (_b = bounds[1]) != null ? _b : sizeNames.length - 1;
|
|
14
|
+
const index = Math.min(max, Math.max(min, sizeNames.indexOf(nextKeyName)));
|
|
15
|
+
const key = sizeNames[index];
|
|
16
|
+
return tokens[key] || tokens["$4"];
|
|
17
|
+
}, "stepTokenUpOrDown");
|
|
10
18
|
export {
|
|
11
|
-
getSize
|
|
19
|
+
getSize,
|
|
20
|
+
stepTokenUpOrDown
|
|
12
21
|
};
|
|
13
22
|
//# sourceMappingURL=getSize.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/helpers/getSize.ts"],
|
|
4
|
-
"sourcesContent": ["import { getTokens } from '../conf'\nimport { SizeTokens } from '../types'\n\nexport const getSize = (size?: SizeTokens | undefined,
|
|
5
|
-
"mappings": ";;AAAA;AAGO,MAAM,UAAU,wBAAC,MAA+B,
|
|
4
|
+
"sourcesContent": ["import { getTokens } from '../conf'\nimport { SizeTokens, SpaceTokens } from '../types'\n\nexport const getSize = (size?: SizeTokens | undefined, shift = 0, bounds = [0]) => {\n return stepTokenUpOrDown(getTokens().size, size, shift, bounds)\n}\n\nexport const stepTokenUpOrDown = (\n tokens: Object,\n current?: SizeTokens | SpaceTokens | string,\n shift = 0,\n bounds = [0]\n) => {\n const sizeNames = Object.keys(tokens)\n const currentKeyNum = (typeof current === 'string' ? current.replace('$', '') : current) || '4'\n const nextKeyName = `$${+currentKeyNum + shift}`\n const min = bounds[0] ?? 0\n const max = bounds[1] ?? sizeNames.length - 1\n const index = Math.min(max, Math.max(min, sizeNames.indexOf(nextKeyName)))\n const key = sizeNames[index]\n return tokens[key] || tokens['$4']\n}\n"],
|
|
5
|
+
"mappings": ";;AAAA;AAGO,MAAM,UAAU,wBAAC,MAA+B,QAAQ,GAAG,SAAS,CAAC,CAAC,MAAM;AACjF,SAAO,kBAAkB,UAAU,EAAE,MAAM,MAAM,OAAO,MAAM;AAChE,GAFuB;AAIhB,MAAM,oBAAoB,wBAC/B,QACA,SACA,QAAQ,GACR,SAAS,CAAC,CAAC,MACR;AAZL;AAaE,QAAM,YAAY,OAAO,KAAK,MAAM;AACpC,QAAM,gBAAiB,QAAO,YAAY,WAAW,QAAQ,QAAQ,KAAK,EAAE,IAAI,YAAY;AAC5F,QAAM,cAAc,IAAI,CAAC,gBAAgB;AACzC,QAAM,MAAM,aAAO,OAAP,YAAa;AACzB,QAAM,MAAM,aAAO,OAAP,YAAa,UAAU,SAAS;AAC5C,QAAM,QAAQ,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK,UAAU,QAAQ,WAAW,CAAC,CAAC;AACzE,QAAM,MAAM,UAAU;AACtB,SAAO,OAAO,QAAQ,OAAO;AAC/B,GAdiC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|