@rt-tools/ui-kit-v2 0.38.0 → 0.39.1

package/fesm2022/rt-tools-ui-kit-v2-data-table.mjs

@@ -3,15 +3,16 @@ import { RtIconComponent, iconMaterialMap } from "@rt-tools/ui-kit-v2/icon";
 import * as i0 from "@angular/core";
 import { ChangeDetectionStrategy, Component, DestroyRef, Directive, ElementRef, Injectable, InjectionToken, Injector, TemplateRef, ViewEncapsulation, booleanAttribute, computed, contentChild, effect, forwardRef, inject, input, linkedSignal, output, signal, untracked, viewChild } from "@angular/core";
 import { takeUntilDestroyed, toObservable } from "@angular/core/rxjs-interop";
-import { Subject } from "rxjs";
-import { concatMap, filter, map, switchMap, take, takeUntil } from "rxjs/operators";
+import { Subject, of } from "rxjs";
+import { concatMap, filter, map, switchMap, take, takeUntil, tap } from "rxjs/operators";
 import { BlockDirective, ConcatClassesPipe, ElemDirective, EmptyToDashPipe, IDBStorageService, ModDirective, PlatformService } from "@rt-tools/core";
+import { BreakpointsService, ERtDataTableColumnType, ERtDataTableFilterType, ERtStorageKeys, RT_DATA_TABLE_PRESET_FROM_HOST, RT_KIT_TRANSLATOR, RT_PRESET_MATERIAL_CLASS, rtKitDefault, rtKitLabel } from "@rt-tools/ui-kit-v2/core";
 import { Clipboard } from "@angular/cdk/clipboard";
 import { NgTemplateOutlet, TitleCasePipe } from "@angular/common";
 import { DomSanitizer } from "@angular/platform-browser";
-import { BreakpointsService, ERtDataTableColumnType, ERtDataTableFilterType, RT_DATA_TABLE_PRESET_FROM_HOST, RT_KIT_TRANSLATOR, RT_PRESET_MATERIAL_CLASS, rtKitDefault, rtKitLabel } from "@rt-tools/ui-kit-v2/core";
 import { RtIconButtonComponent } from "@rt-tools/ui-kit-v2/icon-button";
 import { RtTooltipDirective } from "@rt-tools/ui-kit-v2/tooltip";
+import { rtAllOnPage, rtAnyOnPage, rtAriaSortOf, rtFilterOf, rtFiltersWithOperator, rtFiltersWithValue, rtIsSortedBy, rtKeysOf, rtNextSort, rtPresetEntities, rtWithEntity, rtWithPageEntities, rtWithoutPageEntities } from "@rt-tools/ui-kit-v2/table-core";
 import * as i1 from "@angular/forms";
 import { FormsModule } from "@angular/forms";
 import { RtDatePickerComponent } from "@rt-tools/ui-kit-v2/date-picker";
@@ -37,6 +38,9 @@ function dataTableCopyButtonSide(column) {
 function dataTableIconName(glyph) {
 	return iconMaterialMap.find((entry) => entry.from === glyph)?.to ?? null;
 }
+function dataTableConfigKeyOf(storageKey) {
+	return `${ERtStorageKeys.DataTableConfigPrefix}${storageKey}`;
+}
 function comparePropNames(a, b) {
 	return String(a).localeCompare(String(b));
 }
@@ -59,7 +63,7 @@ var RtDataTableConfigService = class RtDataTableConfigService {
 			columns: []
 		}, ...ngDevMode ? [{ debugName: "#tableConfig" }] : /* istanbul ignore next */ []);
 		this.tableConfig = this.#tableConfig.asReadonly();
-		this.#readSource.pipe(switchMap((read) => this.#iDBStorageService.get(read.storageKey).pipe(take(1), takeUntil(this.#updatedSource), map((savedConfig) => this.#configOf(read.config, savedConfig)))), takeUntilDestroyed(this.#destroyRef)).subscribe((config) => {
+		this.#readSource.pipe(switchMap((read) => this.#savedOf(read.storageKey).pipe(takeUntil(this.#updatedSource), map((savedConfig) => this.#configOf(read.config, savedConfig)))), takeUntilDestroyed(this.#destroyRef)).subscribe((config) => {
 			this.#tableConfig.set(config);
 		});
 		this.#writeSource.pipe(concatMap((write) => this.#writeOf(write).pipe(take(1))), takeUntilDestroyed(this.#destroyRef)).subscribe();
@@ -74,19 +78,35 @@ var RtDataTableConfigService = class RtDataTableConfigService {
 		this.#updatedSource.next();
 		this.#writeSource.next({
 			kind: "set",
-			storageKey,
+			storageKey: dataTableConfigKeyOf(storageKey),
 			config
 		});
 		this.#tableConfig.set(config);
 	}
 	deleteConfig(storageKey) {
+		this.#updatedSource.next();
+		this.#writeSource.next({
+			kind: "remove",
+			storageKey: dataTableConfigKeyOf(storageKey)
+		});
 		this.#writeSource.next({
 			kind: "remove",
 			storageKey
 		});
 	}
