@ankhorage/surface 5.0.0 → 5.0.1

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @ankhorage/surface
 
+## 5.0.1
+
+### Patch Changes
+
+- 14c083f: Move Modal and the accessible Tabs system to canonical feature ownership without changing their public root API.
+
 ## 5.0.0
 
 ### Major Changes

package/README.md

@@ -3,7 +3,7 @@
 
 # @ankhorage/surface
 
-![license: MIT](././paradox/badges/license.svg) ![npm: v4.3.0](././paradox/badges/npm.svg) ![runtime: bun](././paradox/badges/runtime.svg) ![typescript: strict](././paradox/badges/typescript.svg) ![eslint: checked](././paradox/badges/eslint.svg) ![prettier: checked](././paradox/badges/prettier.svg) ![build: checked](././paradox/badges/build.svg) ![tests: checked](././paradox/badges/tests.svg) ![docs: paradox](././paradox/badges/docs.svg)
+![license: MIT](././paradox/badges/license.svg) ![npm: v5.0.0](././paradox/badges/npm.svg) ![runtime: bun](././paradox/badges/runtime.svg) ![typescript: strict](././paradox/badges/typescript.svg) ![eslint: checked](././paradox/badges/eslint.svg) ![prettier: checked](././paradox/badges/prettier.svg) ![build: checked](././paradox/badges/build.svg) ![tests: checked](././paradox/badges/tests.svg) ![docs: paradox](././paradox/badges/docs.svg)
 
 Cross-platform UI foundation for React Native and React Native Web. Provides theming, layout primitives, and core building blocks for modern apps.
 
@@ -27,9 +27,9 @@ Cross-platform UI foundation for React Native and React Native Web. Provides the
 - [IconButton sequence](././paradox/diagrams/sequences/icon-button.mmd)
 - [isDeepEqual sequence](././paradox/diagrams/sequences/is-deep-equal.mmd)
 - [ListItem sequence](././paradox/diagrams/sequences/list-item.mmd)
-- [Menu sequence](././paradox/diagrams/sequences/menu.mmd)
 - [Modal sequence](././paradox/diagrams/sequences/modal.mmd)
 - [Popover sequence](././paradox/diagrams/sequences/popover.mmd)
+- [PopoverMenu sequence](././paradox/diagrams/sequences/popover-menu.mmd)
 - [Radio sequence](././paradox/diagrams/sequences/radio.mmd)
 - [resolveResponsive sequence](././paradox/diagrams/sequences/resolve-responsive.mmd)
 - [ResponsiveProvider sequence](././paradox/diagrams/sequences/responsive-provider.mmd)

package/dist/{components/modal → features/modal/adapters/inbound}/Modal.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
-import type { ModalProps } from './types';
+import type { ModalProps } from '../../../../types/modal';
+/*** Renders the generic Surface modal overlay and focus boundary. */
 export declare function Modal({ visible, onDismiss, children, closeOnBackdrop, interactionPolicy, testID, }: ModalProps): React.JSX.Element | null;
 //# sourceMappingURL=Modal.d.ts.map

package/dist/features/modal/adapters/inbound/Modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../../src/features/modal/adapters/inbound/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAK1D,qEAAqE;AACrE,wBAAgB,KAAK,CAAC,EACpB,OAAO,EACP,SAAS,EACT,QAAQ,EACR,eAAsB,EACtB,iBAA6B,EAC7B,MAAM,GACP,EAAE,UAAU,4BAmCZ"}

package/dist/features/modal/adapters/inbound/Modal.js

@@ -0,0 +1,51 @@
+import React from 'react';
+import { Pressable, StyleSheet, View } from 'react-native';
+import { FocusScope } from '../../../../internal/focus/FocusScope';
+import { Portal } from '../../../../internal/overlay/Portal';
+import { resolvePointerEvents } from '../../../../internal/resolvePointerEvents';
+import { resolveOverlayAnimation } from '../../../../internal/resolvers';
+import { Center } from '../../../../layout';
+import { useTheme } from '../../../../theme/ThemeContext';
+import { Surface } from '../../../surface/public';
+const boxNonePointerEvents = resolvePointerEvents('box-none');
+/*** Renders the generic Surface modal overlay and focus boundary. */
+export function Modal({ visible, onDismiss, children, closeOnBackdrop = true, interactionPolicy = 'enabled', testID, }) {
+    const { theme } = useTheme();
+    const animation = resolveOverlayAnimation('modal');
+    const passive = interactionPolicy === 'passive';
+    const backdropPress = passive || !closeOnBackdrop ? undefined : onDismiss;
+    if (!visible)
+        return null;
+    return (<Portal layer="modal" visible={visible}>
+      <View {...boxNonePointerEvents.props} style={[boxNonePointerEvents.style, styles.fill]}>
+        <Pressable onPress={backdropPress} style={[
+            styles.fill,
+            resolveBackdropStyle(theme.semantics.neutral.text, animation.backdropOpacity),
+        ]} testID={testID ? `${testID}-backdrop` : undefined}/>
+        <FocusScope active={visible} onEscape={passive ? undefined : onDismiss} testID={testID ? `${testID}-focus` : undefined}>
+          <Center p="l" style={styles.center}>
+            <View accessible accessibilityViewIsModal style={styles.content}>
+              <Surface p="l" style={styles.surface} testID={testID} variant="raised">
+                {children}
+              </Surface>
+            </View>
+          </Center>
+        </FocusScope>
+      </View>
+    </Portal>);
+}
+/*** Resolves the runtime backdrop color and opacity without inline JSX styles. */
+function resolveBackdropStyle(backgroundColor, opacity) {
+    return { backgroundColor, opacity };
+}
+const styles = StyleSheet.create({
+    center: { flex: 1 },
+    content: { maxWidth: 560, width: '100%' },
+    fill: { bottom: 0, left: 0, position: 'absolute', right: 0, top: 0 },
+    surface: {
+        shadowOffset: { height: 8, width: 0 },
+        shadowOpacity: 0.14,
+        shadowRadius: 18,
+    },
+});
+//# sourceMappingURL=Modal.js.map

