@tamagui/theme-base 1.0.0-beta.193 → 1.0.0-beta.203
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 +0 -0
- package/dist/cjs/colorUtils.js.map +0 -0
- package/dist/cjs/index.js +0 -0
- package/dist/cjs/index.js.map +0 -0
- package/dist/cjs/themes.js +35 -35
- package/dist/cjs/themes.js.map +2 -2
- package/dist/cjs/tokens.js +0 -0
- package/dist/cjs/tokens.js.map +0 -0
- package/dist/esm/colorUtils.js +0 -0
- package/dist/esm/colorUtils.js.map +0 -0
- package/dist/esm/index.js +0 -0
- package/dist/esm/index.js.map +0 -0
- package/dist/esm/themes.js +35 -38
- package/dist/esm/themes.js.map +2 -2
- package/dist/esm/tokens.js +0 -0
- package/dist/esm/tokens.js.map +0 -0
- package/dist/jsx/colorUtils.js +0 -0
- package/dist/jsx/index.js +0 -0
- package/dist/jsx/themes.js +35 -38
- package/dist/jsx/tokens.js +0 -0
- package/package.json +5 -5
- package/types/themes.d.ts +616 -662
- package/types/themes.d.ts.map +1 -1
package/dist/cjs/colorUtils.js
CHANGED
|
File without changes
|
|
File without changes
|
package/dist/cjs/index.js
CHANGED
|
File without changes
|
package/dist/cjs/index.js.map
CHANGED
|
File without changes
|
package/dist/cjs/themes.js
CHANGED
|
@@ -79,7 +79,9 @@ __name(createThemesFrom, "createThemesFrom");
|
|
|
79
79
|
const createTheme = /* @__PURE__ */ __name((str = 1, {
|
|
80
80
|
backgrounds,
|
|
81
81
|
isLight = true,
|
|
82
|
+
isBase = false,
|
|
82
83
|
colors = [...backgrounds].reverse(),
|
|
84
|
+
borderColors = isLight ? colors : backgrounds,
|
|
83
85
|
offsets: offsetsProp
|
|
84
86
|
}) => {
|
|
85
87
|
const offsets = {
|
|
@@ -95,7 +97,7 @@ const createTheme = /* @__PURE__ */ __name((str = 1, {
|
|
|
95
97
|
return arr[Math.max(0, Math.min(index + (offsets[name][str] || 0), arr.length - 1))];
|
|
96
98
|
}, "get");
|
|
97
99
|
const colorTranslucent = (0, import_colorUtils.setColorAlpha)((0, import_core.getVariableValue)(get(colors, 0 + str, "color")), 0.5);
|
|
98
|
-
|
|
100
|
+
let theme = {
|
|
99
101
|
background: get(backgrounds, str),
|
|
100
102
|
backgroundStronger: get(backgrounds, str + strongerDir),
|
|
101
103
|
backgroundSoft: get(backgrounds, str + 3),
|
|
@@ -103,10 +105,6 @@ const createTheme = /* @__PURE__ */ __name((str = 1, {
|
|
|
103
105
|
backgroundPress: get(backgrounds, str + darkerDir * 1),
|
|
104
106
|
backgroundFocus: get(backgrounds, str + darkerDir * 2),
|
|
105
107
|
backgroundTransparent: import_tokens.color.grayA1,
|
|
106
|
-
borderColor: isLight ? get(colors, 8 - str, "borderColor") : get(backgrounds, 2 + str, "borderColor"),
|
|
107
|
-
borderColorHover: isLight ? get(colors, 6 - str, "borderColor") : get(backgrounds, 3 + str, "borderColor"),
|
|
108
|
-
borderColorPress: isLight ? get(colors, 5 - str, "borderColor") : get(backgrounds, 1 + str, "borderColor"),
|
|
109
|
-
borderColorFocus: isLight ? get(colors, 4 - str, "borderColor") : get(backgrounds, 3 + str, "borderColor"),
|
|
110
108
|
color: get(colors, 0 + str, "color"),
|
|
111
109
|
colorHover: get(colors, 1 + str, "color"),
|
|
112
110
|
colorPress: get(colors, 2 + str, "color"),
|
|
@@ -116,8 +114,28 @@ const createTheme = /* @__PURE__ */ __name((str = 1, {
|
|
|
116
114
|
shadowColor: isLight ? import_tokens.color.grayA3 : import_tokens.color.grayA8,
|
|
117
115
|
shadowColorHover: darkColors[!isLight ? 1 : 8],
|
|
118
116
|
shadowColorPress: darkColors[!isLight ? 1 : 8],
|
|
119
|
-
shadowColorFocus: darkColors[!isLight ? 1 : 8]
|
|
117
|
+
shadowColorFocus: darkColors[!isLight ? 1 : 8],
|
|
118
|
+
borderColor: null,
|
|
119
|
+
borderColorHover: null,
|
|
120
|
+
borderColorPress: null,
|
|
121
|
+
borderColorFocus: null
|
|
120
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;
|
|
121
139
|
}, "createTheme");
|
|
122
140
|
const colorSchemes = [
|
|
123
141
|
{ name: "blue", colors: Colors.blue, darkColors: Colors.blueDark },
|
|
@@ -166,11 +184,13 @@ const darkGradient = [
|
|
|
166
184
|
];
|
|
167
185
|
const lightThemes = createThemesFrom("light", createTheme, {
|
|
168
186
|
backgrounds: lightGradient,
|
|
187
|
+
borderColors: lightGradient.slice(2),
|
|
169
188
|
isLight: true
|
|
170
189
|
});
|
|
171
190
|
const darkThemes = createThemesFrom("dark", createTheme, {
|
|
172
191
|
backgrounds: darkGradient,
|
|
173
192
|
colors: lightGradient.slice(2),
|
|
193
|
+
isBase: true,
|
|
174
194
|
isLight: false,
|
|
175
195
|
shift: 1,
|
|
176
196
|
offsets: {
|
|
@@ -181,13 +201,13 @@ const baseThemes = __spreadProps(__spreadValues(__spreadProps(__spreadValues({},
|
|
|
181
201
|
light: __spreadValues(__spreadValues({}, import_colors.allLightColors), lightThemes.light),
|
|
182
202
|
light_active: makeActiveTheme(lightThemes.light),
|
|
183
203
|
light_Card: lightThemes.light,
|
|
184
|
-
|
|
204
|
+
light_DrawerFrame: lightThemes.light_alt1,
|
|
185
205
|
light_Button: lightThemes.light_alt1
|
|
186
206
|
}), darkThemes), {
|
|
187
207
|
dark: __spreadValues(__spreadValues({}, import_colors.allDarkColors), darkThemes.dark),
|
|
188
208
|
dark_active: makeActiveTheme(darkThemes.dark),
|
|
189
209
|
dark_Card: darkThemes.dark_alt1,
|
|
190
|
-
|
|
210
|
+
dark_DrawerFrame: darkThemes.dark_alt2,
|
|
191
211
|
dark_Button: darkThemes.dark_alt1
|
|
192
212
|
});
|
|
193
213
|
function makeActiveTheme(theme) {
|
|
@@ -207,7 +227,7 @@ const colorThemeEntries = colorSchemes.flatMap(({ name, colors, darkColors }) =>
|
|
|
207
227
|
const isLight = i === 0;
|
|
208
228
|
const [backgrounds, colors2] = [
|
|
209
229
|
Object.values(props.backgrounds),
|
|
210
|
-
Object.values(props.colors).slice(isLight ?
|
|
230
|
+
Object.values(props.colors).slice(isLight ? 2 : 2)
|
|
211
231
|
];
|
|
212
232
|
const scheme = isLight ? "light" : "dark";
|
|
213
233
|
const shift = isLight ? 0 : 1;
|
|
@@ -218,12 +238,13 @@ const colorThemeEntries = colorSchemes.flatMap(({ name, colors, darkColors }) =>
|
|
|
218
238
|
const themeWithAlts = createThemesFrom(name, createTheme, {
|
|
219
239
|
colors: colors2,
|
|
220
240
|
backgrounds,
|
|
241
|
+
borderColors: backgrounds,
|
|
221
242
|
isLight,
|
|
222
243
|
shift,
|
|
223
244
|
isBase: false,
|
|
224
245
|
offsets: {
|
|
225
|
-
background: isLight ? [
|
|
226
|
-
borderColor: isLight ? [
|
|
246
|
+
background: isLight ? [0, 0, 0, 0, 0, 0] : null,
|
|
247
|
+
borderColor: isLight ? [3, 3, 3, 3, 2] : null,
|
|
227
248
|
color: isLight ? [0, 0, -1, -2, -3, -3, -4] : [-1, -1, -1, -1, -1, -1]
|
|
228
249
|
}
|
|
229
250
|
});
|
|
@@ -235,36 +256,15 @@ const colorThemeEntries = colorSchemes.flatMap(({ name, colors, darkColors }) =>
|
|
|
235
256
|
...altLightThemes,
|
|
236
257
|
[`${lightButtonTheme[0]}_Button`, altLightThemes[2][1]],
|
|
237
258
|
[`${lightButtonTheme[0]}_Card`, altLightThemes[2][1]],
|
|
238
|
-
[`${lightButtonTheme[0]}
|
|
259
|
+
[`${lightButtonTheme[0]}_DrawerFrame`, altLightThemes[2][1]],
|
|
239
260
|
...altDarkThemes,
|
|
240
261
|
[`${darkButtonTheme[0]}_Button`, altDarkThemes[2][1]],
|
|
241
262
|
[`${darkButtonTheme[0]}_Card`, altDarkThemes[2][1]],
|
|
242
|
-
[`${darkButtonTheme[0]}
|
|
263
|
+
[`${darkButtonTheme[0]}_DrawerFrame`, altDarkThemes[2][1]]
|
|
243
264
|
];
|
|
244
265
|
});
|
|
245
|
-
const transparent = {
|
|
246
|
-
background: "transparent",
|
|
247
|
-
backgroundSoft: "transparent",
|
|
248
|
-
backgroundHover: "transparent",
|
|
249
|
-
backgroundPress: "transparent",
|
|
250
|
-
backgroundFocus: "transparent",
|
|
251
|
-
backgroundTransparent: "transparent",
|
|
252
|
-
shadowColor: "transparent",
|
|
253
|
-
shadowColorHover: "transparent",
|
|
254
|
-
shadowColorPress: "transparent",
|
|
255
|
-
shadowColorFocus: "transparent"
|
|
256
|
-
};
|
|
257
|
-
const dark_outline = __spreadValues(__spreadProps(__spreadValues({}, baseThemes.dark), {
|
|
258
|
-
borderColor: "#fff"
|
|
259
|
-
}), transparent);
|
|
260
|
-
const light_outline = __spreadValues(__spreadProps(__spreadValues({}, baseThemes.light), {
|
|
261
|
-
borderColor: "#000"
|
|
262
|
-
}), transparent);
|
|
263
266
|
const colorThemes = Object.fromEntries(colorThemeEntries);
|
|
264
|
-
const allThemes =
|
|
265
|
-
dark_outline,
|
|
266
|
-
light_outline
|
|
267
|
-
});
|
|
267
|
+
const allThemes = __spreadValues(__spreadValues({}, baseThemes), colorThemes);
|
|
268
268
|
const themes = allThemes;
|
|
269
269
|
// Annotate the CommonJS export names for ESM import in node:
|
|
270
270
|
0 && (module.exports = {
|
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\ntype ThemeCreatorProps = {\n shift?: number\n backgrounds: (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 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 return {\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 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 // colorStronger: get(colors, str + strongerDir),\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 }\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 isLight: true,\n})\n\nconst darkThemes = createThemesFrom('dark', createTheme, {\n backgrounds: darkGradient,\n colors: lightGradient.slice(2),\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_Drawer: 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_Drawer: 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 ? 0 : 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 isLight,\n shift,\n isBase: false,\n offsets: {\n background: isLight ? [1, 1, 1, 0, 0, 0] : null,\n borderColor: isLight ? [0, 1, 1, 2, 2, -2] : null,\n color: isLight ? [0, 0, -1, -2, -3, -3, -4] : [-1, -1, -1, -1, -1, -1],\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]}_Drawer`, altLightThemes[2][1]],\n ...altDarkThemes,\n [`${darkButtonTheme[0]}_Button`, altDarkThemes[2][1]],\n [`${darkButtonTheme[0]}_Card`, altDarkThemes[2][1]],\n [`${darkButtonTheme[0]}_Drawer`, altDarkThemes[2][1]],\n ]\n})\n\nconst transparent = {\n background: 'transparent',\n backgroundSoft: 'transparent',\n backgroundHover: 'transparent',\n backgroundPress: 'transparent',\n backgroundFocus: 'transparent',\n backgroundTransparent: 'transparent',\n shadowColor: 'transparent',\n shadowColorHover: 'transparent',\n shadowColorPress: 'transparent',\n shadowColorFocus: 'transparent',\n}\n\ntype MyThemeBase = typeof baseThemes['light_alt1']\n\n// @ts-ignore\nconst dark_outline: MyThemeBase = {\n ...baseThemes.dark,\n borderColor: '#fff',\n ...transparent,\n}\n\n// @ts-ignore\nconst light_outline: MyThemeBase = {\n ...baseThemes.light,\n borderColor: '#000',\n ...transparent,\n}\n\nconst colorThemes: {\n [key in ColorThemeNames]: MyThemeBase\n} = Object.fromEntries(colorThemeEntries) as any\n\nconst allThemes = {\n ...baseThemes,\n ...colorThemes,\n dark_outline,\n light_outline,\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;
|
|
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
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/tokens.js
CHANGED
|
File without changes
|
package/dist/cjs/tokens.js.map
CHANGED
|
File without changes
|
package/dist/esm/colorUtils.js
CHANGED
|
File without changes
|
|
File without changes
|
package/dist/esm/index.js
CHANGED
|
File without changes
|
package/dist/esm/index.js.map
CHANGED
|
File without changes
|
package/dist/esm/themes.js
CHANGED
|
@@ -35,7 +35,9 @@ __name(createThemesFrom, "createThemesFrom");
|
|
|
35
35
|
const createTheme = /* @__PURE__ */ __name((str = 1, {
|
|
36
36
|
backgrounds,
|
|
37
37
|
isLight = true,
|
|
38
|
+
isBase = false,
|
|
38
39
|
colors = [...backgrounds].reverse(),
|
|
40
|
+
borderColors = isLight ? colors : backgrounds,
|
|
39
41
|
offsets: offsetsProp
|
|
40
42
|
}) => {
|
|
41
43
|
var _a, _b, _c, _d;
|
|
@@ -52,7 +54,7 @@ const createTheme = /* @__PURE__ */ __name((str = 1, {
|
|
|
52
54
|
return arr[Math.max(0, Math.min(index + (offsets[name][str] || 0), arr.length - 1))];
|
|
53
55
|
}, "get");
|
|
54
56
|
const colorTranslucent = setColorAlpha(getVariableValue(get(colors, 0 + str, "color")), 0.5);
|
|
55
|
-
|
|
57
|
+
let theme = {
|
|
56
58
|
background: get(backgrounds, str),
|
|
57
59
|
backgroundStronger: get(backgrounds, str + strongerDir),
|
|
58
60
|
backgroundSoft: get(backgrounds, str + 3),
|
|
@@ -60,10 +62,6 @@ const createTheme = /* @__PURE__ */ __name((str = 1, {
|
|
|
60
62
|
backgroundPress: get(backgrounds, str + darkerDir * 1),
|
|
61
63
|
backgroundFocus: get(backgrounds, str + darkerDir * 2),
|
|
62
64
|
backgroundTransparent: color.grayA1,
|
|
63
|
-
borderColor: isLight ? get(colors, 8 - str, "borderColor") : get(backgrounds, 2 + str, "borderColor"),
|
|
64
|
-
borderColorHover: isLight ? get(colors, 6 - str, "borderColor") : get(backgrounds, 3 + str, "borderColor"),
|
|
65
|
-
borderColorPress: isLight ? get(colors, 5 - str, "borderColor") : get(backgrounds, 1 + str, "borderColor"),
|
|
66
|
-
borderColorFocus: isLight ? get(colors, 4 - str, "borderColor") : get(backgrounds, 3 + str, "borderColor"),
|
|
67
65
|
color: get(colors, 0 + str, "color"),
|
|
68
66
|
colorHover: get(colors, 1 + str, "color"),
|
|
69
67
|
colorPress: get(colors, 2 + str, "color"),
|
|
@@ -73,8 +71,28 @@ const createTheme = /* @__PURE__ */ __name((str = 1, {
|
|
|
73
71
|
shadowColor: isLight ? color.grayA3 : color.grayA8,
|
|
74
72
|
shadowColorHover: darkColors[!isLight ? 1 : 8],
|
|
75
73
|
shadowColorPress: darkColors[!isLight ? 1 : 8],
|
|
76
|
-
shadowColorFocus: darkColors[!isLight ? 1 : 8]
|
|
74
|
+
shadowColorFocus: darkColors[!isLight ? 1 : 8],
|
|
75
|
+
borderColor: null,
|
|
76
|
+
borderColorHover: null,
|
|
77
|
+
borderColorPress: null,
|
|
78
|
+
borderColorFocus: null
|
|
77
79
|
};
|
|
80
|
+
if (isBase) {
|
|
81
|
+
Object.assign(theme, {
|
|
82
|
+
borderColor: isLight ? get(colors, 8 - str, "borderColor") : get(backgrounds, 2 + str, "borderColor"),
|
|
83
|
+
borderColorHover: isLight ? get(colors, 6 - str, "borderColor") : get(backgrounds, 3 + str, "borderColor"),
|
|
84
|
+
borderColorPress: isLight ? get(colors, 5 - str, "borderColor") : get(backgrounds, 1 + str, "borderColor"),
|
|
85
|
+
borderColorFocus: isLight ? get(colors, 4 - str, "borderColor") : get(backgrounds, 3 + str, "borderColor")
|
|
86
|
+
});
|
|
87
|
+
} else {
|
|
88
|
+
Object.assign(theme, {
|
|
89
|
+
borderColor: get(borderColors, 1 + strongerDir, "borderColor"),
|
|
90
|
+
borderColorHover: get(borderColors, 2 + strongerDir, "borderColor"),
|
|
91
|
+
borderColorPress: get(borderColors, 3 + strongerDir, "borderColor"),
|
|
92
|
+
borderColorFocus: get(borderColors, 4 + strongerDir, "borderColor")
|
|
93
|
+
});
|
|
94
|
+
}
|
|
95
|
+
return theme;
|
|
78
96
|
}, "createTheme");
|
|
79
97
|
const colorSchemes = [
|
|
80
98
|
{ name: "blue", colors: Colors.blue, darkColors: Colors.blueDark },
|
|
@@ -123,11 +141,13 @@ const darkGradient = [
|
|
|
123
141
|
];
|
|
124
142
|
const lightThemes = createThemesFrom("light", createTheme, {
|
|
125
143
|
backgrounds: lightGradient,
|
|
144
|
+
borderColors: lightGradient.slice(2),
|
|
126
145
|
isLight: true
|
|
127
146
|
});
|
|
128
147
|
const darkThemes = createThemesFrom("dark", createTheme, {
|
|
129
148
|
backgrounds: darkGradient,
|
|
130
149
|
colors: lightGradient.slice(2),
|
|
150
|
+
isBase: true,
|
|
131
151
|
isLight: false,
|
|
132
152
|
shift: 1,
|
|
133
153
|
offsets: {
|
|
@@ -142,7 +162,7 @@ const baseThemes = {
|
|
|
142
162
|
},
|
|
143
163
|
light_active: makeActiveTheme(lightThemes.light),
|
|
144
164
|
light_Card: lightThemes.light,
|
|
145
|
-
|
|
165
|
+
light_DrawerFrame: lightThemes.light_alt1,
|
|
146
166
|
light_Button: lightThemes.light_alt1,
|
|
147
167
|
...darkThemes,
|
|
148
168
|
dark: {
|
|
@@ -151,7 +171,7 @@ const baseThemes = {
|
|
|
151
171
|
},
|
|
152
172
|
dark_active: makeActiveTheme(darkThemes.dark),
|
|
153
173
|
dark_Card: darkThemes.dark_alt1,
|
|
154
|
-
|
|
174
|
+
dark_DrawerFrame: darkThemes.dark_alt2,
|
|
155
175
|
dark_Button: darkThemes.dark_alt1
|
|
156
176
|
};
|
|
157
177
|
function makeActiveTheme(theme) {
|
|
@@ -171,7 +191,7 @@ const colorThemeEntries = colorSchemes.flatMap(({ name, colors, darkColors }) =>
|
|
|
171
191
|
const isLight = i === 0;
|
|
172
192
|
const [backgrounds, colors2] = [
|
|
173
193
|
Object.values(props.backgrounds),
|
|
174
|
-
Object.values(props.colors).slice(isLight ?
|
|
194
|
+
Object.values(props.colors).slice(isLight ? 2 : 2)
|
|
175
195
|
];
|
|
176
196
|
const scheme = isLight ? "light" : "dark";
|
|
177
197
|
const shift = isLight ? 0 : 1;
|
|
@@ -182,12 +202,13 @@ const colorThemeEntries = colorSchemes.flatMap(({ name, colors, darkColors }) =>
|
|
|
182
202
|
const themeWithAlts = createThemesFrom(name, createTheme, {
|
|
183
203
|
colors: colors2,
|
|
184
204
|
backgrounds,
|
|
205
|
+
borderColors: backgrounds,
|
|
185
206
|
isLight,
|
|
186
207
|
shift,
|
|
187
208
|
isBase: false,
|
|
188
209
|
offsets: {
|
|
189
|
-
background: isLight ? [
|
|
190
|
-
borderColor: isLight ? [
|
|
210
|
+
background: isLight ? [0, 0, 0, 0, 0, 0] : null,
|
|
211
|
+
borderColor: isLight ? [3, 3, 3, 3, 2] : null,
|
|
191
212
|
color: isLight ? [0, 0, -1, -2, -3, -3, -4] : [-1, -1, -1, -1, -1, -1]
|
|
192
213
|
}
|
|
193
214
|
});
|
|
@@ -199,41 +220,17 @@ const colorThemeEntries = colorSchemes.flatMap(({ name, colors, darkColors }) =>
|
|
|
199
220
|
...altLightThemes,
|
|
200
221
|
[`${lightButtonTheme[0]}_Button`, altLightThemes[2][1]],
|
|
201
222
|
[`${lightButtonTheme[0]}_Card`, altLightThemes[2][1]],
|
|
202
|
-
[`${lightButtonTheme[0]}
|
|
223
|
+
[`${lightButtonTheme[0]}_DrawerFrame`, altLightThemes[2][1]],
|
|
203
224
|
...altDarkThemes,
|
|
204
225
|
[`${darkButtonTheme[0]}_Button`, altDarkThemes[2][1]],
|
|
205
226
|
[`${darkButtonTheme[0]}_Card`, altDarkThemes[2][1]],
|
|
206
|
-
[`${darkButtonTheme[0]}
|
|
227
|
+
[`${darkButtonTheme[0]}_DrawerFrame`, altDarkThemes[2][1]]
|
|
207
228
|
];
|
|
208
229
|
});
|
|
209
|
-
const transparent = {
|
|
210
|
-
background: "transparent",
|
|
211
|
-
backgroundSoft: "transparent",
|
|
212
|
-
backgroundHover: "transparent",
|
|
213
|
-
backgroundPress: "transparent",
|
|
214
|
-
backgroundFocus: "transparent",
|
|
215
|
-
backgroundTransparent: "transparent",
|
|
216
|
-
shadowColor: "transparent",
|
|
217
|
-
shadowColorHover: "transparent",
|
|
218
|
-
shadowColorPress: "transparent",
|
|
219
|
-
shadowColorFocus: "transparent"
|
|
220
|
-
};
|
|
221
|
-
const dark_outline = {
|
|
222
|
-
...baseThemes.dark,
|
|
223
|
-
borderColor: "#fff",
|
|
224
|
-
...transparent
|
|
225
|
-
};
|
|
226
|
-
const light_outline = {
|
|
227
|
-
...baseThemes.light,
|
|
228
|
-
borderColor: "#000",
|
|
229
|
-
...transparent
|
|
230
|
-
};
|
|
231
230
|
const colorThemes = Object.fromEntries(colorThemeEntries);
|
|
232
231
|
const allThemes = {
|
|
233
232
|
...baseThemes,
|
|
234
|
-
...colorThemes
|
|
235
|
-
dark_outline,
|
|
236
|
-
light_outline
|
|
233
|
+
...colorThemes
|
|
237
234
|
};
|
|
238
235
|
const themes = allThemes;
|
|
239
236
|
export {
|
package/dist/esm/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\ntype ThemeCreatorProps = {\n shift?: number\n backgrounds: (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 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 return {\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 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 // colorStronger: get(colors, str + strongerDir),\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 }\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 isLight: true,\n})\n\nconst darkThemes = createThemesFrom('dark', createTheme, {\n backgrounds: darkGradient,\n colors: lightGradient.slice(2),\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_Drawer: 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_Drawer: 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 ? 0 : 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 isLight,\n shift,\n isBase: false,\n offsets: {\n background: isLight ? [1, 1, 1, 0, 0, 0] : null,\n borderColor: isLight ? [0, 1, 1, 2, 2, -2] : null,\n color: isLight ? [0, 0, -1, -2, -3, -3, -4] : [-1, -1, -1, -1, -1, -1],\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]}_Drawer`, altLightThemes[2][1]],\n ...altDarkThemes,\n [`${darkButtonTheme[0]}_Button`, altDarkThemes[2][1]],\n [`${darkButtonTheme[0]}_Card`, altDarkThemes[2][1]],\n [`${darkButtonTheme[0]}_Drawer`, altDarkThemes[2][1]],\n ]\n})\n\nconst transparent = {\n background: 'transparent',\n backgroundSoft: 'transparent',\n backgroundHover: 'transparent',\n backgroundPress: 'transparent',\n backgroundFocus: 'transparent',\n backgroundTransparent: 'transparent',\n shadowColor: 'transparent',\n shadowColorHover: 'transparent',\n shadowColorPress: 'transparent',\n shadowColorFocus: 'transparent',\n}\n\ntype MyThemeBase = typeof baseThemes['light_alt1']\n\n// @ts-ignore\nconst dark_outline: MyThemeBase = {\n ...baseThemes.dark,\n borderColor: '#fff',\n ...transparent,\n}\n\n// @ts-ignore\nconst light_outline: MyThemeBase = {\n ...baseThemes.light,\n borderColor: '#000',\n ...transparent,\n}\n\nconst colorThemes: {\n [key in ColorThemeNames]: MyThemeBase\n} = Object.fromEntries(colorThemeEntries) as any\n\nconst allThemes = {\n ...baseThemes,\n ...colorThemes,\n dark_outline,\n light_outline,\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;AACA;AACA;AAEA;AACA;
|
|
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": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/tokens.js
CHANGED
|
File without changes
|
package/dist/esm/tokens.js.map
CHANGED
|
File without changes
|
package/dist/jsx/colorUtils.js
CHANGED
|
File without changes
|
package/dist/jsx/index.js
CHANGED
|
File without changes
|