+	#savedOf(storageKey) {
+		const kitKey = dataTableConfigKeyOf(storageKey);
+		return this.#iDBStorageService.get(kitKey).pipe(take(1), switchMap((saved) => saved ? of(saved) : this.#iDBStorageService.get(storageKey).pipe(take(1), tap((old) => {
+			if (old) this.#writeSource.next({
+				kind: "copy",
+				storageKey: kitKey,
+				stored: old
+			});
+		}))));
+	}
 	#writeOf(write) {
 		if (write.kind === "remove") return this.#iDBStorageService.remove(write.storageKey);
+		if (write.kind === "copy") return this.#iDBStorageService.set(write.storageKey, write.stored);
 		const storedColumns = write.config.columns.map((el) => ({
 			displayName: el.header.label ?? el.propName.toString(),
 			propName: el.propName,
@@ -637,18 +657,14 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-function dataTableNextSortOrder(current) {
-	return current?.sortDirection?.toLowerCase() === EListSortOrder.ASC ? EListSortOrder.DESC : EListSortOrder.ASC;
+function dataTableNextSortOrder(current, propertyName) {
+	return rtNextSort(current, propertyName ?? current?.propertyName ?? "", "repeats")?.sortDirection ?? EListSortOrder.ASC;
 }
 function dataTableSortActive(sort, current) {
-	return !!current?.propertyName && !!sort?.propertyName && current.propertyName === sort.propertyName;
+	return rtIsSortedBy(current, sort?.propertyName);
 }
 function dataTableAriaSort(sort, current) {
-	if (!sort?.propertyName) return null;
-	if (!dataTableSortActive(sort, current)) return "none";
-	const direction = current?.sortDirection?.toLowerCase();
-	if (direction === EListSortOrder.ASC) return "ascending";
-	return direction === EListSortOrder.DESC ? "descending" : "none";
+	return sort?.propertyName ? rtAriaSortOf(current, sort.propertyName) : null;
 }
 const BEM_BLOCK$2 = "rt-data-table-header-cell";
 var RtDataTableHeaderCellComponent = class RtDataTableHeaderCellComponent {
@@ -701,7 +717,7 @@ var RtDataTableHeaderCellComponent = class RtDataTableHeaderCellComponent {
 		const propertyName = this.sortModel()?.propertyName;
 		if (propertyName) this.sortChange.emit({
 			propertyName,
-			sortDirection: dataTableNextSortOrder(this.currentSortModel())
+			sortDirection: dataTableNextSortOrder(this.currentSortModel(), propertyName)
 		});
 	}
 	static {
@@ -923,6 +939,7 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
+const DATA_TABLE_EMPTY_MODE = "falsy";
 const DATA_TABLE_FILTER_OPERATOR_GLYPHS = {
 	[EFilterOperatorType.EQUALS]: "drag_handle",
 	[EFilterOperatorType.NOT_EQUALS]: "block",
@@ -943,33 +960,20 @@ function dataTableDefaultOperator(operator) {
 	return operator && FILTER_OPERATORS.includes(operator) ? operator : EFilterOperatorType.EQUALS;
 }
 function dataTableColumnFilter(filters, propertyName, defaultOperator) {
-	return filters.find((filter) => filter.propertyName === propertyName) ?? {
+	return rtFilterOf(filters, propertyName) ?? {
 		propertyName,
 		operatorType: defaultOperator,
 		value: ""
 	};
 }
+function changedOrNull(before, after) {
+	return after === before ? null : [...after];
+}
 function dataTableFiltersWithValue(filters, current, value) {
-	if (filters.some((filter) => filter.propertyName === current.propertyName)) return value ? filters.map((filter) => filter.propertyName === current.propertyName ? {
-		...filter,
-		value
-	} : filter) : filters.filter((filter) => filter.propertyName !== current.propertyName);
-	return value ? [...filters, {
-		propertyName: current.propertyName,
-		operatorType: current.operatorType,
-		value
-	}] : null;
+	return changedOrNull(filters, rtFiltersWithValue(filters, current.propertyName, current.operatorType, value, DATA_TABLE_EMPTY_MODE));
 }
 function dataTableFiltersWithOperator(filters, current, operatorType) {
-	if (filters.some((filter) => filter.propertyName === current.propertyName)) return filters.map((filter) => filter.propertyName === current.propertyName ? {
-		...filter,
-		operatorType
-	} : filter);
-	return current.value ? [...filters, {
-		operatorType,
-		propertyName: current.propertyName,
-		value: current.value
-	}] : null;
+	return changedOrNull(filters, rtFiltersWithOperator(filters, current.propertyName, operatorType, current.value, DATA_TABLE_EMPTY_MODE));
 }
 function dataTableDayToIso(day) {
 	const [year, month, date] = day.split("-").map(Number);
@@ -1563,28 +1567,25 @@ i0.ɵɵngDeclareClassMetadata({
 	}]
 });
 function dataTableKeysOf(entities, keyExp) {
-	return entities.map((entity) => entity[keyExp]);
+	return rtKeysOf(entities, keyExp);
 }
 function dataTableWithPageEntities(selected, page, keyExp) {
-	const keys = dataTableKeysOf(selected, keyExp);
-	return [...selected, ...page.filter((entity) => !keys.includes(entity[keyExp]))];
+	return rtWithPageEntities(selected, page, keyExp);
 }
 function dataTableWithoutPageEntities(selected, page, keyExp) {
-	const keys = dataTableKeysOf(page, keyExp);
-	return selected.filter((entity) => !keys.includes(entity[keyExp]));
+	return rtWithoutPageEntities(selected, page, keyExp);
 }
 function dataTableWithEntity(selected, entity, checked, keyExp) {
-	const without = selected.filter((el) => el[keyExp] !== entity[keyExp]);
-	return checked ? [...without, entity] : without;
+	return rtWithEntity(selected, entity, checked, keyExp);
 }
 function dataTableAnyOnPage(page, selectedKeys, keyExp) {
-	return page.some((entity) => selectedKeys.includes(entity[keyExp]));
+	return rtAnyOnPage(page, selectedKeys, keyExp);
 }
 function dataTableAllOnPage(page, selectedKeys, keyExp) {
-	return page.every((entity) => selectedKeys.includes(entity[keyExp]));
+	return rtAllOnPage(page, selectedKeys, keyExp);
 }
 function dataTablePresetEntities(entities, keys, keyExp) {
-	return entities.filter((entity) => keys.includes(entity[keyExp]));
+	return rtPresetEntities(entities, keys, keyExp);
 }
 const BEM_BLOCK = "rt-data-table";
 var RtDataTableComponent = class RtDataTableComponent {
@@ -2315,6 +2316,6 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-export { DATA_TABLE_FILTER_MENU_OPERATORS, DATA_TABLE_FILTER_OPERATOR_GLYPHS, RT_DATA_TABLE_ROW_HOST, RT_DATA_TABLE_STOP_ROW_CLICK_ATTRIBUTE, RtDataTableAdditionalRowActionsDirective, RtDataTableCellComponent, RtDataTableComponent, RtDataTableConfigService, RtDataTableCustomCellsDirective, RtDataTableFilterCellComponent, RtDataTableHeaderCellComponent, RtDataTableIconDirective, RtDataTableRowActionsDirective, RtDataTableRowClickDirective, RtDataTableSelectorsDirective, RtDataTableStopRowClickDirective, comparePropNames, dataTableAllOnPage, dataTableAnyOnPage, dataTableAriaSort, dataTableCellText, dataTableCellValue, dataTableColumnFilter, dataTableCopyButtonSide, dataTableDayToIso, dataTableDefaultOperator, dataTableFiltersWithOperator, dataTableFiltersWithValue, dataTableIconName, dataTableIsoToDay, dataTableKeysOf, dataTableNextSortOrder, dataTablePresetEntities, dataTableSortActive, dataTableWithEntity, dataTableWithPageEntities, dataTableWithoutPageEntities };
+export { DATA_TABLE_FILTER_MENU_OPERATORS, DATA_TABLE_FILTER_OPERATOR_GLYPHS, RT_DATA_TABLE_ROW_HOST, RT_DATA_TABLE_STOP_ROW_CLICK_ATTRIBUTE, RtDataTableAdditionalRowActionsDirective, RtDataTableCellComponent, RtDataTableComponent, RtDataTableConfigService, RtDataTableCustomCellsDirective, RtDataTableFilterCellComponent, RtDataTableHeaderCellComponent, RtDataTableIconDirective, RtDataTableRowActionsDirective, RtDataTableRowClickDirective, RtDataTableSelectorsDirective, RtDataTableStopRowClickDirective, comparePropNames, dataTableAllOnPage, dataTableAnyOnPage, dataTableAriaSort, dataTableCellText, dataTableCellValue, dataTableColumnFilter, dataTableConfigKeyOf, dataTableCopyButtonSide, dataTableDayToIso, dataTableDefaultOperator, dataTableFiltersWithOperator, dataTableFiltersWithValue, dataTableIconName, dataTableIsoToDay, dataTableKeysOf, dataTableNextSortOrder, dataTablePresetEntities, dataTableSortActive, dataTableWithEntity, dataTableWithPageEntities, dataTableWithoutPageEntities };
 
 //# sourceMappingURL=rt-tools-ui-kit-v2-data-table.mjs.map