@tamagui/core 1.0.1-beta.153 → 1.0.1-beta.156

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/core",
-  "version": "1.0.1-beta.153",
+  "version": "1.0.1-beta.156",
   "source": "src/index.ts",
   "main": "dist/cjs",
   "module": "dist/esm",
@@ -17,7 +17,7 @@
     "watch": "tamagui-build --watch",
     "clean": "tamagui-build clean",
     "clean:build": "tamagui-build clean:build",
-    "test": "vitest --run --config ../vite-plugin-internal/vite.config.ts"
+    "test": "vitest --run --config ../vite-plugin-internal/src/vite.config.ts"
   },
   "files": [
     "types",
@@ -27,14 +27,14 @@
   ],
   "dependencies": {
     "@expo/match-media": "^0.3.0",
-    "@tamagui/compose-refs": "^1.0.1-beta.153",
-    "@tamagui/helpers": "^1.0.1-beta.153",
-    "@tamagui/normalize-css-color-lite": "^1.0.1-beta.153",
-    "@tamagui/rnw": "^1.0.1-beta.153",
-    "@tamagui/rnw-lite": "^1.0.1-beta.153",
-    "@tamagui/use-debounce": "^1.0.1-beta.153",
-    "@tamagui/use-event": "^1.0.1-beta.153",
-    "@tamagui/use-force-update": "^1.0.1-beta.153",
+    "@tamagui/compose-refs": "^1.0.1-beta.156",
+    "@tamagui/helpers": "^1.0.1-beta.156",
+    "@tamagui/normalize-css-color-lite": "^1.0.1-beta.156",
+    "@tamagui/rnw": "^1.0.1-beta.156",
+    "@tamagui/rnw-lite": "^1.0.1-beta.156",
+    "@tamagui/use-debounce": "^1.0.1-beta.156",
+    "@tamagui/use-event": "^1.0.1-beta.156",
+    "@tamagui/use-force-update": "^1.0.1-beta.156",
     "expo-screen-orientation": "^4.3.0",
     "hyphenate-style-name": "^1.0.4"
   },
@@ -43,7 +43,7 @@
     "react-dom": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "^1.0.1-beta.153",
+    "@tamagui/build": "^1.0.1-beta.156",
     "@types/react": "^18.0.15",
     "csstype": "^3.0.10",
     "esbuild": "^0.14.49",

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/createComponent.tsx

@@ -22,7 +22,7 @@ import React, {
   useContext,
   useEffect,
 } from 'react'
-import { StyleSheet, Text, View, ViewStyle } from 'react-native'
+import { Text, View, ViewStyle } from 'react-native'
 
 import { getConfig, onConfiguredOnce } from './config'
 import { stackDefaultStyles } from './constants/constants'
@@ -31,7 +31,6 @@ import { FontLanguageContext } from './contexts/FontLanguageContext'
 import { TextAncestorContext } from './contexts/TextAncestorContext'
 import { assignNativePropsToWeb } from './helpers/assignNativePropsToWeb'
 import { getReturnVariablesAs } from './helpers/createPropMapper'
