@webority/mobile-ui 0.9.1 → 0.11.0

package/lib/typescript/module/components/Input/Input.d.ts

@@ -108,8 +108,8 @@ export interface InputProps extends Omit<TextInputProps, 'style'> {
      * `'https://'`. The mirror of `unit`: the field's font size in the
      * placeholder colour, so it reads as part of the field rather than of what
      * was typed. Sits after `leftIcon` when both are set. A node (a symbol with
-     * a subscript) is drawn as is, on the same line and with the same gap; it
-     * owns its own type, and `prefixStyle` does not reach into it.
+     * a subscript) sits in the same Text on the same line with the same gap, so
+     * its base and subscript take that size and ink, and `prefixStyle` too.
      */
     prefix?: React.ReactNode;
     /** Style applied to the prefix text. */

package/lib/typescript/module/components/ListItem/ListItem.d.ts

@@ -4,6 +4,7 @@ import type { HapticType } from '../../utils/hapticUtils.js';
 import type { SlotIcon } from '../AppIcon/slotIcon.js';
 import type { ButtonProps } from '../Button/index.js';
 import type { IconBadgeTone } from '../IconBadge/index.js';
+import type { ContextMenuConfig } from '../Menu/useContextMenu.js';
 import type { SwipeableAction } from '../Swipeable/index.js';
 export type ListItemSize = 'sm' | 'md' | 'lg';
 /**
@@ -88,6 +89,14 @@ export interface ListItemProps {
     leftActions?: SwipeableAction[];
     /** Optional swipe-from-right actions. Wraps the row in a Swipeable when provided. */
     rightActions?: SwipeableAction[];
+    /**
+     * A long-press menu. Long press (right-click or Shift+F10 on the web) lifts
+     * the row over a dimmed screen with the menu beside it, and every item is
+     * also a screen reader action on the row. Unavailable items are hidden
+     * unless `unavailable: 'disable'`. Keep each action reachable elsewhere too.
+     * A disabled row has no menu.
+     */
+    contextMenu?: ContextMenuConfig;
     accessibilityLabel?: string;
     accessibilityHint?: string;
     style?: StyleProp<ViewStyle>;

package/lib/typescript/module/components/Menu/Menu.d.ts

@@ -0,0 +1,46 @@
+import React from 'react';
+import type { HapticType } from '../../utils/hapticUtils.js';
+import type { PlacementPreference } from '../../utils/placement.js';
+import type { MenuItem, MenuItems, MenuPresentation, MenuUnavailable } from './menuModel.js';
+export interface MenuProps {
+    /** A flat list, or a list of up to three groups split by dividers. */
+    items: MenuItems;
+    /**
+     * The element that opens the menu on press, usually an `IconButton` or a
+     * `Button`. Its own `onPress` still runs first.
+     */
+    trigger: React.ReactElement;
+    /** A short heading over the items; also the menu's accessible name. */
+    title?: string;
+    /** Up to three icon actions in a row above the list (the iOS "medium" layout). */
+    topActions?: ReadonlyArray<MenuItem>;
+    /** Preferred side of the trigger; flips when the other side has the room. Default `'bottom'`. */
+    placement?: PlacementPreference;
+    /** Default `'auto'`: a sheet on a phone past seven items or with a description. */
+    presentation?: MenuPresentation;
+    /** Default `'disable'`: unavailable items stay visible, dimmed and focusable. */
+    unavailable?: MenuUnavailable;
+    /** Controlled open state. */
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Haptic on choosing an item. Pass false to disable; a HapticType to override. */
+    haptic?: HapticType | false;
+    /** Accessible name of the menu when there is no `title`. */
+    accessibilityLabel?: string;
+    /** Accessible name of the tap-outside area. Default `'Close menu'`. */
+    closeLabel?: string;
+    /** Accessible name of a submenu's Back row. Default `'Back'`. */
+    backLabel?: string;
+    /** On the trigger wrapper; the open menu takes `<testID>-menu` and its scrim `<testID>-scrim`. */
+    testID?: string;
+}
+/**
+ * A menu opened from a button, anchored below it (above when there is no
+ * room) and closed by choosing an item, tapping outside, Back or Escape.
+ * Items run after the menu has closed. For a long-press menu on a row or a
+ * card, use their `contextMenu` prop.
+ */
+declare const Menu: React.FC<MenuProps>;
+export { Menu };
+export default Menu;
+//# sourceMappingURL=Menu.d.ts.map

