@tamagui/web 1.4.0 → 1.5.1

package/src/helpers/expandStyles.ts

@@ -1,9 +1,6 @@
-import { isWeb } from '@tamagui/constants'
-import { normalizeCSSColor } from '@tamagui/normalize-css-color'
-
 import { getConfig } from '../config'
 import { expandStyle } from './expandStyle'
-import { normalizeColor, rgba } from './normalizeColor'
+import { normalizeShadow } from './normalizeShadow'
 import { normalizeValueWithProperty } from './normalizeValueWithProperty.js'
 import { pseudoDescriptors } from './pseudoDescriptors'
 
@@ -46,13 +43,19 @@ export function expandStyles(style: Record<string, any>, config = getConfig()) {
 }
 
 export function fixStyles(style: Record<string, any>) {
-  if (style.shadowRadius) {
+  if (
+    style.shadowRadius ||
+    style.shadowColor ||
+    style.shadowOpacity ||
+    style.shadowOffset
+  ) {
     Object.assign(style, normalizeShadow(style))
   }
 
+  // TODO could be native-only
   // ensure border style set by default to solid
   for (const key in borderDefaults) {
-    if (style[key] && !style[borderDefaults[key]]) {
+    if (key in style && !style[borderDefaults[key]]) {
       style[borderDefaults[key]] = 'solid'
     }
   }
@@ -65,43 +68,3 @@ const borderDefaults = {
   borderLeftWidth: 'borderLeftStyle',
   borderRightWidth: 'borderRightStyle',
 }
-
-function normalizeShadow({
-  shadowColor,
-  shadowOffset,
-  shadowOpacity,
-  shadowRadius,
-}: Record<string, any>) {
-  const { height, width } = shadowOffset || defaultOffset
-  const colorStr = String(shadowColor || 'black')
-  return {
-    shadowOffset: {
-      width: normalizeValueWithProperty(width || 0),
-      height: normalizeValueWithProperty(height || 0),
-    },
-    shadowRadius: normalizeValueWithProperty(shadowRadius || 0),
-    ...(isWeb && {
-      shadowColor: normalizeColor(colorStr, shadowOpacity),
-    }),
-    ...(process.env.TAMAGUI_TARGET === 'native' &&
-      (() => {
-        // on native fix bug - shadows behave better if turned into non-alpha rgb() + shadowOpacity
-        const val = normalizeCSSColor(colorStr)
-        if (!val) {
-          if (process.env.NODE_ENV === 'development') {
-            // eslint-disable-next-line no-console
-            console.warn('No rgba form', colorStr)
-          }
-          return {
-            shadowColor,
-            shadowOpacity,
-          }
-        }
-        const { r, g, b, a } = rgba(val)
-        return {
-          shadowColor: `rgb(${r},${g},${b})`,
-          shadowOpacity: shadowOpacity ?? a,
-        }
-      })()),
-  }
-}

package/src/helpers/getSplitStyles.tsx

@@ -35,7 +35,6 @@ import type {
   RulesToInsert,
   SpaceTokens,
   SplitStyleState,
-  StackProps,
   StaticConfigParsed,
   TamaguiInternalConfig,
   ThemeParsed,
@@ -52,19 +51,16 @@ import {
   shouldInsertStyleRules,
   updateRules,
 } from './insertStyleRule'
-import { FlatTransforms, mergeTransform, mergeTransforms } from './mergeTransform'
 import {
   normalizeValueWithProperty,
   reverseMapClassNameToValue,
 } from './normalizeValueWithProperty.js'
 import { pseudoDescriptors } from './pseudoDescriptors'
-import { warnOnce } from './warnOnce'
 
 type GetStyleState = {
   style: ViewStyle
   usedKeys: Record<string, number>
   classNames: ClassNamesObject
-  flatTransforms: FlatTransforms
   staticConfig: StaticConfigParsed
   theme: ThemeParsed
   props: Record<string, any>
@@ -213,15 +209,8 @@ export const getSplitStyles: StyleSplitter = (
 
   conf = conf || getConfig()
   const { shorthands } = conf
-  const {
-    defaultVariants,
-    variants,
-    propMapper,
-    isReactNative,
-    deoptProps,
-    inlineProps,
-    inlineWhenUnflattened,
-  } = staticConfig
+  const { variants, propMapper, isReactNative, inlineProps, inlineWhenUnflattened } =
+    staticConfig
   const validStyleProps = staticConfig.isText ? stylePropsText : validStyles
   const viewProps: GetStyleResult['viewProps'] = {}
   let pseudos: PseudoStyles | null = null
@@ -251,7 +240,6 @@ export const getSplitStyles: StyleSplitter = (
   const styleState: GetStyleState = {
     classNames,
     conf,
-    flatTransforms,
     props,
     state,
     staticConfig,
@@ -262,12 +250,6 @@ export const getSplitStyles: StyleSplitter = (
     languageContext,
   }
 
-  if (process.env.NODE_ENV === 'development') {
-    if (props.selectable) {
-      warnOnce('props.selectable', 'selectable props deprecated, use userSelect')
-    }
-  }
-
   if (process.env.NODE_ENV === 'development' && debug === 'verbose') {
     // eslint-disable-next-line no-console
     console.groupCollapsed('getSplitStyles (looping backwards)')
@@ -668,7 +650,7 @@ export const getSplitStyles: StyleSplitter = (
             if (isDisabled) {
               if (!(pkey in usedKeys) && pkey in animatableDefaults) {
                 const defaultVal = animatableDefaults[pkey]
-                mergeStyle(styleState, pkey, defaultVal, true)
+                mergeStyle(styleState, flatTransforms, pkey, defaultVal, true)
               }
               continue
             }
@@ -679,7 +661,7 @@ export const getSplitStyles: StyleSplitter = (
               pseudos ||= {}
               pseudos[key] ||= {}
               pseudos[key][pkey] = val
-              mergeStyle(styleState, pkey, val)
+              mergeStyle(styleState, flatTransforms, pkey, val)
             }
             if (process.env.NODE_ENV === 'development' && debug === 'verbose') {
               // prettier-ignore
@@ -793,7 +775,7 @@ export const getSplitStyles: StyleSplitter = (
       }
 
       if (key in validStyleProps) {
-        mergeStyle(styleState, key, val)
+        mergeStyle(styleState, flatTransforms, key, val)
         continue
       }
 
@@ -1012,7 +994,8 @@ function getSubStyleProps(
 }
 
 function mergeStyle(
-  { usedKeys, classNames, flatTransforms, viewProps, style }: GetStyleState,
+  { usedKeys, classNames, viewProps, style }: GetStyleState,
+  flatTransforms: FlatTransforms,
   key: string,
   val: any,
   dontSetUsed = false
@@ -1122,3 +1105,27 @@ const animatableDefaults = {
 
 const lowercaseHyphenate = (match: string) => `-${match.toLowerCase()}`
 const hyphenate = (str: string) => str.replace(/[A-Z]/g, lowercaseHyphenate)
+
+export type FlatTransforms = Record<string, any>
+
+const mergeTransform = (obj: ViewStyle, key: string, val: any, backwards = false) => {
+  obj.transform ||= []
+  obj.transform[backwards ? 'unshift' : 'push']({
+    [mapTransformKeys[key] || key]: val,
+  } as any)
+}
+
+const mergeTransforms = (
+  obj: ViewStyle,
+  flatTransforms: FlatTransforms,
+  backwards = false
+) => {
+  Object.entries(flatTransforms).forEach(([key, val]) => {
+    mergeTransform(obj, key, val, backwards)
+  })
+}
+
+const mapTransformKeys = {
+  x: 'translateX',
+  y: 'translateY',
+}

package/src/helpers/normalizeColor.ts

@@ -2,37 +2,26 @@ import { isWeb } from '@tamagui/constants'
 import * as NCC from '@tamagui/normalize-css-color'
 
 export const rgba = NCC.rgba
+export const names = NCC.names
 
-export const normalizeColor = (color?: string | null, opacity?: number) => {
-  if (color === null || color === undefined) {
-    return
-  }
-  if (color === 'transparent') {
-    return `rgba(0,0,0,0)`
-  }
-  if (
-    color[0] === '$' ||
-    (isWeb && (webColors[color] || color[0] === '_' || color.startsWith('var(')))
-  ) {
+export const normalizeColor = (color?: string | null, opacity = 1) => {
+  if (!color) return
+  if (color === 'transparent') return `rgba(0,0,0,0)`
+  if (color[0] === '$') return color
+  if (isWeb && opacity === 1) {
     return color
   }
   const colorProcessed = NCC.normalizeCSSColor(color)
-  if (colorProcessed !== null) {
+  if (colorProcessed) {
     const { r, g, b, a } = rgba(colorProcessed)
     return `rgba(${r},${g},${b},${(opacity ?? a).toFixed(2)})`
   }
-
-  if (isWeb) {
-    return color
-  } else {
+  if (process.env.TAMAGUI_TARGET === 'native') {
     if (process.env.NODE_ENV === 'development') {
       console.warn(`Unknown color value: ${color}`)
     }
+    // avoids errors
+    return
   }
-}
-
-const webColors = {
-  currentColor: true,
-  currentcolor: true,
-  inherit: true,
+  return color
 }

package/src/helpers/normalizeShadow.native.ts

@@ -0,0 +1,30 @@
+import { normalizeCSSColor } from '@tamagui/normalize-css-color'
+
+import { defaultOffset } from './expandStyles'
+import { rgba } from './normalizeColor'
+import { normalizeValueWithProperty } from './normalizeValueWithProperty.js'
+
+export function normalizeShadow({
+  shadowColor,
+  shadowOffset,
+  shadowOpacity,
+  shadowRadius,
+}: Record<string, any>) {
+  const { height, width } = shadowOffset || defaultOffset
+  const colorStr = String(shadowColor || 'black')
+  // on native fix bug - shadows behave better if turned into non-alpha rgb() + shadowOpacity
+  const val = normalizeCSSColor(colorStr)
+  if (!val) {
+    throw new Error(`invalid shadow color ${colorStr}`)
+  }
+  const { r, g, b, a } = rgba(val)
+  return {
+    shadowOffset: {
+      width: normalizeValueWithProperty(width || 0),
+      height: normalizeValueWithProperty(height || 0),
+    },
+    shadowRadius: normalizeValueWithProperty(shadowRadius || 0),
+    shadowColor: `rgb(${r},${g},${b})`,
+    shadowOpacity: shadowOpacity ?? a,
+  }
+}

package/src/helpers/normalizeShadow.ts

@@ -0,0 +1,20 @@
+import { defaultOffset } from './expandStyles'
+import { normalizeValueWithProperty } from './normalizeValueWithProperty.js'
+
+export function normalizeShadow({
+  shadowColor,
+  shadowOffset,
+  shadowOpacity = 1,
+  shadowRadius,
+}: Record<string, any>) {
+  const { height, width } = shadowOffset || defaultOffset
+  return {
+    shadowOffset: {
+      width: normalizeValueWithProperty(width || 0),
+      height: normalizeValueWithProperty(height || 0),
+    },
+    shadowRadius: normalizeValueWithProperty(shadowRadius || 0),
+    shadowColor,
+    shadowOpacity,
+  }
+}

package/src/helpers/normalizeStylePropKeys.native.ts

@@ -0,0 +1,12 @@
+export const normalizeStylePropKeys = {
+  backgroundColor: true,
+  borderColor: true,
+  borderTopColor: true,
+  borderRightColor: true,
+  borderBottomColor: true,
+  borderLeftColor: true,
+  color: true,
+  shadowColor: true,
+  textDecorationColor: true,
+  textShadowColor: true,
+}

package/src/helpers/normalizeStylePropKeys.ts

@@ -0,0 +1,3 @@
+// none for web, all for native
+
+export const normalizeStylePropKeys = {}

package/src/helpers/normalizeValueWithProperty.ts

@@ -6,20 +6,23 @@
 import { isWeb } from '@tamagui/constants'
 
 import { getAllSelectors } from './insertStyleRule'
-import { normalizeColor } from './normalizeColor'
+import { names, normalizeColor } from './normalizeColor'
+import { normalizeStylePropKeys } from './normalizeStylePropKeys'
 
 const colorCache = {}
 
 export function normalizeValueWithProperty(value: any, property?: string): any {
-  const cached = colorCache[value]
-  if (cached !== undefined) {
-    return cached
+  if (value in colorCache) {
+    return colorCache[value]
   }
   if (property && property in unitlessNumbers) {
     return value
   }
   let res = value
-  if (
+  if (property && (property in normalizeStylePropKeys || value in names)) {
+    res = normalizeColor(value)
+    colorCache[value] = res
+  } else if (
     process.env.TAMAGUI_TARGET === 'web' &&
     typeof value === 'number' &&
     (property === undefined ||
@@ -28,28 +31,10 @@ export function normalizeValueWithProperty(value: any, property?: string): any {
     res = `${value}px`
   } else if (isWeb && property !== undefined && property in stringNumbers) {
     res = `${res}`
-  } else if (property && property in colorProps) {
-    res = normalizeColor(value)
-    colorCache[value] = res
   }
   return res
 }
 
-// TODO react-native-web-lite
-
-const colorProps = {
-  backgroundColor: true,
-  borderColor: true,
-  borderTopColor: true,
-  borderRightColor: true,
-  borderBottomColor: true,
-  borderLeftColor: true,
-  color: true,
-  shadowColor: true,
-  textDecorationColor: true,
-  textShadowColor: true,
-}
-
 const stringNumbers = {
   zIndex: true,
 }
@@ -64,6 +49,7 @@ const unitlessNumbers = {
   columnCount: true,
   flex: true,
   flexGrow: true,
+  flexBasis: true,
   flexOrder: true,
   flexPositive: true,
   flexShrink: true,

package/src/helpers/themeable.tsx

@@ -1,6 +1,6 @@
 import React, { forwardRef, useId } from 'react'
 
-import { ThemeName } from '../types'
+import { DebugProp, ThemeName } from '../types'
 import { Theme } from '../views/Theme'
 
 export interface ThemeableProps {
@@ -8,7 +8,7 @@ export interface ThemeableProps {
   themeInverse?: boolean
   themeReset?: boolean
   componentName?: string
-  debug?: boolean | 'verbose'
+  debug?: DebugProp
 }
 
 export function themeable<Component extends (props: any) => any>(

package/src/views/Theme.tsx

@@ -60,14 +60,13 @@ export function useThemedChildren(
   )
 
   if (isWeb) {
-    const enableClassName =
-      forceClassName === true || (forceClassName !== false && isNewTheme)
+    const enableClassName = forceClassName ?? (forceClassName !== false && isNewTheme)
     return (
       <span
         className="_dsp_contents"
         {...(theme &&
           enableClassName && {
-            className: `${className} ${forceClassName ? 'forced1' : ''} _dsp_contents`,
+            className: `${className} _dsp_contents`,
             style: {
               // in order to provide currentColor, set color by default
               color: variableToString(theme.color),

package/types/createComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":"AAQA,OAAO,KAUN,MAAM,OAAO,CAAA;AAiBd,OAAO,EACL,SAAS,EACT,cAAc,EACd,WAAW,EACX,WAAW,EACX,YAAY,EACZ,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAEhB,qBAAqB,EAErB,cAAc,EAIf,MAAM,SAAS,CAAA;AAmBhB,eAAO,MAAM,qBAAqB,EAAE,qBAMnC,CAAA;AAeD,eAAO,MAAM,QAAQ,eAAsB,CAAA;AA8B3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,MAAM,GAAG,EAAE,EACtC,GAAG,GAAG,cAAc,EACpB,SAAS,GAAG,KAAK,EAEjB,QAAQ,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,kBAAkB,EACpD,eAAe,CAAC,EAAE,iBAAiB,4DAmwBpC;AAGD,eAAO,MAAM,QAAQ;YAAW;QAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAE;;CAEjD,CAAA;AAMD,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,WAAW,GAAG,MAAM,GAAG,IAAI,CAAA;IACnC,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":"AAGA,OAAO,KAUN,MAAM,OAAO,CAAA;AAiBd,OAAO,EACL,SAAS,EACT,cAAc,EACd,WAAW,EACX,WAAW,EACX,YAAY,EACZ,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAEhB,qBAAqB,EAErB,cAAc,EAIf,MAAM,SAAS,CAAA;AAmBhB,eAAO,MAAM,qBAAqB,EAAE,qBAMnC,CAAA;AAeD,eAAO,MAAM,QAAQ,eAAsB,CAAA;AA8B3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,MAAM,GAAG,EAAE,EACtC,GAAG,GAAG,cAAc,EACpB,SAAS,GAAG,KAAK,EAEjB,QAAQ,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,kBAAkB,EACpD,eAAe,CAAC,EAAE,iBAAiB,4DAkwBpC;AAGD,eAAO,MAAM,QAAQ;YAAW;QAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAE;;CAEjD,CAAA;AAMD,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,WAAW,GAAG,MAAM,GAAG,IAAI,CAAA;IACnC,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":"AAmBA,OAAO,EACL,kBAAkB,EAClB,kBAAkB,EAGnB,MAAM,SAAS,CAAA;AAKhB,wBAAgB,aAAa,CAAC,IAAI,SAAS,kBAAkB,EAC3D,QAAQ,EAAE,IAAI,GACb,kBAAkB,CAAC,IAAI,CAAC,CA6N1B"}
+{"version":3,"file":"createTamagui.d.ts","sourceRoot":"","sources":["../src/createTamagui.ts"],"names":[],"mappings":"AAmBA,OAAO,EACL,kBAAkB,EAClB,kBAAkB,EAGnB,MAAM,SAAS,CAAA;AAKhB,wBAAgB,aAAa,CAAC,IAAI,SAAS,kBAAkB,EAC3D,QAAQ,EAAE,IAAI,GACb,kBAAkB,CAAC,IAAI,CAAC,CA+N1B"}

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

@@ -1 +1 @@
-{"version":3,"file":"expandStyle.d.ts","sourceRoot":"","sources":["../../src/helpers/expandStyle.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,wBAAgB,WAAW,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,uBAwClD"}
+{"version":3,"file":"expandStyle.d.ts","sourceRoot":"","sources":["../../src/helpers/expandStyle.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,wBAAgB,WAAW,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,uBA2BlD"}

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

@@ -1 +1 @@
-{"version":3,"file":"expandStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/expandStyles.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,aAAa;;;CAA0B,CAAA;AAEpD;;;;;;GAMG;AAEH,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM;;;;;;;;;;;;6BAAc,uBAyB5E;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAWnD"}
+{"version":3,"file":"expandStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/expandStyles.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,aAAa;;;CAA0B,CAAA;AAEpD;;;;;;GAMG;AAEH,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM;;;;;;;;;;;;6BAAc,uBAyB5E;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAiBnD"}

package/types/helpers/getSplitStyles.d.ts

@@ -1,12 +1,10 @@
 import type { ViewStyle } from 'react-native';
 import type { ClassNamesObject, DebugProp, GetStyleResult, SplitStyleState, StaticConfigParsed, TamaguiInternalConfig, ThemeParsed } from '../types';
 import { FontLanguageProps, LanguageContextType } from '../views/FontLanguage.types';
-import { FlatTransforms } from './mergeTransform';
 type GetStyleState = {
     style: ViewStyle;
     usedKeys: Record<string, number>;
     classNames: ClassNamesObject;
-    flatTransforms: FlatTransforms;
     staticConfig: StaticConfigParsed;
     theme: ThemeParsed;
     props: Record<string, any>;
@@ -27,5 +25,6 @@ export declare const getSplitStyles: StyleSplitter;
 export declare const getSubStyle: (styleState: GetStyleState, subKey: string, styleIn: Object, avoidDefaultProps?: boolean, avoidMergeTransform?: boolean) => ViewStyle;
 export declare const insertSplitStyles: StyleSplitter;
 export declare const useSplitStyles: StyleSplitter;
+export type FlatTransforms = Record<string, any>;
 export {};
 //# sourceMappingURL=getSplitStyles.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"getSplitStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/getSplitStyles.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAa,SAAS,EAAE,MAAM,cAAc,CAAA;AAWxD,OAAO,KAAK,EACV,gBAAgB,EAChB,SAAS,EACT,cAAc,EAOd,eAAe,EAEf,kBAAkB,EAClB,qBAAqB,EACrB,WAAW,EACZ,MAAM,UAAU,CAAA;AACjB,OAAO,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAYpF,OAAO,EAAE,cAAc,EAAmC,MAAM,kBAAkB,CAAA;AAQlF,KAAK,aAAa,GAAG;IACnB,KAAK,EAAE,SAAS,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAChC,UAAU,EAAE,gBAAgB,CAAA;IAC5B,cAAc,EAAE,cAAc,CAAA;IAC9B,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;AAsFhE,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;AAqB7B,eAAO,MAAM,cAAc,EAAE,aA6uB5B,CAAA;AAyFD,eAAO,MAAM,WAAW,eACV,aAAa,UACjB,MAAM,WACL,MAAM,sBACK,OAAO,wBACL,OAAO,KAC5B,SA6BF,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,aAI/B,CAAA;AAOD,eAAO,MAAM,cAAc,EAAE,aAU5B,CAAA"}
+{"version":3,"file":"getSplitStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/getSplitStyles.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAa,SAAS,EAAE,MAAM,cAAc,CAAA;AAWxD,OAAO,KAAK,EACV,gBAAgB,EAChB,SAAS,EACT,cAAc,EAOd,eAAe,EACf,kBAAkB,EAClB,qBAAqB,EACrB,WAAW,EACZ,MAAM,UAAU,CAAA;AACjB,OAAO,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAkBpF,KAAK,aAAa,GAAG;IACnB,KAAK,EAAE,SAAS,CAAA;IAChB,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;AAsFhE,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;AAqB7B,eAAO,MAAM,cAAc,EAAE,aA+tB5B,CAAA;AA0FD,eAAO,MAAM,WAAW,eACV,aAAa,UACjB,MAAM,WACL,MAAM,sBACK,OAAO,wBACL,OAAO,KAC5B,SA6BF,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,aAI/B,CAAA;AAOD,eAAO,MAAM,cAAc,EAAE,aAU5B,CAAA;AA8BD,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA"}

package/types/helpers/normalizeColor.d.ts

@@ -1,4 +1,9 @@
 import * as NCC from '@tamagui/normalize-css-color';
 export declare const rgba: typeof NCC.rgba;
+export declare const names: {
+    transparent: number;
+    white: number;
+    black: number;
+};
 export declare const normalizeColor: (color?: string | null, opacity?: number) => string | undefined;
 //# sourceMappingURL=normalizeColor.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"normalizeColor.d.ts","sourceRoot":"","sources":["../../src/helpers/normalizeColor.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,GAAG,MAAM,8BAA8B,CAAA;AAEnD,eAAO,MAAM,IAAI,iBAAW,CAAA;AAE5B,eAAO,MAAM,cAAc,WAAY,MAAM,GAAG,IAAI,YAAY,MAAM,uBA0BrE,CAAA"}
+{"version":3,"file":"normalizeColor.d.ts","sourceRoot":"","sources":["../../src/helpers/normalizeColor.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,GAAG,MAAM,8BAA8B,CAAA;AAEnD,eAAO,MAAM,IAAI,iBAAW,CAAA;AAC5B,eAAO,MAAM,KAAK;;;;CAAY,CAAA;AAE9B,eAAO,MAAM,cAAc,WAAY,MAAM,GAAG,IAAI,yCAoBnD,CAAA"}

package/types/helpers/normalizeColor.native.d.ts

@@ -0,0 +1,16 @@
+import * as NCC from '@tamagui/normalize-css-color';
+export declare const rgba: typeof NCC.rgba;
+export declare const normalizeStylePropKeys: {
+    backgroundColor: boolean;
+    borderColor: boolean;
+    borderTopColor: boolean;
+    borderRightColor: boolean;
+    borderBottomColor: boolean;
+    borderLeftColor: boolean;
+    color: boolean;
+    shadowColor: boolean;
+    textDecorationColor: boolean;
+    textShadowColor: boolean;
+};
+export declare const normalizeColor: (color?: string | null, opacity?: number) => string | undefined;
+//# sourceMappingURL=normalizeColor.native.d.ts.map

package/types/helpers/normalizeShadow.d.ts

@@ -0,0 +1,10 @@
+export declare function normalizeShadow({ shadowColor, shadowOffset, shadowOpacity, shadowRadius, }: Record<string, any>): {
+    shadowOffset: {
+        width: any;
+        height: any;
+    };
+    shadowRadius: any;
+    shadowColor: any;
+    shadowOpacity: any;
+};
+//# sourceMappingURL=normalizeShadow.d.ts.map

package/types/helpers/normalizeShadow.native.d.ts

@@ -0,0 +1,10 @@
+export declare function normalizeShadow({ shadowColor, shadowOffset, shadowOpacity, shadowRadius, }: Record<string, any>): {
+    shadowOffset: {
+        width: any;
+        height: any;
+    };
+    shadowRadius: any;
+    shadowColor: string;
+    shadowOpacity: any;
+};
+//# sourceMappingURL=normalizeShadow.native.d.ts.map

package/types/helpers/normalizeStylePropKeys.d.ts

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

package/types/helpers/normalizeStylePropKeys.native.d.ts

@@ -0,0 +1,13 @@
+export declare const normalizeStylePropKeys: {
+    backgroundColor: boolean;
+    borderColor: boolean;
+    borderTopColor: boolean;
+    borderRightColor: boolean;
+    borderBottomColor: boolean;
+    borderLeftColor: boolean;
+    color: boolean;
+    shadowColor: boolean;
+    textDecorationColor: boolean;
+    textShadowColor: boolean;
+};
+//# sourceMappingURL=normalizeStylePropKeys.native.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"normalizeValueWithProperty.d.ts","sourceRoot":"","sources":["../../src/helpers/normalizeValueWithProperty.ts"],"names":[],"mappings":"AAAA;;;GAGG;AASH,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,GAAG,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,GAAG,CAuB7E;AA6DD,wBAAgB,0BAA0B,CAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAiCxE"}
+{"version":3,"file":"normalizeValueWithProperty.d.ts","sourceRoot":"","sources":["../../src/helpers/normalizeValueWithProperty.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAUH,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,GAAG,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,GAAG,CAsB7E;AA+CD,wBAAgB,0BAA0B,CAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAiCxE"}

package/types/helpers/themeable.d.ts

@@ -1,10 +1,10 @@
-import { ThemeName } from '../types';
+import { DebugProp, ThemeName } from '../types';
 export interface ThemeableProps {
     theme?: ThemeName | null;
     themeInverse?: boolean;
     themeReset?: boolean;
     componentName?: string;
-    debug?: boolean | 'verbose';
+    debug?: DebugProp;
 }
 export declare function themeable<Component extends (props: any) => any>(component: Component, opts?: {
     componentName?: string;

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

@@ -1 +1 @@
-{"version":3,"file":"themeable.d.ts","sourceRoot":"","sources":["../../src/helpers/themeable.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAGpC,MAAM,WAAW,cAAc;IAC7B,KAAK,CAAC,EAAE,SAAS,GAAG,IAAI,CAAA;IACxB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;CAC5B;AAED,wBAAgB,SAAS,CAAC,SAAS,SAAS,CAAC,KAAK,EAAE,GAAG,KAAK,GAAG,EAC7D,SAAS,EAAE,SAAS,EACpB,IAAI,CAAC,EAAE;IAAE,aAAa,CAAC,EAAE,MAAM,CAAA;CAAE,8HA4BlC"}
+{"version":3,"file":"themeable.d.ts","sourceRoot":"","sources":["../../src/helpers/themeable.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAG/C,MAAM,WAAW,cAAc;IAC7B,KAAK,CAAC,EAAE,SAAS,GAAG,IAAI,CAAA;IACxB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB;AAED,wBAAgB,SAAS,CAAC,SAAS,SAAS,CAAC,KAAK,EAAE,GAAG,KAAK,GAAG,EAC7D,SAAS,EAAE,SAAS,EACpB,IAAI,CAAC,EAAE;IAAE,aAAa,CAAC,EAAE,MAAM,CAAA;CAAE,8HA4BlC"}

package/types/views/Theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../src/views/Theme.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,oBAAoB,EAAwB,MAAM,mBAAmB,CAAA;AAC9E,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAErC,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,OAYtC;AAED,wBAAgB,iBAAiB,CAC/B,UAAU,EAAE,oBAAoB,EAChC,QAAQ,EAAE,GAAG,EACb,OAAO,EAAE;IAAE,cAAc,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,OAwDzD"}
+{"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../src/views/Theme.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,oBAAoB,EAAwB,MAAM,mBAAmB,CAAA;AAC9E,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAErC,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,OAYtC;AAED,wBAAgB,iBAAiB,CAC/B,UAAU,EAAE,oBAAoB,EAChC,QAAQ,EAAE,GAAG,EACb,OAAO,EAAE;IAAE,cAAc,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,OAuDzD"}

package/src/helpers/mergeTransform.ts

@@ -1,30 +0,0 @@
-import type { ViewStyle } from 'react-native'
-
-export type FlatTransforms = Record<string, any>
-
-export const mergeTransform = (
-  obj: ViewStyle,
-  key: string,
-  val: any,
-  backwards = false
-) => {
-  obj.transform ||= []
-  obj.transform[backwards ? 'unshift' : 'push']({
-    [mapTransformKeys[key] || key]: val,
-  } as any)
-}
-
-export const mergeTransforms = (
-  obj: ViewStyle,
-  flatTransforms: FlatTransforms,
-  backwards = false
-) => {
-  Object.entries(flatTransforms).forEach(([key, val]) => {
-    mergeTransform(obj, key, val, backwards)
-  })
-}
-
-export const mapTransformKeys = {
-  x: 'translateX',
-  y: 'translateY',
-}