-import { createShallowUpdate } from './helpers/createShallowUpdate'
 import { extendStaticConfig, parseStaticConfig } from './helpers/extendStaticConfig'
 import {
   SplitStyleResult,
@@ -42,6 +41,7 @@ import {
 import { getAllSelectors } from './helpers/insertStyleRule'
 import { mergeProps } from './helpers/mergeProps'
 import { proxyThemeVariables } from './helpers/proxyThemeVariables'
+import { useShallowSetState } from './helpers/useShallowSetState'
 import { addMediaQueryListener, mediaState, removeMediaQueryListener } from './hooks/useMedia'
 import { usePressable } from './hooks/usePressable'
 import { useServerRef, useServerState } from './hooks/useServerHooks'
@@ -98,7 +98,6 @@ function mergeShorthands({ defaultProps }: StaticConfigParsed, { shorthands }: T
 
 let initialTheme: any
 let config: TamaguiInternalConfig
-let mediaPropNames: string[] = []
 
 export function createComponent<
   ComponentPropTypes extends Object = {},
@@ -120,7 +119,6 @@ export function createComponent<
   let AnimatedView: any
   let avoidClasses = true
   let defaultNativeStyle: any
-  let defaultNativeStyleSheet: StyleSheet.NamedStyles<{ base: {} }>
   let tamaguiDefaultProps: any
   let initialSplitStyles: SplitStyleResult
 
@@ -180,9 +178,9 @@ export function createComponent<
       props['debug']
     )
 
-    const hostRef = useServerRef<HTMLElement | View>(null)
+    const hostRef = useServerRef<TamaguiElement>(null)
     const setState = states[1]
-    const setStateShallow = createShallowUpdate(setState)
+    const setStateShallow = useShallowSetState(setState)
 
     if (process.env.NODE_ENV === 'development') {
       if (props['debug']) {
@@ -194,11 +192,17 @@ export function createComponent<
         // eslint-disable-next-line no-console
         console.group(`%c 🐛 ${banner}`, 'background: yellow;')
         // eslint-disable-next-line no-console
-        console.log('props in', propsIn)
+        console.groupCollapsed('initial state')
+        // eslint-disable-next-line no-console
+        console.log('props', propsIn)
+        // eslint-disable-next-line no-console
+        console.log('splitStyles', splitStyles)
         if (typeof window !== 'undefined') {
           // eslint-disable-next-line no-console
           console.log('ref', hostRef, '(click to view)')
         }
+        // eslint-disable-next-line no-console
+        console.groupEnd()
         if (props['debug'] === 'break') {
           // eslint-disable-next-line no-debugger
           debugger
@@ -610,7 +614,7 @@ export function createComponent<
       }
     }
 
-    if (process.env.NODE_ENV === 'development' && !isText && isWeb) {
+    if (process.env.NODE_ENV === 'development' && !isText && isWeb && !staticConfig.isHOC) {
       Children.toArray(props.children).forEach((item) => {
         if (typeof item === 'string') {
           // eslint-disable-next-line no-console
@@ -619,12 +623,19 @@ export function createComponent<
       })
     }
 
+    const unPress = useCallback(() => {
+      setStateShallow({
+        press: false,
+        pressIn: false,
+      })
+    }, [setStateShallow])
+
     if (!isRSC) {
       useEffect(() => {
         return () => {
           mouseUps.delete(unPress)
         }
-      }, [])
+      }, [unPress])
     }
 
     let styles: any[]
@@ -638,11 +649,7 @@ export function createComponent<
         ...medias,
       }
     } else {
-      styles = [
-        isWeb ? null : defaultNativeStyleSheet ? (defaultNativeStyleSheet.base as ViewStyle) : null,
-        animationStyles ?? style,
-        medias,
-      ]
+      styles = [isWeb ? null : defaultNativeStyle, animationStyles ?? style, medias]
       if (!animationStyles && initialSplitStyles) {
         const initPseudos = initialSplitStyles.pseudos
         !state.mounted && addPseudoToStyles(styles, initPseudos, pseudos, 'enterStyle')
@@ -775,13 +782,6 @@ export function createComponent<
             'onMouseEnter' in props ||
             'onMouseLeave' in props)))
 
-    const unPress = useCallback(() => {
-      setStateShallow({
-        press: false,
-        pressIn: false,
-      })
-    }, [])
-
     const events =
       shouldAttach && !isRSC
         ? {
@@ -1142,10 +1142,6 @@ export function createComponent<
       }
     }
 
-    defaultNativeStyleSheet = StyleSheet.create({
-      base: defaultNativeStyle,
-    })
-
     if (Object.keys(defaults).length) {
       tamaguiDefaultProps = defaults
     }
@@ -1184,7 +1180,7 @@ export function createComponent<
         Component,
         ...conf,
         neverFlatten: true,
