igniteui-grid-lite 0.0.2 → 0.2.0

package/controllers/navigation.js

@@ -1,29 +1,30 @@
-import IgcGridLiteRow from '../components/row.js';
 import { NAVIGATION_STATE, SENTINEL_NODE } from '../internal/constants.js';
+import { GRID_ROW_TAG } from '../internal/tags.js';
 export class NavigationController {
-    get virtualizer() {
-        return this.host.scrollContainer;
+    get _virtualizer() {
+        return this._state.virtualizer;
     }
     get nextNode() {
-        const node = this.state.get('current');
+        const node = this._navigationState.get('current');
         return node === SENTINEL_NODE
-            ? { column: this.firstColumn, row: 0 }
+            ? { column: this._firstColumn, row: 0 }
             : { ...node };
     }
-    get columns() {
-        return this.host.columns;
+    get _columns() {
+        return this._state.columns;
     }
-    get firstColumn() {
-        return this.host.getColumn(0).key ?? '';
+    get _firstColumn() {
+        return this._state.host.getColumn(0).key ?? '';
     }
     getPreviousColumn(key) {
-        return this.columns[Math.max(this.columns.indexOf(this.host.getColumn(key)) - 1, 0)].key;
+        return this._columns[Math.max(this._columns.indexOf(this._state.host.getColumn(key)) - 1, 0)]
+            .key;
     }
     getNextColumn(key) {
-        return this.columns[Math.min(this.columns.indexOf(this.host.getColumn(key)) + 1, this.columns.length - 1)].key;
+        return this._columns[Math.min(this._columns.indexOf(this._state.host.getColumn(key)) + 1, this._columns.length - 1)].key;
     }
     scrollToCell(node) {
-        const row = Array.from(this.virtualizer.querySelectorAll(IgcGridLiteRow.tagName)).find((row) => row.index === node.row);
+        const row = Array.from(this._virtualizer?.querySelectorAll(GRID_ROW_TAG) ?? []).find((row) => row.index === node.row);
         if (row) {
             row.cells
                 .find((cell) => cell.column.key === node.column)
@@ -34,13 +35,13 @@ export class NavigationController {
         return this._active;
     }
     set active(node) {
-        this._active = node;
-        this.state.set('previous', this._active);
-        this.state.set('current', node);
-        this.host.requestUpdate();
+        this._active = node ?? SENTINEL_NODE;
+        this._navigationState.set('previous', this._active);
+        this._navigationState.set('current', node);
+        this._state.host.requestUpdate();
     }
-    constructor(host) {
-        this.host = host;
+    constructor(_state) {
+        this._state = _state;
         this.handlers = new Map(Object.entries({
             ArrowDown: this.arrowDown,
             ArrowUp: this.arrowUp,
@@ -49,29 +50,29 @@ export class NavigationController {
             Home: this.home,
             End: this.end,
         }));
-        this.state = NAVIGATION_STATE;
+        this._navigationState = NAVIGATION_STATE;
         this._active = SENTINEL_NODE;
-        this.host.addController(this);
+        this._state.host.addController(this);
     }
     home() {
         this.active = Object.assign(this.nextNode, { row: 0 });
-        this.virtualizer.element(this.active.row)?.scrollIntoView({ block: 'nearest' });
+        this._virtualizer?.element(this.active.row)?.scrollIntoView({ block: 'nearest' });
     }
     end() {
-        this.active = Object.assign(this.nextNode, { row: this.host.totalItems - 1 });
-        this.virtualizer.element(this.active.row)?.scrollIntoView({ block: 'nearest' });
+        this.active = Object.assign(this.nextNode, { row: this._state.host.totalItems - 1 });
+        this._virtualizer?.element(this.active.row)?.scrollIntoView({ block: 'nearest' });
     }
     arrowDown() {
         const next = this.nextNode;
         this.active = Object.assign(next, {
-            row: Math.min(next.row + 1, this.host.totalItems - 1),
+            row: Math.min(next.row + 1, this._state.host.totalItems - 1),
         });
-        this.virtualizer.element(next.row)?.scrollIntoView({ block: 'nearest' });
+        this._virtualizer?.element(next.row)?.scrollIntoView({ block: 'nearest' });
     }
     arrowUp() {
         const next = this.nextNode;
         this.active = Object.assign(next, { row: Math.max(0, next.row - 1) });
-        this.virtualizer.element(next.row)?.scrollIntoView({ block: 'nearest' });
+        this._virtualizer?.element(next.row)?.scrollIntoView({ block: 'nearest' });
     }
     arrowLeft() {
         const next = this.nextNode;
@@ -83,10 +84,9 @@ export class NavigationController {
         this.active = Object.assign(next, { column: this.getNextColumn(next.column) });
         this.scrollToCell(this.active);
     }
-    hostConnected() { }
     hostDisconnected() {
         this.active = SENTINEL_NODE;
-        this.state = NAVIGATION_STATE;
+        this._navigationState = NAVIGATION_STATE;
     }
     navigate(event) {
         if (this.handlers.has(event.key)) {

package/controllers/navigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation.js","sourceRoot":"","sources":["../../src/controllers/navigation.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\nimport IgcGridLiteRow from '../components/row.js';\nimport { NAVIGATION_STATE, SENTINEL_NODE } from '../internal/constants.js';\nimport type { ActiveNode, GridHost, Keys } from '../internal/types.js';\n\nexport class NavigationController<T extends object> implements ReactiveController {\n  protected handlers = new Map(\n    Object.entries({\n      ArrowDown: this.arrowDown,\n      ArrowUp: this.arrowUp,\n      ArrowLeft: this.arrowLeft,\n      ArrowRight: this.arrowRight,\n      Home: this.home,\n      End: this.end,\n    })\n  );\n\n  protected get virtualizer() {\n    // @ts-expect-error - Protected member access\n    return this.host.scrollContainer;\n  }\n\n  protected state = NAVIGATION_STATE;\n  protected _active = SENTINEL_NODE;\n\n  protected get nextNode() {\n    const node = this.state.get('current')!;\n    return node === SENTINEL_NODE\n      ? { column: this.firstColumn, row: 0 }\n      : ({ ...node } as ActiveNode<T>);\n  }\n\n  protected get columns() {\n    return this.host.columns;\n  }\n\n  protected get firstColumn() {\n    return this.host.getColumn(0)!.key ?? '';\n  }\n\n  protected getPreviousColumn(key: Keys<T>) {\n    return this.columns[Math.max(this.columns.indexOf(this.host.getColumn(key)!) - 1, 0)].key;\n  }\n\n  protected getNextColumn(key: Keys<T>) {\n    return this.columns[\n      Math.min(this.columns.indexOf(this.host.getColumn(key)!) + 1, this.columns.length - 1)\n    ].key;\n  }\n\n  protected scrollToCell(node: ActiveNode<T>) {\n    const row = Array.from(this.virtualizer.querySelectorAll(IgcGridLiteRow.tagName)).find(\n      (row) => row.index === node.row\n    ) as unknown as IgcGridLiteRow<T>;\n\n    if (row) {\n      row.cells\n        .find((cell) => cell.column.key === node.column)\n        ?.scrollIntoView({ block: 'nearest' });\n    }\n  }\n\n  public get active() {\n    return this._active as ActiveNode<T>;\n  }\n\n  public set active(node: ActiveNode<T>) {\n    this._active = node;\n    this.state.set('previous', this._active);\n    this.state.set('current', node);\n    this.host.requestUpdate();\n  }\n\n  constructor(protected host: GridHost<T>) {\n    this.host.addController(this);\n  }\n\n  protected home() {\n    this.active = Object.assign(this.nextNode, { row: 0 });\n    this.virtualizer.element(this.active.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected end() {\n    this.active = Object.assign(this.nextNode, { row: this.host.totalItems - 1 });\n    this.virtualizer.element(this.active.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected arrowDown() {\n    const next = this.nextNode;\n\n    this.active = Object.assign(next, {\n      row: Math.min(next.row + 1, this.host.totalItems - 1),\n    });\n    this.virtualizer.element(next.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected arrowUp() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { row: Math.max(0, next.row - 1) });\n    this.virtualizer.element(next.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected arrowLeft() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { column: this.getPreviousColumn(next.column) });\n    this.scrollToCell(this.active);\n  }\n\n  protected arrowRight() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { column: this.getNextColumn(next.column) });\n    this.scrollToCell(this.active);\n  }\n\n  public hostConnected() {}\n\n  public hostDisconnected() {\n    this.active = SENTINEL_NODE as ActiveNode<T>;\n    this.state = NAVIGATION_STATE;\n  }\n\n  public navigate(event: KeyboardEvent) {\n    if (this.handlers.has(event.key)) {\n      event.preventDefault();\n      this.handlers.get(event.key)!.call(this);\n    }\n  }\n}\n"]}
+{"version":3,"file":"navigation.js","sourceRoot":"","sources":["../../src/controllers/navigation.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\nimport type IgcGridLiteRow from '../components/row.js';\nimport { NAVIGATION_STATE, SENTINEL_NODE } from '../internal/constants.js';\nimport { GRID_ROW_TAG } from '../internal/tags.js';\nimport type { ActiveNode, Keys } from '../internal/types.js';\nimport type { StateController } from './state.js';\n\nexport class NavigationController<T extends object> implements ReactiveController {\n  protected handlers = new Map(\n    Object.entries({\n      ArrowDown: this.arrowDown,\n      ArrowUp: this.arrowUp,\n      ArrowLeft: this.arrowLeft,\n      ArrowRight: this.arrowRight,\n      Home: this.home,\n      End: this.end,\n    })\n  );\n\n  protected get _virtualizer() {\n    return this._state.virtualizer;\n  }\n\n  protected _navigationState = NAVIGATION_STATE;\n  protected _active = SENTINEL_NODE;\n\n  protected get nextNode() {\n    const node = this._navigationState.get('current')!;\n    return node === SENTINEL_NODE\n      ? { column: this._firstColumn, row: 0 }\n      : ({ ...node } as ActiveNode<T>);\n  }\n\n  protected get _columns() {\n    return this._state.columns;\n  }\n\n  protected get _firstColumn() {\n    return this._state.host.getColumn(0)!.key ?? '';\n  }\n\n  protected getPreviousColumn(key: Keys<T>) {\n    return this._columns[Math.max(this._columns.indexOf(this._state.host.getColumn(key)!) - 1, 0)]\n      .key;\n  }\n\n  protected getNextColumn(key: Keys<T>) {\n    return this._columns[\n      Math.min(\n        this._columns.indexOf(this._state.host.getColumn(key)!) + 1,\n        this._columns.length - 1\n      )\n    ].key;\n  }\n\n  protected scrollToCell(node: ActiveNode<T>) {\n    const row = Array.from(this._virtualizer?.querySelectorAll(GRID_ROW_TAG) ?? []).find(\n      (row) => row.index === node.row\n    ) as unknown as IgcGridLiteRow<T>;\n\n    if (row) {\n      row.cells\n        .find((cell) => cell.column.key === node.column)\n        ?.scrollIntoView({ block: 'nearest' });\n    }\n  }\n\n  public get active(): ActiveNode<T> {\n    return this._active as ActiveNode<T>;\n  }\n\n  public set active(node: ActiveNode<T>) {\n    this._active = node ?? SENTINEL_NODE;\n    this._navigationState.set('previous', this._active);\n    this._navigationState.set('current', node);\n    this._state.host.requestUpdate();\n  }\n\n  constructor(protected _state: StateController<T>) {\n    this._state.host.addController(this);\n  }\n\n  protected home() {\n    this.active = Object.assign(this.nextNode, { row: 0 });\n    this._virtualizer?.element(this.active.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected end() {\n    this.active = Object.assign(this.nextNode, { row: this._state.host.totalItems - 1 });\n    this._virtualizer?.element(this.active.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected arrowDown() {\n    const next = this.nextNode;\n\n    this.active = Object.assign(next, {\n      row: Math.min(next.row + 1, this._state.host.totalItems - 1),\n    });\n    this._virtualizer?.element(next.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected arrowUp() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { row: Math.max(0, next.row - 1) });\n    this._virtualizer?.element(next.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected arrowLeft() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { column: this.getPreviousColumn(next.column) });\n    this.scrollToCell(this.active);\n  }\n\n  protected arrowRight() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { column: this.getNextColumn(next.column) });\n    this.scrollToCell(this.active);\n  }\n\n  public hostDisconnected() {\n    this.active = SENTINEL_NODE as ActiveNode<T>;\n    this._navigationState = NAVIGATION_STATE;\n  }\n\n  public navigate(event: KeyboardEvent) {\n    if (this.handlers.has(event.key)) {\n      event.preventDefault();\n      this.handlers.get(event.key)!.call(this);\n    }\n  }\n}\n"]}

package/controllers/sort.d.ts

@@ -1,15 +1,15 @@
 import type { ReactiveController } from 'lit';
 import type { ColumnConfiguration, GridHost, Keys } from '../internal/types.js';
-import type { SortExpression, SortState } from '../operations/sort/types.js';
+import type { SortingExpression, SortState } from '../operations/sort/types.js';
 export declare class SortController<T extends object> implements ReactiveController {
     #private;
     protected host: GridHost<T>;
     constructor(host: GridHost<T>);
     state: SortState<T>;
     sortFromHeaderClick(column: ColumnConfiguration<T>): Promise<void>;
-    prepareExpression({ key, sort: options }: ColumnConfiguration<T>): SortExpression<T>;
+    prepareExpression(column: ColumnConfiguration<T>): SortingExpression<T>;
     reset(key?: Keys<T>): void;
-    protected _sort(expressions: SortExpression<T> | SortExpression<T>[]): void;
-    sort(expressions: SortExpression<T> | SortExpression<T>[]): void;
+    protected _sort(expressions: SortingExpression<T> | SortingExpression<T>[]): void;
+    sort(expressions: SortingExpression<T> | SortingExpression<T>[]): void;
     hostConnected(): void;
 }

package/controllers/sort.js

@@ -7,30 +7,30 @@ export class SortController {
         this.host.addController(this);
     }
     get #isMultipleSort() {
-        return this.host.sortConfiguration.multiple;
+        return this.host.sortingOptions.mode === 'multiple';
     }
     get #isTriStateSort() {
-        return this.host.sortConfiguration.triState;
+        return true;
     }
-    #resolveSortOptions(options) {
+    #resolveSortOptions(column) {
         const expr = {
             caseSensitive: false,
             comparer: undefined,
         };
-        if (!options || typeof options === 'boolean') {
+        if (!column) {
             return expr;
         }
         return Object.assign(expr, {
-            caseSensitive: options.caseSensitive,
-            comparer: options.comparer,
+            caseSensitive: column.sortingCaseSensitive,
+            comparer: column.sortConfiguration?.comparer,
         });
     }
     #createDefaultExpression(key) {
-        const options = this.host.getColumn(key)?.sort;
+        const column = this.host.getColumn(key);
         return {
             key,
             direction: 'ascending',
-            ...this.#resolveSortOptions(options),
+            ...this.#resolveSortOptions(column),
         };
     }
     #orderBy(dir) {
@@ -67,15 +67,15 @@ export class SortController {
         await this.host.updateComplete;
         this.#emitSortedEvent(expression);
     }
-    prepareExpression({ key, sort: options }) {
-        if (this.state.has(key)) {
-            const expr = this.state.get(key);
+    prepareExpression(column) {
+        if (this.state.has(column.key)) {
+            const expr = this.state.get(column.key);
             return Object.assign(expr, {
                 direction: this.#orderBy(expr.direction),
-                ...this.#resolveSortOptions(options),
+                ...this.#resolveSortOptions(column),
             });
         }
-        return this.#createDefaultExpression(key);
+        return this.#createDefaultExpression(column.key);
     }
     reset(key) {
         key ? this.state.delete(key) : this.state.clear();

package/controllers/sort.js.map

@@ -1 +1 @@
-{"version":3,"file":"sort.js","sourceRoot":"","sources":["../../src/controllers/sort.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAOpD,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAG/C,MAAM,OAAO,cAAc;IACzB,YAAsB,IAAiB;QAAjB,SAAI,GAAJ,IAAI,CAAa;QAIhC,UAAK,GAAiB,IAAI,GAAG,EAAE,CAAC;QAHrC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IAChC,CAAC;IAID,IAAI,eAAe;QACjB,OAAO,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC;IAC9C,CAAC;IAED,IAAI,eAAe;QACjB,OAAO,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC;IAC9C,CAAC;IAED,mBAAmB,CAAC,OAA8C;QAChE,MAAM,IAAI,GAA0D;YAClE,aAAa,EAAE,KAAK;YACpB,QAAQ,EAAE,SAAS;SACpB,CAAC;QAEF,IAAI,CAAC,OAAO,IAAI,OAAO,OAAO,KAAK,SAAS,EAAE,CAAC;YAC7C,OAAO,IAAkC,CAAC;QAC5C,CAAC;QAED,OAAO,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE;YACzB,aAAa,EAAE,OAAO,CAAC,aAAa;YACpC,QAAQ,EAAE,OAAO,CAAC,QAAQ;SAC3B,CAA+B,CAAC;IACnC,CAAC;IAED,wBAAwB,CAAC,GAAY;QACnC,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC;QAE/C,OAAO;YACL,GAAG;YACH,SAAS,EAAE,WAAW;YACtB,GAAG,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC;SAChB,CAAC;IACzB,CAAC;IAED,QAAQ,CAAC,GAAsB;QAC7B,OAAO,IAAI,CAAC,eAAe;YACzB,CAAC,CAAC,GAAG,KAAK,WAAW;gBACnB,CAAC,CAAC,YAAY;gBACd,CAAC,CAAC,GAAG,KAAK,YAAY;oBACpB,CAAC,CAAC,MAAM;oBACR,CAAC,CAAC,WAAW;YACjB,CAAC,CAAC,GAAG,KAAK,WAAW;gBACnB,CAAC,CAAC,YAAY;gBACd,CAAC,CAAC,WAAW,CAAC;IACpB,CAAC;IAED,iBAAiB,CAAC,MAAyB;QACzC,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC;IACtE,CAAC;IAED,gBAAgB,CAAC,MAAyB;QACxC,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC;IACnD,CAAC;IAED,cAAc,CAAC,UAA6B;QAC1C,UAAU,CAAC,SAAS,KAAK,MAAM;YAC7B,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC;YAC5B,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,GAAG,EAAE,EAAE,GAAG,UAAU,EAAE,CAAC,CAAC;IACxD,CAAC;IAEM,KAAK,CAAC,mBAAmB,CAAC,MAA8B;QAC7D,MAAM,UAAU,GAAG,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;QAElD,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC,EAAE,CAAC;YACxC,OAAO;QACT,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;YAC1B,IAAI,CAAC,KAAK,EAAE,CAAC;QACf,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;QAEvB,MAAM,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC;QAC/B,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACpC,CAAC;IAEM,iBAAiB,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,OAAO,EAA0B;QACrE,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;YACxB,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAE,CAAC;YAElC,OAAO,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE;gBACzB,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC;gBACxC,GAAG,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC;aACrC,CAAC,CAAC;QACL,CAAC;QAGD,OAAO,IAAI,CAAC,wBAAwB,CAAC,GAAG,CAAC,CAAC;IAC5C,CAAC;IAEM,KAAK,CAAC,GAAa;QACxB,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACpD,CAAC;IAES,KAAK,CAAC,WAAoD;QAClE,KAAK,MAAM,IAAI,IAAI,OAAO,CAAC,WAAW,CAAC,EAAE,CAAC;YACxC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;QAC5B,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACpC,CAAC;IAEM,IAAI,CAAC,WAAoD;QAC9D,IAAI,CAAC,KAAK,CACR,OAAO,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAChC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,CACzF,CACF,CAAC;IACJ,CAAC;IAEM,aAAa,KAAI,CAAC;CAC1B","sourcesContent":["import type { ReactiveController } from 'lit';\nimport { PIPELINE } from '../internal/constants.js';\nimport type {\n  ColumnConfiguration,\n  ColumnSortConfiguration,\n  GridHost,\n  Keys,\n} from '../internal/types.js';\nimport { asArray } from '../internal/utils.js';\nimport type { SortExpression, SortingDirection, SortState } from '../operations/sort/types.js';\n\nexport class SortController<T extends object> implements ReactiveController {\n  constructor(protected host: GridHost<T>) {\n    this.host.addController(this);\n  }\n\n  public state: SortState<T> = new Map();\n\n  get #isMultipleSort() {\n    return this.host.sortConfiguration.multiple;\n  }\n\n  get #isTriStateSort() {\n    return this.host.sortConfiguration.triState;\n  }\n\n  #resolveSortOptions(options?: boolean | ColumnSortConfiguration<T>) {\n    const expr: Pick<SortExpression<T>, 'caseSensitive' | 'comparer'> = {\n      caseSensitive: false,\n      comparer: undefined,\n    };\n\n    if (!options || typeof options === 'boolean') {\n      return expr as Partial<SortExpression<T>>;\n    }\n\n    return Object.assign(expr, {\n      caseSensitive: options.caseSensitive,\n      comparer: options.comparer,\n    }) as Partial<SortExpression<T>>;\n  }\n\n  #createDefaultExpression(key: Keys<T>) {\n    const options = this.host.getColumn(key)?.sort;\n\n    return {\n      key,\n      direction: 'ascending',\n      ...this.#resolveSortOptions(options),\n    } as SortExpression<T>;\n  }\n\n  #orderBy(dir?: SortingDirection): SortingDirection {\n    return this.#isTriStateSort\n      ? dir === 'ascending'\n        ? 'descending'\n        : dir === 'descending'\n          ? 'none'\n          : 'ascending'\n      : dir === 'ascending'\n        ? 'descending'\n        : 'ascending';\n  }\n\n  #emitSortingEvent(detail: SortExpression<T>) {\n    return this.host.emitEvent('sorting', { detail, cancelable: true });\n  }\n\n  #emitSortedEvent(detail: SortExpression<T>) {\n    return this.host.emitEvent('sorted', { detail });\n  }\n\n  #setExpression(expression: SortExpression<T>) {\n    expression.direction === 'none'\n      ? this.reset(expression.key)\n      : this.state.set(expression.key, { ...expression });\n  }\n\n  public async sortFromHeaderClick(column: ColumnConfiguration<T>) {\n    const expression = this.prepareExpression(column);\n\n    if (!this.#emitSortingEvent(expression)) {\n      return;\n    }\n\n    if (!this.#isMultipleSort) {\n      this.reset();\n    }\n\n    this._sort(expression);\n\n    await this.host.updateComplete;\n    this.#emitSortedEvent(expression);\n  }\n\n  public prepareExpression({ key, sort: options }: ColumnConfiguration<T>): SortExpression<T> {\n    if (this.state.has(key)) {\n      const expr = this.state.get(key)!;\n\n      return Object.assign(expr, {\n        direction: this.#orderBy(expr.direction),\n        ...this.#resolveSortOptions(options),\n      });\n    }\n\n    // Initial state\n    return this.#createDefaultExpression(key);\n  }\n\n  public reset(key?: Keys<T>) {\n    key ? this.state.delete(key) : this.state.clear();\n  }\n\n  protected _sort(expressions: SortExpression<T> | SortExpression<T>[]) {\n    for (const expr of asArray(expressions)) {\n      this.#setExpression(expr);\n    }\n\n    this.host.requestUpdate(PIPELINE);\n  }\n\n  public sort(expressions: SortExpression<T> | SortExpression<T>[]) {\n    this._sort(\n      asArray(expressions).map((expr) =>\n        Object.assign(this.state.get(expr.key) ?? this.#createDefaultExpression(expr.key), expr)\n      )\n    );\n  }\n\n  public hostConnected() {}\n}\n"]}
+{"version":3,"file":"sort.js","sourceRoot":"","sources":["../../src/controllers/sort.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\nimport { PIPELINE } from '../internal/constants.js';\nimport type { ColumnConfiguration, GridHost, Keys } from '../internal/types.js';\nimport { asArray } from '../internal/utils.js';\nimport type { SortingDirection, SortingExpression, SortState } from '../operations/sort/types.js';\n\nexport class SortController<T extends object> implements ReactiveController {\n  constructor(protected host: GridHost<T>) {\n    this.host.addController(this);\n  }\n\n  public state: SortState<T> = new Map();\n\n  get #isMultipleSort() {\n    return this.host.sortingOptions.mode === 'multiple';\n  }\n\n  get #isTriStateSort() {\n    return true;\n  }\n\n  #resolveSortOptions(column?: ColumnConfiguration<T>) {\n    const expr: Pick<SortingExpression<T>, 'caseSensitive' | 'comparer'> = {\n      caseSensitive: false,\n      comparer: undefined,\n    };\n\n    if (!column) {\n      return expr as Partial<SortingExpression<T>>;\n    }\n\n    return Object.assign(expr, {\n      caseSensitive: column.sortingCaseSensitive,\n      comparer: column.sortConfiguration?.comparer,\n    }) as Partial<SortingExpression<T>>;\n  }\n\n  #createDefaultExpression(key: Keys<T>) {\n    const column = this.host.getColumn(key);\n\n    return {\n      key,\n      direction: 'ascending',\n      ...this.#resolveSortOptions(column),\n    } as SortingExpression<T>;\n  }\n\n  #orderBy(dir?: SortingDirection): SortingDirection {\n    return this.#isTriStateSort\n      ? dir === 'ascending'\n        ? 'descending'\n        : dir === 'descending'\n          ? 'none'\n          : 'ascending'\n      : dir === 'ascending'\n        ? 'descending'\n        : 'ascending';\n  }\n\n  #emitSortingEvent(detail: SortingExpression<T>) {\n    return this.host.emitEvent('sorting', { detail, cancelable: true });\n  }\n\n  #emitSortedEvent(detail: SortingExpression<T>) {\n    return this.host.emitEvent('sorted', { detail });\n  }\n\n  #setExpression(expression: SortingExpression<T>) {\n    expression.direction === 'none'\n      ? this.reset(expression.key)\n      : this.state.set(expression.key, { ...expression });\n  }\n\n  public async sortFromHeaderClick(column: ColumnConfiguration<T>) {\n    const expression = this.prepareExpression(column);\n\n    if (!this.#emitSortingEvent(expression)) {\n      return;\n    }\n\n    if (!this.#isMultipleSort) {\n      this.reset();\n    }\n\n    this._sort(expression);\n\n    await this.host.updateComplete;\n    this.#emitSortedEvent(expression);\n  }\n\n  public prepareExpression(column: ColumnConfiguration<T>): SortingExpression<T> {\n    if (this.state.has(column.key)) {\n      const expr = this.state.get(column.key)!;\n\n      return Object.assign(expr, {\n        direction: this.#orderBy(expr.direction),\n        ...this.#resolveSortOptions(column),\n      });\n    }\n\n    // Initial state\n    return this.#createDefaultExpression(column.key);\n  }\n\n  public reset(key?: Keys<T>) {\n    key ? this.state.delete(key) : this.state.clear();\n  }\n\n  protected _sort(expressions: SortingExpression<T> | SortingExpression<T>[]) {\n    for (const expr of asArray(expressions)) {\n      this.#setExpression(expr);\n    }\n\n    this.host.requestUpdate(PIPELINE);\n  }\n\n  public sort(expressions: SortingExpression<T> | SortingExpression<T>[]) {\n    this._sort(\n      asArray(expressions).map((expr) =>\n        Object.assign(this.state.get(expr.key) ?? this.#createDefaultExpression(expr.key), expr)\n      )\n    );\n  }\n\n  public hostConnected() {}\n}\n"]}

package/controllers/state.d.ts

@@ -1,24 +1,41 @@
 import type { ReactiveController } from 'lit';
-import type { ActiveNode, GridHost } from '../internal/types.js';
+import type IgcFilterRow from '../components/filter-row.js';
+import type IgcGridLiteHeaderRow from '../components/header-row.js';
+import type IgcGridLiteRow from '../components/row.js';
+import type IgcVirtualizer from '../components/virtualizer.js';
+import type { ActiveNode, ColumnConfiguration, GridHost } from '../internal/types.js';
 import { FilterController } from './filter.js';
 import { NavigationController } from './navigation.js';
 import { ResizeController } from './resize.js';
 import { SortController } from './sort.js';
-export declare class StateController<T extends object> implements ReactiveController {
-    host: GridHost<T>;
-    sorting: SortController<T>;
-    filtering: FilterController<T>;
-    navigation: NavigationController<T>;
-    resizing: ResizeController<T>;
+declare class StateController<T extends object> implements ReactiveController {
+    private _columns;
+    private readonly _observersCallback;
+    /** The grid host element. */
+    readonly host: GridHost<T>;
+    readonly sorting: SortController<T>;
+    readonly filtering: FilterController<T>;
+    readonly navigation: NavigationController<T>;
+    readonly resizing: ResizeController<T>;
+    get columns(): ColumnConfiguration<T>[];
+    /** Returns the header row element of the grid. */
+    get headerRow(): IgcGridLiteHeaderRow<T> | null;
+    /** Returns the filter row element of the grid. */
+    get filterRow(): IgcFilterRow<T> | null;
+    /** Returns the data row elements of the grid. */
+    get rows(): IgcGridLiteRow<T>[];
+    /** Returns the virtualizer element of the grid. */
+    get virtualizer(): IgcVirtualizer | null;
+    /** The currently active node in the grid. */
     get active(): ActiveNode<T>;
+    /** Sets the currently active node in the grid. */
     set active(node: ActiveNode<T>);
-    get headerRow(): import("../components/header-row.js").default<T>;
-    get scrollContainer(): import("../components/virtualizer.js").default;
-    constructor(host: GridHost<T>);
-    protected init(): void;
-    hostConnected(): void;
+    constructor(host: GridHost<T>, observersCallback: () => void);
     hostUpdate(): void;
+    setColumnConfiguration(columns: ColumnConfiguration<T>[]): void;
+    setAutoColumnConfiguration(): void;
+    updateColumnsConfiguration(config: ColumnConfiguration<T>[]): void;
 }
-export declare const gridStateContext: {
-    __context__: StateController<any>;
-};
+declare function createStateController<T extends object>(host: GridHost<T>, observersCallback: () => void): StateController<T>;
+export { createStateController };
+export type { StateController };

package/controllers/state.js

@@ -1,37 +1,74 @@
-import { createContext } from '@lit/context';
+import { PIPELINE } from '../internal/constants.js';
+import { GRID_BODY, GRID_FILTER_ROW_TAG, GRID_HEADER_ROW_TAG, GRID_ROW_TAG, } from '../internal/tags.js';
+import { createColumnConfiguration, setColumnsFromData } from '../internal/utils.js';
 import { FilterController } from './filter.js';
 import { NavigationController } from './navigation.js';
 import { ResizeController } from './resize.js';
 import { SortController } from './sort.js';
-export class StateController {
+class StateController {
+    get columns() {
+        return this._columns;
+    }
+    get headerRow() {
+        return this.host.renderRoot.querySelector(GRID_HEADER_ROW_TAG);
+    }
+    get filterRow() {
+        return this.host.renderRoot.querySelector(GRID_FILTER_ROW_TAG);
+    }
+    get rows() {
+        return Array.from(this.host.renderRoot.querySelectorAll(GRID_ROW_TAG));
+    }
+    get virtualizer() {
+        return this.host.renderRoot.querySelector(GRID_BODY);
+    }
     get active() {
         return this.navigation.active;
     }
     set active(node) {
         this.navigation.active = node;
     }
-    get headerRow() {
-        return this.host.headerRow;
-    }
-    get scrollContainer() {
-        return this.host.scrollContainer;
-    }
-    constructor(host) {
+    constructor(host, observersCallback) {
+        this._columns = [];
+        this._observersCallback = observersCallback;
         this.host = host;
         this.host.addController(this);
-        this.init();
-    }
-    init() {
         this.sorting = new SortController(this.host);
-        this.filtering = new FilterController(this.host);
-        this.navigation = new NavigationController(this.host);
+        this.filtering = new FilterController(this);
+        this.navigation = new NavigationController(this);
         this.resizing = new ResizeController(this.host);
     }
-    hostConnected() { }
     hostUpdate() {
         this.headerRow?.requestUpdate();
-        this.scrollContainer?.requestUpdate();
+        this.virtualizer?.requestUpdate();
+    }
+    setColumnConfiguration(columns) {
+        this._columns = columns.map((column) => createColumnConfiguration(column));
+        this._observersCallback.call(this.host);
+        this.host.requestUpdate(PIPELINE);
     }
+    setAutoColumnConfiguration() {
+        if (this.host.autoGenerate && this.host.data.length > 0) {
+            this._columns = setColumnsFromData(this.host.data[0]);
+            this.host.requestUpdate(PIPELINE);
+        }
+    }
+    updateColumnsConfiguration(config) {
+        for (const columnConfig of config) {
+            const existing = this._columns.findIndex((column) => column.key === columnConfig.key);
+            if (existing !== -1) {
+                this._columns[existing] = {
+                    ...this._columns[existing],
+                    ...createColumnConfiguration(columnConfig),
+                };
+            }
+        }
+        this._columns = [...this._columns];
+        this._observersCallback.call(this.host);
+        this.host.requestUpdate(PIPELINE);
+    }
+}
+function createStateController(host, observersCallback) {
+    return new StateController(host, observersCallback);
 }
-export const gridStateContext = createContext('gridStateController');
+export { createStateController };
 //# sourceMappingURL=state.js.map

package/controllers/state.js.map

@@ -1 +1 @@
-{"version":3,"file":"state.js","sourceRoot":"","sources":["../../src/controllers/state.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAG7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAE3C,MAAM,OAAO,eAAe;IAM1B,IAAW,MAAM;QACf,OAAO,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC;IAChC,CAAC;IAED,IAAW,MAAM,CAAC,IAAmB;QACnC,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,IAAI,CAAC;IAChC,CAAC;IAED,IAAW,SAAS;QAElB,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC;IAC7B,CAAC;IAED,IAAW,eAAe;QAExB,OAAO,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC;IACnC,CAAC;IAED,YAAmB,IAAiB;QAAjB,SAAI,GAAJ,IAAI,CAAa;QAClC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QAC9B,IAAI,CAAC,IAAI,EAAE,CAAC;IACd,CAAC;IAES,IAAI;QACZ,IAAI,CAAC,OAAO,GAAG,IAAI,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC7C,IAAI,CAAC,SAAS,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACjD,IAAI,CAAC,UAAU,GAAG,IAAI,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACtD,IAAI,CAAC,QAAQ,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAClD,CAAC;IAEM,aAAa,KAAI,CAAC;IAElB,UAAU;QACf,IAAI,CAAC,SAAS,EAAE,aAAa,EAAE,CAAC;QAChC,IAAI,CAAC,eAAe,EAAE,aAAa,EAAE,CAAC;IACxC,CAAC;CACF;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,aAAa,CAAuB,qBAAqB,CAAC,CAAC","sourcesContent":["import { createContext } from '@lit/context';\nimport type { ReactiveController } from 'lit';\nimport type { ActiveNode, GridHost } from '../internal/types.js';\nimport { FilterController } from './filter.js';\nimport { NavigationController } from './navigation.js';\nimport { ResizeController } from './resize.js';\nimport { SortController } from './sort.js';\n\nexport class StateController<T extends object> implements ReactiveController {\n  public sorting!: SortController<T>;\n  public filtering!: FilterController<T>;\n  public navigation!: NavigationController<T>;\n  public resizing!: ResizeController<T>;\n\n  public get active() {\n    return this.navigation.active;\n  }\n\n  public set active(node: ActiveNode<T>) {\n    this.navigation.active = node;\n  }\n\n  public get headerRow() {\n    // @ts-expect-error - Protected member access\n    return this.host.headerRow;\n  }\n\n  public get scrollContainer() {\n    // @ts-expect-error - Protected member access\n    return this.host.scrollContainer;\n  }\n\n  constructor(public host: GridHost<T>) {\n    this.host.addController(this);\n    this.init();\n  }\n\n  protected init() {\n    this.sorting = new SortController(this.host);\n    this.filtering = new FilterController(this.host);\n    this.navigation = new NavigationController(this.host);\n    this.resizing = new ResizeController(this.host);\n  }\n\n  public hostConnected() {}\n\n  public hostUpdate(): void {\n    this.headerRow?.requestUpdate();\n    this.scrollContainer?.requestUpdate();\n  }\n}\n\nexport const gridStateContext = createContext<StateController<any>>('gridStateController');\n"]}
+{"version":3,"file":"state.js","sourceRoot":"","sources":["../../src/controllers/state.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\nimport type IgcFilterRow from '../components/filter-row.js';\nimport type IgcGridLiteHeaderRow from '../components/header-row.js';\nimport type IgcGridLiteRow from '../components/row.js';\nimport type IgcVirtualizer from '../components/virtualizer.js';\nimport { PIPELINE } from '../internal/constants.js';\nimport {\n  GRID_BODY,\n  GRID_FILTER_ROW_TAG,\n  GRID_HEADER_ROW_TAG,\n  GRID_ROW_TAG,\n} from '../internal/tags.js';\nimport type { ActiveNode, ColumnConfiguration, GridHost } from '../internal/types.js';\nimport { createColumnConfiguration, setColumnsFromData } from '../internal/utils.js';\nimport { FilterController } from './filter.js';\nimport { NavigationController } from './navigation.js';\nimport { ResizeController } from './resize.js';\nimport { SortController } from './sort.js';\n\nclass StateController<T extends object> implements ReactiveController {\n  private _columns: ColumnConfiguration<T>[] = [];\n  private readonly _observersCallback: () => void;\n\n  /** The grid host element. */\n  public readonly host: GridHost<T>;\n\n  public readonly sorting: SortController<T>;\n  public readonly filtering: FilterController<T>;\n  public readonly navigation: NavigationController<T>;\n  public readonly resizing: ResizeController<T>;\n\n  public get columns(): ColumnConfiguration<T>[] {\n    return this._columns;\n  }\n\n  /** Returns the header row element of the grid. */\n  public get headerRow(): IgcGridLiteHeaderRow<T> | null {\n    return this.host.renderRoot.querySelector<IgcGridLiteHeaderRow<T>>(GRID_HEADER_ROW_TAG);\n  }\n\n  /** Returns the filter row element of the grid. */\n  public get filterRow(): IgcFilterRow<T> | null {\n    return this.host.renderRoot.querySelector<IgcFilterRow<T>>(GRID_FILTER_ROW_TAG);\n  }\n\n  /** Returns the data row elements of the grid. */\n  public get rows(): IgcGridLiteRow<T>[] {\n    return Array.from(this.host.renderRoot.querySelectorAll<IgcGridLiteRow<T>>(GRID_ROW_TAG));\n  }\n\n  /** Returns the virtualizer element of the grid. */\n  public get virtualizer(): IgcVirtualizer | null {\n    return this.host.renderRoot.querySelector(GRID_BODY);\n  }\n\n  /** The currently active node in the grid. */\n  public get active(): ActiveNode<T> {\n    return this.navigation.active;\n  }\n\n  /** Sets the currently active node in the grid. */\n  public set active(node: ActiveNode<T>) {\n    this.navigation.active = node;\n  }\n\n  constructor(host: GridHost<T>, observersCallback: () => void) {\n    this._observersCallback = observersCallback;\n    this.host = host;\n    this.host.addController(this);\n\n    this.sorting = new SortController(this.host);\n    this.filtering = new FilterController(this);\n    this.navigation = new NavigationController(this);\n    this.resizing = new ResizeController(this.host);\n  }\n\n  public hostUpdate(): void {\n    this.headerRow?.requestUpdate();\n    this.virtualizer?.requestUpdate();\n  }\n\n  public setColumnConfiguration(columns: ColumnConfiguration<T>[]): void {\n    this._columns = columns.map((column) => createColumnConfiguration(column));\n    this._observersCallback.call(this.host);\n    this.host.requestUpdate(PIPELINE);\n  }\n\n  public setAutoColumnConfiguration(): void {\n    if (this.host.autoGenerate && this.host.data.length > 0) {\n      this._columns = setColumnsFromData(this.host.data[0]);\n      this.host.requestUpdate(PIPELINE);\n    }\n  }\n\n  public updateColumnsConfiguration(config: ColumnConfiguration<T>[]): void {\n    for (const columnConfig of config) {\n      const existing = this._columns.findIndex((column) => column.key === columnConfig.key);\n      if (existing !== -1) {\n        this._columns[existing] = {\n          ...this._columns[existing],\n          ...createColumnConfiguration(columnConfig),\n        };\n      }\n    }\n\n    this._columns = [...this._columns];\n    this._observersCallback.call(this.host);\n    this.host.requestUpdate(PIPELINE);\n  }\n}\n\nfunction createStateController<T extends object>(\n  host: GridHost<T>,\n  observersCallback: () => void\n): StateController<T> {\n  return new StateController<T>(host, observersCallback);\n}\n\nexport { createStateController };\nexport type { StateController };\n"]}