@tamagui/web 1.41.0 → 1.42.0

package/src/hooks/useMedia.tsx

@@ -4,6 +4,7 @@ import { useMemo, useSyncExternalStore } from 'react'
 import { getConfig } from '../config'
 import { createProxy } from '../helpers/createProxy'
 import { matchMedia } from '../helpers/matchMedia'
+import { pseudoDescriptors } from '../helpers/pseudoDescriptors'
 import type {
   MediaQueries,
   MediaQueryKey,
@@ -37,7 +38,8 @@ export let mediaState: MediaQueryState =
 export const mediaQueryConfig: MediaQueries = {}
 export const getMedia = () => mediaState
 export const mediaKeys = new Set<string>() // with $ prefix
-export const isMediaKey = (key: string) => mediaKeys.has(key)
+export const isMediaKey = (key: string) =>
+  mediaKeys.has(key) || key.startsWith('$platform-') || key.startsWith('$theme-')
 
 // for SSR capture it at time of startup
 let initState: MediaQueryState
@@ -45,11 +47,21 @@ export const getInitialMediaState = () => {
   return (getConfig().disableSSR ? mediaState : initState) || {}
 }
 
+// media always above pseudos
+const defaultMediaImportance = Object.keys(pseudoDescriptors).length
+
 let mediaKeysOrdered: string[]
+
 export const getMediaKeyImportance = (key: string) => {
   if (process.env.NODE_ENV === 'development' && key[0] === '$') {
     throw new Error('use short key')
   }
+
+  const conf = getConfig()
+  if (conf.settings.mediaPropOrder) {
+    return defaultMediaImportance
+  }
+
   // + 100 because we set base usedKeys=1, psuedos are 2-N (however many we have)
   // all media go above all pseudos so we need to pad it based on that
   // right now theres 5 pseudos but in the future could be a few more
@@ -253,14 +265,14 @@ export function useMediaPropsActive<A extends Object>(
             if (shouldExpandShorthands) {
               subKey = config.shorthands[subKey] || subKey
             }
-            mergeMediaByImportance(next, mediaKey, subKey, value, importancesUsed)
+            mergeMediaByImportance(next, mediaKey, subKey, value, importancesUsed, true)
           }
         }
       } else {
         if (shouldExpandShorthands) {
           key = config.shorthands[key] || key
         }
-        mergeMediaByImportance(next, '', key, val, importancesUsed)
+        mergeMediaByImportance(next, '', key, val, importancesUsed, true)
       }
     }
 
