tamagui 1.74.21 → 1.75.0

package/dist/native.js

@@ -3431,7 +3431,7 @@ var require_ThemeManager_native = __commonJS({
       }
       updateStateFromProps(props = this.props || {}, shouldNotify = !0) {
         if (this.props = props, props.forceTheme)
-          return this.state.theme = props.forceTheme, this.state.name = props.name || "", !0;
+          return this.state.theme = props.forceTheme, this.state.name = props.name || "", this.updateState(this.state, !0), this.state;
         let nextState = this.getStateIfChanged(props);
         if (nextState)
           return this.updateState(nextState, shouldNotify), nextState;
@@ -3482,7 +3482,7 @@ var require_ThemeManager_native = __commonJS({
       if (!baseManager && props.reset)
         return process.env.NODE_ENV !== "production" && console.warn("Cannot reset, no parent theme exists"), null;
       let { componentName } = props, result = null, baseName = (baseManager == null ? void 0 : baseManager.state.name) || "";
-      baseManager != null && baseManager.state.isComponent && (baseName = baseName.replace(/_[A-Z][a-z]+/, ""));
+      baseManager != null && baseManager.state.isComponent && (baseName = baseName.replace(/_[A-Z][A-Za-z]+/, ""));
       let nextName = props.reset ? baseName : props.name || "", allComponentThemes = componentManagers.map((x) => (x == null ? void 0 : x.state.name) || "");
       isDirectParentAComponentTheme && allComponentThemes.shift();
       let base = baseName.split(import_constants2.THEME_NAME_SEPARATOR), max2 = base.length, min2 = props.componentName && !nextName ? max2 : 0;
@@ -3612,7 +3612,7 @@ var require_useTheme_native = __commonJS({
 
 If this is intended and you are using Tamagui without any themes, you can disable this warning by setting the environment variable TAMAGUI_DISABLE_NO_THEME_WARNING=1`
       );
-      let themeProxied = (0, import_react2.useMemo)(() => !themeManager || !(state != null && state.theme) ? {} : getThemeProxied(state, props.deopt, themeManager, keys.current, props.debug), [state, themeManager, props.deopt, props.debug]);
+      let themeProxied = (0, import_react2.useMemo)(() => !themeManager || !(state != null && state.theme) ? {} : getThemeProxied(state, props.deopt, themeManager, keys.current, props.debug), [state == null ? void 0 : state.theme, themeManager, props.deopt, props.debug]);
       return process.env.NODE_ENV === "development" && props.debug === "verbose" && (console.groupCollapsed("  \u{1F539} useTheme =>", state == null ? void 0 : state.name), console.info("returning state", changedThemeState, "from props", props), console.groupEnd()), [changedThemeState, themeProxied];
     };
     function getThemeProxied({ theme, name, scheme }, deopt = !1, themeManager, keys, debug) {
@@ -3714,17 +3714,20 @@ If this is intended and you are using Tamagui without any themes, you can disabl
         isNewTheme && themeManager && activeThemeManagers.add(themeManager), (isNewTheme || getShouldUpdateTheme(themeManager)) && setThemeState(createState);
         let selfListenerDispose = themeManager.onChangeTheme((_a, _b, forced) => {
           forced && setThemeState((prev) => createState(prev, !0));
-        }), disposeChangeListener = parentManager == null ? void 0 : parentManager.onChangeTheme((name, manager) => {
-          let force = (shouldUpdate == null ? void 0 : shouldUpdate()) || props.deopt || props["disable-child-theme"], shouldTryUpdate = force ?? !!(keys != null && keys.length || isNewTheme);
-          process.env.NODE_ENV === "development" && props.debug && console.info(" \u{1F538} onChange", themeManager.id, {
-            force,
-            shouldTryUpdate,
-            props,
-            name,
-            manager,
-            keys
-          }), shouldTryUpdate && setThemeState(createState);
-        }, themeManager.id);
+        }), disposeChangeListener = parentManager == null ? void 0 : parentManager.onChangeTheme(
+          (name, manager, forced) => {
+            let force = forced || (shouldUpdate == null ? void 0 : shouldUpdate()) || props.deopt || props["disable-child-theme"], shouldTryUpdate = force ?? !!(keys != null && keys.length || isNewTheme);
+            process.env.NODE_ENV === "development" && props.debug && console.info(" \u{1F538} onChange", themeManager.id, {
+              force,
+              shouldTryUpdate,
+              props,
+              name,
+              manager,
+              keys
+            }), shouldTryUpdate && setThemeState(createState);
+          },
+          themeManager.id
+        );
         return () => {
           selfListenerDispose(), disposeChangeListener == null || disposeChangeListener(), activeThemeManagers.delete(themeManager);
         };
@@ -3757,14 +3760,14 @@ If this is intended and you are using Tamagui without any themes, you can disabl
         themeManager
       };
       function createState(prev, force = !1) {
-        if (prev && (shouldUpdate == null ? void 0 : shouldUpdate()) === !1)
+        if (prev && (shouldUpdate == null ? void 0 : shouldUpdate()) === !1 && !force)
           return prev;
         let themeManager2 = parentManager, state2;
         if ((0, import_ThemeManager.getHasThemeUpdatingProps)(props)) {
           let getNewThemeManager = () => new import_ThemeManager.ThemeManager(props, isRoot ? "root" : parentManager);
           if (prev != null && prev.themeManager) {
             themeManager2 = prev.themeManager;
-            let forceChange = !!(keys != null && keys.length), next = themeManager2.getState(props, parentManager), nextState = getShouldUpdateTheme(
+            let forceChange = force || !!(keys != null && keys.length), next = themeManager2.getState(props, parentManager), nextState = getShouldUpdateTheme(
               themeManager2,
               next,
               prev.state,
@@ -4116,7 +4119,7 @@ var require_createComponent_native = __commonJS({
         defaultPropsKeyOrder: defaultProps ? Object.keys(defaultProps) : []
       });
       let component = (0, import_react2.forwardRef)((propsIn, forwardedRef) => {
-        var _a2, _b, _c, _d, _e, _f, _i, _j, _k, _l, _m, _n, _o;
+        var _a2, _b, _c, _d, _e, _f, _i, _j, _k, _l, _m;
         if (process.env.NODE_ENV === "development" && startVisualizer && (startVisualizer(), startVisualizer = void 0), !hasSetupBaseViews) {
           hasSetupBaseViews = !0;
           let baseViews = (_b = (_a2 = import_setupHooks.hooks).getBaseViews) == null ? void 0 : _b.call(_a2);
@@ -4202,14 +4205,9 @@ var require_createComponent_native = __commonJS({
           componentName,
           disable: disableTheme,
           shallow: stateRef.current.themeShallow,
-          // if this returns undefined it defers to the keys tracking, so its only used to force either updates or no updates
-          shouldUpdate: () => (
-            // when we use $theme- styles we need to force it to re-render on theme changes (this can be optimized likely)
-            stateRef.current.isListeningToTheme
-          ),
           debug: debugProp
         };
-        themeStateProps.deopt = willBeAnimated;
+        typeof stateRef.current.isListeningToTheme == "boolean" && (themeStateProps.shouldUpdate = () => stateRef.current.isListeningToTheme), themeStateProps.deopt = willBeAnimated;
         let isExiting = !state.unmounted && (presence == null ? void 0 : presence[0]) === !1;
         if (process.env.NODE_ENV === "development") {
           let id = (0, import_react2.useId)();
@@ -4470,11 +4468,15 @@ If you meant to do this, you can disable this warning - either change untilMeasu
           isZStack,
           debug: debugProp
         });
-        asChild && (elementType = import_Slot.Slot, Object.assign(viewProps, { onPress, onLongPress })), process.env.NODE_ENV === "development" && time && time`spaced-as-child`, // in test mode disable perf unwrapping so react-testing-library finds Text properly
-        process.env.NODE_ENV !== "test" && (elementType === BaseText || elementType === BaseView) ? process.env.TAMAGUI_OPTIMIZE_NATIVE_VIEWS ? (viewProps.children = content, content = (0, import_react2.createElement)(
-          elementType === BaseText ? "RCTText" : "RCTView",
-          viewProps
-        )) : (viewProps.children = content, content = elementType.render(viewProps, viewProps.ref)) : content = (0, import_react2.createElement)(elementType, viewProps, content), import_setupHooks.hooks.useChildren && (content = (_m = (_l = import_setupHooks.hooks).useChildren) == null ? void 0 : _m.call(_l, content, viewProps, events, staticConfig)), process.env.NODE_ENV === "development" && time && time`create-element`;
+        asChild && (elementType = import_Slot.Slot, Object.assign(viewProps, { onPress, onLongPress })), process.env.NODE_ENV === "development" && time && time`spaced-as-child`;
+        let useChildrenResult;
+        import_setupHooks.hooks.useChildren && (useChildrenResult = import_setupHooks.hooks.useChildren(
+          elementType,
+          content,
+          viewProps,
+          events,
+          staticConfig
+        )), useChildrenResult ? content = useChildrenResult : content = (0, import_react2.createElement)(elementType, viewProps, content), process.env.NODE_ENV === "development" && time && time`create-element`;
         let subGroupContext = (0, import_react2.useMemo)(() => {
           if (groupName)
             return {
@@ -4522,8 +4524,8 @@ If you meant to do this, you can disable this warning - either change untilMeasu
               handlesPressEvents,
               willBeAnimated,
               isStringElement,
-              classNamesIn: (_n = props.className) == null ? void 0 : _n.split(" "),
-              classNamesOut: (_o = viewProps.className) == null ? void 0 : _o.split(" "),
+              classNamesIn: (_l = props.className) == null ? void 0 : _l.split(" "),
+              classNamesOut: (_m = viewProps.className) == null ? void 0 : _m.split(" "),
               events,
               shouldAttach,
               pseudos,
@@ -7293,6 +7295,226 @@ var require_index_native14 = __commonJS({
   }
 });
 
+// ../core/dist/cjs/createOptimizedView.native.js
+var require_createOptimizedView_native = __commonJS({
+  "../core/dist/cjs/createOptimizedView.native.js"(exports, module2) {
+    "use strict";
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
+      for (var name in all)
+        __defProp2(target, name, { get: all[name], enumerable: !0 });
+    }, __copyProps2 = (to, from, except, desc) => {
+      if (from && typeof from == "object" || typeof from == "function")
+        for (let key of __getOwnPropNames2(from))
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
+      return to;
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), createOptimizedView_native_exports = {};
+    __export2(createOptimizedView_native_exports, {
+      createOptimizedView: () => createOptimizedView,
+      getAccessibilityRoleFromRole: () => getAccessibilityRoleFromRole
+    });
+    module2.exports = __toCommonJS2(createOptimizedView_native_exports);
+    var import_react2 = require("react");
+    function createOptimizedView(children, viewProps, baseViews) {
+      let TextAncestor = baseViews.TextAncestor, ViewNativeComponent = baseViews.View, {
+        accessibilityElementsHidden,
+        accessibilityLabel,
+        accessibilityLabelledBy,
+        accessibilityLiveRegion,
+        accessibilityRole,
+        accessibilityState,
+        accessibilityValue,
+        "aria-busy": ariaBusy,
+        "aria-checked": ariaChecked,
+        "aria-disabled": ariaDisabled,
+        "aria-expanded": ariaExpanded,
+        "aria-hidden": ariaHidden,
+        "aria-label": ariaLabel,
+        "aria-labelledby": ariaLabelledBy,
+        "aria-live": ariaLive,
+        "aria-selected": ariaSelected,
+        "aria-valuemax": ariaValueMax,
+        "aria-valuemin": ariaValueMin,
+        "aria-valuenow": ariaValueNow,
+        "aria-valuetext": ariaValueText,
+        focusable,
+        id,
+        importantForAccessibility,
+        nativeID,
+        pointerEvents,
+        role,
+        tabIndex
+        // ...otherProps
+      } = viewProps, _accessibilityLabelledBy = (ariaLabelledBy == null ? void 0 : ariaLabelledBy.split(/\s*,\s*/g)) ?? accessibilityLabelledBy, _accessibilityState;
+      (accessibilityState != null || ariaBusy != null || ariaChecked != null || ariaDisabled != null || ariaExpanded != null || ariaSelected != null) && (_accessibilityState = {
+        busy: ariaBusy ?? (accessibilityState == null ? void 0 : accessibilityState.busy),
+        checked: ariaChecked ?? (accessibilityState == null ? void 0 : accessibilityState.checked),
+        disabled: ariaDisabled ?? (accessibilityState == null ? void 0 : accessibilityState.disabled),
+        expanded: ariaExpanded ?? (accessibilityState == null ? void 0 : accessibilityState.expanded),
+        selected: ariaSelected ?? (accessibilityState == null ? void 0 : accessibilityState.selected)
+      });
+      let _accessibilityValue;
+      (accessibilityValue != null || ariaValueMax != null || ariaValueMin != null || ariaValueNow != null || ariaValueText != null) && (_accessibilityValue = {
+        max: ariaValueMax ?? (accessibilityValue == null ? void 0 : accessibilityValue.max),
+        min: ariaValueMin ?? (accessibilityValue == null ? void 0 : accessibilityValue.min),
+        now: ariaValueNow ?? (accessibilityValue == null ? void 0 : accessibilityValue.now),
+        text: ariaValueText ?? (accessibilityValue == null ? void 0 : accessibilityValue.text)
+      });
+      let style = Array.isArray(viewProps.style) ? baseViews.StyleSheet.flatten(viewProps.style) : viewProps.style, newPointerEvents = (style == null ? void 0 : style.pointerEvents) || pointerEvents, finalProps = viewProps, extras = {
+        accessibilityLiveRegion: ariaLive === "off" ? "none" : ariaLive ?? accessibilityLiveRegion,
+        accessibilityLabel: ariaLabel ?? accessibilityLabel,
+        focusable: tabIndex !== void 0 ? !tabIndex : focusable,
+        accessibilityState: _accessibilityState,
+        accessibilityRole: role ? getAccessibilityRoleFromRole(role) : accessibilityRole,
+        accessibilityElementsHidden: ariaHidden ?? accessibilityElementsHidden,
+        accessibilityLabelledBy: _accessibilityLabelledBy,
+        accessibilityValue: _accessibilityValue,
+        importantForAccessibility: ariaHidden === !0 ? "no-hide-descendants" : importantForAccessibility,
+        nativeID: id ?? nativeID,
+        style,
+        pointerEvents: newPointerEvents
+      };
+      for (let key in extras)
+        extras[key] != null && (finalProps[key] = extras[key]);
+      let isInText = (0, import_react2.useContext)(TextAncestor), finalElement = (0, import_react2.createElement)(ViewNativeComponent, finalProps, children);
+      return isInText ? (0, import_react2.createElement)(TextAncestor.Provider, { value: !1 }, finalElement) : finalElement;
+    }
+    function getAccessibilityRoleFromRole(role) {
+      switch (role) {
+        case "alert":
+          return "alert";
+        case "alertdialog":
+          return;
+        case "application":
+          return;
+        case "article":
+          return;
+        case "banner":
+          return;
+        case "button":
+          return "button";
+        case "cell":
+          return;
+        case "checkbox":
+          return "checkbox";
+        case "columnheader":
+          return;
+        case "combobox":
+          return "combobox";
+        case "complementary":
+          return;
+        case "contentinfo":
+          return;
+        case "definition":
+          return;
+        case "dialog":
+          return;
+        case "directory":
+          return;
+        case "document":
+          return;
+        case "feed":
+          return;
+        case "figure":
+          return;
+        case "form":
+          return;
+        case "grid":
+          return "grid";
+        case "group":
+          return;
+        case "heading":
+          return "header";
+        case "img":
+          return "image";
+        case "link":
+          return "link";
+        case "list":
+          return "list";
+        case "listitem":
+          return;
+        case "log":
+          return;
+        case "main":
+          return;
+        case "marquee":
+          return;
+        case "math":
+          return;
+        case "menu":
+          return "menu";
+        case "menubar":
+          return "menubar";
+        case "menuitem":
+          return "menuitem";
+        case "meter":
+          return;
+        case "navigation":
+          return;
+        case "none":
+          return "none";
+        case "note":
+          return;
+        case "option":
+          return;
+        case "presentation":
+          return "none";
+        case "progressbar":
+          return "progressbar";
+        case "radio":
+          return "radio";
+        case "radiogroup":
+          return "radiogroup";
+        case "region":
+          return;
+        case "row":
+          return;
+        case "rowgroup":
+          return;
+        case "rowheader":
+          return;
+        case "scrollbar":
+          return "scrollbar";
+        case "searchbox":
+          return "search";
+        case "separator":
+          return;
+        case "slider":
+          return "adjustable";
+        case "spinbutton":
+          return "spinbutton";
+        case "status":
+          return;
+        case "summary":
+          return "summary";
+        case "switch":
+          return "switch";
+        case "tab":
+          return "tab";
+        case "table":
+          return;
+        case "tablist":
+          return "tablist";
+        case "tabpanel":
+          return;
+        case "term":
+          return;
+        case "timer":
+          return "timer";
+        case "toolbar":
+          return "toolbar";
+        case "tooltip":
+          return;
+        case "tree":
+          return;
+        case "treegrid":
+          return;
+        case "treeitem":
+          return;
+      }
+    }
+  }
+});
+
 // ../core/dist/cjs/getBaseViews.native.js
 var require_getBaseViews_native = __commonJS({
   "../core/dist/cjs/getBaseViews.native.js"(exports, module2) {
@@ -7311,10 +7533,12 @@ var require_getBaseViews_native = __commonJS({
     });
     module2.exports = __toCommonJS2(getBaseViews_native_exports);
     function getBaseViews() {
-      let native = require("react-native");
-      return {
-        View: native.View || native.default.View,
+      let native = require("react-native"), View2, TextAncestor;
+      return process.env.NODE_ENV !== "test" && (View2 = require("react-native/Libraries/Components/View/ViewNativeComponent").default, TextAncestor = require("react-native/Libraries/Text/TextAncestor")), View2 || (View2 = native.View || native.default.View), {
+        View: View2,
         Text: native.Text || native.default.Text,
+        StyleSheet: native.StyleSheet || native.default.StyleSheet,
+        TextAncestor,
         Pressable: native.Pressable || native.default.Pressable
       };
     }
@@ -7565,10 +7789,10 @@ var require_index_native15 = __commonJS({
       Text: () => Text3
     });
     module2.exports = __toCommonJS2(src_exports2);
-    var import_react_native_use_responder_events = require_index_native14(), import_web = require_index_native9(), import_getBaseViews = require_getBaseViews_native(), import_useElementLayout = require_useElementLayout_native(), import_usePlatformMethods = require_usePlatformMethods_native(), import_Pressability = require_Pressability_native();
+    var import_react_native_use_responder_events = require_index_native14(), import_web = require_index_native9(), import_react2 = require("react"), import_createOptimizedView = require_createOptimizedView_native(), import_getBaseViews = require_getBaseViews_native(), import_useElementLayout = require_useElementLayout_native(), import_usePlatformMethods = require_usePlatformMethods_native(), import_Pressability = require_Pressability_native();
     __reExport2(src_exports2, require_index_native9(), module2.exports);
     __reExport2(src_exports2, require_reactNativeTypes_native(), module2.exports);
-    var Stack3 = import_web.Stack, Text3 = import_web.Text;
+    var Stack3 = import_web.Stack, Text3 = import_web.Text, baseViews = (0, import_getBaseViews.getBaseViews)();
     (0, import_web.setupHooks)({
       getBaseViews: import_getBaseViews.getBaseViews,
       usePropsTransform(elementType, propsIn, hostRef) {
@@ -7641,22 +7865,15 @@ var require_index_native15 = __commonJS({
               viewProps[key] = og && !dontComposePressabilityKeys[key] ? (0, import_web.composeEventHandlers)(og, val) : val;
             }
         }
+      },
+      useChildren(elementType, children, viewProps, events, staticConfig) {
+        if (process.env.NODE_ENV !== "test") {
+          if (elementType === baseViews.View)
+            return (0, import_createOptimizedView.createOptimizedView)(children, viewProps, baseViews);
+          if (process.env.TAMAGUI_OPTIMIZE_NATIVE_VIEWS && elementType === baseViews.Text)
+            return viewProps.children = children, (0, import_react2.createElement)("RCTText", viewProps);
+        }
       }
-      // attempt at properly fixing RN input, but <Pressable><TextInput /> just doesnt work on RN
-      // useChildren(children, viewProps, events, staticConfig) {
-      //   if (process.env.TAMAGUI_TARGET === 'native') {
-      //     if (staticConfig.isInput && !staticConfig.isHOC) {
-      //       const Pressable = getBaseViews().Pressable
-      //       console.log(
-      //         'wrapping in pressable',
-      //         events?.['onPressIn']?.toString(),
-      //         viewProps['onPressIn']
-      //       )
-      //       // we need to wrap it in a view?
-      //       return <Pressable {...events}>{children}</Pressable>
-      //     }
-      //   }
-      // },
     });
     var dontComposePressabilityKeys = {
       onClick: !0