@tamagui/core 1.2.4 → 1.2.6

package/src/createFont.ts

@@ -1,50 +0,0 @@
-import { FontWeightSteps, GenericFont } from './types'
-
-const fontWeights: FontWeightSteps[] = [
-  '100',
-  '200',
-  '300',
-  '400',
-  '500',
-  '600',
-  '700',
-  '800',
-  '900',
-]
-
-const processSection = <T>(
-  section: string | Record<string, T>,
-  keys: string[],
-  defaultValue?: any
-): string | Record<string, T> => {
-  if (typeof section === 'string') return section
-
-  const sectionKeys = Object.keys(section)
-  let fillValue = section[sectionKeys[0]]
-
-  return Object.fromEntries(
-    [...new Set([...keys, ...sectionKeys])].map((key) => {
-      const value = section[key] ?? defaultValue ?? fillValue
-      fillValue = value
-      defaultValue = value
-      return [key, value]
-    })
-  )
-}
-
-export const createFont = <A extends GenericFont>(font: A): A => {
-  const sizeKeys = Object.keys(font.size)
-  const processedFont = Object.fromEntries(
-    Object.entries(font).map(([key, section]) => {
-      return [
-        key,
-        processSection(
-          section as any,
-          key === 'face' ? fontWeights : sizeKeys,
-          key === 'face' ? { normal: font.family } : undefined
-        ),
-      ]
-    })
-  )
-  return Object.freeze(processedFont) as A
-}

package/src/createShorthands.ts

@@ -1,7 +0,0 @@
-import { CreateShorthands } from './types'
-
-// just a type helper util
-
-export function createShorthands<A extends CreateShorthands>(shorthands: A): A {
-  return Object.freeze(shorthands) as any
-}

package/src/createTamagui.ts

@@ -1,253 +0,0 @@
-import { isRSC, isWeb } from '@tamagui/constants'
-
-import { configListeners, setConfig } from './config'
-import { createVariables, tokensKeysOrdered } from './createVariables'
-import { getThemeCSSRules } from './helpers/getThemeCSSRules'
-import {
-  getAllRules,
-  listenForSheetChanges,
-  scanAllSheets,
-} from './helpers/insertStyleRule'
-import {
-  registerCSSVariable,
-  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'
-import {
-  CreateTamaguiProps,
-  InferTamaguiConfig,
-  TamaguiInternalConfig,
-  ThemeParsed,
-} from './types'
-
-// config is re-run by the @tamagui/static, dont double validate
-const createdConfigs = new WeakMap<any, boolean>()
-
-export function createTamagui<Conf extends CreateTamaguiProps>(
-  configIn: Conf
-): InferTamaguiConfig<Conf> {
-  if (createdConfigs.has(configIn)) {
-    return configIn as any
-  }
-
-  if (process.env.NODE_ENV === 'development') {
-    if (!configIn.tokens) {
-      throw new Error('Must define tokens')
-    }
-    if (!configIn.themes) {
-      throw new Error('Must define themes')
-    }
-    if (!configIn.fonts) {
-      throw new Error('Must define fonts')
-    }
-  }
-
-  scanAllSheets()
-  listenForSheetChanges()
-
-  const fontTokens = Object.fromEntries(
-    Object.entries(configIn.fonts!).map(([k, v]) => {
-      return [k, createVariables(v, 'f', true)]
-    })
-  )
-
-  const fontsParsed = (() => {
-    const res = {} as typeof fontTokens
-    for (const familyName in fontTokens) {
-      res[`$${familyName}`] = parseFont(fontTokens[familyName])
-    }
-    return res!
-  })()
-
-  const themeConfig = (() => {
-    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 val = configIn.tokens[key][skey]
-          registerCSSVariable(val)
-          declarations.push(variableToCSS(val))
-        }
-      }
-
-      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 || ' ' : ''
-
-      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)
-        }
-      }
-    }
-
-    // dedupe themes to avoid duplicate CSS generation
-    type DedupedTheme = {
-      names: string[]
-      theme: ThemeParsed
-    }
-    const dedupedThemes: {
-      [key: string]: DedupedTheme
-    } = {}
-    const existing = new WeakMap<ThemeParsed, DedupedTheme>()
-
-    // first, de-dupe and parse them
-    for (const themeName in themes) {
-      const rawTheme = themes[themeName] as ThemeParsed
-
-      // if existing, avoid
-      if (existing.has(rawTheme)) {
-        const e = existing.get(rawTheme)!
-        themes[themeName] = e.theme
-        e.names.push(themeName)
-        continue
-      }
-
-      // ensure each theme object unique for dedupe
-      const theme = { ...rawTheme }
-      // parse into variables
-      for (const key in theme) {
-        // make sure properly names theme variables
-        ensureThemeVariable(theme, key)
-      }
-      themes[themeName] = theme
-
-      // set deduped
-      dedupedThemes[themeName] = {
-        names: [themeName],
-        theme,
-      }
-
-      existing.set(rawTheme, dedupedThemes[themeName])
-    }
-
-    // then, generate CSS from de-duped
-    let themeRuleSets: string[] = []
-
-    if (isWeb || isRSC) {
-      for (const themeName in dedupedThemes) {
-        themeRuleSets = [
-          ...themeRuleSets,
-          ...getThemeCSSRules({
-            config: configIn,
-            themeName,
-            ...dedupedThemes[themeName],
-          }),
-        ]
-      }
-    }
-
-    // proxy upwards to get parent variables (themes are subset going down)
-    for (const themeName in themes) {
-      themes[themeName] = proxyThemeToParents(themeName, themes[themeName], themes)
-    }
-
-    tokensValueToVariable.clear()
-
-    return {
-      themes,
-      cssRuleSets,
-      themeRuleSets,
-    }
-  })()
-
-  // faster $lookups
-  const tokensParsed: any = Object.fromEntries(
-    Object.entries(configIn.tokens).map(([k, v]) => {
-      const val = Object.fromEntries(Object.entries(v).map(([k, v]) => [`$${k}`, v]))
-      tokensKeysOrdered.set(val, tokensKeysOrdered.get(v))
-      return [k, val]
-    })
-  )
-
-  const shorthands = configIn.shorthands || {}
-
-  const config: TamaguiInternalConfig = {
-    fontLanguages: [],
-    animations: {} as any,
-    media: {},
-    ...configIn,
-    // already processed by createTokens()
-    tokens: configIn.tokens as any,
-    // vite made this into a function if it wasn't set
-    shorthands: { ...shorthands },
-    inverseShorthands: shorthands
-      ? Object.fromEntries(Object.entries(shorthands).map(([k, v]) => [v, k]))
-      : {},
-    themes: themeConfig.themes as any,
-    fontsParsed,
-    themeConfig,
-    tokensParsed,
-    parsed: true,
-    getCSS: (separator = '\n') => {
-      return `
-._ovs-contain {overscroll-behavior:contain;}
-.t_unmounted .t_will-mount {opacity:0;visibility:hidden;}
-.is_Text .is_Text {display:inline-flex;}
-._dsp_contents {display:contents;}
-${themeConfig.cssRuleSets.join(separator)}
-${themeConfig.themeRuleSets.join(separator)}
-${getAllRules().join(separator)}`
-    },
-    // const tokens = [...getToken(tokens.size[0])]
-    // .spacer-sm + ._dsp_contents._dsp-sm-hidden { margin-left: -var(--${}) }
-  }
-
-  configureMedia(config)
-  setConfig(config)
-
-  if (configListeners.size) {
-    configListeners.forEach((cb) => cb(config))
-    configListeners.clear()
-  }
-
-  createdConfigs.set(config, true)
-
-  if (process.env.NODE_ENV === 'development') {
-    if (process.env.DEBUG?.startsWith('tamagui')) {
-      // eslint-disable-next-line no-console
-      console.log('Tamagui config:', config)
-    }
-    if (!globalThis['Tamagui']) {
-      globalThis['Tamagui'] = Tamagui
-    }
-  }
-
-  return config as any
-}

