@tamagui/theme-base 1.0.0-beta.9 → 1.0.1-beta.101
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/colorUtils.js +9 -10
- package/dist/cjs/colorUtils.js.map +1 -1
- package/dist/cjs/themes.js +162 -113
- package/dist/cjs/themes.js.map +2 -2
- package/dist/cjs/tokens.js +97 -26
- package/dist/cjs/tokens.js.map +2 -2
- package/dist/esm/colorUtils.js +10 -13
- package/dist/esm/colorUtils.js.map +1 -1
- package/dist/esm/themes.js +189 -129
- package/dist/esm/themes.js.map +2 -2
- package/dist/esm/tokens.js +130 -23
- package/dist/esm/tokens.js.map +2 -2
- package/dist/jsx/colorUtils.js +10 -11
- package/dist/jsx/colorUtils.js.map +7 -0
- package/dist/jsx/index.js +1 -0
- package/dist/jsx/index.js.map +7 -0
- package/dist/jsx/themes.js +170 -116
- package/dist/jsx/themes.js.map +7 -0
- package/dist/jsx/tokens.js +145 -23
- package/dist/jsx/tokens.js.map +7 -0
- package/package.json +8 -5
- package/src/colorUtils.tsx +42 -0
- package/src/index.tsx +3 -0
- package/src/themes.tsx +401 -0
- package/src/tokens.tsx +195 -0
- package/types/colorUtils.d.ts +0 -0
- package/types/colorUtils.d.ts.map +0 -0
- package/types/index.d.ts +0 -0
- package/types/index.d.ts.map +0 -0
- package/types/themes.d.ts +2063 -3320
- package/types/themes.d.ts.map +1 -1
- package/types/tokens.d.ts +531 -186
- package/types/tokens.d.ts.map +1 -1
package/dist/esm/tokens.js
CHANGED
|
@@ -1,15 +1,86 @@
|
|
|
1
1
|
var __defProp = Object.defineProperty;
|
|
2
|
-
var
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
2
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
3
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
4
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
5
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
6
|
+
var __spreadValues = (a, b) => {
|
|
7
|
+
for (var prop in b || (b = {}))
|
|
8
|
+
if (__hasOwnProp.call(b, prop))
|
|
9
|
+
__defNormalProp(a, prop, b[prop]);
|
|
10
|
+
if (__getOwnPropSymbols)
|
|
11
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
12
|
+
if (__propIsEnum.call(b, prop))
|
|
13
|
+
__defNormalProp(a, prop, b[prop]);
|
|
14
|
+
}
|
|
15
|
+
return a;
|
|
12
16
|
};
|
|
17
|
+
import {
|
|
18
|
+
blue,
|
|
19
|
+
blueDark,
|
|
20
|
+
gray,
|
|
21
|
+
grayA,
|
|
22
|
+
grayDark,
|
|
23
|
+
grayDarkA,
|
|
24
|
+
green,
|
|
25
|
+
greenDark,
|
|
26
|
+
orange,
|
|
27
|
+
orangeDark,
|
|
28
|
+
pink,
|
|
29
|
+
pinkDark,
|
|
30
|
+
purple,
|
|
31
|
+
purpleDark,
|
|
32
|
+
red,
|
|
33
|
+
redDark,
|
|
34
|
+
teal,
|
|
35
|
+
tealDark,
|
|
36
|
+
violet,
|
|
37
|
+
violetDark,
|
|
38
|
+
yellow,
|
|
39
|
+
yellowDark
|
|
40
|
+
} from "@tamagui/colors";
|
|
41
|
+
import { createTokens } from "@tamagui/core";
|
|
42
|
+
const size = {
|
|
43
|
+
0: 0,
|
|
44
|
+
0.25: 2,
|
|
45
|
+
0.5: 4,
|
|
46
|
+
0.75: 8,
|
|
47
|
+
1: 20,
|
|
48
|
+
1.5: 24,
|
|
49
|
+
2: 28,
|
|
50
|
+
2.5: 32,
|
|
51
|
+
3: 36,
|
|
52
|
+
3.5: 40,
|
|
53
|
+
4: 44,
|
|
54
|
+
true: 44,
|
|
55
|
+
4.5: 48,
|
|
56
|
+
5: 52,
|
|
57
|
+
5.5: 59,
|
|
58
|
+
6: 64,
|
|
59
|
+
6.5: 69,
|
|
60
|
+
7: 74,
|
|
61
|
+
7.6: 79,
|
|
62
|
+
8: 84,
|
|
63
|
+
8.5: 89,
|
|
64
|
+
9: 94,
|
|
65
|
+
9.5: 99,
|
|
66
|
+
10: 104,
|
|
67
|
+
11: 124,
|
|
68
|
+
12: 144,
|
|
69
|
+
13: 164,
|
|
70
|
+
14: 184,
|
|
71
|
+
15: 204,
|
|
72
|
+
16: 224,
|
|
73
|
+
17: 224,
|
|
74
|
+
18: 244,
|
|
75
|
+
19: 264,
|
|
76
|
+
20: 284
|
|
77
|
+
};
|
|
78
|
+
const spaces = Object.entries(size).map(([k, v]) => [
|
|
79
|
+
k,
|
|
80
|
+
Math.max(0, v <= 16 ? Math.round(v * 0.333) : Math.floor(v * 0.7 - 12))
|
|
81
|
+
]);
|
|
82
|
+
const spacesNegative = spaces.map(([k, v]) => [`-${k}`, -v]);
|
|
83
|
+
const space = __spreadValues(__spreadValues({}, Object.fromEntries(spaces)), Object.fromEntries(spacesNegative));
|
|
13
84
|
const zIndex = {
|
|
14
85
|
0: 0,
|
|
15
86
|
1: 100,
|
|
@@ -18,10 +89,40 @@ const zIndex = {
|
|
|
18
89
|
4: 400,
|
|
19
90
|
5: 500
|
|
20
91
|
};
|
|
21
|
-
const
|
|
22
|
-
|
|
23
|
-
|
|
92
|
+
const colorTokens = {
|
|
93
|
+
light: {
|
|
94
|
+
blue,
|
|
95
|
+
gray,
|
|
96
|
+
grayA,
|
|
97
|
+
green,
|
|
98
|
+
orange,
|
|
99
|
+
pink,
|
|
100
|
+
purple,
|
|
101
|
+
red,
|
|
102
|
+
violet,
|
|
103
|
+
yellow,
|
|
104
|
+
teal
|
|
105
|
+
},
|
|
106
|
+
dark: {
|
|
107
|
+
blue: blueDark,
|
|
108
|
+
gray: grayDark,
|
|
109
|
+
grayA: grayDarkA,
|
|
110
|
+
green: greenDark,
|
|
111
|
+
orange: orangeDark,
|
|
112
|
+
pink: pinkDark,
|
|
113
|
+
purple: purpleDark,
|
|
114
|
+
red: redDark,
|
|
115
|
+
violet: violetDark,
|
|
116
|
+
yellow: yellowDark,
|
|
117
|
+
teal: tealDark
|
|
118
|
+
}
|
|
24
119
|
};
|
|
120
|
+
const darkColors = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, colorTokens.dark.blue), colorTokens.dark.gray), colorTokens.dark.grayA), colorTokens.dark.green), colorTokens.dark.orange), colorTokens.dark.pink), colorTokens.dark.purple), colorTokens.dark.red), colorTokens.dark.violet), colorTokens.dark.yellow), colorTokens.dark.teal);
|
|
121
|
+
const lightColors = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, colorTokens.light.blue), colorTokens.light.gray), colorTokens.light.grayA), colorTokens.light.green), colorTokens.light.orange), colorTokens.light.pink), colorTokens.light.purple), colorTokens.light.red), colorTokens.light.violet), colorTokens.light.yellow), colorTokens.light.teal);
|
|
122
|
+
const allColors = __spreadValues(__spreadValues({}, postfixObjKeys(lightColors, "Light")), postfixObjKeys(darkColors, "Dark"));
|
|
123
|
+
function postfixObjKeys(obj, postfix) {
|
|
124
|
+
return Object.fromEntries(Object.entries(obj).map(([k, v]) => [`${k}${postfix}`, v]));
|
|
125
|
+
}
|
|
25
126
|
const radius = {
|
|
26
127
|
0: 0,
|
|
27
128
|
1: 3,
|
|
@@ -29,18 +130,24 @@ const radius = {
|
|
|
29
130
|
3: 7,
|
|
30
131
|
4: 9,
|
|
31
132
|
5: 10,
|
|
32
|
-
6:
|
|
33
|
-
7:
|
|
34
|
-
8:
|
|
35
|
-
9:
|
|
133
|
+
6: 16,
|
|
134
|
+
7: 19,
|
|
135
|
+
8: 22,
|
|
136
|
+
9: 26,
|
|
137
|
+
10: 34,
|
|
138
|
+
11: 42,
|
|
139
|
+
12: 50
|
|
36
140
|
};
|
|
37
|
-
|
|
38
|
-
color,
|
|
39
|
-
getSizeAt,
|
|
141
|
+
const tokens = createTokens({
|
|
142
|
+
color: allColors,
|
|
40
143
|
radius,
|
|
41
|
-
|
|
42
|
-
sizeKeys,
|
|
144
|
+
zIndex,
|
|
43
145
|
space,
|
|
44
|
-
|
|
146
|
+
size
|
|
147
|
+
});
|
|
148
|
+
export {
|
|
149
|
+
darkColors,
|
|
150
|
+
lightColors,
|
|
151
|
+
tokens
|
|
45
152
|
};
|
|
46
153
|
//# sourceMappingURL=tokens.js.map
|
package/dist/esm/tokens.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/tokens.tsx"],
|
|
4
|
-
"sourcesContent": ["import {
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import {\n blue,\n blueDark,\n gray,\n grayA,\n grayDark,\n grayDarkA,\n green,\n greenDark,\n orange,\n orangeDark,\n pink,\n pinkDark,\n purple,\n purpleDark,\n red,\n redDark,\n teal,\n tealDark,\n violet,\n violetDark,\n yellow,\n yellowDark,\n} from '@tamagui/colors'\nimport { Variable, createTokens } from '@tamagui/core'\n\n// should roughly map to button/input etc height at each level\n// fonts should match that height/lineHeight at each stop\n// so these are really non-linear on purpose\n// why?\n// - at sizes <1, used for fine grained things (borders, smallest paddingY)\n// - so smallest padY should be roughly 1-4px so it can join with lineHeight\n// - at sizes >=1, have to consider \"pressability\" (jumps up)\n// - after that it should go upwards somewhat naturally\n// - H1 / headings top out at 10 naturally, so after 10 we can go upwards faster\n// but also one more wrinkle...\n// space is used in conjunction with size\n// i'm setting space to generally just a fixed fraction of size (~1/3-2/3 still fine tuning)\nconst size = {\n 0: 0,\n 0.25: 2,\n 0.5: 4,\n 0.75: 8,\n 1: 20,\n 1.5: 24,\n 2: 28,\n 2.5: 32,\n 3: 36,\n 3.5: 40,\n 4: 44,\n true: 44,\n 4.5: 48,\n 5: 52,\n 5.5: 59,\n 6: 64,\n 6.5: 69,\n 7: 74,\n 7.6: 79,\n 8: 84,\n 8.5: 89,\n 9: 94,\n 9.5: 99,\n 10: 104,\n 11: 124,\n 12: 144,\n 13: 164,\n 14: 184,\n 15: 204,\n 16: 224,\n 17: 224,\n 18: 244,\n 19: 264,\n 20: 284,\n}\n\ntype Sizes = typeof size\ntype SizeKeys = `${keyof Sizes}`\n\nconst spaces = Object.entries(size).map(([k, v]) => [\n k,\n Math.max(0, v <= 16 ? Math.round(v * 0.333) : Math.floor(v * 0.7 - 12)),\n])\n\nconst spacesNegative = spaces.map(([k, v]) => [`-${k}`, -v])\n\nconst space: {\n [Key in `-${SizeKeys}` | SizeKeys]: Key extends keyof Sizes ? Sizes[Key] : number\n} = {\n ...Object.fromEntries(spaces),\n ...Object.fromEntries(spacesNegative),\n} as any\n\nconst zIndex = {\n 0: 0,\n 1: 100,\n 2: 200,\n 3: 300,\n 4: 400,\n 5: 500,\n}\n\nconst colorTokens = {\n light: {\n blue: blue,\n gray: gray,\n grayA: grayA,\n green: green,\n orange: orange,\n pink: pink,\n purple: purple,\n red: red,\n violet: violet,\n yellow: yellow,\n teal: teal,\n },\n dark: {\n blue: blueDark,\n gray: grayDark,\n grayA: grayDarkA,\n green: greenDark,\n orange: orangeDark,\n pink: pinkDark,\n purple: purpleDark,\n red: redDark,\n violet: violetDark,\n yellow: yellowDark,\n teal: tealDark,\n },\n}\n\nexport const darkColors = {\n ...colorTokens.dark.blue,\n ...colorTokens.dark.gray,\n ...colorTokens.dark.grayA,\n ...colorTokens.dark.green,\n ...colorTokens.dark.orange,\n ...colorTokens.dark.pink,\n ...colorTokens.dark.purple,\n ...colorTokens.dark.red,\n ...colorTokens.dark.violet,\n ...colorTokens.dark.yellow,\n ...colorTokens.dark.teal,\n}\n\nexport const lightColors = {\n ...colorTokens.light.blue,\n ...colorTokens.light.gray,\n ...colorTokens.light.grayA,\n ...colorTokens.light.green,\n ...colorTokens.light.orange,\n ...colorTokens.light.pink,\n ...colorTokens.light.purple,\n ...colorTokens.light.red,\n ...colorTokens.light.violet,\n ...colorTokens.light.yellow,\n ...colorTokens.light.teal,\n}\n\nconst allColors = {\n ...postfixObjKeys(lightColors, 'Light'),\n ...postfixObjKeys(darkColors, 'Dark'),\n}\n\nfunction postfixObjKeys<A extends { [key: string]: Variable<string> | string }, B extends string>(\n obj: A,\n postfix: B\n): {\n [Key in `${keyof A extends string ? keyof A : never}${B}`]: Variable<string> | string\n} {\n return Object.fromEntries(Object.entries(obj).map(([k, v]) => [`${k}${postfix}`, v])) as any\n}\n\nconst radius = {\n 0: 0,\n 1: 3,\n 2: 5,\n 3: 7,\n 4: 9,\n 5: 10,\n 6: 16,\n 7: 19,\n 8: 22,\n 9: 26,\n 10: 34,\n 11: 42,\n 12: 50,\n}\n\nexport const tokens = createTokens({\n color: allColors,\n radius,\n zIndex,\n space,\n size,\n})\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/jsx/colorUtils.js
CHANGED
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
3
1
|
import { getVariableValue } from "@tamagui/core";
|
|
4
|
-
const hexToRGBA =
|
|
2
|
+
const hexToRGBA = (hex, alpha = 1) => {
|
|
5
3
|
var _a;
|
|
6
4
|
if (!isValidHex(hex)) {
|
|
7
5
|
throw new Error("Invalid HEX");
|
|
@@ -10,8 +8,8 @@ const hexToRGBA = /* @__PURE__ */ __name((hex, alpha = 1) => {
|
|
|
10
8
|
const hexArr = getChunksFromString(hex.slice(1), chunkSize);
|
|
11
9
|
const [r, g, b, a] = (_a = hexArr == null ? void 0 : hexArr.map(convertHexUnitTo256)) != null ? _a : [];
|
|
12
10
|
return `rgba(${r}, ${g}, ${b}, ${getAlphaFloat(a, alpha)})`;
|
|
13
|
-
}
|
|
14
|
-
const setColorAlpha =
|
|
11
|
+
};
|
|
12
|
+
const setColorAlpha = (colorIn, alpha = 1) => {
|
|
15
13
|
let color = `${getVariableValue(colorIn)}`;
|
|
16
14
|
if (color.startsWith("hsl(")) {
|
|
17
15
|
return color.replace("hsl", "hsla").replace(")", `, ${alpha})`);
|
|
@@ -23,11 +21,11 @@ const setColorAlpha = /* @__PURE__ */ __name((colorIn, alpha = 1) => {
|
|
|
23
21
|
return color.replace("rgb", "rgba").replace(")", `, ${alpha})`);
|
|
24
22
|
}
|
|
25
23
|
return color;
|
|
26
|
-
}
|
|
27
|
-
const isValidHex =
|
|
28
|
-
const getChunksFromString =
|
|
29
|
-
const convertHexUnitTo256 =
|
|
30
|
-
const getAlphaFloat =
|
|
24
|
+
};
|
|
25
|
+
const isValidHex = (hex) => /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex);
|
|
26
|
+
const getChunksFromString = (st, chunkSize = 0) => st.match(new RegExp(`.{${chunkSize}}`, "g"));
|
|
27
|
+
const convertHexUnitTo256 = (hexStr) => parseInt(hexStr.repeat(2 / hexStr.length), 16);
|
|
28
|
+
const getAlphaFloat = (a, alpha = 1) => {
|
|
31
29
|
if (a !== void 0) {
|
|
32
30
|
return a / 255;
|
|
33
31
|
}
|
|
@@ -35,8 +33,9 @@ const getAlphaFloat = /* @__PURE__ */ __name((a, alpha = 1) => {
|
|
|
35
33
|
return 1;
|
|
36
34
|
}
|
|
37
35
|
return alpha;
|
|
38
|
-
}
|
|
36
|
+
};
|
|
39
37
|
export {
|
|
40
38
|
hexToRGBA,
|
|
41
39
|
setColorAlpha
|
|
42
40
|
};
|
|
41
|
+
//# sourceMappingURL=colorUtils.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/colorUtils.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Variable, getVariableValue } from '@tamagui/core'\n\nexport const hexToRGBA = (hex: string, alpha = 1) => {\n if (!isValidHex(hex)) {\n throw new Error('Invalid HEX')\n }\n const chunkSize = Math.floor((hex.length - 1) / 3)\n const hexArr = getChunksFromString(hex.slice(1), chunkSize)\n const [r, g, b, a] = hexArr?.map(convertHexUnitTo256) ?? []\n return `rgba(${r}, ${g}, ${b}, ${getAlphaFloat(a, alpha)})`\n}\n\nexport const setColorAlpha = (colorIn: string | Variable, alpha = 1) => {\n let color = `${getVariableValue(colorIn)}`\n if (color.startsWith('hsl(')) {\n return color.replace('hsl', 'hsla').replace(')', `, ${alpha})`)\n }\n if (color.startsWith('#')) {\n return hexToRGBA(color, alpha)\n }\n if (color.startsWith('rgb(')) {\n return color.replace('rgb', 'rgba').replace(')', `, ${alpha})`)\n }\n return color\n}\n\nconst isValidHex = (hex: string) => /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex)\n\nconst getChunksFromString = (st: string, chunkSize = 0) =>\n st.match(new RegExp(`.{${chunkSize}}`, 'g'))\n\nconst convertHexUnitTo256 = (hexStr: string) => parseInt(hexStr.repeat(2 / hexStr.length), 16)\n\nconst getAlphaFloat = (a: any, alpha = 1) => {\n if (a !== undefined) {\n return a / 255\n }\n if (typeof alpha != 'number' || alpha < 0 || alpha > 1) {\n return 1\n }\n return alpha\n}\n"],
|
|
5
|
+
"mappings": "AAAA;AAEO,MAAM,YAAY,CAAC,KAAa,QAAQ,MAAM;AAFrD;AAGE,MAAI,CAAC,WAAW,GAAG,GAAG;AACpB,UAAM,IAAI,MAAM,aAAa;AAAA,EAC/B;AACA,QAAM,YAAY,KAAK,MAAO,KAAI,SAAS,KAAK,CAAC;AACjD,QAAM,SAAS,oBAAoB,IAAI,MAAM,CAAC,GAAG,SAAS;AAC1D,QAAM,CAAC,GAAG,GAAG,GAAG,KAAK,uCAAQ,IAAI,yBAAZ,YAAoC,CAAC;AAC1D,SAAO,QAAQ,MAAM,MAAM,MAAM,cAAc,GAAG,KAAK;AACzD;AAEO,MAAM,gBAAgB,CAAC,SAA4B,QAAQ,MAAM;AACtE,MAAI,QAAQ,GAAG,iBAAiB,OAAO;AACvC,MAAI,MAAM,WAAW,MAAM,GAAG;AAC5B,WAAO,MAAM,QAAQ,OAAO,MAAM,EAAE,QAAQ,KAAK,KAAK,QAAQ;AAAA,EAChE;AACA,MAAI,MAAM,WAAW,GAAG,GAAG;AACzB,WAAO,UAAU,OAAO,KAAK;AAAA,EAC/B;AACA,MAAI,MAAM,WAAW,MAAM,GAAG;AAC5B,WAAO,MAAM,QAAQ,OAAO,MAAM,EAAE,QAAQ,KAAK,KAAK,QAAQ;AAAA,EAChE;AACA,SAAO;AACT;AAEA,MAAM,aAAa,CAAC,QAAgB,6BAA6B,KAAK,GAAG;AAEzE,MAAM,sBAAsB,CAAC,IAAY,YAAY,MACnD,GAAG,MAAM,IAAI,OAAO,KAAK,cAAc,GAAG,CAAC;AAE7C,MAAM,sBAAsB,CAAC,WAAmB,SAAS,OAAO,OAAO,IAAI,OAAO,MAAM,GAAG,EAAE;AAE7F,MAAM,gBAAgB,CAAC,GAAQ,QAAQ,MAAM;AAC3C,MAAI,MAAM,QAAW;AACnB,WAAO,IAAI;AAAA,EACb;AACA,MAAI,OAAO,SAAS,YAAY,QAAQ,KAAK,QAAQ,GAAG;AACtD,WAAO;AAAA,EACT;AACA,SAAO;AACT;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/dist/jsx/index.js
CHANGED