@webority/mobile-ui 0.0.0-stage → 0.0.34

package/lib/typescript/module/components/AuthedImage/authedImageCache.d.ts

@@ -0,0 +1,51 @@
+import type { DownloadHttpClient } from '@webority/mobile-core/download';
+export declare const DEFAULT_TTL_MS: number;
+export interface AuthedImageCacheMeta {
+    fetchedAt: number;
+    bytes: number;
+    contentType: string;
+    lastAccessedAt: number;
+}
+export interface CachedImage {
+    dataUri: string;
+    meta: AuthedImageCacheMeta;
+}
+/**
+ * Ceiling for the total stored size of cached images. Exceeding it evicts the
+ * least recently used entries. An image cache with no ceiling grows until the
+ * OS reclaims the app's storage, which is the defect this replaces.
+ */
+export declare const setAuthedImageCacheLimit: (bytes: number) => void;
+export declare const getAuthedImageCacheLimit: () => number;
+/**
+ * Hex only by construction, so it is always a safe storage key segment.
+ */
+export declare const deriveCacheKey: (uri: string, override?: string) => string;
+export declare const readEntry: (cacheKey: string) => Promise<CachedImage | null>;
+export declare const isFresh: (meta: AuthedImageCacheMeta, ttlMs: number, now?: number) => boolean;
+export declare const touchEntry: (cacheKey: string, meta: AuthedImageCacheMeta) => Promise<void>;
+export declare const clearAuthedImageCache: () => Promise<void>;
+export declare const authedImageCacheStats: () => Promise<{
+    entries: number;
+    bytes: number;
+}>;
+export interface FetchOptions {
+    uri: string;
+    headers?: Record<string, string>;
+    /** Attaches the stored bearer token, and only when no `client` is given. */
+    authenticated: boolean;
+    client?: DownloadHttpClient;
+}
+export interface InFlightFetch {
+    promise: Promise<CachedImage>;
+    controller: AbortController;
+    waiters: number;
+}
+/**
+ * Two mounts of the same image share one request. The controller is aborted
+ * only when the last waiter releases, so one unmount cannot cancel the fetch
+ * another mount is still waiting on.
+ */
+export declare const acquireFetch: (cacheKey: string, options: FetchOptions) => InFlightFetch;
+export declare const releaseFetch: (cacheKey: string, entry: InFlightFetch) => void;
+//# sourceMappingURL=authedImageCache.d.ts.map

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

@@ -0,0 +1,5 @@
+export type { AuthedImageProps } from './AuthedImage.js';
+export { AuthedImage, default } from './AuthedImage.js';
+export type { AuthedImageCacheMeta } from './authedImageCache.js';
+export { authedImageCacheStats, clearAuthedImageCache, getAuthedImageCacheLimit, setAuthedImageCacheLimit } from './authedImageCache.js';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,53 @@
+import React from 'react';
+import type { StyleProp, TextStyle, ViewStyle } from 'react-native';
+import type { HapticType } from '../../utils/index.js';
+import type { InputSize, InputVariant } from '../Input/index.js';
+export interface AutocompleteProps<T = string> {
+    /** Candidate options to filter. */
+    options: ReadonlyArray<T>;
+    /** Controlled input text. */
+    value?: string;
+    /** Uncontrolled initial text. */
+    defaultValue?: string;
+    onChangeText?: (text: string) => void;
+    /** Fired when a suggestion is chosen. */
+    onSelect: (option: T) => void;
+    /** Read a display label from an option. Defaults to the option itself for strings. */
+    getOptionLabel?: (option: T) => string;
+    /** Stable React key per option. Defaults to label + index. */
+    getOptionKey?: (option: T) => string;
+    /** Custom match predicate. Defaults to a case-insensitive substring match on the label. */
+    filter?: (option: T, query: string) => boolean;
+    /** Minimum characters before suggestions appear. Default 1. */
+    minChars?: number;
+    /** Cap the number of suggestions shown. Default 8. */
+    maxResults?: number;
+    /** Text shown when nothing matches. Default "No matches". */
+    emptyText?: string;
+    /** Show a loading spinner in the dropdown — e.g. while fetching remote results. */
+    loading?: boolean;
+    /** `'client'` filters `options` locally; `'none'` shows them as-is (for server-side search). Default `'client'`. */
+    filterMode?: 'client' | 'none';
+    /** Text beside the loading spinner. Default "Searching…". */
+    loadingText?: string;
+    placeholder?: string;
+    label?: string;
+    error?: string;
+    helperText?: string;
+    disabled?: boolean;
+    size?: InputSize;
+    variant?: InputVariant;
+    /** Haptic on select. Default `'selection'`. */
+    haptic?: HapticType | false;
+    style?: StyleProp<ViewStyle>;
+    listStyle?: StyleProp<ViewStyle>;
+    optionTextStyle?: StyleProp<TextStyle>;
+    testID?: string;
+}
+declare function Autocomplete<T = string>(props: AutocompleteProps<T>): React.JSX.Element;
+declare namespace Autocomplete {
+    var displayName: string;
+}
+export { Autocomplete };
+export default Autocomplete;
+//# sourceMappingURL=Autocomplete.d.ts.map

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

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

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

