@payfit/unity-components
Version:
262 lines (261 loc) • 6.58 kB
TypeScript
import { VariantProps } from '@payfit/unity-themes';
import { PropsWithChildren, ReactNode } from 'react';
import { ButtonProps as AriaButtonProps } from 'react-aria-components/Button';
import { DataAttributes } from '../../../types/DataAttributes.js';
export declare const navItemBase: import('tailwind-variants').TVReturnType<{
level: {
0: string;
1: string;
};
isDisabled: {
true: {
base: string;
label: string;
};
false: string;
};
}, {
base: string[];
prefix: string;
suffix: string;
label: string[];
}, undefined, {
level: {
0: string;
1: string;
};
isDisabled: {
true: {
base: string;
label: string;
};
false: string;
};
}, {
base: string[];
prefix: string;
suffix: string;
label: string[];
}, import('tailwind-variants').TVReturnType<{
level: {
0: string;
1: string;
};
isDisabled: {
true: {
base: string;
label: string;
};
false: string;
};
}, {
base: string[];
prefix: string;
suffix: string;
label: string[];
}, undefined, unknown, unknown, undefined>>;
declare const navItem: import('tailwind-variants').TVReturnType<{
isActive: {
true: {
base: string[];
prefix: string[];
label: string;
};
false: {
base: string;
prefix: string;
label: string;
};
};
}, undefined, undefined, {
level: {
0: string;
1: string;
};
isDisabled: {
true: {
base: string;
label: string;
};
false: string;
};
}, {
base: string[];
prefix: string;
suffix: string;
label: string[];
}, import('tailwind-variants').TVReturnType<{
level: {
0: string;
1: string;
};
isDisabled: {
true: {
base: string;
label: string;
};
false: string;
};
}, {
base: string[];
prefix: string;
suffix: string;
label: string[];
}, undefined, {
level: {
0: string;
1: string;
};
isDisabled: {
true: {
base: string;
label: string;
};
false: string;
};
}, {
base: string[];
prefix: string;
suffix: string;
label: string[];
}, import('tailwind-variants').TVReturnType<{
level: {
0: string;
1: string;
};
isDisabled: {
true: {
base: string;
label: string;
};
false: string;
};
}, {
base: string[];
prefix: string;
suffix: string;
label: string[];
}, undefined, unknown, unknown, undefined>>>;
export type NavItemProps = Pick<VariantProps<typeof navItem>, 'level'> & PropsWithChildren<{
/** The prefix element to be displayed before the label. */
prefix?: ({ isCurrent }: {
isCurrent: boolean;
}) => ReactNode;
/** The suffix element to be displayed after the label. */
suffix?: ReactNode;
/** The click event handler for the nav item. Use it when the item executes an action that does not redirect to another page */
onPress?: AriaButtonProps['onPress'];
/** The URL to navigate to when the nav item is clicked. Use it when the item should trigger a navigation to another page */
href?: string;
/** Whether the nav item is currently active. */
isCurrent?: boolean;
/** Whether the nav item is disabled. */
isDisabled?: boolean;
/** Whether the nav item should exactly match the route's path. */
isExact?: boolean;
}> & DataAttributes;
/**
* The `RawNavItem` component represents a single, fully accessible navigation item in a `Nav` component, with support for custom elements at the start or the end of the element. It can render a link or a button depending on the provided properties.
*/
export declare const RawNavItem: import('react').ForwardRefExoticComponent<Pick<VariantProps<import('tailwind-variants').TVReturnType<{
isActive: {
true: {
base: string[];
prefix: string[];
label: string;
};
false: {
base: string;
prefix: string;
label: string;
};
};
}, undefined, undefined, {
level: {
0: string;
1: string;
};
isDisabled: {
true: {
base: string;
label: string;
};
false: string;
};
}, {
base: string[];
prefix: string;
suffix: string;
label: string[];
}, import('tailwind-variants').TVReturnType<{
level: {
0: string;
1: string;
};
isDisabled: {
true: {
base: string;
label: string;
};
false: string;
};
}, {
base: string[];
prefix: string;
suffix: string;
label: string[];
}, undefined, {
level: {
0: string;
1: string;
};
isDisabled: {
true: {
base: string;
label: string;
};
false: string;
};
}, {
base: string[];
prefix: string;
suffix: string;
label: string[];
}, import('tailwind-variants').TVReturnType<{
level: {
0: string;
1: string;
};
isDisabled: {
true: {
base: string;
label: string;
};
false: string;
};
}, {
base: string[];
prefix: string;
suffix: string;
label: string[];
}, undefined, unknown, unknown, undefined>>>>, "level"> & {
/** The prefix element to be displayed before the label. */
prefix?: ({ isCurrent }: {
isCurrent: boolean;
}) => ReactNode;
/** The suffix element to be displayed after the label. */
suffix?: ReactNode;
/** The click event handler for the nav item. Use it when the item executes an action that does not redirect to another page */
onPress?: AriaButtonProps["onPress"];
/** The URL to navigate to when the nav item is clicked. Use it when the item should trigger a navigation to another page */
href?: string;
/** Whether the nav item is currently active. */
isCurrent?: boolean;
/** Whether the nav item is disabled. */
isDisabled?: boolean;
/** Whether the nav item should exactly match the route's path. */
isExact?: boolean;
} & {
children?: ReactNode | undefined;
} & DataAttributes & import('react').RefAttributes<HTMLElement>>;
export {};