ivt/dist/base/index.d.ts

Ivt Components Library

import * as react_jsx_runtime from 'react/jsx-runtime';
import * as React from 'react';
import React__default, { ReactNode } from 'react';
import { BadgeVariants, BadgeProps } from '../badge/index.js';
import { ButtonProps } from '../button/index.js';
import { Calendar } from '../calendar/index.js';
import { Popover } from '../popover/index.js';
import { DateRange } from 'react-day-picker';
import 'class-variance-authority/types';
import 'class-variance-authority';
import '@radix-ui/react-popover';

interface AutoCompleteProps<T> {
    value: T | null;
    onChange: (value: T | null) => void;
    placeholder?: string;
    searchPlaceholder?: string;
    open: boolean;
    onOpenChange: (open: boolean) => void;
    disabled?: boolean;
    messageEmpty?: string;
    fetchOptions: (term: string) => Promise<T[]>;
    getOptionLabel: (option: T) => string;
    getOptionKey: (option: T) => string | number;
    onSelect?: (option: T) => void;
    className?: string;
}
declare function AutoComplete<T>({ value, onChange, placeholder, searchPlaceholder, open, onOpenChange, disabled, messageEmpty, fetchOptions, getOptionLabel, getOptionKey, onSelect, className, }: AutoCompleteProps<T>): react_jsx_runtime.JSX.Element;

interface BadgeListLimitedProps {
    items: string[];
    maxVisible?: number;
    variant?: BadgeVariants;
    subtle?: boolean;
    tooltipItems?: string[];
}
/**
 * Componente que exibe uma lista de Badges com limite de itens visíveis.
 * Se houver mais itens do que o limite, exibe um Badge adicional com "+N".
 *
 * @param items - Array de strings para exibir como Badges
 * @param maxVisible - Número máximo de Badges visíveis (padrão: 3)
 * @param variant - Variante do Badge (padrão: "default")
 * @param subtle - Se o Badge deve ter estilo sutil (padrão: true)
 * @param tooltipItems - Array de strings para exibir no tooltip (opcional). Se fornecido, exibe todos os itens no tooltip, cada um em uma linha.
 */
declare const BadgeListLimited: React__default.FC<BadgeListLimitedProps>;

declare function normalizeDate(date: Date): string;
interface CalendarPopoverProps extends Omit<React__default.ComponentProps<typeof Calendar>, "mode" | "selected" | "onSelect"> {
    /** Data selecionada (pode ser Date ou string parseável) */
    date: Date | string | undefined;
    /** Função chamada ao selecionar uma data */
    setDate: (date: Date | undefined) => void;
    /** Texto exibido quando não há data selecionada */
    placeholder?: string;
    /** ID opcional do botão */
    id?: string;
    /** Props extras para o botão */
    buttonProps?: ButtonProps;
    /** Props extras para o popover */
    popoverProps?: React__default.ComponentProps<typeof Popover>;
    /** Classe extra para o conteúdo do popover */
    popoverContentClassName?: string;
    /** Classe extra para o botão */
    className?: string;
    /**
     * Permite desabilitar datas específicas (igual ao Calendar do shadcn)
     * Pode ser um boolean, ou uma função que recebe a data e retorna boolean
     */
    disabled?: boolean | ((date: Date) => boolean);
    /**
     * Exibe o estado de carregamento geral do componente
     * Quando true, mostra o ícone de loading e desabilita a interação
     */
    isLoading?: boolean;
    /**
     * Exibe o estado de carregamento específico da tabela (caso exista)
     * Quando true, impede a seleção de datas no calendário
     */
    isLoadingTable?: boolean;
    /**
     * Define um conjunto de datas desabilitadas (formato 'yyyy-MM-dd')
     * Cada data presente neste Set será bloqueada na seleção do calendário
     */
    disabledDates?: Set<string>;
    /**
     * Mês padrão a ser mostrado (caso nenhuma data esteja selecionada)
     * Por padrão, será o mês atual.
     */
    defaultMonth?: Date;
}
declare const CalendarPopover: React__default.FC<CalendarPopoverProps>;

