@tamagui/core 1.0.0-alpha.7 → 1.0.0-alpha.8

package/dist/views/ThemeManagerContext.js

@@ -7,7 +7,7 @@ class ThemeManager {
     this.parentName = null;
     this.keys = new Map();
     this.listeners = new Map();
-    this.callbacks = new Set();
+    this.themeListeners = new Set();
     this.theme = null;
   }
   setActiveTheme({
@@ -36,12 +36,12 @@ class ThemeManager {
         this.listeners.get(uuid)?.();
       }
     }
-    this.callbacks.forEach((cb) => cb(this.name));
+    this.themeListeners.forEach((cb) => cb(this.name, this));
   }
   onChangeTheme(cb) {
-    this.callbacks.add(cb);
+    this.themeListeners.add(cb);
     return () => {
-      this.callbacks.delete(cb);
+      this.themeListeners.delete(cb);
     };
   }
   onUpdate(uuid, cb) {

package/dist/views/ThemeManagerContext.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/views/ThemeManagerContext.tsx"],
-  "sourcesContent": ["import { createContext } from 'react'\n\nexport class ThemeManager {\n  name: string | null = 'light'\n  parentName: string | null = null\n  keys = new Map<any, Set<string>>()\n  listeners = new Map<any, Function>()\n  callbacks = new Set<Function>()\n  theme = null\n\n  setActiveTheme({\n    name,\n    theme,\n    parentName,\n  }: {\n    parentName?: string | null\n    name: string | null\n    theme?: any\n  }) {\n    if (name === this.name) return\n    this.name = name\n    this.theme = theme\n    this.parentName = parentName || null\n    this.update()\n  }\n\n  track(uuid: any, keys: Set<string>) {\n    if (!this.name) return\n    this.keys.set(uuid, keys)\n  }\n\n  update() {\n    if (!this.name) {\n      this.keys.clear()\n    }\n    for (const [uuid, keys] of this.keys.entries()) {\n      if (keys.size) {\n        this.listeners.get(uuid)?.()\n      }\n    }\n    this.callbacks.forEach((cb) => cb(this.name))\n  }\n\n  onChangeTheme(cb: (name: string | null) => void) {\n    this.callbacks.add(cb)\n    return () => {\n      this.callbacks.delete(cb)\n    }\n  }\n\n  onUpdate(uuid: any, cb: Function) {\n    this.listeners.set(uuid, cb)\n    return () => {\n      this.listeners.delete(uuid)\n      this.keys.delete(uuid)\n    }\n  }\n}\n\nexport const ThemeManagerContext = createContext<ThemeManager>(new ThemeManager())\n"],
-  "mappings": ";;AAAA;AAEO,mBAAmB;AAAA,EAAnB,cAFP;AAGE,gBAAsB;AACtB,sBAA4B;AAC5B,gBAAO,IAAI;AACX,qBAAY,IAAI;AAChB,qBAAY,IAAI;AAChB,iBAAQ;AAAA;AAAA,EAER,eAAe;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,KAKC;AACD,QAAI,SAAS,KAAK;AAAM;AACxB,SAAK,OAAO;AACZ,SAAK,QAAQ;AACb,SAAK,aAAa,cAAc;AAChC,SAAK;AAAA;AAAA,EAGP,MAAM,MAAW,MAAmB;AAClC,QAAI,CAAC,KAAK;AAAM;AAChB,SAAK,KAAK,IAAI,MAAM;AAAA;AAAA,EAGtB,SAAS;AACP,QAAI,CAAC,KAAK,MAAM;AACd,WAAK,KAAK;AAAA;AAEZ,eAAW,CAAC,MAAM,SAAS,KAAK,KAAK,WAAW;AAC9C,UAAI,KAAK,MAAM;AACb,aAAK,UAAU,IAAI;AAAA;AAAA;AAGvB,SAAK,UAAU,QAAQ,CAAC,OAAO,GAAG,KAAK;AAAA;AAAA,EAGzC,cAAc,IAAmC;AAC/C,SAAK,UAAU,IAAI;AACnB,WAAO,MAAM;AACX,WAAK,UAAU,OAAO;AAAA;AAAA;AAAA,EAI1B,SAAS,MAAW,IAAc;AAChC,SAAK,UAAU,IAAI,MAAM;AACzB,WAAO,MAAM;AACX,WAAK,UAAU,OAAO;AACtB,WAAK,KAAK,OAAO;AAAA;AAAA;AAAA;AApDhB;AAyDA,MAAM,sBAAsB,cAA4B,IAAI;",
+  "sourcesContent": ["import { createContext } from 'react'\n\ntype ThemeListener = (name: string | null, themeManager: ThemeManager) => void\n\nexport class ThemeManager {\n  name: string | null = 'light'\n  parentName: string | null = null\n  keys = new Map<any, Set<string>>()\n  listeners = new Map<any, Function>()\n  themeListeners = new Set<ThemeListener>()\n  theme = null\n\n  setActiveTheme({\n    name,\n    theme,\n    parentName,\n  }: {\n    parentName?: string | null\n    name: string | null\n    theme?: any\n  }) {\n    if (name === this.name) return\n    this.name = name\n    this.theme = theme\n    this.parentName = parentName || null\n    this.update()\n  }\n\n  track(uuid: any, keys: Set<string>) {\n    if (!this.name) return\n    this.keys.set(uuid, keys)\n  }\n\n  update() {\n    if (!this.name) {\n      this.keys.clear()\n    }\n    for (const [uuid, keys] of this.keys.entries()) {\n      if (keys.size) {\n        this.listeners.get(uuid)?.()\n      }\n    }\n    this.themeListeners.forEach((cb) => cb(this.name, this))\n  }\n\n  onChangeTheme(cb: ThemeListener) {\n    this.themeListeners.add(cb)\n    return () => {\n      this.themeListeners.delete(cb)\n    }\n  }\n\n  onUpdate(uuid: any, cb: Function) {\n    this.listeners.set(uuid, cb)\n    return () => {\n      this.listeners.delete(uuid)\n      this.keys.delete(uuid)\n    }\n  }\n}\n\nexport const ThemeManagerContext = createContext<ThemeManager>(new ThemeManager())\n"],
+  "mappings": ";;AAAA;AAIO,mBAAmB;AAAA,EAAnB,cAJP;AAKE,gBAAsB;AACtB,sBAA4B;AAC5B,gBAAO,IAAI;AACX,qBAAY,IAAI;AAChB,0BAAiB,IAAI;AACrB,iBAAQ;AAAA;AAAA,EAER,eAAe;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,KAKC;AACD,QAAI,SAAS,KAAK;AAAM;AACxB,SAAK,OAAO;AACZ,SAAK,QAAQ;AACb,SAAK,aAAa,cAAc;AAChC,SAAK;AAAA;AAAA,EAGP,MAAM,MAAW,MAAmB;AAClC,QAAI,CAAC,KAAK;AAAM;AAChB,SAAK,KAAK,IAAI,MAAM;AAAA;AAAA,EAGtB,SAAS;AACP,QAAI,CAAC,KAAK,MAAM;AACd,WAAK,KAAK;AAAA;AAEZ,eAAW,CAAC,MAAM,SAAS,KAAK,KAAK,WAAW;AAC9C,UAAI,KAAK,MAAM;AACb,aAAK,UAAU,IAAI;AAAA;AAAA;AAGvB,SAAK,eAAe,QAAQ,CAAC,OAAO,GAAG,KAAK,MAAM;AAAA;AAAA,EAGpD,cAAc,IAAmB;AAC/B,SAAK,eAAe,IAAI;AACxB,WAAO,MAAM;AACX,WAAK,eAAe,OAAO;AAAA;AAAA;AAAA,EAI/B,SAAS,MAAW,IAAc;AAChC,SAAK,UAAU,IAAI,MAAM;AACzB,WAAO,MAAM;AACX,WAAK,UAAU,OAAO;AACtB,WAAK,KAAK,OAAO;AAAA;AAAA;AAAA;AApDhB;AAyDA,MAAM,sBAAsB,cAA4B,IAAI;",
   "names": []
 }

