@vuu-ui/vuu-table 0.0.26

package/types/Table.d.ts

@@ -0,0 +1,91 @@
+import { DataSource, SchemaColumn, SelectionChangeHandler, VuuFeatureInvocationMessage } from "@vuu-ui/vuu-data-types";
+import { TableConfig, TableConfigChangeHandler, TableRowClickHandler, TableRowSelectHandler, TableSelectionModel } from "@vuu-ui/vuu-table-types";
+import type { DragDropState } from "@vuu-ui/vuu-ui-controls";
+import { DragStartHandler, dragStrategy, MeasuredContainerProps } from "@vuu-ui/vuu-ui-controls";
+import { FC, ForwardedRef } from "react";
+import { RowProps } from "./Row";
+import { ScrollingAPI } from "./useTableScroll";
+export type TableNavigationStyle = "none" | "cell" | "row";
+export interface TableProps extends Omit<MeasuredContainerProps, "onDragStart" | "onDrop" | "onSelect"> {
+    Row?: FC<RowProps>;
+    allowConfigEditing?: boolean;
+    allowDragDrop?: boolean | dragStrategy;
+    /**
+     * required if a fully featured column picker is to be available
+     */
+    availableColumns?: SchemaColumn[];
+    /**
+     * Provide configuration settings for Table. At minimun, column
+     * descriptors must be provided.
+     */
+    config: TableConfig;
+    dataSource: DataSource;
+    disableFocus?: boolean;
+    /**
+     * Pixel height of headers. If specified here, this will take precedence over CSS
+     * values and Table will not respond to density changes. Default value is 125% of
+     * rowHeight, whether set vis rowHeight prop or CSS.
+     */
+    headerHeight?: number;
+    /**
+     * Defined how focus navigation within data cells will be handled by table.
+     * Default is cell.
+     */
+    highlightedIndex?: number;
+    navigationStyle?: TableNavigationStyle;
+    /**
+     * required if a fully featured column picker is to be available.
+     * Available columns can be changed by the addition or removal of
+     * one or more calculated columns.
+     */
+    onAvailableColumnsChange?: (columns: SchemaColumn[]) => void;
+    /**
+     * This callback will be invoked any time a config attribute of TableConfig
+     * is changed. By persisting this value and providing it to the Table as a
+     * prop, table state can be persisted across sessions.
+     */
+    onConfigChange?: TableConfigChangeHandler;
+    onDragStart?: DragStartHandler;
+    onDrop?: (dragDropState: DragDropState) => void;
+    /**
+     * When a Vuu feature e.g. context menu action, has been invoked, the Vuu server
+     * response must be handled. This callback provides that response.
+     */
+    onFeatureInvocation?: (message: VuuFeatureInvocationMessage) => void;
+    onHighlight?: (idx: number) => void;
+    /**
+     * callback invoked when user 'clicks' a table row. CLick triggered either
+     * via mouse click or keyboard (default ENTER);
+     */
+    onRowClick?: TableRowClickHandler;
+    onSelect?: TableRowSelectHandler;
+    onSelectionChange?: SelectionChangeHandler;
+    renderBufferSize?: number;
+    /**
+     * Pixel height of rows. If specified here, this will take precedence over CSS
+     * values and Table will not respond to density changes.
+     */
+    rowHeight?: number;
+    /**
+     * imperative API for scrolling table
+     */
+    scrollingApiRef?: ForwardedRef<ScrollingAPI>;
+    /**
+     * Selection Bookends style the left and right edge of a selection block.
+     * They are optional, value defaults to zero.
+     * TODO this should just live in CSS
+     */
+    selectionBookendWidth?: number;
+    selectionModel?: TableSelectionModel;
+    /**
+     * if false, table rendered without headers. Useful when table is being included in a
+     * composite component.
+     */
+    showColumnHeaders?: boolean;
+    /**
+     * if false, column headers will not display menu icon. Menu items are still available
+     * from contexct menu
+     */
+    showColumnHeaderMenus?: boolean;
+}
+export declare const Table: import("react").ForwardRefExoticComponent<TableProps & import("react").RefAttributes<HTMLDivElement>>;

