@timlassiter11/yatl 0.3.2 → 0.3.4

package/README.md

@@ -35,16 +35,16 @@ const datatble = DataTable("#myTable", {
 
 ### source (ES6)
 ```javascript
-import { DataTable } from "path/to/datatable.esm.js";
+import { DataTable } from "path/to/data-table.esm.js";
 
-const datatable = new DataTable("#myTable", {
+const dataTable = new DataTable("#myTable", {
    ...
 });
 ```
 
 ### source (UMD)
 ```html
-<script src="path/to/datatable.umd.js"></script>
+<script src="path/to/data-table.umd.js"></script>
 <script>
    const datatble = new yatl.DataTable("#myTable", {
       ...
@@ -57,12 +57,12 @@ Some optional styling is included which adds sorting indicators and sticky heade
 
 ### npm
 ```ts
-import "@timlassiter11/yatl/datatable.css";
+import "@timlassiter11/yatl/data-table.css";
 ```
 
 ### source
 ```html
-<link rel="stylesheet" href="path/to/datatable.css">
+<link rel="stylesheet" href="path/to/data-table.css">
 ```
 
 ## Usage
@@ -134,6 +134,9 @@ Most of the time this isn't ideal though and instead we'd like to let the layout
 
 Since the `dt-scroller` wrapper listens to scroll and resize events, this allows the table to be responsive and update what is rendered as the layout changes. 
 
+### Docs
+Full API docs can be found [here](https://timlassiter11.github.io/YATL/docs/index.html).
+
 # Known Issues
 There are some limitations to virtual scrolling. For one, rows need to be a uniform height to accurately calculate the table height. Also, there seems to be a maximum element size that once exceeded, the contents are no longer rendered. I've found this to occur with datasets approaching 1 million rows in Chrome and unfortunately I have no workaround for it. If you have that many rows you definitely need some server side pagination and this is probably not the library for you.
 

package/dist/data-table.css

@@ -0,0 +1,2 @@
+.data-table{--dt-header-sorter-width: 1ch;--dt-header-resizer-width: 10px;--dt-header-drop-color: rgba(255, 255, 255, .1);position:relative;white-space:nowrap;overflow:auto;table-layout:fixed}.dt-scroller{max-width:100%;max-height:100%;overflow:auto;position:relative}.dt-headers{position:sticky;top:0;z-index:1}.dt-headers th{overflow:hidden;box-sizing:border-box}.dt-headers .dt-header-content{position:relative}.dt-sortable .dt-header-content{cursor:pointer}.dt-header-title-wrapper{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;overflow:hidden}.dt-sort-icon{position:relative;width:var(--dt-header-sorter-width);align-self:stretch;padding:0 12px;overflow:hidden;flex-shrink:0}.dt-sort-icon:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.dt-sortable.dt-descending .dt-sort-icon:after{content:"\2191"}.dt-sortable.dt-ascending .dt-sort-icon:after{content:"\2193"}.dt-resizer{position:absolute;top:0;right:calc((var(--dt-header-resizer-width) / 2) * -1);height:100%;width:var(--dt-header-resizer-width);cursor:ew-resize;z-index:2}.dt-resizer:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:1px;height:60%;background-color:currentColor}.dt-headers>tr>th.dt-drag-over,.dt-headers>tr>th:has(.dt-drag-over){background-color:var(--dt-header-drop-color)}.data-table>tbody>tr>td,.dt-header-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.dt-empty{text-align:center;pointer-events:none}
+/*# sourceMappingURL=data-table.css.map */

package/dist/data-table.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/data-table/data-table.css"],"sourcesContent":[".data-table {\n  --dt-header-sorter-width: 1ch;\n  --dt-header-resizer-width: 10px;\n  --dt-header-drop-color: rgba(255, 255, 255, 0.1);\n\n  position: relative;\n  white-space: nowrap;\n  overflow: auto;\n  table-layout: fixed;\n}\n\n.dt-scroller {\n  max-width: 100%;\n  max-height: 100%;\n  overflow: auto;\n  position: relative;\n}\n\n.dt-headers {\n  position: sticky;\n  top: 0;\n  z-index: 1;\n}\n\n.dt-headers th {\n  overflow: hidden;\n  box-sizing: border-box;\n}\n\n.dt-headers .dt-header-content {\n  position: relative;\n}\n\n.dt-sortable .dt-header-content {\n  cursor: pointer;\n}\n\n.dt-header-title-wrapper {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  flex-wrap: nowrap;\n  overflow: hidden;\n}\n\n.dt-sort-icon {\n  position: relative;\n  width: var(--dt-header-sorter-width);\n  align-self: stretch;\n  padding: 0 12px;\n  overflow: hidden;\n  flex-shrink: 0;\n}\n\n.dt-sort-icon::after {\n  content: '';\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n}\n\n.dt-sortable.dt-descending .dt-sort-icon::after {\n  content: '\\2191';\n}\n\n.dt-sortable.dt-ascending .dt-sort-icon::after {\n  content: '\\2193';\n}\n\n.dt-resizer {\n  position: absolute;\n  top: 0;\n  right: calc((var(--dt-header-resizer-width) / 2) * -1);\n  height: 100%;\n  width: var(--dt-header-resizer-width);\n  cursor: ew-resize;\n  z-index: 2;\n}\n\n.dt-resizer::after {\n  content: '';\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 1px;\n  height: 60%;\n  background-color: currentColor;\n}\n\n.dt-headers > tr > th.dt-drag-over,\n.dt-headers > tr > th:has(.dt-drag-over) {\n  background-color: var(--dt-header-drop-color);\n}\n\n.data-table > tbody > tr > td,\n.dt-header-title {\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow: hidden;\n}\n\n.dt-empty {\n  text-align: center;\n  pointer-events: none;\n}\n"],"mappings":"AAAA,CAAC,WACC,0BAA0B,IAC1B,2BAA2B,KAC3B,wBAAwB,KAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,IAE5C,SAAU,SACV,YAAa,OACb,SAAU,KACV,aAAc,KAChB,CAEA,CAAC,YACC,UAAW,KACX,WAAY,KACZ,SAAU,KACV,SAAU,QACZ,CAEA,CAAC,WACC,SAAU,OACV,IAAK,EACL,QAAS,CACX,CAEA,CANC,WAMW,GACV,SAAU,OACV,WAAY,UACd,CAEA,CAXC,WAWW,CAAC,kBACX,SAAU,QACZ,CAEA,CAAC,YAAY,CAJA,kBAKX,OAAQ,OACV,CAEA,CAAC,wBACC,QAAS,KACT,eAAgB,IAChB,YAAa,OACb,UAAW,OACX,SAAU,MACZ,CAEA,CAAC,aACC,SAAU,SACV,MAAO,IAAI,0BACX,WAAY,QAhDd,QAiDW,EAAE,KACX,SAAU,OACV,YAAa,CACf,CAEA,CATC,YASY,OACX,QAAS,GACT,SAAU,SACV,IAAK,IACL,KAAM,IACN,UAAW,UAAU,IAAI,CAAE,KAC7B,CAEA,CA7BC,WA6BW,CAAC,cAAc,CAjB1B,YAiBuC,OACtC,QAAS,OACX,CAEA,CAjCC,WAiCW,CAAC,aAAa,CArBzB,YAqBsC,OACrC,QAAS,OACX,CAEA,CAAC,WACC,SAAU,SACV,IAAK,EACL,MAAO,KAAK,CAAC,IAAI,2BAA2B,EAAE,GAAG,EAAE,IACnD,OAAQ,KACR,MAAO,IAAI,2BACX,OAAQ,UACR,QAAS,CACX,CAEA,CAVC,UAUU,OACT,QAAS,GACT,SAAU,SACV,IAAK,IACL,KAAM,IACN,UAAW,UAAU,IAAI,CAAE,MAC3B,MAAO,IACP,OAAQ,IACR,iBAAkB,YACpB,CAEA,CAzEC,UAyEW,CAAE,EAAG,CAAE,EAAE,CAAC,aACtB,CA1EC,UA0EW,CAAE,EAAG,CAAE,EAAE,KAAK,CADJ,cAEpB,iBAAkB,IAAI,uBACxB,CAEA,CAhGC,UAgGW,CAAE,KAAM,CAAE,EAAG,CAAE,GAC3B,CAAC,gBACC,cAAe,SACf,YAAa,OACb,SAAU,MACZ,CAEA,CAAC,SACC,WAAY,OACZ,eAAgB,IAClB","names":[]}

package/dist/{datatable.d.mts → data-table.d.mts}

@@ -1,15 +1,40 @@
-type NestedKeyOf<T> = T extends object ? {
-    [K in keyof T]: K extends string ? T[K] extends object ? `${K}` | `${K}.${NestedKeyOf<T[K]>}` : `${K}` : never;
-}[keyof T] : never;
+type NestedKeyOf<ObjectType extends object> = {
+    [Key in keyof ObjectType & (string | number)]: ObjectType[Key] extends object ? `${Key}` | `${Key}.${NestedKeyOf<ObjectType[Key]>}` : `${Key}`;
+}[keyof ObjectType & (string | number)];
 declare const createRegexTokenizer: (exp?: string) => (value: string) => {
     value: string;
     quoted: boolean;
 }[];
 
+interface VirtualScrollOptions {
+    generator: (index: number) => HTMLElement;
+    container: HTMLElement;
+    element?: HTMLElement;
+    nodePadding?: number;
+}
+interface IVirtualScroll {
+    start(rowCount: number): void;
+    stop(): void;
+    scrollToIndex(index: number): void;
+    scrollToPx(px: number): void;
+}
+interface IVirtualScrollConstructor {
+    new (options: VirtualScrollOptions): IVirtualScroll;
+}
+
+/**
+ * Defines options for loading data into the table
+ * */
+interface LoadOptions {
+    /** If the data should replace or be added to the end of the current data */
+    append?: boolean;
+    /** If the current scroll position should be kept */
+    keepScroll?: boolean;
+}
 /**
  * Defines the possible sorting orders for columns.
  */
-type SortOrder = 'asc' | 'desc' | null;
+type SortOrder = 'asc' | 'desc';
 /**
  * Callback for formatting a row's  HTML element.
  * @param row - The row data.
@@ -25,6 +50,7 @@ type RowFormatterCallback<T> = (row: T, element: HTMLElement) => void;
 type ValueFormatterCallback<T> = (value: any, row: T) => string;
 /**
  * Callback for formatting a cell's HTML element.
+ * Called when the cell is created but NOT when exporting to CSV.
  * @param value - The value of the field.
  * @param row - The row data.
  * @param element - The cell element.
@@ -44,8 +70,25 @@ type ComparatorCallback = (a: any, b: any) => number;
  * @returns The derived value for sorting (e.g., a number or a standardized string).
  */
 type SortValueCallback = (value: any) => number | string;
+/**
+ * A filter object containing keys for the fields to be filtered,
+ * and the values used to compare against.
+ */
+type Filters<T extends object> = Partial<{
+    [K in NestedKeyOf<T>]: any;
+}>;
+/**
+ * A single query token derived from a larger string
+ */
 interface QueryToken {
+    /**
+     * The value to use for the token
+     */
     value: string;
+    /**
+     * If the token should be treated as quoted.
+     * Quoted tokens are searched for exactly, no partial matches.
+     */
     quoted: boolean;
 }
 /**
@@ -60,7 +103,7 @@ type TokenizerCallback = (value: any) => QueryToken[];
  * @param index - The index of the row.
  * @returns True if the row matches the filter, false otherwise.
  */
-type FilterCallback = (row: any, index: number) => boolean;
+type FilterCallback<T> = (row: T, index: number) => boolean;
 /**
  * Callback for filtering a field value against the filter data.
  * @param value - The value to filter.
@@ -68,10 +111,24 @@ type FilterCallback = (row: any, index: number) => boolean;
  * @returns True if the value matches the filter, false otherwise.
  */
 type ColumnFilterCallback = (value: any, filter: any) => boolean;
+/**
+ * Represents the current sort state
+ */
+interface SortState {
+    /**
+     * The sort order
+     */
+    order: SortOrder;
+    /**
+     * The sort priority.
+     * Lower priority means
+     */
+    priority: number;
+}
 /**
  * Column options for the table.
  */
-interface ColumnOptions<T> {
+interface ColumnOptions<T extends object> {
     /**
      * The field name in the data object.
      */
@@ -92,65 +149,42 @@ interface ColumnOptions<T> {
      * Whether the column's data should be tokenized for searching.
      */
     tokenize?: boolean;
-    /**
-     * The initial sort order of the column.
-     */
-    sortOrder?: SortOrder;
-    /**
-     * The initial sort priority of the column for sorting.
-     * Lower numbers are sorted first.
-     */
-    sortPriority?: number;
-    /**
-     * Whether the column should be visible by default.
-     */
-    visible?: boolean;
     /**
      * Whether the column should be resizable.
-     * Defaults to the table's resizable option.
      */
     resizable?: boolean;
-    /**
-     * The initial width of the column.
-     * Can be a number (in pixels) or a string (e.g. "100px", "50%").
-     */
-    width?: string | number;
     /**
      * A function to format the value for display.
      */
-    valueFormatter?: ValueFormatterCallback<T>;
+    valueFormatter?: ValueFormatterCallback<T> | null;
     /**
      * A function to format the element for display.
      */
-    elementFormatter?: CellFormatterCallback<T>;
+    elementFormatter?: CellFormatterCallback<T> | null;
     /**
      * A function to use for sorting the column.
      * This overrides the default sorting behavior.
      */
-    sorter?: ComparatorCallback;
+    sorter?: ComparatorCallback | null;
     /**
      * A function to derive a comparable value from the cell's original value, specifically for sorting this column.
      * This can be used to preprocess and cache values (e.g., convert to lowercase, extract numbers) before comparison.
      */
-    sortValue?: SortValueCallback;
+    sortValue?: SortValueCallback | null;
     /**
      * A custom function to determine if a cell's value in this column matches a given filter criterion.
      * This is used when `DataTable.filter()` is called with an object-based filter that targets this column's field.
-     * @param value - The cell's value.
-     * @param filterCriterion - The criterion provided for this column in the main filter object.
      */
-    filter?: ColumnFilterCallback;
+    filter?: ColumnFilterCallback | null;
 }
-/** Represents the current state of a column, often used for saving and restoring column configurations. */
-interface ColumnState {
+/**
+ * Represents the current state of a column.
+ */
+interface ColumnState<T extends object> {
     /**
      * The unique field name of the column.
      */
-    readonly field: string;
-    /**
-     * The user friendly title of the column.
-     */
-    readonly title: string;
+    field: NestedKeyOf<T>;
     /**
      * The current visibility of the column.
      */
@@ -158,16 +192,11 @@ interface ColumnState {
     /**
      * The current sort order of the column.
      */
-    sortOrder: SortOrder;
+    sortState?: SortState | null;
     /**
-     * The current sort priority of the column.
-     * Lower numbers are sorted first.
+     * The currently set width of the column in pixels.
      */
-    sortPriority: number;
-    /**
-     * The currently set width of the column.
-     */
-    width: string;
+    width?: number | null;
 }
 /**
  * Defines CSS classes to be applied to different parts of the table.
@@ -205,11 +234,7 @@ interface TableClasses {
 /**
  * Options for configuring the table.
  */
-interface TableOptions<T> {
-    /**
-     * The initial data to load into the table.
-     */
-    data?: T[];
+interface TableOptions<T extends object> {
     /**
      * Configures virtual scrolling.
      */
@@ -227,16 +252,6 @@ interface TableOptions<T> {
      * Scoring is very computationally expensive...
      */
     enableSearchScoring?: boolean;
-    /**
-     * Whether columns should be sortable by default.
-     * Can be overridden on individual columns.
-     */
-    sortable?: boolean;
-    /**
-     * Whether columns should be resizable by default.
-     * Can be overridden on individual columns.
-     */
-    resizable?: boolean;
     /**
      * Whether columns should be rearrangeable by drag and drop.
      */
@@ -245,7 +260,7 @@ interface TableOptions<T> {
      * Additional fields to include in the search.
      * Used for fields that are not displayed as columns.
      */
-    extraSearchFields?: string[];
+    extraSearchFields?: NestedKeyOf<T>[];
     /**
      * The text to display when there is no data in the table.
      */
@@ -261,21 +276,48 @@ interface TableOptions<T> {
     /**
      * A function to format each row's HTML element.
      */
-    rowFormatter?: RowFormatterCallback<T>;
+    rowFormatter?: RowFormatterCallback<T> | null;
     /**
      * A function to use for tokenizing values for searching.
      */
     tokenizer?: TokenizerCallback;
+    /**
+     * A specific virtual scroll class to use
+     */
+    virtualScrollClass?: IVirtualScrollConstructor;
 }
-interface LoadOptions {
-    /** If the data should replace or be added to the end of the current data */
-    append?: boolean;
-    /** If the current scroll position should be kepts */
-    keepScroll?: boolean;
+/**
+ * Represents the current state of the table
+ */
+interface TableState<T extends object> {
+    /**
+     * A list of {@link ColumnState}s representing all of the columns in the table.
+     */
+    columns: ColumnState<T>[];
+    /**
+     * The current query applied to the table or null if no query is applied.
+     */
+    searchQuery: string | RegExp | null;
+    /**
+     * The current filters applied to the table or null if no filters are applied.
+     */
+    filters: Filters<T> | FilterCallback<T> | null;
+    /**
+     * The current scroll position of the table
+     */
+    scrollPosition: {
+        top: number;
+        left: number;
+    };
+    /**
+     * The current column order represented as a list of their fields from left to right.
+     */
+    columnOrder: NestedKeyOf<T>[];
 }
-type Filters<T> = Partial<{
-    [K in keyof T]: any;
-}>;
+type RestorableColumnState<T extends object> = Partial<Omit<ColumnState<T>, 'field'>> & Pick<ColumnState<T>, 'field'>;
+type RestorableTableState<T extends object> = Partial<Omit<TableState<T>, 'columns'>> & {
+    columns?: RestorableColumnState<T>[];
+};
 
 /**
  * Represents a dynamic and interactive table with features like sorting, searching, filtering,
@@ -300,7 +342,7 @@ type Filters<T> = Partial<{
  * });
  * ```
  */
-declare class DataTable<T> extends EventTarget {
+declare class DataTable<T extends object> extends EventTarget {
     #private;
     private static readonly MatchWeights;
     private readonly DEFAULT_OPTIONS;
@@ -312,15 +354,11 @@ declare class DataTable<T> extends EventTarget {
      * @throws {SyntaxError} If the table selector does not find an element.
      * @throws {TypeError} If the provided table element is not an HTMLTableElement or if columns option is not an array.
      */
-    constructor(table: string | HTMLTableElement, columns: ColumnOptions<T>[], options?: TableOptions<T>);
-    get options(): RequiredOptions<T>;
+    constructor(table: string | HTMLTableElement, columns: ColumnInitOptions<T>[], options?: TableInitOptions<T>);
     /**
-     * Gets or sets the state of all columns in the table.
-     * This can be used to save and restore column configurations like visibility, sort order, and width.
-     * When setting, it attempts to apply the states to existing columns.
+     * Gets the current options applied to the table.
      */
-    get columnStates(): ColumnState[];
-    set columnStates(states: ColumnState[]);
+    get tableOptions(): ConcreteTableOptions<T>;
     /**
      * Gets the currently filtered and sorted rows displayed in the table.
      */
@@ -333,8 +371,18 @@ declare class DataTable<T> extends EventTarget {
      * Gets the underlying HTMLTableElement managed by this DataTable instance.
      */
     get table(): HTMLTableElement;
-    updateOptions(options: UpdatableOptions<T>): void;
-    updateColumnOptions(column: ColumnField<T>, options: UpdateableColumnOptions<T>): void;
+    /**
+     * Gets the current state of the table.
+     */
+    getState(): TableState<T>;
+    /**
+     * Restores the table to the provided state.
+     * @param state - The state to restore the table to.
+     */
+    restoreState(state: RestorableTableState<T>): void;
+    updateTableOptions(options: UpdatableTableOptions<T>): void;
+    getColumnOptions(column: NestedKeyOf<T>): Required<ColumnOptionsWithoutField<T>>;
+    updateColumnOptions(column: NestedKeyOf<T>, options: ColumnOptionsWithoutField<T>): void;
     /**
      * Loads data into the table
      * @param rows - An array of data to be loaded
@@ -347,7 +395,7 @@ declare class DataTable<T> extends EventTarget {
      * @param text - The text or HTML message to display.
      * @param classes - A string or array of strings for CSS classes to apply to the message row.
      */
-    showMessage(text: string, classes: string | string[]): void;
+    showMessage(text: string, ...classes: string[]): void;
     /**
      * Clears the current message and dispalsy the normal table data.
      */
@@ -357,7 +405,7 @@ declare class DataTable<T> extends EventTarget {
      * The search is performed on columns marked as `searchable` and `extraSearchFields`.
      * @param query - The search term (string) or a regular expression. An empty string clears the search.
      */
-    search(query?: string | RegExp): void;
+    search(query?: string | RegExp | null): void;
     /**
      * Applies filters to the table rows.
      * Filters can be an object where keys are field names and values are the criteria to filter by,
@@ -365,30 +413,30 @@ declare class DataTable<T> extends EventTarget {
      * @param filters - An object defining field-based filters or a custom filter callback function.
      * @throws {TypeError} If `filters` is not an object or a function.
      */
-    filter(filters?: Filters<T> | FilterCallback): void;
+    filter(filters?: Filters<T> | FilterCallback<T> | null): void;
     /**
      * Sorts the table by a specified column and order.
      * If `order` is `null`, the sort on this column is removed.
      * @param colName - The field name of the column to sort by.
      * @param order - The sort order: 'asc', 'desc', or `null` to remove sorting for this column.
      */
-    sort(colName: string, order: SortOrder): void;
+    sort(colName: NestedKeyOf<T>, order: SortOrder | null): void;
     /**
      * Sets the visibility of a specified column.
      * @param colName - The field name of the column.
      * @param visisble - `true` to show the column, `false` to hide it.
      */
-    setColumnVisibility(colName: string, visisble: boolean): void;
+    setColumnVisibility(colName: NestedKeyOf<T>, visisble: boolean): void;
     /**
      * Shows a previously hidden column.
      * @param field - The field name of the column to show.
      */
-    showColumn(field: string): void;
+    showColumn(field: NestedKeyOf<T>): void;
     /**
      * Hides a visible column.
      * @param field - The field name of the column to hide.
      */
-    hideColumn(field: string): void;
+    hideColumn(field: NestedKeyOf<T>): void;
     /**
      * Export the current visible table data to a CSV file.
      * @param filename - The name of the file to save.
@@ -409,7 +457,7 @@ declare class DataTable<T> extends EventTarget {
      * @param fields - An array of field names representing the new order of columns. Columns not included in the array will be placed at the end.
      * @throws {TypeError} If `fields` is not an array.
      */
-    setColumnOrder(fields: string[]): void;
+    setColumnOrder(fields: NestedKeyOf<T>[]): void;
     /**
      * Refreshes the table display. This re-applies filters, sorting, and updates headers and rows.
      */
@@ -442,7 +490,7 @@ declare class DataTable<T> extends EventTarget {
      * }
      * ```
      */
-    updateRow(index: number, data: T): void;
+    updateRow(index: number, data: Partial<T>): void;
     /**
      * Deletes a row at a specific original index from the table.
      * @param index - The original index of the row to delete.
@@ -454,14 +502,25 @@ declare class DataTable<T> extends EventTarget {
      * @param callback - A function to execute. It receives the DataTable instance as its argument.
      * @example dataTable.withoutUpdates(dt => { dt.sort('name', 'asc'); dt.filter({ age: '>30' }); });
      */
-    withoutUpdates(callback: (datatable: DataTable<T>) => void): void;
+    withoutUpdates(callback: (dataTable: DataTable<T>) => void): void;
     addEventListener<K extends keyof DataTableEventMap<T>>(type: K, listener: (this: DataTable<T>, ev: CustomEvent<DataTableEventMap<T>[K]>) => any, options?: boolean | AddEventListenerOptions): void;
     addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    private readonly TABLE_OPTION_CONFIGS;
+    private readonly COLUMN_OPTION_CONFIGS;
 }
-type ColumnField<T> = NestedKeyOf<T>;
-type InternalClasses = Required<{
+type TableInitOptions<T extends object> = TableOptions<T> & {
+    data?: T[];
+};
+type ColumnInitOptions<T extends object> = ColumnOptions<T> & Partial<ColumnState<T>>;
+type ConcreteTableClasses = Required<{
     [K in keyof TableClasses]: string[];
 }>;
+type ConcreteTableOptions<T extends object> = Required<Omit<TableOptions<T>, 'data' | 'classes' | 'virtualScroll'>> & {
+    classes: ConcreteTableClasses;
+    virtualScroll: number;
+};
+type UpdatableTableOptions<T extends object> = TableOptions<T>;
+type ColumnOptionsWithoutField<T extends object> = Omit<ColumnOptions<T>, 'field'>;
 /**
  * Defines the mapping between event names and their detail object types.
  */
@@ -475,7 +534,7 @@ interface DataTableEventMap<T> {
     'dt.rows.changed': object;
     'dt.col.sort': {
         column: string;
-        order: SortOrder;
+        order: SortOrder | null;
     };
     'dt.col.visibility': {
         column: string;
@@ -490,31 +549,52 @@ interface DataTableEventMap<T> {
         dropColumn: string;
         order: string[];
     };
+    'dt.search': {
+        query: string | RegExp | null;
+    };
 }
-type RequiredOptions<T> = Required<Omit<TableOptions<T>, 'columns' | 'data' | 'rowFormatter' | 'classes'>> & Pick<TableOptions<T>, 'rowFormatter'> & {
-    classes: InternalClasses;
-    virtualScroll: number;
-};
-type UpdatableOptions<T> = Pick<TableOptions<T>, 'virtualScroll' | 'highlightSearch' | 'tokenizeSearch' | 'enableSearchScoring' | 'rearrangeable' | 'extraSearchFields' | 'noMatchText' | 'noDataText' | 'classes'>;
-type UpdateableColumnOptions<T> = Pick<ColumnOptions<T>, 'title' | 'searchable' | 'resizable' | 'sortable' | 'tokenize' | 'valueFormatter' | 'elementFormatter' | 'sorter'>;
 
-interface Options {
-    saveColumnSorting: boolean;
-    saveColumnOrder: boolean;
-    saveColumnVisibility: boolean;
-    saveColumnWidth: boolean;
+declare class VirtualScroll implements IVirtualScroll {
+    #private;
+    static AVERAGE_RENDER_COUNT: number;
+    constructor({ generator, container, element, nodePadding, }: VirtualScrollOptions);
+    private get rowHeight();
+    get started(): boolean;
+    scrollToIndex(index: number): void;
+    /**
+     * @param px
+     */
+    scrollToPx(px: number): void;
+    start(rowCount: number): void;
+    stop(): void;
 }
+declare class VirtualScrollError extends Error {
+    constructor(message: string);
+}
+
+interface LocalStorageAdapterOptions {
+    saveSearch?: boolean;
+    saveColumnSorting?: boolean;
+    saveColumnOrder?: boolean;
+    saveColumnVisibility?: boolean;
+    saveColumnWidth?: boolean;
+}
+interface IDataTable<T extends object> extends EventTarget {
+    getState(): TableState<T>;
+    restoreState(state: RestorableTableState<T>): void;
+}
+
 /**
  * Monitors a {@link DataTable} instance for changes and saves the state to local storage.
  */
-declare class LocalStorageAdapter<T> {
+declare class LocalStorageAdapter<T extends object> {
     #private;
     /**
      * @param dataTable - The DataTable instance to monitor.
      * @param storageKey - The key to use for saving the state in localStorage.
      * @param options - The options for configuring what is stored.
      */
-    constructor(dataTable: DataTable<T>, storageKey: string, options?: Options);
+    constructor(dataTable: IDataTable<T>, storageKey: string, options?: LocalStorageAdapterOptions);
     /**
      * Saves the current column state to localStorage.
      */
@@ -529,4 +609,4 @@ declare class LocalStorageAdapter<T> {
     clearState(): void;
 }
 
-export { type CellFormatterCallback, type ColumnFilterCallback, type ColumnOptions, type ColumnState, type ComparatorCallback, DataTable, type DataTableEventMap, type FilterCallback, type Filters, type LoadOptions, LocalStorageAdapter, type QueryToken, type RowFormatterCallback, type SortOrder, type SortValueCallback, type TableClasses, type TableOptions, type TokenizerCallback, type ValueFormatterCallback, createRegexTokenizer };
+export { type CellFormatterCallback, type ColumnFilterCallback, type ColumnOptions, type ColumnState, type ComparatorCallback, DataTable, type DataTableEventMap, type FilterCallback, type Filters, type IDataTable, type IVirtualScroll, type IVirtualScrollConstructor, type LoadOptions, LocalStorageAdapter, type LocalStorageAdapterOptions, type QueryToken, type RestorableColumnState, type RestorableTableState, type RowFormatterCallback, type SortOrder, type SortState, type SortValueCallback, type TableClasses, type TableOptions, type TableState, type TokenizerCallback, type ValueFormatterCallback, VirtualScroll, VirtualScrollError, type VirtualScrollOptions, createRegexTokenizer };