npm - monkey-front-components - Versions diffs - 0.0.369 → 0.0.373 - Mend

monkey-front-components 0.0.369 → 0.0.373

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.

Files changed (8) hide show

package/fesm2020/monkey-front-components.mjs CHANGED Viewed

@@ -2121,10 +2121,10 @@ class MECXFilterComponent {
     }
 }
 MECXFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: MECXFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MECXFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: MECXFilterComponent, selector: "mecx-filter", inputs: { searchPlaceholder: "searchPlaceholder", orderPlaceholder: "orderPlaceholder", menus: "menus", orders: "orders", enableSearch: "enableSearch", search: "search", order: "order", isLoading: "isLoading" }, outputs: { onFilter: "onFilter" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"d-flex flex-column full-width\">\n  <div class=\"d-flex flex-column flex-md-row justify-content-between\">\n    <div class=\"d-flex full-width\">\n      <ng-container *ngIf=\"enableSearch\">\n        <monkey-input-filter [placeholder]=\"searchPlaceholder | translate\"\n          (onChange)=\"onSearchFilter($event)\" icon=\"search-16\" iconPosition=\"left\"\n          [(value)]=\"_search\">\n        </monkey-input-filter>\n      </ng-container>\n      <ng-container *ngIf=\"!_hasFilterByMenu\">\n        <div class=\"d-flex actions\" id=\"mecx-filters-add-filter\">\n          <monkey-button type=\"filter\" color=\"border\" (click)=\"onHandleShowMenu()\" icon=\"more-16\"\n            iconPosition=\"right\">\n            {{ 'BUTTONS.ADD-FILTER' | translate }}\n          </monkey-button>\n        </div>\n      </ng-container>\n    </div>\n    <div class=\"order hidden-sm hidden-xs\">\n      <ng-container *ngTemplateOutlet=\"orderBy\"></ng-container>\n    </div>\n  </div>\n  <ng-container *ngIf=\"_hasFilterByMenu\">\n    <div class=\"separator\"></div>\n    <div class=\"d-flex full-width\">\n      <mecx-filter-selected (onSubmit)=\"onHandleSubmit($event)\" (onClose)=\"onHandleClose()\"\n        [model]=\"menus\"></mecx-filter-selected>\n      <div class=\"more-filters\">\n        <monkey-button type=\"filter\" color=\"border\" icon=\"more-16\" id=\"mecx-filters-add-filter\"\n          (click)=\"onHandleShowMenu()\">\n        </monkey-button>\n      </div>\n    </div>\n  </ng-container>\n  <div class=\"order hidden-md hidden-lg\">\n    <ng-container *ngTemplateOutlet=\"orderBy\"></ng-container>\n  </div>\n</div>\n\n<mecx-filter-menu\n  *monkeyecxPopover=\"_showMenu; target: $any(_actionElement); closed: closeMenu; dir: 'ltr'\"\n  (onSubmit)=\"onHandleSubmit($event)\" (onClose)=\"onHandleClose()\" [model]=\"menus\">\n</mecx-filter-menu>\n\n<ng-template #orderBy>\n  <monkey-select-filter (onChange)=\"onHandleOrder($event)\" [placeholder]=\"orderPlaceholder | translate\" type=\"none\"\n    [(value)]=\"_order\">\n    <monkey-option *ngFor=\"let ordBy of orders\" [label]=\"ordBy?.label\" [value]=\"ordBy?.value\">\n    </monkey-option>\n  </monkey-select-filter>\n</ng-template>", styles: [":host{display:flex;width:100%;align-items:center}@media screen and (max-width: 959px){:host{flex-direction:column;max-width:100%}:host ::ng-deep monkey-input-filter{width:100%}:host ::ng-deep monkey-select-filter{width:100%}:host ::ng-deep monkey-button{width:100%}:host ::ng-deep monkey-button button{width:100%}}@media screen and (min-width: 960px){:host .actions ::ng-deep monkey-button{margin-left:8px}:host .actions ::ng-deep monkey-button button{width:170px}}:host .more-filters ::ng-deep monkey-button monkey-icon{margin-right:unset!important}@media screen and (min-width: 960px){:host .order{width:230px}}@media screen and (max-width: 959px){:host .order{margin-top:8px}}:host ::ng-deep monkey-button{margin-bottom:0}:host ::ng-deep mecx-form-field-filter mecx-form-field-body{height:40px;margin:0}@media screen and (min-width: 960px){:host ::ng-deep monkey-input-filter{width:464px}}:host .separator{border-bottom:1px solid #ebebeb;margin-top:16px;margin-bottom:16px}\n"], components: [{ type: i1$2.MonkeyInputFilterComponent, selector: "monkey-input-filter", inputs: ["name", "label", "helperMessage", "placeholder", "icon", "type", "infoMessage", "errorMessage", "mask", "prefix", "onlyNumber", "onlyAlphaNumeric", "upperCase", "lowerCase", "capitalize", "currency", "iconPosition", "value"], outputs: ["onChange"] }, { type: i1$2.MonkeyButtonComponent, selector: "monkey-button", inputs: ["label", "icon", "iconPosition", "type", "color", "disabled", "size"] }, { type: MECXFilterSelectedComponent, selector: "mecx-filter-selected", inputs: ["model"], outputs: ["onOpenFilters", "onClose", "onSubmit"] }, { type: MECXFilterMenuComponent, selector: "mecx-filter-menu", inputs: ["model"], outputs: ["onClose", "onSubmit"] }, { type: i1$2.MonkeySelectFilterComponent, selector: "monkey-select-filter", inputs: ["placeholder", "icon", "type", "value"], outputs: ["onChange"] }, { type: i1$2.MonkeyOptionComponent, selector: "monkey-option", inputs: ["type", "label", "value", "selectAll", "selected", "enableClick"], outputs: ["onSelectOption"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1$4.MonkeyEcxPopoverDirective, selector: "[monkeyecxPopover]", inputs: ["monkeyecxPopover", "monkeyecxPopoverClosed", "monkeyecxPopoverTarget", "monkeyecxPopoverMinwidth", "monkeyecxPopoverBackdrop", "monkeyecxPopoverWatch", "monkeyecxPopoverDir", "monkeyecxPopoverContextmenu", "monkeyecxPopoverHeight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i1$3.TranslatePipe } });
+MECXFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: MECXFilterComponent, selector: "mecx-filter", inputs: { searchPlaceholder: "searchPlaceholder", orderPlaceholder: "orderPlaceholder", menus: "menus", orders: "orders", enableSearch: "enableSearch", search: "search", order: "order", isLoading: "isLoading" }, outputs: { onFilter: "onFilter" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"d-flex flex-column full-width\">\n  <div class=\"d-flex flex-column flex-md-row justify-content-between\">\n    <div class=\"d-flex full-width\">\n      <ng-container *ngIf=\"enableSearch\">\n        <monkey-input-filter [placeholder]=\"searchPlaceholder | translate\"\n          (onChange)=\"onSearchFilter($event)\" icon=\"search-16\" iconPosition=\"left\"\n          [(value)]=\"_search\">\n        </monkey-input-filter>\n      </ng-container>\n      <ng-container *ngIf=\"!_hasFilterByMenu\">\n        <div class=\"d-flex actions\" id=\"mecx-filters-add-filter\">\n          <monkey-button type=\"filter\" color=\"border\" (click)=\"onHandleShowMenu()\" icon=\"more-16\"\n            iconPosition=\"right\">\n            {{ 'BUTTONS.ADD-FILTER' | translate }}\n          </monkey-button>\n        </div>\n      </ng-container>\n    </div>\n    <div class=\"order hidden-sm hidden-xs\">\n      <ng-container *ngTemplateOutlet=\"orderBy\"></ng-container>\n    </div>\n  </div>\n  <ng-container *ngIf=\"_hasFilterByMenu\">\n    <div class=\"separator\"></div>\n    <div class=\"d-flex full-width\">\n      <mecx-filter-selected (onSubmit)=\"onHandleSubmit($event)\" (onClose)=\"onHandleClose()\"\n        [model]=\"menus\"></mecx-filter-selected>\n      <div class=\"more-filters\">\n        <monkey-button type=\"filter\" color=\"border\" icon=\"more-16\" id=\"mecx-filters-add-filter\"\n          (click)=\"onHandleShowMenu()\">\n        </monkey-button>\n      </div>\n    </div>\n  </ng-container>\n  <div class=\"order hidden-md hidden-lg\">\n    <ng-container *ngTemplateOutlet=\"orderBy\"></ng-container>\n  </div>\n</div>\n\n<mecx-filter-menu\n  *monkeyecxPopover=\"_showMenu; target: $any(_actionElement); closed: closeMenu; dir: 'ltr'\"\n  (onSubmit)=\"onHandleSubmit($event)\" (onClose)=\"onHandleClose()\" [model]=\"menus\">\n</mecx-filter-menu>\n\n<ng-template #orderBy>\n  <monkey-select-filter (onChange)=\"onHandleOrder($event)\" [placeholder]=\"orderPlaceholder | translate\" type=\"none\"\n    [(value)]=\"_order\">\n    <monkey-option *ngFor=\"let ordBy of orders\" [label]=\"ordBy?.label | translate\" [value]=\"ordBy?.value\">\n    </monkey-option>\n  </monkey-select-filter>\n</ng-template>", styles: [":host{display:flex;width:100%;align-items:center}@media screen and (max-width: 959px){:host{flex-direction:column;max-width:100%}:host ::ng-deep monkey-input-filter{width:100%}:host ::ng-deep monkey-select-filter{width:100%}:host ::ng-deep monkey-button{width:100%}:host ::ng-deep monkey-button button{width:100%}}@media screen and (min-width: 960px){:host .actions ::ng-deep monkey-button{margin-left:8px}:host .actions ::ng-deep monkey-button button{width:170px}}:host .more-filters ::ng-deep monkey-button monkey-icon{margin-right:unset!important}@media screen and (min-width: 960px){:host .order{width:230px}}@media screen and (max-width: 959px){:host .order{margin-top:8px}}:host ::ng-deep monkey-button{margin-bottom:0}:host ::ng-deep mecx-form-field-filter mecx-form-field-body{height:40px;margin:0}@media screen and (min-width: 960px){:host ::ng-deep monkey-input-filter{width:464px}}:host .separator{border-bottom:1px solid #ebebeb;margin-top:16px;margin-bottom:16px}\n"], components: [{ type: i1$2.MonkeyInputFilterComponent, selector: "monkey-input-filter", inputs: ["name", "label", "helperMessage", "placeholder", "icon", "type", "infoMessage", "errorMessage", "mask", "prefix", "onlyNumber", "onlyAlphaNumeric", "upperCase", "lowerCase", "capitalize", "currency", "iconPosition", "value"], outputs: ["onChange"] }, { type: i1$2.MonkeyButtonComponent, selector: "monkey-button", inputs: ["label", "icon", "iconPosition", "type", "color", "disabled", "size"] }, { type: MECXFilterSelectedComponent, selector: "mecx-filter-selected", inputs: ["model"], outputs: ["onOpenFilters", "onClose", "onSubmit"] }, { type: MECXFilterMenuComponent, selector: "mecx-filter-menu", inputs: ["model"], outputs: ["onClose", "onSubmit"] }, { type: i1$2.MonkeySelectFilterComponent, selector: "monkey-select-filter", inputs: ["placeholder", "icon", "type", "value"], outputs: ["onChange"] }, { type: i1$2.MonkeyOptionComponent, selector: "monkey-option", inputs: ["type", "label", "value", "selectAll", "selected", "enableClick"], outputs: ["onSelectOption"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1$4.MonkeyEcxPopoverDirective, selector: "[monkeyecxPopover]", inputs: ["monkeyecxPopover", "monkeyecxPopoverClosed", "monkeyecxPopoverTarget", "monkeyecxPopoverMinwidth", "monkeyecxPopoverBackdrop", "monkeyecxPopoverWatch", "monkeyecxPopoverDir", "monkeyecxPopoverContextmenu", "monkeyecxPopoverHeight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i1$3.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: MECXFilterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mecx-filter', template: "<div class=\"d-flex flex-column full-width\">\n  <div class=\"d-flex flex-column flex-md-row justify-content-between\">\n    <div class=\"d-flex full-width\">\n      <ng-container *ngIf=\"enableSearch\">\n        <monkey-input-filter [placeholder]=\"searchPlaceholder | translate\"\n          (onChange)=\"onSearchFilter($event)\" icon=\"search-16\" iconPosition=\"left\"\n          [(value)]=\"_search\">\n        </monkey-input-filter>\n      </ng-container>\n      <ng-container *ngIf=\"!_hasFilterByMenu\">\n        <div class=\"d-flex actions\" id=\"mecx-filters-add-filter\">\n          <monkey-button type=\"filter\" color=\"border\" (click)=\"onHandleShowMenu()\" icon=\"more-16\"\n            iconPosition=\"right\">\n            {{ 'BUTTONS.ADD-FILTER' | translate }}\n          </monkey-button>\n        </div>\n      </ng-container>\n    </div>\n    <div class=\"order hidden-sm hidden-xs\">\n      <ng-container *ngTemplateOutlet=\"orderBy\"></ng-container>\n    </div>\n  </div>\n  <ng-container *ngIf=\"_hasFilterByMenu\">\n    <div class=\"separator\"></div>\n    <div class=\"d-flex full-width\">\n      <mecx-filter-selected (onSubmit)=\"onHandleSubmit($event)\" (onClose)=\"onHandleClose()\"\n        [model]=\"menus\"></mecx-filter-selected>\n      <div class=\"more-filters\">\n        <monkey-button type=\"filter\" color=\"border\" icon=\"more-16\" id=\"mecx-filters-add-filter\"\n          (click)=\"onHandleShowMenu()\">\n        </monkey-button>\n      </div>\n    </div>\n  </ng-container>\n  <div class=\"order hidden-md hidden-lg\">\n    <ng-container *ngTemplateOutlet=\"orderBy\"></ng-container>\n  </div>\n</div>\n\n<mecx-filter-menu\n  *monkeyecxPopover=\"_showMenu; target: $any(_actionElement); closed: closeMenu; dir: 'ltr'\"\n  (onSubmit)=\"onHandleSubmit($event)\" (onClose)=\"onHandleClose()\" [model]=\"menus\">\n</mecx-filter-menu>\n\n<ng-template #orderBy>\n  <monkey-select-filter (onChange)=\"onHandleOrder($event)\" [placeholder]=\"orderPlaceholder | translate\" type=\"none\"\n    [(value)]=\"_order\">\n    <monkey-option *ngFor=\"let ordBy of orders\" [label]=\"ordBy?.label\" [value]=\"ordBy?.value\">\n    </monkey-option>\n  </monkey-select-filter>\n</ng-template>", styles: [":host{display:flex;width:100%;align-items:center}@media screen and (max-width: 959px){:host{flex-direction:column;max-width:100%}:host ::ng-deep monkey-input-filter{width:100%}:host ::ng-deep monkey-select-filter{width:100%}:host ::ng-deep monkey-button{width:100%}:host ::ng-deep monkey-button button{width:100%}}@media screen and (min-width: 960px){:host .actions ::ng-deep monkey-button{margin-left:8px}:host .actions ::ng-deep monkey-button button{width:170px}}:host .more-filters ::ng-deep monkey-button monkey-icon{margin-right:unset!important}@media screen and (min-width: 960px){:host .order{width:230px}}@media screen and (max-width: 959px){:host .order{margin-top:8px}}:host ::ng-deep monkey-button{margin-bottom:0}:host ::ng-deep mecx-form-field-filter mecx-form-field-body{height:40px;margin:0}@media screen and (min-width: 960px){:host ::ng-deep monkey-input-filter{width:464px}}:host .separator{border-bottom:1px solid #ebebeb;margin-top:16px;margin-bottom:16px}\n"] }]
+            args: [{ selector: 'mecx-filter', template: "<div class=\"d-flex flex-column full-width\">\n  <div class=\"d-flex flex-column flex-md-row justify-content-between\">\n    <div class=\"d-flex full-width\">\n      <ng-container *ngIf=\"enableSearch\">\n        <monkey-input-filter [placeholder]=\"searchPlaceholder | translate\"\n          (onChange)=\"onSearchFilter($event)\" icon=\"search-16\" iconPosition=\"left\"\n          [(value)]=\"_search\">\n        </monkey-input-filter>\n      </ng-container>\n      <ng-container *ngIf=\"!_hasFilterByMenu\">\n        <div class=\"d-flex actions\" id=\"mecx-filters-add-filter\">\n          <monkey-button type=\"filter\" color=\"border\" (click)=\"onHandleShowMenu()\" icon=\"more-16\"\n            iconPosition=\"right\">\n            {{ 'BUTTONS.ADD-FILTER' | translate }}\n          </monkey-button>\n        </div>\n      </ng-container>\n    </div>\n    <div class=\"order hidden-sm hidden-xs\">\n      <ng-container *ngTemplateOutlet=\"orderBy\"></ng-container>\n    </div>\n  </div>\n  <ng-container *ngIf=\"_hasFilterByMenu\">\n    <div class=\"separator\"></div>\n    <div class=\"d-flex full-width\">\n      <mecx-filter-selected (onSubmit)=\"onHandleSubmit($event)\" (onClose)=\"onHandleClose()\"\n        [model]=\"menus\"></mecx-filter-selected>\n      <div class=\"more-filters\">\n        <monkey-button type=\"filter\" color=\"border\" icon=\"more-16\" id=\"mecx-filters-add-filter\"\n          (click)=\"onHandleShowMenu()\">\n        </monkey-button>\n      </div>\n    </div>\n  </ng-container>\n  <div class=\"order hidden-md hidden-lg\">\n    <ng-container *ngTemplateOutlet=\"orderBy\"></ng-container>\n  </div>\n</div>\n\n<mecx-filter-menu\n  *monkeyecxPopover=\"_showMenu; target: $any(_actionElement); closed: closeMenu; dir: 'ltr'\"\n  (onSubmit)=\"onHandleSubmit($event)\" (onClose)=\"onHandleClose()\" [model]=\"menus\">\n</mecx-filter-menu>\n\n<ng-template #orderBy>\n  <monkey-select-filter (onChange)=\"onHandleOrder($event)\" [placeholder]=\"orderPlaceholder | translate\" type=\"none\"\n    [(value)]=\"_order\">\n    <monkey-option *ngFor=\"let ordBy of orders\" [label]=\"ordBy?.label | translate\" [value]=\"ordBy?.value\">\n    </monkey-option>\n  </monkey-select-filter>\n</ng-template>", styles: [":host{display:flex;width:100%;align-items:center}@media screen and (max-width: 959px){:host{flex-direction:column;max-width:100%}:host ::ng-deep monkey-input-filter{width:100%}:host ::ng-deep monkey-select-filter{width:100%}:host ::ng-deep monkey-button{width:100%}:host ::ng-deep monkey-button button{width:100%}}@media screen and (min-width: 960px){:host .actions ::ng-deep monkey-button{margin-left:8px}:host .actions ::ng-deep monkey-button button{width:170px}}:host .more-filters ::ng-deep monkey-button monkey-icon{margin-right:unset!important}@media screen and (min-width: 960px){:host .order{width:230px}}@media screen and (max-width: 959px){:host .order{margin-top:8px}}:host ::ng-deep monkey-button{margin-bottom:0}:host ::ng-deep mecx-form-field-filter mecx-form-field-body{height:40px;margin:0}@media screen and (min-width: 960px){:host ::ng-deep monkey-input-filter{width:464px}}:host .separator{border-bottom:1px solid #ebebeb;margin-top:16px;margin-bottom:16px}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { searchPlaceholder: [{
                 type: Input
             }], orderPlaceholder: [{