package/types/cell-renderers/checkbox-cell/CheckboxCell.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { TableCellRendererProps } from "@vuu-ui/vuu-table-types";
+export declare const CheckboxCell: React.FC<TableCellRendererProps>;

package/types/cell-renderers/checkbox-cell/index.d.ts

@@ -0,0 +1 @@
+export * from "./CheckboxCell";

package/types/cell-renderers/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./checkbox-cell";
+export * from "./input-cell";
+export * from "./toggle-cell";

package/types/cell-renderers/input-cell/InputCell.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { TableCellRendererProps } from "@vuu-ui/vuu-table-types";
+export declare const InputCell: ({ column, columnMap, onCommit, row, }: TableCellRendererProps) => JSX.Element;

package/types/cell-renderers/input-cell/index.d.ts

@@ -0,0 +1 @@
+export * from "./InputCell";

package/types/cell-renderers/toggle-cell/ToggleCell.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { TableCellRendererProps } from "@vuu-ui/vuu-table-types";
+export declare const ToggleCell: import("react").NamedExoticComponent<TableCellRendererProps>;

package/types/cell-renderers/toggle-cell/index.d.ts

@@ -0,0 +1 @@
+export * from "./ToggleCell";

package/types/column-header-pill/ColumnHeaderPill.d.ts

@@ -0,0 +1,8 @@
+import { RuntimeColumnDescriptor } from "@vuu-ui/vuu-table-types";
+import { HTMLAttributes } from "react";
+export interface ColumnHeaderPillProps extends HTMLAttributes<HTMLDivElement> {
+    column: RuntimeColumnDescriptor;
+    removable?: boolean;
+    onRemove?: (column: RuntimeColumnDescriptor) => void;
+}
+export declare const ColumnHeaderPill: ({ children, className, column, onRemove, removable, ...htmlAttributes }: ColumnHeaderPillProps) => JSX.Element;

package/types/column-header-pill/GroupColumnPill.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { RuntimeColumnDescriptor } from "@vuu-ui/vuu-table-types";
+import { ColumnHeaderPillProps } from "./ColumnHeaderPill";
+export interface GroupColumnPillProps extends ColumnHeaderPillProps {
+    column: RuntimeColumnDescriptor;
+}
+export declare const GroupColumnPill: ({ column, ...columnHeaderProps }: GroupColumnPillProps) => JSX.Element;

package/types/column-header-pill/SortIndicator.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { RuntimeColumnDescriptor } from "@vuu-ui/vuu-table-types";
+export interface SortIndicatorProps {
+    column: RuntimeColumnDescriptor;
+}
+export declare const SortIndicator: ({ column }: SortIndicatorProps) => JSX.Element | null;

package/types/column-header-pill/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./ColumnHeaderPill";
+export * from "./GroupColumnPill";
+export * from "./SortIndicator";

package/types/column-menu/ColumnMenu.d.ts

@@ -0,0 +1,6 @@
+import { RuntimeColumnDescriptor } from "@vuu-ui/vuu-table-types";
+import { HTMLAttributes } from "react";
+export interface ColumnMenuProps extends HTMLAttributes<HTMLSpanElement> {
+    column: RuntimeColumnDescriptor;
+}
+export declare const ColumnMenu: ({ className, column }: ColumnMenuProps) => JSX.Element;

package/types/column-menu/index.d.ts

@@ -0,0 +1 @@
+export * from "./ColumnMenu";

package/types/column-resizing/ColumnResizer.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export interface TableColumnResizerProps {
+    onDrag: (evt: MouseEvent, moveBy: number, totalDistanceMoved: number) => void;
+    onDragEnd: (evt: MouseEvent, totalDistanceMoved: number) => void;
+    onDragStart: (evt: React.MouseEvent) => void;
+}
+export declare const ColumnResizer: ({ onDrag, onDragEnd, onDragStart, }: TableColumnResizerProps) => JSX.Element;

package/types/column-resizing/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./ColumnResizer";
+export * from "./useTableColumnResize";

package/types/column-resizing/useTableColumnResize.d.ts

