@ux-aspects/ux-aspects
Version:
Open source user interface framework for building modern, responsive, mobile big data applications
79 lines • 12.7 kB
JavaScript
import { Directive, Input } from '@angular/core';
import { Subject } from 'rxjs';
import * as i0 from "@angular/core";
export class ColumnSortingDirective {
constructor() {
/** Emit the current sort state for all columns within the table */
this.events = new Subject();
/** Store the current sort state for all columns within the table */
this.order = [];
}
ngOnDestroy() {
this.events.complete();
}
/** Toggle the sorting state of a column */
toggleColumn(sorting) {
// apply sorting based on the single or multiple sort
this.order = this.singleSort ? this.toggleSingleColumn(sorting) : this.toggleMultipleColumn(sorting);
// emit the latest order
this.events.next(this.order);
return this.order;
}
/** Explicitly set the column state */
setColumnState(key, state) {
// check if the sorting has actually changed
if (this.order.find(column => column.key === key && column.state === state)) {
return;
}
// if only one column can be sorted and the current column has a sort direction remove all others
if (this.singleSort && state !== ColumnSortingState.NoSort) {
this.order = [];
}
else {
// remove the item from the state if present
this.order = this.order.filter(column => column.key !== key);
}
// if the column has active sorting then we should add it to the array again
if (state === ColumnSortingState.Ascending || state === ColumnSortingState.Descending) {
this.order = [...this.order, { key, state }];
}
}
/** Toggle the sorting state of a column when using single select */
toggleSingleColumn(sorting) {
return sorting.state === ColumnSortingState.NoSort ? [] : [{ key: sorting.key, state: sorting.state }];
}
/** Toggle the sorting state of a column when using multiple select */
toggleMultipleColumn(sorting) {
// reorder columns here
const idx = this.order.findIndex(column => column.key === sorting.key);
// if wasn't previously selected add to list and it is being sorted
if (idx === -1 && sorting.state !== ColumnSortingState.NoSort) {
return [...this.order, { key: sorting.key, state: sorting.state }];
}
// if we are sorting it change the sorting order
if (sorting.state === ColumnSortingState.Ascending || sorting.state === ColumnSortingState.Descending) {
return [...this.order.filter(_column => _column.key !== sorting.key), { key: sorting.key, state: sorting.state }];
}
// Otherwise remove the item
return this.order.filter(_column => _column.key !== sorting.key);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: ColumnSortingDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.12", type: ColumnSortingDirective, selector: "[uxColumnSorting]", inputs: { singleSort: "singleSort", sortIndicator: "sortIndicator" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: ColumnSortingDirective, decorators: [{
type: Directive,
args: [{
selector: '[uxColumnSorting]'
}]
}], propDecorators: { singleSort: [{
type: Input
}], sortIndicator: [{
type: Input
}] } });
export var ColumnSortingState;
(function (ColumnSortingState) {
ColumnSortingState["Ascending"] = "ascending";
ColumnSortingState["Descending"] = "descending";
ColumnSortingState["NoSort"] = "none";
})(ColumnSortingState || (ColumnSortingState = {}));
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sdW1uLXNvcnRpbmcuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvY29sdW1uLXNvcnRpbmcvY29sdW1uLXNvcnRpbmcuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUEwQixNQUFNLGVBQWUsQ0FBQztBQUN6RSxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sTUFBTSxDQUFDOztBQUsvQixNQUFNLE9BQU8sc0JBQXNCO0lBSG5DO1FBV0ksbUVBQW1FO1FBQ25FLFdBQU0sR0FBRyxJQUFJLE9BQU8sRUFBcUMsQ0FBQztRQUUxRCxvRUFBb0U7UUFDcEUsVUFBSyxHQUFzQyxFQUFFLENBQUM7S0ErRGpEO0lBN0RHLFdBQVc7UUFDUCxJQUFJLENBQUMsTUFBTSxDQUFDLFFBQVEsRUFBRSxDQUFDO0lBQzNCLENBQUM7SUFFRCwyQ0FBMkM7SUFDM0MsWUFBWSxDQUFDLE9BQTJCO1FBRXBDLHFEQUFxRDtRQUNyRCxJQUFJLENBQUMsS0FBSyxHQUFHLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLG9CQUFvQixDQUFDLE9BQU8sQ0FBQyxDQUFDO1FBRXJHLHdCQUF3QjtRQUN4QixJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7UUFFN0IsT0FBTyxJQUFJLENBQUMsS0FBSyxDQUFDO0lBQ3RCLENBQUM7SUFFRCxzQ0FBc0M7SUFDdEMsY0FBYyxDQUFDLEdBQVcsRUFBRSxLQUF5QjtRQUVqRCw0Q0FBNEM7UUFDNUMsSUFBSSxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsRUFBRSxDQUFDLE1BQU0sQ0FBQyxHQUFHLEtBQUssR0FB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QTtJQUN6QixxQ0FBZSxDQUFBO0FBQ25CLENBQUMsRUFKVyxrQkFBa0IsS0FBbEIsa0JBQWtCLFFBSTdCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlLCBJbnB1dCwgT25EZXN0cm95LCBUZW1wbGF0ZVJlZiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgU3ViamVjdCB9IGZyb20gJ3J4anMnO1xuXG5ARGlyZWN0aXZlKHtcbiAgICBzZWxlY3RvcjogJ1t1eENvbHVtblNvcnRpbmddJ1xufSlcbmV4cG9ydCBjbGFzcyBDb2x1bW5Tb3J0aW5nRGlyZWN0aXZlIGltcGxlbWVudHMgT25EZXN0cm95IHtcblxuICAgIC8qKiBJZiBzZXQgdG8gdHJ1ZSB0aGUgY29sdW1uIHdpbGwgc29ydCBieSBvbmx5IHRoaXMgY29sdW1uLCByZW1vdmluZyBzb3J0aW5nIGZyb20gYWxsIG90aGVycy4gKi9cbiAgICBASW5wdXQoKSBzaW5nbGVTb3J0OiBib29sZWFuO1xuXG4gICAgLyoqIFByb3ZpZGUgYSBjdXN0b20gdGVtcGxhdGUgZm9yIHRoZSBzb3J0IGluZGljYXRvciAqL1xuICAgIEBJbnB1dCgpIHNvcnRJbmRpY2F0b3I6IFRlbXBsYXRlUmVmPENvbHVtblNvcnRpbmdJbmRpY2F0b3JDb250ZXh0PjtcblxuICAgIC8qKiBFbWl0IHRoZSBjdXJyZW50IHNvcnQgc3RhdGUgZm9yIGFsbCBjb2x1bW5zIHdpdGhpbiB0aGUgdGFibGUgKi9cbiAgICBldmVudHMgPSBuZXcgU3ViamVjdDxSZWFkb25seUFycmF5PENvbHVtblNvcnRpbmdPcmRlcj4+KCk7XG5cbiAgICAvKiogU3RvcmUgdGhlIGN1cnJlbnQgc29ydCBzdGF0ZSBmb3IgYWxsIGNvbHVtbnMgd2l0aGluIHRoZSB0YWJsZSAqL1xuICAgIG9yZGVyOiBSZWFkb25seUFycmF5PENvbHVtblNvcnRpbmdPcmRlcj4gPSBbXTtcblxuICAgIG5nT25EZXN0cm95KCk6IHZvaWQge1xuICAgICAgICB0aGlzLmV2ZW50cy5jb21wbGV0ZSgpO1xuICAgIH1cblxuICAgIC8qKiBUb2dnbGUgdGhlIHNvcnRpbmcgc3RhdGUgb2YgYSBjb2x1bW4gKi9cbiAgICB0b2dnbGVDb2x1bW4oc29ydGluZzogQ29sdW1uU29ydGluZ09yZGVyKTogUmVhZG9ubHlBcnJheTxDb2x1bW5Tb3J0aW5nT3JkZXI+IHtcblxuICAgICAgICAvLyBhcHBseSBzb3J0aW5nIGJhc2VkIG9uIHRoZSBzaW5nbGUgb3IgbXVsdGlwbGUgc29ydFxuICAgICAgICB0aGlzLm9yZGVyID0gdGhpcy5zaW5nbGVTb3J0ID8gdGhpcy50b2dnbGVTaW5nbGVDb2x1bW4oc29ydGluZykgOiB0aGlzLnRvZ2dsZU11bHRpcGxlQ29sdW1uKHNvcnRpbmcpO1xuXG4gICAgICAgIC8vIGVtaXQgdGhlIGxhdGVzdCBvcmRlclxuICAgICAgICB0aGlzLmV2ZW50cy5uZXh0KHRoaXMub3JkZXIpO1xuXG4gICAgICAgIHJldHVybiB0aGlzLm9yZGVyO1xuICAgIH1cblxuICAgIC8qKiBFeHBsaWNpdGx5IHNldCB0aGUgY29sdW1uIHN0YXRlICovXG4gICAgc2V0Q29sdW1uU3RhdGUoa2V5OiBzdHJpbmcsIHN0YXRlOiBDb2x1bW5Tb3J0aW5nU3RhdGUpOiB2b2lkIHtcblxuICAgICAgICAvLyBjaGVjayBpZiB0aGUgc29ydGluZyBoYXMgYWN0dWFsbHkgY2hhbmdlZFxuICAgICAgICBpZiAodGhpcy5vcmRlci5maW5kKGNvbHVtbiA9PiBjb2x1bW4ua2V5ID09PSBrZXkgJiYgY29sdW1uLnN0YXRlID09PSBzdGF0ZSkpIHtcbiAgICAgICAgICAgIHJldHVybjtcbiAgICAgICAgfVxuXG4gICAgICAgIC8vIGlmIG9ubHkgb25lIGNvbHVtbiBjYW4gYmUgc29ydGVkIGFuZCB0aGUgY3VycmVudCBjb2x1bW4gaGFzIGEgc29ydCBkaXJlY3Rpb24gcmVtb3ZlIGFsbCBvdGhlcnNcbiAgICAgICAgaWYgKHRoaXMuc2luZ2xlU29ydCAmJiBzdGF0ZSAhPT0gQ29sdW1uU29ydGluZ1N0YXRlLk5vU29ydCkge1xuICAgICAgICAgICAgdGhpcy5vcmRlciA9IFtdO1xuICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgLy8gcmVtb3ZlIHRoZSBpdGVtIGZyb20gdGhlIHN0YXRlIGlmIHByZXNlbnRcbiAgICAgICAgICAgIHRoaXMub3JkZXIgPSB0aGlzLm9yZGVyLmZpbHRlcihjb2x1bW4gPT4gY29sdW1uLmtleSAhPT0ga2V5KTtcbiAgICAgICAgfVxuXG4gICAgICAgIC8vIGlmIHRoZSBjb2x1bW4gaGFzIGFjdGl2ZSBzb3J0aW5nIHRoZW4gd2Ugc2hvdWxkIGFkZCBpdCB0byB0aGUgYXJyYXkgYWdhaW5cbiAgICAgICAgaWYgKHN0YXRlID09PSBDb2x1bW5Tb3J0aW5nU3RhdGUuQXNjZW5kaW5nIHx8IHN0YXRlID09PSBDb2x1bW5Tb3J0aW5nU3RhdGUuRGVzY2VuZGluZykge1xuICAgICAgICAgICAgdGhpcy5vcmRlciA9IFsuLi50aGlzLm9yZGVyLCB7IGtleSwgc3RhdGUgfV07XG4gICAgICAgIH1cbiAgICB9XG5cbiAgICAvKiogVG9nZ2xlIHRoZSBzb3J0aW5nIHN0YXRlIG9mIGEgY29sdW1uIHdoZW4gdXNpbmcgc2luZ2xlIHNlbGVjdCAqL1xuICAgIHByaXZhdGUgdG9nZ2xlU2luZ2xlQ29sdW1uKHNvcnRpbmc6IENvbHVtblNvcnRpbmdPcmRlcik6IENvbHVtblNvcnRpbmdPcmRlcltdIHtcbiAgICAgICAgcmV0dXJuIHNvcnRpbmcuc3RhdGUgPT09IENvbHVtblNvcnRpbmdTdGF0ZS5Ob1NvcnQgPyBbXSA6IFt7IGtleTogc29ydGluZy5rZXksIHN0YXRlOiBzb3J0aW5nLnN0YXRlIH1dO1xuICAgIH1cblxuICAgIC8qKiBUb2dnbGUgdGhlIHNvcnRpbmcgc3RhdGUgb2YgYSBjb2x1bW4gd2hlbiB1c2luZyBtdWx0aXBsZSBzZWxlY3QgKi9cbiAgICBwcml2YXRlIHRvZ2dsZU11bHRpcGxlQ29sdW1uKHNvcnRpbmc6IENvbHVtblNvcnRpbmdPcmRlcik6IENvbHVtblNvcnRpbmdPcmRlcltdIHtcbiAgICAgICAgLy8gcmVvcmRlciBjb2x1bW5zIGhlcmVcbiAgICAgICAgY29uc3QgaWR4ID0gdGhpcy5vcmRlci5maW5kSW5kZXgoY29sdW1uID0+IGNvbHVtbi5rZXkgPT09IHNvcnRpbmcua2V5KTtcblxuICAgICAgICAvLyBpZiB3YXNuJ3QgcHJldmlvdXNseSBzZWxlY3RlZCBhZGQgdG8gbGlzdCBhbmQgaXQgaXMgYmVpbmcgc29ydGVkXG4gICAgICAgIGlmIChpZHggPT09IC0xICYmIHNvcnRpbmcuc3RhdGUgIT09IENvbHVtblNvcnRpbmdTdGF0ZS5Ob1NvcnQpIHtcbiAgICAgICAgICAgIHJldHVybiBbLi4udGhpcy5vcmRlciwgeyBrZXk6IHNvcnRpbmcua2V5LCBzdGF0ZTogc29ydGluZy5zdGF0ZSB9XTtcbiAgICAgICAgfVxuXG4gICAgICAgIC8vIGlmIHdlIGFyZSBzb3J0aW5nIGl0IGNoYW5nZSB0aGUgc29ydGluZyBvcmRlclxuICAgICAgICBpZiAoc29ydGluZy5zdGF0ZSA9PT0gQ29sdW1uU29ydGluZ1N0YXRlLkFzY2VuZGluZyB8fCBzb3J0aW5nLnN0YXRlID09PSBDb2x1bW5Tb3J0aW5nU3RhdGUuRGVzY2VuZGluZykge1xuICAgICAgICAgICAgcmV0dXJuIFsuLi50aGlzLm9yZGVyLmZpbHRlcihfY29sdW1uID0+IF9jb2x1bW4ua2V5ICE9PSBzb3J0aW5nLmtleSksIHsga2V5OiBzb3J0aW5nLmtleSwgc3RhdGU6IHNvcnRpbmcuc3RhdGUgfV07XG4gICAgICAgIH1cblxuICAgICAgICAvLyBPdGhlcndpc2UgcmVtb3ZlIHRoZSBpdGVtXG4gICAgICAgIHJldHVybiB0aGlzLm9yZGVyLmZpbHRlcihfY29sdW1uID0+IF9jb2x1bW4ua2V5ICE9PSBzb3J0aW5nLmtleSk7XG4gICAgfVxufVxuXG5leHBvcnQgaW50ZXJmYWNlIENvbHVtblNvcnRpbmdPcmRlciB7XG4gICAga2V5OiBzdHJpbmc7XG4gICAgc3RhdGU6IENvbHVtblNvcnRpbmdTdGF0ZTtcbn1cblxuZXhwb3J0IGVudW0gQ29sdW1uU29ydGluZ1N0YXRlIHtcbiAgICBBc2NlbmRpbmcgPSAnYXNjZW5kaW5nJyxcbiAgICBEZXNjZW5kaW5nID0gJ2Rlc2NlbmRpbmcnLFxuICAgIE5vU29ydCA9ICdub25lJ1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIENvbHVtblNvcnRpbmdJbmRpY2F0b3JDb250ZXh0IHtcbiAgICBzdGF0ZTogQ29sdW1uU29ydGluZ1N0YXRlO1xuICAgIG9yZGVyOiBudW1iZXI7XG59Il19