package/src/createTheme.ts

@@ -1,13 +0,0 @@
-import type { Variable } from './createVariable'
-
-type GenericTheme = { [key: string]: string | Variable }
-
-// export const themeToVariableToValueMap = new WeakMap<any, Record<string, string>>()
-
-export const createTheme = <Theme extends GenericTheme>(
-  theme: Theme
-): {
-  [K in keyof Theme]: Theme[K] | string | Variable
-} => {
-  return theme
-}

package/src/createTokens.ts

@@ -1,46 +0,0 @@
-import { Variable } from './createVariable'
-import { createVariables } from './createVariables'
-import { CreateTokens } from './types'
-
-// tokens.color.dark.red ===> { var: `color-dark-red`, val: '' }
-export function createTokens<T extends CreateTokens>(tokens: T): MakeTokens<T> {
-  return createVariables(tokens) as any
-}
-
-// verbose but gives us nice types...
-type MakeTokens<T> = T extends {
-  color: infer E
-  space: infer F
-  size: infer G
-  radius: infer H
-  zIndex: infer J
-}
-  ? {
-      color: {
-        // removes $ prefix allowing for defining either as $1: or 1:,
-        // which is important because Chrome re-orders numerical-seeming keys :/
-        [Key in keyof E extends `$${infer X}` ? X : keyof E]: Variable<string>
-      }
-      space: {
-        [Key in keyof F extends `$${infer X}` ? X : keyof F]: Variable<number>
-      }
-      size: {
-        [Key in keyof G extends `$${infer X}` ? X : keyof G]: Variable<number>
-      }
-      radius: {
-        [Key in keyof H extends `$${infer X}` ? X : keyof H]: Variable<number>
-      }
-      zIndex: {
-        [Key in keyof J extends `$${infer X}` ? X : keyof J]: Variable<number>
-      }
-    }
-  : never
-
-// test
-const tokens = createTokens({
-  size: { 0: 1 },
-  space: { 0: 1 },
-  radius: { 0: 1 },
-  zIndex: { 0: 1 },
-  color: { 0: 'hi' },
-})

package/src/createVariable.ts

