@indigina/ui-kit 1.1.415 → 1.1.417
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.
|
@@ -4424,7 +4424,7 @@ class KitMultiselectComponent {
|
|
|
4424
4424
|
provide: NG_VALUE_ACCESSOR,
|
|
4425
4425
|
useExisting: forwardRef(() => KitMultiselectComponent),
|
|
4426
4426
|
multi: true,
|
|
4427
|
-
}], viewQueries: [{ propertyName: "multiselect", first: true, predicate: MultiSelectComponent, descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"kit-multiselect\"\n [class.disabled]=\"disabled\"\n [class.all-option-selected]=\"hasSelectedAllOption\">\n @if (label) {\n <kit-input-label class=\"label\"\n [text]=\"label\"\n [for]=\"multiselect\"\n ></kit-input-label>\n }\n <kendo-multiselect #multiselect\n valueField=\"value\"\n textField=\"text\"\n [ngClass]=\"size()\"\n [data]=\"items\"\n [disabled]=\"disabled\"\n [autoClose]=\"autoClose\"\n [placeholder]=\"placeholder\"\n [valuePrimitive]=\"true\"\n [itemDisabled]=\"onItemDisabled()\"\n [popupSettings]=\"buildPopupSettings()\"\n [tagMapper]=\"tagMapper()\"\n [
|
|
4427
|
+
}], viewQueries: [{ propertyName: "multiselect", first: true, predicate: MultiSelectComponent, descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"kit-multiselect\"\n [class.disabled]=\"disabled\"\n [class.all-option-selected]=\"hasSelectedAllOption\">\n @if (label) {\n <kit-input-label class=\"label\"\n [text]=\"label\"\n [for]=\"multiselect\"\n ></kit-input-label>\n }\n <kendo-multiselect #multiselect\n valueField=\"value\"\n textField=\"text\"\n kendoDropDownFilter\n [ngClass]=\"size()\"\n [data]=\"items\"\n [disabled]=\"disabled\"\n [autoClose]=\"autoClose\"\n [placeholder]=\"placeholder\"\n [valuePrimitive]=\"true\"\n [itemDisabled]=\"onItemDisabled()\"\n [popupSettings]=\"buildPopupSettings()\"\n [tagMapper]=\"tagMapper()\"\n [checkboxes]=\"useCheckboxes()\"\n [listHeight]=\"listHeight()\"\n [(ngModel)]=\"selectedItems\">\n <ng-template kendoMultiSelectTagTemplate let-dataItem>\n <span class=\"chip-text\"\n [class.all-option]=\"dataItem.value === allOption().value\"\n [ngClass]=\"dataItem?.optionClass\">\n {{ dataItem?.text }}\n </span>\n <kit-svg-icon class=\"chip-icon\"\n [icon]=\"KitSvgIcon.CROSS\"\n ></kit-svg-icon>\n </ng-template>\n <ng-template kendoMultiSelectItemTemplate let-dataItem>\n <span class=\"option-text\"\n [ngClass]=\"dataItem?.optionClass\">{{ dataItem?.text }}</span>\n <kit-svg-icon class=\"option-icon\"\n [icon]=\"KitSvgIcon.CHECK\"\n ></kit-svg-icon>\n </ng-template>\n </kendo-multiselect>\n\n @if (messageText) {\n <kit-input-message [icon]=\"messageIcon\"\n [message]=\"messageText\"\n ></kit-input-message>\n }\n</div>\n", styles: [".kit-multiselect .label{display:block;margin-bottom:4px}.kit-multiselect .k-multiselect{width:100%;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-multiselect .k-multiselect:hover{border-color:var(--ui-kit-color-hover)}.kit-multiselect .k-multiselect.k-focus{box-shadow:none}.kit-multiselect .k-multiselect.small{min-height:30px;border-radius:4px}.kit-multiselect .k-multiselect.small .k-input-values{padding:5px 7px}.kit-multiselect .k-multiselect.small .k-chip{height:20px;border-radius:4px}.kit-multiselect .k-multiselect.default{min-height:40px;border-radius:8px}.kit-multiselect .k-multiselect.default .k-input-values{padding:7px 12px}.kit-multiselect .k-multiselect.default .k-chip{height:24px;border-radius:8px}.kit-multiselect .k-input .k-input-inner{padding:0}.kit-multiselect .k-input-values{gap:8px}.kit-multiselect .k-input-inner{font-size:14px;font-weight:400}.kit-multiselect .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-multiselect .k-chip{display:flex;align-items:center;position:relative;padding:0 8px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-grey-13)}.kit-multiselect .k-chip-label{display:flex;align-items:center;gap:4px;line-height:1}.kit-multiselect .k-chip-actions{position:absolute;right:8px;width:12px;height:12px;opacity:0}.kit-multiselect .k-chip-action{display:flex;padding:0;cursor:pointer}.kit-multiselect .k-chip-content:has(+.k-chip-actions:hover) .chip-icon{stroke:var(--ui-kit-color-main)}.kit-multiselect .k-chip .chip-text{color:var(--ui-kit-color-grey-10);font-size:12px;font-weight:500}.kit-multiselect .k-chip .chip-icon{display:block;width:12px;height:12px;stroke:var(--ui-kit-color-grey-12);cursor:pointer}.kit-multiselect .k-chip .k-icon{width:12px;height:12px}.kit-multiselect .k-chip:has(.chip-text.all-option){display:flex}.kit-multiselect .k-clear-value{margin-right:12px;padding:0;opacity:1;color:var(--ui-kit-color-grey-12)}.kit-multiselect .k-clear-value:hover{color:var(--ui-kit-color-main)}.kit-multiselect.disabled .k-multiselect{opacity:1;filter:none;background-color:var(--ui-kit-color-grey-13)}.kit-multiselect.disabled .chip-text{color:var(--ui-kit-color-grey-12)}.kit-multiselect:focus-within .k-multiselect{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-multiselect.all-option-selected .k-chip{display:none}.kit-multiselect-popup{margin-top:10px;padding:4px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-multiselect-popup .k-list-item{padding:6px 12px;background-color:var(--ui-kit-color-white);font-size:14px;font-weight:400;box-shadow:none;border-radius:4px;color:var(--ui-kit-color-grey-10)}.kit-multiselect-popup .k-list-item:hover{color:var(--ui-kit-color-main)}.kit-multiselect-popup .k-list-item .option-icon{display:none;width:16px;height:16px;fill:none;stroke:var(--ui-kit-color-main)}.kit-multiselect-popup .k-list-item.k-disabled{color:var(--ui-kit-color-grey-12)}.kit-multiselect-popup .k-list-item.k-selected{display:flex;align-items:center;background-color:var(--ui-kit-color-grey-13)}.kit-multiselect-popup .k-list-item.k-selected .option-text{flex:1}.kit-multiselect-popup .k-list-item.k-selected .option-icon{display:block}.kit-multiselect-popup .k-checkbox{background-color:var(--ui-kit-color-grey-13);border:1px solid var(--ui-kit-color-grey-11);margin-right:4px}.kit-multiselect-popup .k-checkbox:checked{border-color:var(--ui-kit-color-main);background-color:var(--ui-kit-color-main)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { kind: "directive", type: i1$3.FilterDirective, selector: "[kendoDropDownFilter]", inputs: ["data", "kendoDropDownFilter", "filterable"] }, { kind: "component", type: i1$3.MultiSelectComponent, selector: "kendo-multiselect", inputs: ["showStickyHeader", "focusableId", "autoClose", "loading", "data", "value", "valueField", "textField", "tabindex", "tabIndex", "size", "rounded", "fillMode", "placeholder", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "disabled", "itemDisabled", "checkboxes", "readonly", "filterable", "virtual", "popupSettings", "listHeight", "valuePrimitive", "clearButton", "tagMapper", "allowCustom", "valueNormalizer", "inputAttributes"], outputs: ["filterChange", "valueChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur", "removeTag"], exportAs: ["kendoMultiSelect"] }, { kind: "directive", type: i1$3.TagTemplateDirective, selector: "[kendoMultiSelectTagTemplate],[kendoMultiSelectTreeTagTemplate]" }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: KitInputMessageComponent, selector: "kit-input-message", inputs: ["icon", "message"] }, { kind: "component", type: KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
4428
4428
|
}
|
|
4429
4429
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: KitMultiselectComponent, decorators: [{
|
|
4430
4430
|
type: Component,
|
|
@@ -4441,7 +4441,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
|
|
|
4441
4441
|
KitInputMessageComponent,
|
|
4442
4442
|
KitInputLabelComponent,
|
|
4443
4443
|
NgClass,
|
|
4444
|
-
], template: "<div class=\"kit-multiselect\"\n [class.disabled]=\"disabled\"\n [class.all-option-selected]=\"hasSelectedAllOption\">\n @if (label) {\n <kit-input-label class=\"label\"\n [text]=\"label\"\n [for]=\"multiselect\"\n ></kit-input-label>\n }\n <kendo-multiselect #multiselect\n valueField=\"value\"\n textField=\"text\"\n [ngClass]=\"size()\"\n [data]=\"items\"\n [disabled]=\"disabled\"\n [autoClose]=\"autoClose\"\n [placeholder]=\"placeholder\"\n [valuePrimitive]=\"true\"\n [itemDisabled]=\"onItemDisabled()\"\n [popupSettings]=\"buildPopupSettings()\"\n [tagMapper]=\"tagMapper()\"\n [
|
|
4444
|
+
], template: "<div class=\"kit-multiselect\"\n [class.disabled]=\"disabled\"\n [class.all-option-selected]=\"hasSelectedAllOption\">\n @if (label) {\n <kit-input-label class=\"label\"\n [text]=\"label\"\n [for]=\"multiselect\"\n ></kit-input-label>\n }\n <kendo-multiselect #multiselect\n valueField=\"value\"\n textField=\"text\"\n kendoDropDownFilter\n [ngClass]=\"size()\"\n [data]=\"items\"\n [disabled]=\"disabled\"\n [autoClose]=\"autoClose\"\n [placeholder]=\"placeholder\"\n [valuePrimitive]=\"true\"\n [itemDisabled]=\"onItemDisabled()\"\n [popupSettings]=\"buildPopupSettings()\"\n [tagMapper]=\"tagMapper()\"\n [checkboxes]=\"useCheckboxes()\"\n [listHeight]=\"listHeight()\"\n [(ngModel)]=\"selectedItems\">\n <ng-template kendoMultiSelectTagTemplate let-dataItem>\n <span class=\"chip-text\"\n [class.all-option]=\"dataItem.value === allOption().value\"\n [ngClass]=\"dataItem?.optionClass\">\n {{ dataItem?.text }}\n </span>\n <kit-svg-icon class=\"chip-icon\"\n [icon]=\"KitSvgIcon.CROSS\"\n ></kit-svg-icon>\n </ng-template>\n <ng-template kendoMultiSelectItemTemplate let-dataItem>\n <span class=\"option-text\"\n [ngClass]=\"dataItem?.optionClass\">{{ dataItem?.text }}</span>\n <kit-svg-icon class=\"option-icon\"\n [icon]=\"KitSvgIcon.CHECK\"\n ></kit-svg-icon>\n </ng-template>\n </kendo-multiselect>\n\n @if (messageText) {\n <kit-input-message [icon]=\"messageIcon\"\n [message]=\"messageText\"\n ></kit-input-message>\n }\n</div>\n", styles: [".kit-multiselect .label{display:block;margin-bottom:4px}.kit-multiselect .k-multiselect{width:100%;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-white)}.kit-multiselect .k-multiselect:hover{border-color:var(--ui-kit-color-hover)}.kit-multiselect .k-multiselect.k-focus{box-shadow:none}.kit-multiselect .k-multiselect.small{min-height:30px;border-radius:4px}.kit-multiselect .k-multiselect.small .k-input-values{padding:5px 7px}.kit-multiselect .k-multiselect.small .k-chip{height:20px;border-radius:4px}.kit-multiselect .k-multiselect.default{min-height:40px;border-radius:8px}.kit-multiselect .k-multiselect.default .k-input-values{padding:7px 12px}.kit-multiselect .k-multiselect.default .k-chip{height:24px;border-radius:8px}.kit-multiselect .k-input .k-input-inner{padding:0}.kit-multiselect .k-input-values{gap:8px}.kit-multiselect .k-input-inner{font-size:14px;font-weight:400}.kit-multiselect .k-input-inner::placeholder{color:var(--ui-kit-color-grey-12)}.kit-multiselect .k-chip{display:flex;align-items:center;position:relative;padding:0 8px;border:1px solid var(--ui-kit-color-grey-11);background:var(--ui-kit-color-grey-13)}.kit-multiselect .k-chip-label{display:flex;align-items:center;gap:4px;line-height:1}.kit-multiselect .k-chip-actions{position:absolute;right:8px;width:12px;height:12px;opacity:0}.kit-multiselect .k-chip-action{display:flex;padding:0;cursor:pointer}.kit-multiselect .k-chip-content:has(+.k-chip-actions:hover) .chip-icon{stroke:var(--ui-kit-color-main)}.kit-multiselect .k-chip .chip-text{color:var(--ui-kit-color-grey-10);font-size:12px;font-weight:500}.kit-multiselect .k-chip .chip-icon{display:block;width:12px;height:12px;stroke:var(--ui-kit-color-grey-12);cursor:pointer}.kit-multiselect .k-chip .k-icon{width:12px;height:12px}.kit-multiselect .k-chip:has(.chip-text.all-option){display:flex}.kit-multiselect .k-clear-value{margin-right:12px;padding:0;opacity:1;color:var(--ui-kit-color-grey-12)}.kit-multiselect .k-clear-value:hover{color:var(--ui-kit-color-main)}.kit-multiselect.disabled .k-multiselect{opacity:1;filter:none;background-color:var(--ui-kit-color-grey-13)}.kit-multiselect.disabled .chip-text{color:var(--ui-kit-color-grey-12)}.kit-multiselect:focus-within .k-multiselect{border-color:var(--ui-kit-color-main);box-shadow:0 0 0 2px var(--ui-kit-color-focus)}.kit-multiselect.all-option-selected .k-chip{display:none}.kit-multiselect-popup{margin-top:10px;padding:4px;border:none;border-radius:8px;box-shadow:0 9px 28px 8px #0000000d,0 3px 6px -4px #0000001f,0 6px 16px #00000014;background-color:var(--ui-kit-color-white)}.kit-multiselect-popup .k-list-item{padding:6px 12px;background-color:var(--ui-kit-color-white);font-size:14px;font-weight:400;box-shadow:none;border-radius:4px;color:var(--ui-kit-color-grey-10)}.kit-multiselect-popup .k-list-item:hover{color:var(--ui-kit-color-main)}.kit-multiselect-popup .k-list-item .option-icon{display:none;width:16px;height:16px;fill:none;stroke:var(--ui-kit-color-main)}.kit-multiselect-popup .k-list-item.k-disabled{color:var(--ui-kit-color-grey-12)}.kit-multiselect-popup .k-list-item.k-selected{display:flex;align-items:center;background-color:var(--ui-kit-color-grey-13)}.kit-multiselect-popup .k-list-item.k-selected .option-text{flex:1}.kit-multiselect-popup .k-list-item.k-selected .option-icon{display:block}.kit-multiselect-popup .k-checkbox{background-color:var(--ui-kit-color-grey-13);border:1px solid var(--ui-kit-color-grey-11);margin-right:4px}.kit-multiselect-popup .k-checkbox:checked{border-color:var(--ui-kit-color-main);background-color:var(--ui-kit-color-main)}\n"] }]
|
|
4445
4445
|
}], propDecorators: { items: [{
|
|
4446
4446
|
type: Input
|
|
4447
4447
|
}], selectedItems: [{
|
|
@@ -6112,7 +6112,7 @@ class KitDataFieldComponent {
|
|
|
6112
6112
|
this.kitTooltipPosition = KitTooltipPosition;
|
|
6113
6113
|
}
|
|
6114
6114
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: KitDataFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6115
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: KitDataFieldComponent, isStandalone: true, selector: "kit-data-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, tooltipText: { classPropertyName: "tooltipText", publicName: "tooltipText", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconType: { classPropertyName: "iconType", publicName: "iconType", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"kit-data-field\"\n [ngClass]=\"state()\">\n <div class=\"kit-data-field-label\">\n {{ label() }}\n </div>\n <div class=\"kit-data-field-value\">\n <div class=\"kit-data-field-text\">\n {{ value() || defaultValue }}\n </div>\n @if (icon()) {\n <kit-svg-icon kitTooltip\n kitTooltipFilter=\".kit-data-field-icon\"\n class=\"kit-data-field-icon\"\n [kitTooltipVisible]=\"!!tooltipText()\"\n [class.has-tooltip]=\"!!tooltipText()\"\n [kitTooltipPosition]=\"kitTooltipPosition.TOP\"\n [icon]=\"icon()\"\n [title]=\"tooltipText()\"\n [ngClass]=\"iconType() ?? kitSvgIconType.FILL\"\n ></kit-svg-icon>\n }\n </div>\n</div>\n", styles: [".kit-data-field{display:flex;flex-direction:column;gap:2px}.kit-data-field.default .kit-data-field-label{color:var(--ui-kit-color-main)}.kit-data-field.default .kit-data-field-icon.fill{fill:var(--ui-kit-color-main);stroke:none}.kit-data-field.default .kit-data-field-icon.stroke{stroke:var(--ui-kit-color-main);fill:none}.kit-data-field.warning .kit-data-field-label{color:var(--ui-kit-color-orange)}.kit-data-field.warning .kit-data-field-icon.fill{fill:var(--ui-kit-color-orange);stroke:none}.kit-data-field.warning .kit-data-field-icon.stroke{stroke:var(--ui-kit-color-orange);fill:none}.kit-data-field-label{font-size:14px;font-weight:500;line-height:20px}.kit-data-field-value{display:flex;align-items:center;gap:15px}.kit-data-field-text{color:var(--ui-kit-color-grey-14);font-size:24px;font-weight:400;letter-spacing:-1.2px;line-height:30px}.kit-data-field-icon{width:20px;height:20px}.kit-data-field-icon.has-tooltip{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "directive", type: KitTooltipDirective, selector: "[kitTooltip]", inputs: ["kitTooltipPosition", "kitTooltipFilter", "kitTooltipTemplateRef", "kitTooltipVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6115
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: KitDataFieldComponent, isStandalone: true, selector: "kit-data-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, tooltipText: { classPropertyName: "tooltipText", publicName: "tooltipText", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconType: { classPropertyName: "iconType", publicName: "iconType", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"kit-data-field\"\n [ngClass]=\"state()\">\n <div class=\"kit-data-field-label\">\n {{ label() }}\n </div>\n <div class=\"kit-data-field-value\">\n <div class=\"kit-data-field-text\">\n {{ value() || defaultValue }}\n </div>\n @if (icon()) {\n <kit-svg-icon kitTooltip\n kitTooltipFilter=\".kit-data-field-icon\"\n class=\"kit-data-field-icon\"\n [kitTooltipVisible]=\"!!tooltipText()\"\n [class.has-tooltip]=\"!!tooltipText()\"\n [kitTooltipPosition]=\"kitTooltipPosition.TOP\"\n [icon]=\"icon()\"\n [title]=\"tooltipText()\"\n [ngClass]=\"iconType() ?? kitSvgIconType.FILL\"\n ></kit-svg-icon>\n }\n </div>\n</div>\n", styles: [".kit-data-field{display:flex;flex-direction:column;gap:2px}.kit-data-field.default .kit-data-field-label{color:var(--ui-kit-color-main)}.kit-data-field.default .kit-data-field-icon.fill{fill:var(--ui-kit-color-main);stroke:none}.kit-data-field.default .kit-data-field-icon.stroke{stroke:var(--ui-kit-color-main);fill:none}.kit-data-field.warning .kit-data-field-label{color:var(--ui-kit-color-orange)}.kit-data-field.warning .kit-data-field-icon.fill{fill:var(--ui-kit-color-orange);stroke:none}.kit-data-field.warning .kit-data-field-icon.stroke{stroke:var(--ui-kit-color-orange);fill:none}.kit-data-field-label{font-size:14px;font-weight:500;line-height:20px}.kit-data-field-value{display:flex;align-items:center;gap:15px}.kit-data-field-text{padding-right:1px;color:var(--ui-kit-color-grey-14);font-size:24px;font-weight:400;letter-spacing:-1.2px;line-height:30px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.kit-data-field-icon{flex-shrink:0;width:20px;height:20px}.kit-data-field-icon.has-tooltip{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "directive", type: KitTooltipDirective, selector: "[kitTooltip]", inputs: ["kitTooltipPosition", "kitTooltipFilter", "kitTooltipTemplateRef", "kitTooltipVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6116
6116
|
}
|
|
6117
6117
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: KitDataFieldComponent, decorators: [{
|
|
6118
6118
|
type: Component,
|
|
@@ -6120,7 +6120,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
|
|
|
6120
6120
|
NgClass,
|
|
6121
6121
|
KitSvgIconComponent,
|
|
6122
6122
|
KitTooltipDirective,
|
|
6123
|
-
], template: "<div class=\"kit-data-field\"\n [ngClass]=\"state()\">\n <div class=\"kit-data-field-label\">\n {{ label() }}\n </div>\n <div class=\"kit-data-field-value\">\n <div class=\"kit-data-field-text\">\n {{ value() || defaultValue }}\n </div>\n @if (icon()) {\n <kit-svg-icon kitTooltip\n kitTooltipFilter=\".kit-data-field-icon\"\n class=\"kit-data-field-icon\"\n [kitTooltipVisible]=\"!!tooltipText()\"\n [class.has-tooltip]=\"!!tooltipText()\"\n [kitTooltipPosition]=\"kitTooltipPosition.TOP\"\n [icon]=\"icon()\"\n [title]=\"tooltipText()\"\n [ngClass]=\"iconType() ?? kitSvgIconType.FILL\"\n ></kit-svg-icon>\n }\n </div>\n</div>\n", styles: [".kit-data-field{display:flex;flex-direction:column;gap:2px}.kit-data-field.default .kit-data-field-label{color:var(--ui-kit-color-main)}.kit-data-field.default .kit-data-field-icon.fill{fill:var(--ui-kit-color-main);stroke:none}.kit-data-field.default .kit-data-field-icon.stroke{stroke:var(--ui-kit-color-main);fill:none}.kit-data-field.warning .kit-data-field-label{color:var(--ui-kit-color-orange)}.kit-data-field.warning .kit-data-field-icon.fill{fill:var(--ui-kit-color-orange);stroke:none}.kit-data-field.warning .kit-data-field-icon.stroke{stroke:var(--ui-kit-color-orange);fill:none}.kit-data-field-label{font-size:14px;font-weight:500;line-height:20px}.kit-data-field-value{display:flex;align-items:center;gap:15px}.kit-data-field-text{color:var(--ui-kit-color-grey-14);font-size:24px;font-weight:400;letter-spacing:-1.2px;line-height:30px}.kit-data-field-icon{width:20px;height:20px}.kit-data-field-icon.has-tooltip{cursor:pointer}\n"] }]
|
|
6123
|
+
], template: "<div class=\"kit-data-field\"\n [ngClass]=\"state()\">\n <div class=\"kit-data-field-label\">\n {{ label() }}\n </div>\n <div class=\"kit-data-field-value\">\n <div class=\"kit-data-field-text\">\n {{ value() || defaultValue }}\n </div>\n @if (icon()) {\n <kit-svg-icon kitTooltip\n kitTooltipFilter=\".kit-data-field-icon\"\n class=\"kit-data-field-icon\"\n [kitTooltipVisible]=\"!!tooltipText()\"\n [class.has-tooltip]=\"!!tooltipText()\"\n [kitTooltipPosition]=\"kitTooltipPosition.TOP\"\n [icon]=\"icon()\"\n [title]=\"tooltipText()\"\n [ngClass]=\"iconType() ?? kitSvgIconType.FILL\"\n ></kit-svg-icon>\n }\n </div>\n</div>\n", styles: [".kit-data-field{display:flex;flex-direction:column;gap:2px}.kit-data-field.default .kit-data-field-label{color:var(--ui-kit-color-main)}.kit-data-field.default .kit-data-field-icon.fill{fill:var(--ui-kit-color-main);stroke:none}.kit-data-field.default .kit-data-field-icon.stroke{stroke:var(--ui-kit-color-main);fill:none}.kit-data-field.warning .kit-data-field-label{color:var(--ui-kit-color-orange)}.kit-data-field.warning .kit-data-field-icon.fill{fill:var(--ui-kit-color-orange);stroke:none}.kit-data-field.warning .kit-data-field-icon.stroke{stroke:var(--ui-kit-color-orange);fill:none}.kit-data-field-label{font-size:14px;font-weight:500;line-height:20px}.kit-data-field-value{display:flex;align-items:center;gap:15px}.kit-data-field-text{padding-right:1px;color:var(--ui-kit-color-grey-14);font-size:24px;font-weight:400;letter-spacing:-1.2px;line-height:30px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.kit-data-field-icon{flex-shrink:0;width:20px;height:20px}.kit-data-field-icon.has-tooltip{cursor:pointer}\n"] }]
|
|
6124
6124
|
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }], tooltipText: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltipText", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconType: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconType", required: false }] }] } });
|
|
6125
6125
|
|
|
6126
6126
|
class KitSearchBarComponent {
|
|
@@ -9871,6 +9871,7 @@ class KitEntityGridComponent {
|
|
|
9871
9871
|
this.rowClassFn = input(...(ngDevMode ? [undefined, { debugName: "rowClassFn" }] : []));
|
|
9872
9872
|
this.showArchiveToggle = input(false, ...(ngDevMode ? [{ debugName: "showArchiveToggle" }] : []));
|
|
9873
9873
|
this.showRefreshButton = input(false, ...(ngDevMode ? [{ debugName: "showRefreshButton" }] : []));
|
|
9874
|
+
this.searchVisible = input(true, ...(ngDevMode ? [{ debugName: "searchVisible" }] : []));
|
|
9874
9875
|
this.gridViewChanged = output();
|
|
9875
9876
|
this.archiveModeChanged = output();
|
|
9876
9877
|
this.refreshButtonClicked = output();
|
|
@@ -9941,10 +9942,10 @@ class KitEntityGridComponent {
|
|
|
9941
9942
|
this.refreshButtonClicked.emit();
|
|
9942
9943
|
}
|
|
9943
9944
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: KitEntityGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9944
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: KitEntityGridComponent, isStandalone: true, selector: "kit-entity-grid", inputs: { statesToReset: { classPropertyName: "statesToReset", publicName: "statesToReset", isSignal: true, isRequired: false, transformFunction: null }, 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: [
|
|
9945
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: KitEntityGridComponent, isStandalone: true, selector: "kit-entity-grid", inputs: { statesToReset: { classPropertyName: "statesToReset", publicName: "statesToReset", isSignal: true, isRequired: false, transformFunction: null }, 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 }, searchVisible: { classPropertyName: "searchVisible", publicName: "searchVisible", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { gridViewChanged: "gridViewChanged", archiveModeChanged: "archiveModeChanged", refreshButtonClicked: "refreshButtonClicked" }, providers: [
|
|
9945
9946
|
KitBreadcrumbsService,
|
|
9946
9947
|
KitGridUrlStateService,
|
|
9947
|
-
], 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 class=\"grid-column-manager\"\n [showLabel]=\"!searchIsOpen()\" />\n }\n </div>\n <div class=\"grid-header-search\">\n
|
|
9948
|
+
], 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 class=\"grid-column-manager\"\n [showLabel]=\"!searchIsOpen()\" />\n }\n </div>\n @if (searchVisible()) {\n <div class=\"grid-header-search\">\n <kit-grid-search #search\n [disabled]=\"isSearchDisabled()\"\n (toggleSearch)=\"searchIsOpen.set($event)\" />\n </div>\n }\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 class=\"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", "noRecordsText", "resizable", "gridDetailTemplate", "rowClassFn"], outputs: ["skipChange", "loadingChange", "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 }); }
|
|
9948
9949
|
}
|
|
9949
9950
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: KitEntityGridComponent, decorators: [{
|
|
9950
9951
|
type: Component,
|
|
@@ -9966,8 +9967,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
|
|
|
9966
9967
|
], providers: [
|
|
9967
9968
|
KitBreadcrumbsService,
|
|
9968
9969
|
KitGridUrlStateService,
|
|
9969
|
-
], 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 class=\"grid-column-manager\"\n [showLabel]=\"!searchIsOpen()\" />\n }\n </div>\n <div class=\"grid-header-search\">\n
|
|
9970
|
-
}], ctorParameters: () => [], propDecorators: { statesToReset: [{ type: i0.Input, args: [{ isSignal: true, alias: "statesToReset", required: false }] }], gridData: [{ type: i0.Input, args: [{ isSignal: true, alias: "gridData", required: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], gridColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "gridColumns", required: true }] }], defaultViewName: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultViewName", required: true }] }], viewGroup: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewGroup", required: true }] }], viewGroupConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewGroupConfig", required: true }] }], pdfOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pdfOptions", required: true }] }], getExportedData: [{ type: i0.Input, args: [{ isSignal: true, alias: "getExportedData", required: true }] }], defaultSorting: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultSorting", required: false }] }], filterExcludedColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterExcludedColumns", required: false }] }], systemViews: [{ type: i0.Input, args: [{ isSignal: true, alias: "systemViews", required: false }] }], translationMap: [{ type: i0.Input, args: [{ isSignal: true, alias: "translationMap", required: false }] }], isDetailTemplateVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDetailTemplateVisible", required: false }] }], detailTemplateExpandDisableIf: [{ type: i0.Input, args: [{ isSignal: true, alias: "detailTemplateExpandDisableIf", required: false }] }], gridHasData: [{ type: i0.Input, args: [{ isSignal: true, alias: "gridHasData", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], pagerInfoText: [{ type: i0.Input, args: [{ isSignal: true, alias: "pagerInfoText", required: false }] }], showBreadcrumbs: [{ type: i0.Input, args: [{ isSignal: true, alias: "showBreadcrumbs", required: false }] }], pageSizes: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizes", required: false }] }], rowClassFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowClassFn", required: false }] }], showArchiveToggle: [{ type: i0.Input, args: [{ isSignal: true, alias: "showArchiveToggle", required: false }] }], showRefreshButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRefreshButton", required: false }] }], gridViewChanged: [{ type: i0.Output, args: ["gridViewChanged"] }], archiveModeChanged: [{ type: i0.Output, args: ["archiveModeChanged"] }], refreshButtonClicked: [{ type: i0.Output, args: ["refreshButtonClicked"] }], search: [{ type: i0.ViewChild, args: ['search', { ...{ read: KitGridSearchComponent }, isSignal: true }] }], kitGridComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitGridComponent), { isSignal: true }] }], gridExportComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitGridExportComponent), { isSignal: true }] }], columns: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => KitGridColumnComponent), { isSignal: true }] }], gridDetailTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KitGridDetailTemplateDirective), { ...{
|
|
9970
|
+
], 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 class=\"grid-column-manager\"\n [showLabel]=\"!searchIsOpen()\" />\n }\n </div>\n @if (searchVisible()) {\n <div class=\"grid-header-search\">\n <kit-grid-search #search\n [disabled]=\"isSearchDisabled()\"\n (toggleSearch)=\"searchIsOpen.set($event)\" />\n </div>\n }\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 class=\"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"] }]
|
|
9971
|
+
}], ctorParameters: () => [], propDecorators: { statesToReset: [{ type: i0.Input, args: [{ isSignal: true, alias: "statesToReset", required: false }] }], gridData: [{ type: i0.Input, args: [{ isSignal: true, alias: "gridData", required: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], gridColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "gridColumns", required: true }] }], defaultViewName: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultViewName", required: true }] }], viewGroup: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewGroup", required: true }] }], viewGroupConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewGroupConfig", required: true }] }], pdfOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pdfOptions", required: true }] }], getExportedData: [{ type: i0.Input, args: [{ isSignal: true, alias: "getExportedData", required: true }] }], defaultSorting: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultSorting", required: false }] }], filterExcludedColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterExcludedColumns", required: false }] }], systemViews: [{ type: i0.Input, args: [{ isSignal: true, alias: "systemViews", required: false }] }], translationMap: [{ type: i0.Input, args: [{ isSignal: true, alias: "translationMap", required: false }] }], isDetailTemplateVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDetailTemplateVisible", required: false }] }], detailTemplateExpandDisableIf: [{ type: i0.Input, args: [{ isSignal: true, alias: "detailTemplateExpandDisableIf", required: false }] }], gridHasData: [{ type: i0.Input, args: [{ isSignal: true, alias: "gridHasData", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], pagerInfoText: [{ type: i0.Input, args: [{ isSignal: true, alias: "pagerInfoText", required: false }] }], showBreadcrumbs: [{ type: i0.Input, args: [{ isSignal: true, alias: "showBreadcrumbs", required: false }] }], pageSizes: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizes", required: false }] }], rowClassFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowClassFn", required: false }] }], showArchiveToggle: [{ type: i0.Input, args: [{ isSignal: true, alias: "showArchiveToggle", required: false }] }], showRefreshButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRefreshButton", required: false }] }], searchVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchVisible", required: false }] }], gridViewChanged: [{ type: i0.Output, args: ["gridViewChanged"] }], archiveModeChanged: [{ type: i0.Output, args: ["archiveModeChanged"] }], refreshButtonClicked: [{ type: i0.Output, args: ["refreshButtonClicked"] }], search: [{ type: i0.ViewChild, args: ['search', { ...{ read: KitGridSearchComponent }, isSignal: true }] }], kitGridComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitGridComponent), { isSignal: true }] }], gridExportComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitGridExportComponent), { isSignal: true }] }], columns: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => KitGridColumnComponent), { isSignal: true }] }], gridDetailTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KitGridDetailTemplateDirective), { ...{
|
|
9971
9972
|
read: TemplateRef,
|
|
9972
9973
|
}, isSignal: true }] }] } });
|
|
9973
9974
|
|