@timlassiter11/yatl 1.0.0 → 1.0.1

package/dist/index.d.mts

@@ -199,11 +199,11 @@ interface ColumnState<T> {
     /**
      * The current sort order of the column.
      */
-    sortState?: SortState | null;
+    sort: SortState | null;
     /**
      * The currently set width of the column in pixels.
      */
-    width?: number | null;
+    width: number | null;
 }
 /**
  * Represents the current state of the table
@@ -306,6 +306,14 @@ declare class YatlSearchEvent extends YatlEvent<{
     static readonly EVENT_NAME = "yatl-search";
     constructor(query: string);
 }
+declare class YatlStateChangeEvent<T> extends YatlEvent<{
+    state: TableState<T>;
+    triggers: string[];
+}> {
+    triggers: string[];
+    static readonly EVENT_NAME = "yatl-state-change";
+    constructor(state: TableState<T>, triggers: string[]);
+}
 
 /**
  * Represents a dynamic and interactive table with features like sorting, searching, filtering,
@@ -319,6 +327,7 @@ declare class YatlTable<T extends object> extends LitElement {
     private _enableSearchScoring;
     private _columns;
     private _columnStates;
+    private _columnOrder;
     private _storageOptions;
     private _data;
     private _searchQuery;
@@ -399,12 +408,32 @@ declare class YatlTable<T extends object> extends LitElement {
      */
     get columns(): ColumnOptions<T>[];
     set columns(columns: ColumnOptions<T>[]);
-    /**
-     * The current dynamic state of the columns (width, visibility, sort order).
-     * This property is updated automatically when users interact with the table.
-     */
-    get columnStates(): ColumnState<T>[];
-    set columnStates(states: ColumnState<T>[]);
+    get columnOrder(): NestedKeyOf<T>[];
+    set columnOrder(columns: NestedKeyOf<T>[]);
+    get columnVisibility(): {
+        field: NestedKeyOf<T>;
+        visible: boolean;
+    }[];
+    set columnVisibility(columns: {
+        field: NestedKeyOf<T>;
+        visible: boolean;
+    }[]);
+    get columnSort(): {
+        field: NestedKeyOf<T>;
+        sort: SortState | null;
+    }[];
+    set columnSort(columns: {
+        field: NestedKeyOf<T>;
+        sort: SortState | null;
+    }[]);
+    get columnWidths(): {
+        field: NestedKeyOf<T>;
+        width: number | null;
+    }[];
+    set columnWidths(columns: {
+        field: NestedKeyOf<T>;
+        width: number | null;
+    }[]);
     /**
      * The current text string used to filter the table data.
      * Setting this property triggers a new search and render cycle.
@@ -510,13 +539,6 @@ declare class YatlTable<T extends object> extends LitElement {
     scrollToOriginalIndex(index: number): Promise<void>;
     scrollToFilteredIndex(index: number): Promise<void>;
     scrollToPx(px: number): Promise<void>;
-    /**
-     * Sets the display order of the columns in the table.
-     *
-     * @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: NestedKeyOf<T>[]): void;
     /**
      * Finds the first row
      * @param field
@@ -560,10 +582,10 @@ declare class YatlTable<T extends object> extends LitElement {
     deleteRow(index: number): void;
     protected renderColumnSortIcon(column: ColumnOptions<T>, state: ColumnState<T>): TemplateResult<1> | typeof nothing;
     protected renderColumnResizer(column: ColumnOptions<T>, _state: ColumnState<T>): TemplateResult<1> | typeof nothing;
-    protected renderHeaderCell(column: ColumnOptions<T>): TemplateResult<1> | typeof nothing;
+    protected renderHeaderCell(field: NestedKeyOf<T>): TemplateResult<1> | typeof nothing;
     protected renderHeader(): TemplateResult<1>;
     protected renderCellContents(value: unknown, column: ColumnOptions<T>, row: T): unknown;
-    protected renderCell(column: ColumnOptions<T>, row: T): TemplateResult<1> | typeof nothing;
+    protected renderCell(field: NestedKeyOf<T>, row: T): TemplateResult<1> | typeof nothing;
     protected renderRow(row: T, index: number): TemplateResult<1>;
     protected renderBody(): TemplateResult<1>;
     protected renderFooter(): TemplateResult<1> | typeof nothing;
@@ -592,12 +614,16 @@ declare class YatlTable<T extends object> extends LitElement {
     private filterRows;
     private compareRows;
     private sortRows;
-    private createColumnStates;
     private createMetadata;
     private updateInternalQuery;
     private get columnData();
-    private get columnWidths();
+    /**
+     * Gets the width of each column in the
+     * order they will appear in the grid.
+     */
+    private getGridWidths;
     private scheduleSave;