package/dist/features/modal/adapters/inbound/Modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../../../src/features/modal/adapters/inbound/Modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Pressable, StyleSheet, View, type ViewStyle } from 'react-native';\n\nimport { FocusScope } from '../../../../internal/focus/FocusScope';\nimport { Portal } from '../../../../internal/overlay/Portal';\nimport { resolvePointerEvents } from '../../../../internal/resolvePointerEvents';\nimport { resolveOverlayAnimation } from '../../../../internal/resolvers';\nimport { Center } from '../../../../layout';\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { ModalProps } from '../../../../types/modal';\nimport { Surface } from '../../../surface/public';\n\nconst boxNonePointerEvents = resolvePointerEvents('box-none');\n\n/*** Renders the generic Surface modal overlay and focus boundary. */\nexport function Modal({\n  visible,\n  onDismiss,\n  children,\n  closeOnBackdrop = true,\n  interactionPolicy = 'enabled',\n  testID,\n}: ModalProps) {\n  const { theme } = useTheme();\n  const animation = resolveOverlayAnimation('modal');\n  const passive = interactionPolicy === 'passive';\n  const backdropPress = passive || !closeOnBackdrop ? undefined : onDismiss;\n\n  if (!visible) return null;\n\n  return (\n    <Portal layer=\"modal\" visible={visible}>\n      <View {...boxNonePointerEvents.props} style={[boxNonePointerEvents.style, styles.fill]}>\n        <Pressable\n          onPress={backdropPress}\n          style={[\n            styles.fill,\n            resolveBackdropStyle(theme.semantics.neutral.text, animation.backdropOpacity),\n          ]}\n          testID={testID ? `${testID}-backdrop` : undefined}\n        />\n        <FocusScope\n          active={visible}\n          onEscape={passive ? undefined : onDismiss}\n          testID={testID ? `${testID}-focus` : undefined}\n        >\n          <Center p=\"l\" style={styles.center}>\n            <View accessible accessibilityViewIsModal style={styles.content}>\n              <Surface p=\"l\" style={styles.surface} testID={testID} variant=\"raised\">\n                {children}\n              </Surface>\n            </View>\n          </Center>\n        </FocusScope>\n      </View>\n    </Portal>\n  );\n}\n\n/*** Resolves the runtime backdrop color and opacity without inline JSX styles. */\nfunction resolveBackdropStyle(backgroundColor: string, opacity: number): ViewStyle {\n  return { backgroundColor, opacity };\n}\n\nconst styles = StyleSheet.create({\n  center: { flex: 1 },\n  content: { maxWidth: 560, width: '100%' },\n  fill: { bottom: 0, left: 0, position: 'absolute', right: 0, top: 0 },\n  surface: {\n    shadowOffset: { height: 8, width: 0 },\n    shadowOpacity: 0.14,\n    shadowRadius: 18,\n  },\n});\n"]}

package/dist/features/modal/public.d.ts

@@ -0,0 +1,3 @@
+export type { ModalProps } from '../../types/modal';
+export { Modal } from './adapters/inbound/Modal';
+//# sourceMappingURL=public.d.ts.map

package/dist/features/modal/public.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../../src/features/modal/public.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC"}

package/dist/features/modal/public.js

@@ -0,0 +1,2 @@
+export { Modal } from './adapters/inbound/Modal';
+//# sourceMappingURL=public.js.map

package/dist/features/modal/public.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"public.js","sourceRoot":"","sources":["../../../src/features/modal/public.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC","sourcesContent":["export type { ModalProps } from '../../types/modal';\nexport { Modal } from './adapters/inbound/Modal';\n"]}

package/dist/features/tabs/adapters/inbound/Tab.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { TabProps } from '../../../../types/tabs';
+/*** Renders one accessible selectable tab inside a Tabs context. */
+export declare function Tab({ value, children, disabled, interactionPolicy, testID, }: TabProps): React.JSX.Element;
+//# sourceMappingURL=Tab.d.ts.map

package/dist/features/tabs/adapters/inbound/Tab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.d.ts","sourceRoot":"","sources":["../../../../../src/features/tabs/adapters/inbound/Tab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAMvD,oEAAoE;AACpE,wBAAgB,GAAG,CAAC,EAClB,KAAK,EACL,QAAQ,EACR,QAAgB,EAChB,iBAA6B,EAC7B,MAAM,GACP,EAAE,QAAQ,qBAsCV"}

package/dist/features/tabs/adapters/inbound/Tab.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import { Pressable } from 'react-native';
+import { useTheme } from '../../../../theme/ThemeContext';
+import { Box } from '../../../layout/public';
+import { Text } from '../../../typography/public';
+import { useTabRegistration } from '../../composition/useTabRegistration';
+import { useTabsContext } from '../../composition/useTabsContext';
+/*** Renders one accessible selectable tab inside a Tabs context. */
+export function Tab({ value, children, disabled = false, interactionPolicy = 'enabled', testID, }) {
+    const { theme } = useTheme();
+    const { activeValue, getPanelId, getTabId, setActiveValue, setFocusedValue } = useTabsContext();
+    const pressableRef = useTabRegistration({ disabled, value });
+    const selected = activeValue === value;
+    const passive = interactionPolicy === 'passive';
+    const onPress = passive || disabled ? undefined : () => setActiveValue(value);
+    return (<Pressable accessibilityLabel={undefined} accessibilityRole="tab" accessibilityState={{ disabled, selected }} aria-controls={getPanelId(value)} disabled={disabled} nativeID={getTabId(value)} onBlur={() => setFocusedValue(undefined)} onFocus={() => setFocusedValue(value)} onPress={onPress} ref={pressableRef} testID={testID}>
+      <Box px="m" py="s" style={resolveTabStyle({
+            borderColor: selected
+                ? theme.semantics.action.primary.base
+                : theme.semantics.border.default,
+            disabled,
+        })}>
+        <Text color={selected ? 'primary' : undefined} variant="label" weight="medium">
+          {children}
+        </Text>
+      </Box>
+    </Pressable>);
+}
+/*** Resolves active and disabled visual state without inline JSX styles. */
+function resolveTabStyle({ borderColor, disabled, }) {
+    return { borderBottomColor: borderColor, borderBottomWidth: 2, opacity: disabled ? 0.64 : 1 };
+}
+//# sourceMappingURL=Tab.js.map

