@tamagui/core 1.0.1-beta.98 → 1.0.1-rc.0

package/dist/esm/createTamagui.js

@@ -1,61 +1,39 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-import { configListeners, getHasConfigured, setConfig } from "./conf";
-import { THEME_CLASSNAME_PREFIX } from "./constants/constants";
-import { isWeb } from "./constants/platform";
-import { createVariable, isVariable } from "./createVariable";
+import { isRSC, isWeb } from "@tamagui/constants";
+import { configListeners, setConfig } from "./config";
 import { createVariables } from "./createVariables";
-import { createTamaguiProvider } from "./helpers/createTamaguiProvider";
-import { getInsertedRules } from "./helpers/insertStyleRule";
+import { getThemeCSSRules } from "./helpers/getThemeCSSRules";
+import { getAllRules } from "./helpers/insertStyleRule";
 import {
   registerCSSVariable,
-  tokenRules,
-  tokensValueToVariable
+  tokensValueToVariable,
+  variableToCSS
 } from "./helpers/registerCSSVariable";
+import { ensureThemeVariable, proxyThemeToParents } from "./helpers/themes";
 import { configureMedia } from "./hooks/useMedia";
 import { parseFont, registerFontVariables } from "./insertFont";
 import { Tamagui } from "./Tamagui";
 const createdConfigs = /* @__PURE__ */ new WeakMap();
