@tamagui/core 1.0.1-beta.19 → 1.0.1-beta.190

package/dist/jsx/createTamagui.js

@@ -1,201 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { configListeners, getHasConfigured, setConfig } from "./conf";
-import { THEME_CLASSNAME_PREFIX } from "./constants/constants";
-import { isWeb } from "./constants/platform";
-import { Variable, createCSSVariable, createVariable, isVariable } from "./createVariable";
-import { createTamaguiProvider } from "./helpers/createTamaguiProvider";
-import { getInsertedRules } from "./helpers/insertStyleRule";
-import { configureMedia } from "./hooks/useMedia";
-const createdConfigs = /* @__PURE__ */ new WeakMap();
-function createTamagui(config) {
-  if (createdConfigs.has(config)) {
-    return config;
-  }
-  if (process.env.NODE_ENV === "development") {
-    if (!config.tokens) {
-      throw new Error(`No tokens provided to Tamagui config`);
-    }
-    if (!config.themes) {
-      throw new Error(`No themes provided to Tamagui config`);
-    }
-  }
-  if (getHasConfigured()) {
-    console.warn("Called createTamagui twice! Should never do so");
-  }
-  configureMedia({
-    queries: config.media,
-    defaultActive: config.mediaQueryDefaultActive
-  });
-  const themeConfig = (() => {
-    var _a, _b, _c;
-    let cssRules = [];
-    const varsByValue = /* @__PURE__ */ new Map();
-    if (isWeb) {
-      const tokenRules = /* @__PURE__ */ new Set();
-      const addVar = /* @__PURE__ */ __name((v) => {
-        varsByValue[v.val] = v;
-        const rule = `--${createCSSVariable(v.name, false)}:${typeof v.val === "number" ? `${v.val}px` : v.val}`;
-        tokenRules.add(rule);
-      }, "addVar");
-      for (const key in config.tokens) {
-        for (const skey in config.tokens[key]) {
-          const val = config.tokens[key][skey];
-          if (key === "font") {
-            for (const fkey in val) {
-              if (fkey === "family") {
-                addVar(val[fkey]);
-              } else {
-                for (const fskey in val[fkey]) {
-                  addVar(val[fkey][fskey]);
-                }
-              }
-            }
-          } else {
-            addVar(val);
-          }
-        }
-      }
-      const sep = process.env.NODE_ENV === "development" ? config.cssStyleSeparator || " " : "";
-      cssRules.push(`:root {${sep}${[...tokenRules].join(`;${sep}`)}${sep}}`);
-    }
-    const hasDarkLight = "light" in config.themes && "dark" in config.themes;
-    const CNP = `.${THEME_CLASSNAME_PREFIX}`;
-    for (const themeName in config.themes) {
-      const theme = { ...config.themes[themeName] };
-      config.themes[themeName] = theme;
-      let vars = "";
-      for (const themeKey in theme) {
-        if (isWeb) {
-          const val = theme[themeKey];
-          const varName = val instanceof Variable ? val.name : (_a = varsByValue[val]) == null ? void 0 : _a.name;
-          vars += `--${themeKey}:${varName ? createCSSVariable(varName) : `${val}`};`;
-        }
-        ensureThemeVariable(theme, themeKey);
-      }
-      if (isWeb) {
-        const isDarkOrLightBase = themeName === "dark" || themeName === "light";
-        const isDark = themeName.startsWith("dark");
-        const selector = `${CNP}${themeName}`;
-        const selectors = [selector];
-        if (hasDarkLight) {
-          const childSelector = `${CNP}${themeName.replace("dark_", "").replace("light_", "")}`;
-          const order = isDark ? ["dark", "light"] : ["light", "dark"];
-          if (isDarkOrLightBase) {
-            order.reverse();
-          }
-          const [stronger, weaker] = order;
-          const max = (_b = config.maxDarkLightNesting) != null ? _b : 3;
-          new Array(max * 2).fill(void 0).forEach((_, pi) => {
-            if (pi % 2 === 1)
-              return;
-            const parents = new Array(pi + 1).fill(void 0).map((_2, psi) => {
-              return `${CNP}${psi % 2 === 0 ? stronger : weaker}`;
-            });
-            selectors.push(`${(parents.length > 1 ? parents.slice(1) : parents).join(" ")} ${childSelector}`);
-          });
-        }
-        const rootSep = config.themeClassNameOnRoot ? "" : " ";
-        cssRules.push(`${selectors.map((x) => `:root${rootSep}${x}`).join(", ")} {${vars}}`);
-        if ((_c = config.shouldAddPrefersColorThemes) != null ? _c : true) {
-          if (isDarkOrLightBase) {
-            cssRules.push(`@media(prefers-color-scheme: ${isDark ? "dark" : "light"}) {
-    body { background:${theme.background}; color: ${theme.color} }
-    :root {${vars} } 
-  }`);
-          }
-        }
-      }
-    }
-    varsByValue.clear();
-    Object.freeze(cssRules);
-    const css = cssRules.join("\n");
-    return {
-      cssRules,
-      css
-    };
-  })();
-  const tokensParsed = parseTokens(config.tokens);
-  const fontsParsed = (() => {
-    if (!config.fonts) {
-      throw new Error(`No fonts defined!`);
-    }
-    const res = {};
-    for (const familyName in config.fonts) {
-      const family = config.fonts[familyName];
-      const parsed = {};
-      for (const attrKey in family) {
-        const attr = family[attrKey];
-        if (attrKey === "family") {
-          parsed[attrKey] = attr;
-          continue;
-        }
-        parsed[attrKey] = Object.keys(attr).reduce((acc, cur) => {
-          acc[`$${cur}`] = attr[cur];
-          return acc;
-        }, {});
-      }
-      res[`$${familyName}`] = parsed;
-    }
-    return res;
-  })();
-  const getCSS = /* @__PURE__ */ __name(() => {
-    return `${themeConfig.css}
-${getInsertedRules().join("\n")}`;
-  }, "getCSS");
-  const next = {
-    fonts: {},
-    animations: {},
-    shorthands: {},
-    media: {},
-    ...config,
-    Provider: createTamaguiProvider({
-      getCSS,
-      defaultTheme: "light",
-      ...config
-    }),
-    fontsParsed,
-    themeConfig,
-    tokensParsed,
-    parsed: true,
-    getCSS
-  };
-  setConfig(next);
-  if (configListeners.size) {
-    configListeners.forEach((cb) => cb(next));
-    configListeners.clear();
-  }
-  createdConfigs.set(next, true);
-  return next;
-}
-__name(createTamagui, "createTamagui");
-const parseTokens = /* @__PURE__ */ __name((tokens) => {
-  const res = {};
-  for (const key in tokens) {
-    res[key] = {};
-    for (const skey in tokens[key]) {
-      res[key][`$${skey}`] = tokens[key][skey];
-    }
-  }
-  return res;
-}, "parseTokens");
-function ensureThemeVariable(theme, key) {
-  const val = theme[key];
-  if (!isVariable(val)) {
-    theme[key] = createVariable({
-      name: key,
-      val
-    });
-  } else {
-    if (val.name !== key) {
-      theme[key] = createVariable({
-        name: key,
-        val: val.val
-      });
-    }
-  }
-}
-__name(ensureThemeVariable, "ensureThemeVariable");
-export {
-  createTamagui
-};

