@tamagui/themes 1.121.12 → 1.122.0

package/dist/cjs/v3.cjs

@@ -1,9 +1,7 @@
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf,
-  __hasOwnProp = Object.prototype.hasOwnProperty;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
     for (var name in all) __defProp(target, name, {
       get: all[name],
@@ -17,18 +15,9 @@ var __export = (target, all) => {
     });
     return to;
   };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
-    value: mod,
-    enumerable: !0
-  }) : target, mod)),
-  __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-    value: !0
-  }), mod);
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: !0
+}), mod);
 var v3_exports = {};
 __export(v3_exports, {
   blue: () => import_colors.blue,
@@ -45,13 +34,13 @@ __export(v3_exports, {
   purpleDark: () => import_colors7.purpleDark,
   red: () => import_colors3.red,
   redDark: () => import_colors3.redDark,
-  themes: () => themes,
+  themes: () => import_generated_v3.themes,
   tokens: () => import_v3_themes.tokens,
   yellow: () => import_colors5.yellow,
   yellowDark: () => import_colors5.yellowDark
 });
 module.exports = __toCommonJS(v3_exports);
-var generatedThemes = __toESM(require("./generated-v3.cjs")),
+var import_generated_v3 = require("./generated-v3.cjs"),
   import_v3_themes = require("./v3-themes.cjs"),
   import_colors = require("@tamagui/colors"),
   import_colors2 = require("@tamagui/colors"),
@@ -60,5 +49,4 @@ var generatedThemes = __toESM(require("./generated-v3.cjs")),
   import_colors5 = require("@tamagui/colors"),
   import_colors6 = require("@tamagui/colors"),
   import_colors7 = require("@tamagui/colors"),
-  import_colors8 = require("@tamagui/colors");
-const themes = generatedThemes;
+  import_colors8 = require("@tamagui/colors");

package/dist/cjs/v3.js

@@ -1,8 +1,7 @@
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: !0 });
@@ -12,14 +11,7 @@ var __export = (target, all) => {
       !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: !0 }) : target,
-  mod
-)), __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
 var v3_exports = {};
 __export(v3_exports, {
   blue: () => import_colors.blue,
@@ -36,12 +28,11 @@ __export(v3_exports, {
   purpleDark: () => import_colors7.purpleDark,
   red: () => import_colors3.red,
   redDark: () => import_colors3.redDark,
-  themes: () => themes,
+  themes: () => import_generated_v3.themes,
   tokens: () => import_v3_themes.tokens,
   yellow: () => import_colors5.yellow,
   yellowDark: () => import_colors5.yellowDark
 });
 module.exports = __toCommonJS(v3_exports);
-var generatedThemes = __toESM(require("./generated-v3")), import_v3_themes = require("./v3-themes"), import_colors = require("@tamagui/colors"), import_colors2 = require("@tamagui/colors"), import_colors3 = require("@tamagui/colors"), import_colors4 = require("@tamagui/colors"), import_colors5 = require("@tamagui/colors"), import_colors6 = require("@tamagui/colors"), import_colors7 = require("@tamagui/colors"), import_colors8 = require("@tamagui/colors");
-const themes = generatedThemes;
+var import_generated_v3 = require("./generated-v3"), import_v3_themes = require("./v3-themes"), import_colors = require("@tamagui/colors"), import_colors2 = require("@tamagui/colors"), import_colors3 = require("@tamagui/colors"), import_colors4 = require("@tamagui/colors"), import_colors5 = require("@tamagui/colors"), import_colors6 = require("@tamagui/colors"), import_colors7 = require("@tamagui/colors"), import_colors8 = require("@tamagui/colors");
 //# sourceMappingURL=v3.js.map

package/dist/cjs/v3.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/v3.tsx"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAAiC,oCAGjC,mBAAuB,wBAGvB,gBAA+B,4BAC/BA,iBAAiC,4BACjCA,iBAA6B,4BAC7BA,iBAAmC,4BACnCA,iBAAmC,4BACnCA,iBAA+B,4BAC/BA,iBAAmC,4BACnCA,iBAA+B;AAZxB,MAAM,SAAS;",
+  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAuB,2BACvB,mBAAuB,wBAGvB,gBAA+B,4BAC/BA,iBAAiC,4BACjCA,iBAA6B,4BAC7BA,iBAAmC,4BACnCA,iBAAmC,4BACnCA,iBAA+B,4BAC/BA,iBAAmC,4BACnCA,iBAA+B;",
   "names": ["import_colors"]
 }

package/dist/cjs/v3.native.js

@@ -1,9 +1,8 @@
 "use strict";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: !0 });