+    private getColumnState;
     private saveStateToStorage;
     private loadStateFromStorage;
     private handleHeaderClicked;
@@ -627,6 +653,12 @@ interface EventMap<T> {
     'yatl-column-resize': YatlColumnResizeEvent<T>;
     'yatl-column-reorder': YatlColumnReorderEvent<T>;
     'yatl-search': YatlSearchEvent;
+    'yatl-state-change': YatlStateChangeEvent<T>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'yatl-table': YatlTable<object>;
+    }
 }
 
-export { type CellPartsCallback, type CellRenderCallback, type ColumnFilterCallback, type ColumnInitOptions, type ColumnOptions, type ColumnState, type ComparatorCallback, type Compareable, type FilterCallback, type Filters, type NestedKeyOf, type QueryToken, type RestorableColumnState, type RestorableTableState, type RowPartsCallback, type SortOrder, type SortState, type SortValueCallback, type StorageOptions, type TableState, type TokenizerCallback, type ValueFormatterCallback, YatlChangeEvent, YatlColumnReorderEvent, YatlColumnResizeEvent, YatlColumnToggleEvent, YatlEvent, YatlRowClickEvent, YatlSearchEvent, YatlSortEvent, YatlTable, createRegexTokenizer, findColumn, whitespaceTokenizer };
+export { type CellPartsCallback, type CellRenderCallback, type ColumnFilterCallback, type ColumnInitOptions, type ColumnOptions, type ColumnState, type ComparatorCallback, type Compareable, type FilterCallback, type Filters, type NestedKeyOf, type QueryToken, type RestorableColumnState, type RestorableTableState, type RowPartsCallback, type SortOrder, type SortState, type SortValueCallback, type StorageOptions, type TableState, type TokenizerCallback, type ValueFormatterCallback, YatlChangeEvent, YatlColumnReorderEvent, YatlColumnResizeEvent, YatlColumnToggleEvent, YatlEvent, YatlRowClickEvent, YatlSearchEvent, YatlSortEvent, YatlStateChangeEvent, YatlTable, createRegexTokenizer, findColumn, whitespaceTokenizer };

package/dist/index.d.ts

@@ -199,11 +199,11 @@ interface ColumnState<T> {
     /**
      * The current sort order of the column.
      */
-    sortState?: SortState | null;
+    sort: SortState | null;
     /**
      * The currently set width of the column in pixels.
      */
-    width?: number | null;
+    width: number | null;
 }
 /**
  * Represents the current state of the table
@@ -306,6 +306,14 @@ declare class YatlSearchEvent extends YatlEvent<{
     static readonly EVENT_NAME = "yatl-search";
     constructor(query: string);
 }
+declare class YatlStateChangeEvent<T> extends YatlEvent<{
+    state: TableState<T>;
+    triggers: string[];
+}> {
+    triggers: string[];
+    static readonly EVENT_NAME = "yatl-state-change";
+    constructor(state: TableState<T>, triggers: string[]);
+}
 
 /**
  * Represents a dynamic and interactive table with features like sorting, searching, filtering,
@@ -319,6 +327,7 @@ declare class YatlTable<T extends object> extends LitElement {
     private _enableSearchScoring;
     private _columns;
     private _columnStates;
+    private _columnOrder;
     private _storageOptions;
     private _data;
     private _searchQuery;
@@ -399,12 +408,32 @@ declare class YatlTable<T extends object> extends LitElement {
      */
     get columns(): ColumnOptions<T>[];
     set columns(columns: ColumnOptions<T>[]);