package/lib/typescript/module/components/Menu/MenuSurface.d.ts

@@ -0,0 +1,30 @@
+import type React from 'react';
+import type { LayoutRectangle } from 'react-native';
+import type { HapticType } from '../../utils/hapticUtils.js';
+import type { PlacementPreference } from '../../utils/placement.js';
+import type { MenuItem, MenuItems, MenuPresentation, MenuUnavailable } from './menuModel.js';
+export interface MenuSurfaceProps {
+    open: boolean;
+    /** The trigger or the long-pressed view, in window coordinates. */
+    anchor: LayoutRectangle | null;
+    items: MenuItems;
+    title?: string;
+    topActions?: ReadonlyArray<MenuItem>;
+    placement: PlacementPreference;
+    presentation: MenuPresentation;
+    unavailable: MenuUnavailable;
+    /** A long-press menu: a dimmed scrim, the preview lifted, items reversed when it opens above. */
+    context?: boolean;
+    /** Drawn over the anchor while a context menu is open. */
+    preview?: React.ReactNode;
+    onClose: () => void;
+    /** Where focus goes back to when the menu closes without running an item. */
+    restoreFocusTo?: () => unknown;
+    haptic?: HapticType | false;
+    accessibilityLabel?: string;
+    closeLabel: string;
+    backLabel: string;
+    testID?: string;
+}
+export declare const MenuSurface: React.FC<MenuSurfaceProps>;
+//# sourceMappingURL=MenuSurface.d.ts.map

package/lib/typescript/module/components/Menu/focusHost.d.ts

@@ -0,0 +1,9 @@
+/** Delay before moving screen reader focus, so it lands after the surface has drawn. */
+export declare const FOCUS_DELAY_MS = 150;
+/**
+ * Moves focus to a host view: keyboard focus on the web, screen reader focus
+ * on iOS and Android. A ref that resolved to something other than a host
+ * view (a consumer component without a forwarded ref) is left alone.
+ */
+export declare const focusHost: (node: unknown) => void;
+//# sourceMappingURL=focusHost.d.ts.map

package/lib/typescript/module/components/Menu/index.d.ts

@@ -0,0 +1,5 @@
+export type { MenuProps } from './Menu.js';
+export { default, Menu } from './Menu.js';
+export type { MenuItem, MenuItems, MenuPresentation, MenuUnavailable } from './menuModel.js';
+export type { ContextMenuConfig } from './useContextMenu.js';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/components/Menu/menuModel.d.ts

