@mediusinc/mng-commons 7.0.0-rc.0 → 7.0.0-rc.1
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/core/index.d.ts +8 -8
- package/fesm2022/mediusinc-mng-commons-core.mjs +2 -6
- package/fesm2022/mediusinc-mng-commons-core.mjs.map +1 -1
- package/fesm2022/mediusinc-mng-commons-filter.mjs +20 -0
- package/fesm2022/mediusinc-mng-commons-filter.mjs.map +1 -1
- package/fesm2022/mediusinc-mng-commons-form.mjs +94 -11
- package/fesm2022/mediusinc-mng-commons-form.mjs.map +1 -1
- package/fesm2022/mediusinc-mng-commons-table-api.mjs +0 -2
- package/fesm2022/mediusinc-mng-commons-table-api.mjs.map +1 -1
- package/fesm2022/{mediusinc-mng-commons-table-column-toggle.component-Dvenjj9n.mjs → mediusinc-mng-commons-table-column-toggle.component-0Dtv48mq.mjs} +2 -2
- package/fesm2022/{mediusinc-mng-commons-table-column-toggle.component-Dvenjj9n.mjs.map → mediusinc-mng-commons-table-column-toggle.component-0Dtv48mq.mjs.map} +1 -1
- package/fesm2022/mediusinc-mng-commons-table-mediusinc-mng-commons-table-BsAwyXiN.mjs +2417 -0
- package/fesm2022/mediusinc-mng-commons-table-mediusinc-mng-commons-table-BsAwyXiN.mjs.map +1 -0
- package/fesm2022/mediusinc-mng-commons-table.mjs +1 -1
- package/fesm2022/mediusinc-mng-commons-tableview-api.mjs +16 -3
- package/fesm2022/mediusinc-mng-commons-tableview-api.mjs.map +1 -1
- package/fesm2022/mediusinc-mng-commons-tableview.mjs +43 -47
- package/fesm2022/mediusinc-mng-commons-tableview.mjs.map +1 -1
- package/filter/index.d.ts +16 -3
- package/form/index.d.ts +48 -6
- package/i18n/en.json +5 -2
- package/i18n/sl.json +5 -2
- package/package.json +1 -1
- package/table/api/index.d.ts +2 -2
- package/table/index.d.ts +161 -126
- package/tableview/api/index.d.ts +1 -3
- package/tableview/index.d.ts +24 -33
- package/version-info.json +5 -5
- package/fesm2022/mediusinc-mng-commons-table-mediusinc-mng-commons-table-DFcdSUCN.mjs +0 -2142
- package/fesm2022/mediusinc-mng-commons-table-mediusinc-mng-commons-table-DFcdSUCN.mjs.map +0 -1
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { NgTemplateOutlet } from '@angular/common';
|
|
1
2
|
import * as i0 from '@angular/core';
|
|
2
3
|
import { forwardRef, inject, Injector, DestroyRef, input, booleanAttribute, output, viewChild, signal, computed, effect, ChangeDetectionStrategy, Component, ChangeDetectorRef, ViewEncapsulation, ElementRef, Renderer2, afterNextRender, Directive } from '@angular/core';
|
|
3
4
|
import { takeUntilDestroyed, toObservable as toObservable$1 } from '@angular/core/rxjs-interop';
|
|
@@ -5,9 +6,11 @@ import * as i1 from '@angular/forms';
|
|
|
5
6
|
import { NG_VALUE_ACCESSOR, FormsModule, NG_VALIDATORS, FormBuilder, Validators, ReactiveFormsModule, NgControl } from '@angular/forms';
|
|
6
7
|
import { TranslateService, TranslatePipe } from '@ngx-translate/core';
|
|
7
8
|
import { AutoComplete } from 'primeng/autocomplete';
|
|
9
|
+
import { InputGroup } from 'primeng/inputgroup';
|
|
10
|
+
import { InputGroupAddon } from 'primeng/inputgroupaddon';
|
|
8
11
|
import { ReplaySubject, take, switchMap, of, merge, Subject, distinctUntilChanged, debounceTime, combineLatest, tap, map as map$1 } from 'rxjs';
|
|
9
12
|
import { map } from 'rxjs/operators';
|
|
10
|
-
import { LoggerService, CommonsInternalError, FilterMatchMode, fromSubscribeError, getErrorLogLevel, toObservable, narrowI18nToTranslation } from '@mediusinc/mng-commons/core';
|
|
13
|
+
import { LoggerService, CommonsInternalError, FilterMatchMode, fromSubscribeError, getErrorLogLevel, toObservable, narrowI18nToTranslation, TemplateDirective } from '@mediusinc/mng-commons/core';
|
|
11
14
|
import { DatePicker } from 'primeng/datepicker';
|
|
12
15
|
import { MultiSelect } from 'primeng/multiselect';
|
|
13
16
|
import { Select } from 'primeng/select';
|
|
@@ -43,6 +46,7 @@ class AutocompleteComponent {
|
|
|
43
46
|
this.selectFirst = input(false, ...(ngDevMode ? [{ debugName: "selectFirst", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); //on every input field change return first given value (or null)
|
|
44
47
|
this.searchTrim = input(undefined, ...(ngDevMode ? [{ debugName: "searchTrim" }] : []));
|
|
45
48
|
this.disabledInput = input(false, ...(ngDevMode ? [{ debugName: "disabledInput", transform: booleanAttribute, alias: 'disabled' }] : [{ transform: booleanAttribute, alias: 'disabled' }]));
|
|
49
|
+
this.templates = input([], ...(ngDevMode ? [{ debugName: "templates" }] : []));
|
|
46
50
|
this.valueChange = output();
|
|
47
51
|
// eslint-disable-next-line @angular-eslint/no-output-native
|
|
48
52
|
this.blur = output();
|
|
@@ -60,6 +64,8 @@ class AutocompleteComponent {
|
|
|
60
64
|
this.suggestions = signal([], ...(ngDevMode ? [{ debugName: "suggestions" }] : []));
|
|
61
65
|
this.isPanelShown = false;
|
|
62
66
|
this.isFocused = false;
|
|
67
|
+
this.prependTemplates = computed(() => this.templates().filter(t => t.name() === 'prepend'), ...(ngDevMode ? [{ debugName: "prependTemplates" }] : []));
|
|
68
|
+
this.appendTemplates = computed(() => this.templates().filter(t => t.name() === 'append'), ...(ngDevMode ? [{ debugName: "appendTemplates" }] : []));
|
|
63
69
|
this.optionsLabelProperty = computed(() => {
|
|
64
70
|
if (this.optionsLabelTranslate()) {
|
|
65
71
|
// setup translation properties
|
|
@@ -437,11 +443,11 @@ class AutocompleteComponent {
|
|
|
437
443
|
}
|
|
438
444
|
}
|
|
439
445
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutocompleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
440
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.
|
|
446
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: AutocompleteComponent, isStandalone: true, selector: "mng-autocomplete", inputs: { dataProvider: { classPropertyName: "dataProvider", publicName: "dataProvider", isSignal: true, isRequired: true, transformFunction: null }, optionsTrackProperty: { classPropertyName: "optionsTrackProperty", publicName: "optionsTrackProperty", isSignal: true, isRequired: false, transformFunction: null }, optionsValuePropertyInit: { classPropertyName: "optionsValuePropertyInit", publicName: "optionsValueProperty", isSignal: true, isRequired: false, transformFunction: null }, optionsLabelPropertyInit: { classPropertyName: "optionsLabelPropertyInit", publicName: "optionsLabelProperty", isSignal: true, isRequired: false, transformFunction: null }, optionsLabelTranslate: { classPropertyName: "optionsLabelTranslate", publicName: "optionsLabelTranslate", isSignal: true, isRequired: false, transformFunction: null }, inlineSearch: { classPropertyName: "inlineSearch", publicName: "inlineSearch", isSignal: true, isRequired: false, transformFunction: null }, openOnFocus: { classPropertyName: "openOnFocus", publicName: "openOnFocus", isSignal: true, isRequired: false, transformFunction: null }, multiselect: { classPropertyName: "multiselect", publicName: "multiselect", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, dropdownClassName: { classPropertyName: "dropdownClassName", publicName: "dropdownClassName", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, autoClear: { classPropertyName: "autoClear", publicName: "autoClear", isSignal: true, isRequired: false, transformFunction: null }, selectFirst: { classPropertyName: "selectFirst", publicName: "selectFirst", isSignal: true, isRequired: false, transformFunction: null }, searchTrim: { classPropertyName: "searchTrim", publicName: "searchTrim", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, templates: { classPropertyName: "templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", blur: "blur" }, providers: [AUTOCOMPLETE_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeAutocomplete", first: true, predicate: AutoComplete, descendants: true, isSignal: true }], ngImport: i0, template: "<p-inputgroup>\n @for (pt of prependTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"pt.template\"></ng-container>\n </p-inputgroup-addon>\n }\n <p-autoComplete\n [ngModel]=\"ngModelValue()\"\n [placeholder]=\"placeholder()\"\n [dropdown]=\"true\"\n [dataKey]=\"optionsTrackProperty()\"\n [optionLabel]=\"optionsLabelProperty()\"\n [suggestions]=\"suggestions()\"\n [multiple]=\"multiselect()\"\n [showEmptyMessage]=\"true\"\n [emptyMessage]=\"'mngAutocomplete.noMatches' | translate\"\n [styleClass]=\"className()\"\n [panelStyleClass]=\"dropdownClassName()\"\n [inputStyle]=\"{borderTopRightRadius: '0', borderBottomRightRadius: '0'}\"\n [minLength]=\"openOnFocus() ? 0 : 1\"\n [showClear]=\"showClear()\"\n [forceSelection]=\"autoClear()\"\n [disabled]=\"disabled()\"\n [completeOnFocus]=\"openOnFocus()\"\n (completeMethod)=\"onSearch($event)\"\n (onSelect)=\"onSelect($event)\"\n (onUnselect)=\"onUnselect($event)\"\n (onFocus)=\"onFocus($event)\"\n (onBlur)=\"onBlur($event)\"\n (onClear)=\"onClear()\"\n (onShow)=\"onShow()\"\n (onHide)=\"onHide()\"\n appendTo=\"body\"\n dropdownMode=\"current\">\n </p-autoComplete>\n @for (at of appendTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"at.template\"></ng-container>\n </p-inputgroup-addon>\n }\n</p-inputgroup>\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: "component", type: AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "minQueryLength", "delay", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "appendTo"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: InputGroup, selector: "p-inputgroup, p-inputGroup, p-input-group", inputs: ["styleClass"] }, { kind: "component", type: InputGroupAddon, selector: "p-inputgroup-addon, p-inputGroupAddon", inputs: ["style", "styleClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
441
447
|
}
|
|
442
448
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutocompleteComponent, decorators: [{
|
|
443
449
|
type: Component,
|
|
444
|
-
args: [{ selector: 'mng-autocomplete', providers: [AUTOCOMPLETE_VALUE_ACCESSOR], imports: [TranslatePipe, FormsModule, AutoComplete], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-autoComplete\n
|
|
450
|
+
args: [{ selector: 'mng-autocomplete', providers: [AUTOCOMPLETE_VALUE_ACCESSOR], imports: [TranslatePipe, FormsModule, AutoComplete, InputGroup, InputGroupAddon, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-inputgroup>\n @for (pt of prependTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"pt.template\"></ng-container>\n </p-inputgroup-addon>\n }\n <p-autoComplete\n [ngModel]=\"ngModelValue()\"\n [placeholder]=\"placeholder()\"\n [dropdown]=\"true\"\n [dataKey]=\"optionsTrackProperty()\"\n [optionLabel]=\"optionsLabelProperty()\"\n [suggestions]=\"suggestions()\"\n [multiple]=\"multiselect()\"\n [showEmptyMessage]=\"true\"\n [emptyMessage]=\"'mngAutocomplete.noMatches' | translate\"\n [styleClass]=\"className()\"\n [panelStyleClass]=\"dropdownClassName()\"\n [inputStyle]=\"{borderTopRightRadius: '0', borderBottomRightRadius: '0'}\"\n [minLength]=\"openOnFocus() ? 0 : 1\"\n [showClear]=\"showClear()\"\n [forceSelection]=\"autoClear()\"\n [disabled]=\"disabled()\"\n [completeOnFocus]=\"openOnFocus()\"\n (completeMethod)=\"onSearch($event)\"\n (onSelect)=\"onSelect($event)\"\n (onUnselect)=\"onUnselect($event)\"\n (onFocus)=\"onFocus($event)\"\n (onBlur)=\"onBlur($event)\"\n (onClear)=\"onClear()\"\n (onShow)=\"onShow()\"\n (onHide)=\"onHide()\"\n appendTo=\"body\"\n dropdownMode=\"current\">\n </p-autoComplete>\n @for (at of appendTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"at.template\"></ng-container>\n </p-inputgroup-addon>\n }\n</p-inputgroup>\n" }]
|
|
445
451
|
}], ctorParameters: () => [] });
|
|
446
452
|
|
|
447
453
|
const DATE_RANGE_VALUE_ACCESSOR = {
|
|
@@ -470,6 +476,9 @@ class DateRangeComponent {
|
|
|
470
476
|
transform: booleanAttribute
|
|
471
477
|
}]));
|
|
472
478
|
this.vertical = input(false, ...(ngDevMode ? [{ debugName: "vertical", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
479
|
+
this.templates = input([], ...(ngDevMode ? [{ debugName: "templates" }] : []));
|
|
480
|
+
this.prependTemplates = computed(() => this.templates().filter(t => t.name() === 'prepend'), ...(ngDevMode ? [{ debugName: "prependTemplates" }] : []));
|
|
481
|
+
this.appendTemplates = computed(() => this.templates().filter(t => t.name() === 'append'), ...(ngDevMode ? [{ debugName: "appendTemplates" }] : []));
|
|
473
482
|
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
474
483
|
this.onChangeFn = () => { };
|
|
475
484
|
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
@@ -575,13 +584,13 @@ class DateRangeComponent {
|
|
|
575
584
|
}
|
|
576
585
|
}
|
|
577
586
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: DateRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
578
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: DateRangeComponent, isStandalone: true, selector: "mng-date-range", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, showTime: { classPropertyName: "showTime", publicName: "showTime", isSignal: true, isRequired: false, transformFunction: null }, showSeconds: { classPropertyName: "showSeconds", publicName: "showSeconds", isSignal: true, isRequired: false, transformFunction: null }, dateFormat: { classPropertyName: "dateFormat", publicName: "dateFormat", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()" } }, providers: [DATE_RANGE_VALUE_ACCESSOR, DATE_RANGE_VALIDATOR], ngImport: i0, template: "@if (showTime()) {\n <div class=\"flex gap-1\" [class.flex-col]=\"vertical()\">\n <p-date-picker\n
|
|
587
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: DateRangeComponent, isStandalone: true, selector: "mng-date-range", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, showTime: { classPropertyName: "showTime", publicName: "showTime", isSignal: true, isRequired: false, transformFunction: null }, showSeconds: { classPropertyName: "showSeconds", publicName: "showSeconds", isSignal: true, isRequired: false, transformFunction: null }, dateFormat: { classPropertyName: "dateFormat", publicName: "dateFormat", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null }, templates: { classPropertyName: "templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()" } }, providers: [DATE_RANGE_VALUE_ACCESSOR, DATE_RANGE_VALIDATOR], ngImport: i0, template: "@if (showTime()) {\n <div class=\"flex gap-1\" [class.flex-col]=\"vertical()\">\n <p-inputgroup>\n <ng-container *ngTemplateOutlet=\"prependAddons\"></ng-container>\n <p-date-picker\n appendTo=\"body\"\n [formControl]=\"fromCtrl\"\n [maxDate]=\"toCtrl.value\"\n [placeholder]=\"placeholder() + ' ' + ('mngTable.filterRangeFrom' | translate)\"\n [dateFormat]=\"dateFormat()\"\n [showTime]=\"true\"\n [showSeconds]=\"showSeconds()\"\n [showIcon]=\"true\"\n [inputStyle]=\"{borderTopRightRadius: '0', borderBottomRightRadius: '0'}\"\n [firstDayOfWeek]=\"1\"\n (onBlur)=\"onBlur()\"></p-date-picker>\n <ng-container *ngTemplateOutlet=\"appendAddons\"></ng-container>\n </p-inputgroup>\n <p-inputgroup>\n <ng-container *ngTemplateOutlet=\"prependAddons\"></ng-container>\n <p-date-picker\n appendTo=\"body\"\n [formControl]=\"toCtrl\"\n [minDate]=\"fromCtrl.value\"\n [placeholder]=\"placeholder() + ' ' + ('mngTable.filterRangeTo' | translate)\"\n [dateFormat]=\"dateFormat()\"\n [showTime]=\"true\"\n [showSeconds]=\"showSeconds()\"\n [showIcon]=\"true\"\n [inputStyle]=\"{borderTopRightRadius: '0', borderBottomRightRadius: '0'}\"\n [firstDayOfWeek]=\"1\"\n (onBlur)=\"onBlur()\"></p-date-picker>\n <ng-container *ngTemplateOutlet=\"appendAddons\"></ng-container>\n </p-inputgroup>\n </div>\n} @else {\n <p-input-group>\n <ng-container *ngTemplateOutlet=\"prependAddons\"></ng-container>\n <p-date-picker\n appendTo=\"body\"\n [formControl]=\"dateRangeCtrl\"\n [placeholder]=\"placeholder()\"\n [dateFormat]=\"dateFormat()\"\n selectionMode=\"range\"\n [showIcon]=\"true\"\n [inputStyle]=\"{borderTopRightRadius: '0', borderBottomRightRadius: '0'}\"\n [firstDayOfWeek]=\"1\"\n (onBlur)=\"onBlur()\"></p-date-picker>\n <ng-container *ngTemplateOutlet=\"appendAddons\"></ng-container>\n </p-input-group>\n}\n\n<ng-template #prependAddons>\n @for (pt of prependTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"pt.template\"></ng-container>\n </p-inputgroup-addon>\n }\n</ng-template>\n<ng-template #appendAddons>\n @for (at of appendTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"at.template\"></ng-container>\n </p-inputgroup-addon>\n }\n</ng-template>\n", styles: ["mng-date-range.ng-dirty.ng-invalid p-date-picker>.p-datepicker>.p-inputtext{border-color:var(--p-inputtext-invalid-border-color, #f87171)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "component", type: InputGroup, selector: "p-inputgroup, p-inputGroup, p-input-group", inputs: ["styleClass"] }, { kind: "component", type: InputGroupAddon, selector: "p-inputgroup-addon, p-inputGroupAddon", inputs: ["style", "styleClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
579
588
|
}
|
|
580
589
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: DateRangeComponent, decorators: [{
|
|
581
590
|
type: Component,
|
|
582
|
-
args: [{ selector: 'mng-date-range', providers: [DATE_RANGE_VALUE_ACCESSOR, DATE_RANGE_VALIDATOR], imports: [FormsModule, ReactiveFormsModule, DatePicker], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
591
|
+
args: [{ selector: 'mng-date-range', providers: [DATE_RANGE_VALUE_ACCESSOR, DATE_RANGE_VALIDATOR], imports: [FormsModule, ReactiveFormsModule, DatePicker, InputGroup, InputGroupAddon, NgTemplateOutlet, TranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
583
592
|
'[class]': 'className()'
|
|
584
|
-
}, template: "@if (showTime()) {\n <div class=\"flex gap-1\" [class.flex-col]=\"vertical()\">\n <p-date-picker\n
|
|
593
|
+
}, template: "@if (showTime()) {\n <div class=\"flex gap-1\" [class.flex-col]=\"vertical()\">\n <p-inputgroup>\n <ng-container *ngTemplateOutlet=\"prependAddons\"></ng-container>\n <p-date-picker\n appendTo=\"body\"\n [formControl]=\"fromCtrl\"\n [maxDate]=\"toCtrl.value\"\n [placeholder]=\"placeholder() + ' ' + ('mngTable.filterRangeFrom' | translate)\"\n [dateFormat]=\"dateFormat()\"\n [showTime]=\"true\"\n [showSeconds]=\"showSeconds()\"\n [showIcon]=\"true\"\n [inputStyle]=\"{borderTopRightRadius: '0', borderBottomRightRadius: '0'}\"\n [firstDayOfWeek]=\"1\"\n (onBlur)=\"onBlur()\"></p-date-picker>\n <ng-container *ngTemplateOutlet=\"appendAddons\"></ng-container>\n </p-inputgroup>\n <p-inputgroup>\n <ng-container *ngTemplateOutlet=\"prependAddons\"></ng-container>\n <p-date-picker\n appendTo=\"body\"\n [formControl]=\"toCtrl\"\n [minDate]=\"fromCtrl.value\"\n [placeholder]=\"placeholder() + ' ' + ('mngTable.filterRangeTo' | translate)\"\n [dateFormat]=\"dateFormat()\"\n [showTime]=\"true\"\n [showSeconds]=\"showSeconds()\"\n [showIcon]=\"true\"\n [inputStyle]=\"{borderTopRightRadius: '0', borderBottomRightRadius: '0'}\"\n [firstDayOfWeek]=\"1\"\n (onBlur)=\"onBlur()\"></p-date-picker>\n <ng-container *ngTemplateOutlet=\"appendAddons\"></ng-container>\n </p-inputgroup>\n </div>\n} @else {\n <p-input-group>\n <ng-container *ngTemplateOutlet=\"prependAddons\"></ng-container>\n <p-date-picker\n appendTo=\"body\"\n [formControl]=\"dateRangeCtrl\"\n [placeholder]=\"placeholder()\"\n [dateFormat]=\"dateFormat()\"\n selectionMode=\"range\"\n [showIcon]=\"true\"\n [inputStyle]=\"{borderTopRightRadius: '0', borderBottomRightRadius: '0'}\"\n [firstDayOfWeek]=\"1\"\n (onBlur)=\"onBlur()\"></p-date-picker>\n <ng-container *ngTemplateOutlet=\"appendAddons\"></ng-container>\n </p-input-group>\n}\n\n<ng-template #prependAddons>\n @for (pt of prependTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"pt.template\"></ng-container>\n </p-inputgroup-addon>\n }\n</ng-template>\n<ng-template #appendAddons>\n @for (at of appendTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"at.template\"></ng-container>\n </p-inputgroup-addon>\n }\n</ng-template>\n", styles: ["mng-date-range.ng-dirty.ng-invalid p-date-picker>.p-datepicker>.p-inputtext{border-color:var(--p-inputtext-invalid-border-color, #f87171)}\n"] }]
|
|
585
594
|
}] });
|
|
586
595
|
|
|
587
596
|
const DROPDOWN_VALUE_ACCESSOR = {
|
|
@@ -616,6 +625,7 @@ class DropdownComponent {
|
|
|
616
625
|
this.disabledInput = input(false, ...(ngDevMode ? [{ debugName: "disabledInput", alias: 'disabled', transform: booleanAttribute }] : [{ alias: 'disabled', transform: booleanAttribute }]));
|
|
617
626
|
this.allowInput = input(false, ...(ngDevMode ? [{ debugName: "allowInput", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
618
627
|
this.appendTo = input('body', ...(ngDevMode ? [{ debugName: "appendTo" }] : []));
|
|
628
|
+
this.templates = input([], ...(ngDevMode ? [{ debugName: "templates" }] : []));
|
|
619
629
|
this.inlineSearch = input(false, ...(ngDevMode ? [{ debugName: "inlineSearch", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
620
630
|
this.searchTrim = input(undefined, ...(ngDevMode ? [{ debugName: "searchTrim" }] : []));
|
|
621
631
|
this.valueChange = output();
|
|
@@ -639,6 +649,8 @@ class DropdownComponent {
|
|
|
639
649
|
// used with custom input functionality
|
|
640
650
|
this.fetchedItems = [];
|
|
641
651
|
this.customInputSubject = new Subject();
|
|
652
|
+
this.prependTemplates = computed(() => this.templates().filter(t => t.name() === 'prepend'), ...(ngDevMode ? [{ debugName: "prependTemplates" }] : []));
|
|
653
|
+
this.appendTemplates = computed(() => this.templates().filter(t => t.name() === 'append'), ...(ngDevMode ? [{ debugName: "appendTemplates" }] : []));
|
|
642
654
|
this.optionsLabelProperty = computed(() => {
|
|
643
655
|
if (this.optionsLabelTranslate()) {
|
|
644
656
|
// setup translation properties
|
|
@@ -834,6 +846,9 @@ class DropdownComponent {
|
|
|
834
846
|
onDropdownPanelHide() {
|
|
835
847
|
this.isDropdownPanelShown = false;
|
|
836
848
|
}
|
|
849
|
+
onFocus() {
|
|
850
|
+
this.onTouchedFn();
|
|
851
|
+
}
|
|
837
852
|
onMultiselectChange(event) {
|
|
838
853
|
if (!this.changeValueOnBlur()) {
|
|
839
854
|
this.propagateValueChange(event.value);
|
|
@@ -936,11 +951,11 @@ class DropdownComponent {
|
|
|
936
951
|
}
|
|
937
952
|
}
|
|
938
953
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: DropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
939
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: DropdownComponent, isStandalone: true, selector: "mng-dropdown", inputs: { dataProvider: { classPropertyName: "dataProvider", publicName: "dataProvider", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, optionsTrackProperty: { classPropertyName: "optionsTrackProperty", publicName: "optionsTrackProperty", isSignal: true, isRequired: false, transformFunction: null }, optionsLabelPropertyInit: { classPropertyName: "optionsLabelPropertyInit", publicName: "optionsLabelProperty", isSignal: true, isRequired: false, transformFunction: null }, optionsLabelTranslate: { classPropertyName: "optionsLabelTranslate", publicName: "optionsLabelTranslate", isSignal: true, isRequired: false, transformFunction: null }, optionsValuePropertyInput: { classPropertyName: "optionsValuePropertyInput", publicName: "optionsValueProperty", isSignal: true, isRequired: false, transformFunction: null }, optionsDisabledProperty: { classPropertyName: "optionsDisabledProperty", publicName: "optionsDisabledProperty", isSignal: true, isRequired: false, transformFunction: null }, multiselect: { classPropertyName: "multiselect", publicName: "multiselect", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, selectFirstItemInput: { classPropertyName: "selectFirstItemInput", publicName: "selectFirstItem", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, dropdownClassName: { classPropertyName: "dropdownClassName", publicName: "dropdownClassName", isSignal: true, isRequired: false, transformFunction: null }, changeValueOnBlur: { classPropertyName: "changeValueOnBlur", publicName: "changeValueOnBlur", isSignal: true, isRequired: false, transformFunction: null }, loadingInput: { classPropertyName: "loadingInput", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, allowInput: { classPropertyName: "allowInput", publicName: "allowInput", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, inlineSearch: { classPropertyName: "inlineSearch", publicName: "inlineSearch", isSignal: true, isRequired: false, transformFunction: null }, searchTrim: { classPropertyName: "searchTrim", publicName: "searchTrim", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", blur: "blur" }, providers: [DROPDOWN_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeSelect", first: true, predicate: Select, descendants: true, isSignal: true }, { propertyName: "primeMultiselect", first: true, predicate: MultiSelect, descendants: true, isSignal: true }], ngImport: i0, template: "@if (!multiselect()) {\n
|
|
954
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: DropdownComponent, isStandalone: true, selector: "mng-dropdown", inputs: { dataProvider: { classPropertyName: "dataProvider", publicName: "dataProvider", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, optionsTrackProperty: { classPropertyName: "optionsTrackProperty", publicName: "optionsTrackProperty", isSignal: true, isRequired: false, transformFunction: null }, optionsLabelPropertyInit: { classPropertyName: "optionsLabelPropertyInit", publicName: "optionsLabelProperty", isSignal: true, isRequired: false, transformFunction: null }, optionsLabelTranslate: { classPropertyName: "optionsLabelTranslate", publicName: "optionsLabelTranslate", isSignal: true, isRequired: false, transformFunction: null }, optionsValuePropertyInput: { classPropertyName: "optionsValuePropertyInput", publicName: "optionsValueProperty", isSignal: true, isRequired: false, transformFunction: null }, optionsDisabledProperty: { classPropertyName: "optionsDisabledProperty", publicName: "optionsDisabledProperty", isSignal: true, isRequired: false, transformFunction: null }, multiselect: { classPropertyName: "multiselect", publicName: "multiselect", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, selectFirstItemInput: { classPropertyName: "selectFirstItemInput", publicName: "selectFirstItem", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, dropdownClassName: { classPropertyName: "dropdownClassName", publicName: "dropdownClassName", isSignal: true, isRequired: false, transformFunction: null }, changeValueOnBlur: { classPropertyName: "changeValueOnBlur", publicName: "changeValueOnBlur", isSignal: true, isRequired: false, transformFunction: null }, loadingInput: { classPropertyName: "loadingInput", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, allowInput: { classPropertyName: "allowInput", publicName: "allowInput", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null }, templates: { classPropertyName: "templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null }, inlineSearch: { classPropertyName: "inlineSearch", publicName: "inlineSearch", isSignal: true, isRequired: false, transformFunction: null }, searchTrim: { classPropertyName: "searchTrim", publicName: "searchTrim", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", blur: "blur" }, providers: [DROPDOWN_VALUE_ACCESSOR], viewQueries: [{ propertyName: "primeSelect", first: true, predicate: Select, descendants: true, isSignal: true }, { propertyName: "primeMultiselect", first: true, predicate: MultiSelect, descendants: true, isSignal: true }], ngImport: i0, template: "<p-inputgroup>\n @for (pt of prependTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"pt.template\"></ng-container>\n </p-inputgroup-addon>\n }\n @if (!multiselect()) {\n <p-select\n [(ngModel)]=\"ngModelValue\"\n [placeholder]=\"placeholder()\"\n [dataKey]=\"optionsTrackProperty()\"\n [optionLabel]=\"optionsLabelProperty()\"\n [optionValue]=\"optionsValueProperty()\"\n [optionDisabled]=\"optionsDisabledProperty()\"\n [options]=\"items()\"\n [showClear]=\"showClear()\"\n [editable]=\"allowInput()\"\n [styleClass]=\"className()\"\n [panelStyleClass]=\"dropdownClassName()\"\n [disabled]=\"disabled()\"\n [filter]=\"inlineSearch() && !allowInput()\"\n [filterBy]=\"optionsLabelProperty()\"\n (onBlur)=\"onDropdownBlur($event)\"\n (onChange)=\"onDropdownChange($event)\"\n (onShow)=\"onDropdownPanelShow()\"\n (onHide)=\"onDropdownPanelHide()\"\n (onFocus)=\"onFocus()\"\n [dropdownIcon]=\"loading() ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\n [appendTo]=\"appendTo()\">\n </p-select>\n } @else {\n <p-multiSelect\n [ngModel]=\"ngModelValue()\"\n [maxSelectedLabels]=\"1\"\n [selectedItemsLabel]=\"'mngDropdown.multiselectOverMaxDisplayLimit' | translate\"\n [placeholder]=\"placeholder()\"\n [dataKey]=\"optionsTrackProperty()\"\n [optionLabel]=\"optionsLabelProperty()\"\n [optionValue]=\"optionsValueProperty()\"\n [optionDisabled]=\"optionsDisabledProperty()\"\n [options]=\"items()\"\n [styleClass]=\"className()\"\n [panelStyleClass]=\"dropdownClassName()\"\n [filter]=\"true\"\n [showToggleAll]=\"false\"\n [disabled]=\"disabled()\"\n (onChange)=\"onMultiselectChange($event)\"\n (onPanelHide)=\"onMultiselectPanelHide()\"\n (onBlur)=\"onMultiselectBlur($event)\"\n (onFocus)=\"onFocus()\"\n appendTo=\"body\">\n </p-multiSelect>\n }\n @for (at of appendTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"at.template\"></ng-container>\n </p-inputgroup-addon>\n }\n</p-inputgroup>\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: "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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: InputGroup, selector: "p-inputgroup, p-inputGroup, p-input-group", inputs: ["styleClass"] }, { kind: "component", type: InputGroupAddon, selector: "p-inputgroup-addon, p-inputGroupAddon", inputs: ["style", "styleClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
940
955
|
}
|
|
941
956
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: DropdownComponent, decorators: [{
|
|
942
957
|
type: Component,
|
|
943
|
-
args: [{ selector: 'mng-dropdown', providers: [DROPDOWN_VALUE_ACCESSOR], imports: [TranslatePipe, FormsModule, Select, MultiSelect], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!multiselect()) {\n
|
|
958
|
+
args: [{ selector: 'mng-dropdown', providers: [DROPDOWN_VALUE_ACCESSOR], imports: [TranslatePipe, FormsModule, Select, MultiSelect, InputGroup, InputGroupAddon, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-inputgroup>\n @for (pt of prependTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"pt.template\"></ng-container>\n </p-inputgroup-addon>\n }\n @if (!multiselect()) {\n <p-select\n [(ngModel)]=\"ngModelValue\"\n [placeholder]=\"placeholder()\"\n [dataKey]=\"optionsTrackProperty()\"\n [optionLabel]=\"optionsLabelProperty()\"\n [optionValue]=\"optionsValueProperty()\"\n [optionDisabled]=\"optionsDisabledProperty()\"\n [options]=\"items()\"\n [showClear]=\"showClear()\"\n [editable]=\"allowInput()\"\n [styleClass]=\"className()\"\n [panelStyleClass]=\"dropdownClassName()\"\n [disabled]=\"disabled()\"\n [filter]=\"inlineSearch() && !allowInput()\"\n [filterBy]=\"optionsLabelProperty()\"\n (onBlur)=\"onDropdownBlur($event)\"\n (onChange)=\"onDropdownChange($event)\"\n (onShow)=\"onDropdownPanelShow()\"\n (onHide)=\"onDropdownPanelHide()\"\n (onFocus)=\"onFocus()\"\n [dropdownIcon]=\"loading() ? 'pi pi-spinner pi-spin' : 'pi pi-chevron-down'\"\n [appendTo]=\"appendTo()\">\n </p-select>\n } @else {\n <p-multiSelect\n [ngModel]=\"ngModelValue()\"\n [maxSelectedLabels]=\"1\"\n [selectedItemsLabel]=\"'mngDropdown.multiselectOverMaxDisplayLimit' | translate\"\n [placeholder]=\"placeholder()\"\n [dataKey]=\"optionsTrackProperty()\"\n [optionLabel]=\"optionsLabelProperty()\"\n [optionValue]=\"optionsValueProperty()\"\n [optionDisabled]=\"optionsDisabledProperty()\"\n [options]=\"items()\"\n [styleClass]=\"className()\"\n [panelStyleClass]=\"dropdownClassName()\"\n [filter]=\"true\"\n [showToggleAll]=\"false\"\n [disabled]=\"disabled()\"\n (onChange)=\"onMultiselectChange($event)\"\n (onPanelHide)=\"onMultiselectPanelHide()\"\n (onBlur)=\"onMultiselectBlur($event)\"\n (onFocus)=\"onFocus()\"\n appendTo=\"body\">\n </p-multiSelect>\n }\n @for (at of appendTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"at.template\"></ng-container>\n </p-inputgroup-addon>\n }\n</p-inputgroup>\n" }]
|
|
944
959
|
}], ctorParameters: () => [] });
|
|
945
960
|
|
|
946
961
|
const NUMBER_RANGE_VALUE_ACCESSOR = {
|
|
@@ -972,7 +987,11 @@ class NumberRangeComponent {
|
|
|
972
987
|
transform: booleanAttribute
|
|
973
988
|
}]));
|
|
974
989
|
this.vertical = input(false, ...(ngDevMode ? [{ debugName: "vertical", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
990
|
+
this.templates = input([], ...(ngDevMode ? [{ debugName: "templates" }] : []));
|
|
991
|
+
this.className = input(...(ngDevMode ? [undefined, { debugName: "className" }] : []));
|
|
975
992
|
this.keyDown = output();
|
|
993
|
+
this.prependTemplates = computed(() => this.templates().filter(t => t.name() === 'prepend'), ...(ngDevMode ? [{ debugName: "prependTemplates" }] : []));
|
|
994
|
+
this.appendTemplates = computed(() => this.templates().filter(t => t.name() === 'append'), ...(ngDevMode ? [{ debugName: "appendTemplates" }] : []));
|
|
976
995
|
this.fromToFormControl = this.formBuilder.group({
|
|
977
996
|
from: [null, Validators.required],
|
|
978
997
|
to: [null, Validators.required]
|
|
@@ -1051,11 +1070,11 @@ class NumberRangeComponent {
|
|
|
1051
1070
|
this.onChangeFn([fromDate, toDate]);
|
|
1052
1071
|
}
|
|
1053
1072
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NumberRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1054
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.
|
|
1073
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: NumberRangeComponent, isStandalone: true, selector: "mng-number-range", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, useGrouping: { classPropertyName: "useGrouping", publicName: "useGrouping", isSignal: true, isRequired: false, transformFunction: null }, minFractionDigits: { classPropertyName: "minFractionDigits", publicName: "minFractionDigits", isSignal: true, isRequired: false, transformFunction: null }, maxFractionDigits: { classPropertyName: "maxFractionDigits", publicName: "maxFractionDigits", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null }, templates: { classPropertyName: "templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { keyDown: "keyDown" }, providers: [NUMBER_RANGE_VALUE_ACCESSOR, NUMBER_RANGE_VALIDATOR], ngImport: i0, template: "<div class=\"flex gap-1\" [class.flex-col]=\"vertical()\">\n <p-inputgroup>\n <ng-container *ngTemplateOutlet=\"prependAddons\"></ng-container>\n <p-inputNumber\n [formControl]=\"fromCtrl\"\n [placeholder]=\"placeholder() + ' ' + ('mngTable.filterRangeFrom' | translate)\"\n [useGrouping]=\"useGrouping()\"\n [minFractionDigits]=\"minFractionDigits()\"\n [maxFractionDigits]=\"maxFractionDigits()\"\n [max]=\"toCtrl.value\"\n [inputStyleClass]=\"className()\"\n (onKeyDown)=\"onKeyDown($event)\"\n (onBlur)=\"onBlur()\" />\n <ng-container *ngTemplateOutlet=\"appendAddons\"></ng-container>\n </p-inputgroup>\n <p-inputgroup>\n <ng-container *ngTemplateOutlet=\"prependAddons\"></ng-container>\n <p-inputNumber\n [formControl]=\"toCtrl\"\n [placeholder]=\"placeholder() + ' ' + ('mngTable.filterRangeTo' | translate)\"\n [useGrouping]=\"useGrouping()\"\n [minFractionDigits]=\"minFractionDigits()\"\n [maxFractionDigits]=\"maxFractionDigits()\"\n [min]=\"fromCtrl.value\"\n [inputStyleClass]=\"className()\"\n (onKeyDown)=\"onKeyDown($event)\"\n (onBlur)=\"onBlur()\" />\n <ng-container *ngTemplateOutlet=\"appendAddons\"></ng-container>\n </p-inputgroup>\n</div>\n\n<ng-template #prependAddons>\n @for (pt of prependTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"pt.template\"></ng-container>\n </p-inputgroup-addon>\n }\n</ng-template>\n<ng-template #appendAddons>\n @for (at of appendTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"at.template\"></ng-container>\n </p-inputgroup-addon>\n }\n</ng-template>\n", styles: ["mng-number-range.ng-dirty.ng-invalid>div>p-inputnumber .p-inputtext{border-color:var(--p-inputtext-invalid-border-color, #f87171)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: 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: InputGroup, selector: "p-inputgroup, p-inputGroup, p-input-group", inputs: ["styleClass"] }, { kind: "component", type: InputGroupAddon, selector: "p-inputgroup-addon, p-inputGroupAddon", inputs: ["style", "styleClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1055
1074
|
}
|
|
1056
1075
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NumberRangeComponent, decorators: [{
|
|
1057
1076
|
type: Component,
|
|
1058
|
-
args: [{ selector: 'mng-number-range', providers: [NUMBER_RANGE_VALUE_ACCESSOR, NUMBER_RANGE_VALIDATOR], imports: [FormsModule, ReactiveFormsModule, InputNumber], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"flex gap-1\" [class.flex-col]=\"vertical()\">\n <p-inputNumber\n
|
|
1077
|
+
args: [{ selector: 'mng-number-range', providers: [NUMBER_RANGE_VALUE_ACCESSOR, NUMBER_RANGE_VALIDATOR], imports: [FormsModule, ReactiveFormsModule, InputNumber, InputGroup, InputGroupAddon, NgTemplateOutlet, TranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"flex gap-1\" [class.flex-col]=\"vertical()\">\n <p-inputgroup>\n <ng-container *ngTemplateOutlet=\"prependAddons\"></ng-container>\n <p-inputNumber\n [formControl]=\"fromCtrl\"\n [placeholder]=\"placeholder() + ' ' + ('mngTable.filterRangeFrom' | translate)\"\n [useGrouping]=\"useGrouping()\"\n [minFractionDigits]=\"minFractionDigits()\"\n [maxFractionDigits]=\"maxFractionDigits()\"\n [max]=\"toCtrl.value\"\n [inputStyleClass]=\"className()\"\n (onKeyDown)=\"onKeyDown($event)\"\n (onBlur)=\"onBlur()\" />\n <ng-container *ngTemplateOutlet=\"appendAddons\"></ng-container>\n </p-inputgroup>\n <p-inputgroup>\n <ng-container *ngTemplateOutlet=\"prependAddons\"></ng-container>\n <p-inputNumber\n [formControl]=\"toCtrl\"\n [placeholder]=\"placeholder() + ' ' + ('mngTable.filterRangeTo' | translate)\"\n [useGrouping]=\"useGrouping()\"\n [minFractionDigits]=\"minFractionDigits()\"\n [maxFractionDigits]=\"maxFractionDigits()\"\n [min]=\"fromCtrl.value\"\n [inputStyleClass]=\"className()\"\n (onKeyDown)=\"onKeyDown($event)\"\n (onBlur)=\"onBlur()\" />\n <ng-container *ngTemplateOutlet=\"appendAddons\"></ng-container>\n </p-inputgroup>\n</div>\n\n<ng-template #prependAddons>\n @for (pt of prependTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"pt.template\"></ng-container>\n </p-inputgroup-addon>\n }\n</ng-template>\n<ng-template #appendAddons>\n @for (at of appendTemplates(); track $index) {\n <p-inputgroup-addon>\n <ng-container *ngTemplateOutlet=\"at.template\"></ng-container>\n </p-inputgroup-addon>\n }\n</ng-template>\n", styles: ["mng-number-range.ng-dirty.ng-invalid>div>p-inputnumber .p-inputtext{border-color:var(--p-inputtext-invalid-border-color, #f87171)}\n"] }]
|
|
1059
1078
|
}], ctorParameters: () => [] });
|
|
1060
1079
|
|
|
1061
1080
|
/**
|
|
@@ -1207,11 +1226,75 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
1207
1226
|
}]
|
|
1208
1227
|
}] });
|
|
1209
1228
|
|
|
1229
|
+
class AutocompleteTemplateDirective extends TemplateDirective {
|
|
1230
|
+
constructor() {
|
|
1231
|
+
super(...arguments);
|
|
1232
|
+
this.name = input.required(...(ngDevMode ? [{ debugName: "name" }] : []));
|
|
1233
|
+
}
|
|
1234
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutocompleteTemplateDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1235
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: AutocompleteTemplateDirective, isStandalone: true, selector: "[mngAutocompleteTemplate]", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["mngAutocompleteTemplate"], usesInheritance: true, ngImport: i0 }); }
|
|
1236
|
+
}
|
|
1237
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AutocompleteTemplateDirective, decorators: [{
|
|
1238
|
+
type: Directive,
|
|
1239
|
+
args: [{
|
|
1240
|
+
selector: '[mngAutocompleteTemplate]',
|
|
1241
|
+
exportAs: 'mngAutocompleteTemplate'
|
|
1242
|
+
}]
|
|
1243
|
+
}] });
|
|
1244
|
+
|
|
1245
|
+
class DateRangeTemplateDirective extends TemplateDirective {
|
|
1246
|
+
constructor() {
|
|
1247
|
+
super(...arguments);
|
|
1248
|
+
this.name = input.required(...(ngDevMode ? [{ debugName: "name" }] : []));
|
|
1249
|
+
}
|
|
1250
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: DateRangeTemplateDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1251
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: DateRangeTemplateDirective, isStandalone: true, selector: "[mngDateRangeTemplate]", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["mngDateRangeTemplate"], usesInheritance: true, ngImport: i0 }); }
|
|
1252
|
+
}
|
|
1253
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: DateRangeTemplateDirective, decorators: [{
|
|
1254
|
+
type: Directive,
|
|
1255
|
+
args: [{
|
|
1256
|
+
selector: '[mngDateRangeTemplate]',
|
|
1257
|
+
exportAs: 'mngDateRangeTemplate'
|
|
1258
|
+
}]
|
|
1259
|
+
}] });
|
|
1260
|
+
|
|
1261
|
+
class DropdownTemplateDirective extends TemplateDirective {
|
|
1262
|
+
constructor() {
|
|
1263
|
+
super(...arguments);
|
|
1264
|
+
this.name = input.required(...(ngDevMode ? [{ debugName: "name" }] : []));
|
|
1265
|
+
}
|
|
1266
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: DropdownTemplateDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1267
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: DropdownTemplateDirective, isStandalone: true, selector: "[mngDropdownTemplate]", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["mngDropdownTemplate"], usesInheritance: true, ngImport: i0 }); }
|
|
1268
|
+
}
|
|
1269
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: DropdownTemplateDirective, decorators: [{
|
|
1270
|
+
type: Directive,
|
|
1271
|
+
args: [{
|
|
1272
|
+
selector: '[mngDropdownTemplate]',
|
|
1273
|
+
exportAs: 'mngDropdownTemplate'
|
|
1274
|
+
}]
|
|
1275
|
+
}] });
|
|
1276
|
+
|
|
1277
|
+
class NumberRangeTemplateDirective extends TemplateDirective {
|
|
1278
|
+
constructor() {
|
|
1279
|
+
super(...arguments);
|
|
1280
|
+
this.name = input.required(...(ngDevMode ? [{ debugName: "name" }] : []));
|
|
1281
|
+
}
|
|
1282
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NumberRangeTemplateDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1283
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: NumberRangeTemplateDirective, isStandalone: true, selector: "[mngNumberRangeTemplate]", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["mngNumberRangeTemplate"], usesInheritance: true, ngImport: i0 }); }
|
|
1284
|
+
}
|
|
1285
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NumberRangeTemplateDirective, decorators: [{
|
|
1286
|
+
type: Directive,
|
|
1287
|
+
args: [{
|
|
1288
|
+
selector: '[mngNumberRangeTemplate]',
|
|
1289
|
+
exportAs: 'mngNumberRangeTemplate'
|
|
1290
|
+
}]
|
|
1291
|
+
}] });
|
|
1292
|
+
|
|
1210
1293
|
// components
|
|
1211
1294
|
|
|
1212
1295
|
/**
|
|
1213
1296
|
* Generated bundle index. Do not edit.
|
|
1214
1297
|
*/
|
|
1215
1298
|
|
|
1216
|
-
export { AUTOCOMPLETE_VALUE_ACCESSOR, AutocompleteComponent, DATE_RANGE_VALIDATOR, DATE_RANGE_VALUE_ACCESSOR, DROPDOWN_VALUE_ACCESSOR, DateRangeComponent, DropdownComponent, InputEmptyValueDirective, InputTrimDirective, NUMBER_RANGE_VALIDATOR, NUMBER_RANGE_VALUE_ACCESSOR, NumberRangeComponent };
|
|
1299
|
+
export { AUTOCOMPLETE_VALUE_ACCESSOR, AutocompleteComponent, AutocompleteTemplateDirective, DATE_RANGE_VALIDATOR, DATE_RANGE_VALUE_ACCESSOR, DROPDOWN_VALUE_ACCESSOR, DateRangeComponent, DateRangeTemplateDirective, DropdownComponent, DropdownTemplateDirective, InputEmptyValueDirective, InputTrimDirective, NUMBER_RANGE_VALIDATOR, NUMBER_RANGE_VALUE_ACCESSOR, NumberRangeComponent, NumberRangeTemplateDirective };
|
|
1217
1300
|
//# sourceMappingURL=mediusinc-mng-commons-form.mjs.map
|