@@ -0,0 +1,15 @@
+import { Heading, ResizePhase, RuntimeColumnDescriptor } from "@vuu-ui/vuu-table-types";
+import { RefObject } from "react";
+export type ResizeHandler = (evt: MouseEvent, moveBy: number) => void;
+export interface CellResizeHookProps {
+    column: RuntimeColumnDescriptor | Heading;
+    onResize?: (phase: ResizePhase, columnName: string, width?: number) => void;
+    rootRef: RefObject<HTMLDivElement>;
+}
+export interface CellResizeHookResult {
+    isResizing: boolean;
+    onDrag: (evt: MouseEvent, moveBy: number, totalDistanceMoved: number) => void;
+    onDragStart: (evt: React.MouseEvent) => void;
+    onDragEnd: (evt: MouseEvent) => void;
+}
+export declare const useTableColumnResize: ({ column, onResize, rootRef, }: CellResizeHookProps) => CellResizeHookResult;

package/types/context-menu/buildContextMenuDescriptors.d.ts

@@ -0,0 +1,3 @@
+import { DataSource, MenuBuilder } from "@vuu-ui/vuu-data-types";
+export type ContextMenuLocation = "header" | "filter" | "grid";
+export declare const buildContextMenuDescriptors: (dataSource?: DataSource) => MenuBuilder;

package/types/context-menu/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./buildContextMenuDescriptors";
+export * from "./useHandleTableContextMenu";

package/types/context-menu/useHandleTableContextMenu.d.ts

@@ -0,0 +1,20 @@
+import { RuntimeColumnDescriptor } from "@vuu-ui/vuu-table-types";
+import { Filter } from "@vuu-ui/vuu-filter-types";
+import { VuuFilter } from "@vuu-ui/vuu-protocol-types";
+import { DataSource, MenuActionHandler } from "@vuu-ui/vuu-data-types";
+import { PersistentColumnAction } from "../useTableModel";
+export interface ContextMenuOptions {
+    column?: RuntimeColumnDescriptor;
+    filter?: Filter;
+    sort?: VuuFilter;
+}
+export interface ContextMenuHookProps {
+    dataSource?: DataSource;
+    /**
+     * A persistent Column Operation is any manipulation of a table column that should be
+     * persisted across user sessions. e.g. if user pins a column, column should still be
+     * pinned next time user opens app.
+     */
+    onPersistentColumnOperation: (action: PersistentColumnAction) => void;
+}
+export declare const useHandleTableContextMenu: ({ dataSource, onPersistentColumnOperation, }: ContextMenuHookProps) => MenuActionHandler;

package/types/header-cell/GroupHeaderCell.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { ColumnDescriptor, GroupColumnDescriptor, HeaderCellProps, RuntimeColumnDescriptor } from "@vuu-ui/vuu-table-types";
+export interface GroupHeaderCellProps extends Omit<HeaderCellProps, "onDragStart" | "onDrag" | "onDragEnd"> {
+    column: GroupColumnDescriptor;
+    onMoveColumn?: (columns: ColumnDescriptor[]) => void;
+    onRemoveColumn: (column: RuntimeColumnDescriptor) => void;
+}
+export declare const GroupHeaderCell: ({ column: groupColumn, className: classNameProp, onMoveColumn, onRemoveColumn, onResize, ...htmlAttributes }: GroupHeaderCellProps) => JSX.Element;

package/types/header-cell/HeaderCell.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { HeaderCellProps } from "@vuu-ui/vuu-table-types";
+export declare const HeaderCell: ({ className: classNameProp, column, onClick, onResize, showMenu, ...htmlAttributes }: HeaderCellProps) => JSX.Element;

package/types/header-cell/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./GroupHeaderCell";
+export * from "./HeaderCell";

package/types/index.d.ts

@@ -0,0 +1,11 @@
+export { GroupHeaderCell as GroupHeaderCellNext } from "./header-cell";
+export * from "./header-cell";
+export * from "./Table";
+export * from "./table-cell";
+export * from "./table-config";
+export * from "./cell-renderers";
+export type { RowProps } from "./Row";
+export * from "./useControlledTableNavigation";
+export * from "./useTableModel";
+export * from "./useTableScroll";
+export * from "./useTableViewport";