@@ -13,14 +12,7 @@ var __export = (target, all) => {
       !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: !0 }) : target,
-  mod
-)), __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
 var v3_exports = {};
 __export(v3_exports, {
   blue: () => import_colors.blue,
@@ -37,13 +29,13 @@ __export(v3_exports, {
   purpleDark: () => import_colors7.purpleDark,
   red: () => import_colors3.red,
   redDark: () => import_colors3.redDark,
-  themes: () => themes,
+  themes: () => import_generated_v3.themes,
   tokens: () => import_v3_themes.tokens,
   yellow: () => import_colors5.yellow,
   yellowDark: () => import_colors5.yellowDark
 });
 module.exports = __toCommonJS(v3_exports);
-var generatedThemes = __toESM(require("./generated-v3")), import_v3_themes = require("./v3-themes"), import_colors = require("@tamagui/colors"), import_colors2 = require("@tamagui/colors"), import_colors3 = require("@tamagui/colors"), import_colors4 = require("@tamagui/colors"), import_colors5 = require("@tamagui/colors"), import_colors6 = require("@tamagui/colors"), import_colors7 = require("@tamagui/colors"), import_colors8 = require("@tamagui/colors"), themes = generatedThemes;
+var import_generated_v3 = require("./generated-v3"), import_v3_themes = require("./v3-themes"), import_colors = require("@tamagui/colors"), import_colors2 = require("@tamagui/colors"), import_colors3 = require("@tamagui/colors"), import_colors4 = require("@tamagui/colors"), import_colors5 = require("@tamagui/colors"), import_colors6 = require("@tamagui/colors"), import_colors7 = require("@tamagui/colors"), import_colors8 = require("@tamagui/colors");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   blue,

package/dist/cjs/v3.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Users/n8/tamagui/code/core/themes/src/v3.tsx"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;;;;sBAAiC,oCAGjC,mBAAuB,wBAGvB,gBAA+B,4BAC/BA,iBAAiC,4BACjCA,iBAA6B,4BAC7BA,iBAAmC,4BACnCA,iBAAmC,4BACnCA,iBAA+B,4BAC/BA,iBAAmC,4BACnCA,iBAA+B,4BAZlBC,SAASC;",
-  "names": ["import_colors", "themes", "generatedThemes"]
+  "mappings": ";;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;;;;0BAAuB,2BACvB,mBAAuB,wBAGvB,gBAA+B,4BAC/BA,iBAAiC,4BACjCA,iBAA6B,4BAC7BA,iBAAmC,4BACnCA,iBAAmC,4BACnCA,iBAA+B,4BAC/BA,iBAAmC,4BACnCA,iBAA+B;",
+  "names": ["import_colors"]
 }

package/dist/cjs/v4-tamagui.cjs

@@ -1,7 +1,9 @@
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __getProtoOf = Object.getPrototypeOf,
+  __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
     for (var name in all) __defProp(target, name, {
       get: all[name],
@@ -15,137 +17,176 @@ var __export = (target, all) => {
     });
     return to;
   };
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: !0
-}), mod);
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+    value: mod,
+    enumerable: !0
+  }) : target, mod)),
+  __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+    value: !0
+  }), mod);
 var v4_tamagui_exports = {};
 __export(v4_tamagui_exports, {
   tamaguiThemes: () => tamaguiThemes
 });
 module.exports = __toCommonJS(v4_tamagui_exports);