package/dist/features/tabs/adapters/inbound/Tab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.js","sourceRoot":"","sources":["../../../../../src/features/tabs/adapters/inbound/Tab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAkB,MAAM,cAAc,CAAC;AAEzD,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAE1D,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAClD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAC1E,OAAO,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAElE,oEAAoE;AACpE,MAAM,UAAU,GAAG,CAAC,EAClB,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,iBAAiB,GAAG,SAAS,EAC7B,MAAM,GACG;IACT,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC7B,MAAM,EAAE,WAAW,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,eAAe,EAAE,GAAG,cAAc,EAAE,CAAC;IAChG,MAAM,YAAY,GAAG,kBAAkB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7D,MAAM,QAAQ,GAAG,WAAW,KAAK,KAAK,CAAC;IACvC,MAAM,OAAO,GAAG,iBAAiB,KAAK,SAAS,CAAC;IAChD,MAAM,OAAO,GAAG,OAAO,IAAI,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;IAE9E,OAAO,CACL,CAAC,SAAS,CACR,kBAAkB,CAAC,CAAC,SAAS,CAAC,CAC9B,iBAAiB,CAAC,KAAK,CACvB,kBAAkB,CAAC,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAC3C,aAAa,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CACjC,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,QAAQ,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAC1B,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC,CACzC,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,CACtC,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,GAAG,CAAC,CAAC,YAAY,CAAC,CAClB,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,GAAG,CACF,EAAE,CAAC,GAAG,CACN,EAAE,CAAC,GAAG,CACN,KAAK,CAAC,CAAC,eAAe,CAAC;YACrB,WAAW,EAAE,QAAQ;gBACnB,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI;gBACrC,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO;YAClC,QAAQ;SACT,CAAC,CAAC,CAEH;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAC5E;UAAA,CAAC,QAAQ,CACX;QAAA,EAAE,IAAI,CACR;MAAA,EAAE,GAAG,CACP;IAAA,EAAE,SAAS,CAAC,CACb,CAAC;AACJ,CAAC;AAED,4EAA4E;AAC5E,SAAS,eAAe,CAAC,EACvB,WAAW,EACX,QAAQ,GAIT;IACC,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,iBAAiB,EAAE,CAAC,EAAE,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;AAChG,CAAC","sourcesContent":["import React from 'react';\nimport { Pressable, type ViewStyle } from 'react-native';\n\nimport { useTheme } from '../../../../theme/ThemeContext';\nimport type { TabProps } from '../../../../types/tabs';\nimport { Box } from '../../../layout/public';\nimport { Text } from '../../../typography/public';\nimport { useTabRegistration } from '../../composition/useTabRegistration';\nimport { useTabsContext } from '../../composition/useTabsContext';\n\n/*** Renders one accessible selectable tab inside a Tabs context. */\nexport function Tab({\n  value,\n  children,\n  disabled = false,\n  interactionPolicy = 'enabled',\n  testID,\n}: TabProps) {\n  const { theme } = useTheme();\n  const { activeValue, getPanelId, getTabId, setActiveValue, setFocusedValue } = useTabsContext();\n  const pressableRef = useTabRegistration({ disabled, value });\n  const selected = activeValue === value;\n  const passive = interactionPolicy === 'passive';\n  const onPress = passive || disabled ? undefined : () => setActiveValue(value);\n\n  return (\n    <Pressable\n      accessibilityLabel={undefined}\n      accessibilityRole=\"tab\"\n      accessibilityState={{ disabled, selected }}\n      aria-controls={getPanelId(value)}\n      disabled={disabled}\n      nativeID={getTabId(value)}\n      onBlur={() => setFocusedValue(undefined)}\n      onFocus={() => setFocusedValue(value)}\n      onPress={onPress}\n      ref={pressableRef}\n      testID={testID}\n    >\n      <Box\n        px=\"m\"\n        py=\"s\"\n        style={resolveTabStyle({\n          borderColor: selected\n            ? theme.semantics.action.primary.base\n            : theme.semantics.border.default,\n          disabled,\n        })}\n      >\n        <Text color={selected ? 'primary' : undefined} variant=\"label\" weight=\"medium\">\n          {children}\n        </Text>\n      </Box>\n    </Pressable>\n  );\n}\n\n/*** Resolves active and disabled visual state without inline JSX styles. */\nfunction resolveTabStyle({\n  borderColor,\n  disabled,\n}: {\n  borderColor: string;\n  disabled: boolean;\n}): ViewStyle {\n  return { borderBottomColor: borderColor, borderBottomWidth: 2, opacity: disabled ? 0.64 : 1 };\n}\n"]}

package/dist/features/tabs/adapters/inbound/TabList.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { TabListProps } from '../../../../types/tabs';
+/*** Renders the accessible tab list and owns keyboard focus navigation. */
+export declare function TabList({ children, testID }: TabListProps): React.JSX.Element;
+//# sourceMappingURL=TabList.d.ts.map

package/dist/features/tabs/adapters/inbound/TabList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabList.d.ts","sourceRoot":"","sources":["../../../../../src/features/tabs/adapters/inbound/TabList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,YAAY,EAAoB,MAAM,wBAAwB,CAAC;AAc7E,2EAA2E;AAC3E,wBAAgB,OAAO,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,YAAY,qBAuBzD"}

package/dist/features/tabs/adapters/inbound/TabList.js

@@ -0,0 +1,42 @@
+import React from 'react';
+import { StyleSheet } from 'react-native';
+import { useFocusManager } from '../../../../internal/focus/useFocusManager';
+import { Box } from '../../../layout/public';
+import { useTabsContext } from '../../composition/useTabsContext';
+import { resolveNextTabValue } from '../../utils/resolveNextTabValue';
+const navigationKeys = [
+    'ArrowLeft',
+    'ArrowRight',
+    'ArrowUp',
+    'ArrowDown',
+    'Home',
+    'End',
+];
+/*** Renders the accessible tab list and owns keyboard focus navigation. */
+export function TabList({ children, testID }) {
+    const { bindKeydown } = useFocusManager();
+    const { focusedValue, setActiveValue, tabs } = useTabsContext();
+    React.useEffect(() => {
+        if (!focusedValue)
+            return undefined;
+        return bindKeydown((event) => {
+            if (!isTabNavigationKey(event.key))
+                return;
+            const nextValue = resolveNextTabValue(tabs, focusedValue, event.key);
+            if (!nextValue)
+                return;
+            event.preventDefault();
+            tabs.find((tab) => tab.value === nextValue)?.focus();
+            setActiveValue(nextValue);
+        });
+    }, [bindKeydown, focusedValue, setActiveValue, tabs]);
+    return (<Box accessibilityRole="tablist" style={styles.list} testID={testID}>
+      {children}
+    </Box>);
+}
+/*** Narrows keyboard event keys to the tab navigation key contract. */
+function isTabNavigationKey(key) {
+    return key !== undefined && navigationKeys.includes(key);
+}
+const styles = StyleSheet.create({ list: { flexDirection: 'row' } });
+//# sourceMappingURL=TabList.js.map