package/dist/jsx/createTheme.js

@@ -1,6 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-const createTheme = /* @__PURE__ */ __name((theme) => theme, "createTheme");
-export {
-  createTheme
-};

package/dist/jsx/createTokens.js

@@ -1,28 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { createVariable } from "./createVariable";
-import { validateTokens } from "./helpers/validate";
-function createTokens(tokens) {
-  if (process.env.NODE_ENV === "development") {
-    validateTokens(tokens);
-  }
-  return mapTokensToVariables(tokens);
-}
-__name(createTokens, "createTokens");
-const mapTokensToVariables = /* @__PURE__ */ __name((tokens, parentPath = "") => {
-  const res = {};
-  for (const key in tokens) {
-    let val = tokens[key];
-    const name = parentPath ? `${parentPath}-${key}` : key;
-    if (val && typeof val === "object") {
-      res[key] = mapTokensToVariables(tokens[key], name);
-    } else {
-      res[key] = createVariable({ val, name });
-    }
-  }
-  return res;
-}, "mapTokensToVariables");
-export {
-  createTokens,
-  mapTokensToVariables
-};

package/dist/jsx/createVariable.js

@@ -1,48 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-var _a;
-import { isWeb } from "./constants/platform";
-const IS_VARIABLE_SYMBOL = "__isVariable__";
-class Variable {
-  constructor({ val, name }) {
-    this[_a] = true;
-    this.val = isVariable(val) ? val.val : val;
-    this.name = name;
-    this.variable = isWeb ? createCSSVariable(name) : this.val;
-  }
-  toString() {
-    return `${isWeb ? this.variable : this.val}`;
-  }
-}
-__name(Variable, "Variable");
-_a = IS_VARIABLE_SYMBOL;
-const createVariable = /* @__PURE__ */ __name((props) => new Variable(props), "createVariable");
-function isVariable(v) {
-  return v instanceof Variable || v && v[IS_VARIABLE_SYMBOL];
-}
-__name(isVariable, "isVariable");
-function getVariableValue(v) {
-  if (isVariable(v))
-    return v.val;
-  return v;
-}
-__name(getVariableValue, "getVariableValue");
-function getVariableName(v) {
-  if (isVariable(v))
-    return v.name;
-  return v;
-}
-__name(getVariableName, "getVariableName");
-const createCSSVariable = /* @__PURE__ */ __name((val, includeVar = true) => {
-  const name = val.replace(/[^a-z0-9\_\-]+/i, "_");
-  return includeVar ? `var(--${name})` : name;
-}, "createCSSVariable");
-export {
-  IS_VARIABLE_SYMBOL,
-  Variable,
-  createCSSVariable,
-  createVariable,
-  getVariableName,
-  getVariableValue,
-  isVariable
-};

