one/types/ui/TabTrigger.d.ts

One is a new React Framework that makes Vite serve both native and web.

import type { TabNavigationState } from '@react-navigation/native';
import { type ComponentProps, type ReactElement, type ReactNode } from 'react';
import { type PressableProps, type View } from 'react-native';
import type { OneRouter } from '../interfaces/router';
import type { TriggerMap } from './common';
type PressablePropsWithoutFunctionChildren = Omit<PressableProps, 'children'> & {
    children?: ReactNode | undefined;
};
export type TabTriggerProps = PressablePropsWithoutFunctionChildren & {
    /**
     *  Name of tab. When used within a `TabList` this sets the name of the tab.
     * Otherwise, this references the name.
     */
    name: string;
    /**
     * Name of tab. Required when used within a `TabList`.
     */
    href?: OneRouter.Href;
    /**
     * Forward props to child component. Useful for custom wrappers.
     */
    asChild?: boolean;
    /**
     * Resets the route when switching to a tab.
     */
    resetOnFocus?: boolean;
};
export type TabTriggerOptions = {
    name: string;
    href: OneRouter.Href;
};
export type TabTriggerSlotProps = PressablePropsWithoutFunctionChildren & React.RefAttributes<View> & {
    isFocused?: boolean;
    href?: string;
};
/**
 * Creates a trigger to navigate to a tab. When used as child of `TabList`, its
 * functionality slightly changes since the `href` prop is required,
 * and the trigger also defines what routes are present in the `Tabs`.
 *
 * When used outside of `TabList`, this component no longer requires an `href`.
 *
 * @example
 * ```tsx
 * <Tabs>
 *  <TabSlot />
 *  <TabList>
 *   <TabTrigger name="home" href="/" />
 *  </TabList>
 * </Tabs>
 * ```
 */
export declare function TabTrigger({ asChild, name, href, resetOnFocus, ...props }: TabTriggerProps): import("react/jsx-runtime").JSX.Element;
/**
 * @hidden
 */
export declare function isTabTrigger(child: ReactElement<any>): child is ReactElement<ComponentProps<typeof TabTrigger>>;
/**
 * Options for `switchTab` function.
 */
export type SwitchToOptions = {
    /**
     * Navigate and reset the history on route focus.
     */
    resetOnFocus?: boolean;
};
export type Trigger = TriggerMap[string] & {
    isFocused: boolean;
    resolvedHref: string;
    route: TabNavigationState<any>['routes'][number];
};
export type UseTabTriggerResult = {
    switchTab: (name: string, options: SwitchToOptions) => void;
    getTrigger: (name: string) => Trigger | undefined;
    trigger?: Trigger;
    triggerProps: TriggerProps;
};
export type TriggerProps = {
    isFocused: boolean;
    onPress: PressableProps['onPress'];
    onLongPress: PressableProps['onLongPress'];
};
/**
 * Utility hook creating custom `TabTrigger`.
 */
export declare function useTabTrigger(options: TabTriggerProps): UseTabTriggerResult;
export {};
//# sourceMappingURL=TabTrigger.d.ts.map