-var import_colors = require("@tamagui/colors"),
-  import_v4_createTheme = require("./v4-createTheme.cjs");
-const colorTokens = {
-    light: {
-      blue: import_colors.blue,
-      gray: import_colors.gray,
-      green: import_colors.green,
-      orange: import_colors.orange,
-      pink: import_colors.pink,
-      purple: import_colors.purple,
-      red: import_colors.red,
-      yellow: import_colors.yellow
-    },
-    dark: {
-      blue: import_colors.blueDark,
-      gray: import_colors.grayDark,
-      green: import_colors.greenDark,
-      orange: import_colors.orangeDark,
-      pink: import_colors.pinkDark,
-      purple: import_colors.purpleDark,
-      red: import_colors.redDark,
-      yellow: import_colors.yellowDark
-    }
-  },
-  lightShadowColor = "rgba(0,0,0,0.04)",
-  lightShadowColorStrong = "rgba(0,0,0,0.085)",
-  darkShadowColor = "rgba(0,0,0,0.2)",
-  darkShadowColorStrong = "rgba(0,0,0,0.3)",
-  darkPalette = ["#050505", "#151515", "#191919", "#232323", "#282828", "#323232", "#424242", "#494949", "#545454", "#626262", "#a5a5a5", "#fff"],
+var Colors = __toESM(require("@tamagui/colors")),
+  import_theme_builder = require("@tamagui/theme-builder");
+const darkPalette = ["#040404", "#090909", "#111", "#151515", "#222", "#282828", "#343434", "#424242", "#515151", "#626262", "#a5a5a5", "#fff"],
   lightPalette = ["#fff", "#f8f8f8", "hsl(0, 0%, 96.3%)", "hsl(0, 0%, 94.1%)", "hsl(0, 0%, 92.0%)", "hsl(0, 0%, 90.0%)", "hsl(0, 0%, 88.5%)", "hsl(0, 0%, 81.0%)", "hsl(0, 0%, 56.1%)", "hsl(0, 0%, 50.3%)", "hsl(0, 0%, 42.5%)", "hsl(0, 0%, 9.0%)"],
