@tamagui/themes 1.89.25 → 1.89.27-1708112217600

package/dist/esm/v2-themes.native.js

@@ -1,26 +1,104 @@
 import { createThemeBuilder } from "@tamagui/theme-builder";
-import {
-  blue,
-  blueDark,
-  gray,
-  grayDark,
-  green,
-  greenDark,
-  orange,
-  orangeDark,
-  pink,
-  pinkDark,
-  purple,
-  purpleDark,
-  red,
-  redDark,
-  yellow,
-  yellowDark
-} from "@tamagui/colors";
+import { blue, blueDark, gray, grayDark, green, greenDark, orange, orangeDark, pink, pinkDark, purple, purpleDark, red, redDark, yellow, yellowDark } from "@tamagui/colors";
 import { createTokens } from "@tamagui/web";
 import { masks } from "./masks";
 import { masks as masks2 } from "./masks";
-const colorTokens = {
+function _array_like_to_array(arr, len) {
+  (len == null || len > arr.length) && (len = arr.length);
+  for (var i = 0, arr2 = new Array(len); i < len; i++)
+    arr2[i] = arr[i];
+  return arr2;
+}
+function _array_with_holes(arr) {
+  if (Array.isArray(arr))
+    return arr;
+}
+function _array_without_holes(arr) {
+  if (Array.isArray(arr))
+    return _array_like_to_array(arr);
+}
+function _define_property(obj, key, value) {
+  return key in obj ? Object.defineProperty(obj, key, {
+    value,
+    enumerable: !0,
+    configurable: !0,
+    writable: !0
+  }) : obj[key] = value, obj;
+}
+function _iterable_to_array(iter) {
+  if (typeof Symbol < "u" && iter[Symbol.iterator] != null || iter["@@iterator"] != null)
+    return Array.from(iter);
+}
+function _iterable_to_array_limit(arr, i) {
+  var _i = arr == null ? null : typeof Symbol < "u" && arr[Symbol.iterator] || arr["@@iterator"];
+  if (_i != null) {
+    var _arr = [], _n = !0, _d = !1, _s, _e;
+    try {
+      for (_i = _i.call(arr); !(_n = (_s = _i.next()).done) && (_arr.push(_s.value), !(i && _arr.length === i)); _n = !0)
+        ;
+    } catch (err) {
+      _d = !0, _e = err;
+    } finally {
+      try {
+        !_n && _i.return != null && _i.return();
+      } finally {
+        if (_d)
+          throw _e;
+      }
+    }
+    return _arr;
+  }
+}
+function _non_iterable_rest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _non_iterable_spread() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _object_spread(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i] != null ? arguments[i] : {}, ownKeys2 = Object.keys(source);
+    typeof Object.getOwnPropertySymbols == "function" && (ownKeys2 = ownKeys2.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+    }))), ownKeys2.forEach(function(key) {
+      _define_property(target, key, source[key]);
+    });
+  }
+  return target;
+}
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    enumerableOnly && (symbols = symbols.filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _object_spread_props(target, source) {
+  return source = source ?? {}, Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
+    Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+  }), target;
+}
+function _sliced_to_array(arr, i) {
+  return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
+}
+function _to_consumable_array(arr) {
+  return _array_without_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_spread();
+}
+function _unsupported_iterable_to_array(o, minLen) {
+  if (o) {
+    if (typeof o == "string")
+      return _array_like_to_array(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor && (n = o.constructor.name), n === "Map" || n === "Set")
+      return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))
+      return _array_like_to_array(o, minLen);
+  }
+}
+var colorTokens = {
   light: {
     blue,
     gray,
@@ -41,19 +119,21 @@ const colorTokens = {
     red: redDark,
     yellow: yellowDark
   }
-}, palettes = (() => {
-  const lightTransparent = "rgba(255,255,255,0)", darkTransparent = "rgba(10,10,10,0)", transparent = (hsl, opacity = 0) => hsl.replace("%)", `%, ${opacity})`).replace("hsl(", "hsla("), getColorPalette = (colors, color2 = colors[0]) => {
-    const colorPalette = Object.values(colors), [head, tail] = [
+}, palettes = function() {
+  var lightTransparent = "rgba(255,255,255,0)", darkTransparent = "rgba(10,10,10,0)", transparent = function(hsl) {
+    var opacity = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0;
+    return hsl.replace("%)", "%, ".concat(opacity, ")")).replace("hsl(", "hsla(");
+  }, getColorPalette = function(colors) {
+    var color2 = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : colors[0], colorPalette = Object.values(colors), _ref = [
       colorPalette.slice(0, 6),
       colorPalette.slice(colorPalette.length - 5)
-    ];
+    ], head = _ref[0], tail = _ref[1];
     return [
-      transparent(colorPalette[0]),
-      ...head,
-      ...tail,
+      transparent(colorPalette[0])
+    ].concat(_to_consumable_array(head), _to_consumable_array(tail), [
       color2,
       transparent(colorPalette[colorPalette.length - 1])
-    ];
+    ]);
   }, lightColor = "hsl(0, 0%, 9.0%)", lightPalette = [
     lightTransparent,
     "#fff",
@@ -84,24 +164,22 @@ const colorTokens = {
     "#a5a5a5",
     darkColor,
     lightTransparent
-  ], lightPalettes = objectFromEntries(
-    objectKeys(colorTokens.light).map(
-      (key) => [`light_${key}`, getColorPalette(colorTokens.light[key], lightColor)]
-    )
-  ), darkPalettes = objectFromEntries(
-    objectKeys(colorTokens.dark).map(
-      (key) => [`dark_${key}`, getColorPalette(colorTokens.dark[key], darkColor)]
-    )
-  ), colorPalettes = {
-    ...lightPalettes,
-    ...darkPalettes
-  };
-  return {
+  ], lightPalettes = objectFromEntries(objectKeys(colorTokens.light).map(function(key) {
+    return [
+      "light_".concat(key),
+      getColorPalette(colorTokens.light[key], lightColor)
+    ];
+  })), darkPalettes = objectFromEntries(objectKeys(colorTokens.dark).map(function(key) {
+    return [
+      "dark_".concat(key),
+      getColorPalette(colorTokens.dark[key], darkColor)
+    ];
+  })), colorPalettes = _object_spread({}, lightPalettes, darkPalettes);
+  return _object_spread({
     light: lightPalette,
-    dark: darkPalette,
-    ...colorPalettes
-  };
-})(), templateColorsSpecific = {
+    dark: darkPalette
+  }, colorPalettes);
+}(), templateColorsSpecific = {
   color1: 1,
   color2: 2,
   color3: 3,
@@ -114,9 +192,8 @@ const colorTokens = {
   color10: 10,
   color11: 11,
   color12: 12
-}, templates = (() => {
-  const template = {
-    ...templateColorsSpecific,
+}, templates = function() {
+  var template = _object_spread_props(_object_spread({}, templateColorsSpecific), {
     // the background, color, etc keys here work like generics - they make it so you
     // can publish components for others to use without mandating a specific color scale
     // the @tamagui/button Button component looks for `$background`, so you set the
@@ -139,60 +216,50 @@ const colorTokens = {
     placeholderColor: -4,
     // in the future this should be partially transparent
     outlineColor: 5
-  };
+  });
   return {
     base: template,
-    colorLight: {
-      ...template,
+    colorLight: _object_spread_props(_object_spread({}, template), {
       // light color themes are a bit less sensitive
       borderColor: 4,
       borderColorHover: 5,
       borderColorFocus: 4,
       borderColorPress: 4
-    }
+    })
   };
-})(), maskOptions = (() => {
-  const shadows2 = {
+}(), maskOptions = function() {
+  var shadows2 = {
     shadowColor: 0,
     shadowColorHover: 0,
     shadowColorPress: 0,
     shadowColorFocus: 0
-  }, colors = {
-    ...shadows2,
+  }, colors = _object_spread_props(_object_spread({}, shadows2), {
     color: 0,
     colorHover: 0,
     colorFocus: 0,
     colorPress: 0
-  }, baseMaskOptions = {
+  }), baseMaskOptions = {
     override: shadows2,
     skip: shadows2,
     // avoids the transparent ends
     max: palettes.light.length - 2,
     min: 1
-  }, skipShadowsAndSpecificColors = {
-    ...shadows2,
-    ...templateColorsSpecific
-  };
+  }, skipShadowsAndSpecificColors = _object_spread({}, shadows2, templateColorsSpecific);
   return {
-    component: {
-      ...baseMaskOptions,
+    component: _object_spread_props(_object_spread({}, baseMaskOptions), {
       override: colors,
       skip: skipShadowsAndSpecificColors
-    },
-    alt: {
-      ...baseMaskOptions
-    },
-    button: {
-      ...baseMaskOptions,
-      override: {
-        ...colors,
+    }),
+    alt: _object_spread({}, baseMaskOptions),
+    button: _object_spread_props(_object_spread({}, baseMaskOptions), {
+      override: _object_spread_props(_object_spread({}, colors), {
         borderColor: "transparent",
         borderColorHover: "transparent"
-      },
+      }),
       skip: skipShadowsAndSpecificColors
-    }
+    })
   };
-})(), 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)", size = {
+}(), 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)", size = {
   $0: 0,
   "$0.25": 2,
   "$0.5": 4,