package/dist/jsx/helpers/RNComponents.js

@@ -1,11 +0,0 @@
-import * as ReactNative from "react-native";
-const RNComponents = /* @__PURE__ */ new WeakMap();
-for (const key of ["Image", "TextInput", "Text", "View"]) {
-  const val = ReactNative[key];
-  if (val && typeof val === "object") {
-    RNComponents.set(val, true);
-  }
-}
-export {
-  RNComponents
-};

package/dist/jsx/helpers/addStylesUsingClassname.js

@@ -1,63 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { useInsertionEffect } from "react";
-import { getStylesAtomic } from "./getStylesAtomic";
-import { insertStyleRule, updateInsertedCache } from "./insertStyleRule";
-let added = /* @__PURE__ */ new Set();
-function useStylesAsClassname(styles, disable = false, debug = false) {
-  if (!useInsertionEffect) {
-    return addStylesUsingClassname(disable ? styles : [], debug);
-  } else {
-    const insertions = [];
-    const className = addStylesUsingClassname(disable ? [] : styles, debug, (identifier, rules) => {
-      for (const rule of rules) {
-        insertions.push({ identifier, rule });
-      }
-    });
-    for (const { identifier, rule } of insertions) {
-      updateInsertedCache(identifier, rule);
-    }
-    useInsertionEffect(() => {
-      for (const { identifier, rule } of insertions) {
-        insertStyleRule(identifier, rule);
-      }
-    });
-    return className;
-  }
-}
-__name(useStylesAsClassname, "useStylesAsClassname");
-function addStylesUsingClassname(styles, debug = false, onAdd) {
-  let className = "";
-  for (const style of styles) {
-    if (!style)
-      continue;
-    if (Array.isArray(style)) {
-      className += " " + addStylesUsingClassname(style);
-      continue;
-    }
-    const atomicStyles = getStylesAtomic(style);
-    if (process.env.NODE_ENV === "development") {
-      if (debug === "verbose") {
-        console.log(" atomicStyles ", atomicStyles);
-      }
-    }
-    for (const { identifier, rules } of atomicStyles) {
-      className += ` ${identifier}`;
-      if (added.has(identifier)) {
-        continue;
-      }
-      added.add(identifier);
-      if (onAdd) {
-        onAdd(identifier, rules);
-      } else {
-        insertStyleRule(identifier, rules[0]);
-      }
-    }
-  }
-  return className;
-}
-__name(addStylesUsingClassname, "addStylesUsingClassname");
-export {
-  addStylesUsingClassname,
-  useStylesAsClassname
-};

