laif-ds/dist/index.d.ts

Design System di Laif con componenti React basati su principi di Atomic Design

import * as AccordionPrimitive from '@radix-ui/react-accordion';
import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';
import * as AvatarPrimitive from '@radix-ui/react-avatar';
import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
import { ClassProp } from 'class-variance-authority/types';
import { ClassValue } from 'clsx';
import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
import { ColumnDef } from '@tanstack/react-table';
import { Command as Command_2 } from 'cmdk';
import { ComponentProps } from 'react';
import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
import { ControllerProps } from 'react-hook-form';
import { ControllerRenderProps } from 'react-hook-form';
import { DateRange } from 'react-day-picker';
import { DayPicker } from 'react-day-picker';
import { default as default_2 } from 'react';
import { default as default_3 } from 'embla-carousel-react';
import { DialogContentProps } from '@radix-ui/react-dialog';
import * as DialogPrimitive from '@radix-ui/react-dialog';
import { Drawer as Drawer_2 } from 'vaul';
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
import { FieldError } from 'react-hook-form';
import { FieldPath } from 'react-hook-form';
import { FieldValues } from 'react-hook-form';
import { FormProviderProps } from 'react-hook-form';
import { ForwardRefExoticComponent } from 'react';
import * as HoverCardPrimitive from '@radix-ui/react-hover-card';
import { HTMLAttributes } from 'react';
import { JSX } from 'react/jsx-runtime';
import { JSX as JSX_2 } from 'react';
import * as LabelPrimitive from '@radix-ui/react-label';
import { Locale } from 'date-fns';
import * as LucideIcons from 'lucide-react';
import * as MenubarPrimitive from '@radix-ui/react-menubar';
import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
import { OnChangeFn } from '@tanstack/react-table';
import { OTPInput } from 'input-otp';
import * as PopoverPrimitive from '@radix-ui/react-popover';
import * as ProgressPrimitive from '@radix-ui/react-progress';
import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
import * as React_2 from 'react';
import { ReactElement } from 'react';
import { ReactNode } from 'react';
import * as RechartsPrimitive from 'recharts';
import { RefAttributes } from 'react';
import { RefObject } from 'react';
import * as ResizablePrimitive from 'react-resizable-panels';
import { Row } from '@tanstack/react-table';
import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
import * as SelectPrimitive from '@radix-ui/react-select';
import * as SeparatorPrimitive from '@radix-ui/react-separator';
import { SeparatorProps } from '@radix-ui/react-separator';
import * as SliderPrimitive from '@radix-ui/react-slider';
import { Slot } from '@radix-ui/react-slot';
import * as SwitchPrimitive from '@radix-ui/react-switch';
import * as TabsPrimitive from '@radix-ui/react-tabs';
import { toast } from 'sonner';
import { Toaster as Toaster_2 } from 'sonner';
import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
import * as TogglePrimitive from '@radix-ui/react-toggle';
import { TooltipContentProps as TooltipContentProps_2 } from '@radix-ui/react-tooltip';
import * as TooltipPrimitive from '@radix-ui/react-tooltip';
import { UseAskResult } from 'use-ask';
import { UseEmblaCarouselType } from 'embla-carousel-react';
import { UseFormReturn } from 'react-hook-form';
import { VariantProps } from 'class-variance-authority';

declare type AcceptItem = "pdf" | "doc" | "docx" | "xls" | "xlsx" | "ppt" | "pptx" | "txt" | "csv" | "jpg" | "jpeg" | "png" | "gif" | "image" | "video" | "audio" | "zip" | "rar" | "7z" | "tar" | "gz" | "tgz";

/**
 * Distributive helper: for a given key K, creates a config where cell gets the resolved value type.
 * By distributing over each key individually, TypeScript narrows the value type based on the literal accessorKey.
 */
declare type AccessorColumnConfigForKey<TData, K extends string> = BaseColumnFields & {
    accessorKey: K;
    cell?: (value: DeepValue<TData, K>, row: TData, tableRow: Row<TData>) => React.ReactNode;
    cellClassName?: string | ((value: DeepValue<TData, K>, row: TData) => string);
};

export declare function Accordion({ ...props }: AccordionProps): JSX.Element;

export declare function AccordionContent({ className, children, ...props }: AccordionContentProps): JSX.Element;

declare type AccordionContentProps = React_2.ComponentProps<typeof AccordionPrimitive.Content>;

export declare function AccordionItem({ className, ...props }: AccordionItemProps): JSX.Element;

declare type AccordionItemProps = React_2.ComponentProps<typeof AccordionPrimitive.Item>;

declare type AccordionProps = React_2.ComponentProps<typeof AccordionPrimitive.Root>;

export declare function AccordionTrigger({ className, children, ...props }: AccordionTriggerProps): JSX.Element;

declare type AccordionTriggerProps = React_2.ComponentProps<typeof AccordionPrimitive.Trigger>;

declare type AdditionalMessageOptions = Omit<ChatMessageProps, keyof Message>;

export declare function Alert({ className, variant, ...props }: AlertProps): JSX.Element;