@@ -222,38 +289,26 @@ const colorTokens = {
   $18: 244,
   $19: 264,
   $20: 284
-}, spaces = Object.entries(size).map(([k, v]) => [k, sizeToSpace(v)]), spacesNegative = spaces.slice(1).map(([k, v]) => [`-${k.slice(1)}`, -v]), space = {
-  ...Object.fromEntries(spaces),
-  ...Object.fromEntries(spacesNegative)
-}, zIndex = {
+}, spaces = Object.entries(size).map(function(param) {
+  var _param = _sliced_to_array(param, 2), k = _param[0], v = _param[1];
+  return [
+    k,
+    sizeToSpace(v)
+  ];
+}), spacesNegative = spaces.slice(1).map(function(param) {
+  var _param = _sliced_to_array(param, 2), k = _param[0], v = _param[1];
+  return [
+    "-".concat(k.slice(1)),
+    -v
+  ];
+}), space = _object_spread({}, Object.fromEntries(spaces), Object.fromEntries(spacesNegative)), zIndex = {
   0: 0,
   1: 100,
   2: 200,
   3: 300,
   4: 400,
   5: 500
-}, darkColors = {
-  ...colorTokens.dark.blue,
-  ...colorTokens.dark.gray,
-  ...colorTokens.dark.green,
-  ...colorTokens.dark.orange,
-  ...colorTokens.dark.pink,
-  ...colorTokens.dark.purple,
-  ...colorTokens.dark.red,
-  ...colorTokens.dark.yellow
-}, lightColors = {
-  ...colorTokens.light.blue,
-  ...colorTokens.light.gray,
-  ...colorTokens.light.green,
-  ...colorTokens.light.orange,
-  ...colorTokens.light.pink,
-  ...colorTokens.light.purple,
-  ...colorTokens.light.red,
-  ...colorTokens.light.yellow
-}, color = {
-  ...postfixObjKeys(lightColors, "Light"),
-  ...postfixObjKeys(darkColors, "Dark")
-}, radius = {
+}, darkColors = _object_spread({}, colorTokens.dark.blue, colorTokens.dark.gray, colorTokens.dark.green, colorTokens.dark.orange, colorTokens.dark.pink, colorTokens.dark.purple, colorTokens.dark.red, colorTokens.dark.yellow), lightColors = _object_spread({}, colorTokens.light.blue, colorTokens.light.gray, colorTokens.light.green, colorTokens.light.orange, colorTokens.light.pink, colorTokens.light.purple, colorTokens.light.red, colorTokens.light.yellow), color = _object_spread({}, postfixObjKeys(lightColors, "Light"), postfixObjKeys(darkColors, "Dark")), radius = {
   0: 0,
   1: 3,
   2: 5,
@@ -287,26 +342,22 @@ const colorTokens = {
     shadowColorPress: darkShadowColor,
     shadowColorFocus: darkShadowColor
   }
-}, colorThemeDefinition = (colorName) => [
-  {
-    parent: "light",
-    palette: colorName,
-    template: "colorLight"
-  },
-  {
-    parent: "dark",
-    palette: colorName,
-    template: "base"
-  }
-], nonInherited = {
-  light: {
-    ...lightColors,
-    ...shadows.light
-  },
-  dark: {
-    ...darkColors,
-    ...shadows.dark
-  }
+}, colorThemeDefinition = function(colorName) {
+  return [
+    {
+      parent: "light",
+      palette: colorName,
+      template: "colorLight"
+    },
+    {
+      parent: "dark",
+      palette: colorName,
+      template: "base"
+    }
+  ];
+}, nonInherited = {
+  light: _object_spread({}, lightColors, shadows.light),
+  dark: _object_spread({}, darkColors, shadows.dark)
 }, overlayThemeDefinitions = [
   {
     parent: "light",
@@ -341,128 +392,131 @@ const colorTokens = {
   red: colorThemeDefinition("red"),
   gray: colorThemeDefinition("gray")
 }).addChildThemes({
-  alt1: {
-    mask: "soften",
-    ...maskOptions.alt
-  },
-  alt2: {
-    mask: "soften2Border1",
-    ...maskOptions.alt
-  },
+  alt1: _object_spread({
+    mask: "soften"
+  }, maskOptions.alt),
+  alt2: _object_spread({
+    mask: "soften2Border1"
+  }, maskOptions.alt),
   active: {
     mask: "soften3FlatBorder",
     skip: {
       color: 1
     }
   }
-}).addChildThemes(
-  {
-    ListItem: [
-      {
-        parent: "light",
-        avoidNestingWithin: ["active"],
-        mask: "identity",
-        ...maskOptions.component
-      },
-      {
-        parent: "dark",
-        avoidNestingWithin: ["active"],
-        mask: "identity",
-        ...maskOptions.component
-      }
-    ],
-    Card: {
-      mask: "soften",
-      avoidNestingWithin: ["active"],
-      ...maskOptions.component
-    },
-    Button: {
-      mask: "soften2Border1",
-      ...maskOptions.component
-    },
-    Checkbox: {
-      mask: "softenBorder2",
-      ...maskOptions.component
-    },
-    Switch: {
-      mask: "soften2Border1",
-      ...maskOptions.component
-    },
-    SwitchThumb: {
-      mask: "inverseStrengthen2",
-      avoidNestingWithin: ["active"],
-      ...maskOptions.component
-    },
-    TooltipContent: {
-      mask: "soften2Border1",
-      avoidNestingWithin: ["active"],
-      ...maskOptions.component
-    },
-    DrawerFrame: {
-      mask: "soften",
-      avoidNestingWithin: ["active"],
-      ...maskOptions.component
-    },
-    Progress: {
-      mask: "soften",
-      avoidNestingWithin: ["active"],
-      ...maskOptions.component
-    },
-    RadioGroupItem: {
-      mask: "softenBorder2",
-      avoidNestingWithin: ["active"],
-      ...maskOptions.component
-    },
-    TooltipArrow: {
-      mask: "soften",
-      avoidNestingWithin: ["active"],
-      ...maskOptions.component
-    },
-    SliderTrackActive: {
-      mask: "inverseSoften",
-      ...maskOptions.component
-    },
-    SliderTrack: {
-      mask: "soften2Border1",
-      avoidNestingWithin: ["active"],
-      ...maskOptions.component
-    },
-    SliderThumb: {
-      mask: "inverse",
-      avoidNestingWithin: ["active"],
-      ...maskOptions.component
-    },
-    Tooltip: {
-      mask: "inverse",
-      avoidNestingWithin: ["active"],
-      ...maskOptions.component
-    },
-    ProgressIndicator: {
-      mask: "inverse",
-      avoidNestingWithin: ["active"],
-      ...maskOptions.component
-    },
-    SheetOverlay: overlayThemeDefinitions,
-    DialogOverlay: overlayThemeDefinitions,
-    ModalOverlay: overlayThemeDefinitions,
-    Input: {
-      mask: "softenBorder2",
-      ...maskOptions.component
-    },
-    TextArea: {
-      mask: "softenBorder2",
-      ...maskOptions.component
-    }
-  },
-  {
-    // to save bundle size but make alt themes not work on components
-    // avoidNestingWithin: ['alt1', 'alt2'],
-  }
-), themesIn = themeBuilder.build(), themes = themesIn;
+}).addChildThemes({
+  ListItem: [
+    _object_spread({
+      parent: "light",
+      avoidNestingWithin: [
+        "active"
+      ],
+      mask: "identity"
+    }, maskOptions.component),
+    _object_spread({
+      parent: "dark",
+      avoidNestingWithin: [
+        "active"
+      ],
+      mask: "identity"
+    }, maskOptions.component)
+  ],
+  Card: _object_spread({
+    mask: "soften",
+    avoidNestingWithin: [
+      "active"
+    ]
+  }, maskOptions.component),
+  Button: _object_spread({
+    mask: "soften2Border1"
+  }, maskOptions.component),
+  Checkbox: _object_spread({
+    mask: "softenBorder2"
+  }, maskOptions.component),
+  Switch: _object_spread({
+    mask: "soften2Border1"
+  }, maskOptions.component),
+  SwitchThumb: _object_spread({
+    mask: "inverseStrengthen2",
+    avoidNestingWithin: [
+      "active"
+    ]
+  }, maskOptions.component),
+  TooltipContent: _object_spread({
+    mask: "soften2Border1",
+    avoidNestingWithin: [
+      "active"
+    ]
+  }, maskOptions.component),
+  DrawerFrame: _object_spread({
+    mask: "soften",
+    avoidNestingWithin: [
+      "active"
+    ]
+  }, maskOptions.component),
+  Progress: _object_spread({
+    mask: "soften",
+    avoidNestingWithin: [
+      "active"
+    ]
+  }, maskOptions.component),
+  RadioGroupItem: _object_spread({
+    mask: "softenBorder2",
+    avoidNestingWithin: [
+      "active"
+    ]
+  }, maskOptions.component),
+  TooltipArrow: _object_spread({
+    mask: "soften",
+    avoidNestingWithin: [
+      "active"
+    ]
+  }, maskOptions.component),
+  SliderTrackActive: _object_spread({
+    mask: "inverseSoften"
+  }, maskOptions.component),
+  SliderTrack: _object_spread({
+    mask: "soften2Border1",
+    avoidNestingWithin: [
+      "active"
+    ]
+  }, maskOptions.component),
+  SliderThumb: _object_spread({
+    mask: "inverse",
+    avoidNestingWithin: [
+      "active"
+    ]
+  }, maskOptions.component),
+  Tooltip: _object_spread({
+    mask: "inverse",
+    avoidNestingWithin: [
+      "active"
+    ]
+  }, maskOptions.component),
+  ProgressIndicator: _object_spread({
+    mask: "inverse",
+    avoidNestingWithin: [
+      "active"
+    ]
+  }, maskOptions.component),
+  SheetOverlay: overlayThemeDefinitions,
+  DialogOverlay: overlayThemeDefinitions,
+  ModalOverlay: overlayThemeDefinitions,
+  Input: _object_spread({
+    mask: "softenBorder2"
+  }, maskOptions.component),
+  TextArea: _object_spread({
+    mask: "softenBorder2"
+  }, maskOptions.component)
+}, {}), themesIn = themeBuilder.build(), themes = themesIn;
 function postfixObjKeys(obj, postfix) {
-  return Object.fromEntries(
-    Object.entries(obj).map(([k, v]) => [`${k}${postfix}`, v])
-  );
+  return Object.fromEntries(Object.entries(obj).map(function(param) {
+    var _param = _sliced_to_array(param, 2), k = _param[0], v = _param[1];
+    return [
+      "".concat(k).concat(postfix),
+      v
+    ];
+  }));
 }
 function sizeToSpace(v) {
   return v === 0 ? 0 : v === 2 ? 0.5 : v === 4 ? 1 : v === 8 ? 1.5 : v <= 16 ? Math.round(v * 0.333) : Math.floor(v * 0.7 - 12);