@yahoo/uds-mobile 2.9.0 → 2.11.0

package/dist/components/Tabs/TabPanel.js

@@ -0,0 +1,31 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { useTabSelectionContext } from "./tabsContexts.js";
+import { memo } from "react";
+import { View } from "react-native";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Tabs/TabPanel.tsx
+/**
+* **⚙️ TabPanel**
+*
+* @description
+* Content associated with a tab id. Only the panel whose `tabId` matches the current
+* selection is rendered.
+*
+* @category Navigation
+* @platform mobile
+*/
+const TabPanel = memo(function TabPanel({ tabId, children, style, ...viewProps }) {
+	const { selectedId } = useTabSelectionContext();
+	if (selectedId !== tabId) return null;
+	return /* @__PURE__ */ jsx(View, {
+		accessibilityRole: "none",
+		style,
+		...viewProps,
+		children
+	});
+});
+TabPanel.displayName = "TabPanel";
+//#endregion
+export { TabPanel };
+
+//# sourceMappingURL=TabPanel.js.map

package/dist/components/Tabs/TabPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabPanel.js","names":[],"sources":["../../../src/components/Tabs/TabPanel.tsx"],"sourcesContent":["import type { UniversalTabPanelProps } from '@yahoo/uds-types';\nimport { memo } from 'react';\nimport type { ViewProps, ViewStyle } from 'react-native';\nimport { View } from 'react-native';\n\nimport { useTabSelectionContext } from './tabsContexts';\n\ninterface TabPanelProps\n  extends Omit<UniversalTabPanelProps, 'className'>, Omit<ViewProps, 'style' | 'children'> {\n  children: UniversalTabPanelProps['children'];\n  style?: ViewStyle;\n}\n\n/**\n * **⚙️ TabPanel**\n *\n * @description\n * Content associated with a tab id. Only the panel whose `tabId` matches the current\n * selection is rendered.\n *\n * @category Navigation\n * @platform mobile\n */\nconst TabPanel = memo(function TabPanel({ tabId, children, style, ...viewProps }: TabPanelProps) {\n  const { selectedId } = useTabSelectionContext();\n\n  if (selectedId !== tabId) {\n    return null;\n  }\n\n  return (\n    <View accessibilityRole=\"none\" style={style} {...viewProps}>\n      {children}\n    </View>\n  );\n});\n\nTabPanel.displayName = 'TabPanel';\n\nexport { TabPanel };\nexport type { TabPanelProps };\n"],"mappings":";;;;;;;;;;;;;;;;AAuBA,MAAM,WAAW,KAAK,SAAS,SAAS,EAAE,OAAO,UAAU,OAAO,GAAG,aAA4B;CAC/F,MAAM,EAAE,eAAe,wBAAwB;AAE/C,KAAI,eAAe,MACjB,QAAO;AAGT,QACE,oBAAC,MAAD;EAAM,mBAAkB;EAAc;EAAO,GAAI;EAC9C;EACI,CAAA;EAET;AAEF,SAAS,cAAc"}

package/dist/components/Tabs/Tabs.cjs

@@ -0,0 +1,53 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../_virtual/_rolldown/runtime.cjs");
+const require_components_Tabs_tabsContexts = require("./tabsContexts.cjs");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/components/Tabs/Tabs.tsx
+/**
+* **⚙️ Tabs**
+*
+* @description
+* Organizes content into sections with a tab list and tab panels. Supports `primary` and
+* `secondary` variants. When `reduceMotion` is false, a sliding indicator animates between
+* tabs (240ms, cubic-bezier(0.2, 0, 0, 1)) to match web UDS.
+*
+* @category Navigation
+* @platform mobile
+*
+* @example
+* ```tsx
+* import { Tabs, TabList, Tab, TabPanel } from '@yahoo/uds-mobile/Tabs';
+*
+* <Tabs variant="primary" defaultSelectedId="home">
+*   <TabList accessibilityLabel="Main">
+*     <Tab value="home">Home</Tab>
+*     <Tab value="about">About</Tab>
+*   </TabList>
+*   <TabPanel tabId="home">Home content</TabPanel>
+*   <TabPanel tabId="about">About content</TabPanel>
+* </Tabs>
+* ```
+*/
+const Tabs = (0, react.memo)(function Tabs({ children, variant = "primary", reduceMotion = false, defaultSelectedId, selectedId, onSelectionChange }) {
+	const visual = (0, react.useMemo)(() => ({
+		variant,
+		reduceMotion
+	}), [variant, reduceMotion]);
+	const selection = require_components_Tabs_tabsContexts.useTabSelectionState({
+		defaultSelectedId,
+		selectedId,
+		onSelectionChange
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Tabs_tabsContexts.TabsVisualContext.Provider, {
+		value: visual,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Tabs_tabsContexts.TabSelectionContext.Provider, {
+			value: selection,
+			children
+		})
+	});
+});
+Tabs.displayName = "Tabs";
+//#endregion
+exports.Tabs = Tabs;

package/dist/components/Tabs/Tabs.d.cts

@@ -0,0 +1,35 @@
+
+import { UniversalTabsProps } from "../../types/dist/index.cjs";
+import * as _$react from "react";
+
+//#region src/components/Tabs/Tabs.d.ts
+interface TabsProps extends UniversalTabsProps {}
+/**
+ * **⚙️ Tabs**
+ *
+ * @description
+ * Organizes content into sections with a tab list and tab panels. Supports `primary` and
+ * `secondary` variants. When `reduceMotion` is false, a sliding indicator animates between
+ * tabs (240ms, cubic-bezier(0.2, 0, 0, 1)) to match web UDS.
+ *
+ * @category Navigation
+ * @platform mobile
+ *
+ * @example
+ * ```tsx
+ * import { Tabs, TabList, Tab, TabPanel } from '@yahoo/uds-mobile/Tabs';
+ *
+ * <Tabs variant="primary" defaultSelectedId="home">
+ *   <TabList accessibilityLabel="Main">
+ *     <Tab value="home">Home</Tab>
+ *     <Tab value="about">About</Tab>
+ *   </TabList>
+ *   <TabPanel tabId="home">Home content</TabPanel>
+ *   <TabPanel tabId="about">About content</TabPanel>
+ * </Tabs>
+ * ```
+ */
+declare const Tabs: _$react.NamedExoticComponent<TabsProps>;
+//#endregion
+export { Tabs, type TabsProps };
+//# sourceMappingURL=Tabs.d.cts.map

package/dist/components/Tabs/Tabs.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.d.cts","names":[],"sources":["../../../src/components/Tabs/Tabs.tsx"],"mappings":";;;;;UAMU,SAAA,SAAkB,kBAAA;;AAN+B;;;;;AAMb;;;;;;;;;;;;;;;;;;;cA2BxC,IAAA,EAAI,OAAA,CAAA,oBAAA,CAAA,SAAA"}

package/dist/components/Tabs/Tabs.d.ts

@@ -0,0 +1,35 @@
+
+import { UniversalTabsProps } from "../../types/dist/index.js";
+import * as _$react from "react";
+
+//#region src/components/Tabs/Tabs.d.ts
+interface TabsProps extends UniversalTabsProps {}
+/**
+ * **⚙️ Tabs**
+ *
+ * @description
+ * Organizes content into sections with a tab list and tab panels. Supports `primary` and
+ * `secondary` variants. When `reduceMotion` is false, a sliding indicator animates between
+ * tabs (240ms, cubic-bezier(0.2, 0, 0, 1)) to match web UDS.
+ *
+ * @category Navigation
+ * @platform mobile
+ *
+ * @example
+ * ```tsx
+ * import { Tabs, TabList, Tab, TabPanel } from '@yahoo/uds-mobile/Tabs';
+ *
+ * <Tabs variant="primary" defaultSelectedId="home">
+ *   <TabList accessibilityLabel="Main">
+ *     <Tab value="home">Home</Tab>
+ *     <Tab value="about">About</Tab>
+ *   </TabList>
+ *   <TabPanel tabId="home">Home content</TabPanel>
+ *   <TabPanel tabId="about">About content</TabPanel>
+ * </Tabs>
+ * ```
+ */
+declare const Tabs: _$react.NamedExoticComponent<TabsProps>;
+//#endregion
+export { Tabs, type TabsProps };
+//# sourceMappingURL=Tabs.d.ts.map

package/dist/components/Tabs/Tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.d.ts","names":[],"sources":["../../../src/components/Tabs/Tabs.tsx"],"mappings":";;;;;UAMU,SAAA,SAAkB,kBAAA;;AAN+B;;;;;AAMb;;;;;;;;;;;;;;;;;;;cA2BxC,IAAA,EAAI,OAAA,CAAA,oBAAA,CAAA,SAAA"}

package/dist/components/Tabs/Tabs.js

@@ -0,0 +1,53 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { TabSelectionContext, TabsVisualContext, useTabSelectionState } from "./tabsContexts.js";
+import { memo, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Tabs/Tabs.tsx
+/**
+* **⚙️ Tabs**
+*
+* @description
+* Organizes content into sections with a tab list and tab panels. Supports `primary` and
+* `secondary` variants. When `reduceMotion` is false, a sliding indicator animates between
+* tabs (240ms, cubic-bezier(0.2, 0, 0, 1)) to match web UDS.
+*
+* @category Navigation
+* @platform mobile
+*
+* @example
+* ```tsx
+* import { Tabs, TabList, Tab, TabPanel } from '@yahoo/uds-mobile/Tabs';
+*
+* <Tabs variant="primary" defaultSelectedId="home">
+*   <TabList accessibilityLabel="Main">
+*     <Tab value="home">Home</Tab>
+*     <Tab value="about">About</Tab>
+*   </TabList>
+*   <TabPanel tabId="home">Home content</TabPanel>
+*   <TabPanel tabId="about">About content</TabPanel>
+* </Tabs>
+* ```
+*/
+const Tabs = memo(function Tabs({ children, variant = "primary", reduceMotion = false, defaultSelectedId, selectedId, onSelectionChange }) {
+	const visual = useMemo(() => ({
+		variant,
+		reduceMotion
+	}), [variant, reduceMotion]);
+	const selection = useTabSelectionState({
+		defaultSelectedId,
+		selectedId,
+		onSelectionChange
+	});
+	return /* @__PURE__ */ jsx(TabsVisualContext.Provider, {
+		value: visual,
+		children: /* @__PURE__ */ jsx(TabSelectionContext.Provider, {
+			value: selection,
+			children
+		})
+	});
+});
+Tabs.displayName = "Tabs";
+//#endregion
+export { Tabs };
+
+//# sourceMappingURL=Tabs.js.map

package/dist/components/Tabs/Tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.js","names":[],"sources":["../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import type { UniversalTabsProps } from '@yahoo/uds-types';\nimport { memo, useMemo } from 'react';\n\nimport { TabSelectionContext, TabsVisualContext, useTabSelectionState } from './tabsContexts';\n\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type -- alias for doc extraction / parity with web\ninterface TabsProps extends UniversalTabsProps {}\n\n/**\n * **⚙️ Tabs**\n *\n * @description\n * Organizes content into sections with a tab list and tab panels. Supports `primary` and\n * `secondary` variants. When `reduceMotion` is false, a sliding indicator animates between\n * tabs (240ms, cubic-bezier(0.2, 0, 0, 1)) to match web UDS.\n *\n * @category Navigation\n * @platform mobile\n *\n * @example\n * ```tsx\n * import { Tabs, TabList, Tab, TabPanel } from '@yahoo/uds-mobile/Tabs';\n *\n * <Tabs variant=\"primary\" defaultSelectedId=\"home\">\n *   <TabList accessibilityLabel=\"Main\">\n *     <Tab value=\"home\">Home</Tab>\n *     <Tab value=\"about\">About</Tab>\n *   </TabList>\n *   <TabPanel tabId=\"home\">Home content</TabPanel>\n *   <TabPanel tabId=\"about\">About content</TabPanel>\n * </Tabs>\n * ```\n */\nconst Tabs = memo(function Tabs({\n  children,\n  variant = 'primary',\n  reduceMotion = false,\n  defaultSelectedId,\n  selectedId,\n  onSelectionChange,\n}: TabsProps) {\n  const visual = useMemo(() => ({ variant, reduceMotion }), [variant, reduceMotion]);\n  const selection = useTabSelectionState({\n    defaultSelectedId,\n    selectedId,\n    onSelectionChange,\n  });\n\n  return (\n    <TabsVisualContext.Provider value={visual}>\n      <TabSelectionContext.Provider value={selection}>{children}</TabSelectionContext.Provider>\n    </TabsVisualContext.Provider>\n  );\n});\n\nTabs.displayName = 'Tabs';\n\nexport { Tabs };\nexport type { TabsProps };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCA,MAAM,OAAO,KAAK,SAAS,KAAK,EAC9B,UACA,UAAU,WACV,eAAe,OACf,mBACA,YACA,qBACY;CACZ,MAAM,SAAS,eAAe;EAAE;EAAS;EAAc,GAAG,CAAC,SAAS,aAAa,CAAC;CAClF,MAAM,YAAY,qBAAqB;EACrC;EACA;EACA;EACD,CAAC;AAEF,QACE,oBAAC,kBAAkB,UAAnB;EAA4B,OAAO;YACjC,oBAAC,oBAAoB,UAArB;GAA8B,OAAO;GAAY;GAAwC,CAAA;EAC9D,CAAA;EAE/B;AAEF,KAAK,cAAc"}

package/dist/components/Tabs/index.cjs

@@ -0,0 +1,10 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_components_Tabs_Tab = require("./Tab.cjs");
+const require_components_Tabs_TabList = require("./TabList.cjs");
+const require_components_Tabs_TabPanel = require("./TabPanel.cjs");
+const require_components_Tabs_Tabs = require("./Tabs.cjs");
+exports.Tab = require_components_Tabs_Tab.Tab;
+exports.TabList = require_components_Tabs_TabList.TabList;
+exports.TabPanel = require_components_Tabs_TabPanel.TabPanel;
+exports.Tabs = require_components_Tabs_Tabs.Tabs;

package/dist/components/Tabs/index.d.cts

@@ -0,0 +1,13 @@
+
+import { UniversalTabsVariant } from "../../types/dist/index.cjs";
+import { Tab, TabProps } from "./Tab.cjs";
+import { TabList, TabListProps } from "./TabList.cjs";
+import { TabPanel, TabPanelProps } from "./TabPanel.cjs";
+import { Tabs, TabsProps } from "./Tabs.cjs";
+
+//#region src/components/Tabs/index.d.ts
+/** @alias {@link UniversalTabsVariant} — matches web `TabsVariant` naming */
+type TabsVariant = UniversalTabsVariant;
+//#endregion
+export { Tab, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, TabsVariant, type UniversalTabsVariant };
+//# sourceMappingURL=index.d.cts.map

package/dist/components/Tabs/index.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","names":[],"sources":["../../../src/components/Tabs/index.ts"],"mappings":";;;;;;;;;KAQY,WAAA,GAAc,oBAAA"}

package/dist/components/Tabs/index.d.ts

@@ -0,0 +1,13 @@
+
+import { UniversalTabsVariant } from "../../types/dist/index.js";
+import { Tab, TabProps } from "./Tab.js";
+import { TabList, TabListProps } from "./TabList.js";
+import { TabPanel, TabPanelProps } from "./TabPanel.js";
+import { Tabs, TabsProps } from "./Tabs.js";
+
+//#region src/components/Tabs/index.d.ts
+/** @alias {@link UniversalTabsVariant} — matches web `TabsVariant` naming */
+type TabsVariant = UniversalTabsVariant;
+//#endregion
+export { Tab, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, Tabs, type TabsProps, TabsVariant, type UniversalTabsVariant };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Tabs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/Tabs/index.ts"],"mappings":";;;;;;;;;KAQY,WAAA,GAAc,oBAAA"}

package/dist/components/Tabs/index.js

@@ -0,0 +1,6 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+import { Tab } from "./Tab.js";
+import { TabList } from "./TabList.js";
+import { TabPanel } from "./TabPanel.js";
+import { Tabs } from "./Tabs.js";
+export { Tab, TabList, TabPanel, Tabs };

package/dist/components/Tabs/tabTheme.cjs

@@ -0,0 +1,29 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+//#region src/components/Tabs/tabTheme.ts
+function tabComponentPath(visual, active, layer, state) {
+	return `tab/variant/${visual}/active/${active}/${layer === "rootText" ? "rootText" : layer}/${state}`;
+}
+/** Default tab dimensions / spacing from tokens (`tab/size/default/...`). */
+function getTabSizeLayerStyle(theme, layer) {
+	const path = `tab/size/default/${layer}/rest`;
+	const s = theme.components[path];
+	return s && typeof s === "object" ? s : {};
+}
+/** Variant + interaction layer (active on/off, pressed/rest). */
+function getTabLayerStyle(theme, visual, active, layer, state) {
+	const path = tabComponentPath(visual, active, layer, state);
+	const s = theme.components[path];
+	return s && typeof s === "object" ? s : {};
+}
+/** Size tokens + variant state (matches web stacking size + variant classes). */
+function getMergedTabLayerStyle(theme, visual, active, layer, state) {
+	return {
+		...getTabSizeLayerStyle(theme, layer === "rootText" ? "rootText" : layer === "icon" ? "icon" : "root"),
+		...getTabLayerStyle(theme, visual, active, layer, state)
+	};
+}
+//#endregion
+exports.getMergedTabLayerStyle = getMergedTabLayerStyle;
+exports.getTabLayerStyle = getTabLayerStyle;
+exports.getTabSizeLayerStyle = getTabSizeLayerStyle;

package/dist/components/Tabs/tabTheme.d.cts

@@ -0,0 +1,23 @@
+
+import { UniversalTabsVariant } from "../../types/dist/index.cjs";
+import { TextStyle, ViewStyle } from "react-native";
+
+//#region src/components/Tabs/tabTheme.d.ts
+type TabActiveState = 'on' | 'off';
+type TabLayer = 'root' | 'rootText' | 'icon';
+type InteractionState = 'rest' | 'pressed';
+/** Default tab dimensions / spacing from tokens (`tab/size/default/...`). */
+declare function getTabSizeLayerStyle(theme: {
+  components: Record<string, any>;
+}, layer: 'root' | 'rootText' | 'icon'): ViewStyle | TextStyle;
+/** Variant + interaction layer (active on/off, pressed/rest). */
+declare function getTabLayerStyle(theme: {
+  components: Record<string, any>;
+}, visual: UniversalTabsVariant, active: TabActiveState, layer: TabLayer, state: InteractionState): ViewStyle | TextStyle;
+/** Size tokens + variant state (matches web stacking size + variant classes). */
+declare function getMergedTabLayerStyle(theme: {
+  components: Record<string, any>;
+}, visual: UniversalTabsVariant, active: TabActiveState, layer: TabLayer, state: InteractionState): ViewStyle | TextStyle;
+//#endregion
+export { getMergedTabLayerStyle, getTabLayerStyle, getTabSizeLayerStyle };
+//# sourceMappingURL=tabTheme.d.cts.map

package/dist/components/Tabs/tabTheme.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabTheme.d.cts","names":[],"sources":["../../../src/components/Tabs/tabTheme.ts"],"mappings":";;;;;KAGK,cAAA;AAAA,KACA,QAAA;AAAA,KACA,gBAAA;;iBAaW,oBAAA,CAEd,KAAA;EAAS,UAAA,EAAY,MAAA;AAAA,GACrB,KAAA,iCACC,SAAA,GAAY,SAAA;AAnBI;AAAA,iBA0BH,gBAAA,CAEd,KAAA;EAAS,UAAA,EAAY,MAAA;AAAA,GACrB,MAAA,EAAQ,oBAAA,EACR,MAAA,EAAQ,cAAA,EACR,KAAA,EAAO,QAAA,EACP,KAAA,EAAO,gBAAA,GACN,SAAA,GAAY,SAAA;;iBAOC,sBAAA,CAEd,KAAA;EAAS,UAAA,EAAY,MAAA;AAAA,GACrB,MAAA,EAAQ,oBAAA,EACR,MAAA,EAAQ,cAAA,EACR,KAAA,EAAO,QAAA,EACP,KAAA,EAAO,gBAAA,GACN,SAAA,GAAY,SAAA"}

package/dist/components/Tabs/tabTheme.d.ts

@@ -0,0 +1,23 @@
+
+import { UniversalTabsVariant } from "../../types/dist/index.js";
+import { TextStyle, ViewStyle } from "react-native";
+
+//#region src/components/Tabs/tabTheme.d.ts
+type TabActiveState = 'on' | 'off';
+type TabLayer = 'root' | 'rootText' | 'icon';
+type InteractionState = 'rest' | 'pressed';
+/** Default tab dimensions / spacing from tokens (`tab/size/default/...`). */
+declare function getTabSizeLayerStyle(theme: {
+  components: Record<string, any>;
+}, layer: 'root' | 'rootText' | 'icon'): ViewStyle | TextStyle;
+/** Variant + interaction layer (active on/off, pressed/rest). */
+declare function getTabLayerStyle(theme: {
+  components: Record<string, any>;
+}, visual: UniversalTabsVariant, active: TabActiveState, layer: TabLayer, state: InteractionState): ViewStyle | TextStyle;
+/** Size tokens + variant state (matches web stacking size + variant classes). */
+declare function getMergedTabLayerStyle(theme: {
+  components: Record<string, any>;
+}, visual: UniversalTabsVariant, active: TabActiveState, layer: TabLayer, state: InteractionState): ViewStyle | TextStyle;
+//#endregion
+export { getMergedTabLayerStyle, getTabLayerStyle, getTabSizeLayerStyle };
+//# sourceMappingURL=tabTheme.d.ts.map

package/dist/components/Tabs/tabTheme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabTheme.d.ts","names":[],"sources":["../../../src/components/Tabs/tabTheme.ts"],"mappings":";;;;;KAGK,cAAA;AAAA,KACA,QAAA;AAAA,KACA,gBAAA;;iBAaW,oBAAA,CAEd,KAAA;EAAS,UAAA,EAAY,MAAA;AAAA,GACrB,KAAA,iCACC,SAAA,GAAY,SAAA;AAnBI;AAAA,iBA0BH,gBAAA,CAEd,KAAA;EAAS,UAAA,EAAY,MAAA;AAAA,GACrB,MAAA,EAAQ,oBAAA,EACR,MAAA,EAAQ,cAAA,EACR,KAAA,EAAO,QAAA,EACP,KAAA,EAAO,gBAAA,GACN,SAAA,GAAY,SAAA;;iBAOC,sBAAA,CAEd,KAAA;EAAS,UAAA,EAAY,MAAA;AAAA,GACrB,MAAA,EAAQ,oBAAA,EACR,MAAA,EAAQ,cAAA,EACR,KAAA,EAAO,QAAA,EACP,KAAA,EAAO,gBAAA,GACN,SAAA,GAAY,SAAA"}

package/dist/components/Tabs/tabTheme.js

@@ -0,0 +1,28 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+//#region src/components/Tabs/tabTheme.ts
+function tabComponentPath(visual, active, layer, state) {
+	return `tab/variant/${visual}/active/${active}/${layer === "rootText" ? "rootText" : layer}/${state}`;
+}
+/** Default tab dimensions / spacing from tokens (`tab/size/default/...`). */
+function getTabSizeLayerStyle(theme, layer) {
+	const path = `tab/size/default/${layer}/rest`;
+	const s = theme.components[path];
+	return s && typeof s === "object" ? s : {};
+}
+/** Variant + interaction layer (active on/off, pressed/rest). */
+function getTabLayerStyle(theme, visual, active, layer, state) {
+	const path = tabComponentPath(visual, active, layer, state);
+	const s = theme.components[path];
+	return s && typeof s === "object" ? s : {};
+}
+/** Size tokens + variant state (matches web stacking size + variant classes). */
+function getMergedTabLayerStyle(theme, visual, active, layer, state) {
+	return {
+		...getTabSizeLayerStyle(theme, layer === "rootText" ? "rootText" : layer === "icon" ? "icon" : "root"),
+		...getTabLayerStyle(theme, visual, active, layer, state)
+	};
+}
+//#endregion
+export { getMergedTabLayerStyle, getTabLayerStyle, getTabSizeLayerStyle };
+
+//# sourceMappingURL=tabTheme.js.map

package/dist/components/Tabs/tabTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabTheme.js","names":[],"sources":["../../../src/components/Tabs/tabTheme.ts"],"sourcesContent":["import type { UniversalTabsVariant } from '@yahoo/uds-types';\nimport type { TextStyle, ViewStyle } from 'react-native';\n\ntype TabActiveState = 'on' | 'off';\ntype TabLayer = 'root' | 'rootText' | 'icon';\ntype InteractionState = 'rest' | 'pressed';\n\nfunction tabComponentPath(\n  visual: UniversalTabsVariant,\n  active: TabActiveState,\n  layer: TabLayer,\n  state: InteractionState,\n): string {\n  const layerKey = layer === 'rootText' ? 'rootText' : layer;\n  return `tab/variant/${visual}/active/${active}/${layerKey}/${state}`;\n}\n\n/** Default tab dimensions / spacing from tokens (`tab/size/default/...`). */\nexport function getTabSizeLayerStyle(\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  theme: { components: Record<string, any> },\n  layer: 'root' | 'rootText' | 'icon',\n): ViewStyle | TextStyle {\n  const path = `tab/size/default/${layer}/rest`;\n  const s = theme.components[path];\n  return s && typeof s === 'object' ? s : {};\n}\n\n/** Variant + interaction layer (active on/off, pressed/rest). */\nexport function getTabLayerStyle(\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  theme: { components: Record<string, any> },\n  visual: UniversalTabsVariant,\n  active: TabActiveState,\n  layer: TabLayer,\n  state: InteractionState,\n): ViewStyle | TextStyle {\n  const path = tabComponentPath(visual, active, layer, state);\n  const s = theme.components[path];\n  return s && typeof s === 'object' ? s : {};\n}\n\n/** Size tokens + variant state (matches web stacking size + variant classes). */\nexport function getMergedTabLayerStyle(\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  theme: { components: Record<string, any> },\n  visual: UniversalTabsVariant,\n  active: TabActiveState,\n  layer: TabLayer,\n  state: InteractionState,\n): ViewStyle | TextStyle {\n  const sizeKey = layer === 'rootText' ? 'rootText' : layer === 'icon' ? 'icon' : 'root';\n  return {\n    ...(getTabSizeLayerStyle(theme, sizeKey) as object),\n    ...(getTabLayerStyle(theme, visual, active, layer, state) as object),\n  } as ViewStyle;\n}\n"],"mappings":";;AAOA,SAAS,iBACP,QACA,QACA,OACA,OACQ;AAER,QAAO,eAAe,OAAO,UAAU,OAAO,GAD7B,UAAU,aAAa,aAAa,MACK,GAAG;;;AAI/D,SAAgB,qBAEd,OACA,OACuB;CACvB,MAAM,OAAO,oBAAoB,MAAM;CACvC,MAAM,IAAI,MAAM,WAAW;AAC3B,QAAO,KAAK,OAAO,MAAM,WAAW,IAAI,EAAE;;;AAI5C,SAAgB,iBAEd,OACA,QACA,QACA,OACA,OACuB;CACvB,MAAM,OAAO,iBAAiB,QAAQ,QAAQ,OAAO,MAAM;CAC3D,MAAM,IAAI,MAAM,WAAW;AAC3B,QAAO,KAAK,OAAO,MAAM,WAAW,IAAI,EAAE;;;AAI5C,SAAgB,uBAEd,OACA,QACA,QACA,OACA,OACuB;AAEvB,QAAO;EACL,GAAI,qBAAqB,OAFX,UAAU,aAAa,aAAa,UAAU,SAAS,SAAS,OAEtC;EACxC,GAAI,iBAAiB,OAAO,QAAQ,QAAQ,OAAO,MAAM;EAC1D"}

package/dist/components/Tabs/tabsContexts.cjs

@@ -0,0 +1,91 @@
+/*! © 2026 Yahoo, Inc. UDS Mobile v0.0.0-development */
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../_virtual/_rolldown/runtime.cjs");
+let react = require("react");
+//#region src/components/Tabs/tabsContexts.tsx
+const TabsVisualContext = (0, react.createContext)({
+	variant: "primary",
+	reduceMotion: false
+});
+function useTabsVisualContext() {
+	return (0, react.useContext)(TabsVisualContext);
+}
+const TabSelectionContext = (0, react.createContext)(null);
+function useTabSelectionContext() {
+	const ctx = (0, react.useContext)(TabSelectionContext);
+	if (!ctx) throw new Error("Tab components must be used within <Tabs>");
+	return ctx;
+}
+function useTabSelectionState({ defaultSelectedId, selectedId: selectedIdProp, onSelectionChange }) {
+	const isControlled = selectedIdProp !== void 0;
+	const [internalSelectedId, setInternalSelectedId] = (0, react.useState)(defaultSelectedId ?? null);
+	const [registeredIds, setRegisteredIds] = (0, react.useState)([]);
+	const [tabLayouts, setTabLayouts] = (0, react.useState)(() => /* @__PURE__ */ new Map());
+	const selectedId = isControlled ? selectedIdProp : internalSelectedId;
+	const setSelectedId = (0, react.useCallback)((id) => {
+		if (!isControlled) setInternalSelectedId(id);
+		onSelectionChange?.(id);
+	}, [isControlled, onSelectionChange]);
+	const registerTab = (0, react.useCallback)((id) => {
+		setRegisteredIds((prev) => prev.includes(id) ? prev : [...prev, id]);
+	}, []);
+	const unregisterTab = (0, react.useCallback)((id) => {
+		setRegisteredIds((prev) => prev.filter((x) => x !== id));
+		setTabLayouts((prev) => {
+			const next = new Map(prev);
+			next.delete(id);
+			return next;
+		});
+	}, []);
+	const setTabLayout = (0, react.useCallback)((id, layout) => {
+		setTabLayouts((prev) => {
+			const cur = prev.get(id);
+			if (cur && cur.x === layout.x && cur.y === layout.y && cur.width === layout.width && cur.height === layout.height) return prev;
+			const next = new Map(prev);
+			next.set(id, layout);
+			return next;
+		});
+	}, []);
+	const clearTabLayout = (0, react.useCallback)((id) => {
+		setTabLayouts((prev) => {
+			if (!prev.has(id)) return prev;
+			const next = new Map(prev);
+			next.delete(id);
+			return next;
+		});
+	}, []);
+	(0, react.useEffect)(() => {
+		if (isControlled || defaultSelectedId !== void 0) return;
+		if (internalSelectedId !== null) return;
+		if (registeredIds.length === 0) return;
+		setInternalSelectedId(registeredIds[0]);
+	}, [
+		isControlled,
+		defaultSelectedId,
+		internalSelectedId,
+		registeredIds
+	]);
+	return (0, react.useMemo)(() => ({
+		selectedId,
+		setSelectedId,
+		registerTab,
+		unregisterTab,
+		tabLayouts,
+		setTabLayout,
+		clearTabLayout
+	}), [
+		selectedId,
+		setSelectedId,
+		registerTab,
+		unregisterTab,
+		tabLayouts,
+		setTabLayout,
+		clearTabLayout
+	]);
+}
+//#endregion
+exports.TabSelectionContext = TabSelectionContext;
+exports.TabsVisualContext = TabsVisualContext;
+exports.useTabSelectionContext = useTabSelectionContext;
+exports.useTabSelectionState = useTabSelectionState;
+exports.useTabsVisualContext = useTabsVisualContext;

package/dist/components/Tabs/tabsContexts.d.cts

@@ -0,0 +1,35 @@
+
+import { UniversalTabsVariant } from "../../types/dist/index.cjs";
+import * as _$react from "react";
+import { LayoutRectangle } from "react-native";
+
+//#region src/components/Tabs/tabsContexts.d.ts
+interface TabsVisualContextValue {
+  variant: UniversalTabsVariant;
+  reduceMotion: boolean;
+}
+declare const TabsVisualContext: _$react.Context<TabsVisualContextValue>;
+declare function useTabsVisualContext(): TabsVisualContextValue;
+interface TabSelectionContextValue {
+  selectedId: string | null | undefined;
+  setSelectedId: (id: string) => void;
+  registerTab: (id: string) => void;
+  unregisterTab: (id: string) => void;
+  tabLayouts: ReadonlyMap<string, LayoutRectangle>;
+  setTabLayout: (id: string, layout: LayoutRectangle) => void;
+  clearTabLayout: (id: string) => void;
+}
+declare const TabSelectionContext: _$react.Context<TabSelectionContextValue | null>;
+declare function useTabSelectionContext(): TabSelectionContextValue;
+declare function useTabSelectionState({
+  defaultSelectedId,
+  selectedId: selectedIdProp,
+  onSelectionChange
+}: {
+  defaultSelectedId?: string;
+  selectedId?: string | null;
+  onSelectionChange?: (selectedId: string | null | undefined) => void;
+}): TabSelectionContextValue;
+//#endregion
+export { TabSelectionContext, TabSelectionContextValue, TabsVisualContext, TabsVisualContextValue, useTabSelectionContext, useTabSelectionState, useTabsVisualContext };
+//# sourceMappingURL=tabsContexts.d.cts.map

package/dist/components/Tabs/tabsContexts.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabsContexts.d.cts","names":[],"sources":["../../../src/components/Tabs/tabsContexts.tsx"],"mappings":";;;;;;UAIiB,sBAAA;EACf,OAAA,EAAS,oBAAA;EACT,YAAA;AAAA;AAAA,cAGW,iBAAA,EAAiB,OAAA,CAAA,OAAA,CAAA,sBAAA;AAAA,iBAKd,oBAAA,CAAA,GAAwB,sBAAA;AAAA,UAIvB,wBAAA;EACf,UAAA;EACA,aAAA,GAAgB,EAAA;EAChB,WAAA,GAAc,EAAA;EACd,aAAA,GAAgB,EAAA;EAChB,UAAA,EAAY,WAAA,SAAoB,eAAA;EAChC,YAAA,GAAe,EAAA,UAAY,MAAA,EAAQ,eAAA;EACnC,cAAA,GAAiB,EAAA;AAAA;AAAA,cAGN,mBAAA,EAAmB,OAAA,CAAA,OAAA,CAAA,wBAAA;AAAA,iBAEhB,sBAAA,CAAA,GAA0B,wBAAA;AAAA,iBAQ1B,oBAAA,CAAA;EACd,iBAAA;EACA,UAAA,EAAY,cAAA;EACZ;AAAA;EAEA,iBAAA;EACA,UAAA;EACA,iBAAA,IAAqB,UAAA;AAAA,IACnB,wBAAA"}

package/dist/components/Tabs/tabsContexts.d.ts

@@ -0,0 +1,35 @@
+
+import { UniversalTabsVariant } from "../../types/dist/index.js";
+import * as _$react from "react";
+import { LayoutRectangle } from "react-native";
+
+//#region src/components/Tabs/tabsContexts.d.ts
+interface TabsVisualContextValue {
+  variant: UniversalTabsVariant;
+  reduceMotion: boolean;
+}
+declare const TabsVisualContext: _$react.Context<TabsVisualContextValue>;
+declare function useTabsVisualContext(): TabsVisualContextValue;
+interface TabSelectionContextValue {
+  selectedId: string | null | undefined;
+  setSelectedId: (id: string) => void;
+  registerTab: (id: string) => void;
+  unregisterTab: (id: string) => void;
+  tabLayouts: ReadonlyMap<string, LayoutRectangle>;
+  setTabLayout: (id: string, layout: LayoutRectangle) => void;
+  clearTabLayout: (id: string) => void;
+}
+declare const TabSelectionContext: _$react.Context<TabSelectionContextValue | null>;
+declare function useTabSelectionContext(): TabSelectionContextValue;
+declare function useTabSelectionState({
+  defaultSelectedId,
+  selectedId: selectedIdProp,
+  onSelectionChange
+}: {
+  defaultSelectedId?: string;
+  selectedId?: string | null;
+  onSelectionChange?: (selectedId: string | null | undefined) => void;
+}): TabSelectionContextValue;
+//#endregion
+export { TabSelectionContext, TabSelectionContextValue, TabsVisualContext, TabsVisualContextValue, useTabSelectionContext, useTabSelectionState, useTabsVisualContext };
+//# sourceMappingURL=tabsContexts.d.ts.map

package/dist/components/Tabs/tabsContexts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabsContexts.d.ts","names":[],"sources":["../../../src/components/Tabs/tabsContexts.tsx"],"mappings":";;;;;;UAIiB,sBAAA;EACf,OAAA,EAAS,oBAAA;EACT,YAAA;AAAA;AAAA,cAGW,iBAAA,EAAiB,OAAA,CAAA,OAAA,CAAA,sBAAA;AAAA,iBAKd,oBAAA,CAAA,GAAwB,sBAAA;AAAA,UAIvB,wBAAA;EACf,UAAA;EACA,aAAA,GAAgB,EAAA;EAChB,WAAA,GAAc,EAAA;EACd,aAAA,GAAgB,EAAA;EAChB,UAAA,EAAY,WAAA,SAAoB,eAAA;EAChC,YAAA,GAAe,EAAA,UAAY,MAAA,EAAQ,eAAA;EACnC,cAAA,GAAiB,EAAA;AAAA;AAAA,cAGN,mBAAA,EAAmB,OAAA,CAAA,OAAA,CAAA,wBAAA;AAAA,iBAEhB,sBAAA,CAAA,GAA0B,wBAAA;AAAA,iBAQ1B,oBAAA,CAAA;EACd,iBAAA;EACA,UAAA,EAAY,cAAA;EACZ;AAAA;EAEA,iBAAA;EACA,UAAA;EACA,iBAAA,IAAqB,UAAA;AAAA,IACnB,wBAAA"}