package/dist/features/tabs/adapters/inbound/TabList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabList.js","sourceRoot":"","sources":["../../../../../src/features/tabs/adapters/inbound/TabList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,eAAe,EAAE,MAAM,4CAA4C,CAAC;AAE7E,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAClE,OAAO,EAAE,mBAAmB,EAAE,MAAM,iCAAiC,CAAC;AAEtE,MAAM,cAAc,GAAsB;IACxC,WAAW;IACX,YAAY;IACZ,SAAS;IACT,WAAW;IACX,MAAM;IACN,KAAK;CACN,CAAC;AAEF,2EAA2E;AAC3E,MAAM,UAAU,OAAO,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAgB;IACxD,MAAM,EAAE,WAAW,EAAE,GAAG,eAAe,EAAE,CAAC;IAC1C,MAAM,EAAE,YAAY,EAAE,cAAc,EAAE,IAAI,EAAE,GAAG,cAAc,EAAE,CAAC;IAEhE,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,YAAY;YAAE,OAAO,SAAS,CAAC;QAEpC,OAAO,WAAW,CAAC,CAAC,KAAK,EAAE,EAAE;YAC3B,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,GAAG,CAAC;gBAAE,OAAO;YAC3C,MAAM,SAAS,GAAG,mBAAmB,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;YACrE,IAAI,CAAC,SAAS;gBAAE,OAAO;YAEvB,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,KAAK,KAAK,SAAS,CAAC,EAAE,KAAK,EAAE,CAAC;YACrD,cAAc,CAAC,SAAS,CAAC,CAAC;QAC5B,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,WAAW,EAAE,YAAY,EAAE,cAAc,EAAE,IAAI,CAAC,CAAC,CAAC;IAEtD,OAAO,CACL,CAAC,GAAG,CAAC,iBAAiB,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAClE;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC;AAED,uEAAuE;AACvE,SAAS,kBAAkB,CAAC,GAAuB;IACjD,OAAO,GAAG,KAAK,SAAS,IAAI,cAAc,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;AAC3D,CAAC;AAED,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC,EAAE,IAAI,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport { StyleSheet } from 'react-native';\n\nimport { useFocusManager } from '../../../../internal/focus/useFocusManager';\nimport type { TabListProps, TabNavigationKey } from '../../../../types/tabs';\nimport { Box } from '../../../layout/public';\nimport { useTabsContext } from '../../composition/useTabsContext';\nimport { resolveNextTabValue } from '../../utils/resolveNextTabValue';\n\nconst navigationKeys: readonly string[] = [\n  'ArrowLeft',\n  'ArrowRight',\n  'ArrowUp',\n  'ArrowDown',\n  'Home',\n  'End',\n];\n\n/*** Renders the accessible tab list and owns keyboard focus navigation. */\nexport function TabList({ children, testID }: TabListProps) {\n  const { bindKeydown } = useFocusManager();\n  const { focusedValue, setActiveValue, tabs } = useTabsContext();\n\n  React.useEffect(() => {\n    if (!focusedValue) return undefined;\n\n    return bindKeydown((event) => {\n      if (!isTabNavigationKey(event.key)) return;\n      const nextValue = resolveNextTabValue(tabs, focusedValue, event.key);\n      if (!nextValue) return;\n\n      event.preventDefault();\n      tabs.find((tab) => tab.value === nextValue)?.focus();\n      setActiveValue(nextValue);\n    });\n  }, [bindKeydown, focusedValue, setActiveValue, tabs]);\n\n  return (\n    <Box accessibilityRole=\"tablist\" style={styles.list} testID={testID}>\n      {children}\n    </Box>\n  );\n}\n\n/*** Narrows keyboard event keys to the tab navigation key contract. */\nfunction isTabNavigationKey(key: string | undefined): key is TabNavigationKey {\n  return key !== undefined && navigationKeys.includes(key);\n}\n\nconst styles = StyleSheet.create({ list: { flexDirection: 'row' } });\n"]}

package/dist/features/tabs/adapters/inbound/TabPanel.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { TabPanelProps } from '../../../../types/tabs';
+/*** Renders the content panel associated with the active tab value. */
+export declare function TabPanel({ value, children, testID }: TabPanelProps): React.JSX.Element | null;
+//# sourceMappingURL=TabPanel.d.ts.map

package/dist/features/tabs/adapters/inbound/TabPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabPanel.d.ts","sourceRoot":"","sources":["../../../../../src/features/tabs/adapters/inbound/TabPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAK5D,uEAAuE;AACvE,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,aAAa,4BAelE"}

package/dist/features/tabs/adapters/inbound/TabPanel.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import { View } from 'react-native';
+import { useTabsContext } from '../../composition/useTabsContext';
+const TAB_PANEL_ROLE = 'tabpanel';
+/*** Renders the content panel associated with the active tab value. */
+export function TabPanel({ value, children, testID }) {
+    const { activeValue, getPanelId, getTabId } = useTabsContext();
+    if (activeValue !== value)
+        return null;
+    return (<View accessibilityLabelledBy={getTabId(value)} accessibilityRole={TAB_PANEL_ROLE} nativeID={getPanelId(value)} testID={testID}>
+      {children}
+    </View>);
+}
+//# sourceMappingURL=TabPanel.js.map

package/dist/features/tabs/adapters/inbound/TabPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabPanel.js","sourceRoot":"","sources":["../../../../../src/features/tabs/adapters/inbound/TabPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAGpC,OAAO,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAElE,MAAM,cAAc,GAAG,UAAoE,CAAC;AAE5F,uEAAuE;AACvE,MAAM,UAAU,QAAQ,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAiB;IACjE,MAAM,EAAE,WAAW,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,cAAc,EAAE,CAAC;IAE/D,IAAI,WAAW,KAAK,KAAK;QAAE,OAAO,IAAI,CAAC;IAEvC,OAAO,CACL,CAAC,IAAI,CACH,uBAAuB,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CACzC,iBAAiB,CAAC,CAAC,cAAc,CAAC,CAClC,QAAQ,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAC5B,MAAM,CAAC,CAAC,MAAM,CAAC,CAEf;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport type { TabPanelProps } from '../../../../types/tabs';\nimport { useTabsContext } from '../../composition/useTabsContext';\n\nconst TAB_PANEL_ROLE = 'tabpanel' as React.ComponentProps<typeof View>['accessibilityRole'];\n\n/*** Renders the content panel associated with the active tab value. */\nexport function TabPanel({ value, children, testID }: TabPanelProps) {\n  const { activeValue, getPanelId, getTabId } = useTabsContext();\n\n  if (activeValue !== value) return null;\n\n  return (\n    <View\n      accessibilityLabelledBy={getTabId(value)}\n      accessibilityRole={TAB_PANEL_ROLE}\n      nativeID={getPanelId(value)}\n      testID={testID}\n    >\n      {children}\n    </View>\n  );\n}\n"]}