-  tamaguiThemes = (0, import_v4_createTheme.createThemeSuite)({
+  lightShadows = {
+    shadow1: "rgba(0,0,0,0.04)",
+    shadow2: "rgba(0,0,0,0.08)",
+    shadow3: "rgba(0,0,0,0.16)",
+    shadow4: "rgba(0,0,0,0.24)",
+    shadow5: "rgba(0,0,0,0.32)",
+    shadow6: "rgba(0,0,0,0.4)"
+  },
+  darkShadows = {
+    shadow1: "rgba(0,0,0,0.2)",
+    shadow2: "rgba(0,0,0,0.3)",
+    shadow3: "rgba(0,0,0,0.4)",
+    shadow4: "rgba(0,0,0,0.5)",
+    shadow5: "rgba(0,0,0,0.6)",
+    shadow6: "rgba(0,0,0,0.7)"
+  },
+  blackColors = {
+    black1: darkPalette[0],
+    black2: darkPalette[1],
+    black3: darkPalette[2],
+    black4: darkPalette[3],
+    black5: darkPalette[4],
+    black6: darkPalette[5],
+    black7: darkPalette[6],
+    black8: darkPalette[7],
+    black9: darkPalette[8],
+    black10: darkPalette[9],
+    black11: darkPalette[10],
+    black12: darkPalette[11]
+  },
+  whiteColors = {
+    white1: lightPalette[0],
+    white2: lightPalette[1],
+    white3: lightPalette[2],
+    white4: lightPalette[3],
+    white5: lightPalette[4],
+    white6: lightPalette[5],
+    white7: lightPalette[6],
+    white8: lightPalette[7],
+    white9: lightPalette[8],
+    white10: lightPalette[9],
+    white11: lightPalette[10],
+    white12: lightPalette[11]
+  },
+  themes = (0, import_theme_builder.createThemes)({
+    componentThemes: import_theme_builder.defaultComponentThemes,
     base: {
       palette: {
         dark: darkPalette,
         light: lightPalette
       },
-      // we set a bunch of colors like $red1 => $red1
-      // we only want to set it on the base light/dark theme
+      // for values we don't want being inherited onto sub-themes
       extra: {
         light: {
-          ...colorTokens.light.blue,
-          ...colorTokens.light.gray,
-          ...colorTokens.light.green,
-          ...colorTokens.light.orange,
-          ...colorTokens.light.pink,
-          ...colorTokens.light.purple,
-          ...colorTokens.light.red,
-          ...colorTokens.light.yellow,
-          shadowColor: lightShadowColorStrong,
-          shadowColorHover: lightShadowColorStrong,
-          shadowColorPress: lightShadowColor,
-          shadowColorFocus: lightShadowColor
+          ...Colors.blue,
+          ...Colors.gray,
+          ...Colors.green,
+          ...Colors.orange,
+          ...Colors.pink,
+          ...Colors.purple,
+          ...Colors.red,
+          ...Colors.yellow,
+          ...lightShadows,
+          ...blackColors,
+          ...whiteColors,
+          shadowColor: lightShadows.shadow1
         },
         dark: {
-          ...colorTokens.dark.blue,
-          ...colorTokens.dark.gray,
-          ...colorTokens.dark.green,
-          ...colorTokens.dark.orange,
-          ...colorTokens.dark.pink,
-          ...colorTokens.dark.purple,
-          ...colorTokens.dark.red,
-          ...colorTokens.dark.yellow,
-          shadowColor: darkShadowColorStrong,
-          shadowColorHover: darkShadowColorStrong,
-          shadowColorPress: darkShadowColor,
-          shadowColorFocus: darkShadowColor
+          ...Colors.blueDark,
+          ...Colors.grayDark,
+          ...Colors.greenDark,
+          ...Colors.orangeDark,
+          ...Colors.pinkDark,
+          ...Colors.purpleDark,
+          ...Colors.redDark,
+          ...Colors.yellowDark,
+          ...darkShadows,
+          ...blackColors,
+          ...whiteColors,
+          shadowColor: darkShadows.shadow1
         }
       }
     },
+    // inverse accent theme
     accent: {
       palette: {
         dark: lightPalette,
         light: darkPalette
-      },
-      template: "inverse"
+      }
     },
     childrenThemes: {
+      black: {
+        palette: {
+          dark: Object.values(blackColors),
+          light: Object.values(blackColors)
+        }
+      },
+      white: {
+        palette: {
+          dark: Object.values(whiteColors),
+          light: Object.values(whiteColors)
+        }
+      },
       gray: {
         palette: {
-          dark: Object.values(colorTokens.dark.gray),
-          light: Object.values(colorTokens.light.gray)
+          dark: Object.values(Colors.grayDark),
+          light: Object.values(Colors.gray)
         }
       },
       blue: {
         palette: {
-          dark: Object.values(colorTokens.dark.blue),
-          light: Object.values(colorTokens.light.blue)
+          dark: Object.values(Colors.blueDark),
+          light: Object.values(Colors.blue)
         }
       },
       orange: {
         palette: {
-          dark: Object.values(colorTokens.dark.orange),
-          light: Object.values(colorTokens.light.orange)
+          dark: Object.values(Colors.orangeDark),
+          light: Object.values(Colors.orange)
         }
       },
       red: {
         palette: {
-          dark: Object.values(colorTokens.dark.red),
-          light: Object.values(colorTokens.light.red)
+          dark: Object.values(Colors.redDark),
+          light: Object.values(Colors.red)
         }
       },
       yellow: {
         palette: {
-          dark: Object.values(colorTokens.dark.yellow),
-          light: Object.values(colorTokens.light.yellow)
+          dark: Object.values(Colors.yellowDark),
+          light: Object.values(Colors.yellow)
         }
       },
       green: {
         palette: {
-          dark: Object.values(colorTokens.dark.green),
-          light: Object.values(colorTokens.light.green)
+          dark: Object.values(Colors.greenDark),
+          light: Object.values(Colors.green)
         }
       },
       purple: {
         palette: {
-          dark: Object.values(colorTokens.dark.purple),
-          light: Object.values(colorTokens.light.purple)
+          dark: Object.values(Colors.purpleDark),
+          light: Object.values(Colors.purple)
         }
       },
       pink: {
         palette: {
-          dark: Object.values(colorTokens.dark.pink),
-          light: Object.values(colorTokens.light.pink)
+          dark: Object.values(Colors.pinkDark),
+          light: Object.values(Colors.pink)
         }
       },
       tan: {
@@ -172,4 +213,5 @@ const colorTokens = {
         template: "surface3"
       }
     }
-  });
+  }),
+  tamaguiThemes = process.env.TAMAGUI_ENVIRONMENT === "client" && process.env.NODE_ENV === "production" ? {} : themes;