aura-glass/dist/components/templates/list/GlassListView.d.ts

A comprehensive glassmorphism design system for React applications with 142+ production-ready components

import React from "react";
export interface ListItem {
    id: string;
    [key: string]: any;
}
export interface ListColumn {
    id: string;
    header: string;
    accessorKey?: string;
    accessorFn?: (row: ListItem) => any;
    cell?: (props: {
        row: ListItem;
        value: any;
    }) => React.ReactNode;
    sortable?: boolean;
    filterable?: boolean;
    width?: string | number;
    align?: "left" | "center" | "right";
}
export interface ListFilter {
    id: string;
    label: string;
    type: "select" | "multiselect" | "range" | "date" | "text";
    options?: Array<{
        value: string;
        label: string;
        count?: number;
    }>;
    value?: any;
    placeholder?: string;
}
export interface ListSort {
    column: string;
    direction: "asc" | "desc";
}
export interface ListAction {
    id: string;
    label: string;
    icon?: React.ReactNode;
    variant?: "default" | "primary" | "secondary" | "error";
    onClick: (items: ListItem[]) => void;
    requiresSelection?: boolean;
    single?: boolean;
}
export interface GlassListViewProps extends React.HTMLAttributes<HTMLDivElement> {
    /**
     * Page title
     */
    title?: string;
    /**
     * Page description
     */
    description?: string;
    /**
     * List data
     */
    data?: ListItem[];
    /**
     * Table columns
     */
    columns?: ListColumn[];
    /**
     * Available filters
     */
    filters?: ListFilter[];
    /**
     * Active filters
     */
    activeFilters?: Record<string, any>;
    /**
     * Filter change handler
     */
    onFiltersChange?: (filters: Record<string, any>) => void;
    /**
     * Search query
     */
    searchQuery?: string;
    /**
     * Search change handler
     */
    onSearchChange?: (query: string) => void;
    /**
     * Sort configuration
     */
    sort?: ListSort;
    /**
     * Sort change handler
     */
    onSortChange?: (sort: ListSort) => void;
    /**
     * Current page
     */
    currentPage?: number;
    /**
     * Page size
     */
    pageSize?: number;
    /**
     * Total items count
     */
    totalItems?: number;
    /**
     * Pagination change handler
     */
    onPaginationChange?: (page: number, pageSize: number) => void;
    /**
     * View mode
     */
    viewMode?: "table" | "grid" | "list";
    /**
     * View mode change handler
     */
    onViewModeChange?: (mode: "table" | "grid" | "list") => void;
    /**
     * Available actions
     */
    actions?: ListAction[];
    /**
     * Primary action (for create/add)
     */
    primaryAction?: {
        label: string;
        icon?: React.ReactNode;
        onClick: () => void;
    };
    /**
     * Selected items
     */
    selectedItems?: string[];
    /**
     * Selection change handler
     */
    onSelectionChange?: (selectedIds: string[]) => void;
    /**
     * Row click handler
     */
    onRowClick?: (item: ListItem) => void;
    /**
     * Loading state
     */
    loading?: boolean;
    /**
     * Empty state
     */
    emptyState?: React.ReactNode;
    /**
     * Card renderer for grid/list view
     */
    renderCard?: (item: ListItem, index: number) => React.ReactNode;
    /**
     * Bulk selection enabled
     */
    selectable?: boolean;
}
/**
 * GlassListView component
 * Comprehensive list view with filtering, search, and multiple view modes
 */
export declare const GlassListView: React.ForwardRefExoticComponent<GlassListViewProps & React.RefAttributes<HTMLDivElement>>;
//# sourceMappingURL=GlassListView.d.ts.map