package/dist/features/tabs/adapters/inbound/Tabs.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { TabsProps } from '../../../../types/tabs';
+/*** Provides accessible tab selection state to TabList, Tab, and TabPanel children. */
+export declare function Tabs({ children, ...props }: TabsProps): React.JSX.Element;
+//# sourceMappingURL=Tabs.d.ts.map

package/dist/features/tabs/adapters/inbound/Tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../../src/features/tabs/adapters/inbound/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAKxD,uFAAuF;AACvF,wBAAgB,IAAI,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,qBAQrD"}

package/dist/features/tabs/adapters/inbound/Tabs.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { Box } from '../../../layout/public';
+import { TabsContext } from '../../composition/TabsContext';
+import { useTabsController } from '../../composition/useTabsController';
+/*** Provides accessible tab selection state to TabList, Tab, and TabPanel children. */
+export function Tabs({ children, ...props }) {
+    const contextValue = useTabsController(props);
+    return (<TabsContext value={contextValue}>
+      <Box testID={props.testID}>{children}</Box>
+    </TabsContext>);
+}
+//# sourceMappingURL=Tabs.js.map

package/dist/features/tabs/adapters/inbound/Tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../../../src/features/tabs/adapters/inbound/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AAExE,uFAAuF;AACvF,MAAM,UAAU,IAAI,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAa;IACpD,MAAM,YAAY,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAE9C,OAAO,CACL,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,CAC/B;MAAA,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,GAAG,CAC5C;IAAA,EAAE,WAAW,CAAC,CACf,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\nimport type { TabsProps } from '../../../../types/tabs';\nimport { Box } from '../../../layout/public';\nimport { TabsContext } from '../../composition/TabsContext';\nimport { useTabsController } from '../../composition/useTabsController';\n\n/*** Provides accessible tab selection state to TabList, Tab, and TabPanel children. */\nexport function Tabs({ children, ...props }: TabsProps) {\n  const contextValue = useTabsController(props);\n\n  return (\n    <TabsContext value={contextValue}>\n      <Box testID={props.testID}>{children}</Box>\n    </TabsContext>\n  );\n}\n"]}

package/dist/features/tabs/composition/TabsContext.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { TabsContextValue } from '../../../types/tabs';
+export declare const TabsContext: React.Context<TabsContextValue | null>;
+//# sourceMappingURL=TabsContext.d.ts.map

package/dist/features/tabs/composition/TabsContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsContext.d.ts","sourceRoot":"","sources":["../../../../src/features/tabs/composition/TabsContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE5D,eAAO,MAAM,WAAW,wCAAqD,CAAC"}

package/dist/features/tabs/composition/TabsContext.js

@@ -0,0 +1,3 @@
+import React from 'react';
+export const TabsContext = React.createContext(null);
+//# sourceMappingURL=TabsContext.js.map

package/dist/features/tabs/composition/TabsContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsContext.js","sourceRoot":"","sources":["../../../../src/features/tabs/composition/TabsContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,CAAC,MAAM,WAAW,GAAG,KAAK,CAAC,aAAa,CAA0B,IAAI,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport type { TabsContextValue } from '../../../types/tabs';\n\nexport const TabsContext = React.createContext<TabsContextValue | null>(null);\n"]}

package/dist/features/tabs/composition/useTabRegistration.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+/*** Registers one focusable tab with the owning Tabs context. */
+export declare function useTabRegistration({ disabled, value }: {
+    disabled: boolean;
+    value: string;
+}): React.RefObject<import("react-native").View | null>;
+//# sourceMappingURL=useTabRegistration.d.ts.map

package/dist/features/tabs/composition/useTabRegistration.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTabRegistration.d.ts","sourceRoot":"","sources":["../../../../src/features/tabs/composition/useTabRegistration.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,iEAAiE;AACjE,wBAAgB,kBAAkB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAAE,QAAQ,EAAE,OAAO,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,uDAoB3F"}

package/dist/features/tabs/composition/useTabRegistration.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { useTabsContext } from './useTabsContext';
+/*** Registers one focusable tab with the owning Tabs context. */
+export function useTabRegistration({ disabled, value }) {
+    const { registerTab, unregisterTab } = useTabsContext();
+    const pressableRef = React.useRef(null);
+    React.useEffect(() => {
+        registerTab({
+            disabled,
+            focus: () => {
+                const focusable = pressableRef.current;
+                focusable?.focus?.();
+            },
+            value,
+        });
+        return () => unregisterTab(value);
+    }, [disabled, registerTab, unregisterTab, value]);
+    return pressableRef;
+}
+//# sourceMappingURL=useTabRegistration.js.map

package/dist/features/tabs/composition/useTabRegistration.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTabRegistration.js","sourceRoot":"","sources":["../../../../src/features/tabs/composition/useTabRegistration.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,iEAAiE;AACjE,MAAM,UAAU,kBAAkB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAwC;IAC1F,MAAM,EAAE,WAAW,EAAE,aAAa,EAAE,GAAG,cAAc,EAAE,CAAC;IACxD,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAA4C,IAAI,CAAC,CAAC;IAEnF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,WAAW,CAAC;YACV,QAAQ;YACR,KAAK,EAAE,GAAG,EAAE;gBACV,MAAM,SAAS,GAAG,YAAY,CAAC,OAEvB,CAAC;gBACT,SAAS,EAAE,KAAK,EAAE,EAAE,CAAC;YACvB,CAAC;YACD,KAAK;SACN,CAAC,CAAC;QAEH,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACpC,CAAC,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,aAAa,EAAE,KAAK,CAAC,CAAC,CAAC;IAElD,OAAO,YAAY,CAAC;AACtB,CAAC","sourcesContent":["import React from 'react';\nimport type { Pressable } from 'react-native';\n\nimport { useTabsContext } from './useTabsContext';\n\n/*** Registers one focusable tab with the owning Tabs context. */\nexport function useTabRegistration({ disabled, value }: { disabled: boolean; value: string }) {\n  const { registerTab, unregisterTab } = useTabsContext();\n  const pressableRef = React.useRef<React.ElementRef<typeof Pressable> | null>(null);\n\n  React.useEffect(() => {\n    registerTab({\n      disabled,\n      focus: () => {\n        const focusable = pressableRef.current as unknown as {\n          focus?: (() => void) | undefined;\n        } | null;\n        focusable?.focus?.();\n      },\n      value,\n    });\n\n    return () => unregisterTab(value);\n  }, [disabled, registerTab, unregisterTab, value]);\n\n  return pressableRef;\n}\n"]}

package/dist/features/tabs/composition/useTabsContext.d.ts