package/types/moving-window.d.ts

@@ -0,0 +1,14 @@
+import { DataSourceRow } from "@vuu-ui/vuu-data-types";
+import { VuuRange } from "@vuu-ui/vuu-protocol-types";
+export declare class MovingWindow {
+    data: DataSourceRow[];
+    rowCount: number;
+    private range;
+    constructor({ from, to }: VuuRange);
+    setRowCount: (rowCount: number) => void;
+    add(data: DataSourceRow): void;
+    getAtIndex(index: number): DataSourceRow | undefined;
+    isWithinRange(index: number): boolean;
+    setRange({ from, to }: VuuRange): void;
+    getSelectedRows(): DataSourceRow[];
+}

package/types/table-cell/TableCell.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { TableCellProps } from "@vuu-ui/vuu-table-types";
+export declare const TableCell: ({ column, columnMap, onClick, onDataEdited, row, }: TableCellProps) => JSX.Element;

package/types/table-cell/TableGroupCell.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { TableCellProps } from "@vuu-ui/vuu-table-types";
+export declare const TableGroupCell: ({ column, columnMap, onClick, row, }: TableCellProps) => JSX.Element;

package/types/table-cell/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./TableCell";
+export * from "./TableGroupCell";

package/types/table-config.d.ts

@@ -0,0 +1,25 @@
+import { ColumnDescriptor, TableConfig } from "@vuu-ui/vuu-table-types";
+export type MoveColumnTableConfigAction = {
+    type: "col-move";
+    column: ColumnDescriptor;
+    fromIndex: number;
+    toIndex: number;
+};
+export type ResizeColumnTableConfigAction = {
+    type: "col-size";
+    column: ColumnDescriptor;
+    width: number;
+};
+export type SubscribeColumnTableConfigAction = {
+    type: "subscribed";
+    column: ColumnDescriptor;
+    value: boolean;
+};
+export type UpdateColumnPropertyTableConfigAction = {
+    type: "column-prop";
+    column: ColumnDescriptor;
+    property: keyof ColumnDescriptor;
+    value: boolean | number | string;
+};
+export type TableConfigAction = MoveColumnTableConfigAction | ResizeColumnTableConfigAction | UpdateColumnPropertyTableConfigAction;
+export declare const updateTableConfig: (config: TableConfig, action: TableConfigAction) => TableConfig;

package/types/table-dom-utils.d.ts

@@ -0,0 +1,14 @@
+import { RefObject } from "react";
+import { ScrollDirection } from "./useTableScroll";
+/**
+ * [rowIndex, colIndex
+ */
+export type CellPos = [number, number];
+export declare const headerCellQuery: (colIdx: number) => string;
+export declare const dataCellQuery: (rowIdx: number, colIdx: number) => string;
+export declare const getTableCell: (containerRef: RefObject<HTMLElement>, [rowIdx, colIdx]: CellPos) => HTMLElement;
+export declare const cellIsEditable: (cell: HTMLDivElement | null) => boolean | undefined;
+export declare const cellIsTextInput: (cell: HTMLElement) => boolean;
+export declare function getRowIndex(rowEl?: HTMLElement): number;
+export declare const closestRowIndex: (el: HTMLElement) => number;
+export declare const howFarIsRowOutsideViewport: (rowEl: HTMLElement, totalHeaderHeight: number, contentContainer?: Element | null) => readonly [ScrollDirection | undefined, number | undefined];

package/types/table-header/TableHeader.d.ts

