@nice2dev/ui-mobile 1.0.10

package/dist/index.d.ts

@@ -0,0 +1,3430 @@
+import { ButtonHTMLAttributes } from 'react';
+import { CSSProperties } from 'react';
+import { default as default_2 } from 'react';
+import { HTMLAttributes } from 'react';
+import { JSX as JSX_2 } from 'react/jsx-runtime';
+import { PointerEvent as PointerEvent_2 } from 'react';
+import { ReactNode } from 'react';
+
+/**
+ * Action sheet preset – list of actions
+ */
+export declare interface ActionSheetAction {
+    id: string;
+    label: string;
+    icon?: ReactNode;
+    destructive?: boolean;
+    disabled?: boolean;
+    onClick?: () => void;
+}
+
+/**
+ * Badge variant
+ */
+export declare type BadgeVariant = 'dot' | 'count' | 'text';
+
+/**
+ * Breakpoint definition
+ */
+export declare interface Breakpoint {
+    name: BreakpointName;
+    minWidth: number;
+    maxWidth: number | null;
+}
+
+/**
+ * Context value
+ */
+export declare type BreakpointContextValue = UseBreakpointReturn;
+
+/**
+ * Breakpoint name
+ */
+export declare type BreakpointName = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+
+/**
+ * Breakpoint values configuration
+ */
+export declare interface BreakpointValues {
+    xs: number;
+    sm: number;
+    md: number;
+    lg: number;
+    xl: number;
+    '2xl': number;
+}
+
+/**
+ * Calendar event
+ */
+export declare interface CalendarEvent {
+    id: string;
+    title: string;
+    date: Date;
+    color?: string;
+    allDay?: boolean;
+}
+
+/**
+ * Calendar view mode
+ */
+export declare type CalendarView = 'day' | 'month' | 'year';
+
+/**
+ * Cancel any ongoing vibration
+ */
+export declare function cancelVibration(): void;
+
+/**
+ * Header collapse behavior
+ */
+export declare type CollapseMode = 'scroll' | 'pin' | 'enterAlways' | 'exitUntilCollapsed';
+
+/**
+ * Color format
+ */
+export declare type ColorFormat = 'hex' | 'rgb' | 'hsl';
+
+export declare const colorUtils: {
+    hslToRgb: typeof hslToRgb;
+    rgbToHsl: typeof rgbToHsl;
+    hexToRgb: typeof hexToRgb;
+    rgbToHex: typeof rgbToHex;
+    hexToHsl: typeof hexToHsl;
+    hslToHex: typeof hslToHex;
+    formatColor: typeof formatColor;
+};
+
+/**
+ * Create a pattern builder
+ */
+export declare function createHapticPattern(): HapticPatternBuilder;
+
+/**
+ * Generate CSS media query string
+ */
+export declare function createMediaQuery(breakpoint: BreakpointName, type?: 'min' | 'max' | 'only', breakpoints?: BreakpointValues): string;
+
+export declare interface CustomLayout {
+    rows: KeyboardRow[];
+    name?: string;
+}
+
+/**
+ * Date range
+ */
+export declare interface DateRange {
+    start: Date | null;
+    end: Date | null;
+}
+
+/**
+ * Day cell data
+ */
+export declare interface DayCell {
+    date: Date;
+    dayOfMonth: number;
+    isCurrentMonth: boolean;
+    isToday: boolean;
+    isSelected: boolean;
+    isInRange: boolean;
+    isRangeStart: boolean;
+    isRangeEnd: boolean;
+    isDisabled: boolean;
+    isWeekend: boolean;
+    events?: CalendarEvent[];
+}
+
+/**
+ * Default breakpoint values (Tailwind-like)
+ */
+export declare const DEFAULT_BREAKPOINTS: BreakpointValues;
+
+/**
+ * Device type based on screen size
+ */
+export declare type DeviceType = 'mobile' | 'tablet' | 'desktop';
+
+/**
+ * Modal dismiss trigger
+ */
+export declare type DismissTrigger = 'drag' | 'overlay' | 'close' | 'escape';
+
+/** Lottie-style animated dots indicator */
+export declare const DotsIndicator: default_2.FC<PullToRefreshIndicatorProps>;
+
+export declare const DrawerIcons: {
+    home: JSX_2.Element;
+    settings: JSX_2.Element;
+    user: JSX_2.Element;
+    search: JSX_2.Element;
+    inbox: JSX_2.Element;
+    heart: JSX_2.Element;
+    folder: JSX_2.Element;
+    help: JSX_2.Element;
+    logout: JSX_2.Element;
+};
+
+export declare interface DrawerNavItem {
+    id: string;
+    label: string;
+    icon?: ReactNode;
+    badge?: string | number;
+    badgeColor?: string;
+    href?: string;
+    onClick?: () => void;
+    disabled?: boolean;
+    children?: DrawerNavItem[];
+    divider?: boolean;
+    section?: string;
+}
+
+export declare type DrawerPosition = 'left' | 'right' | 'top' | 'bottom';
+
+export declare type DrawerVariant = 'overlay' | 'push' | 'persistent';
+
+/**
+ * Drawing tool types
+ */
+export declare type DrawingTool = 'pen' | 'brush' | 'marker' | 'eraser' | 'fill' | 'line' | 'rectangle' | 'circle';
+
+/** Custom emoji indicator */
+export declare const EmojiIndicator: default_2.FC<PullToRefreshIndicatorProps>;
+
+declare function formatColor(hsl: HSLColor, format: ColorFormat): string;
+
+/**
+ * Generate number items
+ */
+export declare function generateNumberItems(start: number, end: number, step?: number, pad?: number): PickerItem<number>[];
+
+/**
+ * Gesture handlers
+ */
+export declare interface GestureHandlers {
+    onPinchStart?: () => void;
+    onPinch?: (event: PinchEvent) => void;
+    onPinchEnd?: (event: PinchEvent) => void;
+    onRotateStart?: () => void;
+    onRotate?: (event: RotateEvent) => void;
+    onRotateEnd?: (event: RotateEvent) => void;
+    onPanStart?: () => void;
+    onPan?: (event: PanEvent) => void;
+    onPanEnd?: (event: PanEvent) => void;
+    onSwipe?: (event: SwipeEvent) => void;
+    onTap?: (event: TapEvent) => void;
+    onDoubleTap?: (event: TapEvent) => void;
+    onLongPress?: (event: LongPressEvent) => void;
+}
+
+/**
+ * Context value
+ */
+export declare interface GesturesContextValue {
+    state: GestureState;
+    reset: () => void;
+}
+
+/**
+ * Gesture state
+ */
+export declare interface GestureState {
+    /** Current scale (1 = normal) */
+    scale: number;
+    /** Current rotation in degrees */
+    rotation: number;
+    /** Current translation */
+    translation: Point;
+    /** Velocity of pan gesture */
+    velocity: Point;
+    /** Center point of gesture */
+    center: Point;
+    /** Whether gesture is active */
+    isActive: boolean;
+}
+
+/**
+ * Get current breakpoint (client-side only)
+ */
+export declare function getCurrentBreakpoint(breakpoints?: BreakpointValues): BreakpointName | null;
+
+/**
+ * Predefined haptic patterns
+ */
+export declare const HAPTIC_PATTERNS: Record<HapticsHapticFeedbackType, VibrationPattern>;
+
+/**
+ * Trigger haptic feedback type
+ */
+export declare function hapticFeedback(type: HapticsHapticFeedbackType): boolean;
+
+/**
+ * Haptic feedback intensity
+ */
+export declare type HapticIntensity = 'light' | 'medium' | 'heavy';
+
+/**
+ * Haptic pattern definition
+ */
+export declare interface HapticPattern {
+    /** Pattern name */
+    name: string;
+    /** Vibration durations in ms */
+    pattern: number[];
+    /** Description */
+    description?: string;
+}
+
+/**
+ * Build custom vibration pattern
+ */
+export declare class HapticPatternBuilder {
+    private pattern;
+    /**
+     * Add vibration pulse
+     */
+    vibrate(duration: number): this;
+    /**
+     * Add pause
+     */
+    pause(duration: number): this;
+    /**
+     * Add multiple pulses
+     */
+    pulses(count: number, vibrateMs: number, pauseMs: number): this;
+    /**
+     * Add ramp up effect
+     */
+    rampUp(steps: number, maxDuration: number): this;
+    /**
+     * Add ramp down effect
+     */
+    rampDown(steps: number, maxDuration: number): this;
+    /**
+     * Build and return pattern
+     */
+    build(): number[];
+    /**
+     * Execute pattern immediately
+     */
+    execute(): boolean;
+}
+
+/**
+ * Context value
+ */
+export declare type HapticsContextValue = UseHapticsReturn;
+
+/**
+ * Predefined haptic feedback type
+ */
+export declare type HapticsHapticFeedbackType = 'selection' | 'impact-light' | 'impact-medium' | 'impact-heavy' | 'notification-success' | 'notification-warning' | 'notification-error' | 'button-press' | 'toggle-on' | 'toggle-off' | 'swipe' | 'pull-to-refresh' | 'keyboard';
+
+/**
+ * Action button config
+ */
+export declare interface HeaderAction {
+    id: string;
+    icon: ReactNode;
+    label: string;
+    onClick?: () => void;
+    badge?: number | boolean;
+    disabled?: boolean;
+}
+
+/**
+ * Preset header icons
+ */
+export declare const HeaderIcons: {
+    back: JSX_2.Element;
+    menu: JSX_2.Element;
+    search: JSX_2.Element;
+    more: JSX_2.Element;
+};
+
+/**
+ * Header variant
+ */
+export declare type HeaderVariant = 'default' | 'transparent' | 'blur' | 'solid';
+
+/**
+ * Hero header with background image
+ */
+export declare const HeroHeader: default_2.ForwardRefExoticComponent<Omit<NiceMobileHeaderProps, "mode" | "parallax"> & default_2.RefAttributes<HTMLElement>>;
+
+declare function hexToHsl(hex: string): HSLColor;
+
+declare function hexToRgb(hex: string): RGBColor;
+
+/**
+ * HSL color
+ */
+declare interface HSLColor {
+    h: number;
+    s: number;
+    l: number;
+}
+
+declare function hslToHex(h: number, s: number, l: number): string;
+
+declare function hslToRgb(h: number, s: number, l: number): RGBColor;
+
+export declare interface ImageGalleryItem {
+    /** Full image URL */
+    src: string;
+    /** Thumbnail URL (optional, defaults to src) */
+    thumbnail?: string;
+    /** Alt text for accessibility */
+    alt?: string;
+    /** Image title/caption */
+    title?: string;
+    /** Optional description */
+    description?: string;
+    /** Loading placeholder (blur hash or color) */
+    placeholder?: string;
+}
+
+declare interface InfiniteScrollContextValue {
+    status: InfiniteScrollStatus;
+    loadMore: () => Promise<void>;
+    hasMore: boolean;
+    itemCount: number;
+    scrollToTop: () => void;
+    scrollToBottom: () => void;
+}
+
+export declare interface InfiniteScrollPage<T = unknown> {
+    items: T[];
+    nextCursor?: string | number;
+    hasMore: boolean;
+}
+
+export declare type InfiniteScrollStatus = 'idle' | 'loading' | 'success' | 'error' | 'end';
+
+/**
+ * iOS-style navigation bar with large title
+ */
+export declare const IOSHeader: default_2.ForwardRefExoticComponent<Omit<NiceMobileHeaderProps, "variant" | "mode"> & default_2.RefAttributes<HTMLElement>>;
+
+/** iOS-style activity indicator */
+export declare const IOSIndicator: default_2.FC<PullToRefreshIndicatorProps>;
+
+/**
+ * Check if running on mobile device
+ */
+export declare function isMobileDevice(): boolean;
+
+/**
+ * Check if running on touch device
+ */
+export declare function isTouch(): boolean;
+
+/**
+ * Check if Vibration API is supported
+ */
+export declare function isVibrationSupported(): boolean;
+
+/** Supported language codes */
+export declare type KeyboardLanguage = 'en' | 'pl' | 'de' | 'fr' | 'es' | 'it' | 'pt' | 'ru' | 'uk' | 'cs' | 'tr' | 'nl' | 'sv' | 'no' | 'da' | 'fi' | 'ro' | 'hr' | 'el' | 'hu' | 'sk' | 'bg' | 'sr' | 'ja' | 'ko' | 'zh' | 'ar' | 'he';
+
+export declare type KeyboardLayout = 'qwerty' | 'numeric' | 'numpad' | 'phone' | 'pin' | 'custom';
+
+/** Display mode — from minimal (numbers-only) to full (QWERTY + number row + symbols + fn row) */
+export declare type KeyboardMode = 'minimal' | 'compact' | 'standard' | 'full';
+
+declare type KeyboardRow = KeyDefinition[];
+
+export declare type KeyboardTheme = 'light' | 'dark' | 'system';
+
+export declare interface KeyDefinition {
+    value: string;
+    label?: string;
+    width?: number;
+    type?: 'char' | 'space' | 'backspace' | 'enter' | 'shift' | 'special' | 'fn' | 'tab' | 'caps' | 'lang';
+    icon?: default_2.ReactNode;
+}
+
+/**
+ * Thumb label display mode
+ */
+declare type LabelDisplay = 'auto' | 'on' | 'off';
+
+/** Language layout definition */
+export declare interface LanguageLayout {
+    code: KeyboardLanguage;
+    name: string;
+    nativeName: string;
+    /** Main letter rows (3 rows for QWERTY-like) */
+    rows: [string[], string[], string[]];
+    /** Extra chars available via long-press or special layer */
+    accents?: Record<string, string[]>;
+}
+
+/**
+ * Line cap style
+ */
+export declare type LineCap = 'round' | 'square' | 'butt';
+
+/** Minimal line indicator */
+export declare const LineIndicator: default_2.FC<PullToRefreshIndicatorProps>;
+
+/**
+ * Long press event
+ */
+export declare interface LongPressEvent {
+    position: Point;
+    duration: number;
+    target: EventTarget | null;
+}
+
+/**
+ * Material Design app bar
+ */
+export declare const MaterialHeader: default_2.ForwardRefExoticComponent<Omit<NiceMobileHeaderProps, "variant" | "mode"> & default_2.RefAttributes<HTMLElement>>;
+
+/** Material Design circular progress */
+export declare const MaterialIndicator: default_2.FC<PullToRefreshIndicatorProps>;
+
+/**
+ * Menu position
+ */
+export declare interface MenuPosition {
+    x: number;
+    y: number;
+}
+
+/**
+ * Context value
+ */
+export declare interface MobileCalendarContextValue {
+    viewDate: Date;
+    selectedDate: Date | null;
+    selectedDates: Date[];
+    selectedRange: DateRange;
+    selectionMode: SelectionMode_2;
+    view: CalendarView;
+    selectDate: (date: Date) => void;
+    setView: (view: CalendarView) => void;
+    goToDate: (date: Date) => void;
+}
+
+export declare interface MobileDrawerContextValue {
+    isOpen: boolean;
+    position: DrawerPosition;
+    close: () => void;
+    activeNavId?: string;
+    setActiveNavId: (id: string) => void;
+}
+
+/**
+ * Context value
+ */
+export declare interface MobileHeaderContextValue {
+    progress: number;
+    isCollapsed: boolean;
+    height: number;
+    expandedHeight: number;
+    collapsedHeight: number;
+}
+
+/**
+ * Modal context value
+ */
+export declare interface MobileModalContextValue {
+    isOpen: boolean;
+    snapPoints: ModalSnapPoint[];
+    currentSnapIndex: number;
+    setSnapIndex: (index: number) => void;
+    close: (trigger?: DismissTrigger) => void;
+}
+
+/**
+ * Context value
+ */
+export declare interface MobilePickerContextValue {
+    visibleItems: number;
+    itemHeight: number;
+    isScrolling: boolean;
+}
+
+/**
+ * Tab context value
+ */
+export declare interface MobileTabsContextValue {
+    activeTab: string;
+    setActiveTab: (id: string) => void;
+    tabs: TabItem[];
+}
+
+/**
+ * Modal snap point – where the modal can "land"
+ */
+export declare type ModalSnapPoint = number | 'content' | 'full';
+
+export declare const NiceBottomSheet: default_2.ForwardRefExoticComponent<NiceBottomSheetProps & default_2.RefAttributes<NiceBottomSheetRef>>;
+
+export declare interface NiceBottomSheetProps {
+    /** Sheet content */
+    children: ReactNode;
+    /** Whether the sheet is open */
+    open: boolean;
+    /** Called when the sheet should close */
+    onClose: () => void;
+    /** Called when snap point changes */
+    onSnapChange?: (snapIndex: number, snapValue: number) => void;
+    /** Snap points as percentages (0-100) or 'content'/'full' */
+    snapPoints?: SnapPoint[];
+    /** Initial snap point index (default: 0) */
+    initialSnap?: number;
+    /** Header content (fixed at top) */
+    header?: ReactNode;
+    /** Footer content (fixed at bottom) */
+    footer?: ReactNode;
+    /** Show drag handle indicator */
+    showHandle?: boolean;
+    /** Show backdrop overlay */
+    showBackdrop?: boolean;
+    /** Close on backdrop click */
+    closeOnBackdrop?: boolean;
+    /** Close on escape key */
+    closeOnEscape?: boolean;
+    /** Allow dismiss by dragging down past lowest snap */
+    dismissible?: boolean;
+    /** Velocity threshold to trigger snap (px/ms, default: 0.5) */
+    velocityThreshold?: number;
+    /** Enable haptic feedback */
+    hapticFeedback?: boolean;
+    /** Custom handle color */
+    handleColor?: string;
+    /** Border radius for top corners */
+    borderRadius?: number;
+    /** Z-index for the sheet */
+    zIndex?: number;
+    /** Custom class name */
+    className?: string;
+    /** Custom styles */
+    style?: CSSProperties;
+    /** Accessibility label */
+    ariaLabel?: string;
+}
+
+export declare interface NiceBottomSheetRef {
+    /** Snap to a specific point */
+    snapTo: (index: number) => void;
+    /** Close the sheet */
+    close: () => void;
+    /** Get current snap index */
+    getCurrentSnap: () => number;
+}
+
+/**
+ * Breakpoint provider for app-wide responsive access
+ *
+ * @example
+ * ```tsx
+ * <NiceBreakpointProvider breakpoints={{ md: 800, lg: 1100 }}>
+ *   <App />
+ * </NiceBreakpointProvider>
+ * ```
+ */
+export declare function NiceBreakpointProvider({ breakpoints, debounceDelay, children, }: NiceBreakpointProviderProps): JSX.Element;
+
+/**
+ * Provider props
+ */
+export declare interface NiceBreakpointProviderProps {
+    /** Custom breakpoint values */
+    breakpoints?: Partial<BreakpointValues>;
+    /** Debounce delay */
+    debounceDelay?: number;
+    /** Children */
+    children: ReactNode;
+}
+
+export declare const NiceCalculatorKeyboard: default_2.ForwardRefExoticComponent<Omit<NiceTouchKeyboardProps, "layout"> & default_2.RefAttributes<HTMLDivElement>>;
+
+export declare const NiceConfirmSheet: default_2.ForwardRefExoticComponent<NiceConfirmSheetProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Confirmation sheet preset
+ */
+export declare interface NiceConfirmSheetProps extends Omit<NiceMobileModalProps, 'children' | 'footer'> {
+    message: ReactNode;
+    confirmLabel?: string;
+    cancelLabel?: string;
+    confirmDestructive?: boolean;
+    onConfirm?: () => void;
+    onCancel?: () => void;
+}
+
+/**
+ * Date range picker preset
+ */
+export declare const NiceDateRangePicker: default_2.ForwardRefExoticComponent<Omit<NiceMobileCalendarProps, "selectionMode"> & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Toolbar for drawing canvas
+ */
+export declare const NiceDrawingToolbar: default_2.ForwardRefExoticComponent<NiceDrawingToolbarProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Drawing toolbar props
+ */
+export declare interface NiceDrawingToolbarProps extends HTMLAttributes<HTMLDivElement> {
+    /** Current tool */
+    tool: DrawingTool;
+    /** Tool change handler */
+    onToolChange: (tool: DrawingTool) => void;
+    /** Current color */
+    color: string;
+    /** Color change handler */
+    onColorChange: (color: string) => void;
+    /** Current stroke width */
+    strokeWidth: number;
+    /** Stroke width change handler */
+    onStrokeWidthChange: (width: number) => void;
+    /** Undo handler */
+    onUndo?: () => void;
+    /** Redo handler */
+    onRedo?: () => void;
+    /** Clear handler */
+    onClear?: () => void;
+    /** Can undo */
+    canUndo?: boolean;
+    /** Can redo */
+    canRedo?: boolean;
+    /** Preset colors */
+    colors?: string[];
+}
+
+/**
+ * Floating action button (FAB)
+ */
+export declare const NiceFAB: default_2.ForwardRefExoticComponent<Omit<NiceTouchButtonProps, "size" | "shape"> & {
+    position?: "bottom-right" | "bottom-left" | "bottom-center" | "top-right" | "top-left";
+    mini?: boolean;
+} & default_2.RefAttributes<HTMLButtonElement>>;
+
+/**
+ * Multi-touch gesture container
+ *
+ * @example
+ * ```tsx
+ * // Basic pinch to zoom
+ * <NiceGestures
+ *   enablePinch
+ *   applyTransform
+ *   onPinch={(e) => console.log('Scale:', e.scale)}
+ * >
+ *   <img src="photo.jpg" alt="Zoomable" />
+ * </NiceGestures>
+ *
+ * // Swipe detection
+ * <NiceGestures
+ *   enableSwipe
+ *   onSwipe={(e) => {
+ *     if (e.direction === 'left') nextSlide();
+ *     if (e.direction === 'right') prevSlide();
+ *   }}
+ * >
+ *   <SlideContent />
+ * </NiceGestures>
+ *
+ * // All gestures
+ * <NiceGestures
+ *   enablePinch
+ *   enableRotation
+ *   enablePan
+ *   enableSwipe
+ *   applyTransform
+ *   onPinch={(e) => console.log('Pinch', e.scale)}
+ *   onRotate={(e) => console.log('Rotate', e.rotation)}
+ *   onPan={(e) => console.log('Pan', e.translation)}
+ *   onSwipe={(e) => console.log('Swipe', e.direction)}
+ *   onDoubleTap={() => reset()}
+ * >
+ *   <TransformableContent />
+ * </NiceGestures>
+ * ```
+ */
+export declare const NiceGestures: default_2.ForwardRefExoticComponent<NiceGesturesProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Main props
+ */
+export declare interface NiceGesturesProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onTap'>, GestureHandlers {
+    /** Enable pinch to zoom */
+    enablePinch?: boolean;
+    /** Enable rotation */
+    enableRotation?: boolean;
+    /** Enable pan/drag */
+    enablePan?: boolean;
+    /** Enable swipe detection */
+    enableSwipe?: boolean;
+    /** Enable tap detection */
+    enableTap?: boolean;
+    /** Enable double tap */
+    enableDoubleTap?: boolean;
+    /** Enable long press */
+    enableLongPress?: boolean;
+    /** Minimum scale */
+    minScale?: number;
+    /** Maximum scale */
+    maxScale?: number;
+    /** Apply transform to children */
+    applyTransform?: boolean;
+    /** Initial scale */
+    initialScale?: number;
+    /** Controlled scale */
+    scale?: number;
+    /** Initial rotation */
+    initialRotation?: number;
+    /** Controlled rotation */
+    rotation?: number;
+    /** Initial translation */
+    initialTranslation?: Point;
+    /** Controlled translation */
+    translation?: Point;
+    /** Callback when transform changes */
+    onTransformChange?: (state: GestureState) => void;
+    /** Children */
+    children?: ReactNode;
+}
+
+/**
+ * Haptics provider for app-wide vibration feedback
+ *
+ * @example
+ * ```tsx
+ * <NiceHapticsProvider enabled intensity="medium">
+ *   <App />
+ * </NiceHapticsProvider>
+ * ```
+ */
+export declare function NiceHapticsProvider({ enabled, intensity, respectReducedMotion, customPatterns, children, }: NiceHapticsProviderProps): JSX.Element;
+
+/**
+ * Provider props
+ */
+export declare interface NiceHapticsProviderProps {
+    /** Enable haptics globally */
+    enabled?: boolean;
+    /** Global intensity */
+    intensity?: HapticIntensity;
+    /** Disable haptics for reduced motion */
+    respectReducedMotion?: boolean;
+    /** Custom patterns */
+    customPatterns?: Record<string, VibrationPattern>;
+    /** Children */
+    children: ReactNode;
+}
+
+/**
+ * Conditionally hide content based on breakpoint
+ *
+ * @example
+ * ```tsx
+ * <NiceHide below="md">
+ *   <DesktopFeature />
+ * </NiceHide>
+ *
+ * <NiceHide device="desktop">
+ *   <MobileOnlyContent />
+ * </NiceHide>
+ * ```
+ */
+export declare function NiceHide({ on, above, below, device, orientation, children, }: NiceHideProps): ReactNode;
+
+/**
+ * Hide props
+ */
+export declare type NiceHideProps = Omit<NiceShowProps, 'fallback'>;
+
+export declare const NiceImageGallery: default_2.ForwardRefExoticComponent<NiceImageGalleryProps & default_2.RefAttributes<NiceImageGalleryRef>>;
+
+export declare interface NiceImageGalleryProps {
+    /** Gallery images */
+    items: ImageGalleryItem[];
+    /** Currently selected image index */
+    selectedIndex?: number;
+    /** Called when image changes */
+    onIndexChange?: (index: number, item: ImageGalleryItem) => void;
+    /** Called when gallery closes */
+    onClose?: () => void;
+    /** Show close button */
+    showClose?: boolean;
+    /** Show image counter */
+    showCounter?: boolean;
+    /** Show caption/title */
+    showCaption?: boolean;
+    /** Show thumbnail strip */
+    showThumbnails?: boolean;
+    /** Enable pinch-to-zoom */
+    enablePinchZoom?: boolean;
+    /** Enable double-tap zoom */
+    enableDoubleTapZoom?: boolean;
+    /** Enable swipe navigation */
+    enableSwipe?: boolean;
+    /** Enable keyboard navigation */
+    enableKeyboard?: boolean;
+    /** Min zoom level */
+    minZoom?: number;
+    /** Max zoom level */
+    maxZoom?: number;
+    /** Double-tap zoom level */
+    doubleTapZoom?: number;
+    /** Swipe threshold (px) */
+    swipeThreshold?: number;
+    /** Enable infinite loop */
+    loop?: boolean;
+    /** Enable haptic feedback */
+    hapticFeedback?: boolean;
+    /** Background color/opacity */
+    backgroundColor?: string;
+    /** Z-index */
+    zIndex?: number;
+    /** Custom class name */
+    className?: string;
+    /** Custom styles */
+    style?: CSSProperties;
+}
+
+export declare interface NiceImageGalleryRef {
+    goTo: (index: number) => void;
+    goNext: () => void;
+    goPrev: () => void;
+    zoomIn: () => void;
+    zoomOut: () => void;
+    resetZoom: () => void;
+    close: () => void;
+}
+
+export declare const NiceInfiniteScroll: <T>(props: NiceInfiniteScrollProps<T> & {
+    ref?: default_2.ForwardedRef<HTMLDivElement>;
+}) => default_2.ReactElement;
+
+export declare interface NiceInfiniteScrollProps<T = unknown> {
+    /** Items to display */
+    items: T[];
+    /** Render function for each item */
+    renderItem: (item: T, index: number) => ReactNode;
+    /** Function to fetch more items */
+    onLoadMore: () => Promise<void>;
+    /** Whether there are more items to load */
+    hasMore: boolean;
+    /** Loading state */
+    isLoading?: boolean;
+    /** Error message */
+    error?: string | null;
+    /** Distance from bottom to trigger load (px) */
+    threshold?: number;
+    /** Custom loading indicator */
+    loadingIndicator?: ReactNode;
+    /** Custom end-of-list indicator */
+    endIndicator?: ReactNode;
+    /** Custom error indicator */
+    errorIndicator?: ReactNode;
+    /** Called when retry is clicked */
+    onRetry?: () => void;
+    /** Enable pull-to-refresh at top */
+    pullToRefresh?: boolean;
+    /** Pull-to-refresh handler */
+    onRefresh?: () => Promise<void>;
+    /** Scroll direction */
+    direction?: 'vertical' | 'horizontal';
+    /** Reverse order (for chat-like layouts) */
+    reverse?: boolean;
+    /** Initial scroll position */
+    initialScrollPosition?: 'top' | 'bottom';
+    /** Enable keyboard navigation */
+    keyboardNav?: boolean;
+    /** Unique key extractor for items */
+    keyExtractor?: (item: T, index: number) => string;
+    /** Empty state content */
+    emptyContent?: ReactNode;
+    /** Header content (sticky) */
+    header?: ReactNode;
+    /** Footer content (sticky) */
+    footer?: ReactNode;
+    /** Gap between items */
+    gap?: number;
+    /** Custom class name */
+    className?: string;
+    /** Custom styles */
+    style?: CSSProperties;
+    /** ARIA label */
+    ariaLabel?: string;
+}
+
+export declare const NiceMobileActionSheet: default_2.ForwardRefExoticComponent<NiceMobileActionSheetProps & default_2.RefAttributes<HTMLDivElement>>;
+
+export declare interface NiceMobileActionSheetProps extends Omit<NiceMobileModalProps, 'children'> {
+    actions: ActionSheetAction[];
+    cancelLabel?: string;
+}
+
+/**
+ * Touch-friendly calendar with swipe navigation
+ *
+ * @example
+ * ```tsx
+ * // Single date selection
+ * <NiceMobileCalendar
+ *   selectedDate={selectedDate}
+ *   onChange={(date) => setSelectedDate(date as Date)}
+ * />
+ *
+ * // Date range selection
+ * <NiceMobileCalendar
+ *   selectionMode="range"
+ *   selectedRange={range}
+ *   onChange={(range) => setRange(range as DateRange)}
+ * />
+ *
+ * // With events
+ * <NiceMobileCalendar
+ *   events={[
+ *     { id: '1', title: 'Meeting', date: new Date(), color: 'var(--color-accent, #6366f1)' }
+ *   ]}
+ *   renderDay={(cell) => (
+ *     <CustomDayCell cell={cell} />
+ *   )}
+ * />
+ * ```
+ */
+export declare const NiceMobileCalendar: default_2.ForwardRefExoticComponent<NiceMobileCalendarProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Main props
+ */
+export declare interface NiceMobileCalendarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    /** Initial view date */
+    defaultDate?: Date;
+    /** Controlled view date */
+    viewDate?: Date;
+    /** Controlled selected date (single mode) */
+    selectedDate?: Date;
+    /** Controlled selected dates (multiple mode) */
+    selectedDates?: Date[];
+    /** Controlled selected range (range mode) */
+    selectedRange?: DateRange;
+    /** Selection mode */
+    selectionMode?: SelectionMode_2;
+    /** Minimum selectable date */
+    minDate?: Date;
+    /** Maximum selectable date */
+    maxDate?: Date;
+    /** Specific disabled dates */
+    disabledDates?: Date[];
+    /** Disable weekends */
+    disableWeekends?: boolean;
+    /** Calendar events */
+    events?: CalendarEvent[];
+    /** First day of week (0=Sun, 1=Mon) */
+    weekStartDay?: WeekStartDay;
+    /** Locale for formatting */
+    locale?: string;
+    /** Show week numbers */
+    showWeekNumbers?: boolean;
+    /** Show adjacent month days */
+    showAdjacentMonths?: boolean;
+    /** Enable swipe navigation */
+    enableSwipe?: boolean;
+    /** Callback when selection changes */
+    onChange?: (value: Date | Date[] | DateRange) => void;
+    /** Callback when view date changes */
+    onViewChange?: (date: Date, view: CalendarView) => void;
+    /** Callback when month changes */
+    onMonthChange?: (date: Date) => void;
+    /** Custom day cell renderer */
+    renderDay?: (cell: DayCell) => ReactNode;
+    /** Custom header renderer */
+    renderHeader?: (date: Date, view: CalendarView, actions: {
+        prev: () => void;
+        next: () => void;
+        setView: (v: CalendarView) => void;
+    }) => ReactNode;
+    /** Show today button */
+    showTodayButton?: boolean;
+    /** Today button label */
+    todayLabel?: string;
+    /** Compact mode */
+    compact?: boolean;
+}
+
+export declare const NiceMobileDatePicker: default_2.ForwardRefExoticComponent<NiceMobileDatePickerProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Date picker preset
+ */
+export declare interface NiceMobileDatePickerProps extends Omit<NiceMobilePickerProps, 'columns' | 'value' | 'onChange' | 'defaultValue'> {
+    value?: Date;
+    defaultValue?: Date;
+    onChange?: (value: Date) => void;
+    minYear?: number;
+    maxYear?: number;
+}
+
+/**
+ * Draggable wrapper
+ */
+export declare const NiceMobileDraggable: default_2.ForwardRefExoticComponent<Omit<NiceGesturesProps, "enablePan" | "applyTransform"> & default_2.RefAttributes<HTMLDivElement>>;
+
+export declare const NiceMobileDrawer: default_2.ForwardRefExoticComponent<NiceMobileDrawerProps & default_2.RefAttributes<HTMLDivElement>>;
+
+export declare interface NiceMobileDrawerProps {
+    /** Whether drawer is open */
+    open: boolean;
+    /** Called when drawer should close */
+    onClose: () => void;
+    /** Drawer position */
+    position?: DrawerPosition;
+    /** Drawer variant */
+    variant?: DrawerVariant;
+    /** Width/height of drawer (px or %) */
+    size?: number | string;
+    /** Custom drawer content */
+    children?: ReactNode;
+    /** Navigation items (alternative to children) */
+    navItems?: DrawerNavItem[];
+    /** Header content */
+    header?: ReactNode;
+    /** Footer content */
+    footer?: ReactNode;
+    /** Enable swipe to open from edge */
+    swipeToOpen?: boolean;
+    /** Enable swipe to close */
+    swipeToClose?: boolean;
+    /** Edge swipe detection width (px) */
+    edgeSwipeWidth?: number;
+    /** Velocity threshold to trigger close (px/ms) */
+    velocityThreshold?: number;
+    /** Show overlay backdrop */
+    showOverlay?: boolean;
+    /** Close on overlay click */
+    closeOnOverlayClick?: boolean;
+    /** Close on escape key */
+    closeOnEscape?: boolean;
+    /** Disable body scroll when open */
+    disableBodyScroll?: boolean;
+    /** Custom overlay color */
+    overlayColor?: string;
+    /** Z-index */
+    zIndex?: number;
+    /** Called when nav item is selected */
+    onNavSelect?: (item: DrawerNavItem) => void;
+    /** Active nav item id */
+    activeNavId?: string;
+    /** Custom class name */
+    className?: string;
+    /** Custom styles */
+    style?: CSSProperties;
+    /** ARIA label */
+    ariaLabel?: string;
+}
+
+/**
+ * Collapsing app bar header with scroll effects
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <NiceMobileHeader
+ *   title="Settings"
+ *   leftAction={<button onClick={goBack}>{HeaderIcons.back}</button>}
+ * />
+ *
+ * // With large title (iOS style)
+ * <NiceMobileHeader
+ *   title="Messages"
+ *   largeTitle="Messages"
+ *   expandedHeight={140}
+ *   mode="scroll"
+ * />
+ *
+ * // With background image
+ * <NiceMobileHeader
+ *   title="Profile"
+ *   expandedHeight={280}
+ *   parallax
+ *   background={
+ *     <img src="/cover.jpg" alt="" style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
+ *   }
+ * />
+ *
+ * // Transparent with blur
+ * <NiceMobileHeader
+ *   title="Gallery"
+ *   variant="blur"
+ *   sticky
+ * />
+ * ```
+ */
+export declare const NiceMobileHeader: default_2.ForwardRefExoticComponent<NiceMobileHeaderProps & default_2.RefAttributes<HTMLElement>>;
+
+/**
+ * Main props
+ */
+export declare interface NiceMobileHeaderProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
+    /** Header title */
+    title?: ReactNode;
+    /** Large title (shown when expanded) */
+    largeTitle?: ReactNode;
+    /** Subtitle */
+    subtitle?: ReactNode;
+    /** Left action (usually back button) */
+    leftAction?: ReactNode;
+    /** Right actions */
+    rightActions?: HeaderAction[];
+    /** Background image/content for expanded state */
+    background?: ReactNode;
+    /** Collapse mode */
+    mode?: CollapseMode;
+    /** Visual variant */
+    variant?: HeaderVariant;
+    /** Minimum height when collapsed */
+    collapsedHeight?: number;
+    /** Maximum height when expanded */
+    expandedHeight?: number;
+    /** Enable parallax effect for background */
+    parallax?: boolean;
+    /** Parallax multiplier (0-1) */
+    parallaxSpeed?: number;
+    /** Show shadow when collapsed */
+    showShadow?: boolean;
+    /** Sticky position */
+    sticky?: boolean;
+    /** Z-index */
+    zIndex?: number;
+    /** Custom scroll element */
+    scrollElement?: HTMLElement | null;
+    /** Callback when collapse state changes */
+    onCollapseChange?: (collapsed: boolean, progress: number) => void;
+    /** Safe area padding */
+    safeArea?: boolean;
+    /** Background color */
+    backgroundColor?: string;
+    /** Text color */
+    textColor?: string;
+    /** Border bottom */
+    showBorder?: boolean;
+    /** Custom collapsed content */
+    collapsedContent?: ReactNode;
+    /** Custom expanded content */
+    expandedContent?: ReactNode;
+}
+
+/**
+ * Mobile-first bottom sheet modal with snap points and drag-to-dismiss
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <NiceMobileModal
+ *   open={open}
+ *   onClose={() => setOpen(false)}
+ *   title="Settings"
+ * >
+ *   <p>Modal content goes here</p>
+ * </NiceMobileModal>
+ *
+ * // With snap points
+ * <NiceMobileModal
+ *   open={open}
+ *   onClose={() => setOpen(false)}
+ *   snapPoints={[0.25, 0.5, 'content', 'full']}
+ *   defaultSnapPoint={1}
+ * >
+ *   Content that can be dragged between snap points
+ * </NiceMobileModal>
+ *
+ * // Non-dismissible
+ * <NiceMobileModal
+ *   open={open}
+ *   onClose={() => setOpen(false)}
+ *   preventDismiss
+ *   showClose={false}
+ * >
+ *   You must complete this action
+ *   <button onClick={() => setOpen(false)}>Done</button>
+ * </NiceMobileModal>
+ * ```
+ */
+export declare const NiceMobileModal: default_2.ForwardRefExoticComponent<NiceMobileModalProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Main modal props
+ */
+export declare interface NiceMobileModalProps extends Omit<HTMLAttributes<HTMLDivElement>, 'content' | 'title'> {
+    /** Is the modal open */
+    open: boolean;
+    /** Callback when modal should close */
+    onClose?: (trigger?: DismissTrigger) => void;
+    /** Modal title */
+    title?: ReactNode;
+    /** Modal content */
+    children: ReactNode;
+    /** Footer content */
+    footer?: ReactNode;
+    /** Snap points as heights (0-1 for percentage, >1 for pixels) */
+    snapPoints?: ModalSnapPoint[];
+    /** Initial snap point index */
+    defaultSnapPoint?: number;
+    /** Show drag handle indicator */
+    showHandle?: boolean;
+    /** Show close button */
+    showClose?: boolean;
+    /** Show overlay backdrop */
+    showOverlay?: boolean;
+    /** Can dismiss by dragging down */
+    dismissOnDrag?: boolean;
+    /** Can dismiss by clicking overlay */
+    dismissOnOverlay?: boolean;
+    /** Can dismiss with Escape key */
+    dismissOnEscape?: boolean;
+    /** Block all dismiss methods */
+    preventDismiss?: boolean;
+    /** Callback when snap point changes */
+    onSnapChange?: (index: number, point: ModalSnapPoint) => void;
+    /** Custom overlay className */
+    overlayClassName?: string;
+    /** Custom header className */
+    headerClassName?: string;
+    /** Custom content className */
+    contentClassName?: string;
+    /** Custom footer className */
+    footerClassName?: string;
+    /** Disable body scroll when open */
+    lockScroll?: boolean;
+    /** Border radius for top corners */
+    borderRadius?: number;
+    /** Z-index override */
+    zIndex?: number;
+}
+
+/**
+ * Multi-column wheel picker
+ *
+ * @example
+ * ```tsx
+ * // Simple picker
+ * <NiceMobilePicker
+ *   columns={[
+ *     {
+ *       id: 'fruit',
+ *       items: [
+ *         { value: 'apple', label: 'Apple' },
+ *         { value: 'banana', label: 'Banana' },
+ *         { value: 'orange', label: 'Orange' }
+ *       ]
+ *     }
+ *   ]}
+ *   value={{ fruit: 'apple' }}
+ *   onChange={(value) => console.log(value)}
+ * />
+ *
+ * // Date picker
+ * <NiceMobilePicker
+ *   columns={[
+ *     { id: 'day', items: days, label: 'Day' },
+ *     { id: 'month', items: months, label: 'Month' },
+ *     { id: 'year', items: years, label: 'Year' }
+ *   ]}
+ *   showLabels
+ * />
+ * ```
+ */
+export declare const NiceMobilePicker: default_2.ForwardRefExoticComponent<NiceMobilePickerProps<Record<string, unknown>> & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Multi-column picker props
+ */
+export declare interface NiceMobilePickerProps<T = Record<string, unknown>> extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {
+    /** Columns configuration */
+    columns: PickerColumn[];
+    /** Current values (keyed by column id) */
+    value?: T;
+    /** Default values */
+    defaultValue?: T;
+    /** Callback when value changes */
+    onChange?: (value: T, columnId: string) => void;
+    /** Height of each item */
+    itemHeight?: number;
+    /** Number of visible items */
+    visibleItems?: number;
+    /** Enable looping */
+    loop?: boolean;
+    /** Show column labels */
+    showLabels?: boolean;
+    /** Custom item renderer */
+    renderItem?: (item: PickerItem, columnId: string, isSelected: boolean) => ReactNode;
+    /** Show selection indicator */
+    showIndicator?: boolean;
+    /** Custom indicator className */
+    indicatorClassName?: string;
+}
+
+/**
+ * Mobile bottom navigation with badges and animations
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <NiceMobileTabs
+ *   tabs={[
+ *     { id: 'home', label: 'Home', icon: <HomeIcon /> },
+ *     { id: 'search', label: 'Search', icon: <SearchIcon /> },
+ *     { id: 'profile', label: 'Profile', icon: <UserIcon /> }
+ *   ]}
+ *   activeTab={activeTab}
+ *   onChange={setActiveTab}
+ * />
+ *
+ * // With badges
+ * <NiceMobileTabs
+ *   tabs={[
+ *     { id: 'home', label: 'Home', icon: TabIcons.home },
+ *     { id: 'inbox', label: 'Inbox', icon: TabIcons.inbox, badge: 5 },
+ *     { id: 'notifications', label: 'Alerts', icon: TabIcons.bell, badge: true }
+ *   ]}
+ *   activeTab="home"
+ *   onChange={handleTabChange}
+ * />
+ *
+ * // Floating variant
+ * <NiceMobileTabs
+ *   tabs={tabs}
+ *   activeTab={activeTab}
+ *   onChange={setActiveTab}
+ *   variant="floating"
+ *   animation="scale"
+ * />
+ * ```
+ */
+export declare const NiceMobileTabs: default_2.ForwardRefExoticComponent<NiceMobileTabsProps & default_2.RefAttributes<HTMLElement>>;
+
+/**
+ * Main props
+ */
+export declare interface NiceMobileTabsProps extends Omit<HTMLAttributes<HTMLElement>, 'onChange'> {
+    /** Tab items */
+    tabs: TabItem[];
+    /** Active tab ID */
+    activeTab?: string;
+    /** Default active tab (uncontrolled) */
+    defaultTab?: string;
+    /** Callback when tab changes */
+    onChange?: (id: string) => void;
+    /** Show labels */
+    showLabels?: boolean;
+    /** Always show labels (not just active) */
+    showAllLabels?: boolean;
+    /** Tab bar position */
+    position?: 'bottom' | 'top';
+    /** Visual variant */
+    variant?: 'default' | 'minimal' | 'floating' | 'shifted';
+    /** Use haptic feedback on tab change */
+    haptic?: boolean;
+    /** Animation style */
+    animation?: 'none' | 'scale' | 'slide' | 'fade';
+    /** Maximum number of visible tabs (rest go to "more") */
+    maxTabs?: number;
+    /** Custom "more" tab label */
+    moreLabel?: string;
+    /** Custom "more" tab icon */
+    moreIcon?: ReactNode;
+    /** Safe area padding (for iPhone X+) */
+    safeArea?: boolean;
+    /** Custom active indicator color */
+    activeColor?: string;
+    /** Custom inactive color */
+    inactiveColor?: string;
+    /** Background color */
+    backgroundColor?: string;
+    /** Hide on scroll direction */
+    hideOnScroll?: 'up' | 'down' | 'none';
+    /** Lock scroll to prevent horizontal overflow */
+    lockScroll?: boolean;
+}
+
+export declare const NiceMobileTimePicker: default_2.ForwardRefExoticComponent<NiceMobileTimePickerProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Time picker preset
+ */
+export declare interface NiceMobileTimePickerProps extends Omit<NiceMobilePickerProps, 'columns' | 'value' | 'onChange' | 'defaultValue'> {
+    value?: {
+        hour: number;
+        minute: number;
+    };
+    defaultValue?: {
+        hour: number;
+        minute: number;
+    };
+    onChange?: (value: {
+        hour: number;
+        minute: number;
+    }) => void;
+    /** Use 24-hour format */
+    use24Hour?: boolean;
+    /** Minute step */
+    minuteStep?: number;
+}
+
+/**
+ * Multi-date picker preset
+ */
+export declare const NiceMultiDatePicker: default_2.ForwardRefExoticComponent<Omit<NiceMobileCalendarProps, "selectionMode"> & default_2.RefAttributes<HTMLDivElement>>;
+
+export declare const NicePhoneKeyboard: default_2.ForwardRefExoticComponent<Omit<NiceTouchKeyboardProps, "layout"> & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Single picker column (wheel)
+ */
+export declare const NicePickerColumn: <T = string>(props: NicePickerColumnProps<T> & {
+    ref?: default_2.Ref<HTMLDivElement>;
+}) => JSX.Element;
+
+/**
+ * Single column props
+ */
+export declare interface NicePickerColumnProps<T = unknown> extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {
+    items: PickerItem<T>[];
+    value?: T;
+    defaultValue?: T;
+    onChange?: (value: T, item: PickerItem<T>) => void;
+    itemHeight?: number;
+    visibleItems?: number;
+    loop?: boolean;
+    renderItem?: (item: PickerItem<T>, isSelected: boolean) => ReactNode;
+}
+
+/**
+ * Pinch-to-zoom wrapper
+ */
+export declare const NicePinchZoom: default_2.ForwardRefExoticComponent<Omit<NiceGesturesProps, "enablePinch" | "applyTransform"> & default_2.RefAttributes<HTMLDivElement>>;
+
+export declare const NicePINKeyboard: default_2.ForwardRefExoticComponent<Omit<NiceTouchKeyboardProps, "layout" | "masked"> & default_2.RefAttributes<HTMLDivElement>>;
+
+declare const NicePullToRefresh: default_2.ForwardRefExoticComponent<NicePullToRefreshProps & default_2.RefAttributes<HTMLDivElement>>;
+export { NicePullToRefresh as NiceMobilePullToRefresh }
+export { NicePullToRefresh }
+
+declare interface NicePullToRefreshProps {
+    /** Content to wrap with pull-to-refresh */
+    children: ReactNode;
+    /** Async function called on refresh */
+    onRefresh: () => Promise<void>;
+    /** Custom indicator component */
+    indicator?: default_2.ComponentType<PullToRefreshIndicatorProps>;
+    /** Pull threshold in px (default: 80) */
+    threshold?: number;
+    /** Max pull distance (default: 150) */
+    maxPull?: number;
+    /** Pull resistance 0-1 (default: 0.4) */
+    resistance?: number;
+    /** How long to show success/error (default: 1000ms) */
+    completionDuration?: number;
+    /** Enable haptic feedback (default: true) */
+    hapticFeedback?: boolean;
+    /** Disable pull-to-refresh (default: false) */
+    disabled?: boolean;
+    /** Called when pull starts */
+    onPullStart?: () => void;
+    /** Called during pull with progress 0-1 */
+    onPullProgress?: (progress: number) => void;
+    /** Called when refresh succeeds */
+    onRefreshSuccess?: () => void;
+    /** Called when refresh fails */
+    onRefreshError?: (error: Error) => void;
+    /** Custom class name */
+    className?: string;
+    /** Custom styles */
+    style?: CSSProperties;
+    /** Accessibility label */
+    ariaLabel?: string;
+}
+export { NicePullToRefreshProps as NiceMobilePullToRefreshProps }
+export { NicePullToRefreshProps }
+
+/**
+ * Conditionally show content based on breakpoint
+ *
+ * @example
+ * ```tsx
+ * <NiceShow above="md">
+ *   <DesktopSidebar />
+ * </NiceShow>
+ *
+ * <NiceShow on="sm" fallback={<MobileNav />}>
+ *   <TabletNav />
+ * </NiceShow>
+ *
+ * <NiceShow device="mobile">
+ *   <MobileOnlyFeature />
+ * </NiceShow>
+ * ```
+ */
+export declare function NiceShow({ on, above, below, device, orientation, children, fallback, }: NiceShowProps): ReactNode;
+
+/**
+ * Show props (conditional render)
+ */
+export declare interface NiceShowProps {
+    /** Show only on specific breakpoint */
+    on?: BreakpointName;
+    /** Show above breakpoint (inclusive) */
+    above?: BreakpointName;
+    /** Show below breakpoint (exclusive) */
+    below?: BreakpointName;
+    /** Show only on device type */
+    device?: DeviceType;
+    /** Show only in orientation */
+    orientation?: Orientation;
+    /** Children to render */
+    children: ReactNode;
+    /** Fallback content */
+    fallback?: ReactNode;
+}
+
+/**
+ * Touch-optimized signature pad
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * const padRef = useRef<SignaturePadRef>(null);
+ *
+ * <NiceSignaturePad
+ *   ref={padRef}
+ *   width={400}
+ *   height={200}
+ *   strokeColor="#1f2937"
+ *   onChange={(isEmpty) => setHasSignature(!isEmpty)}
+ * />
+ *
+ * // Get signature
+ * const dataUrl = padRef.current?.toDataURL('png');
+ *
+ * // Clear
+ * padRef.current?.clear();
+ * ```
+ */
+declare const NiceSignaturePad: default_2.ForwardRefExoticComponent<NiceSignaturePadProps & default_2.RefAttributes<SignaturePadRef>>;
+export { NiceSignaturePad }
+export { NiceSignaturePad as NiceTouchSignaturePad }
+
+/**
+ * Main props
+ */
+declare interface NiceSignaturePadProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    /** Canvas width */
+    width?: number | string;
+    /** Canvas height */
+    height?: number | string;
+    /** Stroke color */
+    strokeColor?: string;
+    /** Stroke width */
+    strokeWidth?: number;
+    /** Minimum stroke width */
+    minWidth?: number;
+    /** Maximum stroke width */
+    maxWidth?: number;
+    /** Velocity filter weight (0-1) */
+    velocityFilterWeight?: number;
+    /** Background color */
+    backgroundColor?: string;
+    /** Draw guidelines */
+    showGuideline?: boolean;
+    /** Guideline color */
+    guidelineColor?: string;
+    /** Disable input */
+    disabled?: boolean;
+    /** Enable pen pressure */
+    penPressure?: boolean;
+    /** Enable haptic feedback */
+    haptic?: boolean;
+    /** Placeholder text when empty */
+    placeholder?: string;
+    /** Callback when signature changes */
+    onChange?: (isEmpty: boolean) => void;
+    /** Callback when drawing starts */
+    onBegin?: () => void;
+    /** Callback when drawing ends */
+    onEnd?: () => void;
+}
+export { NiceSignaturePadProps }
+export { NiceSignaturePadProps as NiceTouchSignaturePadProps }
+
+/**
+ * Swipeable wrapper
+ */
+export declare const NiceSwipeable: default_2.ForwardRefExoticComponent<Omit<NiceGesturesProps, "enableSwipe"> & default_2.RefAttributes<HTMLDivElement>>;
+
+export declare const NiceSwipeActions: default_2.ForwardRefExoticComponent<NiceSwipeActionsProps & default_2.RefAttributes<HTMLDivElement>>;
+
+export declare interface NiceSwipeActionsProps {
+    /** Content to wrap */
+    children: ReactNode;
+    /** Actions revealed on left swipe (appear on right side) */
+    leftActions?: SwipeActionsAction[];
+    /** Actions revealed on right swipe (appear on left side) */
+    rightActions?: SwipeActionsAction[];
+    /** Width of each action button in px (default: 72) */
+    actionWidth?: number;
+    /** Threshold percentage to trigger action (0-1, default: 0.4) */
+    threshold?: number;
+    /** Enable swipe in both directions (default: based on actions) */
+    direction?: SwipeDirection;
+    /** Close other open swipe items when opening this one */
+    exclusive?: boolean;
+    /** Called when swipe starts */
+    onSwipeStart?: (direction: 'left' | 'right') => void;
+    /** Called when swipe ends */
+    onSwipeEnd?: (direction: 'left' | 'right' | null) => void;
+    /** Called when any action is triggered */
+    onAction?: (action: SwipeActionsAction, direction: 'left' | 'right') => void;
+    /** Disable swipe interaction */
+    disabled?: boolean;
+    /** Custom class name */
+    className?: string;
+    /** Custom styles */
+    style?: CSSProperties;
+    /** Item ID for exclusive group management */
+    itemId?: string;
+    /** Haptic feedback on threshold crossing */
+    hapticFeedback?: boolean;
+}
+
+/** Wrap NiceSwipeActions items for exclusive mode */
+export declare const NiceSwipeList: default_2.FC<NiceSwipeListProps>;
+
+export declare interface NiceSwipeListProps {
+    children: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+}
+
+/**
+ * iOS-style action sheet
+ *
+ * @example
+ * ```tsx
+ * <NiceActionSheet
+ *   open={showSheet}
+ *   onClose={() => setShowSheet(false)}
+ *   title="Choose an action"
+ *   items={[
+ *     { id: 'share', label: 'Share', icon: '🔗' },
+ *     { id: 'save', label: 'Save to Photos', icon: '📷' },
+ *     { id: 'delete', label: 'Delete', danger: true }
+ *   ]}
+ * />
+ * ```
+ */
+export declare const NiceTouchActionSheet: default_2.ForwardRefExoticComponent<NiceTouchActionSheetProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Action sheet props
+ */
+export declare interface NiceTouchActionSheetProps extends HTMLAttributes<HTMLDivElement> {
+    /** Sheet items */
+    items: TouchMenuItem[];
+    /** Open state */
+    open: boolean;
+    /** Close handler */
+    onClose: () => void;
+    /** Title */
+    title?: string;
+    /** Cancel button label */
+    cancelLabel?: string;
+    /** Enable haptic feedback */
+    haptic?: boolean;
+}
+
+/**
+ * Touch-friendly button with 44px minimum touch target
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <NiceTouchButton variant="primary" size="lg">
+ *   Click Me
+ * </NiceTouchButton>
+ *
+ * // With icons
+ * <NiceTouchButton
+ *   leftIcon={<SaveIcon />}
+ *   variant="success"
+ * >
+ *   Save
+ * </NiceTouchButton>
+ *
+ * // Icon only
+ * <NiceTouchButton
+ *   iconOnly
+ *   shape="circle"
+ *   leftIcon={<PlusIcon />}
+ *   aria-label="Add item"
+ * />
+ *
+ * // Loading state
+ * <NiceTouchButton loading>
+ *   Processing...
+ * </NiceTouchButton>
+ * ```
+ */
+export declare const NiceTouchButton: default_2.ForwardRefExoticComponent<NiceTouchButtonProps & default_2.RefAttributes<HTMLButtonElement>>;
+
+/**
+ * Main props
+ */
+export declare interface NiceTouchButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Visual variant */
+    variant?: TouchButtonVariant;
+    /** Size (all meet 44px minimum) */
+    size?: TouchButtonSize;
+    /** Shape */
+    shape?: TouchButtonShape;
+    /** Full width */
+    fullWidth?: boolean;
+    /** Loading state */
+    loading?: boolean;
+    /** Left icon */
+    leftIcon?: ReactNode;
+    /** Right icon */
+    rightIcon?: ReactNode;
+    /** Icon only (no text) */
+    iconOnly?: boolean;
+    /** Enable haptic feedback */
+    haptic?: boolean;
+    /** Haptic intensity */
+    hapticIntensity?: 'light' | 'medium' | 'heavy';
+    /** Show press ripple effect */
+    ripple?: boolean;
+    /** Active/pressed state */
+    active?: boolean;
+    /** Children */
+    children?: ReactNode;
+}
+
+/**
+ * Touch-optimized HSL color picker wheel
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <NiceTouchColorPicker
+ *   value={color}
+ *   onChange={setColor}
+ * />
+ *
+ * // With presets
+ * <NiceTouchColorPicker
+ *   presetColors={['#ff0000', '#00ff00', '#0000ff']}
+ *   showInput
+ *   showPreview
+ * />
+ * ```
+ */
+export declare const NiceTouchColorPicker: default_2.ForwardRefExoticComponent<NiceTouchColorPickerProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Main props
+ */
+export declare interface NiceTouchColorPickerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {
+    /** Current color (hex string) */
+    value?: string;
+    /** Default color */
+    defaultValue?: string;
+    /** Color format for output */
+    format?: ColorFormat;
+    /** Show alpha slider */
+    showAlpha?: boolean;
+    /** Show color preview */
+    showPreview?: boolean;
+    /** Show hex input */
+    showInput?: boolean;
+    /** Show preset colors */
+    presetColors?: string[];
+    /** Wheel size */
+    wheelSize?: number;
+    /** Enable haptic feedback */
+    haptic?: boolean;
+    /** Change callback */
+    onChange?: (color: string) => void;
+    /** Preset label */
+    presetLabel?: string;
+}
+
+/**
+ * Touch-optimized drawing canvas
+ *
+ * @example
+ * ```tsx
+ * // Basic finger painting
+ * const drawingRef = useRef<TouchDrawingRef>(null);
+ *
+ * <NiceTouchDrawing
+ *   ref={drawingRef}
+ *   width={400}
+ *   height={300}
+ *   strokeColor="#ff5722"
+ *   strokeWidth={8}
+ *   tool="brush"
+ * />
+ *
+ * // Get image
+ * const imageUrl = drawingRef.current?.toDataURL();
+ *
+ * // Undo
+ * drawingRef.current?.undo();
+ * ```
+ */
+export declare const NiceTouchDrawing: default_2.ForwardRefExoticComponent<NiceTouchDrawingProps & default_2.RefAttributes<TouchDrawingRef>>;
+
+/**
+ * Main props
+ */
+export declare interface NiceTouchDrawingProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    /** Canvas width */
+    width?: number | string;
+    /** Canvas height */
+    height?: number | string;
+    /** Initial background color */
+    backgroundColor?: string;
+    /** Current stroke color */
+    strokeColor?: string;
+    /** Current stroke width */
+    strokeWidth?: number;
+    /** Current tool */
+    tool?: DrawingTool;
+    /** Line cap style */
+    lineCap?: LineCap;
+    /** Opacity (0-1) */
+    opacity?: number;
+    /** Enable pen pressure */
+    penPressure?: boolean;
+    /** Enable haptic feedback */
+    haptic?: boolean;
+    /** Max undo history */
+    maxHistory?: number;
+    /** Disable input */
+    disabled?: boolean;
+    /** Callback on change */
+    onChange?: () => void;
+    /** Callback on tool change */
+    onToolChange?: (tool: DrawingTool) => void;
+}
+
+/**
+ * Touch-optimized form field
+ */
+export declare const NiceTouchField: default_2.ForwardRefExoticComponent<NiceTouchFieldProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Touch field props
+ */
+export declare interface NiceTouchFieldProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    /** Field name */
+    name: string;
+    /** Field label */
+    label?: string;
+    /** Input type */
+    type?: 'text' | 'email' | 'password' | 'tel' | 'number' | 'url' | 'search' | 'date' | 'time' | 'datetime-local';
+    /** Placeholder */
+    placeholder?: string;
+    /** Helper text */
+    helperText?: string;
+    /** Disabled */
+    disabled?: boolean;
+    /** Read only */
+    readOnly?: boolean;
+    /** Auto-complete */
+    autoComplete?: string;
+    /** Input mode */
+    inputMode?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
+    /** Icon left */
+    iconLeft?: ReactNode;
+    /** Icon right */
+    iconRight?: ReactNode;
+    /** Max length */
+    maxLength?: number;
+    /** On change callback */
+    onChange?: (value: string) => void;
+    /** Required indicator */
+    required?: boolean;
+}
+
+/**
+ * Touch-optimized form container
+ *
+ * @example
+ * ```tsx
+ * <NiceTouchForm
+ *   initialValues={{ email: '', password: '' }}
+ *   validation={{
+ *     email: [
+ *       { type: 'required', message: 'Email is required' },
+ *       { type: 'email', message: 'Invalid email format' }
+ *     ],
+ *     password: [
+ *       { type: 'required', message: 'Password is required' },
+ *       { type: 'minLength', value: 8, message: 'Min 8 characters' }
+ *     ]
+ *   }}
+ *   onSubmit={(values) => login(values)}
+ *   enableNavigation
+ * >
+ *   <NiceTouchField name="email" label="Email" type="email" />
+ *   <NiceTouchField name="password" label="Password" type="password" />
+ *   <NiceTouchSubmit>Login</NiceTouchSubmit>
+ * </NiceTouchForm>
+ * ```
+ */
+export declare const NiceTouchForm: default_2.ForwardRefExoticComponent<NiceTouchFormProps & default_2.RefAttributes<HTMLFormElement>>;
+
+/**
+ * Main form props
+ */
+export declare interface NiceTouchFormProps extends Omit<HTMLAttributes<HTMLFormElement>, 'onSubmit' | 'onChange' | 'onError'> {
+    /** Initial form values */
+    initialValues?: Record<string, any>;
+    /** Validation rules per field */
+    validation?: Record<string, TouchFormValidationRule[]>;
+    /** Submit handler */
+    onSubmit?: (values: Record<string, any>) => void | Promise<void>;
+    /** Change handler */
+    onChange?: (values: Record<string, any>) => void;
+    /** Error handler */
+    onError?: (errors: TouchFormFieldError[]) => void;
+    /** Enable field navigation */
+    enableNavigation?: boolean;
+    /** Enable haptic feedback */
+    haptic?: boolean;
+    /** Auto-focus first field */
+    autoFocus?: boolean;
+    /** Show validation on blur */
+    validateOnBlur?: boolean;
+    /** Show validation on change */
+    validateOnChange?: boolean;
+    /** Disable form */
+    disabled?: boolean;
+}
+
+/**
+ * Icon button with 44px minimum touch target
+ */
+export declare const NiceTouchIconButton: default_2.ForwardRefExoticComponent<Omit<NiceTouchButtonProps, "children" | "leftIcon" | "iconOnly"> & {
+    icon: ReactNode;
+} & default_2.RefAttributes<HTMLButtonElement>>;
+
+export declare const NiceTouchKeyboard: default_2.ForwardRefExoticComponent<NiceTouchKeyboardProps & default_2.RefAttributes<HTMLDivElement>>;
+
+export declare interface NiceTouchKeyboardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'onSubmit' | 'onKeyPress'> {
+    /** Keyboard layout type */
+    layout?: KeyboardLayout;
+    /** Custom layout definition */
+    customLayout?: CustomLayout;
+    /** Display mode: minimal | compact | standard | full */
+    mode?: KeyboardMode;
+    /** Language(s) to support — pass multiple for language switching */
+    languages?: KeyboardLanguage[];
+    /** Active language (controlled) */
+    activeLanguage?: KeyboardLanguage;
+    /** Language change callback */
+    onLanguageChange?: (lang: KeyboardLanguage) => void;
+    /** Current value */
+    value?: string;
+    /** Max length */
+    maxLength?: number;
+    /** Keyboard theme */
+    theme?: KeyboardTheme;
+    /** Enable haptic feedback */
+    haptic?: boolean;
+    /** Enable sound feedback */
+    sound?: boolean;
+    /** Key press callback */
+    onKeyPress?: (key: string) => void;
+    /** Value change callback */
+    onChange?: (value: string) => void;
+    /** Enter/submit callback */
+    onSubmit?: (value: string) => void;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Show value preview */
+    showPreview?: boolean;
+    /** Preview placeholder */
+    previewPlaceholder?: string;
+    /** Mask input (for PIN) */
+    masked?: boolean;
+    /** Show language switcher */
+    showLanguageSwitcher?: boolean;
+    /** Enter key label override */
+    enterLabel?: string;
+}
+
+/**
+ * Touch-optimized context menu
+ *
+ * @example
+ * ```tsx
+ * // Long-press menu
+ * <NiceTouchMenu
+ *   trigger={<div>Long press me</div>}
+ *   longPress
+ *   items={[
+ *     { id: 'copy', label: 'Copy', icon: '📋' },
+ *     { id: 'paste', label: 'Paste', icon: '📄' },
+ *     { id: 'delete', label: 'Delete', icon: '🗑️', danger: true }
+ *   ]}
+ * />
+ *
+ * // Click menu
+ * <NiceTouchMenu
+ *   trigger={<button>Options ▾</button>}
+ *   onClick
+ *   items={menuItems}
+ * />
+ * ```
+ */
+export declare const NiceTouchMenu: default_2.ForwardRefExoticComponent<NiceTouchMenuProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Standalone menu popover
+ */
+export declare const NiceTouchMenuPopover: default_2.ForwardRefExoticComponent<NiceTouchMenuPopoverProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Popover menu props (standalone)
+ */
+export declare interface NiceTouchMenuPopoverProps extends HTMLAttributes<HTMLDivElement> {
+    /** Menu items */
+    items: TouchMenuItem[];
+    /** Open state */
+    open: boolean;
+    /** Position */
+    position: MenuPosition;
+    /** Close handler */
+    onClose: () => void;
+    /** Enable haptic feedback */
+    haptic?: boolean;
+}
+
+/**
+ * Main props
+ */
+export declare interface NiceTouchMenuProps extends Omit<HTMLAttributes<HTMLDivElement>, 'contextMenu' | 'onClick'> {
+    /** Menu items */
+    items: TouchMenuItem[];
+    /** Trigger element */
+    trigger: ReactNode;
+    /** Trigger on long press */
+    longPress?: boolean;
+    /** Long press delay (ms) */
+    longPressDelay?: number;
+    /** Trigger on right click */
+    enableContextMenu?: boolean;
+    /** Trigger on click */
+    enableClick?: boolean;
+    /** Enable haptic feedback */
+    haptic?: boolean;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Callback when menu opens */
+    onOpen?: () => void;
+    /** Callback when menu closes */
+    onClose?: () => void;
+}
+
+/**
+ * Field navigation bar (Prev/Next/Done)
+ */
+export declare const NiceTouchNavBar: default_2.ForwardRefExoticComponent<NiceTouchNavBarProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Navigation bar above keyboard
+ */
+export declare interface NiceTouchNavBarProps extends HTMLAttributes<HTMLDivElement> {
+    /** Done button text */
+    doneText?: string;
+    /** Show done button */
+    showDone?: boolean;
+    /** Done click handler */
+    onDone?: () => void;
+}
+
+/**
+ * Touch-optimized range slider
+ *
+ * @example
+ * ```tsx
+ * // Basic slider
+ * <NiceTouchSlider
+ *   min={0}
+ *   max={100}
+ *   value={volume}
+ *   onChange={setVolume}
+ * />
+ *
+ * // Range slider
+ * <NiceTouchSlider
+ *   min={0}
+ *   max={1000}
+ *   value={[minPrice, maxPrice]}
+ *   onChange={([min, max]) => setPriceRange(min, max)}
+ *   formatLabel={(v) => `$${v}`}
+ * />
+ *
+ * // With marks
+ * <NiceTouchSlider
+ *   min={0}
+ *   max={100}
+ *   step={10}
+ *   marks
+ *   labelDisplay="on"
+ * />
+ * ```
+ */
+export declare const NiceTouchSlider: default_2.ForwardRefExoticComponent<NiceTouchSliderProps & default_2.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Main props
+ */
+export declare interface NiceTouchSliderProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {
+    /** Current value (controlled) */
+    value?: number | [number, number];
+    /** Default value (uncontrolled) */
+    defaultValue?: number | [number, number];
+    /** Minimum value */
+    min?: number;
+    /** Maximum value */
+    max?: number;
+    /** Step increment */
+    step?: number;
+    /** Orientation */
+    orientation?: SliderOrientation;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Show marks */
+    marks?: boolean | SliderMark[];
+    /** Mark step (auto-generate marks) */
+    markStep?: number;
+    /** Show value label on thumb */
+    labelDisplay?: LabelDisplay;
+    /** Format label value */
+    formatLabel?: (value: number) => string;
+    /** Show min/max values */
+    showRange?: boolean;
+    /** Track color (CSS color) */
+    trackColor?: string;
+    /** Filled track color */
+    fillColor?: string;
+    /** Thumb size in px */
+    thumbSize?: number;
+    /** Track height in px */
+    trackHeight?: number;
+    /** Enable haptic feedback */
+    haptic?: boolean;
+    /** Snap to marks only */
+    snapToMarks?: boolean;
+    /** Change callback */
+    onChange?: (value: number | [number, number]) => void;
+    /** Change committed callback (on release) */
+    onChangeCommitted?: (value: number | [number, number]) => void;
+    /** Accessibility label */
+    'aria-label'?: string;
+    /** Accessibility label for range slider */
+    'aria-labelledby'?: string;
+}
+
+/**
+ * Touch-optimized submit button
+ */
+export declare const NiceTouchSubmit: default_2.ForwardRefExoticComponent<NiceTouchSubmitProps & default_2.RefAttributes<HTMLButtonElement>>;
+
+/**
+ * Submit button props
+ */
+export declare interface NiceTouchSubmitProps extends HTMLAttributes<HTMLButtonElement> {
+    /** Loading state */
+    loading?: boolean;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Full width */
+    fullWidth?: boolean;
+}
+
+/**
+ * Touch-optimized table with horizontal scroll and swipe actions
+ *
+ * @example
+ * ```tsx
+ * // Basic table
+ * <NiceTouchTable
+ *   data={users}
+ *   rowKey="id"
+ *   columns={[
+ *     { id: 'name', header: 'Name', accessor: 'name', sticky: true },
+ *     { id: 'email', header: 'Email', accessor: 'email', minWidth: 200 },
+ *     { id: 'role', header: 'Role', accessor: 'role' }
+ *   ]}
+ * />
+ *
+ * // With swipe actions
+ * <NiceTouchTable
+ *   data={items}
+ *   rowKey="id"
+ *   columns={columns}
+ *   swipeActionsRight={[
+ *     {
+ *       id: 'delete',
+ *       label: 'Delete',
+ *       icon: '🗑️',
+ *       color: 'var(--color-error, #ef4444)',
+ *       onAction: (row) => handleDelete(row.id)
+ *     }
+ *   ]}
+ * />
+ * ```
+ */
+export declare const NiceTouchTable: <T>(props: NiceTouchTableProps<T> & {
+    ref?: default_2.ForwardedRef<HTMLDivElement>;
+}) => default_2.ReactElement;
+
+/**
+ * Main props
+ */
+export declare interface NiceTouchTableProps<T = any> extends Omit<HTMLAttributes<HTMLDivElement>, 'onSelect'> {
+    /** Table data */
+    data: T[];
+    /** Column definitions */
+    columns: TouchTableColumn<T>[];
+    /** Row key accessor */
+    rowKey: keyof T | ((row: T) => string | number);
+    /** Left swipe actions */
+    swipeActionsLeft?: TouchTableSwipeAction<T>[];
+    /** Right swipe actions */
+    swipeActionsRight?: TouchTableSwipeAction<T>[];
+    /** Enable row selection */
+    selectable?: boolean;
+    /** Selected row keys */
+    selectedKeys?: (string | number)[];
+    /** Selection change handler */
+    onSelect?: (keys: (string | number)[]) => void;
+    /** Row click handler */
+    onRowClick?: (row: T, rowIndex: number) => void;
+    /** Sort state */
+    sortState?: SortState;
+    /** Sort change handler */
+    onSort?: (state: SortState) => void;
+    /** Empty state content */
+    emptyContent?: ReactNode;
+    /** Loading state */
+    loading?: boolean;
+    /** Enable haptic feedback */
+    haptic?: boolean;
+    /** Swipe threshold (px) */
+    swipeThreshold?: number;
+}
+
+/**
+ * Orientation type
+ */
+export declare type Orientation = 'portrait' | 'landscape';
+
+/**
+ * Pan gesture event
+ */
+export declare interface PanEvent {
+    translation: Point;
+    delta: Point;
+    velocity: Point;
+    center: Point;
+    direction: 'left' | 'right' | 'up' | 'down' | null;
+}
+
+/**
+ * Column configuration
+ */
+export declare interface PickerColumn<T = unknown> {
+    id: string;
+    items: PickerItem<T>[];
+    width?: number | string;
+    label?: string;
+}
+
+/**
+ * Picker item
+ */
+export declare interface PickerItem<T = unknown> {
+    value: T;
+    label: string;
+    disabled?: boolean;
+}
+
+/**
+ * Pinch gesture event
+ */
+export declare interface PinchEvent {
+    scale: number;
+    deltaScale: number;
+    center: Point;
+    distance: number;
+    initialDistance: number;
+}
+
+/**
+ * Point in 2D space
+ */
+export declare interface Point {
+    x: number;
+    y: number;
+}
+
+export declare interface PullToRefreshConfig {
+    /** Distance in px to trigger refresh */
+    threshold: number;
+    /** Maximum pull distance in px */
+    maxPull: number;
+    /** Resistance factor (0-1, higher = harder to pull) */
+    resistance: number;
+    /** Duration to show success/error state in ms */
+    completionDuration: number;
+    /** Enable haptic feedback on supported devices */
+    hapticFeedback: boolean;
+    /** Disable pull-to-refresh */
+    disabled: boolean;
+}
+
+declare interface PullToRefreshContextValue {
+    state: RefreshState;
+    progress: number;
+    isRefreshing: boolean;
+    triggerRefresh: () => Promise<void>;
+}
+
+export declare const PullToRefreshDefaultIndicator: default_2.FC<PullToRefreshIndicatorProps>;
+
+export declare interface PullToRefreshIndicatorProps {
+    state: RefreshState;
+    progress: number;
+    pullDistance: number;
+    threshold: number;
+}
+
+export declare type RefreshState = 'idle' | 'pulling' | 'ready' | 'refreshing' | 'success' | 'error';
+
+/**
+ * Create responsive object from breakpoint values
+ */
+export declare function responsive<T>(values: Partial<Record<BreakpointName | 'base', T>>): ResponsiveValue<T>;
+
+/**
+ * Responsive value object
+ */
+export declare type ResponsiveValue<T> = {
+    base?: T;
+    xs?: T;
+    sm?: T;
+    md?: T;
+    lg?: T;
+    xl?: T;
+    '2xl'?: T;
+};
+
+/**
+ * RGB color
+ */
+declare interface RGBColor {
+    r: number;
+    g: number;
+    b: number;
+}
+
+declare function rgbToHex(r: number, g: number, b: number): string;
+
+declare function rgbToHsl(r: number, g: number, b: number): HSLColor;
+
+/**
+ * Rotate gesture event
+ */
+export declare interface RotateEvent {
+    rotation: number;
+    deltaRotation: number;
+    center: Point;
+}
+
+/**
+ * Screen info
+ */
+export declare interface ScreenInfo {
+    width: number;
+    height: number;
+    breakpoint: BreakpointName;
+    deviceType: DeviceType;
+    orientation: Orientation;
+    isMobile: boolean;
+    isTablet: boolean;
+    isDesktop: boolean;
+    isPortrait: boolean;
+    isLandscape: boolean;
+    isTouchDevice: boolean;
+    pixelRatio: number;
+}
+
+/**
+ * Selection mode
+ */
+declare type SelectionMode_2 = 'single' | 'multiple' | 'range';
+export { SelectionMode_2 as SelectionMode }
+
+/**
+ * Signature data format
+ */
+export declare type SignatureFormat = 'png' | 'jpeg' | 'svg' | 'json';
+
+/**
+ * Ref methods
+ */
+export declare interface SignaturePadRef {
+    /** Clear the signature */
+    clear: () => void;
+    /** Check if signature is empty */
+    isEmpty: () => boolean;
+    /** Get signature data */
+    toData: () => SignaturePoint[][];
+    /** Load signature data */
+    fromData: (data: SignaturePoint[][]) => void;
+    /** Get as data URL */
+    toDataURL: (format?: SignatureFormat, quality?: number) => string;
+    /** Get as SVG string */
+    toSVG: () => string;
+    /** Get as Blob */
+    toBlob: (format?: 'png' | 'jpeg', quality?: number) => Promise<Blob | null>;
+    /** Undo last stroke */
+    undo: () => void;
+    /** Redo undone stroke */
+    redo: () => void;
+}
+
+/**
+ * Point with optional pressure
+ */
+export declare interface SignaturePoint {
+    x: number;
+    y: number;
+    pressure?: number;
+    time: number;
+}
+
+/**
+ * Slider mark
+ */
+export declare interface SliderMark {
+    value: number;
+    label?: ReactNode;
+}
+
+/**
+ * Slider orientation
+ */
+export declare type SliderOrientation = 'horizontal' | 'vertical';
+
+export declare type SnapPoint = number | 'content' | 'full';
+
+/**
+ * Sort state
+ */
+export declare interface SortState {
+    columnId: string;
+    direction: 'asc' | 'desc';
+}
+
+export declare const SwipeActionPresets: {
+    delete: (onClick: () => void) => SwipeActionsAction;
+    edit: (onClick: () => void) => SwipeActionsAction;
+    archive: (onClick: () => void) => SwipeActionsAction;
+    star: (onClick: () => void) => SwipeActionsAction;
+    share: (onClick: () => void) => SwipeActionsAction;
+    pin: (onClick: () => void) => SwipeActionsAction;
+    mute: (onClick: () => void) => SwipeActionsAction;
+    reply: (onClick: () => void) => SwipeActionsAction;
+};
+
+export declare interface SwipeActionsAction {
+    id: string;
+    label: string;
+    icon?: ReactNode;
+    color?: string;
+    background?: string;
+    /** If true, continues past the action threshold to trigger immediately */
+    destructive?: boolean;
+    /** Called when action is triggered */
+    onClick: () => void | Promise<void>;
+}
+
+export declare type SwipeDirection = 'left' | 'right' | 'both';
+
+/**
+ * Swipe gesture event
+ */
+export declare interface SwipeEvent {
+    direction: 'left' | 'right' | 'up' | 'down';
+    velocity: number;
+    distance: number;
+    duration: number;
+}
+
+declare interface SwipeGroupContextValue {
+    activeItemId: string | null;
+    setActiveItemId: (id: string | null) => void;
+}
+
+/** Provider for exclusive swipe mode - only one item open at a time */
+export declare const SwipeGroupProvider: default_2.FC<{
+    children: ReactNode;
+}>;
+
+/**
+ * Built-in tab icons for common use cases
+ */
+export declare const TabIcons: {
+    home: JSX_2.Element;
+    homeFilled: JSX_2.Element;
+    search: JSX_2.Element;
+    plus: JSX_2.Element;
+    heart: JSX_2.Element;
+    heartFilled: JSX_2.Element;
+    user: JSX_2.Element;
+    userFilled: JSX_2.Element;
+    bell: JSX_2.Element;
+    bellFilled: JSX_2.Element;
+    cart: JSX_2.Element;
+    inbox: JSX_2.Element;
+    settings: JSX_2.Element;
+    more: JSX_2.Element;
+};
+
+/**
+ * Tab item configuration
+ */
+export declare interface TabItem {
+    /** Unique identifier */
+    id: string;
+    /** Tab label */
+    label: string;
+    /** Tab icon (active state uses same if no activeIcon) */
+    icon: ReactNode;
+    /** Icon when tab is active (optional) */
+    activeIcon?: ReactNode;
+    /** Badge content (number, string, or true for dot) */
+    badge?: number | string | boolean;
+    /** Badge variant */
+    badgeVariant?: BadgeVariant;
+    /** Badge color */
+    badgeColor?: string;
+    /** Is tab disabled */
+    disabled?: boolean;
+    /** Custom className */
+    className?: string;
+    /** Href for link tabs */
+    href?: string;
+    /** onClick handler */
+    onClick?: () => void;
+}
+
+/**
+ * Common tab configurations for quick setup
+ */
+export declare const TabPresets: {
+    /** Basic 4-tab layout */
+    basic: TabItem[];
+    /** Social app layout */
+    social: TabItem[];
+    /** E-commerce layout */
+    ecommerce: TabItem[];
+    /** Messaging app layout */
+    messaging: TabItem[];
+};
+
+/**
+ * Tap gesture event
+ */
+export declare interface TapEvent {
+    position: Point;
+    target: EventTarget | null;
+}
+
+/**
+ * Button shape
+ */
+export declare type TouchButtonShape = 'rounded' | 'pill' | 'square' | 'circle';
+
+/**
+ * Button size
+ */
+export declare type TouchButtonSize = 'sm' | 'md' | 'lg' | 'xl';
+
+/**
+ * Button variant
+ */
+export declare type TouchButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger' | 'success' | 'warning';
+
+/**
+ * Ref methods
+ */
+export declare interface TouchDrawingRef {
+    /** Clear the canvas */
+    clear: () => void;
+    /** Undo last action */
+    undo: () => void;
+    /** Redo undone action */
+    redo: () => void;
+    /** Check if can undo */
+    canUndo: () => boolean;
+    /** Check if can redo */
+    canRedo: () => boolean;
+    /** Get as data URL */
+    toDataURL: (format?: 'png' | 'jpeg', quality?: number) => string;
+    /** Get as Blob */
+    toBlob: (format?: 'png' | 'jpeg', quality?: number) => Promise<Blob | null>;
+    /** Load from data URL */
+    fromDataURL: (url: string) => Promise<void>;
+    /** Fill canvas with color */
+    fill: (color: string) => void;
+    /** Get current tool */
+    getTool: () => DrawingTool;
+    /** Set current tool */
+    setTool: (tool: DrawingTool) => void;
+}
+
+/**
+ * Form context
+ */
+declare interface TouchFormContextType {
+    values: Record<string, any>;
+    errors: TouchFormFieldError[];
+    touched: Set<string>;
+    setFieldValue: (name: string, value: any) => void;
+    setFieldTouched: (name: string) => void;
+    focusField: (name: string) => void;
+    focusNext: () => void;
+    focusPrev: () => void;
+    registerField: (name: string, ref: HTMLElement | null) => void;
+    unregisterField: (name: string) => void;
+}
+
+/**
+ * Field error
+ */
+export declare interface TouchFormFieldError {
+    field: string;
+    message: string;
+}
+
+/**
+ * Field validation rule
+ */
+export declare interface TouchFormValidationRule {
+    /** Validation type */
+    type: 'required' | 'email' | 'minLength' | 'maxLength' | 'pattern' | 'custom';
+    /** Rule value */
+    value?: any;
+    /** Error message */
+    message: string;
+    /** Custom validator function */
+    validator?: (value: any) => boolean;
+}
+
+/**
+ * Menu item definition
+ */
+export declare interface TouchMenuItem {
+    /** Unique ID */
+    id: string;
+    /** Label text */
+    label: string;
+    /** Icon element */
+    icon?: ReactNode;
+    /** Shortcut text */
+    shortcut?: string;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Danger/destructive */
+    danger?: boolean;
+    /** Submenu items */
+    children?: TouchMenuItem[];
+    /** Divider after this item */
+    divider?: boolean;
+    /** Click handler */
+    onClick?: () => void;
+}
+
+/**
+ * Column definition
+ */
+export declare interface TouchTableColumn<T = any> {
+    /** Unique column ID */
+    id: string;
+    /** Header text */
+    header: ReactNode;
+    /** Cell accessor (key or function) */
+    accessor: keyof T | ((row: T) => ReactNode);
+    /** Column width */
+    width?: string | number;
+    /** Minimum width */
+    minWidth?: number;
+    /** Sticky left */
+    sticky?: boolean;
+    /** Text alignment */
+    align?: 'left' | 'center' | 'right';
+    /** Sortable */
+    sortable?: boolean;
+    /** Custom cell renderer */
+    cell?: (value: any, row: T, rowIndex: number) => ReactNode;
+}
+
+/**
+ * Swipe action
+ */
+export declare interface TouchTableSwipeAction<T = any> {
+    /** Unique ID */
+    id: string;
+    /** Label */
+    label: string;
+    /** Icon */
+    icon?: ReactNode;
+    /** Background color */
+    color?: string;
+    /** Text color */
+    textColor?: string;
+    /** Handler */
+    onAction: (row: T, rowIndex: number) => void;
+}
+
+/**
+ * Hook for responsive breakpoint detection
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const { breakpoint, isMobile, isDesktop, getResponsive } = useBreakpoint();
+ *
+ *   const columns = getResponsive({ base: 1, md: 2, lg: 3 }, 1);
+ *   const padding = getResponsive({ xs: 16, md: 24, xl: 32 }, 16);
+ *
+ *   return (
+ *     <div style={{ padding }}>
+ *       <Grid columns={columns}>
+ *         {isMobile && <MobileNav />}
+ *         {isDesktop && <DesktopNav />}
+ *       </Grid>
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+declare function useBreakpoint(options?: UseBreakpointOptions): UseBreakpointReturn;
+export { useBreakpoint }
+export { useBreakpoint as useMobileBreakpoint }
+
+/**
+ * Hook to access breakpoint context
+ */
+export declare function useBreakpointContext(): BreakpointContextValue;
+
+/**
+ * Hook options
+ */
+export declare interface UseBreakpointOptions {
+    /** Custom breakpoint values */
+    breakpoints?: Partial<BreakpointValues>;
+    /** Debounce delay for resize events */
+    debounceDelay?: number;
+    /** SSR default width */
+    ssrDefaultWidth?: number;
+}
+
+/**
+ * Hook return
+ */
+export declare interface UseBreakpointReturn extends ScreenInfo {
+    /** Check if current breakpoint matches */
+    is: (breakpoint: BreakpointName) => boolean;
+    /** Check if current width is above breakpoint */
+    isAbove: (breakpoint: BreakpointName) => boolean;
+    /** Check if current width is below breakpoint */
+    isBelow: (breakpoint: BreakpointName) => boolean;
+    /** Check if current width is between breakpoints */
+    isBetween: (min: BreakpointName, max: BreakpointName) => boolean;
+    /** Get responsive value for current breakpoint */
+    getResponsive: <T>(values: ResponsiveValue<T>, defaultValue: T) => T;
+    /** Generate media query string */
+    mediaQuery: (breakpoint: BreakpointName, type?: 'min' | 'max' | 'only') => string;
+}
+
+/**
+ * Hook for button press feedback
+ */
+export declare function useButtonHaptic(): () => void;
+
+/**
+ * Hook for calendar logic
+ */
+export declare function useCalendar(options?: UseCalendarOptions): UseCalendarReturn;
+
+/**
+ * Hook options
+ */
+export declare interface UseCalendarOptions {
+    defaultDate?: Date;
+    selectedDate?: Date;
+    selectedDates?: Date[];
+    selectedRange?: DateRange;
+    selectionMode?: SelectionMode_2;
+    minDate?: Date;
+    maxDate?: Date;
+    disabledDates?: Date[];
+    events?: CalendarEvent[];
+    weekStartDay?: WeekStartDay;
+    onChange?: (date: Date | Date[] | DateRange) => void;
+}
+
+/**
+ * Hook return
+ */
+export declare interface UseCalendarReturn {
+    viewDate: Date;
+    selectedDate: Date | null;
+    selectedDates: Date[];
+    selectedRange: DateRange;
+    view: CalendarView;
+    setView: (view: CalendarView) => void;
+    goToDate: (date: Date) => void;
+    goToPrevMonth: () => void;
+    goToNextMonth: () => void;
+    goToPrevYear: () => void;
+    goToNextYear: () => void;
+    goToToday: () => void;
+    selectDate: (date: Date) => void;
+    isDateSelected: (date: Date) => boolean;
+    isDateDisabled: (date: Date) => boolean;
+    getDaysInMonth: () => DayCell[];
+    getMonths: () => {
+        month: number;
+        label: string;
+    }[];
+    getYears: () => number[];
+}
+
+/**
+ * Hook for custom collapsing header behavior
+ *
+ * @example
+ * ```tsx
+ * function MyScreen() {
+ *   const header = useCollapsingHeader({
+ *     collapsedHeight: 56,
+ *     expandedHeight: 200,
+ *     mode: 'scroll'
+ *   });
+ *
+ *   return (
+ *     <>
+ *       <div style={{ height: header.height }}>
+ *         Progress: {header.progress}
+ *       </div>
+ *       <div ref={header.scrollRef} style={{ overflow: 'auto' }}>
+ *         Content...
+ *       </div>
+ *     </>
+ *   );
+ * }
+ * ```
+ */
+export declare function useCollapsingHeader(options?: UseCollapsingHeaderOptions): UseCollapsingHeaderReturn;
+
+/**
+ * Hook options
+ */
+export declare interface UseCollapsingHeaderOptions {
+    /** Minimum height when collapsed */
+    collapsedHeight?: number;
+    /** Maximum height when expanded */
+    expandedHeight?: number;
+    /** Scroll element (default: window) */
+    scrollElement?: HTMLElement | null;
+    /** Collapse mode */
+    mode?: CollapseMode;
+    /** Threshold to trigger collapse */
+    threshold?: number;
+}
+
+/**
+ * Hook return type
+ */
+export declare interface UseCollapsingHeaderReturn {
+    /** Current collapse progress (0 = expanded, 1 = collapsed) */
+    progress: number;
+    /** Current height */
+    height: number;
+    /** Is header collapsed */
+    isCollapsed: boolean;
+    /** Is header visible (for enterAlways mode) */
+    isVisible: boolean;
+    /** Ref to attach to scroll container */
+    scrollRef: default_2.RefObject<HTMLElement>;
+    /** Manual expand */
+    expand: () => void;
+    /** Manual collapse */
+    collapse: () => void;
+}
+
+export declare function useDrawer(options?: UseDrawerOptions): UseDrawerResult;
+
+declare interface UseDrawerOptions {
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+
+export declare interface UseDrawerResult {
+    isOpen: boolean;
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+    setOpen: (open: boolean) => void;
+}
+
+/**
+ * Hook for gesture detection and handling
+ */
+export declare function useGestures(options?: UseGesturesOptions): UseGesturesReturn;
+
+export declare function useGesturesContext(): GesturesContextValue;
+
+/**
+ * Hook options
+ */
+export declare interface UseGesturesOptions extends GestureHandlers {
+    /** Enable pinch gesture */
+    enablePinch?: boolean;
+    /** Enable rotation gesture */
+    enableRotation?: boolean;
+    /** Enable pan gesture */
+    enablePan?: boolean;
+    /** Enable swipe gesture */
+    enableSwipe?: boolean;
+    /** Enable tap gesture */
+    enableTap?: boolean;
+    /** Enable double tap */
+    enableDoubleTap?: boolean;
+    /** Enable long press */
+    enableLongPress?: boolean;
+    /** Minimum scale */
+    minScale?: number;
+    /** Maximum scale */
+    maxScale?: number;
+    /** Pan threshold in px */
+    panThreshold?: number;
+    /** Swipe velocity threshold */
+    swipeVelocityThreshold?: number;
+    /** Swipe distance threshold */
+    swipeDistanceThreshold?: number;
+    /** Long press duration in ms */
+    longPressDuration?: number;
+    /** Double tap max delay */
+    doubleTapDelay?: number;
+}
+
+/**
+ * Hook return
+ */
+export declare interface UseGesturesReturn {
+    bind: () => {
+        onPointerDown: (e: PointerEvent_2) => void;
+        onPointerMove: (e: PointerEvent_2) => void;
+        onPointerUp: (e: PointerEvent_2) => void;
+        onPointerCancel: (e: PointerEvent_2) => void;
+        style: default_2.CSSProperties;
+    };
+    state: GestureState;
+    reset: () => void;
+}
+
+/**
+ * Hook for haptic feedback
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const haptics = useHaptics();
+ *
+ *   return (
+ *     <button onClick={() => {
+ *       haptics.trigger('button-press');
+ *       doSomething();
+ *     }}>
+ *       Click Me
+ *     </button>
+ *   );
+ * }
+ * ```
+ */
+export declare function useHaptics(options?: UseHapticsOptions): UseHapticsReturn;
+
+/**
+ * Hook to access haptics context
+ */
+export declare function useHapticsContext(): HapticsContextValue;
+
+/**
+ * Hook options
+ */
+export declare interface UseHapticsOptions {
+    /** Enable haptics (default: true) */
+    enabled?: boolean;
+    /** Global intensity multiplier */
+    intensity?: HapticIntensity;
+    /** Custom patterns */
+    customPatterns?: Record<string, VibrationPattern>;
+}
+
+/**
+ * Hook return
+ */
+export declare interface UseHapticsReturn {
+    /** Whether haptics are supported */
+    isSupported: boolean;
+    /** Whether haptics are enabled */
+    isEnabled: boolean;
+    /** Enable/disable haptics */
+    setEnabled: (enabled: boolean) => void;
+    /** Trigger vibration with pattern */
+    vibrate: (pattern?: VibrationPattern) => boolean;
+    /** Stop vibration */
+    cancel: () => void;
+    /** Trigger predefined haptic feedback */
+    trigger: (type: HapticsHapticFeedbackType) => boolean;
+    /** Trigger custom pattern by name */
+    triggerPattern: (name: string) => boolean;
+    /** Get intensity multiplier */
+    getIntensityMultiplier: () => number;
+}
+
+/**
+ * Hook for impact feedback
+ */
+export declare function useImpactHaptic(): (intensity?: HapticIntensity) => void;
+
+export declare function useInfiniteData<T, C = string | number>(options: UseInfiniteDataOptions<T, C>): UseInfiniteDataResult<T>;
+
+export declare interface UseInfiniteDataOptions<T, C = string | number> {
+    /** Function to fetch a page of data */
+    fetchPage: (cursor?: C) => Promise<InfiniteScrollPage<T>>;
+    /** Initial cursor */
+    initialCursor?: C;
+    /** Enable automatic refetch on window focus */
+    refetchOnFocus?: boolean;
+}
+
+export declare interface UseInfiniteDataResult<T> {
+    items: T[];
+    isLoading: boolean;
+    error: string | null;
+    hasMore: boolean;
+    loadMore: () => Promise<void>;
+    refresh: () => Promise<void>;
+    reset: () => void;
+}
+
+export declare function useInfiniteScroll(): InfiniteScrollContextValue;
+
+/**
+ * Hook for matching media queries
+ *
+ * @example
+ * ```tsx
+ * const isLarge = useMediaQuery('(min-width: 1024px)');
+ * const isDark = useMediaQuery('(prefers-color-scheme: dark)');
+ * const isReducedMotion = useMediaQuery('(prefers-reduced-motion: reduce)');
+ * ```
+ */
+declare function useMediaQuery(query: string): boolean;
+export { useMediaQuery }
+export { useMediaQuery as useMobileMediaQuery }
+
+export declare function useMobileCalendar(): MobileCalendarContextValue;
+
+export declare function useMobileDrawer(): MobileDrawerContextValue;
+
+/**
+ * Access header context from children
+ */
+export declare function useMobileHeader(): MobileHeaderContextValue;
+
+/**
+ * Access modal context inside modal content
+ */
+export declare function useMobileModal(): MobileModalContextValue;
+
+export declare function useMobilePicker(): MobilePickerContextValue;
+
+/**
+ * Access tabs context from children
+ */
+export declare function useMobileTabs(): MobileTabsContextValue;
+
+/**
+ * Hook to manage modal open/close state
+ *
+ * @example
+ * ```tsx
+ * function MyScreen() {
+ *   const modal = useModal();
+ *
+ *   return (
+ *     <>
+ *       <button onClick={modal.openModal}>Open</button>
+ *       <NiceMobileModal
+ *         open={modal.open}
+ *         onClose={modal.closeModal}
+ *       >
+ *         Modal content
+ *       </NiceMobileModal>
+ *     </>
+ *   );
+ * }
+ * ```
+ */
+export declare function useModal(options?: UseModalOptions): UseModalReturn;
+
+/**
+ * Modal configuration for hook
+ */
+export declare interface UseModalOptions {
+    /** Initial open state */
+    defaultOpen?: boolean;
+    /** Controlled open state */
+    open?: boolean;
+    /** Callback when open state changes */
+    onOpenChange?: (open: boolean, trigger?: DismissTrigger) => void;
+    /** Block dismiss on drag/overlay */
+    preventDismiss?: boolean;
+}
+
+/**
+ * Hook return type
+ */
+export declare interface UseModalReturn {
+    open: boolean;
+    openModal: () => void;
+    closeModal: (trigger?: DismissTrigger) => void;
+    toggle: () => void;
+    setOpen: (open: boolean) => void;
+}
+
+/**
+ * Hook for notification feedback
+ */
+export declare function useNotificationHaptic(): (type: "success" | "warning" | "error") => void;
+
+declare function usePullToRefresh(): PullToRefreshContextValue;
+export { usePullToRefresh as useMobilePullToRefresh }
+export { usePullToRefresh }
+
+/**
+ * Hook for selection feedback
+ */
+export declare function useSelectionHaptic(): () => void;
+
+/**
+ * Hook options
+ */
+export declare interface UseSliderOptions {
+    min: number;
+    max: number;
+    step: number;
+    value?: number | [number, number];
+    defaultValue?: number | [number, number];
+    onChange?: (value: number | [number, number]) => void;
+    onChangeCommitted?: (value: number | [number, number]) => void;
+}
+
+/**
+ * Hook return
+ */
+export declare interface UseSliderReturn {
+    value: number | [number, number];
+    isRange: boolean;
+    percentage: number | [number, number];
+    setValue: (value: number | [number, number]) => void;
+    setValueByPercentage: (percentage: number, thumbIndex?: number) => void;
+    commitValue: () => void;
+    clamp: (value: number) => number;
+    snap: (value: number) => number;
+}
+
+export declare function useSwipeGroup(): SwipeGroupContextValue | null;
+
+/**
+ * Hook to manage tab state
+ *
+ * @example
+ * ```tsx
+ * function MyApp() {
+ *   const tabs = useTabs({
+ *     tabs: [
+ *       { id: 'home', label: 'Home', icon: <HomeIcon /> },
+ *       { id: 'search', label: 'Search', icon: <SearchIcon /> },
+ *     ],
+ *     defaultTab: 'home'
+ *   });
+ *
+ *   return (
+ *     <>
+ *       {tabs.activeTab === 'home' && <HomeScreen />}
+ *       {tabs.activeTab === 'search' && <SearchScreen />}
+ *       <NiceMobileTabs {...tabs} />
+ *     </>
+ *   );
+ * }
+ * ```
+ */
+export declare function useTabs(options: UseTabsOptions): UseTabsReturn;
+
+/**
+ * Hook options
+ */
+export declare interface UseTabsOptions {
+    /** Tab items */
+    tabs: TabItem[];
+    /** Default active tab ID */
+    defaultTab?: string;
+    /** Controlled active tab */
+    activeTab?: string;
+    /** Callback when tab changes */
+    onChange?: (id: string) => void;
+}
+
+/**
+ * Hook return
+ */
+export declare interface UseTabsReturn {
+    activeTab: string;
+    setActiveTab: (id: string) => void;
+    tabs: TabItem[];
+    isActive: (id: string) => boolean;
+}
+
+/**
+ * Hook for toggle switch feedback
+ */
+export declare function useToggleHaptic(): (isOn: boolean) => void;
+
+/**
+ * Hook to use form context
+ */
+export declare function useTouchForm(): TouchFormContextType;
+
+/**
+ * Hook for slider logic
+ */
+export declare function useTouchSlider(options: UseSliderOptions): UseSliderReturn;
+
+export declare function useVirtualList(options: UseVirtualListOptions): UseVirtualListResult;
+
+export declare interface UseVirtualListOptions {
+    itemCount: number;
+    itemHeight: number | ((index: number) => number);
+    overscan?: number;
+    containerRef: default_2.RefObject<HTMLElement>;
+}
+
+export declare interface UseVirtualListResult {
+    virtualItems: VirtualItem[];
+    totalSize: number;
+    scrollToIndex: (index: number) => void;
+}
+
+/**
+ * Hook for custom wheel picker implementations
+ *
+ * @example
+ * ```tsx
+ * const picker = useWheelPicker({
+ *   items: [
+ *     { value: '1', label: 'Option 1' },
+ *     { value: '2', label: 'Option 2' },
+ *   ],
+ *   defaultValue: '1',
+ *   onChange: (value) => console.log(value)
+ * });
+ *
+ * return (
+ *   <div ref={picker.containerRef}>
+ *     {items.map((item, i) => (
+ *       <div key={item.value} onClick={() => picker.scrollToIndex(i)}>
+ *         {item.label}
+ *       </div>
+ *     ))}
+ *   </div>
+ * );
+ * ```
+ */
+export declare function useWheelPicker<T = string>(options: UseWheelPickerOptions<T>): UseWheelPickerReturn<T>;
+
+/**
+ * Wheel hook options
+ */
+export declare interface UseWheelPickerOptions<T = string> {
+    items: PickerItem<T>[];
+    defaultValue?: T;
+    value?: T;
+    onChange?: (value: T, item: PickerItem<T>) => void;
+    itemHeight?: number;
+    visibleItems?: number;
+    loop?: boolean;
+}
+
+/**
+ * Wheel hook return
+ */
+export declare interface UseWheelPickerReturn<T = string> {
+    selectedValue: T | undefined;
+    selectedIndex: number;
+    setSelectedIndex: (index: number) => void;
+    scrollToIndex: (index: number, animated?: boolean) => void;
+    containerRef: default_2.RefObject<HTMLDivElement>;
+}
+
+/**
+ * Simple one-off vibration
+ */
+export declare function vibrate(duration?: number): boolean;
+
+/**
+ * Vibration pattern type
+ */
+export declare type VibrationPattern = number | number[];
+
+export declare interface VirtualItem {
+    index: number;
+    start: number;
+    size: number;
+    end: number;
+}
+
+/**
+ * Day of week (0 = Sunday, 6 = Saturday)
+ */
+export declare type WeekStartDay = 0 | 1 | 2 | 3 | 4 | 5 | 6;
+
+/**
+ * Higher-order component that adds haptics prop
+ */
+export declare function withHaptics<P extends object>(Component: default_2.ComponentType<P & {
+    haptics: UseHapticsReturn;
+}>): default_2.FC<P>;
+
+export { }