tamagui 1.125.35 → 1.126.1

package/dist/native.js

@@ -3922,6 +3922,73 @@ var require_getShorthandValue_native = __commonJS({
   }
 });
 
+// ../../core/web/dist/cjs/helpers/getDynamicVal.native.js
+var require_getDynamicVal_native = __commonJS({
+  "../../core/web/dist/cjs/helpers/getDynamicVal.native.js"(exports2, module2) {
+    "use strict";
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = function(target, all) {
+      for (var name in all) __defProp2(target, name, {
+        get: all[name],
+        enumerable: !0
+      });
+    }, __copyProps2 = function(to, from, except, desc) {
+      var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
+      if (from && typeof from == "object" || typeof from == "function") try {
+        for (var _loop = function() {
+          var key = _step.value;
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, {
+            get: function() {
+              return from[key];
+            },
+            enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable
+          });
+        }, _iterator = __getOwnPropNames2(from)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) _loop();
+      } catch (err) {
+        _didIteratorError = !0, _iteratorError = err;
+      } finally {
+        try {
+          !_iteratorNormalCompletion && _iterator.return != null && _iterator.return();
+        } finally {
+          if (_didIteratorError)
+            throw _iteratorError;
+        }
+      }
+      return to;
+    }, __toCommonJS2 = function(mod) {
+      return __copyProps2(__defProp2({}, "__esModule", {
+        value: !0
+      }), mod);
+    }, getDynamicVal_exports = {};
+    __export2(getDynamicVal_exports, {
+      extractValueFromDynamic: function() {
+        return extractValueFromDynamic;
+      },
+      getDynamicVal: function() {
+        return getDynamicVal;
+      },
+      getOppositeScheme: function() {
+        return getOppositeScheme;
+      }
+    });
+    module2.exports = __toCommonJS2(getDynamicVal_exports);
+    function getOppositeScheme(scheme) {
+      return scheme === "dark" ? "light" : "dark";
+    }
+    function getDynamicVal(param) {
+      var { scheme, val, oppositeVal } = param, oppositeScheme = getOppositeScheme(scheme);
+      return {
+        dynamic: {
+          [scheme]: val,
+          [oppositeScheme]: oppositeVal
+        }
+      };
+    }
+    function extractValueFromDynamic(val, scheme) {
+      return val != null && val.dynamic ? val.dynamic[scheme] : val;
+    }
+  }
+});
+
 // ../../core/web/dist/cjs/constants/accessibilityDirectMap.native.js
 var require_accessibilityDirectMap_native = __commonJS({
   "../../core/web/dist/cjs/constants/accessibilityDirectMap.native.js"(exports2, module2) {
@@ -6336,7 +6403,7 @@ var require_getSplitStyles_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(getSplitStyles_exports);
-    var import_constants4 = require_index_native6(), import_helpers = require_index_native7(), import_react3 = __toESM2(require("react")), import_config = require_config_native(), import_accessibilityDirectMap = require_accessibilityDirectMap_native(), import_constants22 = require_constants_native2(), import_isDevTools = require_isDevTools_native(), import_useMedia = require_useMedia_native(), import_consoleLog = require_consoleLog_native(), import_createMediaStyle = require_createMediaStyle_native(), import_expandStyles = require_expandStyles_native(), import_getCSSStylesAtomic = require_getCSSStylesAtomic_native(), import_getGroupPropParts = require_getGroupPropParts_native(), import_insertStyleRule = require_insertStyleRule_native(), import_isActivePlatform = require_isActivePlatform_native(), import_isActiveTheme = require_isActiveTheme_native(), import_log = require_log_native(), import_normalizeValueWithProperty = require_normalizeValueWithProperty_native(), import_propMapper = require_propMapper_native(), import_pseudoDescriptors = require_pseudoDescriptors_native(), import_skipProps = require_skipProps_native(), import_sortString = require_sortString_native(), import_transformsToString = require_transformsToString_native(), conf, PROP_SPLIT = "-";
+    var import_constants4 = require_index_native6(), import_helpers = require_index_native7(), import_react3 = __toESM2(require("react")), import_getDynamicVal = require_getDynamicVal_native(), import_config = require_config_native(), import_accessibilityDirectMap = require_accessibilityDirectMap_native(), import_constants22 = require_constants_native2(), import_isDevTools = require_isDevTools_native(), import_useMedia = require_useMedia_native(), import_consoleLog = require_consoleLog_native(), import_createMediaStyle = require_createMediaStyle_native(), import_expandStyles = require_expandStyles_native(), import_getCSSStylesAtomic = require_getCSSStylesAtomic_native(), import_getGroupPropParts = require_getGroupPropParts_native(), import_insertStyleRule = require_insertStyleRule_native(), import_isActivePlatform = require_isActivePlatform_native(), import_isActiveTheme = require_isActiveTheme_native(), import_log = require_log_native(), import_normalizeValueWithProperty = require_normalizeValueWithProperty_native(), import_propMapper = require_propMapper_native(), import_pseudoDescriptors = require_pseudoDescriptors_native(), import_skipProps = require_skipProps_native(), import_sortString = require_sortString_native(), import_transformsToString = require_transformsToString_native(), conf, PROP_SPLIT = "-";
     function isValidStyleKey(key, validStyles, accept) {
       return key in validStyles ? !0 : accept && key in accept;
     }
@@ -6534,8 +6601,8 @@ var require_getSplitStyles_native = __commonJS({
                 }
               } else {
                 var mergeMediaStyle2 = function(key5, val3) {
-                  var _styleState3;
-                  (_styleState3 = styleState).style || (_styleState3.style = {});
+                  var _styleState4;
+                  (_styleState4 = styleState).style || (_styleState4.style = {});
                   var didMerge = mergeMediaByImportance(styleState, mediaKeyShort, key5, val3, usedKeys, mediaState3[mediaKeyShort], importanceBump, debug);
                   didMerge && key5 === "fontFamily" && (styleState.fontFamily = mediaStyle1.fontFamily);
                 }, mergeMediaStyle = mergeMediaStyle2, isThemeMedia = isMedia === "theme", isGroupMedia = isMedia === "group", isPlatformMedia = isMedia === "platform";
@@ -6548,7 +6615,19 @@ var require_getSplitStyles_native = __commonJS({
                 }
                 var mediaStyle1 = getSubStyle(styleState, key4, val2, !0), importanceBump = 0;
                 if (isThemeMedia) {
-                  if (dynamicThemeAccess = !0, !(themeName === mediaKeyShort || themeName.startsWith(mediaKeyShort))) return;
+                  if (dynamicThemeAccess = !0, import_constants4.isIos && (0, import_config.getSetting)("fastSchemeChange")) {
+                    var _styleState3;
+                    (_styleState3 = styleState).style || (_styleState3.style = {});
+                    var scheme = mediaKeyShort, oppositeScheme = (0, import_getDynamicVal.getOppositeScheme)(mediaKeyShort);
+                    for (var subKey1 in mediaStyle1) {
+                      var _$val1 = (0, import_getDynamicVal.extractValueFromDynamic)(mediaStyle1[subKey1], scheme), oppositeVal = (0, import_getDynamicVal.extractValueFromDynamic)(styleState.style[subKey1], oppositeScheme);
+                      mediaStyle1[subKey1] = (0, import_getDynamicVal.getDynamicVal)({
+                        scheme,
+                        val: _$val1,
+                        oppositeVal
+                      }), mergeStyle(styleState, subKey1, mediaStyle1[subKey1]);
+                    }
+                  } else if (!(themeName === mediaKeyShort || themeName.startsWith(mediaKeyShort))) return;
                 } else if (isGroupMedia) {
                   var _componentState_group, groupInfo = (0, import_getGroupPropParts.getGroupPropParts)(mediaKeyShort), groupName = groupInfo.name, groupContext = context == null ? void 0 : context.groups.state[groupName];
                   if (!groupContext) {
@@ -6576,15 +6655,15 @@ var require_getSplitStyles_native = __commonJS({
                     importanceBump = priority1;
                   }
                 }
-                for (var subKey1 in mediaStyle1) {
-                  if (subKey1 === "space") {
+                for (var subKey2 in mediaStyle1) {
+                  if (subKey2 === "space") {
                     space = valInit.space;
                     continue;
                   }
-                  if (subKey1[0] === "$") {
-                    if (!(0, import_isActivePlatform.isActivePlatform)(subKey1) || !(0, import_isActiveTheme.isActiveTheme)(subKey1, themeName)) continue;
-                    for (var subSubKey in mediaStyle1[subKey1]) mergeMediaStyle2(subSubKey, mediaStyle1[subKey1][subSubKey]);
-                  } else mergeMediaStyle2(subKey1, mediaStyle1[subKey1]);
+                  if (subKey2[0] === "$") {
+                    if (!(0, import_isActivePlatform.isActivePlatform)(subKey2) || !(0, import_isActiveTheme.isActiveTheme)(subKey2, themeName)) continue;
+                    for (var subSubKey in mediaStyle1[subKey2]) mergeMediaStyle2(subSubKey, mediaStyle1[subKey2][subSubKey]);
+                  } else mergeMediaStyle2(subKey2, mediaStyle1[subKey2]);
                 }
               }
               return;
@@ -7505,7 +7584,7 @@ var require_getThemeProxied_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(getThemeProxied_exports);
-    var import_constants4 = require_index_native6(), import_config = require_config_native(), import_createVariable = require_createVariable_native(), import_doesRootSchemeMatchSystem = require_doesRootSchemeMatchSystem_native(), cache = /* @__PURE__ */ new Map(), curKeys, curProps, curState, emptyObject = {};
+    var import_constants4 = require_index_native6(), import_config = require_config_native(), import_createVariable = require_createVariable_native(), import_doesRootSchemeMatchSystem = require_doesRootSchemeMatchSystem_native(), import_getDynamicVal = require_getDynamicVal_native(), cache = /* @__PURE__ */ new Map(), curKeys, curProps, curState, emptyObject = {};
     function getThemeProxied(_props, _state, _keys) {
       if (!(_state != null && _state.theme)) return emptyObject;
       if (curKeys = _keys, curProps = _props, curState = _state, cache.has(curState.theme)) {
@@ -7526,12 +7605,11 @@ var require_getThemeProxied_native = __commonJS({
             if (curState) {
               var outVal = (0, import_createVariable.getVariable)(value), { name, scheme, inverses } = curState, shouldOptimize = scheme && platform2 !== "web" && import_constants4.isIos && !curProps.deopt && (0, import_config.getSetting)("fastSchemeChange") && inverses === 0 && (0, import_doesRootSchemeMatchSystem.doesRootSchemeMatchSystem)();
               if (shouldOptimize) {
-                var _config_themes_name, _config_themes_oppositeName, oppositeScheme = scheme === "dark" ? "light" : "dark", oppositeName = name.replace(scheme, oppositeScheme), color = (0, import_createVariable.getVariable)((_config_themes_name = config.themes[name]) === null || _config_themes_name === void 0 ? void 0 : _config_themes_name[key]), oppositeColor = (0, import_createVariable.getVariable)((_config_themes_oppositeName = config.themes[oppositeName]) === null || _config_themes_oppositeName === void 0 ? void 0 : _config_themes_oppositeName[key]), dynamicVal = {
-                  dynamic: {
-                    [scheme]: color,
-                    [oppositeScheme]: oppositeColor
-                  }
-                };
+                var _config_themes_name, _config_themes_oppositeName, oppositeScheme = scheme === "dark" ? "light" : "dark", oppositeName = name.replace(scheme, oppositeScheme), color = (0, import_createVariable.getVariable)((_config_themes_name = config.themes[name]) === null || _config_themes_name === void 0 ? void 0 : _config_themes_name[key]), oppositeColor = (0, import_createVariable.getVariable)((_config_themes_oppositeName = config.themes[oppositeName]) === null || _config_themes_oppositeName === void 0 ? void 0 : _config_themes_oppositeName[key]), dynamicVal = (0, import_getDynamicVal.getDynamicVal)({
+                  scheme,
+                  val: color,
+                  oppositeVal: oppositeColor
+                });
                 return dynamicVal;
               }
               return process.env.NODE_ENV === "development" && curProps.debug && console.info(` \u{1F3A8} useTheme() tracking new key because of: 
@@ -8093,7 +8171,7 @@ var require_useComponentState_native = __commonJS({
         ...states[0],
         [props.forceStyle]: !0
       } : states[0], setState = states[1], isAnimated = willBeAnimated;
-      import_constants4.isWeb && hasAnimationThatNeedsHydrate && !staticConfig.isHOC && !isHydrated && (isAnimated = !1, curStateRef.willHydrate = !0), disabled !== state.disabled && (state.disabled = disabled, disabled && Object.assign(state, import_defaultComponentState.defaultComponentStateMounted), setState({
+      import_constants4.isWeb && hasAnimationThatNeedsHydrate && !staticConfig.isHOC && !isHydrated && (isAnimated = !1, curStateRef.willHydrate = !0), disabled !== state.disabled && (disabled && Object.assign(state, import_defaultComponentState.defaultComponentStateMounted), state.disabled = disabled, setState({
         ...state
       }));
       var groupName = props.group, setStateShallow = (0, import_createShallowSetState.createShallowSetState)(setState, disabled ? [
@@ -8648,7 +8726,16 @@ If you meant to do this, you can disable this warning - either change untilMeasu
               });
               return;
             }
+            var tm;
             if (state.unmounted) {
+              var _config_animations2, _animationDriver_supportsCSSVars;
+              if ((_animationDriver_supportsCSSVars = animationDriver == null ? void 0 : animationDriver.supportsCSSVars) !== null && _animationDriver_supportsCSSVars !== void 0 ? _animationDriver_supportsCSSVars : !(config == null || (_config_animations2 = config.animations) === null || _config_animations2 === void 0) && _config_animations2.supportsCSSVars) return tm = setTimeout(function() {
+                setStateShallow({
+                  unmounted: !1
+                });
+              }), function() {
+                return clearTimeout(tm);
+              };
               setStateShallow({
                 unmounted: !1
               });
@@ -19680,7 +19767,8 @@ var require_Dialog_native = __commonJS({
             // @ts-ignore
             ref: composedRefs,
             onDismiss: function() {
-              return context.onOpenChange(!1);
+              var _context_onOpenChange;
+              return context == null || (_context_onOpenChange = context.onOpenChange) === null || _context_onOpenChange === void 0 ? void 0 : _context_onOpenChange.call(context, !1);
             },
             children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_focus_scope.FocusScope, {
               loop: !0,
@@ -25793,7 +25881,8 @@ var require_Popover_native = __commonJS({
         ref: forwardedRef,
         componentName: "PopoverClose",
         onPress: (0, import_helpers.composeEventHandlers)(props.onPress, function() {
-          return context.onOpenChange(!1, "press");
+          var _context_onOpenChange;
+          return context == null || (_context_onOpenChange = context.onOpenChange) === null || _context_onOpenChange === void 0 ? void 0 : _context_onOpenChange.call(context, !1, "press");
         })
       });
     }), PopoverArrow = import_popper.PopperArrow.styleable(function(props, forwardedRef) {
@@ -29926,7 +30015,7 @@ var require_index_native68 = __commonJS({
 var require_Tabs_native = __commonJS({
   "../tabs/dist/cjs/Tabs.native.js"(exports2, module2) {
     "use strict";
-    var __create2 = Object.create, __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __getProtoOf2 = Object.getPrototypeOf, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = function(target, all) {
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = function(target, all) {
       for (var name in all) __defProp2(target, name, {
         get: all[name],
         enumerable: !0
@@ -29954,53 +30043,26 @@ var require_Tabs_native = __commonJS({
         }
       }
       return to;
-    }, __toESM2 = function(mod, isNodeMode, target) {
-      return target = mod != null ? __create2(__getProtoOf2(mod)) : {}, __copyProps2(
-        // If the importer is in node compatibility mode or this is not an ESM
-        // file that has been converted to a CommonJS file using a Babel-
-        // compatible transform (i.e. "__esModule" has not been set), then set
-        // "default" to the CommonJS "module.exports" for node compatibility.
-        isNodeMode || !mod || !mod.__esModule ? __defProp2(target, "default", {
-          value: mod,
-          enumerable: !0
-        }) : target,
-        mod
-      );
     }, __toCommonJS2 = function(mod) {
       return __copyProps2(__defProp2({}, "__esModule", {
         value: !0
       }), mod);
     }, Tabs_exports = {};
     __export2(Tabs_exports, {
-      Tabs: function() {
-        return Tabs2;
+      DefaultTabsContentFrame: function() {
+        return DefaultTabsContentFrame;
       },
-      useTabsContext: function() {
-        return useTabsContext;
+      DefaultTabsFrame: function() {
+        return DefaultTabsFrame;
+      },
+      DefaultTabsTabFrame: function() {
+        return DefaultTabsTabFrame;
       }
     });
     module2.exports = __toCommonJS2(Tabs_exports);
-    var import_jsx_runtime6 = require("react/jsx-runtime"), import_compose_refs = require_index_native11(), import_constants4 = require_index_native6(), import_get_button_sized2 = require_index_native21(), import_group = require_index_native52(), import_helpers = require_index_native7(), import_roving_focus = require_index_native61(), import_stacks3 = require_index_native22(), import_use_controllable_state = require_index_native10(), import_use_direction = require_index_native25(), import_web = require_index_native14(), React4 = __toESM2(require("react")), TABS_CONTEXT = "TabsContext", TAB_LIST_NAME = "TabsList", TabsList = /* @__PURE__ */ React4.forwardRef(function(props, forwardedRef) {
-      var { __scopeTabs, loop = !0, children, ...listProps } = props, context = useTabsContext(__scopeTabs);
-      return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_roving_focus.RovingFocusGroup, {
-        __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,
-        orientation: context.orientation,
-        dir: context.dir,
-        loop,
-        asChild: !0,
-        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_group.Group, {
-          role: "tablist",
-          componentName: TAB_LIST_NAME,
-          "aria-orientation": context.orientation,
-          ref: forwardedRef,
-          orientation: context.orientation,
-          ...listProps,
-          children
-        })
-      });
-    });
-    TabsList.displayName = TAB_LIST_NAME;
-    var TRIGGER_NAME = "TabsTrigger", TabsTriggerFrame = (0, import_web.styled)(import_stacks3.ThemeableStack, {
+    var import_core12 = require_index_native18(), import_stacks3 = require_index_native22(), import_get_button_sized2 = require_index_native21(), TABS_NAME = "Tabs", DefaultTabsFrame = (0, import_core12.styled)(import_stacks3.SizableStack, {
+      name: TABS_NAME
+    }), TRIGGER_NAME = "TabsTrigger", DefaultTabsTabFrame = (0, import_core12.styled)(import_stacks3.ThemeableStack, {
       name: TRIGGER_NAME,
       tag: "button",
       variants: {
@@ -30047,160 +30109,291 @@ var require_Tabs_native = __commonJS({
       defaultVariants: {
         unstyled: process.env.TAMAGUI_HEADLESS === "1"
       }
-    }), TabsTrigger = TabsTriggerFrame.styleable(function(props, forwardedRef) {
-      var { __scopeTabs, value, disabled = !1, onInteraction, disableActiveTheme, ...triggerProps } = props, context = useTabsContext(__scopeTabs), triggerId = makeTriggerId(context.baseId, value), contentId = makeContentId(context.baseId, value), isSelected = value === context.value, [layout, setLayout] = React4.useState(null), triggerRef = React4.useRef(null), groupItemProps = (0, import_group.useGroupItem)({
-        disabled: !!disabled
+    }), CONTENT_NAME = "TabsContent", DefaultTabsContentFrame = (0, import_core12.styled)(import_stacks3.ThemeableStack, {
+      name: CONTENT_NAME
+    });
+  }
+});
+
+// ../tabs/dist/cjs/StyledContext.native.js
+var require_StyledContext_native2 = __commonJS({
+  "../tabs/dist/cjs/StyledContext.native.js"(exports2, module2) {
+    "use strict";
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = function(target, all) {
+      for (var name in all) __defProp2(target, name, {
+        get: all[name],
+        enumerable: !0
       });
-      React4.useEffect(function() {
-        return context.registerTrigger(), function() {
-          return context.unregisterTrigger();
-        };
-      }, []), React4.useEffect(function() {
-        if (!triggerRef.current || !import_constants4.isWeb) return;
-        function getTriggerSize() {
-          triggerRef.current && setLayout({
-            width: triggerRef.current.offsetWidth,
-            height: triggerRef.current.offsetHeight,
-            x: triggerRef.current.offsetLeft,
-            y: triggerRef.current.offsetTop
-          });
-        }
-        getTriggerSize();
-        var observer = new ResizeObserver(getTriggerSize);
-        return observer.observe(triggerRef.current), function() {
-          triggerRef.current && observer.unobserve(triggerRef.current);
-        };
-      }, [
-        context.triggersCount
-      ]), React4.useEffect(function() {
-        isSelected && layout && (onInteraction == null || onInteraction("select", layout));
-      }, [
-        isSelected,
-        value,
-        layout
-      ]);
-      var _props_onPress;
-      return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_web.Theme, {
-        name: isSelected && !disableActiveTheme ? "active" : null,
-        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_roving_focus.RovingFocusGroup.Item, {
+    }, __copyProps2 = function(to, from, except, desc) {
+      var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
+      if (from && typeof from == "object" || typeof from == "function") try {
+        for (var _loop = function() {
+          var key = _step.value;
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, {
+            get: function() {
+              return from[key];
+            },
+            enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable
+          });
+        }, _iterator = __getOwnPropNames2(from)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) _loop();
+      } catch (err) {
+        _didIteratorError = !0, _iteratorError = err;
+      } finally {
+        try {
+          !_iteratorNormalCompletion && _iterator.return != null && _iterator.return();
+        } finally {
+          if (_didIteratorError)
+            throw _iteratorError;
+        }
+      }
+      return to;
+    }, __toCommonJS2 = function(mod) {
+      return __copyProps2(__defProp2({}, "__esModule", {
+        value: !0
+      }), mod);
+    }, StyledContext_exports = {};
+    __export2(StyledContext_exports, {
+      TabsProvider: function() {
+        return TabsProvider;
+      },
+      useTabsContext: function() {
+        return useTabsContext;
+      }
+    });
+    module2.exports = __toCommonJS2(StyledContext_exports);
+    var import_core12 = require_index_native18(), { Provider: TabsProvider, useStyledContext: useTabsContext } = (0, import_core12.createStyledContext)();
+  }
+});
+
+// ../tabs/dist/cjs/createTabs.native.js
+var require_createTabs_native = __commonJS({
+  "../tabs/dist/cjs/createTabs.native.js"(exports2, module2) {
+    "use strict";
+    var __create2 = Object.create, __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __getProtoOf2 = Object.getPrototypeOf, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = function(target, all) {
+      for (var name in all) __defProp2(target, name, {
+        get: all[name],
+        enumerable: !0
+      });
+    }, __copyProps2 = function(to, from, except, desc) {
+      var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
+      if (from && typeof from == "object" || typeof from == "function") try {
+        for (var _loop = function() {
+          var key = _step.value;
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, {
+            get: function() {
+              return from[key];
+            },
+            enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable
+          });
+        }, _iterator = __getOwnPropNames2(from)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) _loop();
+      } catch (err) {
+        _didIteratorError = !0, _iteratorError = err;
+      } finally {
+        try {
+          !_iteratorNormalCompletion && _iterator.return != null && _iterator.return();
+        } finally {
+          if (_didIteratorError)
+            throw _iteratorError;
+        }
+      }
+      return to;
+    }, __toESM2 = function(mod, isNodeMode, target) {
+      return target = mod != null ? __create2(__getProtoOf2(mod)) : {}, __copyProps2(
+        // If the importer is in node compatibility mode or this is not an ESM
+        // file that has been converted to a CommonJS file using a Babel-
+        // compatible transform (i.e. "__esModule" has not been set), then set
+        // "default" to the CommonJS "module.exports" for node compatibility.
+        isNodeMode || !mod || !mod.__esModule ? __defProp2(target, "default", {
+          value: mod,
+          enumerable: !0
+        }) : target,
+        mod
+      );
+    }, __toCommonJS2 = function(mod) {
+      return __copyProps2(__defProp2({}, "__esModule", {
+        value: !0
+      }), mod);
+    }, createTabs_exports = {};
+    __export2(createTabs_exports, {
+      createTabs: function() {
+        return createTabs;
+      }
+    });
+    module2.exports = __toCommonJS2(createTabs_exports);
+    var import_jsx_runtime6 = require("react/jsx-runtime"), import_compose_refs = require_index_native11(), import_constants4 = require_index_native6(), import_group = require_index_native52(), import_helpers = require_index_native7(), import_roving_focus = require_index_native61(), import_use_controllable_state = require_index_native10(), import_use_direction = require_index_native25(), import_web = require_index_native14(), React4 = __toESM2(require("react")), import_Tabs = require_Tabs_native(), import_StyledContext = require_StyledContext_native2();
+    function createTabs(createProps) {
+      var { ContentFrame = import_Tabs.DefaultTabsContentFrame, TabFrame = import_Tabs.DefaultTabsTabFrame, TabsFrame = import_Tabs.DefaultTabsFrame } = createProps, TABS_CONTEXT = "TabsContext", TAB_LIST_NAME = "TabsList", TabsList = /* @__PURE__ */ React4.forwardRef(function(props, forwardedRef) {
+        var { __scopeTabs, loop = !0, children, ...listProps } = props, context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
+        return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_roving_focus.RovingFocusGroup, {
           __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,
+          orientation: context.orientation,
+          dir: context.dir,
+          loop,
           asChild: !0,
-          focusable: !disabled,
-          active: isSelected,
-          children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(TabsTriggerFrame, {
-            onLayout: function(event) {
-              import_constants4.isWeb || setLayout(event.nativeEvent.layout);
-            },
-            onHoverIn: (0, import_helpers.composeEventHandlers)(props.onHoverIn, function() {
-              layout && (onInteraction == null || onInteraction("hover", layout));
-            }),
-            onHoverOut: (0, import_helpers.composeEventHandlers)(props.onHoverOut, function() {
-              onInteraction == null || onInteraction("hover", null);
-            }),
-            role: "tab",
-            "aria-selected": isSelected,
-            "aria-controls": contentId,
-            "data-state": isSelected ? "active" : "inactive",
-            "data-disabled": disabled ? "" : void 0,
-            disabled,
-            id: triggerId,
-            ...!props.unstyled && {
-              size: context.size
-            },
-            ...isSelected && {
-              forceStyle: "focus"
-            },
-            ...groupItemProps,
-            ...triggerProps,
-            ref: (0, import_compose_refs.composeRefs)(forwardedRef, triggerRef),
-            onPress: (0, import_helpers.composeEventHandlers)((_props_onPress = props.onPress) !== null && _props_onPress !== void 0 ? _props_onPress : void 0, function(event) {
-              var webChecks = !import_constants4.isWeb || event.button === 0 && event.ctrlKey === !1;
-              !disabled && !isSelected && webChecks ? context.onChange(value) : event.preventDefault();
-            }),
-            ...import_constants4.isWeb && {
-              type: "button",
-              onKeyDown: (0, import_helpers.composeEventHandlers)(props.onKeyDown, function(event) {
-                [
-                  " ",
-                  "Enter"
-                ].includes(event.key) && (context.onChange(value), event.preventDefault());
+          children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_group.Group, {
+            role: "tablist",
+            componentName: TAB_LIST_NAME,
+            "aria-orientation": context.orientation,
+            ref: forwardedRef,
+            orientation: context.orientation,
+            ...listProps,
+            children
+          })
+        });
+      });
+      TabsList.displayName = TAB_LIST_NAME;
+      var TRIGGER_NAME = "TabsTrigger", TabsTrigger = TabFrame.styleable(function(props, forwardedRef) {
+        var { __scopeTabs, value, disabled = !1, onInteraction, disableActiveTheme, ...triggerProps } = props, context = (0, import_StyledContext.useTabsContext)(__scopeTabs), triggerId = makeTriggerId(context.baseId, value), contentId = makeContentId(context.baseId, value), isSelected = value === context.value, [layout, setLayout] = React4.useState(null), triggerRef = React4.useRef(null), groupItemProps = (0, import_group.useGroupItem)({
+          disabled: !!disabled
+        });
+        React4.useEffect(function() {
+          return context.registerTrigger(), function() {
+            return context.unregisterTrigger();
+          };
+        }, []), React4.useEffect(function() {
+          if (!triggerRef.current || !import_constants4.isWeb) return;
+          function getTriggerSize() {
+            triggerRef.current && setLayout({
+              width: triggerRef.current.offsetWidth,
+              height: triggerRef.current.offsetHeight,
+              x: triggerRef.current.offsetLeft,
+              y: triggerRef.current.offsetTop
+            });
+          }
+          getTriggerSize();
+          var observer = new ResizeObserver(getTriggerSize);
+          return observer.observe(triggerRef.current), function() {
+            triggerRef.current && observer.unobserve(triggerRef.current);
+          };
+        }, [
+          context.triggersCount
+        ]), React4.useEffect(function() {
+          isSelected && layout && (onInteraction == null || onInteraction("select", layout));
+        }, [
+          isSelected,
+          value,
+          layout
+        ]);
+        var _props_onPress;
+        return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_web.Theme, {
+          name: isSelected && !disableActiveTheme ? "active" : null,
+          children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_roving_focus.RovingFocusGroup.Item, {
+            __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,
+            asChild: !0,
+            focusable: !disabled,
+            active: isSelected,
+            children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(TabFrame, {
+              onLayout: function(event) {
+                import_constants4.isWeb || setLayout(event.nativeEvent.layout);
+              },
+              onHoverIn: (0, import_helpers.composeEventHandlers)(props.onHoverIn, function() {
+                layout && (onInteraction == null || onInteraction("hover", layout));
               }),
-              onFocus: (0, import_helpers.composeEventHandlers)(props.onFocus, function(event) {
-                layout && (onInteraction == null || onInteraction("focus", layout));
-                var isAutomaticActivation = context.activationMode !== "manual";
-                !isSelected && !disabled && isAutomaticActivation && context.onChange(value);
+              onHoverOut: (0, import_helpers.composeEventHandlers)(props.onHoverOut, function() {
+                onInteraction == null || onInteraction("hover", null);
               }),
-              onBlur: (0, import_helpers.composeEventHandlers)(props.onFocus, function() {
-                onInteraction == null || onInteraction("focus", null);
-              })
-            }
+              role: "tab",
+              "aria-selected": isSelected,
+              "aria-controls": contentId,
+              "data-state": isSelected ? "active" : "inactive",
+              "data-disabled": disabled ? "" : void 0,
+              disabled,
+              id: triggerId,
+              ...!props.unstyled && {
+                size: context.size
+              },
+              ...isSelected && {
+                forceStyle: "focus"
+              },
+              ...groupItemProps,
+              ...triggerProps,
+              ref: (0, import_compose_refs.composeRefs)(forwardedRef, triggerRef),
+              onPress: (0, import_helpers.composeEventHandlers)((_props_onPress = props.onPress) !== null && _props_onPress !== void 0 ? _props_onPress : void 0, function(event) {
+                var webChecks = !import_constants4.isWeb || event.button === 0 && event.ctrlKey === !1;
+                !disabled && !isSelected && webChecks ? context.onChange(value) : event.preventDefault();
+              }),
+              ...import_constants4.isWeb && {
+                type: "button",
+                onKeyDown: (0, import_helpers.composeEventHandlers)(props.onKeyDown, function(event) {
+                  [
+                    " ",
+                    "Enter"
+                  ].includes(event.key) && (context.onChange(value), event.preventDefault());
+                }),
+                onFocus: (0, import_helpers.composeEventHandlers)(props.onFocus, function(event) {
+                  layout && (onInteraction == null || onInteraction("focus", layout));
+                  var isAutomaticActivation = context.activationMode !== "manual";
+                  !isSelected && !disabled && isAutomaticActivation && context.onChange(value);
+                }),
+                onBlur: (0, import_helpers.composeEventHandlers)(props.onFocus, function() {
+                  onInteraction == null || onInteraction("focus", null);
+                })
+              }
+            })
           })
-        })
+        });
       });
-    });
-    TabsTrigger.displayName = TRIGGER_NAME;
-    var CONTENT_NAME = "TabsContent", TabsContentFrame = (0, import_web.styled)(import_stacks3.ThemeableStack, {
-      name: CONTENT_NAME
-    }), TabsContent = TabsContentFrame.styleable(function(props, forwardedRef) {
-      var { __scopeTabs, value, forceMount, children, ...contentProps } = props, context = useTabsContext(__scopeTabs), isSelected = value === context.value, show = forceMount || isSelected, triggerId = makeTriggerId(context.baseId, value), contentId = makeContentId(context.baseId, value);
-      return show ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(TabsContentFrame, {
-        "data-state": isSelected ? "active" : "inactive",
-        "data-orientation": context.orientation,
-        role: "tabpanel",
-        "aria-labelledby": triggerId,
-        // @ts-ignore
-        hidden: !show,
-        id: contentId,
-        tabIndex: 0,
-        ...contentProps,
-        ref: forwardedRef,
-        children
-      }, value) : null;
-    }), TABS_NAME = "Tabs", { Provider: TabsProvider, useStyledContext: useTabsContext } = (0, import_web.createStyledContext)(), TabsFrame = (0, import_web.styled)(import_stacks3.SizableStack, {
-      name: TABS_NAME
-    }), TabsComponent = TabsFrame.styleable(function(props, forwardedRef) {
-      var { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = "horizontal", dir, activationMode = "automatic", size: size4 = "$true", ...tabsProps } = props, direction = (0, import_use_direction.useDirection)(dir), [value, setValue] = (0, import_use_controllable_state.useControllableState)({
-        prop: valueProp,
-        onChange: onValueChange,
-        defaultProp: defaultValue ?? ""
-      }), [triggersCount, setTriggersCount] = React4.useState(0), registerTrigger = (0, import_web.useEvent)(function() {
-        return setTriggersCount(function(v) {
-          return v + 1;
+      TabsTrigger.displayName = TRIGGER_NAME;
+      var TabsContent = ContentFrame.styleable(function(props, forwardedRef) {
+        var { __scopeTabs, value, forceMount, children, ...contentProps } = props, context = (0, import_StyledContext.useTabsContext)(__scopeTabs), isSelected = value === context.value, show = forceMount || isSelected, triggerId = makeTriggerId(context.baseId, value), contentId = makeContentId(context.baseId, value);
+        return show ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ContentFrame, {
+          "data-state": isSelected ? "active" : "inactive",
+          "data-orientation": context.orientation,
+          role: "tabpanel",
+          "aria-labelledby": triggerId,
+          // @ts-ignore
+          hidden: !show,
+          id: contentId,
+          tabIndex: 0,
+          ...contentProps,
+          ref: forwardedRef,
+          children
+        }, value) : null;
+      }), TabsComponent = TabsFrame.styleable(function(props, forwardedRef) {
+        var { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = "horizontal", dir, activationMode = "automatic", size: size4 = "$true", ...tabsProps } = props, direction = (0, import_use_direction.useDirection)(dir), [value, setValue] = (0, import_use_controllable_state.useControllableState)({
+          prop: valueProp,
+          onChange: onValueChange,
+          defaultProp: defaultValue ?? ""
+        }), [triggersCount, setTriggersCount] = React4.useState(0), registerTrigger = (0, import_web.useEvent)(function() {
+          return setTriggersCount(function(v) {
+            return v + 1;
+          });
+        }), unregisterTrigger = (0, import_web.useEvent)(function() {
+          return setTriggersCount(function(v) {
+            return v - 1;
+          });
         });
-      }), unregisterTrigger = (0, import_web.useEvent)(function() {
-        return setTriggersCount(function(v) {
-          return v - 1;
+        return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_StyledContext.TabsProvider, {
+          scope: __scopeTabs,
+          baseId: React4.useId(),
+          value,
+          onChange: setValue,
+          orientation,
+          dir: direction,
+          activationMode,
+          size: size4,
+          registerTrigger,
+          triggersCount,
+          unregisterTrigger,
+          children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(TabsFrame, {
+            direction,
+            //   dir={direction}
+            "data-orientation": orientation,
+            ...tabsProps,
+            ref: forwardedRef
+          })
         });
       });
-      return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(TabsProvider, {
-        scope: __scopeTabs,
-        baseId: React4.useId(),
-        value,
-        onChange: setValue,
-        orientation,
-        dir: direction,
-        activationMode,
-        size: size4,
-        registerTrigger,
-        triggersCount,
-        unregisterTrigger,
-        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(TabsFrame, {
-          direction,
-          //   dir={direction}
-          "data-orientation": orientation,
-          ...tabsProps,
-          ref: forwardedRef
-        })
+      return (0, import_helpers.withStaticProperties)(TabsComponent, {
+        List: TabsList,
+        /**
+        * @deprecated Use Tabs.Tab instead
+        */
+        Trigger: TabsTrigger,
+        Tab: TabsTrigger,
+        Content: TabsContent
       });
-    }), Tabs2 = (0, import_helpers.withStaticProperties)(TabsComponent, {
-      List: TabsList,
-      /**
-      * @deprecated Use Tabs.Tab instead
-      */
-      Trigger: TabsTrigger,
-      Tab: TabsTrigger,
-      Content: TabsContent
-    });
+    }
     function makeTriggerId(baseId, value) {
       return `${baseId}-trigger-${value}`;
     }
@@ -30214,7 +30407,12 @@ var require_Tabs_native = __commonJS({
 var require_index_native69 = __commonJS({
   "../tabs/dist/cjs/index.native.js"(exports2, module2) {
     "use strict";
-    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __copyProps2 = function(to, from, except, desc) {
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = function(target, all) {
+      for (var name in all) __defProp2(target, name, {
+        get: all[name],
+        enumerable: !0
+      });
+    }, __copyProps2 = function(to, from, except, desc) {
       var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
       if (from && typeof from == "object" || typeof from == "function") try {
         for (var _loop = function() {
@@ -30244,8 +30442,20 @@ var require_index_native69 = __commonJS({
         value: !0
       }), mod);
     }, index_exports2 = {};
+    __export2(index_exports2, {
+      Tabs: function() {
+        return Tabs;
+      }
+    });
     module2.exports = __toCommonJS2(index_exports2);
-    __reExport2(index_exports2, require_Tabs_native(), module2.exports);
+    var import_createTabs = require_createTabs_native(), import_Tabs = require_Tabs_native();
+    __reExport2(index_exports2, require_createTabs_native(), module2.exports);
+    __reExport2(index_exports2, require_StyledContext_native2(), module2.exports);
+    var Tabs = (0, import_createTabs.createTabs)({
+      ContentFrame: import_Tabs.DefaultTabsContentFrame,
+      TabFrame: import_Tabs.DefaultTabsTabFrame,
+      TabsFrame: import_Tabs.DefaultTabsFrame
+    });
   }
 });