@tamagui/web 2.7.7 → 3.0.0-beta.1093.1

package/src/index.ts

@@ -1,57 +1,248 @@
-export * from './contexts/ComponentContext'
-export * from './contexts/GroupContext'
+export { ComponentContext, useConfiguration } from './contexts/ComponentContext'
+export { GroupContext } from './contexts/GroupContext'
 
-export * from '@tamagui/is-equal-shallow'
-export * from './_withStableStyle'
-export * from './createComponent'
-export * from './helpers/createMediaStyle'
-export * from './helpers/createStyledContext'
-export * from './helpers/getDefaultProps'
-export * from './helpers/expandStyles'
-export * from './helpers/getCSSStylesAtomic'
-export * from './helpers/getExpandedShorthands'
-export * from './helpers/getShorthandValue'
-export * from './helpers/getSplitStyles'
-export * from './helpers/getThemeCSSRules'
-export * from './helpers/getVariantExtras'
-export { autoVariables, mutatedAutoVariables } from './helpers/registerCSSVariable'
+export {
+  isEqualShallow,
+  mergeIfNotShallowEqual,
+  useCreateShallowSetState,
+  type CallbackSetState,
+} from '@tamagui/is-equal-shallow'
+export { _withStableStyle } from './_withStableStyle'
+export { _withNativeStyle } from './_withNativeStyle'
+export { createComponent } from './createComponent'
+export { createStyledContext } from './helpers/createStyledContext'
+export { getCSSStylesAtomic } from './helpers/getCSSStylesAtomic'
+export { getExpandedShorthand } from './helpers/getExpandedShorthands'
+export { formatDiagnostic } from './helpers/formatDiagnostic'
+export {
+  getStyleStaticConfig,
+  getSplitStyles,
+  isValidStyleKey,
+} from './helpers/getSplitStyles'
+export {
+  setNativeStyleEngine,
+  getNativeStyleEngine,
+  setNativeStyleEngineFlushListener,
+  updateNativeStyleScope,
+  removeNativeStyleScope,
+  type NativeStyleEngine,
+  type NativeStyleEngineSlots,
+  type NativeViewStateUpdate,
+} from './helpers/nativeStyleEngine'
+export {
+  autoVariables,
+  getAutoVariableCSS,
+  getMutatedAutoVariableCSS,
+  mutatedAutoVariables,
+} from './helpers/registerCSSVariable'
 export { insertStyleRules } from './helpers/insertStyleRule'
-export * from './helpers/isTamaguiComponent'
-export * from './helpers/isTamaguiElement'
-export * from './helpers/matchMedia'
-export * from './helpers/mergeProps'
-export * from './helpers/mergeSlotStyleProps'
-export * from './helpers/normalizeColor'
-export * from './helpers/normalizeStyle'
-export * from './helpers/normalizeValueWithProperty'
-export * from './helpers/propMapper'
-export * from './helpers/proxyThemeToParents'
-export * from './helpers/proxyThemeVariables'
-export * from './helpers/pseudoDescriptors'
-export * from './helpers/pseudoTransitions'
-export * from './helpers/themeable'
-export * from './helpers/themes'
-export * from './helpers/transformsToString'
-export * from './helpers/wrapStyleTags'
+export { isTamaguiComponent } from './helpers/isTamaguiComponent'
+export { isTamaguiElement } from './helpers/isTamaguiElement'
+export { matchMedia, setupMatchMedia } from './helpers/matchMedia'
+export { mergeProps } from './helpers/mergeProps'
+export { mergeSlotStyleProps } from './helpers/mergeSlotStyleProps'
+export {
+  splitStyleProps,
+  type SplitStylePropsFilter,
+  type SplitStylePropsFilterCallback,
+  type SplitStylePropsOptions,
+  type SplitStylePropsResult,
+} from './helpers/splitStyleProps'
+export { normalizeColor } from './helpers/normalizeColor'
+export { normalizeStyle } from './helpers/normalizeStyle'
+export { containsThemeRef, themeRefKey } from './helpers/themeRef'
+export { getStyleTags } from './helpers/wrapStyleTags'
 
