@tamagui/config-base 1.0.1-beta.98 → 1.0.1-rc.0

package/dist/esm/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.tsx"],
-  "sourcesContent": ["export * from './tamagui.config'\nexport * from './animations'\nexport * from './media'\nexport * from './createGenericFont'\n"],
-  "mappings": "AAAA;AACA;AACA;AACA;",
+  "sourcesContent": ["export * from './tamagui.config'\nexport * from './media'\nexport * from './createGenericFont'\n"],
+  "mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;",
   "names": []
 }

package/dist/esm/media.js

@@ -1,6 +1,7 @@
 const demoMedia = [500, 620, 780, 900];
 const widths = [660, 800, 1020, 1280];
 const media = {
+  xl: { maxWidth: 1650 },
   lg: { maxWidth: 1280 },
   md: { maxWidth: 1020 },
   sm: { maxWidth: 800 },
@@ -10,14 +11,7 @@ const media = {
   gtSm: { minWidth: 800 + 1 },
   gtMd: { minWidth: 1020 + 1 },
   gtLg: { minWidth: 1280 + 1 },
-  tiny: { maxWidth: 500 },
-  gtTiny: { minWidth: 500 + 1 },
-  small: { maxWidth: 620 },
-  gtSmall: { minWidth: 620 + 1 },
-  medium: { maxWidth: 780 },
-  gtMedium: { minWidth: 780 + 1 },
-  large: { maxWidth: 900 },
-  gtLarge: { minWidth: 900 + 1 }
+  gtXl: { minWidth: 1650 + 1 }
 };
 export {
   demoMedia,

package/dist/esm/media.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/media.ts"],
-  "sourcesContent": ["export const demoMedia = [500, 620, 780, 900]\nexport const widths = [660, 800, 1020, 1280]\n\nexport const media = {\n  // for site\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\n  // for responsive demo only\n  tiny: { maxWidth: 500 },\n  gtTiny: { minWidth: 500 + 1 },\n  small: { maxWidth: 620 },\n  gtSmall: { minWidth: 620 + 1 },\n  medium: { maxWidth: 780 },\n  gtMedium: { minWidth: 780 + 1 },\n  large: { maxWidth: 900 },\n  gtLarge: { minWidth: 900 + 1 },\n}\n"],
-  "mappings": "AAAO,MAAM,YAAY,CAAC,KAAK,KAAK,KAAK,GAAG;AACrC,MAAM,SAAS,CAAC,KAAK,KAAK,MAAM,IAAI;AAEpC,MAAM,QAAQ;AAAA,EAEnB,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,EAG3B,MAAM,EAAE,UAAU,IAAI;AAAA,EACtB,QAAQ,EAAE,UAAU,MAAM,EAAE;AAAA,EAC5B,OAAO,EAAE,UAAU,IAAI;AAAA,EACvB,SAAS,EAAE,UAAU,MAAM,EAAE;AAAA,EAC7B,QAAQ,EAAE,UAAU,IAAI;AAAA,EACxB,UAAU,EAAE,UAAU,MAAM,EAAE;AAAA,EAC9B,OAAO,EAAE,UAAU,IAAI;AAAA,EACvB,SAAS,EAAE,UAAU,MAAM,EAAE;AAC/B;",
+  "sourcesContent": ["export const demoMedia = [500, 620, 780, 900]\nexport const widths = [660, 800, 1020, 1280]\n\nexport const media = {\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"],
+  "mappings": "AAAO,MAAM,YAAY,CAAC,KAAK,KAAK,KAAK,GAAG;AACrC,MAAM,SAAS,CAAC,KAAK,KAAK,MAAM,IAAI;AAEpC,MAAM,QAAQ;AAAA,EAEnB,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;",
   "names": []
 }

package/dist/esm/tamagui.config.js

@@ -5,71 +5,89 @@ import { themes, tokens } from "@tamagui/theme-base";
 import { animations } from "./animations";
 import { createGenericFont } from "./createGenericFont";
 import { media } from "./media";
+export * from "./animations";
+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"';
 const silkscreenFont = createSilkscreenFont();
-const headingFont = createInterFont({
-  size: {
-    5: 13,
-    6: 15
+const headingFont = createInterFont(
+  {
+    size: {
+      5: 13,
+      6: 15
+    },
+    transform: {
+      6: "uppercase",
+      7: "none"
+    },
+    weight: {
+      6: "400",
+      7: "700"
+    },
+    color: {
+      6: "$colorFocus",
+      7: "$color"
+    },
+    letterSpacing: {
+      5: 2,
+      6: 1,
+      7: 0,
+      8: 0,
+      9: -1,
+      10: -1.5,
+      12: -2,
+      14: -3,
+      15: -4
+    },
+    face: {
+      700: { normal: "InterBold" },
+      800: { normal: "InterBold" },
+      900: { normal: "InterBold" }
+    }
   },
-  transform: {
-    6: "uppercase",
-    7: "none"
+  { sizeLineHeight: (size) => Math.round(size * 1.1 + (size < 30 ? 10 : 5)) }
+);
+const bodyFont = createInterFont(
+  {
+    family: systemFamily,
+    weight: {
+      1: "500",
+      7: "600"
+    }
   },
-  weight: {
-    6: "400",
-    7: "700"
-  },
-  color: {
-    6: "$colorFocus",
-    7: "$color"
-  },
-  letterSpacing: {
-    5: 2,
-    6: 1,
-    7: 0,
-    8: 0,
-    9: -1,
-    10: -1,
-    12: -2,
-    14: -3,
-    15: -4
+  {
+    sizeSize: (size) => Math.round(size),
+    sizeLineHeight: (size) => Math.round(size * 1.1 + (size >= 12 ? 8 : 4))
   }
-}, { sizeLineHeight: (size) => Math.round(size * 1.1 + (size < 30 ? 10 : 0)) });
-const bodyFont = createInterFont({
-  size: {
-    4: 15
-  }
-}, {
-  sizeSize: (size) => Math.round(size),
-  sizeLineHeight: (size) => Math.round(size * 1.1 + (size >= 12 ? 12 : 4))
-});
-const monoFont = createGenericFont(`"ui-monospace", "SFMono-Regular", "SF Mono", Menlo, Consolas, "Liberation Mono", monospace`, {
-  weight: {
-    1: "500"
+);
+const monoFont = createGenericFont(
+  `"ui-monospace", "SFMono-Regular", "SF Mono", Menlo, Consolas, "Liberation Mono", monospace`,
+  {
+    weight: {
+      1: "500"
+    },
+    size: {
+      1: 11,
+      2: 12,
+      3: 13,
+      4: 14,
+      5: 16,
+      6: 18,
+      7: 20,
+      8: 22,
+      9: 30,
+      10: 42,
+      11: 52,
+      12: 62,
+      13: 72,
+      14: 92,
+      15: 114,
+      16: 124
+    }
   },
-  size: {
-    1: 10,
-    2: 11,
-    3: 12,
-    4: 15,
-    5: 16,
-    6: 18,
-    7: 20,
-    8: 22,
-    9: 30,
-    10: 42,
-    11: 52,
-    12: 62,
-    13: 72,
-    14: 92,
-    15: 114,
-    16: 124
+  {
+    sizeLineHeight: (x) => x * 1.5
   }
-}, {
-  sizeLineHeight: (x) => x * 1.5
-});
+);
 const config = {
-  defaultTheme: "light",
   shouldAddPrefersColorThemes: true,
   themeClassNameOnRoot: true,
   animations,
@@ -84,6 +102,11 @@ const config = {
     silkscreen: silkscreenFont
   }
 };
+config.mediaQueryDefaultActive = {
+  xxs: true,
+  xs: true,
+  sm: true
+};
 export {
   config
 };

package/dist/esm/tamagui.config.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/tamagui.config.ts"],
-  "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\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,\n      12: -2,\n      14: -3,\n      15: -4,\n    },\n  },\n  { sizeLineHeight: (size) => Math.round(size * 1.1 + (size < 30 ? 10 : 0)) }\n)\nconst bodyFont = createInterFont(\n  {\n    size: {\n      4: 15,\n    },\n  },\n  {\n    sizeSize: (size) => Math.round(size),\n    sizeLineHeight: (size) => Math.round(size * 1.1 + (size >= 12 ? 12 : 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: 10,\n      2: 11,\n      3: 12,\n      4: 15,\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  defaultTheme: 'light',\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"],
-  "mappings": "AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA,MAAM,iBAAiB,qBAAqB;AAC5C,MAAM,cAAc,gBAClB;AAAA,EACE,MAAM;AAAA,IACJ,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,WAAW;AAAA,IACT,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,QAAQ;AAAA,IACN,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,OAAO;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,eAAe;AAAA,IACb,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AACF,GACA,EAAE,gBAAgB,CAAC,SAAS,KAAK,MAAM,OAAO,MAAO,QAAO,KAAK,KAAK,EAAE,EAAE,CAC5E;AACA,MAAM,WAAW,gBACf;AAAA,EACE,MAAM;AAAA,IACJ,GAAG;AAAA,EACL;AACF,GACA;AAAA,EACE,UAAU,CAAC,SAAS,KAAK,MAAM,IAAI;AAAA,EACnC,gBAAgB,CAAC,SAAS,KAAK,MAAM,OAAO,MAAO,SAAQ,KAAK,KAAK,EAAE;AACzE,CACF;AAEA,MAAM,WAAW,kBACf,8FACA;AAAA,EACE,QAAQ;AAAA,IACN,GAAG;AAAA,EACL;AAAA,EACA,MAAM;AAAA,IACJ,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AACF,GACA;AAAA,EACE,gBAAgB,CAAC,MAAM,IAAI;AAC7B,CACF;AAEO,MAAM,SAAS;AAAA,EACpB,cAAc;AAAA,EACd,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;",
+  "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 = {\n  xxs: true,\n  xs: true,\n  sm: true,\n}\n"],
+  "mappings": "AAAA,SAAS,uBAAuB;AAChC,SAAS,4BAA4B;AACrC,SAAS,kBAAkB;AAC3B,SAAS,QAAQ,cAAc;AAE/B,SAAS,kBAAkB;AAC3B,SAAS,yBAAyB;AAClC,SAAS,aAAa;AAEtB,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;AAAA,EAC/B,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,IAAI;AACN;",
   "names": []
 }

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@tamagui/config-base",
-  "version": "1.0.1-beta.98",
+  "version": "1.0.1-rc.0",
   "types": "./types/index.d.ts",
   "main": "dist/cjs",
   "module": "dist/esm",
-  "module:jsx": "dist/jsx",
+  "sideEffects": false,
   "files": [
     "src",
     "types",
@@ -13,20 +13,30 @@
   "scripts": {
     "build": "tamagui-build",
     "watch": "tamagui-build --watch",
+    "lint": "eslint src",
+    "lint:fix": "yarn lint --fix",
     "clean": "tamagui-build clean",
     "clean:build": "tamagui-build clean:build"
   },
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "import": "./dist/esm/index.js",
+      "require": "./dist/cjs/index.js"
+    }
+  },
   "dependencies": {
-    "@tamagui/animations-reanimated": "^1.0.1-beta.98",
-    "@tamagui/colors": "^1.0.1-beta.98",
-    "@tamagui/core": "^1.0.1-beta.98",
-    "@tamagui/font-inter": "^1.0.1-beta.98",
-    "@tamagui/font-silkscreen": "^1.0.1-beta.98",
-    "@tamagui/shorthands": "^1.0.1-beta.98",
-    "@tamagui/theme-base": "^1.0.1-beta.98"
+    "@tamagui/animations-css": "^1.0.1-rc.0",
+    "@tamagui/animations-react-native": "^1.0.1-rc.0",
+    "@tamagui/colors": "^1.0.1-rc.0",
+    "@tamagui/core": "^1.0.1-rc.0",
+    "@tamagui/font-inter": "^1.0.1-rc.0",
+    "@tamagui/font-silkscreen": "^1.0.1-rc.0",
+    "@tamagui/shorthands": "^1.0.1-rc.0",
+    "@tamagui/theme-base": "^1.0.1-rc.0"
   },
   "devDependencies": {
-    "@tamagui/build": "^1.0.1-beta.98"
+    "@tamagui/build": "^1.0.1-rc.0"
   },
   "publishConfig": {
     "access": "public"

package/src/animations.css.ts

@@ -0,0 +1,9 @@
+import { createAnimations } from '@tamagui/animations-css'
+
+export const animations = createAnimations({
+  bouncy: 'ease-in 200ms',
+  lazy: 'ease-in 600ms',
+  slow: 'ease-in 500ms',
+  quick: 'ease-in 100ms',
+  tooltip: 'ease-in 400ms',
+})

package/src/animations.reanimated.ts

@@ -0,0 +1,32 @@
+import { createAnimations } from '@tamagui/animations-reanimated'
+
+export const animations = createAnimations({
+  bouncy: {
+    type: 'spring',
+    damping: 9,
+    mass: 0.9,
+    stiffness: 150,
+  },
+  lazy: {
+    type: 'spring',
+    damping: 18,
+    stiffness: 50,
+  },
+  slow: {
+    type: 'spring',
+    damping: 15,
+    stiffness: 40,
+  },
+  quick: {
+    type: 'spring',
+    damping: 20,
+    mass: 1.2,
+    stiffness: 250,
+  },
+  tooltip: {
+    type: 'spring',
+    damping: 10,
+    mass: 0.9,
+    stiffness: 100,
+  },
+})

package/src/animations.ts

@@ -1,30 +1,25 @@
-import { createAnimations } from '@tamagui/animations-reanimated'
+import { createAnimations } from '@tamagui/animations-react-native'
 
 export const animations = createAnimations({
   bouncy: {
-    type: 'spring',
     damping: 9,
     mass: 0.9,
     stiffness: 150,
   },
   lazy: {
-    type: 'spring',
     damping: 18,
     stiffness: 50,
   },
   slow: {
-    type: 'spring',
     damping: 15,
     stiffness: 40,
   },
   quick: {
-    type: 'spring',
     damping: 20,
     mass: 1.2,
     stiffness: 250,
   },
   tooltip: {
-    type: 'spring',
     damping: 10,
     mass: 0.9,
     stiffness: 100,

package/src/index.tsx

@@ -1,4 +1,3 @@
 export * from './tamagui.config'
-export * from './animations'
 export * from './media'
 export * from './createGenericFont'

package/src/media.ts

@@ -3,6 +3,7 @@ export const widths = [660, 800, 1020, 1280]
 
 export const media = {
   // for site
+  xl: { maxWidth: 1650 },
   lg: { maxWidth: 1280 },
   md: { maxWidth: 1020 },
   sm: { maxWidth: 800 },
@@ -12,14 +13,5 @@ export const media = {
   gtSm: { minWidth: 800 + 1 },
   gtMd: { minWidth: 1020 + 1 },
   gtLg: { minWidth: 1280 + 1 },
-
-  // for responsive demo only
-  tiny: { maxWidth: 500 },
-  gtTiny: { minWidth: 500 + 1 },
-  small: { maxWidth: 620 },
-  gtSmall: { minWidth: 620 + 1 },
-  medium: { maxWidth: 780 },
-  gtMedium: { minWidth: 780 + 1 },
-  large: { maxWidth: 900 },
-  gtLarge: { minWidth: 900 + 1 },
+  gtXl: { minWidth: 1650 + 1 },
 }

package/src/tamagui.config.ts

@@ -7,6 +7,13 @@ import { animations } from './animations'
 import { createGenericFont } from './createGenericFont'
 import { media } from './media'
 
+export * from './animations'
+
+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"'
+
 const silkscreenFont = createSilkscreenFont()
 const headingFont = createInterFont(
   {
@@ -32,23 +39,31 @@ const headingFont = createInterFont(
       7: 0,
       8: 0,
       9: -1,
-      10: -1,
+      10: -1.5,
       12: -2,
       14: -3,
       15: -4,
     },
+    // for native
+    face: {
+      700: { normal: 'InterBold' },
+      800: { normal: 'InterBold' },
+      900: { normal: 'InterBold' },
+    },
   },
-  { sizeLineHeight: (size) => Math.round(size * 1.1 + (size < 30 ? 10 : 0)) }
+  { sizeLineHeight: (size) => Math.round(size * 1.1 + (size < 30 ? 10 : 5)) }
 )
 const bodyFont = createInterFont(
   {
-    size: {
-      4: 15,
+    family: systemFamily,
+    weight: {
+      1: '500',
+      7: '600',
     },
   },
   {
     sizeSize: (size) => Math.round(size),
-    sizeLineHeight: (size) => Math.round(size * 1.1 + (size >= 12 ? 12 : 4)),
+    sizeLineHeight: (size) => Math.round(size * 1.1 + (size >= 12 ? 8 : 4)),
   }
 )
 
@@ -59,10 +74,10 @@ const monoFont = createGenericFont(
       1: '500',
     },
     size: {
-      1: 10,
-      2: 11,
-      3: 12,
-      4: 15,
+      1: 11,
+      2: 12,
+      3: 13,
+      4: 14,
       5: 16,
       6: 18,
       7: 20,
@@ -83,7 +98,6 @@ const monoFont = createGenericFont(
 )
 
 export const config = {
-  defaultTheme: 'light',
   shouldAddPrefersColorThemes: true,
   themeClassNameOnRoot: true,
   animations,
@@ -99,3 +113,10 @@ export const config = {
     silkscreen: silkscreenFont,
   },
 }
+
+// @ts-ignore bad types
+config.mediaQueryDefaultActive = {
+  xxs: true,
+  xs: true,
+  sm: true,
+}

package/types/animations.css.d.ts

@@ -0,0 +1,8 @@
+export declare const animations: import("@tamagui/core").AnimationDriver<{
+    bouncy: string;
+    lazy: string;
+    slow: string;
+    quick: string;
+    tooltip: string;
+}>;
+//# sourceMappingURL=animations.css.d.ts.map

package/types/animations.d.ts

@@ -1,28 +1,23 @@
 export declare const animations: import("@tamagui/core").AnimationDriver<{
     bouncy: {
-        type: "spring";
         damping: number;
         mass: number;
         stiffness: number;
     };
     lazy: {
-        type: "spring";
         damping: number;
         stiffness: number;
     };
     slow: {
-        type: "spring";
         damping: number;
         stiffness: number;
     };
     quick: {
-        type: "spring";
         damping: number;
         mass: number;
         stiffness: number;
     };
     tooltip: {
-        type: "spring";
         damping: number;
         mass: number;
         stiffness: number;

package/types/animations.reanimated.d.ts

@@ -0,0 +1,31 @@
+export declare const animations: import("@tamagui/core").AnimationDriver<{
+    bouncy: {
+        type: "spring";
+        damping: number;
+        mass: number;
+        stiffness: number;
+    };
+    lazy: {
+        type: "spring";
+        damping: number;
+        stiffness: number;
+    };
+    slow: {
+        type: "spring";
+        damping: number;
+        stiffness: number;
+    };
+    quick: {
+        type: "spring";
+        damping: number;
+        mass: number;
+        stiffness: number;
+    };
+    tooltip: {
+        type: "spring";
+        damping: number;
+        mass: number;
+        stiffness: number;
+    };
+}>;
+//# sourceMappingURL=animations.reanimated.d.ts.map

package/types/index.d.ts

@@ -1,5 +1,4 @@
 export * from './tamagui.config';
-export * from './animations';
 export * from './media';
 export * from './createGenericFont';
 //# sourceMappingURL=index.d.ts.map

package/types/media.d.ts

@@ -1,6 +1,9 @@
 export declare const demoMedia: number[];
 export declare const widths: number[];
 export declare const media: {
+    xl: {
+        maxWidth: number;
+    };
     lg: {
         maxWidth: number;
     };
@@ -28,28 +31,7 @@ export declare const media: {
     gtLg: {
         minWidth: number;
     };
-    tiny: {
-        maxWidth: number;
-    };
-    gtTiny: {
-        minWidth: number;
-    };
-    small: {
-        maxWidth: number;
-    };
-    gtSmall: {
-        minWidth: number;
-    };
-    medium: {
-        maxWidth: number;
-    };
-    gtMedium: {
-        minWidth: number;
-    };
-    large: {
-        maxWidth: number;
-    };
-    gtLarge: {
+    gtXl: {
         minWidth: number;
     };
 };