dgz-ui
Version:
Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript
48 lines • 2.53 kB
TypeScript
import * as TabsPrimitive from '@radix-ui/react-tabs';
import { type VariantProps } from 'class-variance-authority';
import { type ComponentPropsWithoutRef } from 'react';
/**
* Tabs root component from Radix UI.
* Combines with TabsList, TabsTrigger, and TabsContent to build tabbed interfaces.
*/
declare const Tabs: import("react").ForwardRefExoticComponent<TabsPrimitive.TabsProps & import("react").RefAttributes<HTMLDivElement>>;
declare const tabsListVariants: (props?: ({
type?: "default" | "line" | "segmented" | null | undefined;
variant?: "default" | "soft" | null | undefined;
rounded?: "default" | "pill" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
/**
* Props for TabsList component.
* Extends Radix Tabs.List props and supports visual variants and behavior flags.
*
* @property {'default'|'segmented'|'line'} [type] - Visual style of the list.
* @property {'default'|'soft'} [variant] - Coloring variant.
* @property {'default'|'pill'} [rounded] - Border radius style.
* @property {true} [full] - If provided, makes the list expand to full width.
* @property {true} [scrollable] - Enables horizontal scroll with navigation buttons.
* @property {string} [scrollButtonClassName] - Additional classes for scroll buttons.
*/
export interface TabsListProps extends ComponentPropsWithoutRef<typeof TabsPrimitive.List>, VariantProps<typeof tabsListVariants> {
full?: true;
scrollable?: true;
scrollButtonClassName?: string;
}
/**
* Displays a list of tab triggers with optional segmented, line, and scrollable variants.
* When scrollable, left/right buttons appear when content overflows.
*
* @component
*/
declare const TabsList: import("react").ForwardRefExoticComponent<TabsListProps & import("react").RefAttributes<HTMLDivElement>>;
/**
* A single tab trigger/button.
* Forwards refs to Radix Tabs.Trigger.
*/
declare const TabsTrigger: import("react").ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
/**
* Content panel associated with a TabsTrigger.
* Forwards refs to Radix Tabs.Content.
*/
declare const TabsContent: import("react").ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
export { Tabs, TabsList, TabsTrigger, TabsContent };
//# sourceMappingURL=tabs.d.ts.map