@tamagui/core 1.0.0-beta.3 → 1.0.0-beta.6

package/README.md

@@ -0,0 +1 @@
+## core

package/dist/cjs/createComponent.js

@@ -76,6 +76,7 @@ var import_useFeatures = require("./hooks/useFeatures");
 var import_useIsTouchDevice = require("./hooks/useIsTouchDevice");
 var import_usePressable = require("./hooks/usePressable");
 var import_useTheme = require("./hooks/useTheme");
+var import_Slot = require("./views/Slot");
 var import_TextAncestorContext = require("./views/TextAncestorContext");
 import_react.default["keep"];
 const defaultComponentState = {
@@ -140,7 +141,7 @@ function createComponent(configIn, ParentComponent) {
   __name(addPseudoToStyles, "addPseudoToStyles");
   const component = (0, import_react.forwardRef)((props, forwardedRef) => {
     var _a, _c, _d, _e;
-    props = tamaguiDefaultProps ? __spreadValues(__spreadValues({}, tamaguiDefaultProps), props) : props;
+    props = tamaguiDefaultProps && !props.asChild ? __spreadValues(__spreadValues({}, tamaguiDefaultProps), props) : props;
     const { Component, componentName, isText, isZStack } = staticConfig;
     if (process.env.NODE_ENV === "development") {
       if (props["debug"]) {
@@ -155,7 +156,7 @@ function createComponent(configIn, ParentComponent) {
     const [state, set_] = (0, import_react.useState)(defaultComponentState);
     const setStateShallow = (0, import_createShallowUpdate.createShallowUpdate)(set_);
     const shouldAvoidClasses = !!(props.animation && avoidClasses);
-    const splitStyles = (0, import_getSplitStyles.useSplitStyles)(props, staticConfig, theme, shouldAvoidClasses ? __spreadProps(__spreadValues({}, state), { noClassNames: true, resolveVariablesAs: "value" }) : state, shouldAvoidClasses ? null : initialSplitStyles.classNames);
+    const splitStyles = (0, import_getSplitStyles.useSplitStyles)(props, staticConfig, theme, shouldAvoidClasses ? __spreadProps(__spreadValues({}, state), { noClassNames: true, resolveVariablesAs: "value" }) : state, shouldAvoidClasses || props.asChild ? null : initialSplitStyles.classNames);
     const { viewProps: viewPropsIn, pseudos, medias, style, classNames } = splitStyles;
     const useAnimations = (_a = tamaguiConfig.animations) == null ? void 0 : _a.useAnimations;
     const isAnimated = !!(useAnimations && props.animation);
@@ -174,6 +175,7 @@ function createComponent(configIn, ParentComponent) {
     const _b = viewPropsIn, {
       tag,
       hitSlop,
+      asChild,
       children,
       pointerEvents,
       onPress,
@@ -215,6 +217,7 @@ function createComponent(configIn, ParentComponent) {
     } = _b, viewPropsRest = __objRest(_b, [
       "tag",
       "hitSlop",
+      "asChild",
       "children",
       "pointerEvents",
       "onPress",
@@ -297,7 +300,7 @@ function createComponent(configIn, ParentComponent) {
       if (accessibilityRole)
         viewProps.accessibilityRole = accessibilityRole;
     }
-    if (import_platform.isWeb) {
+    if (import_platform.isWeb && !asChild) {
       import_rnw.rnw.useResponderEvents(hostRef, {
         onMoveShouldSetResponder,
         onMoveShouldSetResponderCapture,
@@ -401,7 +404,7 @@ function createComponent(configIn, ParentComponent) {
     const isHoverable = import_platform.isWeb && !isTouch;
     const attachHover = isHoverable && !!(pseudos && pseudos.hoverStyle || onHoverIn || onHoverOut || onMouseEnter || onMouseLeave);
     const pressEventKey = isStringElement ? "onClick" : "onPress";
-    const shouldAttach = attachPress || attachHover || "pressStyle" in props || "onPress" in props || "onPressIn" in props || "onPressOut" in props || import_platform.isWeb && ("hoverStyle" in props || "onHoverIn" in props || "onHoverOut" in props || "onMouseEnter" in props || "onMouseLeave" in props);
+    const shouldAttach = !asChild && (attachPress || attachHover || "pressStyle" in props || "onPress" in props || "onPressIn" in props || "onPressOut" in props || import_platform.isWeb && ("hoverStyle" in props || "onHoverIn" in props || "onHoverOut" in props || "onMouseEnter" in props || "onMouseLeave" in props));
     const unPress = (0, import_react.useCallback)(() => {
       if (!internal.current.isMounted)
         return;
@@ -465,7 +468,7 @@ function createComponent(configIn, ParentComponent) {
         onPressOut == null ? void 0 : onPressOut(e);
       } : null
     }) : null;
-    let childEls = !children ? children : (0, import_wrapThemeManagerContext.wrapThemeManagerContext)(spacedChildren({
+    const childEls = !children || asChild ? children : (0, import_wrapThemeManagerContext.wrapThemeManagerContext)(spacedChildren({
       children,
       space,
       flexDirection: props.flexDirection || ((_c = staticConfig.defaultProps) == null ? void 0 : _c.flexDirection),
@@ -504,6 +507,11 @@ function createComponent(configIn, ParentComponent) {
         Object.assign(viewProps, events);
       }
     }
+    if (asChild) {
+      ViewComponent = import_Slot.Slot;
+      const onlyChild = import_react.default.Children.only(children);
+      Object.assign(viewProps, onlyChild.props);
+    }
     content = (0, import_react.createElement)(ViewComponent, viewProps, childEls);
     if (import_platform.isWeb && events && attachHover) {
       content = /* @__PURE__ */ import_react.default.createElement("span", {

package/dist/cjs/createComponent.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/createComponent.tsx"],
-  "sourcesContent": ["import { stylePropsView } from '@tamagui/helpers'\nimport { useForceUpdate } from '@tamagui/use-force-update'\nimport React, {\n  Children,\n  Fragment,\n  createElement,\n  forwardRef,\n  memo,\n  useCallback,\n  useContext,\n  useRef,\n  useState,\n} from 'react'\nimport { StyleSheet, Text, View, ViewStyle } from 'react-native'\n\nimport { onConfiguredOnce } from './conf'\nimport { stackDefaultStyles } from './constants/constants'\nimport { isAndroid, isWeb, useIsomorphicLayoutEffect } from './constants/platform'\nimport { rnw } from './constants/rnw'\nimport { isVariable } from './createVariable'\nimport { createShallowUpdate } from './helpers/createShallowUpdate'\nimport { extendStaticConfig, parseStaticConfig } from './helpers/extendStaticConfig'\nimport { SplitStyleResult, insertSplitStyles, useSplitStyles } from './helpers/getSplitStyles'\nimport { getAllSelectors } from './helpers/insertStyleRule'\nimport { proxyThemeVariables } from './helpers/proxyThemeVariables'\nimport { wrapThemeManagerContext } from './helpers/wrapThemeManagerContext'\nimport { useFeatures } from './hooks/useFeatures'\nimport { useIsTouchDevice } from './hooks/useIsTouchDevice'\nimport { usePressable } from './hooks/usePressable'\nimport { getThemeManagerIfChanged, useTheme } from './hooks/useTheme'\nimport {\n  SpaceTokens,\n  StackProps,\n  StaticConfig,\n  StaticConfigParsed,\n  StylableComponent,\n  TamaguiComponent,\n  TamaguiComponentState,\n  TamaguiConfig,\n  TamaguiInternalConfig,\n  UseAnimationHook,\n} from './types'\nimport { TextAncestorContext } from './views/TextAncestorContext'\n\nReact['keep']\n\nconst defaultComponentState: TamaguiComponentState = {\n  hover: false,\n  press: false,\n  pressIn: false,\n  focus: false,\n  // only used by enterStyle\n  mounted: false,\n  animation: null,\n}\n\nexport const mouseUps = new Set<Function>()\nif (typeof document !== 'undefined') {\n  document.addEventListener('mouseup', () => {\n    mouseUps.forEach((x) => x())\n    mouseUps.clear()\n  })\n  document.addEventListener('touchend', () => {\n    mouseUps.forEach((x) => x())\n    mouseUps.clear()\n  })\n  document.addEventListener('touchcancel', () => {\n    mouseUps.forEach((x) => x())\n    mouseUps.clear()\n  })\n}\n\n// mutates\nfunction mergeShorthands({ defaultProps }: StaticConfigParsed, { shorthands }: TamaguiConfig) {\n  // they are defined in correct order already { ...parent, ...child }\n  for (const key in defaultProps) {\n    defaultProps[shorthands[key] || key] = defaultProps[key]\n  }\n}\n\nlet initialTheme: any\n\nexport function createComponent<\n  ComponentPropTypes extends Object = {},\n  Ref = View,\n  BaseProps = never\n>(configIn: Partial<StaticConfig> | StaticConfigParsed, ParentComponent?: StylableComponent) {\n  const staticConfig = (() => {\n    const config = extendStaticConfig(configIn, ParentComponent)\n    if ('parsed' in config) {\n      return config\n    } else {\n      return parseStaticConfig(config)\n    }\n  })()\n\n  const componentClassName = `is_${staticConfig.componentName}`\n  let tamaguiConfig: TamaguiInternalConfig\n  let AnimatedText: any\n  let AnimatedView: any\n  let avoidClasses = true\n  let defaultNativeStyle: any\n  let defaultNativeStyleSheet: StyleSheet.NamedStyles<{ base: {} }>\n  let tamaguiDefaultProps: any\n  let initialSplitStyles: SplitStyleResult\n\n  function addPseudoToStyles(styles: any[], name: string, pseudos: any) {\n    // on web use pseudo object { hoverStyle } to keep specificity with concatClassName\n    const pseudoStyle = pseudos[name]\n    const shouldNestObject = isWeb && name !== 'enterStyle' && name !== 'exitStyle'\n    if (pseudoStyle) {\n      styles.push(shouldNestObject ? { [name]: pseudoStyle } : pseudoStyle)\n    }\n    const defaultPseudoStyle = initialSplitStyles.pseudos[name]\n    if (defaultPseudoStyle) {\n      styles.push(shouldNestObject ? { [name]: defaultPseudoStyle } : defaultPseudoStyle)\n    }\n  }\n\n  // see onConfiguredOnce below which attaches a name then to this component\n  const component = forwardRef<Ref, ComponentPropTypes>((props: any, forwardedRef) => {\n    // ridiculous fix because react inserts default props after your props for some reason...\n    props = tamaguiDefaultProps ? { ...tamaguiDefaultProps, ...props } : props\n\n    const { Component, componentName, isText, isZStack } = staticConfig\n\n    if (process.env.NODE_ENV === 'development') {\n      if (props['debug']) {\n        // prettier-ignore\n        console.warn(staticConfig.componentName || Component?.displayName || Component?.name || '[Unnamed Component]', 'debug on')\n        // keep separate react native warn touches every value on prop causing weird behavior\n        console.log('props in:', props, Object.keys(props))\n        if (props['debug'] === 'break') debugger\n      }\n    }\n\n    const forceUpdate = useForceUpdate()\n    const theme = useTheme(props.theme, staticConfig.componentName, props, forceUpdate)\n    const [state, set_] = useState<TamaguiComponentState>(defaultComponentState)\n    const setStateShallow = createShallowUpdate(set_)\n\n    const shouldAvoidClasses = !!(props.animation && avoidClasses)\n    const splitStyles = useSplitStyles(\n      props,\n      staticConfig,\n      theme,\n      shouldAvoidClasses ? { ...state, noClassNames: true, resolveVariablesAs: 'value' } : state,\n      shouldAvoidClasses ? null : initialSplitStyles.classNames\n    )\n\n    const { viewProps: viewPropsIn, pseudos, medias, style, classNames } = splitStyles\n    const useAnimations = tamaguiConfig.animations?.useAnimations as UseAnimationHook | undefined\n    const isAnimated = !!(useAnimations && props.animation)\n    const hasEnterStyle = !!props.enterStyle\n\n    const features = useFeatures(props, {\n      forceUpdate,\n      setStateShallow,\n      useAnimations,\n      state,\n      style: props.animation ? { ...defaultNativeStyle, ...style } : null,\n      pseudos,\n      staticConfig,\n      theme,\n      onDidAnimate: props.onDidAnimate,\n    })\n\n    const {\n      tag,\n      hitSlop,\n      children,\n      pointerEvents,\n      onPress,\n      onPressIn,\n      onPressOut,\n      onHoverIn,\n      onHoverOut,\n      space,\n      disabled,\n      onMouseEnter,\n      onMouseLeave,\n      hrefAttrs,\n      onMoveShouldSetResponder,\n      onMoveShouldSetResponderCapture,\n      onResponderEnd,\n      onResponderGrant,\n      onResponderMove,\n      onResponderReject,\n      onResponderRelease,\n      onResponderStart,\n      onResponderTerminate,\n      onResponderTerminationRequest,\n      onScrollShouldSetResponder,\n      onScrollShouldSetResponderCapture,\n      onSelectionChangeShouldSetResponder,\n      onSelectionChangeShouldSetResponderCapture,\n      onStartShouldSetResponder,\n      onStartShouldSetResponderCapture,\n      onMouseDown,\n      nativeID,\n\n      accessible,\n      accessibilityRole,\n\n      // android\n      collapsable,\n      focusable,\n\n      // ignore from here on out\n      // for next/link compat etc\n      // @ts-ignore\n      onClick,\n      theme: _themeProp,\n      // @ts-ignore\n      defaultVariants,\n\n      // TODO feature load layout hook\n      onLayout,\n      ...viewPropsRest\n    } = viewPropsIn\n\n    let viewProps: StackProps = viewPropsRest\n\n    // from react-native-web\n    if (process.env.NODE_ENV === 'development' && !isText && isWeb) {\n      Children.toArray(props.children).forEach((item) => {\n        if (typeof item === 'string') {\n          console.error(`Unexpected text node: ${item}. A text node cannot be a child of a <View>.`)\n        }\n      })\n    }\n\n    const hasTextAncestor = isWeb ? useContext(TextAncestorContext) : false\n    const hostRef = useRef(null)\n\n    // isMounted\n    const internal = useRef<{ isMounted: boolean }>()\n    if (!internal.current) {\n      internal.current = {\n        isMounted: true,\n      }\n    }\n\n    useIsomorphicLayoutEffect(() => {\n      // we need to use state to properly have mounted go from false => true\n      if (typeof window !== 'undefined' && (hasEnterStyle || props.animation)) {\n        // for SSR we never set mounted, ensuring enterStyle={{}} is set by default\n        setStateShallow({\n          mounted: true,\n        })\n      }\n\n      internal.current!.isMounted = true\n      return () => {\n        mouseUps.delete(unPress)\n        internal.current!.isMounted = false\n      }\n    }, [hasEnterStyle, props.animation])\n\n    if (nativeID) {\n      viewProps.id = nativeID\n    }\n\n    if (isAndroid) {\n      if (collapsable) viewProps.collapsable = collapsable\n      if (focusable) viewProps.focusable = focusable\n    }\n\n    if (!isWeb) {\n      if (accessible) viewProps.accessible = accessible\n      if (accessibilityRole) viewProps.accessibilityRole = accessibilityRole\n    }\n\n    if (isWeb) {\n      // from react-native-web\n      rnw.useResponderEvents(hostRef, {\n        onMoveShouldSetResponder,\n        onMoveShouldSetResponderCapture,\n        onResponderEnd,\n        onResponderGrant,\n        onResponderMove,\n        onResponderReject,\n        onResponderRelease,\n        onResponderStart,\n        onResponderTerminate,\n        onResponderTerminationRequest,\n        onScrollShouldSetResponder,\n        onScrollShouldSetResponderCapture,\n        onSelectionChangeShouldSetResponder,\n        onSelectionChangeShouldSetResponderCapture,\n        onStartShouldSetResponder,\n        onStartShouldSetResponderCapture,\n      })\n    }\n\n    // get the right component\n    const isTaggable = !Component || typeof Component === 'string'\n\n    // default to tag, fallback to component (when both strings)\n    const element = isWeb ? (isTaggable ? tag || Component : Component) : Component\n    const BaseTextComponent = !isWeb ? Text : element || 'span'\n    const BaseViewComponent = !isWeb ? View : element || (hasTextAncestor ? 'span' : 'div')\n    let ViewComponent = isText\n      ? (isAnimated ? AnimatedText || Text : null) || BaseTextComponent\n      : (isAnimated ? AnimatedView || View : null) || BaseViewComponent\n\n    ViewComponent = Component || ViewComponent\n\n    let styles: any[]\n\n    const isStringElement = typeof ViewComponent === 'string'\n    const animationStyles = state.animation ? state.animation.style : null\n\n    if (isStringElement && shouldAvoidClasses) {\n      styles = {\n        ...defaultNativeStyle,\n        ...animationStyles,\n        ...medias,\n      }\n    } else {\n      styles = [\n        isWeb ? null : defaultNativeStyleSheet ? (defaultNativeStyleSheet.base as ViewStyle) : null,\n        // parity w react-native-web, only for text in text\n        // TODO this should be able to be done w css to replicate after extraction:\n        //  (.text .text { display: inline-flex; }) (but if they set display we'd need stronger precendence)\n        // isText && hasTextAncestor && isWeb ? { display: 'inline-flex' } : null,\n        // style,\n        animationStyles ? animationStyles : style,\n        medias,\n      ]\n      if (!animationStyles) {\n        !state.mounted && addPseudoToStyles(styles, 'enterStyle', pseudos)\n        state.hover && addPseudoToStyles(styles, 'hoverStyle', pseudos)\n        state.focus && addPseudoToStyles(styles, 'focusStyle', pseudos)\n        state.press && addPseudoToStyles(styles, 'pressStyle', pseudos)\n      }\n    }\n\n    if (isWeb) {\n      if (!shouldAvoidClasses) {\n        const fontFamilyName = isText\n          ? props.fontFamily || staticConfig.defaultProps.fontFamily\n          : null\n        const fontFamily =\n          fontFamilyName && fontFamilyName[0] === '$' ? fontFamilyName.slice(1) : null\n        const classList = [\n          componentName ? componentClassName : '',\n          fontFamily ? `font_${fontFamily}` : '',\n          theme.className,\n          classNames ? Object.values(classNames).join(' ') : '',\n        ]\n\n        // TODO restore this to isText classList\n        // hasTextAncestor === true && cssText.textHasAncestor,\n        // TODO MOVE TO VARIANTS [number] [any]\n        // numberOfLines != null && numberOfLines > 1 && cssText.textMultiLine,\n\n        const className = classList.join(' ')\n        if (process.env.NODE_ENV === 'development') {\n          if (props['debug']) {\n            // prettier-ignore\n            console.log('  \u00BB className', { isStringElement, pseudos, state, classNames, propsClassName: props.className, style, classList, className: className.trim().split(' '), themeClassName: theme.className, values: Object.fromEntries(Object.entries(classNames).map(([k, v]) => [v, getAllSelectors()[v]])) })\n          }\n        }\n        viewProps.className = className\n        viewProps.style = animationStyles\n      } else {\n        viewProps.style = styles\n      }\n    } else {\n      viewProps.style = styles\n    }\n\n    if (pointerEvents) {\n      viewProps.pointerEvents = pointerEvents\n    }\n\n    if (isWeb) {\n      // from react-native-web\n      const platformMethodsRef = rnw.usePlatformMethods(viewProps)\n      const setRef = rnw.useMergeRefs(hostRef, platformMethodsRef, forwardedRef)\n\n      if (!isAnimated) {\n        // @ts-ignore\n        viewProps.ref = setRef\n      } else {\n        if (forwardedRef) {\n          // @ts-ignore\n          viewProps.ref = forwardedRef\n        }\n      }\n\n      if (props.href != null && hrefAttrs != null) {\n        const { download, rel, target } = hrefAttrs\n        if (download != null) {\n          viewProps.download = download\n        }\n        if (rel != null) {\n          viewProps.rel = rel\n        }\n        if (typeof target === 'string') {\n          viewProps.target = target.charAt(0) !== '_' ? '_' + target : target\n        }\n      }\n    } else {\n      if (forwardedRef) {\n        // @ts-ignore\n        viewProps.ref = forwardedRef\n      }\n    }\n\n    // TODO need to loop active variants and see if they have matchin pseudos and apply as well\n    const initialPseudos = initialSplitStyles.pseudos\n    const attachPress = !!(\n      (pseudos && pseudos.pressStyle) ||\n      (initialPseudos && initialPseudos.pressStyle) ||\n      onPress ||\n      onPressOut ||\n      onPressIn ||\n      onClick\n    )\n\n    const isTouch = useIsTouchDevice()\n    const isHoverable = isWeb && !isTouch\n    const attachHover =\n      isHoverable &&\n      !!((pseudos && pseudos.hoverStyle) || onHoverIn || onHoverOut || onMouseEnter || onMouseLeave)\n    const pressEventKey = isStringElement ? 'onClick' : 'onPress'\n\n    // check presence to prevent reparenting bugs, allows for onPress={x ? function : undefined} usage\n    // while avoiding reparenting...\n    // once proper reparenting is supported, we can remove this and use that...\n    const shouldAttach =\n      attachPress ||\n      attachHover ||\n      'pressStyle' in props ||\n      'onPress' in props ||\n      'onPressIn' in props ||\n      'onPressOut' in props ||\n      (isWeb &&\n        ('hoverStyle' in props ||\n          'onHoverIn' in props ||\n          'onHoverOut' in props ||\n          'onMouseEnter' in props ||\n          'onMouseLeave' in props))\n\n    const unPress = useCallback(() => {\n      if (!internal.current!.isMounted) return\n      setStateShallow({\n        press: false,\n        pressIn: false,\n      })\n    }, [])\n\n    const events = shouldAttach\n      ? {\n          ...(!isWeb && {\n            // non web\n            onPressOut: (e) => {\n              unPress()\n              onPressOut?.(e)\n            },\n          }),\n          ...(isHoverable && {\n            onMouseEnter: attachHover\n              ? (e) => {\n                  let next: Partial<typeof state> = {}\n                  if (attachHover) {\n                    next.hover = true\n                  }\n                  if (state.pressIn) {\n                    next.press = true\n                  }\n                  if (Object.keys(next).length) {\n                    setStateShallow(next)\n                  }\n                  onHoverIn?.(e)\n                  onMouseEnter?.(e)\n                }\n              : undefined,\n            onMouseLeave: attachHover\n              ? (e) => {\n                  let next: Partial<typeof state> = {}\n                  mouseUps.add(unPress)\n                  if (attachHover) {\n                    next.hover = false\n                  }\n                  if (state.pressIn) {\n                    next.press = false\n                    next.pressIn = false\n                  }\n                  if (Object.keys(next).length) {\n                    setStateShallow(next)\n                  }\n                  onHoverOut?.(e)\n                  onMouseLeave?.(e)\n                }\n              : undefined,\n          }),\n          onMouseDown: attachPress\n            ? (e) => {\n                setStateShallow({\n                  press: true,\n                  pressIn: true,\n                })\n                onPressIn?.(e)\n                onMouseDown?.(e)\n                if (isWeb) {\n                  mouseUps.add(unPress)\n                }\n              }\n            : null,\n          [pressEventKey]: attachPress\n            ? (e) => {\n                onClick?.(e)\n                onPress?.(e)\n                unPress()\n                onPressOut?.(e)\n              }\n            : null,\n        }\n      : null\n\n    let childEls = !children\n      ? children\n      : wrapThemeManagerContext(\n          spacedChildren({\n            children,\n            space,\n            flexDirection: props.flexDirection || staticConfig.defaultProps?.flexDirection,\n            isZStack,\n          }),\n          getThemeManagerIfChanged(theme)\n        )\n\n    // TODO once we do the above we can then rely entirely on pressStyle returned here isntead of above pressStyle logic\n    const [pressProps] = usePressable(\n      events\n        ? {\n            disabled,\n            ...(hitSlop && {\n              hitSlop,\n            }),\n            onPressIn: events.onMouseDown,\n            onPressOut: events.onPressOut,\n            onPress: events[pressEventKey],\n          }\n        : {\n            disabled: true,\n          }\n    )\n\n    let content: any\n\n    // replicate react-native-web's `createElement`\n    if (isWeb) {\n      if (staticConfig.isReactNativeWeb) {\n        viewProps.dataSet = {\n          ...viewProps.dataSet,\n          className: viewProps.className,\n        }\n      } else {\n        const rnProps = rnw.createDOMProps(viewProps)\n        const className =\n          rnProps.className && rnProps.className !== viewProps.className\n            ? `${rnProps.className} ${viewProps.className}`\n            : viewProps.className\n\n        // additive\n        Object.assign(viewProps, rnProps)\n\n        // we already handle Text/View properly\n        if (className) {\n          viewProps.className = className\n        }\n      }\n    }\n\n    if (events) {\n      if (!isStringElement) {\n        Object.assign(viewProps, pressProps)\n      } else {\n        Object.assign(viewProps, events)\n      }\n    }\n\n    content = createElement(ViewComponent, viewProps, childEls)\n\n    if (isWeb && events && attachHover) {\n      content = (\n        <span\n          className=\"tui_Hoverable\"\n          style={{\n            display: 'contents',\n          }}\n          onMouseEnter={events.onMouseEnter}\n          onMouseLeave={events.onMouseLeave}\n        >\n          {content}\n        </span>\n      )\n    }\n\n    if (process.env.NODE_ENV === 'development') {\n      if (props['debug']) {\n        viewProps['debug'] = true\n        // prettier-ignore\n        console.log('  \u00BB ', { propsIn: { ...props }, propsOut: { ...viewProps }, state, splitStyles, animationStyles, isStringElement, classNamesIn: props.className?.split(' '), classNamesOut: viewProps.className?.split(' '), pressProps, events, shouldAttach, ViewComponent, viewProps, styles, pseudos, content, childEls, shouldAvoidClasses, avoidClasses, animation: props.animation, style, defaultNativeStyle, initialSplitStyles, ...(typeof window !== 'undefined' ? { theme, themeState: theme.__state, themeClassName:  theme.className, staticConfig, tamaguiConfig } : null) })\n      }\n    }\n\n    if (features.length) {\n      return (\n        <>\n          {features}\n          {content}\n        </>\n      )\n    }\n\n    return content\n  })\n\n  component.displayName = staticConfig.componentName\n\n  // Once configuration is run and all components are registered\n  // get default props + className and analyze styles\n  onConfiguredOnce((conf) => {\n    if (process.env.IS_STATIC === 'is_static') {\n      // in static mode we just use these to lookup configuration\n      return\n    }\n\n    tamaguiConfig = conf\n\n    // do this to make sure shorthands don't duplicate with.. longhands\n    mergeShorthands(staticConfig, tamaguiConfig)\n\n    avoidClasses = !!tamaguiConfig.animations?.avoidClasses\n    AnimatedText = tamaguiConfig.animations?.Text\n    AnimatedView = tamaguiConfig?.animations?.View\n    initialTheme =\n      initialTheme ||\n      proxyThemeVariables(conf.themes[conf.defaultTheme || Object.keys(conf.themes)[0]])\n    initialSplitStyles = insertSplitStyles(staticConfig.defaultProps, staticConfig, initialTheme, {\n      mounted: true,\n      hover: false,\n      press: false,\n      pressIn: false,\n      focus: false,\n      resolveVariablesAs: 'both',\n      keepVariantsAsProps: true,\n    })\n\n    const { style, viewProps } = initialSplitStyles\n    defaultNativeStyle = {}\n    for (const key in style) {\n      const v = style[key]\n      defaultNativeStyle[key] = isVariable(v) ? v.val : v\n    }\n    defaultNativeStyleSheet = StyleSheet.create({\n      base: defaultNativeStyle,\n    })\n\n    // @ts-ignore\n    // this ruins the prop order!!!\n    // can't believe it but it puts default props after props?\n    const defaults = {\n      ...viewProps,\n      ...component.defaultProps,\n    }\n    if (Object.keys(defaults).length) {\n      tamaguiDefaultProps = defaults\n    }\n    // component.defaultProps = {\n    //   ...viewProps,\n    //   ...component.defaultProps,\n    // }\n\n    // add debug logs\n    if (process.env.NODE_ENV === 'development' && staticConfig.defaultProps?.debug) {\n      if (process.env.IS_STATIC !== 'is_static') {\n        console.log(`\uD83D\uDC1B [${staticConfig.componentName || 'Component'}]`, {\n          staticConfig,\n          initialSplitStyles,\n        })\n      }\n    }\n  })\n\n  let res: TamaguiComponent<ComponentPropTypes, Ref, BaseProps> = component as any\n\n  if (configIn.memo) {\n    res = memo(res) as any\n  }\n\n  res['staticConfig'] = {\n    validStyles: staticConfig.validStyles || stylePropsView,\n    ...staticConfig,\n  }\n\n  if (process.env.NODE_ENV === 'development') {\n    res['whyDidYouRender'] = true\n  }\n\n  // res.extractable HoC\n  res['extractable'] = (Component: any, conf?: Partial<StaticConfig>) => {\n    Component['staticConfig'] = extendStaticConfig(\n      {\n        Component,\n        ...conf,\n        neverFlatten: true,\n        defaultProps: {\n          ...Component.defaultProps,\n          ...conf?.defaultProps,\n        },\n      },\n      res\n    )\n    return Component\n  }\n\n  return res\n}\n\n// dont used styled() here to avoid circular deps\n// keep inline to avoid circular deps\n\nexport const Spacer = createComponent<\n  Omit<StackProps, 'flex' | 'direction'> & {\n    size?: number | SpaceTokens\n    flex?: boolean | number\n    direction?: 'horizontal' | 'vertical'\n  }\n>({\n  memo: true,\n  componentName: 'Spacer',\n  defaultProps: {\n    ...stackDefaultStyles,\n    size: true,\n  },\n  variants: {\n    size: {\n      '...size': (size, { tokens }) => {\n        size = size == true ? '$true' : size\n        const sizePx = tokens.size[size] ?? size\n        return {\n          width: sizePx,\n          height: sizePx,\n          minWidth: sizePx,\n          minHeight: sizePx,\n        }\n      },\n    },\n\n    flex: {\n      true: {\n        flex: 1,\n      },\n    },\n\n    direction: {\n      horizontal: {\n        height: 0,\n        minHeight: 0,\n      },\n      vertical: {\n        width: 0,\n        minWidth: 0,\n      },\n    },\n  },\n})\n\nexport function spacedChildren({\n  isZStack,\n  children,\n  space,\n  flexDirection,\n  spaceFlex,\n}: {\n  isZStack?: boolean\n  children: any\n  space?: any\n  spaceFlex?: boolean | number\n  flexDirection?: ViewStyle['flexDirection']\n}) {\n  const childrenList = Children.toArray(children)\n  const len = childrenList.length\n  if (len === 1) {\n    return childrenList\n  }\n  const next: any[] = []\n  for (const [index, child] of childrenList.entries()) {\n    if (child === null || child === undefined) {\n      continue\n    }\n\n    if (!child || (child['key'] && !isZStack)) {\n      next.push(child)\n    } else {\n      next.push(\n        <Fragment key={index}>{isZStack ? <AbsoluteFill>{child}</AbsoluteFill> : child}</Fragment>\n      )\n    }\n\n    // allows for custom visually hidden components that dont insert spacing\n    if (child['type']?.['isVisuallyHidden']) {\n      continue\n    }\n\n    if (index !== len - 1) {\n      if (space) {\n        next.push(\n          <Spacer\n            key={`_${index}_spacer`}\n            direction={\n              flexDirection === 'row' || flexDirection === 'row-reverse' ? 'horizontal' : 'vertical'\n            }\n            size={space}\n            {...(spaceFlex && {\n              flex: spaceFlex,\n            })}\n          />\n        )\n      }\n    }\n  }\n  return next\n}\n\nexport function AbsoluteFill(props: any) {\n  return isWeb ? (\n    <div\n      style={\n        {\n          position: 'absolute',\n          top: 0,\n          left: 0,\n          right: 0,\n          bottom: 0,\n        } as any\n      }\n    >\n      {props.children}\n    </div>\n  ) : (\n    <View style={StyleSheet.absoluteFill}>{props.child}</View>\n  )\n}\n\n// this can be done with CSS entirely right?\n// const shouldWrapTextAncestor = isWeb && isText && !hasTextAncestor\n// if (shouldWrapTextAncestor) {\n//   // from react-native-web\n//   content = createElement(TextAncestorContext.Provider, { value: true }, content)\n// }\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { stylePropsView } from '@tamagui/helpers'\nimport { useForceUpdate } from '@tamagui/use-force-update'\nimport React, {\n  Children,\n  Fragment,\n  createElement,\n  forwardRef,\n  memo,\n  useCallback,\n  useContext,\n  useRef,\n  useState,\n} from 'react'\nimport { StyleSheet, Text, View, ViewStyle } from 'react-native'\n\nimport { onConfiguredOnce } from './conf'\nimport { stackDefaultStyles } from './constants/constants'\nimport { isAndroid, isWeb, useIsomorphicLayoutEffect } from './constants/platform'\nimport { rnw } from './constants/rnw'\nimport { isVariable } from './createVariable'\nimport { createShallowUpdate } from './helpers/createShallowUpdate'\nimport { extendStaticConfig, parseStaticConfig } from './helpers/extendStaticConfig'\nimport { SplitStyleResult, insertSplitStyles, useSplitStyles } from './helpers/getSplitStyles'\nimport { getAllSelectors } from './helpers/insertStyleRule'\nimport { proxyThemeVariables } from './helpers/proxyThemeVariables'\nimport { wrapThemeManagerContext } from './helpers/wrapThemeManagerContext'\nimport { useFeatures } from './hooks/useFeatures'\nimport { useIsTouchDevice } from './hooks/useIsTouchDevice'\nimport { usePressable } from './hooks/usePressable'\nimport { getThemeManagerIfChanged, useTheme } from './hooks/useTheme'\nimport {\n  SpaceTokens,\n  StackProps,\n  StaticConfig,\n  StaticConfigParsed,\n  StylableComponent,\n  TamaguiComponent,\n  TamaguiComponentState,\n  TamaguiConfig,\n  TamaguiInternalConfig,\n  UseAnimationHook,\n} from './types'\nimport { Slot } from './views/Slot'\nimport { TextAncestorContext } from './views/TextAncestorContext'\n\nReact['keep']\n\nconst defaultComponentState: TamaguiComponentState = {\n  hover: false,\n  press: false,\n  pressIn: false,\n  focus: false,\n  // only used by enterStyle\n  mounted: false,\n  animation: null,\n}\n\nexport const mouseUps = new Set<Function>()\nif (typeof document !== 'undefined') {\n  document.addEventListener('mouseup', () => {\n    mouseUps.forEach((x) => x())\n    mouseUps.clear()\n  })\n  document.addEventListener('touchend', () => {\n    mouseUps.forEach((x) => x())\n    mouseUps.clear()\n  })\n  document.addEventListener('touchcancel', () => {\n    mouseUps.forEach((x) => x())\n    mouseUps.clear()\n  })\n}\n\n// mutates\nfunction mergeShorthands({ defaultProps }: StaticConfigParsed, { shorthands }: TamaguiConfig) {\n  // they are defined in correct order already { ...parent, ...child }\n  for (const key in defaultProps) {\n    defaultProps[shorthands[key] || key] = defaultProps[key]\n  }\n}\n\nlet initialTheme: any\n\nexport function createComponent<\n  ComponentPropTypes extends Object = {},\n  Ref = View,\n  BaseProps = never\n>(configIn: Partial<StaticConfig> | StaticConfigParsed, ParentComponent?: StylableComponent) {\n  const staticConfig = (() => {\n    const config = extendStaticConfig(configIn, ParentComponent)\n    if ('parsed' in config) {\n      return config\n    } else {\n      return parseStaticConfig(config)\n    }\n  })()\n\n  const componentClassName = `is_${staticConfig.componentName}`\n  let tamaguiConfig: TamaguiInternalConfig\n  let AnimatedText: any\n  let AnimatedView: any\n  let avoidClasses = true\n  let defaultNativeStyle: any\n  let defaultNativeStyleSheet: StyleSheet.NamedStyles<{ base: {} }>\n  let tamaguiDefaultProps: any\n  let initialSplitStyles: SplitStyleResult\n\n  function addPseudoToStyles(styles: any[], name: string, pseudos: any) {\n    // on web use pseudo object { hoverStyle } to keep specificity with concatClassName\n    const pseudoStyle = pseudos[name]\n    const shouldNestObject = isWeb && name !== 'enterStyle' && name !== 'exitStyle'\n    if (pseudoStyle) {\n      styles.push(shouldNestObject ? { [name]: pseudoStyle } : pseudoStyle)\n    }\n    const defaultPseudoStyle = initialSplitStyles.pseudos[name]\n    if (defaultPseudoStyle) {\n      styles.push(shouldNestObject ? { [name]: defaultPseudoStyle } : defaultPseudoStyle)\n    }\n  }\n\n  // see onConfiguredOnce below which attaches a name then to this component\n  const component = forwardRef<Ref, ComponentPropTypes>((props: any, forwardedRef) => {\n    // ridiculous fix because react inserts default props after your props for some reason...\n    props = tamaguiDefaultProps && !props.asChild ? { ...tamaguiDefaultProps, ...props } : props\n\n    const { Component, componentName, isText, isZStack } = staticConfig\n\n    if (process.env.NODE_ENV === 'development') {\n      if (props['debug']) {\n        // prettier-ignore\n        console.warn(staticConfig.componentName || Component?.displayName || Component?.name || '[Unnamed Component]', 'debug on')\n        // keep separate react native warn touches every value on prop causing weird behavior\n        console.log('props in:', props, Object.keys(props))\n        if (props['debug'] === 'break') debugger\n      }\n    }\n\n    const forceUpdate = useForceUpdate()\n    const theme = useTheme(props.theme, staticConfig.componentName, props, forceUpdate)\n    const [state, set_] = useState<TamaguiComponentState>(defaultComponentState)\n    const setStateShallow = createShallowUpdate(set_)\n\n    const shouldAvoidClasses = !!(props.animation && avoidClasses)\n    const splitStyles = useSplitStyles(\n      props,\n      staticConfig,\n      theme,\n      shouldAvoidClasses ? { ...state, noClassNames: true, resolveVariablesAs: 'value' } : state,\n      shouldAvoidClasses || props.asChild ? null : initialSplitStyles.classNames\n    )\n\n    const { viewProps: viewPropsIn, pseudos, medias, style, classNames } = splitStyles\n    const useAnimations = tamaguiConfig.animations?.useAnimations as UseAnimationHook | undefined\n    const isAnimated = !!(useAnimations && props.animation)\n    const hasEnterStyle = !!props.enterStyle\n\n    const features = useFeatures(props, {\n      forceUpdate,\n      setStateShallow,\n      useAnimations,\n      state,\n      style: props.animation ? { ...defaultNativeStyle, ...style } : null,\n      pseudos,\n      staticConfig,\n      theme,\n      onDidAnimate: props.onDidAnimate,\n    })\n\n    const {\n      tag,\n      hitSlop,\n      asChild,\n      children,\n      pointerEvents,\n      onPress,\n      onPressIn,\n      onPressOut,\n      onHoverIn,\n      onHoverOut,\n      space,\n      disabled,\n      onMouseEnter,\n      onMouseLeave,\n      hrefAttrs,\n      onMoveShouldSetResponder,\n      onMoveShouldSetResponderCapture,\n      onResponderEnd,\n      onResponderGrant,\n      onResponderMove,\n      onResponderReject,\n      onResponderRelease,\n      onResponderStart,\n      onResponderTerminate,\n      onResponderTerminationRequest,\n      onScrollShouldSetResponder,\n      onScrollShouldSetResponderCapture,\n      onSelectionChangeShouldSetResponder,\n      onSelectionChangeShouldSetResponderCapture,\n      onStartShouldSetResponder,\n      onStartShouldSetResponderCapture,\n      onMouseDown,\n      nativeID,\n\n      accessible,\n      accessibilityRole,\n\n      // android\n      collapsable,\n      focusable,\n\n      // ignore from here on out\n      // for next/link compat etc\n      // @ts-ignore\n      onClick,\n      theme: _themeProp,\n      // @ts-ignore\n      defaultVariants,\n\n      // TODO feature load layout hook\n      onLayout,\n      ...viewPropsRest\n    } = viewPropsIn\n\n    let viewProps: StackProps = viewPropsRest\n\n    // from react-native-web\n    if (process.env.NODE_ENV === 'development' && !isText && isWeb) {\n      Children.toArray(props.children).forEach((item) => {\n        if (typeof item === 'string') {\n          console.error(`Unexpected text node: ${item}. A text node cannot be a child of a <View>.`)\n        }\n      })\n    }\n\n    const hasTextAncestor = isWeb ? useContext(TextAncestorContext) : false\n    const hostRef = useRef(null)\n\n    // isMounted\n    const internal = useRef<{ isMounted: boolean }>()\n    if (!internal.current) {\n      internal.current = {\n        isMounted: true,\n      }\n    }\n\n    useIsomorphicLayoutEffect(() => {\n      // we need to use state to properly have mounted go from false => true\n      if (typeof window !== 'undefined' && (hasEnterStyle || props.animation)) {\n        // for SSR we never set mounted, ensuring enterStyle={{}} is set by default\n        setStateShallow({\n          mounted: true,\n        })\n      }\n\n      internal.current!.isMounted = true\n      return () => {\n        mouseUps.delete(unPress)\n        internal.current!.isMounted = false\n      }\n    }, [hasEnterStyle, props.animation])\n\n    if (nativeID) {\n      viewProps.id = nativeID\n    }\n\n    if (isAndroid) {\n      if (collapsable) viewProps.collapsable = collapsable\n      if (focusable) viewProps.focusable = focusable\n    }\n\n    if (!isWeb) {\n      if (accessible) viewProps.accessible = accessible\n      if (accessibilityRole) viewProps.accessibilityRole = accessibilityRole\n    }\n\n    if (isWeb && !asChild) {\n      // from react-native-web\n      rnw.useResponderEvents(hostRef, {\n        onMoveShouldSetResponder,\n        onMoveShouldSetResponderCapture,\n        onResponderEnd,\n        onResponderGrant,\n        onResponderMove,\n        onResponderReject,\n        onResponderRelease,\n        onResponderStart,\n        onResponderTerminate,\n        onResponderTerminationRequest,\n        onScrollShouldSetResponder,\n        onScrollShouldSetResponderCapture,\n        onSelectionChangeShouldSetResponder,\n        onSelectionChangeShouldSetResponderCapture,\n        onStartShouldSetResponder,\n        onStartShouldSetResponderCapture,\n      })\n    }\n\n    // get the right component\n    const isTaggable = !Component || typeof Component === 'string'\n\n    // default to tag, fallback to component (when both strings)\n    const element = isWeb ? (isTaggable ? tag || Component : Component) : Component\n    const BaseTextComponent = !isWeb ? Text : element || 'span'\n    const BaseViewComponent = !isWeb ? View : element || (hasTextAncestor ? 'span' : 'div')\n    let ViewComponent = isText\n      ? (isAnimated ? AnimatedText || Text : null) || BaseTextComponent\n      : (isAnimated ? AnimatedView || View : null) || BaseViewComponent\n\n    ViewComponent = Component || ViewComponent\n\n    let styles: any[]\n\n    const isStringElement = typeof ViewComponent === 'string'\n    const animationStyles = state.animation ? state.animation.style : null\n\n    if (isStringElement && shouldAvoidClasses) {\n      styles = {\n        ...defaultNativeStyle,\n        ...animationStyles,\n        ...medias,\n      }\n    } else {\n      styles = [\n        isWeb ? null : defaultNativeStyleSheet ? (defaultNativeStyleSheet.base as ViewStyle) : null,\n        // parity w react-native-web, only for text in text\n        // TODO this should be able to be done w css to replicate after extraction:\n        //  (.text .text { display: inline-flex; }) (but if they set display we'd need stronger precendence)\n        // isText && hasTextAncestor && isWeb ? { display: 'inline-flex' } : null,\n        // style,\n        animationStyles ? animationStyles : style,\n        medias,\n      ]\n      if (!animationStyles) {\n        !state.mounted && addPseudoToStyles(styles, 'enterStyle', pseudos)\n        state.hover && addPseudoToStyles(styles, 'hoverStyle', pseudos)\n        state.focus && addPseudoToStyles(styles, 'focusStyle', pseudos)\n        state.press && addPseudoToStyles(styles, 'pressStyle', pseudos)\n      }\n    }\n\n    if (isWeb) {\n      if (!shouldAvoidClasses) {\n        const fontFamilyName = isText\n          ? props.fontFamily || staticConfig.defaultProps.fontFamily\n          : null\n        const fontFamily =\n          fontFamilyName && fontFamilyName[0] === '$' ? fontFamilyName.slice(1) : null\n        const classList = [\n          componentName ? componentClassName : '',\n          fontFamily ? `font_${fontFamily}` : '',\n          theme.className,\n          classNames ? Object.values(classNames).join(' ') : '',\n        ]\n\n        // TODO restore this to isText classList\n        // hasTextAncestor === true && cssText.textHasAncestor,\n        // TODO MOVE TO VARIANTS [number] [any]\n        // numberOfLines != null && numberOfLines > 1 && cssText.textMultiLine,\n\n        const className = classList.join(' ')\n        if (process.env.NODE_ENV === 'development') {\n          if (props['debug']) {\n            // prettier-ignore\n            console.log('  \u00BB className', { isStringElement, pseudos, state, classNames, propsClassName: props.className, style, classList, className: className.trim().split(' '), themeClassName: theme.className, values: Object.fromEntries(Object.entries(classNames).map(([k, v]) => [v, getAllSelectors()[v]])) })\n          }\n        }\n        viewProps.className = className\n        viewProps.style = animationStyles\n      } else {\n        viewProps.style = styles\n      }\n    } else {\n      viewProps.style = styles\n    }\n\n    if (pointerEvents) {\n      viewProps.pointerEvents = pointerEvents\n    }\n\n    if (isWeb) {\n      // from react-native-web\n      const platformMethodsRef = rnw.usePlatformMethods(viewProps)\n      const setRef = rnw.useMergeRefs(hostRef, platformMethodsRef, forwardedRef)\n\n      if (!isAnimated) {\n        // @ts-ignore\n        viewProps.ref = setRef\n      } else {\n        if (forwardedRef) {\n          // @ts-ignore\n          viewProps.ref = forwardedRef\n        }\n      }\n\n      if (props.href != null && hrefAttrs != null) {\n        const { download, rel, target } = hrefAttrs\n        if (download != null) {\n          viewProps.download = download\n        }\n        if (rel != null) {\n          viewProps.rel = rel\n        }\n        if (typeof target === 'string') {\n          viewProps.target = target.charAt(0) !== '_' ? '_' + target : target\n        }\n      }\n    } else {\n      if (forwardedRef) {\n        // @ts-ignore\n        viewProps.ref = forwardedRef\n      }\n    }\n\n    // TODO need to loop active variants and see if they have matchin pseudos and apply as well\n    const initialPseudos = initialSplitStyles.pseudos\n    const attachPress = !!(\n      (pseudos && pseudos.pressStyle) ||\n      (initialPseudos && initialPseudos.pressStyle) ||\n      onPress ||\n      onPressOut ||\n      onPressIn ||\n      onClick\n    )\n\n    const isTouch = useIsTouchDevice()\n    const isHoverable = isWeb && !isTouch\n    const attachHover =\n      isHoverable &&\n      !!((pseudos && pseudos.hoverStyle) || onHoverIn || onHoverOut || onMouseEnter || onMouseLeave)\n    const pressEventKey = isStringElement ? 'onClick' : 'onPress'\n\n    // check presence to prevent reparenting bugs, allows for onPress={x ? function : undefined} usage\n    // while avoiding reparenting...\n    // once proper reparenting is supported, we can remove this and use that...\n    const shouldAttach =\n      !asChild &&\n      (attachPress ||\n        attachHover ||\n        'pressStyle' in props ||\n        'onPress' in props ||\n        'onPressIn' in props ||\n        'onPressOut' in props ||\n        (isWeb &&\n          ('hoverStyle' in props ||\n            'onHoverIn' in props ||\n            'onHoverOut' in props ||\n            'onMouseEnter' in props ||\n            'onMouseLeave' in props)))\n\n    const unPress = useCallback(() => {\n      if (!internal.current!.isMounted) return\n      setStateShallow({\n        press: false,\n        pressIn: false,\n      })\n    }, [])\n\n    const events = shouldAttach\n      ? {\n          ...(!isWeb && {\n            // non web\n            onPressOut: (e) => {\n              unPress()\n              onPressOut?.(e)\n            },\n          }),\n          ...(isHoverable && {\n            onMouseEnter: attachHover\n              ? (e) => {\n                  let next: Partial<typeof state> = {}\n                  if (attachHover) {\n                    next.hover = true\n                  }\n                  if (state.pressIn) {\n                    next.press = true\n                  }\n                  if (Object.keys(next).length) {\n                    setStateShallow(next)\n                  }\n                  onHoverIn?.(e)\n                  onMouseEnter?.(e)\n                }\n              : undefined,\n            onMouseLeave: attachHover\n              ? (e) => {\n                  let next: Partial<typeof state> = {}\n                  mouseUps.add(unPress)\n                  if (attachHover) {\n                    next.hover = false\n                  }\n                  if (state.pressIn) {\n                    next.press = false\n                    next.pressIn = false\n                  }\n                  if (Object.keys(next).length) {\n                    setStateShallow(next)\n                  }\n                  onHoverOut?.(e)\n                  onMouseLeave?.(e)\n                }\n              : undefined,\n          }),\n          onMouseDown: attachPress\n            ? (e) => {\n                setStateShallow({\n                  press: true,\n                  pressIn: true,\n                })\n                onPressIn?.(e)\n                onMouseDown?.(e)\n                if (isWeb) {\n                  mouseUps.add(unPress)\n                }\n              }\n            : null,\n          [pressEventKey]: attachPress\n            ? (e) => {\n                onClick?.(e)\n                onPress?.(e)\n                unPress()\n                onPressOut?.(e)\n              }\n            : null,\n        }\n      : null\n\n    const childEls =\n      !children || asChild\n        ? children\n        : wrapThemeManagerContext(\n            spacedChildren({\n              children,\n              space,\n              flexDirection: props.flexDirection || staticConfig.defaultProps?.flexDirection,\n              isZStack,\n            }),\n            getThemeManagerIfChanged(theme)\n          )\n\n    // TODO once we do the above we can then rely entirely on pressStyle returned here isntead of above pressStyle logic\n    const [pressProps] = usePressable(\n      events\n        ? {\n            disabled,\n            ...(hitSlop && {\n              hitSlop,\n            }),\n            onPressIn: events.onMouseDown,\n            onPressOut: events.onPressOut,\n            onPress: events[pressEventKey],\n          }\n        : {\n            disabled: true,\n          }\n    )\n\n    let content: any\n\n    // replicate react-native-web's `createElement`\n    if (isWeb) {\n      if (staticConfig.isReactNativeWeb) {\n        viewProps.dataSet = {\n          ...viewProps.dataSet,\n          className: viewProps.className,\n        }\n      } else {\n        const rnProps = rnw.createDOMProps(viewProps)\n        const className =\n          rnProps.className && rnProps.className !== viewProps.className\n            ? `${rnProps.className} ${viewProps.className}`\n            : viewProps.className\n\n        // additive\n        Object.assign(viewProps, rnProps)\n\n        // we already handle Text/View properly\n        if (className) {\n          viewProps.className = className\n        }\n      }\n    }\n\n    if (events) {\n      if (!isStringElement) {\n        Object.assign(viewProps, pressProps)\n      } else {\n        Object.assign(viewProps, events)\n      }\n    }\n\n    if (asChild) {\n      ViewComponent = Slot\n      const onlyChild = React.Children.only(children)\n      Object.assign(viewProps, onlyChild.props)\n    }\n\n    content = createElement(ViewComponent, viewProps, childEls)\n\n    if (isWeb && events && attachHover) {\n      content = (\n        <span\n          className=\"tui_Hoverable\"\n          style={{\n            display: 'contents',\n          }}\n          onMouseEnter={events.onMouseEnter}\n          onMouseLeave={events.onMouseLeave}\n        >\n          {content}\n        </span>\n      )\n    }\n\n    if (process.env.NODE_ENV === 'development') {\n      if (props['debug']) {\n        viewProps['debug'] = true\n        // prettier-ignore\n        console.log('  \u00BB ', { propsIn: { ...props }, propsOut: { ...viewProps }, state, splitStyles, animationStyles, isStringElement, classNamesIn: props.className?.split(' '), classNamesOut: viewProps.className?.split(' '), pressProps, events, shouldAttach, ViewComponent, viewProps, styles, pseudos, content, childEls, shouldAvoidClasses, avoidClasses, animation: props.animation, style, defaultNativeStyle, initialSplitStyles, ...(typeof window !== 'undefined' ? { theme, themeState: theme.__state, themeClassName:  theme.className, staticConfig, tamaguiConfig } : null) })\n      }\n    }\n\n    if (features.length) {\n      return (\n        <>\n          {features}\n          {content}\n        </>\n      )\n    }\n\n    return content\n  })\n\n  component.displayName = staticConfig.componentName\n\n  // Once configuration is run and all components are registered\n  // get default props + className and analyze styles\n  onConfiguredOnce((conf) => {\n    if (process.env.IS_STATIC === 'is_static') {\n      // in static mode we just use these to lookup configuration\n      return\n    }\n\n    tamaguiConfig = conf\n\n    // do this to make sure shorthands don't duplicate with.. longhands\n    mergeShorthands(staticConfig, tamaguiConfig)\n\n    avoidClasses = !!tamaguiConfig.animations?.avoidClasses\n    AnimatedText = tamaguiConfig.animations?.Text\n    AnimatedView = tamaguiConfig?.animations?.View\n    initialTheme =\n      initialTheme ||\n      proxyThemeVariables(conf.themes[conf.defaultTheme || Object.keys(conf.themes)[0]])\n    initialSplitStyles = insertSplitStyles(staticConfig.defaultProps, staticConfig, initialTheme, {\n      mounted: true,\n      hover: false,\n      press: false,\n      pressIn: false,\n      focus: false,\n      resolveVariablesAs: 'both',\n      keepVariantsAsProps: true,\n    })\n\n    const { style, viewProps } = initialSplitStyles\n    defaultNativeStyle = {}\n    for (const key in style) {\n      const v = style[key]\n      defaultNativeStyle[key] = isVariable(v) ? v.val : v\n    }\n    defaultNativeStyleSheet = StyleSheet.create({\n      base: defaultNativeStyle,\n    })\n\n    // @ts-ignore\n    // this ruins the prop order!!!\n    // can't believe it but it puts default props after props?\n    const defaults = {\n      ...viewProps,\n      ...component.defaultProps,\n    }\n    if (Object.keys(defaults).length) {\n      tamaguiDefaultProps = defaults\n    }\n    // component.defaultProps = {\n    //   ...viewProps,\n    //   ...component.defaultProps,\n    // }\n\n    // add debug logs\n    if (process.env.NODE_ENV === 'development' && staticConfig.defaultProps?.debug) {\n      if (process.env.IS_STATIC !== 'is_static') {\n        console.log(`\uD83D\uDC1B [${staticConfig.componentName || 'Component'}]`, {\n          staticConfig,\n          initialSplitStyles,\n        })\n      }\n    }\n  })\n\n  let res: TamaguiComponent<ComponentPropTypes, Ref, BaseProps> = component as any\n\n  if (configIn.memo) {\n    res = memo(res) as any\n  }\n\n  res['staticConfig'] = {\n    validStyles: staticConfig.validStyles || stylePropsView,\n    ...staticConfig,\n  }\n\n  if (process.env.NODE_ENV === 'development') {\n    res['whyDidYouRender'] = true\n  }\n\n  // res.extractable HoC\n  res['extractable'] = (Component: any, conf?: Partial<StaticConfig>) => {\n    Component['staticConfig'] = extendStaticConfig(\n      {\n        Component,\n        ...conf,\n        neverFlatten: true,\n        defaultProps: {\n          ...Component.defaultProps,\n          ...conf?.defaultProps,\n        },\n      },\n      res\n    )\n    return Component\n  }\n\n  return res\n}\n\n// dont used styled() here to avoid circular deps\n// keep inline to avoid circular deps\n\nexport const Spacer = createComponent<\n  Omit<StackProps, 'flex' | 'direction'> & {\n    size?: number | SpaceTokens\n    flex?: boolean | number\n    direction?: 'horizontal' | 'vertical'\n  }\n>({\n  memo: true,\n  componentName: 'Spacer',\n  defaultProps: {\n    ...stackDefaultStyles,\n    size: true,\n  },\n  variants: {\n    size: {\n      '...size': (size, { tokens }) => {\n        size = size == true ? '$true' : size\n        const sizePx = tokens.size[size] ?? size\n        return {\n          width: sizePx,\n          height: sizePx,\n          minWidth: sizePx,\n          minHeight: sizePx,\n        }\n      },\n    },\n\n    flex: {\n      true: {\n        flex: 1,\n      },\n    },\n\n    direction: {\n      horizontal: {\n        height: 0,\n        minHeight: 0,\n      },\n      vertical: {\n        width: 0,\n        minWidth: 0,\n      },\n    },\n  },\n})\n\nexport function spacedChildren({\n  isZStack,\n  children,\n  space,\n  flexDirection,\n  spaceFlex,\n}: {\n  isZStack?: boolean\n  children: any\n  space?: any\n  spaceFlex?: boolean | number\n  flexDirection?: ViewStyle['flexDirection']\n}) {\n  const childrenList = Children.toArray(children)\n  const len = childrenList.length\n  if (len === 1) {\n    return childrenList\n  }\n  const next: any[] = []\n  for (const [index, child] of childrenList.entries()) {\n    if (child === null || child === undefined) {\n      continue\n    }\n\n    if (!child || (child['key'] && !isZStack)) {\n      next.push(child)\n    } else {\n      next.push(\n        <Fragment key={index}>{isZStack ? <AbsoluteFill>{child}</AbsoluteFill> : child}</Fragment>\n      )\n    }\n\n    // allows for custom visually hidden components that dont insert spacing\n    if (child['type']?.['isVisuallyHidden']) {\n      continue\n    }\n\n    if (index !== len - 1) {\n      if (space) {\n        next.push(\n          <Spacer\n            key={`_${index}_spacer`}\n            direction={\n              flexDirection === 'row' || flexDirection === 'row-reverse' ? 'horizontal' : 'vertical'\n            }\n            size={space}\n            {...(spaceFlex && {\n              flex: spaceFlex,\n            })}\n          />\n        )\n      }\n    }\n  }\n  return next\n}\n\nexport function AbsoluteFill(props: any) {\n  return isWeb ? (\n    <div\n      style={\n        {\n          position: 'absolute',\n          top: 0,\n          left: 0,\n          right: 0,\n          bottom: 0,\n        } as any\n      }\n    >\n      {props.children}\n    </div>\n  ) : (\n    <View style={StyleSheet.absoluteFill}>{props.child}</View>\n  )\n}\n\n// this can be done with CSS entirely right?\n// const shouldWrapTextAncestor = isWeb && isText && !hasTextAncestor\n// if (shouldWrapTextAncestor) {\n//   // from react-native-web\n//   content = createElement(TextAncestorContext.Provider, { value: true }, content)\n// }\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAA+B;AAC/B,8BAA+B;AAC/B,mBAUO;AACP,0BAAkD;AAElD,kBAAiC;AACjC,uBAAmC;AACnC,sBAA4D;AAC5D,iBAAoB;AACpB,4BAA2B;AAC3B,iCAAoC;AACpC,gCAAsD;AACtD,4BAAoE;AACpE,6BAAgC;AAChC,iCAAoC;AACpC,qCAAwC;AACxC,yBAA4B;AAC5B,8BAAiC;AACjC,0BAA6B;AAC7B,sBAAmD;AAanD,kBAAqB;AACrB,iCAAoC;AAEpC,qBAAM;AAEN,MAAM,wBAA+C;AAAA,EACnD,OAAO;AAAA,EACP,OAAO;AAAA,EACP,SAAS;AAAA,EACT,OAAO;AAAA,EAEP,SAAS;AAAA,EACT,WAAW;AACb;AAEO,MAAM,WAAW,oBAAI,IAAc;AAC1C,IAAI,OAAO,aAAa,aAAa;AACnC,WAAS,iBAAiB,WAAW,MAAM;AACzC,aAAS,QAAQ,CAAC,MAAM,EAAE,CAAC;AAC3B,aAAS,MAAM;AAAA,EACjB,CAAC;AACD,WAAS,iBAAiB,YAAY,MAAM;AAC1C,aAAS,QAAQ,CAAC,MAAM,EAAE,CAAC;AAC3B,aAAS,MAAM;AAAA,EACjB,CAAC;AACD,WAAS,iBAAiB,eAAe,MAAM;AAC7C,aAAS,QAAQ,CAAC,MAAM,EAAE,CAAC;AAC3B,aAAS,MAAM;AAAA,EACjB,CAAC;AACH;AAGA,yBAAyB,EAAE,gBAAoC,EAAE,cAA6B;AAE5F,aAAW,OAAO,cAAc;AAC9B,iBAAa,WAAW,QAAQ,OAAO,aAAa;AAAA,EACtD;AACF;AALS;AAOT,IAAI;AAEG,yBAIL,UAAsD,iBAAqC;AAC3F,QAAM,eAAgB,OAAM;AAC1B,UAAM,SAAS,kDAAmB,UAAU,eAAe;AAC3D,QAAI,YAAY,QAAQ;AACtB,aAAO;AAAA,IACT,OAAO;AACL,aAAO,iDAAkB,MAAM;AAAA,IACjC;AAAA,EACF,GAAG;AAEH,QAAM,qBAAqB,MAAM,aAAa;AAC9C,MAAI;AACJ,MAAI;AACJ,MAAI;AACJ,MAAI,eAAe;AACnB,MAAI;AACJ,MAAI;AACJ,MAAI;AACJ,MAAI;AAEJ,6BAA2B,QAAe,MAAc,SAAc;AAEpE,UAAM,cAAc,QAAQ;AAC5B,UAAM,mBAAmB,yBAAS,SAAS,gBAAgB,SAAS;AACpE,QAAI,aAAa;AACf,aAAO,KAAK,mBAAmB,GAAG,OAAO,YAAY,IAAI,WAAW;AAAA,IACtE;AACA,UAAM,qBAAqB,mBAAmB,QAAQ;AACtD,QAAI,oBAAoB;AACtB,aAAO,KAAK,mBAAmB,GAAG,OAAO,mBAAmB,IAAI,kBAAkB;AAAA,IACpF;AAAA,EACF;AAXS;AAcT,QAAM,YAAY,6BAAoC,CAAC,OAAY,iBAAiB;AAzHtF;AA2HI,YAAQ,uBAAuB,CAAC,MAAM,UAAU,kCAAK,sBAAwB,SAAU;AAEvF,UAAM,EAAE,WAAW,eAAe,QAAQ,aAAa;AAEvD,QAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,UAAI,MAAM,UAAU;AAElB,gBAAQ,KAAK,aAAa,iBAAiB,wCAAW,gBAAe,wCAAW,SAAQ,uBAAuB,UAAU;AAEzH,gBAAQ,IAAI,aAAa,OAAO,OAAO,KAAK,KAAK,CAAC;AAClD,YAAI,MAAM,aAAa;AAAS;AAAA,MAClC;AAAA,IACF;AAEA,UAAM,cAAc,4CAAe;AACnC,UAAM,QAAQ,8BAAS,MAAM,OAAO,aAAa,eAAe,OAAO,WAAW;AAClF,UAAM,CAAC,OAAO,QAAQ,2BAAgC,qBAAqB;AAC3E,UAAM,kBAAkB,oDAAoB,IAAI;AAEhD,UAAM,qBAAqB,CAAC,CAAE,OAAM,aAAa;AACjD,UAAM,cAAc,0CAClB,OACA,cACA,OACA,qBAAqB,iCAAK,QAAL,EAAY,cAAc,MAAM,oBAAoB,QAAQ,KAAI,OACrF,sBAAsB,MAAM,UAAU,OAAO,mBAAmB,UAClE;AAEA,UAAM,EAAE,WAAW,aAAa,SAAS,QAAQ,OAAO,eAAe;AACvE,UAAM,gBAAgB,oBAAc,eAAd,mBAA0B;AAChD,UAAM,aAAa,CAAC,CAAE,kBAAiB,MAAM;AAC7C,UAAM,gBAAgB,CAAC,CAAC,MAAM;AAE9B,UAAM,WAAW,oCAAY,OAAO;AAAA,MAClC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO,MAAM,YAAY,kCAAK,qBAAuB,SAAU;AAAA,MAC/D;AAAA,MACA;AAAA,MACA;AAAA,MACA,cAAc,MAAM;AAAA,IACtB,CAAC;AAED,UAqDI,kBApDF;AAAA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,MACA;AAAA,MAGA;AAAA,MACA;AAAA,MAKA;AAAA,MACA,OAAO;AAAA,MAEP;AAAA,MAGA;AAAA,QAEE,IADC,0BACD,IADC;AAAA,MAnDH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,MACA;AAAA,MAGA;AAAA,MACA;AAAA,MAKA;AAAA,MACA;AAAA,MAEA;AAAA,MAGA;AAAA;AAIF,QAAI,YAAwB;AAG5B,QAAI,QAAQ,IAAI,aAAa,iBAAiB,CAAC,UAAU,uBAAO;AAC9D,4BAAS,QAAQ,MAAM,QAAQ,EAAE,QAAQ,CAAC,SAAS;AACjD,YAAI,OAAO,SAAS,UAAU;AAC5B,kBAAQ,MAAM,yBAAyB,kDAAkD;AAAA,QAC3F;AAAA,MACF,CAAC;AAAA,IACH;AAEA,UAAM,kBAAkB,wBAAQ,6BAAW,8CAAmB,IAAI;AAClE,UAAM,UAAU,yBAAO,IAAI;AAG3B,UAAM,WAAW,yBAA+B;AAChD,QAAI,CAAC,SAAS,SAAS;AACrB,eAAS,UAAU;AAAA,QACjB,WAAW;AAAA,MACb;AAAA,IACF;AAEA,mDAA0B,MAAM;AAE9B,UAAI,OAAO,WAAW,eAAgB,kBAAiB,MAAM,YAAY;AAEvE,wBAAgB;AAAA,UACd,SAAS;AAAA,QACX,CAAC;AAAA,MACH;AAEA,eAAS,QAAS,YAAY;AAC9B,aAAO,MAAM;AACX,iBAAS,OAAO,OAAO;AACvB,iBAAS,QAAS,YAAY;AAAA,MAChC;AAAA,IACF,GAAG,CAAC,eAAe,MAAM,SAAS,CAAC;AAEnC,QAAI,UAAU;AACZ,gBAAU,KAAK;AAAA,IACjB;AAEA,QAAI,2BAAW;AACb,UAAI;AAAa,kBAAU,cAAc;AACzC,UAAI;AAAW,kBAAU,YAAY;AAAA,IACvC;AAEA,QAAI,CAAC,uBAAO;AACV,UAAI;AAAY,kBAAU,aAAa;AACvC,UAAI;AAAmB,kBAAU,oBAAoB;AAAA,IACvD;AAEA,QAAI,yBAAS,CAAC,SAAS;AAErB,qBAAI,mBAAmB,SAAS;AAAA,QAC9B;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH;AAGA,UAAM,aAAa,CAAC,aAAa,OAAO,cAAc;AAGtD,UAAM,UAAU,wBAAS,aAAa,OAAO,YAAY,YAAa;AACtE,UAAM,oBAAoB,CAAC,wBAAQ,2BAAO,WAAW;AACrD,UAAM,oBAAoB,CAAC,wBAAQ,2BAAO,WAAY,mBAAkB,SAAS;AACjF,QAAI,gBAAgB,SACf,cAAa,gBAAgB,2BAAO,SAAS,oBAC7C,cAAa,gBAAgB,2BAAO,SAAS;AAElD,oBAAgB,aAAa;AAE7B,QAAI;AAEJ,UAAM,kBAAkB,OAAO,kBAAkB;AACjD,UAAM,kBAAkB,MAAM,YAAY,MAAM,UAAU,QAAQ;AAElE,QAAI,mBAAmB,oBAAoB;AACzC,eAAS,iDACJ,qBACA,kBACA;AAAA,IAEP,OAAO;AACL,eAAS;AAAA,QACP,wBAAQ,OAAO,0BAA2B,wBAAwB,OAAqB;AAAA,QAMvF,kBAAkB,kBAAkB;AAAA,QACpC;AAAA,MACF;AACA,UAAI,CAAC,iBAAiB;AACpB,SAAC,MAAM,WAAW,kBAAkB,QAAQ,cAAc,OAAO;AACjE,cAAM,SAAS,kBAAkB,QAAQ,cAAc,OAAO;AAC9D,cAAM,SAAS,kBAAkB,QAAQ,cAAc,OAAO;AAC9D,cAAM,SAAS,kBAAkB,QAAQ,cAAc,OAAO;AAAA,MAChE;AAAA,IACF;AAEA,QAAI,uBAAO;AACT,UAAI,CAAC,oBAAoB;AACvB,cAAM,iBAAiB,SACnB,MAAM,cAAc,aAAa,aAAa,aAC9C;AACJ,cAAM,aACJ,kBAAkB,eAAe,OAAO,MAAM,eAAe,MAAM,CAAC,IAAI;AAC1E,cAAM,YAAY;AAAA,UAChB,gBAAgB,qBAAqB;AAAA,UACrC,aAAa,QAAQ,eAAe;AAAA,UACpC,MAAM;AAAA,UACN,aAAa,OAAO,OAAO,UAAU,EAAE,KAAK,GAAG,IAAI;AAAA,QACrD;AAOA,cAAM,YAAY,UAAU,KAAK,GAAG;AACpC,YAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,cAAI,MAAM,UAAU;AAElB,oBAAQ,IAAI,oBAAiB,EAAE,iBAAiB,SAAS,OAAO,YAAY,gBAAgB,MAAM,WAAW,OAAO,WAAW,WAAW,UAAU,KAAK,EAAE,MAAM,GAAG,GAAG,gBAAgB,MAAM,WAAW,QAAQ,OAAO,YAAY,OAAO,QAAQ,UAAU,EAAE,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,GAAG,4CAAgB,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC;AAAA,UAC7S;AAAA,QACF;AACA,kBAAU,YAAY;AACtB,kBAAU,QAAQ;AAAA,MACpB,OAAO;AACL,kBAAU,QAAQ;AAAA,MACpB;AAAA,IACF,OAAO;AACL,gBAAU,QAAQ;AAAA,IACpB;AAEA,QAAI,eAAe;AACjB,gBAAU,gBAAgB;AAAA,IAC5B;AAEA,QAAI,uBAAO;AAET,YAAM,qBAAqB,eAAI,mBAAmB,SAAS;AAC3D,YAAM,SAAS,eAAI,aAAa,SAAS,oBAAoB,YAAY;AAEzE,UAAI,CAAC,YAAY;AAEf,kBAAU,MAAM;AAAA,MAClB,OAAO;AACL,YAAI,cAAc;AAEhB,oBAAU,MAAM;AAAA,QAClB;AAAA,MACF;AAEA,UAAI,MAAM,QAAQ,QAAQ,aAAa,MAAM;AAC3C,cAAM,EAAE,UAAU,KAAK,WAAW;AAClC,YAAI,YAAY,MAAM;AACpB,oBAAU,WAAW;AAAA,QACvB;AACA,YAAI,OAAO,MAAM;AACf,oBAAU,MAAM;AAAA,QAClB;AACA,YAAI,OAAO,WAAW,UAAU;AAC9B,oBAAU,SAAS,OAAO,OAAO,CAAC,MAAM,MAAM,MAAM,SAAS;AAAA,QAC/D;AAAA,MACF;AAAA,IACF,OAAO;AACL,UAAI,cAAc;AAEhB,kBAAU,MAAM;AAAA,MAClB;AAAA,IACF;AAGA,UAAM,iBAAiB,mBAAmB;AAC1C,UAAM,cAAc,CAAC,CAClB,YAAW,QAAQ,cACnB,kBAAkB,eAAe,cAClC,WACA,cACA,aACA;AAGF,UAAM,UAAU,8CAAiB;AACjC,UAAM,cAAc,yBAAS,CAAC;AAC9B,UAAM,cACJ,eACA,CAAC,CAAG,YAAW,QAAQ,cAAe,aAAa,cAAc,gBAAgB;AACnF,UAAM,gBAAgB,kBAAkB,YAAY;AAKpD,UAAM,eACJ,CAAC,WACA,gBACC,eACA,gBAAgB,SAChB,aAAa,SACb,eAAe,SACf,gBAAgB,SACf,yBACE,iBAAgB,SACf,eAAe,SACf,gBAAgB,SAChB,kBAAkB,SAClB,kBAAkB;AAE1B,UAAM,UAAU,8BAAY,MAAM;AAChC,UAAI,CAAC,SAAS,QAAS;AAAW;AAClC,sBAAgB;AAAA,QACd,OAAO;AAAA,QACP,SAAS;AAAA,MACX,CAAC;AAAA,IACH,GAAG,CAAC,CAAC;AAEL,UAAM,SAAS,eACX,gDACM,CAAC,yBAAS;AAAA,MAEZ,YAAY,CAAC,MAAM;AACjB,gBAAQ;AACR,iDAAa;AAAA,MACf;AAAA,IACF,IACI,eAAe;AAAA,MACjB,cAAc,cACV,CAAC,MAAM;AACL,YAAI,OAA8B,CAAC;AACnC,YAAI,aAAa;AACf,eAAK,QAAQ;AAAA,QACf;AACA,YAAI,MAAM,SAAS;AACjB,eAAK,QAAQ;AAAA,QACf;AACA,YAAI,OAAO,KAAK,IAAI,EAAE,QAAQ;AAC5B,0BAAgB,IAAI;AAAA,QACtB;AACA,+CAAY;AACZ,qDAAe;AAAA,MACjB,IACA;AAAA,MACJ,cAAc,cACV,CAAC,MAAM;AACL,YAAI,OAA8B,CAAC;AACnC,iBAAS,IAAI,OAAO;AACpB,YAAI,aAAa;AACf,eAAK,QAAQ;AAAA,QACf;AACA,YAAI,MAAM,SAAS;AACjB,eAAK,QAAQ;AACb,eAAK,UAAU;AAAA,QACjB;AACA,YAAI,OAAO,KAAK,IAAI,EAAE,QAAQ;AAC5B,0BAAgB,IAAI;AAAA,QACtB;AACA,iDAAa;AACb,qDAAe;AAAA,MACjB,IACA;AAAA,IACN,IA3CF;AAAA,MA4CE,aAAa,cACT,CAAC,MAAM;AACL,wBAAgB;AAAA,UACd,OAAO;AAAA,UACP,SAAS;AAAA,QACX,CAAC;AACD,+CAAY;AACZ,mDAAc;AACd,YAAI,uBAAO;AACT,mBAAS,IAAI,OAAO;AAAA,QACtB;AAAA,MACF,IACA;AAAA,OACH,gBAAgB,cACb,CAAC,MAAM;AACL,2CAAU;AACV,2CAAU;AACV,gBAAQ;AACR,iDAAa;AAAA,MACf,IACA;AAAA,IACN,KACA;AAEJ,UAAM,WACJ,CAAC,YAAY,UACT,WACA,4DACE,eAAe;AAAA,MACb;AAAA,MACA;AAAA,MACA,eAAe,MAAM,iBAAiB,oBAAa,iBAAb,mBAA2B;AAAA,MACjE;AAAA,IACF,CAAC,GACD,8CAAyB,KAAK,CAChC;AAGN,UAAM,CAAC,cAAc,sCACnB,SACI;AAAA,MACE;AAAA,OACI,WAAW;AAAA,MACb;AAAA,IACF,IAJF;AAAA,MAKE,WAAW,OAAO;AAAA,MAClB,YAAY,OAAO;AAAA,MACnB,SAAS,OAAO;AAAA,IAClB,KACA;AAAA,MACE,UAAU;AAAA,IACZ,CACN;AAEA,QAAI;AAGJ,QAAI,uBAAO;AACT,UAAI,aAAa,kBAAkB;AACjC,kBAAU,UAAU,iCACf,UAAU,UADK;AAAA,UAElB,WAAW,UAAU;AAAA,QACvB;AAAA,MACF,OAAO;AACL,cAAM,UAAU,eAAI,eAAe,SAAS;AAC5C,cAAM,YACJ,QAAQ,aAAa,QAAQ,cAAc,UAAU,YACjD,GAAG,QAAQ,aAAa,UAAU,cAClC,UAAU;AAGhB,eAAO,OAAO,WAAW,OAAO;AAGhC,YAAI,WAAW;AACb,oBAAU,YAAY;AAAA,QACxB;AAAA,MACF;AAAA,IACF;AAEA,QAAI,QAAQ;AACV,UAAI,CAAC,iBAAiB;AACpB,eAAO,OAAO,WAAW,UAAU;AAAA,MACrC,OAAO;AACL,eAAO,OAAO,WAAW,MAAM;AAAA,MACjC;AAAA,IACF;AAEA,QAAI,SAAS;AACX,sBAAgB;AAChB,YAAM,YAAY,qBAAM,SAAS,KAAK,QAAQ;AAC9C,aAAO,OAAO,WAAW,UAAU,KAAK;AAAA,IAC1C;AAEA,cAAU,gCAAc,eAAe,WAAW,QAAQ;AAE1D,QAAI,yBAAS,UAAU,aAAa;AAClC,gBACE,mDAAC;AAAA,QACC,WAAU;AAAA,QACV,OAAO;AAAA,UACL,SAAS;AAAA,QACX;AAAA,QACA,cAAc,OAAO;AAAA,QACrB,cAAc,OAAO;AAAA,SAEpB,OACH;AAAA,IAEJ;AAEA,QAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,UAAI,MAAM,UAAU;AAClB,kBAAU,WAAW;AAErB,gBAAQ,IAAI,WAAQ,iBAAE,SAAS,mBAAK,QAAS,UAAU,mBAAK,YAAa,OAAO,aAAa,iBAAiB,iBAAiB,cAAc,YAAM,cAAN,mBAAiB,MAAM,MAAM,eAAe,gBAAU,cAAV,mBAAqB,MAAM,MAAM,YAAY,QAAQ,cAAc,eAAe,WAAW,QAAQ,SAAS,SAAS,UAAU,oBAAoB,cAAc,WAAW,MAAM,WAAW,OAAO,oBAAoB,sBAAwB,OAAO,WAAW,cAAc,EAAE,OAAO,YAAY,MAAM,SAAS,gBAAiB,MAAM,WAAW,cAAc,cAAc,IAAI,KAAO;AAAA,MAC1jB;AAAA,IACF;AAEA,QAAI,SAAS,QAAQ;AACnB,aACE,wFACG,UACA,OACH;AAAA,IAEJ;AAEA,WAAO;AAAA,EACT,CAAC;AAED,YAAU,cAAc,aAAa;AAIrC,oCAAiB,CAAC,SAAS;AA7nB7B;AA8nBI,QAAI,QAAQ,IAAI,cAAc,aAAa;AAEzC;AAAA,IACF;AAEA,oBAAgB;AAGhB,oBAAgB,cAAc,aAAa;AAE3C,mBAAe,CAAC,CAAC,qBAAc,eAAd,mBAA0B;AAC3C,mBAAe,oBAAc,eAAd,mBAA0B;AACzC,mBAAe,qDAAe,eAAf,mBAA2B;AAC1C,mBACE,gBACA,oDAAoB,KAAK,OAAO,KAAK,gBAAgB,OAAO,KAAK,KAAK,MAAM,EAAE,GAAG;AACnF,yBAAqB,6CAAkB,aAAa,cAAc,cAAc,cAAc;AAAA,MAC5F,SAAS;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA,MACP,SAAS;AAAA,MACT,OAAO;AAAA,MACP,oBAAoB;AAAA,MACpB,qBAAqB;AAAA,IACvB,CAAC;AAED,UAAM,EAAE,OAAO,cAAc;AAC7B,yBAAqB,CAAC;AACtB,eAAW,OAAO,OAAO;AACvB,YAAM,IAAI,MAAM;AAChB,yBAAmB,OAAO,sCAAW,CAAC,IAAI,EAAE,MAAM;AAAA,IACpD;AACA,8BAA0B,+BAAW,OAAO;AAAA,MAC1C,MAAM;AAAA,IACR,CAAC;AAKD,UAAM,WAAW,kCACZ,YACA,UAAU;AAEf,QAAI,OAAO,KAAK,QAAQ,EAAE,QAAQ;AAChC,4BAAsB;AAAA,IACxB;AAOA,QAAI,QAAQ,IAAI,aAAa,iBAAiB,oBAAa,iBAAb,mBAA2B,QAAO;AAC9E,UAAI,QAAQ,IAAI,cAAc,aAAa;AACzC,gBAAQ,IAAI,cAAO,aAAa,iBAAiB,gBAAgB;AAAA,UAC/D;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF,CAAC;AAED,MAAI,MAA4D;AAEhE,MAAI,SAAS,MAAM;AACjB,UAAM,uBAAK,GAAG;AAAA,EAChB;AAEA,MAAI,kBAAkB;AAAA,IACpB,aAAa,aAAa,eAAe;AAAA,KACtC;AAGL,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,QAAI,qBAAqB;AAAA,EAC3B;AAGA,MAAI,iBAAiB,CAAC,WAAgB,SAAiC;AACrE,cAAU,kBAAkB,kDAC1B;AAAA,MACE;AAAA,OACG,OAFL;AAAA,MAGE,cAAc;AAAA,MACd,cAAc,kCACT,UAAU,eACV,6BAAM;AAAA,IAEb,IACA,GACF;AACA,WAAO;AAAA,EACT;AAEA,SAAO;AACT;AA1oBgB;AA+oBT,MAAM,SAAS,gBAMpB;AAAA,EACA,MAAM;AAAA,EACN,eAAe;AAAA,EACf,cAAc,iCACT,sCADS;AAAA,IAEZ,MAAM;AAAA,EACR;AAAA,EACA,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,WAAW,CAAC,MAAM,EAAE,aAAa;AAC/B,eAAO,QAAQ,OAAO,UAAU;AAChC,cAAM,SAAS,OAAO,KAAK,SAAS;AACpC,eAAO;AAAA,UACL,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,WAAW;AAAA,QACb;AAAA,MACF;AAAA,IACF;AAAA,IAEA,MAAM;AAAA,MACJ,MAAM;AAAA,QACJ,MAAM;AAAA,MACR;AAAA,IACF;AAAA,IAEA,WAAW;AAAA,MACT,YAAY;AAAA,QACV,QAAQ;AAAA,QACR,WAAW;AAAA,MACb;AAAA,MACA,UAAU;AAAA,QACR,OAAO;AAAA,QACP,UAAU;AAAA,MACZ;AAAA,IACF;AAAA,EACF;AACF,CAAC;AAEM,wBAAwB;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,GAOC;AA5xBH;AA6xBE,QAAM,eAAe,sBAAS,QAAQ,QAAQ;AAC9C,QAAM,MAAM,aAAa;AACzB,MAAI,QAAQ,GAAG;AACb,WAAO;AAAA,EACT;AACA,QAAM,OAAc,CAAC;AACrB,aAAW,CAAC,OAAO,UAAU,aAAa,QAAQ,GAAG;AACnD,QAAI,UAAU,QAAQ,UAAU,QAAW;AACzC;AAAA,IACF;AAEA,QAAI,CAAC,SAAU,MAAM,UAAU,CAAC,UAAW;AACzC,WAAK,KAAK,KAAK;AAAA,IACjB,OAAO;AACL,WAAK,KACH,mDAAC;AAAA,QAAS,KAAK;AAAA,SAAQ,WAAW,mDAAC,oBAAc,KAAM,IAAkB,KAAM,CACjF;AAAA,IACF;AAGA,QAAI,YAAM,YAAN,mBAAgB,qBAAqB;AACvC;AAAA,IACF;AAEA,QAAI,UAAU,MAAM,GAAG;AACrB,UAAI,OAAO;AACT,aAAK,KACH,mDAAC;AAAA,UACC,KAAK,IAAI;AAAA,UACT,WACE,kBAAkB,SAAS,kBAAkB,gBAAgB,eAAe;AAAA,UAE9E,MAAM;AAAA,WACD,aAAa;AAAA,UAChB,MAAM;AAAA,QACR,EACF,CACF;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAvDgB;AAyDT,sBAAsB,OAAY;AACvC,SAAO,wBACL,mDAAC;AAAA,IACC,OACE;AAAA,MACE,UAAU;AAAA,MACV,KAAK;AAAA,MACL,MAAM;AAAA,MACN,OAAO;AAAA,MACP,QAAQ;AAAA,IACV;AAAA,KAGD,MAAM,QACT,IAEA,mDAAC;AAAA,IAAK,OAAO,+BAAW;AAAA,KAAe,MAAM,KAAM;AAEvD;AAlBgB;",
   "names": []
 }

package/dist/cjs/helpers/addStylesUsingClassname.js

@@ -26,21 +26,26 @@ var import_react = require("react");
 var import_getStylesAtomic = require("./getStylesAtomic");
 var import_insertStyleRule = require("./insertStyleRule");
 let added = /* @__PURE__ */ new Set();
-const effect = import_react.useInsertionEffect || import_react.useLayoutEffect;
 function useStylesAsClassname(styles, disable = false, debug = false) {
-  const insertions = [];
-  const className = addStylesUsingClassname(disable ? [] : styles, debug, (identifier, rules) => {
-    for (const rule of rules) {
-      insertions.push({ identifier, rule });
-      (0, import_insertStyleRule.updateInsertedCache)(identifier, rule);
-    }
-  });
-  effect(() => {
+  if (!import_react.useInsertionEffect) {
+    return addStylesUsingClassname(disable ? styles : [], debug);
+  } else {
+    const insertions = [];
+    const className = addStylesUsingClassname(disable ? [] : styles, debug, (identifier, rules) => {
+      for (const rule of rules) {
+        insertions.push({ identifier, rule });
+      }
+    });
     for (const { identifier, rule } of insertions) {
-      (0, import_insertStyleRule.insertStyleRule)(identifier, rule);
+      (0, import_insertStyleRule.updateInsertedCache)(identifier, rule);
     }
-  }, [className]);
-  return className;
+    (0, import_react.useInsertionEffect)(() => {
+      for (const { identifier, rule } of insertions) {
+        (0, import_insertStyleRule.insertStyleRule)(identifier, rule);
+      }
+    });
+    return className;
+  }
 }
 __name(useStylesAsClassname, "useStylesAsClassname");
 function addStylesUsingClassname(styles, debug = false, onAdd) {

package/dist/cjs/helpers/addStylesUsingClassname.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/addStylesUsingClassname.tsx"],
-  "sourcesContent": ["// @ts-ignore\nimport { useInsertionEffect, useLayoutEffect } from 'react'\n\nimport { getStylesAtomic } from './getStylesAtomic'\nimport { insertStyleRule, updateInsertedCache } from './insertStyleRule'\n\n// could be cleared occasionally\nlet added = new Set<string>()\n\nconst effect = useInsertionEffect || useLayoutEffect\n\nexport function useStylesAsClassname(styles: any[], disable = false, debug = false) {\n  const insertions: any[] = []\n  const className = addStylesUsingClassname(disable ? [] : styles, debug, (identifier, rules) => {\n    for (const rule of rules) {\n      insertions.push({ identifier, rule })\n      updateInsertedCache(identifier, rule)\n    }\n  })\n  effect(() => {\n    for (const { identifier, rule } of insertions) {\n      insertStyleRule(identifier, rule)\n    }\n  }, [className])\n  return className\n}\n\nexport function addStylesUsingClassname(\n  styles: any[],\n  debug: boolean | 'verbose' = false,\n  onAdd?: (identifier: string, rules: string[]) => any\n) {\n  let className = ''\n  for (const style of styles) {\n    if (!style) continue\n    if (Array.isArray(style)) {\n      className += ' ' + addStylesUsingClassname(style)\n      continue\n    }\n    const atomicStyles = getStylesAtomic(style)\n    if (process.env.NODE_ENV === 'development') {\n      if (debug === 'verbose') {\n        console.log(' atomicStyles ', atomicStyles)\n      }\n    }\n    for (const { identifier, rules } of atomicStyles) {\n      className += ` ${identifier}`\n      if (added.has(identifier)) {\n        continue\n      }\n      added.add(identifier)\n      if (onAdd) {\n        onAdd(identifier, rules)\n      } else {\n        insertStyleRule(identifier, rules[0])\n      }\n    }\n  }\n  return className\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAoD;AAEpD,6BAAgC;AAChC,6BAAqD;AAGrD,IAAI,QAAQ,oBAAI,IAAY;AAE5B,MAAM,SAAS,mCAAsB;AAE9B,8BAA8B,QAAe,UAAU,OAAO,QAAQ,OAAO;AAClF,QAAM,aAAoB,CAAC;AAC3B,QAAM,YAAY,wBAAwB,UAAU,CAAC,IAAI,QAAQ,OAAO,CAAC,YAAY,UAAU;AAC7F,eAAW,QAAQ,OAAO;AACxB,iBAAW,KAAK,EAAE,YAAY,KAAK,CAAC;AACpC,sDAAoB,YAAY,IAAI;AAAA,IACtC;AAAA,EACF,CAAC;AACD,SAAO,MAAM;AACX,eAAW,EAAE,YAAY,UAAU,YAAY;AAC7C,kDAAgB,YAAY,IAAI;AAAA,IAClC;AAAA,EACF,GAAG,CAAC,SAAS,CAAC;AACd,SAAO;AACT;AAdgB;AAgBT,iCACL,QACA,QAA6B,OAC7B,OACA;AACA,MAAI,YAAY;AAChB,aAAW,SAAS,QAAQ;AAC1B,QAAI,CAAC;AAAO;AACZ,QAAI,MAAM,QAAQ,KAAK,GAAG;AACxB,mBAAa,MAAM,wBAAwB,KAAK;AAChD;AAAA,IACF;AACA,UAAM,eAAe,4CAAgB,KAAK;AAC1C,QAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,UAAI,UAAU,WAAW;AACvB,gBAAQ,IAAI,kBAAkB,YAAY;AAAA,MAC5C;AAAA,IACF;AACA,eAAW,EAAE,YAAY,WAAW,cAAc;AAChD,mBAAa,IAAI;AACjB,UAAI,MAAM,IAAI,UAAU,GAAG;AACzB;AAAA,MACF;AACA,YAAM,IAAI,UAAU;AACpB,UAAI,OAAO;AACT,cAAM,YAAY,KAAK;AAAA,MACzB,OAAO;AACL,oDAAgB,YAAY,MAAM,EAAE;AAAA,MACtC;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAhCgB;",
+  "sourcesContent": ["// @ts-ignore\nimport { useInsertionEffect } from 'react'\n\nimport { getStylesAtomic } from './getStylesAtomic'\nimport { insertStyleRule, updateInsertedCache } from './insertStyleRule'\n\n// TODO can drop most of this code once we drop support for 17\n// uses new useInsertionEffect for better perf if available\n\n// could be cleared occasionally\nlet added = new Set<string>()\n\nexport function useStylesAsClassname(styles: any[], disable = false, debug = false) {\n  if (!useInsertionEffect) {\n    return addStylesUsingClassname(disable ? styles : [], debug)\n  } else {\n    const insertions: any[] = []\n    const className = addStylesUsingClassname(disable ? [] : styles, debug, (identifier, rules) => {\n      for (const rule of rules) {\n        insertions.push({ identifier, rule })\n      }\n    })\n    // avoid race conditions in lookups because useInsertionEffect is delayed\n    for (const { identifier, rule } of insertions) {\n      updateInsertedCache(identifier, rule)\n    }\n    useInsertionEffect(() => {\n      for (const { identifier, rule } of insertions) {\n        insertStyleRule(identifier, rule)\n      }\n    })\n    return className\n  }\n}\n\nexport function addStylesUsingClassname(\n  styles: any[],\n  debug: boolean | 'verbose' = false,\n  onAdd?: (identifier: string, rules: string[]) => any\n) {\n  let className = ''\n  for (const style of styles) {\n    if (!style) continue\n    if (Array.isArray(style)) {\n      className += ' ' + addStylesUsingClassname(style)\n      continue\n    }\n    const atomicStyles = getStylesAtomic(style)\n    if (process.env.NODE_ENV === 'development') {\n      if (debug === 'verbose') {\n        console.log(' atomicStyles ', atomicStyles)\n      }\n    }\n    for (const { identifier, rules } of atomicStyles) {\n      className += ` ${identifier}`\n      if (added.has(identifier)) {\n        continue\n      }\n      added.add(identifier)\n      if (onAdd) {\n        onAdd(identifier, rules)\n      } else {\n        insertStyleRule(identifier, rules[0])\n      }\n    }\n  }\n  return className\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAmC;AAEnC,6BAAgC;AAChC,6BAAqD;AAMrD,IAAI,QAAQ,oBAAI,IAAY;AAErB,8BAA8B,QAAe,UAAU,OAAO,QAAQ,OAAO;AAClF,MAAI,CAAC,iCAAoB;AACvB,WAAO,wBAAwB,UAAU,SAAS,CAAC,GAAG,KAAK;AAAA,EAC7D,OAAO;AACL,UAAM,aAAoB,CAAC;AAC3B,UAAM,YAAY,wBAAwB,UAAU,CAAC,IAAI,QAAQ,OAAO,CAAC,YAAY,UAAU;AAC7F,iBAAW,QAAQ,OAAO;AACxB,mBAAW,KAAK,EAAE,YAAY,KAAK,CAAC;AAAA,MACtC;AAAA,IACF,CAAC;AAED,eAAW,EAAE,YAAY,UAAU,YAAY;AAC7C,sDAAoB,YAAY,IAAI;AAAA,IACtC;AACA,yCAAmB,MAAM;AACvB,iBAAW,EAAE,YAAY,UAAU,YAAY;AAC7C,oDAAgB,YAAY,IAAI;AAAA,MAClC;AAAA,IACF,CAAC;AACD,WAAO;AAAA,EACT;AACF;AArBgB;AAuBT,iCACL,QACA,QAA6B,OAC7B,OACA;AACA,MAAI,YAAY;AAChB,aAAW,SAAS,QAAQ;AAC1B,QAAI,CAAC;AAAO;AACZ,QAAI,MAAM,QAAQ,KAAK,GAAG;AACxB,mBAAa,MAAM,wBAAwB,KAAK;AAChD;AAAA,IACF;AACA,UAAM,eAAe,4CAAgB,KAAK;AAC1C,QAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,UAAI,UAAU,WAAW;AACvB,gBAAQ,IAAI,kBAAkB,YAAY;AAAA,MAC5C;AAAA,IACF;AACA,eAAW,EAAE,YAAY,WAAW,cAAc;AAChD,mBAAa,IAAI;AACjB,UAAI,MAAM,IAAI,UAAU,GAAG;AACzB;AAAA,MACF;AACA,YAAM,IAAI,UAAU;AACpB,UAAI,OAAO;AACT,cAAM,YAAY,KAAK;AAAA,MACzB,OAAO;AACL,oDAAgB,YAAY,MAAM,EAAE;AAAA,MACtC;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAhCgB;",
   "names": []
 }

package/dist/cjs/helpers/createPropMapper.js

@@ -84,7 +84,7 @@ const createPropMapper = /* @__PURE__ */ __name((staticConfig) => {
         if ((0, import_isObj.isObj)(variantValue)) {
           variantValue = resolveTokens(variantValue, conf, theme, fontFamily, returnVariablesAs);
         }
-        return variantValue;
+        return expansions(variantValue);
       }
     }
     let shouldReturn = false;
@@ -101,9 +101,9 @@ const createPropMapper = /* @__PURE__ */ __name((staticConfig) => {
       }
     }
     if (shouldReturn) {
-      return {
+      return expansions({
         [key]: value
-      };
+      });
     }
   };
 }, "createPropMapper");
@@ -221,6 +221,36 @@ const tokenCategories = {
     borderRightColor: true
   }
 };
+const sidesX = ["Left", "Right"];
+const sidesY = ["Top", "Bottom"];
+const sidesXY = [...sidesX, ...sidesY];
+const expand = {
+  padding: sidesXY.map((x) => `padding${x}`),
+  paddingHorizontal: sidesX.map((x) => `padding${x}`),
+  paddingVertical: sidesY.map((x) => `padding${x}`),
+  margin: sidesXY.map((x) => `margin${x}`),
+  marginHorizontal: sidesX.map((x) => `margin${x}`),
+  marginVertical: sidesY.map((x) => `margin${x}`)
+};
+function expansions(styleObj) {
+  for (const key in expand) {
+    if (key in styleObj) {
+      for (const expandKey of expand[key]) {
+        styleObj[expandKey] = styleObj[key];
+      }
+      delete styleObj[key];
+    }
+  }
+  if ("flex" in styleObj) {
+    if (typeof styleObj.flex === "number") {
+      styleObj.flexGrow = styleObj.flexGrow ?? styleObj.flex;
+      styleObj.flexShrink = styleObj.flexShrink ?? 1;
+      delete styleObj.flex;
+    }
+  }
+  return styleObj;
+}
+__name(expansions, "expansions");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   createPropMapper

package/dist/cjs/helpers/createPropMapper.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/createPropMapper.ts"],
-  "sourcesContent": ["import { getConfig } from '../conf'\nimport { isWeb } from '../constants/platform'\nimport { Variable, isVariable } from '../createVariable'\nimport { StaticConfig, TamaguiInternalConfig, VariantSpreadFunction } from '../types'\nimport { isObj } from './isObj'\n\nexport type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both'\n\n// goes through specificity finding best matching variant function\nfunction getVariantFunction(variant: any, key: string, value: any) {\n  if (typeof variant === 'function') {\n    return variant\n  }\n  for (const cat in tokenCategories) {\n    if (key in tokenCategories[cat]) {\n      const spreadVariant = variant[`...${cat}`]\n      if (spreadVariant) {\n        return spreadVariant\n      }\n    }\n  }\n  let fn: any\n  if (typeof value === 'number') {\n    fn = variant[':number']\n  } else if (typeof value === 'string') {\n    fn = variant[':string']\n  } else if (value === true || value === false) {\n    fn = variant[':boolean']\n  }\n  fn = fn || variant[value]\n  // fallback to size ultimately - could do token level detection\n  return fn || variant['...'] || variant['...size']\n}\n\nexport const createPropMapper = (staticConfig: Partial<StaticConfig>) => {\n  const variants = staticConfig.variants || {}\n  const defaultProps = staticConfig.defaultProps || {}\n\n  return (\n    key: string,\n    value: any,\n    theme: any,\n    props: any,\n    returnVariablesAs: ResolveVariableTypes = !!props.animation ? 'value' : 'auto',\n    avoidDefaultProps = false\n  ) => {\n    const conf = getConfig()\n    if (!conf) {\n      console.trace('no conf! err')\n      return\n    }\n\n    // handled here because we need to resolve this off tokens, its the only one-off like this\n    const fontFamily = props.fontFamily || defaultProps.fontFamily || '$body'\n    const variant = variants && variants[key]\n\n    if (variant && value !== undefined) {\n      let variantValue = getVariantFunction(variant, key, value)\n\n      if (variantValue) {\n        if (typeof variantValue === 'function') {\n          const fn = variantValue as VariantSpreadFunction<any>\n          variantValue = fn(value, {\n            fonts: conf.fontsParsed,\n            tokens: conf.tokensParsed,\n            theme,\n            // TODO do this in splitstlye\n            // we avoid passing in default props for media queries because that would confuse things like SizableText.size:\n            props: avoidDefaultProps\n              ? props\n              : new Proxy(props, {\n                  get(target, key) {\n                    if (Reflect.has(target, key)) {\n                      return Reflect.get(target, key)\n                    }\n                    // these props may be extracted into classNames, but we still want to access them\n                    // at runtime, so we proxy back to defaultProps but don't pass them\n                    if (defaultProps) {\n                      return Reflect.get(defaultProps, key)\n                    }\n                  },\n                }),\n          })\n        }\n\n        if (isObj(variantValue)) {\n          variantValue = resolveTokens(variantValue, conf, theme, fontFamily, returnVariablesAs)\n        }\n\n        return variantValue\n      }\n    }\n\n    let shouldReturn = false\n\n    // handle shorthands\n    if (conf.shorthands[key]) {\n      shouldReturn = true\n      key = conf.shorthands[key]\n    }\n\n    if (value) {\n      shouldReturn = true\n      if (value[0] === '$') {\n        value = getToken(key, value, conf, theme, fontFamily, returnVariablesAs)\n      } else if (isVariable(value)) {\n        value = getVariableValue(value, returnVariablesAs)\n      }\n    }\n\n    if (shouldReturn) {\n      return {\n        [key]: value,\n      }\n    }\n  }\n}\n\nconst resolveTokens = (\n  input: Object,\n  conf: TamaguiInternalConfig,\n  theme: any,\n  fontFamily: any,\n  resolveAs?: ResolveVariableTypes\n) => {\n  let res = {}\n  for (const rKey in input) {\n    const fKey = conf.shorthands[rKey] || rKey\n    const val = input[rKey]\n    if (isVariable(val)) {\n      res[fKey] =\n        resolveAs === 'variable' ? val : !isWeb || resolveAs === 'value' ? val.val : val.variable\n    } else if (typeof val === 'string') {\n      const fVal = val[0] === '$' ? getToken(fKey, val, conf, theme, fontFamily, resolveAs) : val\n      res[fKey] = fVal\n    } else {\n      if (isObj(val)) {\n        // for things like shadowOffset, hoverStyle which is a sub-object\n        res[fKey] = resolveTokens(val, conf, theme, fontFamily, resolveAs)\n      } else {\n        // nullish values cant be tokens so need no exrta parsing\n        res[fKey] = input[fKey]\n      }\n    }\n    if (process.env.NODE_ENV === 'development') {\n      if (res[fKey]?.[0] === '$') {\n        console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey])\n      }\n    }\n  }\n  return res\n}\n\nconst fontShorthand = {\n  fontSize: 'size',\n  fontWeight: 'weight',\n}\n\nconst getToken = (\n  key: string,\n  value: string,\n  { tokensParsed, fontsParsed }: TamaguiInternalConfig,\n  theme: any,\n  fontFamily: string | undefined = '$body',\n  resolveAs?: ResolveVariableTypes\n) => {\n  let valOrVar: any\n  let hasSet = false\n  if (value in theme) {\n    valOrVar = theme[value]\n    hasSet = true\n  } else {\n    switch (key) {\n      case 'fontFamily':\n        valOrVar = fontsParsed[value]?.family || value\n        hasSet = true\n        break\n      case 'fontSize':\n      case 'lineHeight':\n      case 'letterSpacing':\n      case 'fontWeight':\n        valOrVar = fontsParsed[fontFamily]?.[fontShorthand[key] || key]?.[value] || value\n        hasSet = true\n        break\n    }\n    for (const cat in tokenCategories) {\n      if (key in tokenCategories[cat]) {\n        const res = tokensParsed[cat][value]\n        if (res) {\n          valOrVar = res\n          hasSet = true\n        }\n      }\n    }\n    if (!hasSet) {\n      const spaceVar = tokensParsed.space[value]\n      if (spaceVar) {\n        valOrVar = spaceVar\n        hasSet = true\n      }\n    }\n  }\n  if (hasSet) {\n    return getVariableValue(valOrVar, resolveAs)\n  }\n  if (process.env.NODE_ENV === 'development') {\n    if (value && value[0] === '$') {\n      console.warn(`\u26A0\uFE0F Missing token:`, key, value, fontFamily, theme, fontsParsed)\n      return null\n    }\n  }\n  return value\n}\n\nfunction getVariableValue(valOrVar: Variable | any, resolveAs: ResolveVariableTypes = 'auto') {\n  if (isVariable(valOrVar)) {\n    if (resolveAs === 'variable') {\n      return valOrVar\n    }\n    if (!isWeb || resolveAs === 'value') {\n      return valOrVar.val\n    }\n    return valOrVar.variable\n  }\n  return valOrVar\n}\n\n// just specificy the least costly, all else go to `space` (most keys - we can exclude)\nconst tokenCategories = {\n  radius: {\n    borderRadius: true,\n  },\n  size: {\n    width: true,\n    height: true,\n    minWidth: true,\n    minHeight: true,\n    maxWidth: true,\n    maxHeight: true,\n  },\n  color: {\n    color: true,\n    backgroundColor: true,\n    borderColor: true,\n    borderBottomColor: true,\n    borderTopColor: true,\n    borderLeftColor: true,\n    borderRightColor: true,\n  },\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { getConfig } from '../conf'\nimport { isWeb } from '../constants/platform'\nimport { Variable, isVariable } from '../createVariable'\nimport { StaticConfig, TamaguiInternalConfig, VariantSpreadFunction } from '../types'\nimport { isObj } from './isObj'\n\nexport type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both'\n\n// goes through specificity finding best matching variant function\nfunction getVariantFunction(variant: any, key: string, value: any) {\n  if (typeof variant === 'function') {\n    return variant\n  }\n  for (const cat in tokenCategories) {\n    if (key in tokenCategories[cat]) {\n      const spreadVariant = variant[`...${cat}`]\n      if (spreadVariant) {\n        return spreadVariant\n      }\n    }\n  }\n  let fn: any\n  if (typeof value === 'number') {\n    fn = variant[':number']\n  } else if (typeof value === 'string') {\n    fn = variant[':string']\n  } else if (value === true || value === false) {\n    fn = variant[':boolean']\n  }\n  fn = fn || variant[value]\n  // fallback to size ultimately - could do token level detection\n  return fn || variant['...'] || variant['...size']\n}\n\nexport const createPropMapper = (staticConfig: Partial<StaticConfig>) => {\n  const variants = staticConfig.variants || {}\n  const defaultProps = staticConfig.defaultProps || {}\n\n  return (\n    key: string,\n    value: any,\n    theme: any,\n    props: any,\n    returnVariablesAs: ResolveVariableTypes = !!props.animation ? 'value' : 'auto',\n    avoidDefaultProps = false\n  ) => {\n    const conf = getConfig()\n    if (!conf) {\n      console.trace('no conf! err')\n      return\n    }\n\n    // handled here because we need to resolve this off tokens, its the only one-off like this\n    const fontFamily = props.fontFamily || defaultProps.fontFamily || '$body'\n    const variant = variants && variants[key]\n\n    if (variant && value !== undefined) {\n      let variantValue = getVariantFunction(variant, key, value)\n\n      if (variantValue) {\n        if (typeof variantValue === 'function') {\n          const fn = variantValue as VariantSpreadFunction<any>\n          variantValue = fn(value, {\n            fonts: conf.fontsParsed,\n            tokens: conf.tokensParsed,\n            theme,\n            // TODO do this in splitstlye\n            // we avoid passing in default props for media queries because that would confuse things like SizableText.size:\n            props: avoidDefaultProps\n              ? props\n              : new Proxy(props, {\n                  get(target, key) {\n                    if (Reflect.has(target, key)) {\n                      return Reflect.get(target, key)\n                    }\n                    // these props may be extracted into classNames, but we still want to access them\n                    // at runtime, so we proxy back to defaultProps but don't pass them\n                    if (defaultProps) {\n                      return Reflect.get(defaultProps, key)\n                    }\n                  },\n                }),\n          })\n        }\n\n        if (isObj(variantValue)) {\n          variantValue = resolveTokens(variantValue, conf, theme, fontFamily, returnVariablesAs)\n        }\n\n        return expansions(variantValue)\n      }\n    }\n\n    let shouldReturn = false\n\n    // handle shorthands\n    if (conf.shorthands[key]) {\n      shouldReturn = true\n      key = conf.shorthands[key]\n    }\n\n    if (value) {\n      shouldReturn = true\n      if (value[0] === '$') {\n        value = getToken(key, value, conf, theme, fontFamily, returnVariablesAs)\n      } else if (isVariable(value)) {\n        value = getVariableValue(value, returnVariablesAs)\n      }\n    }\n\n    if (shouldReturn) {\n      return expansions({\n        [key]: value,\n      })\n    }\n  }\n}\n\nconst resolveTokens = (\n  input: Object,\n  conf: TamaguiInternalConfig,\n  theme: any,\n  fontFamily: any,\n  resolveAs?: ResolveVariableTypes\n) => {\n  let res = {}\n  for (const rKey in input) {\n    const fKey = conf.shorthands[rKey] || rKey\n    const val = input[rKey]\n    if (isVariable(val)) {\n      res[fKey] =\n        resolveAs === 'variable' ? val : !isWeb || resolveAs === 'value' ? val.val : val.variable\n    } else if (typeof val === 'string') {\n      const fVal = val[0] === '$' ? getToken(fKey, val, conf, theme, fontFamily, resolveAs) : val\n      res[fKey] = fVal\n    } else {\n      if (isObj(val)) {\n        // for things like shadowOffset, hoverStyle which is a sub-object\n        res[fKey] = resolveTokens(val, conf, theme, fontFamily, resolveAs)\n      } else {\n        // nullish values cant be tokens so need no exrta parsing\n        res[fKey] = input[fKey]\n      }\n    }\n    if (process.env.NODE_ENV === 'development') {\n      if (res[fKey]?.[0] === '$') {\n        console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey])\n      }\n    }\n  }\n  return res\n}\n\nconst fontShorthand = {\n  fontSize: 'size',\n  fontWeight: 'weight',\n}\n\nconst getToken = (\n  key: string,\n  value: string,\n  { tokensParsed, fontsParsed }: TamaguiInternalConfig,\n  theme: any,\n  fontFamily: string | undefined = '$body',\n  resolveAs?: ResolveVariableTypes\n) => {\n  let valOrVar: any\n  let hasSet = false\n  if (value in theme) {\n    valOrVar = theme[value]\n    hasSet = true\n  } else {\n    switch (key) {\n      case 'fontFamily':\n        valOrVar = fontsParsed[value]?.family || value\n        hasSet = true\n        break\n      case 'fontSize':\n      case 'lineHeight':\n      case 'letterSpacing':\n      case 'fontWeight':\n        valOrVar = fontsParsed[fontFamily]?.[fontShorthand[key] || key]?.[value] || value\n        hasSet = true\n        break\n    }\n    for (const cat in tokenCategories) {\n      if (key in tokenCategories[cat]) {\n        const res = tokensParsed[cat][value]\n        if (res) {\n          valOrVar = res\n          hasSet = true\n        }\n      }\n    }\n    if (!hasSet) {\n      const spaceVar = tokensParsed.space[value]\n      if (spaceVar) {\n        valOrVar = spaceVar\n        hasSet = true\n      }\n    }\n  }\n  if (hasSet) {\n    return getVariableValue(valOrVar, resolveAs)\n  }\n  if (process.env.NODE_ENV === 'development') {\n    if (value && value[0] === '$') {\n      console.warn(`\u26A0\uFE0F Missing token:`, key, value, fontFamily, theme, fontsParsed)\n      return null\n    }\n  }\n  return value\n}\n\nfunction getVariableValue(valOrVar: Variable | any, resolveAs: ResolveVariableTypes = 'auto') {\n  if (isVariable(valOrVar)) {\n    if (resolveAs === 'variable') {\n      return valOrVar\n    }\n    if (!isWeb || resolveAs === 'value') {\n      return valOrVar.val\n    }\n    return valOrVar.variable\n  }\n  return valOrVar\n}\n\n// just specificy the least costly, all else go to `space` (most keys - we can exclude)\nconst tokenCategories = {\n  radius: {\n    borderRadius: true,\n  },\n  size: {\n    width: true,\n    height: true,\n    minWidth: true,\n    minHeight: true,\n    maxWidth: true,\n    maxHeight: true,\n  },\n  color: {\n    color: true,\n    backgroundColor: true,\n    borderColor: true,\n    borderBottomColor: true,\n    borderTopColor: true,\n    borderLeftColor: true,\n    borderRightColor: true,\n  },\n}\n\n// TODO need to move to own engine for all this... duplicating some functionality temporarily\n\nconst sidesX = ['Left', 'Right']\nconst sidesY = ['Top', 'Bottom']\nconst sidesXY = [...sidesX, ...sidesY]\nconst expand = {\n  padding: sidesXY.map((x) => `padding${x}`),\n  paddingHorizontal: sidesX.map((x) => `padding${x}`),\n  paddingVertical: sidesY.map((x) => `padding${x}`),\n  margin: sidesXY.map((x) => `margin${x}`),\n  marginHorizontal: sidesX.map((x) => `margin${x}`),\n  marginVertical: sidesY.map((x) => `margin${x}`),\n}\n\nfunction expansions(styleObj: Record<string, any>) {\n  for (const key in expand) {\n    if (key in styleObj) {\n      for (const expandKey of expand[key]) {\n        styleObj[expandKey] = styleObj[key]\n      }\n      delete styleObj[key]\n    }\n  }\n  if ('flex' in styleObj) {\n    // see spec for flex shorthand https://developer.mozilla.org/en-US/docs/Web/CSS/flex\n    if (typeof styleObj.flex === 'number') {\n      styleObj.flexGrow = styleObj.flexGrow ?? styleObj.flex\n      styleObj.flexShrink = styleObj.flexShrink ?? 1\n      delete styleObj.flex\n    }\n  }\n  return styleObj\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/cjs/helpers/fixNativeShadow.native.js

@@ -22,30 +22,34 @@ __export(fixNativeShadow_native_exports, {
 });
 module.exports = __toCommonJS(fixNativeShadow_native_exports);
 const matchRgbaHsla = /(rgba|hsla)\(\s*([\d\.]{1,}%?)\s*,\s*([\d\.]{1,}%?)\s*,\s*([\d\.]{1,}%?)\s*,\s*([\d\.]{1,})\s*\)$/;
-function fixNativeShadow(props) {
-  if (!props.shadowColor) {
+function fixNativeShadow(styles) {
+  const color = styles.find((x) => x[0] === "shadowColor");
+  if (!color) {
     return;
   }
-  if (!props.shadowOffset) {
-    props.shadowOffset = {
-      width: 0,
-      height: 0
-    };
+  if (!styles.find((x) => x[0] === "shadowOffset")) {
+    styles.push([
+      "shadowOffset",
+      {
+        width: 0,
+        height: 0
+      }
+    ]);
   }
-  if ("shadowOpacity" in props) {
+  if (styles.find((x) => x[0] === "shadowOpacity")) {
     return;
   }
-  const c = `${props.shadowColor}`;
+  const c = `${color[1]}`;
   if ((c[0] === "r" || c[0] === "h") && c[3] === "a") {
     const [_, type, _1, _2, _3, a] = c.match(matchRgbaHsla) || [];
     if (typeof a !== "string") {
       console.trace("invalid", c, type);
       throw new Error(`invalid style`);
     }
-    props.shadowColor = `${type.replace("a", "")}(${_1},${_2},${_3})`;
-    props.shadowOpacity = +a;
+    styles.push(["shadowColor", `${type.replace("a", "")}(${_1},${_2},${_3})`]);
+    styles.push(["shadowOpacity", +a]);
   } else {
-    props.shadowOpacity = 1;
+    styles.push(["shadowOpacity", 1]);
   }
 }
 __name(fixNativeShadow, "fixNativeShadow");

package/dist/cjs/helpers/fixNativeShadow.native.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/fixNativeShadow.native.tsx"],
-  "sourcesContent": ["const matchRgbaHsla =\n  /(rgba|hsla)\\(\\s*([\\d\\.]{1,}%?)\\s*,\\s*([\\d\\.]{1,}%?)\\s*,\\s*([\\d\\.]{1,}%?)\\s*,\\s*([\\d\\.]{1,})\\s*\\)$/\n\nexport function fixNativeShadow(props: any) {\n  if (!props.shadowColor) {\n    return\n  }\n  if (!props.shadowOffset) {\n    // fixes some broken shadows\n    props.shadowOffset = {\n      width: 0,\n      height: 0,\n    }\n  }\n  if ('shadowOpacity' in props) {\n    return\n  }\n  const c = `${props.shadowColor}`\n  // react native has issues sometimes with rgba()\n  // supports rgba + hsla\n  if ((c[0] === 'r' || c[0] === 'h') && c[3] === 'a') {\n    const [_, type, _1, _2, _3, a] = c.match(matchRgbaHsla) || []\n    if (typeof a !== 'string') {\n      console.trace('invalid', c, type)\n      throw new Error(`invalid style`)\n    }\n    props.shadowColor = `${type.replace('a', '')}(${_1},${_2},${_3})`\n    props.shadowOpacity = +a\n  } else {\n    props.shadowOpacity = 1\n  }\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAAM,gBACJ;AAEK,yBAAyB,OAAY;AAC1C,MAAI,CAAC,MAAM,aAAa;AACtB;AAAA,EACF;AACA,MAAI,CAAC,MAAM,cAAc;AAEvB,UAAM,eAAe;AAAA,MACnB,OAAO;AAAA,MACP,QAAQ;AAAA,IACV;AAAA,EACF;AACA,MAAI,mBAAmB,OAAO;AAC5B;AAAA,EACF;AACA,QAAM,IAAI,GAAG,MAAM;AAGnB,MAAK,GAAE,OAAO,OAAO,EAAE,OAAO,QAAQ,EAAE,OAAO,KAAK;AAClD,UAAM,CAAC,GAAG,MAAM,IAAI,IAAI,IAAI,KAAK,EAAE,MAAM,aAAa,KAAK,CAAC;AAC5D,QAAI,OAAO,MAAM,UAAU;AACzB,cAAQ,MAAM,WAAW,GAAG,IAAI;AAChC,YAAM,IAAI,MAAM,eAAe;AAAA,IACjC;AACA,UAAM,cAAc,GAAG,KAAK,QAAQ,KAAK,EAAE,KAAK,MAAM,MAAM;AAC5D,UAAM,gBAAgB,CAAC;AAAA,EACzB,OAAO;AACL,UAAM,gBAAgB;AAAA,EACxB;AACF;AA5BgB;",
+  "sourcesContent": ["const matchRgbaHsla =\n  /(rgba|hsla)\\(\\s*([\\d\\.]{1,}%?)\\s*,\\s*([\\d\\.]{1,}%?)\\s*,\\s*([\\d\\.]{1,}%?)\\s*,\\s*([\\d\\.]{1,})\\s*\\)$/\n\nexport function fixNativeShadow(styles: [string, any][]) {\n  const color = styles.find((x) => x[0] === 'shadowColor')\n  if (!color) {\n    return\n  }\n  if (!styles.find((x) => x[0] === 'shadowOffset')) {\n    // fixes some broken shadows\n    styles.push([\n      'shadowOffset',\n      {\n        width: 0,\n        height: 0,\n      },\n    ])\n  }\n  if (styles.find((x) => x[0] === 'shadowOpacity')) {\n    return\n  }\n  const c = `${color[1]}`\n  // react native has issues sometimes with rgba()\n  // supports rgba + hsla\n  if ((c[0] === 'r' || c[0] === 'h') && c[3] === 'a') {\n    const [_, type, _1, _2, _3, a] = c.match(matchRgbaHsla) || []\n    if (typeof a !== 'string') {\n      console.trace('invalid', c, type)\n      throw new Error(`invalid style`)\n    }\n    styles.push(['shadowColor', `${type.replace('a', '')}(${_1},${_2},${_3})`])\n    styles.push(['shadowOpacity', +a])\n  } else {\n    styles.push(['shadowOpacity', 1])\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAAM,gBACJ;AAEK,yBAAyB,QAAyB;AACvD,QAAM,QAAQ,OAAO,KAAK,CAAC,MAAM,EAAE,OAAO,aAAa;AACvD,MAAI,CAAC,OAAO;AACV;AAAA,EACF;AACA,MAAI,CAAC,OAAO,KAAK,CAAC,MAAM,EAAE,OAAO,cAAc,GAAG;AAEhD,WAAO,KAAK;AAAA,MACV;AAAA,MACA;AAAA,QACE,OAAO;AAAA,QACP,QAAQ;AAAA,MACV;AAAA,IACF,CAAC;AAAA,EACH;AACA,MAAI,OAAO,KAAK,CAAC,MAAM,EAAE,OAAO,eAAe,GAAG;AAChD;AAAA,EACF;AACA,QAAM,IAAI,GAAG,MAAM;AAGnB,MAAK,GAAE,OAAO,OAAO,EAAE,OAAO,QAAQ,EAAE,OAAO,KAAK;AAClD,UAAM,CAAC,GAAG,MAAM,IAAI,IAAI,IAAI,KAAK,EAAE,MAAM,aAAa,KAAK,CAAC;AAC5D,QAAI,OAAO,MAAM,UAAU;AACzB,cAAQ,MAAM,WAAW,GAAG,IAAI;AAChC,YAAM,IAAI,MAAM,eAAe;AAAA,IACjC;AACA,WAAO,KAAK,CAAC,eAAe,GAAG,KAAK,QAAQ,KAAK,EAAE,KAAK,MAAM,MAAM,KAAK,CAAC;AAC1E,WAAO,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC;AAAA,EACnC,OAAO;AACL,WAAO,KAAK,CAAC,iBAAiB,CAAC,CAAC;AAAA,EAClC;AACF;AAhCgB;",
   "names": []
 }

package/dist/cjs/helpers/getButtonSize.js

@@ -0,0 +1,48 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var getButtonSize_exports = {};
+__export(getButtonSize_exports, {
+  getButtonSize: () => getButtonSize
+});
+module.exports = __toCommonJS(getButtonSize_exports);
+var import_core = require("@tamagui/core");
+const getButtonSize = /* @__PURE__ */ __name((sizeX = 0.9, sizeY = 0.333) => (val, { tokens, props, fonts }) => {
+  const size = tokens.size[val] ?? tokens.size["$4"] ?? val ?? 14;
+  const radius = tokens.radius[val] ?? tokens.radius["$4"] ?? size;
+  const px = Math.round(+((0, import_core.isVariable)(size) ? size.val : size) * sizeX);
+  const py = Math.round(+((0, import_core.isVariable)(size) ? size.val : size) * sizeY);
+  const font = fonts[props.fontFamily] || fonts["$body"];
+  const lineHeights = font.lineHeight;
+  const lineHeight = lineHeights[val] ?? lineHeights["$4"];
+  const minHeight = Math.round((0, import_core.getVariableValue)(lineHeight) + py * 2);
+  if (process.env.NODE_ENV === "development" && props["debug"]) {
+    console.log("getButtonSize", props.fontFamily, { size, py, val, lineHeight, minHeight });
+  }
+  return {
+    minHeight,
+    paddingHorizontal: props.circular ? 0 : px,
+    paddingVertical: props.circular ? 0 : py,
+    borderRadius: props.circular ? 1e5 : props.borderRadius ?? radius
+  };
+}, "getButtonSize");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  getButtonSize
+});
+//# sourceMappingURL=getButtonSize.js.map

package/dist/cjs/helpers/getButtonSize.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/helpers/getButtonSize.ts"],
+  "sourcesContent": ["import { VariantSpreadExtras, getVariableValue, isVariable } from '@tamagui/core'\n\n// for use in button-like things\n\nexport const getButtonSize =\n  (sizeX = 0.9, sizeY = 0.333) =>\n  (val: any, { tokens, props, fonts }: VariantSpreadExtras<any>) => {\n    const size = tokens.size[val] ?? tokens.size['$4'] ?? val ?? 14\n    const radius = tokens.radius[val] ?? tokens.radius['$4'] ?? size\n    const px = Math.round(+(isVariable(size) ? size.val : size) * sizeX)\n    const py = Math.round(+(isVariable(size) ? size.val : size) * sizeY)\n    // keep buttons height aligned to the font used\n    const font = fonts[props.fontFamily] || fonts['$body']\n    const lineHeights = font.lineHeight\n    const lineHeight = lineHeights[val] ?? lineHeights['$4']\n    const minHeight = Math.round(getVariableValue(lineHeight) + py * 2)\n    if (process.env.NODE_ENV === 'development' && props['debug']) {\n      console.log('getButtonSize', props.fontFamily, { size, py, val, lineHeight, minHeight })\n    }\n    return {\n      minHeight,\n      paddingHorizontal: props.circular ? 0 : px,\n      paddingVertical: props.circular ? 0 : py,\n      borderRadius: props.circular ? 100_000 : props.borderRadius ?? radius,\n    }\n  }\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAkE;AAI3D,MAAM,gBACX,wBAAC,QAAQ,KAAK,QAAQ,UACtB,CAAC,KAAU,EAAE,QAAQ,OAAO,YAAsC;AAChE,QAAM,OAAO,OAAO,KAAK,QAAQ,OAAO,KAAK,SAAS,OAAO;AAC7D,QAAM,SAAS,OAAO,OAAO,QAAQ,OAAO,OAAO,SAAS;AAC5D,QAAM,KAAK,KAAK,MAAM,CAAE,6BAAW,IAAI,IAAI,KAAK,MAAM,QAAQ,KAAK;AACnE,QAAM,KAAK,KAAK,MAAM,CAAE,6BAAW,IAAI,IAAI,KAAK,MAAM,QAAQ,KAAK;AAEnE,QAAM,OAAO,MAAM,MAAM,eAAe,MAAM;AAC9C,QAAM,cAAc,KAAK;AACzB,QAAM,aAAa,YAAY,QAAQ,YAAY;AACnD,QAAM,YAAY,KAAK,MAAM,kCAAiB,UAAU,IAAI,KAAK,CAAC;AAClE,MAAI,QAAQ,IAAI,aAAa,iBAAiB,MAAM,UAAU;AAC5D,YAAQ,IAAI,iBAAiB,MAAM,YAAY,EAAE,MAAM,IAAI,KAAK,YAAY,UAAU,CAAC;AAAA,EACzF;AACA,SAAO;AAAA,IACL;AAAA,IACA,mBAAmB,MAAM,WAAW,IAAI;AAAA,IACxC,iBAAiB,MAAM,WAAW,IAAI;AAAA,IACtC,cAAc,MAAM,WAAW,MAAU,MAAM,gBAAgB;AAAA,EACjE;AACF,GApBA;",
+  "names": []
+}