@tamagui/config-base 1.0.1-rc.0.4 → 1.0.1-rc.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/media.js +12 -1
- package/dist/cjs/media.js.map +2 -2
- package/dist/cjs/tamagui.config.js +1 -5
- package/dist/cjs/tamagui.config.js.map +2 -2
- package/dist/esm/media.js +11 -1
- package/dist/esm/media.js.map +2 -2
- package/dist/esm/tamagui.config.js +2 -6
- package/dist/esm/tamagui.config.js.map +2 -2
- package/package.json +10 -10
- package/src/media.ts +15 -1
- package/src/tamagui.config.ts +2 -6
- package/types/media.d.ts +8 -0
package/dist/cjs/media.js
CHANGED
|
@@ -20,12 +20,14 @@ var media_exports = {};
|
|
|
20
20
|
__export(media_exports, {
|
|
21
21
|
demoMedia: () => demoMedia,
|
|
22
22
|
media: () => media,
|
|
23
|
+
mediaQueryDefaultActive: () => mediaQueryDefaultActive,
|
|
23
24
|
widths: () => widths
|
|
24
25
|
});
|
|
25
26
|
module.exports = __toCommonJS(media_exports);
|
|
27
|
+
var import_react_native_media_driver = require("@tamagui/react-native-media-driver");
|
|
26
28
|
const demoMedia = [500, 620, 780, 900];
|
|
27
29
|
const widths = [660, 800, 1020, 1280];
|
|
28
|
-
const media = {
|
|
30
|
+
const media = (0, import_react_native_media_driver.createMedia)({
|
|
29
31
|
xl: { maxWidth: 1650 },
|
|
30
32
|
lg: { maxWidth: 1280 },
|
|
31
33
|
md: { maxWidth: 1020 },
|
|
@@ -37,11 +39,20 @@ const media = {
|
|
|
37
39
|
gtMd: { minWidth: 1020 + 1 },
|
|
38
40
|
gtLg: { minWidth: 1280 + 1 },
|
|
39
41
|
gtXl: { minWidth: 1650 + 1 }
|
|
42
|
+
});
|
|
43
|
+
const mediaQueryDefaultActive = {
|
|
44
|
+
xl: true,
|
|
45
|
+
lg: true,
|
|
46
|
+
md: true,
|
|
47
|
+
sm: true,
|
|
48
|
+
xs: true,
|
|
49
|
+
xxs: false
|
|
40
50
|
};
|
|
41
51
|
// Annotate the CommonJS export names for ESM import in node:
|
|
42
52
|
0 && (module.exports = {
|
|
43
53
|
demoMedia,
|
|
44
54
|
media,
|
|
55
|
+
mediaQueryDefaultActive,
|
|
45
56
|
widths
|
|
46
57
|
});
|
|
47
58
|
//# sourceMappingURL=media.js.map
|
package/dist/cjs/media.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/media.ts"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import { createMedia } from '@tamagui/react-native-media-driver'\n\nexport const demoMedia = [500, 620, 780, 900]\nexport const widths = [660, 800, 1020, 1280]\n\nexport const media = createMedia({\n // for site\n xl: { maxWidth: 1650 },\n lg: { maxWidth: 1280 },\n md: { maxWidth: 1020 },\n sm: { maxWidth: 800 },\n xs: { maxWidth: 660 },\n xxs: { maxWidth: 390 },\n gtXs: { minWidth: 660 + 1 },\n gtSm: { minWidth: 800 + 1 },\n gtMd: { minWidth: 1020 + 1 },\n gtLg: { minWidth: 1280 + 1 },\n gtXl: { minWidth: 1650 + 1 },\n})\n\n// note all the non \"gt\" ones should be true to start to match mobile-first\n// were aiming for \"xs\" to be the default to \"gtXs\" true too\nexport const mediaQueryDefaultActive = {\n xl: true,\n lg: true,\n md: true,\n sm: true,\n xs: true,\n // false\n xxs: false,\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uCAA4B;AAErB,MAAM,YAAY,CAAC,KAAK,KAAK,KAAK,GAAG;AACrC,MAAM,SAAS,CAAC,KAAK,KAAK,MAAM,IAAI;AAEpC,MAAM,YAAQ,8CAAY;AAAA,EAE/B,IAAI,EAAE,UAAU,KAAK;AAAA,EACrB,IAAI,EAAE,UAAU,KAAK;AAAA,EACrB,IAAI,EAAE,UAAU,KAAK;AAAA,EACrB,IAAI,EAAE,UAAU,IAAI;AAAA,EACpB,IAAI,EAAE,UAAU,IAAI;AAAA,EACpB,KAAK,EAAE,UAAU,IAAI;AAAA,EACrB,MAAM,EAAE,UAAU,MAAM,EAAE;AAAA,EAC1B,MAAM,EAAE,UAAU,MAAM,EAAE;AAAA,EAC1B,MAAM,EAAE,UAAU,OAAO,EAAE;AAAA,EAC3B,MAAM,EAAE,UAAU,OAAO,EAAE;AAAA,EAC3B,MAAM,EAAE,UAAU,OAAO,EAAE;AAC7B,CAAC;AAIM,MAAM,0BAA0B;AAAA,EACrC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EAEJ,KAAK;AACP;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -126,11 +126,7 @@ const config = {
|
|
|
126
126
|
silkscreen: silkscreenFont
|
|
127
127
|
}
|
|
128
128
|
};
|
|
129
|
-
config.mediaQueryDefaultActive =
|
|
130
|
-
xxs: true,
|
|
131
|
-
xs: true,
|
|
132
|
-
sm: true
|
|
133
|
-
};
|
|
129
|
+
config.mediaQueryDefaultActive = import_media.mediaQueryDefaultActive;
|
|
134
130
|
// Annotate the CommonJS export names for ESM import in node:
|
|
135
131
|
0 && (module.exports = {
|
|
136
132
|
config
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/tamagui.config.ts"],
|
|
4
|
-
"sourcesContent": ["import { createInterFont } from '@tamagui/font-inter'\nimport { createSilkscreenFont } from '@tamagui/font-silkscreen'\nimport { shorthands } from '@tamagui/shorthands'\nimport { themes, tokens } from '@tamagui/theme-base'\n\nimport { animations } from './animations'\nimport { createGenericFont } from './createGenericFont'\nimport { media } from './media'\n\nexport * from './animations'\n\nconst systemFamily =\n process.env.TAMAGUI_TARGET === 'native'\n ? 'Inter'\n : '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"'\n\nconst silkscreenFont = createSilkscreenFont()\nconst headingFont = createInterFont(\n {\n size: {\n 5: 13,\n 6: 15,\n },\n transform: {\n 6: 'uppercase',\n 7: 'none',\n },\n weight: {\n 6: '400',\n 7: '700',\n },\n color: {\n 6: '$colorFocus',\n 7: '$color',\n },\n letterSpacing: {\n 5: 2,\n 6: 1,\n 7: 0,\n 8: 0,\n 9: -1,\n 10: -1.5,\n 12: -2,\n 14: -3,\n 15: -4,\n },\n // for native\n face: {\n 700: { normal: 'InterBold' },\n 800: { normal: 'InterBold' },\n 900: { normal: 'InterBold' },\n },\n },\n { sizeLineHeight: (size) => Math.round(size * 1.1 + (size < 30 ? 10 : 5)) }\n)\nconst bodyFont = createInterFont(\n {\n family: systemFamily,\n weight: {\n 1: '500',\n 7: '600',\n },\n },\n {\n sizeSize: (size) => Math.round(size),\n sizeLineHeight: (size) => Math.round(size * 1.1 + (size >= 12 ? 8 : 4)),\n }\n)\n\nconst monoFont = createGenericFont(\n `\"ui-monospace\", \"SFMono-Regular\", \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace`,\n {\n weight: {\n 1: '500',\n },\n size: {\n 1: 11,\n 2: 12,\n 3: 13,\n 4: 14,\n 5: 16,\n 6: 18,\n 7: 20,\n 8: 22,\n 9: 30,\n 10: 42,\n 11: 52,\n 12: 62,\n 13: 72,\n 14: 92,\n 15: 114,\n 16: 124,\n },\n },\n {\n sizeLineHeight: (x) => x * 1.5,\n }\n)\n\nexport const config = {\n shouldAddPrefersColorThemes: true,\n themeClassNameOnRoot: true,\n animations,\n media,\n shorthands,\n themes,\n tokens,\n fonts: {\n // noto: notoFont as any,\n heading: headingFont,\n body: bodyFont,\n mono: monoFont,\n silkscreen: silkscreenFont,\n },\n}\n\n// @ts-ignore bad types\nconfig.mediaQueryDefaultActive =
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAgC;AAChC,6BAAqC;AACrC,wBAA2B;AAC3B,wBAA+B;AAE/B,wBAA2B;AAC3B,+BAAkC;AAClC,
|
|
4
|
+
"sourcesContent": ["import { createInterFont } from '@tamagui/font-inter'\nimport { createSilkscreenFont } from '@tamagui/font-silkscreen'\nimport { shorthands } from '@tamagui/shorthands'\nimport { themes, tokens } from '@tamagui/theme-base'\n\nimport { animations } from './animations'\nimport { createGenericFont } from './createGenericFont'\nimport { media, mediaQueryDefaultActive } from './media'\n\nexport * from './animations'\n\nconst systemFamily =\n process.env.TAMAGUI_TARGET === 'native'\n ? 'Inter'\n : '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"'\n\nconst silkscreenFont = createSilkscreenFont()\nconst headingFont = createInterFont(\n {\n size: {\n 5: 13,\n 6: 15,\n },\n transform: {\n 6: 'uppercase',\n 7: 'none',\n },\n weight: {\n 6: '400',\n 7: '700',\n },\n color: {\n 6: '$colorFocus',\n 7: '$color',\n },\n letterSpacing: {\n 5: 2,\n 6: 1,\n 7: 0,\n 8: 0,\n 9: -1,\n 10: -1.5,\n 12: -2,\n 14: -3,\n 15: -4,\n },\n // for native\n face: {\n 700: { normal: 'InterBold' },\n 800: { normal: 'InterBold' },\n 900: { normal: 'InterBold' },\n },\n },\n { sizeLineHeight: (size) => Math.round(size * 1.1 + (size < 30 ? 10 : 5)) }\n)\nconst bodyFont = createInterFont(\n {\n family: systemFamily,\n weight: {\n 1: '500',\n 7: '600',\n },\n },\n {\n sizeSize: (size) => Math.round(size),\n sizeLineHeight: (size) => Math.round(size * 1.1 + (size >= 12 ? 8 : 4)),\n }\n)\n\nconst monoFont = createGenericFont(\n `\"ui-monospace\", \"SFMono-Regular\", \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace`,\n {\n weight: {\n 1: '500',\n },\n size: {\n 1: 11,\n 2: 12,\n 3: 13,\n 4: 14,\n 5: 16,\n 6: 18,\n 7: 20,\n 8: 22,\n 9: 30,\n 10: 42,\n 11: 52,\n 12: 62,\n 13: 72,\n 14: 92,\n 15: 114,\n 16: 124,\n },\n },\n {\n sizeLineHeight: (x) => x * 1.5,\n }\n)\n\nexport const config = {\n shouldAddPrefersColorThemes: true,\n themeClassNameOnRoot: true,\n animations,\n media,\n shorthands,\n themes,\n tokens,\n fonts: {\n // noto: notoFont as any,\n heading: headingFont,\n body: bodyFont,\n mono: monoFont,\n silkscreen: silkscreenFont,\n },\n}\n\n// @ts-ignore bad types\nconfig.mediaQueryDefaultActive = mediaQueryDefaultActive\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAAgC;AAChC,6BAAqC;AACrC,wBAA2B;AAC3B,wBAA+B;AAE/B,wBAA2B;AAC3B,+BAAkC;AAClC,mBAA+C;AAE/C,mCAAc,yBATd;AAWA,MAAM,eACJ,QAAQ,IAAI,mBAAmB,WAC3B,UACA;AAEN,MAAM,qBAAiB,6CAAqB;AAC5C,MAAM,kBAAc;AAAA,EAClB;AAAA,IACE,MAAM;AAAA,MACJ,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IACA,WAAW;AAAA,MACT,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IACA,QAAQ;AAAA,MACN,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IACA,OAAO;AAAA,MACL,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IACA,eAAe;AAAA,MACb,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,IAEA,MAAM;AAAA,MACJ,KAAK,EAAE,QAAQ,YAAY;AAAA,MAC3B,KAAK,EAAE,QAAQ,YAAY;AAAA,MAC3B,KAAK,EAAE,QAAQ,YAAY;AAAA,IAC7B;AAAA,EACF;AAAA,EACA,EAAE,gBAAgB,CAAC,SAAS,KAAK,MAAM,OAAO,OAAO,OAAO,KAAK,KAAK,EAAE,EAAE;AAC5E;AACA,MAAM,eAAW;AAAA,EACf;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,MACN,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,EACF;AAAA,EACA;AAAA,IACE,UAAU,CAAC,SAAS,KAAK,MAAM,IAAI;AAAA,IACnC,gBAAgB,CAAC,SAAS,KAAK,MAAM,OAAO,OAAO,QAAQ,KAAK,IAAI,EAAE;AAAA,EACxE;AACF;AAEA,MAAM,eAAW;AAAA,EACf;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,MACN,GAAG;AAAA,IACL;AAAA,IACA,MAAM;AAAA,MACJ,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,EACF;AAAA,EACA;AAAA,IACE,gBAAgB,CAAC,MAAM,IAAI;AAAA,EAC7B;AACF;AAEO,MAAM,SAAS;AAAA,EACpB,6BAA6B;AAAA,EAC7B,sBAAsB;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,IAEL,SAAS;AAAA,IACT,MAAM;AAAA,IACN,MAAM;AAAA,IACN,YAAY;AAAA,EACd;AACF;AAGA,OAAO,0BAA0B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/media.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { createMedia } from "@tamagui/react-native-media-driver";
|
|
1
2
|
const demoMedia = [500, 620, 780, 900];
|
|
2
3
|
const widths = [660, 800, 1020, 1280];
|
|
3
|
-
const media = {
|
|
4
|
+
const media = createMedia({
|
|
4
5
|
xl: { maxWidth: 1650 },
|
|
5
6
|
lg: { maxWidth: 1280 },
|
|
6
7
|
md: { maxWidth: 1020 },
|
|
@@ -12,10 +13,19 @@ const media = {
|
|
|
12
13
|
gtMd: { minWidth: 1020 + 1 },
|
|
13
14
|
gtLg: { minWidth: 1280 + 1 },
|
|
14
15
|
gtXl: { minWidth: 1650 + 1 }
|
|
16
|
+
});
|
|
17
|
+
const mediaQueryDefaultActive = {
|
|
18
|
+
xl: true,
|
|
19
|
+
lg: true,
|
|
20
|
+
md: true,
|
|
21
|
+
sm: true,
|
|
22
|
+
xs: true,
|
|
23
|
+
xxs: false
|
|
15
24
|
};
|
|
16
25
|
export {
|
|
17
26
|
demoMedia,
|
|
18
27
|
media,
|
|
28
|
+
mediaQueryDefaultActive,
|
|
19
29
|
widths
|
|
20
30
|
};
|
|
21
31
|
//# sourceMappingURL=media.js.map
|
package/dist/esm/media.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/media.ts"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { createMedia } from '@tamagui/react-native-media-driver'\n\nexport const demoMedia = [500, 620, 780, 900]\nexport const widths = [660, 800, 1020, 1280]\n\nexport const media = createMedia({\n // for site\n xl: { maxWidth: 1650 },\n lg: { maxWidth: 1280 },\n md: { maxWidth: 1020 },\n sm: { maxWidth: 800 },\n xs: { maxWidth: 660 },\n xxs: { maxWidth: 390 },\n gtXs: { minWidth: 660 + 1 },\n gtSm: { minWidth: 800 + 1 },\n gtMd: { minWidth: 1020 + 1 },\n gtLg: { minWidth: 1280 + 1 },\n gtXl: { minWidth: 1650 + 1 },\n})\n\n// note all the non \"gt\" ones should be true to start to match mobile-first\n// were aiming for \"xs\" to be the default to \"gtXs\" true too\nexport const mediaQueryDefaultActive = {\n xl: true,\n lg: true,\n md: true,\n sm: true,\n xs: true,\n // false\n xxs: false,\n}\n"],
|
|
5
|
+
"mappings": "AAAA,SAAS,mBAAmB;AAErB,MAAM,YAAY,CAAC,KAAK,KAAK,KAAK,GAAG;AACrC,MAAM,SAAS,CAAC,KAAK,KAAK,MAAM,IAAI;AAEpC,MAAM,QAAQ,YAAY;AAAA,EAE/B,IAAI,EAAE,UAAU,KAAK;AAAA,EACrB,IAAI,EAAE,UAAU,KAAK;AAAA,EACrB,IAAI,EAAE,UAAU,KAAK;AAAA,EACrB,IAAI,EAAE,UAAU,IAAI;AAAA,EACpB,IAAI,EAAE,UAAU,IAAI;AAAA,EACpB,KAAK,EAAE,UAAU,IAAI;AAAA,EACrB,MAAM,EAAE,UAAU,MAAM,EAAE;AAAA,EAC1B,MAAM,EAAE,UAAU,MAAM,EAAE;AAAA,EAC1B,MAAM,EAAE,UAAU,OAAO,EAAE;AAAA,EAC3B,MAAM,EAAE,UAAU,OAAO,EAAE;AAAA,EAC3B,MAAM,EAAE,UAAU,OAAO,EAAE;AAC7B,CAAC;AAIM,MAAM,0BAA0B;AAAA,EACrC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EAEJ,KAAK;AACP;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -4,7 +4,7 @@ import { shorthands } from "@tamagui/shorthands";
|
|
|
4
4
|
import { themes, tokens } from "@tamagui/theme-base";
|
|
5
5
|
import { animations } from "./animations";
|
|
6
6
|
import { createGenericFont } from "./createGenericFont";
|
|
7
|
-
import { media } from "./media";
|
|
7
|
+
import { media, mediaQueryDefaultActive } from "./media";
|
|
8
8
|
export * from "./animations";
|
|
9
9
|
const systemFamily = process.env.TAMAGUI_TARGET === "native" ? "Inter" : '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"';
|
|
10
10
|
const silkscreenFont = createSilkscreenFont();
|
|
@@ -102,11 +102,7 @@ const config = {
|
|
|
102
102
|
silkscreen: silkscreenFont
|
|
103
103
|
}
|
|
104
104
|
};
|
|
105
|
-
config.mediaQueryDefaultActive =
|
|
106
|
-
xxs: true,
|
|
107
|
-
xs: true,
|
|
108
|
-
sm: true
|
|
109
|
-
};
|
|
105
|
+
config.mediaQueryDefaultActive = mediaQueryDefaultActive;
|
|
110
106
|
export {
|
|
111
107
|
config
|
|
112
108
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/tamagui.config.ts"],
|
|
4
|
-
"sourcesContent": ["import { createInterFont } from '@tamagui/font-inter'\nimport { createSilkscreenFont } from '@tamagui/font-silkscreen'\nimport { shorthands } from '@tamagui/shorthands'\nimport { themes, tokens } from '@tamagui/theme-base'\n\nimport { animations } from './animations'\nimport { createGenericFont } from './createGenericFont'\nimport { media } from './media'\n\nexport * from './animations'\n\nconst systemFamily =\n process.env.TAMAGUI_TARGET === 'native'\n ? 'Inter'\n : '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"'\n\nconst silkscreenFont = createSilkscreenFont()\nconst headingFont = createInterFont(\n {\n size: {\n 5: 13,\n 6: 15,\n },\n transform: {\n 6: 'uppercase',\n 7: 'none',\n },\n weight: {\n 6: '400',\n 7: '700',\n },\n color: {\n 6: '$colorFocus',\n 7: '$color',\n },\n letterSpacing: {\n 5: 2,\n 6: 1,\n 7: 0,\n 8: 0,\n 9: -1,\n 10: -1.5,\n 12: -2,\n 14: -3,\n 15: -4,\n },\n // for native\n face: {\n 700: { normal: 'InterBold' },\n 800: { normal: 'InterBold' },\n 900: { normal: 'InterBold' },\n },\n },\n { sizeLineHeight: (size) => Math.round(size * 1.1 + (size < 30 ? 10 : 5)) }\n)\nconst bodyFont = createInterFont(\n {\n family: systemFamily,\n weight: {\n 1: '500',\n 7: '600',\n },\n },\n {\n sizeSize: (size) => Math.round(size),\n sizeLineHeight: (size) => Math.round(size * 1.1 + (size >= 12 ? 8 : 4)),\n }\n)\n\nconst monoFont = createGenericFont(\n `\"ui-monospace\", \"SFMono-Regular\", \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace`,\n {\n weight: {\n 1: '500',\n },\n size: {\n 1: 11,\n 2: 12,\n 3: 13,\n 4: 14,\n 5: 16,\n 6: 18,\n 7: 20,\n 8: 22,\n 9: 30,\n 10: 42,\n 11: 52,\n 12: 62,\n 13: 72,\n 14: 92,\n 15: 114,\n 16: 124,\n },\n },\n {\n sizeLineHeight: (x) => x * 1.5,\n }\n)\n\nexport const config = {\n shouldAddPrefersColorThemes: true,\n themeClassNameOnRoot: true,\n animations,\n media,\n shorthands,\n themes,\n tokens,\n fonts: {\n // noto: notoFont as any,\n heading: headingFont,\n body: bodyFont,\n mono: monoFont,\n silkscreen: silkscreenFont,\n },\n}\n\n// @ts-ignore bad types\nconfig.mediaQueryDefaultActive =
|
|
5
|
-
"mappings": "AAAA,SAAS,uBAAuB;AAChC,SAAS,4BAA4B;AACrC,SAAS,kBAAkB;AAC3B,SAAS,QAAQ,cAAc;AAE/B,SAAS,kBAAkB;AAC3B,SAAS,yBAAyB;AAClC,SAAS,
|
|
4
|
+
"sourcesContent": ["import { createInterFont } from '@tamagui/font-inter'\nimport { createSilkscreenFont } from '@tamagui/font-silkscreen'\nimport { shorthands } from '@tamagui/shorthands'\nimport { themes, tokens } from '@tamagui/theme-base'\n\nimport { animations } from './animations'\nimport { createGenericFont } from './createGenericFont'\nimport { media, mediaQueryDefaultActive } from './media'\n\nexport * from './animations'\n\nconst systemFamily =\n process.env.TAMAGUI_TARGET === 'native'\n ? 'Inter'\n : '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"'\n\nconst silkscreenFont = createSilkscreenFont()\nconst headingFont = createInterFont(\n {\n size: {\n 5: 13,\n 6: 15,\n },\n transform: {\n 6: 'uppercase',\n 7: 'none',\n },\n weight: {\n 6: '400',\n 7: '700',\n },\n color: {\n 6: '$colorFocus',\n 7: '$color',\n },\n letterSpacing: {\n 5: 2,\n 6: 1,\n 7: 0,\n 8: 0,\n 9: -1,\n 10: -1.5,\n 12: -2,\n 14: -3,\n 15: -4,\n },\n // for native\n face: {\n 700: { normal: 'InterBold' },\n 800: { normal: 'InterBold' },\n 900: { normal: 'InterBold' },\n },\n },\n { sizeLineHeight: (size) => Math.round(size * 1.1 + (size < 30 ? 10 : 5)) }\n)\nconst bodyFont = createInterFont(\n {\n family: systemFamily,\n weight: {\n 1: '500',\n 7: '600',\n },\n },\n {\n sizeSize: (size) => Math.round(size),\n sizeLineHeight: (size) => Math.round(size * 1.1 + (size >= 12 ? 8 : 4)),\n }\n)\n\nconst monoFont = createGenericFont(\n `\"ui-monospace\", \"SFMono-Regular\", \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace`,\n {\n weight: {\n 1: '500',\n },\n size: {\n 1: 11,\n 2: 12,\n 3: 13,\n 4: 14,\n 5: 16,\n 6: 18,\n 7: 20,\n 8: 22,\n 9: 30,\n 10: 42,\n 11: 52,\n 12: 62,\n 13: 72,\n 14: 92,\n 15: 114,\n 16: 124,\n },\n },\n {\n sizeLineHeight: (x) => x * 1.5,\n }\n)\n\nexport const config = {\n shouldAddPrefersColorThemes: true,\n themeClassNameOnRoot: true,\n animations,\n media,\n shorthands,\n themes,\n tokens,\n fonts: {\n // noto: notoFont as any,\n heading: headingFont,\n body: bodyFont,\n mono: monoFont,\n silkscreen: silkscreenFont,\n },\n}\n\n// @ts-ignore bad types\nconfig.mediaQueryDefaultActive = mediaQueryDefaultActive\n"],
|
|
5
|
+
"mappings": "AAAA,SAAS,uBAAuB;AAChC,SAAS,4BAA4B;AACrC,SAAS,kBAAkB;AAC3B,SAAS,QAAQ,cAAc;AAE/B,SAAS,kBAAkB;AAC3B,SAAS,yBAAyB;AAClC,SAAS,OAAO,+BAA+B;AAE/C,cAAc;AAEd,MAAM,eACJ,QAAQ,IAAI,mBAAmB,WAC3B,UACA;AAEN,MAAM,iBAAiB,qBAAqB;AAC5C,MAAM,cAAc;AAAA,EAClB;AAAA,IACE,MAAM;AAAA,MACJ,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IACA,WAAW;AAAA,MACT,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IACA,QAAQ;AAAA,MACN,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IACA,OAAO;AAAA,MACL,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IACA,eAAe;AAAA,MACb,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,IAEA,MAAM;AAAA,MACJ,KAAK,EAAE,QAAQ,YAAY;AAAA,MAC3B,KAAK,EAAE,QAAQ,YAAY;AAAA,MAC3B,KAAK,EAAE,QAAQ,YAAY;AAAA,IAC7B;AAAA,EACF;AAAA,EACA,EAAE,gBAAgB,CAAC,SAAS,KAAK,MAAM,OAAO,OAAO,OAAO,KAAK,KAAK,EAAE,EAAE;AAC5E;AACA,MAAM,WAAW;AAAA,EACf;AAAA,IACE,QAAQ;AAAA,IACR,QAAQ;AAAA,MACN,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,EACF;AAAA,EACA;AAAA,IACE,UAAU,CAAC,SAAS,KAAK,MAAM,IAAI;AAAA,IACnC,gBAAgB,CAAC,SAAS,KAAK,MAAM,OAAO,OAAO,QAAQ,KAAK,IAAI,EAAE;AAAA,EACxE;AACF;AAEA,MAAM,WAAW;AAAA,EACf;AAAA,EACA;AAAA,IACE,QAAQ;AAAA,MACN,GAAG;AAAA,IACL;AAAA,IACA,MAAM;AAAA,MACJ,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,EACF;AAAA,EACA;AAAA,IACE,gBAAgB,CAAC,MAAM,IAAI;AAAA,EAC7B;AACF;AAEO,MAAM,SAAS;AAAA,EACpB,6BAA6B;AAAA,EAC7B,sBAAsB;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,IAEL,SAAS;AAAA,IACT,MAAM;AAAA,IACN,MAAM;AAAA,IACN,YAAY;AAAA,EACd;AACF;AAGA,OAAO,0BAA0B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/config-base",
|
|
3
|
-
"version": "1.0.1-rc.
|
|
3
|
+
"version": "1.0.1-rc.1",
|
|
4
4
|
"types": "./types/index.d.ts",
|
|
5
5
|
"main": "dist/cjs",
|
|
6
6
|
"module": "dist/esm",
|
|
@@ -26,17 +26,17 @@
|
|
|
26
26
|
}
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@tamagui/animations-css": "^1.0.1-rc.
|
|
30
|
-
"@tamagui/animations-react-native": "^1.0.1-rc.
|
|
31
|
-
"@tamagui/colors": "^1.0.1-rc.
|
|
32
|
-
"@tamagui/core": "^1.0.1-rc.
|
|
33
|
-
"@tamagui/font-inter": "^1.0.1-rc.
|
|
34
|
-
"@tamagui/font-silkscreen": "^1.0.1-rc.
|
|
35
|
-
"@tamagui/shorthands": "^1.0.1-rc.
|
|
36
|
-
"@tamagui/theme-base": "^1.0.1-rc.
|
|
29
|
+
"@tamagui/animations-css": "^1.0.1-rc.1",
|
|
30
|
+
"@tamagui/animations-react-native": "^1.0.1-rc.1",
|
|
31
|
+
"@tamagui/colors": "^1.0.1-rc.1",
|
|
32
|
+
"@tamagui/core": "^1.0.1-rc.1",
|
|
33
|
+
"@tamagui/font-inter": "^1.0.1-rc.1",
|
|
34
|
+
"@tamagui/font-silkscreen": "^1.0.1-rc.1",
|
|
35
|
+
"@tamagui/shorthands": "^1.0.1-rc.1",
|
|
36
|
+
"@tamagui/theme-base": "^1.0.1-rc.1"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
|
-
"@tamagui/build": "^1.0.1-rc.
|
|
39
|
+
"@tamagui/build": "^1.0.1-rc.1"
|
|
40
40
|
},
|
|
41
41
|
"publishConfig": {
|
|
42
42
|
"access": "public"
|
package/src/media.ts
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
|
+
import { createMedia } from '@tamagui/react-native-media-driver'
|
|
2
|
+
|
|
1
3
|
export const demoMedia = [500, 620, 780, 900]
|
|
2
4
|
export const widths = [660, 800, 1020, 1280]
|
|
3
5
|
|
|
4
|
-
export const media = {
|
|
6
|
+
export const media = createMedia({
|
|
5
7
|
// for site
|
|
6
8
|
xl: { maxWidth: 1650 },
|
|
7
9
|
lg: { maxWidth: 1280 },
|
|
@@ -14,4 +16,16 @@ export const media = {
|
|
|
14
16
|
gtMd: { minWidth: 1020 + 1 },
|
|
15
17
|
gtLg: { minWidth: 1280 + 1 },
|
|
16
18
|
gtXl: { minWidth: 1650 + 1 },
|
|
19
|
+
})
|
|
20
|
+
|
|
21
|
+
// note all the non "gt" ones should be true to start to match mobile-first
|
|
22
|
+
// were aiming for "xs" to be the default to "gtXs" true too
|
|
23
|
+
export const mediaQueryDefaultActive = {
|
|
24
|
+
xl: true,
|
|
25
|
+
lg: true,
|
|
26
|
+
md: true,
|
|
27
|
+
sm: true,
|
|
28
|
+
xs: true,
|
|
29
|
+
// false
|
|
30
|
+
xxs: false,
|
|
17
31
|
}
|
package/src/tamagui.config.ts
CHANGED
|
@@ -5,7 +5,7 @@ import { themes, tokens } from '@tamagui/theme-base'
|
|
|
5
5
|
|
|
6
6
|
import { animations } from './animations'
|
|
7
7
|
import { createGenericFont } from './createGenericFont'
|
|
8
|
-
import { media } from './media'
|
|
8
|
+
import { media, mediaQueryDefaultActive } from './media'
|
|
9
9
|
|
|
10
10
|
export * from './animations'
|
|
11
11
|
|
|
@@ -115,8 +115,4 @@ export const config = {
|
|
|
115
115
|
}
|
|
116
116
|
|
|
117
117
|
// @ts-ignore bad types
|
|
118
|
-
config.mediaQueryDefaultActive =
|
|
119
|
-
xxs: true,
|
|
120
|
-
xs: true,
|
|
121
|
-
sm: true,
|
|
122
|
-
}
|
|
118
|
+
config.mediaQueryDefaultActive = mediaQueryDefaultActive
|
package/types/media.d.ts
CHANGED
|
@@ -35,4 +35,12 @@ export declare const media: {
|
|
|
35
35
|
minWidth: number;
|
|
36
36
|
};
|
|
37
37
|
};
|
|
38
|
+
export declare const mediaQueryDefaultActive: {
|
|
39
|
+
xl: boolean;
|
|
40
|
+
lg: boolean;
|
|
41
|
+
md: boolean;
|
|
42
|
+
sm: boolean;
|
|
43
|
+
xs: boolean;
|
|
44
|
+
xxs: boolean;
|
|
45
|
+
};
|
|
38
46
|
//# sourceMappingURL=media.d.ts.map
|