package/package.json

@@ -1,23 +1,24 @@
 {
   "name": "@tamagui/core",
-  "version": "1.0.0-alpha.7",
+  "version": "1.0.0-alpha.8",
   "source": "src/index.ts",
-  "main": "dist/index.cjs",
-  "module": "dist/index.js",
+  "main": "dist/cjs",
+  "module": "dist",
   "typings": "types.d.ts",
   "scripts": {
-    "build": "tamagui-build",
-    "watch": "tamagui-build --watch"
+    "build": "tamagui-build --separate",
+    "watch": "tamagui-build --separate --watch"
   },
   "files": [
+    "_",
     "types.d.ts",
     "dist",
     "src"
   ],
   "dependencies": {
-    "@tamagui/helpers": "^1.0.0-alpha.5",
-    "@tamagui/use-debounce": "^1.0.0-alpha.6",
-    "@tamagui/use-force-update": "^1.0.0-alpha.5",
+    "@tamagui/helpers": "^1.0.0-alpha.8",
+    "@tamagui/use-debounce": "^1.0.0-alpha.8",
+    "@tamagui/use-force-update": "^1.0.0-alpha.8",
     "react": "*",
     "react-dom": "*"
   },
@@ -25,7 +26,7 @@
     "react-native-web": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "^1.0.0-alpha.2",
+    "@tamagui/build": "^1.0.0-alpha.8",
     "@tamagui/ow": "^0.28.1",
     "@types/react": "^17.0.35",
     "esbuild": "^0.11.20",
@@ -37,5 +38,5 @@
   "engines": {
     "node": ">=16"
   },
-  "gitHead": "13694a98d31535846699004532630788177537e9"
+  "gitHead": "ecb0afe6782276b1f2ece90320fd2748f2f05c93"
 }