-    /**
-     * The current dynamic state of the columns (width, visibility, sort order).
-     * This property is updated automatically when users interact with the table.
-     */
-    get columnStates(): ColumnState<T>[];
-    set columnStates(states: ColumnState<T>[]);
+    get columnOrder(): NestedKeyOf<T>[];
+    set columnOrder(columns: NestedKeyOf<T>[]);
+    get columnVisibility(): {
+        field: NestedKeyOf<T>;
+        visible: boolean;
+    }[];
+    set columnVisibility(columns: {
+        field: NestedKeyOf<T>;
+        visible: boolean;
+    }[]);
+    get columnSort(): {
+        field: NestedKeyOf<T>;
+        sort: SortState | null;
+    }[];
+    set columnSort(columns: {
+        field: NestedKeyOf<T>;
+        sort: SortState | null;
+    }[]);
+    get columnWidths(): {
+        field: NestedKeyOf<T>;
+        width: number | null;
+    }[];
+    set columnWidths(columns: {
+        field: NestedKeyOf<T>;
+        width: number | null;
+    }[]);
     /**
      * The current text string used to filter the table data.
      * Setting this property triggers a new search and render cycle.
@@ -510,13 +539,6 @@ declare class YatlTable<T extends object> extends LitElement {
     scrollToOriginalIndex(index: number): Promise<void>;
     scrollToFilteredIndex(index: number): Promise<void>;
     scrollToPx(px: number): Promise<void>;
-    /**
-     * Sets the display order of the columns in the table.
-     *
-     * @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: NestedKeyOf<T>[]): void;
     /**
      * Finds the first row
      * @param field
@@ -560,10 +582,10 @@ declare class YatlTable<T extends object> extends LitElement {
     deleteRow(index: number): void;
     protected renderColumnSortIcon(column: ColumnOptions<T>, state: ColumnState<T>): TemplateResult<1> | typeof nothing;
     protected renderColumnResizer(column: ColumnOptions<T>, _state: ColumnState<T>): TemplateResult<1> | typeof nothing;
-    protected renderHeaderCell(column: ColumnOptions<T>): TemplateResult<1> | typeof nothing;
+    protected renderHeaderCell(field: NestedKeyOf<T>): TemplateResult<1> | typeof nothing;
     protected renderHeader(): TemplateResult<1>;
     protected renderCellContents(value: unknown, column: ColumnOptions<T>, row: T): unknown;
-    protected renderCell(column: ColumnOptions<T>, row: T): TemplateResult<1> | typeof nothing;
+    protected renderCell(field: NestedKeyOf<T>, row: T): TemplateResult<1> | typeof nothing;
     protected renderRow(row: T, index: number): TemplateResult<1>;
     protected renderBody(): TemplateResult<1>;
     protected renderFooter(): TemplateResult<1> | typeof nothing;
@@ -592,12 +614,16 @@ declare class YatlTable<T extends object> extends LitElement {
     private filterRows;
     private compareRows;
     private sortRows;
-    private createColumnStates;
     private createMetadata;
     private updateInternalQuery;
     private get columnData();
-    private get columnWidths();
+    /**
+     * Gets the width of each column in the
+     * order they will appear in the grid.
+     */
+    private getGridWidths;
     private scheduleSave;
+    private getColumnState;
     private saveStateToStorage;
     private loadStateFromStorage;
     private handleHeaderClicked;
@@ -627,6 +653,12 @@ interface EventMap<T> {
     'yatl-column-resize': YatlColumnResizeEvent<T>;
     'yatl-column-reorder': YatlColumnReorderEvent<T>;
     'yatl-search': YatlSearchEvent;
+    'yatl-state-change': YatlStateChangeEvent<T>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'yatl-table': YatlTable<object>;
+    }
 }
 
-export { type CellPartsCallback, type CellRenderCallback, type ColumnFilterCallback, type ColumnInitOptions, type ColumnOptions, type ColumnState, type ComparatorCallback, type Compareable, type FilterCallback, type Filters, type NestedKeyOf, type QueryToken, type RestorableColumnState, type RestorableTableState, type RowPartsCallback, type SortOrder, type SortState, type SortValueCallback, type StorageOptions, type TableState, type TokenizerCallback, type ValueFormatterCallback, YatlChangeEvent, YatlColumnReorderEvent, YatlColumnResizeEvent, YatlColumnToggleEvent, YatlEvent, YatlRowClickEvent, YatlSearchEvent, YatlSortEvent, YatlTable, createRegexTokenizer, findColumn, whitespaceTokenizer };
+export { type CellPartsCallback, type CellRenderCallback, type ColumnFilterCallback, type ColumnInitOptions, type ColumnOptions, type ColumnState, type ComparatorCallback, type Compareable, type FilterCallback, type Filters, type NestedKeyOf, type QueryToken, type RestorableColumnState, type RestorableTableState, type RowPartsCallback, type SortOrder, type SortState, type SortValueCallback, type StorageOptions, type TableState, type TokenizerCallback, type ValueFormatterCallback, YatlChangeEvent, YatlColumnReorderEvent, YatlColumnResizeEvent, YatlColumnToggleEvent, YatlEvent, YatlRowClickEvent, YatlSearchEvent, YatlSortEvent, YatlStateChangeEvent, YatlTable, createRegexTokenizer, findColumn, whitespaceTokenizer };