-export * from './createComponent'
-export * from './createFont'
-export * from './createShorthands'
-export * from './createTamagui'
-export * from './createTokens'
-export * from './createVariable'
-export * from './createVariables'
-export * from './insertFont'
-export * from './setupReactNative'
-export * from './styled'
-export * from './Tamagui'
+export { createFont } from './createFont'
+export { fluid, type FluidOptions } from './helpers/fluid'
+export {
+  createChangeEventDetails,
+  type TamaguiChangeEventDetails,
+  type TamaguiEventDetails,
+} from './eventDetails'
+export { createStyledHOC } from './createStyledHOC'
+export { createShorthands } from './createShorthands'
+export { createTamagui, installTamaguiConfig } from './createTamagui'
+export { createTokens } from './createTokens'
+export {
+  createVariable,
+  createCSSVariable,
+  getVariable,
+  getVariableValue,
+  isVariable,
+  px,
+  variableToString,
+} from './createVariable'
+export { insertFont, updateFont } from './insertFont'
+export { styled } from './styled'
+export { style } from './style'
+export { useStyle } from './hooks/useStyle'
+export { Tamagui } from './Tamagui'
 
 export type { TamaguiBuildOptions } from '@tamagui/types'
-export type * from './interfaces/RNExclusiveTypes'
-export type * from './interfaces/TamaguiComponentEvents'
-export type * from './types'
+export type { RNTextProps, RNViewProps } from './interfaces/RNExclusiveTypes'
+export type {
+  AllPlatforms,
+  AnimatedNumberStrategy,
+  AnimationDriver,
+  AnimationDriverStub,
+  AnimationDriverWithAnimatedNumbers,
+  AnimationsConfig,
+  BorderValue,
+  BoxShadowValue,
+  Color,
+  ColorScheme,
+  ColorTokens,
+  CreateTamaguiConfig,
+  CreateTamaguiProps,
+  DebugProp,
+  DisposeFn,
+  FillInFont,
+  FilterValue,
+  FlatStyleValue,
+  Font,
+  FontColorTokens,
+  FontFamilyTokens,
+  FontLanguages,
+  FontLetterSpacingTokens,
+  FontLineHeightTokens,
+  FontSize,
+  FontSizeTokens,
+  FontStyleTokens,
+  FontTokens,
+  FontTransformTokens,
+  FontWeightTokens,
+  Fonts,
+  GenericFont,
+  GenericStackVariants,
+  GenericTamaguiConfig,
+  GenericTextVariants,
+  GenericVariables,
+  GestureReponderEvent,
+  GetAnimationKeys,
+  GetBaseStyles,
+  GetFinalProps,
+  GetProps,
+  GetStyleResult,
+  GetThemeValueForKey,
+  GetVariantProps,
+  GroupNames,
+  InferTamaguiConfig,
+  InferStyleProps,
+  Insets,
+  LayoutEvent,
+  LoadedComponents,
+  Longhands,
+  MatchMedia,
+  Media,
+  MediaQueries,
+  MediaQueryKey,
+  MediaQueryList,
+  MediaQueryState,
+  MediaStyleObject,
+  Narrow,
+  OnTransition,
+  OutlineValue,
+  PresenceContextProps,
+  PresenceRegistration,
+  PxValue,
+  Radius,
+  RadiusTokens,
+  ReservedThemePropName,
+  ResolveVariableAs,
+  Role,
+  Shorthands,
+  Size,
+  SizeKeys,
+  GenericSizes,
+  SizeName,
+  SizeSpec,
+  SizeTokens,
+  Space,
+  SpaceTokens,
+  SpaceValue,
+  SplitStyleProps,
+  StackNonStyleProps,
+  StackStyleBase,
+  StaticConfig,
+  StaticComponentObject,
+  StaticConfigPublic,
+  StaticShapeStyle,
+  StyleObject,
+  StylePiece,
+  StyleProp,
+  StyledContext,
+  StyledContextOptions,
+  StyledHOCMergedProps,
+  TamaDefer,
+  TamaguiBaseTheme,
+  TamaguiComponent,
+  TamaguiComponentPropsBaseBase,
+  TamaguiComponentState,
+  TamaguiConfig,
+  TamaguiCustomConfig,
+  TamaguiElement,
+  TamaguiElementMethods,
+  TamaguiInternalConfig,
+  TamaguiProjectInfo,
+  TamaguiProviderProps,
+  TamaguiSettings,
+  TamaguiTextElement,
+  TamaguiWebElement,
+  TextNonStyleProps,
+  TextProps,
+  TextStyle,
+  TextStylePropsBase,
+  ThemeDefinition,
+  ThemeKeys,
+  ThemeName,
+  ThemeParsed,
+  ThemeProps,
+  ThemeProviderProps,
+  ThemeState,
+  ThemeTokens,
+  ThemeValueFallback,
+  Themes,
+  Token,
+  TokenCategories,
+  Tokens,
+  TokensParsed,
+  TransitionEvent,
+  TransitionKeys,
+  TransitionProp,
+  Try,
+  TypeOverride,
+  UnionableNumber,
+  UnionableString,
+  UniversalAnimatedNumber,
+  UseAnimatedNumber,
+  UseAnimatedNumberReaction,
+  UseAnimatedNumberStyle,
+  UseAnimatedNumbersStyle,
+  UseMediaState,
+  UsePresenceResult,
+  Variable,
+  VariableVal,
+  VariableValGeneric,
+  VariableValIn,
+  WidthHeight,
+  WithFlatVariantValues,
+  WithShorthands,
+  WithThemeValues,
+  ZIndex,
+  ZIndexTokens,
+} from './types'
+export { stylePieceSymbol } from './types'
 
