Hooks & Utilities

/**
 * Hook for managing disclosure state (open/close)
 * @param defaultIsOpen - Initial open state
 * @returns Disclosure state and control functions
 */
function useDisclose(defaultIsOpen?: boolean): DisclosureReturn;

interface DisclosureReturn {
  isOpen: boolean;
  onClose: () => void;
  onOpen: () => void;
  onToggle: () => void;
}

import { useDisclose, Modal, Button } from "native-base";

function DisclosureExample() {
  const { isOpen, onOpen, onClose } = useDisclose();
  
  return (
    <>
      <Button onPress={onOpen}>Open Modal</Button>
      <Modal isOpen={isOpen} onClose={onClose}>
        <Modal.Content>
          <Modal.Header>Modal Title</Modal.Header>
          <Modal.Body>Modal content</Modal.Body>
        </Modal.Content>
      </Modal>
    </>
  );
}

/**
 * Hook for managing controllable state patterns
 * @param props - Controllable state configuration
 * @returns State value and setter function
 */
function useControllableState<T>(props: ControllableStateProps<T>): [T, (value: T) => void];

/**
 * Hook for managing controllable prop patterns
 * @param props - Controllable prop configuration
 * @returns Resolved prop value
 */
function useControllableProp<T>(props: ControllablePropProps<T>): T;

interface ControllableStateProps<T> {
  value?: T;
  defaultValue?: T;
  onChange?: (value: T) => void;
}

interface ControllablePropProps<T> {
  value?: T;
  defaultValue?: T;
  onChange?: (value: T) => void;
}

/**
 * Hook for selecting values based on current breakpoint
 * @param values - Responsive value object or array
 * @returns Value for current breakpoint
 */
function useBreakpointValue<T>(values: ResponsiveValue<T>): T;

type ResponsiveValue<T> = 
  | T 
  | T[] 
  | { 
      base?: T; 
      sm?: T; 
      md?: T; 
      lg?: T; 
      xl?: T; 
      '2xl'?: T; 
    };

import { useBreakpointValue, Text } from "native-base";

function ResponsiveText() {
  const fontSize = useBreakpointValue({
    base: "sm",
    sm: "md",
    md: "lg",
    lg: "xl"
  });
  
  return <Text fontSize={fontSize}>Responsive text size</Text>;
}

/**
 * Hook for media query matching
 * @param query - Media query string or array of queries
 * @returns Array of boolean values indicating query matches
 */
function useMediaQuery(query: string | string[]): boolean[];

import { useMediaQuery, Box, Text } from "native-base";

function MediaQueryExample() {
  const [isLargeScreen, isMediumScreen] = useMediaQuery([
    "(min-width: 768px)",
    "(min-width: 480px) and (max-width: 767px)"
  ]);
  
  return (
    <Box>
      {isLargeScreen && <Text>Large screen content</Text>}
      {isMediumScreen && <Text>Medium screen content</Text>}
    </Box>
  );
}

/**
 * Hook for detecting if screen reader is enabled
 * @returns Boolean indicating screen reader status
 */
function useScreenReaderEnabled(): boolean;

/**
 * Hook for calculating accessible contrast text color
 * @param backgroundColor - Background color to contrast against
 * @returns Accessible text color (light or dark)
 */
function useContrastText(backgroundColor: string): string;

/**
 * Hook for accessing safe area insets
 * @returns Safe area inset values
 */
function useSafeArea(): SafeAreaReturn;

interface SafeAreaReturn {
  top: number;
  right: number;
  bottom: number;
  left: number;
}

/**
 * Hook for keyboard bottom inset handling
 * @returns Keyboard bottom inset value
 */
function useKeyboardBottomInset(): number;

/**
 * Hook for measuring component layout
 * @returns Layout measurement utilities
 */
function useLayout(): LayoutReturn;

interface LayoutReturn {
  onLayout: (event: any) => void;
  layout: {
    x: number;
    y: number;
    width: number;
    height: number;
  };
}

/**
 * Hook for clipboard operations
 * @param value - Value to copy to clipboard
 * @param timeout - Reset timeout in milliseconds
 * @returns Clipboard utilities and state
 */
function useClipboard(value: string, timeout?: number): ClipboardReturn;

interface ClipboardReturn {
  value: string;
  onCopy: () => void;
  hasCopied: boolean;
}

import { useClipboard, Button, Text, HStack } from "native-base";

