@keenmate/web-grid 1.0.0-rc02

package/dist/web-component.d.ts

@@ -0,0 +1,277 @@
+import { WebGrid } from './grid.js';
+import type { Column, CellValidationState, RowToolbarConfig, ContextMenuItem, RowChangeDetail, ToolbarClickDetail, RowActionClickDetail, ContextMenuContext, EditTrigger, EditorOption, EditorOptions, GridMode, ToggleVisibility, DataRequestDetail, SortState, PaginationLabelsCallback, SummaryContentCallback } from './types.js';
+import type { GridContext } from './modules/types.js';
+/**
+ * GridElement - Custom HTML Element for WebGrid
+ *
+ * Extends HTMLElement and composes WebGrid for business logic.
+ *
+ * Usage:
+ * ```html
+ * <web-grid></web-grid>
+ * ```
+ *
+ * ```js
+ * const grid = document.querySelector('web-grid');
+ * grid.items = [...];
+ * grid.columns = [...];
+ * ```
+ */
+export declare class GridElement<T = unknown> extends HTMLElement implements GridContext<T> {
+    readonly grid: WebGrid<T>;
+    readonly shadow: ShadowRoot;
+    private styleElement;
+    private customStyleElement;
+    private updatePending;
+    isCommittingFromKeyboard: boolean;
+    private isTransitioningCells;
+    private wheelListenerAdded;
+    private toolbarOutsideClickAdded;
+    private toolbarScrollListenerAdded;
+    private toolbarMoveInProgress;
+    private toolbarHideTimeout;
+    private toolbarHovered;
+    dropdownOpen: boolean;
+    dropdownOptions: EditorOption[];
+    highlightedIndex: number;
+    filterText: string;
+    isUserFiltering: boolean;
+    justSelected: boolean;
+    isOpeningDropdown: boolean;
+    searchDebounceTimer: ReturnType<typeof setTimeout> | null;
+    searchAbortController: AbortController | null;
+    isSearching: boolean;
+    tooltipElement: HTMLElement | null;
+    tooltipArrowElement: HTMLElement | null;
+    tooltipAnchor: HTMLElement | null;
+    tooltipShowTimer: ReturnType<typeof setTimeout> | null;
+    tooltipHideTimer: ReturnType<typeof setTimeout> | null;
+    private _tooltipShowDelay;
+    private _tooltipHideDelay;
+    get tooltipShowDelay(): number;
+    set tooltipShowDelay(value: number);
+    get tooltipHideDelay(): number;
+    set tooltipHideDelay(value: number);
+    private datepicker;
+    private contextMenuElement;
+    private virtualScrollStart;
+    private virtualScrollEnd;
+    private scrollListenerAdded;
+    private isLoadingMoreItems;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    get items(): T[];
+    set items(value: T[]);
+    get columns(): Column<T>[];
+    set columns(value: Column<T>[]);
+    get sortable(): boolean;
+    set sortable(value: boolean);
+    get filterable(): boolean;
+    set filterable(value: boolean);
+    get pageable(): boolean;
+    set pageable(value: boolean);
+    get pageSize(): number;
+    set pageSize(value: number);
+    get pageSizes(): number[];
+    set pageSizes(value: number[]);
+    get striped(): boolean;
+    set striped(value: boolean);
+    get hoverable(): boolean;
+    set hoverable(value: boolean);
+    get editable(): boolean;
+    set editable(value: boolean);
+    get editTrigger(): EditTrigger;
+    set editTrigger(value: EditTrigger);
+    get mode(): GridMode;
+    set mode(value: GridMode);
+    get dropdownToggleVisibility(): ToggleVisibility;
+    set dropdownToggleVisibility(value: ToggleVisibility);
+    get dropdownShowOnFocus(): boolean;
+    set dropdownShowOnFocus(value: boolean);
+    get openDropdownOnEnter(): boolean;
+    set openDropdownOnEnter(value: boolean);
+    get checkboxAlwaysEditable(): boolean;
+    set checkboxAlwaysEditable(value: boolean);
+    get showRowNumbers(): boolean;
+    set showRowNumbers(value: boolean);
+    get invalidCells(): CellValidationState[];
+    set invalidCells(value: CellValidationState[]);
+    get showRowToolbar(): boolean;
+    set showRowToolbar(value: boolean);
+    get rowToolbar(): RowToolbarConfig<T>[];
+    set rowToolbar(value: RowToolbarConfig<T>[]);
+    get toolbarAlign(): 'center' | 'top';
+    set toolbarAlign(value: 'center' | 'top');
+    get toolbarTopPosition(): 'start' | 'center' | 'end' | 'cursor';
+    set toolbarTopPosition(value: 'start' | 'center' | 'end' | 'cursor');
+    get toolbarTrigger(): 'hover' | 'click' | 'button';
+    set toolbarTrigger(value: 'hover' | 'click' | 'button');
+    get contextMenu(): ContextMenuItem<T>[] | undefined;
+    set contextMenu(value: ContextMenuItem<T>[] | undefined);
+    get showRowActions(): boolean;
+    set showRowActions(value: boolean);
+    get rowActions(): RowToolbarConfig<T>[];
+    set rowActions(value: RowToolbarConfig<T>[]);
+    set onrowchange(value: ((detail: RowChangeDetail<T>) => void) | undefined);
+    set onroweditstart(value: ((detail: {
+        row: T;
+        rowIndex: number;
+        field: string;
+    }) => void) | undefined);
+    set onroweditcancel(value: ((detail: {
+        row: T;
+        rowIndex: number;
+        field: string;
+    }) => void) | undefined);
+    set onvalidationerror(value: ((detail: {
+        row: T;
+        rowIndex: number;
+        field: string;
+        error: string;
+    }) => void) | undefined);
+    set ontoolbarclick(value: ((detail: ToolbarClickDetail<T>) => void) | undefined);
+    set onrowaction(value: ((detail: RowActionClickDetail<T>) => void) | undefined);
+    set oncontextmenuopen(value: ((context: ContextMenuContext<T>) => void) | undefined);
+    get ondatarequest(): ((detail: DataRequestDetail) => void) | undefined;
+    set ondatarequest(value: ((detail: DataRequestDetail) => void) | undefined);
+    get onrowdelete(): ((detail: {
+        rowIndex: number;
+        row: T;
+    }) => void) | undefined;
+    set onrowdelete(value: ((detail: {
+        rowIndex: number;
+        row: T;
+    }) => void) | undefined);
+    get sort(): SortState[];
+    set sort(value: SortState[]);
+    get currentPage(): number;
+    set currentPage(value: number);
+    get totalItems(): number | null;
+    set totalItems(value: number | null);
+    get showPagination(): boolean | 'auto';
+    set showPagination(value: boolean | 'auto');
+    get paginationPosition(): string;
+    set paginationPosition(value: string);
+    get paginationLabelsCallback(): PaginationLabelsCallback | undefined;
+    set paginationLabelsCallback(value: PaginationLabelsCallback | undefined);
+    get paginationLayout(): string;
+    set paginationLayout(value: string);
+    get summaryPosition(): string | undefined;
+    set summaryPosition(value: string | undefined);
+    get summaryContentCallback(): SummaryContentCallback<T> | undefined;
+    set summaryContentCallback(value: SummaryContentCallback<T> | undefined);
+    get customStylesCallback(): (() => string) | undefined;
+    set customStylesCallback(value: (() => string) | undefined);
+    get rowClassCallback(): ((row: T, rowIndex: number) => string | null) | undefined;
+    set rowClassCallback(value: ((row: T, rowIndex: number) => string | null) | undefined);
+    get summaryMetadata(): unknown;
+    set summaryMetadata(value: unknown);
+    get summaryInline(): boolean;
+    set summaryInline(value: boolean);
+    get virtualScroll(): boolean;
+    set virtualScroll(value: boolean);
+    get virtualScrollThreshold(): number;
+    set virtualScrollThreshold(value: number);
+    get virtualScrollRowHeight(): number;
+    set virtualScrollRowHeight(value: number);
+    get virtualScrollBuffer(): number;
+    set virtualScrollBuffer(value: number);
+    get infiniteScroll(): boolean;
+    set infiniteScroll(value: boolean);
+    get infiniteScrollThreshold(): number;
+    set infiniteScrollThreshold(value: number);
+    get hasMoreItems(): boolean;
+    set hasMoreItems(value: boolean);
+    get displayItems(): T[];
+    get totalPages(): number;
+    get isNavigateMode(): boolean;
+    getRowDraft(rowIndex: number): T | undefined;
+    hasRowDraft(rowIndex: number): boolean;
+    discardRowDraft(rowIndex: number): void;
+    getDraftRowIndices(): number[];
+    discardAllDrafts(): void;
+    isCellInvalid(rowIndex: number, field: string): boolean;
+    getCellValidationError(rowIndex: number, field: string): string | null;
+    escapeHtml(text: string): string;
+    getCurrentEditingColumn(): Column<T> | null;
+    getCurrentEditorOptions(): EditorOptions;
+    moveFocusAfterCommit(rowIndex: number, field: string, direction: 'down' | 'up' | 'next' | 'prev'): void;
+    private requestUpdate;
+    /**
+     * Update custom styles in shadow DOM from customStylesCallback
+     */
+    private updateCustomStyles;
+    /**
+     * Handle keyboard navigation in cells
+     */
+    private handleCellKeyDown;
+    /**
+     * Handle keydown in editor inputs
+     */
+    private handleEditorKeyDown;
+    private attachEventListeners;
+    /**
+     * Handle virtual scroll - recalculate visible range and re-render if changed
+     */
+    private handleVirtualScroll;
+    /**
+     * Render only the tbody with virtual rows (fast update, no full re-render)
+     * After re-render, re-focus the focusedCell to maintain keyboard navigation
+     */
+    private renderVirtualRows;
+    /**
+     * Handle infinite scroll - trigger load more when near bottom
+     */
+    private handleInfiniteScroll;
+    private render;
+    /**
+     * Render the SVG connector arrow for toolbar row tracking
+     */
+    private renderConnector;
+    /**
+     * Open the date picker for a date input
+     */
+    private openDatePicker;
+    /**
+     * Handle date selection from the date picker
+     */
+    private handleDatePickerSelect;
+    /**
+     * Commit the date editor value
+     */
+    private commitDateEditor;
+    /**
+     * Parse date input string using format info
+     */
+    private parseDateInput;
+    /**
+     * Show "Go to Row" dialog (Ctrl+G)
+     */
+    private showGoToRowDialog;
+    /**
+     * Open custom editor by calling the cellEditCallback
+     */
+    private openCustomEditor;
+    /**
+     * Handle context menu (right-click) on cells
+     */
+    private handleContextMenu;
+    /**
+     * Show toolbar for a specific row
+     */
+    private showToolbarForRow;
+    /**
+     * Close toolbar and reset move flag
+     */
+    private closeToolbarAndReset;
+    /**
+     * Handle toolbar item click
+     */
+    private handleToolbarItemClick;
+    /**
+     * Handle paste event in navigate mode
+     */
+    private handlePaste;
+}
+export default GridElement;