@@ -0,0 +1,19 @@
+/// <reference types="react" />
+import { VuuSortType } from "@vuu-ui/vuu-protocol-types";
+import { ColumnDescriptor, RuntimeColumnDescriptor, TableColumnResizeHandler, TableConfig, TableHeadings } from "@vuu-ui/vuu-table-types";
+export type ColumnSortHandler = (column: ColumnDescriptor, addToExistingSort: boolean, sortType?: VuuSortType) => void;
+export interface TableHeaderProps {
+    classBase?: string;
+    columns: RuntimeColumnDescriptor[];
+    headings: TableHeadings;
+    onResizeColumn: TableColumnResizeHandler;
+    onMoveColumn: (columns: ColumnDescriptor[]) => void;
+    onMoveGroupColumn: (columns: ColumnDescriptor[]) => void;
+    onRemoveGroupColumn: (column: RuntimeColumnDescriptor) => void;
+    onSortColumn: ColumnSortHandler;
+    showColumnHeaderMenus: boolean;
+    tableConfig: TableConfig;
+    tableId: string;
+    virtualColSpan?: number;
+}
+export declare const TableHeader: import("react").MemoExoticComponent<({ classBase, columns, headings, onMoveColumn, onMoveGroupColumn, onRemoveGroupColumn, onResizeColumn, onSortColumn, showColumnHeaderMenus, tableConfig, tableId, virtualColSpan, }: TableHeaderProps) => JSX.Element>;

package/types/table-header/useTableHeader.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { ColumnDescriptor } from "@vuu-ui/vuu-table-types";
+import { TableHeaderProps } from "./TableHeader";
+export interface TableHeaderHookProps extends Pick<TableHeaderProps, "columns" | "onMoveColumn" | "onSortColumn" | "tableConfig"> {
+    label?: string;
+    onMoveColumn: (columns: ColumnDescriptor[]) => void;
+    onSortColumn: (column: ColumnDescriptor, addToExistingSort: boolean) => void;
+}
+export declare const useTableHeader: ({ columns, onMoveColumn, onSortColumn, tableConfig, }: TableHeaderHookProps) => {
+    draggableColumn: JSX.Element | undefined;
+    draggedColumnIndex: number | undefined;
+    onClick: (evt: React.MouseEvent | React.KeyboardEvent) => void;
+    onMouseDown: import("react").MouseEventHandler<Element> | undefined;
+    setContainerRef: (instance: HTMLDivElement | null) => void;
+};

package/types/useCell.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { RuntimeColumnDescriptor } from "@vuu-ui/vuu-table-types";
+export declare const useCell: (column: RuntimeColumnDescriptor, classBase: string, isHeader?: boolean) => {
+    className: string;
+    style: import("react").CSSProperties;
+};

package/types/useCellEditing.d.ts

@@ -0,0 +1,10 @@
+import { FocusEventHandler, KeyboardEvent as ReactKeyboardEvent, MouseEvent } from "react";
+export interface CellEditingHookProps {
+    navigate: () => void;
+}
+export declare const useCellEditing: ({ navigate }: CellEditingHookProps) => {
+    onBlur: FocusEventHandler<Element>;
+    onDoubleClick: (e: MouseEvent<HTMLElement>) => void;
+    onFocus: FocusEventHandler<Element>;
+    onKeyDown: (e: ReactKeyboardEvent<HTMLElement>) => void;
+};

package/types/useControlledTableNavigation.d.ts

@@ -0,0 +1,7 @@
+import { KeyboardEventHandler } from "react";
+export declare const useControlledTableNavigation: (initialValue: number, rowCount: number) => {
+    highlightedIndexRef: import("react").MutableRefObject<number | undefined>;
+    onHighlight: (idx: number) => void;
+    onKeyDown: KeyboardEventHandler<Element>;
+    tableRef: import("react").RefObject<HTMLDivElement>;
+};

package/types/useDataSource.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+import { DataSource, DataSourceRow, DataSourceSubscribedMessage, VuuFeatureInvocationMessage } from "@vuu-ui/vuu-data-types";
+import { VuuRange } from "@vuu-ui/vuu-protocol-types";
+import { GridAction } from "@vuu-ui/vuu-table-types";
+export interface DataSourceHookProps {
+    dataSource: DataSource;
+    onFeatureInvocation?: (message: VuuFeatureInvocationMessage) => void;
+    onSizeChange: (size: number) => void;
+    onSubscribed: (subscription: DataSourceSubscribedMessage) => void;
+    range?: VuuRange;
+    renderBufferSize?: number;
+}
+export declare const isVuuFeatureInvocation: (action: GridAction) => action is VuuFeatureInvocationMessage;
+export declare const useDataSource: ({ dataSource, onFeatureInvocation, onSizeChange, onSubscribed, range, renderBufferSize, }: DataSourceHookProps) => {
+    data: DataSourceRow[];
+    dataRef: import("react").MutableRefObject<DataSourceRow[]>;
+    getSelectedRows: () => DataSourceRow[];
+    range: VuuRange;
+    setRange: (range: VuuRange) => void;
+};