-function createTamagui(config) {
-  if (createdConfigs.has(config)) {
-    return config;
+function createTamagui(configIn) {
+  var _a;
+  if (createdConfigs.has(configIn)) {
+    return configIn;
   }
   if (process.env.NODE_ENV === "development") {
-    if (!config.tokens) {
-      throw new Error(`No tokens provided to Tamagui config`);
+    if (!configIn.tokens) {
+      throw new Error(`Must define tokens`);
     }
-    if (!config.themes) {
-      throw new Error(`No themes provided to Tamagui config`);
+    if (!configIn.themes) {
+      throw new Error(`Must define themes`);
     }
-    if (!config.fonts) {
-      throw new Error(`No fonts provided to Tamagui config`);
+    if (!configIn.fonts) {
+      throw new Error(`Must define fonts`);
     }
   }
-  if (getHasConfigured()) {
-    console.warn(`Warning: createTamagui called twice (maybe HMR)`);
-  }
-  configureMedia({
-    queries: config.media,
-    defaultActive: config.mediaQueryDefaultActive
-  });
-  const fontTokens = createVariables(config.fonts);
+  const fontTokens = Object.fromEntries(
+    Object.entries(configIn.fonts).map(([k, v]) => {
+      return [k, createVariables(v, "f", true)];
+    })
+  );
   const fontsParsed = (() => {
     const res = {};
     for (const familyName in fontTokens) {
@@ -64,24 +42,41 @@ function createTamagui(config) {
     return res;
   })();
   const themeConfig = (() => {
-    const themes = __spreadValues({}, config.themes);
-    let cssRules = [];
+    const themes = { ...configIn.themes };
+    const cssRuleSets = [];
     if (isWeb) {
-      for (const key in config.tokens) {
-        for (const skey in config.tokens[key]) {
-          const val = config.tokens[key][skey];
+      let declarationsToRuleSet2 = function(decs, selector = "") {
+        return `:root${selector} {${sep}${[...decs].join(`;${sep}`)}${sep}}`;
+      };
+      var declarationsToRuleSet = declarationsToRuleSet2;
+      const declarations = [];
+      const fontDeclarations = {};
+      for (const key in configIn.tokens) {
+        for (const skey in configIn.tokens[key]) {
+          const val = configIn.tokens[key][skey];
           registerCSSVariable(val);
+          declarations.push(variableToCSS(val));
         }
       }
       for (const key in fontsParsed) {
         const fontParsed = fontsParsed[key];
-        registerFontVariables(fontParsed);
+        const [name, language] = key.includes("_") ? key.split("_") : [key];
+        const fontVars = registerFontVariables(fontParsed);
+        fontDeclarations[key] = { name: name.slice(1), declarations: fontVars, language };
+      }
+      const sep = process.env.NODE_ENV === "development" ? configIn.cssStyleSeparator || " " : "";
+      cssRuleSets.push(declarationsToRuleSet2(declarations));
+      if (fontDeclarations) {
+        for (const key in fontDeclarations) {
+          const { name, declarations: declarations2, language = "default" } = fontDeclarations[key];
+          const fontSelector = `.font_${name}`;
+          const langSelector = `:root .t_lang-${name}-${language} ${fontSelector}`;
+          const selectors = language === "default" ? ` ${fontSelector}, ${langSelector}` : langSelector;
+          const specificRuleSet = declarationsToRuleSet2(declarations2, selectors);
+          cssRuleSets.push(specificRuleSet);
+        }
       }
-      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}`;
     const dedupedThemes = {};
     const existing = /* @__PURE__ */ new WeakMap();
     for (const themeName in themes) {
@@ -92,7 +87,7 @@ function createTamagui(config) {
         e.names.push(themeName);
         continue;
       }
-      const theme = __spreadValues({}, config.themes[themeName]);
+      const theme = { ...rawTheme };
       for (const key in theme) {
         ensureThemeVariable(theme, key);
       }
@@ -101,169 +96,77 @@ function createTamagui(config) {
         names: [themeName],
         theme
       };
-      existing.set(config.themes[themeName], dedupedThemes[themeName]);
+      existing.set(rawTheme, dedupedThemes[themeName]);
     }
-    if (isWeb) {
+    let themeRuleSets = [];
+    if (isWeb || isRSC) {
       for (const themeName in dedupedThemes) {
-        const { theme, names } = dedupedThemes[themeName];
-        let vars = "";
-        for (const themeKey in theme) {
-          const variable = theme[themeKey];
-          let value = null;
-          if (variable.isFloating || !tokensValueToVariable.has(variable.val)) {
-            value = variable.val;
-          } else {
-            value = tokensValueToVariable.get(variable.val).variable;
-          }
-          vars += `--${themeKey}:${value};`;
-        }
-        const isDarkOrLightBase = themeName === "dark" || themeName === "light";
-        const selectors = names.map((name) => {
-          return `${CNP}${name}`;
-        });
-        if (hasDarkLight) {
-          for (const subName of names) {
-            const isDark = isDarkOrLightBase || subName.startsWith("dark_");
-            const childSelector = `${CNP}${subName.replace(isDark ? "dark_" : "light_", "")}`;
-            const order = isDark ? ["dark", "light"] : ["light", "dark"];
-            if (isDarkOrLightBase) {
-              order.reverse();
-            }
-            const [stronger, weaker] = order;
-            const max = config.maxDarkLightNesting ?? 3;
-            new Array(Math.round(max * 1.5)).fill(void 0).forEach((_, pi) => {
-              const isOdd = pi % 2 === 1;
-              if (isOdd && pi < 3)
-                return;
-              const parents = new Array(pi + 1).fill(void 0).map((_2, psi) => {
-                return `${CNP}${psi % 2 === 0 ? stronger : weaker}`;
-              });
-              let parentSelectors = parents.length > 1 ? parents.slice(1) : parents;
-              if (isOdd) {
-                const [_first, second, ...rest] = parentSelectors;
-                parentSelectors = [second, ...rest, second];
-              }
-              selectors.push(`${parentSelectors.join(" ")} ${childSelector}`);
-            });
-          }
-        }
-        const rootSep = config.themeClassNameOnRoot ? "" : " ";
-        const css2 = `${selectors.map((x) => `:root${rootSep}${x}`).join(", ")} {${vars}}`;
-        cssRules.push(css2);
-        if (config.shouldAddPrefersColorThemes && isDarkOrLightBase) {
-          const isDark = themeName.startsWith("dark");
-          cssRules.push(`@media(prefers-color-scheme: ${isDark ? "dark" : "light"}) {
-      body { background:${theme.background}; color: ${theme.color} }
-      :root {${vars} } 
-    }`);
-        }
+        themeRuleSets = [
+          ...themeRuleSets,
+          ...getThemeCSSRules({
+            config: configIn,
+            themeName,
+            ...dedupedThemes[themeName]
+          })
+        ];
       }
     }
     for (const themeName in themes) {
-      const cur = [];
-      const parents = themeName.split("_").slice(0, -1).map((part) => {
-        cur.push(part);
-        return cur.join("_");
-      });
-      if (!parents.length)
-        continue;
-      themes[themeName] = new Proxy(themes[themeName], {
-        get(target, key) {
-          if (Reflect.has(target, key)) {
-            return Reflect.get(target, key);
-          }
-          for (let i = parents.length - 1; i >= 0; i--) {
-            const parent = themes[parents[i]];
-            if (!parent) {
-              continue;
-            }
-            if (Reflect.has(parent, key)) {
-              return Reflect.get(parent, key);
-            }
-          }
-        }
-      });
+      themes[themeName] = proxyThemeToParents(themeName, themes[themeName], themes);
     }
     tokensValueToVariable.clear();
-    Object.freeze(cssRules);
-    const css = cssRules.join("\n");
     return {
       themes,
-      cssRules,
-      css
+      cssRuleSets,
+      themeRuleSets
     };
   })();
-  const tokensParsed = parseTokens(config.tokens);
-  const getCSS = () => {
-    return `${themeConfig.css}
-${getInsertedRules().join("\n")}`;
-  };
-  if (config.shorthands) {
-    for (const key in config.shorthands) {
-      reversedShorthands[config.shorthands[key]] = key;
-    }
-  }
-  const next = __spreadProps(__spreadValues({
-    defaultTheme: "light",
-    fonts: {},
+  const tokensParsed = Object.fromEntries(
+    Object.entries(configIn.tokens).map(([k, v]) => [
+      k,
+      Object.fromEntries(Object.entries(v).map(([k2, v2]) => [`$${k2}`, v2]))
+    ])
+  );
+  const shorthands = configIn.shorthands || {};
+  const config = {
+    fontLanguages: [],
     animations: {},
-    shorthands: {},
-    media: {}
-  }, config), {
+    media: {},
+    ...configIn,
+    shorthands: { ...shorthands },
+    inverseShorthands: shorthands ? Object.fromEntries(Object.entries(shorthands).map(([k, v]) => [v, k])) : {},
     themes: themeConfig.themes,
     fontsParsed,
     themeConfig,
     tokensParsed,
     parsed: true,
-    getCSS,
-    Provider: null
-  });
-  next.Provider = createTamaguiProvider(next);
-  setConfig(next);
+    getCSS: (separator = "\n") => {
+      return `
+      .is_Text .is_Text {display:inline-flex;}
+      ._dsp_contents {display:contents;}
+      ${themeConfig.cssRuleSets.join(separator)}
+      ${themeConfig.themeRuleSets.join(separator)}
+      ${getAllRules().join(separator)}`;
+    }
+  };
+  configureMedia(config);
+  setConfig(config);
   if (configListeners.size) {
-    configListeners.forEach((cb) => cb(next));
+    configListeners.forEach((cb) => cb(config));
     configListeners.clear();
   }
-  createdConfigs.set(next, true);
+  createdConfigs.set(config, true);
   if (process.env.NODE_ENV === "development") {
+    if ((_a = process.env.DEBUG) == null ? void 0 : _a.startsWith("tamagui")) {
+      console.log("Tamagui config:", config);
+    }
     if (!globalThis["Tamagui"]) {
       globalThis["Tamagui"] = Tamagui;
     }
   }
-  return next;
-}
-const reversedShorthands = {};
-const parseTokens = (tokens) => {
-  const res = {};
-  for (const key in tokens) {
-    res[key] = {};
-    for (const skey in tokens[key]) {
-      res[key][`$${skey}`] = tokens[key][skey];
-    }
-  }
-  return res;
-};
-function ensureThemeVariable(theme, key) {
-  const val = theme[key];
-  const themeKey = key;
-  if (!isVariable(val)) {
-    theme[key] = createVariable({
-      key: themeKey,
-      name: themeKey,
-      val
-    });
-  } else {
-    if (val.name !== themeKey) {
-      theme[key] = createVariable({
-        key: val.name,
-        name: themeKey,
-        val: val.val
-      });
-    }
-  }
+  return config;
 }
 export {
-  createTamagui,
-  reversedShorthands
+  createTamagui
 };
 //# sourceMappingURL=createTamagui.js.map

package/dist/esm/createTamagui.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/createTamagui.ts"],
-  "sourcesContent": ["import { configListeners, getHasConfigured, setConfig } from './conf'\nimport { THEME_CLASSNAME_PREFIX } from './constants/constants'\nimport { isWeb } from './constants/platform'\nimport { SpacerProps } from './createComponent'\nimport { Variable, createVariable, isVariable } from './createVariable'\nimport { createVariables } from './createVariables'\nimport { createTamaguiProvider } from './helpers/createTamaguiProvider'\nimport { getInsertedRules } from './helpers/insertStyleRule'\nimport {\n  registerCSSVariable,\n  tokenRules,\n  tokensValueToVariable,\n} from './helpers/registerCSSVariable'\nimport { configureMedia } from './hooks/useMedia'\nimport { parseFont, registerFontVariables } from './insertFont'\nimport { Tamagui } from './Tamagui'\nimport {\n  AnimationDriver,\n  CreateTamaguiConfig,\n  GenericTamaguiConfig,\n  MediaQueryKey,\n  StackProps,\n  TamaguiInternalConfig,\n  TextProps,\n  ThemeObject,\n} from './types'\n\nexport type CreateTamaguiProps =\n  // user then re-defines the types after createTamagui returns the typed object they want\n  Partial<Omit<GenericTamaguiConfig, 'themes' | 'tokens' | 'animations'>> & {\n    animations?: AnimationDriver<any>\n    tokens: GenericTamaguiConfig['tokens']\n    themes: {\n      [key: string]: {\n        [key: string]: string | number | Variable\n      }\n    }\n\n    defaultProps?: Record<string, any> & {\n      Stack?: StackProps\n      Text?: TextProps\n      Spacer?: SpacerProps\n    }\n\n    // for the first render, determines which media queries are true\n    // useful for SSR\n    mediaQueryDefaultActive?: MediaQueryKey[]\n\n    // what's between each CSS style rule, set to \"\\n\" to be easier to read\n    // defaults: \"\\n\" when NODE_ENV=development, \"\" otherwise\n    cssStyleSeparator?: string\n\n    // (Advanced)\n    // on the web, tamagui treats `dark` and `light` themes as special and\n    // generates extra CSS to avoid having to re-render the entire page.\n    // this CSS relies on specificity hacks that multiply by your sub-themes.\n    // this sets the maxiumum number of nested dark/light themes you can do\n    // defaults to 3 for a balance, but can be higher if you nest them deeply.\n    maxDarkLightNesting?: number\n\n    // adds @media(prefers-color-scheme) media queries for dark/light\n    shouldAddPrefersColorThemes?: boolean\n\n    // only if you put the theme classname on the html element we have to generate diff\n    themeClassNameOnRoot?: boolean\n  }\n\n// config is re-run by the @tamagui/static, dont double validate\nconst createdConfigs = new WeakMap<any, boolean>()\n\nexport type InferTamaguiConfig<Conf extends CreateTamaguiProps> = Conf extends Partial<\n  CreateTamaguiConfig<infer A, infer B, infer C, infer D, infer E, infer F>\n>\n  ? TamaguiInternalConfig<A, B, C, D, E, F>\n  : unknown\n\nexport function createTamagui<Conf extends CreateTamaguiProps>(\n  config: Conf\n): InferTamaguiConfig<Conf> {\n  if (createdConfigs.has(config)) {\n    return config as any\n  }\n\n  if (process.env.NODE_ENV === 'development') {\n    if (!config.tokens) {\n      throw new Error(`No tokens provided to Tamagui config`)\n    }\n    if (!config.themes) {\n      throw new Error(`No themes provided to Tamagui config`)\n    }\n    if (!config.fonts) {\n      throw new Error(`No fonts provided to Tamagui config`)\n    }\n  }\n\n  // test env loads a few times as it runs diff tests\n  if (getHasConfigured()) {\n    console.warn(`Warning: createTamagui called twice (maybe HMR)`)\n  }\n\n  configureMedia({\n    queries: config.media as any,\n    defaultActive: config.mediaQueryDefaultActive,\n  })\n\n  const fontTokens = createVariables(config.fonts!)\n  const fontsParsed = (() => {\n    const res = {} as typeof fontTokens\n    for (const familyName in fontTokens) {\n      res[`$${familyName}`] = parseFont(fontTokens[familyName])\n    }\n    return res!\n  })()\n\n  const themeConfig = (() => {\n    const themes = { ...config.themes }\n    let cssRules: string[] = []\n\n    if (isWeb) {\n      for (const key in config.tokens) {\n        for (const skey in config.tokens[key]) {\n          const val = config.tokens[key][skey]\n          registerCSSVariable(val)\n        }\n      }\n\n      for (const key in fontsParsed) {\n        const fontParsed = fontsParsed[key]\n        registerFontVariables(fontParsed)\n      }\n\n      const sep = process.env.NODE_ENV === 'development' ? config.cssStyleSeparator || ' ' : ''\n      cssRules.push(`:root {${sep}${[...tokenRules].join(`;${sep}`)}${sep}}`)\n    }\n\n    // special case for SSR\n    const hasDarkLight = 'light' in config.themes && 'dark' in config.themes\n    const CNP = `.${THEME_CLASSNAME_PREFIX}`\n\n    // dedupe themes to avoid duplicate CSS generation\n    type DedupedTheme = {\n      names: string[]\n      theme: ThemeObject\n    }\n    const dedupedThemes: {\n      [key: string]: DedupedTheme\n    } = {}\n    const existing = new WeakMap<ThemeObject, DedupedTheme>()\n\n    // first, de-dupe and parse them\n    for (const themeName in themes) {\n      const rawTheme = themes[themeName]\n\n      // if existing, avoid\n      if (existing.has(rawTheme)) {\n        const e = existing.get(rawTheme)!\n        themes[themeName] = e.theme\n        e.names.push(themeName)\n        continue\n      }\n\n      // parse into variables\n      const theme = { ...config.themes[themeName] }\n      for (const key in theme) {\n        // make sure properly names theme variables\n        ensureThemeVariable(theme, key)\n      }\n      themes[themeName] = theme\n\n      // set deduped\n      dedupedThemes[themeName] = {\n        names: [themeName],\n        theme,\n      }\n      existing.set(config.themes[themeName], dedupedThemes[themeName])\n    }\n\n    // then, generate from de-duped\n    if (isWeb) {\n      for (const themeName in dedupedThemes) {\n        const { theme, names } = dedupedThemes[themeName]\n        let vars = ''\n\n        for (const themeKey in theme) {\n          const variable = theme[themeKey] as Variable\n          let value: any = null\n          if (variable.isFloating || !tokensValueToVariable.has(variable.val)) {\n            value = variable.val\n          } else {\n            value = tokensValueToVariable.get(variable.val)!.variable\n          }\n          vars += `--${themeKey}:${value};`\n        }\n\n        const isDarkOrLightBase = themeName === 'dark' || themeName === 'light'\n        const selectors = names.map((name) => {\n          return `${CNP}${name}`\n        })\n\n        // since we dont specify dark/light in classnames we have to do an awkward specificity war\n        // use config.maxDarkLightNesting to determine how deep you can nest until it breaks\n        if (hasDarkLight) {\n          for (const subName of names) {\n            const isDark = isDarkOrLightBase || subName.startsWith('dark_')\n            const childSelector = `${CNP}${subName.replace(isDark ? 'dark_' : 'light_', '')}`\n            const order = isDark ? ['dark', 'light'] : ['light', 'dark']\n            if (isDarkOrLightBase) {\n              order.reverse()\n            }\n            const [stronger, weaker] = order\n            const max = config.maxDarkLightNesting ?? 3\n\n            new Array(Math.round(max * 1.5)).fill(undefined).forEach((_, pi) => {\n              const isOdd = pi % 2 === 1\n              if (isOdd && pi < 3) return\n              const parents = new Array(pi + 1).fill(undefined).map((_, psi) => {\n                return `${CNP}${psi % 2 === 0 ? stronger : weaker}`\n              })\n              let parentSelectors = parents.length > 1 ? parents.slice(1) : parents\n              if (isOdd) {\n                const [_first, second, ...rest] = parentSelectors\n                parentSelectors = [second, ...rest, second]\n              }\n              selectors.push(`${parentSelectors.join(' ')} ${childSelector}`)\n            })\n          }\n        }\n\n        const rootSep = config.themeClassNameOnRoot ? '' : ' '\n        const css = `${selectors.map((x) => `:root${rootSep}${x}`).join(', ')} {${vars}}`\n        cssRules.push(css)\n\n        if (config.shouldAddPrefersColorThemes && isDarkOrLightBase) {\n          // add media prefers for dark/light base\n          const isDark = themeName.startsWith('dark')\n          cssRules.push(\n            `@media(prefers-color-scheme: ${isDark ? 'dark' : 'light'}) {\n      body { background:${theme.background}; color: ${theme.color} }\n      :root {${vars} } \n    }`\n          )\n        }\n      }\n    }\n\n    // proxy upwards to get parent variables (themes are subset going down)\n    for (const themeName in themes) {\n      // we could test if this is better as just a straight object spread or fancier proxy\n      const cur: string[] = []\n      // if theme is dark_blue_alt1_Button\n      // this will be the parent names in order: ['dark', 'dark_blue', 'dark_blue_alt1\"]\n      const parents = themeName\n        .split('_')\n        .slice(0, -1)\n        .map((part) => {\n          cur.push(part)\n          return cur.join('_')\n        })\n\n      if (!parents.length) continue\n\n      themes[themeName] = new Proxy(themes[themeName], {\n        get(target, key) {\n          if (Reflect.has(target, key)) {\n            return Reflect.get(target, key)\n          }\n          // check parents\n          for (let i = parents.length - 1; i >= 0; i--) {\n            const parent = themes[parents[i]]\n            if (!parent) {\n              continue\n            }\n            if (Reflect.has(parent, key)) {\n              return Reflect.get(parent, key)\n            }\n          }\n        },\n      })\n    }\n\n    tokensValueToVariable.clear()\n    Object.freeze(cssRules)\n    const css = cssRules.join('\\n')\n\n    return {\n      themes,\n      cssRules,\n      css,\n    }\n  })()\n\n  // faster lookups token keys become $keys to match input\n  const tokensParsed: any = parseTokens(config.tokens)\n\n  const getCSS = () => {\n    return `${themeConfig.css}\\n${getInsertedRules().join('\\n')}`\n  }\n\n  if (config.shorthands) {\n    for (const key in config.shorthands) {\n      reversedShorthands[config.shorthands[key]] = key\n    }\n  }\n\n  const next: TamaguiInternalConfig = {\n    defaultTheme: 'light',\n    fonts: {},\n    animations: {} as any,\n    shorthands: {},\n    media: {},\n    ...config,\n    themes: themeConfig.themes,\n    fontsParsed,\n    themeConfig,\n    tokensParsed,\n    parsed: true,\n    getCSS,\n    Provider: null as any,\n  }\n\n  next.Provider = createTamaguiProvider(next)\n\n  setConfig(next)\n\n  if (configListeners.size) {\n    configListeners.forEach((cb) => cb(next))\n    configListeners.clear()\n  }\n\n  createdConfigs.set(next, true)\n\n  if (process.env.NODE_ENV === 'development') {\n    if (!globalThis['Tamagui']) {\n      globalThis['Tamagui'] = Tamagui\n    }\n  }\n\n  // @ts-expect-error\n  return next\n}\n\nexport const reversedShorthands: Record<string, string> = {}\n\nconst parseTokens = (tokens: any) => {\n  const res: any = {}\n  for (const key in tokens) {\n    res[key] = {}\n    for (const skey in tokens[key]) {\n      res[key][`$${skey}`] = tokens[key][skey]\n    }\n  }\n  return res\n}\n\n// mutates, freeze after\n// shared by createTamagui so extracted here\nfunction ensureThemeVariable(theme: any, key: string) {\n  const val = theme[key]\n  const themeKey = key\n  if (!isVariable(val)) {\n    theme[key] = createVariable({\n      key: themeKey,\n      name: themeKey,\n      val,\n    })\n  } else {\n    if (val.name !== themeKey) {\n      // rename to theme name\n      theme[key] = createVariable({\n        key: val.name,\n        name: themeKey,\n        val: val.val,\n      })\n    }\n  }\n}\n\n// for quick testing types:\n// const x = createTamagui({\n//   shorthands: {},\n//   media: {},\n//   themes: {},\n//   tokens: {\n//     font: {},\n//     color: {},\n//     radius: {},\n//     size: {},\n//     space: {},\n//     zIndex: {},\n//   },\n// })\n"],
-  "mappings": "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",
-  "names": []
+  "sourcesContent": ["import { isClient, isRSC, isWeb } from '@tamagui/constants'\n\nimport { configListeners, setConfig } from './config'\nimport { createVariables } from './createVariables'\nimport { getThemeCSSRules } from './helpers/getThemeCSSRules'\nimport { getAllRules } from './helpers/insertStyleRule'\nimport {\n  registerCSSVariable,\n  tokensValueToVariable,\n  variableToCSS,\n} from './helpers/registerCSSVariable'\nimport { ensureThemeVariable, proxyThemeToParents } from './helpers/themes'\nimport { configureMedia } from './hooks/useMedia'\nimport { parseFont, registerFontVariables } from './insertFont'\nimport { Tamagui } from './Tamagui'\nimport { CreateTamaguiProps, InferTamaguiConfig, TamaguiInternalConfig, ThemeParsed } from './types'\n\n// config is re-run by the @tamagui/static, dont double validate\nconst createdConfigs = new WeakMap<any, boolean>()\n\nexport function createTamagui<Conf extends CreateTamaguiProps>(\n  configIn: Conf\n): InferTamaguiConfig<Conf> {\n  if (createdConfigs.has(configIn)) {\n    return configIn as any\n  }\n\n  if (process.env.NODE_ENV === 'development') {\n    if (!configIn.tokens) {\n      throw new Error(`Must define tokens`)\n    }\n    if (!configIn.themes) {\n      throw new Error(`Must define themes`)\n    }\n    if (!configIn.fonts) {\n      throw new Error(`Must define fonts`)\n    }\n  }\n\n  const fontTokens = Object.fromEntries(\n    Object.entries(configIn.fonts!).map(([k, v]) => {\n      return [k, createVariables(v, 'f', true)]\n    })\n  )\n\n  const fontsParsed = (() => {\n    const res = {} as typeof fontTokens\n    for (const familyName in fontTokens) {\n      res[`$${familyName}`] = parseFont(fontTokens[familyName])\n    }\n    return res!\n  })()\n\n  const themeConfig = (() => {\n    const themes = { ...configIn.themes }\n    const cssRuleSets: string[] = []\n\n    if (isWeb) {\n      const declarations: string[] = []\n      const fontDeclarations: Record<\n        string,\n        { name: string; declarations: string[]; language?: string }\n      > = {}\n\n      for (const key in configIn.tokens) {\n        for (const skey in configIn.tokens[key]) {\n          const val = configIn.tokens[key][skey]\n          registerCSSVariable(val)\n          declarations.push(variableToCSS(val))\n        }\n      }\n\n      for (const key in fontsParsed) {\n        const fontParsed = fontsParsed[key]\n        const [name, language] = key.includes('_') ? key.split('_') : [key]\n        const fontVars = registerFontVariables(fontParsed)\n        fontDeclarations[key] = { name: name.slice(1), declarations: fontVars, language }\n      }\n\n      const sep = process.env.NODE_ENV === 'development' ? configIn.cssStyleSeparator || ' ' : ''\n\n      function declarationsToRuleSet(decs: string[], selector = '') {\n        return `:root${selector} {${sep}${[...decs].join(`;${sep}`)}${sep}}`\n      }\n\n      // non-font\n      cssRuleSets.push(declarationsToRuleSet(declarations))\n\n      // fonts\n      if (fontDeclarations) {\n        for (const key in fontDeclarations) {\n          const { name, declarations, language = 'default' } = fontDeclarations[key]\n          const fontSelector = `.font_${name}`\n          const langSelector = `:root .t_lang-${name}-${language} ${fontSelector}`\n          const selectors =\n            language === 'default' ? ` ${fontSelector}, ${langSelector}` : langSelector\n          const specificRuleSet = declarationsToRuleSet(declarations, selectors)\n          cssRuleSets.push(specificRuleSet)\n        }\n      }\n    }\n\n    // dedupe themes to avoid duplicate CSS generation\n    type DedupedTheme = {\n      names: string[]\n      theme: ThemeParsed\n    }\n    const dedupedThemes: {\n      [key: string]: DedupedTheme\n    } = {}\n    const existing = new WeakMap<ThemeParsed, DedupedTheme>()\n\n    // first, de-dupe and parse them\n    for (const themeName in themes) {\n      const rawTheme = themes[themeName] as ThemeParsed\n\n      // if existing, avoid\n      if (existing.has(rawTheme)) {\n        const e = existing.get(rawTheme)!\n        themes[themeName] = e.theme\n        e.names.push(themeName)\n        continue\n      }\n\n      // ensure each theme object unique for dedupe\n      const theme = { ...rawTheme }\n      // parse into variables\n      for (const key in theme) {\n        // make sure properly names theme variables\n        ensureThemeVariable(theme, key)\n      }\n      themes[themeName] = theme\n\n      // set deduped\n      dedupedThemes[themeName] = {\n        names: [themeName],\n        theme,\n      }\n      existing.set(rawTheme, dedupedThemes[themeName])\n    }\n\n    // then, generate CSS from de-duped\n    let themeRuleSets: string[] = []\n\n    if (isWeb || isRSC) {\n      for (const themeName in dedupedThemes) {\n        themeRuleSets = [\n          ...themeRuleSets,\n          ...getThemeCSSRules({\n            config: configIn,\n            themeName,\n            ...dedupedThemes[themeName],\n          }),\n        ]\n      }\n    }\n\n    // proxy upwards to get parent variables (themes are subset going down)\n    for (const themeName in themes) {\n      themes[themeName] = proxyThemeToParents(themeName, themes[themeName], themes)\n    }\n\n    tokensValueToVariable.clear()\n\n    return {\n      themes,\n      cssRuleSets,\n      themeRuleSets,\n    }\n  })()\n\n  // faster $lookups\n  const tokensParsed: any = Object.fromEntries(\n    Object.entries(configIn.tokens).map(([k, v]) => [\n      k,\n      Object.fromEntries(Object.entries(v).map(([k, v]) => [`$${k}`, v])),\n    ])\n  )\n\n  const shorthands = configIn.shorthands || {}\n\n  const config: TamaguiInternalConfig = {\n    fontLanguages: [],\n    animations: {} as any,\n    media: {},\n    ...configIn,\n    // vite made this into a function if it wasn't set\n    shorthands: { ...shorthands },\n    inverseShorthands: shorthands\n      ? Object.fromEntries(Object.entries(shorthands).map(([k, v]) => [v, k]))\n      : {},\n    themes: themeConfig.themes as any,\n    fontsParsed,\n    themeConfig,\n    tokensParsed,\n    parsed: true,\n    getCSS: (separator = '\\n') => {\n      return `\n      .is_Text .is_Text {display:inline-flex;}\n      ._dsp_contents {display:contents;}\n      ${themeConfig.cssRuleSets.join(separator)}\n      ${themeConfig.themeRuleSets.join(separator)}\n      ${getAllRules().join(separator)}`\n    },\n    // const tokens = [...getToken(tokens.size[0])]\n    // .spacer-sm + ._dsp_contents._dsp-sm-hidden { margin-left: -var(--${}) }\n  }\n\n  configureMedia(config)\n  setConfig(config)\n\n  if (configListeners.size) {\n    configListeners.forEach((cb) => cb(config))\n    configListeners.clear()\n  }\n\n  createdConfigs.set(config, true)\n\n  if (process.env.NODE_ENV === 'development') {\n    if (process.env.DEBUG?.startsWith('tamagui')) {\n      // eslint-disable-next-line no-console\n      console.log('Tamagui config:', config)\n    }\n    if (!globalThis['Tamagui']) {\n      globalThis['Tamagui'] = Tamagui\n    }\n  }\n\n  return config as any\n}\n"],
+  "mappings": "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",
+  "names": ["declarationsToRuleSet", "declarations", "k", "v"]
 }

package/dist/esm/createTheme.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/createTheme.ts"],
-  "sourcesContent": ["import { Variable } from './createVariable'\n\ntype GenericTheme = { [key: string]: string | Variable }\n\nexport const createTheme = <Theme extends GenericTheme>(\n  theme: Theme\n): {\n  [K in keyof Theme]: Theme[K] | string | Variable\n} => {\n  return theme\n}\n"],
-  "mappings": "AAIO,MAAM,cAAc,CACzB,UAGG;AACH,SAAO;AACT;",
+  "sourcesContent": ["import type { Variable } from './createVariable'\n\ntype GenericTheme = { [key: string]: string | Variable }\n\n// export const themeToVariableToValueMap = new WeakMap<any, Record<string, string>>()\n\nexport const createTheme = <Theme extends GenericTheme>(\n  theme: Theme\n): {\n  [K in keyof Theme]: Theme[K] | string | Variable\n} => {\n  return theme\n}\n"],
+  "mappings": "AAMO,MAAM,cAAc,CACzB,UAGG;AACH,SAAO;AACT;",
   "names": []
 }

package/dist/esm/createTokens.js

@@ -1,9 +1,5 @@
 import { createVariables } from "./createVariables";
-import { validateTokens } from "./helpers/validate";
 function createTokens(tokens) {
-  if (process.env.NODE_ENV === "development") {
-    validateTokens(tokens);
-  }
   return createVariables(tokens);
 }
 export {

package/dist/esm/createTokens.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/createTokens.ts"],
-  "sourcesContent": ["import { Variable } from './createVariable'\nimport { createVariables } from './createVariables'\nimport { validateTokens } from './helpers/validate'\nimport { CreateTokens } from './types'\n\n// tokens.color.dark.red ===> { var: `color-dark-red`, val: '' }\nexport function createTokens<T extends CreateTokens>(tokens: T): MakeTokens<T> {\n  if (process.env.NODE_ENV === 'development') {\n    validateTokens(tokens)\n  }\n  return createVariables(tokens as any) as any\n}\n\n// verbose but gives us nice types...\ntype MakeTokens<T> = T extends {\n  color: infer E\n  space: infer F\n  size: infer G\n  radius: infer H\n  zIndex: infer J\n}\n  ? {\n      color: {\n        [key in keyof E]: Variable\n      }\n      space: {\n        [key in keyof F]: Variable\n      }\n      size: {\n        [key in keyof G]: Variable\n      }\n      radius: {\n        [key in keyof H]: Variable\n      }\n      zIndex: {\n        [key in keyof J]: Variable\n      }\n    }\n  : never\n"],
-  "mappings": "AACA;AACA;AAIO,sBAA8C,QAA0B;AAC7E,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,mBAAe,MAAM;AAAA,EACvB;AACA,SAAO,gBAAgB,MAAa;AACtC;",
+  "sourcesContent": ["import { Variable } from './createVariable'\nimport { createVariables } from './createVariables'\nimport { CreateTokens } from './types'\n\n// tokens.color.dark.red ===> { var: `color-dark-red`, val: '' }\nexport function createTokens<T extends CreateTokens>(tokens: T): MakeTokens<T> {\n  return createVariables(tokens) as any\n}\n\n// verbose but gives us nice types...\ntype MakeTokens<T> = T extends {\n  color: infer E\n  space: infer F\n  size: infer G\n  radius: infer H\n  zIndex: infer J\n}\n  ? {\n      color: {\n        [Key in keyof E]: E[Key] extends Variable ? E[Key] : Variable<E[Key]>\n      }\n      space: {\n        [Key in keyof F]: F[Key] extends Variable ? F[Key] : Variable<F[Key]>\n      }\n      size: {\n        [Key in keyof G]: G[Key] extends Variable ? G[Key] : Variable<G[Key]>\n      }\n      radius: {\n        [Key in keyof H]: H[Key] extends Variable ? H[Key] : Variable<H[Key]>\n      }\n      zIndex: {\n        [Key in keyof J]: J[Key] extends Variable ? J[Key] : Variable<J[Key]>\n      }\n    }\n  : never\n"],
+  "mappings": "AACA,SAAS,uBAAuB;AAIzB,SAAS,aAAqC,QAA0B;AAC7E,SAAO,gBAAgB,MAAM;AAC/B;",
   "names": []
 }

package/dist/esm/createTokens.test.js

@@ -0,0 +1,26 @@
+import { getDefaultTamaguiConfig } from "@tamagui/config-default-node";
+import { expect, test } from "vitest";
+import { createTokens } from "./createTokens";
+test("snapshot", () => {
+  expect(createTokens(getDefaultTamaguiConfig().tokens)).toMatchSnapshot();
+});
+test("color name no dot", () => {
+  expect(
+    createTokens({
+      color: {
+        "yellow.10": "yellow"
+      }
+    })
+  ).toMatchObject({
+    color: {
+      "yellow.10": {
+        isVar: true,
+        key: "yellow101a",
+        name: "color-1",
+        val: "yellow",
+        variable: ""
+      }
+    }
+  });
+});
+//# sourceMappingURL=createTokens.test.js.map

package/dist/esm/createTokens.test.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/createTokens.test.ts"],
+  "sourcesContent": ["import { getDefaultTamaguiConfig } from '@tamagui/config-default-node'\nimport { expect, test } from 'vitest'\n\nimport { createTokens } from './createTokens'\n\ntest('snapshot', () => {\n  expect(createTokens(getDefaultTamaguiConfig().tokens)).toMatchSnapshot()\n})\n\ntest('color name no dot', () => {\n  expect(\n    // @ts-ignore partial\n    createTokens({\n      color: {\n        'yellow.10': 'yellow',\n      },\n    })\n  ).toMatchObject({\n    color: {\n      'yellow.10': {\n        isVar: true,\n        key: 'yellow101a',\n        name: 'color-1',\n        val: 'yellow',\n        variable: '',\n      },\n    },\n  })\n})\n"],
+  "mappings": "AAAA,SAAS,+BAA+B;AACxC,SAAS,QAAQ,YAAY;AAE7B,SAAS,oBAAoB;AAE7B,KAAK,YAAY,MAAM;AACrB,SAAO,aAAa,wBAAwB,EAAE,MAAM,CAAC,EAAE,gBAAgB;AACzE,CAAC;AAED,KAAK,qBAAqB,MAAM;AAC9B;AAAA,IAEE,aAAa;AAAA,MACX,OAAO;AAAA,QACL,aAAa;AAAA,MACf;AAAA,IACF,CAAC;AAAA,EACH,EAAE,cAAc;AAAA,IACd,OAAO;AAAA,MACL,aAAa;AAAA,QACX,OAAO;AAAA,QACP,KAAK;AAAA,QACL,MAAM;AAAA,QACN,KAAK;AAAA,QACL,UAAU;AAAA,MACZ;AAAA,IACF;AAAA,EACF,CAAC;AACH,CAAC;",
+  "names": []
+}

package/dist/esm/createVariable.js

@@ -1,32 +1,34 @@
-var _a;
-import { isWeb } from "./constants/platform";
-const IS_VARIABLE_SYMBOL = "__isVariable__";
-class Variable {
-  constructor(props) {
-    this[_a] = true;
-    this.isFloating = false;
-    const { val, name, key, isFloating } = props;
-    this.val = isVariable(val) ? val.val : val;
-    this.name = name;
-    this.key = key;
-    this.variable = isWeb ? createCSSVariable(name) : "";
-    if (isFloating) {
-      this.isFloating = true;
-    }
-  }
-  toString() {
-    return `${isWeb ? this.variable : this.val}`;
-  }
-}
-_a = IS_VARIABLE_SYMBOL;
+import { isWeb } from "@tamagui/constants";
+import { simpleHash } from "@tamagui/helpers";
+import { getConfig } from "./config";
+const IS_VAR = "isVar";
 const createVariable = (props) => {
-  if (isVariable(props)) {
+  if (isVariable(props))
     return props;
-  }
-  return new Variable(props);
+  const { key, name, val } = props;
+  return {
+    [IS_VAR]: true,
+    key,
+    name: simpleHash(name, 40),
+    val,
+    variable: isWeb ? createCSSVariable(name) : ""
+  };
 };
+function variableToString(vrble, getValue = false) {
+  if (isVariable(vrble)) {
+    return getValue ? `${vrble.val}` : `${isWeb ? vrble.variable : vrble.val}`;
+  }
+  return `${vrble || ""}`;
+}
 function isVariable(v) {
-  return !!(v instanceof Variable || v && v[IS_VARIABLE_SYMBOL]);
+  return v && typeof v === "object" && IS_VAR in v;
+}
+function getVariable(nameOrVariable) {
+  if (isVariable(nameOrVariable)) {
+    return variableToString(nameOrVariable);
+  }
+  const tokens = getConfig().tokensParsed;
+  return variableToString(tokens[nameOrVariable] ?? nameOrVariable);
 }
 function getVariableValue(v) {
   if (isVariable(v))
@@ -46,28 +48,20 @@ function getVariableVariable(v) {
 const createCSSVariable = (nameProp, includeVar = true) => {
   if (process.env.NODE_ENV === "development") {
     if (!nameProp || typeof nameProp !== "string") {
-      console.warn("invalid name", nameProp);
-      return ``;
-    }
-  }
-  let name = "";
-  for (let i = 0; i < nameProp.length; i++) {
-    const code = nameProp.charCodeAt(i);
-    if (code >= 65 && code <= 90 || code >= 97 && code <= 122 || code == 95 || code === 45 || code >= 48 && code <= 57) {
-      name += nameProp[i];
-    } else {
-      name += `-c${code}-`;
+      throw new Error(`createCSSVariable expected string: ${nameProp}`);
     }
   }
+  const name = simpleHash(nameProp, 60);
   return includeVar ? `var(--${name})` : name;
 };
 export {
-  Variable,
   createCSSVariable,
   createVariable,
+  getVariable,
   getVariableName,
   getVariableValue,
   getVariableVariable,
-  isVariable
+  isVariable,
+  variableToString
 };
 //# sourceMappingURL=createVariable.js.map