@@ -1,93 +0,0 @@
-import { isWeb } from '@tamagui/constants'
-import { simpleHash } from '@tamagui/helpers'
-
-import { getConfig } from './config'
-
-/**
- * Should rename this to Token
- * Moving to objects for React Server Components support
- */
-
-const IS_VAR = 'isVar'
-
-export interface Variable<A = any> {
-  [IS_VAR]?: true
-  variable?: string
-  val: A
-  name: string
-  key: string
-}
-
-export type MakeVariable<A = any> = A extends string | number ? Variable<A> : A
-
-type VariableIn<A = any> = Pick<Variable<A>, 'key' | 'name' | 'val'>
-export const createVariable = <A extends string | number | Variable = any>(
-  props: VariableIn<A>
-): Variable<A> => {
-  if (isVariable(props)) return props
-  const { key, name, val } = props
-  return {
-    [IS_VAR]: true,
-    key: key!,
-    name: simpleHash(name, 40),
-    val: val as any,
-    variable: isWeb ? createCSSVariable(name) : '',
-  }
-}
-
-// could do weakmap cache
-export function variableToString(vrble?: any, getValue = false) {
-  if (isVariable(vrble)) {
-    if (!getValue && isWeb && vrble.variable) {
-      return vrble.variable
-    }
-    return `${vrble.val}`
-  }
-  return `${vrble || ''}`
-}
-
-export function isVariable(v: Variable | any): v is Variable {
-  return v && typeof v === 'object' && IS_VAR in v
-}
-
-export function getVariable(nameOrVariable: Variable | string) {
-  setDidGetVariableValue(true)
-  if (isVariable(nameOrVariable)) {
-    return variableToString(nameOrVariable)
-  }
-  const tokens = getConfig().tokensParsed
-  return variableToString(tokens[nameOrVariable] ?? nameOrVariable)
-}
-
-let accessed = false
-export const setDidGetVariableValue = (val: boolean) => (accessed = val)
-export const didGetVariableValue = () => accessed
-
-export function getVariableValue(v: Variable | any) {
-  if (isVariable(v)) {
-    setDidGetVariableValue(true)
-    return v.val
-  }
-  return v
-}
-
-export function getVariableName(v: Variable | any) {
-  if (isVariable(v)) return v.name
-  return v
-}
-
-export function getVariableVariable(v: Variable | any) {
-  if (isVariable(v)) return v.variable
-  return v
-}
-
-// bugfix { space: { 0.5: 10 } } was generating var(--space-0.5) (invalid CSS):
-export const createCSSVariable = (nameProp: string, includeVar = true) => {
-  if (process.env.NODE_ENV === 'development') {
-    if (!nameProp || typeof nameProp !== 'string') {
-      throw new Error(`createCSSVariable expected string: ${nameProp}`)
-    }
-  }
-  const name = simpleHash(nameProp, 60)
-  return includeVar ? `var(--${name})` : name
-}

package/src/createVariables.ts

@@ -1,55 +0,0 @@
-import { simpleHash } from '@tamagui/helpers'
-
-import { Variable, createVariable, isVariable } from './createVariable'
-
-type DeepTokenObject<Val extends string | number = any> = {
-  [key: string]: Val | DeepTokenObject<Val>
-}
-
-export type DeepVariableObject<A extends DeepTokenObject> = {
-  [Key in keyof A]: A[Key] extends string | number
-    ? Variable<A[Key]>
-    : A[Key] extends DeepTokenObject
-    ? DeepVariableObject<A[Key]>
-    : never
-}
-
-export const tokensKeysOrdered = new WeakMap()
-
-export const createVariables = <A extends DeepTokenObject>(
-  tokens: A,
-  parentPath = '',
-  isFont = false
-): DeepVariableObject<A> => {
-  const res: any = {}
-  let i = 0
-  for (let key in tokens) {
-    i++
-    const val = tokens[key]
-    // always remove $ prefix
-    if (key[0] === '$') {
-      // @ts-ignore
-      key = key.slice(1)
-    }
-    if (isVariable(val)) {
-      res[key] = val
-      continue
-    }
-    const niceKey = simpleHash(key)
-    let name = isFont ? niceKey.slice(0, 2) : i
-    name = parentPath ? `${parentPath}-${name}` : niceKey
-    if (val && typeof val === 'object') {
-      // recurse
-      res[key] = createVariables(tokens[key] as any, name)
-      continue
-    }
-    res[key] = isVariable(val) ? val : createVariable({ val, name, key: niceKey })
-  }
-
-  // ordering for relative sizing for now just size/space
-  if (parentPath === 'size' || parentPath === 'space') {
-    tokensKeysOrdered.set(res, Object.keys(tokens))
-  }
-
-  return res
-}

package/src/helpers/RNComponents.tsx

@@ -1,14 +0,0 @@
-import { Image, Text, TextInput, View } from 'react-native'
-
-// limited support
-export const RNComponents = new Set<any>([
-  Image,
-  TextInput,
-  Text,
-  View,
-  // see fake-react-native + styled() check
-  'Image',
-  'TextInput',
-  'Text',
-  'View',
-])