@@ -271,9 +283,14 @@ export function useMediaPropsActive<A extends Object>(
 export const getMediaImportanceIfMoreImportant = (
   mediaKey: string,
   key: string,
-  importancesUsed: Record<string, number>
+  importancesUsed: Record<string, number>,
+  isSizeMedia: boolean
 ) => {
-  const importance = getMediaKeyImportance(mediaKey)
+  const conf = getConfig()
+  const importance =
+    isSizeMedia && !conf.settings.mediaPropOrder
+      ? getMediaKeyImportance(mediaKey)
+      : defaultMediaImportance
   return !importancesUsed[key] || importance > importancesUsed[key] ? importance : null
 }
 
@@ -282,9 +299,15 @@ export function mergeMediaByImportance(
   mediaKey: string,
   key: string,
   value: any,
-  importancesUsed: Record<string, number>
+  importancesUsed: Record<string, number>,
+  isSizeMedia: boolean
 ) {
-  const importance = getMediaImportanceIfMoreImportant(mediaKey, key, importancesUsed)
+  const importance = getMediaImportanceIfMoreImportant(
+    mediaKey,
+    key,
+    importancesUsed,
+    isSizeMedia
+  )
   if (importance === null) {
     return false
   }

package/src/hooks/useStyle.tsx

@@ -12,7 +12,7 @@ import {
   TextNonStyleProps,
 } from '../types'
 import { useMedia } from './useMedia'
-import { useTheme } from './useTheme'
+import { useThemeWithState } from './useTheme'
 
 export function useStyle<
   Component extends TamaguiComponent,
@@ -25,12 +25,12 @@ export function useStyle<
   const isText = base.staticConfig.isText
   const hasTextAncestor = !!(isWeb && isText ? useContext(TextAncestorContext) : false)
   const languageContext = isRSC ? null : useContext(FontLanguageContext)
-  const theme = useTheme()
+  const themeState = useThemeWithState({})
   const media = useMedia()
   const out = useSplitStyles(
     style as any,
     base.staticConfig,
-    theme,
+    themeState!,
     {
       ...(options as any),
       mediaState: media,

package/src/hooks/useTheme.tsx

@@ -61,7 +61,7 @@ export const useThemeWithState = (props: ThemeProps) => {
     keys.current,
     isClient
       ? () => {
-          return props.shouldUpdate?.() ?? keys.current.length === 0
+          return props.shouldUpdate?.() ?? (keys.current.length > 0 ? true : undefined)
         }
       : undefined
   )
@@ -120,40 +120,32 @@ export function getThemeProxied(
       if (key === GetThemeUnwrapped) {
         return theme
       }
-      if (
-        key === '__proto__' ||
-        key === '$typeof' ||
-        typeof key !== 'string' ||
-        !themeManager
-      ) {
-        return Reflect.get(_, key)
-      }
-
-      // auto convert variables to plain
-      const keyString = key[0] === '$' ? key.slice(1) : key
-      const val = themeManager.getValue(keyString)
-
-      if (val && keys) {
-        return new Proxy(val as any, {
-          // when they touch the actual value we only track it
-          // if its a variable (web), its ignored!
-          get(_, subkey) {
-            // trigger read key that makes it track updates
-            if (
-              (subkey === 'val' || (subkey === 'get' && !isWeb)) &&
-              !keys.includes(keyString)
-            ) {
-              keys.push(keyString)
-            }
-            if (subkey === 'get') {
-              return () => getVariable(val)
-            }
-            return Reflect.get(val as any, subkey)
-          },
-        })
+      if (typeof key === 'string' && keys) {
+        // auto convert variables to plain
+        const keyString = key[0] === '$' ? key.slice(1) : key
+        const val = themeManager!.getValue(keyString)
+        if (val && typeof val === 'object') {
+          return new Proxy(val as any, {
+            // when they touch the actual value we only track it
+            // if its a variable (web), its ignored!
+            get(_, subkey) {
+              // trigger read key that makes it track updates
+              if (
+                (subkey === 'val' || (subkey === 'get' && !isWeb)) &&
+                !keys.includes(keyString)
+              ) {
+                keys.push(keyString)
+              }
+              if (subkey === 'get') {
+                return () => getVariable(val)
+              }
+              return Reflect.get(val as any, subkey)
+            },
+          })
+        }
       }
 
-      return val
+      return Reflect.get(_, key)
     },
   }) as UseThemeResult
 }
@@ -164,7 +156,7 @@ export const useChangeThemeEffect = (
   props: ThemeProps,
   root = false,
   keys?: string[],
-  disableUpdate?: () => boolean
+  shouldUpdate?: () => boolean | undefined
 ): ChangedThemeResponse => {
   if (isRSC) {
     // we need context working for this to work well
@@ -203,11 +195,14 @@ export const useChangeThemeEffect = (
     prevState: ThemeManagerState = state,
     forceShouldChange = false
   ) {
+    if (forceShouldChange) return
+    const forceUpdate = shouldUpdate?.()
+    if (forceUpdate === false) return
     const next = nextState || manager.getState(props, parentManager)
-    // if (props.inverse) return true
     if (!next) return
-    if (disableUpdate?.() === true) return
-    if (!forceShouldChange && !manager.getStateShouldChange(next, prevState)) return
+    if (forceUpdate !== true) {
+      if (!manager.getStateShouldChange(next, prevState)) return
+    }
     return next
   }
 
@@ -251,13 +246,14 @@ export const useChangeThemeEffect = (
       })
 
       const disposeChangeListener = parentManager?.onChangeTheme((name, manager) => {
-        const shouldUpdate = Boolean(keys?.length || isNewTheme)
+        const force = shouldUpdate?.()
+        const doUpdate = force ?? Boolean(keys?.length || isNewTheme)
         if (process.env.NODE_ENV === 'development' && props.debug) {
-          const logs = { shouldUpdate, props, name, manager, keys }
+          const logs = { force, doUpdate, props, name, manager, keys }
           // rome-ignore lint/nursery/noConsoleLog: <explanation>
           console.log(` 🔸 onChange`, themeManager.id, logs)
         }
-        if (shouldUpdate) {
+        if (doUpdate) {
           setThemeState(createState)
         }
       }, themeManager.id)
@@ -305,7 +301,7 @@ export const useChangeThemeEffect = (
   }
 
   function createState(prev?: State, force = false): State {
-    if (prev && disableUpdate?.()) {
+    if (prev && shouldUpdate?.() === false) {
       return prev
     }
 

package/src/styled.tsx

@@ -187,16 +187,15 @@ export function styled<
   type OurVariantProps = Variants extends void ? {} : GetVariantAcceptedValues<Variants>
 
   type VariantProps = Omit<ParentVariants, keyof OurVariantProps> & OurVariantProps
-  type OurPropsBase = ParentPropsBase & VariantProps
+  type OurPropsBaseBase = ParentPropsBase & VariantProps
+  type OurPropsBase = OurPropsBaseBase & PseudoProps<Partial<OurPropsBaseBase>>
 
   type Props = Variants extends void
     ? GetProps<ParentComponent>
     : // start with base props
       OurPropsBase &
         // add in media (+ pseudos nested)
-        MediaProps<Partial<OurPropsBase>> &
-        // add in pseudos
-        PseudoProps<Partial<OurPropsBase>>
+        MediaProps<Partial<OurPropsBase>>
 
   type ParentStaticProperties = {
     [Key in Exclude<

package/src/types.tsx

@@ -454,8 +454,8 @@ export interface ThemeProps {
   inverse?: boolean
   // on the web, for portals we need to re-insert className
   forceClassName?: boolean
-  // allows for disabling the auto-update behavior
-  shouldUpdate?: () => boolean
+  // allows for forcing the auto-update behavior
+  shouldUpdate?: () => boolean | undefined
 }
 
 type ArrayIntersection<A extends any[]> = A[keyof A]
@@ -533,6 +533,16 @@ type GenericTamaguiSettings = {
    * @default except-special
    */
   autocompleteSpecificTokens?: AutocompleteSpecificTokensSetting
+
+  /**
+   * Will change the behavior of media styles. By default they have a fixed specificity: they
+   * always override any $theme- or $platform- styles. With this enabled, media styles will have
+   * the same precedence as the theme and platform styles, meaning that the order of the props
+   * determines if they override.
+   *
+   * @default false
+   */
+  mediaPropOrder?: boolean
 }
 
 export type TamaguiSettings = TamaguiConfig['settings']
@@ -685,9 +695,16 @@ export type MediaQueryObject = { [key: string]: string | number | string }
 export type MediaQueryKey = keyof Media
 export type MediaPropKeys = `$${MediaQueryKey}`
 export type MediaQueryState = { [key in MediaQueryKey]: boolean }
+
+export type ThemeMediaKeys<TK extends keyof Themes = keyof Themes> =
+  `$theme-${TK extends `${string}_${string}` ? never : TK}`
+
+export type PlatformMediaKeys = `$platform-${AllPlatforms}`
+
 export type MediaProps<A> = {
-  [key in MediaPropKeys]?: A
+  [key in MediaPropKeys | ThemeMediaKeys | PlatformMediaKeys]?: A
 }
+
 export type MediaQueries = {
   [key in MediaQueryKey]: MediaQueryObject
 }
@@ -1081,6 +1098,8 @@ export type PseudoStyles = {
   exitStyle?: ViewStyle
 }
 
+export type AllPlatforms = 'web' | 'native' | 'android' | 'ios'
+
 //
 // add both theme and shorthands
 //
@@ -1976,6 +1995,7 @@ export type GetStyleResult = {
   fontFamily: string | undefined
   space?: any // SpaceTokens?
   hasMedia: boolean | string[]
+  dynamicThemeAccess?: boolean
 }
 
 export type ClassNamesObject = Record<string, string>

package/types/createComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":"AASA,OAAO,KAWN,MAAM,OAAO,CAAA;AAkBd,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;AAmBD,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,4DA41B3D;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":"AASA,OAAO,KAWN,MAAM,OAAO,CAAA;AAkBd,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;AAmBD,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,4DAi2B3D;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/helpers/createMediaStyle.d.ts

@@ -1,4 +1,4 @@
 import type { MediaQueries, MediaStyleObject, StyleObject } from '../types';
 export declare const MEDIA_SEP = "_";
-export declare const createMediaStyle: ({ property, identifier, rules }: StyleObject, mediaKey: string, mediaQueries: MediaQueries, negate?: boolean) => MediaStyleObject;
+export declare const createMediaStyle: ({ property, identifier, rules }: StyleObject, mediaKey: string, mediaQueries: MediaQueries, negate?: boolean, priority?: number) => MediaStyleObject;
 //# sourceMappingURL=createMediaStyle.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"createMediaStyle.d.ts","sourceRoot":"","sources":["../../src/helpers/createMediaStyle.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAI3E,eAAO,MAAM,SAAS,MAAM,CAAA;AAK5B,eAAO,MAAM,gBAAgB,oCACM,WAAW,YAClC,MAAM,gBACF,YAAY,WACjB,OAAO,KACf,gBAsCF,CAAA"}
+{"version":3,"file":"createMediaStyle.d.ts","sourceRoot":"","sources":["../../src/helpers/createMediaStyle.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAI3E,eAAO,MAAM,SAAS,MAAM,CAAA;AAK5B,eAAO,MAAM,gBAAgB,oCACM,WAAW,YAClC,MAAM,gBACF,YAAY,WACjB,OAAO,aACL,MAAM,KAChB,gBAoFF,CAAA"}

package/types/helpers/getSplitStyles.d.ts

@@ -18,7 +18,10 @@ export type SplitStyles = ReturnType<typeof getSplitStyles>;
 export type SplitStyleResult = ReturnType<typeof getSplitStyles>;
 type StyleSplitter = (props: {
     [key: string]: any;
-}, staticConfig: StaticConfigParsed, theme: ThemeParsed, state: SplitStyleState, parentSplitStyles?: GetStyleResult | null, languageContext?: LanguageContextType, elementType?: string, debug?: DebugProp) => GetStyleResult;
+}, staticConfig: StaticConfigParsed, themeState: {
+    theme: ThemeParsed;
+    name: string;
+}, state: SplitStyleState, parentSplitStyles?: GetStyleResult | null, languageContext?: LanguageContextType, elementType?: string, debug?: DebugProp) => GetStyleResult;
 export declare const PROP_SPLIT = "-";
 export declare const getSplitStyles: StyleSplitter;
 export declare const getSubStyle: (styleState: GetStyleState, subKey: string, styleIn: Object, fontFamily?: string, avoidDefaultProps?: boolean, avoidMergeTransform?: boolean) => TextStyleProps;

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

@@ -1 +1 @@
-{"version":3,"file":"getSplitStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/getSplitStyles.tsx"],"names":[],"mappings":"AAiCA,OAAO,KAAK,EACV,gBAAgB,EAChB,SAAS,EACT,cAAc,EAMd,eAAe,EACf,kBAAkB,EAElB,qBAAqB,EACrB,cAAc,EACd,WAAW,EAEZ,MAAM,UAAU,CAAA;AACjB,OAAO,KAAK,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAkBzF,KAAK,aAAa,GAAG;IACnB,KAAK,EAAE,cAAc,CAAA;IACrB,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAChC,UAAU,EAAE,gBAAgB,CAAA;IAC5B,YAAY,EAAE,kBAAkB,CAAA;IAChC,KAAK,EAAE,WAAW,CAAA;IAClB,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAC1B,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAC9B,KAAK,EAAE,eAAe,CAAA;IACtB,IAAI,EAAE,qBAAqB,CAAA;IAC3B,eAAe,CAAC,EAAE,iBAAiB,CAAA;IACnC,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B,CAAA;AAED,MAAM,MAAM,WAAW,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;AAE3D,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;AAMhE,KAAK,aAAa,GAAG,CACnB,KAAK,EAAE;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,EAC7B,YAAY,EAAE,kBAAkB,EAChC,KAAK,EAAE,WAAW,EAClB,KAAK,EAAE,eAAe,EACtB,iBAAiB,CAAC,EAAE,cAAc,GAAG,IAAI,EACzC,eAAe,CAAC,EAAE,mBAAmB,EAErC,WAAW,CAAC,EAAE,MAAM,EACpB,KAAK,CAAC,EAAE,SAAS,KACd,cAAc,CAAA;AAEnB,eAAO,MAAM,UAAU,MAAM,CAAA;AAU7B,eAAO,MAAM,cAAc,EAAE,aAq7B5B,CAAA;AAkFD,eAAO,MAAM,WAAW,eACV,aAAa,UACjB,MAAM,WACL,MAAM,eACF,MAAM,sBACC,OAAO,wBACL,OAAO,KAC5B,cAgCF,CAAA;AAOD,eAAO,MAAM,cAAc,EAAE,aAU5B,CAAA;AA6BD,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA"}
+{"version":3,"file":"getSplitStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/getSplitStyles.tsx"],"names":[],"mappings":"AAkCA,OAAO,KAAK,EACV,gBAAgB,EAChB,SAAS,EACT,cAAc,EAMd,eAAe,EACf,kBAAkB,EAElB,qBAAqB,EACrB,cAAc,EACd,WAAW,EAEZ,MAAM,UAAU,CAAA;AACjB,OAAO,KAAK,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAkBzF,KAAK,aAAa,GAAG;IACnB,KAAK,EAAE,cAAc,CAAA;IACrB,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAChC,UAAU,EAAE,gBAAgB,CAAA;IAC5B,YAAY,EAAE,kBAAkB,CAAA;IAChC,KAAK,EAAE,WAAW,CAAA;IAClB,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAC1B,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAC9B,KAAK,EAAE,eAAe,CAAA;IACtB,IAAI,EAAE,qBAAqB,CAAA;IAC3B,eAAe,CAAC,EAAE,iBAAiB,CAAA;IACnC,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B,CAAA;AAED,MAAM,MAAM,WAAW,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;AAE3D,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;AAMhE,KAAK,aAAa,GAAG,CACnB,KAAK,EAAE;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,EAC7B,YAAY,EAAE,kBAAkB,EAChC,UAAU,EAAE;IACV,KAAK,EAAE,WAAW,CAAA;IAClB,IAAI,EAAE,MAAM,CAAA;CACb,EACD,KAAK,EAAE,eAAe,EACtB,iBAAiB,CAAC,EAAE,cAAc,GAAG,IAAI,EACzC,eAAe,CAAC,EAAE,mBAAmB,EAErC,WAAW,CAAC,EAAE,MAAM,EACpB,KAAK,CAAC,EAAE,SAAS,KACd,cAAc,CAAA;AAEnB,eAAO,MAAM,UAAU,MAAM,CAAA;AAU7B,eAAO,MAAM,cAAc,EAAE,aAg+B5B,CAAA;AAkFD,eAAO,MAAM,WAAW,eACV,aAAa,UACjB,MAAM,WACL,MAAM,eACF,MAAM,sBACC,OAAO,wBACL,OAAO,KAC5B,cAgCF,CAAA;AAOD,eAAO,MAAM,cAAc,EAAE,aAU5B,CAAA;AA6BD,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA"}

package/types/hooks/useMedia.d.ts

@@ -33,8 +33,8 @@ export declare function useMediaPropsActive<A extends Object>(props: A, opts?: {
 }): {
     [Key in keyof A extends `$${string}` ? never : keyof A]?: A[Key];
 };
-export declare const getMediaImportanceIfMoreImportant: (mediaKey: string, key: string, importancesUsed: Record<string, number>) => number | null;
-export declare function mergeMediaByImportance(onto: Record<string, any>, mediaKey: string, key: string, value: any, importancesUsed: Record<string, number>): boolean;
+export declare const getMediaImportanceIfMoreImportant: (mediaKey: string, key: string, importancesUsed: Record<string, number>, isSizeMedia: boolean) => number | null;
+export declare function mergeMediaByImportance(onto: Record<string, any>, mediaKey: string, key: string, value: any, importancesUsed: Record<string, number>, isSizeMedia: boolean): boolean;
 export declare function mediaObjectToString(query: string | MediaQueryObject): string;
 export {};
 //# sourceMappingURL=useMedia.d.ts.map

package/types/hooks/useMedia.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMedia.d.ts","sourceRoot":"","sources":["../../src/hooks/useMedia.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EACV,YAAY,EACZ,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,qBAAqB,EACtB,MAAM,UAAU,CAAA;AAGjB,eAAO,IAAI,UAAU,EAAE,eAmBN,CAAA;AAEjB,eAAO,MAAM,gBAAgB,EAAE,YAAiB,CAAA;AAChD,eAAO,MAAM,QAAQ,uBAAmB,CAAA;AACxC,eAAO,MAAM,SAAS,aAAoB,CAAA;AAC1C,eAAO,MAAM,UAAU,QAAS,MAAM,YAAuB,CAAA;AAI7D,eAAO,MAAM,oBAAoB,uBAEhC,CAAA;AAGD,eAAO,MAAM,qBAAqB,QAAS,MAAM,WAQhD,CAAA;AAID,eAAO,MAAM,cAAc,WAAY,qBAAqB,SAc3D,CAAA;AAaD,wBAAgB,mBAAmB,SA+BlC;AAED,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,qBAAqB,QAM9D;AAiBD,KAAK,aAAa,GAAG;KAClB,GAAG,IAAI,aAAa,GAAG,OAAO;CAChC,CAAA;AAED,KAAK,WAAW,GAAG;IACjB,OAAO,EAAE,OAAO,CAAA;IAChB,IAAI,EAAE,aAAa,EAAE,CAAA;CACtB,CAAA;AAID,wBAAgB,oBAAoB,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,6BAEhE;AAYD,wBAAgB,QAAQ,CAAC,GAAG,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,EAAE,GAAG,GAAG,aAAa,CA4C9D;AAED;;;;;;;;;KASK;AACL,wBAAgB,mBAAmB,CAAC,CAAC,SAAS,MAAM,EAClD,KAAK,EAAE,CAAC,EACR,IAAI,CAAC,EAAE;IAAE,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAAE,GACpC;KAEA,GAAG,IAAI,MAAM,CAAC,SAAS,IAAI,MAAM,EAAE,GAAG,KAAK,GAAG,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC;CACjE,CAsCA;AAED,eAAO,MAAM,iCAAiC,aAClC,MAAM,OACX,MAAM,mBACM,OAAO,MAAM,EAAE,MAAM,CAAC,kBAIxC,CAAA;AAED,wBAAgB,sBAAsB,CACpC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EACzB,QAAQ,EAAE,MAAM,EAChB,GAAG,EAAE,MAAM,EACX,KAAK,EAAE,GAAG,EACV,eAAe,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,WASxC;AAMD,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,MAAM,GAAG,gBAAgB,UAgBnE"}
+{"version":3,"file":"useMedia.d.ts","sourceRoot":"","sources":["../../src/hooks/useMedia.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EACV,YAAY,EACZ,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,qBAAqB,EACtB,MAAM,UAAU,CAAA;AAGjB,eAAO,IAAI,UAAU,EAAE,eAmBN,CAAA;AAEjB,eAAO,MAAM,gBAAgB,EAAE,YAAiB,CAAA;AAChD,eAAO,MAAM,QAAQ,uBAAmB,CAAA;AACxC,eAAO,MAAM,SAAS,aAAoB,CAAA;AAC1C,eAAO,MAAM,UAAU,QAAS,MAAM,YAC2C,CAAA;AAIjF,eAAO,MAAM,oBAAoB,uBAEhC,CAAA;AAOD,eAAO,MAAM,qBAAqB,QAAS,MAAM,WAchD,CAAA;AAID,eAAO,MAAM,cAAc,WAAY,qBAAqB,SAc3D,CAAA;AAaD,wBAAgB,mBAAmB,SA+BlC;AAED,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,qBAAqB,QAM9D;AAiBD,KAAK,aAAa,GAAG;KAClB,GAAG,IAAI,aAAa,GAAG,OAAO;CAChC,CAAA;AAED,KAAK,WAAW,GAAG;IACjB,OAAO,EAAE,OAAO,CAAA;IAChB,IAAI,EAAE,aAAa,EAAE,CAAA;CACtB,CAAA;AAID,wBAAgB,oBAAoB,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,6BAEhE;AAYD,wBAAgB,QAAQ,CAAC,GAAG,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,EAAE,GAAG,GAAG,aAAa,CA4C9D;AAED;;;;;;;;;KASK;AACL,wBAAgB,mBAAmB,CAAC,CAAC,SAAS,MAAM,EAClD,KAAK,EAAE,CAAC,EACR,IAAI,CAAC,EAAE;IAAE,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAAE,GACpC;KAEA,GAAG,IAAI,MAAM,CAAC,SAAS,IAAI,MAAM,EAAE,GAAG,KAAK,GAAG,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC;CACjE,CAsCA;AAED,eAAO,MAAM,iCAAiC,aAClC,MAAM,OACX,MAAM,mBACM,OAAO,MAAM,EAAE,MAAM,CAAC,eAC1B,OAAO,kBAQrB,CAAA;AAED,wBAAgB,sBAAsB,CACpC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EACzB,QAAQ,EAAE,MAAM,EAChB,GAAG,EAAE,MAAM,EACX,KAAK,EAAE,GAAG,EACV,eAAe,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACvC,WAAW,EAAE,OAAO,WAcrB;AAMD,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,MAAM,GAAG,gBAAgB,UAgBnE"}

package/types/hooks/useTheme.d.ts

@@ -24,6 +24,6 @@ export declare function getThemeProxied({ theme, themeManager, }: Partial<Change
     theme: ThemeParsed;
 }, keys?: string[]): UseThemeResult;
 export declare const activeThemeManagers: Set<ThemeManager>;
-export declare const useChangeThemeEffect: (props: ThemeProps, root?: boolean, keys?: string[], disableUpdate?: () => boolean) => ChangedThemeResponse;
+export declare const useChangeThemeEffect: (props: ThemeProps, root?: boolean, keys?: string[], shouldUpdate?: () => boolean | undefined) => ChangedThemeResponse;
 export {};
 //# sourceMappingURL=useTheme.d.ts.map

package/types/hooks/useTheme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTheme.d.ts","sourceRoot":"","sources":["../../src/hooks/useTheme.tsx"],"names":[],"mappings":"AAQA,OAAO,EACL,YAAY,EAGb,MAAM,yBAAyB,CAAA;AAEhC,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAIvD,MAAM,MAAM,oBAAoB,GAAG;IACjC,UAAU,EAAE,OAAO,CAAA;IACnB,YAAY,EAAE,YAAY,GAAG,IAAI,CAAA;IACjC,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,WAAW,GAAG,IAAI,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAoBD,KAAK,cAAc,GAAG;KACnB,GAAG,IAAI,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,CAAC,GAAG;QAC7C,GAAG,EAAE,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,CAAA;KAC5C;CACF,CAAA;AAED,eAAO,MAAM,QAAQ,WAAW,UAAU,KAAgB,cAEzD,CAAA;AAED,eAAO,MAAM,iBAAiB,UAAW,UAAU;;gBAnCrC,OAAO;kBACL,YAAY,GAAG,IAAI;UAC3B,MAAM;;QA8Eb,CAAA;AAED,wBAAgB,eAAe,CAC7B,EACE,KAAK,EACL,YAAY,GACb,EAAE,OAAO,CAAC,oBAAoB,CAAC,GAAG;IACjC,KAAK,EAAE,WAAW,CAAA;CACnB,EACD,IAAI,CAAC,EAAE,MAAM,EAAE,GACd,cAAc,CAiDhB;AAED,eAAO,MAAM,mBAAmB,mBAA0B,CAAA;AAE1D,eAAO,MAAM,oBAAoB,UACxB,UAAU,yBAEV,MAAM,EAAE,kBACC,MAAM,OAAO,KAC5B,oBA+OF,CAAA"}
+{"version":3,"file":"useTheme.d.ts","sourceRoot":"","sources":["../../src/hooks/useTheme.tsx"],"names":[],"mappings":"AAQA,OAAO,EACL,YAAY,EAGb,MAAM,yBAAyB,CAAA;AAEhC,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAIvD,MAAM,MAAM,oBAAoB,GAAG;IACjC,UAAU,EAAE,OAAO,CAAA;IACnB,YAAY,EAAE,YAAY,GAAG,IAAI,CAAA;IACjC,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,WAAW,GAAG,IAAI,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAoBD,KAAK,cAAc,GAAG;KACnB,GAAG,IAAI,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,CAAC,GAAG;QAC7C,GAAG,EAAE,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,CAAA;KAC5C;CACF,CAAA;AAED,eAAO,MAAM,QAAQ,WAAW,UAAU,KAAgB,cAEzD,CAAA;AAED,eAAO,MAAM,iBAAiB,UAAW,UAAU;;gBAnCrC,OAAO;kBACL,YAAY,GAAG,IAAI;UAC3B,MAAM;;QA8Eb,CAAA;AAED,wBAAgB,eAAe,CAC7B,EACE,KAAK,EACL,YAAY,GACb,EAAE,OAAO,CAAC,oBAAoB,CAAC,GAAG;IACjC,KAAK,EAAE,WAAW,CAAA;CACnB,EACD,IAAI,CAAC,EAAE,MAAM,EAAE,GACd,cAAc,CAyChB;AAED,eAAO,MAAM,mBAAmB,mBAA0B,CAAA;AAE1D,eAAO,MAAM,oBAAoB,UACxB,UAAU,yBAEV,MAAM,EAAE,iBACA,MAAM,OAAO,GAAG,SAAS,KACvC,oBAmPF,CAAA"}

package/types/styled.d.ts

@@ -11,6 +11,6 @@ export declare function styled<ParentComponent extends StylableComponent, Varian
     defaultVariants?: GetVariantAcceptedValues<Variants>;
     context?: StyledContext;
     acceptsClassName?: boolean;
-}, staticExtractionOptions?: Partial<StaticConfig>): TamaguiComponent<Variants extends void ? GetProps<ParentComponent> : GetBaseProps<ParentComponent> & Omit<GetVariantProps<ParentComponent>, keyof (Variants extends void ? {} : GetVariantAcceptedValues<Variants>)> & (Variants extends void ? {} : GetVariantAcceptedValues<Variants>) & MediaProps<Partial<GetBaseProps<ParentComponent> & Omit<GetVariantProps<ParentComponent>, keyof (Variants extends void ? {} : GetVariantAcceptedValues<Variants>)> & (Variants extends void ? {} : GetVariantAcceptedValues<Variants>)>> & PseudoProps<Partial<GetBaseProps<ParentComponent> & Omit<GetVariantProps<ParentComponent>, keyof (Variants extends void ? {} : GetVariantAcceptedValues<Variants>)> & (Variants extends void ? {} : GetVariantAcceptedValues<Variants>)>>, GetRef<ParentComponent>, GetBaseProps<ParentComponent>, GetVariantProps<ParentComponent> & (Variants extends void ? {} : GetVariantAcceptedValues<Variants>), { [Key in Exclude<keyof ParentComponent, "defaultProps" | "propTypes" | "staticConfig" | "extractable" | "styleable" | "$$typeof">]: ParentComponent[Key]; }>;
+}, staticExtractionOptions?: Partial<StaticConfig>): TamaguiComponent<Variants extends void ? GetProps<ParentComponent> : GetBaseProps<ParentComponent> & Omit<GetVariantProps<ParentComponent>, keyof (Variants extends void ? {} : GetVariantAcceptedValues<Variants>)> & (Variants extends void ? {} : GetVariantAcceptedValues<Variants>) & PseudoProps<Partial<GetBaseProps<ParentComponent> & Omit<GetVariantProps<ParentComponent>, keyof (Variants extends void ? {} : GetVariantAcceptedValues<Variants>)> & (Variants extends void ? {} : GetVariantAcceptedValues<Variants>)>> & MediaProps<Partial<GetBaseProps<ParentComponent> & Omit<GetVariantProps<ParentComponent>, keyof (Variants extends void ? {} : GetVariantAcceptedValues<Variants>)> & (Variants extends void ? {} : GetVariantAcceptedValues<Variants>) & PseudoProps<Partial<GetBaseProps<ParentComponent> & Omit<GetVariantProps<ParentComponent>, keyof (Variants extends void ? {} : GetVariantAcceptedValues<Variants>)> & (Variants extends void ? {} : GetVariantAcceptedValues<Variants>)>>>>, GetRef<ParentComponent>, GetBaseProps<ParentComponent>, GetVariantProps<ParentComponent> & (Variants extends void ? {} : GetVariantAcceptedValues<Variants>), { [Key in Exclude<keyof ParentComponent, "defaultProps" | "propTypes" | "staticConfig" | "extractable" | "styleable" | "$$typeof">]: ParentComponent[Key]; }>;
 export {};
 //# sourceMappingURL=styled.d.ts.map

package/types/styled.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../src/styled.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAA;AAG7D,OAAO,KAAK,EACV,QAAQ,EACR,MAAM,EACN,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACtB,MAAM,SAAS,CAAA;AAEhB,KAAK,YAAY,CAAC,CAAC,SAAS,iBAAiB,IAAI,CAAC,SAAS,gBAAgB,CACzE,GAAG,EACH,GAAG,EACH,MAAM,CAAC,CACR,GACG,CAAC,GACD,QAAQ,CAAC,CAAC,CAAC,CAAA;AAEf,KAAK,eAAe,CAAC,CAAC,SAAS,iBAAiB,IAAI,CAAC,SAAS,gBAAgB,CAC5E,GAAG,EACH,GAAG,EACH,GAAG,EACH,MAAM,CAAC,CACR,GACG,CAAC,GACD,EAAE,CAAA;AAEN,KAAK,wBAAwB,CAAC,CAAC,IAAI,CAAC,SAAS,MAAM,GAC/C;KACG,GAAG,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,SAAS,qBAAqB,CAAC,GAAG,EAAE,MAAM,GAAG,CAAC,GACnE,GAAG,GACH,gBAAgB,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC;CACnC,GACD,SAAS,CAAA;AAEb,wBAAgB,MAAM,CACpB,eAAe,SAAS,iBAAiB,EACzC,QAAQ,SAAS,kBAAkB,CAAC,eAAe,CAAC,GAAG,IAAI,GAAG,kBAAkB,CAAC,eAAe,CAAC,GAAG,IAAI,EAExG,WAAW,EAAE,eAAe,EAE5B,OAAO,CAAC,EAAE,QAAQ,CAAC,eAAe,CAAC,GAAG;IACpC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IAC/B,eAAe,CAAC,EAAE,wBAAwB,CAAC,QAAQ,CAAC,CAAA;IACpD,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B,EACD,uBAAuB,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,gjCA0KhD"}
+{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../src/styled.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAA;AAG7D,OAAO,KAAK,EACV,QAAQ,EACR,MAAM,EACN,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACtB,MAAM,SAAS,CAAA;AAEhB,KAAK,YAAY,CAAC,CAAC,SAAS,iBAAiB,IAAI,CAAC,SAAS,gBAAgB,CACzE,GAAG,EACH,GAAG,EACH,MAAM,CAAC,CACR,GACG,CAAC,GACD,QAAQ,CAAC,CAAC,CAAC,CAAA;AAEf,KAAK,eAAe,CAAC,CAAC,SAAS,iBAAiB,IAAI,CAAC,SAAS,gBAAgB,CAC5E,GAAG,EACH,GAAG,EACH,GAAG,EACH,MAAM,CAAC,CACR,GACG,CAAC,GACD,EAAE,CAAA;AAEN,KAAK,wBAAwB,CAAC,CAAC,IAAI,CAAC,SAAS,MAAM,GAC/C;KACG,GAAG,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,SAAS,qBAAqB,CAAC,GAAG,EAAE,MAAM,GAAG,CAAC,GACnE,GAAG,GACH,gBAAgB,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC;CACnC,GACD,SAAS,CAAA;AAEb,wBAAgB,MAAM,CACpB,eAAe,SAAS,iBAAiB,EACzC,QAAQ,SAAS,kBAAkB,CAAC,eAAe,CAAC,GAAG,IAAI,GAAG,kBAAkB,CAAC,eAAe,CAAC,GAAG,IAAI,EAExG,WAAW,EAAE,eAAe,EAE5B,OAAO,CAAC,EAAE,QAAQ,CAAC,eAAe,CAAC,GAAG;IACpC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IAC/B,eAAe,CAAC,EAAE,wBAAwB,CAAC,QAAQ,CAAC,CAAA;IACpD,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B,EACD,uBAAuB,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,4xCAyKhD"}

package/types/types.d.ts

@@ -224,7 +224,7 @@ export interface ThemeProps {
     debug?: DebugProp | any;
     inverse?: boolean;
     forceClassName?: boolean;
-    shouldUpdate?: () => boolean;
+    shouldUpdate?: () => boolean | undefined;
 }
 type ArrayIntersection<A extends any[]> = A[keyof A];
 type GetAltThemeNames<S> = (S extends `${string}_${infer Alt}` ? GetAltThemeNames<Alt> : S) | S;
@@ -277,6 +277,15 @@ type GenericTamaguiSettings = {
      * @default except-special
      */
     autocompleteSpecificTokens?: AutocompleteSpecificTokensSetting;
+    /**
+     * Will change the behavior of media styles. By default they have a fixed specificity: they
+     * always override any $theme- or $platform- styles. With this enabled, media styles will have
+     * the same precedence as the theme and platform styles, meaning that the order of the props
+     * determines if they override.
+     *
+     * @default false
+     */
+    mediaPropOrder?: boolean;
 };
 export type TamaguiSettings = TamaguiConfig['settings'];
 export type CreateTamaguiProps = {
@@ -399,8 +408,10 @@ export type MediaPropKeys = `$${MediaQueryKey}`;
 export type MediaQueryState = {
     [key in MediaQueryKey]: boolean;
 };
+export type ThemeMediaKeys<TK extends keyof Themes = keyof Themes> = `$theme-${TK extends `${string}_${string}` ? never : TK}`;
+export type PlatformMediaKeys = `$platform-${AllPlatforms}`;
 export type MediaProps<A> = {
-    [key in MediaPropKeys]?: A;
+    [key in MediaPropKeys | ThemeMediaKeys | PlatformMediaKeys]?: A;
 };
 export type MediaQueries = {
     [key in MediaQueryKey]: MediaQueryObject;
@@ -536,6 +547,7 @@ export type PseudoStyles = {
     enterStyle?: ViewStyle;
     exitStyle?: ViewStyle;
 };
+export type AllPlatforms = 'web' | 'native' | 'android' | 'ios';
 type WithThemeAndShorthands<A extends object> = WithThemeValues<OmitLonghands<A>> & WithShorthands<WithThemeValues<A>>;
 type WithThemeShorthandsAndPseudos<A extends object> = WithThemeAndShorthands<A> & PseudoProps<WithThemeAndShorthands<A>>;
 type WithThemeShorthandsPseudosMediaAnimation<A extends object> = WithThemeShorthandsAndPseudos<A> & MediaProps<WithThemeShorthandsAndPseudos<A>>;
@@ -893,6 +905,7 @@ export type GetStyleResult = {
     fontFamily: string | undefined;
     space?: any;
     hasMedia: boolean | string[];
+    dynamicThemeAccess?: boolean;
 };
 export type ClassNamesObject = Record<string, string>;
 export type TamaguiComponentEvents = {