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

package/src/addTheme.ts

@@ -0,0 +1,67 @@
+import { isWeb } from '@tamagui/constants'
+
+import { getConfig, updateConfig } from './config'
+import { getThemeCSSRules } from './helpers/getThemeCSSRules'
+import { ensureThemeVariable, proxyThemeToParents } from './helpers/themes'
+import { ThemeDefinition, ThemeParsed } from './types'
+
+export function addTheme({
+  name: themeName,
+  theme: themeIn,
+  insertCSS,
+  update,
+}: {
+  name: string
+  theme: ThemeDefinition
+  insertCSS?: boolean
+  update?: boolean
+}) {
+  const config = getConfig()
+  if (process.env.NODE_ENV === 'development') {
+    if (!config) {
+      throw new Error(`Must run createTamagui once before loading theme`)
+    }
+    if (!update && config.themes[themeName]) {
+      throw new Error(`Already defined theme "${themeName}", use updateTheme to change values`)
+    }
+  }
+
+  const theme = { ...themeIn } as ThemeParsed
+  for (const key in theme) {
+    ensureThemeVariable(theme, key)
+  }
+
+  const themeProxied = proxyThemeToParents(themeName, theme, config.themes)
+  config.themes[themeName] = themeProxied
+
+  let cssRules: string[] = []
+
+  if (isWeb) {
+    if (insertCSS) {
+      cssRules = getThemeCSSRules({
+        config,
+        themeName,
+        names: [themeName],
+        theme,
+      })
+      const id = `tamagui_theme_style_${themeName}`
+      const existing = document.querySelector(`#${id}`)
+      const style = document.createElement('style')
+      style.id = id
+      style.appendChild(document.createTextNode(cssRules.join('\n')))
+      document.head.appendChild(style)
+      if (existing) {
+        existing.parentElement?.removeChild(existing)
+      }
+    }
+  }
+
+  updateConfig('themes', { ...config.themes, [themeName]: themeProxied })
+
+  // trigger updates in components
+
+  return {
+    theme: themeProxied,
+    cssRules,
+  }
+}

package/src/config.ts

@@ -0,0 +1,45 @@
+import { ConfigListener, TamaguiInternalConfig, ThemeParsed, Tokens } from './types'
+
+let conf: TamaguiInternalConfig | null
+
+export const setConfig = (next: TamaguiInternalConfig) => {
+  conf = next
+  if (configListeners.size) {
+    configListeners.forEach((cb) => cb(conf!))
+    configListeners.clear()
+  }
+}
+
+export const setConfigFont = (name: string, font: any, fontParsed: any) => {
+  if (process.env.NODE_ENV === 'development') {
+    if (!conf) throw new Error(`Haven't called createTamagui yet`)
+  }
+  Object.assign(conf!.fonts, { [name]: font })
+  Object.assign(conf!.fontsParsed, { [`$${name}`]: fontParsed })
+}
+
+export const getHasConfigured = () => !!conf
+export const getConfig = () => conf!
+export const getTokens = (prefixed?: boolean): Tokens =>
+  prefixed ? conf!.tokensParsed : conf!.tokens
+
+/**
+ * Note: this is the same as `getTokens`
+ */
+export const useTokens = getTokens
+
+export const getThemes = () => conf!.themes
+
+export const configListeners = new Set<ConfigListener>()
+
+export const onConfiguredOnce = (cb: ConfigListener) => {
+  if (conf) {
+    cb(conf!)
+  } else {
+    configListeners.add(cb)
+  }
+}
+
+export const updateConfig = (key: string, value: any) => {
+  Object.assign(key, value)
+}

package/src/constants/constants.ts

@@ -0,0 +1,15 @@
+import { isWeb } from '@tamagui/constants'
+
+export const THEME_NAME_SEPARATOR = '_'
+export const THEME_CLASSNAME_PREFIX = `t_`
+
+export const stackDefaultStyles = {
+  alignItems: 'stretch',
+  flexShrink: 0,
+  // more accurately match react-native defaults on web
+  ...(isWeb && {
+    display: 'flex',
+    flexBasis: 'auto',
+    boxSizing: 'border-box',
+  }),
+}