package/dist/jsx/helpers/areEqualSets.js

@@ -1,15 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-const areEqualSets = /* @__PURE__ */ __name((a, b) => {
-  if (a.size !== b.size)
-    return false;
-  for (const val in a) {
-    if (!b.has(val)) {
-      return false;
-    }
-  }
-  return true;
-}, "areEqualSets");
-export {
-  areEqualSets
-};

package/dist/jsx/helpers/createMediaStyle.js

@@ -1,30 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { mediaObjectToString } from "../hooks/useMedia";
-const MEDIA_SEP = "_";
-const createMediaStyle = /* @__PURE__ */ __name(({ identifier, rules }, mediaKey, mediaQueries, negate, importance) => {
-  const mediaKeys = Object.keys(mediaQueries);
-  const importance_ = Math.max(0, importance == void 0 ? mediaKeys.indexOf(mediaKey) : importance || 0);
-  const precendencePrefix = new Array(importance_ + 1).fill(":root").join("");
-  const negKey = negate ? "0" : "";
-  const ogPrefix = identifier.slice(0, identifier.indexOf("-") + 1);
-  const nextIdentifier = `${identifier.replace(ogPrefix, `${ogPrefix}${MEDIA_SEP}${mediaKey}${negKey}${MEDIA_SEP}`)}`;
-  const screenStr = negate ? "not all" : "screen";
-  const mediaSelector = mediaObjectToString(mediaQueries[mediaKey]);
-  const mediaQuery = `${screenStr} and ${mediaSelector}`;
-  const styleInner = rules[0].replace(identifier, nextIdentifier);
-  let styleRule = "";
-  if (styleInner.includes("@media")) {
-    styleRule = styleInner.replace("{", ` and ${mediaQuery} {`);
-  } else {
-    styleRule = `@media ${mediaQuery} { ${precendencePrefix} ${styleInner} }`;
-  }
-  return {
-    styleRule,
-    identifier: nextIdentifier
-  };
-}, "createMediaStyle");
-export {
-  MEDIA_SEP,
-  createMediaStyle
-};

package/dist/jsx/helpers/createPropMapper.js