@@ -0,0 +1,4 @@
+import type { TabsContextValue } from '../../../types/tabs';
+/*** Returns the active Tabs feature context. */
+export declare function useTabsContext(): TabsContextValue;
+//# sourceMappingURL=useTabsContext.d.ts.map

package/dist/features/tabs/composition/useTabsContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTabsContext.d.ts","sourceRoot":"","sources":["../../../../src/features/tabs/composition/useTabsContext.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAG5D,gDAAgD;AAChD,wBAAgB,cAAc,IAAI,gBAAgB,CAMjD"}

package/dist/{components/tabs/context.js → features/tabs/composition/useTabsContext.js}

@@ -1,10 +1,10 @@
 import React from 'react';
-export const TabsContext = React.createContext(null);
+import { TabsContext } from './TabsContext';
+/*** Returns the active Tabs feature context. */
 export function useTabsContext() {
     const value = React.use(TabsContext);
-    if (!value) {
+    if (!value)
         throw new Error('Tabs components must be used within <Tabs>.');
-    }
     return value;
 }
-//# sourceMappingURL=context.js.map
+//# sourceMappingURL=useTabsContext.js.map

package/dist/features/tabs/composition/useTabsContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTabsContext.js","sourceRoot":"","sources":["../../../../src/features/tabs/composition/useTabsContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,gDAAgD;AAChD,MAAM,UAAU,cAAc;IAC5B,MAAM,KAAK,GAAG,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAErC,IAAI,CAAC,KAAK;QAAE,MAAM,IAAI,KAAK,CAAC,6CAA6C,CAAC,CAAC;IAE3E,OAAO,KAAK,CAAC;AACf,CAAC","sourcesContent":["import React from 'react';\n\nimport type { TabsContextValue } from '../../../types/tabs';\nimport { TabsContext } from './TabsContext';\n\n/*** Returns the active Tabs feature context. */\nexport function useTabsContext(): TabsContextValue {\n  const value = React.use(TabsContext);\n\n  if (!value) throw new Error('Tabs components must be used within <Tabs>.');\n\n  return value;\n}\n"]}

package/dist/features/tabs/composition/useTabsController.d.ts

@@ -0,0 +1,4 @@
+import type { TabsContextValue, TabsProps } from '../../../types/tabs';
+/*** Owns controlled state, registration, focus state, and ids for one Tabs instance. */
+export declare function useTabsController({ defaultValue, onValueChange, testID, value, }: Pick<TabsProps, 'defaultValue' | 'onValueChange' | 'testID' | 'value'>): TabsContextValue;
+//# sourceMappingURL=useTabsController.d.ts.map

package/dist/features/tabs/composition/useTabsController.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTabsController.d.ts","sourceRoot":"","sources":["../../../../src/features/tabs/composition/useTabsController.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAmB,gBAAgB,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAGxF,wFAAwF;AACxF,wBAAgB,iBAAiB,CAAC,EAChC,YAAY,EACZ,aAAa,EACb,MAAM,EACN,KAAK,GACN,EAAE,IAAI,CAAC,SAAS,EAAE,cAAc,GAAG,eAAe,GAAG,QAAQ,GAAG,OAAO,CAAC,GAAG,gBAAgB,CA0C3F"}

package/dist/features/tabs/composition/useTabsController.js

@@ -0,0 +1,43 @@
+import React from 'react';
+import { useControllableState } from '../../../internal/useControllableState';
+import { resolveTabElementId } from '../utils/resolveTabElementId';
+/*** Owns controlled state, registration, focus state, and ids for one Tabs instance. */
+export function useTabsController({ defaultValue, onValueChange, testID, value, }) {
+    const [activeValue, setActiveValue] = useControllableState({
+        defaultValue,
+        onChange: (nextValue) => {
+            if (nextValue !== undefined)
+                onValueChange?.(nextValue);
+        },
+        value,
+    });
+    const [focusedValue, setFocusedValue] = React.useState(undefined);
+    const [tabs, setTabs] = React.useState([]);
+    const registerTab = React.useCallback((tab) => {
+        setTabs((current) => current.some((entry) => entry.value === tab.value)
+            ? current.map((entry) => (entry.value === tab.value ? tab : entry))
+            : [...current, tab]);
+    }, []);
+    const unregisterTab = React.useCallback((valueToRemove) => {
+        setTabs((current) => current.filter((entry) => entry.value !== valueToRemove));
+    }, []);
+    React.useEffect(() => {
+        if (activeValue !== undefined)
+            return;
+        const firstEnabledTab = tabs.find((entry) => !entry.disabled);
+        if (firstEnabledTab)
+            setActiveValue(firstEnabledTab.value);
+    }, [activeValue, setActiveValue, tabs]);
+    return React.useMemo(() => ({
+        activeValue,
+        focusedValue,
+        getPanelId: (tabValue) => resolveTabElementId('panel', testID, tabValue),
+        getTabId: (tabValue) => resolveTabElementId('tab', testID, tabValue),
+        registerTab,
+        setActiveValue: (nextValue) => setActiveValue(nextValue),
+        setFocusedValue,
+        tabs,
+        unregisterTab,
+    }), [activeValue, focusedValue, registerTab, setActiveValue, tabs, testID, unregisterTab]);
+}
+//# sourceMappingURL=useTabsController.js.map

