@tamagui/theme-base 1.0.0-canary.204 → 1.0.1-beta.102
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/colorUtils.js +9 -10
- package/dist/cjs/colorUtils.js.map +1 -1
- package/dist/cjs/themes.js +162 -110
- package/dist/cjs/themes.js.map +2 -2
- package/dist/cjs/tokens.js +97 -26
- package/dist/cjs/tokens.js.map +2 -2
- package/dist/esm/colorUtils.js +10 -13
- package/dist/esm/colorUtils.js.map +1 -1
- package/dist/esm/themes.js +189 -126
- package/dist/esm/themes.js.map +2 -2
- package/dist/esm/tokens.js +130 -23
- package/dist/esm/tokens.js.map +2 -2
- package/dist/jsx/colorUtils.js +10 -11
- package/dist/jsx/colorUtils.js.map +7 -0
- package/dist/jsx/index.js +1 -0
- package/dist/jsx/index.js.map +7 -0
- package/dist/jsx/themes.js +170 -113
- package/dist/jsx/themes.js.map +7 -0
- package/dist/jsx/tokens.js +145 -23
- package/dist/jsx/tokens.js.map +7 -0
- package/package.json +9 -6
- package/src/colorUtils.tsx +42 -0
- package/src/index.tsx +3 -0
- package/src/themes.tsx +401 -0
- package/src/tokens.tsx +195 -0
- package/types/colorUtils.d.ts +0 -0
- package/types/colorUtils.d.ts.map +0 -0
- package/types/index.d.ts +0 -0
- package/types/index.d.ts.map +0 -0
- package/types/themes.d.ts +2071 -3328
- package/types/themes.d.ts.map +1 -1
- package/types/tokens.d.ts +531 -186
- package/types/tokens.d.ts.map +1 -1
- package/LICENSE +0 -21
package/dist/cjs/colorUtils.js
CHANGED
|
@@ -2,7 +2,6 @@ var __defProp = Object.defineProperty;
|
|
|
2
2
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
3
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
4
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
-
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
6
5
|
var __export = (target, all) => {
|
|
7
6
|
for (var name in all)
|
|
8
7
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -23,7 +22,7 @@ __export(colorUtils_exports, {
|
|
|
23
22
|
});
|
|
24
23
|
module.exports = __toCommonJS(colorUtils_exports);
|
|
25
24
|
var import_core = require("@tamagui/core");
|
|
26
|
-
const hexToRGBA =
|
|
25
|
+
const hexToRGBA = (hex, alpha = 1) => {
|
|
27
26
|
if (!isValidHex(hex)) {
|
|
28
27
|
throw new Error("Invalid HEX");
|
|
29
28
|
}
|
|
@@ -31,8 +30,8 @@ const hexToRGBA = /* @__PURE__ */ __name((hex, alpha = 1) => {
|
|
|
31
30
|
const hexArr = getChunksFromString(hex.slice(1), chunkSize);
|
|
32
31
|
const [r, g, b, a] = (hexArr == null ? void 0 : hexArr.map(convertHexUnitTo256)) ?? [];
|
|
33
32
|
return `rgba(${r}, ${g}, ${b}, ${getAlphaFloat(a, alpha)})`;
|
|
34
|
-
}
|
|
35
|
-
const setColorAlpha =
|
|
33
|
+
};
|
|
34
|
+
const setColorAlpha = (colorIn, alpha = 1) => {
|
|
36
35
|
let color = `${(0, import_core.getVariableValue)(colorIn)}`;
|
|
37
36
|
if (color.startsWith("hsl(")) {
|
|
38
37
|
return color.replace("hsl", "hsla").replace(")", `, ${alpha})`);
|
|
@@ -44,11 +43,11 @@ const setColorAlpha = /* @__PURE__ */ __name((colorIn, alpha = 1) => {
|
|
|
44
43
|
return color.replace("rgb", "rgba").replace(")", `, ${alpha})`);
|
|
45
44
|
}
|
|
46
45
|
return color;
|
|
47
|
-
}
|
|
48
|
-
const isValidHex =
|
|
49
|
-
const getChunksFromString =
|
|
50
|
-
const convertHexUnitTo256 =
|
|
51
|
-
const getAlphaFloat =
|
|
46
|
+
};
|
|
47
|
+
const isValidHex = (hex) => /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex);
|
|
48
|
+
const getChunksFromString = (st, chunkSize = 0) => st.match(new RegExp(`.{${chunkSize}}`, "g"));
|
|
49
|
+
const convertHexUnitTo256 = (hexStr) => parseInt(hexStr.repeat(2 / hexStr.length), 16);
|
|
50
|
+
const getAlphaFloat = (a, alpha = 1) => {
|
|
52
51
|
if (a !== void 0) {
|
|
53
52
|
return a / 255;
|
|
54
53
|
}
|
|
@@ -56,7 +55,7 @@ const getAlphaFloat = /* @__PURE__ */ __name((a, alpha = 1) => {
|
|
|
56
55
|
return 1;
|
|
57
56
|
}
|
|
58
57
|
return alpha;
|
|
59
|
-
}
|
|
58
|
+
};
|
|
60
59
|
// Annotate the CommonJS export names for ESM import in node:
|
|
61
60
|
0 && (module.exports = {
|
|
62
61
|
hexToRGBA,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/colorUtils.tsx"],
|
|
4
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": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA2C;AAEpC,MAAM,YAAY,CAAC,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;AAEO,MAAM,gBAAgB,CAAC,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;AAEA,MAAM,aAAa,CAAC,QAAgB,6BAA6B,KAAK,GAAG;AAEzE,MAAM,sBAAsB,CAAC,IAAY,YAAY,MACnD,GAAG,MAAM,IAAI,OAAO,KAAK,cAAc,GAAG,CAAC;AAE7C,MAAM,sBAAsB,CAAC,WAAmB,SAAS,OAAO,OAAO,IAAI,OAAO,MAAM,GAAG,EAAE;AAE7F,MAAM,gBAAgB,CAAC,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;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/themes.js
CHANGED
|
@@ -1,11 +1,9 @@
|
|
|
1
|
-
var __create = Object.create;
|
|
2
1
|
var __defProp = Object.defineProperty;
|
|
3
2
|
var __defProps = Object.defineProperties;
|
|
4
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
4
|
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
6
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
6
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
8
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
9
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
8
|
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
9
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
@@ -21,7 +19,6 @@ var __spreadValues = (a, b) => {
|
|
|
21
19
|
return a;
|
|
22
20
|
};
|
|
23
21
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
24
|
-
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
25
22
|
var __export = (target, all) => {
|
|
26
23
|
for (var name in all)
|
|
27
24
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -34,54 +31,78 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
34
31
|
}
|
|
35
32
|
return to;
|
|
36
33
|
};
|
|
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
34
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
39
35
|
var themes_exports = {};
|
|
40
36
|
__export(themes_exports, {
|
|
37
|
+
colorNames: () => colorNames,
|
|
41
38
|
colorSchemes: () => colorSchemes,
|
|
42
|
-
darkGradient: () => darkGradient,
|
|
43
|
-
lightGradient: () => lightGradient,
|
|
44
39
|
themes: () => themes
|
|
45
40
|
});
|
|
46
41
|
module.exports = __toCommonJS(themes_exports);
|
|
47
|
-
var Colors = __toESM(require("@tamagui/colors"));
|
|
48
|
-
var import_colors = require("@tamagui/colors");
|
|
49
42
|
var import_core = require("@tamagui/core");
|
|
50
43
|
var import_colorUtils = require("./colorUtils");
|
|
51
44
|
var import_tokens = require("./tokens");
|
|
45
|
+
const { color } = import_tokens.tokens;
|
|
52
46
|
const alternates = [1, 2, 3, 4];
|
|
47
|
+
const alts = [1, 2, 3];
|
|
53
48
|
function createThemesFrom(name, getTheme, props) {
|
|
54
49
|
const { shift = 0 } = props;
|
|
55
50
|
const theme = getTheme(0 + shift, props);
|
|
56
51
|
let themeEntries = [[name, theme]];
|
|
57
52
|
const altThemes = alternates.map((alt) => [
|
|
53
|
+
`${name}_alt${alt}`,
|
|
54
|
+
getTheme(alt + (props.isLight ? 0 : 0) + shift, props)
|
|
55
|
+
]);
|
|
56
|
+
const altThemes2 = alternates.map((alt) => [
|
|
58
57
|
`${name}_alt${alt}`,
|
|
59
58
|
getTheme(alt + shift, props)
|
|
60
59
|
]);
|
|
61
60
|
const altButtonThemes = alternates.map((_, i) => {
|
|
62
|
-
const [bName, bTheme] = [
|
|
61
|
+
const [bName, bTheme] = [altThemes2[i][0], (altThemes2[i + 1] || altThemes2[i])[1]];
|
|
63
62
|
return [`${bName}_Button`, bTheme];
|
|
64
63
|
});
|
|
65
64
|
const darkerTheme = getTheme(Math.max(0, shift + (props.isLight ? 1 : -1)), props);
|
|
66
65
|
const activeTheme = makeActiveTheme(theme);
|
|
66
|
+
const inverted = altThemes.map(([_name, theme2]) => {
|
|
67
|
+
return __spreadProps(__spreadValues({}, theme2), {
|
|
68
|
+
background: theme2.color,
|
|
69
|
+
backgroundHover: theme2.colorHover,
|
|
70
|
+
backgroundFocus: theme2.colorFocus,
|
|
71
|
+
backgroundPress: theme2.colorPress,
|
|
72
|
+
color: theme2.background,
|
|
73
|
+
colorHover: theme2.backgroundHover,
|
|
74
|
+
colorFocus: theme2.backgroundFocus,
|
|
75
|
+
colorPress: theme2.backgroundPress
|
|
76
|
+
});
|
|
77
|
+
});
|
|
67
78
|
themeEntries = [
|
|
68
79
|
...themeEntries,
|
|
69
|
-
...altThemes,
|
|
70
|
-
...altButtonThemes,
|
|
71
|
-
[`${name}_Button`,
|
|
80
|
+
...altThemes.slice(0, alts.length),
|
|
81
|
+
...altButtonThemes.slice(0, alts.length),
|
|
82
|
+
[`${name}_Button`, altThemes2[1][1]],
|
|
83
|
+
[`${name}_DrawerFrame`, altThemes2[1][1]],
|
|
84
|
+
[`${name}_SliderTrack`, altThemes[0][1]],
|
|
85
|
+
[`${name}_SliderTrackActive`, altThemes[3][1]],
|
|
86
|
+
[`${name}_SliderThumb`, inverted[2]],
|
|
87
|
+
[`${name}_Progress`, altThemes[2][1]],
|
|
88
|
+
[`${name}_ProgressIndicator`, inverted[2]],
|
|
89
|
+
[`${name}_Switch`, altThemes[0][1]],
|
|
90
|
+
[`${name}_SwitchThumb`, inverted[2]],
|
|
91
|
+
[`${name}_TooltipArrow`, altThemes[1][1]],
|
|
92
|
+
[`${name}_TooltipContent`, altThemes[1][1]],
|
|
72
93
|
[`${name}_darker`, darkerTheme],
|
|
73
94
|
[`${name}_active`, activeTheme]
|
|
74
95
|
];
|
|
75
96
|
const themes2 = Object.fromEntries(themeEntries);
|
|
76
97
|
return themes2;
|
|
77
98
|
}
|
|
78
|
-
|
|
79
|
-
const createTheme = /* @__PURE__ */ __name((str = 1, {
|
|
99
|
+
const themeCreator = (str = 1, {
|
|
80
100
|
backgrounds,
|
|
81
101
|
isLight = true,
|
|
82
102
|
isBase = false,
|
|
83
103
|
colors = [...backgrounds].reverse(),
|
|
84
104
|
borderColors = isLight ? colors : backgrounds,
|
|
105
|
+
backgroundStrong,
|
|
85
106
|
offsets: offsetsProp
|
|
86
107
|
}) => {
|
|
87
108
|
const offsets = {
|
|
@@ -89,37 +110,54 @@ const createTheme = /* @__PURE__ */ __name((str = 1, {
|
|
|
89
110
|
background: (offsetsProp == null ? void 0 : offsetsProp.background) ?? [0, 0, 0, 0],
|
|
90
111
|
color: (offsetsProp == null ? void 0 : offsetsProp.color) ?? [0, 0, 0, 0]
|
|
91
112
|
};
|
|
92
|
-
const
|
|
113
|
+
const darkColors2 = isLight ? colors : backgrounds;
|
|
93
114
|
const lighterDir = isLight ? -1 : 1;
|
|
94
115
|
const darkerDir = -lighterDir;
|
|
95
116
|
const strongerDir = isLight ? darkerDir : lighterDir;
|
|
96
|
-
const
|
|
117
|
+
const softerDir = -strongerDir;
|
|
118
|
+
const get = (arr, index, name = "background") => {
|
|
97
119
|
return arr[Math.max(0, Math.min(index + (offsets[name][str] || 0), arr.length - 1))];
|
|
98
|
-
}
|
|
120
|
+
};
|
|
99
121
|
const colorTranslucent = (0, import_colorUtils.setColorAlpha)((0, import_core.getVariableValue)(get(colors, 0 + str, "color")), 0.5);
|
|
100
122
|
let theme = {
|
|
101
123
|
background: get(backgrounds, str),
|
|
102
|
-
|
|
103
|
-
backgroundSoft: get(backgrounds, str +
|
|
124
|
+
backgroundStrong: backgroundStrong || get(backgrounds, str + strongerDir * 2),
|
|
125
|
+
backgroundSoft: get(backgrounds, str + softerDir * 2),
|
|
104
126
|
backgroundHover: get(backgrounds, str + lighterDir),
|
|
105
|
-
backgroundPress: get(backgrounds, str + darkerDir
|
|
127
|
+
backgroundPress: get(backgrounds, str + darkerDir),
|
|
106
128
|
backgroundFocus: get(backgrounds, str + darkerDir * 2),
|
|
107
|
-
backgroundTransparent:
|
|
129
|
+
backgroundTransparent: color.grayA1Light,
|
|
108
130
|
color: get(colors, 0 + str, "color"),
|
|
109
131
|
colorHover: get(colors, 1 + str, "color"),
|
|
110
132
|
colorPress: get(colors, 2 + str, "color"),
|
|
111
133
|
colorFocus: get(colors, 3 + str, "color"),
|
|
112
134
|
colorTranslucent,
|
|
113
|
-
colorMid: colors[Math.floor(colors.length / 2)],
|
|
114
|
-
shadowColor: isLight ?
|
|
115
|
-
shadowColorHover:
|
|
116
|
-
shadowColorPress:
|
|
117
|
-
shadowColorFocus:
|
|
135
|
+
colorMid: (isLight ? colors : backgrounds)[Math.floor(colors.length / 2)],
|
|
136
|
+
shadowColor: isLight ? color.grayA2Light : color.grayA8Light,
|
|
137
|
+
shadowColorHover: darkColors2[!isLight ? 1 : 8],
|
|
138
|
+
shadowColorPress: darkColors2[!isLight ? 1 : 8],
|
|
139
|
+
shadowColorFocus: darkColors2[!isLight ? 1 : 8],
|
|
118
140
|
borderColor: null,
|
|
119
141
|
borderColorHover: null,
|
|
120
142
|
borderColorPress: null,
|
|
121
143
|
borderColorFocus: null
|
|
122
144
|
};
|
|
145
|
+
if (process.env.ENABLE_STEPS) {
|
|
146
|
+
Object.assign(theme, {
|
|
147
|
+
step1: backgrounds[0],
|
|
148
|
+
step2: backgrounds[1],
|
|
149
|
+
step3: backgrounds[2],
|
|
150
|
+
step4: backgrounds[3],
|
|
151
|
+
step5: backgrounds[4],
|
|
152
|
+
step6: backgrounds[5],
|
|
153
|
+
step7: backgrounds[6],
|
|
154
|
+
step8: backgrounds[7],
|
|
155
|
+
step9: backgrounds[8],
|
|
156
|
+
step10: backgrounds[9],
|
|
157
|
+
step11: backgrounds[10],
|
|
158
|
+
step12: backgrounds[11]
|
|
159
|
+
});
|
|
160
|
+
}
|
|
123
161
|
if (isBase) {
|
|
124
162
|
Object.assign(theme, {
|
|
125
163
|
borderColor: isLight ? get(colors, 8 - str, "borderColor") : get(backgrounds, 2 + str, "borderColor"),
|
|
@@ -136,60 +174,52 @@ const createTheme = /* @__PURE__ */ __name((str = 1, {
|
|
|
136
174
|
});
|
|
137
175
|
}
|
|
138
176
|
return theme;
|
|
139
|
-
}
|
|
140
|
-
const
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
]
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
"#
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
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
|
|
177
|
+
};
|
|
178
|
+
const themeColors = {
|
|
179
|
+
light: [
|
|
180
|
+
"#fff",
|
|
181
|
+
"#f4f4f4",
|
|
182
|
+
color.gray1Light,
|
|
183
|
+
color.gray2Light,
|
|
184
|
+
color.gray3Light,
|
|
185
|
+
color.gray4Light,
|
|
186
|
+
color.gray5Light,
|
|
187
|
+
color.gray6Light,
|
|
188
|
+
color.gray7Light,
|
|
189
|
+
color.gray8Light,
|
|
190
|
+
color.gray9Light,
|
|
191
|
+
color.gray10Light,
|
|
192
|
+
color.gray11Light,
|
|
193
|
+
color.gray12Light
|
|
194
|
+
],
|
|
195
|
+
dark: [
|
|
196
|
+
"#111111",
|
|
197
|
+
"#151515",
|
|
198
|
+
"#191919",
|
|
199
|
+
"#232323",
|
|
200
|
+
"#282828",
|
|
201
|
+
"#323232",
|
|
202
|
+
"#383838",
|
|
203
|
+
"#424242",
|
|
204
|
+
"#494949",
|
|
205
|
+
"#545454",
|
|
206
|
+
"#626262",
|
|
207
|
+
"#777777"
|
|
208
|
+
]
|
|
209
|
+
};
|
|
210
|
+
const lightThemes = createThemesFrom("light", themeCreator, {
|
|
211
|
+
backgrounds: themeColors.light,
|
|
212
|
+
backgroundStrong: import_core.isWeb ? "#fefefe" : "#f2f2f2",
|
|
213
|
+
borderColors: themeColors.light.slice(2),
|
|
214
|
+
isLight: true,
|
|
215
|
+
offsets: {
|
|
216
|
+
background: [2, 2, 2, 2, 2, 2]
|
|
217
|
+
}
|
|
189
218
|
});
|
|
190
|
-
const darkThemes = createThemesFrom("dark",
|
|
191
|
-
backgrounds:
|
|
192
|
-
colors:
|
|
219
|
+
const darkThemes = createThemesFrom("dark", themeCreator, {
|
|
220
|
+
backgrounds: themeColors.dark,
|
|
221
|
+
colors: themeColors.light.slice(2),
|
|
222
|
+
backgroundStrong: "#070707",
|
|
193
223
|
isBase: true,
|
|
194
224
|
isLight: false,
|
|
195
225
|
shift: 1,
|
|
@@ -197,17 +227,28 @@ const darkThemes = createThemesFrom("dark", createTheme, {
|
|
|
197
227
|
color: [0, 4, 5, 5, 5, 5]
|
|
198
228
|
}
|
|
199
229
|
});
|
|
230
|
+
darkThemes.dark_darker.background = "#030303";
|
|
231
|
+
darkThemes.dark_darker.backgroundStrong = "#000";
|
|
232
|
+
const light = (0, import_core.createTheme)(__spreadValues(__spreadValues({}, import_tokens.lightColors), lightThemes.light));
|
|
233
|
+
const dark = (0, import_core.createTheme)(__spreadValues(__spreadValues({}, import_tokens.darkColors), darkThemes.dark));
|
|
200
234
|
const baseThemes = __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, lightThemes), {
|
|
201
|
-
light
|
|
235
|
+
light,
|
|
202
236
|
light_active: makeActiveTheme(lightThemes.light),
|
|
203
237
|
light_Card: lightThemes.light,
|
|
204
|
-
|
|
205
|
-
|
|
238
|
+
light_SliderTrack: lightThemes.light_alt2,
|
|
239
|
+
light_SliderTrackActive: lightThemes.light_alt3,
|
|
240
|
+
light_Switch: lightThemes.light_alt1,
|
|
241
|
+
light_SwitchThumb: darkThemes.dark,
|
|
242
|
+
light_DrawerFrame: lightThemes.light_alt1
|
|
206
243
|
}), darkThemes), {
|
|
207
|
-
dark
|
|
244
|
+
dark,
|
|
208
245
|
dark_active: makeActiveTheme(darkThemes.dark),
|
|
209
|
-
dark_Card: darkThemes.
|
|
246
|
+
dark_Card: darkThemes.dark,
|
|
210
247
|
dark_DrawerFrame: darkThemes.dark_alt2,
|
|
248
|
+
dark_SliderTrack: darkThemes.dark_darker,
|
|
249
|
+
dark_SliderTrackActive: darkThemes.dark_alt3,
|
|
250
|
+
dark_Switch: darkThemes.dark_darker,
|
|
251
|
+
dark_SwitchThumb: lightThemes.light_alt3,
|
|
211
252
|
dark_Button: darkThemes.dark_alt1
|
|
212
253
|
});
|
|
213
254
|
function makeActiveTheme(theme) {
|
|
@@ -218,24 +259,47 @@ function makeActiveTheme(theme) {
|
|
|
218
259
|
res.colorPress = res.color;
|
|
219
260
|
return res;
|
|
220
261
|
}
|
|
221
|
-
|
|
222
|
-
const
|
|
262
|
+
const darkEntries = Object.entries(dark);
|
|
263
|
+
const lightEntries = Object.entries(light);
|
|
264
|
+
function findColors(prefix, dark2 = false) {
|
|
265
|
+
return Object.fromEntries((dark2 ? darkEntries : lightEntries).filter(([k]) => k.startsWith(prefix)));
|
|
266
|
+
}
|
|
267
|
+
const colorSchemes = [
|
|
268
|
+
{ name: "blue", colors: findColors("blue"), darkColors: findColors("blue", true) },
|
|
269
|
+
{ name: "gray", colors: findColors("gray"), darkColors: findColors("gray", true) },
|
|
270
|
+
{ name: "green", colors: findColors("green"), darkColors: findColors("green", true) },
|
|
271
|
+
{ name: "orange", colors: findColors("orange"), darkColors: findColors("orange", true) },
|
|
272
|
+
{ name: "pink", colors: findColors("pink"), darkColors: findColors("pink", true) },
|
|
273
|
+
{ name: "purple", colors: findColors("purple"), darkColors: findColors("purple", true) },
|
|
274
|
+
{ name: "red", colors: findColors("red"), darkColors: findColors("red", true) },
|
|
275
|
+
{ name: "yellow", colors: findColors("yellow"), darkColors: findColors("yellow", true) },
|
|
276
|
+
{ name: "teal", colors: findColors("teal"), darkColors: findColors("teal", true) }
|
|
277
|
+
];
|
|
278
|
+
const colorNames = [
|
|
279
|
+
"blue",
|
|
280
|
+
"gray",
|
|
281
|
+
"green",
|
|
282
|
+
"orange",
|
|
283
|
+
"pink",
|
|
284
|
+
"purple",
|
|
285
|
+
"red",
|
|
286
|
+
"yellow",
|
|
287
|
+
"teal"
|
|
288
|
+
];
|
|
289
|
+
const colorThemeEntries = colorSchemes.flatMap(({ name, colors, darkColors: darkColors2 }) => {
|
|
223
290
|
const [altLightThemes, altDarkThemes] = [
|
|
224
|
-
{ colors:
|
|
225
|
-
{ colors, backgrounds:
|
|
291
|
+
{ colors: darkColors2, backgrounds: colors },
|
|
292
|
+
{ colors, backgrounds: darkColors2 }
|
|
226
293
|
].map((props, i) => {
|
|
227
294
|
const isLight = i === 0;
|
|
295
|
+
const colorsBase = Object.values(props.colors).slice(2);
|
|
228
296
|
const [backgrounds, colors2] = [
|
|
229
297
|
Object.values(props.backgrounds),
|
|
230
|
-
|
|
298
|
+
isLight ? colorsBase : [colorsBase[0], "#ccc", ...colorsBase.slice(1)]
|
|
231
299
|
];
|
|
232
300
|
const scheme = isLight ? "light" : "dark";
|
|
233
301
|
const shift = isLight ? 0 : 1;
|
|
234
|
-
|
|
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, {
|
|
302
|
+
const themeWithAlts = createThemesFrom(name, themeCreator, {
|
|
239
303
|
colors: colors2,
|
|
240
304
|
backgrounds,
|
|
241
305
|
borderColors: backgrounds,
|
|
@@ -243,34 +307,22 @@ const colorThemeEntries = colorSchemes.flatMap(({ name, colors, darkColors }) =>
|
|
|
243
307
|
shift,
|
|
244
308
|
isBase: false,
|
|
245
309
|
offsets: {
|
|
246
|
-
background: isLight ? [
|
|
247
|
-
borderColor: isLight ? [
|
|
310
|
+
background: isLight ? [2, 2, 2, 2, 2, 2] : null,
|
|
311
|
+
borderColor: isLight ? [2, 2, 2, 3, 2] : null,
|
|
248
312
|
color: isLight ? [0, 0, -1, -2, -3, -3, -4] : [-1, -1, -1, -1, -1, -1]
|
|
249
313
|
}
|
|
250
314
|
});
|
|
251
315
|
return Object.entries(themeWithAlts).map(([k, v]) => [`${scheme}_${k}`, v]);
|
|
252
316
|
});
|
|
253
|
-
|
|
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
|
-
];
|
|
317
|
+
return [...altLightThemes, ...altDarkThemes];
|
|
265
318
|
});
|
|
266
319
|
const colorThemes = Object.fromEntries(colorThemeEntries);
|
|
267
320
|
const allThemes = __spreadValues(__spreadValues({}, baseThemes), colorThemes);
|
|
268
321
|
const themes = allThemes;
|
|
269
322
|
// Annotate the CommonJS export names for ESM import in node:
|
|
270
323
|
0 && (module.exports = {
|
|
324
|
+
colorNames,
|
|
271
325
|
colorSchemes,
|
|
272
|
-
darkGradient,
|
|
273
|
-
lightGradient,
|
|
274
326
|
themes
|
|
275
327
|
});
|
|
276
328
|
//# sourceMappingURL=themes.js.map
|
package/dist/cjs/themes.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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": "
|
|
4
|
+
"sourcesContent": ["import { Variable, createTheme, getVariableValue, isWeb } from '@tamagui/core'\n\nimport { setColorAlpha } from './colorUtils'\nimport { darkColors, lightColors, tokens } from './tokens'\n\nconst { color } = tokens\n\n// spaghetti ahead\n\ntype ThemeCreatorProps = {\n shift?: number\n backgrounds: (string | Variable)[]\n backgroundStrong?: 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\nconst alts = [1, 2, 3] as const\ntype AltKeys = 1 | 2 | 3\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\n // generate alternates (for use in other themes), but keep just alts\n const altThemes: any[] = alternates.map((alt) => [\n `${name}_alt${alt}`,\n getTheme(alt + (props.isLight ? 0 : 0) + shift, props),\n ])\n const altThemes2: 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] = [altThemes2[i][0], (altThemes2[i + 1] || altThemes2[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\n // TODO can be de-duped\n const inverted = altThemes.map(([_name, theme]) => {\n return {\n ...theme,\n background: theme.color,\n backgroundHover: theme.colorHover,\n backgroundFocus: theme.colorFocus,\n backgroundPress: theme.colorPress,\n color: theme.background,\n colorHover: theme.backgroundHover,\n colorFocus: theme.backgroundFocus,\n colorPress: theme.backgroundPress,\n }\n })\n\n themeEntries = [\n ...themeEntries,\n // keep just alts\n ...altThemes.slice(0, alts.length),\n ...altButtonThemes.slice(0, alts.length),\n [`${name}_Button`, altThemes2[1][1]],\n [`${name}_DrawerFrame`, altThemes2[1][1]],\n [`${name}_SliderTrack`, altThemes[0][1]],\n [`${name}_SliderTrackActive`, altThemes[3][1]],\n [`${name}_SliderThumb`, inverted[2]],\n [`${name}_Progress`, altThemes[2][1]],\n [`${name}_ProgressIndicator`, inverted[2]],\n [`${name}_Switch`, altThemes[0][1]],\n [`${name}_SwitchThumb`, inverted[2]],\n [`${name}_TooltipArrow`, altThemes[1][1]],\n [`${name}_TooltipContent`, altThemes[1][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 themeCreator = (\n str = 1,\n {\n backgrounds,\n isLight = true,\n isBase = false,\n colors = [...backgrounds].reverse(),\n borderColors = isLight ? colors : backgrounds,\n backgroundStrong,\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 softerDir = -strongerDir\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 backgroundStrong: backgroundStrong || get(backgrounds, str + strongerDir * 2),\n backgroundSoft: get(backgrounds, str + softerDir * 2),\n backgroundHover: get(backgrounds, str + lighterDir),\n backgroundPress: get(backgrounds, str + darkerDir),\n backgroundFocus: get(backgrounds, str + darkerDir * 2),\n backgroundTransparent: color.grayA1Light,\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: (isLight ? colors : backgrounds)[Math.floor(colors.length / 2)],\n shadowColor: isLight ? color.grayA2Light : color.grayA8Light,\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 (process.env.ENABLE_STEPS) {\n Object.assign(theme, {\n step1: backgrounds[0],\n step2: backgrounds[1],\n step3: backgrounds[2],\n step4: backgrounds[3],\n step5: backgrounds[4],\n step6: backgrounds[5],\n step7: backgrounds[6],\n step8: backgrounds[7],\n step9: backgrounds[8],\n step10: backgrounds[9],\n step11: backgrounds[10],\n step12: backgrounds[11],\n })\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\nconst themeColors = {\n light: [\n '#fff',\n '#f4f4f4',\n color.gray1Light,\n color.gray2Light,\n color.gray3Light,\n color.gray4Light,\n color.gray5Light,\n color.gray6Light,\n color.gray7Light,\n color.gray8Light,\n color.gray9Light,\n color.gray10Light,\n color.gray11Light,\n color.gray12Light,\n ],\n dark: [\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}\n\nconst lightThemes = createThemesFrom('light', themeCreator, {\n backgrounds: themeColors.light,\n // for now web non-ios style native is...\n backgroundStrong: isWeb ? '#fefefe' : '#f2f2f2',\n borderColors: themeColors.light.slice(2),\n isLight: true,\n offsets: {\n background: [2, 2, 2, 2, 2, 2],\n },\n})\n\nconst darkThemes = createThemesFrom('dark', themeCreator, {\n backgrounds: themeColors.dark,\n colors: themeColors.light.slice(2),\n backgroundStrong: '#070707',\n isBase: true,\n isLight: false,\n shift: 1,\n offsets: {\n color: [0, 4, 5, 5, 5, 5],\n },\n})\n\ndarkThemes.dark_darker.background = '#030303'\ndarkThemes.dark_darker.backgroundStrong = '#000'\n\nconst light = createTheme({\n ...lightColors,\n ...lightThemes.light,\n})\n\nconst dark = createTheme({\n ...darkColors,\n ...darkThemes.dark,\n})\n\ntype ThemeBase = {\n [Key in keyof typeof dark]: string\n}\n\nconst baseThemes = {\n // light\n ...lightThemes,\n light,\n light_active: makeActiveTheme(lightThemes.light),\n light_Card: lightThemes.light,\n light_SliderTrack: lightThemes.light_alt2,\n light_SliderTrackActive: lightThemes.light_alt3,\n light_Switch: lightThemes.light_alt1,\n light_SwitchThumb: darkThemes.dark,\n light_DrawerFrame: lightThemes.light_alt1,\n\n // dark\n ...darkThemes,\n dark,\n dark_active: makeActiveTheme(darkThemes.dark),\n dark_Card: darkThemes.dark,\n dark_DrawerFrame: darkThemes.dark_alt2,\n dark_SliderTrack: darkThemes.dark_darker,\n dark_SliderTrackActive: darkThemes.dark_alt3,\n dark_Switch: darkThemes.dark_darker,\n dark_SwitchThumb: lightThemes.light_alt3,\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\nconst darkEntries = Object.entries(dark)\nconst lightEntries = Object.entries(light)\nfunction findColors(prefix: string, dark = false): ThemeBase {\n return Object.fromEntries(\n (dark ? darkEntries : lightEntries).filter(([k]) => k.startsWith(prefix))\n ) as any\n}\n\nexport const colorSchemes = [\n { name: 'blue', colors: findColors('blue'), darkColors: findColors('blue', true) },\n { name: 'gray', colors: findColors('gray'), darkColors: findColors('gray', true) },\n { name: 'green', colors: findColors('green'), darkColors: findColors('green', true) },\n { name: 'orange', colors: findColors('orange'), darkColors: findColors('orange', true) },\n { name: 'pink', colors: findColors('pink'), darkColors: findColors('pink', true) },\n { name: 'purple', colors: findColors('purple'), darkColors: findColors('purple', true) },\n { name: 'red', colors: findColors('red'), darkColors: findColors('red', true) },\n { name: 'yellow', colors: findColors('yellow'), darkColors: findColors('yellow', true) },\n { name: 'teal', colors: findColors('teal'), darkColors: findColors('teal', true) },\n] as const\n\nexport type ColorNames = typeof colorSchemes[number]['name']\n\n// nice and flat\nexport const colorNames: ColorNames[] = [\n 'blue',\n 'gray',\n 'green',\n 'orange',\n 'pink',\n 'purple',\n 'red',\n 'yellow',\n 'teal',\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 colorsBase = Object.values(props.colors).slice(2)\n const [backgrounds, colors] = [\n Object.values(props.backgrounds),\n isLight ? colorsBase : [colorsBase[0], '#ccc', ...colorsBase.slice(1)],\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, themeCreator, {\n colors,\n backgrounds,\n borderColors: backgrounds,\n isLight,\n shift,\n isBase: false,\n offsets: {\n background: isLight ? [2, 2, 2, 2, 2, 2] : null,\n borderColor: isLight ? [2, 2, 2, 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 return [...altLightThemes, ...altDarkThemes]\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"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|