@indigina/ui-kit 1.1.320 → 1.1.321
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/indigina-ui-kit.mjs +69 -77
- package/fesm2022/indigina-ui-kit.mjs.map +1 -1
- package/index.d.ts +15 -19
- package/package.json +1 -1
|
@@ -7018,6 +7018,61 @@ const kitFetchGridData = ({ store, destroyRef, isLoading, fetchAction, fetchFrom
|
|
|
7018
7018
|
store.dispatch(action).pipe(takeUntilDestroyed(destroyRef)).subscribe(() => isLoading.set(false));
|
|
7019
7019
|
};
|
|
7020
7020
|
|
|
7021
|
+
var KitGridViewType;
|
|
7022
|
+
(function (KitGridViewType) {
|
|
7023
|
+
KitGridViewType["SYSTEM"] = "system";
|
|
7024
|
+
KitGridViewType["USER"] = "user";
|
|
7025
|
+
KitGridViewType["CONFIG"] = "config";
|
|
7026
|
+
})(KitGridViewType || (KitGridViewType = {}));
|
|
7027
|
+
|
|
7028
|
+
const filterDuplicateGridViews = (views) => views.filter((item, index, arr) => {
|
|
7029
|
+
const duplicateItems = arr.filter(i => i.title === item.title);
|
|
7030
|
+
return duplicateItems.length <= 1 || item.type !== KitGridViewType.SYSTEM;
|
|
7031
|
+
});
|
|
7032
|
+
const findGridViewByName = (views, name, type) => {
|
|
7033
|
+
const matches = views.filter(view => view.title === name && !view.hidden);
|
|
7034
|
+
if (type) {
|
|
7035
|
+
return matches.find(view => view.type === type) ?? matches[0] ?? null;
|
|
7036
|
+
}
|
|
7037
|
+
return matches.find(view => view.type === KitGridViewType.USER) ?? matches[0] ?? null;
|
|
7038
|
+
};
|
|
7039
|
+
const buildGridViewColumns = (columns) => columns.map(column => ({
|
|
7040
|
+
field: column.field,
|
|
7041
|
+
hidden: column.hidden,
|
|
7042
|
+
}));
|
|
7043
|
+
const hasOverriddenSystemView = (name, views) => views.some(item => item.type === KitGridViewType.SYSTEM && item.title === name);
|
|
7044
|
+
const buildGridColumns = (columns, viewColumns) => viewColumns.map(viewColumn => {
|
|
7045
|
+
const matchingColumn = columns.find(column => column.field === viewColumn.field);
|
|
7046
|
+
return matchingColumn && { ...matchingColumn, hidden: viewColumn.hidden } || null;
|
|
7047
|
+
}).filter(column => !!column);
|
|
7048
|
+
const kitEncodeViewNameToUrl = (name) => name.split(' ').join('-');
|
|
7049
|
+
const decodeViewNameFromUrl = (name) => name.split('-').join(' ');
|
|
7050
|
+
const validateViewName = (views, viewName) => {
|
|
7051
|
+
const specialChars = '!@#$%^&*()_+[]{}|;:,.<>?/~`-=';
|
|
7052
|
+
if ([...specialChars].some(item => viewName.includes(item))) {
|
|
7053
|
+
return {
|
|
7054
|
+
isValid: false,
|
|
7055
|
+
message: 'kit.views.invalidMessage',
|
|
7056
|
+
};
|
|
7057
|
+
}
|
|
7058
|
+
if (viewName.length > 250) {
|
|
7059
|
+
return {
|
|
7060
|
+
isValid: false,
|
|
7061
|
+
message: 'kit.views.lengthMessage',
|
|
7062
|
+
};
|
|
7063
|
+
}
|
|
7064
|
+
if (views.some(view => view.title === viewName)) {
|
|
7065
|
+
return {
|
|
7066
|
+
isValid: true,
|
|
7067
|
+
message: 'kit.views.overrideMessage',
|
|
7068
|
+
};
|
|
7069
|
+
}
|
|
7070
|
+
return {
|
|
7071
|
+
isValid: true,
|
|
7072
|
+
message: '',
|
|
7073
|
+
};
|
|
7074
|
+
};
|
|
7075
|
+
|
|
7021
7076
|
class KitGridUrlStateService {
|
|
7022
7077
|
constructor() {
|
|
7023
7078
|
this.activatedRoute = inject(ActivatedRoute);
|
|
@@ -7035,14 +7090,14 @@ class KitGridUrlStateService {
|
|
|
7035
7090
|
archive: params?.archive === 'true',
|
|
7036
7091
|
};
|
|
7037
7092
|
}
|
|
7038
|
-
setGridStateToUrl(state) {
|
|
7093
|
+
setGridStateToUrl(state, defaultColumns = state.columns) {
|
|
7039
7094
|
const queryParams = {
|
|
7040
7095
|
skip: state.skip,
|
|
7041
7096
|
take: state.take,
|
|
7042
7097
|
search: state.search,
|
|
7043
7098
|
sort: JSON.stringify(state.sort),
|
|
7044
7099
|
filter: JSON.stringify(state.filter),
|
|
7045
|
-
columns: JSON.stringify(
|
|
7100
|
+
columns: JSON.stringify(buildGridViewColumns(defaultColumns)),
|
|
7046
7101
|
archive: state.archive,
|
|
7047
7102
|
};
|
|
7048
7103
|
this.router.navigate([], {
|
|
@@ -7051,12 +7106,7 @@ class KitGridUrlStateService {
|
|
|
7051
7106
|
queryParamsHandling: 'merge',
|
|
7052
7107
|
});
|
|
7053
7108
|
}
|
|
7054
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: KitGridUrlStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
7055
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: KitGridUrlStateService }); }
|
|
7056
7109
|
}
|
|
7057
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: KitGridUrlStateService, decorators: [{
|
|
7058
|
-
type: Injectable
|
|
7059
|
-
}] });
|
|
7060
7110
|
|
|
7061
7111
|
class FetchGridViews extends KitAbstractPayloadAction {
|
|
7062
7112
|
static { this.type = '[GridViews] Fetch'; }
|
|
@@ -7080,13 +7130,6 @@ class SetSelectedView extends KitAbstractPayloadAction {
|
|
|
7080
7130
|
static { this.type = '[GridViews] SetSelectedView'; }
|
|
7081
7131
|
}
|
|
7082
7132
|
|
|
7083
|
-
var KitGridViewType;
|
|
7084
|
-
(function (KitGridViewType) {
|
|
7085
|
-
KitGridViewType["SYSTEM"] = "system";
|
|
7086
|
-
KitGridViewType["USER"] = "user";
|
|
7087
|
-
KitGridViewType["CONFIG"] = "config";
|
|
7088
|
-
})(KitGridViewType || (KitGridViewType = {}));
|
|
7089
|
-
|
|
7090
7133
|
class KitSettingsApiService {
|
|
7091
7134
|
constructor() {
|
|
7092
7135
|
this.httpClient = inject(HttpClient);
|
|
@@ -7361,54 +7404,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
|
|
|
7361
7404
|
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-grid-views-manager\">\n <kit-sortable itemClass=\"item\"\n activeItemClass=\"item active\"\n [columnCount]=\"2\"\n [items]=\"items()\"\n (dragEnd)=\"checkChanges()\">\n <ng-template let-item>\n <div class=\"item-wrapper\"\n [class.hidden]=\"item.hidden\"\n [ngClass]=\"[item.type]\">\n <kit-svg-icon class=\"item-move\"\n [icon]=\"kitSvgIcon.MENU\"\n ></kit-svg-icon>\n <div class=\"item-label\">\n <kit-truncate-text>{{ item.title | titlecase }}</kit-truncate-text>\n </div>\n @if (!isSystemView(item)) {\n <kit-svg-icon class=\"item-remove\"\n [icon]=\"kitSvgIcon.CIRCLE_MINUS\"\n (click)=\"onViewRemove(item)\"\n ></kit-svg-icon>\n <kit-svg-icon class=\"item-toggle\"\n [icon]=\"item.hidden && kitSvgIcon.EYE_CLOSE || kitSvgIcon.EYE_OPEN\"\n (click)=\"onColumnVisibilityChange(item.hidden, item)\"\n ></kit-svg-icon>\n }\n </div>\n </ng-template>\n </kit-sortable>\n\n <kit-dialog-actions>\n <kit-button [label]=\"'kit.views.cancel' | translate\"\n [kind]=\"kitButtonKind.MEDIUM\"\n [type]=\"kitButtonType.GHOST\"\n [disabled]=\"isSaving()\"\n (clicked)=\"close()\"\n ></kit-button>\n <kit-button [label]=\"'kit.views.apply' | translate\"\n [kind]=\"kitButtonKind.MEDIUM\"\n [disabled]=\"!hasUnsavedChanges() || isSaving()\"\n (clicked)=\"applyChanges()\"\n ></kit-button>\n </kit-dialog-actions>\n</div>\n", styles: [".kit-grid-views-manager{width:452px}.kit-grid-views-manager ::ng-deep .kit-sortable{margin:0 -12px;column-gap:24px;column-rule:1px solid var(--ui-kit-color-grey-11)}.kit-grid-views-manager ::ng-deep .item{margin-bottom:8px;padding:8px 12px;border-radius:8px;box-sizing:border-box;cursor:pointer}.kit-grid-views-manager ::ng-deep .item .item-label{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.kit-grid-views-manager ::ng-deep .item .system .item-label{color:var(--ui-kit-color-blue)}.kit-grid-views-manager ::ng-deep .item .user .item-label{color:var(--ui-kit-color-main)}.kit-grid-views-manager ::ng-deep .item-wrapper{display:flex;align-items:center;gap:8px}.kit-grid-views-manager ::ng-deep .item-wrapper.hidden .item-label{color:var(--ui-kit-color-grey-12)}.kit-grid-views-manager ::ng-deep .item-wrapper.hidden .item-toggle{fill:var(--ui-kit-color-grey-12)}.kit-grid-views-manager ::ng-deep .item:hover .item-move{fill:var(--ui-kit-color-main)}.kit-grid-views-manager ::ng-deep .item-label{flex:1;color:var(--ui-kit-color-grey-10);font-size:14px;font-weight:400;line-height:22px}.kit-grid-views-manager ::ng-deep .item .item-move{margin-right:4px;width:12px;height:12px;fill:var(--ui-kit-color-grey-12)}.kit-grid-views-manager ::ng-deep .item .item-toggle{width:18px;height:18px;fill:var(--ui-kit-color-main)}.kit-grid-views-manager ::ng-deep .item .item-remove{width:14px;height:14px;stroke:var(--ui-kit-color-grey-12);fill:none}.kit-grid-views-manager ::ng-deep .item .item-remove:hover{stroke:var(--ui-kit-color-main)}.kit-grid-views-manager ::ng-deep .item.active{box-shadow:4px 4px 8px #0003;background:var(--ui-kit-color-white)}.kit-grid-views-manager ::ng-deep .item.active .item-move{fill:var(--ui-kit-color-main)}\n"] }]
|
|
7362
7405
|
}], ctorParameters: () => [] });
|
|
7363
7406
|
|
|
7364
|
-
const filterDuplicateGridViews = (views) => views.filter((item, index, arr) => {
|
|
7365
|
-
const duplicateItems = arr.filter(i => i.title === item.title);
|
|
7366
|
-
return duplicateItems.length <= 1 || item.type !== KitGridViewType.SYSTEM;
|
|
7367
|
-
});
|
|
7368
|
-
const findGridViewByName = (views, name, type) => {
|
|
7369
|
-
const matches = views.filter(view => view.title === name && !view.hidden);
|
|
7370
|
-
if (type) {
|
|
7371
|
-
return matches.find(view => view.type === type) ?? matches[0] ?? null;
|
|
7372
|
-
}
|
|
7373
|
-
return matches.find(view => view.type === KitGridViewType.USER) ?? matches[0] ?? null;
|
|
7374
|
-
};
|
|
7375
|
-
const buildGridViewColumns = (columns) => columns.map(column => ({
|
|
7376
|
-
field: column.field,
|
|
7377
|
-
hidden: column.hidden,
|
|
7378
|
-
}));
|
|
7379
|
-
const hasOverriddenSystemView = (name, views) => views.some(item => item.type === KitGridViewType.SYSTEM && item.title === name);
|
|
7380
|
-
const buildGridColumns = (columns, viewColumns) => viewColumns.map(viewColumn => {
|
|
7381
|
-
const matchingColumn = columns.find(column => column.field === viewColumn.field);
|
|
7382
|
-
return matchingColumn && { ...matchingColumn, hidden: viewColumn.hidden } || null;
|
|
7383
|
-
}).filter(column => !!column);
|
|
7384
|
-
const kitEncodeViewNameToUrl = (name) => name.split(' ').join('-');
|
|
7385
|
-
const decodeViewNameFromUrl = (name) => name.split('-').join(' ');
|
|
7386
|
-
const validateViewName = (views, viewName) => {
|
|
7387
|
-
const specialChars = '!@#$%^&*()_+[]{}|;:,.<>?/~`-=';
|
|
7388
|
-
if ([...specialChars].some(item => viewName.includes(item))) {
|
|
7389
|
-
return {
|
|
7390
|
-
isValid: false,
|
|
7391
|
-
message: 'kit.views.invalidMessage',
|
|
7392
|
-
};
|
|
7393
|
-
}
|
|
7394
|
-
if (viewName.length > 250) {
|
|
7395
|
-
return {
|
|
7396
|
-
isValid: false,
|
|
7397
|
-
message: 'kit.views.lengthMessage',
|
|
7398
|
-
};
|
|
7399
|
-
}
|
|
7400
|
-
if (views.some(view => view.title === viewName)) {
|
|
7401
|
-
return {
|
|
7402
|
-
isValid: true,
|
|
7403
|
-
message: 'kit.views.overrideMessage',
|
|
7404
|
-
};
|
|
7405
|
-
}
|
|
7406
|
-
return {
|
|
7407
|
-
isValid: true,
|
|
7408
|
-
message: '',
|
|
7409
|
-
};
|
|
7410
|
-
};
|
|
7411
|
-
|
|
7412
7407
|
class KitGridViewsSaveComponent {
|
|
7413
7408
|
constructor() {
|
|
7414
7409
|
this.store = inject(Store);
|
|
@@ -7519,7 +7514,6 @@ class KitGridViewsComponent {
|
|
|
7519
7514
|
this.defaultViewName = input.required(...(ngDevMode ? [{ debugName: "defaultViewName" }] : []));
|
|
7520
7515
|
this.defaultSorting = input.required(...(ngDevMode ? [{ debugName: "defaultSorting" }] : []));
|
|
7521
7516
|
this.systemViews = input.required(...(ngDevMode ? [{ debugName: "systemViews" }] : []));
|
|
7522
|
-
this.shouldMatchDefaultColumns = input(true, ...(ngDevMode ? [{ debugName: "shouldMatchDefaultColumns" }] : []));
|
|
7523
7517
|
this.viewChanged = output();
|
|
7524
7518
|
this.anchor = viewChild('toggleButton', ...(ngDevMode ? [{ debugName: "anchor", read: ElementRef }] : [{ read: ElementRef }]));
|
|
7525
7519
|
this.collapsedList = viewChild((KitCollapsedListComponent), ...(ngDevMode ? [{ debugName: "collapsedList" }] : []));
|
|
@@ -7603,6 +7597,7 @@ class KitGridViewsComponent {
|
|
|
7603
7597
|
});
|
|
7604
7598
|
}
|
|
7605
7599
|
onViewCreate() {
|
|
7600
|
+
const defaultColumns = buildGridViewColumns(this.defaultColumns());
|
|
7606
7601
|
const view = {
|
|
7607
7602
|
title: this.createNewViewName(),
|
|
7608
7603
|
group: this.viewGroup(),
|
|
@@ -7611,14 +7606,14 @@ class KitGridViewsComponent {
|
|
|
7611
7606
|
viewState: {
|
|
7612
7607
|
filter: [],
|
|
7613
7608
|
sort: [],
|
|
7614
|
-
columns:
|
|
7609
|
+
columns: defaultColumns,
|
|
7615
7610
|
},
|
|
7616
7611
|
};
|
|
7617
7612
|
this.isViewSaving.set(true);
|
|
7618
7613
|
this.store.dispatch(new AddGridView(view)).subscribe(() => {
|
|
7619
7614
|
this.resetQueryParams();
|
|
7620
7615
|
this.createNewViewPopup()?.close();
|
|
7621
|
-
this.navigateToView(this.createNewViewName()).then(() => {
|
|
7616
|
+
this.navigateToView(this.createNewViewName(), KitGridViewType.USER, { columns: JSON.stringify(defaultColumns) }).then(() => {
|
|
7622
7617
|
this.isViewSaving.set(false);
|
|
7623
7618
|
this.store.dispatch(new SetSelectedView(view));
|
|
7624
7619
|
});
|
|
@@ -7696,9 +7691,7 @@ class KitGridViewsComponent {
|
|
|
7696
7691
|
]).subscribe(() => {
|
|
7697
7692
|
if (urlState?.skip === undefined) {
|
|
7698
7693
|
this.skipQueryParamsUpdate.set(true);
|
|
7699
|
-
|
|
7700
|
-
if (urlState?.skip === undefined || !this.shouldMatchDefaultColumns()) {
|
|
7701
|
-
this.kitGridUrlStateService.setGridStateToUrl(this.store.selectSnapshot(KIT_GRID_STATE_TOKEN));
|
|
7694
|
+
this.kitGridUrlStateService.setGridStateToUrl(this.store.selectSnapshot(KIT_GRID_STATE_TOKEN), buildGridViewColumns(state.columns));
|
|
7702
7695
|
}
|
|
7703
7696
|
this.viewChanged.emit();
|
|
7704
7697
|
});
|
|
@@ -7724,15 +7717,13 @@ class KitGridViewsComponent {
|
|
|
7724
7717
|
const reset = this.needToResetQueryParams();
|
|
7725
7718
|
const useViewState = reset || urlState.skip === undefined;
|
|
7726
7719
|
const defaults = this.defaultGridState;
|
|
7727
|
-
const defaultColumns =
|
|
7728
|
-
? buildGridColumns(defaults.columns, viewState.columns ?? defaults.columns)
|
|
7729
|
-
: viewState.columns;
|
|
7720
|
+
const defaultColumns = buildGridColumns(defaults.columns, urlState.columns ?? viewState.columns);
|
|
7730
7721
|
const state = {
|
|
7731
7722
|
skip: urlState.skip ?? defaults.skip,
|
|
7732
7723
|
take: urlState.take ?? defaults.take,
|
|
7733
7724
|
sort: useViewState ? viewState.sort ?? defaults.sort : urlState.sort ?? [],
|
|
7734
7725
|
filter: convertFilterStringDate(useViewState ? viewState.filter ?? [] : urlState.filter ?? []),
|
|
7735
|
-
columns:
|
|
7726
|
+
columns: defaultColumns,
|
|
7736
7727
|
search: urlState.search,
|
|
7737
7728
|
archive: urlState.archive,
|
|
7738
7729
|
};
|
|
@@ -7744,15 +7735,17 @@ class KitGridViewsComponent {
|
|
|
7744
7735
|
buildUrlParamsFromView(viewState) {
|
|
7745
7736
|
const sort = viewState?.sort ?? this.defaultSorting();
|
|
7746
7737
|
const filter = convertFilterStringDate(viewState?.filter ?? []);
|
|
7738
|
+
const columns = buildGridViewColumns(viewState?.columns ?? this.defaultColumns());
|
|
7747
7739
|
return {
|
|
7748
7740
|
skip: 0,
|
|
7749
7741
|
take: 10,
|
|
7750
7742
|
sort: JSON.stringify(sort),
|
|
7751
7743
|
filter: JSON.stringify(filter),
|
|
7744
|
+
columns: JSON.stringify(columns),
|
|
7752
7745
|
};
|
|
7753
7746
|
}
|
|
7754
7747
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: KitGridViewsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7755
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: KitGridViewsComponent, isStandalone: true, selector: "kit-grid-views", inputs: { viewGroup: { classPropertyName: "viewGroup", publicName: "viewGroup", isSignal: true, isRequired: true, transformFunction: null }, viewConfigGroup: { classPropertyName: "viewConfigGroup", publicName: "viewConfigGroup", isSignal: true, isRequired: true, transformFunction: null }, defaultColumns: { classPropertyName: "defaultColumns", publicName: "defaultColumns", isSignal: true, isRequired: true, transformFunction: null }, defaultViewName: { classPropertyName: "defaultViewName", publicName: "defaultViewName", isSignal: true, isRequired: true, transformFunction: null }, defaultSorting: { classPropertyName: "defaultSorting", publicName: "defaultSorting", isSignal: true, isRequired: true, transformFunction: null }, systemViews: { classPropertyName: "systemViews", publicName: "systemViews", isSignal: true, isRequired: true, transformFunction: null }
|
|
7748
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: KitGridViewsComponent, isStandalone: true, selector: "kit-grid-views", inputs: { viewGroup: { classPropertyName: "viewGroup", publicName: "viewGroup", isSignal: true, isRequired: true, transformFunction: null }, viewConfigGroup: { classPropertyName: "viewConfigGroup", publicName: "viewConfigGroup", isSignal: true, isRequired: true, transformFunction: null }, defaultColumns: { classPropertyName: "defaultColumns", publicName: "defaultColumns", isSignal: true, isRequired: true, transformFunction: null }, defaultViewName: { classPropertyName: "defaultViewName", publicName: "defaultViewName", isSignal: true, isRequired: true, transformFunction: null }, defaultSorting: { classPropertyName: "defaultSorting", publicName: "defaultSorting", isSignal: true, isRequired: true, transformFunction: null }, systemViews: { classPropertyName: "systemViews", publicName: "systemViews", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { viewChanged: "viewChanged" }, providers: [
|
|
7756
7749
|
TitleCasePipe,
|
|
7757
7750
|
KitGridUrlStateService,
|
|
7758
7751
|
], viewQueries: [{ propertyName: "anchor", first: true, predicate: ["toggleButton"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "collapsedList", first: true, predicate: (KitCollapsedListComponent), descendants: true, isSignal: true }, { propertyName: "createNewViewPopup", first: true, predicate: ["popup"], descendants: true, read: KitPopupComponent, isSignal: true }], ngImport: i0, template: "<div class=\"kit-grid-views\">\n @if (viewsState$ | async; as viewsState) {\n @if (!viewsState.loading) {\n <div class=\"views-actions\">\n <kit-button #toggleButton\n kitTooltip\n kitTooltipFilter=\"kit-button\"\n [kitTooltipPosition]=\"kitTooltipPosition.TOP\"\n [title]=\"'kit.views.addView' | translate\"\n [icon]=\"kitSvgIcon.PLUS\"\n [kind]=\"kitButtonKind.MEDIUM\"\n [active]=\"popup.isPopupOpen\"\n [type]=\"kitButtonType.GHOST\"\n (clicked)=\"onCreateViewPopupToggle()\"\n ></kit-button>\n <kit-grid-views-save [viewGroup]=\"viewGroup()\"\n [views]=\"views()\"\n [viewsAutocompleteItems]=\"viewsAutocompleteItems$ | async\"\n (resetQueryParams)=\"resetQueryParams()\"\n ></kit-grid-views-save>\n <kit-button kitTooltip\n kitTooltipFilter=\"kit-button\"\n [kitTooltipPosition]=\"kitTooltipPosition.TOP\"\n [title]=\"'kit.views.manageViews' | translate\"\n [icon]=\"kitSvgIcon.VIEWS\"\n [kind]=\"kitButtonKind.MEDIUM\"\n [type]=\"kitButtonType.GHOST\"\n [disabled]=\"views().length < 2\"\n (clicked)=\"openViewsManagerModal()\"\n ></kit-button>\n </div>\n <div class=\"views-list\">\n <kit-collapsed-list [itemList]=\"collapsedListItems()\"\n [dropdownDefaultValueText]=\"collapsedListDropdownText()\"\n [lineHeight]=\"32\"\n [gap]=\"0\"\n [itemTemplate]=\"collapsedListItem\"\n [dropdownAlign]=\"kitCollapsedListDropdownAlign.INLINE\"\n (selectItem)=\"onSelectView($event)\"/>\n </div>\n } @else {\n <kit-skeleton [width]=\"200\"\n [height]=\"32\"\n ></kit-skeleton>\n }\n }\n</div>\n\n<ng-template #collapsedListItem let-item>\n <kit-button class=\"views-item\"\n [ngClass]=\"item.type\"\n [active]=\"item.title === selectedView()?.title && item.type === selectedView()?.type\"\n [label]=\"item.title | titlecase\"\n [type]=\"item.title === selectedView()?.title && item.type === selectedView()?.type &&\n kitButtonType.GHOST || kitButtonType.LINK\"\n [kind]=\"kitButtonKind.MEDIUM\"\n [iconType]=\"item.type === gridViewType.SYSTEM && kitSvgIconType.STROKE || kitSvgIconType.FILL\"\n [iconPosition]=\"kitButtonIconPosition.LEADING\"/>\n</ng-template>\n\n<kit-popup #popup\n popupClass=\"kit-grid-new-view-popup\"\n [anchor]=\"$any(anchor())\"\n [content]=\"content\">\n</kit-popup>\n\n<ng-template #content>\n <div class=\"new-view\">\n <kit-textbox class=\"new-view-input\"\n [defaultValue]=\"createNewViewName()\"\n [placeholder]=\"'kit.views.enterText' | translate\"\n [state]=\"isViewNameValid && kitTextboxState.DEFAULT || kitTextboxState.ERROR\"\n [messageText]=\"inputMessage\"\n (changed)=\"createNewViewName.set($event)\"\n ></kit-textbox>\n <kit-button [label]=\"'kit.views.save' | translate\"\n [disabled]=\"!createNewViewName() || !isViewNameValid || isViewSaving()\"\n (clicked)=\"onViewCreate()\"\n ></kit-button>\n </div>\n</ng-template>\n", styles: [".kit-grid-views{display:flex;gap:16px}.kit-grid-views .views-actions{display:flex;gap:16px;padding-right:16px;border-right:1px solid var(--ui-kit-color-grey-11)}.kit-grid-views .views-list{width:100%;min-width:0}::ng-deep .views-list .views-item.system .k-button{color:var(--ui-kit-color-blue)}::ng-deep .views-list .views-item:hover .k-button{color:var(--ui-kit-color-main)}::ng-deep .views-list .views-item .k-button.active{color:var(--ui-kit-color-main)}::ng-deep .views-list .collapsed-list-dropdown .dropdown .k-input-inner{padding:0 16px}::ng-deep .views-list .collapsed-list-dropdown .dropdown .k-input-inner .value-icon{margin-left:5px}::ng-deep .kit-grid-views .views-list .wrapper-inner .collapsed-list-dropdown:focus-within .dropdown{box-shadow:none}::ng-deep .kit-grid-views .views-list .wrapper-inner .collapsed-list-dropdown .dropdown{border-color:transparent;background-color:transparent}::ng-deep .kit-grid-views .views-list .wrapper-inner .collapsed-list-dropdown .dropdown .k-input-value-text span{color:var(--ui-kit-color-main)}::ng-deep .kit-grid-views .views-list .wrapper-inner .collapsed-list-dropdown .dropdown .k-input-value-text svg{stroke:var(--ui-kit-color-main)}::ng-deep .kit-grid-views .views-list .wrapper-inner .collapsed-list-dropdown.selected .dropdown{color:var(--ui-kit-color-main);border-color:var(--ui-kit-color-main);background:var(--ui-kit-color-background)}::ng-deep .kit-dropdown-popup.k-popup.collapsed-list-popup{width:360px}::ng-deep .kit-popup.kit-grid-new-view-popup{width:400px}::ng-deep .kit-popup.kit-grid-new-view-popup .new-view{display:flex;flex-direction:row;gap:12px}::ng-deep .kit-popup.kit-grid-new-view-popup .new-view-input{flex:1}\n"], dependencies: [{ kind: "component", type: KitSkeletonComponent, selector: "kit-skeleton", inputs: ["width", "height", "shape", "animation"] }, { kind: "component", type: KitGridViewsSaveComponent, selector: "kit-grid-views-save", inputs: ["viewGroup", "views", "viewsAutocompleteItems"], outputs: ["resetQueryParams"] }, { kind: "component", type: KitCollapsedListComponent, selector: "kit-collapsed-list", inputs: ["itemList", "lineHeight", "dropdownDefaultValueText", "gap", "disableActions", "itemTemplate", "dropdownFooterTemplate", "dropdownItemTemplate", "dropdownNoDataTemplate", "appendTo", "alwaysShowDropdown", "dropdownAlign"], outputs: ["selectItem"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: KitPopupComponent, selector: "kit-popup", inputs: ["anchor", "content", "closeOnOutsideClick", "showFooter", "cancelButtonLabel", "applyButtonLabel", "isApplyButtonDisabled", "positionMode", "popupClass", "closePopupOnCancel", "extraInsideSelectors"], outputs: ["cancelAction", "applyAction", "opened", "closed"] }, { kind: "component", type: KitTextboxComponent, selector: "kit-textbox", inputs: ["placeholder", "label", "labelTooltip", "defaultValue", "messageIcon", "messageText", "messageTemplate", "disabled", "maxlength", "state", "size", "icon", "clearButton", "showStateIcon"], outputs: ["defaultValueChange", "disabledChange", "blured", "focused", "changed"] }, { kind: "directive", type: KitTooltipDirective, selector: "[kitTooltip]", inputs: ["kitTooltipPosition", "kitTooltipFilter", "kitTooltipTemplateRef", "kitTooltipVisible"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i1$c.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
@@ -9140,7 +9133,6 @@ class KitEntityGridComponent {
|
|
|
9140
9133
|
this.rowClassFn = input(...(ngDevMode ? [undefined, { debugName: "rowClassFn" }] : []));
|
|
9141
9134
|
this.showArchiveToggle = input(false, ...(ngDevMode ? [{ debugName: "showArchiveToggle" }] : []));
|
|
9142
9135
|
this.showRefreshButton = input(false, ...(ngDevMode ? [{ debugName: "showRefreshButton" }] : []));
|
|
9143
|
-
this.shouldMatchDefaultColumnsWhenChangeView = input(true, ...(ngDevMode ? [{ debugName: "shouldMatchDefaultColumnsWhenChangeView" }] : []));
|
|
9144
9136
|
this.gridViewChanged = output();
|
|
9145
9137
|
this.archiveModeChanged = output();
|
|
9146
9138
|
this.refreshButtonClicked = output();
|
|
@@ -9206,10 +9198,10 @@ class KitEntityGridComponent {
|
|
|
9206
9198
|
this.refreshButtonClicked.emit();
|
|
9207
9199
|
}
|
|
9208
9200
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: KitEntityGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9209
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: KitEntityGridComponent, isStandalone: true, selector: "kit-entity-grid", inputs: { gridData: { classPropertyName: "gridData", publicName: "gridData", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, gridColumns: { classPropertyName: "gridColumns", publicName: "gridColumns", isSignal: true, isRequired: true, transformFunction: null }, defaultViewName: { classPropertyName: "defaultViewName", publicName: "defaultViewName", isSignal: true, isRequired: true, transformFunction: null }, viewGroup: { classPropertyName: "viewGroup", publicName: "viewGroup", isSignal: true, isRequired: true, transformFunction: null }, viewGroupConfig: { classPropertyName: "viewGroupConfig", publicName: "viewGroupConfig", isSignal: true, isRequired: true, transformFunction: null }, pdfOptions: { classPropertyName: "pdfOptions", publicName: "pdfOptions", isSignal: true, isRequired: true, transformFunction: null }, getExportedData: { classPropertyName: "getExportedData", publicName: "getExportedData", isSignal: true, isRequired: true, transformFunction: null }, defaultSorting: { classPropertyName: "defaultSorting", publicName: "defaultSorting", isSignal: true, isRequired: false, transformFunction: null }, filterExcludedColumns: { classPropertyName: "filterExcludedColumns", publicName: "filterExcludedColumns", isSignal: true, isRequired: false, transformFunction: null }, systemViews: { classPropertyName: "systemViews", publicName: "systemViews", isSignal: true, isRequired: false, transformFunction: null }, translationMap: { classPropertyName: "translationMap", publicName: "translationMap", isSignal: true, isRequired: false, transformFunction: null }, isDetailTemplateVisible: { classPropertyName: "isDetailTemplateVisible", publicName: "isDetailTemplateVisible", isSignal: true, isRequired: false, transformFunction: null }, detailTemplateExpandDisableIf: { classPropertyName: "detailTemplateExpandDisableIf", publicName: "detailTemplateExpandDisableIf", isSignal: true, isRequired: false, transformFunction: null }, gridHasData: { classPropertyName: "gridHasData", publicName: "gridHasData", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, pagerInfoText: { classPropertyName: "pagerInfoText", publicName: "pagerInfoText", isSignal: true, isRequired: false, transformFunction: null }, showBreadcrumbs: { classPropertyName: "showBreadcrumbs", publicName: "showBreadcrumbs", isSignal: true, isRequired: false, transformFunction: null }, pageSizes: { classPropertyName: "pageSizes", publicName: "pageSizes", isSignal: true, isRequired: false, transformFunction: null }, rowClassFn: { classPropertyName: "rowClassFn", publicName: "rowClassFn", isSignal: true, isRequired: false, transformFunction: null }, showArchiveToggle: { classPropertyName: "showArchiveToggle", publicName: "showArchiveToggle", isSignal: true, isRequired: false, transformFunction: null }, showRefreshButton: { classPropertyName: "showRefreshButton", publicName: "showRefreshButton", isSignal: true, isRequired: false, transformFunction: null }
|
|
9201
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: KitEntityGridComponent, isStandalone: true, selector: "kit-entity-grid", inputs: { gridData: { classPropertyName: "gridData", publicName: "gridData", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, gridColumns: { classPropertyName: "gridColumns", publicName: "gridColumns", isSignal: true, isRequired: true, transformFunction: null }, defaultViewName: { classPropertyName: "defaultViewName", publicName: "defaultViewName", isSignal: true, isRequired: true, transformFunction: null }, viewGroup: { classPropertyName: "viewGroup", publicName: "viewGroup", isSignal: true, isRequired: true, transformFunction: null }, viewGroupConfig: { classPropertyName: "viewGroupConfig", publicName: "viewGroupConfig", isSignal: true, isRequired: true, transformFunction: null }, pdfOptions: { classPropertyName: "pdfOptions", publicName: "pdfOptions", isSignal: true, isRequired: true, transformFunction: null }, getExportedData: { classPropertyName: "getExportedData", publicName: "getExportedData", isSignal: true, isRequired: true, transformFunction: null }, defaultSorting: { classPropertyName: "defaultSorting", publicName: "defaultSorting", isSignal: true, isRequired: false, transformFunction: null }, filterExcludedColumns: { classPropertyName: "filterExcludedColumns", publicName: "filterExcludedColumns", isSignal: true, isRequired: false, transformFunction: null }, systemViews: { classPropertyName: "systemViews", publicName: "systemViews", isSignal: true, isRequired: false, transformFunction: null }, translationMap: { classPropertyName: "translationMap", publicName: "translationMap", isSignal: true, isRequired: false, transformFunction: null }, isDetailTemplateVisible: { classPropertyName: "isDetailTemplateVisible", publicName: "isDetailTemplateVisible", isSignal: true, isRequired: false, transformFunction: null }, detailTemplateExpandDisableIf: { classPropertyName: "detailTemplateExpandDisableIf", publicName: "detailTemplateExpandDisableIf", isSignal: true, isRequired: false, transformFunction: null }, gridHasData: { classPropertyName: "gridHasData", publicName: "gridHasData", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, pagerInfoText: { classPropertyName: "pagerInfoText", publicName: "pagerInfoText", isSignal: true, isRequired: false, transformFunction: null }, showBreadcrumbs: { classPropertyName: "showBreadcrumbs", publicName: "showBreadcrumbs", isSignal: true, isRequired: false, transformFunction: null }, pageSizes: { classPropertyName: "pageSizes", publicName: "pageSizes", isSignal: true, isRequired: false, transformFunction: null }, rowClassFn: { classPropertyName: "rowClassFn", publicName: "rowClassFn", isSignal: true, isRequired: false, transformFunction: null }, showArchiveToggle: { classPropertyName: "showArchiveToggle", publicName: "showArchiveToggle", isSignal: true, isRequired: false, transformFunction: null }, showRefreshButton: { classPropertyName: "showRefreshButton", publicName: "showRefreshButton", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { gridViewChanged: "gridViewChanged", archiveModeChanged: "archiveModeChanged", refreshButtonClicked: "refreshButtonClicked" }, providers: [
|
|
9210
9202
|
KitBreadcrumbsService,
|
|
9211
9203
|
KitGridUrlStateService,
|
|
9212
|
-
], queries: [{ propertyName: "columns", predicate: KitGridColumnComponent, isSignal: true }, { propertyName: "gridDetailTemplate", first: true, predicate: KitGridDetailTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "search", first: true, predicate: ["search"], descendants: true, read: KitGridSearchComponent, isSignal: true }, { propertyName: "kitGridComponent", first: true, predicate: (KitGridComponent), descendants: true, isSignal: true }, { propertyName: "gridExportComponent", first: true, predicate: KitGridExportComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"kit-entity-grid\">\n @if (showBreadcrumbs()) {\n <kit-breadcrumbs [items]=\"breadcrumbs()\"></kit-breadcrumbs>\n }\n <kit-entity-title>{{ title() }}</kit-entity-title>\n <div class=\"grid-header\">\n <div class=\"grid-header-content\">\n <kit-grid-views class=\"grid-header-views\"\n [viewGroup]=\"viewGroup()\"\n [viewConfigGroup]=\"viewGroupConfig()\"\n [systemViews]=\"systemViews()\"\n [defaultColumns]=\"gridColumns()\"\n [defaultViewName]=\"defaultViewName()\"\n [defaultSorting]=\"defaultSorting()\"\n
|
|
9204
|
+
], queries: [{ propertyName: "columns", predicate: KitGridColumnComponent, isSignal: true }, { propertyName: "gridDetailTemplate", first: true, predicate: KitGridDetailTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "search", first: true, predicate: ["search"], descendants: true, read: KitGridSearchComponent, isSignal: true }, { propertyName: "kitGridComponent", first: true, predicate: (KitGridComponent), descendants: true, isSignal: true }, { propertyName: "gridExportComponent", first: true, predicate: KitGridExportComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"kit-entity-grid\">\n @if (showBreadcrumbs()) {\n <kit-breadcrumbs [items]=\"breadcrumbs()\"></kit-breadcrumbs>\n }\n <kit-entity-title>{{ title() }}</kit-entity-title>\n <div class=\"grid-header\">\n <div class=\"grid-header-content\">\n <kit-grid-views class=\"grid-header-views\"\n [viewGroup]=\"viewGroup()\"\n [viewConfigGroup]=\"viewGroupConfig()\"\n [systemViews]=\"systemViews()\"\n [defaultColumns]=\"gridColumns()\"\n [defaultViewName]=\"defaultViewName()\"\n [defaultSorting]=\"defaultSorting()\"\n (viewChanged)=\"onGridViewChange()\"\n ></kit-grid-views>\n <div class=\"grid-header-actions\">\n <ng-content select=\"[headerActions]\"></ng-content>\n @if (showRefreshButton()) {\n <kit-button kitTooltip\n kitTooltipFilter=\"kit-button\"\n [kitTooltipPosition]=\"kitTooltipPosition.TOP\"\n [title]=\"'kit.grid.actions.refresh' | translate\"\n [type]=\"kitButtonType.GHOST\"\n [kind]=\"kitButtonKind.MEDIUM\"\n [icon]=\"kitSvgIcon.RESET\"\n (clicked)=\"onRefreshButtonClick()\"\n ></kit-button>\n }\n @if (showArchiveToggle()) {\n <kit-grid-archive-toggle (valueChange)=\"onArchiveToggle($event)\"\n ></kit-grid-archive-toggle>\n }\n <kit-grid-export [gridHasData]=\"gridHasData()\"\n [exportedFileName]=\"pdfOptions().fileName ?? ''\"\n [getExportedData]=\"getExportedData()\"\n [translationMap]=\"translationMap()\"\n [drawPdf]=\"drawPdf()\" />\n @if (filters$ | async; as filters) {\n <kit-button kitBadge\n kitTooltip\n kitTooltipFilter=\"kit-button\"\n [title]=\"'kit.filters.title' | translate\"\n [kitTooltipVisible]=\"searchIsOpen()\"\n [kitTooltipPosition]=\"kitTooltipPosition.TOP\"\n [kitBadgeText]=\"filters.length\"\n [kitBadgeTheme]=\"kitBadgeTheme.DANGER\"\n [kitBadgeVisible]=\"filters.length > 0\"\n [label]=\"searchIsOpen() ? '' : ('kit.filters.title' | translate)\"\n [type]=\"kitButtonType.GHOST\"\n [kind]=\"kitButtonKind.MEDIUM\"\n [icon]=\"kitSvgIcon.FILTER\"\n [iconPosition]=\"kitButtonIconPosition.LEADING\"\n [active]=\"filtersVisible()\"\n (clicked)=\"onFiltersToggle()\"\n ></kit-button>\n <kit-grid-column-manager [showLabel]=\"!searchIsOpen()\" />\n }\n </div>\n <div class=\"grid-header-search\">\n <kit-grid-search #search\n [disabled]=\"isSearchDisabled()\"\n (toggleSearch)=\"searchIsOpen.set($event)\" />\n </div>\n </div>\n @if (filtersVisible()) {\n <ng-content select=\"[filters]\"></ng-content>\n }\n </div>\n <ng-content select=\"[post-header-content]\"></ng-content>\n @if (gridData(); as data) {\n @if (!data.loading) {\n <kit-grid class=\"grid\"\n [data]=\"data.results\"\n [pageable]=\"true\"\n [pageSize]=\"gridState().take\"\n [sort]=\"gridState().sort\"\n [sortable]=\"sortable\"\n [detailTemplateShowIf]=\"isDetailTemplateVisible()\"\n [detailTemplateExpandDisableIf]=\"detailTemplateExpandDisableIf()\"\n [pdfOptions]=\"pdfOptions()\"\n [loading]=\"isExporting() || isLoading()\"\n [skip]=\"gridState().skip\"\n [pagerInfoText]=\"pagerInfoText()\"\n [pageSizes]=\"pageSizes()\"\n [rowClassFn]=\"rowClassFn()\"\n [gridDetailTemplate]=\"gridDetailTemplate()\"\n (pageChanged)=\"onPageSizeChanged($event)\"\n (dataStateChanged)=\"onDataStateChange($event)\"\n ></kit-grid>\n } @else {\n <kit-skeleton-grid\n ></kit-skeleton-grid>\n }\n }\n <ng-content select=\"[footerActions]\"></ng-content>\n</div>\n\n", styles: [".kit-entity-grid{display:flex;flex-direction:column;gap:25px;height:calc(100vh - var(--ui-kit-header-height) - 40px)}.kit-entity-grid .grid{overflow:auto}.grid-header{display:flex;flex-direction:column;gap:16px;container-type:inline-size}.grid-header-content{display:flex;gap:16px;width:100%}@container (max-width: 780px){.grid-header-content{display:grid;gap:10px;grid-template-areas:\"views .\" \"actions search\";grid-template-columns:repeat(2,1fr)}}.grid-header-views{min-width:0;flex:1;grid-area:views;grid-column:1/3}.grid-header-actions{display:flex;gap:16px;grid-area:actions}.grid-header-search{grid-area:search}@container (max-width: 780px){.grid-header-search{border:none;padding:0;display:flex;justify-content:flex-end}}.grid-header-filters{width:100%}::ng-deep .k-loading-pdf-mask{display:none}::ng-deep .k-pdf-export tbody>tr>td>a{display:none}\n"], dependencies: [{ kind: "component", type: KitBreadcrumbsComponent, selector: "kit-breadcrumbs", inputs: ["items"] }, { kind: "component", type: KitEntityTitleComponent, selector: "kit-entity-title" }, { kind: "component", type: KitGridViewsComponent, selector: "kit-grid-views", inputs: ["viewGroup", "viewConfigGroup", "defaultColumns", "defaultViewName", "defaultSorting", "systemViews"], outputs: ["viewChanged"] }, { kind: "component", type: KitGridExportComponent, selector: "kit-grid-export", inputs: ["getExportedData", "translationMap", "exportedFileName", "drawPdf", "gridHasData", "visibleColumns"] }, { kind: "directive", type: KitBadgeDirective, selector: "[kitBadge]", inputs: ["kitBadgeText", "kitBadgeTheme", "kitBadgeVisible"] }, { kind: "component", type: KitGridColumnManagerComponent, selector: "kit-grid-column-manager", inputs: ["showLabel"] }, { kind: "component", type: KitGridSearchComponent, selector: "kit-grid-search", inputs: ["disabled"], outputs: ["toggleSearch"] }, { kind: "component", type: KitGridComponent, selector: "kit-grid", inputs: ["data", "gridDataBinding", "sortable", "sort", "pageable", "pageSize", "skip", "loading", "detailTemplateShowIf", "detailTemplateExpandDisableIf", "showFooter", "footerTitle", "footerData", "pdfOptions", "pagerButtonCount", "pageSizes", "pagerInfoText", "resizable", "gridDetailTemplate", "rowClassFn"], outputs: ["pageChanged", "sortChanged", "dataStateChanged", "detailExpanded", "detailCollapsed", "cellClicked", "excelExport"] }, { kind: "component", type: KitSkeletonGridComponent, selector: "kit-skeleton-grid", inputs: ["itemsCount"] }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "directive", type: KitTooltipDirective, selector: "[kitTooltip]", inputs: ["kitTooltipPosition", "kitTooltipFilter", "kitTooltipTemplateRef", "kitTooltipVisible"] }, { kind: "component", type: KitGridArchiveToggle, selector: "kit-grid-archive-toggle", outputs: ["valueChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
9213
9205
|
}
|
|
9214
9206
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: KitEntityGridComponent, decorators: [{
|
|
9215
9207
|
type: Component,
|
|
@@ -9231,7 +9223,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
|
|
|
9231
9223
|
], providers: [
|
|
9232
9224
|
KitBreadcrumbsService,
|
|
9233
9225
|
KitGridUrlStateService,
|
|
9234
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-entity-grid\">\n @if (showBreadcrumbs()) {\n <kit-breadcrumbs [items]=\"breadcrumbs()\"></kit-breadcrumbs>\n }\n <kit-entity-title>{{ title() }}</kit-entity-title>\n <div class=\"grid-header\">\n <div class=\"grid-header-content\">\n <kit-grid-views class=\"grid-header-views\"\n [viewGroup]=\"viewGroup()\"\n [viewConfigGroup]=\"viewGroupConfig()\"\n [systemViews]=\"systemViews()\"\n [defaultColumns]=\"gridColumns()\"\n [defaultViewName]=\"defaultViewName()\"\n [defaultSorting]=\"defaultSorting()\"\n
|
|
9226
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-entity-grid\">\n @if (showBreadcrumbs()) {\n <kit-breadcrumbs [items]=\"breadcrumbs()\"></kit-breadcrumbs>\n }\n <kit-entity-title>{{ title() }}</kit-entity-title>\n <div class=\"grid-header\">\n <div class=\"grid-header-content\">\n <kit-grid-views class=\"grid-header-views\"\n [viewGroup]=\"viewGroup()\"\n [viewConfigGroup]=\"viewGroupConfig()\"\n [systemViews]=\"systemViews()\"\n [defaultColumns]=\"gridColumns()\"\n [defaultViewName]=\"defaultViewName()\"\n [defaultSorting]=\"defaultSorting()\"\n (viewChanged)=\"onGridViewChange()\"\n ></kit-grid-views>\n <div class=\"grid-header-actions\">\n <ng-content select=\"[headerActions]\"></ng-content>\n @if (showRefreshButton()) {\n <kit-button kitTooltip\n kitTooltipFilter=\"kit-button\"\n [kitTooltipPosition]=\"kitTooltipPosition.TOP\"\n [title]=\"'kit.grid.actions.refresh' | translate\"\n [type]=\"kitButtonType.GHOST\"\n [kind]=\"kitButtonKind.MEDIUM\"\n [icon]=\"kitSvgIcon.RESET\"\n (clicked)=\"onRefreshButtonClick()\"\n ></kit-button>\n }\n @if (showArchiveToggle()) {\n <kit-grid-archive-toggle (valueChange)=\"onArchiveToggle($event)\"\n ></kit-grid-archive-toggle>\n }\n <kit-grid-export [gridHasData]=\"gridHasData()\"\n [exportedFileName]=\"pdfOptions().fileName ?? ''\"\n [getExportedData]=\"getExportedData()\"\n [translationMap]=\"translationMap()\"\n [drawPdf]=\"drawPdf()\" />\n @if (filters$ | async; as filters) {\n <kit-button kitBadge\n kitTooltip\n kitTooltipFilter=\"kit-button\"\n [title]=\"'kit.filters.title' | translate\"\n [kitTooltipVisible]=\"searchIsOpen()\"\n [kitTooltipPosition]=\"kitTooltipPosition.TOP\"\n [kitBadgeText]=\"filters.length\"\n [kitBadgeTheme]=\"kitBadgeTheme.DANGER\"\n [kitBadgeVisible]=\"filters.length > 0\"\n [label]=\"searchIsOpen() ? '' : ('kit.filters.title' | translate)\"\n [type]=\"kitButtonType.GHOST\"\n [kind]=\"kitButtonKind.MEDIUM\"\n [icon]=\"kitSvgIcon.FILTER\"\n [iconPosition]=\"kitButtonIconPosition.LEADING\"\n [active]=\"filtersVisible()\"\n (clicked)=\"onFiltersToggle()\"\n ></kit-button>\n <kit-grid-column-manager [showLabel]=\"!searchIsOpen()\" />\n }\n </div>\n <div class=\"grid-header-search\">\n <kit-grid-search #search\n [disabled]=\"isSearchDisabled()\"\n (toggleSearch)=\"searchIsOpen.set($event)\" />\n </div>\n </div>\n @if (filtersVisible()) {\n <ng-content select=\"[filters]\"></ng-content>\n }\n </div>\n <ng-content select=\"[post-header-content]\"></ng-content>\n @if (gridData(); as data) {\n @if (!data.loading) {\n <kit-grid class=\"grid\"\n [data]=\"data.results\"\n [pageable]=\"true\"\n [pageSize]=\"gridState().take\"\n [sort]=\"gridState().sort\"\n [sortable]=\"sortable\"\n [detailTemplateShowIf]=\"isDetailTemplateVisible()\"\n [detailTemplateExpandDisableIf]=\"detailTemplateExpandDisableIf()\"\n [pdfOptions]=\"pdfOptions()\"\n [loading]=\"isExporting() || isLoading()\"\n [skip]=\"gridState().skip\"\n [pagerInfoText]=\"pagerInfoText()\"\n [pageSizes]=\"pageSizes()\"\n [rowClassFn]=\"rowClassFn()\"\n [gridDetailTemplate]=\"gridDetailTemplate()\"\n (pageChanged)=\"onPageSizeChanged($event)\"\n (dataStateChanged)=\"onDataStateChange($event)\"\n ></kit-grid>\n } @else {\n <kit-skeleton-grid\n ></kit-skeleton-grid>\n }\n }\n <ng-content select=\"[footerActions]\"></ng-content>\n</div>\n\n", styles: [".kit-entity-grid{display:flex;flex-direction:column;gap:25px;height:calc(100vh - var(--ui-kit-header-height) - 40px)}.kit-entity-grid .grid{overflow:auto}.grid-header{display:flex;flex-direction:column;gap:16px;container-type:inline-size}.grid-header-content{display:flex;gap:16px;width:100%}@container (max-width: 780px){.grid-header-content{display:grid;gap:10px;grid-template-areas:\"views .\" \"actions search\";grid-template-columns:repeat(2,1fr)}}.grid-header-views{min-width:0;flex:1;grid-area:views;grid-column:1/3}.grid-header-actions{display:flex;gap:16px;grid-area:actions}.grid-header-search{grid-area:search}@container (max-width: 780px){.grid-header-search{border:none;padding:0;display:flex;justify-content:flex-end}}.grid-header-filters{width:100%}::ng-deep .k-loading-pdf-mask{display:none}::ng-deep .k-pdf-export tbody>tr>td>a{display:none}\n"] }]
|
|
9235
9227
|
}], ctorParameters: () => [] });
|
|
9236
9228
|
|
|
9237
9229
|
class KitMenuBuilderService {
|