@tamagui/web 1.75.9 → 1.77.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/web",
-  "version": "1.75.9",
+  "version": "1.77.0",
   "source": "src/index.ts",
   "main": "dist/cjs",
   "module": "dist/esm",
@@ -27,19 +27,19 @@
     "reset.css"
   ],
   "dependencies": {
-    "@tamagui/compose-refs": "1.75.9",
-    "@tamagui/constants": "1.75.9",
-    "@tamagui/helpers": "1.75.9",
-    "@tamagui/normalize-css-color": "1.75.9",
-    "@tamagui/timer": "1.75.9",
-    "@tamagui/use-did-finish-ssr": "1.75.9",
-    "@tamagui/use-force-update": "1.75.9"
+    "@tamagui/compose-refs": "1.77.0",
+    "@tamagui/constants": "1.77.0",
+    "@tamagui/helpers": "1.77.0",
+    "@tamagui/normalize-css-color": "1.77.0",
+    "@tamagui/timer": "1.77.0",
+    "@tamagui/use-did-finish-ssr": "1.77.0",
+    "@tamagui/use-force-update": "1.77.0"
   },
   "peerDependencies": {
     "react": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "1.75.9",
+    "@tamagui/build": "1.77.0",
     "@testing-library/react": "^14.0.0",
     "csstype": "^3.0.10",
     "react": "^18.2.0",
@@ -67,7 +67,7 @@
   "repository": {
     "type": "git",
     "url": "https://github.com/tamagui/tamagui.git",
-    "directory": "packages/core"
+    "directory": "packages/web"
   },
   "publishConfig": {
     "access": "public"

package/src/createComponent.tsx

@@ -31,6 +31,7 @@ import {
   mergeIfNotShallowEqual,
 } from './helpers/createShallowSetState'
 import { useSplitStyles } from './helpers/getSplitStyles'
+import { log } from './helpers/log'
 import { mergeProps } from './helpers/mergeProps'
 import { proxyThemeVariables } from './helpers/proxyThemeVariables'
 import { themeable } from './helpers/themeable'
@@ -160,7 +161,7 @@ export function createComponent<
         initialTheme = proxyThemeVariables(next)
         if (process.env.NODE_ENV === 'development') {
           if (!initialTheme) {
-            console.info('Warning: Missing theme')
+            log('Warning: Missing theme')
           }
         }
       }
@@ -181,7 +182,7 @@ export function createComponent<
 
   if (process.env.NODE_ENV === 'development' && staticConfig.defaultProps?.['debug']) {
     if (process.env.IS_STATIC !== 'is_static') {
-      console.info(`🐛 [${staticConfig.componentName || 'Component'}]`, {
+      log(`🐛 [${staticConfig.componentName || 'Component'}]`, {
         staticConfig,
         defaultProps,
         defaultPropsKeyOrder: defaultProps ? Object.keys(defaultProps) : [],
@@ -545,7 +546,7 @@ export function createComponent<
             }${state.focus ? 'FOCUSED' : ' '}`
           )
 
-          console.info({
+          log({
             propsIn,
             props,
             state,
@@ -649,19 +650,12 @@ export function createComponent<
       if (debugProp && debugProp !== 'profile') {
         console.groupCollapsed('>>>')
 
-        console.info(
-          'props in',
-          propsIn,
-          'mapped to',
-          props,
-          'in order',
-          Object.keys(props)
-        )
-        console.info('splitStyles', splitStyles)
-        console.info('media', { shouldListenForMedia, isMediaArray, mediaListeningKeys })
-        console.info('className', Object.values(splitStyles.classNames))
+        log('props in', propsIn, 'mapped to', props, 'in order', Object.keys(props))
+        log('splitStyles', splitStyles)
+        log('media', { shouldListenForMedia, isMediaArray, mediaListeningKeys })
+        log('className', Object.values(splitStyles.classNames))
         if (isClient) {
-          console.info('ref', hostRef, '(click to view)')
+          log('ref', hostRef, '(click to view)')
         }
         console.groupEnd()
         if (debugProp === 'break') {
@@ -1091,7 +1085,7 @@ export function createComponent<
     if (process.env.NODE_ENV === 'development' && time) time`events`
 
     if (process.env.NODE_ENV === 'development' && debugProp === 'verbose') {
-      console.info(`events`, { events, isHoverable, attachPress })
+      log(`events`, { events, isHoverable, attachPress })
     }
 
     // EVENTS native
@@ -1244,14 +1238,14 @@ export function createComponent<
         const element = typeof elementType === 'string' ? elementType : 'Component'
         console.groupCollapsed(`render <${element} /> with props`)
         try {
-          console.info('viewProps', viewProps)
-          console.info('viewPropsOrder', Object.keys(viewProps))
+          log('viewProps', viewProps)
+          log('viewPropsOrder', Object.keys(viewProps))
           for (const key in viewProps) {
-            console.info(' - ', key, viewProps[key])
+            log(' - ', key, viewProps[key])
           }
-          console.info('children', content)
+          log('children', content)
           if (typeof window !== 'undefined') {
-            console.info({
+            log({
               viewProps,
               state,
               styleProps,
@@ -1540,7 +1534,7 @@ export function spacedChildren(props: SpacedChildrenProps) {
 
   if (process.env.NODE_ENV === 'development') {
     if (props.debug) {
-      console.info(`  Spaced children`, final, props)
+      log(`  Spaced children`, final, props)
     }
   }
 

package/src/createTamagui.ts

@@ -256,12 +256,15 @@ ${runtimeStyles}`
 
   const config: TamaguiInternalConfig = {
     fonts: {},
-    settings: {},
     onlyAllowShorthands: false,
     fontLanguages: [],
     animations: {} as any,
     media: {},
     ...configIn,
+    settings: {
+      webContainerType: 'size',
+      ...configIn.settings,
+    },
     tokens: tokens as any,
     // vite made this into a function if it wasn't set
     shorthands,

package/src/helpers/createMediaStyle.ts

@@ -118,7 +118,9 @@ export const createMediaStyle = (
 
     // add @supports for legacy browser support to not break container queries
     if (groupMediaKey) {
-      styleRule = `@supports (contain: inline-size) {${styleRule}}`
+      styleRule = `@supports (contain: ${
+        conf.settings.webContainerType || 'inline-size'
+      }) {${styleRule}}`
     }
   }
 

package/src/helpers/getSplitStyles.tsx

@@ -69,6 +69,7 @@ import {
   shouldInsertStyleRules,
   updateRules,
 } from './insertStyleRule'
+import { log } from './log'
 import {
   normalizeValueWithProperty,
   reverseMapClassNameToValue,
@@ -209,8 +210,7 @@ export const getSplitStyles: StyleSplitter = (
     isClient
   ) {
     console.groupCollapsed('getSplitStyles (collapsed)')
-
-    console.info({
+    log({
       props,
       staticConfig,
       shouldDoClasses,
@@ -274,11 +274,12 @@ export const getSplitStyles: StyleSplitter = (
         if (process.env.TAMAGUI_TARGET === 'web') {
           // add container style
           const identifier = `t_group_${valInit}`
+          const containerType = conf.settings.webContainerType || 'size'
           const containerCSS = {
             identifier,
             property: 'container',
             rules: [
-              `.${identifier} { container-name: ${valInit}; container-type: inline-size; }`,
+              `.${identifier} { container-name: ${valInit}; container-type: ${containerType}; }`,
             ],
           }
           addStyleToInsertRules(rulesToInsert, containerCSS)
@@ -296,7 +297,7 @@ export const getSplitStyles: StyleSplitter = (
       if (valInitType === 'string' && valInit[0] === '_') {
         if (keyInit in validStyleProps || keyInit.includes('-')) {
           if (process.env.NODE_ENV === 'development' && debug) {
-            console.info(`Adding compiled style ${keyInit}: ${valInit}`)
+            log(`Adding compiled style ${keyInit}: ${valInit}`)
           }
 
           if (shouldDoClasses) {
@@ -498,7 +499,7 @@ export const getSplitStyles: StyleSplitter = (
 
           if (isValidClassName || isMediaOrPseudo) {
             if (process.env.NODE_ENV === 'development' && debug) {
-              console.info('tamagui classname prop', keyInit, valInit)
+              log('tamagui classname prop', keyInit, valInit)
             }
 
             if (shouldDoClasses) {
@@ -569,9 +570,9 @@ export const getSplitStyles: StyleSplitter = (
           shouldPassThrough ? '(pass)' : ''
         } 🔹🔹🔹🔹`
       )
-      console.info({ isVariant, valInit, shouldPassProp })
+      log({ isVariant, valInit, shouldPassProp })
       if (isClient) {
-        console.info({
+        log({
           variants,
           variant: variants?.[keyInit],
           isVariant,
@@ -655,7 +656,7 @@ export const getSplitStyles: StyleSplitter = (
       console.groupCollapsed('  💠 expanded', keyInit, valInit)
       try {
         if (!isServer && isDevTools) {
-          console.info({
+          log({
             expanded,
             styleProps,
             componentState,
@@ -667,7 +668,7 @@ export const getSplitStyles: StyleSplitter = (
             usedKeys: { ...usedKeys },
             curProps: { ...styleState.curProps },
           })
-          console.info('expanded', expanded, '\nusedKeys', { ...usedKeys }, '\ncurrent', {
+          log('expanded', expanded, '\nusedKeys', { ...usedKeys }, '\ncurrent', {
             ...style,
           })
         }
@@ -702,7 +703,7 @@ export const getSplitStyles: StyleSplitter = (
         passDownProp(viewProps, key, val, isMediaOrPseudo)
         if (process.env.NODE_ENV === 'development' && debug === 'verbose') {
           console.groupCollapsed(` - passing down prop ${key}`)
-          console.info({ val, after: { ...viewProps[key] } })
+          log({ val, after: { ...viewProps[key] } })
           console.groupEnd()
         }
         continue
@@ -761,7 +762,7 @@ export const getSplitStyles: StyleSplitter = (
             // prettier-ignore
             console.groupCollapsed("pseudo (classes)", key);
 
-            console.info({ pseudoStyleObject, pseudoStyles })
+            log({ pseudoStyleObject, pseudoStyles })
             console.groupEnd()
           }
 
@@ -800,7 +801,7 @@ export const getSplitStyles: StyleSplitter = (
             // prettier-ignore
             console.groupCollapsed("pseudo", key, { isDisabled });
 
-            console.info(pseudoStyleObject, {
+            log(pseudoStyleObject, {
               isDisabled,
               descriptorKey,
               descriptor,
@@ -833,7 +834,7 @@ export const getSplitStyles: StyleSplitter = (
               }
 
               if (process.env.NODE_ENV === 'development' && debug === 'verbose') {
-                console.info('    subKey', pkey, shouldMerge, {
+                log('    subKey', pkey, shouldMerge, {
                   importance,
                   curImportance,
                   pkey,
@@ -888,7 +889,7 @@ export const getSplitStyles: StyleSplitter = (
         const mediaKeyShort = key.slice(1)
 
         if (process.env.NODE_ENV === 'development' && debug === 'verbose') {
-          console.info(`  📺 ${key}`, {
+          log(`  📺 ${key}`, {
             key,
             val,
             mediaStyle,
@@ -923,7 +924,7 @@ export const getSplitStyles: StyleSplitter = (
                 space = val['space']
                 usedKeys['space'] = importance
                 if (process.env.NODE_ENV === 'development' && debug === 'verbose') {
-                  console.info(
+                  log(
                     `Found more important space for current media ${mediaKeyShort}: ${val} (importance: ${importance})`
                   )
                 }
@@ -944,6 +945,9 @@ export const getSplitStyles: StyleSplitter = (
               false,
               priority
             )
+            if (process.env.NODE_ENV === 'development' && debug === 'verbose') {
+              log(`📺 media style:`, out)
+            }
             const fullKey = `${style.property}${PROP_SPLIT}${mediaKeyShort}`
             if (fullKey in usedKeys) continue
             addStyleToInsertRules(rulesToInsert, out as any)
@@ -1063,9 +1067,9 @@ export const getSplitStyles: StyleSplitter = (
     if (process.env.NODE_ENV === 'development' && debug === 'verbose') {
       console.groupCollapsed(` ✔️ expand complete`, keyInit)
       try {
-        console.info('style', { ...style })
-        console.info('transforms', { ...transforms })
-        console.info('viewProps', { ...viewProps })
+        log('style', { ...style })
+        log('transforms', { ...transforms })
+        log('viewProps', { ...viewProps })
       } catch {
         // RN can run into PayloadTooLargeError: request entity too large
       }
@@ -1089,7 +1093,7 @@ export const getSplitStyles: StyleSplitter = (
   if (!avoidNormalize) {
     fixStyles(style)
 
-    // shouldnt this be better? but breaks some tests wierdly, need to check
+    // shouldn't this be better? but breaks some tests weirdly, need to check
     // if (isWeb && !staticConfig.isReactNative) {
     if (isWeb && !staticConfig.isReactNative) {
       styleToCSS(style)
@@ -1295,7 +1299,7 @@ export const getSplitStyles: StyleSplitter = (
         }
       }
       if (process.env.NODE_ENV === 'development' && debug && debug !== 'profile') {
-        console.info(`Found fontFamily native: ${style.fontFamily}`, faceInfo)
+        log(`Found fontFamily native: ${style.fontFamily}`, faceInfo)
       }
     }
   }
@@ -1320,7 +1324,7 @@ export const getSplitStyles: StyleSplitter = (
           parentSplitStyles,
         };
         for (const key in logs) {
-          console.info(key, logs[key])
+          log(key, logs[key])
         }
       } catch {
         // RN can run into PayloadTooLargeError: request entity too large

package/src/helpers/log.ts

@@ -0,0 +1,9 @@
+export function log(...args: any[]) {
+  if (process.env.NODE_ENV === 'production') return
+  if (process.env.TAMAGUI_TARGET === 'web') {
+    return console.info(...args)
+  }
+  // react native doesn't log in the cli unless it's log
+  // biome-ignore lint/suspicious/noConsoleLog: <explanation>
+  return console.log(...args)
+}

package/src/hooks/useProps.tsx

@@ -16,7 +16,7 @@ type UsePropsOptions = Pick<
   forComponent?: { staticConfig: StaticConfig }
 }
 
-type FlattenedProps<A> = {
+type PropsWithoutMediaStyles<A> = {
   // remove all media
   [Key in keyof A extends `$${string}` ? never : keyof A]?: A[Key]
 }
@@ -30,7 +30,7 @@ type FlattenedProps<A> = {
 export function useProps<A extends Object>(
   props: A,
   opts?: UsePropsOptions
-): FlattenedProps<A> {
+): PropsWithoutMediaStyles<A> {
   const [propsOut, styleOut] = usePropsAndStyle(props, {
     ...opts,
     noExpand: true,
@@ -52,7 +52,7 @@ export function useProps<A extends Object>(
 export function useStyle<A extends Object>(
   props: A,
   opts?: UsePropsOptions
-): FlattenedProps<A> {
+): PropsWithoutMediaStyles<A> {
   return usePropsAndStyle(props, opts)[1]
 }
 
@@ -65,7 +65,7 @@ export function useStyle<A extends Object>(
 export function usePropsAndStyle<A extends Object>(
   props: A,
   opts?: UsePropsOptions
-): [FlattenedProps<A>, FlattenedProps<A>, ThemeParsed, UseMediaState] {
+): [PropsWithoutMediaStyles<A>, PropsWithoutMediaStyles<A>, ThemeParsed, UseMediaState] {
   const staticConfig = opts?.forComponent?.staticConfig ?? Stack.staticConfig
   const [themeState, theme] = useThemeWithState({
     componentName: staticConfig.componentName,

package/src/hooks/useTheme.tsx

@@ -236,6 +236,17 @@ export function getThemeProxied(
             },
           })
         }
+
+        if (
+          process.env.NODE_ENV === 'development' &&
+          process.env.TAMAGUI_FEAT_THROW_ON_MISSING_THEME_VALUE === '1'
+        ) {
+          throw new Error(
+            `[tamagui] No theme key "${key}" found in theme ${name}. \n  Keys in theme: ${Object.keys(
+              theme
+            ).join(', ')}`
+          )
+        }
       }
 
       return Reflect.get(_, key)

package/src/types.tsx

@@ -634,6 +634,20 @@ type GenericTamaguiSettings = {
    * Then this feature is safe to turn on and will significantly speed up dark/light re-renders.
    */
   fastSchemeChange?: boolean
+
+  /**
+   * On Web, this allows changing the behavior of container groups which by default uses
+   * `container-type: normal`.
+   */
+  webContainerType?:
+    | 'normal'
+    | 'size'
+    | 'inline-size'
+    | 'inherit'
+    | 'initial'
+    | 'revert'
+    | 'revert-layer'
+    | 'unset'
 }
 
 export type TamaguiSettings = TamaguiConfig['settings']
@@ -651,7 +665,7 @@ export type CreateTamaguiProps = {
     }
   }
 
-  settings?: GenericTamaguiSettings
+  settings?: Partial<GenericTamaguiSettings>
 
   /**
    * Define a default font, for better types and default font on Text

package/types/createComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":"AAIA,OAAO,KAaN,MAAM,OAAO,CAAA;AAsBd,OAAO,EAEL,SAAS,EAKT,cAAc,EACd,UAAU,EACV,WAAW,EACX,UAAU,EACV,YAAY,EAEZ,gBAAgB,EAGhB,cAAc,EAEd,SAAS,EAKV,MAAM,SAAS,CAAA;AAoBhB,eAAO,MAAM,QAAQ,eAAsB,CAAA;AA6D3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,UAAU,GAAG,SAAS,GAAG,EAAE,EACtD,GAAG,GAAG,cAAc,EACpB,SAAS,GAAG,KAAK,EACjB,YAAY,EAAE,YAAY,8DA6rC3B;AAsBD,wBAAgB,QAAQ,CAAC,KAAK,EAAE;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE,OAEjD;AAiBD,eAAO,MAAM,MAAM,4DAqCjB,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,mBAiGxD"}
+{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":"AAIA,OAAO,KAaN,MAAM,OAAO,CAAA;AAuBd,OAAO,EAEL,SAAS,EAKT,cAAc,EACd,UAAU,EACV,WAAW,EACX,UAAU,EACV,YAAY,EAEZ,gBAAgB,EAGhB,cAAc,EAEd,SAAS,EAKV,MAAM,SAAS,CAAA;AAoBhB,eAAO,MAAM,QAAQ,eAAsB,CAAA;AA6D3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,UAAU,GAAG,SAAS,GAAG,EAAE,EACtD,GAAG,GAAG,cAAc,EACpB,SAAS,GAAG,KAAK,EACjB,YAAY,EAAE,YAAY,8DAsrC3B;AAsBD,wBAAgB,QAAQ,CAAC,KAAK,EAAE;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE,OAEjD;AAiBD,eAAO,MAAM,MAAM,4DAqCjB,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,mBAiGxD"}

package/types/createTamagui.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createTamagui.d.ts","sourceRoot":"","sources":["../src/createTamagui.ts"],"names":[],"mappings":"AAiBA,OAAO,EACL,kBAAkB,EAKlB,kBAAkB,EAMnB,MAAM,SAAS,CAAA;AAKhB,wBAAgB,aAAa,CAAC,IAAI,SAAS,kBAAkB,EAC3D,QAAQ,EAAE,IAAI,GACb,kBAAkB,CAAC,IAAI,CAAC,CA4Q1B"}
+{"version":3,"file":"createTamagui.d.ts","sourceRoot":"","sources":["../src/createTamagui.ts"],"names":[],"mappings":"AAiBA,OAAO,EACL,kBAAkB,EAKlB,kBAAkB,EAMnB,MAAM,SAAS,CAAA;AAKhB,wBAAgB,aAAa,CAAC,IAAI,SAAS,kBAAkB,EAC3D,QAAQ,EAAE,IAAI,GACb,kBAAkB,CAAC,IAAI,CAAC,CA+Q1B"}

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

@@ -1 +1 @@
-{"version":3,"file":"createMediaStyle.d.ts","sourceRoot":"","sources":["../../src/helpers/createMediaStyle.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAKxF,eAAO,MAAM,SAAS,MAAM,CAAA;AAS5B,eAAO,MAAM,gBAAgB,gBACd,WAAW,cACZ,MAAM,gBACJ,YAAY,QACpB,WAAW,WACR,OAAO,aACL,MAAM,KAChB,gBA0GF,CAAA"}
+{"version":3,"file":"createMediaStyle.d.ts","sourceRoot":"","sources":["../../src/helpers/createMediaStyle.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAKxF,eAAO,MAAM,SAAS,MAAM,CAAA;AAS5B,eAAO,MAAM,gBAAgB,gBACd,WAAW,cACZ,MAAM,gBACJ,YAAY,QACpB,WAAW,WACR,OAAO,aACL,MAAM,KAChB,gBA4GF,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"getSplitStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/getSplitStyles.tsx"],"names":[],"mappings":"AAkCA,OAAO,KAAK,EAEV,iBAAiB,EACjB,SAAS,EACT,cAAc,EACd,aAAa,EAOb,eAAe,EACf,YAAY,EAEZ,qBAAqB,EAErB,cAAc,EACd,WAAW,EAEZ,MAAM,UAAU,CAAA;AA6BjB,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,YAAY,EAC1B,KAAK,EAAE,WAAW,EAClB,SAAS,EAAE,MAAM,EACjB,cAAc,EAAE,qBAAqB,EACrC,UAAU,EAAE,eAAe,EAC3B,iBAAiB,CAAC,EAAE,cAAc,GAAG,IAAI,EACzC,OAAO,CAAC,EAAE,iBAAiB,EAE3B,WAAW,CAAC,EAAE,MAAM,EACpB,KAAK,CAAC,EAAE,SAAS,KACd,cAAc,CAAA;AAEnB,eAAO,MAAM,UAAU,MAAM,CAAA;AAuB7B,eAAO,MAAM,cAAc,EAAE,aAorC5B,CAAA;AA2DD,eAAO,MAAM,WAAW,eACV,aAAa,UACjB,MAAM,WACL,MAAM,wBACO,OAAO,KAC5B,cA2BF,CAAA;AAqBD,eAAO,MAAM,cAAc,EAAE,aAQ5B,CAAA"}
+{"version":3,"file":"getSplitStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/getSplitStyles.tsx"],"names":[],"mappings":"AAkCA,OAAO,KAAK,EAEV,iBAAiB,EACjB,SAAS,EACT,cAAc,EACd,aAAa,EAOb,eAAe,EACf,YAAY,EAEZ,qBAAqB,EAErB,cAAc,EACd,WAAW,EAEZ,MAAM,UAAU,CAAA;AA8BjB,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,YAAY,EAC1B,KAAK,EAAE,WAAW,EAClB,SAAS,EAAE,MAAM,EACjB,cAAc,EAAE,qBAAqB,EACrC,UAAU,EAAE,eAAe,EAC3B,iBAAiB,CAAC,EAAE,cAAc,GAAG,IAAI,EACzC,OAAO,CAAC,EAAE,iBAAiB,EAE3B,WAAW,CAAC,EAAE,MAAM,EACpB,KAAK,CAAC,EAAE,SAAS,KACd,cAAc,CAAA;AAEnB,eAAO,MAAM,UAAU,MAAM,CAAA;AAuB7B,eAAO,MAAM,cAAc,EAAE,aAurC5B,CAAA;AA2DD,eAAO,MAAM,WAAW,eACV,aAAa,UACjB,MAAM,WACL,MAAM,wBACO,OAAO,KAC5B,cA2BF,CAAA;AAqBD,eAAO,MAAM,cAAc,EAAE,aAQ5B,CAAA"}

package/types/helpers/log.d.ts

@@ -0,0 +1,2 @@
+export declare function log(...args: any[]): void;
+//# sourceMappingURL=log.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"log.d.ts","sourceRoot":"","sources":["../../src/helpers/log.ts"],"names":[],"mappings":"AAAA,wBAAgB,GAAG,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,QAQjC"}

package/types/hooks/useConfiguration.d.ts

@@ -67,6 +67,7 @@ export declare const useConfiguration: () => {
         autocompleteSpecificTokens?: (boolean | "except-special") | undefined;
         mediaPropOrder?: boolean | undefined;
         fastSchemeChange?: boolean | undefined;
+        webContainerType?: "size" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "normal" | "inline-size" | undefined;
     };
     tokens: Omit<{
         [x: string]: {

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

@@ -1 +1 @@
-{"version":3,"file":"useConfiguration.d.ts","sourceRoot":"","sources":["../../src/hooks/useConfiguration.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAQ5B,CAAA"}
+{"version":3,"file":"useConfiguration.d.ts","sourceRoot":"","sources":["../../src/hooks/useConfiguration.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAQ5B,CAAA"}

package/types/hooks/useProps.d.ts

@@ -5,7 +5,7 @@ type UsePropsOptions = Pick<SplitStyleProps, 'noExpand' | 'noNormalize' | 'noCla
         staticConfig: StaticConfig;
     };
 };
-type FlattenedProps<A> = {
+type PropsWithoutMediaStyles<A> = {
     [Key in keyof A extends `$${string}` ? never : keyof A]?: A[Key];
 };
 /**
@@ -14,20 +14,20 @@ type FlattenedProps<A> = {
  * Use sparingly, it will loop props and trigger re-render on all media queries you access.
  *
  * */
-export declare function useProps<A extends Object>(props: A, opts?: UsePropsOptions): FlattenedProps<A>;
+export declare function useProps<A extends Object>(props: A, opts?: UsePropsOptions): PropsWithoutMediaStyles<A>;
 /**
  * Returns only style values fully resolved and flattened with merged media queries and shorthands with all theme and token values resolved.
  *
  * Use sparingly, it will loop props and trigger re-render on all media queries you access.
  *
  * */
-export declare function useStyle<A extends Object>(props: A, opts?: UsePropsOptions): FlattenedProps<A>;
+export declare function useStyle<A extends Object>(props: A, opts?: UsePropsOptions): PropsWithoutMediaStyles<A>;
 /**
  * Returns [props, styles] fully resolved and flattened with merged media queries and shorthands with all theme and token values resolved.
  *
  * Use sparingly, it will loop props and trigger re-render on all media queries you access.
  *
  * */
-export declare function usePropsAndStyle<A extends Object>(props: A, opts?: UsePropsOptions): [FlattenedProps<A>, FlattenedProps<A>, ThemeParsed, UseMediaState];
+export declare function usePropsAndStyle<A extends Object>(props: A, opts?: UsePropsOptions): [PropsWithoutMediaStyles<A>, PropsWithoutMediaStyles<A>, ThemeParsed, UseMediaState];
 export {};
 //# sourceMappingURL=useProps.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useProps.d.ts","sourceRoot":"","sources":["../../src/hooks/useProps.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,eAAe,EAAE,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AAKpF,KAAK,eAAe,GAAG,IAAI,CACzB,eAAe,EACf,UAAU,GAAG,aAAa,GAAG,cAAc,GAAG,eAAe,CAC9D,GAAG;IACF,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,YAAY,CAAC,EAAE;QAAE,YAAY,EAAE,YAAY,CAAA;KAAE,CAAA;CAC9C,CAAA;AAED,KAAK,cAAc,CAAC,CAAC,IAAI;KAEtB,GAAG,IAAI,MAAM,CAAC,SAAS,IAAI,MAAM,EAAE,GAAG,KAAK,GAAG,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC;CACjE,CAAA;AAED;;;;;KAKK;AACL,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EACvC,KAAK,EAAE,CAAC,EACR,IAAI,CAAC,EAAE,eAAe,GACrB,cAAc,CAAC,CAAC,CAAC,CAWnB;AAED;;;;;KAKK;AACL,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EACvC,KAAK,EAAE,CAAC,EACR,IAAI,CAAC,EAAE,eAAe,GACrB,cAAc,CAAC,CAAC,CAAC,CAEnB;AAED;;;;;KAKK;AACL,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,EAC/C,KAAK,EAAE,CAAC,EACR,IAAI,CAAC,EAAE,eAAe,GACrB,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,aAAa,CAAC,CAyBpE"}
+{"version":3,"file":"useProps.d.ts","sourceRoot":"","sources":["../../src/hooks/useProps.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,eAAe,EAAE,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AAKpF,KAAK,eAAe,GAAG,IAAI,CACzB,eAAe,EACf,UAAU,GAAG,aAAa,GAAG,cAAc,GAAG,eAAe,CAC9D,GAAG;IACF,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,YAAY,CAAC,EAAE;QAAE,YAAY,EAAE,YAAY,CAAA;KAAE,CAAA;CAC9C,CAAA;AAED,KAAK,uBAAuB,CAAC,CAAC,IAAI;KAE/B,GAAG,IAAI,MAAM,CAAC,SAAS,IAAI,MAAM,EAAE,GAAG,KAAK,GAAG,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC;CACjE,CAAA;AAED;;;;;KAKK;AACL,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EACvC,KAAK,EAAE,CAAC,EACR,IAAI,CAAC,EAAE,eAAe,GACrB,uBAAuB,CAAC,CAAC,CAAC,CAW5B;AAED;;;;;KAKK;AACL,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EACvC,KAAK,EAAE,CAAC,EACR,IAAI,CAAC,EAAE,eAAe,GACrB,uBAAuB,CAAC,CAAC,CAAC,CAE5B;AAED;;;;;KAKK;AACL,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,EAC/C,KAAK,EAAE,CAAC,EACR,IAAI,CAAC,EAAE,eAAe,GACrB,CAAC,uBAAuB,CAAC,CAAC,CAAC,EAAE,uBAAuB,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,aAAa,CAAC,CAyBtF"}

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

@@ -1 +1 @@
-{"version":3,"file":"useTheme.d.ts","sourceRoot":"","sources":["../../src/hooks/useTheme.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,QAAQ,EAAe,MAAM,mBAAmB,CAAA;AAGzD,OAAO,EACL,YAAY,EACZ,iBAAiB,EAElB,MAAM,yBAAyB,CAAA;AAEhC,OAAO,KAAK,EACV,SAAS,EACT,WAAW,EACX,UAAU,EACV,sBAAsB,EACtB,WAAW,EACX,kBAAkB,EACnB,MAAM,UAAU,CAAA;AAGjB,MAAM,MAAM,oBAAoB,GAAG;IACjC,KAAK,CAAC,EAAE,iBAAiB,CAAA;IACzB,YAAY,CAAC,EAAE,YAAY,GAAG,IAAI,CAAA;IAClC,UAAU,EAAE,OAAO,CAAA;IAGnB,QAAQ,CAAC,EAAE,IAAI,GAAG,OAAO,CAAA;IACzB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAcD,MAAM,MAAM,aAAa,CAAC,GAAG,IAAI,GAAG,GAAG;IACrC;;;;;;;;;OASG;IACH,GAAG,EAAE,CACH,QAAQ,CAAC,EAAE,KAAK,KAEd,MAAM,GACN,CAAC,GAAG,SAAS,QAAQ,CAAC,MAAM,CAAC,CAAC,GAC1B,CAAC,SAAS,kBAAkB,GAC1B,GAAG,GACH,OAAO,CAAC,CAAC,EAAE,QAAQ,CAAC,GACtB,GAAG,SAAS,WAAW,GACvB,MAAM,GAAG,MAAM,GACf,OAAO,CAAC,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;KAC1B,GAAG,IAAI,MAAM,WAAW,GAAG,aAAa,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;CAC5D,CAAA;AAED,eAAO,MAAM,QAAQ,WAAW,UAAU,mBAIzC,CAAA;AAED,eAAO,MAAM,iBAAiB,UACrB,sBAAsB,KAC5B,CAAC,oBAAoB,EAAE,WAAW,CAuDpC,CAAA;AAED,wBAAgB,eAAe,CAC7B,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,iBAAiB,EAC1C,KAAK,UAAQ,EACb,YAAY,CAAC,EAAE,YAAY,EAC3B,IAAI,CAAC,EAAE,MAAM,EAAE,EACf,KAAK,CAAC,EAAE,SAAS,GAChB,cAAc,CAmGhB;AAeD,eAAO,MAAM,mBAAmB,mBAA0B,CAAA;AAE1D,eAAO,MAAM,oBAAoB,UACxB,sBAAsB,2BAEtB,MAAM,EAAE,iBACA,MAAM,OAAO,GAAG,SAAS,KACvC,oBA4QF,CAAA"}
+{"version":3,"file":"useTheme.d.ts","sourceRoot":"","sources":["../../src/hooks/useTheme.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,QAAQ,EAAe,MAAM,mBAAmB,CAAA;AAGzD,OAAO,EACL,YAAY,EACZ,iBAAiB,EAElB,MAAM,yBAAyB,CAAA;AAEhC,OAAO,KAAK,EACV,SAAS,EACT,WAAW,EACX,UAAU,EACV,sBAAsB,EACtB,WAAW,EACX,kBAAkB,EACnB,MAAM,UAAU,CAAA;AAGjB,MAAM,MAAM,oBAAoB,GAAG;IACjC,KAAK,CAAC,EAAE,iBAAiB,CAAA;IACzB,YAAY,CAAC,EAAE,YAAY,GAAG,IAAI,CAAA;IAClC,UAAU,EAAE,OAAO,CAAA;IAGnB,QAAQ,CAAC,EAAE,IAAI,GAAG,OAAO,CAAA;IACzB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAcD,MAAM,MAAM,aAAa,CAAC,GAAG,IAAI,GAAG,GAAG;IACrC;;;;;;;;;OASG;IACH,GAAG,EAAE,CACH,QAAQ,CAAC,EAAE,KAAK,KAEd,MAAM,GACN,CAAC,GAAG,SAAS,QAAQ,CAAC,MAAM,CAAC,CAAC,GAC1B,CAAC,SAAS,kBAAkB,GAC1B,GAAG,GACH,OAAO,CAAC,CAAC,EAAE,QAAQ,CAAC,GACtB,GAAG,SAAS,WAAW,GACvB,MAAM,GAAG,MAAM,GACf,OAAO,CAAC,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;KAC1B,GAAG,IAAI,MAAM,WAAW,GAAG,aAAa,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;CAC5D,CAAA;AAED,eAAO,MAAM,QAAQ,WAAW,UAAU,mBAIzC,CAAA;AAED,eAAO,MAAM,iBAAiB,UACrB,sBAAsB,KAC5B,CAAC,oBAAoB,EAAE,WAAW,CAuDpC,CAAA;AAED,wBAAgB,eAAe,CAC7B,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,iBAAiB,EAC1C,KAAK,UAAQ,EACb,YAAY,CAAC,EAAE,YAAY,EAC3B,IAAI,CAAC,EAAE,MAAM,EAAE,EACf,KAAK,CAAC,EAAE,SAAS,GAChB,cAAc,CA8GhB;AAeD,eAAO,MAAM,mBAAmB,mBAA0B,CAAA;AAE1D,eAAO,MAAM,oBAAoB,UACxB,sBAAsB,2BAEtB,MAAM,EAAE,iBACA,MAAM,OAAO,GAAG,SAAS,KACvC,oBA4QF,CAAA"}

package/types/types.d.ts

@@ -410,6 +410,11 @@ type GenericTamaguiSettings = {
      * Then this feature is safe to turn on and will significantly speed up dark/light re-renders.
      */
     fastSchemeChange?: boolean;
+    /**
+     * On Web, this allows changing the behavior of container groups which by default uses
+     * `container-type: normal`.
+     */
+    webContainerType?: 'normal' | 'size' | 'inline-size' | 'inherit' | 'initial' | 'revert' | 'revert-layer' | 'unset';
 };
 export type TamaguiSettings = TamaguiConfig['settings'];
 export type CreateTamaguiProps = {
@@ -424,7 +429,7 @@ export type CreateTamaguiProps = {
             [key: string]: string | number | Variable;
         };
     };
-    settings?: GenericTamaguiSettings;
+    settings?: Partial<GenericTamaguiSettings>;
     /**
      * Define a default font, for better types and default font on Text
      */