@tamagui/web 1.2.5

package/src/helpers/expandStyles.ts

@@ -0,0 +1,107 @@
+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 { normalizeValueWithProperty } from './normalizeValueWithProperty.js'
+import { pseudoDescriptors } from './pseudoDescriptors'
+
+let shorthands: Record<string, string> | null = null
+export const defaultOffset = { height: 0, width: 0 }
+
+/**
+ * This is what you want to run before Object.assign() a style onto another.
+ * It does the following:
+ *   1. Turns user shorthands into longhands, ie px = paddingHorizontal
+ *   2. Normalizes various inconsistent styles to be more consistent
+ *   3. Expands react-native shorthands, ie paddingHorizontal => paddingLeft, paddingRight
+ */
+
+export function expandStyles(style: Record<string, any>, config = getConfig()) {
+  const res: Record<string, any> = {}
+
+  for (let key in style) {
+    shorthands = shorthands || (config ? config.shorthands : null)
+    if (shorthands) {
+      key = shorthands[key] || key
+    }
+    if (key in pseudoDescriptors) {
+      res[key] = expandStyles(style[key])
+      continue
+    }
+    const val = normalizeValueWithProperty(style[key], key)
+    // expand react-native shorthands
+    const out = expandStyle(key, val)
+    if (out) {
+      Object.assign(res, Object.fromEntries(out))
+    } else {
+      res[key] = val
+    }
+  }
+
+  fixStyles(res)
+
+  return res
+}
+
+export function fixStyles(style: Record<string, any>) {
+  if (style.shadowRadius) {
+    Object.assign(style, normalizeShadow(style))
+  }
+
+  // ensure border style set by default to solid
+  for (const key in borderDefaults) {
+    if (style[key] && !style[borderDefaults[key]]) {
+      style[borderDefaults[key]] = 'solid'
+    }
+  }
+}
+
+const borderDefaults = {
+  borderWidth: 'borderStyle',
+  borderBottomWidth: 'borderBottomStyle',
+  borderTopWidth: 'borderTopStyle',
+  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/extendStaticConfig.ts

@@ -0,0 +1,78 @@
+import { stylePropsView } from '@tamagui/helpers'
+
+import { StaticConfig, StaticConfigParsed, StylableComponent } from '../types'
+import { createPropMapper } from './createPropMapper'
+import { mergeProps } from './mergeProps'
+
+export function extendStaticConfig(
+  config: Partial<StaticConfig>,
+  parent?: StylableComponent
+) {
+  if (!(parent && 'staticConfig' in parent)) {
+    return parseStaticConfig(config)
+  }
+
+  const parentStaticConf = parent.staticConfig as StaticConfig
+  const variants = {
+    ...parentStaticConf.variants,
+  }
+
+  // merge variants... can we type this?
+  if (config.variants) {
+    for (const key in config.variants) {
+      if (variants[key]) {
+        variants[key] = {
+          ...variants[key],
+          ...config.variants[key],
+        }
+      } else {
+        variants[key] = config.variants[key]
+      }
+    }
+  }
+
+  // include our own
+  const parentNames = [...(parentStaticConf.parentNames || [])]
+  if (parentStaticConf.componentName) {
+    parentNames.push(parentStaticConf.componentName)
+  }
+
+  const deoptProps = config.deoptProps || new Set<string>()
+  // deoptProps.add('style')
+
+  return parseStaticConfig({
+    ...parentStaticConf,
+    ...config,
+    deoptProps,
+    variants,
+    parentNames,
+    validStyles: config.validStyles
+      ? {
+          ...parentStaticConf.validStyles,
+          ...config.validStyles,
+        }
+      : parentStaticConf.validStyles || stylePropsView,
+    defaultProps: mergeProps(
+      {
+        ...parentStaticConf.defaultProps,
+        ...parentStaticConf.defaultVariants,
+      },
+      {
+        ...config.defaultProps,
+        ...config.defaultVariants,
+      }
+    )[0],
+  })
+}
+
+export const parseStaticConfig = (config: Partial<StaticConfig>): StaticConfigParsed => {
+  const parsed = {
+    defaultProps: {},
+    ...config,
+    parsed: true,
+  } as const
+  return {
+    ...parsed,
+    propMapper: createPropMapper(parsed as StaticConfigParsed),
+  }
+}

package/src/helpers/getAnimationDriver.tsx

@@ -0,0 +1,5 @@
+import { getConfig } from '../config'
+
+export function getAnimationDriver() {
+  return getConfig().animations
+}

package/src/helpers/getExpandedShorthands.ts

@@ -0,0 +1,17 @@
+import { getConfig } from '../config'
+import { Shorthands } from '../types'
+
+export function getExpandedShorthands<A extends Object>(
+  props: A
+): Omit<A, keyof Shorthands> {
+  const shorthands = getConfig().shorthands
+  if (!shorthands) {
+    return props
+  }
+  const res: A = {} as any
+  for (const key in props) {
+    // @ts-ignore
+    res[shorthands[key] || key] = props[key]
+  }
+  return res
+}

package/src/helpers/getFontLanguage.ts

@@ -0,0 +1,2 @@
+export const getFontLanguage = (fontFamily: string) =>
+  fontFamily.includes('_') ? fontFamily.split('_')[1] : null