@@ -0,0 +1,68 @@
+import type { SlotIcon } from '../AppIcon/slotIcon.js';
+/**
+ * One menu entry. Items are data, not children, so the same list can later
+ * be handed to a native menu (UIMenu, a Compose DropdownMenu) unchanged.
+ */
+export interface MenuItem {
+    /** Stable id; also names the item's screen reader action on a context menu. */
+    key: string;
+    /** A verb, in title case on iOS. End it with an ellipsis when the action asks for more. */
+    label: string;
+    /** Leading icon. Give every item in a group an icon, or none of them. */
+    icon?: SlotIcon;
+    /** A line under the label. On a phone any description presents the menu as a sheet. */
+    description?: string;
+    /** Short trailing text, such as a count. */
+    detail?: string;
+    /** Draws a check mark and reports the checked state; leave undefined for a plain action. */
+    checked?: boolean;
+    /** Draws the item in the error ink. Confirm the action in a Dialog from `onPress`. */
+    destructive?: boolean;
+    /** Unavailable now. Hidden or dimmed by the menu's `unavailable` mode. */
+    disabled?: boolean;
+    /** Never shown. */
+    hidden?: boolean;
+    /** One level of items that replaces the list, with a Back row, when this item is chosen. */
+    submenu?: ReadonlyArray<MenuItem>;
+    /** Runs after the menu has closed, so a Dialog or a native picker can open from it. */
+    onPress?: () => void;
+    accessibilityLabel?: string;
+    testID?: string;
+}
+/** A flat list is one group; a list of lists is groups split by dividers (at most 3). */
+export type MenuItems = ReadonlyArray<MenuItem> | ReadonlyArray<ReadonlyArray<MenuItem>>;
+/**
+ * `hide` drops a disabled item (the HIG rule for context menus); `disable`
+ * shows it dimmed and focusable but not selectable (the Material rule for a
+ * button menu).
+ */
+export type MenuUnavailable = 'hide' | 'disable';
+/**
+ * `popover` anchors the menu to its trigger; `sheet` lists it in an
+ * OptionSheet; `auto` uses the sheet on a phone when the menu has more than
+ * seven items or any description, and the popover otherwise.
+ */
+export type MenuPresentation = 'auto' | 'popover' | 'sheet';
+export declare const MAX_GROUPS = 3;
+export declare const MAX_TOP_ACTIONS = 3;
+export declare const SHEET_ITEM_THRESHOLD = 7;
+/** Prefixes a context menu's screen reader actions, so a key never collides with `activate`. */
+export declare const ACTION_PREFIX = "menu:";
+/** The groups to draw: hidden items and empty groups removed. */
+export declare const visibleGroups: (items: MenuItems, unavailable: MenuUnavailable) => ReadonlyArray<ReadonlyArray<MenuItem>>;
+/** The top row of the iOS "medium" layout, cut to three. */
+export declare const visibleTopActions: (topActions: ReadonlyArray<MenuItem> | undefined, unavailable: MenuUnavailable) => ReadonlyArray<MenuItem>;
+/** Whether `auto` presentation should use the sheet for these items on a phone. */
+export declare const wantsSheet: (groups: ReadonlyArray<ReadonlyArray<MenuItem>>, topActions: ReadonlyArray<MenuItem>) => boolean;
+export interface MenuAction {
+    name: string;
+    label: string;
+    item: MenuItem;
+}
+/**
+ * Every enabled leaf as a screen reader action: a context menu is reached by
+ * a long press, and the HIG wants its actions available without the gesture.
+ * A submenu item names its parent first.
+ */
+export declare const menuActions: (groups: ReadonlyArray<ReadonlyArray<MenuItem>>, topActions: ReadonlyArray<MenuItem>) => MenuAction[];
+//# sourceMappingURL=menuModel.d.ts.map

package/lib/typescript/module/components/Menu/useContextMenu.d.ts