@@ -0,0 +1,99 @@
+import React from 'react';
+import type { ImageSourcePropType, ImageStyle, View as RNView, StyleProp, TextStyle, ViewStyle } from 'react-native';
+import type { Theme } from '../../theme/types.js';
+/**
+ * Props passed to a custom {@link AvatarProps.ImageComponent}. They mirror what
+ * the built-in `<Image>` receives, so a plain RN `Image` is a valid drop-in.
+ * Supply a custom component to render images that need authenticated fetching,
+ * caching, or token refresh (the library stays auth-agnostic).
+ */
+export interface AvatarImageProps {
+    source: ImageSourcePropType;
+    style: StyleProp<ImageStyle>;
+    resizeMode: 'cover';
+    onError: () => void;
+    accessibilityIgnoresInvertColors?: boolean;
+}
+export type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | number;
+export type AvatarShape = 'circle' | 'square' | 'rounded';
+/**
+ * Presence dots (`online`, `offline`, `busy`, `away`) and identity states
+ * (`verified`: green ring with a check seal at the status corner, `pending`:
+ * amber ring, no seal). The ring states keep the avatar's footprint and inset
+ * the picture, so switching between them never reflows a layout.
+ */
+export type AvatarStatus = 'online' | 'offline' | 'busy' | 'away' | 'verified' | 'pending' | null;
+export type AvatarStatusPosition = 'topRight' | 'bottomRight';
+/**
+ * Theme colour of the initials disc: a soft tint of the tone behind initials
+ * in the tone, the soft Button's recipe. `neutral` is the quiet grey on
+ * primary text; `secondary` is the theme's secondary surface and its ink.
+ */
+export type AvatarTone = 'neutral' | 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
+/** The fill and the ink of an initials disc in a tone. Shared with ProfilePicker's placeholder. */
+export declare const avatarToneColors: (theme: Theme, tone: AvatarTone) => {
+    background: string;
+    color: string;
+};
+export interface AvatarProps {
+    source?: ImageSourcePropType;
+    /**
+     * Custom component used to render the image instead of the built-in `<Image>`.
+     * Receives {@link AvatarImageProps}. Use this when `source` points at a secured
+     * endpoint that needs auth headers / token refresh / caching — plug in the
+     * app's authenticated image loader. On error it should call `onError`, which
+     * triggers the initials fallback. When omitted, a plain RN `<Image>` is used.
+     */
+    ImageComponent?: React.ComponentType<AvatarImageProps>;
+    name?: string;
+    size?: AvatarSize;
+    shape?: AvatarShape;
+    status?: AvatarStatus;
+    statusPosition?: AvatarStatusPosition;
+    /**
+     * Theme colour of the initials disc (see {@link AvatarTone}). Unset keeps
+     * the per-name palette colour with inverse ink. `backgroundColor` and
+     * `color` win over it.
+     */
+    tone?: AvatarTone;
+    backgroundColor?: string;
+    color?: string;
+    /**
+     * Per-instance initials font size in pixels. Wins over theme tokens
+     * (`avatar.fontSize` and `avatar.fontSizeRatio`) and the size-derived default.
+     */
+    fontSize?: number;
+    /**
+     * When true, renders the component as its authored skeleton placeholder shape.
+     * The placeholder mirrors the real layout's footprint so the UI doesn't reflow
+     * when data arrives. Use this while the data driving the component is being fetched.
+     */
+    loading?: boolean;
+    accessibilityLabel?: string;
+    style?: StyleProp<ViewStyle>;
+    textStyle?: StyleProp<TextStyle>;
+    testID?: string;
+}
+declare const Avatar: React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<RNView>> & {
+    Skeleton: React.FC<AvatarProps>;
+};
+export type AvatarGroupSpacing = 'tight' | 'normal' | 'loose';
+export type AvatarGroupOverflowVariant = 'count' | 'plus';
+export interface AvatarGroupProps {
+    children: React.ReactElement<AvatarProps>[];
+    max?: number;
+    size?: AvatarSize;
+    spacing?: AvatarGroupSpacing;
+    overflowVariant?: AvatarGroupOverflowVariant;
+    accessibilityLabel?: string;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+declare const AvatarGroup: React.FC<AvatarGroupProps>;
+type AvatarComponent = typeof Avatar & {
+    Group: typeof AvatarGroup;
+};
+declare const AvatarWithGroup: AvatarComponent;
+export { Avatar, AvatarGroup };
+export default AvatarWithGroup;
+//# sourceMappingURL=Avatar.d.ts.map

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

@@ -0,0 +1,3 @@
+export type { AvatarGroupOverflowVariant, AvatarGroupProps, AvatarGroupSpacing, AvatarImageProps, AvatarProps, AvatarShape, AvatarSize, AvatarStatus, AvatarStatusPosition, AvatarTone } from './Avatar.js';
+export { Avatar, AvatarGroup, avatarToneColors, default } from './Avatar.js';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,34 @@
+import React from 'react';
+import type { View as RNView, StyleProp, TextStyle, ViewStyle } from 'react-native';
+export type BadgeVariant = 'standard' | 'dot';
+export type BadgeTone = 'primary' | 'success' | 'warning' | 'error' | 'neutral' | 'info';
+export type BadgeSize = 'sm' | 'md';
+export type BadgeAnchor = 'topRight' | 'topLeft' | 'bottomRight' | 'bottomLeft';
+export interface BadgeProps {
+    value?: number | string;
+    max?: number;
+    variant?: BadgeVariant;
+    tone?: BadgeTone;
+    size?: BadgeSize;
+    invisible?: boolean;
+    /**
+     * When true, renders the component as its authored skeleton placeholder shape.
+     * The placeholder mirrors the real layout's footprint so the UI doesn't reflow
+     * when data arrives. Use this while the data driving the component is being fetched.
+     */
+    loading?: boolean;
+    children?: React.ReactNode;
+    anchor?: BadgeAnchor;
+    pulse?: boolean;
+    accessibilityLabel?: string;
+    style?: StyleProp<ViewStyle>;
+    badgeStyle?: StyleProp<ViewStyle>;
+    textStyle?: StyleProp<TextStyle>;
+    testID?: string;
+}
+declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<RNView>> & {
+    Skeleton: React.FC<BadgeProps>;
+};
+export { Badge };
+export default Badge;
+//# sourceMappingURL=Badge.d.ts.map

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

@@ -0,0 +1,3 @@
+export type { BadgeAnchor, BadgeProps, BadgeSize, BadgeTone, BadgeVariant } from './Badge.js';
+export { Badge, default } from './Badge.js';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,47 @@
+import React from 'react';
+import type { View as RNView, StyleProp, ViewStyle } from 'react-native';
+import type { HapticType } from '../../utils/hapticUtils.js';
+export type BannerVariant = 'info' | 'success' | 'warning' | 'error' | 'neutral';
+export interface BannerAction {
+    label: string;
+    onPress: () => void;
+    tone?: 'primary' | 'neutral';
+}
+export interface BannerProps {
+    title?: string;
+    message: string | React.ReactNode;
+    variant?: BannerVariant;
+    icon?: React.ReactNode | false;
+    actions?: BannerAction[];
+    dismissible?: boolean;
+    onDismiss?: () => void;
+    /** Haptic feedback for interactions. Pass false to disable; pass a HapticType to override the default. */
+    haptic?: HapticType | false;
+    visible?: boolean;
+    animateMount?: boolean;
+    /**
+     * When true, renders the component as its authored skeleton placeholder shape.
+     * The placeholder mirrors the real layout's footprint so the UI doesn't reflow
+     * when data arrives. Use this while the data driving the component is being fetched.
+     */
+    loading?: boolean;
+    accessibilityLabel?: string;
+    style?: StyleProp<ViewStyle>;
+    /** Alias for `style` — applied to the outer animated container. */
+    containerStyle?: StyleProp<ViewStyle>;
+    /** Style applied to the auto-rendered icon circle (when no custom `icon` is provided). */
+    iconCircleStyle?: StyleProp<ViewStyle>;
+    /** Style applied to the leading tint bar. */
+    tintBarStyle?: StyleProp<ViewStyle>;
+    /** Style applied to the dismiss/close button. */
+    closeButtonStyle?: StyleProp<ViewStyle>;
+    /** Style applied to each action button (Pressable). */
+    actionButtonStyle?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+declare const Banner: React.ForwardRefExoticComponent<BannerProps & React.RefAttributes<RNView>> & {
+    Skeleton: React.FC<BannerProps>;
+};
+export { Banner };
+export default Banner;
+//# sourceMappingURL=Banner.d.ts.map

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

@@ -0,0 +1,3 @@
+export type { BannerAction, BannerProps, BannerVariant } from './Banner.js';
+export { Banner, default } from './Banner.js';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,212 @@
+import React from 'react';
+import type { View as RNView, StyleProp, TextStyle, ViewStyle } from 'react-native';
+import type { ShadowScale } from '../../theme/types.js';
+import type { HapticType } from '../../utils/index.js';
+import type { SlotIcon, SlotIconState } from '../AppIcon/index.js';
+/**
+ * Visual style of the bar.
+ *
+ * - `pill`: a soft tinted pill slides behind the active icon (default).
+ * - `underline`: a line slides under (or over) the active tab cell.
+ * - `floating`: the bar is a detached capsule, lifted off the bottom as well
+ *   as the sides; the pill slides inside it.
+ * - `bubble`: the active icon lifts into a filled circle that pokes above
+ *   the bar; the circle slides between tabs.
+ * - `expand`: the active tab widens into a pill showing icon and label side
+ *   by side; the other tabs collapse to icons.
+ * - `solid`: the whole bar is brand-coloured; the active tab sits in a light
+ *   pill with inverted inks.
+ * - `tile`: a detached capsule like `floating`, but the tinted pill takes
+ *   the whole active tab, icon and label together, up to 96 wide; inactive
+ *   tabs keep the primary text ink instead of the muted one.
+ */
+export type BottomNavigationVariant = 'pill' | 'underline' | 'floating' | 'bubble' | 'expand' | 'solid' | 'tile';
+export type BottomNavigationIndicatorPosition = 'top' | 'bottom';
+/**
+ * Corner radius of the bar surface in pixels, or `full`: half the surface's
+ * own height, so the bar's ends are round whatever the bar's height comes to.
+ */
+export type BottomNavigationRadius = number | 'full';
+/**
+ * Corner radius of the active tab's background: `auto` follows the bar's
+ * radius, a number sets its own in pixels. Every value is capped at half the
+ * background's own height, so a large number reads as fully round.
+ */
+export type BottomNavigationIndicatorRadius = number | 'auto';
+/** Shadow under the bar surface: a theme shadow level, or `none`. */
+export type BottomNavigationElevation = keyof ShadowScale;
+export type TabBadge = number | string | boolean | null;
+/** What a tab knows about itself when it draws its icon. */
+export interface TabIconProps extends SlotIconState {
+    focused: boolean;
+}
+/**
+ * A tab icon speaks the library's slot language: an AppIcon name
+ * (`icon: 'home'`), `{ name, variant }`, a render function that gets
+ * `{ color, size, focused, disabled }`, or any node drawn as is. A bare name
+ * with no `activeIcon` is drawn in the `bold` style while the tab is active.
+ */
+export type TabIcon = SlotIcon<TabIconProps>;
+export interface TabConfig {
+    key: string;
+    /**
+     * Text under the icon, and the tab's accessible name. To draw the tab
+     * icon-only set `showLabel: false` rather than an empty string, which
+     * also leaves a screen reader with no name for the tab.
+     */
+    label: string;
+    /**
+     * Draw this tab's label. `false` hides the text and centres the icon in
+     * the tab on its own, while `label` still names the tab for a screen
+     * reader. Default true; `showLabels` on the bar hides every label.
+     */
+    showLabel?: boolean;
+    icon: TabIcon;
+    activeIcon?: TabIcon;
+    badge?: TabBadge;
+}
+/**
+ * A button in the middle of the bar that is not a tab: pressing it runs its
+ * own handler and leaves the active tab alone (a "new loan" or "scan" button).
+ * It takes one cell in the middle of the row, so the tabs split around it,
+ * the extra one going left when the count is odd.
+ */
+export interface BottomNavigationCenterAction {
+    /** The button's accessible name. Never drawn. */
+    label: string;
+    onPress: () => void;
+    /**
+     * Drawn in a filled circle, in the library's slot language (an AppIcon
+     * name, `{ name, variant }`, a render function or a node). Default `'add'`.
+     * Ignored when `content` is set.
+     */
+    icon?: SlotIcon;
+    /**
+     * Replaces the filled circle entirely: an image, a gradient, any node,
+     * drawn as is and pressable as a whole. Size it yourself; `size` then only
+     * sets the fallback box.
+     */
+    content?: React.ReactNode;
+    /** Diameter of the filled circle, in pixels. Default 48. */
+    size?: number;
+    /** Fill of the circle. Default the theme's `primary`. */
+    color?: string;
+    /** Ink of the icon in the circle. Default the theme's `onPrimary`. */
+    iconColor?: string;
+    /** Pixel size of the icon in the circle. Default 24. */
+    iconSize?: number;
+    /**
+     * How far the button rises above the centre of the row, in pixels. Default
+     * 0 keeps it level with the tabs; a positive value lets it poke above the
+     * bar, and the component grows by the overhang so the raised part stays
+     * inside its own box (and so stays pressable on both platforms).
+     */
+    lift?: number;
+    /**
+     * Space between the button and the tab cells either side of it, in
+     * pixels. Set, the button's cell hugs the button and the tabs share the
+     * rest, so `0` puts the neighbouring cells right against it. Unset, the
+     * button gets a cell as wide as a tab's, spaced evenly with the tabs.
+     * Negative values count as 0.
+     */
+    gap?: number;
+    /** Haptic on press, or `false`. Default the bar's own `haptic`. */
+    haptic?: HapticType | false;
+    testID?: string;
+}
+export interface BottomNavigationProps {
+    tabs: TabConfig[];
+    /** A pressable button in the middle of the bar, between the tabs. */
+    centerAction?: BottomNavigationCenterAction;
+    activeTab: string;
+    onChange: (tabKey: string) => void;
+    haptic?: HapticType | false;
+    /**
+     * Show the text label under each icon. `expand` only ever labels the
+     * active tab, and `false` hides that one too.
+     */
+    showLabels?: boolean;
+    variant?: BottomNavigationVariant;
+    /**
+     * Where the active-tab line sits, for variants that draw a line
+     * (currently `underline`). Default `'bottom'` preserves the legacy look;
+     * `'top'` flips the line to sit just above the tab row.
+     */
+    indicatorPosition?: BottomNavigationIndicatorPosition;
+    /**
+     * Corner radius of the bar's own surface: the docked bar for every variant
+     * but `floating` and `tile`, where it rounds the detached capsule instead.
+     * A pixel value, or `full`, which rounds the ends completely at half the
+     * surface's measured height. Defaults to square for the docked
+     * bar, to `floatingRadius` (28) for the `floating` capsule and to fully
+     * round for the `tile` capsule.
+     *
+     * Set the radius here rather than through `style`: the `underline` variant
+     * reads it and insets its tab row by the radius so the line stays inside
+     * the rounded edge (the other variants keep their tabs at full width), and
+     * a radius the component cannot see leaves the line hanging past the
+     * corners.
+     */
+    radius?: BottomNavigationRadius;
+    /**
+     * Corner radius of the active tab's background on the `pill`, `floating`,
+     * `solid`, `tile` and `expand` variants. `auto` (default) takes the bar's
+     * radius once one is set through `radius` or the `borderRadius` token, and
+     * stays fully round while none is. A number sets the background's own
+     * radius whatever the bar's. Capped at half the background's height, since
+     * Android squares off a larger radius, so a large number is fully round.
+     */
+    indicatorRadius?: BottomNavigationIndicatorRadius;
+    /**
+     * Shadow under the bar surface, as a theme shadow level. `none` unless set.
+     * Drawn as a `boxShadow` where the platform supports one, so Android and
+     * iOS match.
+     */
+    elevation?: BottomNavigationElevation;
+    /**
+     * Size of every tab icon in pixels. Default 18, or
+     * `components.bottomNavigation.iconSize`. The active pill follows it.
+     */
+    iconSize?: number;
+    /**
+     * Air between the bar surface and the screen's left and right edges, in
+     * pixels, on every variant. Default 16, or
+     * `components.bottomNavigation.floatingMargin`.
+     */
+    marginHorizontal?: number;
+    /**
+     * Air above and below the bar surface, in pixels. Default 16 for the
+     * `floating` and `tile` capsules and 0 for a docked bar. Above zero it
+     * lifts any variant off the screen edge, and the safe-area inset then goes
+     * into that lift instead of the surface.
+     */
+    marginVertical?: number;
+    /**
+     * Air inside the bar surface between its left and right edges and the tab
+     * row, in pixels. Default 4 for a docked bar and 8 for the `floating` and
+     * `tile` capsules. The `underline` variant still insets its row by at least
+     * the bar's radius, so its line never crosses a rounded corner.
+     */
+    paddingHorizontal?: number;
+    /**
+     * Air inside the bar surface above and below the tab row, in pixels.
+     * Default 6 (8 above the `bubble` row). On a docked bar that is not lifted
+     * by `marginVertical`, the bottom takes the safe-area inset instead when
+     * that is larger. The `underline` line sits on this padding's outer edge.
+     */
+    paddingVertical?: number;
+    /**
+     * Hairline border on all four sides of the bar surface, on every variant.
+     * Off unless set.
+     */
+    border?: boolean;
+    style?: StyleProp<ViewStyle>;
+    /** Style applied to the active indicator of every variant (pill, line, bubble or expanded pill). */
+    indicatorStyle?: StyleProp<ViewStyle>;
+    labelStyle?: StyleProp<TextStyle>;
+    testID?: string;
+}
+declare const BottomNavigation: React.ForwardRefExoticComponent<BottomNavigationProps & React.RefAttributes<RNView>>;
+export { BottomNavigation };
+export default BottomNavigation;
+//# sourceMappingURL=BottomNavigation.d.ts.map

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

@@ -0,0 +1,3 @@
+export type { BottomNavigationCenterAction, BottomNavigationElevation, BottomNavigationIndicatorPosition, BottomNavigationIndicatorRadius, BottomNavigationProps, BottomNavigationRadius, BottomNavigationVariant, TabBadge, TabConfig, TabIcon, TabIconProps } from './BottomNavigation.js';
+export { BottomNavigation, default } from './BottomNavigation.js';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,120 @@
+/**
+ * BottomSheet — Reanimated 3 + Gesture Handler 2 implementation.
+ *
+ * A polished, theme-aware bottom sheet with multi-snap-point support,
+ * UI-thread driven pan gestures, and native-driver spring animations.
+ *
+ * USAGE:
+ *
+ * const ref = useRef<BottomSheetRef>(null);
+ * <BottomSheet ref={ref} snapPoints={[200, '50%', '90%']}>
+ *   <YourContent />
+ * </BottomSheet>
+ *
+ * ref.current?.expand();   // open at first snap point (or `index` prop)
+ * ref.current?.expand(2);  // open at specific index
+ * ref.current?.collapse(); // animate to smallest snap point
+ * ref.current?.close();    // dismiss
+ */
+import React from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+export type SnapPoint = number | `${number}%`;
+export type KeyboardBehavior = 'none' | 'shift';
+export type BottomSheetMode = 'modal' | 'inline';
+export interface BottomSheetProps {
+    snapPoints: SnapPoint[];
+    index?: number;
+    onChange?: (index: number) => void;
+    onAnimate?: (from: number, to: number) => void;
+    enablePanDownToClose?: boolean;
+    enableBackdropPress?: boolean;
+    /**
+     * Wrap `children` in a vertical ScrollView sized to the space between header
+     * and footer. Off by default; a plain View then holds the content. The sheet
+     * itself is only ever dragged from its handle, so a drag on the content never
+     * moves or closes the sheet, whichever value this has.
+     */
+    scrollable?: boolean;
+    /**
+     * @deprecated Backdrop opacity is now controlled by the theme token
+     * `colors.background.overlay` (alpha baked into the rgba value). Animated
+     * opacity on the backdrop was unreliable under Fabric view-flattening, so
+     * the scrim is now a static plain View. To tune dim level, override
+     * `theme.colors.background.overlay` in your theme bridge.
+     */
+    backdropOpacity?: number;
+    /**
+     * How the sheet reacts to the soft keyboard.
+     * - `'shift'` (default): the sheet rides up with the keyboard and its body
+     *   is sized to the space between the sheet's top (never above the safe
+     *   area) and the keyboard's top edge, so content scrolls inside that space
+     *   and the footer pins above the keyboard. Nothing sits behind the keyboard.
+     * - `'none'`: the sheet stays put; the keyboard may cover content.
+     */
+    keyboardBehavior?: KeyboardBehavior;
+    /**
+     * How the sheet is mounted in the view tree.
+     * - `'modal'` (default): rendered inside a native `<Modal>` so the backdrop
+     *   covers the entire screen (status bar, headers, tab bars) — the standard
+     *   bottom-sheet UX.
+     * - `'inline'`: rendered as an `absoluteFill` overlay inside the parent
+     *   component. Useful when embedding a sheet within a bounded area.
+     */
+    mode?: BottomSheetMode;
+    handleIndicatorStyle?: StyleProp<ViewStyle>;
+    containerStyle?: StyleProp<ViewStyle>;
+    /**
+     * Sticky region rendered between the drag handle and the scrollable content.
+     * Does not scroll with `children`. Can call `useBottomSheet()` to read sheet
+     * state.
+     */
+    header?: React.ReactNode;
+    /**
+     * Sticky region pinned to the bottom of the sheet, above the safe-area
+     * inset. Does not scroll with `children`, and rides up with the keyboard
+     * when `keyboardBehavior='shift'` (no extra wiring needed — the whole sheet
+     * shifts). Typical use: action button rows.
+     */
+    footer?: React.ReactNode;
+    /** Style applied to the header region wrapper. */
+    headerStyle?: StyleProp<ViewStyle>;
+    /** Style applied to the footer region wrapper. */
+    footerStyle?: StyleProp<ViewStyle>;
+    children?: React.ReactNode;
+    accessibilityLabel?: string;
+    accessibilityViewIsModal?: boolean;
+    testID?: string;
+}
+export interface BottomSheetRef {
+    expand: (index?: number) => void;
+    collapse: () => void;
+    close: () => void;
+}
+/**
+ * State + actions exposed to anything rendered inside a `<BottomSheet>` —
+ * including the `header` and `footer` slots. Read via `useBottomSheet()`.
+ *
+ * `snapIndex` is the JS-thread mirror of the current snap point. -1 means the
+ * sheet is closed (mid-close-animation included). Use it to drive footer
+ * button enable state, conditional headers, etc. If you need per-frame
+ * progress (e.g. fade a header in as the sheet expands), reach for the
+ * animated value via a future enhancement — not exposed today to keep the
+ * surface minimal.
+ */
+export interface BottomSheetContextValue {
+    snapIndex: number;
+    snapPoints: number[];
+    expand: (index?: number) => void;
+    collapse: () => void;
+    close: () => void;
+}
+/**
+ * Access the enclosing `<BottomSheet>`'s state and imperative actions.
+ * Must be called from a component rendered inside a `<BottomSheet>` (as
+ * `children`, `header`, or `footer`).
+ */
+export declare const useBottomSheet: () => BottomSheetContextValue;
+declare const BottomSheet: React.ForwardRefExoticComponent<BottomSheetProps & React.RefAttributes<BottomSheetRef>>;
+export { BottomSheet };
+export default BottomSheet;
+//# sourceMappingURL=BottomSheet.d.ts.map

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

@@ -0,0 +1,3 @@
+export type { BottomSheetContextValue, BottomSheetProps, BottomSheetRef, SnapPoint } from './BottomSheet.js';
+export { BottomSheet, default, useBottomSheet } from './BottomSheet.js';
+//# sourceMappingURL=index.d.ts.map