function ClipboardExample() {
  const { onCopy, hasCopied } = useClipboard("https://example.com");
  
  return (
    <HStack space={2} alignItems="center">
      <Text>https://example.com</Text>
      <Button onPress={onCopy}>
        {hasCopied ? "Copied!" : "Copy"}
      </Button>
    </HStack>
  );
}

/**
 * Hook for applying styled system properties
 * @param sx - Style object with theme-aware properties
 * @returns Resolved style properties
 */
function useSx(sx: SxProps): any;

interface SxProps extends StyledProps {
  [key: string]: any;
}

/**
 * Hook for resolving styled system props
 * @param props - Props object to resolve
 * @returns Resolved styled props
 */
function useStyledSystemPropsResolver(props: any): any;

/**
 * Hook for keyboard dismissal management
 * @returns Keyboard dismissal utilities
 */
function useKeyboardDismissable(): KeyboardDismissReturn;

/**
 * Keyboard dismiss handler manager
 */
const keyboardDismissHandlerManager: {
  addHandler: (handler: () => void) => void;
  removeHandler: (handler: () => void) => void;
  dismissKeyboard: () => void;
};

interface KeyboardDismissReturn {
  dismiss: () => void;
  isKeyboardVisible: boolean;
}

/**
 * Check if DOM is available (for web compatibility)
 * @returns Boolean indicating DOM availability
 */
function canUseDom(): boolean;

/**
 * Merge multiple React refs into a single ref callback
 * @param refs - Array of refs to merge
 * @returns Merged ref callback function
 */
function mergeRefs<T>(...refs: React.Ref<T>[]): React.RefCallback<T>;

/**
 * Compose multiple event handlers into a single handler
 * @param handlers - Array of event handler functions
 * @returns Composed event handler
 */
function composeEventHandlers<T>(...handlers: Array<(event: T) => void>): (event: T) => void;

/**
 * Create a context with proper error handling
 * @param name - Context name for error messages
 * @param strict - Whether to throw error when context is undefined
 * @returns Context and useContext hook
 */
function createContext<T>(name: string, strict?: boolean): [React.Context<T>, () => T];

/**
 * Add spacing between child components
 * @param children - React children to space
 * @param space - Space value between children
 * @returns Children with spacing elements inserted
 */
function getSpacedChildren(children: React.ReactNode, space: any): React.ReactNode[];

/**
 * Get absolutely positioned children
 * @param children - React children to process
 * @returns Filtered absolutely positioned children
 */
function getAbsoluteChildren(children: React.ReactNode): React.ReactNode[];

/**
 * Get attached children for component composition
 * @param children - React children to process
 * @returns Processed attached children
 */
function getAttachedChildren(children: React.ReactNode): React.ReactNode[];

/**
 * Wrap string children with text components
 * @param child - Child element to process
 * @returns Wrapped child element
 */
function wrapStringChild(child: React.ReactNode): React.ReactNode;

/**
 * Add text properties to string children
 * @param children - Children to process
 * @param props - Props to add to text elements
 * @returns Enhanced children with text props
 */
function addTextAndPropsToStrings(children: React.ReactNode, props: any): React.ReactNode;

/**
 * Check if object is empty
 * @param obj - Object to check
 * @returns Boolean indicating if object is empty
 */
function isEmptyObj(obj: any): boolean;

/**
 * Combine context values with component props
 * @param context - Context values
 * @param props - Component props
 * @returns Combined props object
 */
function combineContextAndProps(context: any, props: any): any;

/**
 * Generate appropriate ARIA attribute value
 * @param condition - Boolean condition for attribute
 * @returns Appropriate ARIA attribute value
 */
function ariaAttr(condition: boolean): boolean | undefined;

/**
 * Resolve stack style input for spacing and layout
 * @param input - Style input to resolve
 * @returns Resolved style properties
 */
function resolveStackStyleInput(input: any): any;

/**
 * Get style element for web styling
 * @returns Style element or null
 */
function getStyleElement(): HTMLStyleElement | null;

/**
 * Hook for comprehensive props resolution with theme integration
 * @param props - Props to resolve
 * @returns Resolved props with theme values
 */
function usePropsResolution(props: any): any;

/**
 * Hook for props resolution testing and debugging
 * @param props - Props to test resolution for
 * @returns Resolution test results
 */
function usePropsResolutionTest(props: any): any;