@smallwebco/tinypivot-react 1.0.0

package/dist/index.d.cts

@@ -0,0 +1,269 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ColumnStats, FieldStats, PivotValueField, AggregationFunction, PivotResult, LicenseInfo, ExportOptions, PivotExportData, SelectionBounds, PaginationOptions } from '@smallwebco/tinypivot-core';
+export { AggregationFunction, CellClickEvent, ColumnStats, CopyEvent, DataGridProps, ExportEvent, ExportOptions, FieldStats, FilterEvent, GridOptions, LicenseInfo, LicenseType, PaginationOptions, PivotCell, PivotConfig as PivotConfigType, PivotField, PivotResult, PivotTableProps, PivotValueField, RowSelectionChangeEvent, SelectionBounds, SelectionChangeEvent, SortEvent, formatCellValue, getAggregationLabel, getColumnUniqueValues } from '@smallwebco/tinypivot-core';
+import * as react from 'react';
+import react__default from 'react';
+import * as _tanstack_react_table from '@tanstack/react-table';
+import { SortingState, ColumnFiltersState, VisibilityState } from '@tanstack/react-table';
+
+interface DataGridProps {
+    data: Record<string, unknown>[];
+    loading?: boolean;
+    rowHeight?: number;
+    headerHeight?: number;
+    fontSize?: 'xs' | 'sm' | 'base';
+    showPivot?: boolean;
+    enableExport?: boolean;
+    enableSearch?: boolean;
+    enablePagination?: boolean;
+    pageSize?: number;
+    enableColumnResize?: boolean;
+    enableClipboard?: boolean;
+    theme?: 'light' | 'dark' | 'auto';
+    stripedRows?: boolean;
+    exportFilename?: string;
+    enableVerticalResize?: boolean;
+    initialHeight?: number;
+    minHeight?: number;
+    maxHeight?: number;
+    onCellClick?: (payload: {
+        row: number;
+        col: number;
+        value: unknown;
+        rowData: Record<string, unknown>;
+    }) => void;
+    onSelectionChange?: (payload: {
+        cells: Array<{
+            row: number;
+            col: number;
+        }>;
+        values: unknown[];
+    }) => void;
+    onExport?: (payload: {
+        rowCount: number;
+        filename: string;
+    }) => void;
+    onCopy?: (payload: {
+        text: string;
+        cellCount: number;
+    }) => void;
+}
+declare function DataGrid({ data, loading, fontSize: initialFontSize, showPivot, enableExport, enableSearch, enablePagination, pageSize, enableColumnResize, enableClipboard, theme, stripedRows, exportFilename, enableVerticalResize, initialHeight, minHeight, maxHeight, onCellClick, onExport, onCopy, }: DataGridProps): react_jsx_runtime.JSX.Element;
+
+interface ColumnFilterProps {
+    columnId: string;
+    columnName: string;
+    stats: ColumnStats;
+    selectedValues: string[];
+    sortDirection: 'asc' | 'desc' | null;
+    onFilter: (values: string[]) => void;
+    onSort: (direction: 'asc' | 'desc' | null) => void;
+    onClose: () => void;
+}
+declare function ColumnFilter({ columnName, stats, selectedValues, sortDirection, onFilter, onSort, onClose, }: ColumnFilterProps): react_jsx_runtime.JSX.Element;
+
+interface PivotConfigProps {
+    availableFields: FieldStats[];
+    rowFields: string[];
+    columnFields: string[];
+    valueFields: PivotValueField[];
+    showRowTotals: boolean;
+    showColumnTotals: boolean;
+    onShowRowTotalsChange: (value: boolean) => void;
+    onShowColumnTotalsChange: (value: boolean) => void;
+    onClearConfig: () => void;
+    onAutoSuggest: () => void;
+    onDragStart: (field: string, event: react__default.DragEvent) => void;
+    onDragEnd: () => void;
+    onUpdateAggregation: (field: string, oldAgg: AggregationFunction, newAgg: AggregationFunction) => void;
+    onAddRowField: (field: string) => void;
+    onRemoveRowField: (field: string) => void;
+    onAddColumnField: (field: string) => void;
+    onRemoveColumnField: (field: string) => void;
+    onAddValueField: (field: string, aggregation: AggregationFunction) => void;
+    onRemoveValueField: (field: string, aggregation: AggregationFunction) => void;
+}
+declare function PivotConfig({ availableFields, rowFields, columnFields, valueFields, showRowTotals, onShowRowTotalsChange, onClearConfig, onAutoSuggest, onDragStart, onDragEnd, onUpdateAggregation, onRemoveRowField, onRemoveColumnField, onRemoveValueField, onAddRowField, onAddColumnField, }: PivotConfigProps): react_jsx_runtime.JSX.Element;
+
+interface ActiveFilter {
+    column: string;
+    valueCount: number;
+    values: string[];
+}
+interface PivotSkeletonProps {
+    rowFields: string[];
+    columnFields: string[];
+    valueFields: PivotValueField[];
+    isConfigured: boolean;
+    draggingField: string | null;
+    pivotResult: PivotResult | null;
+    fontSize?: 'xs' | 'sm' | 'base';
+    activeFilters?: ActiveFilter[] | null;
+    totalRowCount?: number;
+    filteredRowCount?: number;
+    onAddRowField: (field: string) => void;
+    onRemoveRowField: (field: string) => void;
+    onAddColumnField: (field: string) => void;
+    onRemoveColumnField: (field: string) => void;
+    onAddValueField: (field: string, aggregation: AggregationFunction) => void;
+    onRemoveValueField: (field: string, aggregation: AggregationFunction) => void;
+    onUpdateAggregation: (field: string, oldAgg: AggregationFunction, newAgg: AggregationFunction) => void;
+    onReorderRowFields: (fields: string[]) => void;
+    onReorderColumnFields: (fields: string[]) => void;
+}
+declare function PivotSkeleton({ rowFields, columnFields, valueFields, isConfigured, draggingField, pivotResult, fontSize, activeFilters, totalRowCount, filteredRowCount, onAddRowField, onRemoveRowField, onAddColumnField, onRemoveColumnField, onAddValueField, onRemoveValueField, }: PivotSkeletonProps): react_jsx_runtime.JSX.Element;
+
+interface ExcelGridOptions<T> {
+    data: T[];
+    columns?: string[];
+    enableSorting?: boolean;
+    enableFiltering?: boolean;
+    pageSize?: number;
+}
+/**
+ * Excel-like grid hook
+ */
+declare function useExcelGrid<T extends Record<string, unknown>>(options: ExcelGridOptions<T>): {
+    table: _tanstack_react_table.Table<T>;
+    sorting: SortingState;
+    columnFilters: ColumnFiltersState;
+    columnVisibility: VisibilityState;
+    globalFilter: string;
+    columnKeys: string[];
+    setSorting: react.Dispatch<react.SetStateAction<SortingState>>;
+    setColumnFilters: react.Dispatch<react.SetStateAction<ColumnFiltersState>>;
+    setGlobalFilter: react.Dispatch<react.SetStateAction<string>>;
+    filteredRowCount: number;
+    totalRowCount: number;
+    activeFilters: {
+        column: string;
+        values: string[];
+    }[];
+    getColumnStats: (columnKey: string) => ColumnStats;
+    clearStatsCache: () => void;
+    hasActiveFilter: (columnId: string) => boolean;
+    setColumnFilter: (columnId: string, values: string[]) => void;
+    getColumnFilterValues: (columnId: string) => string[];
+    clearAllFilters: () => void;
+    toggleSort: (columnId: string) => void;
+    getSortDirection: (columnId: string) => 'asc' | 'desc' | null;
+};
+
+interface UsePivotTableReturn {
+    rowFields: string[];
+    columnFields: string[];
+    valueFields: PivotValueField[];
+    showRowTotals: boolean;
+    showColumnTotals: boolean;
+    availableFields: FieldStats[];
+    unassignedFields: FieldStats[];
+    isConfigured: boolean;
+    pivotResult: PivotResult | null;
+    addRowField: (field: string) => void;
+    removeRowField: (field: string) => void;
+    addColumnField: (field: string) => void;
+    removeColumnField: (field: string) => void;
+    addValueField: (field: string, aggregation?: AggregationFunction) => void;
+    removeValueField: (field: string, aggregation?: AggregationFunction) => void;
+    updateValueFieldAggregation: (field: string, oldAgg: AggregationFunction, newAgg: AggregationFunction) => void;
+    clearConfig: () => void;
+    setShowRowTotals: (value: boolean) => void;
+    setShowColumnTotals: (value: boolean) => void;
+    autoSuggestConfig: () => void;
+    setRowFields: (fields: string[]) => void;
+    setColumnFields: (fields: string[]) => void;
+}
+/**
+ * Main pivot table hook
+ */
+declare function usePivotTable(data: Record<string, unknown>[]): UsePivotTableReturn;
+
+/**
+ * Set the license key for the library
+ */
+declare function setLicenseKey(key: string): Promise<void>;
+/**
+ * Enable demo mode
+ */
+declare function enableDemoMode(): void;
+/**
+ * Configure the license secret
+ */
+declare function configureLicenseSecret(secret: string): void;
+/**
+ * Hook for accessing license information
+ */
+declare function useLicense(): {
+    licenseInfo: LicenseInfo;
+    isDemo: boolean;
+    isPro: boolean;
+    canUsePivot: boolean;
+    canUseAdvancedAggregations: boolean;
+    canUsePercentageMode: boolean;
+    showWatermark: boolean;
+    requirePro: (feature: string) => boolean;
+};
+
+declare function exportToCSV<T extends Record<string, unknown>>(data: T[], columns: string[], options?: ExportOptions): void;
+declare function exportPivotToCSV(pivotData: PivotExportData, rowFields: string[], columnFields: string[], valueFields: PivotValueField[], options?: ExportOptions): void;
+declare function copyToClipboard(text: string, onSuccess?: () => void, onError?: (err: Error) => void): void;
+declare function formatSelectionForClipboard<T extends Record<string, unknown>>(rows: T[], columns: string[], selectionBounds: SelectionBounds): string;
+/**
+ * Pagination hook
+ */
+declare function usePagination<T>(data: T[], options?: PaginationOptions): {
+    pageSize: number;
+    currentPage: number;
+    totalPages: number;
+    paginatedData: T[];
+    startIndex: number;
+    endIndex: number;
+    goToPage: (page: number) => void;
+    nextPage: () => void;
+    prevPage: () => void;
+    firstPage: () => void;
+    lastPage: () => void;
+    setPageSize: (size: number) => void;
+};
+/**
+ * Global search/filter hook
+ */
+declare function useGlobalSearch<T extends Record<string, unknown>>(data: T[], columns: string[]): {
+    searchTerm: string;
+    setSearchTerm: react.Dispatch<react.SetStateAction<string>>;
+    caseSensitive: boolean;
+    setCaseSensitive: react.Dispatch<react.SetStateAction<boolean>>;
+    filteredData: T[];
+    clearSearch: () => void;
+};
+/**
+ * Row selection hook
+ */
+declare function useRowSelection<T>(data: T[]): {
+    selectedRowIndices: Set<number>;
+    selectedRows: T[];
+    allSelected: boolean;
+    someSelected: boolean;
+    toggleRow: (index: number) => void;
+    selectRow: (index: number) => void;
+    deselectRow: (index: number) => void;
+    selectAll: () => void;
+    deselectAll: () => void;
+    toggleAll: () => void;
+    isSelected: (index: number) => boolean;
+    selectRange: (startIndex: number, endIndex: number) => void;
+};
+/**
+ * Column resizing hook
+ */
+declare function useColumnResize(initialWidths: Record<string, number>, minWidth?: number, maxWidth?: number): {
+    columnWidths: Record<string, number>;
+    setColumnWidths: react.Dispatch<react.SetStateAction<Record<string, number>>>;
+    isResizing: boolean;
+    resizingColumn: string | null;
+    startResize: (columnId: string, event: React.MouseEvent) => void;
+    resetColumnWidth: (columnId: string) => void;
+    resetAllWidths: () => void;
+};
+
+export { ColumnFilter, DataGrid, PivotConfig, PivotSkeleton, configureLicenseSecret, copyToClipboard, enableDemoMode, exportPivotToCSV, exportToCSV, formatSelectionForClipboard, setLicenseKey, useColumnResize, useExcelGrid, useGlobalSearch, useLicense, usePagination, usePivotTable, useRowSelection };