package/dist/features/tabs/composition/useTabsController.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTabsController.js","sourceRoot":"","sources":["../../../../src/features/tabs/composition/useTabsController.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,oBAAoB,EAAE,MAAM,wCAAwC,CAAC;AAE9E,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAEnE,wFAAwF;AACxF,MAAM,UAAU,iBAAiB,CAAC,EAChC,YAAY,EACZ,aAAa,EACb,MAAM,EACN,KAAK,GACkE;IACvE,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,oBAAoB,CAAqB;QAC7E,YAAY;QACZ,QAAQ,EAAE,CAAC,SAAS,EAAE,EAAE;YACtB,IAAI,SAAS,KAAK,SAAS;gBAAE,aAAa,EAAE,CAAC,SAAS,CAAC,CAAC;QAC1D,CAAC;QACD,KAAK;KACN,CAAC,CAAC;IACH,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAqB,SAAS,CAAC,CAAC;IACtF,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,KAAK,CAAC,QAAQ,CAA6B,EAAE,CAAC,CAAC;IAEvE,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,GAAoB,EAAE,EAAE;QAC7D,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE,CAClB,OAAO,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,KAAK,GAAG,CAAC,KAAK,CAAC;YAChD,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;YACnE,CAAC,CAAC,CAAC,GAAG,OAAO,EAAE,GAAG,CAAC,CACtB,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,MAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,aAAqB,EAAE,EAAE;QAChE,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,KAAK,aAAa,CAAC,CAAC,CAAC;IACjF,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,WAAW,KAAK,SAAS;YAAE,OAAO;QACtC,MAAM,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QAC9D,IAAI,eAAe;YAAE,cAAc,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;IAC7D,CAAC,EAAE,CAAC,WAAW,EAAE,cAAc,EAAE,IAAI,CAAC,CAAC,CAAC;IAExC,OAAO,KAAK,CAAC,OAAO,CAClB,GAAG,EAAE,CAAC,CAAC;QACL,WAAW;QACX,YAAY;QACZ,UAAU,EAAE,CAAC,QAAgB,EAAE,EAAE,CAAC,mBAAmB,CAAC,OAAO,EAAE,MAAM,EAAE,QAAQ,CAAC;QAChF,QAAQ,EAAE,CAAC,QAAgB,EAAE,EAAE,CAAC,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC;QAC5E,WAAW;QACX,cAAc,EAAE,CAAC,SAAiB,EAAE,EAAE,CAAC,cAAc,CAAC,SAAS,CAAC;QAChE,eAAe;QACf,IAAI;QACJ,aAAa;KACd,CAAC,EACF,CAAC,WAAW,EAAE,YAAY,EAAE,WAAW,EAAE,cAAc,EAAE,IAAI,EAAE,MAAM,EAAE,aAAa,CAAC,CACtF,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\n\nimport { useControllableState } from '../../../internal/useControllableState';\nimport type { TabRegistration, TabsContextValue, TabsProps } from '../../../types/tabs';\nimport { resolveTabElementId } from '../utils/resolveTabElementId';\n\n/*** Owns controlled state, registration, focus state, and ids for one Tabs instance. */\nexport function useTabsController({\n  defaultValue,\n  onValueChange,\n  testID,\n  value,\n}: Pick<TabsProps, 'defaultValue' | 'onValueChange' | 'testID' | 'value'>): TabsContextValue {\n  const [activeValue, setActiveValue] = useControllableState<string | undefined>({\n    defaultValue,\n    onChange: (nextValue) => {\n      if (nextValue !== undefined) onValueChange?.(nextValue);\n    },\n    value,\n  });\n  const [focusedValue, setFocusedValue] = React.useState<string | undefined>(undefined);\n  const [tabs, setTabs] = React.useState<readonly TabRegistration[]>([]);\n\n  const registerTab = React.useCallback((tab: TabRegistration) => {\n    setTabs((current) =>\n      current.some((entry) => entry.value === tab.value)\n        ? current.map((entry) => (entry.value === tab.value ? tab : entry))\n        : [...current, tab],\n    );\n  }, []);\n  const unregisterTab = React.useCallback((valueToRemove: string) => {\n    setTabs((current) => current.filter((entry) => entry.value !== valueToRemove));\n  }, []);\n\n  React.useEffect(() => {\n    if (activeValue !== undefined) return;\n    const firstEnabledTab = tabs.find((entry) => !entry.disabled);\n    if (firstEnabledTab) setActiveValue(firstEnabledTab.value);\n  }, [activeValue, setActiveValue, tabs]);\n\n  return React.useMemo(\n    () => ({\n      activeValue,\n      focusedValue,\n      getPanelId: (tabValue: string) => resolveTabElementId('panel', testID, tabValue),\n      getTabId: (tabValue: string) => resolveTabElementId('tab', testID, tabValue),\n      registerTab,\n      setActiveValue: (nextValue: string) => setActiveValue(nextValue),\n      setFocusedValue,\n      tabs,\n      unregisterTab,\n    }),\n    [activeValue, focusedValue, registerTab, setActiveValue, tabs, testID, unregisterTab],\n  );\n}\n"]}

package/dist/features/tabs/public.d.ts

@@ -0,0 +1,6 @@
+export type { TabListProps, TabPanelProps, TabProps, TabsProps } from '../../types/tabs';
+export { Tab } from './adapters/inbound/Tab';
+export { TabList } from './adapters/inbound/TabList';
+export { TabPanel } from './adapters/inbound/TabPanel';
+export { Tabs } from './adapters/inbound/Tabs';
+//# sourceMappingURL=public.d.ts.map

package/dist/features/tabs/public.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../../src/features/tabs/public.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AACzF,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC"}

package/dist/features/tabs/public.js

@@ -0,0 +1,5 @@
+export { Tab } from './adapters/inbound/Tab';
+export { TabList } from './adapters/inbound/TabList';
+export { TabPanel } from './adapters/inbound/TabPanel';
+export { Tabs } from './adapters/inbound/Tabs';
+//# sourceMappingURL=public.js.map

package/dist/features/tabs/public.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"public.js","sourceRoot":"","sources":["../../../src/features/tabs/public.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC","sourcesContent":["export type { TabListProps, TabPanelProps, TabProps, TabsProps } from '../../types/tabs';\nexport { Tab } from './adapters/inbound/Tab';\nexport { TabList } from './adapters/inbound/TabList';\nexport { TabPanel } from './adapters/inbound/TabPanel';\nexport { Tabs } from './adapters/inbound/Tabs';\n"]}

package/dist/features/tabs/utils/resolveNextTabValue.d.ts

@@ -0,0 +1,4 @@
+import type { TabNavigationKey, TabRegistration } from '../../../types/tabs';
+/*** Resolves the next enabled tab for keyboard focus navigation. */
+export declare function resolveNextTabValue(tabs: readonly TabRegistration[], currentValue: string | undefined, key: TabNavigationKey): string | undefined;
+//# sourceMappingURL=resolveNextTabValue.d.ts.map

package/dist/features/tabs/utils/resolveNextTabValue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveNextTabValue.d.ts","sourceRoot":"","sources":["../../../../src/features/tabs/utils/resolveNextTabValue.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAE7E,oEAAoE;AACpE,wBAAgB,mBAAmB,CACjC,IAAI,EAAE,SAAS,eAAe,EAAE,EAChC,YAAY,EAAE,MAAM,GAAG,SAAS,EAChC,GAAG,EAAE,gBAAgB,GACpB,MAAM,GAAG,SAAS,CAgBpB"}

package/dist/{components/tabs/navigation.js → features/tabs/utils/resolveNextTabValue.js}

