@tamagui/web 1.45.11 → 1.46.1

package/src/createTamagui.ts

@@ -74,68 +74,70 @@ export function createTamagui<Conf extends CreateTamaguiProps>(
     const themes = { ...configIn.themes }
     const cssRuleSets: string[] = []
 
-    if (isWeb) {
-      const declarations: string[] = []
-      const fontDeclarations: Record<
-        string,
-        { name: string; declarations: string[]; language?: string }
-      > = {}
-
-      for (const key in configIn.tokens) {
-        for (const skey in configIn.tokens[key]) {
-          const variable = configIn.tokens[key][skey] as Variable
-
-          // set specific tokens (like $size.sm)
-          specificTokens[`$${key}.${skey}`] = variable
-
-          if (process.env.NODE_ENV === 'development') {
-            if (typeof variable === 'undefined') {
-              throw new Error(
-                `No value for tokens.${key}.${skey}:\n${JSON.stringify(
-                  variable,
-                  null,
-                  2
-                )}`
-              )
+    if (process.env.TAMAGUI_DOES_SSR_CSS !== 'true') {
+      if (isWeb) {
+        const declarations: string[] = []
+        const fontDeclarations: Record<
+          string,
+          { name: string; declarations: string[]; language?: string }
+        > = {}
+
+        for (const key in configIn.tokens) {
+          for (const skey in configIn.tokens[key]) {
+            const variable = configIn.tokens[key][skey] as Variable
+
+            // set specific tokens (like $size.sm)
+            specificTokens[`$${key}.${skey}`] = variable
+
+            if (process.env.NODE_ENV === 'development') {
+              if (typeof variable === 'undefined') {
+                throw new Error(
+                  `No value for tokens.${key}.${skey}:\n${JSON.stringify(
+                    variable,
+                    null,
+                    2
+                  )}`
+                )
+              }
             }
-          }
 
-          registerCSSVariable(variable)
-          declarations.push(variableToCSS(variable, key === 'zIndex'))
+            registerCSSVariable(variable)
+            declarations.push(variableToCSS(variable, key === 'zIndex'))
+          }
         }
-      }
 
-      for (const key in fontsParsed) {
-        const fontParsed = fontsParsed[key]
-        const [name, language] = key.includes('_') ? key.split('_') : [key]
-        const fontVars = registerFontVariables(fontParsed)
-        fontDeclarations[key] = {
-          name: name.slice(1),
-          declarations: fontVars,
-          language,
+        for (const key in fontsParsed) {
+          const fontParsed = fontsParsed[key]
+          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 || ' ' : ''
+        const sep =
+          process.env.NODE_ENV === 'development' ? configIn.cssStyleSeparator || ' ' : ''
 
-      function declarationsToRuleSet(decs: string[], selector = '') {
-        return `:root${selector} {${sep}${[...decs].join(`;${sep}`)}${sep}}`
-      }
+        function declarationsToRuleSet(decs: string[], selector = '') {
+          return `:root${selector} {${sep}${[...decs].join(`;${sep}`)}${sep}}`
+        }
 
-      // non-font
-      cssRuleSets.push(declarationsToRuleSet(declarations))
-
-      // fonts
-      if (fontDeclarations) {
-        for (const key in fontDeclarations) {
-          const { name, declarations, 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 = declarationsToRuleSet(declarations, selectors)
-          cssRuleSets.push(specificRuleSet)
+        // non-font
+        cssRuleSets.push(declarationsToRuleSet(declarations))
+
+        // fonts
+        if (fontDeclarations) {
+          for (const key in fontDeclarations) {
+            const { name, declarations, 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 = declarationsToRuleSet(declarations, selectors)
+            cssRuleSets.push(specificRuleSet)
+          }
         }
       }
     }

package/src/helpers/createPropMapper.ts

@@ -18,12 +18,7 @@ import { isObj } from './isObj'
 import { mergeProps } from './mergeProps'
 import { pseudoDescriptors } from './pseudoDescriptors'
 
-export type ResolveVariableTypes =
-  | 'auto'
-  | 'value'
-  | 'variable'
-  | 'both'
-  | 'non-color-value'
+export type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both'
 
 export const createPropMapper = (staticConfig: StaticConfigParsed) => {
   // temp remove classnames
@@ -441,7 +436,7 @@ const getToken = (
       for (const cat in tokenCategories) {
         if (key in tokenCategories[cat]) {
           const res = tokensParsed[cat][value]
-          if (res) {
+          if (res != null) {
             valOrVar = res
             hasSet = true
           }
@@ -449,7 +444,7 @@ const getToken = (
       }
       if (!hasSet) {
         const spaceVar = tokensParsed.space[value]
-        if (spaceVar) {
+        if (spaceVar != null) {
           valOrVar = spaceVar
           hasSet = true
         }
@@ -481,14 +476,6 @@ function resolveVariableValue(
     if (resolveAs === 'variable') {
       return valOrVar
     }
-    if (resolveAs === 'non-color-value') {
-      if (isWeb) {
-        if (key in tokenCategories.color) {
-          return valOrVar.variable
-        }
-      }
-      return valOrVar.val
-    }
     if (!isWeb || resolveAs === 'value') {
       return valOrVar.val
     }

package/src/helpers/expandStyles.ts

@@ -1,6 +1,5 @@
 import { isWeb } from '@tamagui/constants'
 
-import { getConfig } from '../config'
 import { expandStyle } from './expandStyle'
 import { normalizeShadow } from './normalizeShadow'
 import { normalizeValueWithProperty } from './normalizeValueWithProperty'
@@ -14,18 +13,12 @@ import { pseudoDescriptors } from './pseudoDescriptors'
  *   3. Expands react-native shorthands, ie paddingHorizontal => paddingLeft, paddingRight
  */
 
-export function expandStylesAndRemoveNullishValues(
-  style: Record<string, any>,
-  { shorthands } = getConfig()
-) {
+export function expandStylesAndRemoveNullishValues(style: Record<string, any>) {
   const res: Record<string, any> = {}
 
   for (let key in style) {
     const valIn = style[key]
-    if (valIn == null) {
-      continue
-    }
-    key = shorthands?.[key] || key
+    if (valIn == null) continue
     if (key in pseudoDescriptors) {
       res[key] = expandStylesAndRemoveNullishValues(valIn)
       continue
@@ -46,6 +39,15 @@ export function expandStylesAndRemoveNullishValues(
 }
 
 export function fixStyles(style: Record<string, any>) {
+  if (process.env.TAMAGUI_TARGET === 'native') {
+    if ('elevationAndroid' in style) {
+      // @ts-ignore
+      style['elevation'] = style.elevationAndroid
+      // @ts-ignore
+      delete style.elevationAndroid
+    }
+  }
+
   if (
     style.shadowRadius ||
     style.shadowColor ||

package/src/helpers/getSplitStyles.tsx

@@ -178,6 +178,8 @@ export const getSplitStyles: StyleSplitter = (
 
   // handle before the loop so we can mark usedKeys in className
   // since the compiler will optimize to className we just treat className as the more powerful
+  //   TODO the compiler should probably just leave things inline if its not flattening
+  //   that way it keeps merging order
   if (typeof props.className === 'string') {
     for (const cn of props.className.split(' ')) {
       if (cn[0] === '_') {
@@ -630,8 +632,8 @@ export const getSplitStyles: StyleSplitter = (
         )
 
         const descriptor = pseudoDescriptors[key as keyof typeof pseudoDescriptors]
-        const isEnter = descriptor.name === 'enter'
-        const isExit = descriptor.name === 'exit'
+        const isEnter = key === 'enterStyle'
+        const isExit = key === 'exitStyle'
 
         // dev-time warning that helps clear confusion around need for animation  when using enter/exit style
         if (
@@ -718,14 +720,6 @@ export const getSplitStyles: StyleSplitter = (
             console.groupEnd()
           }
 
-          // if (!isDisabled) {
-          //   if (valInit === staticConfig.defaultProps[keyInit]) {
-          //     // ignore:
-          //     // if it's a default property given by styled(), we don't mark it as used, so
-          //     // that props given inline can override:
-          //   }
-          // }
-
           const importance = descriptor.priority
 
           if (!isDisabled) {
@@ -933,35 +927,6 @@ export const getSplitStyles: StyleSplitter = (
     styleToCSS(style)
   }
 
-  // native: swap out the right family based on weight/style
-  if (process.env.TAMAGUI_TARGET === 'native') {
-    if (fontFamilyKey in style && style.fontFamily) {
-      const faceInfo = getFont(style.fontFamily as string)?.face
-      if (faceInfo) {
-        const overrideFace =
-          faceInfo[style.fontWeight as string]?.[style.fontStyle || 'normal']?.val
-        if (overrideFace) {
-          style.fontFamily = overrideFace
-          styleState.fontFamily = overrideFace
-          delete style.fontWeight
-          delete style.fontStyle
-        }
-      }
-      if (process.env.NODE_ENV === 'development') {
-        if (debug) {
-          // rome-ignore lint/nursery/noConsoleLog: <explanation>
-          console.log(`Found fontFamily native: ${style.fontFamily}`, faceInfo)
-        }
-      }
-    }
-    if ('elevationAndroid' in style) {
-      // @ts-ignore
-      style['elevation'] = style.elevationAndroid
-      // @ts-ignore
-      delete style.elevationAndroid
-    }
-  }
-
   // always do this at the very end to preserve the order strictly (animations, origin)
   // and allow proper merging of all pseudos before applying
   if (flatTransforms) {
@@ -1089,6 +1054,25 @@ export const getSplitStyles: StyleSplitter = (
     dynamicThemeAccess,
   }
 
+  // native: swap out the right family based on weight/style
+  if (process.env.TAMAGUI_TARGET === 'native') {
+    if (style.fontFamily) {
+      const faceInfo = getFont(style.fontFamily as string)?.face
+      if (faceInfo) {
+        const overrideFace =
+          faceInfo[style.fontWeight as string]?.[style.fontStyle || 'normal']?.val
+        if (overrideFace) {
+          style.fontFamily = overrideFace
+          styleState.fontFamily = overrideFace
+        }
+      }
+      if (process.env.NODE_ENV === 'development' && debug) {
+        // rome-ignore lint/nursery/noConsoleLog: <explanation>
+        console.log(`Found fontFamily native: ${style.fontFamily}`, faceInfo)
+      }
+    }
+  }
+
   if (className) {
     classNames.className = className
   }

package/src/helpers/getThemeCSSRules.ts

@@ -5,12 +5,7 @@ import { Variable, variableToString } from '../createVariable'
 import type { CreateTamaguiProps, ThemeParsed } from '../types'
 import { tokensValueToVariable } from './registerCSSVariable'
 
-export function getThemeCSSRules({
-  config,
-  themeName,
-  theme,
-  names,
-}: {
+export function getThemeCSSRules(props: {
   config: CreateTamaguiProps
   themeName: string
   theme: ThemeParsed
@@ -18,148 +13,154 @@ export function getThemeCSSRules({
 }) {
   const cssRuleSets: string[] = []
 
-  // special case for SSR
-  const hasDarkLight = 'light' in config.themes && 'dark' in config.themes
-  const CNP = `.${THEME_CLASSNAME_PREFIX}`
-  let vars = ''
-
-  // themeToVariableToValueMap.set(theme, {})
-  // const varToValMap = themeToVariableToValueMap.get(theme)
-  for (const themeKey in theme) {
-    const variable = theme[themeKey] as Variable
-    let value: any = null
-
-    if (!tokensValueToVariable.has(variable.val)) {
-      value = variable.val
-    } else {
-      value = tokensValueToVariable.get(variable.val)!.variable
-    }
-    // Hash themeKey in case it has invalid chars too
-    vars += `--${simpleHash(themeKey, 40)}:${value};`
-  }
+  if (process.env.TAMAGUI_DOES_SSR_CSS !== 'true') {
+    const { config, themeName, theme, names } = props
 
-  const isDarkOrLightBase = themeName === 'dark' || themeName === 'light'
-  const baseSelectors = names.map((name) => `${CNP}${name}`)
-  const selectorsSet = new Set(baseSelectors)
-
-  // since we dont specify dark/light in classnames we have to do an awkward specificity war
-  // use config.maxDarkLightNesting to determine how deep you can nest until it breaks
-  if (hasDarkLight) {
-    for (const subName of names) {
-      const isDark = themeName === 'dark' || subName.startsWith('dark_')
-      const isLight = themeName === 'light' || themeName.startsWith('light_')
-      const maxDepth = config.maxDarkLightNesting ?? 3
-
-      if (!(isDark || isLight)) {
-        // neither light nor dark subtheme, just generate one selector with :root:root which
-        // will override all :root light/dark selectors generated below
-        selectorsSet.add(`:root:root ${CNP}${subName}`)
-        continue
-      }
+    // special case for SSR
+    const hasDarkLight = 'light' in config.themes && 'dark' in config.themes
+    const CNP = `.${THEME_CLASSNAME_PREFIX}`
+    let vars = ''
 
-      const childSelector = `${CNP}${subName.replace(/^(dark|light)_/, '')}`
+    // themeToVariableToValueMap.set(theme, {})
+    // const varToValMap = themeToVariableToValueMap.get(theme)
+    for (const themeKey in theme) {
+      const variable = theme[themeKey] as Variable
+      let value: any = null
 
-      const [altLightDark, altSubTheme] = [
-        isDark ? ['dark', 'light'] : ['light', 'dark'],
-        isDark ? ['dark', 'sub_theme'] : ['light', 'sub_theme'],
-      ]
+      if (!tokensValueToVariable.has(variable.val)) {
+        value = variable.val
+      } else {
+        value = tokensValueToVariable.get(variable.val)!.variable
+      }
+      // Hash themeKey in case it has invalid chars too
+      vars += `--${simpleHash(themeKey, 40)}:${value};`
+    }
 
-      for (const order of [altLightDark, altSubTheme]) {
-        if (isDarkOrLightBase) {
-          order.reverse()
+    const isDarkOrLightBase = themeName === 'dark' || themeName === 'light'
+    const baseSelectors = names.map((name) => `${CNP}${name}`)
+    const selectorsSet = new Set(baseSelectors)
+
+    // since we dont specify dark/light in classnames we have to do an awkward specificity war
+    // use config.maxDarkLightNesting to determine how deep you can nest until it breaks
+    if (hasDarkLight) {
+      for (const subName of names) {
+        const isDark = themeName === 'dark' || subName.startsWith('dark_')
+        const isLight = themeName === 'light' || themeName.startsWith('light_')
+        const maxDepth = config.maxDarkLightNesting ?? 3
+
+        if (!(isDark || isLight)) {
+          // neither light nor dark subtheme, just generate one selector with :root:root which
+          // will override all :root light/dark selectors generated below
+          selectorsSet.add(`:root:root ${CNP}${subName}`)
+          continue
         }
-        const [stronger, weaker] = order
-        const numSelectors = Math.round(maxDepth * 1.5)
 
-        for (let depth = 0; depth < numSelectors; depth++) {
-          const isOdd = depth % 2 === 1
+        const childSelector = `${CNP}${subName.replace(/^(dark|light)_/, '')}`
 
-          // wtf is this continue:
-          if (isOdd && depth < 3) {
-            continue
+        const [altLightDark, altSubTheme] = [
+          isDark ? ['dark', 'light'] : ['light', 'dark'],
+          isDark ? ['dark', 'sub_theme'] : ['light', 'sub_theme'],
+        ]
+
+        for (const order of [altLightDark, altSubTheme]) {
+          if (isDarkOrLightBase) {
+            order.reverse()
           }
+          const [stronger, weaker] = order
+          const numSelectors = Math.round(maxDepth * 1.5)
 
-          const parents = new Array(depth + 1).fill(0).map((_, psi) => {
-            return `${CNP}${psi % 2 === 0 ? stronger : weaker}`
-          })
+          for (let depth = 0; depth < numSelectors; depth++) {
+            const isOdd = depth % 2 === 1
 
-          let parentSelectors = parents.length > 1 ? parents.slice(1) : parents
+            // wtf is this continue:
+            if (isOdd && depth < 3) {
+              continue
+            }
 
-          if (isOdd) {
-            const [_first, second, ...rest] = parentSelectors
-            parentSelectors = [second, ...rest, second]
-          }
+            const parents = new Array(depth + 1).fill(0).map((_, 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]
+            }
 
-          const lastParentSelector = parentSelectors[parentSelectors.length - 1]
-          const nextChildSelector =
-            childSelector === lastParentSelector ? '' : childSelector
+            const lastParentSelector = parentSelectors[parentSelectors.length - 1]
+            const nextChildSelector =
+              childSelector === lastParentSelector ? '' : childSelector
 
-          // for light/dark/light:
-          selectorsSet.add(`${parentSelectors.join(' ')} ${nextChildSelector}`.trim())
-          // selectorsSet.add(
-          //   `${parentSelectors.join(' ')} ${nextChildSelector}.t_sub_theme`.trim()
-          // )
+            // for light/dark/light:
+            selectorsSet.add(`${parentSelectors.join(' ')} ${nextChildSelector}`.trim())
+            // selectorsSet.add(
+            //   `${parentSelectors.join(' ')} ${nextChildSelector}.t_sub_theme`.trim()
+            // )
+          }
         }
       }
     }
-  }
 
-  const selectors = [...selectorsSet].sort((a, b) => a.localeCompare(b))
-
-  // only do our :root attach if it's not light/dark - not support sub themes on root saves a lot of effort/size
-  // this isBaseTheme logic could probably be done more efficiently above
-  const selectorsString = selectors
-    .map((x) => {
-      const rootSep = isBaseTheme(x) && config.themeClassNameOnRoot ? '' : ' '
-      return `:root${rootSep}${x}`
-    })
-    .join(', ')
-
-  const css = `${selectorsString} {${vars}}`
-  cssRuleSets.push(css)
-
-  if (config.shouldAddPrefersColorThemes) {
-    const bgString = theme.background
-      ? `background:${variableToString(theme.background)};`
-      : ''
-    const fgString = theme.color ? `color:${variableToString(theme.color)}` : ''
-
-    const bodyRules = `body{${bgString}${fgString}}`
-    const isDark = themeName.startsWith('dark')
-    const baseName = isDark ? 'dark' : 'light'
-    const lessSpecificSelectors = selectors
+    const selectors = [...selectorsSet].sort((a, b) => a.localeCompare(b))
+
+    // only do our :root attach if it's not light/dark - not support sub themes on root saves a lot of effort/size
+    // this isBaseTheme logic could probably be done more efficiently above
+    const selectorsString = selectors
       .map((x) => {
-        if (x == darkSelector || x === lightSelector) return `:root`
-        if (
-          (isDark && x.startsWith(lightSelector)) ||
-          (!isDark && x.startsWith(darkSelector))
-        ) {
-          return
-        }
-        return x.replace(/^\.t_(dark|light) /, '').trim()
+        const rootSep = isBaseTheme(x) && config.themeClassNameOnRoot ? '' : ' '
+        return `:root${rootSep}${x}`
       })
-      .filter(Boolean)
       .join(', ')
 
-    const themeRules = `${lessSpecificSelectors} {${vars}}`
-    const prefersMediaSelectors = `@media(prefers-color-scheme:${baseName}){
-  ${bodyRules}
-  ${themeRules}
-}`
-    cssRuleSets.push(prefersMediaSelectors)
-  }
+    const css = `${selectorsString} {${vars}}`
+    cssRuleSets.push(css)
+
+    if (config.shouldAddPrefersColorThemes) {
+      const bgString = theme.background
+        ? `background:${variableToString(theme.background)};`
+        : ''
+      const fgString = theme.color ? `color:${variableToString(theme.color)}` : ''
+
+      const bodyRules = `body{${bgString}${fgString}}`
+      const isDark = themeName.startsWith('dark')
+      const baseName = isDark ? 'dark' : 'light'
+      const lessSpecificSelectors = selectors
+        .map((x) => {
+          if (x == darkSelector || x === lightSelector) return `:root`
+          if (
+            (isDark && x.startsWith(lightSelector)) ||
+            (!isDark && x.startsWith(darkSelector))
+          ) {
+            return
+          }
+          return x.replace(/^\.t_(dark|light) /, '').trim()
+        })
+        .filter(Boolean)
+        .join(', ')
+
+      const themeRules = `${lessSpecificSelectors} {${vars}}`
+      const prefersMediaSelectors = `@media(prefers-color-scheme:${baseName}){
+    ${bodyRules}
+    ${themeRules}
+  }`
+      cssRuleSets.push(prefersMediaSelectors)
+    }
 
-  if (config.selectionStyles) {
-    const selectionSelectors = baseSelectors.map((s) => `${s} ::selection`).join(', ')
-    const rules = config.selectionStyles(theme)
-    if (rules) {
-      const styles = Object.entries(rules)
-        .flatMap(([k, v]) =>
-          v ? `${k === 'backgroundColor' ? 'background' : k}:${variableToString(v)}` : []
-        )
-        .join(';')
-      const css = `${selectionSelectors} {${styles}}`
-      cssRuleSets.push(css)
+    if (config.selectionStyles) {
+      const selectionSelectors = baseSelectors.map((s) => `${s} ::selection`).join(', ')
+      const rules = config.selectionStyles(theme)
+      if (rules) {
+        const styles = Object.entries(rules)
+          .flatMap(([k, v]) =>
+            v
+              ? `${k === 'backgroundColor' ? 'background' : k}:${variableToString(v)}`
+              : []
+          )
+          .join(';')
+        const css = `${selectionSelectors} {${styles}}`
+        cssRuleSets.push(css)
+      }
     }
   }
 

package/src/types.tsx

@@ -1302,7 +1302,7 @@ export type StyleResolver<Response = PropMappedValue> = (
   value: any,
   state: GetStyleState,
   defaultProps: any,
-  returnVariablesAs: 'auto' | 'value' | 'non-color-value',
+  returnVariablesAs: 'auto' | 'value',
   parentVariantKey: string,
   avoidDefaultProps?: boolean
 ) => Response

package/types/createComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":"AAGA,OAAO,KAWN,MAAM,OAAO,CAAA;AAiBd,OAAO,EACL,SAAS,EACT,cAAc,EACd,UAAU,EACV,WAAW,EACX,YAAY,EACZ,kBAAkB,EAClB,gBAAgB,EAEhB,qBAAqB,EACrB,cAAc,EAIf,MAAM,SAAS,CAAA;AAoBhB,eAAO,MAAM,qBAAqB,EAAE,qBAMnC,CAAA;AAwBD,eAAO,MAAM,QAAQ,eAAsB,CAAA;AAqB3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,MAAM,GAAG,EAAE,EACtC,GAAG,GAAG,cAAc,EACpB,SAAS,GAAG,KAAK,EACjB,cAAc,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,kBAAkB,4DAk3B3D;AAGD,eAAO,MAAM,QAAQ;YAAW;QAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAE;;CAAmB,CAAA;AAMrE,eAAO,MAAM,MAAM,0DA8CjB,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAC5B,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB,CAAA;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,mBAkGxD"}
+{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":"AAGA,OAAO,KAWN,MAAM,OAAO,CAAA;AAiBd,OAAO,EACL,SAAS,EACT,cAAc,EACd,UAAU,EACV,WAAW,EACX,YAAY,EACZ,kBAAkB,EAClB,gBAAgB,EAEhB,qBAAqB,EACrB,cAAc,EAIf,MAAM,SAAS,CAAA;AAoBhB,eAAO,MAAM,qBAAqB,EAAE,qBAMnC,CAAA;AAwBD,eAAO,MAAM,QAAQ,eAAsB,CAAA;AAqB3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,MAAM,GAAG,EAAE,EACtC,GAAG,GAAG,cAAc,EACpB,SAAS,GAAG,KAAK,EACjB,cAAc,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,kBAAkB,4DA80B3D;AAGD,eAAO,MAAM,QAAQ;YAAW;QAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAE;;CAAmB,CAAA;AAMrE,eAAO,MAAM,MAAM,0DA8CjB,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAC5B,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB,CAAA;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,mBAkGxD"}

package/types/createTamagui.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createTamagui.d.ts","sourceRoot":"","sources":["../src/createTamagui.ts"],"names":[],"mappings":"AAgBA,OAAO,EACL,kBAAkB,EAElB,kBAAkB,EAGnB,MAAM,SAAS,CAAA;AAKhB,wBAAgB,aAAa,CAAC,IAAI,SAAS,kBAAkB,EAC3D,QAAQ,EAAE,IAAI,GACb,kBAAkB,CAAC,IAAI,CAAC,CA2S1B"}
+{"version":3,"file":"createTamagui.d.ts","sourceRoot":"","sources":["../src/createTamagui.ts"],"names":[],"mappings":"AAgBA,OAAO,EACL,kBAAkB,EAElB,kBAAkB,EAGnB,MAAM,SAAS,CAAA;AAKhB,wBAAgB,aAAa,CAAC,IAAI,SAAS,kBAAkB,EAC3D,QAAQ,EAAE,IAAI,GACb,kBAAkB,CAAC,IAAI,CAAC,CA6S1B"}

package/types/helpers/createPropMapper.d.ts

@@ -1,5 +1,5 @@
 import type { PropMapper, StaticConfigParsed, TamaguiInternalConfig } from '../types';
-export type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both' | 'non-color-value';
+export type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both';
 export declare const createPropMapper: (staticConfig: StaticConfigParsed) => PropMapper;
 export declare function getFontFamilyFromNameOrVariable(input: any, conf: TamaguiInternalConfig): string | undefined;
 export declare const getPropMappedFontFamily: (expanded?: any) => any;

package/types/helpers/createPropMapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createPropMapper.d.ts","sourceRoot":"","sources":["../../src/helpers/createPropMapper.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAGV,UAAU,EACV,kBAAkB,EAElB,qBAAqB,EAEtB,MAAM,UAAU,CAAA;AAQjB,MAAM,MAAM,oBAAoB,GAC5B,MAAM,GACN,OAAO,GACP,UAAU,GACV,MAAM,GACN,iBAAiB,CAAA;AAErB,eAAO,MAAM,gBAAgB,iBAAkB,kBAAkB,eAuEhE,CAAA;AA2HD,wBAAgB,+BAA+B,CAAC,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,qBAAqB,sBAkBtF;AAMD,eAAO,MAAM,uBAAuB,cAAe,GAAG,QAErD,CAAA"}
+{"version":3,"file":"createPropMapper.d.ts","sourceRoot":"","sources":["../../src/helpers/createPropMapper.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAGV,UAAU,EACV,kBAAkB,EAElB,qBAAqB,EAEtB,MAAM,UAAU,CAAA;AAQjB,MAAM,MAAM,oBAAoB,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,MAAM,CAAA;AAEzE,eAAO,MAAM,gBAAgB,iBAAkB,kBAAkB,eAuEhE,CAAA;AA2HD,wBAAgB,+BAA+B,CAAC,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,qBAAqB,sBAkBtF;AAMD,eAAO,MAAM,uBAAuB,cAAe,GAAG,QAErD,CAAA"}

package/types/helpers/expandStyles.d.ts

@@ -5,6 +5,6 @@
  *   2. Normalizes various inconsistent styles to be more consistent
  *   3. Expands react-native shorthands, ie paddingHorizontal => paddingLeft, paddingRight
  */
-export declare function expandStylesAndRemoveNullishValues(style: Record<string, any>, { shorthands }?: import("..").TamaguiInternalConfig): Record<string, any>;
+export declare function expandStylesAndRemoveNullishValues(style: Record<string, any>): Record<string, any>;
 export declare function fixStyles(style: Record<string, any>): void;
 //# sourceMappingURL=expandStyles.d.ts.map

package/types/helpers/expandStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"expandStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/expandStyles.ts"],"names":[],"mappings":"AAQA;;;;;;GAMG;AAEH,wBAAgB,kCAAkC,CAChD,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC1B,EAAE,UAAU,EAAE,qCAAc,uBA2B7B;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAiBnD"}
+{"version":3,"file":"expandStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/expandStyles.ts"],"names":[],"mappings":"AAOA;;;;;;GAMG;AAEH,wBAAgB,kCAAkC,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,uBAuB5E;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QA0BnD"}