package/dist/index.d.ts

@@ -0,0 +1,269 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ColumnStats, FieldStats, PivotValueField, AggregationFunction, PivotResult, LicenseInfo, ExportOptions, PivotExportData, SelectionBounds, PaginationOptions } from '@smallwebco/tinypivot-core';
+export { AggregationFunction, CellClickEvent, ColumnStats, CopyEvent, DataGridProps, ExportEvent, ExportOptions, FieldStats, FilterEvent, GridOptions, LicenseInfo, LicenseType, PaginationOptions, PivotCell, PivotConfig as PivotConfigType, PivotField, PivotResult, PivotTableProps, PivotValueField, RowSelectionChangeEvent, SelectionBounds, SelectionChangeEvent, SortEvent, formatCellValue, getAggregationLabel, getColumnUniqueValues } from '@smallwebco/tinypivot-core';
+import * as react from 'react';
+import react__default from 'react';
+import * as _tanstack_react_table from '@tanstack/react-table';
+import { SortingState, ColumnFiltersState, VisibilityState } from '@tanstack/react-table';
+
+interface DataGridProps {
+    data: Record<string, unknown>[];
+    loading?: boolean;
+    rowHeight?: number;
+    headerHeight?: number;
+    fontSize?: 'xs' | 'sm' | 'base';
+    showPivot?: boolean;
+    enableExport?: boolean;
+    enableSearch?: boolean;
+    enablePagination?: boolean;
+    pageSize?: number;
+    enableColumnResize?: boolean;
+    enableClipboard?: boolean;
+    theme?: 'light' | 'dark' | 'auto';
+    stripedRows?: boolean;
+    exportFilename?: string;
+    enableVerticalResize?: boolean;
+    initialHeight?: number;
+    minHeight?: number;
+    maxHeight?: number;
+    onCellClick?: (payload: {
+        row: number;
+        col: number;
+        value: unknown;
+        rowData: Record<string, unknown>;
+    }) => void;
+    onSelectionChange?: (payload: {
+        cells: Array<{
+            row: number;
+            col: number;
+        }>;
+        values: unknown[];
+    }) => void;
+    onExport?: (payload: {
+        rowCount: number;
+        filename: string;
+    }) => void;
+    onCopy?: (payload: {
+        text: string;
+        cellCount: number;
+    }) => void;
+}
+declare function DataGrid({ data, loading, fontSize: initialFontSize, showPivot, enableExport, enableSearch, enablePagination, pageSize, enableColumnResize, enableClipboard, theme, stripedRows, exportFilename, enableVerticalResize, initialHeight, minHeight, maxHeight, onCellClick, onExport, onCopy, }: DataGridProps): react_jsx_runtime.JSX.Element;
+
+interface ColumnFilterProps {
+    columnId: string;
+    columnName: string;
+    stats: ColumnStats;
+    selectedValues: string[];
+    sortDirection: 'asc' | 'desc' | null;
+    onFilter: (values: string[]) => void;
+    onSort: (direction: 'asc' | 'desc' | null) => void;
+    onClose: () => void;
+}
+declare function ColumnFilter({ columnName, stats, selectedValues, sortDirection, onFilter, onSort, onClose, }: ColumnFilterProps): react_jsx_runtime.JSX.Element;
+
+interface PivotConfigProps {
+    availableFields: FieldStats[];
+    rowFields: string[];
+    columnFields: string[];
+    valueFields: PivotValueField[];
+    showRowTotals: boolean;
+    showColumnTotals: boolean;
+    onShowRowTotalsChange: (value: boolean) => void;
+    onShowColumnTotalsChange: (value: boolean) => void;
+    onClearConfig: () => void;
+    onAutoSuggest: () => void;
+    onDragStart: (field: string, event: react__default.DragEvent) => void;
+    onDragEnd: () => void;
+    onUpdateAggregation: (field: string, oldAgg: AggregationFunction, newAgg: AggregationFunction) => void;
+    onAddRowField: (field: string) => void;
+    onRemoveRowField: (field: string) => void;
+    onAddColumnField: (field: string) => void;
+    onRemoveColumnField: (field: string) => void;
+    onAddValueField: (field: string, aggregation: AggregationFunction) => void;
+    onRemoveValueField: (field: string, aggregation: AggregationFunction) => void;
+}
+declare function PivotConfig({ availableFields, rowFields, columnFields, valueFields, showRowTotals, onShowRowTotalsChange, onClearConfig, onAutoSuggest, onDragStart, onDragEnd, onUpdateAggregation, onRemoveRowField, onRemoveColumnField, onRemoveValueField, onAddRowField, onAddColumnField, }: PivotConfigProps): react_jsx_runtime.JSX.Element;
+
+interface ActiveFilter {
+    column: string;
+    valueCount: number;
+    values: string[];
+}
+interface PivotSkeletonProps {
+    rowFields: string[];
+    columnFields: string[];
+    valueFields: PivotValueField[];
+    isConfigured: boolean;
+    draggingField: string | null;
+    pivotResult: PivotResult | null;
+    fontSize?: 'xs' | 'sm' | 'base';
+    activeFilters?: ActiveFilter[] | null;
+    totalRowCount?: number;
+    filteredRowCount?: number;
+    onAddRowField: (field: string) => void;
+    onRemoveRowField: (field: string) => void;
+    onAddColumnField: (field: string) => void;
+    onRemoveColumnField: (field: string) => void;
+    onAddValueField: (field: string, aggregation: AggregationFunction) => void;
+    onRemoveValueField: (field: string, aggregation: AggregationFunction) => void;
+    onUpdateAggregation: (field: string, oldAgg: AggregationFunction, newAgg: AggregationFunction) => void;
+    onReorderRowFields: (fields: string[]) => void;
+    onReorderColumnFields: (fields: string[]) => void;
+}
+declare function PivotSkeleton({ rowFields, columnFields, valueFields, isConfigured, draggingField, pivotResult, fontSize, activeFilters, totalRowCount, filteredRowCount, onAddRowField, onRemoveRowField, onAddColumnField, onRemoveColumnField, onAddValueField, onRemoveValueField, }: PivotSkeletonProps): react_jsx_runtime.JSX.Element;
+
+interface ExcelGridOptions<T> {
+    data: T[];
+    columns?: string[];
+    enableSorting?: boolean;
+    enableFiltering?: boolean;
+    pageSize?: number;
+}
+/**
+ * Excel-like grid hook
+ */
+declare function useExcelGrid<T extends Record<string, unknown>>(options: ExcelGridOptions<T>): {
+    table: _tanstack_react_table.Table<T>;
+    sorting: SortingState;
+    columnFilters: ColumnFiltersState;
+    columnVisibility: VisibilityState;
+    globalFilter: string;
+    columnKeys: string[];
+    setSorting: react.Dispatch<react.SetStateAction<SortingState>>;
+    setColumnFilters: react.Dispatch<react.SetStateAction<ColumnFiltersState>>;
+    setGlobalFilter: react.Dispatch<react.SetStateAction<string>>;
+    filteredRowCount: number;
+    totalRowCount: number;
+    activeFilters: {
+        column: string;
+        values: string[];
+    }[];
+    getColumnStats: (columnKey: string) => ColumnStats;
+    clearStatsCache: () => void;
+    hasActiveFilter: (columnId: string) => boolean;
+    setColumnFilter: (columnId: string, values: string[]) => void;
+    getColumnFilterValues: (columnId: string) => string[];
+    clearAllFilters: () => void;
+    toggleSort: (columnId: string) => void;
+    getSortDirection: (columnId: string) => 'asc' | 'desc' | null;
+};
+
+interface UsePivotTableReturn {
+    rowFields: string[];
+    columnFields: string[];
+    valueFields: PivotValueField[];
+    showRowTotals: boolean;
+    showColumnTotals: boolean;
+    availableFields: FieldStats[];
+    unassignedFields: FieldStats[];
+    isConfigured: boolean;
+    pivotResult: PivotResult | null;
+    addRowField: (field: string) => void;
+    removeRowField: (field: string) => void;
+    addColumnField: (field: string) => void;
+    removeColumnField: (field: string) => void;
+    addValueField: (field: string, aggregation?: AggregationFunction) => void;
+    removeValueField: (field: string, aggregation?: AggregationFunction) => void;
+    updateValueFieldAggregation: (field: string, oldAgg: AggregationFunction, newAgg: AggregationFunction) => void;
+    clearConfig: () => void;
+    setShowRowTotals: (value: boolean) => void;
+    setShowColumnTotals: (value: boolean) => void;
+    autoSuggestConfig: () => void;
+    setRowFields: (fields: string[]) => void;
+    setColumnFields: (fields: string[]) => void;
+}
+/**
+ * Main pivot table hook
+ */
+declare function usePivotTable(data: Record<string, unknown>[]): UsePivotTableReturn;
+
+/**
+ * Set the license key for the library
+ */
+declare function setLicenseKey(key: string): Promise<void>;
+/**
+ * Enable demo mode
+ */
+declare function enableDemoMode(): void;
+/**
+ * Configure the license secret
+ */
+declare function configureLicenseSecret(secret: string): void;
+/**
+ * Hook for accessing license information
+ */
+declare function useLicense(): {
+    licenseInfo: LicenseInfo;
+    isDemo: boolean;
+    isPro: boolean;
+    canUsePivot: boolean;
+    canUseAdvancedAggregations: boolean;
+    canUsePercentageMode: boolean;
+    showWatermark: boolean;
+    requirePro: (feature: string) => boolean;
+};
+
+declare function exportToCSV<T extends Record<string, unknown>>(data: T[], columns: string[], options?: ExportOptions): void;
+declare function exportPivotToCSV(pivotData: PivotExportData, rowFields: string[], columnFields: string[], valueFields: PivotValueField[], options?: ExportOptions): void;
+declare function copyToClipboard(text: string, onSuccess?: () => void, onError?: (err: Error) => void): void;
+declare function formatSelectionForClipboard<T extends Record<string, unknown>>(rows: T[], columns: string[], selectionBounds: SelectionBounds): string;
+/**
+ * Pagination hook
+ */
+declare function usePagination<T>(data: T[], options?: PaginationOptions): {
+    pageSize: number;
+    currentPage: number;
+    totalPages: number;
+    paginatedData: T[];
+    startIndex: number;
+    endIndex: number;
+    goToPage: (page: number) => void;
+    nextPage: () => void;
+    prevPage: () => void;
+    firstPage: () => void;
+    lastPage: () => void;
+    setPageSize: (size: number) => void;
+};
+/**
+ * Global search/filter hook
+ */
+declare function useGlobalSearch<T extends Record<string, unknown>>(data: T[], columns: string[]): {
+    searchTerm: string;
+    setSearchTerm: react.Dispatch<react.SetStateAction<string>>;
+    caseSensitive: boolean;
+    setCaseSensitive: react.Dispatch<react.SetStateAction<boolean>>;
+    filteredData: T[];
+    clearSearch: () => void;
+};
+/**
+ * Row selection hook
+ */
+declare function useRowSelection<T>(data: T[]): {
+    selectedRowIndices: Set<number>;
+    selectedRows: T[];
+    allSelected: boolean;
+    someSelected: boolean;
+    toggleRow: (index: number) => void;
+    selectRow: (index: number) => void;
+    deselectRow: (index: number) => void;
+    selectAll: () => void;
+    deselectAll: () => void;
+    toggleAll: () => void;
+    isSelected: (index: number) => boolean;
+    selectRange: (startIndex: number, endIndex: number) => void;
+};
+/**
+ * Column resizing hook
+ */
+declare function useColumnResize(initialWidths: Record<string, number>, minWidth?: number, maxWidth?: number): {
+    columnWidths: Record<string, number>;
+    setColumnWidths: react.Dispatch<react.SetStateAction<Record<string, number>>>;
+    isResizing: boolean;
+    resizingColumn: string | null;
+    startResize: (columnId: string, event: React.MouseEvent) => void;
+    resetColumnWidth: (columnId: string) => void;
+    resetAllWidths: () => void;
+};
+
+export { ColumnFilter, DataGrid, PivotConfig, PivotSkeleton, configureLicenseSecret, copyToClipboard, enableDemoMode, exportPivotToCSV, exportToCSV, formatSelectionForClipboard, setLicenseKey, useColumnResize, useExcelGrid, useGlobalSearch, useLicense, usePagination, usePivotTable, useRowSelection };