@tamagui/themes 1.14.9 → 1.15.1
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/index.js.map +2 -2
- package/dist/cjs/themes.js +89 -74
- package/dist/cjs/themes.js.map +3 -3
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/index.mjs.map +2 -2
- package/dist/esm/themes.js +91 -75
- package/dist/esm/themes.js.map +3 -3
- package/dist/esm/themes.mjs +91 -75
- package/dist/esm/themes.mjs.map +3 -3
- package/package.json +13 -7
- package/src/generate.ts +25 -0
- package/src/generated.js +23954 -0
- package/src/index.tsx +8 -0
- package/src/themes.tsx +112 -82
- package/types/generate.d.ts +2 -0
- package/types/index.d.ts.map +1 -1
- package/types/themes.d.ts +7460 -7460
- package/types/themes.d.ts.map +1 -1
package/dist/cjs/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx"],
|
|
4
|
-
"sourcesContent": ["export * from './themes'\nexport * from './tokens'\nexport * from '@tamagui/colors'\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["// import generatedThemes from './generated'\n// import { themes as runtimeThemes } from './themes'\n\n// export const themes =\n// process.env.NODE_ENV === 'development'\n// ? runtimeThemes\n// : (generatedThemes as typeof runtimeThemes)\n\nexport * from './themes'\nexport * from './tokens'\nexport * from '@tamagui/colors'\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAQA,wBAAc,qBARd;AASA,wBAAc,qBATd;AAUA,wBAAc,4BAVd;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/themes.js
CHANGED
|
@@ -79,12 +79,23 @@ const templateShadows = {
|
|
|
79
79
|
shadowColorPress: 2,
|
|
80
80
|
shadowColorFocus: 2
|
|
81
81
|
};
|
|
82
|
-
const
|
|
82
|
+
const toSkip = {
|
|
83
83
|
...templateColors,
|
|
84
84
|
...templateShadows
|
|
85
85
|
};
|
|
86
|
+
const override = Object.fromEntries(Object.entries(toSkip).map(([k]) => [k, 0]));
|
|
87
|
+
const overrideShadows = Object.fromEntries(
|
|
88
|
+
Object.entries(templateShadows).map(([k]) => [k, 0])
|
|
89
|
+
);
|
|
90
|
+
const overrideWithColors = {
|
|
91
|
+
...override,
|
|
92
|
+
color: 0,
|
|
93
|
+
colorHover: 0,
|
|
94
|
+
colorFocus: 0,
|
|
95
|
+
colorPress: 0
|
|
96
|
+
};
|
|
86
97
|
const template = {
|
|
87
|
-
...
|
|
98
|
+
...toSkip,
|
|
88
99
|
// the background, color, etc keys here work like generics - they make it so you
|
|
89
100
|
// can publish components for others to use without mandating a specific color scale
|
|
90
101
|
// the @tamagui/button Button component looks for `$background`, so you set the
|
|
@@ -139,24 +150,22 @@ const baseThemes = {
|
|
|
139
150
|
dark
|
|
140
151
|
};
|
|
141
152
|
const masks = {
|
|
153
|
+
skip: import_create_theme.skipMask,
|
|
142
154
|
weaker: (0, import_create_theme.createWeakenMask)(),
|
|
143
155
|
stronger: (0, import_create_theme.createStrengthenMask)()
|
|
144
156
|
};
|
|
145
157
|
const maskOptions = {
|
|
146
|
-
|
|
158
|
+
override,
|
|
159
|
+
skip: toSkip,
|
|
147
160
|
// avoids the transparent ends
|
|
148
161
|
max: palettes.light.length - 2,
|
|
149
162
|
min: 1
|
|
150
163
|
};
|
|
151
|
-
const
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
const [colorThemes, inverseColorThemes] = [
|
|
157
|
-
import_tokens.colorTokens[name],
|
|
158
|
-
import_tokens.colorTokens[inverseName]
|
|
159
|
-
].map((colorSet) => {
|
|
164
|
+
const transparent = (hsl, opacity = 0) => hsl.replace(`%)`, `%, ${opacity})`).replace(`hsl(`, `hsla(`);
|
|
165
|
+
const [lightColorThemes, darkColorThemes] = [import_tokens.colorTokens.light, import_tokens.colorTokens.dark].map(
|
|
166
|
+
(colorSet, i) => {
|
|
167
|
+
const isLight = i === 0;
|
|
168
|
+
const theme = baseThemes[isLight ? "light" : "dark"];
|
|
160
169
|
return Object.fromEntries(
|
|
161
170
|
Object.keys(colorSet).map((color) => {
|
|
162
171
|
const colorPalette = Object.values(colorSet[color]);
|
|
@@ -185,80 +194,86 @@ const allThemes = (0, import_create_theme.addChildren)(baseThemes, (name, theme)
|
|
|
185
194
|
return [color, colorTheme];
|
|
186
195
|
})
|
|
187
196
|
);
|
|
188
|
-
}
|
|
197
|
+
}
|
|
198
|
+
);
|
|
199
|
+
const allThemes = (0, import_create_theme.addChildren)(baseThemes, (name, theme) => {
|
|
200
|
+
const isLight = name === "light";
|
|
201
|
+
const inverseName = isLight ? "dark" : "light";
|
|
202
|
+
const inverseTheme = baseThemes[inverseName];
|
|
203
|
+
const colorThemes = isLight ? lightColorThemes : darkColorThemes;
|
|
204
|
+
const inverseColorThemes = isLight ? darkColorThemes : lightColorThemes;
|
|
189
205
|
const allColorThemes = (0, import_create_theme.addChildren)(colorThemes, (colorName, colorTheme) => {
|
|
190
206
|
const inverse = inverseColorThemes[colorName];
|
|
191
207
|
return {
|
|
192
|
-
...getAltThemes(colorTheme, inverse),
|
|
193
|
-
...getComponentThemes(colorTheme, inverse)
|
|
208
|
+
...getAltThemes(colorTheme, inverse, isLight),
|
|
209
|
+
...getComponentThemes(colorTheme, inverse, isLight)
|
|
194
210
|
};
|
|
195
211
|
});
|
|
196
|
-
const baseActiveTheme = (0, import_create_theme.applyMask)(colorThemes.blue, masks.weaker, {
|
|
197
|
-
...maskOptions,
|
|
198
|
-
strength: 4
|
|
199
|
-
});
|
|
200
212
|
const baseSubThemes = {
|
|
201
|
-
...getAltThemes(theme, inverseTheme,
|
|
202
|
-
...getComponentThemes(theme, inverseTheme)
|
|
213
|
+
...getAltThemes(theme, inverseTheme, isLight, inverseTheme),
|
|
214
|
+
...getComponentThemes(theme, inverseTheme, isLight)
|
|
203
215
|
};
|
|
204
216
|
return {
|
|
205
217
|
...baseSubThemes,
|
|
206
218
|
...allColorThemes
|
|
207
219
|
};
|
|
208
|
-
function getAltThemes(theme2, inverse, activeTheme) {
|
|
209
|
-
const maskOptionsAlt = {
|
|
210
|
-
...maskOptions,
|
|
211
|
-
skip: templateShadows
|
|
212
|
-
};
|
|
213
|
-
const alt1 = (0, import_create_theme.applyMask)(theme2, masks.weaker, maskOptionsAlt);
|
|
214
|
-
const alt2 = (0, import_create_theme.applyMask)(alt1, masks.weaker, maskOptionsAlt);
|
|
215
|
-
const active = activeTheme ?? (0, import_create_theme.applyMask)(theme2, masks.weaker, {
|
|
216
|
-
...maskOptions,
|
|
217
|
-
strength: 4
|
|
218
|
-
});
|
|
219
|
-
return (0, import_create_theme.addChildren)({ alt1, alt2, active }, (_, subTheme) => {
|
|
220
|
-
return getComponentThemes(subTheme, subTheme === inverse ? theme2 : inverse);
|
|
221
|
-
});
|
|
222
|
-
}
|
|
223
|
-
function getComponentThemes(theme2, inverse) {
|
|
224
|
-
const weaker1 = (0, import_create_theme.applyMask)(theme2, masks.weaker, maskOptions);
|
|
225
|
-
const weaker2 = (0, import_create_theme.applyMask)(weaker1, masks.weaker, maskOptions);
|
|
226
|
-
const stronger1 = (0, import_create_theme.applyMask)(theme2, masks.stronger, maskOptions);
|
|
227
|
-
const inverse1 = (0, import_create_theme.applyMask)(inverse, masks.weaker, maskOptions);
|
|
228
|
-
const inverse2 = (0, import_create_theme.applyMask)(inverse1, masks.weaker, maskOptions);
|
|
229
|
-
const strongerBorderLighterBackground = isLight ? {
|
|
230
|
-
...stronger1,
|
|
231
|
-
borderColor: weaker1.borderColor,
|
|
232
|
-
borderColorHover: weaker1.borderColorHover,
|
|
233
|
-
borderColorPress: weaker1.borderColorPress,
|
|
234
|
-
borderColorFocus: weaker1.borderColorFocus
|
|
235
|
-
} : {
|
|
236
|
-
...theme2,
|
|
237
|
-
borderColor: weaker1.borderColor,
|
|
238
|
-
borderColorHover: weaker1.borderColorHover,
|
|
239
|
-
borderColorPress: weaker1.borderColorPress,
|
|
240
|
-
borderColorFocus: weaker1.borderColorFocus
|
|
241
|
-
};
|
|
242
|
-
return {
|
|
243
|
-
Card: weaker1,
|
|
244
|
-
Button: weaker2,
|
|
245
|
-
Checkbox: weaker2,
|
|
246
|
-
DrawerFrame: weaker1,
|
|
247
|
-
SliderTrack: stronger1,
|
|
248
|
-
SliderTrackActive: weaker2,
|
|
249
|
-
SliderThumb: inverse1,
|
|
250
|
-
Progress: weaker1,
|
|
251
|
-
ProgressIndicator: inverse,
|
|
252
|
-
Switch: weaker2,
|
|
253
|
-
SwitchThumb: inverse2,
|
|
254
|
-
TooltipArrow: weaker1,
|
|
255
|
-
TooltipContent: weaker2,
|
|
256
|
-
Input: strongerBorderLighterBackground,
|
|
257
|
-
TextArea: strongerBorderLighterBackground,
|
|
258
|
-
Tooltip: inverse1
|
|
259
|
-
};
|
|
260
|
-
}
|
|
261
220
|
});
|
|
221
|
+
function getAltThemes(theme, inverse, isLight, activeTheme) {
|
|
222
|
+
const maskOptionsAlt = {
|
|
223
|
+
...maskOptions,
|
|
224
|
+
override: overrideShadows
|
|
225
|
+
};
|
|
226
|
+
const alt1 = (0, import_create_theme.applyMask)(theme, masks.weaker, maskOptionsAlt);
|
|
227
|
+
const alt2 = (0, import_create_theme.applyMask)(alt1, masks.weaker, maskOptionsAlt);
|
|
228
|
+
const active = activeTheme ?? (process.env.ACTIVE_THEME_INVERSE ? inverse : (0, import_create_theme.applyMask)(theme, masks.weaker, {
|
|
229
|
+
...maskOptions,
|
|
230
|
+
strength: 4
|
|
231
|
+
}));
|
|
232
|
+
return (0, import_create_theme.addChildren)({ alt1, alt2, active }, (_, subTheme) => {
|
|
233
|
+
return getComponentThemes(subTheme, subTheme === inverse ? theme : inverse, isLight);
|
|
234
|
+
});
|
|
235
|
+
}
|
|
236
|
+
function getComponentThemes(theme, inverse, isLight) {
|
|
237
|
+
const weaker1 = (0, import_create_theme.applyMask)(theme, masks.weaker, maskOptions);
|
|
238
|
+
const weaker2 = (0, import_create_theme.applyMask)(weaker1, masks.weaker, {
|
|
239
|
+
...maskOptions,
|
|
240
|
+
override: overrideWithColors
|
|
241
|
+
});
|
|
242
|
+
const stronger1 = (0, import_create_theme.applyMask)(theme, masks.stronger, maskOptions);
|
|
243
|
+
const inverse1 = (0, import_create_theme.applyMask)(inverse, masks.weaker, maskOptions);
|
|
244
|
+
const inverse2 = (0, import_create_theme.applyMask)(inverse1, masks.weaker, maskOptions);
|
|
245
|
+
const strongerBorderLighterBackground = isLight ? {
|
|
246
|
+
...stronger1,
|
|
247
|
+
borderColor: weaker1.borderColor,
|
|
248
|
+
borderColorHover: weaker1.borderColorHover,
|
|
249
|
+
borderColorPress: weaker1.borderColorPress,
|
|
250
|
+
borderColorFocus: weaker1.borderColorFocus
|
|
251
|
+
} : {
|
|
252
|
+
...(0, import_create_theme.applyMask)(theme, masks.skip, maskOptions),
|
|
253
|
+
borderColor: weaker1.borderColor,
|
|
254
|
+
borderColorHover: weaker1.borderColorHover,
|
|
255
|
+
borderColorPress: weaker1.borderColorPress,
|
|
256
|
+
borderColorFocus: weaker1.borderColorFocus
|
|
257
|
+
};
|
|
258
|
+
return {
|
|
259
|
+
Card: weaker1,
|
|
260
|
+
Button: weaker2,
|
|
261
|
+
Checkbox: weaker2,
|
|
262
|
+
DrawerFrame: weaker1,
|
|
263
|
+
SliderTrack: stronger1,
|
|
264
|
+
SliderTrackActive: weaker2,
|
|
265
|
+
SliderThumb: inverse1,
|
|
266
|
+
Progress: weaker1,
|
|
267
|
+
ProgressIndicator: inverse,
|
|
268
|
+
Switch: weaker2,
|
|
269
|
+
SwitchThumb: inverse2,
|
|
270
|
+
TooltipArrow: weaker1,
|
|
271
|
+
TooltipContent: weaker2,
|
|
272
|
+
Input: strongerBorderLighterBackground,
|
|
273
|
+
TextArea: strongerBorderLighterBackground,
|
|
274
|
+
Tooltip: inverse1
|
|
275
|
+
};
|
|
276
|
+
}
|
|
262
277
|
const themes = {
|
|
263
278
|
...allThemes,
|
|
264
279
|
// bring back the full type, the rest use a subset to avoid clogging up ts,
|
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 {\n MaskOptions,\n addChildren,\n applyMask,\n createStrengthenMask,\n createTheme,\n createWeakenMask,\n} from '@tamagui/create-theme'\n\nimport { colorTokens, darkColors, lightColors } from './tokens'\n\ntype ColorName = keyof typeof colorTokens.dark\n\nconst lightTransparent = 'rgba(255,255,255,0)'\nconst darkTransparent = 'rgba(10,10,10,0)'\n\n// background => foreground\nconst palettes = {\n dark: [\n darkTransparent,\n '#050505',\n '#151515',\n '#191919',\n '#232323',\n '#282828',\n '#323232',\n '#424242',\n '#494949',\n '#545454',\n '#626262',\n '#a5a5a5',\n '#fff',\n lightTransparent,\n ],\n light: [\n lightTransparent,\n '#fff',\n '#f9f9f9',\n 'hsl(0, 0%, 97.3%)',\n 'hsl(0, 0%, 95.1%)',\n 'hsl(0, 0%, 94.0%)',\n 'hsl(0, 0%, 92.0%)',\n 'hsl(0, 0%, 89.5%)',\n 'hsl(0, 0%, 81.0%)',\n 'hsl(0, 0%, 56.1%)',\n 'hsl(0, 0%, 50.3%)',\n 'hsl(0, 0%, 42.5%)',\n 'hsl(0, 0%, 9.0%)',\n darkTransparent,\n ],\n}\n\nconst templateColors = {\n color1: 1,\n color2: 2,\n color3: 3,\n color4: 4,\n color5: 5,\n color6: 6,\n color7: 7,\n color8: 8,\n color9: 9,\n color10: 10,\n color11: 11,\n color12: 12,\n}\n\nconst templateShadows = {\n shadowColor: 1,\n shadowColorHover: 1,\n shadowColorPress: 2,\n shadowColorFocus: 2,\n}\n\n// we can use subset of our template as a \"
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
6
|
-
"names": [
|
|
4
|
+
"sourcesContent": ["import {\n MaskOptions,\n addChildren,\n applyMask,\n createStrengthenMask,\n createTheme,\n createWeakenMask,\n skipMask,\n} from '@tamagui/create-theme'\n\nimport { colorTokens, darkColors, lightColors } from './tokens'\n\ntype ColorName = keyof typeof colorTokens.dark\n\nconst lightTransparent = 'rgba(255,255,255,0)'\nconst darkTransparent = 'rgba(10,10,10,0)'\n\n// background => foreground\nconst palettes = {\n dark: [\n darkTransparent,\n '#050505',\n '#151515',\n '#191919',\n '#232323',\n '#282828',\n '#323232',\n '#424242',\n '#494949',\n '#545454',\n '#626262',\n '#a5a5a5',\n '#fff',\n lightTransparent,\n ],\n light: [\n lightTransparent,\n '#fff',\n '#f9f9f9',\n 'hsl(0, 0%, 97.3%)',\n 'hsl(0, 0%, 95.1%)',\n 'hsl(0, 0%, 94.0%)',\n 'hsl(0, 0%, 92.0%)',\n 'hsl(0, 0%, 89.5%)',\n 'hsl(0, 0%, 81.0%)',\n 'hsl(0, 0%, 56.1%)',\n 'hsl(0, 0%, 50.3%)',\n 'hsl(0, 0%, 42.5%)',\n 'hsl(0, 0%, 9.0%)',\n darkTransparent,\n ],\n}\n\nconst templateColors = {\n color1: 1,\n color2: 2,\n color3: 3,\n color4: 4,\n color5: 5,\n color6: 6,\n color7: 7,\n color8: 8,\n color9: 9,\n color10: 10,\n color11: 11,\n color12: 12,\n}\n\nconst templateShadows = {\n shadowColor: 1,\n shadowColorHover: 1,\n shadowColorPress: 2,\n shadowColorFocus: 2,\n}\n\n// we can use subset of our template as a \"override\" so it doesn't get adjusted with masks\n// we want to skip over templateColor + templateShadows\nconst toSkip = {\n ...templateColors,\n ...templateShadows,\n}\n\nconst override = Object.fromEntries(Object.entries(toSkip).map(([k]) => [k, 0]))\nconst overrideShadows = Object.fromEntries(\n Object.entries(templateShadows).map(([k]) => [k, 0])\n)\nconst overrideWithColors = {\n ...override,\n color: 0,\n colorHover: 0,\n colorFocus: 0,\n colorPress: 0,\n}\n\n// templates use the palette and specify index\n// negative goes backwards from end so -1 is the last item\nconst template = {\n ...toSkip,\n // the background, color, etc keys here work like generics - they make it so you\n // can publish components for others to use without mandating a specific color scale\n // the @tamagui/button Button component looks for `$background`, so you set the\n // dark_red_Button theme to have a stronger background than the dark_red theme.\n background: 2,\n backgroundHover: 3,\n backgroundPress: 1,\n backgroundFocus: 2,\n backgroundStrong: 1,\n backgroundTransparent: 0,\n color: -1,\n colorHover: -2,\n colorPress: -1,\n colorFocus: -2,\n colorTransparent: -0,\n borderColor: 4,\n borderColorHover: 5,\n borderColorPress: 3,\n borderColorFocus: 4,\n placeholderColor: -4,\n}\n\nconst lightShadowColor = 'rgba(0,0,0,0.02)'\nconst lightShadowColorStrong = 'rgba(0,0,0,0.066)'\nconst darkShadowColor = 'rgba(0,0,0,0.2)'\nconst darkShadowColorStrong = 'rgba(0,0,0,0.3)'\n\nconst lightShadows = {\n shadowColor: lightShadowColorStrong,\n shadowColorHover: lightShadowColorStrong,\n shadowColorPress: lightShadowColor,\n shadowColorFocus: lightShadowColor,\n}\n\nconst darkShadows = {\n shadowColor: darkShadowColorStrong,\n shadowColorHover: darkShadowColorStrong,\n shadowColorPress: darkShadowColor,\n shadowColorFocus: darkShadowColor,\n}\n\nconst lightTemplate = {\n ...template,\n // our light color palette is... a bit unique\n borderColor: 6,\n borderColorHover: 7,\n borderColorFocus: 5,\n borderColorPress: 6,\n ...lightShadows,\n}\n\nconst darkTemplate = { ...template, ...darkShadows }\n\nconst light = createTheme(palettes.light, lightTemplate)\nconst dark = createTheme(palettes.dark, darkTemplate)\n\ntype SubTheme = typeof light\n\nconst baseThemes: {\n light: SubTheme\n dark: SubTheme\n} = {\n light,\n dark,\n}\n\nconst masks = {\n skip: skipMask,\n weaker: createWeakenMask(),\n stronger: createStrengthenMask(),\n}\n\n// default mask options for most uses\nconst maskOptions: MaskOptions = {\n override,\n skip: toSkip,\n // avoids the transparent ends\n max: palettes.light.length - 2,\n min: 1,\n}\n\nconst transparent = (hsl: string, opacity = 0) =>\n hsl.replace(`%)`, `%, ${opacity})`).replace(`hsl(`, `hsla(`)\n\n// setup colorThemes and their inverses\nconst [lightColorThemes, darkColorThemes] = [colorTokens.light, colorTokens.dark].map(\n (colorSet, i) => {\n const isLight = i === 0\n const theme = baseThemes[isLight ? 'light' : 'dark']\n\n return Object.fromEntries(\n Object.keys(colorSet).map((color) => {\n const colorPalette = Object.values(colorSet[color]) as string[]\n // were re-ordering these\n const [head, tail] = [\n colorPalette.slice(0, 6),\n colorPalette.slice(colorPalette.length - 5),\n ]\n // add our transparent colors first/last\n // and make sure the last (foreground) color is white/black rather than colorful\n // this is mostly for consistency with the older theme-base\n const palette = [\n transparent(colorPalette[0]),\n ...head,\n ...tail,\n theme.color,\n transparent(colorPalette[colorPalette.length - 1]),\n ]\n\n const colorTheme = createTheme(\n palette,\n isLight\n ? {\n ...lightTemplate,\n // light color themes are a bit less sensitive\n borderColor: 4,\n borderColorHover: 5,\n borderColorFocus: 4,\n borderColorPress: 4,\n }\n : darkTemplate\n )\n\n return [color, colorTheme]\n })\n ) as Record<ColorName, SubTheme>\n }\n)\n\nconst allThemes = addChildren(baseThemes, (name, theme) => {\n const isLight = name === 'light'\n const inverseName = isLight ? 'dark' : 'light'\n const inverseTheme = baseThemes[inverseName]\n const colorThemes = isLight ? lightColorThemes : darkColorThemes\n const inverseColorThemes = isLight ? darkColorThemes : lightColorThemes\n\n const allColorThemes = addChildren(colorThemes, (colorName, colorTheme) => {\n const inverse = inverseColorThemes[colorName]\n return {\n ...getAltThemes(colorTheme, inverse, isLight),\n ...getComponentThemes(colorTheme, inverse, isLight),\n }\n })\n\n const baseSubThemes = {\n ...getAltThemes(theme, inverseTheme, isLight, inverseTheme),\n ...getComponentThemes(theme, inverseTheme, isLight),\n }\n\n return {\n ...baseSubThemes,\n ...allColorThemes,\n }\n})\n\nfunction getAltThemes(\n theme: SubTheme,\n inverse: SubTheme,\n isLight: boolean,\n activeTheme?: SubTheme\n) {\n const maskOptionsAlt = {\n ...maskOptions,\n override: overrideShadows,\n }\n const alt1 = applyMask(theme, masks.weaker, maskOptionsAlt)\n const alt2 = applyMask(alt1, masks.weaker, maskOptionsAlt)\n const active =\n activeTheme ??\n (process.env.ACTIVE_THEME_INVERSE\n ? inverse\n : applyMask(theme, masks.weaker, {\n ...maskOptions,\n strength: 4,\n }))\n\n return addChildren({ alt1, alt2, active }, (_, subTheme) => {\n return getComponentThemes(subTheme, subTheme === inverse ? theme : inverse, isLight)\n })\n}\n\nfunction getComponentThemes(theme: SubTheme, inverse: SubTheme, isLight: boolean) {\n const weaker1 = applyMask(theme, masks.weaker, maskOptions)\n const weaker2 = applyMask(weaker1, masks.weaker, {\n ...maskOptions,\n override: overrideWithColors,\n })\n const stronger1 = applyMask(theme, masks.stronger, maskOptions)\n const inverse1 = applyMask(inverse, masks.weaker, maskOptions)\n const inverse2 = applyMask(inverse1, masks.weaker, maskOptions)\n const strongerBorderLighterBackground: SubTheme = isLight\n ? {\n ...stronger1,\n borderColor: weaker1.borderColor,\n borderColorHover: weaker1.borderColorHover,\n borderColorPress: weaker1.borderColorPress,\n borderColorFocus: weaker1.borderColorFocus,\n }\n : {\n ...applyMask(theme, masks.skip, maskOptions),\n borderColor: weaker1.borderColor,\n borderColorHover: weaker1.borderColorHover,\n borderColorPress: weaker1.borderColorPress,\n borderColorFocus: weaker1.borderColorFocus,\n }\n\n return {\n Card: weaker1,\n Button: weaker2,\n Checkbox: weaker2,\n DrawerFrame: weaker1,\n SliderTrack: stronger1,\n SliderTrackActive: weaker2,\n SliderThumb: inverse1,\n Progress: weaker1,\n ProgressIndicator: inverse,\n Switch: weaker2,\n SwitchThumb: inverse2,\n TooltipArrow: weaker1,\n TooltipContent: weaker2,\n Input: strongerBorderLighterBackground,\n TextArea: strongerBorderLighterBackground,\n Tooltip: inverse1,\n }\n}\n\nexport const themes = {\n ...allThemes,\n // bring back the full type, the rest use a subset to avoid clogging up ts,\n // tamagui will be smart and use the top level themes as the type for useTheme() etc\n light: createTheme(palettes.light, lightTemplate, { nonInheritedValues: lightColors }),\n dark: createTheme(palettes.dark, darkTemplate, { nonInheritedValues: darkColors }),\n}\n\n// if (process.env.NODE_ENV === 'development') {\n// console.log(JSON.stringify(themes).length)\n// }\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx"],
|
|
4
|
-
"sourcesContent": ["export * from './themes'\nexport * from './tokens'\nexport * from '@tamagui/colors'\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["// import generatedThemes from './generated'\n// import { themes as runtimeThemes } from './themes'\n\n// export const themes =\n// process.env.NODE_ENV === 'development'\n// ? runtimeThemes\n// : (generatedThemes as typeof runtimeThemes)\n\nexport * from './themes'\nexport * from './tokens'\nexport * from '@tamagui/colors'\n"],
|
|
5
|
+
"mappings": "AAQA,cAAc;AACd,cAAc;AACd,cAAc;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/index.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx"],
|
|
4
|
-
"sourcesContent": ["export * from './themes'\nexport * from './tokens'\nexport * from '@tamagui/colors'\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["// import generatedThemes from './generated'\n// import { themes as runtimeThemes } from './themes'\n\n// export const themes =\n// process.env.NODE_ENV === 'development'\n// ? runtimeThemes\n// : (generatedThemes as typeof runtimeThemes)\n\nexport * from './themes'\nexport * from './tokens'\nexport * from '@tamagui/colors'\n"],
|
|
5
|
+
"mappings": "AAQA,cAAc;AACd,cAAc;AACd,cAAc;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/themes.js
CHANGED
|
@@ -3,7 +3,8 @@ import {
|
|
|
3
3
|
applyMask,
|
|
4
4
|
createStrengthenMask,
|
|
5
5
|
createTheme,
|
|
6
|
-
createWeakenMask
|
|
6
|
+
createWeakenMask,
|
|
7
|
+
skipMask
|
|
7
8
|
} from "@tamagui/create-theme";
|
|
8
9
|
import { colorTokens, darkColors, lightColors } from "./tokens";
|
|
9
10
|
const lightTransparent = "rgba(255,255,255,0)";
|
|
@@ -62,12 +63,23 @@ const templateShadows = {
|
|
|
62
63
|
shadowColorPress: 2,
|
|
63
64
|
shadowColorFocus: 2
|
|
64
65
|
};
|
|
65
|
-
const
|
|
66
|
+
const toSkip = {
|
|
66
67
|
...templateColors,
|
|
67
68
|
...templateShadows
|
|
68
69
|
};
|
|
70
|
+
const override = Object.fromEntries(Object.entries(toSkip).map(([k]) => [k, 0]));
|
|
71
|
+
const overrideShadows = Object.fromEntries(
|
|
72
|
+
Object.entries(templateShadows).map(([k]) => [k, 0])
|
|
73
|
+
);
|
|
74
|
+
const overrideWithColors = {
|
|
75
|
+
...override,
|
|
76
|
+
color: 0,
|
|
77
|
+
colorHover: 0,
|
|
78
|
+
colorFocus: 0,
|
|
79
|
+
colorPress: 0
|
|
80
|
+
};
|
|
69
81
|
const template = {
|
|
70
|
-
...
|
|
82
|
+
...toSkip,
|
|
71
83
|
// the background, color, etc keys here work like generics - they make it so you
|
|
72
84
|
// can publish components for others to use without mandating a specific color scale
|
|
73
85
|
// the @tamagui/button Button component looks for `$background`, so you set the
|
|
@@ -122,24 +134,22 @@ const baseThemes = {
|
|
|
122
134
|
dark
|
|
123
135
|
};
|
|
124
136
|
const masks = {
|
|
137
|
+
skip: skipMask,
|
|
125
138
|
weaker: createWeakenMask(),
|
|
126
139
|
stronger: createStrengthenMask()
|
|
127
140
|
};
|
|
128
141
|
const maskOptions = {
|
|
129
|
-
|
|
142
|
+
override,
|
|
143
|
+
skip: toSkip,
|
|
130
144
|
// avoids the transparent ends
|
|
131
145
|
max: palettes.light.length - 2,
|
|
132
146
|
min: 1
|
|
133
147
|
};
|
|
134
|
-
const
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
const [colorThemes, inverseColorThemes] = [
|
|
140
|
-
colorTokens[name],
|
|
141
|
-
colorTokens[inverseName]
|
|
142
|
-
].map((colorSet) => {
|
|
148
|
+
const transparent = (hsl, opacity = 0) => hsl.replace(`%)`, `%, ${opacity})`).replace(`hsl(`, `hsla(`);
|
|
149
|
+
const [lightColorThemes, darkColorThemes] = [colorTokens.light, colorTokens.dark].map(
|
|
150
|
+
(colorSet, i) => {
|
|
151
|
+
const isLight = i === 0;
|
|
152
|
+
const theme = baseThemes[isLight ? "light" : "dark"];
|
|
143
153
|
return Object.fromEntries(
|
|
144
154
|
Object.keys(colorSet).map((color) => {
|
|
145
155
|
const colorPalette = Object.values(colorSet[color]);
|
|
@@ -168,80 +178,86 @@ const allThemes = addChildren(baseThemes, (name, theme) => {
|
|
|
168
178
|
return [color, colorTheme];
|
|
169
179
|
})
|
|
170
180
|
);
|
|
171
|
-
}
|
|
181
|
+
}
|
|
182
|
+
);
|
|
183
|
+
const allThemes = addChildren(baseThemes, (name, theme) => {
|
|
184
|
+
const isLight = name === "light";
|
|
185
|
+
const inverseName = isLight ? "dark" : "light";
|
|
186
|
+
const inverseTheme = baseThemes[inverseName];
|
|
187
|
+
const colorThemes = isLight ? lightColorThemes : darkColorThemes;
|
|
188
|
+
const inverseColorThemes = isLight ? darkColorThemes : lightColorThemes;
|
|
172
189
|
const allColorThemes = addChildren(colorThemes, (colorName, colorTheme) => {
|
|
173
190
|
const inverse = inverseColorThemes[colorName];
|
|
174
191
|
return {
|
|
175
|
-
...getAltThemes(colorTheme, inverse),
|
|
176
|
-
...getComponentThemes(colorTheme, inverse)
|
|
192
|
+
...getAltThemes(colorTheme, inverse, isLight),
|
|
193
|
+
...getComponentThemes(colorTheme, inverse, isLight)
|
|
177
194
|
};
|
|
178
195
|
});
|
|
179
|
-
const baseActiveTheme = applyMask(colorThemes.blue, masks.weaker, {
|
|
180
|
-
...maskOptions,
|
|
181
|
-
strength: 4
|
|
182
|
-
});
|
|
183
196
|
const baseSubThemes = {
|
|
184
|
-
...getAltThemes(theme, inverseTheme,
|
|
185
|
-
...getComponentThemes(theme, inverseTheme)
|
|
197
|
+
...getAltThemes(theme, inverseTheme, isLight, inverseTheme),
|
|
198
|
+
...getComponentThemes(theme, inverseTheme, isLight)
|
|
186
199
|
};
|
|
187
200
|
return {
|
|
188
201
|
...baseSubThemes,
|
|
189
202
|
...allColorThemes
|
|
190
203
|
};
|
|
191
|
-
function getAltThemes(theme2, inverse, activeTheme) {
|
|
192
|
-
const maskOptionsAlt = {
|
|
193
|
-
...maskOptions,
|
|
194
|
-
skip: templateShadows
|
|
195
|
-
};
|
|
196
|
-
const alt1 = applyMask(theme2, masks.weaker, maskOptionsAlt);
|
|
197
|
-
const alt2 = applyMask(alt1, masks.weaker, maskOptionsAlt);
|
|
198
|
-
const active = activeTheme ?? applyMask(theme2, masks.weaker, {
|
|
199
|
-
...maskOptions,
|
|
200
|
-
strength: 4
|
|
201
|
-
});
|
|
202
|
-
return addChildren({ alt1, alt2, active }, (_, subTheme) => {
|
|
203
|
-
return getComponentThemes(subTheme, subTheme === inverse ? theme2 : inverse);
|
|
204
|
-
});
|
|
205
|
-
}
|
|
206
|
-
function getComponentThemes(theme2, inverse) {
|
|
207
|
-
const weaker1 = applyMask(theme2, masks.weaker, maskOptions);
|
|
208
|
-
const weaker2 = applyMask(weaker1, masks.weaker, maskOptions);
|
|
209
|
-
const stronger1 = applyMask(theme2, masks.stronger, maskOptions);
|
|
210
|
-
const inverse1 = applyMask(inverse, masks.weaker, maskOptions);
|
|
211
|
-
const inverse2 = applyMask(inverse1, masks.weaker, maskOptions);
|
|
212
|
-
const strongerBorderLighterBackground = isLight ? {
|
|
213
|
-
...stronger1,
|
|
214
|
-
borderColor: weaker1.borderColor,
|
|
215
|
-
borderColorHover: weaker1.borderColorHover,
|
|
216
|
-
borderColorPress: weaker1.borderColorPress,
|
|
217
|
-
borderColorFocus: weaker1.borderColorFocus
|
|
218
|
-
} : {
|
|
219
|
-
...theme2,
|
|
220
|
-
borderColor: weaker1.borderColor,
|
|
221
|
-
borderColorHover: weaker1.borderColorHover,
|
|
222
|
-
borderColorPress: weaker1.borderColorPress,
|
|
223
|
-
borderColorFocus: weaker1.borderColorFocus
|
|
224
|
-
};
|
|
225
|
-
return {
|
|
226
|
-
Card: weaker1,
|
|
227
|
-
Button: weaker2,
|
|
228
|
-
Checkbox: weaker2,
|
|
229
|
-
DrawerFrame: weaker1,
|
|
230
|
-
SliderTrack: stronger1,
|
|
231
|
-
SliderTrackActive: weaker2,
|
|
232
|
-
SliderThumb: inverse1,
|
|
233
|
-
Progress: weaker1,
|
|
234
|
-
ProgressIndicator: inverse,
|
|
235
|
-
Switch: weaker2,
|
|
236
|
-
SwitchThumb: inverse2,
|
|
237
|
-
TooltipArrow: weaker1,
|
|
238
|
-
TooltipContent: weaker2,
|
|
239
|
-
Input: strongerBorderLighterBackground,
|
|
240
|
-
TextArea: strongerBorderLighterBackground,
|
|
241
|
-
Tooltip: inverse1
|
|
242
|
-
};
|
|
243
|
-
}
|
|
244
204
|
});
|
|
205
|
+
function getAltThemes(theme, inverse, isLight, activeTheme) {
|
|
206
|
+
const maskOptionsAlt = {
|
|
207
|
+
...maskOptions,
|
|
208
|
+
override: overrideShadows
|
|
209
|
+
};
|
|
210
|
+
const alt1 = applyMask(theme, masks.weaker, maskOptionsAlt);
|
|
211
|
+
const alt2 = applyMask(alt1, masks.weaker, maskOptionsAlt);
|
|
212
|
+
const active = activeTheme ?? (process.env.ACTIVE_THEME_INVERSE ? inverse : applyMask(theme, masks.weaker, {
|
|
213
|
+
...maskOptions,
|
|
214
|
+
strength: 4
|
|
215
|
+
}));
|
|
216
|
+
return addChildren({ alt1, alt2, active }, (_, subTheme) => {
|
|
217
|
+
return getComponentThemes(subTheme, subTheme === inverse ? theme : inverse, isLight);
|
|
218
|
+
});
|
|
219
|
+
}
|
|
220
|
+
function getComponentThemes(theme, inverse, isLight) {
|
|
221
|
+
const weaker1 = applyMask(theme, masks.weaker, maskOptions);
|
|
222
|
+
const weaker2 = applyMask(weaker1, masks.weaker, {
|
|
223
|
+
...maskOptions,
|
|
224
|
+
override: overrideWithColors
|
|
225
|
+
});
|
|
226
|
+
const stronger1 = applyMask(theme, masks.stronger, maskOptions);
|
|
227
|
+
const inverse1 = applyMask(inverse, masks.weaker, maskOptions);
|
|
228
|
+
const inverse2 = applyMask(inverse1, masks.weaker, maskOptions);
|
|
229
|
+
const strongerBorderLighterBackground = isLight ? {
|
|
230
|
+
...stronger1,
|
|
231
|
+
borderColor: weaker1.borderColor,
|
|
232
|
+
borderColorHover: weaker1.borderColorHover,
|
|
233
|
+
borderColorPress: weaker1.borderColorPress,
|
|
234
|
+
borderColorFocus: weaker1.borderColorFocus
|
|
235
|
+
} : {
|
|
236
|
+
...applyMask(theme, masks.skip, maskOptions),
|
|
237
|
+
borderColor: weaker1.borderColor,
|
|
238
|
+
borderColorHover: weaker1.borderColorHover,
|
|
239
|
+
borderColorPress: weaker1.borderColorPress,
|
|
240
|
+
borderColorFocus: weaker1.borderColorFocus
|
|
241
|
+
};
|
|
242
|
+
return {
|
|
243
|
+
Card: weaker1,
|
|
244
|
+
Button: weaker2,
|
|
245
|
+
Checkbox: weaker2,
|
|
246
|
+
DrawerFrame: weaker1,
|
|
247
|
+
SliderTrack: stronger1,
|
|
248
|
+
SliderTrackActive: weaker2,
|
|
249
|
+
SliderThumb: inverse1,
|
|
250
|
+
Progress: weaker1,
|
|
251
|
+
ProgressIndicator: inverse,
|
|
252
|
+
Switch: weaker2,
|
|
253
|
+
SwitchThumb: inverse2,
|
|
254
|
+
TooltipArrow: weaker1,
|
|
255
|
+
TooltipContent: weaker2,
|
|
256
|
+
Input: strongerBorderLighterBackground,
|
|
257
|
+
TextArea: strongerBorderLighterBackground,
|
|
258
|
+
Tooltip: inverse1
|
|
259
|
+
};
|
|
260
|
+
}
|
|
245
261
|
const themes = {
|
|
246
262
|
...allThemes,
|
|
247
263
|
// bring back the full type, the rest use a subset to avoid clogging up ts,
|
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 {\n MaskOptions,\n addChildren,\n applyMask,\n createStrengthenMask,\n createTheme,\n createWeakenMask,\n} from '@tamagui/create-theme'\n\nimport { colorTokens, darkColors, lightColors } from './tokens'\n\ntype ColorName = keyof typeof colorTokens.dark\n\nconst lightTransparent = 'rgba(255,255,255,0)'\nconst darkTransparent = 'rgba(10,10,10,0)'\n\n// background => foreground\nconst palettes = {\n dark: [\n darkTransparent,\n '#050505',\n '#151515',\n '#191919',\n '#232323',\n '#282828',\n '#323232',\n '#424242',\n '#494949',\n '#545454',\n '#626262',\n '#a5a5a5',\n '#fff',\n lightTransparent,\n ],\n light: [\n lightTransparent,\n '#fff',\n '#f9f9f9',\n 'hsl(0, 0%, 97.3%)',\n 'hsl(0, 0%, 95.1%)',\n 'hsl(0, 0%, 94.0%)',\n 'hsl(0, 0%, 92.0%)',\n 'hsl(0, 0%, 89.5%)',\n 'hsl(0, 0%, 81.0%)',\n 'hsl(0, 0%, 56.1%)',\n 'hsl(0, 0%, 50.3%)',\n 'hsl(0, 0%, 42.5%)',\n 'hsl(0, 0%, 9.0%)',\n darkTransparent,\n ],\n}\n\nconst templateColors = {\n color1: 1,\n color2: 2,\n color3: 3,\n color4: 4,\n color5: 5,\n color6: 6,\n color7: 7,\n color8: 8,\n color9: 9,\n color10: 10,\n color11: 11,\n color12: 12,\n}\n\nconst templateShadows = {\n shadowColor: 1,\n shadowColorHover: 1,\n shadowColorPress: 2,\n shadowColorFocus: 2,\n}\n\n// we can use subset of our template as a \"
|
|
5
|
-
"mappings": "AAAA;AAAA,EAEE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,aAAa,YAAY,mBAAmB;AAIrD,MAAM,mBAAmB;AACzB,MAAM,kBAAkB;AAGxB,MAAM,WAAW;AAAA,EACf,MAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAEA,MAAM,iBAAiB;AAAA,EACrB,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AACX;AAEA,MAAM,kBAAkB;AAAA,EACtB,aAAa;AAAA,EACb,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,kBAAkB;AACpB;
|
|
6
|
-
"names": [
|
|
4
|
+
"sourcesContent": ["import {\n MaskOptions,\n addChildren,\n applyMask,\n createStrengthenMask,\n createTheme,\n createWeakenMask,\n skipMask,\n} from '@tamagui/create-theme'\n\nimport { colorTokens, darkColors, lightColors } from './tokens'\n\ntype ColorName = keyof typeof colorTokens.dark\n\nconst lightTransparent = 'rgba(255,255,255,0)'\nconst darkTransparent = 'rgba(10,10,10,0)'\n\n// background => foreground\nconst palettes = {\n dark: [\n darkTransparent,\n '#050505',\n '#151515',\n '#191919',\n '#232323',\n '#282828',\n '#323232',\n '#424242',\n '#494949',\n '#545454',\n '#626262',\n '#a5a5a5',\n '#fff',\n lightTransparent,\n ],\n light: [\n lightTransparent,\n '#fff',\n '#f9f9f9',\n 'hsl(0, 0%, 97.3%)',\n 'hsl(0, 0%, 95.1%)',\n 'hsl(0, 0%, 94.0%)',\n 'hsl(0, 0%, 92.0%)',\n 'hsl(0, 0%, 89.5%)',\n 'hsl(0, 0%, 81.0%)',\n 'hsl(0, 0%, 56.1%)',\n 'hsl(0, 0%, 50.3%)',\n 'hsl(0, 0%, 42.5%)',\n 'hsl(0, 0%, 9.0%)',\n darkTransparent,\n ],\n}\n\nconst templateColors = {\n color1: 1,\n color2: 2,\n color3: 3,\n color4: 4,\n color5: 5,\n color6: 6,\n color7: 7,\n color8: 8,\n color9: 9,\n color10: 10,\n color11: 11,\n color12: 12,\n}\n\nconst templateShadows = {\n shadowColor: 1,\n shadowColorHover: 1,\n shadowColorPress: 2,\n shadowColorFocus: 2,\n}\n\n// we can use subset of our template as a \"override\" so it doesn't get adjusted with masks\n// we want to skip over templateColor + templateShadows\nconst toSkip = {\n ...templateColors,\n ...templateShadows,\n}\n\nconst override = Object.fromEntries(Object.entries(toSkip).map(([k]) => [k, 0]))\nconst overrideShadows = Object.fromEntries(\n Object.entries(templateShadows).map(([k]) => [k, 0])\n)\nconst overrideWithColors = {\n ...override,\n color: 0,\n colorHover: 0,\n colorFocus: 0,\n colorPress: 0,\n}\n\n// templates use the palette and specify index\n// negative goes backwards from end so -1 is the last item\nconst template = {\n ...toSkip,\n // the background, color, etc keys here work like generics - they make it so you\n // can publish components for others to use without mandating a specific color scale\n // the @tamagui/button Button component looks for `$background`, so you set the\n // dark_red_Button theme to have a stronger background than the dark_red theme.\n background: 2,\n backgroundHover: 3,\n backgroundPress: 1,\n backgroundFocus: 2,\n backgroundStrong: 1,\n backgroundTransparent: 0,\n color: -1,\n colorHover: -2,\n colorPress: -1,\n colorFocus: -2,\n colorTransparent: -0,\n borderColor: 4,\n borderColorHover: 5,\n borderColorPress: 3,\n borderColorFocus: 4,\n placeholderColor: -4,\n}\n\nconst lightShadowColor = 'rgba(0,0,0,0.02)'\nconst lightShadowColorStrong = 'rgba(0,0,0,0.066)'\nconst darkShadowColor = 'rgba(0,0,0,0.2)'\nconst darkShadowColorStrong = 'rgba(0,0,0,0.3)'\n\nconst lightShadows = {\n shadowColor: lightShadowColorStrong,\n shadowColorHover: lightShadowColorStrong,\n shadowColorPress: lightShadowColor,\n shadowColorFocus: lightShadowColor,\n}\n\nconst darkShadows = {\n shadowColor: darkShadowColorStrong,\n shadowColorHover: darkShadowColorStrong,\n shadowColorPress: darkShadowColor,\n shadowColorFocus: darkShadowColor,\n}\n\nconst lightTemplate = {\n ...template,\n // our light color palette is... a bit unique\n borderColor: 6,\n borderColorHover: 7,\n borderColorFocus: 5,\n borderColorPress: 6,\n ...lightShadows,\n}\n\nconst darkTemplate = { ...template, ...darkShadows }\n\nconst light = createTheme(palettes.light, lightTemplate)\nconst dark = createTheme(palettes.dark, darkTemplate)\n\ntype SubTheme = typeof light\n\nconst baseThemes: {\n light: SubTheme\n dark: SubTheme\n} = {\n light,\n dark,\n}\n\nconst masks = {\n skip: skipMask,\n weaker: createWeakenMask(),\n stronger: createStrengthenMask(),\n}\n\n// default mask options for most uses\nconst maskOptions: MaskOptions = {\n override,\n skip: toSkip,\n // avoids the transparent ends\n max: palettes.light.length - 2,\n min: 1,\n}\n\nconst transparent = (hsl: string, opacity = 0) =>\n hsl.replace(`%)`, `%, ${opacity})`).replace(`hsl(`, `hsla(`)\n\n// setup colorThemes and their inverses\nconst [lightColorThemes, darkColorThemes] = [colorTokens.light, colorTokens.dark].map(\n (colorSet, i) => {\n const isLight = i === 0\n const theme = baseThemes[isLight ? 'light' : 'dark']\n\n return Object.fromEntries(\n Object.keys(colorSet).map((color) => {\n const colorPalette = Object.values(colorSet[color]) as string[]\n // were re-ordering these\n const [head, tail] = [\n colorPalette.slice(0, 6),\n colorPalette.slice(colorPalette.length - 5),\n ]\n // add our transparent colors first/last\n // and make sure the last (foreground) color is white/black rather than colorful\n // this is mostly for consistency with the older theme-base\n const palette = [\n transparent(colorPalette[0]),\n ...head,\n ...tail,\n theme.color,\n transparent(colorPalette[colorPalette.length - 1]),\n ]\n\n const colorTheme = createTheme(\n palette,\n isLight\n ? {\n ...lightTemplate,\n // light color themes are a bit less sensitive\n borderColor: 4,\n borderColorHover: 5,\n borderColorFocus: 4,\n borderColorPress: 4,\n }\n : darkTemplate\n )\n\n return [color, colorTheme]\n })\n ) as Record<ColorName, SubTheme>\n }\n)\n\nconst allThemes = addChildren(baseThemes, (name, theme) => {\n const isLight = name === 'light'\n const inverseName = isLight ? 'dark' : 'light'\n const inverseTheme = baseThemes[inverseName]\n const colorThemes = isLight ? lightColorThemes : darkColorThemes\n const inverseColorThemes = isLight ? darkColorThemes : lightColorThemes\n\n const allColorThemes = addChildren(colorThemes, (colorName, colorTheme) => {\n const inverse = inverseColorThemes[colorName]\n return {\n ...getAltThemes(colorTheme, inverse, isLight),\n ...getComponentThemes(colorTheme, inverse, isLight),\n }\n })\n\n const baseSubThemes = {\n ...getAltThemes(theme, inverseTheme, isLight, inverseTheme),\n ...getComponentThemes(theme, inverseTheme, isLight),\n }\n\n return {\n ...baseSubThemes,\n ...allColorThemes,\n }\n})\n\nfunction getAltThemes(\n theme: SubTheme,\n inverse: SubTheme,\n isLight: boolean,\n activeTheme?: SubTheme\n) {\n const maskOptionsAlt = {\n ...maskOptions,\n override: overrideShadows,\n }\n const alt1 = applyMask(theme, masks.weaker, maskOptionsAlt)\n const alt2 = applyMask(alt1, masks.weaker, maskOptionsAlt)\n const active =\n activeTheme ??\n (process.env.ACTIVE_THEME_INVERSE\n ? inverse\n : applyMask(theme, masks.weaker, {\n ...maskOptions,\n strength: 4,\n }))\n\n return addChildren({ alt1, alt2, active }, (_, subTheme) => {\n return getComponentThemes(subTheme, subTheme === inverse ? theme : inverse, isLight)\n })\n}\n\nfunction getComponentThemes(theme: SubTheme, inverse: SubTheme, isLight: boolean) {\n const weaker1 = applyMask(theme, masks.weaker, maskOptions)\n const weaker2 = applyMask(weaker1, masks.weaker, {\n ...maskOptions,\n override: overrideWithColors,\n })\n const stronger1 = applyMask(theme, masks.stronger, maskOptions)\n const inverse1 = applyMask(inverse, masks.weaker, maskOptions)\n const inverse2 = applyMask(inverse1, masks.weaker, maskOptions)\n const strongerBorderLighterBackground: SubTheme = isLight\n ? {\n ...stronger1,\n borderColor: weaker1.borderColor,\n borderColorHover: weaker1.borderColorHover,\n borderColorPress: weaker1.borderColorPress,\n borderColorFocus: weaker1.borderColorFocus,\n }\n : {\n ...applyMask(theme, masks.skip, maskOptions),\n borderColor: weaker1.borderColor,\n borderColorHover: weaker1.borderColorHover,\n borderColorPress: weaker1.borderColorPress,\n borderColorFocus: weaker1.borderColorFocus,\n }\n\n return {\n Card: weaker1,\n Button: weaker2,\n Checkbox: weaker2,\n DrawerFrame: weaker1,\n SliderTrack: stronger1,\n SliderTrackActive: weaker2,\n SliderThumb: inverse1,\n Progress: weaker1,\n ProgressIndicator: inverse,\n Switch: weaker2,\n SwitchThumb: inverse2,\n TooltipArrow: weaker1,\n TooltipContent: weaker2,\n Input: strongerBorderLighterBackground,\n TextArea: strongerBorderLighterBackground,\n Tooltip: inverse1,\n }\n}\n\nexport const themes = {\n ...allThemes,\n // bring back the full type, the rest use a subset to avoid clogging up ts,\n // tamagui will be smart and use the top level themes as the type for useTheme() etc\n light: createTheme(palettes.light, lightTemplate, { nonInheritedValues: lightColors }),\n dark: createTheme(palettes.dark, darkTemplate, { nonInheritedValues: darkColors }),\n}\n\n// if (process.env.NODE_ENV === 'development') {\n// console.log(JSON.stringify(themes).length)\n// }\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|