@@ -1,21 +1,18 @@
+/*** Resolves the next enabled tab for keyboard focus navigation. */
 export function resolveNextTabValue(tabs, currentValue, key) {
     const enabledTabs = tabs.filter((tab) => !tab.disabled);
-    if (enabledTabs.length === 0) {
+    if (enabledTabs.length === 0)
         return undefined;
-    }
-    if (key === 'Home') {
-        return enabledTabs[0]?.value;
-    }
-    if (key === 'End') {
-        return enabledTabs[enabledTabs.length - 1]?.value;
-    }
+    if (key === 'Home')
+        return enabledTabs.at(0)?.value;
+    if (key === 'End')
+        return enabledTabs.at(-1)?.value;
     const currentIndex = enabledTabs.findIndex((tab) => tab.value === currentValue);
-    if (currentIndex === -1) {
-        return enabledTabs[0]?.value;
-    }
+    if (currentIndex === -1)
+        return enabledTabs.at(0)?.value;
     const nextIndex = key === 'ArrowLeft' || key === 'ArrowUp'
         ? (currentIndex - 1 + enabledTabs.length) % enabledTabs.length
         : (currentIndex + 1) % enabledTabs.length;
-    return enabledTabs[nextIndex]?.value;
+    return enabledTabs.at(nextIndex)?.value;
 }
-//# sourceMappingURL=navigation.js.map
+//# sourceMappingURL=resolveNextTabValue.js.map

package/dist/features/tabs/utils/resolveNextTabValue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveNextTabValue.js","sourceRoot":"","sources":["../../../../src/features/tabs/utils/resolveNextTabValue.ts"],"names":[],"mappings":"AAEA,oEAAoE;AACpE,MAAM,UAAU,mBAAmB,CACjC,IAAgC,EAChC,YAAgC,EAChC,GAAqB;IAErB,MAAM,WAAW,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IACxD,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,SAAS,CAAC;IAE/C,IAAI,GAAG,KAAK,MAAM;QAAE,OAAO,WAAW,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC;IACpD,IAAI,GAAG,KAAK,KAAK;QAAE,OAAO,WAAW,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC;IAEpD,MAAM,YAAY,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,KAAK,KAAK,YAAY,CAAC,CAAC;IAChF,IAAI,YAAY,KAAK,CAAC,CAAC;QAAE,OAAO,WAAW,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC;IAEzD,MAAM,SAAS,GACb,GAAG,KAAK,WAAW,IAAI,GAAG,KAAK,SAAS;QACtC,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,CAAC,GAAG,WAAW,CAAC,MAAM;QAC9D,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC,GAAG,WAAW,CAAC,MAAM,CAAC;IAE9C,OAAO,WAAW,CAAC,EAAE,CAAC,SAAS,CAAC,EAAE,KAAK,CAAC;AAC1C,CAAC","sourcesContent":["import type { TabNavigationKey, TabRegistration } from '../../../types/tabs';\n\n/*** Resolves the next enabled tab for keyboard focus navigation. */\nexport function resolveNextTabValue(\n  tabs: readonly TabRegistration[],\n  currentValue: string | undefined,\n  key: TabNavigationKey,\n): string | undefined {\n  const enabledTabs = tabs.filter((tab) => !tab.disabled);\n  if (enabledTabs.length === 0) return undefined;\n\n  if (key === 'Home') return enabledTabs.at(0)?.value;\n  if (key === 'End') return enabledTabs.at(-1)?.value;\n\n  const currentIndex = enabledTabs.findIndex((tab) => tab.value === currentValue);\n  if (currentIndex === -1) return enabledTabs.at(0)?.value;\n\n  const nextIndex =\n    key === 'ArrowLeft' || key === 'ArrowUp'\n      ? (currentIndex - 1 + enabledTabs.length) % enabledTabs.length\n      : (currentIndex + 1) % enabledTabs.length;\n\n  return enabledTabs.at(nextIndex)?.value;\n}\n"]}

package/dist/features/tabs/utils/resolveTabElementId.d.ts

@@ -0,0 +1,3 @@
+/*** Creates a stable tab or tab-panel id from a Tabs test id and tab value. */
+export declare function resolveTabElementId(kind: 'tab' | 'panel', testID: string | undefined, value: string): string;
+//# sourceMappingURL=resolveTabElementId.d.ts.map

package/dist/features/tabs/utils/resolveTabElementId.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveTabElementId.d.ts","sourceRoot":"","sources":["../../../../src/features/tabs/utils/resolveTabElementId.ts"],"names":[],"mappings":"AAAA,+EAA+E;AAC/E,wBAAgB,mBAAmB,CACjC,IAAI,EAAE,KAAK,GAAG,OAAO,EACrB,MAAM,EAAE,MAAM,GAAG,SAAS,EAC1B,KAAK,EAAE,MAAM,GACZ,MAAM,CAGR"}

package/dist/features/tabs/utils/resolveTabElementId.js

@@ -0,0 +1,10 @@
+/*** Creates a stable tab or tab-panel id from a Tabs test id and tab value. */
+export function resolveTabElementId(kind, testID, value) {
+    const base = testID ? `${testID}-tabs` : 'tabs';
+    return `${base}-${kind}-${sanitizeTabValue(value)}`;
+}
+/*** Normalizes a tab value for use inside an accessibility id. */
+function sanitizeTabValue(value) {
+    return value.trim().replace(/[^a-zA-Z0-9_-]+/g, '-');
+}
+//# sourceMappingURL=resolveTabElementId.js.map

package/dist/features/tabs/utils/resolveTabElementId.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveTabElementId.js","sourceRoot":"","sources":["../../../../src/features/tabs/utils/resolveTabElementId.ts"],"names":[],"mappings":"AAAA,+EAA+E;AAC/E,MAAM,UAAU,mBAAmB,CACjC,IAAqB,EACrB,MAA0B,EAC1B,KAAa;IAEb,MAAM,IAAI,GAAG,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC;IAChD,OAAO,GAAG,IAAI,IAAI,IAAI,IAAI,gBAAgB,CAAC,KAAK,CAAC,EAAE,CAAC;AACtD,CAAC;AAED,kEAAkE;AAClE,SAAS,gBAAgB,CAAC,KAAa;IACrC,OAAO,KAAK,CAAC,IAAI,EAAE,CAAC,OAAO,CAAC,kBAAkB,EAAE,GAAG,CAAC,CAAC;AACvD,CAAC","sourcesContent":["/*** Creates a stable tab or tab-panel id from a Tabs test id and tab value. */\nexport function resolveTabElementId(\n  kind: 'tab' | 'panel',\n  testID: string | undefined,\n  value: string,\n): string {\n  const base = testID ? `${testID}-tabs` : 'tabs';\n  return `${base}-${kind}-${sanitizeTabValue(value)}`;\n}\n\n/*** Normalizes a tab value for use inside an accessibility id. */\nfunction sanitizeTabValue(value: string): string {\n  return value.trim().replace(/[^a-zA-Z0-9_-]+/g, '-');\n}\n"]}