@masterteam/components 0.0.63 → 0.0.64
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/masterteam-components-avatar-text.mjs +3 -3
- package/fesm2022/masterteam-components-avatar.mjs +3 -3
- package/fesm2022/masterteam-components-breadcrumb.mjs +3 -3
- package/fesm2022/masterteam-components-button-group.mjs +3 -3
- package/fesm2022/masterteam-components-button.mjs +3 -3
- package/fesm2022/masterteam-components-card.mjs +3 -3
- package/fesm2022/masterteam-components-checkbox-field.mjs +3 -3
- package/fesm2022/masterteam-components-chip.mjs +3 -3
- package/fesm2022/masterteam-components-color-picker-field.mjs +3 -3
- package/fesm2022/masterteam-components-confirmation.mjs +6 -6
- package/fesm2022/masterteam-components-date-field.mjs +3 -3
- package/fesm2022/masterteam-components-dialog.mjs +3 -3
- package/fesm2022/masterteam-components-drawer.mjs +3 -3
- package/fesm2022/masterteam-components-dynamic-drawer.mjs +6 -6
- package/fesm2022/masterteam-components-editor-field.mjs +3 -3
- package/fesm2022/masterteam-components-field-validation.mjs +6 -6
- package/fesm2022/masterteam-components-formula-builder.mjs +3 -3
- package/fesm2022/masterteam-components-icon-field.mjs +3 -3
- package/fesm2022/masterteam-components-list.mjs +3 -3
- package/fesm2022/masterteam-components-menu.mjs +3 -3
- package/fesm2022/masterteam-components-modal.mjs +3 -3
- package/fesm2022/masterteam-components-module-summary-card.mjs +3 -3
- package/fesm2022/masterteam-components-multi-select-field.mjs +3 -3
- package/fesm2022/masterteam-components-number-field.mjs +3 -3
- package/fesm2022/masterteam-components-page-header.mjs +3 -3
- package/fesm2022/masterteam-components-page.mjs +3 -3
- package/fesm2022/masterteam-components-paginator.mjs +3 -3
- package/fesm2022/masterteam-components-pick-list-field.mjs +3 -3
- package/fesm2022/masterteam-components-radio-button-field.mjs +3 -3
- package/fesm2022/masterteam-components-radio-cards-field.mjs +3 -3
- package/fesm2022/masterteam-components-radio-cards.mjs +3 -3
- package/fesm2022/masterteam-components-select-field.mjs +3 -3
- package/fesm2022/masterteam-components-sidebar.mjs +3 -3
- package/fesm2022/masterteam-components-slider-field.mjs +3 -3
- package/fesm2022/masterteam-components-table.mjs +3 -3
- package/fesm2022/masterteam-components-tabs.mjs +3 -3
- package/fesm2022/masterteam-components-text-field.mjs +3 -3
- package/fesm2022/masterteam-components-textarea-field.mjs +3 -3
- package/fesm2022/masterteam-components-toast.mjs +6 -6
- package/fesm2022/masterteam-components-toggle-field.mjs +3 -3
- package/fesm2022/masterteam-components-tooltip.mjs +3 -3
- package/fesm2022/masterteam-components-topbar.mjs +3 -3
- package/fesm2022/masterteam-components-upload-field.mjs +12 -12
- package/fesm2022/masterteam-components-user-search-field.mjs +3 -3
- package/package.json +6 -5
|
@@ -70,10 +70,10 @@ class NumberField {
|
|
|
70
70
|
setDisabledState(disabled) {
|
|
71
71
|
this.disabled.set(disabled);
|
|
72
72
|
}
|
|
73
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
74
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
73
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: NumberField, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
74
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: NumberField, isStandalone: true, selector: "mt-number-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, pInputs: { classPropertyName: "pInputs", publicName: "pInputs", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, maxFractionDigits: { classPropertyName: "maxFractionDigits", publicName: "maxFractionDigits", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.styleClass" }, classAttribute: "grid gap-1" }, viewQueries: [{ propertyName: "inputNumber", first: true, predicate: ["inputNumber"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "@if (label()) {\n <label\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n [for]=\"ngControl?.name || label()\"\n >{{ label() }}</label\n >\n}\n<p-inputnumber\n #inputNumber\n [ngModel]=\"value()\"\n (ngModelChange)=\"onValueChange($event)\"\n (onBlur)=\"onTouched()\"\n [disabled]=\"disabled() || readonly()\"\n [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\n [format]=\"format()\"\n [min]=\"min()\"\n [max]=\"max()\"\n [maxFractionDigits]=\"maxFractionDigits()\"\n [invalid]=\"isInvalid(ngControl?.control)\"\n placeholder=\"{{ placeholder() ?? label() ?? '' }}\"\n styleClass=\"w-full\"\n inputStyleClass=\"w-full\"\n></p-inputnumber>\n\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\n", styles: [":host p-inputNumber{display:block;width:100%}:host p-inputNumber input{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i2.InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "component", type: FieldValidation, selector: "mt-field-validation", inputs: ["control", "touched"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
75
75
|
}
|
|
76
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
76
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: NumberField, decorators: [{
|
|
77
77
|
type: Component,
|
|
78
78
|
args: [{ selector: 'mt-number-field', standalone: true, imports: [FormsModule, InputNumberModule, FieldValidation], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
79
79
|
class: 'grid gap-1',
|
|
@@ -26,10 +26,10 @@ class PageHeader {
|
|
|
26
26
|
return this.rtl() ? 'arrow.arrow-narrow-right' : 'arrow.arrow-narrow-left';
|
|
27
27
|
}, { ...(ngDevMode ? { debugName: "backIcon" } : {}) });
|
|
28
28
|
hasTabs = computed(() => this.tabs().length > 0, { ...(ngDevMode ? { debugName: "hasTabs" } : {}) });
|
|
29
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
30
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
29
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PageHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
30
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: PageHeader, isStandalone: true, selector: "mt-page-header", inputs: { backButton: { classPropertyName: "backButton", publicName: "backButton", isSignal: true, isRequired: false, transformFunction: null }, backButtonIcon: { classPropertyName: "backButtonIcon", publicName: "backButtonIcon", isSignal: true, isRequired: false, transformFunction: null }, avatarIcon: { classPropertyName: "avatarIcon", publicName: "avatarIcon", isSignal: true, isRequired: false, transformFunction: null }, avatarStyle: { classPropertyName: "avatarStyle", publicName: "avatarStyle", isSignal: true, isRequired: false, transformFunction: null }, avatarShape: { classPropertyName: "avatarShape", publicName: "avatarShape", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null }, activeTab: { classPropertyName: "activeTab", publicName: "activeTab", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { backButtonClick: "backButtonClick", tabChange: "tabChange" }, queries: [{ propertyName: "titleEnd", first: true, predicate: ["titleEnd"], descendants: true, isSignal: true }, { propertyName: "headerEnd", first: true, predicate: ["headerEnd"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n class=\"grid grid-cols-3 bg-content items-center p-3 border-b border-surface min-h-18.5\"\n>\n <div class=\"flex gap-2 items-center\">\n @if (backButton()) {\n <mt-button\n [text]=\"true\"\n [icon]=\"backIcon()\"\n size=\"large\"\n (click)=\"backButtonClick.emit()\"\n >\n </mt-button>\n }\n\n @if (avatarIcon()) {\n <mt-avatar\n [icon]=\"avatarIcon()\"\n [shape]=\"avatarShape()\"\n [style]=\"avatarStyle()\"\n >\n </mt-avatar>\n }\n\n <h3 class=\"font-bold text-xl\">{{ title() }}</h3>\n\n @if (titleEnd(); as template) {\n <ng-container [ngTemplateOutlet]=\"template\" />\n }\n </div>\n\n <div class=\"justify-self-center\">\n @if (hasTabs()) {\n <mt-tabs\n [options]=\"tabs()\"\n [active]=\"activeTab()\"\n size=\"large\"\n (onChange)=\"tabChange.emit($event)\"\n >\n </mt-tabs>\n }\n </div>\n\n <div class=\"justify-self-end\">\n @if (headerEnd(); as template) {\n <ng-container [ngTemplateOutlet]=\"template\" />\n }\n </div>\n</div>\n", dependencies: [{ kind: "component", type: Avatar, selector: "mt-avatar", inputs: ["label", "icon", "image", "styleClass", "size", "shape", "badge", "badgeSize", "badgeSeverity"], outputs: ["onImageError"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: Tabs, selector: "mt-tabs", inputs: ["options", "optionLabel", "optionValue", "active", "size", "fluid", "disabled"], outputs: ["activeChange", "onChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
31
31
|
}
|
|
32
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
32
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PageHeader, decorators: [{
|
|
33
33
|
type: Component,
|
|
34
34
|
args: [{ selector: 'mt-page-header', standalone: true, imports: [Avatar, Button, Tabs, NgTemplateOutlet], template: "<div\n class=\"grid grid-cols-3 bg-content items-center p-3 border-b border-surface min-h-18.5\"\n>\n <div class=\"flex gap-2 items-center\">\n @if (backButton()) {\n <mt-button\n [text]=\"true\"\n [icon]=\"backIcon()\"\n size=\"large\"\n (click)=\"backButtonClick.emit()\"\n >\n </mt-button>\n }\n\n @if (avatarIcon()) {\n <mt-avatar\n [icon]=\"avatarIcon()\"\n [shape]=\"avatarShape()\"\n [style]=\"avatarStyle()\"\n >\n </mt-avatar>\n }\n\n <h3 class=\"font-bold text-xl\">{{ title() }}</h3>\n\n @if (titleEnd(); as template) {\n <ng-container [ngTemplateOutlet]=\"template\" />\n }\n </div>\n\n <div class=\"justify-self-center\">\n @if (hasTabs()) {\n <mt-tabs\n [options]=\"tabs()\"\n [active]=\"activeTab()\"\n size=\"large\"\n (onChange)=\"tabChange.emit($event)\"\n >\n </mt-tabs>\n }\n </div>\n\n <div class=\"justify-self-end\">\n @if (headerEnd(); as template) {\n <ng-container [ngTemplateOutlet]=\"template\" />\n }\n </div>\n</div>\n" }]
|
|
35
35
|
}], propDecorators: { backButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "backButton", required: false }] }], backButtonIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "backButtonIcon", required: false }] }], avatarIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarIcon", required: false }] }], avatarStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarStyle", required: false }] }], avatarShape: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarShape", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], tabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabs", required: false }] }], activeTab: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeTab", required: false }] }], titleEnd: [{ type: i0.ContentChild, args: ['titleEnd', { isSignal: true }] }], headerEnd: [{ type: i0.ContentChild, args: ['headerEnd', { isSignal: true }] }], backButtonClick: [{ type: i0.Output, args: ["backButtonClick"] }], tabChange: [{ type: i0.Output, args: ["tabChange"] }] } });
|
|
@@ -19,10 +19,10 @@ class Page {
|
|
|
19
19
|
content = viewChild('content', { ...(ngDevMode ? { debugName: "content" } : {}) });
|
|
20
20
|
backButtonClick = output();
|
|
21
21
|
tabChange = output();
|
|
22
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
23
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
22
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: Page, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
23
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: Page, isStandalone: true, selector: "mt-page", inputs: { backButton: { classPropertyName: "backButton", publicName: "backButton", isSignal: true, isRequired: false, transformFunction: null }, backButtonIcon: { classPropertyName: "backButtonIcon", publicName: "backButtonIcon", isSignal: true, isRequired: false, transformFunction: null }, avatarIcon: { classPropertyName: "avatarIcon", publicName: "avatarIcon", isSignal: true, isRequired: false, transformFunction: null }, avatarStyle: { classPropertyName: "avatarStyle", publicName: "avatarStyle", isSignal: true, isRequired: false, transformFunction: null }, avatarShape: { classPropertyName: "avatarShape", publicName: "avatarShape", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null }, activeTab: { classPropertyName: "activeTab", publicName: "activeTab", isSignal: true, isRequired: false, transformFunction: null }, contentClass: { classPropertyName: "contentClass", publicName: "contentClass", isSignal: true, isRequired: false, transformFunction: null }, contentId: { classPropertyName: "contentId", publicName: "contentId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { backButtonClick: "backButtonClick", tabChange: "tabChange" }, queries: [{ propertyName: "titleEnd", first: true, predicate: ["titleEnd"], descendants: true, isSignal: true }, { propertyName: "headerEnd", first: true, predicate: ["headerEnd"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"page h-full flex flex-col\">\n <mt-page-header\n [backButton]=\"backButton()\"\n [backButtonIcon]=\"backButtonIcon()\"\n [avatarIcon]=\"avatarIcon()\"\n [avatarStyle]=\"avatarStyle()\"\n [avatarShape]=\"avatarShape()\"\n [title]=\"title()\"\n [tabs]=\"tabs()\"\n [activeTab]=\"activeTab()\"\n (backButtonClick)=\"backButtonClick.emit()\"\n (tabChange)=\"tabChange.emit($event)\"\n >\n @if (titleEnd(); as template) {\n <ng-template #titleEnd>\n <ng-container [ngTemplateOutlet]=\"template\" />\n </ng-template>\n }\n\n @if (headerEnd(); as template) {\n <ng-template #headerEnd>\n <ng-container [ngTemplateOutlet]=\"template\" />\n </ng-template>\n }\n </mt-page-header>\n\n <div\n [class]=\"'flex-1 overflow-y-auto p-5 relative ' + contentClass()\"\n [id]=\"contentId() ?? 'page-content'\"\n #content\n >\n <ng-content></ng-content>\n </div>\n</div>\n", dependencies: [{ kind: "component", type: PageHeader, selector: "mt-page-header", inputs: ["backButton", "backButtonIcon", "avatarIcon", "avatarStyle", "avatarShape", "title", "tabs", "activeTab"], outputs: ["backButtonClick", "tabChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
24
24
|
}
|
|
25
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
25
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: Page, decorators: [{
|
|
26
26
|
type: Component,
|
|
27
27
|
args: [{ selector: 'mt-page', standalone: true, imports: [PageHeader, NgTemplateOutlet], template: "<div class=\"page h-full flex flex-col\">\n <mt-page-header\n [backButton]=\"backButton()\"\n [backButtonIcon]=\"backButtonIcon()\"\n [avatarIcon]=\"avatarIcon()\"\n [avatarStyle]=\"avatarStyle()\"\n [avatarShape]=\"avatarShape()\"\n [title]=\"title()\"\n [tabs]=\"tabs()\"\n [activeTab]=\"activeTab()\"\n (backButtonClick)=\"backButtonClick.emit()\"\n (tabChange)=\"tabChange.emit($event)\"\n >\n @if (titleEnd(); as template) {\n <ng-template #titleEnd>\n <ng-container [ngTemplateOutlet]=\"template\" />\n </ng-template>\n }\n\n @if (headerEnd(); as template) {\n <ng-template #headerEnd>\n <ng-container [ngTemplateOutlet]=\"template\" />\n </ng-template>\n }\n </mt-page-header>\n\n <div\n [class]=\"'flex-1 overflow-y-auto p-5 relative ' + contentClass()\"\n [id]=\"contentId() ?? 'page-content'\"\n #content\n >\n <ng-content></ng-content>\n </div>\n</div>\n" }]
|
|
28
28
|
}], propDecorators: { backButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "backButton", required: false }] }], backButtonIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "backButtonIcon", required: false }] }], avatarIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarIcon", required: false }] }], avatarStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarStyle", required: false }] }], avatarShape: [{ type: i0.Input, args: [{ isSignal: true, alias: "avatarShape", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], tabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabs", required: false }] }], activeTab: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeTab", required: false }] }], contentClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentClass", required: false }] }], contentId: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentId", required: false }] }], titleEnd: [{ type: i0.ContentChild, args: ['titleEnd', { isSignal: true }] }], headerEnd: [{ type: i0.ContentChild, args: ['headerEnd', { isSignal: true }] }], content: [{ type: i0.ViewChild, args: ['content', { isSignal: true }] }], backButtonClick: [{ type: i0.Output, args: ["backButtonClick"] }], tabChange: [{ type: i0.Output, args: ["tabChange"] }] } });
|
|
@@ -26,10 +26,10 @@ class Paginator {
|
|
|
26
26
|
this.rows.set(event.rows);
|
|
27
27
|
this.onPageChange.emit(event);
|
|
28
28
|
}
|
|
29
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
30
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.
|
|
29
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: Paginator, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
30
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.2", type: Paginator, isStandalone: true, selector: "mt-paginator", inputs: { rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: false, transformFunction: null }, first: { classPropertyName: "first", publicName: "first", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, rowsPerPageOptions: { classPropertyName: "rowsPerPageOptions", publicName: "rowsPerPageOptions", isSignal: true, isRequired: false, transformFunction: null }, showFirstLastIcon: { classPropertyName: "showFirstLastIcon", publicName: "showFirstLastIcon", isSignal: true, isRequired: false, transformFunction: null }, showCurrentPageReport: { classPropertyName: "showCurrentPageReport", publicName: "showCurrentPageReport", isSignal: true, isRequired: false, transformFunction: null }, fluid: { classPropertyName: "fluid", publicName: "fluid", isSignal: true, isRequired: false, transformFunction: null }, pageLinkSize: { classPropertyName: "pageLinkSize", publicName: "pageLinkSize", isSignal: true, isRequired: false, transformFunction: null }, alwaysShow: { classPropertyName: "alwaysShow", publicName: "alwaysShow", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rows: "rowsChange", first: "firstChange", page: "pageChange", onPageChange: "onPageChange" }, host: { classAttribute: "grid gap-1" }, ngImport: i0, template: "<p-paginator\n [rows]=\"rows()\"\n [totalRecords]=\"totalRecords()\"\n [first]=\"first()\"\n [pageLinkSize]=\"pageLinkSize()\"\n [rowsPerPageOptions]=\"rowsPerPageOptions()\"\n [showFirstLastIcon]=\"showFirstLastIcon()\"\n [showCurrentPageReport]=\"showCurrentPageReport()\"\n [alwaysShow]=\"alwaysShow()\"\n (onPageChange)=\"onPaginatorChange($event)\"\n appendTo=\"body\"\n>\n <ng-template pTemplate=\"previouspagelinkicon\">\n <div class=\"flex items-center justify-center px-3 gap-3\">\n <svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M12.8346 6.99984H1.16797M1.16797 6.99984L7.0013 12.8332M1.16797 6.99984L7.0013 1.1665\"\n stroke=\"#414651\"\n stroke-width=\"1.67\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n <span class=\"rtl:rotate-180\">\n {{ \"components.paginator.previous\" | transloco }}\n </span>\n </div>\n </ng-template>\n\n <ng-template pTemplate=\"nextpagelinkicon\">\n <div class=\"flex items-center justify-center px-3 gap-3\">\n <span class=\"rtl:rotate-180\">\n {{ \"components.paginator.next\" | transloco }}</span\n >\n <svg\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M1.16797 6.99984H12.8346M12.8346 6.99984L7.0013 1.1665M12.8346 6.99984L7.0013 12.8332\"\n stroke=\"#414651\"\n stroke-width=\"1.67\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n </ng-template>\n</p-paginator>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: PaginatorModule }, { kind: "component", type: i1.Paginator, selector: "p-paginator", inputs: ["pageLinkSize", "styleClass", "alwaysShow", "dropdownAppendTo", "templateLeft", "templateRight", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "jumpToPageItemTemplate", "showPageLinks", "locale", "dropdownItemTemplate", "first", "appendTo"], outputs: ["onPageChange"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i3.TranslocoPipe, name: "transloco" }] });
|
|
31
31
|
}
|
|
32
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
32
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: Paginator, decorators: [{
|
|
33
33
|
type: Component,
|
|
34
34
|
args: [{ selector: 'mt-paginator', standalone: true, imports: [FormsModule, PaginatorModule, TranslocoModule], host: {
|
|
35
35
|
class: 'grid gap-1',
|
|
@@ -166,10 +166,10 @@ class PickListField {
|
|
|
166
166
|
const entryId = this.getIdentifier(entry);
|
|
167
167
|
return options.find((option) => this.getIdentifier(option) === entryId);
|
|
168
168
|
}
|
|
169
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
170
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
169
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PickListField, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
170
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: PickListField, isStandalone: true, selector: "mt-pick-list-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: false, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: false, transformFunction: null }, sourceHeader: { classPropertyName: "sourceHeader", publicName: "sourceHeader", isSignal: true, isRequired: false, transformFunction: null }, targetHeader: { classPropertyName: "targetHeader", publicName: "targetHeader", isSignal: true, isRequired: false, transformFunction: null }, showSourceControls: { classPropertyName: "showSourceControls", publicName: "showSourceControls", isSignal: true, isRequired: false, transformFunction: null }, showTargetControls: { classPropertyName: "showTargetControls", publicName: "showTargetControls", isSignal: true, isRequired: false, transformFunction: null }, showSourceFilter: { classPropertyName: "showSourceFilter", publicName: "showSourceFilter", isSignal: true, isRequired: false, transformFunction: null }, showTargetFilter: { classPropertyName: "showTargetFilter", publicName: "showTargetFilter", isSignal: true, isRequired: false, transformFunction: null }, filterBy: { classPropertyName: "filterBy", publicName: "filterBy", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, filterLocale: { classPropertyName: "filterLocale", publicName: "filterLocale", isSignal: true, isRequired: false, transformFunction: null }, filterMatchMode: { classPropertyName: "filterMatchMode", publicName: "filterMatchMode", isSignal: true, isRequired: false, transformFunction: null }, dragdrop: { classPropertyName: "dragdrop", publicName: "dragdrop", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.styleClass" }, classAttribute: "grid gap-1" }, viewQueries: [{ propertyName: "pickList", first: true, predicate: ["pickList"], descendants: true }], ngImport: i0, template: "@if (label()) {\n <label\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n [for]=\"ngControl?.name || label()\"\n >{{ label() }}</label\n >\n}\n<p-pickList\n #pickList\n [source]=\"sourceItems()\"\n [target]=\"targetItems()\"\n (onMoveToTarget)=\"onInteractiveChange()\"\n (onMoveToSource)=\"onInteractiveChange()\"\n (onMoveAllToTarget)=\"onInteractiveChange()\"\n (onMoveAllToSource)=\"onInteractiveChange()\"\n (onTargetReorder)=\"onInteractiveChange()\"\n (onSourceReorder)=\"onInteractiveChange()\"\n (onBlur)=\"handleBlur()\"\n [filterBy]=\"filterBy() || optionLabel()\"\n [showSourceControls]=\"showSourceControls()\"\n [showTargetControls]=\"showTargetControls()\"\n [showSourceFilter]=\"showSourceFilter()\"\n [showTargetFilter]=\"showTargetFilter()\"\n [sourceHeader]=\"sourceHeader()\"\n [targetHeader]=\"targetHeader()\"\n [dragdrop]=\"dragdrop()\"\n [responsive]=\"responsive()\"\n [disabled]=\"disabled() || readonly()\"\n [styleClass]=\"'w-full relative'\"\n [class.p-invalid]=\"isInvalid(ngControl?.control)\"\n>\n <ng-template let-item pTemplate=\"item\">\n {{ displayLabel(item) }}\n </ng-template>\n</p-pickList>\n\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: PickListModule }, { kind: "component", type: i1.PickList, selector: "p-pickList, p-picklist, p-pick-list", inputs: ["hostName", "source", "target", "dataKey", "sourceHeader", "tabindex", "rightButtonAriaLabel", "leftButtonAriaLabel", "allRightButtonAriaLabel", "allLeftButtonAriaLabel", "upButtonAriaLabel", "downButtonAriaLabel", "topButtonAriaLabel", "bottomButtonAriaLabel", "sourceAriaLabel", "targetAriaLabel", "targetHeader", "responsive", "filterBy", "filterLocale", "trackBy", "sourceTrackBy", "targetTrackBy", "showSourceFilter", "showTargetFilter", "metaKeySelection", "dragdrop", "style", "styleClass", "sourceStyle", "targetStyle", "showSourceControls", "showTargetControls", "sourceFilterPlaceholder", "targetFilterPlaceholder", "disabled", "sourceOptionDisabled", "targetOptionDisabled", "ariaSourceFilterLabel", "ariaTargetFilterLabel", "filterMatchMode", "stripedRows", "keepSelection", "scrollHeight", "autoOptionFocus", "buttonProps", "moveUpButtonProps", "moveTopButtonProps", "moveDownButtonProps", "moveBottomButtonProps", "moveToTargetProps", "moveAllToTargetProps", "moveToSourceProps", "moveAllToSourceProps", "breakpoint"], outputs: ["sourceChange", "targetChange", "onMoveToSource", "onMoveAllToSource", "onMoveAllToTarget", "onMoveToTarget", "onSourceReorder", "onTargetReorder", "onSourceSelect", "onTargetSelect", "onSourceFilter", "onTargetFilter", "onFocus", "onBlur"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: FieldValidation, selector: "mt-field-validation", inputs: ["control", "touched"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
171
171
|
}
|
|
172
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
172
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: PickListField, decorators: [{
|
|
173
173
|
type: Component,
|
|
174
174
|
args: [{ selector: 'mt-pick-list-field', imports: [PickListModule, FieldValidation], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
175
175
|
class: 'grid gap-1',
|
|
@@ -67,10 +67,10 @@ class RadioButtonField {
|
|
|
67
67
|
setDisabledState(disabled) {
|
|
68
68
|
this.disabled.set(disabled);
|
|
69
69
|
}
|
|
70
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
71
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
70
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: RadioButtonField, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
71
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: RadioButtonField, isStandalone: true, selector: "mt-radio-button-field", inputs: { labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, pInputs: { classPropertyName: "pInputs", publicName: "pInputs", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChange: "onChange" }, host: { classAttribute: "grid gap-1" }, ngImport: i0, template: "@if (label()) {\n <label\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n >{{ label() }}</label\n >\n}\n\n<div\n class=\"flex gap-3\"\n [class.flex-col]=\"orientation() === 'vertical'\"\n [class.flex-row]=\"orientation() === 'horizontal'\"\n [class.flex-wrap]=\"orientation() === 'horizontal'\"\n>\n @for (option of options(); track option) {\n <div\n class=\"flex gap-1\"\n [class.items-center]=\"!isVertical()\"\n [class.gap-2]=\"!isVertical()\"\n [class.flex-col]=\"isVertical()\"\n [class.flex-col-reverse]=\"labelPosition() === 'top'\"\n [class.flex-row-reverse]=\"labelPosition() === 'start'\"\n [class.justify-end]=\"labelPosition() === 'start'\"\n >\n <p-radiobutton\n [size]=\"size()\"\n #radiobutton\n [ngModel]=\"value()\"\n [value]=\"option.value\"\n [inputId]=\"option?.label\"\n (ngModelChange)=\"onValueChange($event)\"\n (onClick)=\"onChange.emit($event)\"\n (onBlur)=\"onTouched()\"\n [disabled]=\"disabled() || readonly()\"\n [invalid]=\"isInvalid(ngControl?.control)\"\n class=\"leading-none\"\n ></p-radiobutton>\n\n @if (option?.label) {\n <label [for]=\"option?.label\">{{ option?.label }}</label>\n }\n </div>\n }\n</div>\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "component", type: i2.RadioButton, selector: "p-radioButton, p-radiobutton, p-radio-button", inputs: ["value", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "styleClass", "autofocus", "binary", "variant", "size"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: FieldValidation, selector: "mt-field-validation", inputs: ["control", "touched"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
72
72
|
}
|
|
73
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
73
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: RadioButtonField, decorators: [{
|
|
74
74
|
type: Component,
|
|
75
75
|
args: [{ selector: 'mt-radio-button-field', standalone: true, imports: [FormsModule, RadioButtonModule, FieldValidation], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
76
76
|
class: 'grid gap-1',
|
|
@@ -50,10 +50,10 @@ class RadioCardsField {
|
|
|
50
50
|
this.onTouched();
|
|
51
51
|
}
|
|
52
52
|
}
|
|
53
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
54
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
53
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: RadioCardsField, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
54
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: RadioCardsField, isStandalone: true, selector: "mt-radio-cards-field", inputs: { circle: { classPropertyName: "circle", publicName: "circle", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "grid gap-1" }, providers: [], queries: [{ propertyName: "itemTemplate", first: true, predicate: ["option"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "@if (label()) {\n <label\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n [for]=\"ngControl?.name || label()\"\n >{{ label() }}</label\n >\n}\n<div\n class=\"relative\"\n [class.opacity-50]=\"isDisabled()\"\n [class.pointer-events-none]=\"isDisabled()\"\n [id]=\"ngControl?.name || label()\"\n>\n <mt-radio-cards\n [options]=\"options()\"\n [activeId]=\"selectedId()\"\n [color]=\"color()\"\n [size]=\"size()\"\n [circle]=\"circle()\"\n (selectionChange)=\"onSelectionChange($event)\"\n [itemTemplate]=\"itemTemplate()\"\n ></mt-radio-cards>\n</div>\n\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: RadioCards, selector: "mt-radio-cards", inputs: ["circle", "color", "size", "options", "activeId", "itemTemplate"], outputs: ["optionsChange", "activeIdChange", "selectionChange"] }, { kind: "component", type: FieldValidation, selector: "mt-field-validation", inputs: ["control", "touched"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
55
55
|
}
|
|
56
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
56
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: RadioCardsField, decorators: [{
|
|
57
57
|
type: Component,
|
|
58
58
|
args: [{ selector: 'mt-radio-cards-field', standalone: true, imports: [FormsModule, RadioCards, FieldValidation], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
59
59
|
class: 'grid gap-1',
|
|
@@ -49,10 +49,10 @@ class RadioCards {
|
|
|
49
49
|
this.selectionChange.emit(item);
|
|
50
50
|
}
|
|
51
51
|
}
|
|
52
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
53
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
52
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: RadioCards, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
53
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: RadioCards, isStandalone: true, selector: "mt-radio-cards", inputs: { circle: { classPropertyName: "circle", publicName: "circle", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, activeId: { classPropertyName: "activeId", publicName: "activeId", isSignal: true, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { options: "optionsChange", activeId: "activeIdChange", selectionChange: "selectionChange" }, queries: [{ propertyName: "itemTemplateContent", first: true, predicate: ["option"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<div>\n <div class=\"flex flex-wrap gap-3\">\n @for (item of options(); track item.id) {\n @let active = item.id === activeId();\n <div\n (click)=\"selectItem(item)\"\n class=\"flex items-center space-x-4 p-4 rounded-lg cursor-pointer border-2 border-dashed transition-all ease-in-out duration-300\"\n [class]=\"\n active\n ? 'bg-primary-50 dark:bg-primary-800 border-primary-400 ring-primary-200'\n : 'border-gray-300 hover:border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-800 hover:text-gray-600 dark:hover:text-gray-100'\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate() || itemTemplateContent() || defaultTemplate;\n context: {\n $implicit: item,\n active: active,\n size: size(),\n }\n \"\n >\n </ng-container>\n </div>\n }\n </div>\n</div>\n\n<ng-template #defaultTemplate let-template let-active=\"active\" let-size=\"size\">\n @if (template.icon) {\n <mt-avatar\n [shape]=\"circle() ? 'circle' : 'square'\"\n [size]=\"avatarSize()\"\n [icon]=\"template.icon\"\n ></mt-avatar>\n }\n @if (template.name) {\n <span\n [class]=\"[\n 'font-semibold',\n textSizeClass(),\n 'dark:text-gray-100',\n 'text-gray-600',\n ]\"\n >\n {{ template.name }}\n </span>\n }\n</ng-template>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: Avatar, selector: "mt-avatar", inputs: ["label", "icon", "image", "styleClass", "size", "shape", "badge", "badgeSize", "badgeSeverity"], outputs: ["onImageError"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
54
54
|
}
|
|
55
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
55
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: RadioCards, decorators: [{
|
|
56
56
|
type: Component,
|
|
57
57
|
args: [{ selector: 'mt-radio-cards', standalone: true, imports: [NgTemplateOutlet, Avatar], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div>\n <div class=\"flex flex-wrap gap-3\">\n @for (item of options(); track item.id) {\n @let active = item.id === activeId();\n <div\n (click)=\"selectItem(item)\"\n class=\"flex items-center space-x-4 p-4 rounded-lg cursor-pointer border-2 border-dashed transition-all ease-in-out duration-300\"\n [class]=\"\n active\n ? 'bg-primary-50 dark:bg-primary-800 border-primary-400 ring-primary-200'\n : 'border-gray-300 hover:border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-800 hover:text-gray-600 dark:hover:text-gray-100'\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"\n itemTemplate() || itemTemplateContent() || defaultTemplate;\n context: {\n $implicit: item,\n active: active,\n size: size(),\n }\n \"\n >\n </ng-container>\n </div>\n }\n </div>\n</div>\n\n<ng-template #defaultTemplate let-template let-active=\"active\" let-size=\"size\">\n @if (template.icon) {\n <mt-avatar\n [shape]=\"circle() ? 'circle' : 'square'\"\n [size]=\"avatarSize()\"\n [icon]=\"template.icon\"\n ></mt-avatar>\n }\n @if (template.name) {\n <span\n [class]=\"[\n 'font-semibold',\n textSizeClass(),\n 'dark:text-gray-100',\n 'text-gray-600',\n ]\"\n >\n {{ template.name }}\n </span>\n }\n</ng-template>\n", styles: [":host{display:block}\n"] }]
|
|
58
58
|
}], propDecorators: { circle: [{ type: i0.Input, args: [{ isSignal: true, alias: "circle", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: true }] }, { type: i0.Output, args: ["optionsChange"] }], activeId: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeId", required: false }] }, { type: i0.Output, args: ["activeIdChange"] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], itemTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemTemplate", required: false }] }], itemTemplateContent: [{ type: i0.ContentChild, args: ['option', { ...{ read: TemplateRef }, isSignal: true }] }] } });
|
|
@@ -90,10 +90,10 @@ class SelectField {
|
|
|
90
90
|
this.onChange.emit(null);
|
|
91
91
|
this.cdr.detectChanges();
|
|
92
92
|
}
|
|
93
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
94
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
93
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: SelectField, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
94
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: SelectField, isStandalone: true, selector: "mt-select-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, hasPlaceholderPrefix: { classPropertyName: "hasPlaceholderPrefix", publicName: "hasPlaceholderPrefix", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, pInputs: { classPropertyName: "pInputs", publicName: "pInputs", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, filterBy: { classPropertyName: "filterBy", publicName: "filterBy", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, clearAfterSelect: { classPropertyName: "clearAfterSelect", publicName: "clearAfterSelect", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChange: "onChange" }, host: { properties: { "class": "this.styleClass" }, classAttribute: "grid gap-1" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "@if (label()) {\n <label\n (click)=\"dropdown.show(); dropdown.focus()\"\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n [for]=\"ngControl?.name || label()\"\n >{{ label() }}</label\n >\n}\n<p-select\n #dropdown\n appendTo=\"body\"\n [overlayOptions]=\"{ baseZIndex: 1051 }\"\n [ngModel]=\"value()\"\n (ngModelChange)=\"onValueChange($event)\"\n [options]=\"options()\"\n [optionLabel]=\"optionLabel()\"\n [optionValue]=\"optionValue()\"\n (onBlur)=\"onTouched()\"\n [disabled]=\"disabled() || readonly()\"\n [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\n [id]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\n [invalid]=\"isInvalid(ngControl?.control)\"\n placeholder=\"{{\n (hasPlaceholderPrefix() ? ('components.table.select' | transloco) : '') +\n ' ' +\n (placeholder() ?? label() ?? '')\n }}\"\n [filter]=\"filter()\"\n [filterBy]=\"filterBy()\"\n [dataKey]=\"dataKey()\"\n styleClass=\"w-full\"\n [showClear]=\"showClear()\"\n appendTo=\"body\"\n></p-select>\n\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: FieldValidation, selector: "mt-field-validation", inputs: ["control", "touched"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
95
95
|
}
|
|
96
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
96
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: SelectField, decorators: [{
|
|
97
97
|
type: Component,
|
|
98
98
|
args: [{ selector: 'mt-select-field', standalone: true, imports: [FormsModule, Select, FieldValidation, TranslocoModule], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
99
99
|
class: 'grid gap-1',
|
|
@@ -10,10 +10,10 @@ class Sidebar {
|
|
|
10
10
|
bgImage = input(undefined, { ...(ngDevMode ? { debugName: "bgImage" } : {}) });
|
|
11
11
|
bgRepeat = input(false, { ...(ngDevMode ? { debugName: "bgRepeat" } : {}), transform: booleanAttribute });
|
|
12
12
|
iconsColor = input('var(--p-text-color)', { ...(ngDevMode ? { debugName: "iconsColor" } : {}) });
|
|
13
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
14
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
13
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: Sidebar, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
14
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: Sidebar, isStandalone: true, selector: "mt-sidebar", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, bgColor: { classPropertyName: "bgColor", publicName: "bgColor", isSignal: true, isRequired: false, transformFunction: null }, bgImage: { classPropertyName: "bgImage", publicName: "bgImage", isSignal: true, isRequired: false, transformFunction: null }, bgRepeat: { classPropertyName: "bgRepeat", publicName: "bgRepeat", isSignal: true, isRequired: false, transformFunction: null }, iconsColor: { classPropertyName: "iconsColor", publicName: "iconsColor", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n class=\"flex flex-col bg-surface-200 dark:bg-surface-800 h-[calc(100vh-var(--header-height))] overflow-clip w-16 border-e-1 border-surface-300 rounded-ss-2xl\"\n>\n <div\n class=\"h-full flex flex-col gap-3 px-2 py-8\"\n [style.backgroundColor]=\"bgColor()\"\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\n [class.bg-no-repeat]=\"!bgRepeat()\"\n [class.bg-repeat-y]=\"bgRepeat()\"\n >\n @for (item of items(); track item.id) {\n <a\n [routerLink]=\"item.routerLink\"\n routerLinkActive=\"bg-surface-0 dark:bg-surface-950\"\n #rla=\"routerLinkActive\"\n class=\"flex items-center justify-center size-[47px] dark:hover:bg-surface-900 hover:bg-surface-100 transition-colors rounded-xl\"\n mtTooltip=\"{{ item.title }}\"\n [style.color]=\"rla.isActive ? 'var(--p-primary-500)' : iconsColor()\"\n >\n <mt-icon [icon]=\"item.icon\" />\n </a>\n }\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "directive", type: Tooltip, selector: "[mtTooltip]" }] });
|
|
15
15
|
}
|
|
16
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
16
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: Sidebar, decorators: [{
|
|
17
17
|
type: Component,
|
|
18
18
|
args: [{ selector: 'mt-sidebar', standalone: true, imports: [RouterLinkActive, RouterLink, Icon, Tooltip], template: "<div\n class=\"flex flex-col bg-surface-200 dark:bg-surface-800 h-[calc(100vh-var(--header-height))] overflow-clip w-16 border-e-1 border-surface-300 rounded-ss-2xl\"\n>\n <div\n class=\"h-full flex flex-col gap-3 px-2 py-8\"\n [style.backgroundColor]=\"bgColor()\"\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\n [class.bg-no-repeat]=\"!bgRepeat()\"\n [class.bg-repeat-y]=\"bgRepeat()\"\n >\n @for (item of items(); track item.id) {\n <a\n [routerLink]=\"item.routerLink\"\n routerLinkActive=\"bg-surface-0 dark:bg-surface-950\"\n #rla=\"routerLinkActive\"\n class=\"flex items-center justify-center size-[47px] dark:hover:bg-surface-900 hover:bg-surface-100 transition-colors rounded-xl\"\n mtTooltip=\"{{ item.title }}\"\n [style.color]=\"rla.isActive ? 'var(--p-primary-500)' : iconsColor()\"\n >\n <mt-icon [icon]=\"item.icon\" />\n </a>\n }\n </div>\n</div>\n" }]
|
|
19
19
|
}], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], bgColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgColor", required: false }] }], bgImage: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgImage", required: false }] }], bgRepeat: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgRepeat", required: false }] }], iconsColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconsColor", required: false }] }] } });
|
|
@@ -69,10 +69,10 @@ class SliderField {
|
|
|
69
69
|
setDisabledState(disabled) {
|
|
70
70
|
this.disabled.set(disabled);
|
|
71
71
|
}
|
|
72
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
73
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.
|
|
72
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: SliderField, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
73
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: SliderField, isStandalone: true, selector: "mt-slider-field", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, animate: { classPropertyName: "animate", publicName: "animate", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, hideNumber: { classPropertyName: "hideNumber", publicName: "hideNumber", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, pInputs: { classPropertyName: "pInputs", publicName: "pInputs", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChange: "onChange", onSlideEnd: "onSlideEnd" }, host: { properties: { "class": "this.styleClass" }, classAttribute: "grid gap-1" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "@if (label()) {\n <label\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n [for]=\"ngControl?.name || label()\"\n [class.mb-3]=\"hideNumber()\"\n >{{ label() }}</label\n >\n}\n<div\n class=\"flex items-center gap-3 w-full\"\n [style.padding-inline-start]=\"'calc(var(--p-slider-handle-width) / 2)'\"\n>\n <p-slider\n #input\n [ngModel]=\"value()\"\n (ngModelChange)=\"onValueChange($event)\"\n (onChange)=\"onChange.emit($event)\"\n (onSlideEnd)=\"onTouched(); onSlideEnd.emit($event)\"\n [disabled]=\"disabled() || readonly()\"\n [animate]=\"animate()\"\n [id]=\"ngControl?.name || label()\"\n [min]=\"min()\"\n [max]=\"max()\"\n [step]=\"step()\"\n [invalid]=\"isInvalid(ngControl?.control)\"\n class=\"grow\"\n ></p-slider>\n @if (!hideNumber()) {\n <span class=\"leading-none\">{{ value() ? value() + unit() : \"-\" }}</span>\n }\n</div>\n\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SliderModule }, { kind: "component", type: i2.Slider, selector: "p-slider", inputs: ["animate", "min", "max", "orientation", "step", "range", "styleClass", "ariaLabel", "ariaLabelledBy", "tabindex", "autofocus"], outputs: ["onChange", "onSlideEnd"] }, { kind: "component", type: FieldValidation, selector: "mt-field-validation", inputs: ["control", "touched"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
74
74
|
}
|
|
75
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
75
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: SliderField, decorators: [{
|
|
76
76
|
type: Component,
|
|
77
77
|
args: [{ selector: 'mt-slider-field', standalone: true, imports: [FormsModule, SliderModule, FieldValidation], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
78
78
|
class: 'grid gap-1',
|
|
@@ -226,10 +226,10 @@ class Table {
|
|
|
226
226
|
});
|
|
227
227
|
}
|
|
228
228
|
}
|
|
229
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
230
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: Table, isStandalone: true, selector: "mt-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, rowActions: { classPropertyName: "rowActions", publicName: "rowActions", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, showGridlines: { classPropertyName: "showGridlines", publicName: "showGridlines", isSignal: true, isRequired: false, transformFunction: null }, stripedRows: { classPropertyName: "stripedRows", publicName: "stripedRows", isSignal: true, isRequired: false, transformFunction: null }, selectableRows: { classPropertyName: "selectableRows", publicName: "selectableRows", isSignal: true, isRequired: false, transformFunction: null }, generalSearch: { classPropertyName: "generalSearch", publicName: "generalSearch", isSignal: true, isRequired: false, transformFunction: null }, showFilters: { classPropertyName: "showFilters", publicName: "showFilters", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, updating: { classPropertyName: "updating", publicName: "updating", isSignal: true, isRequired: false, transformFunction: null }, tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null }, tabsOptionLabel: { classPropertyName: "tabsOptionLabel", publicName: "tabsOptionLabel", isSignal: true, isRequired: false, transformFunction: null }, tabsOptionValue: { classPropertyName: "tabsOptionValue", publicName: "tabsOptionValue", isSignal: true, isRequired: false, transformFunction: null }, activeTab: { classPropertyName: "activeTab", publicName: "activeTab", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, paginatorPosition: { classPropertyName: "paginatorPosition", publicName: "paginatorPosition", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, currentPage: { classPropertyName: "currentPage", publicName: "currentPage", isSignal: true, isRequired: false, transformFunction: null }, first: { classPropertyName: "first", publicName: "first", isSignal: true, isRequired: false, transformFunction: null }, filterTerm: { classPropertyName: "filterTerm", publicName: "filterTerm", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange", cellChange: "cellChange", activeTab: "activeTabChange", onTabChange: "onTabChange", pageSize: "pageSizeChange", currentPage: "currentPageChange", first: "firstChange", filterTerm: "filterTermChange" }, queries: [{ propertyName: "captionStartContent", first: true, predicate: ["captionStart"], descendants: true, isSignal: true }, { propertyName: "captionEndContent", first: true, predicate: ["captionEnd"], descendants: true, isSignal: true }, { propertyName: "emptyContent", first: true, predicate: ["empty"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"space-y-4 rounded-2xl\">\n <div>\n @if (\n captionStartContent() ||\n captionEndContent() ||\n generalSearch() ||\n showFilters() ||\n tabs()?.length > 0 ||\n actions()?.length > 0\n ) {\n <div class=\"p-datatable-header rounded-t-2xl\">\n <div\n class=\"flex relative\"\n [class]=\"!generalSearch() ? 'justify-end' : 'justify-between'\"\n >\n <div class=\"flex items-center gap-2\">\n <ng-container\n *ngTemplateOutlet=\"captionStartContent()\"\n ></ng-container>\n @if (tabs()) {\n <mt-tabs\n [(active)]=\"activeTab\"\n [options]=\"tabs()\"\n [optionLabel]=\"tabsOptionLabel()\"\n [optionValue]=\"tabsOptionValue()\"\n (onChange)=\"tabChanged($event)\"\n size=\"large\"\n ></mt-tabs>\n }\n @if (generalSearch()) {\n <mt-text-field\n [(ngModel)]=\"filterTerm\"\n (change)=\"onSearchChange($event)\"\n icon=\"general.search-lg\"\n [placeholder]=\"'components.table.search' | transloco\"\n ></mt-text-field>\n }\n </div>\n <div class=\"flex items-center gap-2\">\n @if (showFilters()) {\n <mt-button\n variant=\"outline\"\n (click)=\"toggleFilterPanel()\"\n [label]=\"'components.table.filter' | transloco\"\n [badge]=\"activeFilterCount()\"\n icon=\"general.filter-funnel-01\"\n >\n </mt-button>\n @if (isFilterPanelOpen()) {\n <div\n class=\"absolute top-full end-0 z-10 mt-2 w-72 origin-top-right rounded-md bg-content shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none\"\n role=\"menu\"\n >\n <div class=\"p-4\">\n <h3 class=\"text-base font-semibold\">\n {{ \"components.table.filterOptions\" | transloco }}\n </h3>\n </div>\n <div\n class=\"border-t border-surface-300 dark:border-surface-500 p-4 space-y-4\"\n >\n @for (col of filterableColumns(); track col.key) {\n <div class=\"space-y-1\">\n <label class=\"block text-sm font-medium\">\n {{ col.filterConfig?.label }}\n </label>\n @switch (col.filterConfig?.type) {\n @case (\"text\") {\n <mt-text-field\n [(ngModel)]=\"pendingFilters()[col.key]\"\n (ngModelChange)=\"\n updatePendingFilter(col.key, $event)\n \"\n ></mt-text-field>\n }\n @case (\"select\") {\n <mt-select-field\n [(ngModel)]=\"pendingFilters()[col.key]\"\n (ngModelChange)=\"\n updatePendingFilter(col.key, $event)\n \"\n [options]=\"col.filterConfig?.options\"\n [hasPlaceholderPrefix]=\"false\"\n [placeholder]=\"\n ('components.table.select' | transloco) +\n ' ' +\n col.filterConfig?.label\n \"\n showClear\n ></mt-select-field>\n }\n }\n </div>\n }\n </div>\n <div\n class=\"flex items-center justify-end space-x-2 border-t border-surface-300 dark:border-surface-500 bg-surface-50 dark:bg-surface-950 p-4 rounded-b-md\"\n >\n <mt-button\n variant=\"outlined\"\n (click)=\"resetFilters()\"\n [label]=\"'components.table.reset' | transloco\"\n />\n <mt-button\n (click)=\"applyFilters()\"\n [label]=\"'components.table.apply' | transloco\"\n />\n </div>\n </div>\n }\n }\n @if (actions()?.length > 0) {\n <div class=\"flex items-center space-x-2\">\n @for (action of actions(); track action.label) {\n <mt-button\n [icon]=\"action.icon\"\n [severity]=\"action.color\"\n [variant]=\"action.variant\"\n [size]=\"action.size\"\n (click)=\"action.action(row)\"\n [label]=\"action.label\"\n [tooltip]=\"action.tooltip\"\n ></mt-button>\n }\n </div>\n }\n <ng-container\n *ngTemplateOutlet=\"captionEndContent()\"\n ></ng-container>\n </div>\n </div>\n </div>\n }\n @if (!loading() && emptyContent() && data().length === 0) {\n <div\n class=\"p-4 bg-content rounded-md text-center text-gray-600 dark:text-gray-300\"\n >\n <ng-container *ngTemplateOutlet=\"emptyContent()\"></ng-container>\n </div>\n } @else {\n <div class=\"overflow-x-auto bg-content\">\n <p-table\n [value]=\"displayData()\"\n [columns]=\"columns()\"\n [size]=\"size()\"\n [showGridlines]=\"showGridlines()\"\n [stripedRows]=\"stripedRows()\"\n [first]=\"first()\"\n [rows]=\"pageSize()\"\n (onPage)=\"onTablePage($event)\"\n paginator\n paginatorStyleClass=\"hidden!\"\n class=\"min-w-full text-sm align-middle table-fixed\"\n >\n <ng-template\n #header\n let-columns\n class=\"bg-surface-50 dark:bg-surface-950 border-b border-surface-300 dark:border-surface-500\"\n >\n <tr>\n @if (selectableRows()) {\n <th class=\"w-12 text-start\">\n <mt-checkbox-field\n [ngModel]=\"allSelectedOnPage()\"\n (ngModelChange)=\"toggleAllRowsOnPage()\"\n ></mt-checkbox-field>\n </th>\n }\n\n @for (col of columns; track col.key) {\n <th\n class=\"text-start font-semibold text-gray-600 dark:text-gray-50 uppercase tracking-wider\"\n >\n {{ col.label }}\n </th>\n }\n\n @if (rowActions().length > 0) {\n <th\n class=\"text-end! font-semibold text-gray-600 dark:text-gray-50 uppercase tracking-wider\"\n >\n Actions\n </th>\n }\n </tr>\n @if (updating()) {\n <tr>\n <th\n [attr.colspan]=\"\n columns.length +\n (selectableRows() ? 1 : 0) +\n (rowActions().length > 0 ? 1 : 0)\n \"\n class=\"!p-0\"\n >\n <p-progressBar\n mode=\"indeterminate\"\n [style]=\"{ height: '4px' }\"\n />\n </th>\n </tr>\n }\n </ng-template>\n <ng-template\n #body\n let-row\n let-columns=\"columns\"\n class=\"divide-y divide-gray-200\"\n >\n @if (loading()) {\n <tr>\n @if (selectableRows()) {\n <td><p-skeleton /></td>\n }\n @for (col of columns; track col.key) {\n <td><p-skeleton /></td>\n }\n @if (rowActions().length > 0) {\n <td><p-skeleton /></td>\n }\n </tr>\n } @else {\n <tr\n class=\"hover:bg-gray-50 dark:hover:bg-surface-950 border-surface-300 dark:border-surface-500\"\n >\n @if (selectableRows()) {\n <td class=\"w-12\">\n <mt-checkbox-field\n [ngModel]=\"selectedRows().has(row)\"\n (ngModelChange)=\"toggleRow(row)\"\n ></mt-checkbox-field>\n </td>\n }\n\n @for (col of columns; track col.key) {\n <td class=\"text-gray-700 dark:text-gray-100\">\n @switch (col.type) {\n @case (\"boolean\") {\n <mt-toggle-field\n [(ngModel)]=\"row[col.key]\"\n (ngModelChange)=\"\n onCellChange(row, col.key, $event, 'boolean')\n \"\n ></mt-toggle-field>\n }\n @case (\"date\") {\n {{ getProperty(row, col.key) | date: \"mediumDate\" }}\n }\n @case (\"custom\") {\n <ng-container\n *ngTemplateOutlet=\"\n col.customCellTpl;\n context: { $implicit: row }\n \"\n >\n </ng-container>\n }\n @default {\n {{ getProperty(row, col.key) }}\n }\n }\n </td>\n }\n\n @if (rowActions().length > 0) {\n <td class=\"text-right\">\n <div class=\"flex items-center justify-end space-x-2\">\n @for (action of rowActions(); track action.label) {\n @let hidden = action.hidden?.(row);\n @if (!hidden) {\n <mt-button\n [icon]=\"action.icon\"\n [severity]=\"action.color\"\n [variant]=\"action.variant\"\n [size]=\"action.size || 'small'\"\n (click)=\"rowAction($event, action, row)\"\n [tooltip]=\"action.tooltip\"\n [label]=\"action.label\"\n [loading]=\"resolveActionLoading(action, row)\"\n ></mt-button>\n }\n }\n </div>\n </td>\n }\n </tr>\n }\n </ng-template>\n <ng-template #emptymessage>\n <tr>\n <td colspan=\"20\" class=\"text-center\">\n <div class=\"flex justify-center\">No data found.</div>\n </td>\n </tr>\n </ng-template>\n </p-table>\n </div>\n }\n </div>\n\n <div\n class=\"flex flex-col gap-3 pb-3 px-4\"\n [class]=\"'items-' + paginatorPosition()\"\n >\n <mt-paginator\n [(rows)]=\"pageSize\"\n [(first)]=\"first\"\n [(page)]=\"currentPage\"\n [totalRecords]=\"totalRecords()\"\n [alwaysShow]=\"false\"\n [rowsPerPageOptions]=\"[5, 10, 20, 50]\"\n ></mt-paginator>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ToggleField, selector: "mt-toggle-field", inputs: ["label", "labelPosition", "placeholder", "readonly", "pInputs", "required"], outputs: ["onChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: TextField, selector: "mt-text-field", inputs: ["field", "hint", "label", "placeholder", "class", "type", "readonly", "pInputs", "required", "icon", "iconPosition"] }, { kind: "component", type: SelectField, selector: "mt-select-field", inputs: ["field", "label", "placeholder", "hasPlaceholderPrefix", "class", "readonly", "pInputs", "options", "optionValue", "optionLabel", "filter", "filterBy", "dataKey", "showClear", "clearAfterSelect", "required"], outputs: ["onChange"] }, { kind: "component", type: Paginator, selector: "mt-paginator", inputs: ["rows", "totalRecords", "first", "page", "rowsPerPageOptions", "showFirstLastIcon", "showCurrentPageReport", "fluid", "pageLinkSize", "alwaysShow"], outputs: ["rowsChange", "firstChange", "pageChange", "onPageChange"] }, { kind: "component", type: CheckboxField, selector: "mt-checkbox-field", inputs: ["label", "labelPosition", "placeholder", "readonly", "pInputs", "required"], outputs: ["onChange"] }, { kind: "component", type: Tabs, selector: "mt-tabs", inputs: ["options", "optionLabel", "optionValue", "active", "size", "fluid", "disabled"], outputs: ["activeChange", "onChange"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i3.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "ngmodule", type: ProgressBarModule }, { kind: "component", type: i4.ProgressBar, selector: "p-progressBar, p-progressbar, p-progress-bar", inputs: ["value", "showValue", "styleClass", "valueStyleClass", "unit", "mode", "color"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: i5.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
229
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: Table, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
230
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: Table, isStandalone: true, selector: "mt-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, rowActions: { classPropertyName: "rowActions", publicName: "rowActions", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, showGridlines: { classPropertyName: "showGridlines", publicName: "showGridlines", isSignal: true, isRequired: false, transformFunction: null }, stripedRows: { classPropertyName: "stripedRows", publicName: "stripedRows", isSignal: true, isRequired: false, transformFunction: null }, selectableRows: { classPropertyName: "selectableRows", publicName: "selectableRows", isSignal: true, isRequired: false, transformFunction: null }, generalSearch: { classPropertyName: "generalSearch", publicName: "generalSearch", isSignal: true, isRequired: false, transformFunction: null }, showFilters: { classPropertyName: "showFilters", publicName: "showFilters", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, updating: { classPropertyName: "updating", publicName: "updating", isSignal: true, isRequired: false, transformFunction: null }, tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null }, tabsOptionLabel: { classPropertyName: "tabsOptionLabel", publicName: "tabsOptionLabel", isSignal: true, isRequired: false, transformFunction: null }, tabsOptionValue: { classPropertyName: "tabsOptionValue", publicName: "tabsOptionValue", isSignal: true, isRequired: false, transformFunction: null }, activeTab: { classPropertyName: "activeTab", publicName: "activeTab", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, paginatorPosition: { classPropertyName: "paginatorPosition", publicName: "paginatorPosition", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, currentPage: { classPropertyName: "currentPage", publicName: "currentPage", isSignal: true, isRequired: false, transformFunction: null }, first: { classPropertyName: "first", publicName: "first", isSignal: true, isRequired: false, transformFunction: null }, filterTerm: { classPropertyName: "filterTerm", publicName: "filterTerm", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange", cellChange: "cellChange", activeTab: "activeTabChange", onTabChange: "onTabChange", pageSize: "pageSizeChange", currentPage: "currentPageChange", first: "firstChange", filterTerm: "filterTermChange" }, queries: [{ propertyName: "captionStartContent", first: true, predicate: ["captionStart"], descendants: true, isSignal: true }, { propertyName: "captionEndContent", first: true, predicate: ["captionEnd"], descendants: true, isSignal: true }, { propertyName: "emptyContent", first: true, predicate: ["empty"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"space-y-4 rounded-2xl\">\n <div>\n @if (\n captionStartContent() ||\n captionEndContent() ||\n generalSearch() ||\n showFilters() ||\n tabs()?.length > 0 ||\n actions()?.length > 0\n ) {\n <div class=\"p-datatable-header rounded-t-2xl\">\n <div\n class=\"flex relative\"\n [class]=\"!generalSearch() ? 'justify-end' : 'justify-between'\"\n >\n <div class=\"flex items-center gap-2\">\n <ng-container\n *ngTemplateOutlet=\"captionStartContent()\"\n ></ng-container>\n @if (tabs()) {\n <mt-tabs\n [(active)]=\"activeTab\"\n [options]=\"tabs()\"\n [optionLabel]=\"tabsOptionLabel()\"\n [optionValue]=\"tabsOptionValue()\"\n (onChange)=\"tabChanged($event)\"\n size=\"large\"\n ></mt-tabs>\n }\n @if (generalSearch()) {\n <mt-text-field\n [(ngModel)]=\"filterTerm\"\n (change)=\"onSearchChange($event)\"\n icon=\"general.search-lg\"\n [placeholder]=\"'components.table.search' | transloco\"\n ></mt-text-field>\n }\n </div>\n <div class=\"flex items-center gap-2\">\n @if (showFilters()) {\n <mt-button\n variant=\"outline\"\n (click)=\"toggleFilterPanel()\"\n [label]=\"'components.table.filter' | transloco\"\n [badge]=\"activeFilterCount()\"\n icon=\"general.filter-funnel-01\"\n >\n </mt-button>\n @if (isFilterPanelOpen()) {\n <div\n class=\"absolute top-full end-0 z-10 mt-2 w-72 origin-top-right rounded-md bg-content shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none\"\n role=\"menu\"\n >\n <div class=\"p-4\">\n <h3 class=\"text-base font-semibold\">\n {{ \"components.table.filterOptions\" | transloco }}\n </h3>\n </div>\n <div\n class=\"border-t border-surface-300 dark:border-surface-500 p-4 space-y-4\"\n >\n @for (col of filterableColumns(); track col.key) {\n <div class=\"space-y-1\">\n <label class=\"block text-sm font-medium\">\n {{ col.filterConfig?.label }}\n </label>\n @switch (col.filterConfig?.type) {\n @case (\"text\") {\n <mt-text-field\n [(ngModel)]=\"pendingFilters()[col.key]\"\n (ngModelChange)=\"\n updatePendingFilter(col.key, $event)\n \"\n ></mt-text-field>\n }\n @case (\"select\") {\n <mt-select-field\n [(ngModel)]=\"pendingFilters()[col.key]\"\n (ngModelChange)=\"\n updatePendingFilter(col.key, $event)\n \"\n [options]=\"col.filterConfig?.options\"\n [hasPlaceholderPrefix]=\"false\"\n [placeholder]=\"\n ('components.table.select' | transloco) +\n ' ' +\n col.filterConfig?.label\n \"\n showClear\n ></mt-select-field>\n }\n }\n </div>\n }\n </div>\n <div\n class=\"flex items-center justify-end space-x-2 border-t border-surface-300 dark:border-surface-500 bg-surface-50 dark:bg-surface-950 p-4 rounded-b-md\"\n >\n <mt-button\n variant=\"outlined\"\n (click)=\"resetFilters()\"\n [label]=\"'components.table.reset' | transloco\"\n />\n <mt-button\n (click)=\"applyFilters()\"\n [label]=\"'components.table.apply' | transloco\"\n />\n </div>\n </div>\n }\n }\n @if (actions()?.length > 0) {\n <div class=\"flex items-center space-x-2\">\n @for (action of actions(); track action.label) {\n <mt-button\n [icon]=\"action.icon\"\n [severity]=\"action.color\"\n [variant]=\"action.variant\"\n [size]=\"action.size\"\n (click)=\"action.action(row)\"\n [label]=\"action.label\"\n [tooltip]=\"action.tooltip\"\n ></mt-button>\n }\n </div>\n }\n <ng-container\n *ngTemplateOutlet=\"captionEndContent()\"\n ></ng-container>\n </div>\n </div>\n </div>\n }\n @if (!loading() && emptyContent() && data().length === 0) {\n <div\n class=\"p-4 bg-content rounded-md text-center text-gray-600 dark:text-gray-300\"\n >\n <ng-container *ngTemplateOutlet=\"emptyContent()\"></ng-container>\n </div>\n } @else {\n <div class=\"overflow-x-auto bg-content\">\n <p-table\n [value]=\"displayData()\"\n [columns]=\"columns()\"\n [size]=\"size()\"\n [showGridlines]=\"showGridlines()\"\n [stripedRows]=\"stripedRows()\"\n [first]=\"first()\"\n [rows]=\"pageSize()\"\n (onPage)=\"onTablePage($event)\"\n paginator\n paginatorStyleClass=\"hidden!\"\n class=\"min-w-full text-sm align-middle table-fixed\"\n >\n <ng-template\n #header\n let-columns\n class=\"bg-surface-50 dark:bg-surface-950 border-b border-surface-300 dark:border-surface-500\"\n >\n <tr>\n @if (selectableRows()) {\n <th class=\"w-12 text-start\">\n <mt-checkbox-field\n [ngModel]=\"allSelectedOnPage()\"\n (ngModelChange)=\"toggleAllRowsOnPage()\"\n ></mt-checkbox-field>\n </th>\n }\n\n @for (col of columns; track col.key) {\n <th\n class=\"text-start font-semibold text-gray-600 dark:text-gray-50 uppercase tracking-wider\"\n >\n {{ col.label }}\n </th>\n }\n\n @if (rowActions().length > 0) {\n <th\n class=\"text-end! font-semibold text-gray-600 dark:text-gray-50 uppercase tracking-wider\"\n >\n Actions\n </th>\n }\n </tr>\n @if (updating()) {\n <tr>\n <th\n [attr.colspan]=\"\n columns.length +\n (selectableRows() ? 1 : 0) +\n (rowActions().length > 0 ? 1 : 0)\n \"\n class=\"!p-0\"\n >\n <p-progressBar\n mode=\"indeterminate\"\n [style]=\"{ height: '4px' }\"\n />\n </th>\n </tr>\n }\n </ng-template>\n <ng-template\n #body\n let-row\n let-columns=\"columns\"\n class=\"divide-y divide-gray-200\"\n >\n @if (loading()) {\n <tr>\n @if (selectableRows()) {\n <td><p-skeleton /></td>\n }\n @for (col of columns; track col.key) {\n <td><p-skeleton /></td>\n }\n @if (rowActions().length > 0) {\n <td><p-skeleton /></td>\n }\n </tr>\n } @else {\n <tr\n class=\"hover:bg-gray-50 dark:hover:bg-surface-950 border-surface-300 dark:border-surface-500\"\n >\n @if (selectableRows()) {\n <td class=\"w-12\">\n <mt-checkbox-field\n [ngModel]=\"selectedRows().has(row)\"\n (ngModelChange)=\"toggleRow(row)\"\n ></mt-checkbox-field>\n </td>\n }\n\n @for (col of columns; track col.key) {\n <td class=\"text-gray-700 dark:text-gray-100\">\n @switch (col.type) {\n @case (\"boolean\") {\n <mt-toggle-field\n [(ngModel)]=\"row[col.key]\"\n (ngModelChange)=\"\n onCellChange(row, col.key, $event, 'boolean')\n \"\n ></mt-toggle-field>\n }\n @case (\"date\") {\n {{ getProperty(row, col.key) | date: \"mediumDate\" }}\n }\n @case (\"custom\") {\n <ng-container\n *ngTemplateOutlet=\"\n col.customCellTpl;\n context: { $implicit: row }\n \"\n >\n </ng-container>\n }\n @default {\n {{ getProperty(row, col.key) }}\n }\n }\n </td>\n }\n\n @if (rowActions().length > 0) {\n <td class=\"text-right\">\n <div class=\"flex items-center justify-end space-x-2\">\n @for (action of rowActions(); track action.label) {\n @let hidden = action.hidden?.(row);\n @if (!hidden) {\n <mt-button\n [icon]=\"action.icon\"\n [severity]=\"action.color\"\n [variant]=\"action.variant\"\n [size]=\"action.size || 'small'\"\n (click)=\"rowAction($event, action, row)\"\n [tooltip]=\"action.tooltip\"\n [label]=\"action.label\"\n [loading]=\"resolveActionLoading(action, row)\"\n ></mt-button>\n }\n }\n </div>\n </td>\n }\n </tr>\n }\n </ng-template>\n <ng-template #emptymessage>\n <tr>\n <td colspan=\"20\" class=\"text-center\">\n <div class=\"flex justify-center\">No data found.</div>\n </td>\n </tr>\n </ng-template>\n </p-table>\n </div>\n }\n </div>\n\n <div\n class=\"flex flex-col gap-3 pb-3 px-4\"\n [class]=\"'items-' + paginatorPosition()\"\n >\n <mt-paginator\n [(rows)]=\"pageSize\"\n [(first)]=\"first\"\n [(page)]=\"currentPage\"\n [totalRecords]=\"totalRecords()\"\n [alwaysShow]=\"false\"\n [rowsPerPageOptions]=\"[5, 10, 20, 50]\"\n ></mt-paginator>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ToggleField, selector: "mt-toggle-field", inputs: ["label", "labelPosition", "placeholder", "readonly", "pInputs", "required"], outputs: ["onChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: TextField, selector: "mt-text-field", inputs: ["field", "hint", "label", "placeholder", "class", "type", "readonly", "pInputs", "required", "icon", "iconPosition"] }, { kind: "component", type: SelectField, selector: "mt-select-field", inputs: ["field", "label", "placeholder", "hasPlaceholderPrefix", "class", "readonly", "pInputs", "options", "optionValue", "optionLabel", "filter", "filterBy", "dataKey", "showClear", "clearAfterSelect", "required"], outputs: ["onChange"] }, { kind: "component", type: Paginator, selector: "mt-paginator", inputs: ["rows", "totalRecords", "first", "page", "rowsPerPageOptions", "showFirstLastIcon", "showCurrentPageReport", "fluid", "pageLinkSize", "alwaysShow"], outputs: ["rowsChange", "firstChange", "pageChange", "onPageChange"] }, { kind: "component", type: CheckboxField, selector: "mt-checkbox-field", inputs: ["label", "labelPosition", "placeholder", "readonly", "pInputs", "required"], outputs: ["onChange"] }, { kind: "component", type: Tabs, selector: "mt-tabs", inputs: ["options", "optionLabel", "optionValue", "active", "size", "fluid", "disabled"], outputs: ["activeChange", "onChange"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i3.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "ngmodule", type: ProgressBarModule }, { kind: "component", type: i4.ProgressBar, selector: "p-progressBar, p-progressbar, p-progress-bar", inputs: ["value", "showValue", "styleClass", "valueStyleClass", "unit", "mode", "color"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: i5.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
231
231
|
}
|
|
232
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
232
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: Table, decorators: [{
|
|
233
233
|
type: Component,
|
|
234
234
|
args: [{ selector: 'mt-table', standalone: true, imports: [
|
|
235
235
|
TableModule,
|
|
@@ -25,10 +25,10 @@ class Tabs {
|
|
|
25
25
|
onTabChange(value) {
|
|
26
26
|
this.onChange.emit(value);
|
|
27
27
|
}
|
|
28
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.
|
|
29
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.
|
|
28
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: Tabs, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
29
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.2", type: Tabs, isStandalone: true, selector: "mt-tabs", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: false, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, fluid: { classPropertyName: "fluid", publicName: "fluid", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { active: "activeChange", onChange: "onChange" }, host: { properties: { "class.w-full": "fluid()" }, classAttribute: "grid gap-1" }, ngImport: i0, template: "<p-selectbutton\n [options]=\"options()\"\n [(ngModel)]=\"active\"\n (ngModelChange)=\"onTabChange($event)\"\n [optionLabel]=\"optionLabel()\"\n [optionValue]=\"optionValue()\"\n styleClass=\"my-tabs-button\"\n [size]=\"size()\"\n [fluid]=\"fluid()\"\n [disabled]=\"disabled()\"\n unselectable\n/>\n", styles: [""], dependencies: [{ kind: "component", type: SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "styleClass", "ariaLabelledBy", "dataKey", "autofocus", "size", "fluid"], outputs: ["onOptionClick", "onChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
30
30
|
}
|
|
31
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.
|
|
31
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: Tabs, decorators: [{
|
|
32
32
|
type: Component,
|
|
33
33
|
args: [{ selector: 'mt-tabs', standalone: true, imports: [SelectButton, FormsModule], host: {
|
|
34
34
|
class: 'grid gap-1',
|