interface CalendarRangeProps extends Omit<React.ComponentProps<typeof Calendar>, "mode" | "selected" | "onSelect"> {
    /** Intervalo de datas selecionado (com `from` e `to`) */
    value: DateRange | undefined;
    /** Função chamada ao alterar o intervalo de datas selecionado */
    onChange: (range: DateRange | undefined) => void;
    /** Texto exibido quando não há intervalo selecionado */
    placeholder?: string;
    /** ID opcional do botão */
    id?: string;
    /** Props extras para o botão */
    buttonProps?: ButtonProps;
    /** Props extras para o popover */
    popoverProps?: React.ComponentProps<typeof Popover>;
    /** Classe extra para o conteúdo do popover */
    popoverContentClassName?: string;
    /** Classe extra para o botão */
    className?: string;
    /** Desabilita o botão e impede a seleção de datas */
    disabled?: boolean;
    /**
     * Mês padrão a ser mostrado (caso nenhuma data esteja selecionada)
     * Por padrão, será o mês atual.
     */
    defaultMonth?: Date;
}
declare function CalendarRange({ value, onChange, placeholder, id, buttonProps, popoverProps, popoverContentClassName, className, disabled, ...props }: CalendarRangeProps): react_jsx_runtime.JSX.Element;

interface CollapsibleHelpProps {
    children?: React__default.ReactNode;
    content: React__default.ReactNode;
    title?: string;
    className?: string;
    label?: React__default.ReactNode;
}
/**
 * A simpler CollapsibleHelp component that uses a Popover for the help content.
 * It manages its own open state internally.
 * The trigger is provided as 'children', and the content to show is passed as the 'content' prop.
 *
 * Usage:
 * <CollapsibleHelp
 *    content={<p>Help text goes here...</p>}
 *    title="Help Section"
 * >
 *    <button>Toggle Help</button> // This is your custom trigger
 * </CollapsibleHelp>
 */
declare function CollapsibleHelp({ children, content, title, className, label, }: CollapsibleHelpProps): react_jsx_runtime.JSX.Element;

interface ConfirmSaveRowConfig {
    title: string;
    value: any;
    type: "text" | "badge-limited" | "custom";
    badge?: {
        variant?: BadgeVariants;
        subtle?: boolean;
        maxVisible?: number;
    };
}
interface ConfirmSaveProps {
    onSave: () => void;
    disabled?: boolean;
    dialogTitle?: string;
    dialogDescription?: string;
    actionTitle?: string;
    actionVariant?: ButtonProps["variant"];
    children?: React__default.ReactNode;
    rows?: ConfirmSaveRowConfig[];
}
declare function ConfirmSave({ onSave, disabled, dialogTitle, dialogDescription, actionTitle, children, rows, actionVariant, }: ConfirmSaveProps): react_jsx_runtime.JSX.Element;

interface DeleteConfirmationModalProps {
    onConfirm: () => Promise<void> | void;
    title?: string;
    description?: string;
    confirmText?: string;
    cancelText?: string;
    disabled?: boolean;
    children?: React__default.ReactNode;
    /**
     * Ícone a ser exibido no botão de confirmação.
     * Se não fornecido, usa Trash2Icon por padrão.
     * Se for null, não exibe ícone.
     */
    confirmIcon?: React__default.ComponentType<{
        className?: string;
    }> | null;
}
declare function DeleteConfirmationModal({ onConfirm, title, description, confirmText, cancelText, disabled, children, confirmIcon, }: DeleteConfirmationModalProps): react_jsx_runtime.JSX.Element;

type MenuItemConfig = {
    value: string;
    label: string;
    path: string;
    onClick?: () => void;
    subItems?: {
        label: string;
        onClick: () => void;
    }[];
    /** Função customizada para determinar se o item está ativo */
    isActive?: (pathname: string) => boolean;
};
interface GenericHeadingMenubarProps {
    /** Configuração dos itens do menu */
    menuItems: MenuItemConfig[];
    /** Classes CSS adicionais para o container */
    className?: string;
    /** Conteúdo adicional a ser renderizado ao lado do menu */
    children?: React__default.ReactNode;
    /** Desabilita todos os itens do menu */
    disabled?: boolean;
    /** Função customizada para determinar se um item está ativo (fallback) */
    defaultIsActive?: (menuValue: string, pathname: string) => boolean;
    /** Caminho atual da rota (para highlight do ativo). Compatível com Next.js e React Router. */
    currentPath?: string;
    /** Função executada ao solicitar navegação (ex: router.push ou navigate). */
    onNavigate?: (path: string) => void;
}
/**
 * Componente genérico de menubar para navegação entre páginas.
 * Ajustado para ser agnóstico de framework (Next.js ou React puro).
 *
 * @example
 * ```tsx
 * // Exemplo com Next.js
 * const router = useRouter();
 * const pathname = usePathname();
 *
 * <GenericHeadingMenubar
 *   menuItems={menuItems}
 *   currentPath={pathname}
 *   onNavigate={(path) => router.push(path)}
 * />
 * ```
 */
declare const GenericHeadingMenubar: React__default.FC<GenericHeadingMenubarProps>;

