@phsa.tec/design-system-react 0.3.1 → 0.4.0

package/dist/index.d.mts

@@ -1,499 +1,1916 @@
 import * as React$1 from 'react';
-import React__default, { PropsWithChildren } from 'react';
-import { ColumnDef, SortingState, VisibilityState } from '@tanstack/react-table';
 import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as class_variance_authority from 'class-variance-authority';
 import { VariantProps } from 'class-variance-authority';
-import * as AvatarPrimitive from '@radix-ui/react-avatar';
-import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
-import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
-import { NumericFormatProps } from 'react-number-format';
-import * as react_hook_form from 'react-hook-form';
-import { FieldValues, FieldPath, ControllerProps } from 'react-hook-form';
-export { useFormContext } from 'react-hook-form';
-import * as _radix_ui_react_slot from '@radix-ui/react-slot';
-import * as LabelPrimitive from '@radix-ui/react-label';
-import * as SelectPrimitive from '@radix-ui/react-select';
+import { Column, Row, Table as Table$2, ColumnDef } from '@tanstack/react-table';
+import { NumericFormatProps, PatternFormatProps } from 'react-number-format';
 import * as SwitchPrimitives from '@radix-ui/react-switch';
-import * as DialogPrimitive from '@radix-ui/react-dialog';
-import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
-import * as vaul from 'vaul';
-import { Drawer as Drawer$1 } from 'vaul';
-import * as SeparatorPrimitive from '@radix-ui/react-separator';
-import * as ToastPrimitives from '@radix-ui/react-toast';
+import * as PopoverPrimitive from '@radix-ui/react-popover';
+import { DayPicker, DayPickerProps, DateRange } from 'react-day-picker';
+import { Dialog as Dialog$2 } from 'radix-ui';
+import * as sonner from 'sonner';
+import { Toaster as Toaster$2 } from 'sonner';
+export { ToastT, toast } from 'sonner';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+export { IconType } from 'react-icons';
 