package/types/useInitialValue.d.ts

@@ -0,0 +1 @@
+export declare const useInitialValue: <T = unknown>(value: T) => T;

package/types/useKeyboardNavigation.d.ts

@@ -0,0 +1,36 @@
+import { VuuRange } from "@vuu-ui/vuu-protocol-types";
+import { KeyboardEvent, MouseEvent, RefObject } from "react";
+import { TableNavigationStyle } from "./Table";
+import { ScrollRequestHandler } from "./useTableScroll";
+export declare const isNavigationKey: (key: string, navigationStyle: TableNavigationStyle) => key is NavigationKey;
+type ArrowKey = "ArrowUp" | "ArrowDown" | "ArrowLeft" | "ArrowRight";
+type PageKey = "Home" | "End" | "PageUp" | "PageDown";
+type NavigationKey = PageKey | ArrowKey;
+export declare const isPagingKey: (key: string) => key is PageKey;
+export interface NavigationHookProps {
+    containerRef: RefObject<HTMLElement>;
+    columnCount?: number;
+    defaultHighlightedIndex?: number;
+    disableFocus?: boolean;
+    disableHighlightOnFocus?: boolean;
+    highlightedIndex?: number;
+    label?: string;
+    navigationStyle: TableNavigationStyle;
+    viewportRange: VuuRange;
+    onHighlight?: (idx: number) => void;
+    requestScroll?: ScrollRequestHandler;
+    restoreLastFocus?: boolean;
+    rowCount?: number;
+    selected?: unknown;
+    viewportRowCount: number;
+}
+export declare const useKeyboardNavigation: ({ columnCount, containerRef, disableFocus, defaultHighlightedIndex, disableHighlightOnFocus, highlightedIndex: highlightedIndexProp, navigationStyle, requestScroll, onHighlight, rowCount, viewportRowCount, }: NavigationHookProps) => {
+    highlightedIndexRef: import("react").MutableRefObject<number | undefined>;
+    navigate: () => void;
+    onClick: (evt: MouseEvent) => void;
+    onFocus: () => void;
+    onKeyDown: (e: KeyboardEvent) => void;
+    onMouseLeave: (() => void) | undefined;
+    onMouseMove: ((evt: MouseEvent) => void) | undefined;
+};
+export {};

package/types/useResizeObserver.d.ts

@@ -0,0 +1,15 @@
+import { RefObject } from "react";
+export declare const WidthHeight: string[];
+export declare const WidthOnly: string[];
+export type measurements<T = string | number> = {
+    height?: T;
+    clientHeight?: number;
+    clientWidth?: number;
+    contentHeight?: number;
+    contentWidth?: number;
+    scrollHeight?: number;
+    scrollWidth?: number;
+    width?: T;
+};
+export type ResizeHandler = (measurements: measurements<number>) => void;
+export declare function useResizeObserver(ref: RefObject<Element | HTMLElement | null>, dimensions: string[], onResize: ResizeHandler, reportInitialSize?: boolean): void;

package/types/useRowClassNameGenerators.d.ts

@@ -0,0 +1,3 @@
+import { TableConfig } from "@vuu-ui/vuu-table-types";
+import { RowClassNameGenerator } from "@vuu-ui/vuu-utils";
+export declare const useRowClassNameGenerators: ({ rowClassNameGenerators, }: TableConfig) => RowClassNameGenerator | undefined;

package/types/useRowHeight.d.ts