interface ColumnConfig<T> {
    header: string;
    cell: (item: T) => React__default.ReactNode;
    className?: string;
}
interface GenericTableProps<T> {
    data: T[];
    columns: ColumnConfig<T>[];
    renderSeparator?: (index: number) => React__default.ReactNode;
    emptyMessage?: string;
    className?: string;
    keyExtractor?: (item: T, index: number) => string | number;
}
declare function GenericTable<T>({ data, columns, renderSeparator, emptyMessage, className, keyExtractor, }: GenericTableProps<T>): react_jsx_runtime.JSX.Element;

type TabConfig = {
    value: string;
    label: string;
    path?: string;
    match?: string;
    disabled?: boolean;
    className?: string;
};
interface GenericTabsProps {
    /**
     * Array of tab configurations.
     */
    tabs: TabConfig[];
    /**
     * Disables all tabs if true.
     */
    isLoading?: boolean;
    /**
     * Custom class name for the container.
     */
    className?: string;
    /**
     * Current path string used for matching active tab.
     * Pass browser URL or current router path here to enable auto-highlighting.
     * Makes the component compatible with any router (Next.js, React Router, etc).
     */
    currentPath?: string;
    /**
     * Callback handler for navigation.
     * Called with the tab's path when a tab is clicked.
     * Use this to trigger your router's navigation (e.g. router.push, navigate(), etc).
     */
    onNavigate?: (path: string) => void;
    /**
     * Optional override for active tab value.
     * If provided, the component acts as controlled for the active state display.
     */
    value?: string;
    /**
     * Custom class name for all tab triggers.
     */
    triggerClassName?: string;
    /**
     * If true, sets the tab width to fit content on small screens (sm:min-w-fit),
     * overriding the default fixed width.
     */
    widthCurrent?: boolean;
}
declare const GenericTabs: React__default.FC<GenericTabsProps>;

interface HeaderProps {
    title: string;
    description: string;
    className?: string;
    classNameDescription?: string;
    children?: React__default.ReactNode;
    defaultValue?: string;
    defaultOpen?: boolean;
    menu?: React__default.ReactNode;
}
declare const Header: React__default.FC<HeaderProps>;

interface HoverBadgeProps {
    title: string;
    description?: string;
    variant: BadgeProps["variant"];
    className?: string;
    showTitleInDescription?: boolean;
    subtle?: boolean;
}
declare const HoverBadge: React__default.FC<HoverBadgeProps>;

interface RuleFilterBuilderProps {
    fields: any[];
    onRemove: (index: number) => void;
    onAdd: () => void;
    maxBlocks?: number;
    isPending?: boolean;
    instructionContent?: React__default.ReactNode;
    renderConnector?: (index: number) => React__default.ReactNode;
    renderItem: (index: number) => React__default.ReactNode;
}
declare function RuleFilterBuilder({ fields, onRemove, onAdd, maxBlocks, isPending, instructionContent, renderConnector, renderItem, }: RuleFilterBuilderProps): react_jsx_runtime.JSX.Element;

interface StepNavigatorProps {
    /** Índice atual do passo */
    currentIndex: number;
    /** Total de passos */
    totalSteps: number;
    /** Ação ao clicar em "Anterior" */
    onPrev: () => void;
    /** Ação ao clicar em "Próximo" */
    onNext: () => void;
    /** Desabilita os botões (ex: loading) */
    disabled?: boolean;
    /** Personalização opcional dos rótulos */
    prevLabel?: string;
    nextLabel?: string;
    /** Controla se deve ocultar os botões ao chegar nas extremidades */
    hideEdgeButtons?: boolean;
    className?: string;
}
declare const StepNavigator: React__default.FC<StepNavigatorProps>;

interface TextWrapProps extends React__default.HTMLAttributes<HTMLDivElement> {
    children: React__default.ReactNode;
}
declare const TextWrap: React__default.FC<TextWrapProps>;

interface TooltipIndicatorProps {
    children: ReactNode;
    className?: string;
    classNameIcon?: string;
}
declare const TooltipIndicator: ({ children, className, classNameIcon }: TooltipIndicatorProps) => react_jsx_runtime.JSX.Element;

export { AutoComplete, BadgeListLimited, CalendarPopover, CalendarRange, CollapsibleHelp, ConfirmSave, DeleteConfirmationModal, GenericHeadingMenubar, GenericTable, GenericTabs, Header, HoverBadge, RuleFilterBuilder, StepNavigator, TextWrap, TooltipIndicator, normalizeDate };
export type { CalendarPopoverProps, CalendarRangeProps, ColumnConfig, ConfirmSaveRowConfig, DeleteConfirmationModalProps, GenericHeadingMenubarProps, GenericTableProps, GenericTabsProps, MenuItemConfig, TabConfig };