-        isExtractable: true,
+        isHOC: true,
         defaultProps: {
           ...Component.defaultProps,
           ...conf?.defaultProps,
@@ -1372,12 +1368,20 @@ function isUnspaced(child: React.ReactNode) {
 
 function AbsoluteFill(props: { children?: any }) {
   return (
-    <View pointerEvents="box-none" style={StyleSheet.absoluteFill}>
+    <View pointerEvents="box-none" style={absoluteFill}>
       {props.children}
     </View>
   )
 }
 
+const absoluteFill = {
+  position: 'absolute',
+  top: 0,
+  left: 0,
+  right: 0,
+  bottom: 0,
+} as const
+
 // this can be done with CSS entirely right?
 // const shouldWrapTextAncestor = isWeb && isText && !hasTextAncestor
 // if (shouldWrapTextAncestor) {

package/src/helpers/createPropMapper.ts

@@ -1,4 +1,5 @@
 import { getConfig } from '../config'
+import { isDevTools } from '../constants/isDevTools'
 import { isWeb } from '../constants/platform'
 import { Variable, isVariable } from '../createVariable'
 import {
@@ -380,21 +381,24 @@ const getToken = (
     }
   }
   if (hasSet) {
+    if (process.env.NODE_ENV === 'development' && isDevTools && debug === 'verbose') {
+      // eslint-disable-next-line no-console
+      console.log(`   ﹒ propMapper getToken`, key, valOrVar)
+    }
     return getVariableValue(key, valOrVar, resolveAs)
   }
   if (process.env.NODE_ENV === 'development') {
     if (value && value[0] === '$') {
+      // eslint-disable-next-line no-console
       console.trace(
         `⚠️ You've passed the value "${value}" to the style property "${key}", but there's no theme or token with the key "${value}". Using theme "${theme.name}".
 
 Set the debug prop to true to see more detailed debug information.`
       )
       if (debug) {
-        if (typeof window !== 'undefined') {
-          console.log('Looked in:')
-          console.log('Theme:', theme)
-          console.log('Tokens:', tokensParsed)
-          console.log('Fonts:', fontsParsed)
+        if (isDevTools) {
+          // eslint-disable-next-line no-console
+          console.log('Looked in:', { theme, tokensParsed, fontsParsed })
         }
       }
       return null

package/src/helpers/getSplitStyles.tsx

@@ -1,8 +1,9 @@
 import { stylePropsText, stylePropsTransform, validPseudoKeys, validStyles } from '@tamagui/helpers'
-import { useInsertionEffect } from 'react'
-import { ViewStyle } from 'react-native'
+import { useInsertionEffect, useMemo } from 'react'
+import type { ViewStyle } from 'react-native'
 
 import { getConfig } from '../config'
+import { isDevTools } from '../constants/isDevTools'
 import { isClient, isRSC, isWeb, useIsomorphicLayoutEffect } from '../constants/platform'
 import { mediaQueryConfig, mediaState } from '../hooks/useMedia'
 import type {
@@ -255,6 +256,11 @@ export const getSplitStyles: StyleSplitter = (
       continue
     }
 
+    if (process.env.NODE_ENV === 'development' && debug === 'verbose') {
+      // eslint-disable-next-line no-console
+      console.groupCollapsed('  🔹 styles', keyInit, valInit)
+    }
+
     const expanded =
       isMedia || isPseudo
         ? [[keyInit, valInit]]
@@ -271,7 +277,11 @@ export const getSplitStyles: StyleSplitter = (
 
     if (process.env.NODE_ENV === 'development' && debug === 'verbose') {
       // eslint-disable-next-line no-console
-      console.log('  🔹 getSplitStyles', keyInit, valInit, expanded)
+      console.log('expanded', expanded)
+      // eslint-disable-next-line no-console
+      console.log('usedKeys', [...usedKeys])
+      // eslint-disable-next-line no-console
+      console.groupEnd()
     }
 
     if (!expanded) {
@@ -456,46 +466,49 @@ export const getSplitStyles: StyleSplitter = (
         style[key] = atomicStyle.value
       }
     }
-  } else {
-    if (classNames && state.resolveVariablesAs === 'value') {
-      // getting real values for colors for animations (reverse mapped from CSS)
-      // this isn't beautiful, but will do relatively fine performance for now
-      // has a bug still - try adding <Switch theme="bouncy" /> should animate bg color on active
-      // const selectors = getAllSelectors()
-      // for (const key in classNames) {
-      //   if (key.endsWith('Color')) {
-      //     const selector = classNames[key]
-      //     let value = selectorValuesCache[selector]
-      //     if (!value) {
-      //       const css = selectors[selector]
-      //       value = css.replace(/.*:/, '').replace(/;.*/, '')
-      //       if (value) {
-      //         const themeUnwrapped = getThemeUnwrapped(theme)
-      //         const map = themeToVariableToValueMap.get(themeUnwrapped)
-      //         if (map && value.startsWith('var(')) {
-      //           value = map[value]
-      //         }
-      //         if (value) {
-      //           selectorValuesCache[selector] = value
-      //         }
-      //       } else {
-      //         // err
-      //         continue
-      //       }
-      //     }
-      //     if (value) {
-      //       style[key] = value
-      //     }
-      //   }
-      // }
-    }
   }
 
+  // else {
+  // if (classNames && state.resolveVariablesAs === 'value') {
+  // getting real values for colors for animations (reverse mapped from CSS)
+  // this isn't beautiful, but will do relatively fine performance for now
+  // has a bug still - try adding <Switch theme="bouncy" /> should animate bg color on active
+  // const selectors = getAllSelectors()
+  // for (const key in classNames) {
+  //   if (key.endsWith('Color')) {
+  //     const selector = classNames[key]
+  //     let value = selectorValuesCache[selector]
+  //     if (!value) {
+  //       const css = selectors[selector]
+  //       value = css.replace(/.*:/, '').replace(/;.*/, '')
+  //       if (value) {
+  //         const themeUnwrapped = getThemeUnwrapped(theme)
+  //         const map = themeToVariableToValueMap.get(themeUnwrapped)
+  //         if (map && value.startsWith('var(')) {
+  //           value = map[value]
+  //         }
+  //         if (value) {
+  //           selectorValuesCache[selector] = value
+  //         }
+  //       } else {
+  //         // err
+  //         continue
+  //       }
+  //     }
+  //     if (value) {
+  //       style[key] = value
+  //     }
+  //   }
+  // }
+  // }
+  // }
+
   if (process.env.TAMAGUI_TARGET === 'web') {
     if (transforms) {
       for (const namespace in transforms) {
         if (!transforms[namespace]) {
           if (process.env.NODE_ENV === 'development') {
+            // eslint-disable-next-line no-console
             console.warn('Error no transform', transforms, namespace)
           }
           continue
@@ -518,10 +531,17 @@ export const getSplitStyles: StyleSplitter = (
   }
 
   if (process.env.NODE_ENV === 'development' && debug === 'verbose') {
-    if (typeof document !== 'undefined') {
+    if (isDevTools) {
       // prettier-ignore
       // eslint-disable-next-line no-console
-      console.log('  🔹 getSplitStyles out', { style, pseudos, medias, classNames, viewProps, state, rulesToInsert })
+      console.groupCollapsed('  🔹 styles =>')
+      const logs = { style, pseudos, medias, classNames, viewProps, state, rulesToInsert }
+      for (const key in logs) {
+        // eslint-disable-next-line no-console
+        console.log(key, logs[key])
+      }
+      // eslint-disable-next-line no-console
+      console.groupEnd()
     }
   }
 

package/src/helpers/getStylesAtomic.ts

@@ -5,7 +5,7 @@
 
 import { StyleObject, simpleHash } from '@tamagui/helpers'
 import hyphenateStyleName from 'hyphenate-style-name'
-import { TextStyle, ViewStyle } from 'react-native'
+import type { TextStyle, ViewStyle } from 'react-native'
 
 import { getConfig } from '../config'
 import { TamaguiInternalConfig } from '../types'

package/src/helpers/getThemeCSSRules.ts

@@ -1,5 +1,5 @@
 import { THEME_CLASSNAME_PREFIX } from '../constants/constants'
-import { Variable } from '../createVariable'
+import { Variable, variableToString } from '../createVariable'
 import { CreateTamaguiProps, ThemeObject } from '../types'
 import { tokensValueToVariable } from './registerCSSVariable'
 
@@ -95,7 +95,7 @@ export function getThemeCSSRules({
     const isDark = themeName.startsWith('dark')
     cssRuleSets.push(
       `@media(prefers-color-scheme: ${isDark ? 'dark' : 'light'}) {
-body { background:${theme.background}; color: ${theme.color} }
+body { background:${variableToString(theme.background)}; color: ${variableToString(theme.color)} }
 :root {${vars} } 
 }`
     )

package/src/helpers/mergeTransform.ts

@@ -1,4 +1,4 @@
-import { ViewStyle } from 'react-native'
+import type { ViewStyle } from 'react-native'
 
 export const mergeTransform = (obj: ViewStyle, key: string, val: any, backwards = false) => {
   obj.transform ||= []

package/src/helpers/normalizeValueWithProperty.ts

@@ -9,7 +9,9 @@ const cache = {}
 
 export function normalizeValueWithProperty(value: any, property?: string): any {
   const cached = cache[value]
-  if (cached) return cached
+  if (cached) {
+    return cached
+  }
   let res = value
   if (
     process.env.TAMAGUI_TARGET === 'web' &&

package/src/helpers/{createShallowUpdate.tsx → useShallowSetState.tsx}

@@ -1,6 +1,6 @@
 import React, { useCallback } from 'react'
 
-export function createShallowUpdate<State extends Object>(
+export function useShallowSetState<State extends Object>(
   setter: React.Dispatch<React.SetStateAction<State>>
 ) {
   // eslint-disable-next-line react-hooks/rules-of-hooks

package/src/hooks/useTheme.tsx

@@ -2,6 +2,7 @@ import { useForceUpdate } from '@tamagui/use-force-update'
 import React, { useContext, useLayoutEffect, useMemo, useRef, useState } from 'react'
 
 import { getConfig } from '../config'
+import { isDevTools } from '../constants/isDevTools'
 import { isRSC, isSSR, useIsomorphicLayoutEffect } from '../constants/platform'
 import { ThemeContext } from '../contexts/ThemeContext'
 import { areEqualSets } from '../helpers/areEqualSets'
@@ -55,7 +56,14 @@ export const useTheme = (
   if (process.env.NODE_ENV === 'development') {
     if (props?.debug === 'verbose') {
       // eslint-disable-next-line no-console
-      console.log('  🔹 useTheme', { themeName, componentName, name, className })
+      console.groupCollapsed('  🔹 useTheme =>', name)
+      const logs = { themeName, componentName, name, className, ...(isDevTools && { theme }) }
+      for (const key in logs) {
+        // eslint-disable-next-line no-console
+        console.log('  ', key, logs[key])
+      }
+      // eslint-disable-next-line no-console
+      console.groupEnd()
     }
   }
 
@@ -91,7 +99,7 @@ export const useTheme = (
 
   return useMemo(() => {
     return getThemeProxied(theme, name, className, themeManager, state, debugProp)
-  }, [theme, name, themeManager, className, debugProp])
+  }, [theme, name, className, themeManager, state, debugProp])
 }
 
 function getThemeProxied(
@@ -224,20 +232,21 @@ export const useChangeThemeEffect = (
     return new ThemeManager(next.name, next.theme, parentManager, reset)
   })
 
-  // if not SSR
+  // not concurrent safe for now but fixes bug in showing old value
+  if (next?.name !== themeManager.name || next?.className !== themeManager.className) {
+    themeManager.update(next)
+  }
+
   if (!isSSR) {
     useLayoutEffect(() => {
       activeThemeManagers.add(themeManager)
 
-      if (next?.name) {
-        themeManager.update(next)
-      }
-
       const disposeParentOnChange = parentManager.onChangeTheme(() => {
         const next = parentManager.getNextTheme(getThemeProps, debug)
         if (!next) return
         if (themeManager.update(next)) {
           if (process.env.NODE_ENV === 'development' && debug) {
+            // eslint-disable-next-line no-console
             console.log('Changed theme', componentName, next, { props })
           }
           forceUpdate()

package/src/index.ts

@@ -22,7 +22,7 @@ export * from './constants/platform'
 export { createDOMProps } from '@tamagui/rnw'
 
 export * from './helpers/calc'
-export * from './helpers/createShallowUpdate'
+export * from './helpers/useShallowSetState'
 export * from './helpers/getStackSize'
 export * from './helpers/getVariantExtras'
 export * from './helpers/getAnimationDriver'

package/src/styled.tsx

@@ -10,6 +10,7 @@ import {
   StaticConfig,
   StylableComponent,
   TamaguiComponent,
+  TamaguiElement,
   VariantDefinitions,
   VariantSpreadFunction,
 } from './types'
@@ -38,6 +39,16 @@ export function styled<
   const staticConfigProps = (() => {
     const parentStaticConfig =
       'staticConfig' in Component ? (Component.staticConfig as StaticConfig) : null
+
+    if (process.env.NODE_ENV === 'development') {
+      if (parentStaticConfig?.isHOC) {
+        // eslint-disable-next-line no-console
+        console.warn(
+          `Warning: Parent component is a functional component, not a Tamagui styled() component. Extending with styled() will break and lead to incorrect styles.`
+        )
+      }
+    }
+
     if (options) {
       const { variants, name, defaultVariants, ...defaultProps } = options
       if (defaultVariants) {
@@ -63,9 +74,15 @@ export function styled<
         : null
       const isTamagui = !isReactNativeWeb && !!parentStaticConfig
       const Comp = reactNativeWebComponent || (Component as any)
-      const isImage = !!(defaultProps.isImage || (!isTamagui ? Comp === Image : false))
-      const isInput = !!(defaultProps.isInput || (!isTamagui ? Comp === TextInput : false))
-      const isText = !!(defaultProps.isText || (!isTamagui ? isInput || Comp === Text : false))
+      const isImage = Boolean(
+        staticExtractionOptions?.isImage || parentStaticConfig?.isImage || Comp === Image
+      )
+      const isInput = Boolean(
+        staticExtractionOptions?.isInput || parentStaticConfig?.isInput || Comp === TextInput
+      )
+      const isText = Boolean(
+        isInput || staticExtractionOptions?.isText || parentStaticConfig?.isText || Comp === Text
+      )
 
       const conf: Partial<StaticConfig> = {
         ...staticExtractionOptions,
@@ -122,8 +139,7 @@ export function styled<
 
   return component as TamaguiComponent<
     Props,
-    // TODO infer ref
-    any,
+    TamaguiElement,
     ParentPropsBase,
     ParentVariants & OurVariants
   >

package/src/types.tsx

@@ -766,7 +766,7 @@ export type StaticConfig = {
   /**
    * Used internally to handle extractable HoC separate
    */
-  isExtractable?: boolean
+  isHOC?: boolean
 
   /**
    * Used insternally to attach default props to names

package/types/constants/isDevTools.d.ts

@@ -0,0 +1,2 @@
+export declare const isDevTools: any;
+//# sourceMappingURL=isDevTools.d.ts.map

package/types/helpers/createShallowUpdate.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-export declare function createShallowUpdate<State extends Object>(setter: React.Dispatch<React.SetStateAction<State>>): (next: Partial<State>) => void;
+export declare function useShallowSetState<State extends Object>(setter: React.Dispatch<React.SetStateAction<State>>): (next: Partial<State>) => void;
 //# sourceMappingURL=createShallowUpdate.d.ts.map

package/types/helpers/getSplitStyles.d.ts

@@ -1,4 +1,4 @@
-import { ViewStyle } from 'react-native';
+import type { ViewStyle } from 'react-native';
 import type { DebugProp, MediaQueryKey, PseudoStyles, SplitStyleState, StackProps, StaticConfigParsed, TamaguiInternalConfig, ThemeObject } from '../types';
 import { FontLanguageProps, LanguageContextType } from '../views/FontLanguage.types';
 import { RulesToInsert } from './insertStyleRule';

package/types/helpers/getStylesAtomic.d.ts

@@ -1,5 +1,5 @@
 import { StyleObject } from '@tamagui/helpers';
-import { TextStyle, ViewStyle } from 'react-native';
+import type { TextStyle, ViewStyle } from 'react-native';
 import { PseudoDescriptor } from './pseudoDescriptors';
 declare type ViewOrTextStyle = ViewStyle | TextStyle;
 export declare type ViewStyleWithPseudos = ViewOrTextStyle & {

package/types/helpers/mergeTransform.d.ts

@@ -1,4 +1,4 @@
-import { ViewStyle } from 'react-native';
+import type { ViewStyle } from 'react-native';
 export declare const mergeTransform: (obj: ViewStyle, key: string, val: any, backwards?: boolean) => void;
 export declare const invertMapTransformKeys: {
     translateX: string;

package/types/helpers/useShallowSetState.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare function useShallowSetState<State extends Object>(setter: React.Dispatch<React.SetStateAction<State>>): (next: Partial<State>) => void;
+//# sourceMappingURL=useShallowSetState.d.ts.map

package/types/index.d.ts

@@ -18,7 +18,7 @@ export * from './constants/constants';
 export * from './constants/platform';
 export { createDOMProps } from '@tamagui/rnw';
 export * from './helpers/calc';
-export * from './helpers/createShallowUpdate';
+export * from './helpers/useShallowSetState';
 export * from './helpers/getStackSize';
 export * from './helpers/getVariantExtras';
 export * from './helpers/getAnimationDriver';

package/types/styled.d.ts

@@ -1,4 +1,4 @@
-import { GetProps, GetVariantValues, MediaProps, PseudoProps, StaticConfig, StylableComponent, TamaguiComponent, VariantDefinitions, VariantSpreadFunction } from './types';
+import { GetProps, GetVariantValues, MediaProps, PseudoProps, StaticConfig, StylableComponent, TamaguiComponent, TamaguiElement, VariantDefinitions, VariantSpreadFunction } from './types';
 export declare type StyledOptions<ParentComponent extends StylableComponent> = GetProps<ParentComponent> & {
     name?: string;
     variants?: VariantDefinitions<ParentComponent> | undefined;
@@ -12,5 +12,5 @@ export declare function styled<ParentComponent extends StylableComponent, Varian
     defaultVariants?: {
         [key: string]: any;
     };
-}, staticExtractionOptions?: Partial<StaticConfig>): TamaguiComponent<Variants extends void ? GetProps<ParentComponent> : (ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>) & Omit<ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}, keyof (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })> & (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; }) & MediaProps<Partial<(ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>) & Omit<ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}, keyof (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })> & (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })>> & PseudoProps<Partial<(ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>) & Omit<ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}, keyof (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })> & (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })>>, any, ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>, (ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}) & (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })>;
+}, staticExtractionOptions?: Partial<StaticConfig>): TamaguiComponent<Variants extends void ? GetProps<ParentComponent> : (ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>) & Omit<ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}, keyof (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })> & (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; }) & MediaProps<Partial<(ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>) & Omit<ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}, keyof (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })> & (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })>> & PseudoProps<Partial<(ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>) & Omit<ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}, keyof (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })> & (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })>>, TamaguiElement, ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>, (ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}) & (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })>;
 //# sourceMappingURL=styled.d.ts.map