@@ -0,0 +1,58 @@
+import type React from 'react';
+import type { AccessibilityActionEvent, AccessibilityActionInfo, PressableProps, View as RNView } from 'react-native';
+import type { HapticType } from '../../utils/hapticUtils.js';
+import type { PlacementPreference } from '../../utils/placement.js';
+import type { MenuItem, MenuItems, MenuPresentation, MenuUnavailable } from './menuModel.js';
+/** The `contextMenu` prop of ListItem and Card. */
+export interface ContextMenuConfig {
+    items: MenuItems;
+    /** A short heading over the items; also the menu's accessible name. */
+    title?: string;
+    /** Up to three icon actions in a row above the list (the iOS "medium" layout). */
+    topActions?: ReadonlyArray<MenuItem>;
+    /**
+     * What lifts over the dimmed screen while the menu is open. Default: the
+     * row or card itself, drawn again in place; `false` for none.
+     */
+    preview?: React.ReactNode | false;
+    /** Default `'hide'`: the HIG drops unavailable items from a context menu. */
+    unavailable?: MenuUnavailable;
+    /** Default `'auto'`: a sheet on a phone past seven items or with a description. */
+    presentation?: MenuPresentation;
+    /** Preferred side of the pressed view. Default `'bottom'`. */
+    placement?: PlacementPreference;
+    onOpenChange?: (open: boolean) => void;
+    accessibilityLabel?: string;
+    /** Accessible name of the tap-outside area. Default `'Close menu'`. */
+    closeLabel?: string;
+    /** Accessible name of a submenu's Back row. Default `'Back'`. */
+    backLabel?: string;
+}
+export interface UseContextMenuOptions {
+    /** The host's `haptic` prop: `longPress` on open, `selection` on an action, unless overridden. */
+    haptic?: HapticType | false;
+    /** Screen reader actions the host already has; the menu's are added after them. */
+    accessibilityActions?: ReadonlyArray<AccessibilityActionInfo>;
+    onAccessibilityAction?: (event: AccessibilityActionEvent) => void;
+    testID?: string;
+}
+export interface ContextMenuBinding {
+    /** False when there is no config or nothing in it to show. */
+    enabled: boolean;
+    /** Merge onto the host's pressable; the menu measures it to anchor and lift it. */
+    hostRef: React.RefObject<RNView | null>;
+    /**
+     * Spread on the host's pressable after its own props: the long press, the
+     * screen reader actions and, on the web, right-click and Shift+F10.
+     * Empty when not enabled, so a host's own `onLongPress` survives.
+     */
+    hostProps: Partial<PressableProps>;
+    /** The menu itself, given the preview the host draws by default. */
+    renderSurface: (preview?: React.ReactNode) => React.ReactNode;
+}
+/**
+ * Wires a long-press menu onto a host view. ListItem and Card use it for
+ * their `contextMenu` prop; a host owns one Pressable and spreads `hostProps`.
+ */
+export declare const useContextMenu: (config: ContextMenuConfig | undefined, options?: UseContextMenuOptions) => ContextMenuBinding;
+//# sourceMappingURL=useContextMenu.d.ts.map

