@andreagiugni/tailwind-dashboard-ui 0.1.0 → 0.3.0

package/dist/index.d.cts

@@ -137,30 +137,8 @@ interface DropzoneProps {
 /** Drag-and-drop file upload area — dependency-free (native HTML5 drag/drop). */
 declare const Dropzone: React.FC<DropzoneProps>;
 
-interface TableProps extends React.TableHTMLAttributes<HTMLTableElement> {
-}
-declare const Table: React.FC<TableProps>;
-interface TableSectionProps extends React.HTMLAttributes<HTMLTableSectionElement> {
-}
-declare const TableHeader: React.FC<TableSectionProps>;
-declare const TableBody: React.FC<TableSectionProps>;
-interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement> {
-}
-declare const TableRow: React.FC<TableRowProps>;
-interface TableCellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {
-    isHeader?: boolean;
-}
-declare const TableCell: React.FC<TableCellProps>;
-
-interface PaginationProps {
-    currentPage: number;
-    totalPages: number;
-    onPageChange: (page: number) => void;
-}
-declare const Pagination: React.FC<PaginationProps>;
-
 type SortDirection = "asc" | "desc";
-interface DataTableColumn<T> {
+interface TableColumn<T> {
     /** Key into the row object — also the value used for sorting/searching. */
     key: Extract<keyof T, string>;
     /** Column header label. */
@@ -174,12 +152,17 @@ interface DataTableColumn<T> {
     /** Extra classes applied to this column's header and body cells. */
     className?: string;
 }
-interface DataTableProps<T> {
+interface TableProps<T = Record<string, unknown>> extends Omit<React.TableHTMLAttributes<HTMLTableElement>, "children"> {
+    /**
+     * Composable content (Table / TableHeader / TableBody / TableRow / TableCell).
+     * Used when `columns` is **not** provided.
+     */
+    children?: React.ReactNode;
     /** The array of row objects to display. */
-    data: T[];
-    /** Column definitions (label, sortable, custom render, …). */
-    columns: DataTableColumn<T>[];
-    /** Rows shown per page. Default: 10. */
+    data?: T[];
+    /** Column definitions. Providing this switches Table into data-driven mode. */
+    columns?: TableColumn<T>[];
+    /** Maximum number of rows shown per page. Default: 10. */
     rowsPerPage?: number;
     /** Options for the "Show N entries" selector. Default: [5, 10, 25, 50]. Pass [] to hide it. */
     rowsPerPageOptions?: number[];
@@ -187,12 +170,13 @@ interface DataTableProps<T> {
     pagination?: boolean;
     /** Render the "Show N entries" selector (only when pagination is on). Default: true. */
     showSizeSelector?: boolean;
-    /** Render the search field. Default: true. */
-    searchable?: boolean;
+    /**
+     * Fields matched when searching. The search input is shown **only** when this
+     * is a non-empty array — omit it (or pass `[]`) to hide the search box.
+     */
+    searchKeys?: Extract<keyof T, string>[];
     /** Placeholder for the search field. Default: "Search...". */
     searchPlaceholder?: string;
-    /** Keys matched when searching. Defaults to every column key. */
-    searchKeys?: Extract<keyof T, string>[];
     /** Column sorted on first render. */
     defaultSortKey?: Extract<keyof T, string>;
     /** Initial sort direction. Default: "asc". */
@@ -203,10 +187,26 @@ interface DataTableProps<T> {
     onRowClick?: (row: T, index: number) => void;
     /** Shown when no rows match. Default: "No matching records". */
     emptyContent?: React.ReactNode;
-    /** Extra classes for the outer wrapper. */
-    className?: string;
 }
-declare function DataTable<T extends Record<string, unknown>>({ data, columns, rowsPerPage, rowsPerPageOptions, pagination, showSizeSelector, searchable, searchPlaceholder, searchKeys, defaultSortKey, defaultSortDirection, getRowId, onRowClick, emptyContent, className, }: DataTableProps<T>): React.JSX.Element;
+interface TableSectionProps extends React.HTMLAttributes<HTMLTableSectionElement> {
+}
+declare const TableHeader: React.FC<TableSectionProps>;
+declare const TableBody: React.FC<TableSectionProps>;
+interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement> {
+}
+declare const TableRow: React.FC<TableRowProps>;
+interface TableCellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {
+    isHeader?: boolean;
+}
+declare const TableCell: React.FC<TableCellProps>;
+declare function Table<T extends Record<string, unknown> = Record<string, unknown>>({ children, data, columns, rowsPerPage, rowsPerPageOptions, pagination, showSizeSelector, searchKeys, searchPlaceholder, defaultSortKey, defaultSortDirection, getRowId, onRowClick, emptyContent, className, ...rest }: TableProps<T>): React.JSX.Element;
+
+interface PaginationProps {
+    currentPage: number;
+    totalPages: number;
+    onPageChange: (page: number) => void;
+}
+declare const Pagination: React.FC<PaginationProps>;
 
 interface BreadcrumbItem {
     label: string;
@@ -224,6 +224,45 @@ interface ThemeToggleButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
 }
 declare const ThemeToggleButton: React.FC<ThemeToggleButtonProps>;
 
+interface CardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title">, ColorOverrideProps {
+    /** Heading shown above the description. */
+    title?: React.ReactNode;
+    /** Supporting text rendered under the title. */
+    description?: React.ReactNode;
+    /** Icon rendered in a rounded square above the title. */
+    icon?: React.ReactNode;
+    /** Optional cover image source. Rendered on top (or alongside when `horizontal`). */
+    image?: string;
+    /** Alt text for the cover image. */
+    imageAlt?: string;
+    /** Lay the image alongside the content instead of on top. */
+    horizontal?: boolean;
+    /** Footer area, e.g. a link or a `Button` call-to-action. */
+    footer?: React.ReactNode;
+    /** Custom body content, rendered after the description. */
+    children?: React.ReactNode;
+}
+declare const Card: React.FC<CardProps>;
+
+type ToastVariant = "success" | "danger" | "warning" | "info";
+interface ToastProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title">, ColorOverrideProps {
+    /** Color/severity variant. */
+    variant?: ToastVariant;
+    title: React.ReactNode;
+    message?: React.ReactNode;
+    /** Override the default variant icon. */
+    icon?: React.ReactNode;
+    /** Hide the leading icon entirely. */
+    hideIcon?: boolean;
+    /** Render the dismiss button (default `true`). */
+    showCloseButton?: boolean;
+    /** Called when the close button is clicked. */
+    onClose?: () => void;
+    /** Hide the colored accent bar at the bottom. */
+    hideAccentBar?: boolean;
+}
+declare const Toast: React.FC<ToastProps>;
+
 type AccordionSelectionMode = "single" | "multiple";
 interface AccordionItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
     /** Unique key identifying this item. */
@@ -570,4 +609,4 @@ interface SliderProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>,
 }
 declare const Slider: React.FC<SliderProps>;
 
-export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, type AccordionSelectionMode, Alert, type AlertProps, type AlertVariant, Avatar, type AvatarProps, type AvatarSize, type AvatarStatus, AvatarText, type AvatarTextProps, Badge, type BadgeColor, type BadgeProps, type BadgeSize, type BadgeVariant, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonProps, Checkbox, type CheckboxProps, Chip, type ChipColor, type ChipProps, type ChipSize, type ChipVariant, Code, type CodeColor, type CodeProps, type CodeSize, ColorOverrideProps, DataTable, type DataTableColumn, type DataTableProps, DatePicker, type DatePickerProps, DateTimePicker, type DateTimePickerProps, Drawer, type DrawerPlacement, type DrawerProps, Dropdown, DropdownItem, type DropdownItemProps, type DropdownItemVariant, type DropdownProps, Dropzone, type DropzoneProps, FileInput, type FileInputProps, Form, type FormProps, Input, type InputProps, Label, type LabelProps, Modal, type ModalProps, type ModalVariant, MultiSelect, type MultiSelectProps, Pagination, type PaginationProps, PasswordInput, type PasswordInputProps, Popover, type PopoverPlacement, type PopoverProps, Progress, type ProgressColor, type ProgressProps, type ProgressSize, Radio, type RadioProps, RadioSm, type RadioSmProps, Ribbon, type RibbonColor, type RibbonPosition, type RibbonProps, type RibbonVariant, Select, type SelectProps, Skeleton, type SkeletonProps, Slider, type SliderColor, type SliderProps, Snippet, type SnippetProps, type SnippetSize, type SortDirection, Spinner, type SpinnerColor, type SpinnerProps, type SpinnerSize, Switch, type SwitchProps, Tab, type TabProps, Table, TableBody, TableCell, type TableCellProps, TableHeader, type TableProps, TableRow, type TableRowProps, type TableSectionProps, Tabs, type TabsProps, type TabsVariant, TextArea, type TextAreaProps, ThemeToggleButton, type ThemeToggleButtonProps, Tooltip, type TooltipPlacement, type TooltipProps, cn };
+export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, type AccordionSelectionMode, Alert, type AlertProps, type AlertVariant, Avatar, type AvatarProps, type AvatarSize, type AvatarStatus, AvatarText, type AvatarTextProps, Badge, type BadgeColor, type BadgeProps, type BadgeSize, type BadgeVariant, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonProps, Card, type CardProps, Checkbox, type CheckboxProps, Chip, type ChipColor, type ChipProps, type ChipSize, type ChipVariant, Code, type CodeColor, type CodeProps, type CodeSize, ColorOverrideProps, DatePicker, type DatePickerProps, DateTimePicker, type DateTimePickerProps, Drawer, type DrawerPlacement, type DrawerProps, Dropdown, DropdownItem, type DropdownItemProps, type DropdownItemVariant, type DropdownProps, Dropzone, type DropzoneProps, FileInput, type FileInputProps, Form, type FormProps, Input, type InputProps, Label, type LabelProps, Modal, type ModalProps, type ModalVariant, MultiSelect, type MultiSelectProps, Pagination, type PaginationProps, PasswordInput, type PasswordInputProps, Popover, type PopoverPlacement, type PopoverProps, Progress, type ProgressColor, type ProgressProps, type ProgressSize, Radio, type RadioProps, RadioSm, type RadioSmProps, Ribbon, type RibbonColor, type RibbonPosition, type RibbonProps, type RibbonVariant, Select, type SelectProps, Skeleton, type SkeletonProps, Slider, type SliderColor, type SliderProps, Snippet, type SnippetProps, type SnippetSize, type SortDirection, Spinner, type SpinnerColor, type SpinnerProps, type SpinnerSize, Switch, type SwitchProps, Tab, type TabProps, Table, TableBody, TableCell, type TableCellProps, type TableColumn, TableHeader, type TableProps, TableRow, type TableRowProps, type TableSectionProps, Tabs, type TabsProps, type TabsVariant, TextArea, type TextAreaProps, ThemeToggleButton, type ThemeToggleButtonProps, Toast, type ToastProps, type ToastVariant, Tooltip, type TooltipPlacement, type TooltipProps, cn };

package/dist/index.d.ts

@@ -137,30 +137,8 @@ interface DropzoneProps {
 /** Drag-and-drop file upload area — dependency-free (native HTML5 drag/drop). */
 declare const Dropzone: React.FC<DropzoneProps>;
 
-interface TableProps extends React.TableHTMLAttributes<HTMLTableElement> {
-}
-declare const Table: React.FC<TableProps>;
-interface TableSectionProps extends React.HTMLAttributes<HTMLTableSectionElement> {
-}
-declare const TableHeader: React.FC<TableSectionProps>;
-declare const TableBody: React.FC<TableSectionProps>;
-interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement> {
-}
-declare const TableRow: React.FC<TableRowProps>;
-interface TableCellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {
-    isHeader?: boolean;
-}
-declare const TableCell: React.FC<TableCellProps>;
-
-interface PaginationProps {
-    currentPage: number;
-    totalPages: number;
-    onPageChange: (page: number) => void;
-}
-declare const Pagination: React.FC<PaginationProps>;
-
 type SortDirection = "asc" | "desc";
-interface DataTableColumn<T> {
+interface TableColumn<T> {
     /** Key into the row object — also the value used for sorting/searching. */
     key: Extract<keyof T, string>;
     /** Column header label. */
@@ -174,12 +152,17 @@ interface DataTableColumn<T> {
     /** Extra classes applied to this column's header and body cells. */
     className?: string;
 }
-interface DataTableProps<T> {
+interface TableProps<T = Record<string, unknown>> extends Omit<React.TableHTMLAttributes<HTMLTableElement>, "children"> {
+    /**
+     * Composable content (Table / TableHeader / TableBody / TableRow / TableCell).
+     * Used when `columns` is **not** provided.
+     */
+    children?: React.ReactNode;
     /** The array of row objects to display. */
-    data: T[];
-    /** Column definitions (label, sortable, custom render, …). */
-    columns: DataTableColumn<T>[];
-    /** Rows shown per page. Default: 10. */
+    data?: T[];
+    /** Column definitions. Providing this switches Table into data-driven mode. */
+    columns?: TableColumn<T>[];
+    /** Maximum number of rows shown per page. Default: 10. */
     rowsPerPage?: number;
     /** Options for the "Show N entries" selector. Default: [5, 10, 25, 50]. Pass [] to hide it. */
     rowsPerPageOptions?: number[];
@@ -187,12 +170,13 @@ interface DataTableProps<T> {
     pagination?: boolean;
     /** Render the "Show N entries" selector (only when pagination is on). Default: true. */
     showSizeSelector?: boolean;
-    /** Render the search field. Default: true. */
-    searchable?: boolean;
+    /**
+     * Fields matched when searching. The search input is shown **only** when this
+     * is a non-empty array — omit it (or pass `[]`) to hide the search box.
+     */
+    searchKeys?: Extract<keyof T, string>[];
     /** Placeholder for the search field. Default: "Search...". */
     searchPlaceholder?: string;
-    /** Keys matched when searching. Defaults to every column key. */
-    searchKeys?: Extract<keyof T, string>[];
     /** Column sorted on first render. */
     defaultSortKey?: Extract<keyof T, string>;
     /** Initial sort direction. Default: "asc". */
@@ -203,10 +187,26 @@ interface DataTableProps<T> {
     onRowClick?: (row: T, index: number) => void;
     /** Shown when no rows match. Default: "No matching records". */
     emptyContent?: React.ReactNode;
-    /** Extra classes for the outer wrapper. */
-    className?: string;
 }
-declare function DataTable<T extends Record<string, unknown>>({ data, columns, rowsPerPage, rowsPerPageOptions, pagination, showSizeSelector, searchable, searchPlaceholder, searchKeys, defaultSortKey, defaultSortDirection, getRowId, onRowClick, emptyContent, className, }: DataTableProps<T>): React.JSX.Element;
+interface TableSectionProps extends React.HTMLAttributes<HTMLTableSectionElement> {
+}
+declare const TableHeader: React.FC<TableSectionProps>;
+declare const TableBody: React.FC<TableSectionProps>;
+interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement> {
+}
+declare const TableRow: React.FC<TableRowProps>;
+interface TableCellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {
+    isHeader?: boolean;
+}
+declare const TableCell: React.FC<TableCellProps>;
+declare function Table<T extends Record<string, unknown> = Record<string, unknown>>({ children, data, columns, rowsPerPage, rowsPerPageOptions, pagination, showSizeSelector, searchKeys, searchPlaceholder, defaultSortKey, defaultSortDirection, getRowId, onRowClick, emptyContent, className, ...rest }: TableProps<T>): React.JSX.Element;
+
+interface PaginationProps {
+    currentPage: number;
+    totalPages: number;
+    onPageChange: (page: number) => void;
+}
+declare const Pagination: React.FC<PaginationProps>;
 
 interface BreadcrumbItem {
     label: string;
@@ -224,6 +224,45 @@ interface ThemeToggleButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
 }
 declare const ThemeToggleButton: React.FC<ThemeToggleButtonProps>;
 
+interface CardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title">, ColorOverrideProps {
+    /** Heading shown above the description. */
+    title?: React.ReactNode;
+    /** Supporting text rendered under the title. */
+    description?: React.ReactNode;
+    /** Icon rendered in a rounded square above the title. */
+    icon?: React.ReactNode;
+    /** Optional cover image source. Rendered on top (or alongside when `horizontal`). */
+    image?: string;
+    /** Alt text for the cover image. */
+    imageAlt?: string;
+    /** Lay the image alongside the content instead of on top. */
+    horizontal?: boolean;
+    /** Footer area, e.g. a link or a `Button` call-to-action. */
+    footer?: React.ReactNode;
+    /** Custom body content, rendered after the description. */
+    children?: React.ReactNode;
+}
+declare const Card: React.FC<CardProps>;
+
+type ToastVariant = "success" | "danger" | "warning" | "info";
+interface ToastProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title">, ColorOverrideProps {
+    /** Color/severity variant. */
+    variant?: ToastVariant;
+    title: React.ReactNode;
+    message?: React.ReactNode;
+    /** Override the default variant icon. */
+    icon?: React.ReactNode;
+    /** Hide the leading icon entirely. */
+    hideIcon?: boolean;
+    /** Render the dismiss button (default `true`). */
+    showCloseButton?: boolean;
+    /** Called when the close button is clicked. */
+    onClose?: () => void;
+    /** Hide the colored accent bar at the bottom. */
+    hideAccentBar?: boolean;
+}
+declare const Toast: React.FC<ToastProps>;
+
 type AccordionSelectionMode = "single" | "multiple";
 interface AccordionItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
     /** Unique key identifying this item. */
@@ -570,4 +609,4 @@ interface SliderProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>,
 }
 declare const Slider: React.FC<SliderProps>;
 
-export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, type AccordionSelectionMode, Alert, type AlertProps, type AlertVariant, Avatar, type AvatarProps, type AvatarSize, type AvatarStatus, AvatarText, type AvatarTextProps, Badge, type BadgeColor, type BadgeProps, type BadgeSize, type BadgeVariant, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonProps, Checkbox, type CheckboxProps, Chip, type ChipColor, type ChipProps, type ChipSize, type ChipVariant, Code, type CodeColor, type CodeProps, type CodeSize, ColorOverrideProps, DataTable, type DataTableColumn, type DataTableProps, DatePicker, type DatePickerProps, DateTimePicker, type DateTimePickerProps, Drawer, type DrawerPlacement, type DrawerProps, Dropdown, DropdownItem, type DropdownItemProps, type DropdownItemVariant, type DropdownProps, Dropzone, type DropzoneProps, FileInput, type FileInputProps, Form, type FormProps, Input, type InputProps, Label, type LabelProps, Modal, type ModalProps, type ModalVariant, MultiSelect, type MultiSelectProps, Pagination, type PaginationProps, PasswordInput, type PasswordInputProps, Popover, type PopoverPlacement, type PopoverProps, Progress, type ProgressColor, type ProgressProps, type ProgressSize, Radio, type RadioProps, RadioSm, type RadioSmProps, Ribbon, type RibbonColor, type RibbonPosition, type RibbonProps, type RibbonVariant, Select, type SelectProps, Skeleton, type SkeletonProps, Slider, type SliderColor, type SliderProps, Snippet, type SnippetProps, type SnippetSize, type SortDirection, Spinner, type SpinnerColor, type SpinnerProps, type SpinnerSize, Switch, type SwitchProps, Tab, type TabProps, Table, TableBody, TableCell, type TableCellProps, TableHeader, type TableProps, TableRow, type TableRowProps, type TableSectionProps, Tabs, type TabsProps, type TabsVariant, TextArea, type TextAreaProps, ThemeToggleButton, type ThemeToggleButtonProps, Tooltip, type TooltipPlacement, type TooltipProps, cn };
+export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, type AccordionSelectionMode, Alert, type AlertProps, type AlertVariant, Avatar, type AvatarProps, type AvatarSize, type AvatarStatus, AvatarText, type AvatarTextProps, Badge, type BadgeColor, type BadgeProps, type BadgeSize, type BadgeVariant, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonProps, Card, type CardProps, Checkbox, type CheckboxProps, Chip, type ChipColor, type ChipProps, type ChipSize, type ChipVariant, Code, type CodeColor, type CodeProps, type CodeSize, ColorOverrideProps, DatePicker, type DatePickerProps, DateTimePicker, type DateTimePickerProps, Drawer, type DrawerPlacement, type DrawerProps, Dropdown, DropdownItem, type DropdownItemProps, type DropdownItemVariant, type DropdownProps, Dropzone, type DropzoneProps, FileInput, type FileInputProps, Form, type FormProps, Input, type InputProps, Label, type LabelProps, Modal, type ModalProps, type ModalVariant, MultiSelect, type MultiSelectProps, Pagination, type PaginationProps, PasswordInput, type PasswordInputProps, Popover, type PopoverPlacement, type PopoverProps, Progress, type ProgressColor, type ProgressProps, type ProgressSize, Radio, type RadioProps, RadioSm, type RadioSmProps, Ribbon, type RibbonColor, type RibbonPosition, type RibbonProps, type RibbonVariant, Select, type SelectProps, Skeleton, type SkeletonProps, Slider, type SliderColor, type SliderProps, Snippet, type SnippetProps, type SnippetSize, type SortDirection, Spinner, type SpinnerColor, type SpinnerProps, type SpinnerSize, Switch, type SwitchProps, Tab, type TabProps, Table, TableBody, TableCell, type TableCellProps, type TableColumn, TableHeader, type TableProps, TableRow, type TableRowProps, type TableSectionProps, Tabs, type TabsProps, type TabsVariant, TextArea, type TextAreaProps, ThemeToggleButton, type ThemeToggleButtonProps, Toast, type ToastProps, type ToastVariant, Tooltip, type TooltipPlacement, type TooltipProps, cn };