@@ -1,237 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { getConfig } from "../conf";
-import { isWeb } from "../constants/platform";
-import { isVariable } from "../createVariable";
-import { isObj } from "./isObj";
-function getVariantFunction(variant, key, value) {
-  if (typeof variant === "function") {
-    return variant;
-  }
-  for (const cat in tokenCategories) {
-    if (key in tokenCategories[cat]) {
-      const spreadVariant = variant[`...${cat}`];
-      if (spreadVariant) {
-        return spreadVariant;
-      }
-    }
-  }
-  let fn;
-  if (typeof value === "number") {
-    fn = variant[":number"];
-  } else if (typeof value === "string") {
-    fn = variant[":string"];
-  } else if (value === true || value === false) {
-    fn = variant[":boolean"];
-  }
-  fn = fn || variant[value];
-  return fn || variant["..."] || variant["...size"];
-}
-__name(getVariantFunction, "getVariantFunction");
-const createPropMapper = /* @__PURE__ */ __name((staticConfig) => {
-  const variants = staticConfig.variants || {};
-  const defaultProps = staticConfig.defaultProps || {};
-  return (key, value, theme, props, returnVariablesAs = !!props.animation ? "value" : "auto", avoidDefaultProps = false) => {
-    const conf = getConfig();
-    if (!conf) {
-      console.trace("no conf! err");
-      return;
-    }
-    const fontFamily = props.fontFamily || defaultProps.fontFamily || "$body";
-    const variant = variants && variants[key];
-    if (variant && value !== void 0) {
-      let variantValue = getVariantFunction(variant, key, value);
-      if (variantValue) {
-        if (typeof variantValue === "function") {
-          const fn = variantValue;
-          variantValue = fn(value, {
-            fonts: conf.fontsParsed,
-            tokens: conf.tokensParsed,
-            theme,
-            props: avoidDefaultProps ? props : new Proxy(props, {
-              get(target, key2) {
-                if (Reflect.has(target, key2)) {
-                  return Reflect.get(target, key2);
-                }
-                if (defaultProps) {
-                  return Reflect.get(defaultProps, key2);
-                }
-              }
-            })
-          });
-        }
-        if (isObj(variantValue)) {
-          variantValue = resolveTokens(variantValue, conf, theme, fontFamily, returnVariablesAs);
-        }
-        return expansions(variantValue);
-      }
-    }
-    let shouldReturn = false;
-    if (conf.shorthands[key]) {
-      shouldReturn = true;
-      key = conf.shorthands[key];
-    }
-    if (value) {
-      shouldReturn = true;
-      if (value[0] === "$") {
-        value = getToken(key, value, conf, theme, fontFamily, returnVariablesAs);
-      } else if (isVariable(value)) {
-        value = getVariableValue(value, returnVariablesAs);
-      }
-    }
-    if (shouldReturn) {
-      return expansions({
-        [key]: value
-      });
-    }
-  };
-}, "createPropMapper");
-const resolveTokens = /* @__PURE__ */ __name((input, conf, theme, fontFamily, resolveAs) => {
-  var _a;
-  let res = {};
-  for (const rKey in input) {
-    const fKey = conf.shorthands[rKey] || rKey;
-    const val = input[rKey];
-    if (isVariable(val)) {
-      res[fKey] = resolveAs === "variable" ? val : !isWeb || resolveAs === "value" ? val.val : val.variable;
-    } else if (typeof val === "string") {
-      const fVal = val[0] === "$" ? getToken(fKey, val, conf, theme, fontFamily, resolveAs) : val;
-      res[fKey] = fVal;
-    } else {
-      if (isObj(val)) {
-        res[fKey] = resolveTokens(val, conf, theme, fontFamily, resolveAs);
-      } else {
-        res[fKey] = input[fKey];
-      }
-    }
-    if (process.env.NODE_ENV === "development") {
-      if (((_a = res[fKey]) == null ? void 0 : _a[0]) === "$") {
-        console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey]);
-      }
-    }
-  }
-  return res;
-}, "resolveTokens");
-const fontShorthand = {
-  fontSize: "size",
-  fontWeight: "weight"
-};
-const getToken = /* @__PURE__ */ __name((key, value, { tokensParsed, fontsParsed }, theme, fontFamily = "$body", resolveAs) => {
-  var _a, _b, _c;
-  let valOrVar;
-  let hasSet = false;
-  if (value in theme) {
-    valOrVar = theme[value];
-    hasSet = true;
-  } else {
-    switch (key) {
-      case "fontFamily":
-        valOrVar = ((_a = fontsParsed[value]) == null ? void 0 : _a.family) || value;
-        hasSet = true;
-        break;
-      case "fontSize":
-      case "lineHeight":
-      case "letterSpacing":
-      case "fontWeight":
-        valOrVar = ((_c = (_b = fontsParsed[fontFamily]) == null ? void 0 : _b[fontShorthand[key] || key]) == null ? void 0 : _c[value]) || value;
-        hasSet = true;
-        break;
-    }
-    for (const cat in tokenCategories) {
-      if (key in tokenCategories[cat]) {
-        const res = tokensParsed[cat][value];
-        if (res) {
-          valOrVar = res;
-          hasSet = true;
-        }
-      }
-    }
-    if (!hasSet) {
-      const spaceVar = tokensParsed.space[value];
-      if (spaceVar) {
-        valOrVar = spaceVar;
-        hasSet = true;
-      }
-    }
-  }
-  if (hasSet) {
-    return getVariableValue(valOrVar, resolveAs);
-  }
-  if (process.env.NODE_ENV === "development") {
-    if (value && value[0] === "$") {
-      console.warn(`\u26A0\uFE0F Missing token:`, key, value, fontFamily, theme, fontsParsed);
-      return null;
-    }
-  }
-  return value;
-}, "getToken");
-function getVariableValue(valOrVar, resolveAs = "auto") {
-  if (isVariable(valOrVar)) {
-    if (resolveAs === "variable") {
-      return valOrVar;
-    }
-    if (!isWeb || resolveAs === "value") {
-      return valOrVar.val;
-    }
-    return valOrVar.variable;
-  }
-  return valOrVar;
-}
-__name(getVariableValue, "getVariableValue");
-const tokenCategories = {
-  radius: {
-    borderRadius: true
-  },
-  size: {
-    width: true,
-    height: true,
-    minWidth: true,
-    minHeight: true,
-    maxWidth: true,
-    maxHeight: true
-  },
-  color: {
-    color: true,
-    backgroundColor: true,
-    borderColor: true,
-    borderBottomColor: true,
-    borderTopColor: true,
-    borderLeftColor: true,
-    borderRightColor: true
-  }
-};
-const sidesX = ["Left", "Right"];
-const sidesY = ["Top", "Bottom"];
-const sidesXY = [...sidesX, ...sidesY];
-const expand = {
-  padding: sidesXY.map((x) => `padding${x}`),
-  paddingHorizontal: sidesX.map((x) => `padding${x}`),
-  paddingVertical: sidesY.map((x) => `padding${x}`),
-  margin: sidesXY.map((x) => `margin${x}`),
-  marginHorizontal: sidesX.map((x) => `margin${x}`),
-  marginVertical: sidesY.map((x) => `margin${x}`),
-  borderWidth: sidesXY.map((x) => `border${x}Width`)
-};
-function expansions(styleObj) {
-  var _a, _b;
-  for (const key in expand) {
-    if (key in styleObj) {
-      for (const expandKey of expand[key]) {
-        styleObj[expandKey] = styleObj[key];
-      }
-      delete styleObj[key];
-    }
-  }
-  if ("flex" in styleObj) {
-    if (typeof styleObj.flex === "number") {
-      styleObj.flexGrow = (_a = styleObj.flexGrow) != null ? _a : styleObj.flex;
-      styleObj.flexShrink = (_b = styleObj.flexShrink) != null ? _b : 1;
-      delete styleObj.flex;
-    }
-  }
-  return styleObj;
-}
-__name(expansions, "expansions");
-export {
-  createPropMapper
-};

package/dist/jsx/helpers/createShallowUpdate.js

@@ -1,18 +0,0 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-function createShallowUpdate(setter) {
-  return (next) => {
-    setter((prev) => {
-      for (const key in next) {
-        if (prev[key] !== next[key]) {
-          return { ...prev, ...next };
-        }
-      }
-      return prev;
-    });
-  };
-}
-__name(createShallowUpdate, "createShallowUpdate");
-export {
-  createShallowUpdate
-};