@tamagui/theme-base 1.0.0-beta.0.204

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/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2020 Nate Wienert
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,21 @@
1
+ ```tsx
2
+ import '@tamagui/theme-base/inter.css' // web-fonts
3
+ import '@tamagui/theme-base/fira-code.css' // web-fonts
4
+ import { shorthands } from '@tamagui/shorthands'
5
+ import { themes, tokens } from '@tamagui/theme-base'
6
+ import { createTamagui } from 'tamagui'
7
+
8
+ export default createTamagui({
9
+ themes,
10
+ tokens,
11
+ shorthands,
12
+ })
13
+ ```
14
+
15
+ For Fira Code:
16
+
17
+ ```
18
+ .font_mono {
19
+ font-feature-settings:"liga","tnum","zero","ss01","locl","calt";
20
+ }
21
+ ```
@@ -0,0 +1,65 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
+ var __getOwnPropNames = Object.getOwnPropertyNames;
4
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
5
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var __copyProps = (to, from, except, desc) => {
11
+ if (from && typeof from === "object" || typeof from === "function") {
12
+ for (let key of __getOwnPropNames(from))
13
+ if (!__hasOwnProp.call(to, key) && key !== except)
14
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
+ }
16
+ return to;
17
+ };
18
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
+ var colorUtils_exports = {};
20
+ __export(colorUtils_exports, {
21
+ hexToRGBA: () => hexToRGBA,
22
+ setColorAlpha: () => setColorAlpha
23
+ });
24
+ module.exports = __toCommonJS(colorUtils_exports);
25
+ var import_core = require("@tamagui/core");
26
+ const hexToRGBA = /* @__PURE__ */ __name((hex, alpha = 1) => {
27
+ if (!isValidHex(hex)) {
28
+ throw new Error("Invalid HEX");
29
+ }
30
+ const chunkSize = Math.floor((hex.length - 1) / 3);
31
+ const hexArr = getChunksFromString(hex.slice(1), chunkSize);
32
+ const [r, g, b, a] = (hexArr == null ? void 0 : hexArr.map(convertHexUnitTo256)) ?? [];
33
+ return `rgba(${r}, ${g}, ${b}, ${getAlphaFloat(a, alpha)})`;
34
+ }, "hexToRGBA");
35
+ const setColorAlpha = /* @__PURE__ */ __name((colorIn, alpha = 1) => {
36
+ let color = `${(0, import_core.getVariableValue)(colorIn)}`;
37
+ if (color.startsWith("hsl(")) {
38
+ return color.replace("hsl", "hsla").replace(")", `, ${alpha})`);
39
+ }
40
+ if (color.startsWith("#")) {
41
+ return hexToRGBA(color, alpha);
42
+ }
43
+ if (color.startsWith("rgb(")) {
44
+ return color.replace("rgb", "rgba").replace(")", `, ${alpha})`);
45
+ }
46
+ return color;
47
+ }, "setColorAlpha");
48
+ const isValidHex = /* @__PURE__ */ __name((hex) => /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex), "isValidHex");
49
+ const getChunksFromString = /* @__PURE__ */ __name((st, chunkSize = 0) => st.match(new RegExp(`.{${chunkSize}}`, "g")), "getChunksFromString");
50
+ const convertHexUnitTo256 = /* @__PURE__ */ __name((hexStr) => parseInt(hexStr.repeat(2 / hexStr.length), 16), "convertHexUnitTo256");
51
+ const getAlphaFloat = /* @__PURE__ */ __name((a, alpha = 1) => {
52
+ if (a !== void 0) {
53
+ return a / 255;
54
+ }
55
+ if (typeof alpha != "number" || alpha < 0 || alpha > 1) {
56
+ return 1;
57
+ }
58
+ return alpha;
59
+ }, "getAlphaFloat");
60
+ // Annotate the CommonJS export names for ESM import in node:
61
+ 0 && (module.exports = {
62
+ hexToRGBA,
63
+ setColorAlpha
64
+ });
65
+ //# sourceMappingURL=colorUtils.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/colorUtils.tsx"],
4
+ "sourcesContent": ["import { Variable, getVariableValue } from '@tamagui/core'\n\nexport const hexToRGBA = (hex: string, alpha = 1) => {\n if (!isValidHex(hex)) {\n throw new Error('Invalid HEX')\n }\n const chunkSize = Math.floor((hex.length - 1) / 3)\n const hexArr = getChunksFromString(hex.slice(1), chunkSize)\n const [r, g, b, a] = hexArr?.map(convertHexUnitTo256) ?? []\n return `rgba(${r}, ${g}, ${b}, ${getAlphaFloat(a, alpha)})`\n}\n\nexport const setColorAlpha = (colorIn: string | Variable, alpha = 1) => {\n let color = `${getVariableValue(colorIn)}`\n if (color.startsWith('hsl(')) {\n return color.replace('hsl', 'hsla').replace(')', `, ${alpha})`)\n }\n if (color.startsWith('#')) {\n return hexToRGBA(color, alpha)\n }\n if (color.startsWith('rgb(')) {\n return color.replace('rgb', 'rgba').replace(')', `, ${alpha})`)\n }\n return color\n}\n\nconst isValidHex = (hex: string) => /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex)\n\nconst getChunksFromString = (st: string, chunkSize = 0) =>\n st.match(new RegExp(`.{${chunkSize}}`, 'g'))\n\nconst convertHexUnitTo256 = (hexStr: string) => parseInt(hexStr.repeat(2 / hexStr.length), 16)\n\nconst getAlphaFloat = (a: any, alpha = 1) => {\n if (a !== undefined) {\n return a / 255\n }\n if (typeof alpha != 'number' || alpha < 0 || alpha > 1) {\n return 1\n }\n return alpha\n}\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA2C;AAEpC,MAAM,YAAY,wBAAC,KAAa,QAAQ,MAAM;AACnD,MAAI,CAAC,WAAW,GAAG,GAAG;AACpB,UAAM,IAAI,MAAM,aAAa;AAAA,EAC/B;AACA,QAAM,YAAY,KAAK,MAAO,KAAI,SAAS,KAAK,CAAC;AACjD,QAAM,SAAS,oBAAoB,IAAI,MAAM,CAAC,GAAG,SAAS;AAC1D,QAAM,CAAC,GAAG,GAAG,GAAG,KAAK,kCAAQ,IAAI,yBAAwB,CAAC;AAC1D,SAAO,QAAQ,MAAM,MAAM,MAAM,cAAc,GAAG,KAAK;AACzD,GARyB;AAUlB,MAAM,gBAAgB,wBAAC,SAA4B,QAAQ,MAAM;AACtE,MAAI,QAAQ,GAAG,kCAAiB,OAAO;AACvC,MAAI,MAAM,WAAW,MAAM,GAAG;AAC5B,WAAO,MAAM,QAAQ,OAAO,MAAM,EAAE,QAAQ,KAAK,KAAK,QAAQ;AAAA,EAChE;AACA,MAAI,MAAM,WAAW,GAAG,GAAG;AACzB,WAAO,UAAU,OAAO,KAAK;AAAA,EAC/B;AACA,MAAI,MAAM,WAAW,MAAM,GAAG;AAC5B,WAAO,MAAM,QAAQ,OAAO,MAAM,EAAE,QAAQ,KAAK,KAAK,QAAQ;AAAA,EAChE;AACA,SAAO;AACT,GAZ6B;AAc7B,MAAM,aAAa,wBAAC,QAAgB,6BAA6B,KAAK,GAAG,GAAtD;AAEnB,MAAM,sBAAsB,wBAAC,IAAY,YAAY,MACnD,GAAG,MAAM,IAAI,OAAO,KAAK,cAAc,GAAG,CAAC,GADjB;AAG5B,MAAM,sBAAsB,wBAAC,WAAmB,SAAS,OAAO,OAAO,IAAI,OAAO,MAAM,GAAG,EAAE,GAAjE;AAE5B,MAAM,gBAAgB,wBAAC,GAAQ,QAAQ,MAAM;AAC3C,MAAI,MAAM,QAAW;AACnB,WAAO,IAAI;AAAA,EACb;AACA,MAAI,OAAO,SAAS,YAAY,QAAQ,KAAK,QAAQ,GAAG;AACtD,WAAO;AAAA,EACT;AACA,SAAO;AACT,GARsB;",
6
+ "names": []
7
+ }
@@ -0,0 +1,20 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
+ var __getOwnPropNames = Object.getOwnPropertyNames;
4
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
5
+ var __copyProps = (to, from, except, desc) => {
6
+ if (from && typeof from === "object" || typeof from === "function") {
7
+ for (let key of __getOwnPropNames(from))
8
+ if (!__hasOwnProp.call(to, key) && key !== except)
9
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
10
+ }
11
+ return to;
12
+ };
13
+ var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
14
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
15
+ var src_exports = {};
16
+ module.exports = __toCommonJS(src_exports);
17
+ __reExport(src_exports, require("./themes"), module.exports);
18
+ __reExport(src_exports, require("./tokens"), module.exports);
19
+ __reExport(src_exports, require("@tamagui/colors"), module.exports);
20
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/index.tsx"],
4
+ "sourcesContent": ["export * from './themes'\nexport * from './tokens'\nexport * from '@tamagui/colors'\n"],
5
+ "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,qBAAd;AACA,wBAAc,qBADd;AAEA,wBAAc,4BAFd;",
6
+ "names": []
7
+ }
@@ -0,0 +1,276 @@
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __defProps = Object.defineProperties;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
6
+ var __getOwnPropNames = Object.getOwnPropertyNames;
7
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
8
+ var __getProtoOf = Object.getPrototypeOf;
9
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
10
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
11
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
12
+ var __spreadValues = (a, b) => {
13
+ for (var prop in b || (b = {}))
14
+ if (__hasOwnProp.call(b, prop))
15
+ __defNormalProp(a, prop, b[prop]);
16
+ if (__getOwnPropSymbols)
17
+ for (var prop of __getOwnPropSymbols(b)) {
18
+ if (__propIsEnum.call(b, prop))
19
+ __defNormalProp(a, prop, b[prop]);
20
+ }
21
+ return a;
22
+ };
23
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
24
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
25
+ var __export = (target, all) => {
26
+ for (var name in all)
27
+ __defProp(target, name, { get: all[name], enumerable: true });
28
+ };
29
+ var __copyProps = (to, from, except, desc) => {
30
+ if (from && typeof from === "object" || typeof from === "function") {
31
+ for (let key of __getOwnPropNames(from))
32
+ if (!__hasOwnProp.call(to, key) && key !== except)
33
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
34
+ }
35
+ return to;
36
+ };
37
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
38
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
39
+ var themes_exports = {};
40
+ __export(themes_exports, {
41
+ colorSchemes: () => colorSchemes,
42
+ darkGradient: () => darkGradient,
43
+ lightGradient: () => lightGradient,
44
+ themes: () => themes
45
+ });
46
+ module.exports = __toCommonJS(themes_exports);
47
+ var Colors = __toESM(require("@tamagui/colors"));
48
+ var import_colors = require("@tamagui/colors");
49
+ var import_core = require("@tamagui/core");
50
+ var import_colorUtils = require("./colorUtils");
51
+ var import_tokens = require("./tokens");
52
+ const alternates = [1, 2, 3, 4];
53
+ function createThemesFrom(name, getTheme, props) {
54
+ const { shift = 0 } = props;
55
+ const theme = getTheme(0 + shift, props);
56
+ let themeEntries = [[name, theme]];
57
+ const altThemes = alternates.map((alt) => [
58
+ `${name}_alt${alt}`,
59
+ getTheme(alt + shift, props)
60
+ ]);
61
+ const altButtonThemes = alternates.map((_, i) => {
62
+ const [bName, bTheme] = [altThemes[i][0], (altThemes[i + 1] || altThemes[i])[1]];
63
+ return [`${bName}_Button`, bTheme];
64
+ });
65
+ const darkerTheme = getTheme(Math.max(0, shift + (props.isLight ? 1 : -1)), props);
66
+ const activeTheme = makeActiveTheme(theme);
67
+ themeEntries = [
68
+ ...themeEntries,
69
+ ...altThemes,
70
+ ...altButtonThemes,
71
+ [`${name}_Button`, altThemes[0][1]],
72
+ [`${name}_darker`, darkerTheme],
73
+ [`${name}_active`, activeTheme]
74
+ ];
75
+ const themes2 = Object.fromEntries(themeEntries);
76
+ return themes2;
77
+ }
78
+ __name(createThemesFrom, "createThemesFrom");
79
+ const createTheme = /* @__PURE__ */ __name((str = 1, {
80
+ backgrounds,
81
+ isLight = true,
82
+ isBase = false,
83
+ colors = [...backgrounds].reverse(),
84
+ borderColors = isLight ? colors : backgrounds,
85
+ offsets: offsetsProp
86
+ }) => {
87
+ const offsets = {
88
+ borderColor: (offsetsProp == null ? void 0 : offsetsProp.borderColor) ?? (offsetsProp == null ? void 0 : offsetsProp.background) ?? [0, 0, 0, 0],
89
+ background: (offsetsProp == null ? void 0 : offsetsProp.background) ?? [0, 0, 0, 0],
90
+ color: (offsetsProp == null ? void 0 : offsetsProp.color) ?? [0, 0, 0, 0]
91
+ };
92
+ const darkColors = isLight ? colors : backgrounds;
93
+ const lighterDir = isLight ? -1 : 1;
94
+ const darkerDir = -lighterDir;
95
+ const strongerDir = isLight ? darkerDir : lighterDir;
96
+ const get = /* @__PURE__ */ __name((arr, index, name = "background") => {
97
+ return arr[Math.max(0, Math.min(index + (offsets[name][str] || 0), arr.length - 1))];
98
+ }, "get");
99
+ const colorTranslucent = (0, import_colorUtils.setColorAlpha)((0, import_core.getVariableValue)(get(colors, 0 + str, "color")), 0.5);
100
+ let theme = {
101
+ background: get(backgrounds, str),
102
+ backgroundStronger: get(backgrounds, str + strongerDir),
103
+ backgroundSoft: get(backgrounds, str + 3),
104
+ backgroundHover: get(backgrounds, str + lighterDir),
105
+ backgroundPress: get(backgrounds, str + darkerDir * 1),
106
+ backgroundFocus: get(backgrounds, str + darkerDir * 2),
107
+ backgroundTransparent: import_tokens.color.grayA1,
108
+ color: get(colors, 0 + str, "color"),
109
+ colorHover: get(colors, 1 + str, "color"),
110
+ colorPress: get(colors, 2 + str, "color"),
111
+ colorFocus: get(colors, 3 + str, "color"),
112
+ colorTranslucent,
113
+ colorMid: colors[Math.floor(colors.length / 2)],
114
+ shadowColor: isLight ? import_tokens.color.grayA3 : import_tokens.color.grayA8,
115
+ shadowColorHover: darkColors[!isLight ? 1 : 8],
116
+ shadowColorPress: darkColors[!isLight ? 1 : 8],
117
+ shadowColorFocus: darkColors[!isLight ? 1 : 8],
118
+ borderColor: null,
119
+ borderColorHover: null,
120
+ borderColorPress: null,
121
+ borderColorFocus: null
122
+ };
123
+ if (isBase) {
124
+ Object.assign(theme, {
125
+ borderColor: isLight ? get(colors, 8 - str, "borderColor") : get(backgrounds, 2 + str, "borderColor"),
126
+ borderColorHover: isLight ? get(colors, 6 - str, "borderColor") : get(backgrounds, 3 + str, "borderColor"),
127
+ borderColorPress: isLight ? get(colors, 5 - str, "borderColor") : get(backgrounds, 1 + str, "borderColor"),
128
+ borderColorFocus: isLight ? get(colors, 4 - str, "borderColor") : get(backgrounds, 3 + str, "borderColor")
129
+ });
130
+ } else {
131
+ Object.assign(theme, {
132
+ borderColor: get(borderColors, 1 + strongerDir, "borderColor"),
133
+ borderColorHover: get(borderColors, 2 + strongerDir, "borderColor"),
134
+ borderColorPress: get(borderColors, 3 + strongerDir, "borderColor"),
135
+ borderColorFocus: get(borderColors, 4 + strongerDir, "borderColor")
136
+ });
137
+ }
138
+ return theme;
139
+ }, "createTheme");
140
+ const colorSchemes = [
141
+ { name: "blue", colors: Colors.blue, darkColors: Colors.blueDark },
142
+ { name: "gray", colors: Colors.gray, darkColors: Colors.grayDark },
143
+ { name: "green", colors: Colors.green, darkColors: Colors.greenDark },
144
+ { name: "indigo", colors: Colors.indigo, darkColors: Colors.indigoDark },
145
+ { name: "orange", colors: Colors.orange, darkColors: Colors.orangeDark },
146
+ { name: "pink", colors: Colors.pink, darkColors: Colors.pinkDark },
147
+ { name: "purple", colors: Colors.purple, darkColors: Colors.purpleDark },
148
+ { name: "red", colors: Colors.red, darkColors: Colors.redDark },
149
+ { name: "violet", colors: Colors.violet, darkColors: Colors.violetDark },
150
+ { name: "yellow", colors: Colors.yellow, darkColors: Colors.yellowDark },
151
+ { name: "teal", colors: Colors.teal, darkColors: Colors.tealDark },
152
+ { name: "lime", colors: Colors.lime, darkColors: Colors.limeDark },
153
+ { name: "brown", colors: Colors.brown, darkColors: Colors.brownDark }
154
+ ];
155
+ const lightGradient = [
156
+ "#fff",
157
+ "#f4f4f4",
158
+ import_tokens.color.gray1,
159
+ import_tokens.color.gray2,
160
+ import_tokens.color.gray3,
161
+ import_tokens.color.gray4,
162
+ import_tokens.color.gray5,
163
+ import_tokens.color.gray6,
164
+ import_tokens.color.gray7,
165
+ import_tokens.color.gray8,
166
+ import_tokens.color.gray9,
167
+ import_tokens.color.gray10,
168
+ import_tokens.color.gray11,
169
+ import_tokens.color.gray12
170
+ ];
171
+ const darkGradient = [
172
+ "#111111",
173
+ "#151515",
174
+ "#191919",
175
+ "#232323",
176
+ "#282828",
177
+ "#323232",
178
+ "#383838",
179
+ "#424242",
180
+ "#494949",
181
+ "#545454",
182
+ "#626262",
183
+ "#777777"
184
+ ];
185
+ const lightThemes = createThemesFrom("light", createTheme, {
186
+ backgrounds: lightGradient,
187
+ borderColors: lightGradient.slice(2),
188
+ isLight: true
189
+ });
190
+ const darkThemes = createThemesFrom("dark", createTheme, {
191
+ backgrounds: darkGradient,
192
+ colors: lightGradient.slice(2),
193
+ isBase: true,
194
+ isLight: false,
195
+ shift: 1,
196
+ offsets: {
197
+ color: [0, 4, 5, 5, 5, 5]
198
+ }
199
+ });
200
+ const baseThemes = __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, lightThemes), {
201
+ light: __spreadValues(__spreadValues({}, import_colors.allLightColors), lightThemes.light),
202
+ light_active: makeActiveTheme(lightThemes.light),
203
+ light_Card: lightThemes.light,
204
+ light_DrawerFrame: lightThemes.light_alt1,
205
+ light_Button: lightThemes.light_alt1
206
+ }), darkThemes), {
207
+ dark: __spreadValues(__spreadValues({}, import_colors.allDarkColors), darkThemes.dark),
208
+ dark_active: makeActiveTheme(darkThemes.dark),
209
+ dark_Card: darkThemes.dark_alt1,
210
+ dark_DrawerFrame: darkThemes.dark_alt2,
211
+ dark_Button: darkThemes.dark_alt1
212
+ });
213
+ function makeActiveTheme(theme) {
214
+ const res = __spreadValues({}, theme);
215
+ res.backgroundHover = res.background;
216
+ res.colorHover = res.color;
217
+ res.backgroundPress = res.background;
218
+ res.colorPress = res.color;
219
+ return res;
220
+ }
221
+ __name(makeActiveTheme, "makeActiveTheme");
222
+ const colorThemeEntries = colorSchemes.flatMap(({ name, colors, darkColors }) => {
223
+ const [altLightThemes, altDarkThemes] = [
224
+ { colors: darkColors, backgrounds: colors },
225
+ { colors, backgrounds: darkColors }
226
+ ].map((props, i) => {
227
+ const isLight = i === 0;
228
+ const [backgrounds, colors2] = [
229
+ Object.values(props.backgrounds),
230
+ Object.values(props.colors).slice(isLight ? 2 : 2)
231
+ ];
232
+ const scheme = isLight ? "light" : "dark";
233
+ const shift = isLight ? 0 : 1;
234
+ if (!isLight) {
235
+ const [_, h, sp, lp] = backgrounds[0].match(/hsl\(([0-9\.]+), ([0-9\.]+)\%, ([0-9\.]+)\%\)/);
236
+ backgrounds.unshift(`hsl(${h}, ${sp}%, ${parseFloat(lp) / 2}%)`);
237
+ }
238
+ const themeWithAlts = createThemesFrom(name, createTheme, {
239
+ colors: colors2,
240
+ backgrounds,
241
+ borderColors: backgrounds,
242
+ isLight,
243
+ shift,
244
+ isBase: false,
245
+ offsets: {
246
+ background: isLight ? [0, 0, 0, 0, 0, 0] : null,
247
+ borderColor: isLight ? [3, 3, 3, 3, 2] : null,
248
+ color: isLight ? [0, 0, -1, -2, -3, -3, -4] : [-1, -1, -1, -1, -1, -1]
249
+ }
250
+ });
251
+ return Object.entries(themeWithAlts).map(([k, v]) => [`${scheme}_${k}`, v]);
252
+ });
253
+ const lightButtonTheme = altLightThemes[0];
254
+ const darkButtonTheme = altDarkThemes[0];
255
+ return [
256
+ ...altLightThemes,
257
+ [`${lightButtonTheme[0]}_Button`, altLightThemes[2][1]],
258
+ [`${lightButtonTheme[0]}_Card`, altLightThemes[2][1]],
259
+ [`${lightButtonTheme[0]}_DrawerFrame`, altLightThemes[2][1]],
260
+ ...altDarkThemes,
261
+ [`${darkButtonTheme[0]}_Button`, altDarkThemes[2][1]],
262
+ [`${darkButtonTheme[0]}_Card`, altDarkThemes[2][1]],
263
+ [`${darkButtonTheme[0]}_DrawerFrame`, altDarkThemes[2][1]]
264
+ ];
265
+ });
266
+ const colorThemes = Object.fromEntries(colorThemeEntries);
267
+ const allThemes = __spreadValues(__spreadValues({}, baseThemes), colorThemes);
268
+ const themes = allThemes;
269
+ // Annotate the CommonJS export names for ESM import in node:
270
+ 0 && (module.exports = {
271
+ colorSchemes,
272
+ darkGradient,
273
+ lightGradient,
274
+ themes
275
+ });
276
+ //# sourceMappingURL=themes.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/themes.tsx"],
4
+ "sourcesContent": ["import * as Colors from '@tamagui/colors'\nimport { allDarkColors, allLightColors } from '@tamagui/colors'\nimport { Variable, getVariableValue } from '@tamagui/core'\n\nimport { setColorAlpha } from './colorUtils'\nimport { color } from './tokens'\n\n// spaghetti ahead\n\ntype ThemeCreatorProps = {\n shift?: number\n backgrounds: (string | Variable)[]\n borderColors?: (string | Variable)[]\n colors?: (string | Variable)[]\n offsets?: {\n color?: number[] | null\n background?: number[] | null\n borderColor?: number[] | null\n }\n isLight?: boolean\n isBase?: boolean\n}\n\n// helpers\n\nconst alternates = [1, 2, 3, 4] as const\ntype AltKeys = 1 | 2 | 3 | 4 // one less for dark_darker\ntype AltName<Name extends string, Keys extends string | number> = `${Name}_alt${Keys}`\ntype ThemeCreator<A = any> = (str: number, props: ThemeCreatorProps) => A\n\nfunction createThemesFrom<Name extends string, GetTheme extends ThemeCreator = ThemeCreator>(\n name: Name,\n getTheme: GetTheme,\n props: ThemeCreatorProps\n): {\n [key in `${Name}_alt${AltKeys}` | `${Name}` | `${Name}_darker`]: GetTheme extends ThemeCreator<\n infer Theme\n >\n ? Theme\n : never\n} {\n const { shift = 0 } = props\n const theme = getTheme(0 + shift, props)\n let themeEntries: any[] = [[name, theme]]\n const altThemes: any[] = alternates.map((alt) => [\n `${name}_alt${alt}`,\n getTheme(alt + shift, props),\n ])\n const altButtonThemes: any[] = alternates.map((_, i) => {\n const [bName, bTheme] = [altThemes[i][0], (altThemes[i + 1] || altThemes[i])[1]]\n return [`${bName}_Button` as any, bTheme]\n })\n // add these after alts since we rely on positioning\n const darkerTheme = getTheme(Math.max(0, shift + (props.isLight ? 1 : -1)), props)\n const activeTheme = makeActiveTheme(theme)\n themeEntries = [\n ...themeEntries,\n ...altThemes,\n ...altButtonThemes,\n [`${name}_Button`, altThemes[0][1]],\n [`${name}_darker`, darkerTheme],\n [`${name}_active`, activeTheme],\n ]\n const themes = Object.fromEntries(themeEntries)\n // if (props.isLight) {\n // console.log('themes', themes)\n // }\n return themes as any\n}\n\nconst createTheme = (\n str = 1,\n {\n backgrounds,\n isLight = true,\n isBase = false,\n colors = [...backgrounds].reverse(),\n borderColors = isLight ? colors : backgrounds,\n offsets: offsetsProp,\n }: ThemeCreatorProps\n) => {\n const offsets = {\n borderColor: offsetsProp?.borderColor ?? offsetsProp?.background ?? [0, 0, 0, 0],\n background: offsetsProp?.background ?? [0, 0, 0, 0],\n color: offsetsProp?.color ?? [0, 0, 0, 0],\n }\n const darkColors = isLight ? colors : backgrounds\n const lighterDir = isLight ? -1 : 1\n const darkerDir = -lighterDir\n const strongerDir = isLight ? darkerDir : lighterDir\n const get = (arr: any[], index: number, name = 'background') => {\n return arr[Math.max(0, Math.min(index + (offsets[name][str] || 0), arr.length - 1))]\n }\n\n const colorTranslucent = setColorAlpha(getVariableValue(get(colors, 0 + str, 'color')), 0.5)\n\n let theme = {\n background: get(backgrounds, str),\n backgroundStronger: get(backgrounds, str + strongerDir),\n backgroundSoft: get(backgrounds, str + 3),\n backgroundHover: get(backgrounds, str + lighterDir),\n backgroundPress: get(backgrounds, str + darkerDir * 1),\n backgroundFocus: get(backgrounds, str + darkerDir * 2),\n backgroundTransparent: color.grayA1,\n color: get(colors, 0 + str, 'color'),\n colorHover: get(colors, 1 + str, 'color'),\n colorPress: get(colors, 2 + str, 'color'),\n colorFocus: get(colors, 3 + str, 'color'),\n colorTranslucent,\n colorMid: colors[Math.floor(colors.length / 2)],\n shadowColor: isLight ? color.grayA3 : color.grayA8,\n shadowColorHover: darkColors[!isLight ? 1 : 8],\n shadowColorPress: darkColors[!isLight ? 1 : 8],\n shadowColorFocus: darkColors[!isLight ? 1 : 8],\n borderColor: null as any as string | Variable,\n borderColorHover: null as any as string | Variable,\n borderColorPress: null as any as string | Variable,\n borderColorFocus: null as any as string | Variable,\n }\n\n if (isBase) {\n Object.assign(theme, {\n borderColor: isLight\n ? get(colors, 8 - str, 'borderColor')\n : get(backgrounds, 2 + str, 'borderColor'),\n borderColorHover: isLight\n ? get(colors, 6 - str, 'borderColor')\n : get(backgrounds, 3 + str, 'borderColor'),\n borderColorPress: isLight\n ? get(colors, 5 - str, 'borderColor')\n : get(backgrounds, 1 + str, 'borderColor'),\n borderColorFocus: isLight\n ? get(colors, 4 - str, 'borderColor')\n : get(backgrounds, 3 + str, 'borderColor'),\n })\n } else {\n Object.assign(theme, {\n borderColor: get(borderColors, 1 + strongerDir, 'borderColor'),\n borderColorHover: get(borderColors, 2 + strongerDir, 'borderColor'),\n borderColorPress: get(borderColors, 3 + strongerDir, 'borderColor'),\n borderColorFocus: get(borderColors, 4 + strongerDir, 'borderColor'),\n })\n }\n\n return theme\n}\n\nexport const colorSchemes = [\n { name: 'blue', colors: Colors.blue, darkColors: Colors.blueDark },\n { name: 'gray', colors: Colors.gray, darkColors: Colors.grayDark },\n { name: 'green', colors: Colors.green, darkColors: Colors.greenDark },\n { name: 'indigo', colors: Colors.indigo, darkColors: Colors.indigoDark },\n { name: 'orange', colors: Colors.orange, darkColors: Colors.orangeDark },\n { name: 'pink', colors: Colors.pink, darkColors: Colors.pinkDark },\n { name: 'purple', colors: Colors.purple, darkColors: Colors.purpleDark },\n { name: 'red', colors: Colors.red, darkColors: Colors.redDark },\n { name: 'violet', colors: Colors.violet, darkColors: Colors.violetDark },\n { name: 'yellow', colors: Colors.yellow, darkColors: Colors.yellowDark },\n { name: 'teal', colors: Colors.teal, darkColors: Colors.tealDark },\n { name: 'lime', colors: Colors.lime, darkColors: Colors.limeDark },\n { name: 'brown', colors: Colors.brown, darkColors: Colors.brownDark },\n] as const\n\nexport type ColorNames = typeof colorSchemes[number]['name']\n\nexport const lightGradient = [\n '#fff',\n '#f4f4f4',\n color.gray1,\n color.gray2,\n color.gray3,\n color.gray4,\n color.gray5,\n color.gray6,\n color.gray7,\n color.gray8,\n color.gray9,\n color.gray10,\n color.gray11,\n color.gray12,\n]\n\nexport const darkGradient = [\n '#111111',\n '#151515',\n '#191919',\n '#232323',\n '#282828',\n '#323232',\n '#383838',\n '#424242',\n '#494949',\n '#545454',\n '#626262',\n '#777777',\n]\n\nconst lightThemes = createThemesFrom('light', createTheme, {\n backgrounds: lightGradient,\n // isBase: true,\n borderColors: lightGradient.slice(2),\n isLight: true,\n})\n\nconst darkThemes = createThemesFrom('dark', createTheme, {\n backgrounds: darkGradient,\n colors: lightGradient.slice(2),\n isBase: true,\n isLight: false,\n shift: 1,\n offsets: {\n color: [0, 4, 5, 5, 5, 5],\n },\n})\n\nconst baseThemes = {\n // light\n ...lightThemes,\n light: {\n ...allLightColors,\n ...lightThemes.light,\n },\n light_active: makeActiveTheme(lightThemes.light),\n light_Card: lightThemes.light,\n light_DrawerFrame: lightThemes.light_alt1,\n light_Button: lightThemes.light_alt1,\n\n // dark\n ...darkThemes,\n dark: {\n ...allDarkColors,\n ...darkThemes.dark,\n },\n dark_active: makeActiveTheme(darkThemes.dark),\n dark_Card: darkThemes.dark_alt1,\n dark_DrawerFrame: darkThemes.dark_alt2,\n dark_Button: darkThemes.dark_alt1,\n}\n\nfunction makeActiveTheme(theme: any) {\n const res = { ...theme }\n res.backgroundHover = res.background\n res.colorHover = res.color\n res.backgroundPress = res.background\n res.colorPress = res.color\n return res\n}\n\ntype ColorThemeNames =\n | ColorNames\n | AltName<`light_${ColorNames}`, AltKeys>\n | AltName<`dark_${ColorNames}`, AltKeys>\n\nconst colorThemeEntries = colorSchemes.flatMap(({ name, colors, darkColors }) => {\n const [altLightThemes, altDarkThemes] = [\n { colors: darkColors, backgrounds: colors },\n { colors, backgrounds: darkColors },\n ].map((props, i) => {\n const isLight = i === 0\n const [backgrounds, colors] = [\n Object.values(props.backgrounds),\n Object.values(props.colors).slice(isLight ? 2 : 2),\n ] as const\n\n const scheme = isLight ? 'light' : 'dark'\n const shift = isLight ? 0 : 1\n\n if (!isLight) {\n const [_, h, sp, lp] = backgrounds[0].match(/hsl\\(([0-9\\.]+), ([0-9\\.]+)\\%, ([0-9\\.]+)\\%\\)/)!\n backgrounds.unshift(`hsl(${h}, ${sp}%, ${parseFloat(lp) / 2}%)`)\n }\n\n const themeWithAlts = createThemesFrom(name, createTheme, {\n colors,\n backgrounds,\n borderColors: backgrounds,\n isLight,\n shift,\n isBase: false,\n offsets: {\n background: isLight ? [0, 0, 0, 0, 0, 0] : null,\n borderColor: isLight ? [3, 3, 3, 3, 2] : null,\n color: isLight ? [0, 0, -1, -2, -3, -3, -4] : [-1, -1, -1, -1, -1, -1],\n },\n })\n\n return Object.entries(themeWithAlts).map(([k, v]) => [`${scheme}_${k}`, v])\n })\n const lightButtonTheme = altLightThemes[0]\n const darkButtonTheme = altDarkThemes[0]\n return [\n ...altLightThemes,\n [`${lightButtonTheme[0]}_Button`, altLightThemes[2][1]],\n [`${lightButtonTheme[0]}_Card`, altLightThemes[2][1]],\n [`${lightButtonTheme[0]}_DrawerFrame`, altLightThemes[2][1]],\n ...altDarkThemes,\n [`${darkButtonTheme[0]}_Button`, altDarkThemes[2][1]],\n [`${darkButtonTheme[0]}_Card`, altDarkThemes[2][1]],\n [`${darkButtonTheme[0]}_DrawerFrame`, altDarkThemes[2][1]],\n ]\n})\n\ntype MyThemeBase = typeof baseThemes['light_alt1']\n\nconst colorThemes: {\n [key in ColorThemeNames]: MyThemeBase\n} = Object.fromEntries(colorThemeEntries) as any\n\nconst allThemes = {\n ...baseThemes,\n ...colorThemes,\n} as const\n\nexport const themes: {\n [key in keyof typeof allThemes]: typeof baseThemes['light']\n} = allThemes as any\n\n// TODO\n// export function createThemes(props: {\n// colors?:\n// | 'amber'\n// | 'blue'\n// | 'bronze'\n// | 'brown'\n// | 'crimson'\n// | 'cyan'\n// | 'gold'\n// | 'grass'\n// | 'gray'\n// | 'green'\n// | 'indigo'\n// | 'lime'\n// | 'mint'\n// | 'olive'\n// | 'orange'\n// | 'pink'\n// | 'plum'\n// | 'purple'\n// | 'mauve'\n// | 'red'\n// | 'sage'\n// | 'sand'\n// | 'sky'\n// | 'slate'\n// | 'teal'\n// | 'tomato'\n// | 'violet'\n// | 'yellow'\n// alternates?: number\n// }) {}\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAAwB;AACxB,oBAA8C;AAC9C,kBAA2C;AAE3C,wBAA8B;AAC9B,oBAAsB;AAoBtB,MAAM,aAAa,CAAC,GAAG,GAAG,GAAG,CAAC;AAK9B,0BACE,MACA,UACA,OAOA;AACA,QAAM,EAAE,QAAQ,MAAM;AACtB,QAAM,QAAQ,SAAS,IAAI,OAAO,KAAK;AACvC,MAAI,eAAsB,CAAC,CAAC,MAAM,KAAK,CAAC;AACxC,QAAM,YAAmB,WAAW,IAAI,CAAC,QAAQ;AAAA,IAC/C,GAAG,WAAW;AAAA,IACd,SAAS,MAAM,OAAO,KAAK;AAAA,EAC7B,CAAC;AACD,QAAM,kBAAyB,WAAW,IAAI,CAAC,GAAG,MAAM;AACtD,UAAM,CAAC,OAAO,UAAU,CAAC,UAAU,GAAG,IAAK,WAAU,IAAI,MAAM,UAAU,IAAI,EAAE;AAC/E,WAAO,CAAC,GAAG,gBAAuB,MAAM;AAAA,EAC1C,CAAC;AAED,QAAM,cAAc,SAAS,KAAK,IAAI,GAAG,QAAS,OAAM,UAAU,IAAI,GAAG,GAAG,KAAK;AACjF,QAAM,cAAc,gBAAgB,KAAK;AACzC,iBAAe;AAAA,IACb,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,CAAC,GAAG,eAAe,UAAU,GAAG,EAAE;AAAA,IAClC,CAAC,GAAG,eAAe,WAAW;AAAA,IAC9B,CAAC,GAAG,eAAe,WAAW;AAAA,EAChC;AACA,QAAM,UAAS,OAAO,YAAY,YAAY;AAI9C,SAAO;AACT;AAtCS;AAwCT,MAAM,cAAc,wBAClB,MAAM,GACN;AAAA,EACE;AAAA,EACA,UAAU;AAAA,EACV,SAAS;AAAA,EACT,SAAS,CAAC,GAAG,WAAW,EAAE,QAAQ;AAAA,EAClC,eAAe,UAAU,SAAS;AAAA,EAClC,SAAS;AAAA,MAER;AACH,QAAM,UAAU;AAAA,IACd,aAAa,4CAAa,gBAAe,4CAAa,eAAc,CAAC,GAAG,GAAG,GAAG,CAAC;AAAA,IAC/E,YAAY,4CAAa,eAAc,CAAC,GAAG,GAAG,GAAG,CAAC;AAAA,IAClD,OAAO,4CAAa,UAAS,CAAC,GAAG,GAAG,GAAG,CAAC;AAAA,EAC1C;AACA,QAAM,aAAa,UAAU,SAAS;AACtC,QAAM,aAAa,UAAU,KAAK;AAClC,QAAM,YAAY,CAAC;AACnB,QAAM,cAAc,UAAU,YAAY;AAC1C,QAAM,MAAM,wBAAC,KAAY,OAAe,OAAO,iBAAiB;AAC9D,WAAO,IAAI,KAAK,IAAI,GAAG,KAAK,IAAI,QAAS,SAAQ,MAAM,QAAQ,IAAI,IAAI,SAAS,CAAC,CAAC;AAAA,EACpF,GAFY;AAIZ,QAAM,mBAAmB,qCAAc,kCAAiB,IAAI,QAAQ,IAAI,KAAK,OAAO,CAAC,GAAG,GAAG;AAE3F,MAAI,QAAQ;AAAA,IACV,YAAY,IAAI,aAAa,GAAG;AAAA,IAChC,oBAAoB,IAAI,aAAa,MAAM,WAAW;AAAA,IACtD,gBAAgB,IAAI,aAAa,MAAM,CAAC;AAAA,IACxC,iBAAiB,IAAI,aAAa,MAAM,UAAU;AAAA,IAClD,iBAAiB,IAAI,aAAa,MAAM,YAAY,CAAC;AAAA,IACrD,iBAAiB,IAAI,aAAa,MAAM,YAAY,CAAC;AAAA,IACrD,uBAAuB,oBAAM;AAAA,IAC7B,OAAO,IAAI,QAAQ,IAAI,KAAK,OAAO;AAAA,IACnC,YAAY,IAAI,QAAQ,IAAI,KAAK,OAAO;AAAA,IACxC,YAAY,IAAI,QAAQ,IAAI,KAAK,OAAO;AAAA,IACxC,YAAY,IAAI,QAAQ,IAAI,KAAK,OAAO;AAAA,IACxC;AAAA,IACA,UAAU,OAAO,KAAK,MAAM,OAAO,SAAS,CAAC;AAAA,IAC7C,aAAa,UAAU,oBAAM,SAAS,oBAAM;AAAA,IAC5C,kBAAkB,WAAW,CAAC,UAAU,IAAI;AAAA,IAC5C,kBAAkB,WAAW,CAAC,UAAU,IAAI;AAAA,IAC5C,kBAAkB,WAAW,CAAC,UAAU,IAAI;AAAA,IAC5C,aAAa;AAAA,IACb,kBAAkB;AAAA,IAClB,kBAAkB;AAAA,IAClB,kBAAkB;AAAA,EACpB;AAEA,MAAI,QAAQ;AACV,WAAO,OAAO,OAAO;AAAA,MACnB,aAAa,UACT,IAAI,QAAQ,IAAI,KAAK,aAAa,IAClC,IAAI,aAAa,IAAI,KAAK,aAAa;AAAA,MAC3C,kBAAkB,UACd,IAAI,QAAQ,IAAI,KAAK,aAAa,IAClC,IAAI,aAAa,IAAI,KAAK,aAAa;AAAA,MAC3C,kBAAkB,UACd,IAAI,QAAQ,IAAI,KAAK,aAAa,IAClC,IAAI,aAAa,IAAI,KAAK,aAAa;AAAA,MAC3C,kBAAkB,UACd,IAAI,QAAQ,IAAI,KAAK,aAAa,IAClC,IAAI,aAAa,IAAI,KAAK,aAAa;AAAA,IAC7C,CAAC;AAAA,EACH,OAAO;AACL,WAAO,OAAO,OAAO;AAAA,MACnB,aAAa,IAAI,cAAc,IAAI,aAAa,aAAa;AAAA,MAC7D,kBAAkB,IAAI,cAAc,IAAI,aAAa,aAAa;AAAA,MAClE,kBAAkB,IAAI,cAAc,IAAI,aAAa,aAAa;AAAA,MAClE,kBAAkB,IAAI,cAAc,IAAI,aAAa,aAAa;AAAA,IACpE,CAAC;AAAA,EACH;AAEA,SAAO;AACT,GA3EoB;AA6Eb,MAAM,eAAe;AAAA,EAC1B,EAAE,MAAM,QAAQ,QAAQ,OAAO,MAAM,YAAY,OAAO,SAAS;AAAA,EACjE,EAAE,MAAM,QAAQ,QAAQ,OAAO,MAAM,YAAY,OAAO,SAAS;AAAA,EACjE,EAAE,MAAM,SAAS,QAAQ,OAAO,OAAO,YAAY,OAAO,UAAU;AAAA,EACpE,EAAE,MAAM,UAAU,QAAQ,OAAO,QAAQ,YAAY,OAAO,WAAW;AAAA,EACvE,EAAE,MAAM,UAAU,QAAQ,OAAO,QAAQ,YAAY,OAAO,WAAW;AAAA,EACvE,EAAE,MAAM,QAAQ,QAAQ,OAAO,MAAM,YAAY,OAAO,SAAS;AAAA,EACjE,EAAE,MAAM,UAAU,QAAQ,OAAO,QAAQ,YAAY,OAAO,WAAW;AAAA,EACvE,EAAE,MAAM,OAAO,QAAQ,OAAO,KAAK,YAAY,OAAO,QAAQ;AAAA,EAC9D,EAAE,MAAM,UAAU,QAAQ,OAAO,QAAQ,YAAY,OAAO,WAAW;AAAA,EACvE,EAAE,MAAM,UAAU,QAAQ,OAAO,QAAQ,YAAY,OAAO,WAAW;AAAA,EACvE,EAAE,MAAM,QAAQ,QAAQ,OAAO,MAAM,YAAY,OAAO,SAAS;AAAA,EACjE,EAAE,MAAM,QAAQ,QAAQ,OAAO,MAAM,YAAY,OAAO,SAAS;AAAA,EACjE,EAAE,MAAM,SAAS,QAAQ,OAAO,OAAO,YAAY,OAAO,UAAU;AACtE;AAIO,MAAM,gBAAgB;AAAA,EAC3B;AAAA,EACA;AAAA,EACA,oBAAM;AAAA,EACN,oBAAM;AAAA,EACN,oBAAM;AAAA,EACN,oBAAM;AAAA,EACN,oBAAM;AAAA,EACN,oBAAM;AAAA,EACN,oBAAM;AAAA,EACN,oBAAM;AAAA,EACN,oBAAM;AAAA,EACN,oBAAM;AAAA,EACN,oBAAM;AAAA,EACN,oBAAM;AACR;AAEO,MAAM,eAAe;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,MAAM,cAAc,iBAAiB,SAAS,aAAa;AAAA,EACzD,aAAa;AAAA,EAEb,cAAc,cAAc,MAAM,CAAC;AAAA,EACnC,SAAS;AACX,CAAC;AAED,MAAM,aAAa,iBAAiB,QAAQ,aAAa;AAAA,EACvD,aAAa;AAAA,EACb,QAAQ,cAAc,MAAM,CAAC;AAAA,EAC7B,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,IACP,OAAO,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAAA,EAC1B;AACF,CAAC;AAED,MAAM,aAAa,8DAEd,cAFc;AAAA,EAGjB,OAAO,kCACF,+BACA,YAAY;AAAA,EAEjB,cAAc,gBAAgB,YAAY,KAAK;AAAA,EAC/C,YAAY,YAAY;AAAA,EACxB,mBAAmB,YAAY;AAAA,EAC/B,cAAc,YAAY;AAAA,IAGvB,aAbc;AAAA,EAcjB,MAAM,kCACD,8BACA,WAAW;AAAA,EAEhB,aAAa,gBAAgB,WAAW,IAAI;AAAA,EAC5C,WAAW,WAAW;AAAA,EACtB,kBAAkB,WAAW;AAAA,EAC7B,aAAa,WAAW;AAC1B;AAEA,yBAAyB,OAAY;AACnC,QAAM,MAAM,mBAAK;AACjB,MAAI,kBAAkB,IAAI;AAC1B,MAAI,aAAa,IAAI;AACrB,MAAI,kBAAkB,IAAI;AAC1B,MAAI,aAAa,IAAI;AACrB,SAAO;AACT;AAPS;AAcT,MAAM,oBAAoB,aAAa,QAAQ,CAAC,EAAE,MAAM,QAAQ,iBAAiB;AAC/E,QAAM,CAAC,gBAAgB,iBAAiB;AAAA,IACtC,EAAE,QAAQ,YAAY,aAAa,OAAO;AAAA,IAC1C,EAAE,QAAQ,aAAa,WAAW;AAAA,EACpC,EAAE,IAAI,CAAC,OAAO,MAAM;AAClB,UAAM,UAAU,MAAM;AACtB,UAAM,CAAC,aAAa,WAAU;AAAA,MAC5B,OAAO,OAAO,MAAM,WAAW;AAAA,MAC/B,OAAO,OAAO,MAAM,MAAM,EAAE,MAAM,UAAU,IAAI,CAAC;AAAA,IACnD;AAEA,UAAM,SAAS,UAAU,UAAU;AACnC,UAAM,QAAQ,UAAU,IAAI;AAE5B,QAAI,CAAC,SAAS;AACZ,YAAM,CAAC,GAAG,GAAG,IAAI,MAAM,YAAY,GAAG,MAAM,+CAA+C;AAC3F,kBAAY,QAAQ,OAAO,MAAM,QAAQ,WAAW,EAAE,IAAI,KAAK;AAAA,IACjE;AAEA,UAAM,gBAAgB,iBAAiB,MAAM,aAAa;AAAA,MACxD;AAAA,MACA;AAAA,MACA,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,MACR,SAAS;AAAA,QACP,YAAY,UAAU,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC,IAAI;AAAA,QAC3C,aAAa,UAAU,CAAC,GAAG,GAAG,GAAG,GAAG,CAAC,IAAI;AAAA,QACzC,OAAO,UAAU,CAAC,GAAG,GAAG,IAAI,IAAI,IAAI,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,IAAI,IAAI,IAAI,EAAE;AAAA,MACvE;AAAA,IACF,CAAC;AAED,WAAO,OAAO,QAAQ,aAAa,EAAE,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,GAAG,UAAU,KAAK,CAAC,CAAC;AAAA,EAC5E,CAAC;AACD,QAAM,mBAAmB,eAAe;AACxC,QAAM,kBAAkB,cAAc;AACtC,SAAO;AAAA,IACL,GAAG;AAAA,IACH,CAAC,GAAG,iBAAiB,aAAa,eAAe,GAAG,EAAE;AAAA,IACtD,CAAC,GAAG,iBAAiB,WAAW,eAAe,GAAG,EAAE;AAAA,IACpD,CAAC,GAAG,iBAAiB,kBAAkB,eAAe,GAAG,EAAE;AAAA,IAC3D,GAAG;AAAA,IACH,CAAC,GAAG,gBAAgB,aAAa,cAAc,GAAG,EAAE;AAAA,IACpD,CAAC,GAAG,gBAAgB,WAAW,cAAc,GAAG,EAAE;AAAA,IAClD,CAAC,GAAG,gBAAgB,kBAAkB,cAAc,GAAG,EAAE;AAAA,EAC3D;AACF,CAAC;AAID,MAAM,cAEF,OAAO,YAAY,iBAAiB;AAExC,MAAM,YAAY,kCACb,aACA;AAGE,MAAM,SAET;",
6
+ "names": []
7
+ }
@@ -0,0 +1,82 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
+ var __getOwnPropNames = Object.getOwnPropertyNames;
4
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
7
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8
+ var __spreadValues = (a, b) => {
9
+ for (var prop in b || (b = {}))
10
+ if (__hasOwnProp.call(b, prop))
11
+ __defNormalProp(a, prop, b[prop]);
12
+ if (__getOwnPropSymbols)
13
+ for (var prop of __getOwnPropSymbols(b)) {
14
+ if (__propIsEnum.call(b, prop))
15
+ __defNormalProp(a, prop, b[prop]);
16
+ }
17
+ return a;
18
+ };
19
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
20
+ var __export = (target, all) => {
21
+ for (var name in all)
22
+ __defProp(target, name, { get: all[name], enumerable: true });
23
+ };
24
+ var __copyProps = (to, from, except, desc) => {
25
+ if (from && typeof from === "object" || typeof from === "function") {
26
+ for (let key of __getOwnPropNames(from))
27
+ if (!__hasOwnProp.call(to, key) && key !== except)
28
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
29
+ }
30
+ return to;
31
+ };
32
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
33
+ var tokens_exports = {};
34
+ __export(tokens_exports, {
35
+ color: () => color,
36
+ getSizeAt: () => getSizeAt,
37
+ radius: () => radius,
38
+ size: () => size,
39
+ sizeKeys: () => sizeKeys,
40
+ space: () => space,
41
+ zIndex: () => zIndex
42
+ });
43
+ module.exports = __toCommonJS(tokens_exports);
44
+ var import_colors = require("@tamagui/colors");
45
+ const sizeKeys = ["true", "0", "0.25", "0.5", "1", "1.5", "2", "2.5", "3", "3.5", "4", "4.5", "5", "5.5", "6", "6.5", "7", "7.5", "8", "9", "10", "11", "12", "13", "14"];
46
+ const getSizeAt = /* @__PURE__ */ __name((index) => index === 0 ? 0 : Math.round(Math.pow(1.6, index)) + Math.floor(3 * index), "getSizeAt");
47
+ const size = Object.fromEntries(sizeKeys.map((key) => {
48
+ return [key, getSizeAt(key === "true" ? 4 : +key)];
49
+ }));
50
+ const space = __spreadValues(__spreadValues({}, size), Object.fromEntries(Object.entries(size).map(([k, v]) => [`-${k}`, -v])));
51
+ const zIndex = {
52
+ 0: 0,
53
+ 1: 100,
54
+ 2: 200,
55
+ 3: 300,
56
+ 4: 400,
57
+ 5: 500
58
+ };
59
+ const color = __spreadValues(__spreadValues({}, import_colors.allLightColors), import_colors.darkColorsPostfixed);
60
+ const radius = {
61
+ 0: 0,
62
+ 1: 3,
63
+ 2: 5,
64
+ 3: 7,
65
+ 4: 9,
66
+ 5: 10,
67
+ 6: 12,
68
+ 7: 16,
69
+ 8: 20,
70
+ 9: 30
71
+ };
72
+ // Annotate the CommonJS export names for ESM import in node:
73
+ 0 && (module.exports = {
74
+ color,
75
+ getSizeAt,
76
+ radius,
77
+ size,
78
+ sizeKeys,
79
+ space,
80
+ zIndex
81
+ });
82
+ //# sourceMappingURL=tokens.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/tokens.tsx"],
4
+ "sourcesContent": ["import { allLightColors, darkColorsPostfixed } from '@tamagui/colors'\n\n// acknowledge you need more granularity at the smaller sizes with .5s\n// prettier-ignore\nexport const sizeKeys = ['true', '0', '0.25', '0.5', '1', '1.5', '2', '2.5', '3', '3.5', '4', '4.5', '5', '5.5', '6', '6.5', '7', '7.5', '8', '9', '10', '11', '12', '13', '14'] as const\n\n// slightly more than double every 2 indices apart\nexport const getSizeAt = (index: number) =>\n index === 0 ? 0 : Math.round(Math.pow(1.6, index)) + Math.floor(3 * index)\n\nexport const size: {\n [key in typeof sizeKeys[any]]: number\n} = Object.fromEntries(\n sizeKeys.map((key) => {\n return [key, getSizeAt(key === 'true' ? 4 : +key)]\n })\n) as any\n\ntype Sizes = typeof size\ntype SizeKeys = keyof Sizes\n\nexport const space: {\n [Key in `-${SizeKeys}` | SizeKeys]: Key extends keyof Sizes ? Sizes[Key] : number\n} = {\n ...size,\n ...Object.fromEntries(Object.entries(size).map(([k, v]) => [`-${k}`, -v])),\n} as any\n\nexport const zIndex = {\n 0: 0,\n 1: 100,\n 2: 200,\n 3: 300,\n 4: 400,\n 5: 500,\n}\n\nexport const color = {\n ...allLightColors,\n ...darkColorsPostfixed,\n}\n\nexport const radius = {\n 0: 0,\n 1: 3,\n 2: 5,\n 3: 7,\n 4: 9,\n 5: 10,\n 6: 12,\n 7: 16,\n 8: 20,\n 9: 30,\n}\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAAoD;AAI7C,MAAM,WAAW,CAAC,QAAQ,KAAK,QAAQ,OAAO,KAAK,OAAO,KAAK,OAAO,KAAK,OAAO,KAAK,OAAO,KAAK,OAAO,KAAK,OAAO,KAAK,OAAO,KAAK,KAAK,MAAM,MAAM,MAAM,MAAM,IAAI;AAGxK,MAAM,YAAY,wBAAC,UACxB,UAAU,IAAI,IAAI,KAAK,MAAM,KAAK,IAAI,KAAK,KAAK,CAAC,IAAI,KAAK,MAAM,IAAI,KAAK,GADlD;AAGlB,MAAM,OAET,OAAO,YACT,SAAS,IAAI,CAAC,QAAQ;AACpB,SAAO,CAAC,KAAK,UAAU,QAAQ,SAAS,IAAI,CAAC,GAAG,CAAC;AACnD,CAAC,CACH;AAKO,MAAM,QAET,kCACC,OACA,OAAO,YAAY,OAAO,QAAQ,IAAI,EAAE,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC;AAGpE,MAAM,SAAS;AAAA,EACpB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEO,MAAM,QAAQ,kCAChB,+BACA;AAGE,MAAM,SAAS;AAAA,EACpB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;",
6
+ "names": []
7
+ }
@@ -0,0 +1,43 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
3
+ import { getVariableValue } from "@tamagui/core";
4
+ const hexToRGBA = /* @__PURE__ */ __name((hex, alpha = 1) => {
5
+ var _a;
6
+ if (!isValidHex(hex)) {
7
+ throw new Error("Invalid HEX");
8
+ }
9
+ const chunkSize = Math.floor((hex.length - 1) / 3);
10
+ const hexArr = getChunksFromString(hex.slice(1), chunkSize);
11
+ const [r, g, b, a] = (_a = hexArr == null ? void 0 : hexArr.map(convertHexUnitTo256)) != null ? _a : [];
12
+ return `rgba(${r}, ${g}, ${b}, ${getAlphaFloat(a, alpha)})`;
13
+ }, "hexToRGBA");
14
+ const setColorAlpha = /* @__PURE__ */ __name((colorIn, alpha = 1) => {
15
+ let color = `${getVariableValue(colorIn)}`;
16
+ if (color.startsWith("hsl(")) {
17
+ return color.replace("hsl", "hsla").replace(")", `, ${alpha})`);
18
+ }
19
+ if (color.startsWith("#")) {
20
+ return hexToRGBA(color, alpha);
21
+ }
22
+ if (color.startsWith("rgb(")) {
23
+ return color.replace("rgb", "rgba").replace(")", `, ${alpha})`);
24
+ }
25
+ return color;
26
+ }, "setColorAlpha");
27
+ const isValidHex = /* @__PURE__ */ __name((hex) => /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex), "isValidHex");
28
+ const getChunksFromString = /* @__PURE__ */ __name((st, chunkSize = 0) => st.match(new RegExp(`.{${chunkSize}}`, "g")), "getChunksFromString");
29
+ const convertHexUnitTo256 = /* @__PURE__ */ __name((hexStr) => parseInt(hexStr.repeat(2 / hexStr.length), 16), "convertHexUnitTo256");
30
+ const getAlphaFloat = /* @__PURE__ */ __name((a, alpha = 1) => {
31
+ if (a !== void 0) {
32
+ return a / 255;
33
+ }
34
+ if (typeof alpha != "number" || alpha < 0 || alpha > 1) {
35
+ return 1;
36
+ }
37
+ return alpha;
38
+ }, "getAlphaFloat");
39
+ export {
40
+ hexToRGBA,
41
+ setColorAlpha
42
+ };
43
+ //# sourceMappingURL=colorUtils.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/colorUtils.tsx"],
4
+ "sourcesContent": ["import { Variable, getVariableValue } from '@tamagui/core'\n\nexport const hexToRGBA = (hex: string, alpha = 1) => {\n if (!isValidHex(hex)) {\n throw new Error('Invalid HEX')\n }\n const chunkSize = Math.floor((hex.length - 1) / 3)\n const hexArr = getChunksFromString(hex.slice(1), chunkSize)\n const [r, g, b, a] = hexArr?.map(convertHexUnitTo256) ?? []\n return `rgba(${r}, ${g}, ${b}, ${getAlphaFloat(a, alpha)})`\n}\n\nexport const setColorAlpha = (colorIn: string | Variable, alpha = 1) => {\n let color = `${getVariableValue(colorIn)}`\n if (color.startsWith('hsl(')) {\n return color.replace('hsl', 'hsla').replace(')', `, ${alpha})`)\n }\n if (color.startsWith('#')) {\n return hexToRGBA(color, alpha)\n }\n if (color.startsWith('rgb(')) {\n return color.replace('rgb', 'rgba').replace(')', `, ${alpha})`)\n }\n return color\n}\n\nconst isValidHex = (hex: string) => /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex)\n\nconst getChunksFromString = (st: string, chunkSize = 0) =>\n st.match(new RegExp(`.{${chunkSize}}`, 'g'))\n\nconst convertHexUnitTo256 = (hexStr: string) => parseInt(hexStr.repeat(2 / hexStr.length), 16)\n\nconst getAlphaFloat = (a: any, alpha = 1) => {\n if (a !== undefined) {\n return a / 255\n }\n if (typeof alpha != 'number' || alpha < 0 || alpha > 1) {\n return 1\n }\n return alpha\n}\n"],
5
+ "mappings": ";;AAAA;AAEO,MAAM,YAAY,wBAAC,KAAa,QAAQ,MAAM;AAFrD;AAGE,MAAI,CAAC,WAAW,GAAG,GAAG;AACpB,UAAM,IAAI,MAAM,aAAa;AAAA,EAC/B;AACA,QAAM,YAAY,KAAK,MAAO,KAAI,SAAS,KAAK,CAAC;AACjD,QAAM,SAAS,oBAAoB,IAAI,MAAM,CAAC,GAAG,SAAS;AAC1D,QAAM,CAAC,GAAG,GAAG,GAAG,KAAK,uCAAQ,IAAI,yBAAZ,YAAoC,CAAC;AAC1D,SAAO,QAAQ,MAAM,MAAM,MAAM,cAAc,GAAG,KAAK;AACzD,GARyB;AAUlB,MAAM,gBAAgB,wBAAC,SAA4B,QAAQ,MAAM;AACtE,MAAI,QAAQ,GAAG,iBAAiB,OAAO;AACvC,MAAI,MAAM,WAAW,MAAM,GAAG;AAC5B,WAAO,MAAM,QAAQ,OAAO,MAAM,EAAE,QAAQ,KAAK,KAAK,QAAQ;AAAA,EAChE;AACA,MAAI,MAAM,WAAW,GAAG,GAAG;AACzB,WAAO,UAAU,OAAO,KAAK;AAAA,EAC/B;AACA,MAAI,MAAM,WAAW,MAAM,GAAG;AAC5B,WAAO,MAAM,QAAQ,OAAO,MAAM,EAAE,QAAQ,KAAK,KAAK,QAAQ;AAAA,EAChE;AACA,SAAO;AACT,GAZ6B;AAc7B,MAAM,aAAa,wBAAC,QAAgB,6BAA6B,KAAK,GAAG,GAAtD;AAEnB,MAAM,sBAAsB,wBAAC,IAAY,YAAY,MACnD,GAAG,MAAM,IAAI,OAAO,KAAK,cAAc,GAAG,CAAC,GADjB;AAG5B,MAAM,sBAAsB,wBAAC,WAAmB,SAAS,OAAO,OAAO,IAAI,OAAO,MAAM,GAAG,EAAE,GAAjE;AAE5B,MAAM,gBAAgB,wBAAC,GAAQ,QAAQ,MAAM;AAC3C,MAAI,MAAM,QAAW;AACnB,WAAO,IAAI;AAAA,EACb;AACA,MAAI,OAAO,SAAS,YAAY,QAAQ,KAAK,QAAQ,GAAG;AACtD,WAAO;AAAA,EACT;AACA,SAAO;AACT,GARsB;",
6
+ "names": []
7
+ }
@@ -0,0 +1,4 @@
1
+ export * from "./themes";
2
+ export * from "./tokens";
3
+ export * from "@tamagui/colors";
4
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/index.tsx"],
4
+ "sourcesContent": ["export * from './themes'\nexport * from './tokens'\nexport * from '@tamagui/colors'\n"],
5
+ "mappings": "AAAA;AACA;AACA;",
6
+ "names": []
7
+ }