package/src/createComponent.tsx

@@ -477,7 +477,7 @@ export function createComponent<A extends Object = DefaultProps>(
     } else {
       if (!hasWarnedOnce) {
         hasWarnedOnce = true
-        console.log('⚠️ we need to account for default styles for media queries')
+        console.log('⚠️ TODO account for default styles for media queries')
       }
     }
     // @ts-ignore
@@ -500,10 +500,14 @@ export function createComponent<A extends Object = DefaultProps>(
   const res = component as any as StaticComponent<A, void>
 
   // add extractable HoC
-  res['extractable'] = (Component: any) => {
+  res['extractable'] = (Component: any, conf?: StaticConfig) => {
     Component['staticConfig'] = extendStaticConfig(res, {
+      ...conf,
       neverFlatten: true,
-      defaultProps: Component.defaultProps,
+      defaultProps: {
+        ...Component.defaultProps,
+        ...conf?.defaultProps,
+      },
     })
     return Component
   }

package/src/createTamagui.ts

@@ -28,7 +28,9 @@ export type CreateTamaguiProps = TamaguiProviderProps &
 let conf: TamaguiInternalConfig | null
 
 export const getHasConfigured = () => !!conf
-export const getTamaguiConfig = () => conf!
+
+export const getTamagui = () => conf!
+export const getTokens = () => conf!.tokensParsed
 
 type ConfigListener = (conf: TamaguiInternalConfig) => void
 const configListeners = new Set<ConfigListener>()

package/src/helpers/createPropMapper.ts

@@ -1,4 +1,4 @@
-import { getTamaguiConfig } from '../createTamagui'
+import { getTamagui } from '../createTamagui'
 import { Variable } from '../createVariable'
 import { StaticConfig, TamaguiInternalConfig } from '../types'
 import { isObj } from './isObj'
@@ -9,7 +9,7 @@ export const createPropMapper = (c: StaticConfig) => {
   const defaultProps = c.defaultProps || {}
 
   return (key: string, value: any, theme: any, props: any) => {
-    const conf = getTamaguiConfig()
+    const conf = getTamagui()
     if (!conf) {
       console.trace('no conf! err')
       return

package/src/helpers/getSplitStyles.tsx

@@ -8,7 +8,7 @@ import {
 import { ViewStyle } from 'react-native'
 
 import { isWeb } from '../constants/platform'
-import { mediaQueryConfig } from '../hooks/useMedia'
+import { mediaQueryConfig, mediaState } from '../hooks/useMedia'
 import { StaticConfigParsed, ThemeObject } from '../types'
 import { createMediaStyle } from './createMediaStyle'
 import { fixNativeShadow } from './fixNativeShadow'
@@ -53,14 +53,15 @@ export const getSplitStyles = (
       const mediaProps = { ...props, ...valInit }
       // TODO media + hover
       const mediaStyle = getSubStyle(valInit, staticConfig, theme, props)
-      const mediaStyles = getStylesAtomic(mediaStyle)
-      if (process.env.NODE_ENV === 'development') {
-        if (props['debug']) {
-          console.log('mediaStyles', keyInit, { mediaProps, mediaStyle, mediaStyles })
+
+      if (isWeb) {
+        const mediaStyles = getStylesAtomic(mediaStyle)
+        if (process.env.NODE_ENV === 'development') {
+          if (props['debug']) {
+            console.log('mediaStyles', keyInit, { mediaProps, mediaStyle, mediaStyles })
+          }
         }
-      }
-      for (const style of mediaStyles) {
-        if (isWeb) {
+        for (const style of mediaStyles) {
           const out = createMediaStyle(style, mediaKey, mediaQueryConfig)
           classNames = classNames || []
           classNames.push(out.identifier)
@@ -69,8 +70,10 @@ export const getSplitStyles = (
           if (process.env.NODE_ENV === 'development' && props['debug']) {
             console.log('mediaProp', style.identifier, out, mediaProps, mediaStyle, mediaStyles)
           }
-        } else {
-          console.log('TODO native media style logic')
+        }
+      } else {
+        if (mediaState[mediaKey]) {
+          style.push(mediaStyle)
         }
       }
       continue

package/src/helpers/matchMedia.native.ts

@@ -1,3 +1,6 @@
 import MediaQueryList from '@expo/match-media/build/MediaQueryList.js'
 
 export const matchMedia = (media: string) => new MediaQueryList(media)
+
+// @ts-ignore
+globalThis['matchMedia'] = matchMedia

package/src/helpers/matchMedia.ts

@@ -2,7 +2,15 @@ export const matchMedia =
   (typeof window !== 'undefined' && window.matchMedia) ||
   (function matchMediaFallback(query: string) {
     return {
-      addListener() {},
+      addListener() {
+        if (
+          process.env.NODE_ENV === 'development' &&
+          !process.env.IS_STATIC &&
+          process.env.TAMAGUI_TARGET !== 'web'
+        ) {
+          console.log('warning: matchMedia not loading! Is native picking up .native.js files?')
+        }
+      },
       removeListener() {},
       matches: false,
     }

package/src/hooks/useFeatures.tsx

@@ -1,51 +1,66 @@
 import React from 'react'
 
 import { isWeb, useIsomorphicLayoutEffect } from '../constants/platform'
-import { addMediaQueryListener, removeMediaQueryListener } from './useMedia'
+import { addMediaQueryListener, mediaState, removeMediaQueryListener } from './useMedia'
 
-// only needed on native
-// dynamic loading of features to avoid heavy views
+type FeatureDefinition = {
+  isEnabled: (props: any) => boolean
+  Component: any
+}
 
-const createDefinition = ({ Component, propNames }: { Component; propNames: string[] }) => ({
+const createDefinition = ({
+  Component,
+  propNames,
+}: {
+  Component: any
+  propNames: string[]
+}): FeatureDefinition => ({
   isEnabled: (props: any) => propNames.some((name) => !!props[name]),
   Component,
 })
 
-const mediaQueryPropNames = [
-  '$xs',
-  '$sm',
-  '$md',
-  '$lg',
-  '$xl',
-  '$xxl',
-  '$pointerCoarse',
-  '$hoverNone',
-  '$tall',
-  '$short',
-  '$gtSm',
-  '$notXs',
-  '$gtMd',
-  '$gtLg',
-]
+let featureDefinitions: Record<string, FeatureDefinition> | null = null
 
-const featureDefinitions = {
-  measureLayout: createDefinition({
-    Component: (props) => {
-      console.log('measure', props)
-      return null
-    },
-    propNames: ['onLayout'],
-  }),
+export const useFeatures = (props: any, utils?: { forceUpdate?: Function }) => {
+  if (!featureDefinitions) {
+    featureDefinitions = loadFeatures()
+  }
+  const features: JSX.Element[] = []
+  for (const name in featureDefinitions) {
+    const { isEnabled, Component } = featureDefinitions[name]
+    if (isEnabled(props) && Component) {
+      features.push(<Component key={name} {...props} _utils={utils} />)
+    }
+  }
+  return features
+}
 
-  // will update the parent whenever media query changes
-  mediaQuery: createDefinition({
-    Component: (props) => {
-      if (isWeb) {
-        // no need for media queries are inserted and run in css
-        return
-      }
+function loadFeatures(): Record<string, FeatureDefinition> {
+  return {
+    // TODO
+    // measureLayout: createDefinition({
+    //   Component: (props) => {
+    //     console.log('measure', props)
+    //     return null
+    //   },
+    //   propNames: ['onLayout'],
+    // }),
+
+    // will update the parent whenever media query changes
+    // no need on web, media queries are inserted and run in css
+    ...(!isWeb && {
+      mediaQuery: loadMediaQueryFeature(),
+    }),
+  }
+}
+
+function loadMediaQueryFeature() {
+  const mediaPropNames = Object.keys(mediaState)
+
+  return createDefinition({
+    Component: (props: any) => {
+      const keys = mediaPropNames.flatMap((x) => (x in props ? x.slice(1) : []))
 
-      const keys = mediaQueryPropNames.flatMap((x) => (x in props ? x.slice(1) : []))
       useIsomorphicLayoutEffect(() => {
         for (const key of keys) {
           addMediaQueryListener(key, props._utils.forceUpdate)
@@ -56,23 +71,9 @@ const featureDefinitions = {
           }
         }
       }, [keys.join(',')])
+
       return null
     },
-    propNames: mediaQueryPropNames,
-  }),
-}
-
-const featureNames = Object.keys(featureDefinitions)
-const numFeatures = featureNames.length
-
-export const useFeatures = (props: any, utils?: { forceUpdate?: Function }) => {
-  const features: JSX.Element[] = []
-  for (let i = 0; i < numFeatures; i++) {
-    const name = featureNames[i]
-    const { isEnabled, Component } = featureDefinitions[name] as any //FeatureDefinition
-    if (isEnabled(props) && Component) {
-      features.push(<Component key={name} {...props} _utils={utils} />)
-    }
-  }
-  return features
+    propNames: mediaPropNames,
+  })
 }

package/src/hooks/useMedia.tsx

@@ -1,7 +1,7 @@
 import { useForceUpdate } from '@tamagui/use-force-update'
 import { useRef } from 'react'
 
-import { useIsomorphicLayoutEffect } from '../constants/platform'
+import { isWeb, useIsomorphicLayoutEffect } from '../constants/platform'
 import { matchMedia } from '../helpers/matchMedia'
 import {
   ConfigureMediaQueryOptions,

package/src/hooks/useTheme.tsx

@@ -1,5 +1,5 @@
 import { useForceUpdate } from '@tamagui/use-force-update'
-import React, { useContext, useEffect, useMemo, useRef, useState } from 'react'
+import React, { useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'
 
 import { useIsomorphicLayoutEffect } from '../constants/platform'
 import { Variable } from '../createVariable'
@@ -24,17 +24,16 @@ const areEqualSets = (a: Set<string>, b: Set<string>) => {
   return true
 }
 
-export const useThemeName = () => {
+export const useThemeName = (opts?: { parent?: true }) => {
   const parent = useContext(ThemeManagerContext)
   const [name, setName] = useState(parent.name)
-  useEffect(() => {
-    return parent.onChangeTheme((next) => {
-      setName((prev) => {
-        if (prev === next) return prev
-        return next
-      })
+
+  useLayoutEffect(() => {
+    return parent.onChangeTheme((next, manager) => {
+      setName(opts?.parent ? manager.parentName : next)
     })
   }, [parent])
+
   return name || 'light'
 }
 

package/src/types.tsx

@@ -88,7 +88,7 @@ export type Shorthands = TamaguiConfig['shorthands']
 export type Media = TamaguiConfig['media']
 export type Themes = TamaguiConfig['themes']
 // themes
-export type ThemeName = keyof Themes extends `${infer Prefix}-light`
+export type ThemeName = keyof Themes extends `${infer Prefix}-${string}`
   ? Prefix | keyof Themes
   : keyof Themes
 export type ThemeKeys = keyof ThemeObject
@@ -320,7 +320,7 @@ export type StaticComponent<
    * If you create a styled frame component this is a HoC to extract
    * styles from all parents.
    */
-  extractable: <X>(a: X) => X
+  extractable: <X>(a: X, opts?: StaticConfig) => X
 }
 
 export type TamaguiProviderProps = Partial<Omit<ThemeProviderProps, 'children'>> & {

package/src/views/ThemeManagerContext.tsx

@@ -1,11 +1,13 @@
 import { createContext } from 'react'
 
+type ThemeListener = (name: string | null, themeManager: ThemeManager) => void
+
 export class ThemeManager {
   name: string | null = 'light'
   parentName: string | null = null
   keys = new Map<any, Set<string>>()
   listeners = new Map<any, Function>()
-  callbacks = new Set<Function>()
+  themeListeners = new Set<ThemeListener>()
   theme = null
 
   setActiveTheme({
@@ -38,13 +40,13 @@ export class ThemeManager {
         this.listeners.get(uuid)?.()
       }
     }
-    this.callbacks.forEach((cb) => cb(this.name))
+    this.themeListeners.forEach((cb) => cb(this.name, this))
   }
 
-  onChangeTheme(cb: (name: string | null) => void) {
-    this.callbacks.add(cb)
+  onChangeTheme(cb: ThemeListener) {
+    this.themeListeners.add(cb)
     return () => {
-      this.callbacks.delete(cb)
+      this.themeListeners.delete(cb)
     }
   }
 

package/types.d.ts

@@ -86,7 +86,7 @@ export declare type Tokens = TamaguiConfig["tokens"];
 export declare type Shorthands = TamaguiConfig["shorthands"];
 export declare type Media = TamaguiConfig["media"];
 export declare type Themes = TamaguiConfig["themes"];
-export declare type ThemeName = keyof Themes extends `${infer Prefix}-light` ? Prefix | keyof Themes : keyof Themes;
+export declare type ThemeName = keyof Themes extends `${infer Prefix}-${string}` ? Prefix | keyof Themes : keyof Themes;
 export declare type ThemeKeys = keyof ThemeObject;
 export declare type ThemeKeyVariables = `$${ThemeKeys}`;
 export declare type TamaguiInternalConfig<A extends GenericTokens = GenericTokens, B extends GenericThemes = GenericThemes, C extends GenericShorthands = GenericShorthands, D extends GenericMedia = GenericMedia> = CreateTamaguiConfig<A, B, C, D> & {
@@ -199,7 +199,7 @@ export declare type TextProps = Omit<ReactTextProps, "style"> & TextStyleProps &
 export declare type StaticComponent<Props = any, VariantProps = any, StaticConfParsed = StaticConfigParsed, ParentVariantProps = any> = React.FunctionComponent<Props> & {
 	staticConfig: StaticConfParsed;
 	variantProps?: VariantProps;
-	extractable: <X>(a: X) => X;
+	extractable: <X>(a: X, opts?: StaticConfig) => X;
 };
 export declare type TamaguiProviderProps = Partial<Omit<ThemeProviderProps, "children">> & {
 	initialWindowMetrics?: any;
@@ -353,7 +353,7 @@ export declare type CreateTamaguiProps = TamaguiProviderProps & Omit<GenericTama
 	mediaQueryDefaultActive?: MediaQueryKey[];
 };
 export declare const getHasConfigured: () => boolean;
-export declare const getTamaguiConfig: () => TamaguiInternalConfig<CreateTokens, {
+export declare const getTamagui: () => TamaguiInternalConfig<CreateTokens, {
 	[key: string]: {
 		bg: string | Variable;
 		bg2: string | Variable;
@@ -373,6 +373,7 @@ export declare const getTamaguiConfig: () => TamaguiInternalConfig<CreateTokens,
 		[key: string]: string | number;
 	};
 }>;
+export declare const getTokens: () => CreateTokens;
 export declare type ConfigListener = (conf: TamaguiInternalConfig) => void;
 export declare const onConfiguredOnce: (cb: ConfigListener) => void;
 export declare function createTamagui<Conf extends CreateTamaguiProps>(config: Conf): Conf extends CreateTamaguiConfig<infer A, infer B, infer C, infer D> ? TamaguiInternalConfig<A, B, C, D> : unknown;
@@ -509,7 +510,9 @@ export declare const useMedia: () => {
 	[x: string]: boolean;
 };
 export declare function mediaObjectToString(query: string | MediaQueryObject): string;
-export declare const useThemeName: () => string;
+export declare const useThemeName: (opts?: {
+	parent?: true | undefined;
+} | undefined) => string;
 export declare const useDefaultThemeName: () => string | number;
 export declare const useTheme: () => {
 	bg: string | Variable;