@@ -0,0 +1,8 @@
+interface RowHeightHookProps {
+    rowHeight?: number;
+}
+export declare const useRowHeight: ({ rowHeight: rowHeightProp, }: RowHeightHookProps) => {
+    rowHeight: number;
+    rowRef: (instance: HTMLDivElement | null) => void;
+};
+export {};

package/types/useSelection.d.ts

@@ -0,0 +1,14 @@
+import { TableRowClickHandlerInternal, TableRowSelectHandlerInternal, TableSelectionModel } from "@vuu-ui/vuu-table-types";
+import { SelectionChangeHandler } from "@vuu-ui/vuu-data-types";
+import { KeyboardEventHandler, MutableRefObject } from "react";
+export interface SelectionHookProps {
+    highlightedIndexRef: MutableRefObject<number | undefined>;
+    selectionKeys?: string[];
+    selectionModel: TableSelectionModel;
+    onSelect?: TableRowSelectHandlerInternal;
+    onSelectionChange: SelectionChangeHandler;
+}
+export declare const useSelection: ({ highlightedIndexRef, selectionKeys, selectionModel, onSelect, onSelectionChange, }: SelectionHookProps) => {
+    onKeyDown: KeyboardEventHandler<HTMLElement>;
+    onRowClick: TableRowClickHandlerInternal;
+};

package/types/useTable.d.ts