-interface DynamicTableProps<TData> {
-    data: TData[];
-    columns: ColumnDef<TData>[];
-    className?: string;
-    toolbar?: React.ReactNode;
-    pagination?: boolean;
-    sorting?: boolean;
-    columnVisibility?: boolean;
-    filters?: React.ReactNode;
-    rowsPerPage?: number[];
-    defaultSort?: SortingState;
-    defaultVisibility?: VisibilityState;
+declare const buttonVariants: (props?: ({
+    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ButtonProps$1 extends React$1.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
 }
+declare const Button$1: React$1.ForwardRefExoticComponent<ButtonProps$1 & React$1.RefAttributes<HTMLButtonElement>>;
 
-declare function DynamicTable<TData>({ data, columns, className, toolbar, pagination: showPagination, sorting: showSorting, columnVisibility: showColumnVisibility, filters, rowsPerPage, defaultSort, defaultVisibility, }: DynamicTableProps<TData>): React$1.JSX.Element;
-
-interface Column<T> {
-    header: string;
-    accessorKey: keyof T;
-    cell?: (row: T) => React.ReactNode;
-    sortable?: boolean;
-    filterable?: boolean;
-}
-interface TableProps<T> {
-    data: T[];
-    columns: Column<T>[];
-    className?: string;
-    filters?: React.ReactNode;
-    onSort?: (field: keyof T, direction: "asc" | "desc") => void;
+type ButtonProps = ButtonProps$1;
+/**
+ * Botão padrão do Design System.
+ * Reexporta o primitivo do shadcn com a mesma API.
+ */
+declare const Button: React$1.ForwardRefExoticComponent<ButtonProps$1 & React$1.RefAttributes<HTMLButtonElement>>;
+interface ButtonIconProps extends Omit<ButtonProps, "children" | "size"> {
+    /**
+     * Nome do ícone do `react-icons` que será renderizado dentro do botão.
+     * Exemplo: "MdHome", "FiUser", "FaHeart".
+     */
+    iconName: string;
+    /**
+     * Cor do ícone. Valor CSS direto (ex: `"#fff"`, `"red"`).
+     * Encaminhada para a prop `color` do componente `Icon`.
+     */
+    iconColor?: string;
+    /**
+     * Classes CSS do Tailwind para estilizar o ícone.
+     * Exemplo: `iconClassName="text-white"`, `iconClassName="text-primary"`.
+     * Encaminhada para a prop `className` do componente `Icon`.
+     */
+    iconClassName?: string;
+    /**
+     * Texto acessível para leitores de tela.
+     * Use quando o botão não tiver label de texto visível.
+     */
+    "aria-label": string;
+    /**
+     * Define se o botão deve ser apenas ícone (circular) ou ícone + texto.
+     * - `true`: usa `size="icon"` e não renderiza children
+     * - `false`: renderiza ícone seguido do children
+     * @default true
+     */
+    iconOnly?: boolean;
 }
+/**
+ * Variação de botão com ícone.
+ *
+ * - `iconOnly=true`: renderiza somente o ícone, usando o tamanho `icon` do botão.
+ * - `iconOnly=false`: renderiza ícone + children, usando o tamanho padrão do botão.
+ *
+ * @example
+ * <ButtonIcon iconName="MdHome" iconColor="#fff" aria-label="Ir para home" />
+ * <ButtonIcon iconName="FiUser" iconOnly={false} iconClassName="text-primary" aria-label="Perfil do usuário">
+ *   Perfil
+ * </ButtonIcon>
+ */
+declare const ButtonIcon: ({ iconName, iconColor, iconClassName, iconOnly, className, children, "aria-label": ariaLabel, size, ...rest }: ButtonIconProps & {
+    children?: React$1.ReactNode;
+    size?: ButtonProps["size"];
+}) => React$1.JSX.Element;
 
-declare const badgeVariants: (props?: ({
-    variant?: "default" | "destructive" | "outline" | "secondary" | "success" | "warning" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-interface BadgeProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
+interface IconProps extends Omit<React$1.SVGProps<SVGSVGElement>, "ref"> {
+    /**
+     * Nome do ícone do `react-icons` como string.
+     * Exemplos: "MdHome", "FiUser", "FaHeart", "Hi2ArrowRight", etc.
+     * O componente identifica automaticamente a biblioteca baseado no prefixo.
+     */
+    iconName: string;
+    /**
+     * Tamanho do ícone em pixels ou qualquer valor CSS válido.
+     * Atalho para a prop `size` do `react-icons`.
+     * @default 20
+     */
+    size?: number | string;
+    /**
+     * Texto descritivo para acessibilidade.
+     * Se informado, o ícone terá `role="img"` e `aria-label`.
+     * Se omitido, o ícone será decorativo (`aria-hidden="true"`).
+     */
+    "aria-label"?: string;
 }
-declare function Badge({ className, variant, ...props }: BadgeProps): React$1.JSX.Element;
-
-type IconProps = {
-    name: string;
-    size?: number;
-    className?: string;
-    color?: string;
-};
-
-declare const Icon: React__default.FC<IconProps>;
-
-declare const Avatar: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & React$1.RefAttributes<HTMLSpanElement>, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
-declare const AvatarImage: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React$1.RefAttributes<HTMLImageElement>, "ref"> & React$1.RefAttributes<HTMLImageElement>>;
-declare const AvatarFallback: React$1.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & React$1.RefAttributes<HTMLSpanElement>, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
-
-declare const DropdownMenu: React$1.FC<DropdownMenuPrimitive.DropdownMenuProps>;
-declare const DropdownMenuTrigger: React$1.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
-declare const DropdownMenuGroup: React$1.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React$1.RefAttributes<HTMLDivElement>>;
-declare const DropdownMenuPortal: React$1.FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
-declare const DropdownMenuSub: React$1.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
-declare const DropdownMenuRadioGroup: React$1.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & React$1.RefAttributes<HTMLDivElement>>;
-declare const DropdownMenuSubTrigger: React$1.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
-    inset?: boolean;
-} & React$1.RefAttributes<HTMLDivElement>>;
-declare const DropdownMenuSubContent: React$1.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare const DropdownMenuContent: React$1.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare const DropdownMenuItem: React$1.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
-    inset?: boolean;
-} & React$1.RefAttributes<HTMLDivElement>>;
-declare const DropdownMenuCheckboxItem: React$1.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare const DropdownMenuRadioItem: React$1.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuRadioItemProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare const DropdownMenuLabel: React$1.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
-    inset?: boolean;
-} & React$1.RefAttributes<HTMLDivElement>>;
-declare const DropdownMenuSeparator: React$1.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare const DropdownMenuShortcut: {
-    ({ className, ...props }: React$1.HTMLAttributes<HTMLSpanElement>): React$1.JSX.Element;
+/**
+ * Componente de ícone genérico do Design System.
+ *
+ * Ele padroniza o uso de `react-icons` na aplicação, garantindo
+ * tamanho, acessibilidade e extensibilidade consistentes.
+ *
+ * A cor do ícone pode ser controlada via:
+ * - Prop `color` (valor CSS direto, ex: `color="#000"`, `color="red"`)
+ * - Classes Tailwind CSS no `className` (ex: `className="text-primary"`, `className="text-red-500"`)
+ *
+ * @example
+ * ```tsx
+ * <Icon iconName="MdHome" size={24} color="#000" aria-label="Página inicial" />
+ * <Icon iconName="FiUser" size={20} className="text-red-500" />
+ * <Icon iconName="Fa6Heart" size={16} aria-label="Favorito" />
+ * ```
+ */
+declare const Icon: {
+    ({ iconName, size, className, "aria-label": ariaLabel, ...rest }: IconProps): React$1.JSX.Element | null;
     displayName: string;
 };
 
-interface DataPairListProps {
-    title?: string;
-    data: Record<string, string | number | undefined>;
-    labels?: Record<string, string>;
-    className?: string;
-    infoDirection?: "vertical" | "horizontal";
-    direction?: "vertical" | "horizontal";
-    withBorder?: boolean;
-    header?: React.ReactNode;
-}
-
-declare const DataPairList: ({ title, data, labels, className, infoDirection, direction, withBorder, header, }: DataPairListProps) => React__default.JSX.Element | null;
-
-declare const textVariants: (props?: ({
-    variant?: "title" | "caption" | "display" | "subtitle" | "normal" | "muted" | null | undefined;
-    align?: "left" | "center" | "right" | "justify" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-type TextProps = VariantProps<typeof textVariants> & {
-    className?: string;
-    children: React.ReactNode;
-};
-declare function Text({ variant, align, className, children, }: TextProps): React$1.JSX.Element;
-
-type CardProps = {
-    title?: string;
-    description?: string;
-    footer?: () => React__default.ReactNode;
-    children?: React__default.ReactNode;
-};
-declare const Card$1: ({ title, children, description, footer, }: CardProps) => React__default.JSX.Element;
+declare const Card$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+declare const CardHeader$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+declare const CardTitle$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+declare const CardDescription$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+declare const CardContent$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+declare const CardFooter$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
 
-declare const Card: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * Card raiz (primitivo) baseado no shadcn.
+ *
+ * Use quando precisar de controle total sobre a estrutura do card.
+ */
+declare const CardRoot: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+type CardRootProps = React$1.ComponentProps<typeof Card$1>;
+/**
+ * Cabeçalho do Card (primitivo).
+ *
+ * Normalmente contém `CardTitle` e `CardDescription`.
+ */
 declare const CardHeader: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+type CardHeaderProps = React$1.ComponentProps<typeof CardHeader$1>;
+/**
+ * Título do Card (primitivo).
+ */
 declare const CardTitle: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+type CardTitleProps = React$1.ComponentProps<typeof CardTitle$1>;
+/**
+ * Descrição do Card (primitivo).
+ */
 declare const CardDescription: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+type CardDescriptionProps = React$1.ComponentProps<typeof CardDescription$1>;
+/**
+ * Conteúdo principal do Card (primitivo).
+ */
 declare const CardContent: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+type CardContentProps = React$1.ComponentProps<typeof CardContent$1>;
+/**
+ * Rodapé do Card (primitivo).
+ *
+ * Ideal para ações (botões) ou informações complementares.
+ */
 declare const CardFooter: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+type CardFooterProps = React$1.ComponentProps<typeof CardFooter$1>;
+interface CardProps extends Omit<CardRootProps, "children" | "title"> {
+    /**
+     * Imagem ou mídia a ser exibida no topo do card.
+     * Pode ser uma URL de imagem, um elemento React, ou qualquer conteúdo.
+     */
+    image?: React$1.ReactNode;
+    /**
+     * Título do card.
+     * Quando informado, é renderizado dentro de `CardHeader` usando `CardTitle`.
+     */
+    title?: React$1.ReactNode;
+    /**
+     * Badge ou tag a ser exibida ao lado do título (ex: "Featured", "Novo", etc.).
+     * Renderizado no mesmo nível do título, alinhado à direita.
+     */
+    badge?: React$1.ReactNode;
+    /**
+     * Descrição do card.
+     * Quando informada, é renderizada dentro de `CardHeader` usando `CardDescription`.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Conteúdo principal do card.
+     * Renderizado dentro de `CardContent`.
+     */
+    children?: React$1.ReactNode;
+    /**
+     * Conteúdo do rodapé do card.
+     * Renderizado dentro de `CardFooter` (ex: botões de ação).
+     */
+    footer?: React$1.ReactNode;
+}
+/**
+ * Card padrão do Design System.
+ *
+ * Fornece uma estrutura de layout comum:
+ * - Imagem/mídia opcional no topo (`image`)
+ * - Header opcional com `title`, `badge` e `description`
+ * - Content com `children`
+ * - Footer opcional com `footer`
+ *
+ * Quando precisar de mais flexibilidade, use os primitivos:
+ * `CardRoot`, `CardHeader`, `CardTitle`, `CardDescription`, `CardContent`, `CardFooter`.
+ */
+declare const Card: ({ image, title, badge, description, children, footer, ...rest }: CardProps) => React$1.JSX.Element;
 
-type CheckboxProps$1 = React$1.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>;
-
-type CheckboxProps = CheckboxProps$1 & {
-    label: string;
-    error?: string;
-    withoutForm?: boolean;
-};
-declare const Checkbox: ({ label, error, withoutForm, ...props }: CheckboxProps) => React$1.JSX.Element;
-
-type InputProps$1 = React$1.ComponentProps<"input">;
-
-type InputBaseProps = InputProps$1 & {
-    onChangeText?: (text: string) => void;
-    mask?: string | string[];
-    "data-testid"?: string;
-};
+declare const Table$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLTableElement> & React$1.RefAttributes<HTMLTableElement>>;
+declare const TableHeader$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLTableSectionElement> & React$1.RefAttributes<HTMLTableSectionElement>>;
+declare const TableBody$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLTableSectionElement> & React$1.RefAttributes<HTMLTableSectionElement>>;
+declare const TableRow$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLTableRowElement> & React$1.RefAttributes<HTMLTableRowElement>>;
+declare const TableHead$1: React$1.ForwardRefExoticComponent<React$1.ThHTMLAttributes<HTMLTableCellElement> & React$1.RefAttributes<HTMLTableCellElement>>;
+declare const TableCell$1: React$1.ForwardRefExoticComponent<React$1.TdHTMLAttributes<HTMLTableCellElement> & React$1.RefAttributes<HTMLTableCellElement>>;
 
-type InputProps = Omit<InputBaseProps, "children"> & {
-    component?: React.ReactNode;
-    error?: string;
-    withoutForm?: boolean;
-    label?: string;
-    leftIcon?: React.ReactNode;
-    rightIcon?: React.ReactNode;
-    helperText?: string;
-    floatingLabel?: boolean;
-    "data-testid"?: string;
-    extraElement?: React.ReactNode;
+/**
+ * Table raiz (primitivo) baseado no shadcn.
+ */
+declare const Table: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLTableElement> & React$1.RefAttributes<HTMLTableElement>>;
+type TableProps = React$1.ComponentProps<typeof Table$1>;
+/**
+ * TableHeader (primitivo).
+ */
+declare const TableHeader: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLTableSectionElement> & React$1.RefAttributes<HTMLTableSectionElement>>;
+type TableHeaderProps = React$1.ComponentProps<typeof TableHeader$1>;
+/**
+ * TableBody (primitivo).
+ */
+declare const TableBody: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLTableSectionElement> & React$1.RefAttributes<HTMLTableSectionElement>>;
+type TableBodyProps = React$1.ComponentProps<typeof TableBody$1>;
+/**
+ * TableRow (primitivo).
+ */
+declare const TableRow: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLTableRowElement> & React$1.RefAttributes<HTMLTableRowElement>>;
+type TableRowProps = React$1.ComponentProps<typeof TableRow$1>;
+/**
+ * TableHead (primitivo).
+ */
+declare const TableHead: React$1.ForwardRefExoticComponent<React$1.ThHTMLAttributes<HTMLTableCellElement> & React$1.RefAttributes<HTMLTableCellElement>>;
+type TableHeadProps = React$1.ComponentProps<typeof TableHead$1>;
+/**
+ * TableCell (primitivo).
+ */
+declare const TableCell: React$1.ForwardRefExoticComponent<React$1.TdHTMLAttributes<HTMLTableCellElement> & React$1.RefAttributes<HTMLTableCellElement>>;
+type TableCellProps = React$1.ComponentProps<typeof TableCell$1>;
+interface DataTableColumnHeaderProps<TData, TValue> extends React$1.HTMLAttributes<HTMLDivElement> {
+    column: Column<TData, TValue>;
+    title: string;
+}
+/**
+ * Componente de cabeçalho de coluna com ordenação.
+ */
+declare function DataTableColumnHeader<TData, TValue>({ column, title, className, }: DataTableColumnHeaderProps<TData, TValue>): React$1.JSX.Element;
+interface DataTableRowActionsProps<TData> {
+    row: Row<TData>;
+    actions?: Array<{
+        label: string;
+        onClick: (row: TData) => void;
+        icon?: React$1.ReactNode;
+        variant?: "default" | "destructive";
+    }>;
+}
+/**
+ * Componente de ações da linha (menu dropdown).
+ */
+declare function DataTableRowActions<TData>({ row, actions, }: DataTableRowActionsProps<TData>): React$1.JSX.Element | null;
+interface DataTableToolbarProps<TData> {
+    table: Table$2<TData>;
+    searchKey?: string;
+    searchPlaceholder?: string;
+    filterComponent?: React$1.ReactNode;
+    actions?: React$1.ReactNode;
+}
+/**
+ * Barra de ferramentas do DataTable (busca, filtros, visibilidade de colunas).
+ */
+declare function DataTableToolbar<TData>({ table, searchKey, searchPlaceholder, filterComponent, actions, }: DataTableToolbarProps<TData>): React$1.JSX.Element;
+interface DataTablePaginationProps<TData> {
+    table: Table$2<TData>;
+}
+/**
+ * Componente de paginação do DataTable.
+ */
+declare function DataTablePagination<TData>({ table }: DataTablePaginationProps<TData>): React$1.JSX.Element;
+interface DataTableProps<TData, TValue> {
+    /**
+     * Definições das colunas da tabela.
+     */
+    columns: ColumnDef<TData, TValue>[];
+    /**
+     * Dados da tabela.
+     */
+    data: TData[];
+    /**
+     * Chave da coluna usada para busca (opcional).
+     */
+    searchKey?: string;
+    /**
+     * Placeholder do campo de busca.
+     */
+    searchPlaceholder?: string;
+    /**
+     * Componente de filtro customizado.
+     */
+    filterComponent?: React$1.ReactNode;
+    /**
+     * Ações adicionais na toolbar.
+     */
+    toolbarActions?: React$1.ReactNode;
+    /**
+     * Ações da linha (menu dropdown).
+     */
+    rowActions?: Array<{
+        label: string;
+        onClick: (row: TData) => void;
+        icon?: React$1.ReactNode;
+        variant?: "default" | "destructive";
+    }>;
+    /**
+     * Classes CSS adicionais para a tabela.
+     */
+    className?: string;
+    /**
+     * Classes CSS adicionais para o container.
+     */
     containerClassName?: string;
-};
-
-declare const Input: ({ "data-testid": dataTestId, withoutForm, extraElement, containerClassName, ...props }: InputProps) => React$1.JSX.Element;
-
-type NumberInputProps = Omit<NumericFormatProps, "onChange"> & InputProps;
-declare const NumberInput: (props: NumberInputProps) => React$1.JSX.Element;
+    /**
+     * Mostrar toolbar (busca, filtros, etc.).
+     * @default true
+     */
+    showToolbar?: boolean;
+    /**
+     * Mostrar paginação.
+     * @default true
+     */
+    showPagination?: boolean;
+    /**
+     * Tamanho da página inicial.
+     * @default 10
+     */
+    pageSize?: number;
+}
+/**
+ * DataTable padrão do Design System.
+ *
+ * Componente de tabela completo com ordenação, filtros, busca, paginação e ações.
+ * Baseado em @tanstack/react-table.
+ *
+ * @example
+ * ```tsx
+ * import { DataTable, type ColumnDef } from "@phsa.tec/design-system-react"
+ *
+ * interface User {
+ *   id: string
+ *   name: string
+ *   email: string
+ * }
+ *
+ * const columns: ColumnDef<User>[] = [
+ *   {
+ *     accessorKey: "name",
+ *     header: "Nome",
+ *   },
+ *   {
+ *     accessorKey: "email",
+ *     header: "E-mail",
+ *   },
+ * ]
+ *
+ * function MyTable() {
+ *   const data: User[] = [
+ *     { id: "1", name: "João", email: "joao@example.com" },
+ *     { id: "2", name: "Maria", email: "maria@example.com" },
+ *   ]
+ *
+ *   return <DataTable columns={columns} data={data} searchKey="name" />
+ * }
+ * ```
+ */
+declare function DataTable<TData, TValue>({ columns, data, searchKey, searchPlaceholder, filterComponent, toolbarActions, rowActions, className, containerClassName, showToolbar, showPagination, pageSize, }: DataTableProps<TData, TValue>): React$1.JSX.Element;
 
-type MaskInputProps = {
-    mask?: string;
-} & InputProps;
-declare const MaskInput: ({ "data-testid": dataTestId, withoutForm, extraElement, mask, ...props }: MaskInputProps) => React$1.JSX.Element;
+/**
+ * Componente H1 padronizado.
+ */
+declare const H1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLHeadingElement> & React$1.RefAttributes<HTMLHeadingElement>>;
+/**
+ * Componente H2 padronizado.
+ */
+declare const H2: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLHeadingElement> & React$1.RefAttributes<HTMLHeadingElement>>;
+/**
+ * Componente H3 padronizado.
+ */
+declare const H3: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLHeadingElement> & React$1.RefAttributes<HTMLHeadingElement>>;
+/**
+ * Componente H4 padronizado.
+ */
+declare const H4: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLHeadingElement> & React$1.RefAttributes<HTMLHeadingElement>>;
+/**
+ * Componente de parágrafo padronizado.
+ */
+declare const P: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLParagraphElement> & React$1.RefAttributes<HTMLParagraphElement>>;
+/**
+ * Componente de blockquote padronizado.
+ */
+declare const Blockquote: React$1.ForwardRefExoticComponent<React$1.BlockquoteHTMLAttributes<HTMLQuoteElement> & React$1.RefAttributes<HTMLQuoteElement>>;
+/**
+ * Componente de lista não ordenada padronizada.
+ */
+declare const Ul: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLUListElement> & React$1.RefAttributes<HTMLUListElement>>;
+/**
+ * Componente de lista ordenada padronizada.
+ */
+declare const Ol: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLOListElement> & React$1.RefAttributes<HTMLOListElement>>;
+/**
+ * Componente de item de lista padronizado.
+ */
+declare const Li: React$1.ForwardRefExoticComponent<React$1.LiHTMLAttributes<HTMLLIElement> & React$1.RefAttributes<HTMLLIElement>>;
+/**
+ * Componente de código inline padronizado.
+ */
+declare const Code: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLElement> & React$1.RefAttributes<HTMLElement>>;
+/**
+ * Componente de código em bloco padronizado.
+ */
+declare const Pre: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLPreElement> & React$1.RefAttributes<HTMLPreElement>>;
+/**
+ * Componente de texto lead (destaque) padronizado.
+ */
+declare const Lead: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLParagraphElement> & React$1.RefAttributes<HTMLParagraphElement>>;
+/**
+ * Componente de texto large padronizado.
+ */
+declare const Large: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * Componente de texto small padronizado.
+ */
+declare const Small: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLElement> & React$1.RefAttributes<HTMLElement>>;
+/**
+ * Componente de texto muted padronizado.
+ */
+declare const Muted: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLParagraphElement> & React$1.RefAttributes<HTMLParagraphElement>>;
+/**
+ * Componente de tabela padronizada para uso em tipografia.
+ * Renomeado para TypographyTable para evitar conflito com Table do DataTable.
+ */
+declare const TypographyTable: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLTableElement> & React$1.RefAttributes<HTMLTableElement>>;
+/**
+ * Componente de cabeçalho de tabela padronizado para tipografia.
+ */
+declare const TypographyThead: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLTableSectionElement> & React$1.RefAttributes<HTMLTableSectionElement>>;
+/**
+ * Componente de corpo de tabela padronizado para tipografia.
+ */
+declare const TypographyTbody: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLTableSectionElement> & React$1.RefAttributes<HTMLTableSectionElement>>;
+/**
+ * Componente de linha de tabela padronizada para tipografia.
+ */
+declare const TypographyTr: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLTableRowElement> & React$1.RefAttributes<HTMLTableRowElement>>;
+/**
+ * Componente de célula de cabeçalho de tabela padronizada para tipografia.
+ */
+declare const TypographyTh: React$1.ForwardRefExoticComponent<React$1.ThHTMLAttributes<HTMLTableCellElement> & React$1.RefAttributes<HTMLTableCellElement>>;
+/**
+ * Componente de célula de tabela padronizada para tipografia.
+ */
+declare const TypographyTd: React$1.ForwardRefExoticComponent<React$1.TdHTMLAttributes<HTMLTableCellElement> & React$1.RefAttributes<HTMLTableCellElement>>;
+/**
+ * Componente Typography - Container para agrupar elementos tipográficos.
+ *
+ * Útil para aplicar estilos consistentes a um bloco de texto.
+ */
+interface TypographyProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Variante de espaçamento entre elementos.
+     * @default "normal"
+     */
+    spacing?: "tight" | "normal" | "relaxed";
+    /**
+     * Alinhamento do texto.
+     */
+    align?: "left" | "center" | "right" | "justify";
+}
+declare const Typography: React$1.ForwardRefExoticComponent<TypographyProps & React$1.RefAttributes<HTMLDivElement>>;
 
-type MultipleInputProps = MaskInputProps & {
-    data?: string[];
-    onAdd?: (data: string) => void;
-    onRemove?: (position: number) => void;
-    name: string;
-    defaultValue?: string;
-    "data-testid"?: string;
-};
-declare const MultipleInput: ({ data, onAdd, defaultValue, onRemove, withoutForm, ...props }: MultipleInputProps) => React$1.JSX.Element;
+type InputProps = React$1.ComponentProps<"input">;
+/**
+ * Campo de entrada padrão do Design System.
+ *
+ * Pode ser usado de duas formas:
+ * 1. Como input simples: <Input placeholder="..." />
+ * 2. Com Field integrado: <Input label="Nome" description="..." />
+ *
+ * Quando usado com props do Field (label, description, error), automaticamente
+ * cria o Field ao redor do input.
+ */
+interface InputWithFieldProps extends InputProps {
+    /**
+     * Label do campo. Quando fornecido, cria o Field automaticamente.
+     */
+    label?: React$1.ReactNode;
+    /**
+     * Descrição ou texto de ajuda do campo.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Mensagem de erro ou array de erros.
+     */
+    error?: React$1.ReactNode | Array<{
+        message?: string;
+    } | undefined>;
+    /**
+     * Define se o campo está inválido.
+     */
+    invalid?: boolean;
+    /**
+     * Orientação do Field (vertical, horizontal, responsive).
+     */
+    orientation?: "vertical" | "horizontal" | "responsive";
+    /**
+     * Classes CSS adicionais para o container do Field.
+     */
+    fieldClassName?: string;
+}
+declare const Input: React$1.ForwardRefExoticComponent<Omit<InputWithFieldProps, "ref"> & React$1.RefAttributes<HTMLInputElement>>;
+type InputFieldProps = InputWithFieldProps;
+declare const InputField: React$1.ForwardRefExoticComponent<Omit<InputWithFieldProps, "ref"> & React$1.RefAttributes<HTMLInputElement>>;
 
-type MultipleMaskInputProps = MaskInputProps & {
-    data?: string[];
-    onChangeData?: (data: string[]) => void;
+interface FormFieldProps {
+    /**
+     * Nome do campo no formulário (`react-hook-form`).
+     */
     name: string;
-};
-declare const MultipleMaskInput: ({ data, ...props }: MultipleMaskInputProps) => React$1.JSX.Element;
+    /**
+     * Rótulo visível do campo.
+     */
+    label?: React$1.ReactNode;
+    /**
+     * Texto de ajuda exibido abaixo do campo.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Props adicionais encaminhadas para o componente `Input`.
+     */
+    inputProps?: React$1.ComponentProps<typeof Input>;
+}
+/**
+ * Campo de formulário integrado ao `react-hook-form`.
+ *
+ * Combina os primitivos `Field` e `Input` do design system,
+ * exibindo automaticamente label, descrição e mensagens de erro.
+ */
+declare const FormField: ({ name, label, description, inputProps, }: FormFieldProps) => React$1.JSX.Element;
 
-declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: react_hook_form.FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React$1.JSX.Element;
-declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: ControllerProps<TFieldValues, TName>) => React$1.JSX.Element;
-declare const useFormField: () => {
-    invalid: boolean;
-    isDirty: boolean;
-    isTouched: boolean;
-    isValidating: boolean;
-    error?: react_hook_form.FieldError;
-    id: string;
-    name: string;
-    formItemId: string;
-    formDescriptionId: string;
-    formMessageId: string;
-};
-declare const FormItem: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & React$1.RefAttributes<HTMLDivElement>>;
-declare const FormLabel: React$1.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React$1.RefAttributes<HTMLLabelElement>, "ref"> & React$1.RefAttributes<HTMLLabelElement>>;
-declare const FormControl: React$1.ForwardRefExoticComponent<Omit<_radix_ui_react_slot.SlotProps & React$1.RefAttributes<HTMLElement>, "ref"> & React$1.RefAttributes<HTMLElement>>;
-declare const FormDescription: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLParagraphElement> & React$1.RefAttributes<HTMLParagraphElement>>;
-declare const FormMessage: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLParagraphElement> & React$1.RefAttributes<HTMLParagraphElement>>;
+type NumericInputBaseProps = Omit<NumericFormatProps, "customInput" | "getInputRef">;
+interface NumericInputProps extends NumericInputBaseProps {
+    /**
+     * Label do campo. Quando fornecido, cria o Field automaticamente.
+     */
+    label?: React$1.ReactNode;
+    /**
+     * Descrição ou texto de ajuda do campo.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Mensagem de erro ou array de erros.
+     */
+    error?: React$1.ReactNode | Array<{
+        message?: string;
+    } | undefined>;
+    /**
+     * Define se o campo está inválido.
+     */
+    invalid?: boolean;
+    /**
+     * Orientação do Field (vertical, horizontal, responsive).
+     */
+    orientation?: "vertical" | "horizontal" | "responsive";
+    /**
+     * Classes CSS adicionais para o container do Field.
+     */
+    fieldClassName?: string;
+}
+/**
+ * Input numérico com máscara/formatação usando `react-number-format`,
+ * integrado com o sistema de Field (label, descrição, erro).
+ *
+ * Exemplos de uso:
+ *
+ * - Moeda:
+ *   <NumericInput
+ *     label="Valor"
+ *     prefix="R$ "
+ *     thousandSeparator="."
+ *     decimalSeparator=","
+ *     decimalScale={2}
+ *   />
+ *
+ * - Percentual:
+ *   <NumericInput
+ *     label="Taxa"
+ *     suffix="%"
+ *     decimalScale={2}
+ *   />
+ */
+declare const NumericInput: React$1.ForwardRefExoticComponent<NumericInputProps & React$1.RefAttributes<HTMLInputElement>>;
 
-type SelectProps$1 = SelectPrimitive.SelectProps;
+type PatternInputBaseProps = Omit<PatternFormatProps, "customInput" | "getInputRef">;
+interface PatternInputProps extends PatternInputBaseProps {
+    /**
+     * Label do campo. Quando fornecido, cria o Field automaticamente.
+     */
+    label?: React$1.ReactNode;
+    /**
+     * Descrição ou texto de ajuda do campo.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Mensagem de erro ou array de erros.
+     */
+    error?: React$1.ReactNode | Array<{
+        message?: string;
+    } | undefined>;
+    /**
+     * Define se o campo está inválido.
+     */
+    invalid?: boolean;
+    /**
+     * Orientação do Field (vertical, horizontal, responsive).
+     */
+    orientation?: "vertical" | "horizontal" | "responsive";
+    /**
+     * Classes CSS adicionais para o container do Field.
+     */
+    fieldClassName?: string;
+}
+/**
+ * Input com formatação de padrão usando `react-number-format`,
+ * integrado com o sistema de Field (label, descrição, erro).
+ *
+ * Exemplos de uso:
+ *
+ * - Telefone:
+ *   <PatternInput
+ *     label="Telefone"
+ *     format="(##) #####-####"
+ *     allowEmptyFormatting
+ *     mask="_"
+ *   />
+ *
+ * - CPF:
+ *   <PatternInput
+ *     label="CPF"
+ *     format="###.###.###-##"
+ *     allowEmptyFormatting
+ *     mask="_"
+ *   />
+ *
+ * - CEP:
+ *   <PatternInput
+ *     label="CEP"
+ *     format="#####-###"
+ *     allowEmptyFormatting
+ *     mask="_"
+ *   />
+ */
+declare const PatternInput: React$1.ForwardRefExoticComponent<PatternInputProps & React$1.RefAttributes<HTMLInputElement>>;
 
-type SelectBaseProps = Omit<SelectProps$1, "onValueChange"> & {
-    options: {
-        value: string | number;
-        label: string;
-    }[];
+interface SelectOption {
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+interface SelectGroupOption {
+    label: string;
+    options: SelectOption[];
+}
+type SelectBaseProps = {
+    /**
+     * Opções do select. Pode ser um array simples ou com grupos.
+     */
+    options: SelectOption[] | SelectGroupOption[];
+    /**
+     * Placeholder quando nenhum valor está selecionado.
+     */
     placeholder?: string;
-    className?: string;
-    id?: string;
-    onChange?: (value: string) => void;
+    /**
+     * Valor selecionado (controlado).
+     */
     value?: string;
-    onChangeCallback?: (value: string) => void;
+    /**
+     * Callback quando o valor muda.
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Valor padrão (não controlado).
+     */
+    defaultValue?: string;
+    /**
+     * Se o select está desabilitado.
+     */
+    disabled?: boolean;
+    /**
+     * Habilita busca no select.
+     */
+    searchable?: boolean;
+    /**
+     * Placeholder do campo de busca.
+     */
+    searchPlaceholder?: string;
 };
+interface SelectWithFieldProps extends SelectBaseProps {
+    /**
+     * Label do campo. Quando fornecido, cria o Field automaticamente.
+     */
+    label?: React$1.ReactNode;
+    /**
+     * Descrição ou texto de ajuda do campo.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Mensagem de erro ou array de erros.
+     */
+    error?: React$1.ReactNode | Array<{
+        message?: string;
+    } | undefined>;
+    /**
+     * Define se o campo está inválido.
+     */
+    invalid?: boolean;
+    /**
+     * Orientação do Field (vertical, horizontal, responsive).
+     */
+    orientation?: "vertical" | "horizontal" | "responsive";
+    /**
+     * Classes CSS adicionais para o container do Field.
+     */
+    fieldClassName?: string;
+    /**
+     * ID do campo. Se não fornecido, será gerado automaticamente.
+     */
+    id?: string;
+}
+/**
+ * Select padrão do Design System com suporte a busca opcional.
+ *
+ * Pode ser usado de duas formas:
+ * 1. Como select simples: <Select options={[...]} />
+ * 2. Com Field integrado: <Select label="Estado" options={[...]} />
+ * 3. Com busca: <Select options={[...]} searchable />
+ *
+ * Quando usado com props do Field (label, description, error), automaticamente
+ * cria o Field ao redor do select.
+ */
+declare const Select: React$1.ForwardRefExoticComponent<SelectWithFieldProps & React$1.RefAttributes<HTMLButtonElement>>;
+interface MultiSelectWithFieldProps {
+    /**
+     * Opções do select.
+     */
+    options: SelectOption[];
+    /**
+     * Valores selecionados (controlado).
+     */
+    value?: string[];
+    /**
+     * Callback quando os valores mudam.
+     */
+    onValueChange?: (values: string[]) => void;
+    /**
+     * Valores padrão (não controlado).
+     */
+    defaultValue?: string[];
+    /**
+     * Placeholder quando nenhum valor está selecionado.
+     */
+    placeholder?: string;
+    /**
+     * Se o select está desabilitado.
+     */
+    disabled?: boolean;
+    /**
+     * Placeholder do campo de busca.
+     */
+    searchPlaceholder?: string;
+    /**
+     * Label do campo. Quando fornecido, cria o Field automaticamente.
+     */
+    label?: React$1.ReactNode;
+    /**
+     * Descrição ou texto de ajuda do campo.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Mensagem de erro ou array de erros.
+     */
+    error?: React$1.ReactNode | Array<{
+        message?: string;
+    } | undefined>;
+    /**
+     * Define se o campo está inválido.
+     */
+    invalid?: boolean;
+    /**
+     * Orientação do Field (vertical, horizontal, responsive).
+     */
+    orientation?: "vertical" | "horizontal" | "responsive";
+    /**
+     * Classes CSS adicionais para o container do Field.
+     */
+    fieldClassName?: string;
+    /**
+     * ID do campo. Se não fornecido, será gerado automaticamente.
+     */
+    id?: string;
+    /**
+     * Máximo de itens que podem ser selecionados.
+     */
+    maxSelected?: number;
+    /**
+     * Número máximo de opções visíveis no input. Quando há mais opções selecionadas,
+     * apenas as primeiras N são mostradas com um indicador do restante.
+     * Padrão: 5
+     */
+    maxVisible?: number;
+}
+/**
+ * Select com múltiplas seleções e busca integrada usando Command.
+ *
+ * Permite selecionar múltiplos valores com busca/filtro.
+ */
+declare const MultiSelect: React$1.ForwardRefExoticComponent<MultiSelectWithFieldProps & React$1.RefAttributes<HTMLButtonElement>>;
 
-type SelectProps = SelectBaseProps & {
-    label?: string;
-    name?: string;
-    error?: string;
-    description?: string;
-    withoutForm?: boolean;
-};
-declare const Select: ({ name, label, description, error, className, withoutForm, options, placeholder, ...props }: SelectProps) => React__default.JSX.Element;
+type TextAreaProps = React$1.ComponentProps<"textarea">;
+/**
+ * Campo de texto multilinha padrão do Design System.
+ *
+ * Pode ser usado de duas formas:
+ * 1. Como textarea simples: <TextArea placeholder="..." />
+ * 2. Com Field integrado: <TextArea label="Descrição" description="..." />
+ *
+ * Quando usado com props do Field (label, description, error), automaticamente
+ * cria o Field ao redor do textarea.
+ */
+interface TextAreaWithFieldProps extends TextAreaProps {
+    /**
+     * Label do campo. Quando fornecido, cria o Field automaticamente.
+     */
+    label?: React$1.ReactNode;
+    /**
+     * Descrição ou texto de ajuda do campo.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Mensagem de erro ou array de erros.
+     */
+    error?: React$1.ReactNode | Array<{
+        message?: string;
+    } | undefined>;
+    /**
+     * Define se o campo está inválido.
+     */
+    invalid?: boolean;
+    /**
+     * Orientação do Field (vertical, horizontal, responsive).
+     */
+    orientation?: "vertical" | "horizontal" | "responsive";
+    /**
+     * Classes CSS adicionais para o container do Field.
+     */
+    fieldClassName?: string;
+}
+declare const TextArea: React$1.ForwardRefExoticComponent<Omit<TextAreaWithFieldProps, "ref"> & React$1.RefAttributes<HTMLTextAreaElement>>;
+type TextAreaFieldProps = TextAreaWithFieldProps;
+declare const TextAreaField: React$1.ForwardRefExoticComponent<Omit<TextAreaWithFieldProps, "ref"> & React$1.RefAttributes<HTMLTextAreaElement>>;
 
-type MultiSelectBaseProps = {
-    options: {
-        label: string;
-        value: string;
-    }[];
-    selected?: string[];
-    onChange?: (values: string[]) => void;
-    placeholder?: string;
+interface RadioGroupOption {
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+type RadioGroupBaseProps = {
+    /**
+     * Opções do radio group.
+     */
+    options: RadioGroupOption[];
+    /**
+     * Valor selecionado (controlado).
+     */
+    value?: string;
+    /**
+     * Callback quando o valor muda.
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Valor padrão (não controlado).
+     */
+    defaultValue?: string;
+    /**
+     * Se o radio group está desabilitado.
+     */
+    disabled?: boolean;
+    /**
+     * Orientação dos itens (vertical ou horizontal).
+     */
+    orientation?: "vertical" | "horizontal";
+    /**
+     * Classes CSS adicionais para o container do RadioGroup.
+     */
     className?: string;
 };
+interface RadioGroupWithFieldProps extends RadioGroupBaseProps {
+    /**
+     * Label do campo. Quando fornecido, cria o Field automaticamente.
+     */
+    label?: React$1.ReactNode;
+    /**
+     * Descrição ou texto de ajuda do campo.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Mensagem de erro ou array de erros.
+     */
+    error?: React$1.ReactNode | Array<{
+        message?: string;
+    } | undefined>;
+    /**
+     * Define se o campo está inválido.
+     */
+    invalid?: boolean;
+    /**
+     * Orientação do Field (vertical, horizontal, responsive).
+     */
+    fieldOrientation?: "vertical" | "horizontal" | "responsive";
+    /**
+     * Classes CSS adicionais para o container do Field.
+     */
+    fieldClassName?: string;
+    /**
+     * ID do campo. Se não fornecido, será gerado automaticamente.
+     */
+    id?: string;
+}
+/**
+ * RadioGroup padrão do Design System.
+ *
+ * Pode ser usado de duas formas:
+ * 1. Como radio group simples: <RadioGroup options={[...]} />
+ * 2. Com Field integrado: <RadioGroup label="Opção" options={[...]} />
+ *
+ * Quando usado com props do Field (label, description, error), automaticamente
+ * cria o Field ao redor do radio group.
+ */
+declare const RadioGroup: React$1.ForwardRefExoticComponent<RadioGroupWithFieldProps & React$1.RefAttributes<HTMLDivElement>>;
 
-type MultiSelectProps = MultiSelectBaseProps & {
-    label?: string;
-    name?: string;
-    withoutForm?: boolean;
-    className?: string;
-    required?: boolean;
-    "data-testid"?: string;
-};
-declare function MultiSelect({ label, name, withoutForm, className, required, "data-testid": testId, ...props }: MultiSelectProps): React__default.JSX.Element;
+declare const Switch$1: React$1.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
 
-type SwitchProps$1 = React$1.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root>;
+type SwitchProps = React$1.ComponentProps<typeof Switch$1>;
+/**
+ * Switch padrão do Design System.
+ *
+ * Pode ser usado de duas formas:
+ * 1. Como switch simples: <Switch />
+ * 2. Com Field integrado: <Switch label="Ativar notificações" description="..." />
+ *
+ * Quando usado com props do Field (label, description, error), automaticamente
+ * cria o Field ao redor do switch.
+ */
+interface SwitchWithFieldProps extends SwitchProps {
+    /**
+     * Label do campo. Quando fornecido, cria o Field automaticamente.
+     */
+    label?: React$1.ReactNode;
+    /**
+     * Descrição ou texto de ajuda do campo.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Mensagem de erro ou array de erros.
+     */
+    error?: React$1.ReactNode | Array<{
+        message?: string;
+    } | undefined>;
+    /**
+     * Define se o campo está inválido.
+     */
+    invalid?: boolean;
+    /**
+     * Orientação do Field (vertical, horizontal, responsive).
+     */
+    /**
+     * Classes CSS adicionais para o container do Field.
+     */
+    fieldClassName?: string;
+    /**
+     * ID do campo. Se não fornecido, será gerado automaticamente.
+     */
+    id?: string;
+    /**
+     * Posição do label em relação ao switch (left ou right).
+     * Padrão: "right"
+     */
+    labelPosition?: "left" | "right";
+}
+declare const Switch: React$1.ForwardRefExoticComponent<Omit<SwitchWithFieldProps, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
 
-type SwitchProps = SwitchProps$1 & {
-    label?: string;
-    withoutForm?: boolean;
-};
-declare function Switch({ label, withoutForm, className, ...props }: SwitchProps): React$1.JSX.Element;
+declare function Calendar$1({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, ...props }: React$1.ComponentProps<typeof DayPicker> & {
+    buttonVariant?: React$1.ComponentProps<typeof Button$1>["variant"];
+}): React$1.JSX.Element;
 
-declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
-    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-interface ButtonProps$1 extends React$1.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
-    asChild?: boolean;
+declare const Popover$1: React$1.FC<PopoverPrimitive.PopoverProps>;
+declare const PopoverTrigger$1: React$1.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
+declare const PopoverContent$1: React$1.ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Calendar raiz (primitivo) baseado no react-day-picker.
+ *
+ * Use quando precisar de controle total sobre o calendário.
+ */
+declare const Calendar: typeof Calendar$1;
+type CalendarProps = React$1.ComponentProps<typeof Calendar$1>;
+/**
+ * Popover raiz (primitivo) baseado no Radix UI.
+ */
+declare const Popover: React$1.FC<PopoverPrimitive.PopoverProps>;
+type PopoverProps = React$1.ComponentProps<typeof Popover$1>;
+/**
+ * PopoverTrigger (primitivo).
+ */
+declare const PopoverTrigger: React$1.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
+type PopoverTriggerProps = React$1.ComponentProps<typeof PopoverTrigger$1>;
+/**
+ * PopoverContent (primitivo).
+ */
+declare const PopoverContent: React$1.ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+type PopoverContentProps = React$1.ComponentProps<typeof PopoverContent$1>;
+/**
+ * Props base compartilhadas entre todos os tipos de DatePicker.
+ */
+interface DatePickerBaseProps {
+    /**
+     * Placeholder exibido quando nenhuma data está selecionada.
+     * @default "Selecione uma data"
+     */
+    placeholder?: string;
+    /**
+     * Formato da data exibida no botão.
+     * Usa date-fns format. Padrão: "PPP" (ex: "January 1, 2024")
+     */
+    dateFormat?: string;
+    /**
+     * Define se o DatePicker está desabilitado.
+     */
+    disabled?: boolean;
+    /**
+     * Classes CSS adicionais para o botão trigger.
+     */
+    buttonClassName?: string;
+    /**
+     * Classes CSS adicionais para o conteúdo do popover.
+     */
+    popoverContentClassName?: string;
+    /**
+     * Classes CSS adicionais para o calendário.
+     */
+    calendarClassName?: string;
+    /**
+     * Props adicionais passadas para o componente Calendar.
+     */
+    calendarProps?: Omit<DayPickerProps, "selected" | "onSelect" | "mode" | "disabled">;
+    /**
+     * Define se o calendário deve mostrar dias fora do mês.
+     * @default true
+     */
+    showOutsideDays?: boolean;
+    /**
+     * Data mínima selecionável.
+     */
+    minDate?: Date;
+    /**
+     * Data máxima selecionável.
+     */
+    maxDate?: Date;
+    /**
+     * Datas desabilitadas.
+     */
+    disabledDates?: Date[];
+}
+/**
+ * Props para DatePickerSingle - seleção de data única.
+ */
+interface DatePickerSingleBaseProps extends DatePickerBaseProps {
+    /**
+     * Data selecionada.
+     */
+    date?: Date;
+    /**
+     * Callback chamado quando a data é selecionada.
+     */
+    onSelect?: (date: Date | undefined) => void;
+}
+/**
+ * Props para DatePickerSingle com suporte a Field.
+ */
+interface DatePickerSingleProps extends DatePickerSingleBaseProps {
+    /**
+     * Label do campo. Quando fornecido, cria o Field automaticamente.
+     */
+    label?: React$1.ReactNode;
+    /**
+     * Descrição ou texto de ajuda do campo.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Mensagem de erro ou array de erros.
+     */
+    error?: React$1.ReactNode | Array<{
+        message?: string;
+    } | undefined>;
+    /**
+     * Define se o campo está inválido.
+     */
+    invalid?: boolean;
+    /**
+     * Orientação do Field (vertical, horizontal, responsive).
+     */
+    orientation?: "vertical" | "horizontal" | "responsive";
+    /**
+     * Classes CSS adicionais para o container do Field.
+     */
+    fieldClassName?: string;
+    /**
+     * ID do campo. Se não fornecido, será gerado automaticamente.
+     */
+    id?: string;
+}
+/**
+ * DatePicker para seleção de data única.
+ *
+ * Pode ser usado de duas formas:
+ * 1. Como DatePicker simples: <DatePickerSingle date={date} onSelect={setDate} />
+ * 2. Com Field integrado: <DatePickerSingle label="Data" date={date} onSelect={setDate} />
+ *
+ * Quando usado com props do Field (label, description, error), automaticamente
+ * cria o Field ao redor do DatePicker.
+ *
+ * @example
+ * ```tsx
+ * import { DatePickerSingle } from "@phsa.tec/design-system-react"
+ *
+ * function MyForm() {
+ *   const [date, setDate] = React.useState<Date>()
+ *
+ *   return (
+ *     <DatePickerSingle
+ *       label="Data de nascimento"
+ *       description="Selecione sua data de nascimento"
+ *       date={date}
+ *       onSelect={setDate}
+ *       placeholder="Selecione uma data"
+ *     />
+ *   )
+ * }
+ * ```
+ */
+declare const DatePickerSingle: React$1.ForwardRefExoticComponent<DatePickerSingleProps & React$1.RefAttributes<HTMLButtonElement>>;
+/**
+ * Props para DatePickerRange - seleção de range de datas.
+ */
+interface DatePickerRangeBaseProps extends DatePickerBaseProps {
+    /**
+     * Range de datas selecionado.
+     */
+    date?: DateRange;
+    /**
+     * Callback chamado quando o range é selecionado.
+     */
+    onSelect?: (range: DateRange | undefined) => void;
+}
+/**
+ * Props para DatePickerRange com suporte a Field.
+ */
+interface DatePickerRangeProps extends DatePickerRangeBaseProps {
+    /**
+     * Label do campo. Quando fornecido, cria o Field automaticamente.
+     */
+    label?: React$1.ReactNode;
+    /**
+     * Descrição ou texto de ajuda do campo.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Mensagem de erro ou array de erros.
+     */
+    error?: React$1.ReactNode | Array<{
+        message?: string;
+    } | undefined>;
+    /**
+     * Define se o campo está inválido.
+     */
+    invalid?: boolean;
+    /**
+     * Orientação do Field (vertical, horizontal, responsive).
+     */
+    orientation?: "vertical" | "horizontal" | "responsive";
+    /**
+     * Classes CSS adicionais para o container do Field.
+     */
+    fieldClassName?: string;
+    /**
+     * ID do campo. Se não fornecido, será gerado automaticamente.
+     */
+    id?: string;
+}
+/**
+ * DatePicker para seleção de range de datas.
+ *
+ * Pode ser usado de duas formas:
+ * 1. Como DatePicker simples: <DatePickerRange date={range} onSelect={setRange} />
+ * 2. Com Field integrado: <DatePickerRange label="Período" date={range} onSelect={setRange} />
+ *
+ * Quando usado com props do Field (label, description, error), automaticamente
+ * cria o Field ao redor do DatePicker.
+ *
+ * @example
+ * ```tsx
+ * import { DatePickerRange } from "@phsa.tec/design-system-react"
+ * import type { DateRange } from "react-day-picker"
+ *
+ * function MyForm() {
+ *   const [range, setRange] = React.useState<DateRange>()
+ *
+ *   return (
+ *     <DatePickerRange
+ *       label="Período de viagem"
+ *       description="Selecione as datas de ida e volta"
+ *       date={range}
+ *       onSelect={setRange}
+ *       placeholder="Selecione um range"
+ *     />
+ *   )
+ * }
+ * ```
+ */
+declare const DatePickerRange: React$1.ForwardRefExoticComponent<DatePickerRangeProps & React$1.RefAttributes<HTMLButtonElement>>;
+/**
+ * Props para DatePickerMultiple - seleção de múltiplas datas.
+ */
+interface DatePickerMultipleBaseProps extends DatePickerBaseProps {
+    /**
+     * Datas selecionadas.
+     */
+    date?: Date[];
+    /**
+     * Callback chamado quando as datas são selecionadas.
+     */
+    onSelect?: (dates: Date[]) => void;
+}
+/**
+ * Props para DatePickerMultiple com suporte a Field.
+ */
+interface DatePickerMultipleProps extends DatePickerMultipleBaseProps {
+    /**
+     * Label do campo. Quando fornecido, cria o Field automaticamente.
+     */
+    label?: React$1.ReactNode;
+    /**
+     * Descrição ou texto de ajuda do campo.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Mensagem de erro ou array de erros.
+     */
+    error?: React$1.ReactNode | Array<{
+        message?: string;
+    } | undefined>;
+    /**
+     * Define se o campo está inválido.
+     */
+    invalid?: boolean;
+    /**
+     * Orientação do Field (vertical, horizontal, responsive).
+     */
+    orientation?: "vertical" | "horizontal" | "responsive";
+    /**
+     * Classes CSS adicionais para o container do Field.
+     */
+    fieldClassName?: string;
+    /**
+     * ID do campo. Se não fornecido, será gerado automaticamente.
+     */
+    id?: string;
 }
+/**
+ * DatePicker para seleção de múltiplas datas.
+ *
+ * Pode ser usado de duas formas:
+ * 1. Como DatePicker simples: <DatePickerMultiple date={dates} onSelect={setDates} />
+ * 2. Com Field integrado: <DatePickerMultiple label="Datas" date={dates} onSelect={setDates} />
+ *
+ * Quando usado com props do Field (label, description, error), automaticamente
+ * cria o Field ao redor do DatePicker.
+ *
+ * @example
+ * ```tsx
+ * import { DatePickerMultiple } from "@phsa.tec/design-system-react"
+ *
+ * function MyForm() {
+ *   const [dates, setDates] = React.useState<Date[]>([])
+ *
+ *   return (
+ *     <DatePickerMultiple
+ *       label="Datas disponíveis"
+ *       description="Selecione todas as datas que deseja"
+ *       date={dates}
+ *       onSelect={setDates}
+ *       placeholder="Selecione múltiplas datas"
+ *     />
+ *   )
+ * }
+ * ```
+ */
+declare const DatePickerMultiple: React$1.ForwardRefExoticComponent<DatePickerMultipleProps & React$1.RefAttributes<HTMLButtonElement>>;
+/**
+ * DatePicker padrão - alias para DatePickerSingle para manter compatibilidade.
+ *
+ * @deprecated Use DatePickerSingle, DatePickerRange ou DatePickerMultiple diretamente.
+ * Este componente será removido em uma versão futura.
+ *
+ * @example
+ * ```tsx
+ * import { DatePicker } from "@phsa.tec/design-system-react"
+ *
+ * function MyForm() {
+ *   const [date, setDate] = React.useState<Date>()
+ *
+ *   return (
+ *     <DatePicker
+ *       date={date}
+ *       onSelect={setDate}
+ *       placeholder="Selecione uma data"
+ *     />
+ *   )
+ * }
+ * ```
+ */
+declare const DatePicker: React$1.ForwardRefExoticComponent<DatePickerSingleProps & React$1.RefAttributes<HTMLButtonElement>>;
+/**
+ * @deprecated Use DatePickerSingleProps
+ */
+type DatePickerProps = DatePickerSingleProps;
 
-type ButtonProps = ButtonProps$1 & {
-    loading?: boolean;
-};
-declare const Button: React$1.ForwardRefExoticComponent<ButtonProps$1 & {
-    loading?: boolean;
-} & React$1.RefAttributes<HTMLButtonElement>>;
+declare function Dialog$1({ ...props }: React$1.ComponentProps<typeof Dialog$2.Root>): React$1.JSX.Element;
+declare function DialogTrigger$1({ ...props }: React$1.ComponentProps<typeof Dialog$2.Trigger>): React$1.JSX.Element;
+declare function DialogPortal$1({ ...props }: React$1.ComponentProps<typeof Dialog$2.Portal>): React$1.JSX.Element;
+declare function DialogClose$1({ ...props }: React$1.ComponentProps<typeof Dialog$2.Close>): React$1.JSX.Element;
+declare function DialogOverlay$1({ className, ...props }: React$1.ComponentProps<typeof Dialog$2.Overlay>): React$1.JSX.Element;
+declare function DialogContent$1({ className, children, showCloseButton, ...props }: React$1.ComponentProps<typeof Dialog$2.Content> & {
+    showCloseButton?: boolean;
+}): React$1.JSX.Element;
+declare function DialogHeader$1({ className, ...props }: React$1.ComponentProps<"div">): React$1.JSX.Element;
+declare function DialogFooter$1({ className, showCloseButton, children, ...props }: React$1.ComponentProps<"div"> & {
+    showCloseButton?: boolean;
+}): React$1.JSX.Element;
+declare function DialogTitle$1({ className, ...props }: React$1.ComponentProps<typeof Dialog$2.Title>): React$1.JSX.Element;
+declare function DialogDescription$1({ className, ...props }: React$1.ComponentProps<typeof Dialog$2.Description>): React$1.JSX.Element;
 
-type DialogProps$1 = DialogPrimitive.DialogProps;
+/**
+ * Dialog raiz (primitivo) baseado no shadcn.
+ *
+ * Use quando precisar de controle total sobre a estrutura do dialog.
+ */
+declare const DialogRoot: typeof Dialog$1;
+type DialogRootProps = React$1.ComponentProps<typeof Dialog$1>;
+/**
+ * Trigger do Dialog (primitivo).
+ *
+ * Elemento que abre o dialog quando clicado.
+ */
+declare const DialogTrigger: typeof DialogTrigger$1;
+type DialogTriggerProps = React$1.ComponentProps<typeof DialogTrigger$1>;
+/**
+ * Portal do Dialog (primitivo).
+ *
+ * Controla onde o dialog é renderizado no DOM.
+ */
+declare const DialogPortal: typeof DialogPortal$1;
+type DialogPortalProps = React$1.ComponentProps<typeof DialogPortal$1>;
+/**
+ * Overlay do Dialog (primitivo).
+ *
+ * Fundo escuro que aparece atrás do dialog.
+ */
+declare const DialogOverlay: typeof DialogOverlay$1;
+type DialogOverlayProps = React$1.ComponentProps<typeof DialogOverlay$1>;
+/**
+ * Botão de fechar do Dialog (primitivo).
+ */
+declare const DialogClose: typeof DialogClose$1;
+type DialogCloseProps = React$1.ComponentProps<typeof DialogClose$1>;
+/**
+ * Conteúdo principal do Dialog (primitivo).
+ *
+ * Container que envolve todo o conteúdo do dialog.
+ */
+declare const DialogContent: typeof DialogContent$1;
+type DialogContentProps = React$1.ComponentProps<typeof DialogContent$1>;
+/**
+ * Cabeçalho do Dialog (primitivo).
+ *
+ * Normalmente contém `DialogTitle` e `DialogDescription`.
+ */
+declare const DialogHeader: typeof DialogHeader$1;
+type DialogHeaderProps = React$1.ComponentProps<typeof DialogHeader$1>;
+/**
+ * Rodapé do Dialog (primitivo).
+ *
+ * Ideal para ações (botões) ou informações complementares.
+ */
+declare const DialogFooter: typeof DialogFooter$1;
+type DialogFooterProps = React$1.ComponentProps<typeof DialogFooter$1>;
+/**
+ * Título do Dialog (primitivo).
+ */
+declare const DialogTitle: typeof DialogTitle$1;
+type DialogTitleProps = React$1.ComponentProps<typeof DialogTitle$1>;
+/**
+ * Descrição do Dialog (primitivo).
+ */
+declare const DialogDescription: typeof DialogDescription$1;
+type DialogDescriptionProps = React$1.ComponentProps<typeof DialogDescription$1>;
+interface DialogProps extends Omit<DialogRootProps, "children"> {
+    /**
+     * Elemento que aciona a abertura do dialog.
+     * Normalmente um botão ou link.
+     */
+    trigger?: React$1.ReactNode;
+    /**
+     * Título do dialog.
+     * Quando informado, é renderizado dentro de `DialogHeader` usando `DialogTitle`.
+     */
+    title?: React$1.ReactNode;
+    /**
+     * Descrição do dialog.
+     * Quando informada, é renderizada dentro de `DialogHeader` usando `DialogDescription`.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Conteúdo principal do dialog.
+     * Renderizado dentro de `DialogContent`.
+     */
+    children?: React$1.ReactNode;
+    /**
+     * Conteúdo do rodapé do dialog.
+     * Renderizado dentro de `DialogFooter` (ex: botões de ação).
+     */
+    footer?: React$1.ReactNode;
+    /**
+     * Controla se o dialog está aberto ou fechado.
+     * Use para controlar o estado do dialog externamente.
+     */
+    open?: boolean;
+    /**
+     * Callback chamado quando o estado de abertura do dialog muda.
+     */
+    onOpenChange?: (open: boolean) => void;
+}
+/**
+ * Dialog padrão do Design System.
+ *
+ * Fornece uma estrutura de layout comum:
+ * - Trigger opcional (`trigger`)
+ * - Header opcional com `title` e `description`
+ * - Content com `children`
+ * - Footer opcional com `footer`
+ *
+ * Quando precisar de mais flexibilidade, use os primitivos:
+ * `DialogRoot`, `DialogTrigger`, `DialogContent`, `DialogHeader`, `DialogTitle`,
+ * `DialogDescription`, `DialogFooter`, etc.
+ */
+declare const Dialog: ({ trigger, title, description, children, footer, open, onOpenChange, ...rest }: DialogProps) => React$1.JSX.Element;
 
-type DialogProps = DialogProps$1 & PropsWithChildren & {
-    className?: string;
-    title?: string;
-    description?: string;
-    footer?: () => React.ReactNode;
-};
-declare function Dialog({ title, description, className, children, footer, ...props }: DialogProps): React$1.JSX.Element;
-type DialogWithFormProps = DialogProps & {
-    onSubmit: () => void;
-};
-declare const DialogWithForm: ({ title, description, className, children, footer, onSubmit, ...props }: DialogWithFormProps) => React$1.JSX.Element;
+type ToasterProps$1 = React.ComponentProps<typeof Toaster$2>;
+declare const Toaster$1: ({ ...props }: ToasterProps$1) => React$1.JSX.Element;
 
-declare const Collapsible: React$1.ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleProps & React$1.RefAttributes<HTMLDivElement>>;
-declare const CollapsibleTrigger: React$1.ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
-declare const CollapsibleContent: React$1.ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleContentProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * Toaster raiz (primitivo) baseado no sonner.
+ *
+ * Componente que renderiza o container de toasts.
+ * Deve ser adicionado na raiz da aplicação (ex: layout.tsx).
+ *
+ * @example
+ * ```tsx
+ * import { Toaster } from "@phsa.tec/design-system-react"
+ *
+ * function App() {
+ *   return (
+ *     <>
+ *       <YourApp />
+ *       <Toaster />
+ *     </>
+ *   )
+ * }
+ * ```
+ */
+declare const Toaster: ({ ...props }: sonner.ToasterProps & React$1.RefAttributes<HTMLElement>) => React$1.JSX.Element;
+type ToasterProps = React$1.ComponentProps<typeof Toaster$1>;
 
-type StepsProps = {
-    data: {
-        label?: string;
-        id: number;
-    }[];
-    onClick?: (id: number) => void;
-    value?: number;
-};
-declare const Steps: ({ data, onClick, value }: StepsProps) => React$1.JSX.Element;
+declare const Alert$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
+    variant?: "default" | "destructive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & React$1.RefAttributes<HTMLDivElement>>;
+declare const AlertTitle$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLHeadingElement> & React$1.RefAttributes<HTMLParagraphElement>>;
+declare const AlertDescription$1: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLParagraphElement> & React$1.RefAttributes<HTMLParagraphElement>>;
 
-type AlertDialogProps = {
-    title: string;
-    description?: string;
-    children: React.ReactNode;
-    onConfirm?: () => void;
-    onCancel?: () => void;
-};
-declare const AlertDialog: ({ title, description, children, onConfirm, onCancel, }: AlertDialogProps) => React$1.JSX.Element;
+/**
+ * Alert raiz (primitivo) baseado no shadcn.
+ *
+ * Use quando precisar de controle total sobre a estrutura do alert.
+ */
+declare const AlertRoot: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLDivElement> & class_variance_authority.VariantProps<(props?: ({
+    variant?: "default" | "destructive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string> & React$1.RefAttributes<HTMLDivElement>>;
+type AlertRootProps = React$1.ComponentProps<typeof Alert$1>;
+/**
+ * Título do Alert (primitivo).
+ */
+declare const AlertTitle: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLHeadingElement> & React$1.RefAttributes<HTMLParagraphElement>>;
+type AlertTitleProps = React$1.ComponentProps<typeof AlertTitle$1>;
+/**
+ * Descrição do Alert (primitivo).
+ */
+declare const AlertDescription: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLParagraphElement> & React$1.RefAttributes<HTMLParagraphElement>>;
+type AlertDescriptionProps = React$1.ComponentProps<typeof AlertDescription$1>;
+type AlertVariant = "default" | "destructive" | "success" | "warning" | "info";
+interface AlertProps extends Omit<AlertRootProps, "variant" | "children" | "title"> {
+    /**
+     * Variante do alert.
+     * @default "default"
+     */
+    variant?: AlertVariant;
+    /**
+     * Ícone exibido no alert.
+     * Se não fornecido, um ícone padrão será usado baseado na variante.
+     */
+    icon?: React$1.ReactNode;
+    /**
+     * Título do alert.
+     */
+    title?: React$1.ReactNode;
+    /**
+     * Descrição ou conteúdo do alert.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Conteúdo adicional do alert.
+     */
+    children?: React$1.ReactNode;
+    /**
+     * Mostrar botão de fechar.
+     * @default false
+     */
+    dismissible?: boolean;
+    /**
+     * Callback chamado quando o alert é fechado.
+     */
+    onDismiss?: () => void;
+    /**
+     * Classes CSS adicionais para o container.
+     */
+    containerClassName?: string;
+}
+/**
+ * Alert padrão do Design System.
+ *
+ * Componente de alerta para exibir mensagens importantes ao usuário.
+ * Suporta diferentes variantes: default, destructive, success, warning, info.
+ *
+ * @example
+ * ```tsx
+ * import { Alert } from "@phsa.tec/design-system-react"
+ *
+ * // Alert simples
+ * <Alert title="Atenção" description="Esta é uma mensagem importante." />
+ *
+ * // Alert de sucesso
+ * <Alert variant="success" title="Sucesso!" description="Operação realizada com sucesso." />
+ *
+ * // Alert com ícone customizado
+ * <Alert
+ *   variant="warning"
+ *   icon={<CustomIcon />}
+ *   title="Aviso"
+ *   description="Verifique os dados antes de continuar."
+ * />
+ * ```
+ */
+declare const Alert: ({ variant, icon, title, description, children, dismissible, onDismiss, className, containerClassName, ...rest }: AlertProps) => React$1.JSX.Element | null;
 
-type DrawerProps = React$1.ComponentProps<typeof Drawer$1.Root>;
-declare const Drawer: {
-    ({ shouldScaleBackground, ...props }: DrawerProps): React$1.JSX.Element;
+declare const AlertDialog$1: React$1.FC<AlertDialogPrimitive.AlertDialogProps>;
+declare const AlertDialogTrigger$1: React$1.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogPortal$1: React$1.FC<AlertDialogPrimitive.AlertDialogPortalProps>;
+declare const AlertDialogOverlay$1: React$1.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogOverlayProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogContent$1: React$1.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogHeader$1: {
+    ({ className, ...props }: React$1.HTMLAttributes<HTMLDivElement>): React$1.JSX.Element;
     displayName: string;
 };
-declare const DrawerTrigger: React$1.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
-declare const DrawerPortal: typeof vaul.Portal;
-declare const DrawerClose: React$1.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React$1.RefAttributes<HTMLButtonElement>>;
-declare const DrawerOverlay: React$1.ForwardRefExoticComponent<Omit<Omit<DialogPrimitive.DialogOverlayProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare const DrawerContent: React$1.ForwardRefExoticComponent<Omit<Omit<DialogPrimitive.DialogContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare const DrawerHeader: {
+declare const AlertDialogFooter$1: {
     ({ className, ...props }: React$1.HTMLAttributes<HTMLDivElement>): React$1.JSX.Element;
     displayName: string;
 };
-declare const DrawerFooter: {
+declare const AlertDialogTitle$1: React$1.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogTitleProps & React$1.RefAttributes<HTMLHeadingElement>, "ref"> & React$1.RefAttributes<HTMLHeadingElement>>;
+declare const AlertDialogDescription$1: React$1.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>, "ref"> & React$1.RefAttributes<HTMLParagraphElement>>;
+declare const AlertDialogAction$1: React$1.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogActionProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogCancel$1: React$1.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogCancelProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
+
+/**
+ * AlertDialog raiz (primitivo) baseado no Radix UI.
+ *
+ * Use quando precisar de controle total sobre a estrutura do alert dialog.
+ */
+declare const AlertDialogRoot: React$1.FC<AlertDialogPrimitive.AlertDialogProps>;
+type AlertDialogRootProps = React$1.ComponentProps<typeof AlertDialog$1>;
+/**
+ * Trigger do AlertDialog (primitivo).
+ *
+ * Elemento que abre o alert dialog quando clicado.
+ */
+declare const AlertDialogTrigger: React$1.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
+type AlertDialogTriggerProps = React$1.ComponentProps<typeof AlertDialogTrigger$1>;
+/**
+ * Portal do AlertDialog (primitivo).
+ */
+declare const AlertDialogPortal: React$1.FC<AlertDialogPrimitive.AlertDialogPortalProps>;
+type AlertDialogPortalProps = React$1.ComponentProps<typeof AlertDialogPortal$1>;
+/**
+ * Overlay do AlertDialog (primitivo).
+ */
+declare const AlertDialogOverlay: React$1.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogOverlayProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+type AlertDialogOverlayProps = React$1.ComponentProps<typeof AlertDialogOverlay$1>;
+/**
+ * Conteúdo principal do AlertDialog (primitivo).
+ */
+declare const AlertDialogContent: React$1.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+type AlertDialogContentProps = React$1.ComponentProps<typeof AlertDialogContent$1>;
+/**
+ * Cabeçalho do AlertDialog (primitivo).
+ */
+declare const AlertDialogHeader: {
     ({ className, ...props }: React$1.HTMLAttributes<HTMLDivElement>): React$1.JSX.Element;
     displayName: string;
 };
-declare const DrawerTitle: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React$1.RefAttributes<HTMLHeadingElement>, "ref"> & React$1.RefAttributes<HTMLHeadingElement>>;
-declare const DrawerDescription: React$1.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>, "ref"> & React$1.RefAttributes<HTMLParagraphElement>>;
-
-type CustomDrawerProps = DrawerProps & {
-    className?: string;
+type AlertDialogHeaderProps = React$1.ComponentProps<typeof AlertDialogHeader$1>;
+/**
+ * Rodapé do AlertDialog (primitivo).
+ */
+declare const AlertDialogFooter: {
+    ({ className, ...props }: React$1.HTMLAttributes<HTMLDivElement>): React$1.JSX.Element;
+    displayName: string;
 };
-declare function CustomDrawer({ className, ...props }: CustomDrawerProps): React$1.JSX.Element;
-
-declare const Sheet$1: React$1.FC<DialogPrimitive.DialogProps>;
-
-type SheetProps = typeof Sheet$1 & PropsWithChildren & {
-    side?: "left" | "right" | "top" | "bottom";
-    className?: string;
-    onOpenChange?: (open: boolean) => void;
+type AlertDialogFooterProps = React$1.ComponentProps<typeof AlertDialogFooter$1>;
+/**
+ * Título do AlertDialog (primitivo).
+ */
+declare const AlertDialogTitle: React$1.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogTitleProps & React$1.RefAttributes<HTMLHeadingElement>, "ref"> & React$1.RefAttributes<HTMLHeadingElement>>;
+type AlertDialogTitleProps = React$1.ComponentProps<typeof AlertDialogTitle$1>;
+/**
+ * Descrição do AlertDialog (primitivo).
+ */
+declare const AlertDialogDescription: React$1.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>, "ref"> & React$1.RefAttributes<HTMLParagraphElement>>;
+type AlertDialogDescriptionProps = React$1.ComponentProps<typeof AlertDialogDescription$1>;
+/**
+ * Botão de ação do AlertDialog (primitivo).
+ */
+declare const AlertDialogAction: React$1.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogActionProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
+type AlertDialogActionProps = React$1.ComponentProps<typeof AlertDialogAction$1>;
+/**
+ * Botão de cancelar do AlertDialog (primitivo).
+ */
+declare const AlertDialogCancel: React$1.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogCancelProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
+type AlertDialogCancelProps = React$1.ComponentProps<typeof AlertDialogCancel$1>;
+interface AlertDialogProps extends Omit<AlertDialogRootProps, "children"> {
+    /**
+     * Elemento que aciona a abertura do alert dialog.
+     * Normalmente um botão ou link.
+     */
+    trigger?: React$1.ReactNode;
+    /**
+     * Título do alert dialog.
+     * Quando informado, é renderizado dentro de `AlertDialogHeader` usando `AlertDialogTitle`.
+     */
+    title?: React$1.ReactNode;
+    /**
+     * Descrição do alert dialog.
+     * Quando informada, é renderizada dentro de `AlertDialogHeader` usando `AlertDialogDescription`.
+     */
+    description?: React$1.ReactNode;
+    /**
+     * Conteúdo principal do alert dialog.
+     * Renderizado dentro de `AlertDialogContent`.
+     */
+    children?: React$1.ReactNode;
+    /**
+     * Label do botão de ação principal (confirmar).
+     * @default "Confirmar"
+     */
+    actionLabel?: string;
+    /**
+     * Label do botão de cancelar.
+     * @default "Cancelar"
+     */
+    cancelLabel?: string;
+    /**
+     * Variante do botão de ação.
+     * @default "default"
+     */
+    actionVariant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
+    /**
+     * Callback chamado quando o botão de ação é clicado.
+     */
+    onAction?: () => void;
+    /**
+     * Callback chamado quando o botão de cancelar é clicado.
+     */
+    onCancel?: () => void;
+    /**
+     * Mostrar botão de cancelar.
+     * @default true
+     */
+    showCancel?: boolean;
+    /**
+     * Conteúdo customizado do rodapé.
+     * Quando fornecido, substitui os botões padrão.
+     */
+    footer?: React$1.ReactNode;
+    /**
+     * Controla se o alert dialog está aberto ou fechado.
+     * Use para controlar o estado externamente.
+     */
     open?: boolean;
-};
-declare function Sheet({ side, className, children, ...props }: SheetProps): React$1.JSX.Element;
-
-type AppSidebarProps = {
-    footer?: () => React$1.ReactNode;
-    user?: {
-        email?: string;
-        name?: string;
-    };
-    enterprise?: {
-        name: string;
-        logo: () => React$1.ReactNode;
-        plan: string;
-    };
-    navbar: {
-        title: string;
-        url: string;
-        items: {
-            title: string;
-            url: string;
-            isActive?: boolean | undefined;
-            icon?: () => React$1.ReactNode;
-        }[];
-    }[];
-};
-
-interface SidebarProps extends AppSidebarProps {
-    children: React.ReactNode;
-    contentClassName?: string;
-    showFooter?: boolean;
-    defaultPath?: string;
-    defaultCollapsed?: boolean;
+    /**
+     * Callback chamado quando o estado de abertura muda.
+     */
+    onOpenChange?: (open: boolean) => void;
 }
-declare const Sidebar: ({ children, contentClassName, showFooter, defaultPath, defaultCollapsed, ...rest }: SidebarProps) => React$1.JSX.Element;
-
-declare function NavUser({ user, logoutAction, }: {
-    user: {
-        name: string;
-        email: string;
-        avatar: string;
-    };
-    logoutAction?: () => void;
-}): React$1.JSX.Element;
+/**
+ * AlertDialog padrão do Design System.
+ *
+ * Componente de dialog de alerta usado para confirmações críticas.
+ * Diferente do Dialog comum, não pode ser fechado clicando fora ou pressionando ESC -
+ * apenas através dos botões de ação.
+ *
+ * @example
+ * ```tsx
+ * import { AlertDialog } from "@phsa.tec/design-system-react"
+ *
+ * // Confirmação simples
+ * <AlertDialog
+ *   trigger={<Button>Excluir</Button>}
+ *   title="Confirmar exclusão"
+ *   description="Esta ação não pode ser desfeita."
+ *   onAction={() => console.log("Confirmado")}
+ * />
+ *
+ * // Com ações customizadas
+ * <AlertDialog
+ *   trigger={<Button>Salvar</Button>}
+ *   title="Salvar alterações?"
+ *   description="Você tem alterações não salvas."
+ *   actionLabel="Salvar"
+ *   cancelLabel="Descartar"
+ *   onAction={handleSave}
+ *   onCancel={handleDiscard}
+ * />
+ * ```
+ */
+declare const AlertDialog: ({ trigger, title, description, children, actionLabel, cancelLabel, actionVariant, onAction, onCancel, showCancel, footer, open, onOpenChange, ...rest }: AlertDialogProps) => React$1.JSX.Element;
 
-declare const Separator: React$1.ForwardRefExoticComponent<Omit<SeparatorPrimitive.SeparatorProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+declare const Tabs$1: React$1.ForwardRefExoticComponent<TabsPrimitive.TabsProps & React$1.RefAttributes<HTMLDivElement>>;
+declare const TabsList$1: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+declare const TabsTrigger$1: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
+declare const TabsContent$1: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
 
-type PageLayoutProps = PropsWithChildren & {
-    title: string;
-    subtitle?: string;
-    header?: React__default.ReactNode;
-};
-declare const PageLayout: ({ subtitle, title, children, header, }: PageLayoutProps) => React__default.JSX.Element;
-
-interface TabsProps {
-    tabs: {
-        label: string;
-        content: React$1.ReactNode;
-    }[];
-    activeTabIndex?: number;
-    onTabChange?: (index: number) => void;
-    className?: string;
+/**
+ * Tabs raiz (primitivo) baseado no Radix UI.
+ *
+ * Use quando precisar de controle total sobre a estrutura das tabs.
+ */
+declare const TabsRoot: React$1.ForwardRefExoticComponent<TabsPrimitive.TabsProps & React$1.RefAttributes<HTMLDivElement>>;
+type TabsRootProps = React$1.ComponentProps<typeof Tabs$1>;
+/**
+ * Lista de tabs (primitivo).
+ *
+ * Container que agrupa os triggers das tabs.
+ */
+declare const TabsList: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+type TabsListProps = React$1.ComponentProps<typeof TabsList$1>;
+/**
+ * Trigger de tab (primitivo).
+ *
+ * Botão que ativa uma tab específica.
+ */
+declare const TabsTrigger: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
+type TabsTriggerProps = React$1.ComponentProps<typeof TabsTrigger$1>;
+/**
+ * Conteúdo de tab (primitivo).
+ *
+ * Container que exibe o conteúdo de uma tab quando ativa.
+ */
+declare const TabsContent: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
+type TabsContentProps = React$1.ComponentProps<typeof TabsContent$1>;
+interface TabItem {
+    /**
+     * Valor único que identifica a tab.
+     */
+    value: string;
+    /**
+     * Label exibido no trigger da tab.
+     */
+    label: React$1.ReactNode;
+    /**
+     * Conteúdo exibido quando a tab está ativa.
+     */
+    content: React$1.ReactNode;
+    /**
+     * Ícone opcional exibido antes do label.
+     */
+    icon?: React$1.ReactNode;
+    /**
+     * Define se a tab está desabilitada.
+     */
+    disabled?: boolean;
+    /**
+     * Badge ou contador exibido ao lado do label.
+     */
+    badge?: React$1.ReactNode;
 }
-declare const Tabs: React$1.FC<TabsProps>;
-
-declare const Breadcrumb: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & {
-    separator?: React$1.ReactNode;
-} & React$1.RefAttributes<HTMLElement>>;
-declare const BreadcrumbList: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, "ref"> & React$1.RefAttributes<HTMLOListElement>>;
-declare const BreadcrumbItem: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React$1.RefAttributes<HTMLLIElement>>;
-declare const BreadcrumbLink: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
-    asChild?: boolean;
-} & React$1.RefAttributes<HTMLAnchorElement>>;
-declare const BreadcrumbPage: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
-declare const BreadcrumbSeparator: {
-    ({ children, className, ...props }: React$1.ComponentProps<"li">): React$1.JSX.Element;
-    displayName: string;
-};
-declare const BreadcrumbEllipsis: {
-    ({ className, ...props }: React$1.ComponentProps<"span">): React$1.JSX.Element;
-    displayName: string;
-};
-
-declare const spinnerVariants: (props?: ({
-    show?: boolean | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-declare const loaderVariants: (props?: ({
-    size?: "small" | "medium" | "large" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-interface SpinnerContentProps extends VariantProps<typeof spinnerVariants>, VariantProps<typeof loaderVariants> {
+interface TabsProps extends Omit<TabsRootProps, "children"> {
+    /**
+     * Array de itens de tab.
+     * Cada item define uma tab com seu valor, label e conteúdo.
+     */
+    items: TabItem[];
+    /**
+     * Valor da tab ativa inicialmente.
+     * Se não fornecido, a primeira tab será ativa.
+     */
+    defaultValue?: string;
+    /**
+     * Valor da tab ativa (controlado).
+     * Use junto com `onValueChange` para controlar o estado externamente.
+     */
+    value?: string;
+    /**
+     * Callback chamado quando o valor da tab muda.
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Classes CSS adicionais para o container das tabs.
+     */
     className?: string;
-    children?: React__default.ReactNode;
+    /**
+     * Classes CSS adicionais para a lista de tabs.
+     */
+    listClassName?: string;
+    /**
+     * Classes CSS adicionais para o conteúdo.
+     */
+    contentClassName?: string;
+    /**
+     * Orientação das tabs.
+     * @default "horizontal"
+     */
+    orientation?: "horizontal" | "vertical";
 }
-declare function Spinner({ size, show, children, className, }: SpinnerContentProps): React__default.JSX.Element;
-
-declare function Toaster(): React$1.JSX.Element;
-
-declare const Toast$1: React$1.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastProps & React$1.RefAttributes<HTMLLIElement>, "ref"> & VariantProps<(props?: ({
-    variant?: "default" | "destructive" | "success" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string> & React$1.RefAttributes<HTMLLIElement>>;
-declare const ToastAction: React$1.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastActionProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
-type ToastProps = React$1.ComponentPropsWithoutRef<typeof Toast$1>;
-type ToastActionElement = React$1.ReactElement<typeof ToastAction>;
-
-type ToasterToast = ToastProps & {
-    id: string;
-    title?: React$1.ReactNode;
-    description?: React$1.ReactNode;
-    action?: ToastActionElement;
-};
-declare const actionTypes: {
-    readonly ADD_TOAST: "ADD_TOAST";
-    readonly UPDATE_TOAST: "UPDATE_TOAST";
-    readonly DISMISS_TOAST: "DISMISS_TOAST";
-    readonly REMOVE_TOAST: "REMOVE_TOAST";
-};
-type ActionType = typeof actionTypes;
-type Action = {
-    type: ActionType["ADD_TOAST"];
-    toast: ToasterToast;
-} | {
-    type: ActionType["UPDATE_TOAST"];
-    toast: Partial<ToasterToast>;
-} | {
-    type: ActionType["DISMISS_TOAST"];
-    toastId?: ToasterToast["id"];
-} | {
-    type: ActionType["REMOVE_TOAST"];
-    toastId?: ToasterToast["id"];
-};
-interface State {
-    toasts: ToasterToast[];
-}
-declare const reducer: (state: State, action: Action) => State;
-type Toast = Omit<ToasterToast, "id">;
-declare function toast({ ...props }: Toast): {
-    id: string;
-    dismiss: () => void;
-    update: (props: ToasterToast) => void;
-};
-declare function useToast(): {
-    toast: typeof toast;
-    dismiss: (toastId?: string) => void;
-    toasts: ToasterToast[];
-};
+/**
+ * Tabs padrão do Design System.
+ *
+ * Componente de tabs para organizar conteúdo em múltiplas seções.
+ * Suporta tabs horizontais e verticais, com ícones e badges opcionais.
+ *
+ * @example
+ * ```tsx
+ * import { Tabs } from "@phsa.tec/design-system-react"
+ *
+ * // Tabs simples
+ * <Tabs
+ *   items={[
+ *     { value: "tab1", label: "Tab 1", content: <div>Conteúdo 1</div> },
+ *     { value: "tab2", label: "Tab 2", content: <div>Conteúdo 2</div> },
+ *   ]}
+ * />
+ *
+ * // Tabs com ícones e badges
+ * <Tabs
+ *   items={[
+ *     {
+ *       value: "profile",
+ *       label: "Perfil",
+ *       icon: <UserIcon />,
+ *       content: <ProfileContent />,
+ *     },
+ *     {
+ *       value: "settings",
+ *       label: "Configurações",
+ *       icon: <SettingsIcon />,
+ *       badge: <Badge>3</Badge>,
+ *       content: <SettingsContent />,
+ *     },
+ *   ]}
+ * />
+ * ```
+ */
+declare const Tabs: ({ items, defaultValue, value, onValueChange, className, listClassName, contentClassName, orientation, ...rest }: TabsProps) => React$1.JSX.Element;
 
-export { AlertDialog, type AlertDialogProps, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonProps, Card$1 as Card, Card as CardBase, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Checkbox, type CheckboxProps, Collapsible, CollapsibleContent, CollapsibleTrigger, type Column, CustomDrawer, type CustomDrawerProps, DataPairList, type DataPairListProps, Dialog, type DialogProps, DialogWithForm, type DialogWithFormProps, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, type DrawerProps, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DynamicTable, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Icon, Input, MaskInput, type MaskInputProps, MultiSelect, MultipleInput, type MultipleInputProps, MultipleMaskInput, type MultipleMaskInputProps, NavUser, NumberInput, type NumberInputProps, PageLayout, type PageLayoutProps, Select, type SelectProps, Separator, Sheet, type SheetProps, Sidebar, Spinner, Steps, Switch, type SwitchProps, type TableProps, Tabs, Text, Toaster, badgeVariants, reducer, toast, useFormField, useToast };
+export { Alert, AlertDescription, type AlertDescriptionProps, AlertDialog, AlertDialogAction, type AlertDialogActionProps, AlertDialogCancel, type AlertDialogCancelProps, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, type AlertDialogDescriptionProps, AlertDialogFooter, type AlertDialogFooterProps, AlertDialogHeader, type AlertDialogHeaderProps, AlertDialogOverlay, type AlertDialogOverlayProps, AlertDialogPortal, type AlertDialogPortalProps, type AlertDialogProps, AlertDialogRoot, type AlertDialogRootProps, AlertDialogTitle, type AlertDialogTitleProps, AlertDialogTrigger, type AlertDialogTriggerProps, type AlertProps, AlertRoot, type AlertRootProps, AlertTitle, type AlertTitleProps, type AlertVariant, Blockquote, Button, ButtonIcon, type ButtonIconProps, type ButtonProps, Calendar, type CalendarProps, Card, CardContent, type CardContentProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, CardRoot, type CardRootProps, CardTitle, type CardTitleProps, Code, DataTable, DataTableColumnHeader, type DataTableColumnHeaderProps, DataTablePagination, type DataTablePaginationProps, type DataTableProps, DataTableRowActions, type DataTableRowActionsProps, DataTableToolbar, type DataTableToolbarProps, DatePicker, type DatePickerBaseProps, DatePickerMultiple, type DatePickerMultipleBaseProps, type DatePickerMultipleProps, type DatePickerProps, DatePickerRange, type DatePickerRangeBaseProps, type DatePickerRangeProps, DatePickerSingle, type DatePickerSingleBaseProps, type DatePickerSingleProps, Dialog, DialogClose, type DialogCloseProps, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogOverlay, type DialogOverlayProps, DialogPortal, type DialogPortalProps, type DialogProps, DialogRoot, type DialogRootProps, DialogTitle, type DialogTitleProps, DialogTrigger, type DialogTriggerProps, FormField, type FormFieldProps, H1, H2, H3, H4, Icon, type IconProps, Input, InputField, type InputFieldProps, type InputProps, type InputWithFieldProps, Large, Lead, Li, MultiSelect, type MultiSelectWithFieldProps, Muted, NumericInput, type NumericInputBaseProps, type NumericInputProps, Ol, P, PatternInput, type PatternInputBaseProps, type PatternInputProps, Popover, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, type PopoverTriggerProps, Pre, RadioGroup, type RadioGroupBaseProps, type RadioGroupOption, type RadioGroupWithFieldProps, Select, type SelectBaseProps, type SelectGroupOption, type SelectOption, type SelectWithFieldProps, Small, Switch, type SwitchProps, type SwitchWithFieldProps, type TabItem, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, type TableProps, TableRow, type TableRowProps, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsRoot, type TabsRootProps, TabsTrigger, type TabsTriggerProps, TextArea, TextAreaField, type TextAreaFieldProps, type TextAreaProps, type TextAreaWithFieldProps, Toaster, type ToasterProps, Typography, type TypographyProps, TypographyTable, TypographyTbody, TypographyTd, TypographyTh, TypographyThead, TypographyTr, Ul };