export declare function AlertDescription({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;

export declare function AlertDialog({ ...props }: AlertDialogProps): JSX.Element;

export declare function AlertDialogAction({ className, ...props }: AlertDialogActionProps): JSX.Element;

declare type AlertDialogActionProps = React_2.ComponentProps<typeof AlertDialogPrimitive.Action>;

export declare function AlertDialogCancel({ className, ...props }: AlertDialogCancelProps): JSX.Element;

declare type AlertDialogCancelProps = React_2.ComponentProps<typeof AlertDialogPrimitive.Cancel>;

export declare function AlertDialogContent({ className, ...props }: AlertDialogContentProps): JSX.Element;

declare type AlertDialogContentProps = React_2.ComponentProps<typeof AlertDialogPrimitive.Content>;

export declare function AlertDialogDescription({ className, ...props }: AlertDialogDescriptionProps): JSX.Element;

declare type AlertDialogDescriptionProps = React_2.ComponentProps<typeof AlertDialogPrimitive.Description>;

export declare function AlertDialogFooter({ className, ...props }: AlertDialogFooterProps): JSX.Element;

declare type AlertDialogFooterProps = React_2.ComponentProps<"div">;

export declare function AlertDialogHeader({ className, ...props }: AlertDialogHeaderProps): JSX.Element;

declare type AlertDialogHeaderProps = React_2.ComponentProps<"div">;

declare type AlertDialogProps = React_2.ComponentProps<typeof AlertDialogPrimitive.Root>;

export declare function AlertDialogTitle({ className, ...props }: AlertDialogTitleProps): JSX.Element;

declare type AlertDialogTitleProps = React_2.ComponentProps<typeof AlertDialogPrimitive.Title>;

export declare function AlertDialogTrigger({ ...props }: AlertDialogTriggerProps): JSX.Element;

declare type AlertDialogTriggerProps = React_2.ComponentProps<typeof AlertDialogPrimitive.Trigger>;

declare type AlertProps = React_2.ComponentProps<"div"> & VariantProps<typeof alertVariants>;

export declare function AlertTitle({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;

declare const alertVariants: (props?: ({
    variant?: "default" | "destructive" | null | undefined;
} & ClassProp) | undefined) => string;

declare type Animation_2 = VariantProps<typeof chatBubbleVariants>["animation"];

export declare function AppCard({ header, title, description, body, actions, footer, variant, size, isLoading, showHeaderBorder, showFooterBorder, className, headerClassName, bodyClassName, footerClassName, children, ...props }: Readonly<AppCardProps>): JSX.Element;

export declare interface AppCardProps extends Omit<React_2.ComponentProps<"div">, "title"> {
    /** Header content (title and/or description) */
    header?: React_2.ReactNode;
    /** Card title displayed in the header */
    title?: string | React_2.ReactNode;
    /** Card description displayed below the title */
    description?: string | React_2.ReactNode;
    /** Main content of the card */
    body?: React_2.ReactNode;
    /**
     * Fallback body content when `body` is not provided.
     * `body` takes precedence over `children` if both are passed.
     */
    children?: React_2.ReactNode;
    /** Action buttons typically displayed in the header (right-aligned) */
    actions?: React_2.ReactNode;
    /** Footer content (typically action buttons) */
    footer?: React_2.ReactNode;
    /** Visual variant of the card */
    variant?: AppCardVariant;
    /** Controls internal padding via the base Card component */
    size?: AppCardSize;
    /** When true, renders skeleton placeholders instead of content */
    isLoading?: boolean;
    /** Whether to show a border between header and body */
    showHeaderBorder?: boolean;
    /** Whether to show a border between body and footer */
    showFooterBorder?: boolean;
    /** Additional className for the card container */
    className?: string;
    /** Additional className for the header section */
    headerClassName?: string;
    /** Additional className for the body section */
    bodyClassName?: string;
    /** Additional className for the footer section */
    footerClassName?: string;
}

declare type AppCardSize = "sm" | "default" | "lg" | "none";

export declare type AppCardVariant = "default" | "elevated" | "outlined" | "ghost" | "flat" | "interactive" | "success" | "warning" | "destructive" | "info";

export declare function AppCheckbox({ options, value, defaultValue, onValueChange, label, description, disabled, required, name, orientation, className, wrpClassName, optionClassName, layout, error, id, "data-testid": dataTestId, }: AppCheckboxProps): JSX.Element;

export declare interface AppCheckboxOption {
    value: string;
    label: string | React_2.ReactNode;
    description?: string | React_2.ReactNode;
    disabled?: boolean;
    icon?: IconName;
}

export declare interface AppCheckboxProps {
    options: AppCheckboxOption[];
    value?: string[];
    defaultValue?: string[];
    onValueChange?: (value: string[]) => void;
    label?: string | React_2.ReactNode;
    description?: string | React_2.ReactNode;
    disabled?: boolean;
    required?: boolean;
    name?: string;
    orientation?: "horizontal" | "vertical";
    className?: string;
    wrpClassName?: string;
    optionClassName?: string;
    layout?: "default" | "card";
    error?: string;
    id?: string;
    "data-testid"?: string;
}

export declare function AppDialog({ children, trigger, title, description, footer, size, open, defaultOpen, onOpenChange, triggerClassName, headerClassName, bodyClassName, footerClassName, disabled, asChild, preventClose, ...contentProps }: Readonly<AppDialogProps>): JSX.Element;

export declare interface AppDialogProps extends Omit<DialogContentProps, "title"> {
    /** Element that triggers the dialog on click */
    trigger?: React_2.ReactNode;
    /** Dialog title displayed in the header */
    title: string | React_2.ReactNode;
    /** Dialog description displayed below the title */
    description?: string | React_2.ReactNode;
    /** Footer content (typically action buttons) */
    footer?: React_2.ReactNode;
    /** Size variant of the dialog */
    size?: "sm" | "default" | "lg" | "xl" | "full";
    /** Whether the dialog can be closed by clicking the overlay */
    closeOnOverlay?: boolean;
    /** Controlled open state */
    open?: boolean;
    /** Default open state for uncontrolled usage */
    defaultOpen?: boolean;
    /** Callback when open state changes */
    onOpenChange?: (open: boolean) => void;
    /** Additional className for the dialog */
    className?: string;
    /** Additional className for the trigger wrapper */
    triggerClassName?: string;
    /** Additional className for the dialog content */
    contentClassName?: string;
    /** Additional className for the dialog's header */
    headerClassName?: string;
    /** Additional className for the dialog's body */
    bodyClassName?: string;
    /** Additional className for the dialog's footer */
    footerClassName?: string;
    /** Whether to disable the trigger */
    disabled?: boolean;
    /** Whether to use asChild pattern for trigger (for custom elements) */
    asChild?: boolean;
    preventClose?: "overlay" | "all";
}

export declare function AppEditor({ defaultValue, onMarkdownEdit, plugins, toolbars, placeholder, onlyMarkdown, className, wrpClassName, }: AppEditorProps): JSX.Element;

declare type AppEditorPlugin = "clear" | "counter";

declare interface AppEditorProps {
    defaultValue?: string;
    onMarkdownEdit?: (markdown: string) => void;
    plugins?: AppEditorPlugin[];
    toolbars?: AppEditorToolbar[];
    placeholder?: string;
    onlyMarkdown?: boolean;
    className?: string;
    wrpClassName?: string;
}

declare type AppEditorToolbar = "block-format" | "font-format" | "history";

export declare const AppForm: <TFormValues extends FieldValues = FieldValues, TAsyncOption = unknown>({ items, cols, form, submitText, onSubmit, isSubmitting, showSubmitButton, }: AppFormProps<TFormValues, TAsyncOption>) => JSX.Element;

declare type AppFormComponentType = "input" | "select" | "textarea" | "checkbox" | "multiselect" | "datepicker" | "radio" | "switch" | "slider" | "async" | "async-multiple" | "custom";

export declare type AppFormItem<TAsyncOption = unknown, TComponent extends AppFormComponentType = AppFormComponentType> = {
    /** Field label displayed above the component. */
    label: string;
    /** The type of form component to render. */
    component: TComponent;
    /** Field name used for React Hook Form state binding and validation. */
    name: string;
    /**
     * HTML input type. Only applies when `component` is `"input"`.
     * @example "text" | "email" | "password" | "number" | "url" | "search" | "tel"
     */
    inputType?: ComponentProps<"input">["type"];
    /** Initial value for the field. */
    defaultValue?: string | boolean | number | string[] | Date | number[];
    /** Options list for `select`, `multiselect`, and `radio` components. */
    options?: AppSelectOption[];
    /**
     * Disables the field, preventing user interaction.
     * @default false
     */
    disabled?: boolean;
    /** Placeholder text shown when no value is selected or entered. */
    placeholder?: string;
    /** Helper text displayed below the field. */
    caption?: string;
    /**
     * Enables range mode on the `datepicker` component when provided.
     * The two dates define the selectable calendar boundaries.
     */
    calendarRange?: [Date, Date];
    /** Minimum value for the `slider` component. @default 0 */
    min?: number;
    /** Maximum value for the `slider` component. @default 100 */
    max?: number;
    /** Step increment for the `slider` component. @default 1 */
    step?: number;
    /**
     * Async data loader for `async` and `async-multiple` components.
     * Called with the current search query; must return a promise of options.
     */
    fetcher?: (query?: string) => Promise<TAsyncOption[]>;
    /**
     * Custom render function for each option item in the async dropdown.
     * Required for `async` and `async-multiple` components.
     */
    renderOptionItem?: (option: TAsyncOption) => React.ReactNode;
    /**
     * Extracts the unique string value from an async option object.
     * Required for `async` and `async-multiple` components.
     */
    resolveOptionValue?: (option: TAsyncOption) => string;
    /**
     * Custom render function for the selected value chip/label.
     * Required for `async` and `async-multiple` components.
     */
    renderSelectedValue?: (option: TAsyncOption) => React.ReactNode;
    /**
     * Pre-loaded options used to hydrate the async select on mount,
     * avoiding an initial fetch when the value is already known.
     */
    initialOptions?: TAsyncOption[];
    /** Custom node displayed when the async fetcher returns no results at all. */
    notFound?: React.ReactNode;
    /** Message shown when the async search query returns no matching results. */
    noResultsMessage?: string;
    /**
     * Debounce delay in milliseconds for the async search input.
     * @default 300
     */
    debounce?: number;
    /**
     * Allows the user to clear the selected value in the async select.
     * @default false
     */
    clearable?: boolean;
    /** Extra props forwarded directly to the `DatePicker` component. */
    datePickerProps?: Partial<DatePickerProps>;
    /**
     * Column span for the item in the grid.
     * @default undefined (auto, or `"full"` for the last item)
     */
    colSpan?: "1" | "2" | "3" | "full";
    /**
     * Icon to display on the left side of the input.
     * Only applies when `component` is `"input"`.
     */
    iconLeft?: IconName;
    /**
     * Icon to display on the right side of the input.
     * Only applies when `component` is `"input"`.
     */
    iconRight?: IconName;
    /**
     * Enables search/filter functionality inside `select` and `multiselect` dropdowns.
     * @default true
     */
    searchable?: boolean;
    /**
     * Custom render function for the component.
     * Required when `component` is `"custom"`.
     */
    render?: (props: {
        field: ControllerRenderProps<FieldValues, string>;
        error?: string;
        label: React.ReactNode;
    }) => React.ReactNode;
    /**
     * Hides the label above the field.
     * @default false
     */
    hideLabel?: boolean;
    /**
     * Additional props forwarded to the underlying UI component.
     * Strongly typed based on the chosen `component` value.
     */
    componentProps?: AppFormItemComponentProps<TAsyncOption>[TComponent];
    /** Additional CSS class name applied to the item container div. */
    className?: string;
};

declare interface AppFormItemComponentProps<TAsyncOption = unknown> {
    input: Omit<InputProps, "name" | "value" | "onChange" | "onBlur" | "disabled" | "placeholder" | "type" | "iconLeft" | "iconRight" | "label">;
    select: Omit<SingleSelectProps, "options" | "placeholder" | "disabled" | "searchable" | "value" | "onValueChange" | "multiple" | "label">;
    multiselect: Omit<MultiSelectProps, "options" | "placeholder" | "disabled" | "searchable" | "value" | "onValueChange" | "multiple" | "label">;
    textarea: Omit<ComponentProps<typeof Textarea>, "name" | "value" | "onChange" | "onBlur" | "disabled" | "placeholder" | "label">;
    checkbox: Omit<ComponentProps<typeof Checkbox>, "checked" | "onCheckedChange" | "disabled" | "id" | "name">;
    datepicker: Omit<DatePickerProps, "mode" | "value" | "onChange" | "placeholder" | "disabled" | "label">;
    radio: Omit<ComponentProps<typeof RadioGroup>, "value" | "onValueChange" | "disabled" | "name">;
    switch: Omit<ComponentProps<typeof Switch>, "checked" | "onCheckedChange" | "disabled" | "id" | "name">;
    slider: Omit<ComponentProps<typeof Slider>, "value" | "onValueChange" | "min" | "max" | "step" | "disabled">;
    async: Omit<AsyncSelectProps<TAsyncOption>, "multiple" | "fetcher" | "initialOptions" | "renderOptionItem" | "resolveOptionValue" | "renderSelectedValue" | "value" | "onChange" | "placeholder" | "disabled" | "notFound" | "noResultsMessage" | "debounce" | "clearable" | "label">;
    "async-multiple": Omit<AsyncSelectProps<TAsyncOption>, "multiple" | "fetcher" | "initialOptions" | "renderOptionItem" | "resolveOptionValue" | "renderSelectedValue" | "value" | "onChange" | "placeholder" | "disabled" | "notFound" | "noResultsMessage" | "debounce" | "clearable" | "label">;
    custom: Record<string, unknown>;
}

declare interface AppFormProps<TFormValues extends FieldValues = FieldValues, TAsyncOption = unknown> {
    /** Number of grid columns for the form layout. @default "2" */
    cols?: "1" | "2" | "3";
    /** Array of field configurations describing each form field. */
    items: AppFormItem<TAsyncOption, AppFormComponentType>[];
    /** React Hook Form instance returned by `useForm`. */
    form: UseFormReturn<TFormValues>;
    /** Text label for the internal submit button. @default "Invia" */
    submitText?: string;
    /** Callback fired with validated form data on submission. */
    onSubmit?: (data: TFormValues) => void;
    /**
     * When `true`, shows a loading spinner on the submit button.
     * @default false
     */
    isSubmitting?: boolean;
    /**
     * When `true`, renders an internal submit button at the bottom of the form.
     * The button is disabled while the form is invalid or pristine.
     * @default false
     */
    showSubmitButton?: boolean;
}

export declare function AppKanban<T = unknown>({ columns, initialTasks, onTaskMove, onTaskEdit, onTaskCreate, taskActions, renderTaskContent, className, allowTaskCreate, }: AppKanbanConfig<T>): JSX.Element;

export declare type AppKanbanColumn = {
    id: string;
    label: string;
    disabled?: boolean;
    /**
     * Prevent dropping cards into this column.
     */
    disableOnDragIn?: boolean;
    /**
     * Prevent dragging cards out of this column.
     */
    disableOnDragOut?: boolean;
};

export declare type AppKanbanConfig<T = unknown> = {
    columns: AppKanbanColumn[];
    initialTasks: Record<string, AppKanbanTask<T>[]>;
    onTaskMove?: (taskId: string, fromColumn: string, toColumn: string) => void;
    onTaskEdit?: (task: AppKanbanTask<T>, columnId: string) => void;
    onTaskCreate?: (columnId: string) => void;
    taskActions?: (task: AppKanbanTask<T>, columnId: string) => KanbanBoardCardAction[];
    renderTaskContent?: (task: AppKanbanTask<T>, columnId: string) => ReactNode;
    className?: string;
    allowTaskCreate?: boolean;
    createTaskLabel?: string;
};

export declare type AppKanbanTask<T = unknown> = {
    id: string;
    title: string;
    description?: string;
    data?: T;
    meta?: KanbanBoardCardMetaItem[];
    icon?: IconName;
    createTaskLabel?: string;
};

/**
 * @deprecated This component is deprecated. Please use AppSelect component instead.
 */
export declare function AppMultipleSelectDropdown({ options, value, onChange, onClear, placeholder, disabled, size, label, labelClassName, emptyMessage, className, searchPlaceholder, searchable, cancelLabel, maxSelectedItems, }: MultipleSelectDropdownProps): JSX.Element;

/**
 * @deprecated This interface is deprecated. Please use AppSelect component instead.
 */
export declare interface AppMultipleSelectOption {
    value: string;
    label: string;
    disabled?: boolean;
}

export declare function AppRadioGroup({ options, value, defaultValue, onValueChange, label, description, disabled, required, name, orientation, loop, className, wrpClassName, optionClassName, layout, error, id, "data-testid": dataTestId, }: AppRadioGroupProps): JSX.Element;

export declare interface AppRadioGroupOption {
    value: string;
    label: string | React_2.ReactNode;
    description?: string | React_2.ReactNode;
    disabled?: boolean;
    icon?: IconName;
}

export declare interface AppRadioGroupProps {
    options: AppRadioGroupOption[];
    value?: string;
    defaultValue?: string;
    onValueChange?: (value: string) => void;
    label?: string | React_2.ReactNode;
    description?: string | React_2.ReactNode;
    disabled?: boolean;
    required?: boolean;
    name?: string;
    orientation?: "horizontal" | "vertical";
    loop?: boolean;
    className?: string;
    wrpClassName?: string;
    optionClassName?: string;
    layout?: "default" | "card";
    error?: string;
    id?: string;
    "data-testid"?: string;
}

export declare function AppSelect(props: AppSelectProps): JSX.Element;

export declare interface AppSelectOption {
    value: string | number;
    label: string | React.ReactNode;
    disabled?: boolean;
    group?: string;
    fixed?: boolean;
}

export declare type AppSelectProps = SingleSelectProps | MultiSelectProps;

export declare function AppSidebar({ navigation, navigationFooter, headerContent, footerContent, showRail, linkComponent: LinkComponent, linkProps, ...props }: AppSidebarProps): JSX.Element;

declare interface AppSidebarProps extends React_2.ComponentProps<typeof Sidebar> {
    navigation: NavGroup[];
    navigationFooter?: NavGroup[];
    versions?: string[];
    defaultVersion?: string;
    headerContent?: React_2.ReactNode;
    footerContent?: React_2.ReactNode;
    showRail?: boolean;
    linkComponent?: React_2.ComponentType<React_2.AnchorHTMLAttributes<HTMLAnchorElement> & {
        href: string;
    }>;
    linkProps?: Record<string, unknown>;
}

export declare interface AppStep {
    id: number;
    label: React_2.ReactNode;
    component: React_2.ReactNode;
    completed?: boolean;
    disabled?: boolean;
    loading?: boolean;
    "data-testid"?: string;
}

export declare function AppStepper({ steps, align, size, showSeparators, defaultStep, allowStepNavigation, allowClickOnlyCompleted, onStepClick, indicators, id, "data-testid": dataTestId, ...stepperProps }: AppStepperProps): JSX.Element;

export declare interface AppStepperProps extends Omit<StepperProps, "children"> {
    steps: AppStep[];
    align?: "horizontal" | "vertical";
    size?: "sm" | "md";
    showSeparators?: boolean;
    defaultStep?: number;
    allowStepNavigation?: boolean;
    allowClickOnlyCompleted?: boolean;
    onStepClick?: (step: AppStep, index: number) => void;
    indicators?: StepIndicators;
    id?: string;
    "data-testid"?: string;
}

export declare function AppTimePicker(props: AppTimePickerProps): JSX.Element;

export declare interface AppTimePickerProps {
    /** The currently selected time as a Date object (controlled). */
    value?: Date;
    /** Callback fired when the selected time changes. */
    onChange?: (date: Date | undefined) => void;
    /** Callback fired when the value is cleared. */
    onClear?: () => void;
    /** Label displayed above the trigger. */
    label?: string | React.ReactNode;
    /** Placeholder text shown when no time is selected. @default "Seleziona orario" */
    placeholder?: string;
    /** Disables the time picker. @default false */
    disabled?: boolean;
    /** Show a clear button to reset the selection. @default false */
    clearable?: boolean;
    /** Additional CSS classes applied to the trigger element. */
    className?: string;
    /** CSS classes for the label element. */
    labelClassName?: string;
    /** CSS classes for the outer wrapper `<div>`. */
    wrpClassName?: string;
    /** Size variant of the trigger. @default "default" */
    size?: AppTimePickerSize;
    /** Visual variant of the trigger. @default "default" */
    variant?: AppTimePickerVariant;
    /** Use UTC time instead of local time. @default false */
    useUtc?: boolean;
    /** Show seconds column in the time picker. @default false */
    withSeconds?: boolean;
    /** Step interval for minute options. Must be between 1 and 59. @default 1 */
    minuteStep?: number;
    /** Step interval for second options. Must be between 1 and 59. @default 1 */
    secondStep?: number;
    /** HTML `id` for the trigger element. */
    id?: string;
    /** `data-testid` attribute for E2E testing (e.g. Playwright). */
    "data-testid"?: string;
    /** Minimum selectable time. Hours/minutes/seconds before this are disabled. */
    minTime?: Date;
    /** Maximum selectable time. Hours/minutes/seconds after this are disabled. */
    maxTime?: Date;
}

export declare type AppTimePickerSize = "sm" | "default" | "lg";

export declare type AppTimePickerVariant = "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";

export declare function AppTooltip({ content, children, label, labelClassName, header, variant, triggerVariant, size, className, wrpClassName, contentClassName, side, align, sideOffset, matchTriggerWidth, delayDuration, disabled, asChild, }: AppTooltipProps): JSX.Element;

export declare type AppTooltipAlign = TooltipContentProps_2["align"];

declare interface AppTooltipProps {
    /** Content displayed inside the tooltip */
    content: React_2.ReactNode;
    /** Element that triggers the tooltip on hover/focus */
    children: React_2.ReactNode;
    /** Optional label displayed above the tooltip trigger */
    label?: string | React_2.ReactNode;
    /** Optional header displayed at the top of the tooltip content */
    header?: string | React_2.ReactNode;
    /** Tooltip content variant - affects background and styling */
    variant?: AppTooltipVariant;
    /** Trigger element variant - affects hover states */
    triggerVariant?: VariantProps<typeof tooltipTriggerVariants>["variant"];
    /** Size of the trigger element */
    size?: VariantProps<typeof tooltipTriggerVariants>["size"];
    /** Additional className for the trigger wrapper */
    className?: string;
    /** Additional className for the outer wrapper (includes label) */
    wrpClassName?: string;
    /** Additional className for the tooltip content */
    contentClassName?: string;
    /** Additional className for the label */
    labelClassName?: string;
    /** Side where the tooltip appears */
    side?: AppTooltipSide;
    /** Alignment of the tooltip relative to the trigger */
    align?: AppTooltipAlign;
    /** Offset from the trigger in pixels */
    sideOffset?: number;
    /** Whether the tooltip should match the trigger's width */
    matchTriggerWidth?: boolean;
    /** Delay before showing tooltip (ms) */
    delayDuration?: number;
    /** Whether to disable the tooltip */
    disabled?: boolean;
    /** Whether to use asChild pattern for trigger (for custom elements) */
    asChild?: boolean;
}

export declare type AppTooltipSide = TooltipContentProps_2["side"];

export declare type AppTooltipVariant = VariantProps<typeof tooltipVariants>["variant"];

export declare function AspectRatio({ ...props }: AspectRatioProps): JSX.Element;

declare type AspectRatioProps = React.ComponentProps<typeof AspectRatioPrimitive.Root>;

export declare function AsyncSelect<T = Option_2>({ fetcher, initialOptions, debounce, renderOptionItem, resolveOptionValue, renderSelectedValue, notFound, label, placeholder, value, onChange, disabled, className, wrpClassName, noResultsMessage, clearable, multiple, size, id, "data-testid": dataTestId, }: AsyncSelectProps<T>): JSX.Element;

declare interface AsyncSelectMultipleProps<T> extends VariantProps<typeof selectTriggerVariants> {
    multiple: boolean;
    fetcher: (query?: string) => Promise<T[]>;
    initialOptions?: T[];
    debounce?: number;
    renderOptionItem: (option: T) => React_2.ReactNode;
    resolveOptionValue: (option: T) => string;
    renderSelectedValue: (option: T) => React_2.ReactNode;
    notFound?: React_2.ReactNode;
    value?: string[];
    onChange?: (value: string[]) => void;
    label?: string | React_2.ReactNode;
    placeholder?: string;
    disabled?: boolean;
    className?: string;
    wrpClassName?: string;
    noResultsMessage?: string;
    clearable?: boolean;
    id?: string;
    "data-testid"?: string;
}

declare type AsyncSelectProps<T> = AsyncSelectSingleProps<T> | AsyncSelectMultipleProps<T>;

declare interface AsyncSelectSingleProps<T> extends VariantProps<typeof selectTriggerVariants> {
    multiple?: false;
    fetcher: (query?: string) => Promise<T[]>;
    initialOptions?: T[];
    debounce?: number;
    renderOptionItem: (option: T) => React_2.ReactNode;
    resolveOptionValue: (option: T) => string;
    renderSelectedValue: (option: T) => React_2.ReactNode;
    notFound?: React_2.ReactNode;
    value?: string;
    onChange?: (value: string) => void;
    label?: string | React_2.ReactNode;
    placeholder?: string;
    disabled?: boolean;
    className?: string;
    wrpClassName?: string;
    noResultsMessage?: string;
    clearable?: boolean;
    id?: string;
    "data-testid"?: string;
}

declare interface Attachment {
    name?: string;
    contentType?: string;
    url: string;
}

export declare function AudioVisualizer({ stream, isRecording, onClick, }: AudioVisualizerProps): JSX.Element;

declare interface AudioVisualizerProps {
    stream: MediaStream | null;
    isRecording: boolean;
    onClick: () => void;
}

export declare function Avatar({ className, ...props }: React_2.ComponentProps<typeof AvatarPrimitive.Root>): JSX.Element;

export declare function AvatarFallback({ className, ...props }: React_2.ComponentProps<typeof AvatarPrimitive.Fallback>): JSX.Element;

export declare function AvatarImage({ className, ...props }: React_2.ComponentProps<typeof AvatarPrimitive.Image>): JSX.Element;

export declare interface AvatarItem {
    src: string;
    alt?: string;
}

export declare function Badge({ className, variant, asChild, disabled, iconLeft, iconRight, ...props }: BadgeProps & React_2.ComponentProps<"span">): JSX.Element;

export declare interface BadgeProps extends React_2.ComponentPropsWithoutRef<"span"> {
    variant?: "default" | "destructive" | "warning" | "success" | "outline" | "outline-primary" | "outline-destructive" | "outline-warning" | "outline-success" | "secondary" | "ghost" | "ghost-destructive" | "ghost-accent" | "ghost-warning" | "ghost-success" | "link";
    asChild?: boolean;
    disabled?: boolean;
    iconLeft?: IconName;
    iconRight?: IconName;
}

export declare const badgeVariants: (props?: ({
    variant?: "link" | "default" | "outline" | "ghost" | "destructive" | "warning" | "success" | "outline-primary" | "outline-destructive" | "outline-warning" | "outline-success" | "secondary" | "ghost-destructive" | "ghost-accent" | "ghost-warning" | "ghost-success" | null | undefined;
} & ClassProp) | undefined) => string;

declare type BarItemDataType = RepeatDataType | NoRepeatDataType;

/** Base configuration for all column types — discriminated on accessorKey presence */
export declare type BaseColumnConfig<TData> = DistributedAccessorConfig<TData> | DisplayColumnConfig<TData>;

/** Common fields shared by all column configs */
declare type BaseColumnFields = {
    id?: string;
    sortable?: boolean;
    filterable?: boolean;
    searchable?: boolean;
    pinned?: "left" | "right";
    headerClassName?: string;
} & HeaderConfig;

declare type BaseProps = {
    options: AppSelectOption[];
    placeholder?: string;
    searchPlaceholder?: string;
    emptyPlaceholder?: string;
    addItemPlaceholder?: string;
    noGroupLabel?: string;
    itemCountMessage?: (selected: number) => string;
    maxSelectedMessage?: (max: number) => string;
    label?: string | React.ReactNode;
    className?: string;
    labelClassName?: string;
    wrpClassName?: string;
    searchable?: boolean;
    creatable?: boolean;
    isSingleSelectClearable?: boolean;
    disabled?: boolean;
    maxSelected?: number;
    showChipsInsteadOfCount?: boolean;
    size?: SelectSizeType;
    onClear?: () => void;
    id?: string;
    "data-testid"?: string;
};

export declare function Breadcrumb({ ...props }: React_2.ComponentProps<"nav">): JSX.Element;

export declare function BreadcrumbEllipsis({ className, ...props }: React_2.ComponentProps<"span">): JSX.Element;

export declare function BreadcrumbItem({ className, ...props }: React_2.ComponentProps<"li">): JSX.Element;

export declare function BreadcrumbLink({ asChild, className, ...props }: React_2.ComponentProps<"a"> & {
    asChild?: boolean;
}): JSX.Element;

export declare function BreadcrumbList({ className, ...props }: React_2.ComponentProps<"ol">): JSX.Element;

export declare function BreadcrumbPage({ className, ...props }: React_2.ComponentProps<"span">): JSX.Element;

export declare function BreadcrumbSeparator({ children, className, ...props }: React_2.ComponentProps<"li">): JSX.Element;

export declare function Button({ className, variant, size, asChild, iconLeft, iconRight, isLoading, ...props }: ButtonProps): JSX.Element;

export declare interface ButtonProps extends React_2.ComponentProps<"button"> {
    variant?: ButtonVariant;
    size?: ButtonSize;
    asChild?: boolean;
    iconLeft?: IconName;
    iconRight?: IconName;
    isLoading?: boolean;
}

export declare type ButtonSize = "default" | "sm" | "lg" | "icon";

export declare type ButtonVariant = "default" | "destructive" | "outline" | "outline-primary" | "outline-destructive" | "secondary" | "ghost" | "ghost-destructive" | "ghost-accent" | "link";

export declare const buttonVariants: (props?: ({
    variant?: "link" | "default" | "outline" | "ghost" | "destructive" | "outline-primary" | "outline-destructive" | "secondary" | "ghost-destructive" | "ghost-accent" | null | undefined;
    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
} & ClassProp) | undefined) => string;

export declare function Calendar({ className, classNames, showOutsideDays, buttonVariant, formatters, components, locale, minDate, maxDate, disabled, ...props }: CalendarProps): JSX.Element;

export declare interface CalendarAppointment {
    id: number;
    title: string;
    description?: string;
    date: string;
    startTime: string;
    endTime?: string;
    color?: string;
    attributes?: {
        key: string;
        value: default_2.ReactNode | string;
        showPreview?: boolean;
        showTooltip?: boolean;
    }[];
    className?: string;
    groupBy?: string;
}

export declare type CalendarProps = React_2.ComponentProps<typeof DayPicker> & {
    buttonVariant?: React_2.ComponentProps<typeof Button>["variant"];
    minDate?: Date;
    maxDate?: Date;
};

export declare function Card({ className, size, ...props }: CardProps): JSX.Element;

export declare function CardContent({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;

export declare function CardDescription({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;

export declare function CardFooter({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;

export declare function CardHeader({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;

export declare interface CardProps extends React_2.ComponentProps<"div"> {
    size?: CardSize;
}

declare type CardSize = "default" | "sm" | "lg" | "none";

export declare function CardTitle({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;

export declare function Carousel({ orientation, opts, setApi, plugins, className, children, ...props }: React_2.ComponentProps<"div"> & CarouselProps): JSX.Element;

declare type CarouselApi = UseEmblaCarouselType[1];

export declare function CarouselContent({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;

export declare function CarouselItem({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;

export declare function CarouselNext({ className, variant, size, ...props }: React_2.ComponentProps<typeof Button>): JSX.Element;

declare type CarouselOptions = UseCarouselParameters[0];

declare type CarouselPlugin = UseCarouselParameters[1];

export declare function CarouselPrevious({ className, variant, size, ...props }: React_2.ComponentProps<typeof Button>): JSX.Element;

declare type CarouselProps = {
    opts?: CarouselOptions;
    plugins?: CarouselPlugin;
    orientation?: "horizontal" | "vertical";
    setApi?: (api: CarouselApi) => void;
};

declare const Chart: default_2.FC<ChartProps>;

export declare type ChartConfig = {
    [k in string]: {
        label?: React_2.ReactNode;
        icon?: React_2.ComponentType;
    } & ({
        color?: string;
        theme?: never;
    } | {
        color?: never;
        theme: Record<keyof typeof THEMES, string>;
    });
};

export declare function ChartContainer({ id, className, children, config, ...props }: React_2.ComponentProps<"div"> & {
    config: ChartConfig;
    children: React_2.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>["children"];
}): JSX.Element;

export declare const ChartLegend: typeof RechartsPrimitive.Legend;

export declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, }: {
    className?: string;
    hideIcon?: boolean;
    payload?: Array<{
        value?: string;
        dataKey?: string;
        color?: string;
    }>;
    verticalAlign?: "top" | "middle" | "bottom";
    nameKey?: string;
} & React_2.HTMLAttributes<HTMLDivElement>): JSX.Element | null;

declare interface ChartProps {
    data: GanttDataType[];
    className?: string;
    onBarDoubleClick?: OnBarDoubleClickType;
    onBarChange?: OnBarChangeType;
    treeTitle?: string;
}

export declare const ChartStyle: ({ id, config }: {
    id: string;
    config: ChartConfig;
}) => JSX.Element | null;

export declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;

export declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: {
    active?: boolean;
    payload?: Array<{
        dataKey?: string;
        name?: string;
        value?: unknown;
        color?: string;
        payload?: Record<string, unknown>;
    }>;
    label?: string | number;
    className?: string;
    indicator?: "line" | "dot" | "dashed";
    hideLabel?: boolean;
    hideIndicator?: boolean;
    labelFormatter?: (value: unknown, payload: unknown) => React_2.ReactNode;
    labelClassName?: string;
    formatter?: (value: unknown, name: unknown, item: unknown, index: number, payload: unknown) => React_2.ReactNode;
    color?: string;
    nameKey?: string;
    labelKey?: string;
} & React_2.HTMLAttributes<HTMLDivElement>): JSX.Element | null;

export declare function Chat({ messages, welcomeTitle, handleSubmit, input, handleInputChange, stop, isGenerating, append, suggestions, className, onRateResponse, setMessages, transcribeAudio, allowAttachments, onEdit, onMessageSave, }: ChatProps): JSX.Element;

export declare namespace Chat {
    var displayName: string;
}

declare const chatBubbleVariants: (props?: ({
    isUser?: boolean | null | undefined;
    animation?: "none" | "scale" | "slide" | "fade" | null | undefined;
} & ClassProp) | undefined) => string;

export declare const ChatContainer: ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>>;

export declare const ChatForm: ForwardRefExoticComponent<ChatFormProps & RefAttributes<HTMLFormElement>>;

declare interface ChatFormProps {
    className?: string;
    isPending: boolean;
    handleSubmit: (event?: {
        preventDefault?: () => void;
    }, options?: {
        experimental_attachments?: FileList;
    }) => void;
    children: (props: {
        files: File[] | null;
        setFiles: React.Dispatch<React.SetStateAction<File[] | null>>;
    }) => ReactElement;
}

export declare const ChatMessage: default_2.FC<ChatMessageProps>;

export declare interface ChatMessageProps extends Message {
    showTimeStamp?: boolean;
    animation?: Animation_2;
    actions?: default_2.ReactNode;
    editable?: boolean;
    onEdit?: (newContent: string) => void;
    onMessageSave?: (messageId: string, content: string) => void;
}

export declare function ChatMessages({ children }: React.PropsWithChildren): JSX.Element;

declare type ChatProps = ChatPropsWithoutSuggestions | ChatPropsWithSuggestions;

declare interface ChatPropsBase {
    handleSubmit: (event?: {
        preventDefault?: () => void;
    }, options?: {
        experimental_attachments?: FileList;
    }) => void;
    messages: Array<Message>;
    input: string;
    className?: string;
    handleInputChange: React.ChangeEventHandler<HTMLTextAreaElement>;
    isGenerating: boolean;
    stop?: () => void;
    onRateResponse?: (messageId: string, rating: "thumbs-up" | "thumbs-down") => void;
    setMessages?: (messages: any[]) => void;
    transcribeAudio?: (blob: Blob) => Promise<string>;
    allowAttachments?: boolean;
    onEdit?: (messageId: string, newContent: string) => void;
    onMessageSave?: (messageId: string, content: string) => void;
    welcomeTitle?: string;
}

declare interface ChatPropsWithoutSuggestions extends ChatPropsBase {
    append?: never;
    suggestions?: never;
}

declare interface ChatPropsWithSuggestions extends ChatPropsBase {
    append: (message: {
        role: "user";
        content: string;
    }) => void;
    suggestions: string[];
}

export declare function Checkbox({ className, checked, ...props }: React_2.ComponentProps<typeof CheckboxPrimitive.Root>): JSX.Element;

export declare function CircularProgress({ value, renderLabel, className, progressClassName, labelClassName, showLabel, shape, size, strokeWidth, circleStrokeWidth, progressStrokeWidth, }: CircularProgressProps): JSX.Element;

declare interface CircularProgressProps {
    value: number;
    renderLabel?: (progress: number) => number | string;
    size?: number;
    strokeWidth?: number;
    circleStrokeWidth?: number;
    progressStrokeWidth?: number;
    shape?: "square" | "round";
    className?: string;
    progressClassName?: string;
    labelClassName?: string;
    showLabel?: boolean;
}

export declare function cn(...inputs: ClassValue[]): string;

export declare function Collapsible({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.Root>): JSX.Element;

export declare function CollapsibleContent({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>): JSX.Element;

export declare function CollapsibleTrigger({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>): JSX.Element;

export declare const Command: React_2.ForwardRefExoticComponent<Omit<{
    children?: React_2.ReactNode;
} & Pick<Pick<React_2.DetailedHTMLProps<React_2.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React_2.HTMLAttributes<HTMLDivElement>> & {
    ref?: React_2.Ref<HTMLDivElement>;
} & {
    asChild?: boolean;
}, "key" | keyof React_2.HTMLAttributes<HTMLDivElement> | "asChild"> & {
    label?: string;
    shouldFilter?: boolean;
    filter?: (value: string, search: string, keywords?: string[]) => number;
    defaultValue?: string;
    value?: string;
    onValueChange?: (value: string) => void;
    loop?: boolean;
    disablePointerSelection?: boolean;
    vimBindings?: boolean;
} & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;

export declare function CommandDialog({ title, description, children, ...props }: React_2.ComponentProps<typeof Dialog> & {
    title?: string;
    description?: string;
}): JSX.Element;

export declare function CommandEmpty({ ...props }: React_2.ComponentProps<typeof Command_2.Empty>): JSX.Element;

export declare function CommandGroup({ className, ...props }: React_2.ComponentProps<typeof Command_2.Group>): JSX.Element;

export declare function CommandInput({ className, ...props }: React_2.ComponentProps<typeof Command_2.Input>): JSX.Element;

export declare function CommandItem({ className, ...props }: React_2.ComponentProps<typeof Command_2.Item>): JSX.Element;

export declare function CommandList({ className, ...props }: React_2.ComponentProps<typeof Command_2.List>): JSX.Element;

export declare function CommandSeparator({ className, ...props }: React_2.ComponentProps<typeof Command_2.Separator>): JSX.Element;

export declare function CommandShortcut({ className, ...props }: React_2.ComponentProps<"span">): JSX.Element;

declare const confirm_2: (payload: ConfirmOptions) => Promise<boolean>;
export { confirm_2 as confirm }

export declare interface ConfirmedCell {
    fromId: string;
    toId: string;
    id?: string;
    value: unknown;
}

export declare interface ConfirmedCellsData {
    editedCells: ConfirmedCell[];
    toDefaultCells: ConfirmedCell[];
}

export declare const Confirmer: () => JSX.Element;

declare interface ConfirmOptions {
    title?: React.ReactNode;
    description?: React.ReactNode;
    cancelText?: React.ReactNode;
    actionText?: React.ReactNode;
    CancelProps?: React.ComponentProps<typeof AlertDialogCancel>;
    ActionProps?: React.ComponentProps<typeof Button>;
    variant?: "default" | "destructive";
}

export declare function ContextMenu({ ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.Root>): JSX.Element;

export declare function ContextMenuCheckboxItem({ className, children, checked, ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.CheckboxItem>): JSX.Element;

export declare function ContextMenuContent({ className, ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.Content>): JSX.Element;

export declare function ContextMenuGroup({ ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.Group>): JSX.Element;

export declare function ContextMenuItem({ className, inset, variant, ...props }: React_2.ComponentProps<typeof Cont