package/src/constants/isDevTools.ts

@@ -0,0 +1,6 @@
+// for verbose logging outside node/cli
+
+export const isDevTools =
+  process.env.NODE_ENV === 'development'
+    ? new Function('try {return this===window;}catch(e){ return false;}')()
+    : false

package/src/constants/platform.native.ts

@@ -0,0 +1,14 @@
+import { useLayoutEffect } from 'react'
+import { Platform } from 'react-native'
+
+export const isAndroid = Platform?.OS === 'android'
+export const isIOS = Platform?.OS === 'ios'
+export const isWeb = false
+export const isWindowDefined = false
+export const isServer = false
+export const isClient = false
+export const isRSC = false
+export const useIsomorphicLayoutEffect = useLayoutEffect
+export const isChrome = false
+export const isWebTouchable = false
+export const isTouchable = true

package/src/constants/platform.ts

@@ -0,0 +1,41 @@
+import { useEffect, useLayoutEffect } from 'react'
+import { Platform } from 'react-native'
+
+export const isAndroid = Platform?.OS === 'android'
+export const isIOS = Platform?.OS === 'ios'
+export const isWeb = process.env.TAMAGUI_TARGET === 'web'
+export const isWindowDefined = typeof window !== 'undefined'
+export const isServer = isWeb && !isWindowDefined
+export const isClient = isWeb && isWindowDefined
+
+// may want to move to VITE_RSC_BUILD
+export const isRSC = process.env.ENABLE_RSC
+  ? // note this is statically analyzed so no funny business, just access it without optional chaining
+    // @ts-ignore
+    import.meta.env
+    ? // @ts-ignore
+      import.meta.env.SSR
+    : false
+  : false
+
+const idFn = () => {}
+export const useIsomorphicLayoutEffect = isRSC ? idFn : isServer ? useEffect : useLayoutEffect
+export const isChrome = typeof navigator !== 'undefined' && /Chrome/.test(navigator.userAgent || '')
+export const isWebTouchable = isClient && 'ontouchstart' in window
+export const isTouchable = !isWeb || isWebTouchable
+
+if (process.env.NODE_ENV === 'development') {
+  if (!process.env.TAMAGUI_TARGET) {
+    // eslint-disable-next-line no-console
+    console.warn(`Must set TAMAGUI_TARGET to "web" or "native"`)
+  } else if (
+    isClient &&
+    process.env.TAMAGUI_TARGET !== 'web' &&
+    process.env.TAMAGUI_IGNORE_TARGET !== '1'
+  ) {
+    // eslint-disable-next-line no-console
+    console.warn(
+      `Must set TAMAGUI_TARGET to "web" for web apps - if you have window defined outside of the browser, set TAMAGUI_IGNORE_TARGET=1 to hide this`
+    )
+  }
+}

package/src/contexts/ButtonInsideButtonContext.tsx

@@ -0,0 +1,3 @@
+import { createContext } from 'react'
+
+export const ButtonInsideButtonContext = createContext(false)

package/src/contexts/FontLanguageContext.tsx

@@ -0,0 +1,5 @@
+import { createContext } from 'react'
+
+import { LanguageContextType } from '../views/FontLanguage.types'
+
+export const FontLanguageContext = createContext<LanguageContextType | null>(null)

package/src/contexts/TextAncestorContext.tsx

@@ -0,0 +1,10 @@
+import { TextAncestorContext as RNWTextAncestorContext } from '@tamagui/rnw'
+import React, { createContext } from 'react'
+
+export const FallbackNativeContext = createContext(false)
+
+export const TextAncestorContext = RNWTextAncestorContext ?? FallbackNativeContext
+
+export const TextAncestorProvider = (props) => {
+  return <TextAncestorContext.Provider value={false}>{props.children}</TextAncestorContext.Provider>
+}

package/src/contexts/ThemeContext.tsx

@@ -0,0 +1,5 @@
+import { createContext } from 'react'
+
+import { ThemeName, Themes } from '../types'
+
+export const ThemeContext = createContext<{ themes: Themes; defaultTheme: ThemeName } | null>(null)