tamagui 1.125.35 → 1.126.0

package/dist/native.js

@@ -8648,7 +8648,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 +19689,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 +25803,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 +29937,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 +29965,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 +30031,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 +30329,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 +30364,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
+    });
   }
 });