@tamagui/tabs 3.0.18 → 3.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/Tabs.cjs +8 -4
- package/dist/cjs/Tabs.native.cjs +8 -4
- package/dist/cjs/Tabs.native.js +8 -4
- package/dist/cjs/Tabs.native.js.map +1 -1
- package/dist/esm/Tabs.mjs +8 -4
- package/dist/esm/Tabs.mjs.map +1 -1
- package/dist/esm/Tabs.native.js +8 -4
- package/dist/esm/Tabs.native.js.map +1 -1
- package/dist/jsx/Tabs.mjs +8 -4
- package/dist/jsx/Tabs.mjs.map +1 -1
- package/dist/jsx/Tabs.native.cjs +8 -4
- package/dist/jsx/Tabs.native.js +8 -4
- package/dist/jsx/Tabs.native.js.map +1 -1
- package/package.json +14 -14
- package/src/Tabs.tsx +8 -4
- package/types/Tabs.d.ts +24 -110
- package/types/Tabs.d.ts.map +1 -1
package/dist/cjs/Tabs.cjs
CHANGED
|
@@ -60,7 +60,8 @@ const TabsTabFrame = (0, import_core.styled)(import_core.View, {
|
|
|
60
60
|
});
|
|
61
61
|
const TabsContentFrame = (0, import_core.styled)(import_core.View, { displayName: "TabsContent" });
|
|
62
62
|
const TabsListDisabledContext = React.createContext(false);
|
|
63
|
-
const TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList2(
|
|
63
|
+
const TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList2(propsIn, forwardedRef) {
|
|
64
|
+
const props = propsIn;
|
|
64
65
|
const { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;
|
|
65
66
|
const context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
66
67
|
const { listProps: headlessListProps } = (0, import_tabs_headless.useTabsList)({
|
|
@@ -85,7 +86,8 @@ const TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsLi
|
|
|
85
86
|
})
|
|
86
87
|
});
|
|
87
88
|
});
|
|
88
|
-
const TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(
|
|
89
|
+
const TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(propsIn, forwardedRef) {
|
|
90
|
+
const props = propsIn;
|
|
89
91
|
const { __scopeTabs, value, disabled: disabledProp, onInteraction, activeStyle, activeTheme, onLayout, onMouseEnter, onMouseLeave, onPress, onKeyDown, onFocus, onBlur, ...triggerProps } = props;
|
|
90
92
|
const context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
91
93
|
const listDisabled = React.useContext(TabsListDisabledContext);
|
|
@@ -177,7 +179,8 @@ const TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2
|
|
|
177
179
|
})
|
|
178
180
|
});
|
|
179
181
|
});
|
|
180
|
-
const TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function TabsContent2(
|
|
182
|
+
const TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function TabsContent2(propsIn, forwardedRef) {
|
|
183
|
+
const props = propsIn;
|
|
181
184
|
const { __scopeTabs, value, forceMount, children, ...contentProps } = props;
|
|
182
185
|
const context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
183
186
|
const { shouldMount, contentProps: headlessContentProps } = (0, import_tabs_headless.useTabContent)({
|
|
@@ -197,7 +200,8 @@ const TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function
|
|
|
197
200
|
children
|
|
198
201
|
}, value);
|
|
199
202
|
});
|
|
200
|
-
const TabsComponent = (0, import_core.createStyledHOC)(TabsFrame, function Tabs(
|
|
203
|
+
const TabsComponent = (0, import_core.createStyledHOC)(TabsFrame, function Tabs(propsIn, forwardedRef) {
|
|
204
|
+
const props = propsIn;
|
|
201
205
|
const { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = "horizontal", dir, activationMode = "automatic", ...tabsProps } = props;
|
|
202
206
|
const { value, setValue, baseId, direction, triggersCount, registerTrigger, unregisterTrigger, tabsProps: headlessTabsProps } = (0, import_tabs_headless.useTabs)({
|
|
203
207
|
value: valueProp,
|
package/dist/cjs/Tabs.native.cjs
CHANGED
|
@@ -62,7 +62,8 @@ var TabsTabFrame = (0, import_core.styled)(import_core.View, {
|
|
|
62
62
|
});
|
|
63
63
|
var TabsContentFrame = (0, import_core.styled)(import_core.View, { displayName: "TabsContent" });
|
|
64
64
|
var TabsListDisabledContext = /* @__PURE__ */ React.createContext(false);
|
|
65
|
-
var TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList2(
|
|
65
|
+
var TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList2(propsIn, forwardedRef) {
|
|
66
|
+
var props = propsIn;
|
|
66
67
|
var { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;
|
|
67
68
|
var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
68
69
|
var { listProps: headlessListProps } = (0, import_tabs_headless.useTabsList)({
|
|
@@ -87,7 +88,8 @@ var TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList
|
|
|
87
88
|
})
|
|
88
89
|
});
|
|
89
90
|
});
|
|
90
|
-
var TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(
|
|
91
|
+
var TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(propsIn, forwardedRef) {
|
|
92
|
+
var props = propsIn;
|
|
91
93
|
var { __scopeTabs, value, disabled: disabledProp, onInteraction, activeStyle, activeTheme, onLayout, onMouseEnter, onMouseLeave, onPress, onKeyDown, onFocus, onBlur, ...triggerProps } = props;
|
|
92
94
|
var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
93
95
|
var listDisabled = React.useContext(TabsListDisabledContext);
|
|
@@ -185,7 +187,8 @@ var TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(p
|
|
|
185
187
|
})
|
|
186
188
|
});
|
|
187
189
|
});
|
|
188
|
-
var TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function TabsContent2(
|
|
190
|
+
var TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function TabsContent2(propsIn, forwardedRef) {
|
|
191
|
+
var props = propsIn;
|
|
189
192
|
var { __scopeTabs, value, forceMount, children, ...contentProps } = props;
|
|
190
193
|
var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
191
194
|
var { shouldMount, contentProps: headlessContentProps } = (0, import_tabs_headless.useTabContent)({
|
|
@@ -205,7 +208,8 @@ var TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function Ta
|
|
|
205
208
|
children
|
|
206
209
|
}, value);
|
|
207
210
|
});
|
|
208
|
-
var TabsComponent = (0, import_core.createStyledHOC)(TabsFrame, function Tabs(
|
|
211
|
+
var TabsComponent = (0, import_core.createStyledHOC)(TabsFrame, function Tabs(propsIn, forwardedRef) {
|
|
212
|
+
var props = propsIn;
|
|
209
213
|
var { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = "horizontal", dir, activationMode = "automatic", ...tabsProps } = props;
|
|
210
214
|
var { value, setValue, baseId, direction, triggersCount, registerTrigger, unregisterTrigger, tabsProps: headlessTabsProps } = (0, import_tabs_headless.useTabs)({
|
|
211
215
|
value: valueProp,
|
package/dist/cjs/Tabs.native.js
CHANGED
|
@@ -62,7 +62,8 @@ var TabsTabFrame = (0, import_core.styled)(import_core.View, {
|
|
|
62
62
|
});
|
|
63
63
|
var TabsContentFrame = (0, import_core.styled)(import_core.View, { displayName: "TabsContent" });
|
|
64
64
|
var TabsListDisabledContext = /* @__PURE__ */ React.createContext(false);
|
|
65
|
-
var TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList2(
|
|
65
|
+
var TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList2(propsIn, forwardedRef) {
|
|
66
|
+
var props = propsIn;
|
|
66
67
|
var { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;
|
|
67
68
|
var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
68
69
|
var { listProps: headlessListProps } = (0, import_tabs_headless.useTabsList)({
|
|
@@ -87,7 +88,8 @@ var TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList
|
|
|
87
88
|
})
|
|
88
89
|
});
|
|
89
90
|
});
|
|
90
|
-
var TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(
|
|
91
|
+
var TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(propsIn, forwardedRef) {
|
|
92
|
+
var props = propsIn;
|
|
91
93
|
var { __scopeTabs, value, disabled: disabledProp, onInteraction, activeStyle, activeTheme, onLayout, onMouseEnter, onMouseLeave, onPress, onKeyDown, onFocus, onBlur, ...triggerProps } = props;
|
|
92
94
|
var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
93
95
|
var listDisabled = React.useContext(TabsListDisabledContext);
|
|
@@ -185,7 +187,8 @@ var TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(p
|
|
|
185
187
|
})
|
|
186
188
|
});
|
|
187
189
|
});
|
|
188
|
-
var TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function TabsContent2(
|
|
190
|
+
var TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function TabsContent2(propsIn, forwardedRef) {
|
|
191
|
+
var props = propsIn;
|
|
189
192
|
var { __scopeTabs, value, forceMount, children, ...contentProps } = props;
|
|
190
193
|
var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
191
194
|
var { shouldMount, contentProps: headlessContentProps } = (0, import_tabs_headless.useTabContent)({
|
|
@@ -205,7 +208,8 @@ var TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function Ta
|
|
|
205
208
|
children
|
|
206
209
|
}, value);
|
|
207
210
|
});
|
|
208
|
-
var TabsComponent = (0, import_core.createStyledHOC)(TabsFrame, function Tabs(
|
|
211
|
+
var TabsComponent = (0, import_core.createStyledHOC)(TabsFrame, function Tabs(propsIn, forwardedRef) {
|
|
212
|
+
var props = propsIn;
|
|
209
213
|
var { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = "horizontal", dir, activationMode = "automatic", ...tabsProps } = props;
|
|
210
214
|
var { value, setValue, baseId, direction, triggersCount, registerTrigger, unregisterTrigger, tabsProps: headlessTabsProps } = (0, import_tabs_headless.useTabs)({
|
|
211
215
|
value: valueProp,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.native.js","names":[],"sources":["cjs/Tabs.native.js"],"sourcesContent":["\"use strict\";\nvar __create = Object.create;\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __getProtoOf = Object.getPrototypeOf;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n for (var name in all)\n __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n if (from && typeof from === \"object\" || typeof from === \"function\") {\n for (let key of __getOwnPropNames(from))\n if (!__hasOwnProp.call(to, key) && key !== except)\n __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n }\n return to;\n};\nvar __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(\n // If the importer is in node compatibility mode or this is not an ESM\n // file that has been converted to a CommonJS file using a Babel-\n // compatible transform (i.e. \"__esModule\" has not been set), then set\n // \"default\" to the CommonJS \"module.exports\" for node compatibility.\n isNodeMode || !mod || !mod.__esModule ? __defProp(target, \"default\", { value: mod, enumerable: true }) : target,\n mod\n));\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar Tabs_exports = {};\n__export(Tabs_exports, {\n Tabs: () => Tabs2,\n TabsContent: () => TabsContent,\n TabsContentFrame: () => TabsContentFrame,\n TabsFrame: () => TabsFrame,\n TabsList: () => TabsList,\n TabsListFrame: () => TabsListFrame,\n TabsTab: () => TabsTab,\n TabsTabFrame: () => TabsTabFrame\n});\nmodule.exports = __toCommonJS(Tabs_exports);\nvar import_jsx_runtime = require(\"react/jsx-runtime\");\nvar import_compose_refs = require(\"@tamagui/compose-refs\");\nvar import_constants = require(\"@tamagui/constants\");\nvar import_core = require(\"@tamagui/core\");\nvar import_group = require(\"@tamagui/group\");\nvar import_helpers = require(\"@tamagui/helpers\");\nvar import_roving_focus = require(\"@tamagui/roving-focus\");\nvar import_tabs_headless = require(\"@tamagui/tabs-headless\");\nvar import_web = require(\"@tamagui/web\");\nvar React = __toESM(require(\"react\"), 1);\nvar import_StyledContext = require(\"./StyledContext\");\nvar TABS_CONTEXT = \"TabsContext\";\nvar TabsFrame = (0, import_core.styled)(import_core.View, {\n displayName: \"Tabs\"\n});\nvar TabsListFrame = (0, import_core.styled)(import_group.Group, {\n displayName: \"TabsList\",\n role: \"tablist\"\n});\nvar TabsTabFrame = (0, import_core.styled)(import_core.View, {\n displayName: \"TabsTrigger\",\n role: \"tab\",\n variants: {\n disabled: {\n true: {\n pointerEvents: \"none\"\n }\n }\n }\n});\nvar TabsContentFrame = (0, import_core.styled)(import_core.View, {\n displayName: \"TabsContent\"\n});\nvar TabsListDisabledContext = /* @__PURE__ */ React.createContext(false);\nvar TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList2(props, forwardedRef) {\n var { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;\n var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);\n var { listProps: headlessListProps } = (0, import_tabs_headless.useTabsList)({\n orientation: context.orientation,\n disabled\n });\n return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabsListDisabledContext.Provider, {\n value: disabled,\n children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_roving_focus.RovingFocusGroup, {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n orientation: context.orientation,\n dir: context.dir,\n loop,\n asChild: true,\n children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabsListFrame, {\n ...headlessListProps,\n orientation: context.orientation,\n ref: forwardedRef,\n ...listProps,\n children\n })\n })\n });\n});\nvar TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(props, forwardedRef) {\n var { __scopeTabs, value, disabled: disabledProp, onInteraction, activeStyle, activeTheme, onLayout, onMouseEnter, onMouseLeave, onPress, onKeyDown, onFocus, onBlur, ...triggerProps } = props;\n var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);\n var listDisabled = React.useContext(TabsListDisabledContext);\n var disabled = (disabledProp !== null && disabledProp !== void 0 ? disabledProp : listDisabled) === true;\n var groupItemProps = (0, import_group.useGroupItem)({\n disabled\n });\n var { isSelected, tabProps } = (0, import_tabs_headless.useTab)({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n disabled,\n activationMode: context.activationMode,\n onChange: context.onChange\n });\n var { onPress: activateOnPress, onKeyDown: activateOnKeyDown, onFocus: activateOnFocus, ...tabA11yProps } = tabProps;\n var [layout, setLayout] = React.useState(null);\n var triggerRef = React.useRef(null);\n var emitInteraction = (0, import_web.useEvent)(function(type, layout2) {\n onInteraction === null || onInteraction === void 0 ? void 0 : onInteraction(type, layout2);\n });\n React.useEffect(function() {\n context.registerTrigger();\n return function() {\n return context.unregisterTrigger();\n };\n }, []);\n React.useEffect(function() {\n if (!triggerRef.current || !import_constants.isWeb) return;\n var element = triggerRef.current;\n function updateTriggerSize() {\n var next = {\n width: element.offsetWidth,\n height: element.offsetHeight,\n x: element.offsetLeft,\n y: element.offsetTop\n };\n setLayout(function(previous) {\n return previous && previous.width === next.width && previous.height === next.height && previous.x === next.x && previous.y === next.y ? previous : next;\n });\n }\n updateTriggerSize();\n var observer = new ResizeObserver(updateTriggerSize);\n observer.observe(element);\n var offsetParent = element.offsetParent;\n if (offsetParent) {\n observer.observe(offsetParent);\n }\n return function() {\n return observer.disconnect();\n };\n }, [\n context.triggersCount\n ]);\n React.useEffect(function() {\n if (isSelected && layout) {\n emitInteraction(\"select\", layout);\n }\n }, [\n emitInteraction,\n isSelected,\n layout\n ]);\n return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_roving_focus.RovingFocusGroup.Item, {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n asChild: true,\n tabIndex: disabled ? -1 : 0,\n active: isSelected,\n children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabsTabFrame, {\n onLayout: import_constants.isWeb ? onLayout : (0, import_helpers.composeEventHandlers)(onLayout, function(event) {\n setLayout(event.nativeEvent.layout);\n }),\n onMouseEnter: (0, import_helpers.composeEventHandlers)(onMouseEnter, function() {\n if (layout) {\n emitInteraction(\"hover\", layout);\n }\n }),\n onMouseLeave: (0, import_helpers.composeEventHandlers)(onMouseLeave, function() {\n emitInteraction(\"hover\", null);\n }),\n ...tabA11yProps,\n theme: isSelected ? activeTheme !== null && activeTheme !== void 0 ? activeTheme : null : null,\n ...groupItemProps,\n ...triggerProps,\n // after triggerProps so active styles beat base styles from styled() skins\n style: [\n triggerProps.style,\n isSelected && activeStyle\n ],\n ref: (0, import_compose_refs.composeRefs)(forwardedRef, triggerRef),\n onPress: (0, import_helpers.composeEventHandlers)(onPress !== null && onPress !== void 0 ? onPress : void 0, activateOnPress),\n ...import_constants.isWeb && {\n onKeyDown: (0, import_helpers.composeEventHandlers)(onKeyDown, activateOnKeyDown),\n // emit the focus interaction before activating, matching the order\n // the indicator animations were built against\n onFocus: (0, import_helpers.composeEventHandlers)(onFocus, (0, import_helpers.composeEventHandlers)(function() {\n if (layout) {\n emitInteraction(\"focus\", layout);\n }\n }, activateOnFocus)),\n onBlur: (0, import_helpers.composeEventHandlers)(onBlur, function() {\n emitInteraction(\"focus\", null);\n })\n }\n })\n });\n});\nvar TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function TabsContent2(props, forwardedRef) {\n var { __scopeTabs, value, forceMount, children, ...contentProps } = props;\n var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);\n var { shouldMount, contentProps: headlessContentProps } = (0, import_tabs_headless.useTabContent)({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n orientation: context.orientation,\n forceMount\n });\n if (!shouldMount) {\n return null;\n }\n return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabsContentFrame, {\n // @ts-ignore hidden is a web-only accessibility attribute\n ...headlessContentProps,\n ...contentProps,\n ref: forwardedRef,\n children\n }, value);\n});\nvar TabsComponent = (0, import_core.createStyledHOC)(TabsFrame, function Tabs(props, forwardedRef) {\n var { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = \"horizontal\", dir, activationMode = \"automatic\", ...tabsProps } = props;\n var { value, setValue, baseId, direction, triggersCount, registerTrigger, unregisterTrigger, tabsProps: headlessTabsProps } = (0, import_tabs_headless.useTabs)({\n value: valueProp,\n onValueChange,\n defaultValue,\n orientation,\n dir,\n activationMode\n });\n return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_StyledContext.TabsProvider, {\n scope: __scopeTabs,\n baseId,\n value,\n onChange: setValue,\n orientation,\n dir: direction,\n activationMode,\n registerTrigger,\n triggersCount,\n unregisterTrigger,\n children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabsFrame, {\n direction,\n ...headlessTabsProps,\n ...tabsProps,\n ref: forwardedRef\n })\n });\n});\nvar Tabs2 = (0, import_helpers.withStaticProperties)(TabsComponent, {\n Frame: TabsFrame,\n List: TabsList,\n Tab: TabsTab,\n Content: TabsContent\n});\n//# sourceMappingURL=Tabs.js.map\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tabs.native.js","names":[],"sources":["cjs/Tabs.native.js"],"sourcesContent":["\"use strict\";\nvar __create = Object.create;\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __getProtoOf = Object.getPrototypeOf;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n for (var name in all)\n __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n if (from && typeof from === \"object\" || typeof from === \"function\") {\n for (let key of __getOwnPropNames(from))\n if (!__hasOwnProp.call(to, key) && key !== except)\n __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n }\n return to;\n};\nvar __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(\n // If the importer is in node compatibility mode or this is not an ESM\n // file that has been converted to a CommonJS file using a Babel-\n // compatible transform (i.e. \"__esModule\" has not been set), then set\n // \"default\" to the CommonJS \"module.exports\" for node compatibility.\n isNodeMode || !mod || !mod.__esModule ? __defProp(target, \"default\", { value: mod, enumerable: true }) : target,\n mod\n));\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar Tabs_exports = {};\n__export(Tabs_exports, {\n Tabs: () => Tabs2,\n TabsContent: () => TabsContent,\n TabsContentFrame: () => TabsContentFrame,\n TabsFrame: () => TabsFrame,\n TabsList: () => TabsList,\n TabsListFrame: () => TabsListFrame,\n TabsTab: () => TabsTab,\n TabsTabFrame: () => TabsTabFrame\n});\nmodule.exports = __toCommonJS(Tabs_exports);\nvar import_jsx_runtime = require(\"react/jsx-runtime\");\nvar import_compose_refs = require(\"@tamagui/compose-refs\");\nvar import_constants = require(\"@tamagui/constants\");\nvar import_core = require(\"@tamagui/core\");\nvar import_group = require(\"@tamagui/group\");\nvar import_helpers = require(\"@tamagui/helpers\");\nvar import_roving_focus = require(\"@tamagui/roving-focus\");\nvar import_tabs_headless = require(\"@tamagui/tabs-headless\");\nvar import_web = require(\"@tamagui/web\");\nvar React = __toESM(require(\"react\"), 1);\nvar import_StyledContext = require(\"./StyledContext\");\nvar TABS_CONTEXT = \"TabsContext\";\nvar TabsFrame = (0, import_core.styled)(import_core.View, {\n displayName: \"Tabs\"\n});\nvar TabsListFrame = (0, import_core.styled)(import_group.Group, {\n displayName: \"TabsList\",\n role: \"tablist\"\n});\nvar TabsTabFrame = (0, import_core.styled)(import_core.View, {\n displayName: \"TabsTrigger\",\n role: \"tab\",\n variants: {\n disabled: {\n true: {\n pointerEvents: \"none\"\n }\n }\n }\n});\nvar TabsContentFrame = (0, import_core.styled)(import_core.View, {\n displayName: \"TabsContent\"\n});\nvar TabsListDisabledContext = /* @__PURE__ */ React.createContext(false);\nvar TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList2(propsIn, forwardedRef) {\n var props = propsIn;\n var { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;\n var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);\n var { listProps: headlessListProps } = (0, import_tabs_headless.useTabsList)({\n orientation: context.orientation,\n disabled\n });\n return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabsListDisabledContext.Provider, {\n value: disabled,\n children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_roving_focus.RovingFocusGroup, {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n orientation: context.orientation,\n dir: context.dir,\n loop,\n asChild: true,\n children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabsListFrame, {\n ...headlessListProps,\n orientation: context.orientation,\n ref: forwardedRef,\n ...listProps,\n children\n })\n })\n });\n});\nvar TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(propsIn, forwardedRef) {\n var props = propsIn;\n var { __scopeTabs, value, disabled: disabledProp, onInteraction, activeStyle, activeTheme, onLayout, onMouseEnter, onMouseLeave, onPress, onKeyDown, onFocus, onBlur, ...triggerProps } = props;\n var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);\n var listDisabled = React.useContext(TabsListDisabledContext);\n var disabled = (disabledProp !== null && disabledProp !== void 0 ? disabledProp : listDisabled) === true;\n var groupItemProps = (0, import_group.useGroupItem)({\n disabled\n });\n var { isSelected, tabProps } = (0, import_tabs_headless.useTab)({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n disabled,\n activationMode: context.activationMode,\n onChange: context.onChange\n });\n var { onPress: activateOnPress, onKeyDown: activateOnKeyDown, onFocus: activateOnFocus, ...tabA11yProps } = tabProps;\n var [layout, setLayout] = React.useState(null);\n var triggerRef = React.useRef(null);\n var emitInteraction = (0, import_web.useEvent)(function(type, layout2) {\n onInteraction === null || onInteraction === void 0 ? void 0 : onInteraction(type, layout2);\n });\n React.useEffect(function() {\n context.registerTrigger();\n return function() {\n return context.unregisterTrigger();\n };\n }, []);\n React.useEffect(function() {\n if (!triggerRef.current || !import_constants.isWeb) return;\n var element = triggerRef.current;\n function updateTriggerSize() {\n var next = {\n width: element.offsetWidth,\n height: element.offsetHeight,\n x: element.offsetLeft,\n y: element.offsetTop\n };\n setLayout(function(previous) {\n return previous && previous.width === next.width && previous.height === next.height && previous.x === next.x && previous.y === next.y ? previous : next;\n });\n }\n updateTriggerSize();\n var observer = new ResizeObserver(updateTriggerSize);\n observer.observe(element);\n var offsetParent = element.offsetParent;\n if (offsetParent) {\n observer.observe(offsetParent);\n }\n return function() {\n return observer.disconnect();\n };\n }, [\n context.triggersCount\n ]);\n React.useEffect(function() {\n if (isSelected && layout) {\n emitInteraction(\"select\", layout);\n }\n }, [\n emitInteraction,\n isSelected,\n layout\n ]);\n return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_roving_focus.RovingFocusGroup.Item, {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n asChild: true,\n tabIndex: disabled ? -1 : 0,\n active: isSelected,\n children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabsTabFrame, {\n onLayout: import_constants.isWeb ? onLayout : (0, import_helpers.composeEventHandlers)(onLayout, function(event) {\n setLayout(event.nativeEvent.layout);\n }),\n onMouseEnter: (0, import_helpers.composeEventHandlers)(onMouseEnter, function() {\n if (layout) {\n emitInteraction(\"hover\", layout);\n }\n }),\n onMouseLeave: (0, import_helpers.composeEventHandlers)(onMouseLeave, function() {\n emitInteraction(\"hover\", null);\n }),\n ...tabA11yProps,\n theme: isSelected ? activeTheme !== null && activeTheme !== void 0 ? activeTheme : null : null,\n ...groupItemProps,\n ...triggerProps,\n // after triggerProps so active styles beat base styles from styled() skins\n style: [\n triggerProps.style,\n isSelected && activeStyle\n ],\n ref: (0, import_compose_refs.composeRefs)(forwardedRef, triggerRef),\n onPress: (0, import_helpers.composeEventHandlers)(onPress !== null && onPress !== void 0 ? onPress : void 0, activateOnPress),\n ...import_constants.isWeb && {\n onKeyDown: (0, import_helpers.composeEventHandlers)(onKeyDown, activateOnKeyDown),\n // emit the focus interaction before activating, matching the order\n // the indicator animations were built against\n onFocus: (0, import_helpers.composeEventHandlers)(onFocus, (0, import_helpers.composeEventHandlers)(function() {\n if (layout) {\n emitInteraction(\"focus\", layout);\n }\n }, activateOnFocus)),\n onBlur: (0, import_helpers.composeEventHandlers)(onBlur, function() {\n emitInteraction(\"focus\", null);\n })\n }\n })\n });\n});\nvar TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function TabsContent2(propsIn, forwardedRef) {\n var props = propsIn;\n var { __scopeTabs, value, forceMount, children, ...contentProps } = props;\n var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);\n var { shouldMount, contentProps: headlessContentProps } = (0, import_tabs_headless.useTabContent)({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n orientation: context.orientation,\n forceMount\n });\n if (!shouldMount) {\n return null;\n }\n return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabsContentFrame, {\n // @ts-ignore hidden is a web-only accessibility attribute\n ...headlessContentProps,\n ...contentProps,\n ref: forwardedRef,\n children\n }, value);\n});\nvar TabsComponent = (0, import_core.createStyledHOC)(TabsFrame, function Tabs(propsIn, forwardedRef) {\n var props = propsIn;\n var { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = \"horizontal\", dir, activationMode = \"automatic\", ...tabsProps } = props;\n var { value, setValue, baseId, direction, triggersCount, registerTrigger, unregisterTrigger, tabsProps: headlessTabsProps } = (0, import_tabs_headless.useTabs)({\n value: valueProp,\n onValueChange,\n defaultValue,\n orientation,\n dir,\n activationMode\n });\n return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_StyledContext.TabsProvider, {\n scope: __scopeTabs,\n baseId,\n value,\n onChange: setValue,\n orientation,\n dir: direction,\n activationMode,\n registerTrigger,\n triggersCount,\n unregisterTrigger,\n children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabsFrame, {\n direction,\n ...headlessTabsProps,\n ...tabsProps,\n ref: forwardedRef\n })\n });\n});\nvar Tabs2 = (0, import_helpers.withStaticProperties)(TabsComponent, {\n Frame: TabsFrame,\n List: TabsList,\n Tab: TabsTab,\n Content: TabsContent\n});\n//# sourceMappingURL=Tabs.js.map\n"],"mappings":"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"}
|
package/dist/esm/Tabs.mjs
CHANGED
|
@@ -23,7 +23,8 @@ const TabsTabFrame = styled(View, {
|
|
|
23
23
|
});
|
|
24
24
|
const TabsContentFrame = styled(View, { displayName: "TabsContent" });
|
|
25
25
|
const TabsListDisabledContext = React.createContext(false);
|
|
26
|
-
const TabsList = createStyledHOC(TabsListFrame, function TabsList2(
|
|
26
|
+
const TabsList = createStyledHOC(TabsListFrame, function TabsList2(propsIn, forwardedRef) {
|
|
27
|
+
const props = propsIn;
|
|
27
28
|
const { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;
|
|
28
29
|
const context = useTabsContext(__scopeTabs);
|
|
29
30
|
const { listProps: headlessListProps } = useTabsList({
|
|
@@ -48,7 +49,8 @@ const TabsList = createStyledHOC(TabsListFrame, function TabsList2(props, forwar
|
|
|
48
49
|
})
|
|
49
50
|
});
|
|
50
51
|
});
|
|
51
|
-
const TabsTab = createStyledHOC(TabsTabFrame, function TabsTab2(
|
|
52
|
+
const TabsTab = createStyledHOC(TabsTabFrame, function TabsTab2(propsIn, forwardedRef) {
|
|
53
|
+
const props = propsIn;
|
|
52
54
|
const { __scopeTabs, value, disabled: disabledProp, onInteraction, activeStyle, activeTheme, onLayout, onMouseEnter, onMouseLeave, onPress, onKeyDown, onFocus, onBlur, ...triggerProps } = props;
|
|
53
55
|
const context = useTabsContext(__scopeTabs);
|
|
54
56
|
const listDisabled = React.useContext(TabsListDisabledContext);
|
|
@@ -140,7 +142,8 @@ const TabsTab = createStyledHOC(TabsTabFrame, function TabsTab2(props, forwarded
|
|
|
140
142
|
})
|
|
141
143
|
});
|
|
142
144
|
});
|
|
143
|
-
const TabsContent = createStyledHOC(TabsContentFrame, function TabsContent2(
|
|
145
|
+
const TabsContent = createStyledHOC(TabsContentFrame, function TabsContent2(propsIn, forwardedRef) {
|
|
146
|
+
const props = propsIn;
|
|
144
147
|
const { __scopeTabs, value, forceMount, children, ...contentProps } = props;
|
|
145
148
|
const context = useTabsContext(__scopeTabs);
|
|
146
149
|
const { shouldMount, contentProps: headlessContentProps } = useTabContent({
|
|
@@ -160,7 +163,8 @@ const TabsContent = createStyledHOC(TabsContentFrame, function TabsContent2(prop
|
|
|
160
163
|
children
|
|
161
164
|
}, value);
|
|
162
165
|
});
|
|
163
|
-
const TabsComponent = createStyledHOC(TabsFrame, function Tabs(
|
|
166
|
+
const TabsComponent = createStyledHOC(TabsFrame, function Tabs(propsIn, forwardedRef) {
|
|
167
|
+
const props = propsIn;
|
|
164
168
|
const { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = "horizontal", dir, activationMode = "automatic", ...tabsProps } = props;
|
|
165
169
|
const { value, setValue, baseId, direction, triggersCount, registerTrigger, unregisterTrigger, tabsProps: headlessTabsProps } = useTabs({
|
|
166
170
|
value: valueProp,
|
package/dist/esm/Tabs.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.js","names":[],"sources":["esm/Tabs.js"],"sourcesContent":["import { composeRefs } from \"@tamagui/compose-refs\";\nimport { isWeb } from \"@tamagui/constants\";\nimport { createStyledHOC, styled, View } from \"@tamagui/core\";\nimport { Group, useGroupItem } from \"@tamagui/group\";\nimport { composeEventHandlers, withStaticProperties } from \"@tamagui/helpers\";\nimport { RovingFocusGroup } from \"@tamagui/roving-focus\";\nimport { useTab, useTabContent, useTabs, useTabsList } from \"@tamagui/tabs-headless\";\nimport { useEvent } from \"@tamagui/web\";\nimport * as React from \"react\";\nimport { TabsProvider, useTabsContext } from \"./StyledContext\";\nimport { jsx } from \"react/jsx-runtime\";\nconst TABS_CONTEXT = \"TabsContext\";\nconst TabsFrame = styled(View, {\n displayName: \"Tabs\"\n});\nconst TabsListFrame = styled(Group, {\n displayName: \"TabsList\",\n role: \"tablist\"\n});\nconst TabsTabFrame = styled(View, {\n displayName: \"TabsTrigger\",\n role: \"tab\",\n variants: {\n disabled: {\n true: {\n pointerEvents: \"none\"\n }\n }\n }\n});\nconst TabsContentFrame = styled(View, {\n displayName: \"TabsContent\"\n});\nconst TabsListDisabledContext = React.createContext(false);\nconst TabsList = createStyledHOC(\n TabsListFrame,\n function TabsList2(props, forwardedRef) {\n const { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;\n const context = useTabsContext(__scopeTabs);\n const { listProps: headlessListProps } = useTabsList({\n orientation: context.orientation,\n disabled\n });\n return /* @__PURE__ */ jsx(TabsListDisabledContext.Provider, { value: disabled, children: /* @__PURE__ */ jsx(\n RovingFocusGroup,\n {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n orientation: context.orientation,\n dir: context.dir,\n loop,\n asChild: true,\n children: /* @__PURE__ */ jsx(\n TabsListFrame,\n {\n ...headlessListProps,\n orientation: context.orientation,\n ref: forwardedRef,\n ...listProps,\n children\n }\n )\n }\n ) });\n }\n);\nconst TabsTab = createStyledHOC(\n TabsTabFrame,\n function TabsTab2(props, forwardedRef) {\n const {\n __scopeTabs,\n value,\n disabled: disabledProp,\n onInteraction,\n activeStyle,\n activeTheme,\n onLayout,\n onMouseEnter,\n onMouseLeave,\n onPress,\n onKeyDown,\n onFocus,\n onBlur,\n ...triggerProps\n } = props;\n const context = useTabsContext(__scopeTabs);\n const listDisabled = React.useContext(TabsListDisabledContext);\n const disabled = (disabledProp ?? listDisabled) === true;\n const groupItemProps = useGroupItem({ disabled });\n const { isSelected, tabProps } = useTab({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n disabled,\n activationMode: context.activationMode,\n onChange: context.onChange\n });\n const {\n onPress: activateOnPress,\n onKeyDown: activateOnKeyDown,\n onFocus: activateOnFocus,\n ...tabA11yProps\n } = tabProps;\n const [layout, setLayout] = React.useState(null);\n const triggerRef = React.useRef(null);\n const emitInteraction = useEvent(\n (type, layout2) => {\n onInteraction?.(type, layout2);\n }\n );\n React.useEffect(() => {\n context.registerTrigger();\n return () => context.unregisterTrigger();\n }, []);\n React.useEffect(() => {\n if (!triggerRef.current || !isWeb) return;\n const element = triggerRef.current;\n function updateTriggerSize() {\n const next = {\n width: element.offsetWidth,\n height: element.offsetHeight,\n x: element.offsetLeft,\n y: element.offsetTop\n };\n setLayout(\n (previous) => previous && previous.width === next.width && previous.height === next.height && previous.x === next.x && previous.y === next.y ? previous : next\n );\n }\n updateTriggerSize();\n const observer = new ResizeObserver(updateTriggerSize);\n observer.observe(element);\n const offsetParent = element.offsetParent;\n if (offsetParent) {\n observer.observe(offsetParent);\n }\n return () => observer.disconnect();\n }, [context.triggersCount]);\n React.useEffect(() => {\n if (isSelected && layout) {\n emitInteraction(\"select\", layout);\n }\n }, [emitInteraction, isSelected, layout]);\n return /* @__PURE__ */ jsx(\n RovingFocusGroup.Item,\n {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n asChild: true,\n tabIndex: disabled ? -1 : 0,\n active: isSelected,\n children: /* @__PURE__ */ jsx(\n TabsTabFrame,\n {\n onLayout: isWeb ? onLayout : composeEventHandlers(onLayout, (event) => {\n setLayout(event.nativeEvent.layout);\n }),\n onMouseEnter: composeEventHandlers(onMouseEnter, () => {\n if (layout) {\n emitInteraction(\"hover\", layout);\n }\n }),\n onMouseLeave: composeEventHandlers(onMouseLeave, () => {\n emitInteraction(\"hover\", null);\n }),\n ...tabA11yProps,\n theme: isSelected ? activeTheme ?? null : null,\n ...groupItemProps,\n ...triggerProps,\n style: [triggerProps.style, isSelected && activeStyle],\n ref: composeRefs(forwardedRef, triggerRef),\n onPress: composeEventHandlers(onPress ?? void 0, activateOnPress),\n ...isWeb && {\n onKeyDown: composeEventHandlers(onKeyDown, activateOnKeyDown),\n // emit the focus interaction before activating, matching the order\n // the indicator animations were built against\n onFocus: composeEventHandlers(\n onFocus,\n composeEventHandlers(() => {\n if (layout) {\n emitInteraction(\"focus\", layout);\n }\n }, activateOnFocus)\n ),\n onBlur: composeEventHandlers(onBlur, () => {\n emitInteraction(\"focus\", null);\n })\n }\n }\n )\n }\n );\n }\n);\nconst TabsContent = createStyledHOC(\n TabsContentFrame,\n function TabsContent2(props, forwardedRef) {\n const { __scopeTabs, value, forceMount, children, ...contentProps } = props;\n const context = useTabsContext(__scopeTabs);\n const { shouldMount, contentProps: headlessContentProps } = useTabContent({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n orientation: context.orientation,\n forceMount\n });\n if (!shouldMount) {\n return null;\n }\n return /* @__PURE__ */ jsx(\n TabsContentFrame,\n {\n ...headlessContentProps,\n ...contentProps,\n ref: forwardedRef,\n children\n },\n value\n );\n }\n);\nconst TabsComponent = createStyledHOC(\n TabsFrame,\n function Tabs(props, forwardedRef) {\n const {\n __scopeTabs,\n value: valueProp,\n onValueChange,\n defaultValue,\n orientation = \"horizontal\",\n dir,\n activationMode = \"automatic\",\n ...tabsProps\n } = props;\n const {\n value,\n setValue,\n baseId,\n direction,\n triggersCount,\n registerTrigger,\n unregisterTrigger,\n tabsProps: headlessTabsProps\n } = useTabs({\n value: valueProp,\n onValueChange,\n defaultValue,\n orientation,\n dir,\n activationMode\n });\n return /* @__PURE__ */ jsx(\n TabsProvider,\n {\n scope: __scopeTabs,\n baseId,\n value,\n onChange: setValue,\n orientation,\n dir: direction,\n activationMode,\n registerTrigger,\n triggersCount,\n unregisterTrigger,\n children: /* @__PURE__ */ jsx(\n TabsFrame,\n {\n direction,\n ...headlessTabsProps,\n ...tabsProps,\n ref: forwardedRef\n }\n )\n }\n );\n }\n);\nconst Tabs2 = withStaticProperties(TabsComponent, {\n Frame: TabsFrame,\n List: TabsList,\n Tab: TabsTab,\n Content: TabsContent\n});\nexport {\n Tabs2 as Tabs,\n TabsContent,\n TabsContentFrame,\n TabsFrame,\n TabsList,\n TabsListFrame,\n TabsTab,\n TabsTabFrame\n};\n//# sourceMappingURL=Tabs.js.map\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tabs.js","names":[],"sources":["esm/Tabs.js"],"sourcesContent":["import { composeRefs } from \"@tamagui/compose-refs\";\nimport { isWeb } from \"@tamagui/constants\";\nimport { createStyledHOC, styled, View } from \"@tamagui/core\";\nimport { Group, useGroupItem } from \"@tamagui/group\";\nimport { composeEventHandlers, withStaticProperties } from \"@tamagui/helpers\";\nimport { RovingFocusGroup } from \"@tamagui/roving-focus\";\nimport { useTab, useTabContent, useTabs, useTabsList } from \"@tamagui/tabs-headless\";\nimport { useEvent } from \"@tamagui/web\";\nimport * as React from \"react\";\nimport { TabsProvider, useTabsContext } from \"./StyledContext\";\nimport { jsx } from \"react/jsx-runtime\";\nconst TABS_CONTEXT = \"TabsContext\";\nconst TabsFrame = styled(View, {\n displayName: \"Tabs\"\n});\nconst TabsListFrame = styled(Group, {\n displayName: \"TabsList\",\n role: \"tablist\"\n});\nconst TabsTabFrame = styled(View, {\n displayName: \"TabsTrigger\",\n role: \"tab\",\n variants: {\n disabled: {\n true: {\n pointerEvents: \"none\"\n }\n }\n }\n});\nconst TabsContentFrame = styled(View, {\n displayName: \"TabsContent\"\n});\nconst TabsListDisabledContext = React.createContext(false);\nconst TabsList = createStyledHOC(\n TabsListFrame,\n function TabsList2(propsIn, forwardedRef) {\n const props = propsIn;\n const { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;\n const context = useTabsContext(__scopeTabs);\n const { listProps: headlessListProps } = useTabsList({\n orientation: context.orientation,\n disabled\n });\n return /* @__PURE__ */ jsx(TabsListDisabledContext.Provider, { value: disabled, children: /* @__PURE__ */ jsx(\n RovingFocusGroup,\n {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n orientation: context.orientation,\n dir: context.dir,\n loop,\n asChild: true,\n children: /* @__PURE__ */ jsx(\n TabsListFrame,\n {\n ...headlessListProps,\n orientation: context.orientation,\n ref: forwardedRef,\n ...listProps,\n children\n }\n )\n }\n ) });\n }\n);\nconst TabsTab = createStyledHOC(\n TabsTabFrame,\n function TabsTab2(propsIn, forwardedRef) {\n const props = propsIn;\n const {\n __scopeTabs,\n value,\n disabled: disabledProp,\n onInteraction,\n activeStyle,\n activeTheme,\n onLayout,\n onMouseEnter,\n onMouseLeave,\n onPress,\n onKeyDown,\n onFocus,\n onBlur,\n ...triggerProps\n } = props;\n const context = useTabsContext(__scopeTabs);\n const listDisabled = React.useContext(TabsListDisabledContext);\n const disabled = (disabledProp ?? listDisabled) === true;\n const groupItemProps = useGroupItem({ disabled });\n const { isSelected, tabProps } = useTab({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n disabled,\n activationMode: context.activationMode,\n onChange: context.onChange\n });\n const {\n onPress: activateOnPress,\n onKeyDown: activateOnKeyDown,\n onFocus: activateOnFocus,\n ...tabA11yProps\n } = tabProps;\n const [layout, setLayout] = React.useState(null);\n const triggerRef = React.useRef(null);\n const emitInteraction = useEvent(\n (type, layout2) => {\n onInteraction?.(type, layout2);\n }\n );\n React.useEffect(() => {\n context.registerTrigger();\n return () => context.unregisterTrigger();\n }, []);\n React.useEffect(() => {\n if (!triggerRef.current || !isWeb) return;\n const element = triggerRef.current;\n function updateTriggerSize() {\n const next = {\n width: element.offsetWidth,\n height: element.offsetHeight,\n x: element.offsetLeft,\n y: element.offsetTop\n };\n setLayout(\n (previous) => previous && previous.width === next.width && previous.height === next.height && previous.x === next.x && previous.y === next.y ? previous : next\n );\n }\n updateTriggerSize();\n const observer = new ResizeObserver(updateTriggerSize);\n observer.observe(element);\n const offsetParent = element.offsetParent;\n if (offsetParent) {\n observer.observe(offsetParent);\n }\n return () => observer.disconnect();\n }, [context.triggersCount]);\n React.useEffect(() => {\n if (isSelected && layout) {\n emitInteraction(\"select\", layout);\n }\n }, [emitInteraction, isSelected, layout]);\n return /* @__PURE__ */ jsx(\n RovingFocusGroup.Item,\n {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n asChild: true,\n tabIndex: disabled ? -1 : 0,\n active: isSelected,\n children: /* @__PURE__ */ jsx(\n TabsTabFrame,\n {\n onLayout: isWeb ? onLayout : composeEventHandlers(onLayout, (event) => {\n setLayout(event.nativeEvent.layout);\n }),\n onMouseEnter: composeEventHandlers(onMouseEnter, () => {\n if (layout) {\n emitInteraction(\"hover\", layout);\n }\n }),\n onMouseLeave: composeEventHandlers(onMouseLeave, () => {\n emitInteraction(\"hover\", null);\n }),\n ...tabA11yProps,\n theme: isSelected ? activeTheme ?? null : null,\n ...groupItemProps,\n ...triggerProps,\n style: [triggerProps.style, isSelected && activeStyle],\n ref: composeRefs(forwardedRef, triggerRef),\n onPress: composeEventHandlers(onPress ?? void 0, activateOnPress),\n ...isWeb && {\n onKeyDown: composeEventHandlers(onKeyDown, activateOnKeyDown),\n // emit the focus interaction before activating, matching the order\n // the indicator animations were built against\n onFocus: composeEventHandlers(\n onFocus,\n composeEventHandlers(() => {\n if (layout) {\n emitInteraction(\"focus\", layout);\n }\n }, activateOnFocus)\n ),\n onBlur: composeEventHandlers(onBlur, () => {\n emitInteraction(\"focus\", null);\n })\n }\n }\n )\n }\n );\n }\n);\nconst TabsContent = createStyledHOC(\n TabsContentFrame,\n function TabsContent2(propsIn, forwardedRef) {\n const props = propsIn;\n const { __scopeTabs, value, forceMount, children, ...contentProps } = props;\n const context = useTabsContext(__scopeTabs);\n const { shouldMount, contentProps: headlessContentProps } = useTabContent({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n orientation: context.orientation,\n forceMount\n });\n if (!shouldMount) {\n return null;\n }\n return /* @__PURE__ */ jsx(\n TabsContentFrame,\n {\n ...headlessContentProps,\n ...contentProps,\n ref: forwardedRef,\n children\n },\n value\n );\n }\n);\nconst TabsComponent = createStyledHOC(\n TabsFrame,\n function Tabs(propsIn, forwardedRef) {\n const props = propsIn;\n const {\n __scopeTabs,\n value: valueProp,\n onValueChange,\n defaultValue,\n orientation = \"horizontal\",\n dir,\n activationMode = \"automatic\",\n ...tabsProps\n } = props;\n const {\n value,\n setValue,\n baseId,\n direction,\n triggersCount,\n registerTrigger,\n unregisterTrigger,\n tabsProps: headlessTabsProps\n } = useTabs({\n value: valueProp,\n onValueChange,\n defaultValue,\n orientation,\n dir,\n activationMode\n });\n return /* @__PURE__ */ jsx(\n TabsProvider,\n {\n scope: __scopeTabs,\n baseId,\n value,\n onChange: setValue,\n orientation,\n dir: direction,\n activationMode,\n registerTrigger,\n triggersCount,\n unregisterTrigger,\n children: /* @__PURE__ */ jsx(\n TabsFrame,\n {\n direction,\n ...headlessTabsProps,\n ...tabsProps,\n ref: forwardedRef\n }\n )\n }\n );\n }\n);\nconst Tabs2 = withStaticProperties(TabsComponent, {\n Frame: TabsFrame,\n List: TabsList,\n Tab: TabsTab,\n Content: TabsContent\n});\nexport {\n Tabs2 as Tabs,\n TabsContent,\n TabsContentFrame,\n TabsFrame,\n TabsList,\n TabsListFrame,\n TabsTab,\n TabsTabFrame\n};\n//# sourceMappingURL=Tabs.js.map\n"],"mappings":"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"}
|
package/dist/esm/Tabs.native.js
CHANGED
|
@@ -23,7 +23,8 @@ var TabsTabFrame = styled(View, {
|
|
|
23
23
|
});
|
|
24
24
|
var TabsContentFrame = styled(View, { displayName: "TabsContent" });
|
|
25
25
|
var TabsListDisabledContext = /* @__PURE__ */ React.createContext(false);
|
|
26
|
-
var TabsList = createStyledHOC(TabsListFrame, function TabsList2(
|
|
26
|
+
var TabsList = createStyledHOC(TabsListFrame, function TabsList2(propsIn, forwardedRef) {
|
|
27
|
+
var props = propsIn;
|
|
27
28
|
var { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;
|
|
28
29
|
var context = useTabsContext(__scopeTabs);
|
|
29
30
|
var { listProps: headlessListProps } = useTabsList({
|
|
@@ -48,7 +49,8 @@ var TabsList = createStyledHOC(TabsListFrame, function TabsList2(props, forwarde
|
|
|
48
49
|
})
|
|
49
50
|
});
|
|
50
51
|
});
|
|
51
|
-
var TabsTab = createStyledHOC(TabsTabFrame, function TabsTab2(
|
|
52
|
+
var TabsTab = createStyledHOC(TabsTabFrame, function TabsTab2(propsIn, forwardedRef) {
|
|
53
|
+
var props = propsIn;
|
|
52
54
|
var { __scopeTabs, value, disabled: disabledProp, onInteraction, activeStyle, activeTheme, onLayout, onMouseEnter, onMouseLeave, onPress, onKeyDown, onFocus, onBlur, ...triggerProps } = props;
|
|
53
55
|
var context = useTabsContext(__scopeTabs);
|
|
54
56
|
var listDisabled = React.useContext(TabsListDisabledContext);
|
|
@@ -146,7 +148,8 @@ var TabsTab = createStyledHOC(TabsTabFrame, function TabsTab2(props, forwardedRe
|
|
|
146
148
|
})
|
|
147
149
|
});
|
|
148
150
|
});
|
|
149
|
-
var TabsContent = createStyledHOC(TabsContentFrame, function TabsContent2(
|
|
151
|
+
var TabsContent = createStyledHOC(TabsContentFrame, function TabsContent2(propsIn, forwardedRef) {
|
|
152
|
+
var props = propsIn;
|
|
150
153
|
var { __scopeTabs, value, forceMount, children, ...contentProps } = props;
|
|
151
154
|
var context = useTabsContext(__scopeTabs);
|
|
152
155
|
var { shouldMount, contentProps: headlessContentProps } = useTabContent({
|
|
@@ -166,7 +169,8 @@ var TabsContent = createStyledHOC(TabsContentFrame, function TabsContent2(props,
|
|
|
166
169
|
children
|
|
167
170
|
}, value);
|
|
168
171
|
});
|
|
169
|
-
var TabsComponent = createStyledHOC(TabsFrame, function Tabs(
|
|
172
|
+
var TabsComponent = createStyledHOC(TabsFrame, function Tabs(propsIn, forwardedRef) {
|
|
173
|
+
var props = propsIn;
|
|
170
174
|
var { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = "horizontal", dir, activationMode = "automatic", ...tabsProps } = props;
|
|
171
175
|
var { value, setValue, baseId, direction, triggersCount, registerTrigger, unregisterTrigger, tabsProps: headlessTabsProps } = useTabs({
|
|
172
176
|
value: valueProp,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.native.js","names":[],"sources":["esm/Tabs.native.js"],"sourcesContent":["import { jsx as _jsx } from \"react/jsx-runtime\";\nimport { composeRefs } from \"@tamagui/compose-refs\";\nimport { isWeb } from \"@tamagui/constants\";\nimport { createStyledHOC, styled, View } from \"@tamagui/core\";\nimport { Group, useGroupItem } from \"@tamagui/group\";\nimport { composeEventHandlers, withStaticProperties } from \"@tamagui/helpers\";\nimport { RovingFocusGroup } from \"@tamagui/roving-focus\";\nimport { useTab, useTabContent, useTabs, useTabsList } from \"@tamagui/tabs-headless\";\nimport { useEvent } from \"@tamagui/web\";\nimport * as React from \"react\";\nimport { TabsProvider, useTabsContext } from \"./StyledContext\";\nvar TABS_CONTEXT = \"TabsContext\";\nvar TabsFrame = styled(View, {\n displayName: \"Tabs\"\n});\nvar TabsListFrame = styled(Group, {\n displayName: \"TabsList\",\n role: \"tablist\"\n});\nvar TabsTabFrame = styled(View, {\n displayName: \"TabsTrigger\",\n role: \"tab\",\n variants: {\n disabled: {\n true: {\n pointerEvents: \"none\"\n }\n }\n }\n});\nvar TabsContentFrame = styled(View, {\n displayName: \"TabsContent\"\n});\nvar TabsListDisabledContext = /* @__PURE__ */ React.createContext(false);\nvar TabsList = createStyledHOC(TabsListFrame, function TabsList2(props, forwardedRef) {\n var { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;\n var context = useTabsContext(__scopeTabs);\n var { listProps: headlessListProps } = useTabsList({\n orientation: context.orientation,\n disabled\n });\n return /* @__PURE__ */ _jsx(TabsListDisabledContext.Provider, {\n value: disabled,\n children: /* @__PURE__ */ _jsx(RovingFocusGroup, {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n orientation: context.orientation,\n dir: context.dir,\n loop,\n asChild: true,\n children: /* @__PURE__ */ _jsx(TabsListFrame, {\n ...headlessListProps,\n orientation: context.orientation,\n ref: forwardedRef,\n ...listProps,\n children\n })\n })\n });\n});\nvar TabsTab = createStyledHOC(TabsTabFrame, function TabsTab2(props, forwardedRef) {\n var { __scopeTabs, value, disabled: disabledProp, onInteraction, activeStyle, activeTheme, onLayout, onMouseEnter, onMouseLeave, onPress, onKeyDown, onFocus, onBlur, ...triggerProps } = props;\n var context = useTabsContext(__scopeTabs);\n var listDisabled = React.useContext(TabsListDisabledContext);\n var disabled = (disabledProp !== null && disabledProp !== void 0 ? disabledProp : listDisabled) === true;\n var groupItemProps = useGroupItem({\n disabled\n });\n var { isSelected, tabProps } = useTab({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n disabled,\n activationMode: context.activationMode,\n onChange: context.onChange\n });\n var { onPress: activateOnPress, onKeyDown: activateOnKeyDown, onFocus: activateOnFocus, ...tabA11yProps } = tabProps;\n var [layout, setLayout] = React.useState(null);\n var triggerRef = React.useRef(null);\n var emitInteraction = useEvent(function(type, layout2) {\n onInteraction === null || onInteraction === void 0 ? void 0 : onInteraction(type, layout2);\n });\n React.useEffect(function() {\n context.registerTrigger();\n return function() {\n return context.unregisterTrigger();\n };\n }, []);\n React.useEffect(function() {\n if (!triggerRef.current || !isWeb) return;\n var element = triggerRef.current;\n function updateTriggerSize() {\n var next = {\n width: element.offsetWidth,\n height: element.offsetHeight,\n x: element.offsetLeft,\n y: element.offsetTop\n };\n setLayout(function(previous) {\n return previous && previous.width === next.width && previous.height === next.height && previous.x === next.x && previous.y === next.y ? previous : next;\n });\n }\n updateTriggerSize();\n var observer = new ResizeObserver(updateTriggerSize);\n observer.observe(element);\n var offsetParent = element.offsetParent;\n if (offsetParent) {\n observer.observe(offsetParent);\n }\n return function() {\n return observer.disconnect();\n };\n }, [\n context.triggersCount\n ]);\n React.useEffect(function() {\n if (isSelected && layout) {\n emitInteraction(\"select\", layout);\n }\n }, [\n emitInteraction,\n isSelected,\n layout\n ]);\n return /* @__PURE__ */ _jsx(RovingFocusGroup.Item, {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n asChild: true,\n tabIndex: disabled ? -1 : 0,\n active: isSelected,\n children: /* @__PURE__ */ _jsx(TabsTabFrame, {\n onLayout: isWeb ? onLayout : composeEventHandlers(onLayout, function(event) {\n setLayout(event.nativeEvent.layout);\n }),\n onMouseEnter: composeEventHandlers(onMouseEnter, function() {\n if (layout) {\n emitInteraction(\"hover\", layout);\n }\n }),\n onMouseLeave: composeEventHandlers(onMouseLeave, function() {\n emitInteraction(\"hover\", null);\n }),\n ...tabA11yProps,\n theme: isSelected ? activeTheme !== null && activeTheme !== void 0 ? activeTheme : null : null,\n ...groupItemProps,\n ...triggerProps,\n // after triggerProps so active styles beat base styles from styled() skins\n style: [\n triggerProps.style,\n isSelected && activeStyle\n ],\n ref: composeRefs(forwardedRef, triggerRef),\n onPress: composeEventHandlers(onPress !== null && onPress !== void 0 ? onPress : void 0, activateOnPress),\n ...isWeb && {\n onKeyDown: composeEventHandlers(onKeyDown, activateOnKeyDown),\n // emit the focus interaction before activating, matching the order\n // the indicator animations were built against\n onFocus: composeEventHandlers(onFocus, composeEventHandlers(function() {\n if (layout) {\n emitInteraction(\"focus\", layout);\n }\n }, activateOnFocus)),\n onBlur: composeEventHandlers(onBlur, function() {\n emitInteraction(\"focus\", null);\n })\n }\n })\n });\n});\nvar TabsContent = createStyledHOC(TabsContentFrame, function TabsContent2(props, forwardedRef) {\n var { __scopeTabs, value, forceMount, children, ...contentProps } = props;\n var context = useTabsContext(__scopeTabs);\n var { shouldMount, contentProps: headlessContentProps } = useTabContent({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n orientation: context.orientation,\n forceMount\n });\n if (!shouldMount) {\n return null;\n }\n return /* @__PURE__ */ _jsx(TabsContentFrame, {\n // @ts-ignore hidden is a web-only accessibility attribute\n ...headlessContentProps,\n ...contentProps,\n ref: forwardedRef,\n children\n }, value);\n});\nvar TabsComponent = createStyledHOC(TabsFrame, function Tabs(props, forwardedRef) {\n var { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = \"horizontal\", dir, activationMode = \"automatic\", ...tabsProps } = props;\n var { value, setValue, baseId, direction, triggersCount, registerTrigger, unregisterTrigger, tabsProps: headlessTabsProps } = useTabs({\n value: valueProp,\n onValueChange,\n defaultValue,\n orientation,\n dir,\n activationMode\n });\n return /* @__PURE__ */ _jsx(TabsProvider, {\n scope: __scopeTabs,\n baseId,\n value,\n onChange: setValue,\n orientation,\n dir: direction,\n activationMode,\n registerTrigger,\n triggersCount,\n unregisterTrigger,\n children: /* @__PURE__ */ _jsx(TabsFrame, {\n direction,\n ...headlessTabsProps,\n ...tabsProps,\n ref: forwardedRef\n })\n });\n});\nvar Tabs2 = withStaticProperties(TabsComponent, {\n Frame: TabsFrame,\n List: TabsList,\n Tab: TabsTab,\n Content: TabsContent\n});\nexport {\n Tabs2 as Tabs,\n TabsContent,\n TabsContentFrame,\n TabsFrame,\n TabsList,\n TabsListFrame,\n TabsTab,\n TabsTabFrame\n};\n//# sourceMappingURL=Tabs.js.map\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tabs.native.js","names":[],"sources":["esm/Tabs.native.js"],"sourcesContent":["import { jsx as _jsx } from \"react/jsx-runtime\";\nimport { composeRefs } from \"@tamagui/compose-refs\";\nimport { isWeb } from \"@tamagui/constants\";\nimport { createStyledHOC, styled, View } from \"@tamagui/core\";\nimport { Group, useGroupItem } from \"@tamagui/group\";\nimport { composeEventHandlers, withStaticProperties } from \"@tamagui/helpers\";\nimport { RovingFocusGroup } from \"@tamagui/roving-focus\";\nimport { useTab, useTabContent, useTabs, useTabsList } from \"@tamagui/tabs-headless\";\nimport { useEvent } from \"@tamagui/web\";\nimport * as React from \"react\";\nimport { TabsProvider, useTabsContext } from \"./StyledContext\";\nvar TABS_CONTEXT = \"TabsContext\";\nvar TabsFrame = styled(View, {\n displayName: \"Tabs\"\n});\nvar TabsListFrame = styled(Group, {\n displayName: \"TabsList\",\n role: \"tablist\"\n});\nvar TabsTabFrame = styled(View, {\n displayName: \"TabsTrigger\",\n role: \"tab\",\n variants: {\n disabled: {\n true: {\n pointerEvents: \"none\"\n }\n }\n }\n});\nvar TabsContentFrame = styled(View, {\n displayName: \"TabsContent\"\n});\nvar TabsListDisabledContext = /* @__PURE__ */ React.createContext(false);\nvar TabsList = createStyledHOC(TabsListFrame, function TabsList2(propsIn, forwardedRef) {\n var props = propsIn;\n var { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;\n var context = useTabsContext(__scopeTabs);\n var { listProps: headlessListProps } = useTabsList({\n orientation: context.orientation,\n disabled\n });\n return /* @__PURE__ */ _jsx(TabsListDisabledContext.Provider, {\n value: disabled,\n children: /* @__PURE__ */ _jsx(RovingFocusGroup, {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n orientation: context.orientation,\n dir: context.dir,\n loop,\n asChild: true,\n children: /* @__PURE__ */ _jsx(TabsListFrame, {\n ...headlessListProps,\n orientation: context.orientation,\n ref: forwardedRef,\n ...listProps,\n children\n })\n })\n });\n});\nvar TabsTab = createStyledHOC(TabsTabFrame, function TabsTab2(propsIn, forwardedRef) {\n var props = propsIn;\n var { __scopeTabs, value, disabled: disabledProp, onInteraction, activeStyle, activeTheme, onLayout, onMouseEnter, onMouseLeave, onPress, onKeyDown, onFocus, onBlur, ...triggerProps } = props;\n var context = useTabsContext(__scopeTabs);\n var listDisabled = React.useContext(TabsListDisabledContext);\n var disabled = (disabledProp !== null && disabledProp !== void 0 ? disabledProp : listDisabled) === true;\n var groupItemProps = useGroupItem({\n disabled\n });\n var { isSelected, tabProps } = useTab({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n disabled,\n activationMode: context.activationMode,\n onChange: context.onChange\n });\n var { onPress: activateOnPress, onKeyDown: activateOnKeyDown, onFocus: activateOnFocus, ...tabA11yProps } = tabProps;\n var [layout, setLayout] = React.useState(null);\n var triggerRef = React.useRef(null);\n var emitInteraction = useEvent(function(type, layout2) {\n onInteraction === null || onInteraction === void 0 ? void 0 : onInteraction(type, layout2);\n });\n React.useEffect(function() {\n context.registerTrigger();\n return function() {\n return context.unregisterTrigger();\n };\n }, []);\n React.useEffect(function() {\n if (!triggerRef.current || !isWeb) return;\n var element = triggerRef.current;\n function updateTriggerSize() {\n var next = {\n width: element.offsetWidth,\n height: element.offsetHeight,\n x: element.offsetLeft,\n y: element.offsetTop\n };\n setLayout(function(previous) {\n return previous && previous.width === next.width && previous.height === next.height && previous.x === next.x && previous.y === next.y ? previous : next;\n });\n }\n updateTriggerSize();\n var observer = new ResizeObserver(updateTriggerSize);\n observer.observe(element);\n var offsetParent = element.offsetParent;\n if (offsetParent) {\n observer.observe(offsetParent);\n }\n return function() {\n return observer.disconnect();\n };\n }, [\n context.triggersCount\n ]);\n React.useEffect(function() {\n if (isSelected && layout) {\n emitInteraction(\"select\", layout);\n }\n }, [\n emitInteraction,\n isSelected,\n layout\n ]);\n return /* @__PURE__ */ _jsx(RovingFocusGroup.Item, {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n asChild: true,\n tabIndex: disabled ? -1 : 0,\n active: isSelected,\n children: /* @__PURE__ */ _jsx(TabsTabFrame, {\n onLayout: isWeb ? onLayout : composeEventHandlers(onLayout, function(event) {\n setLayout(event.nativeEvent.layout);\n }),\n onMouseEnter: composeEventHandlers(onMouseEnter, function() {\n if (layout) {\n emitInteraction(\"hover\", layout);\n }\n }),\n onMouseLeave: composeEventHandlers(onMouseLeave, function() {\n emitInteraction(\"hover\", null);\n }),\n ...tabA11yProps,\n theme: isSelected ? activeTheme !== null && activeTheme !== void 0 ? activeTheme : null : null,\n ...groupItemProps,\n ...triggerProps,\n // after triggerProps so active styles beat base styles from styled() skins\n style: [\n triggerProps.style,\n isSelected && activeStyle\n ],\n ref: composeRefs(forwardedRef, triggerRef),\n onPress: composeEventHandlers(onPress !== null && onPress !== void 0 ? onPress : void 0, activateOnPress),\n ...isWeb && {\n onKeyDown: composeEventHandlers(onKeyDown, activateOnKeyDown),\n // emit the focus interaction before activating, matching the order\n // the indicator animations were built against\n onFocus: composeEventHandlers(onFocus, composeEventHandlers(function() {\n if (layout) {\n emitInteraction(\"focus\", layout);\n }\n }, activateOnFocus)),\n onBlur: composeEventHandlers(onBlur, function() {\n emitInteraction(\"focus\", null);\n })\n }\n })\n });\n});\nvar TabsContent = createStyledHOC(TabsContentFrame, function TabsContent2(propsIn, forwardedRef) {\n var props = propsIn;\n var { __scopeTabs, value, forceMount, children, ...contentProps } = props;\n var context = useTabsContext(__scopeTabs);\n var { shouldMount, contentProps: headlessContentProps } = useTabContent({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n orientation: context.orientation,\n forceMount\n });\n if (!shouldMount) {\n return null;\n }\n return /* @__PURE__ */ _jsx(TabsContentFrame, {\n // @ts-ignore hidden is a web-only accessibility attribute\n ...headlessContentProps,\n ...contentProps,\n ref: forwardedRef,\n children\n }, value);\n});\nvar TabsComponent = createStyledHOC(TabsFrame, function Tabs(propsIn, forwardedRef) {\n var props = propsIn;\n var { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = \"horizontal\", dir, activationMode = \"automatic\", ...tabsProps } = props;\n var { value, setValue, baseId, direction, triggersCount, registerTrigger, unregisterTrigger, tabsProps: headlessTabsProps } = useTabs({\n value: valueProp,\n onValueChange,\n defaultValue,\n orientation,\n dir,\n activationMode\n });\n return /* @__PURE__ */ _jsx(TabsProvider, {\n scope: __scopeTabs,\n baseId,\n value,\n onChange: setValue,\n orientation,\n dir: direction,\n activationMode,\n registerTrigger,\n triggersCount,\n unregisterTrigger,\n children: /* @__PURE__ */ _jsx(TabsFrame, {\n direction,\n ...headlessTabsProps,\n ...tabsProps,\n ref: forwardedRef\n })\n });\n});\nvar Tabs2 = withStaticProperties(TabsComponent, {\n Frame: TabsFrame,\n List: TabsList,\n Tab: TabsTab,\n Content: TabsContent\n});\nexport {\n Tabs2 as Tabs,\n TabsContent,\n TabsContentFrame,\n TabsFrame,\n TabsList,\n TabsListFrame,\n TabsTab,\n TabsTabFrame\n};\n//# sourceMappingURL=Tabs.js.map\n"],"mappings":"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"}
|
package/dist/jsx/Tabs.mjs
CHANGED
|
@@ -23,7 +23,8 @@ const TabsTabFrame = styled(View, {
|
|
|
23
23
|
});
|
|
24
24
|
const TabsContentFrame = styled(View, { displayName: "TabsContent" });
|
|
25
25
|
const TabsListDisabledContext = React.createContext(false);
|
|
26
|
-
const TabsList = createStyledHOC(TabsListFrame, function TabsList2(
|
|
26
|
+
const TabsList = createStyledHOC(TabsListFrame, function TabsList2(propsIn, forwardedRef) {
|
|
27
|
+
const props = propsIn;
|
|
27
28
|
const { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;
|
|
28
29
|
const context = useTabsContext(__scopeTabs);
|
|
29
30
|
const { listProps: headlessListProps } = useTabsList({
|
|
@@ -48,7 +49,8 @@ const TabsList = createStyledHOC(TabsListFrame, function TabsList2(props, forwar
|
|
|
48
49
|
})
|
|
49
50
|
});
|
|
50
51
|
});
|
|
51
|
-
const TabsTab = createStyledHOC(TabsTabFrame, function TabsTab2(
|
|
52
|
+
const TabsTab = createStyledHOC(TabsTabFrame, function TabsTab2(propsIn, forwardedRef) {
|
|
53
|
+
const props = propsIn;
|
|
52
54
|
const { __scopeTabs, value, disabled: disabledProp, onInteraction, activeStyle, activeTheme, onLayout, onMouseEnter, onMouseLeave, onPress, onKeyDown, onFocus, onBlur, ...triggerProps } = props;
|
|
53
55
|
const context = useTabsContext(__scopeTabs);
|
|
54
56
|
const listDisabled = React.useContext(TabsListDisabledContext);
|
|
@@ -140,7 +142,8 @@ const TabsTab = createStyledHOC(TabsTabFrame, function TabsTab2(props, forwarded
|
|
|
140
142
|
})
|
|
141
143
|
});
|
|
142
144
|
});
|
|
143
|
-
const TabsContent = createStyledHOC(TabsContentFrame, function TabsContent2(
|
|
145
|
+
const TabsContent = createStyledHOC(TabsContentFrame, function TabsContent2(propsIn, forwardedRef) {
|
|
146
|
+
const props = propsIn;
|
|
144
147
|
const { __scopeTabs, value, forceMount, children, ...contentProps } = props;
|
|
145
148
|
const context = useTabsContext(__scopeTabs);
|
|
146
149
|
const { shouldMount, contentProps: headlessContentProps } = useTabContent({
|
|
@@ -160,7 +163,8 @@ const TabsContent = createStyledHOC(TabsContentFrame, function TabsContent2(prop
|
|
|
160
163
|
children
|
|
161
164
|
}, value);
|
|
162
165
|
});
|
|
163
|
-
const TabsComponent = createStyledHOC(TabsFrame, function Tabs(
|
|
166
|
+
const TabsComponent = createStyledHOC(TabsFrame, function Tabs(propsIn, forwardedRef) {
|
|
167
|
+
const props = propsIn;
|
|
164
168
|
const { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = "horizontal", dir, activationMode = "automatic", ...tabsProps } = props;
|
|
165
169
|
const { value, setValue, baseId, direction, triggersCount, registerTrigger, unregisterTrigger, tabsProps: headlessTabsProps } = useTabs({
|
|
166
170
|
value: valueProp,
|
package/dist/jsx/Tabs.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.js","names":[],"sources":["jsx/Tabs.js"],"sourcesContent":["import { composeRefs } from \"@tamagui/compose-refs\";\nimport { isWeb } from \"@tamagui/constants\";\nimport { createStyledHOC, styled, View } from \"@tamagui/core\";\nimport { Group, useGroupItem } from \"@tamagui/group\";\nimport { composeEventHandlers, withStaticProperties } from \"@tamagui/helpers\";\nimport { RovingFocusGroup } from \"@tamagui/roving-focus\";\nimport { useTab, useTabContent, useTabs, useTabsList } from \"@tamagui/tabs-headless\";\nimport { useEvent } from \"@tamagui/web\";\nimport * as React from \"react\";\nimport { TabsProvider, useTabsContext } from \"./StyledContext\";\nimport { jsx } from \"react/jsx-runtime\";\nconst TABS_CONTEXT = \"TabsContext\";\nconst TabsFrame = styled(View, {\n displayName: \"Tabs\"\n});\nconst TabsListFrame = styled(Group, {\n displayName: \"TabsList\",\n role: \"tablist\"\n});\nconst TabsTabFrame = styled(View, {\n displayName: \"TabsTrigger\",\n role: \"tab\",\n variants: {\n disabled: {\n true: {\n pointerEvents: \"none\"\n }\n }\n }\n});\nconst TabsContentFrame = styled(View, {\n displayName: \"TabsContent\"\n});\nconst TabsListDisabledContext = React.createContext(false);\nconst TabsList = createStyledHOC(\n TabsListFrame,\n function TabsList2(props, forwardedRef) {\n const { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;\n const context = useTabsContext(__scopeTabs);\n const { listProps: headlessListProps } = useTabsList({\n orientation: context.orientation,\n disabled\n });\n return /* @__PURE__ */ jsx(TabsListDisabledContext.Provider, { value: disabled, children: /* @__PURE__ */ jsx(\n RovingFocusGroup,\n {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n orientation: context.orientation,\n dir: context.dir,\n loop,\n asChild: true,\n children: /* @__PURE__ */ jsx(\n TabsListFrame,\n {\n ...headlessListProps,\n orientation: context.orientation,\n ref: forwardedRef,\n ...listProps,\n children\n }\n )\n }\n ) });\n }\n);\nconst TabsTab = createStyledHOC(\n TabsTabFrame,\n function TabsTab2(props, forwardedRef) {\n const {\n __scopeTabs,\n value,\n disabled: disabledProp,\n onInteraction,\n activeStyle,\n activeTheme,\n onLayout,\n onMouseEnter,\n onMouseLeave,\n onPress,\n onKeyDown,\n onFocus,\n onBlur,\n ...triggerProps\n } = props;\n const context = useTabsContext(__scopeTabs);\n const listDisabled = React.useContext(TabsListDisabledContext);\n const disabled = (disabledProp ?? listDisabled) === true;\n const groupItemProps = useGroupItem({ disabled });\n const { isSelected, tabProps } = useTab({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n disabled,\n activationMode: context.activationMode,\n onChange: context.onChange\n });\n const {\n onPress: activateOnPress,\n onKeyDown: activateOnKeyDown,\n onFocus: activateOnFocus,\n ...tabA11yProps\n } = tabProps;\n const [layout, setLayout] = React.useState(null);\n const triggerRef = React.useRef(null);\n const emitInteraction = useEvent(\n (type, layout2) => {\n onInteraction?.(type, layout2);\n }\n );\n React.useEffect(() => {\n context.registerTrigger();\n return () => context.unregisterTrigger();\n }, []);\n React.useEffect(() => {\n if (!triggerRef.current || !isWeb) return;\n const element = triggerRef.current;\n function updateTriggerSize() {\n const next = {\n width: element.offsetWidth,\n height: element.offsetHeight,\n x: element.offsetLeft,\n y: element.offsetTop\n };\n setLayout(\n (previous) => previous && previous.width === next.width && previous.height === next.height && previous.x === next.x && previous.y === next.y ? previous : next\n );\n }\n updateTriggerSize();\n const observer = new ResizeObserver(updateTriggerSize);\n observer.observe(element);\n const offsetParent = element.offsetParent;\n if (offsetParent) {\n observer.observe(offsetParent);\n }\n return () => observer.disconnect();\n }, [context.triggersCount]);\n React.useEffect(() => {\n if (isSelected && layout) {\n emitInteraction(\"select\", layout);\n }\n }, [emitInteraction, isSelected, layout]);\n return /* @__PURE__ */ jsx(\n RovingFocusGroup.Item,\n {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n asChild: true,\n tabIndex: disabled ? -1 : 0,\n active: isSelected,\n children: /* @__PURE__ */ jsx(\n TabsTabFrame,\n {\n onLayout: isWeb ? onLayout : composeEventHandlers(onLayout, (event) => {\n setLayout(event.nativeEvent.layout);\n }),\n onMouseEnter: composeEventHandlers(onMouseEnter, () => {\n if (layout) {\n emitInteraction(\"hover\", layout);\n }\n }),\n onMouseLeave: composeEventHandlers(onMouseLeave, () => {\n emitInteraction(\"hover\", null);\n }),\n ...tabA11yProps,\n theme: isSelected ? activeTheme ?? null : null,\n ...groupItemProps,\n ...triggerProps,\n style: [triggerProps.style, isSelected && activeStyle],\n ref: composeRefs(forwardedRef, triggerRef),\n onPress: composeEventHandlers(onPress ?? void 0, activateOnPress),\n ...isWeb && {\n onKeyDown: composeEventHandlers(onKeyDown, activateOnKeyDown),\n // emit the focus interaction before activating, matching the order\n // the indicator animations were built against\n onFocus: composeEventHandlers(\n onFocus,\n composeEventHandlers(() => {\n if (layout) {\n emitInteraction(\"focus\", layout);\n }\n }, activateOnFocus)\n ),\n onBlur: composeEventHandlers(onBlur, () => {\n emitInteraction(\"focus\", null);\n })\n }\n }\n )\n }\n );\n }\n);\nconst TabsContent = createStyledHOC(\n TabsContentFrame,\n function TabsContent2(props, forwardedRef) {\n const { __scopeTabs, value, forceMount, children, ...contentProps } = props;\n const context = useTabsContext(__scopeTabs);\n const { shouldMount, contentProps: headlessContentProps } = useTabContent({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n orientation: context.orientation,\n forceMount\n });\n if (!shouldMount) {\n return null;\n }\n return /* @__PURE__ */ jsx(\n TabsContentFrame,\n {\n ...headlessContentProps,\n ...contentProps,\n ref: forwardedRef,\n children\n },\n value\n );\n }\n);\nconst TabsComponent = createStyledHOC(\n TabsFrame,\n function Tabs(props, forwardedRef) {\n const {\n __scopeTabs,\n value: valueProp,\n onValueChange,\n defaultValue,\n orientation = \"horizontal\",\n dir,\n activationMode = \"automatic\",\n ...tabsProps\n } = props;\n const {\n value,\n setValue,\n baseId,\n direction,\n triggersCount,\n registerTrigger,\n unregisterTrigger,\n tabsProps: headlessTabsProps\n } = useTabs({\n value: valueProp,\n onValueChange,\n defaultValue,\n orientation,\n dir,\n activationMode\n });\n return /* @__PURE__ */ jsx(\n TabsProvider,\n {\n scope: __scopeTabs,\n baseId,\n value,\n onChange: setValue,\n orientation,\n dir: direction,\n activationMode,\n registerTrigger,\n triggersCount,\n unregisterTrigger,\n children: /* @__PURE__ */ jsx(\n TabsFrame,\n {\n direction,\n ...headlessTabsProps,\n ...tabsProps,\n ref: forwardedRef\n }\n )\n }\n );\n }\n);\nconst Tabs2 = withStaticProperties(TabsComponent, {\n Frame: TabsFrame,\n List: TabsList,\n Tab: TabsTab,\n Content: TabsContent\n});\nexport {\n Tabs2 as Tabs,\n TabsContent,\n TabsContentFrame,\n TabsFrame,\n TabsList,\n TabsListFrame,\n TabsTab,\n TabsTabFrame\n};\n//# sourceMappingURL=Tabs.js.map\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tabs.js","names":[],"sources":["jsx/Tabs.js"],"sourcesContent":["import { composeRefs } from \"@tamagui/compose-refs\";\nimport { isWeb } from \"@tamagui/constants\";\nimport { createStyledHOC, styled, View } from \"@tamagui/core\";\nimport { Group, useGroupItem } from \"@tamagui/group\";\nimport { composeEventHandlers, withStaticProperties } from \"@tamagui/helpers\";\nimport { RovingFocusGroup } from \"@tamagui/roving-focus\";\nimport { useTab, useTabContent, useTabs, useTabsList } from \"@tamagui/tabs-headless\";\nimport { useEvent } from \"@tamagui/web\";\nimport * as React from \"react\";\nimport { TabsProvider, useTabsContext } from \"./StyledContext\";\nimport { jsx } from \"react/jsx-runtime\";\nconst TABS_CONTEXT = \"TabsContext\";\nconst TabsFrame = styled(View, {\n displayName: \"Tabs\"\n});\nconst TabsListFrame = styled(Group, {\n displayName: \"TabsList\",\n role: \"tablist\"\n});\nconst TabsTabFrame = styled(View, {\n displayName: \"TabsTrigger\",\n role: \"tab\",\n variants: {\n disabled: {\n true: {\n pointerEvents: \"none\"\n }\n }\n }\n});\nconst TabsContentFrame = styled(View, {\n displayName: \"TabsContent\"\n});\nconst TabsListDisabledContext = React.createContext(false);\nconst TabsList = createStyledHOC(\n TabsListFrame,\n function TabsList2(propsIn, forwardedRef) {\n const props = propsIn;\n const { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;\n const context = useTabsContext(__scopeTabs);\n const { listProps: headlessListProps } = useTabsList({\n orientation: context.orientation,\n disabled\n });\n return /* @__PURE__ */ jsx(TabsListDisabledContext.Provider, { value: disabled, children: /* @__PURE__ */ jsx(\n RovingFocusGroup,\n {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n orientation: context.orientation,\n dir: context.dir,\n loop,\n asChild: true,\n children: /* @__PURE__ */ jsx(\n TabsListFrame,\n {\n ...headlessListProps,\n orientation: context.orientation,\n ref: forwardedRef,\n ...listProps,\n children\n }\n )\n }\n ) });\n }\n);\nconst TabsTab = createStyledHOC(\n TabsTabFrame,\n function TabsTab2(propsIn, forwardedRef) {\n const props = propsIn;\n const {\n __scopeTabs,\n value,\n disabled: disabledProp,\n onInteraction,\n activeStyle,\n activeTheme,\n onLayout,\n onMouseEnter,\n onMouseLeave,\n onPress,\n onKeyDown,\n onFocus,\n onBlur,\n ...triggerProps\n } = props;\n const context = useTabsContext(__scopeTabs);\n const listDisabled = React.useContext(TabsListDisabledContext);\n const disabled = (disabledProp ?? listDisabled) === true;\n const groupItemProps = useGroupItem({ disabled });\n const { isSelected, tabProps } = useTab({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n disabled,\n activationMode: context.activationMode,\n onChange: context.onChange\n });\n const {\n onPress: activateOnPress,\n onKeyDown: activateOnKeyDown,\n onFocus: activateOnFocus,\n ...tabA11yProps\n } = tabProps;\n const [layout, setLayout] = React.useState(null);\n const triggerRef = React.useRef(null);\n const emitInteraction = useEvent(\n (type, layout2) => {\n onInteraction?.(type, layout2);\n }\n );\n React.useEffect(() => {\n context.registerTrigger();\n return () => context.unregisterTrigger();\n }, []);\n React.useEffect(() => {\n if (!triggerRef.current || !isWeb) return;\n const element = triggerRef.current;\n function updateTriggerSize() {\n const next = {\n width: element.offsetWidth,\n height: element.offsetHeight,\n x: element.offsetLeft,\n y: element.offsetTop\n };\n setLayout(\n (previous) => previous && previous.width === next.width && previous.height === next.height && previous.x === next.x && previous.y === next.y ? previous : next\n );\n }\n updateTriggerSize();\n const observer = new ResizeObserver(updateTriggerSize);\n observer.observe(element);\n const offsetParent = element.offsetParent;\n if (offsetParent) {\n observer.observe(offsetParent);\n }\n return () => observer.disconnect();\n }, [context.triggersCount]);\n React.useEffect(() => {\n if (isSelected && layout) {\n emitInteraction(\"select\", layout);\n }\n }, [emitInteraction, isSelected, layout]);\n return /* @__PURE__ */ jsx(\n RovingFocusGroup.Item,\n {\n __scopeRovingFocusGroup: __scopeTabs || TABS_CONTEXT,\n asChild: true,\n tabIndex: disabled ? -1 : 0,\n active: isSelected,\n children: /* @__PURE__ */ jsx(\n TabsTabFrame,\n {\n onLayout: isWeb ? onLayout : composeEventHandlers(onLayout, (event) => {\n setLayout(event.nativeEvent.layout);\n }),\n onMouseEnter: composeEventHandlers(onMouseEnter, () => {\n if (layout) {\n emitInteraction(\"hover\", layout);\n }\n }),\n onMouseLeave: composeEventHandlers(onMouseLeave, () => {\n emitInteraction(\"hover\", null);\n }),\n ...tabA11yProps,\n theme: isSelected ? activeTheme ?? null : null,\n ...groupItemProps,\n ...triggerProps,\n style: [triggerProps.style, isSelected && activeStyle],\n ref: composeRefs(forwardedRef, triggerRef),\n onPress: composeEventHandlers(onPress ?? void 0, activateOnPress),\n ...isWeb && {\n onKeyDown: composeEventHandlers(onKeyDown, activateOnKeyDown),\n // emit the focus interaction before activating, matching the order\n // the indicator animations were built against\n onFocus: composeEventHandlers(\n onFocus,\n composeEventHandlers(() => {\n if (layout) {\n emitInteraction(\"focus\", layout);\n }\n }, activateOnFocus)\n ),\n onBlur: composeEventHandlers(onBlur, () => {\n emitInteraction(\"focus\", null);\n })\n }\n }\n )\n }\n );\n }\n);\nconst TabsContent = createStyledHOC(\n TabsContentFrame,\n function TabsContent2(propsIn, forwardedRef) {\n const props = propsIn;\n const { __scopeTabs, value, forceMount, children, ...contentProps } = props;\n const context = useTabsContext(__scopeTabs);\n const { shouldMount, contentProps: headlessContentProps } = useTabContent({\n baseId: context.baseId,\n value,\n selectedValue: context.value,\n orientation: context.orientation,\n forceMount\n });\n if (!shouldMount) {\n return null;\n }\n return /* @__PURE__ */ jsx(\n TabsContentFrame,\n {\n ...headlessContentProps,\n ...contentProps,\n ref: forwardedRef,\n children\n },\n value\n );\n }\n);\nconst TabsComponent = createStyledHOC(\n TabsFrame,\n function Tabs(propsIn, forwardedRef) {\n const props = propsIn;\n const {\n __scopeTabs,\n value: valueProp,\n onValueChange,\n defaultValue,\n orientation = \"horizontal\",\n dir,\n activationMode = \"automatic\",\n ...tabsProps\n } = props;\n const {\n value,\n setValue,\n baseId,\n direction,\n triggersCount,\n registerTrigger,\n unregisterTrigger,\n tabsProps: headlessTabsProps\n } = useTabs({\n value: valueProp,\n onValueChange,\n defaultValue,\n orientation,\n dir,\n activationMode\n });\n return /* @__PURE__ */ jsx(\n TabsProvider,\n {\n scope: __scopeTabs,\n baseId,\n value,\n onChange: setValue,\n orientation,\n dir: direction,\n activationMode,\n registerTrigger,\n triggersCount,\n unregisterTrigger,\n children: /* @__PURE__ */ jsx(\n TabsFrame,\n {\n direction,\n ...headlessTabsProps,\n ...tabsProps,\n ref: forwardedRef\n }\n )\n }\n );\n }\n);\nconst Tabs2 = withStaticProperties(TabsComponent, {\n Frame: TabsFrame,\n List: TabsList,\n Tab: TabsTab,\n Content: TabsContent\n});\nexport {\n Tabs2 as Tabs,\n TabsContent,\n TabsContentFrame,\n TabsFrame,\n TabsList,\n TabsListFrame,\n TabsTab,\n TabsTabFrame\n};\n//# sourceMappingURL=Tabs.js.map\n"],"mappings":"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"}
|
package/dist/jsx/Tabs.native.cjs
CHANGED
|
@@ -62,7 +62,8 @@ var TabsTabFrame = (0, import_core.styled)(import_core.View, {
|
|
|
62
62
|
});
|
|
63
63
|
var TabsContentFrame = (0, import_core.styled)(import_core.View, { displayName: "TabsContent" });
|
|
64
64
|
var TabsListDisabledContext = /* @__PURE__ */ React.createContext(false);
|
|
65
|
-
var TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList2(
|
|
65
|
+
var TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList2(propsIn, forwardedRef) {
|
|
66
|
+
var props = propsIn;
|
|
66
67
|
var { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;
|
|
67
68
|
var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
68
69
|
var { listProps: headlessListProps } = (0, import_tabs_headless.useTabsList)({
|
|
@@ -87,7 +88,8 @@ var TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList
|
|
|
87
88
|
})
|
|
88
89
|
});
|
|
89
90
|
});
|
|
90
|
-
var TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(
|
|
91
|
+
var TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(propsIn, forwardedRef) {
|
|
92
|
+
var props = propsIn;
|
|
91
93
|
var { __scopeTabs, value, disabled: disabledProp, onInteraction, activeStyle, activeTheme, onLayout, onMouseEnter, onMouseLeave, onPress, onKeyDown, onFocus, onBlur, ...triggerProps } = props;
|
|
92
94
|
var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
93
95
|
var listDisabled = React.useContext(TabsListDisabledContext);
|
|
@@ -185,7 +187,8 @@ var TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(p
|
|
|
185
187
|
})
|
|
186
188
|
});
|
|
187
189
|
});
|
|
188
|
-
var TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function TabsContent2(
|
|
190
|
+
var TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function TabsContent2(propsIn, forwardedRef) {
|
|
191
|
+
var props = propsIn;
|
|
189
192
|
var { __scopeTabs, value, forceMount, children, ...contentProps } = props;
|
|
190
193
|
var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
191
194
|
var { shouldMount, contentProps: headlessContentProps } = (0, import_tabs_headless.useTabContent)({
|
|
@@ -205,7 +208,8 @@ var TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function Ta
|
|
|
205
208
|
children
|
|
206
209
|
}, value);
|
|
207
210
|
});
|
|
208
|
-
var TabsComponent = (0, import_core.createStyledHOC)(TabsFrame, function Tabs(
|
|
211
|
+
var TabsComponent = (0, import_core.createStyledHOC)(TabsFrame, function Tabs(propsIn, forwardedRef) {
|
|
212
|
+
var props = propsIn;
|
|
209
213
|
var { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = "horizontal", dir, activationMode = "automatic", ...tabsProps } = props;
|
|
210
214
|
var { value, setValue, baseId, direction, triggersCount, registerTrigger, unregisterTrigger, tabsProps: headlessTabsProps } = (0, import_tabs_headless.useTabs)({
|
|
211
215
|
value: valueProp,
|
package/dist/jsx/Tabs.native.js
CHANGED
|
@@ -62,7 +62,8 @@ var TabsTabFrame = (0, import_core.styled)(import_core.View, {
|
|
|
62
62
|
});
|
|
63
63
|
var TabsContentFrame = (0, import_core.styled)(import_core.View, { displayName: "TabsContent" });
|
|
64
64
|
var TabsListDisabledContext = /* @__PURE__ */ React.createContext(false);
|
|
65
|
-
var TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList2(
|
|
65
|
+
var TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList2(propsIn, forwardedRef) {
|
|
66
|
+
var props = propsIn;
|
|
66
67
|
var { __scopeTabs, loop = true, disabled = false, children, ...listProps } = props;
|
|
67
68
|
var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
68
69
|
var { listProps: headlessListProps } = (0, import_tabs_headless.useTabsList)({
|
|
@@ -87,7 +88,8 @@ var TabsList = (0, import_core.createStyledHOC)(TabsListFrame, function TabsList
|
|
|
87
88
|
})
|
|
88
89
|
});
|
|
89
90
|
});
|
|
90
|
-
var TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(
|
|
91
|
+
var TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(propsIn, forwardedRef) {
|
|
92
|
+
var props = propsIn;
|
|
91
93
|
var { __scopeTabs, value, disabled: disabledProp, onInteraction, activeStyle, activeTheme, onLayout, onMouseEnter, onMouseLeave, onPress, onKeyDown, onFocus, onBlur, ...triggerProps } = props;
|
|
92
94
|
var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
93
95
|
var listDisabled = React.useContext(TabsListDisabledContext);
|
|
@@ -185,7 +187,8 @@ var TabsTab = (0, import_core.createStyledHOC)(TabsTabFrame, function TabsTab2(p
|
|
|
185
187
|
})
|
|
186
188
|
});
|
|
187
189
|
});
|
|
188
|
-
var TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function TabsContent2(
|
|
190
|
+
var TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function TabsContent2(propsIn, forwardedRef) {
|
|
191
|
+
var props = propsIn;
|
|
189
192
|
var { __scopeTabs, value, forceMount, children, ...contentProps } = props;
|
|
190
193
|
var context = (0, import_StyledContext.useTabsContext)(__scopeTabs);
|
|
191
194
|
var { shouldMount, contentProps: headlessContentProps } = (0, import_tabs_headless.useTabContent)({
|
|
@@ -205,7 +208,8 @@ var TabsContent = (0, import_core.createStyledHOC)(TabsContentFrame, function Ta
|
|
|
205
208
|
children
|
|
206
209
|
}, value);
|
|
207
210
|
});
|
|
208
|
-
var TabsComponent = (0, import_core.createStyledHOC)(TabsFrame, function Tabs(
|
|
211
|
+
var TabsComponent = (0, import_core.createStyledHOC)(TabsFrame, function Tabs(propsIn, forwardedRef) {
|
|
212
|
+
var props = propsIn;
|
|
209
213
|
var { __scopeTabs, value: valueProp, onValueChange, defaultValue, orientation = "horizontal", dir, activationMode = "automatic", ...tabsProps } = props;
|
|
210
214
|
var { value, setValue, baseId, direction, triggersCount, registerTrigger, unregisterTrigger, tabsProps: headlessTabsProps } = (0, import_tabs_headless.useTabs)({
|
|
211
215
|
value: valueProp,
|