package/lib/typescript/module/components/Menu/webOnly.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Props only react-native-web understands (`onKeyDown`, `onContextMenu`, an
+ * ARIA role React Native's union lacks), typed as the host's props so they
+ * can be spread. The phones get nothing, so no unknown prop reaches them.
+ */
+export declare const webOnly: <T extends object>(props: object) => T | null;
+//# sourceMappingURL=webOnly.d.ts.map

package/lib/typescript/module/components/MessageBubble/MessageBubble.d.ts

@@ -0,0 +1,87 @@
+import { type DateValue } from '@webority/mobile-core';
+import type React from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+import type { HapticType } from '../../utils/hapticUtils.js';
+export type MessageSide = 'mine' | 'theirs';
+/**
+ * Where a message sits in a run from one author. The joined corners go small
+ * and the author and time show only on the run's edges.
+ */
+export type MessageGroupPosition = 'single' | 'first' | 'middle' | 'last';
+export type MessageStatus = 'sending' | 'sent' | 'delivered' | 'read' | 'failed';
+/** The message this one answers, drawn as a quote at the top of the bubble. */
+export interface MessageReply {
+    author?: string;
+    text: string;
+    /** Jumps to the quoted message. */
+    onPress?: () => void;
+}
+/** A long-press action, also offered to screen readers as an accessibility action. */
+export interface MessageAction {
+    /** Stable id, e.g. `'copy'`. `onRetry` takes `'retry'` and `replyTo.onPress` `'openReply'`. */
+    name: string;
+    label: string;
+    onPress: () => void;
+}
+export interface MessageBubbleLabels {
+    you: string;
+    sending: string;
+    sent: string;
+    delivered: string;
+    read: string;
+    failed: string;
+    retry: string;
+    replyTo: (author: string | undefined) => string;
+}
+export declare const DEFAULT_MESSAGE_BUBBLE_LABELS: Readonly<MessageBubbleLabels>;
+export interface MessageBubbleProps {
+    side: MessageSide;
+    /**
+     * The message as plain text. Drawn when there are no `children`, read by
+     * screen readers, and announced once when a streaming reply completes.
+     */
+    text: string;
+    /** Rich content in place of `text` (a chart, an image, a renderer of your own). */
+    children?: React.ReactNode;
+    /** Draws `text` with the library `Markdown`. Ignored with `children`. */
+    markdown?: boolean;
+    /** Default `'single'`. */
+    groupPosition?: MessageGroupPosition;
+    /** Shown above the first message of a run of `theirs`; read before the text. */
+    author?: string;
+    /** Shown under the last message of a run, in the configured zone (IST by default). */
+    time?: DateValue;
+    /** Ticks under `mine`; read as a word ("Read"). */
+    status?: MessageStatus;
+    replyTo?: MessageReply;
+    /** The reply is still arriving: marked busy, announced once when it ends. */
+    streaming?: boolean;
+    /** A curated message shown under the bubble and announced at once. */
+    error?: string;
+    /** Shows Try again under a failed message, and offers it as an accessibility action. */
+    onRetry?: () => void;
+    /**
+     * Long-press actions (Copy, Reply). They are the screen reader's
+     * accessibility actions; a long press calls `onLongPress` to show them,
+     * typically in a menu. Without actions there is no long press.
+     */
+    actions?: ReadonlyArray<MessageAction>;
+    onLongPress?: () => void;
+    /** Content under the bubble on the same side (action cards, a rating). */
+    footer?: React.ReactNode;
+    labels?: Partial<MessageBubbleLabels>;
+    /** Long-press haptic. Default `'longPress'`. */
+    haptic?: HapticType | false;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+/**
+ * One chat message. `mine` sits on the trailing side in the brand tint and
+ * carries delivery ticks; `theirs` sits on the leading side on the secondary
+ * surface. Runs from one author share joined corners. The bubble reads as one
+ * element ("Asha, 4:32 PM, See you at six, Read") unless it holds `children`
+ * with no actions, when it stays open so links inside remain reachable.
+ */
+export declare const MessageBubble: React.FC<MessageBubbleProps>;
+export default MessageBubble;
+//# sourceMappingURL=MessageBubble.d.ts.map

package/lib/typescript/module/components/MessageBubble/index.d.ts

@@ -0,0 +1,3 @@
+export type { MessageAction, MessageBubbleLabels, MessageBubbleProps, MessageGroupPosition, MessageReply, MessageSide, MessageStatus } from './MessageBubble.js';
+export { DEFAULT_MESSAGE_BUBBLE_LABELS, default, MessageBubble } from './MessageBubble.js';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/components/MessageList/MessageList.d.ts

@@ -0,0 +1,68 @@
+import { type DateValue } from '@webority/mobile-core';
+import type React from 'react';
+import type { FlatListProps } from 'react-native';
+import { type DateSeparatorLabels } from '../DateSeparator/index.js';
+import type { MessageGroupPosition } from '../MessageBubble/index.js';
+export interface MessageRenderInfo<T> {
+    item: T;
+    /** 0 is the newest. */
+    index: number;
+    /** Pass to `MessageBubble`; always `'single'` without `getAuthorKey`. */
+    groupPosition: MessageGroupPosition;
+}
+export interface MessageListLabels extends DateSeparatorLabels {
+    jumpToLatest: string;
+    newMessages: (count: number) => string;
+    /** The divider above the first unread message. */
+    unread: string;
+    loadingOlder: string;
+}
+export declare const DEFAULT_MESSAGE_LIST_LABELS: Readonly<MessageListLabels>;
+type OwnedListProps = 'data' | 'renderItem' | 'keyExtractor' | 'inverted' | 'onEndReached' | 'ListHeaderComponent' | 'ListFooterComponent' | 'ListEmptyComponent' | 'renderScrollComponent';
+export interface MessageListProps<T> extends Omit<FlatListProps<T>, OwnedListProps> {
+    /** Newest first, the order the list draws from the bottom up. */
+    messages: ReadonlyArray<T>;
+    keyExtractor: (item: T) => string;
+    /** Draws one message, usually a `MessageBubble` given `groupPosition`. */
+    renderMessage: (info: MessageRenderInfo<T>) => React.ReactElement | null;
+    /** Joins consecutive messages from one author into a run with shared corners. */
+    getAuthorKey?: (item: T) => string;
+    /** Draws a day separator ("Today", "Yesterday", "10-Oct-2026") where the day changes. */
+    getDate?: (item: T) => DateValue;
+    /** Draws the "New messages" divider above this message. */
+    firstUnreadKey?: string;
+    /** Called near the top of the history to load the page before the oldest. */
+    onLoadOlder?: () => void;
+    loadingOlder?: boolean;
+    /** False once the oldest page is in. Default true. */
+    hasOlder?: boolean;
+    /** Drawn under the newest message, e.g. a `TypingIndicator`. */
+    typing?: React.ReactNode;
+    /** Drawn while there are no messages. */
+    empty?: React.ReactNode;
+    /** A message to announce politely for each new message, e.g. "Asha: See you at six". */
+    getAnnouncement?: (item: T) => string | null | undefined;
+    /** True for a new message that should bring the list to the latest, such as the person's own. */
+    followNew?: (item: T) => boolean;
+    /**
+     * Lifts the newest messages above the keyboard through
+     * react-native-keyboard-controller's `KeyboardChatScrollView`. Default true;
+     * turn it off when a parent already moves with the keyboard.
+     */
+    keyboardAware?: boolean;
+    /** The `Composer`'s `keyboardOffset`. Default: the bottom safe-area inset. */
+    keyboardOffset?: number;
+    labels?: Partial<MessageListLabels>;
+    /** The reference for Today and Yesterday. Default: now. */
+    now?: Date;
+}
+/**
+ * A conversation: an inverted `FlatList` that starts at the newest message,
+ * draws day separators and an unread divider, joins runs from one author,
+ * loads older pages at the top without moving what is on screen, and lifts
+ * above the keyboard. Scrolled away from the latest, a jump button appears
+ * with the count of messages that arrived meanwhile.
+ */
+export declare function MessageList<T>({ messages, keyExtractor, renderMessage, getAuthorKey, getDate, firstUnreadKey, onLoadOlder, loadingOlder, hasOlder, typing, empty, getAnnouncement, followNew, keyboardAware, keyboardOffset, labels: labelOverrides, now, onScroll, contentContainerStyle, style, testID, ...rest }: MessageListProps<T>): React.ReactElement;
+export default MessageList;
+//# sourceMappingURL=MessageList.d.ts.map

package/lib/typescript/module/components/MessageList/index.d.ts

@@ -0,0 +1,3 @@
+export type { MessageListLabels, MessageListProps, MessageRenderInfo } from './MessageList.js';
+export { DEFAULT_MESSAGE_LIST_LABELS, default, MessageList } from './MessageList.js';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/components/Notation/Notation.d.ts

@@ -1,5 +1,5 @@
 import type React from 'react';
-import type { ColorValue } from 'react-native';
+import type { ColorValue, StyleProp, TextStyle } from 'react-native';
 export interface NotationRun {
     text: string;
     /** The subscript that follows `text`, when the run is a symbol. */
@@ -24,8 +24,8 @@ export interface NotationProps {
     /** Follows the symbol after a space. */
     desc?: string;
     /**
-     * Subscript ink. Inside a field label it defaults to the label's ink, elsewhere to
-     * `colors.text.primary`; pass the parent's colour when it differs.
+     * Subscript ink. Inside a field's or choice's label or message line it defaults to that line's
+     * ink, elsewhere to `colors.text.primary`; pass the parent's colour when it differs.
      */
     color?: string;
     testID?: string;
@@ -37,8 +37,14 @@ export interface NotationInk {
     fontSize: number;
     color: ColorValue;
 }
-/** Provided by a label Text (FieldLabel) so a subscript inside it scales and inks with the label. */
+/**
+ * Provided by a field's text lines (FieldLabel, the floating label, FieldMessage, the FormField
+ * label, helper and error, and the Checkbox, Radio and Switch label, description and error) so a
+ * subscript inside one scales and inks with that line.
+ */
 export declare const NotationInkContext: React.Context<NotationInk | null>;
+/** The ink for a line's provider: the line's own `style` size and colour win over its defaults. */
+export declare const useNotationInk: (style: StyleProp<TextStyle>, fontSize: number, color: ColorValue) => NotationInk;
 /** A symbol of a standard with its subscript drawn small and lowered below the baseline. */
 export declare const Notation: React.FC<NotationProps>;
 /** A symbol as the standard prints it: `sym('C', 'IP')` is C with a small IP, then `desc` if given. */

package/lib/typescript/module/components/OnboardingPager/OnboardingPager.d.ts

@@ -0,0 +1,53 @@
+import type React from 'react';
+import type { HapticType } from '../../utils/hapticUtils.js';
+export interface OnboardingPage {
+    /** Stable identity of the page; also the list key. */
+    key: string;
+    /** The picture or illustration above the text: any node, for example an `Image`. */
+    art?: React.ReactNode;
+    title: string;
+    body: string;
+}
+export interface OnboardingPagerLabels {
+    skip?: string;
+    next?: string;
+    /** Spoken before the title of each page. Default `Step 2 of 3`. */
+    step?: (position: number, total: number) => string;
+    /** Names the page control for a screen reader. Default `Page`. */
+    pageControl?: string;
+}
+export interface OnboardingPagerProps {
+    /** Three or four is the sweet spot; more than six are not shown. */
+    pages: OnboardingPage[];
+    /** The final button was pressed. The app records that the intro was seen. */
+    onDone: () => void;
+    /** Skip was pressed, on any page. The app records that the intro was seen. */
+    onSkip: () => void;
+    /** Title of the final button. Default `Get started`. */
+    doneLabel?: string;
+    labels?: OnboardingPagerLabels;
+    /**
+     * Pads the top and bottom by the device safe-area insets. Pass false when the pager sits
+     * inside a screen that already handles them. Default true.
+     */
+    safeArea?: boolean;
+    /** Haptic on Skip, Next and the final button. `false` opts out. */
+    haptic?: HapticType | false;
+    testID?: string;
+}
+/**
+ * A first-launch intro: full-screen pages of art, title and body that swipe, a page
+ * control, Skip at the top on every page, and a footer button that reads Next and then
+ * the done label, so the flow never needs a swipe. Built on `Carousel`
+ * (no autoplay, no loop). The app owns whether the intro was seen: `onDone` and `onSkip`
+ * both mean "seen", and it stores that itself. A page whose text outgrows the screen at a
+ * large font size scrolls inside the page.
+ *
+ * The page control is one adjustable element for a screen reader (swipe up or down to change
+ * page); touching its leading half goes back one page, its trailing half forward one. Under
+ * Reduce Motion pages change without animation and the active dot changes at once.
+ */
+declare const OnboardingPager: React.FC<OnboardingPagerProps>;
+export { OnboardingPager };
+export default OnboardingPager;
+//# sourceMappingURL=OnboardingPager.d.ts.map

package/lib/typescript/module/components/OnboardingPager/index.d.ts

@@ -0,0 +1,3 @@
+export type { OnboardingPage, OnboardingPagerLabels, OnboardingPagerProps } from './OnboardingPager.js';
+export { default, OnboardingPager } from './OnboardingPager.js';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/components/OptionSheet/OptionSheet.d.ts

@@ -45,6 +45,8 @@ export interface OptionSheetProps {
      * earlier, iOS attaches it to the closing window and dismisses it with it.
      */
     onAfterClose?: () => void;
+    /** Called with `true` when `open` turns on and `false` when it turns off, not again while it stays the same. */
+    onOpenChange?: (open: boolean) => void;
     /** Sheet heading. Also the modal's a11y label fallback. */
     title?: string;
     options: ReadonlyArray<unknown>;

package/lib/typescript/module/components/PaymentResult/PaymentResult.d.ts

@@ -0,0 +1,71 @@
+import type React from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+import type { DescriptionItem } from '../Descriptions/index.js';
+/**
+ * `pending` is its own outcome, never a kind of failure: the bank has not said
+ * yes or no, so the money may still go through. `refunded` is a payment that
+ * was taken and has been returned.
+ */
+export type PaymentResultStatus = 'success' | 'pending' | 'failed' | 'refunded';
+export interface PaymentResultProps {
+    status: PaymentResultStatus;
+    /** Integer paise, as the API carries it. Shown in rupees with Indian digit grouping. */
+    amount: number;
+    /** ISO 4217 code of `amount`'s currency. Default `'INR'`. */
+    currency?: string;
+    /** Who was paid ("Capnix"). */
+    payee?: string;
+    /** The gateway or bank reference (a UPI RRN or UTR). Read digit by digit by a screen reader. */
+    reference?: string;
+    /** When the payment was made: an ISO string, a Date or epoch milliseconds. Shown in IST. */
+    paidAt?: string | number | Date;
+    /** How it was paid ("UPI, HDFC Bank ...4821"). */
+    method?: string;
+    /** Receipt rows after the built-in ones. A row with an empty value is dropped. */
+    rows?: ReadonlyArray<DescriptionItem>;
+    /**
+     * For `failed`: whether money left the account. `true` says it will come back; `false` says
+     * nothing was taken and is the only value that lets `onRetry` show. Left unset, the screen
+     * tells the person to check their statement first and offers no retry.
+     */
+    debited?: boolean;
+    /** Working days the bank takes to return a debited amount. Default 5. */
+    refundDays?: number;
+    /** For `pending`: when it should settle, shown in IST. Without it the usual window is stated. */
+    settlesBy?: string | number | Date;
+    /** Replaces the heading ("Payment successful"). */
+    title?: string;
+    /** Replaces the line under the amount. The pending safety lines are not replaceable. */
+    message?: string;
+    /** Shows a Share receipt button. The app builds and shares the receipt itself. */
+    onShare?: () => void;
+    /** Shows a Download button. */
+    onDownload?: () => void;
+    /** Shows a Done button. */
+    onDone?: () => void;
+    /** Shows Try again. Honoured only for a `failed` payment with `debited={false}`. */
+    onRetry?: () => void;
+    /** Shows Check status while `pending`. The app polls or refetches; this component never does. */
+    onRefresh?: () => void;
+    /** Puts Check status into its busy state. */
+    refreshing?: boolean;
+    /** Burst of confetti on success. Default true. Not played under Reduce Motion. */
+    celebrate?: boolean;
+    /**
+     * Haptic on the outcome: a success buzz for `success` and an error buzz for `failed`.
+     * `pending` and `refunded` never buzz. Default true.
+     */
+    haptic?: boolean;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+/**
+ * The end of a payment: what happened, how much, and what to do next. A UPI
+ * payment can sit between "sent" and "settled" for minutes or hours, and showing
+ * that as a failure, or offering Try again, is how people pay twice. So `pending`
+ * has its own mark, its own word and no retry, and a failed payment offers retry
+ * only when the caller says nothing was debited.
+ */
+export declare const PaymentResult: React.FC<PaymentResultProps>;
+export default PaymentResult;
+//# sourceMappingURL=PaymentResult.d.ts.map

package/lib/typescript/module/components/PaymentResult/index.d.ts

@@ -0,0 +1,3 @@
+export type { PaymentResultProps, PaymentResultStatus } from './PaymentResult.js';
+export { default, PaymentResult } from './PaymentResult.js';
+//# sourceMappingURL=index.d.ts.map