@@ -0,0 +1,71 @@
+import { DataSourceRow } from "@vuu-ui/vuu-data-types";
+import { ColumnDescriptor, DataCellEditHandler, TableRowClickHandlerInternal, RuntimeColumnDescriptor, TableColumnResizeHandler, TableConfig, TableSelectionModel } from "@vuu-ui/vuu-table-types";
+import { VuuSortType } from "@vuu-ui/vuu-protocol-types";
+import { MeasuredProps, MeasuredSize } from "@vuu-ui/vuu-ui-controls";
+import { FocusEvent, KeyboardEvent, RefObject } from "react";
+import { TableProps } from "./Table";
+export interface TableHookProps extends MeasuredProps, Pick<TableProps, "allowDragDrop" | "availableColumns" | "config" | "dataSource" | "disableFocus" | "highlightedIndex" | "id" | "navigationStyle" | "onAvailableColumnsChange" | "onConfigChange" | "onDragStart" | "onDrop" | "onFeatureInvocation" | "onHighlight" | "onSelect" | "onSelectionChange" | "onRowClick" | "renderBufferSize" | "scrollingApiRef"> {
+    containerRef: RefObject<HTMLDivElement>;
+    headerHeight: number;
+    rowHeight: number;
+    selectionModel: TableSelectionModel;
+    size: MeasuredSize;
+}
+export declare const useTable: ({ allowDragDrop, availableColumns, config, containerRef, dataSource, disableFocus, headerHeight, highlightedIndex: highlightedIndexProp, id, navigationStyle, onAvailableColumnsChange, onConfigChange, onDragStart, onDrop, onFeatureInvocation, onHighlight, onRowClick: onRowClickProp, onSelect, onSelectionChange, renderBufferSize, rowHeight, scrollingApiRef, selectionModel, size, }: TableHookProps) => {
+    "aria-rowcount": number;
+    rowClassNameGenerator: import("@vuu-ui/vuu-utils").RowClassNameGenerator | undefined;
+    draggableRow: JSX.Element | undefined;
+    onBlur: import("react").FocusEventHandler<Element>;
+    onDoubleClick: (e: import("react").MouseEvent<HTMLElement, MouseEvent>) => void;
+    onFocus: (e: FocusEvent<HTMLElement>) => void;
+    onKeyDown: (e: KeyboardEvent<HTMLElement>) => void;
+    onMouseDown: import("react").MouseEventHandler<Element> | undefined;
+    columnMap: import("@vuu-ui/vuu-utils").ColumnMap;
+    columns: RuntimeColumnDescriptor[];
+    data: DataSourceRow[];
+    getRowOffset: import("@vuu-ui/vuu-utils").RowOffsetFunc;
+    handleContextMenuAction: import("@vuu-ui/vuu-data-types").MenuActionHandler;
+    headings: import("@vuu-ui/vuu-table-types").TableHeadings;
+    highlightedIndex: number | undefined;
+    menuBuilder: import("@vuu-ui/vuu-data-types").MenuBuilder<string, unknown>;
+    onContextMenu: (evt: import("react").MouseEvent<HTMLElement, MouseEvent>) => void;
+    onDataEdited: DataCellEditHandler;
+    onMoveColumn: (columns: ColumnDescriptor[]) => void;
+    onMoveGroupColumn: (columns: ColumnDescriptor[]) => void;
+    onRemoveGroupColumn: (column: RuntimeColumnDescriptor) => void;
+    onRowClick: TableRowClickHandlerInternal;
+    onSortColumn: (column: ColumnDescriptor, extendSort?: any, sortType?: VuuSortType) => void;
+    onResizeColumn: TableColumnResizeHandler;
+    onToggleGroup: (row: DataSourceRow, column: RuntimeColumnDescriptor) => void;
+    scrollProps: {
+        columnsWithinViewport: RuntimeColumnDescriptor[];
+        scrollbarContainerRef: (el: HTMLDivElement | null) => void;
+        contentContainerRef: (el: HTMLDivElement | null) => void;
+        virtualColSpan: number;
+    };
+    tableAttributes: {
+        columnDefaultWidth?: number | undefined;
+        columnFormatHeader?: "capitalize" | "uppercase" | undefined;
+        columnSeparators?: boolean | undefined;
+        rowSeparators?: boolean | undefined;
+        zebraStripes?: boolean | undefined;
+    };
+    tableConfig: Readonly<TableConfig>;
+    viewportMeasurements: {
+        appliedPageSize: number;
+        contentHeight: number;
+        horizontalScrollbarHeight: number;
+        isVirtualScroll: boolean;
+        pinnedWidthLeft: number;
+        pinnedWidthRight: number;
+        rowCount: number;
+        contentWidth: number;
+        totalHeaderHeight: number;
+        verticalScrollbarWidth: number;
+        viewportBodyHeight: number;
+        viewportWidth: number;
+    };
+    onClick: (evt: import("react").MouseEvent<Element, MouseEvent>) => void;
+    onMouseLeave: (() => void) | undefined;
+    onMouseMove: ((evt: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
+};

package/types/useTableAndColumnSettings.d.ts

@@ -0,0 +1,15 @@
+import { DataSourceConfig, SchemaColumn } from "@vuu-ui/vuu-data-types";
+import { ColumnDescriptor, TableConfig } from "@vuu-ui/vuu-table-types";
+import { ColumnActionColumnSettings } from "./useTableModel";
+export interface TableAndColumnSettingsHookProps {
+    availableColumns: SchemaColumn[];
+    onAvailableColumnsChange?: (columns: SchemaColumn[]) => void;
+    onConfigChange: (config: TableConfig) => void;
+    onCreateCalculatedColumn: (column: ColumnDescriptor) => void;
+    onDataSourceConfigChange: (dataSourceConfig: DataSourceConfig) => void;
+    tableConfig: TableConfig;
+}
+export declare const useTableAndColumnSettings: ({ availableColumns: availableColumnsProps, onAvailableColumnsChange, onConfigChange, onCreateCalculatedColumn, onDataSourceConfigChange, tableConfig, }: TableAndColumnSettingsHookProps) => {
+    showColumnSettingsPanel: (action: ColumnActionColumnSettings) => void;
+    showTableSettingsPanel: () => void;
+};

package/types/useTableContextMenu.d.ts

@@ -0,0 +1,10 @@
+import { DataSource, DataSourceRow } from "@vuu-ui/vuu-data-types";
+import { RuntimeColumnDescriptor } from "@vuu-ui/vuu-table-types";
+import { MouseEvent } from "react";
+export interface TableContextMenuHookProps {
+    columns: RuntimeColumnDescriptor[];
+    data: DataSourceRow[];
+    dataSource: DataSource;
+    getSelectedRows: () => DataSourceRow[];
+}
+export declare const useTableContextMenu: ({ columns, data, dataSource, getSelectedRows, }: TableContextMenuHookProps) => (evt: MouseEvent<HTMLElement>) => void;