-export * from './interfaces/GetRef'
+export type { GetRef } from './interfaces/GetRef'
+export {
+  createRefComponent,
+  type RefComponent,
+  type RefProp,
+  composeRefs,
+  setRef,
+  useComposedRefs,
+} from '@tamagui/compose-refs'
 
 export {
   getConfig,
@@ -70,11 +261,10 @@ export {
 
 export { setNonce } from './helpers/insertStyleRule'
 
-export * from './constants/constants'
-
-export * from './hooks/useIsTouchDevice'
+export { useIsTouchDevice } from './hooks/useIsTouchDevice'
 export {
   _disableMediaTouch,
+  _mediaListenerStats,
   configureMedia,
   mediaKeyMatch,
   updateMediaListeners,
@@ -87,25 +277,93 @@ export {
   mediaState,
   setMediaState,
 } from './helpers/mediaState'
-export * from './hooks/useProps'
-export * from './hooks/useTheme'
-export * from './hooks/useThemeName'
-export { forceUpdateThemes } from './hooks/useThemeState'
+export {
+  useAnimatedNumber,
+  useAnimatedNumberReaction,
+  useAnimatedNumberStyle,
+  useAnimatedNumbersStyle,
+  useAnimationDriver,
+} from './hooks/useAnimationDriver'
+export { useTheme } from './hooks/useTheme'
+export { usePortalThemeState } from './hooks/usePortalThemeState'
+export { useThemeName } from './hooks/useThemeName'
+export {
+  forceUpdateThemes,
+  getThemeProviderChainSizes,
+  resolveThemeName,
+} from './hooks/useThemeState'
 
-export * from './views/Configuration'
-export * from './views/TamaguiRoot'
-export * from './views/FontLanguage'
-export * from './views/Slot'
-export * from './views/TamaguiProvider'
-export * from './views/Text'
-export * from './views/Theme'
-export * from './views/ThemeProvider'
-export * from './views/View'
+export { html } from './dom/html'
+export { Configuration } from './views/Configuration'
+export { TamaguiRoot } from './views/TamaguiRoot'
+export { FontLanguage } from './views/FontLanguage'
+export { Slot, Slottable } from './views/Slot'
+export { TamaguiProvider } from './views/TamaguiProvider'
+export { Text, textStaticConfig } from './views/Text'
+export { Theme } from './views/Theme'
+export { ThemeProvider } from './views/ThemeProvider'
+export { View, viewStaticConfig, type ViewProps, type ViewStyle } from './views/View'
 
-export * from '@tamagui/compose-refs'
-export * from '@tamagui/constants'
-export * from '@tamagui/helpers'
-export * from '@tamagui/use-did-finish-ssr'
-export * from '@tamagui/use-event'
+export {
+  currentPlatform,
+  getPlatformDriver,
+  isAndroid,
+  isBrowser,
+  isChrome,
+  isClient,
+  isIos,
+  isNativeDesktop,
+  isServer,
+  isTV,
+  isTouchable,
+  isWeb,
+  isWebTouchable,
+  setupPlatformDriver,
+  supportsDynamicColorIOS,
+  useIsomorphicLayoutEffect,
+  type PlatformDriver,
+  type PlatformDriverPseudoState,
+} from '@tamagui/constants'
+export {
+  clamp,
+  composeEventHandlers,
+  cssShorthandLonghands,
+  getThemeClassNames,
+  nonAnimatableStyleProps,
+  nonAnimatableWebTextProps,
+  nonAnimatableWebViewProps,
+  reservedThemeProps,
+  shouldRenderNativePlatform,
+  simpleHash,
+  StyleObjectIdentifier,
+  StyleObjectProperty,
+  StyleObjectPseudo,
+  StyleObjectRules,
+  StyleObjectValue,
+  stylePropsAll,
+  stylePropsInput,
+  stylePropsText,
+  stylePropsTextOnly,
+  stylePropsTransform,
+  stylePropsUnitless,
+  stylePropsView,
+  tokenCategories,
+  validStyles,
+  webOnlyStylePropsText,
+  webOnlyStylePropsView,
+  withStaticProperties,
+  type EventHandler,
+  type ExplicitNativePlatform,
+  type NativePlatform,
+  type NativeValue,
+} from '@tamagui/helpers'
+export {
+  ClientOnly,
+  ClientOnlyContext,
+  useClientValue,
+  useDidFinishSSR,
+  useIsClientOnly,
+} from '@tamagui/use-did-finish-ssr'
+export { useEvent, useGet } from '@tamagui/use-event'
 
-export * from './setupHooks'
+export { hooks, setupHooks } from './setupHooks'

package/src/insertFont.ts

@@ -16,7 +16,11 @@ export function insertFont<A extends GenericFont>(
   const font = createFont(fontIn)
   const tokened = createVariables(font, name) as GenericFont
   const parsed = parseFont(tokened) as DeepVariableObject<A>
-  if (process.env.TAMAGUI_TARGET === 'web' && typeof document !== 'undefined') {
+  if (
+    !process.env.TAMAGUI_DID_OUTPUT_CSS &&
+    process.env.TAMAGUI_TARGET === 'web' &&
+    typeof document !== 'undefined'
+  ) {
     const fontVars = registerFontVariables(parsed)
     const styleElement: HTMLStyleElement =
       document.querySelector(`style[${FONT_DATA_ATTRIBUTE_NAME}="${name}"]`) ||
@@ -41,11 +45,11 @@ export function parseFont<A extends GenericFont>(definition: A): DeepVariableObj
       parsed[attrKey] = {}
       for (const key in attr) {
         let val = attr[key] as any
-        // is a theme reference
-        if (val.val?.[0] === '$') {
+        // Font color names resolve against the active theme at use time.
+        if (attrKey === 'color' && typeof val.val === 'string') {
           val = val.val
         }
-        parsed[attrKey][`$${key}`] = val
+        parsed[attrKey][key] = val
       }
     }
   }
@@ -66,7 +70,7 @@ export function registerFontVariables(parsedFont: any) {
         for (const fskey in parsedFont[fkey]) {
           const fval = parsedFont[fkey][fskey]
           if (typeof fval === 'string') {
-            // no need to add its a theme reference like "$borderColor"
+            // theme references do not register font variables
           } else {
             const val = parsedFont[fkey][fskey] as Variable
             registerCSSVariable(val)