@acorex/components 4.2.60 → 4.2.62
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/esm2020/lib/property-editor/property-editor-renderer.directive.mjs +11 -9
- package/esm2020/lib/search-bar/search-bar.component.mjs +17 -7
- package/fesm2015/acorex-components.mjs +27 -14
- package/fesm2015/acorex-components.mjs.map +1 -1
- package/fesm2020/acorex-components.mjs +26 -14
- package/fesm2020/acorex-components.mjs.map +1 -1
- package/lib/search-bar/search-bar.component.d.ts +3 -2
- package/package.json +1 -1
|
@@ -10115,18 +10115,20 @@ class AXPropertyEditorRendererDirective {
|
|
|
10115
10115
|
this._context = v;
|
|
10116
10116
|
}
|
|
10117
10117
|
clear() {
|
|
10118
|
-
this.instance
|
|
10118
|
+
if (this.instance?.value) {
|
|
10119
|
+
this.instance.value = null;
|
|
10120
|
+
}
|
|
10119
10121
|
}
|
|
10120
10122
|
ngOnInit() {
|
|
10121
10123
|
this.createComponent();
|
|
10122
10124
|
}
|
|
10123
10125
|
createComponent() {
|
|
10124
|
-
this.renderService.findLoadedComponentByRoute(this.property.property.editorClass).then(c => {
|
|
10126
|
+
this.renderService.findLoadedComponentByRoute(this.property.property.editorClass).then((c) => {
|
|
10125
10127
|
if (c) {
|
|
10126
10128
|
const factory = this.componentFactoryResolver.resolveComponentFactory(c.component);
|
|
10127
10129
|
const cmpRef = this.target.createComponent(factory);
|
|
10128
10130
|
this.instance = cmpRef.instance;
|
|
10129
|
-
this.subscription = this.instance.valueChange.subscribe(value => {
|
|
10131
|
+
this.subscription = this.instance.valueChange.subscribe((value) => {
|
|
10130
10132
|
this.property.value = value;
|
|
10131
10133
|
this.onValueChange.emit(this.property);
|
|
10132
10134
|
if (this.property?.property?.name) {
|
|
@@ -10141,7 +10143,7 @@ class AXPropertyEditorRendererDirective {
|
|
|
10141
10143
|
// this.instance.onRenderCompleted.subscribe(() => {
|
|
10142
10144
|
// });
|
|
10143
10145
|
if (this.validationForm) {
|
|
10144
|
-
this.instance.validatableComponentRegistered.subscribe(v => {
|
|
10146
|
+
this.instance.validatableComponentRegistered.subscribe((v) => {
|
|
10145
10147
|
this.validationForm.addWidget(v);
|
|
10146
10148
|
});
|
|
10147
10149
|
}
|
|
@@ -10161,13 +10163,13 @@ class AXPropertyEditorRendererDirective {
|
|
|
10161
10163
|
const vars = typeof opt === 'string' ? opt?.match(varsRegx) : [];
|
|
10162
10164
|
// bind the props
|
|
10163
10165
|
if (vars?.length) {
|
|
10164
|
-
vars.forEach(v => {
|
|
10166
|
+
vars.forEach((v) => {
|
|
10165
10167
|
const path = v.match(varNameRegx)?.length ? v.match(varNameRegx)[0] : null;
|
|
10166
10168
|
if (path) {
|
|
10167
10169
|
this.eventService.on(`props-${this.groupId}-${path}`, (e) => {
|
|
10168
10170
|
let execCode = opt.slice();
|
|
10169
10171
|
const params = {};
|
|
10170
|
-
vars.forEach(vv => {
|
|
10172
|
+
vars.forEach((vv) => {
|
|
10171
10173
|
const p2 = vv.match(varNameRegx)?.length ? vv.match(varNameRegx)[0] : null;
|
|
10172
10174
|
params[p2] = AXObjectUtil.deepCopy(this.context[p2]) || null;
|
|
10173
10175
|
execCode = execCode.replace(vv, `__params__.${p2}`);
|
|
@@ -10208,7 +10210,7 @@ class AXPropertyEditorRendererDirective {
|
|
|
10208
10210
|
else {
|
|
10209
10211
|
const val = typeof opt === 'function' ? opt({ data: this.context, host: this.host }, this.property) : opt;
|
|
10210
10212
|
if (val instanceof Promise) {
|
|
10211
|
-
val.then(v => {
|
|
10213
|
+
val.then((v) => {
|
|
10212
10214
|
setPropByPath(this.instance, p, val);
|
|
10213
10215
|
});
|
|
10214
10216
|
}
|
|
@@ -10230,7 +10232,7 @@ AXPropertyEditorRendererDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion
|
|
|
10230
10232
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AXPropertyEditorRendererDirective, decorators: [{
|
|
10231
10233
|
type: Directive,
|
|
10232
10234
|
args: [{
|
|
10233
|
-
selector: '[ax-property-editor-renderer]'
|
|
10235
|
+
selector: '[ax-property-editor-renderer]'
|
|
10234
10236
|
}]
|
|
10235
10237
|
}], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.ComponentFactoryResolver }, { type: i1$2.AXRenderService }, { type: i1$2.AXEventService }]; }, propDecorators: { property: [{
|
|
10236
10238
|
type: Input
|
|
@@ -10285,7 +10287,10 @@ class AXSearchBarComponent {
|
|
|
10285
10287
|
this._editors.find((x) => x.property.property.name === name).clear();
|
|
10286
10288
|
}
|
|
10287
10289
|
refresh() {
|
|
10288
|
-
this.
|
|
10290
|
+
this._defultValueCount = [];
|
|
10291
|
+
this._filterItems = [];
|
|
10292
|
+
this._filterItemsClone = [];
|
|
10293
|
+
this.items = JSON.parse(JSON.stringify(this._items[0].items));
|
|
10289
10294
|
}
|
|
10290
10295
|
handleButtonClick() {
|
|
10291
10296
|
this.dropdown.toggle();
|
|
@@ -10359,6 +10364,13 @@ class AXSearchBarComponent {
|
|
|
10359
10364
|
}
|
|
10360
10365
|
}
|
|
10361
10366
|
ngOnInit() { }
|
|
10367
|
+
ngAfterViewInit() {
|
|
10368
|
+
setTimeout(() => {
|
|
10369
|
+
if (!this.dropdown.dropdownWidth) {
|
|
10370
|
+
this.dropdown.dropdownWidth = '600px';
|
|
10371
|
+
}
|
|
10372
|
+
});
|
|
10373
|
+
}
|
|
10362
10374
|
_handleTextValue(dataItem) {
|
|
10363
10375
|
let text = '';
|
|
10364
10376
|
if (Array.isArray(dataItem.value)) {
|
|
@@ -10385,7 +10397,7 @@ class AXSearchBarComponent {
|
|
|
10385
10397
|
}
|
|
10386
10398
|
}
|
|
10387
10399
|
async _handleDefultVlaue(dataItem) {
|
|
10388
|
-
this._handleInitVlaue(dataItem);
|
|
10400
|
+
await this._handleInitVlaue(dataItem);
|
|
10389
10401
|
this._filterItems = JSON.parse(JSON.stringify(this._filterItemsClone.filter((el) => el.value != null && el.value != '')));
|
|
10390
10402
|
if (this._filterItems.length === this._defultValueCount.length) {
|
|
10391
10403
|
this.onSearchValue.emit(this._filterItems);
|
|
@@ -10442,10 +10454,10 @@ class AXSearchBarComponent {
|
|
|
10442
10454
|
}
|
|
10443
10455
|
}
|
|
10444
10456
|
AXSearchBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AXSearchBarComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
10445
|
-
AXSearchBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: AXSearchBarComponent, selector: "ax-search-bar", inputs: { size: "size", disabled: "disabled", fitParent: "fitParent", dropdownWidth: "dropdownWidth",
|
|
10457
|
+
AXSearchBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: AXSearchBarComponent, selector: "ax-search-bar", inputs: { size: "size", disabled: "disabled", fitParent: "fitParent", dropdownWidth: "dropdownWidth", rtl: "rtl", items: "items" }, outputs: { onValueChange: "onValueChange", onSearchValue: "onSearchValue" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }, { propertyName: "form", first: true, predicate: AXValidationFormComponent, descendants: true }, { propertyName: "_editors", predicate: AXPropertyEditorRendererDirective, descendants: true }], ngImport: i0, template: "<div>\r\n <ax-drop-down [fitParent]=\"fitParent\" [dropdownWidth]=\"dropdownWidth\" [size]=\"size\" [showDropDownButton]=\"false\"\r\n icon=\"far fa-sliders-h\" #dropdown maxHeight=\"unset\">\r\n <ng-container start>\r\n <ng-content select=\"[start]\">\r\n </ng-content>\r\n </ng-container>\r\n <ng-container header>\r\n <div class=\"ax chips-container\">\r\n <div class=\"chips\" *ngFor=\"let item of _filterItems\">\r\n <span class=\"chips-text\" style=\"direction:rtl;\">\r\n <b>{{_handleShowTitleSelected(item)}}</b> {{_handleShowValueSelected(item)}}\r\n </span>\r\n <span class=\"close-icon\" (click)=\"handleItemRemoveClick(item)\">\r\n </span>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container panel>\r\n <div class=\"panel-box\">\r\n <ax-validation-form #form>\r\n <ng-container *ngFor=\"let item of _items\">\r\n <div class=\"row\">\r\n <ng-container *ngFor=\"let prop of item.items\">\r\n <div *ngIf=\"prop.property.visible != false\" class=\"{{renderCol(prop.property.col)}}\">\r\n <div>\r\n <ax-label>{{prop.property.title}}</ax-label>\r\n <ng-container ax-property-editor-renderer [validationForm]=\"form\"\r\n [property]=\"prop\" [context]=\"_context\"\r\n (onValueChange)=\"handleValueChange($event)\"></ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <div class=\"footer-button\">\r\n <ax-button (click)=\"search()\">{{'common.search' | trans}}</ax-button>\r\n <ax-button type=\"blank danger\" (click)=\"clear()\">{{'dataGrid.clearFilter' | trans}}</ax-button>\r\n </div>\r\n </ax-validation-form>\r\n </div>\r\n </ng-container>\r\n <ng-container end>\r\n <ax-button end icon=\"far fa-sliders-h icon\" type=\"light blank\" [disabled]=\"disabled\" [size]=\"size\"\r\n [tabIndex]=\"-1\" (click)=\"handleButtonClick()\">{{'common.search' | trans}}</ax-button>\r\n </ng-container>\r\n\r\n </ax-drop-down>\r\n</div>", styles: [".ax.chips-container{height:100%}.panel-box{padding:1rem}.panel-box .footer-button{margin-top:1rem;display:flex;align-items:center;gap:.5rem}\n"], components: [{ type: AXDropdownComponent, selector: "ax-drop-down", inputs: ["rtl", "readonly", "loading", "dropdownWidth"], outputs: ["dropdownToggle", "onButtonClick"] }, { type: AXValidationFormComponent, selector: "ax-validation-form", inputs: ["validateOn"], outputs: ["onInit"] }, { type: AXLabelComponent, selector: "ax-label", inputs: ["size"] }, { type: AXButtonComponent, selector: "ax-button", inputs: ["type", "icon", "submitBehavior", "cancelBehavior", "block", "loading", "selected"] }], directives: [{ type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: AXPropertyEditorRendererDirective, selector: "[ax-property-editor-renderer]", inputs: ["property", "validationForm", "context", "host", "groupId"], outputs: ["onValueChange"] }], pipes: { "trans": i1$2.AXTranslatorPipe } });
|
|
10446
10458
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AXSearchBarComponent, decorators: [{
|
|
10447
10459
|
type: Component,
|
|
10448
|
-
args: [{ selector: 'ax-search-bar', template: "<div>\r\n <ax-drop-down [fitParent]=\"fitParent\" [dropdownWidth]=\"dropdownWidth\" [size]=\"size\" [showDropDownButton]=\"false\"
|
|
10460
|
+
args: [{ selector: 'ax-search-bar', template: "<div>\r\n <ax-drop-down [fitParent]=\"fitParent\" [dropdownWidth]=\"dropdownWidth\" [size]=\"size\" [showDropDownButton]=\"false\"\r\n icon=\"far fa-sliders-h\" #dropdown maxHeight=\"unset\">\r\n <ng-container start>\r\n <ng-content select=\"[start]\">\r\n </ng-content>\r\n </ng-container>\r\n <ng-container header>\r\n <div class=\"ax chips-container\">\r\n <div class=\"chips\" *ngFor=\"let item of _filterItems\">\r\n <span class=\"chips-text\" style=\"direction:rtl;\">\r\n <b>{{_handleShowTitleSelected(item)}}</b> {{_handleShowValueSelected(item)}}\r\n </span>\r\n <span class=\"close-icon\" (click)=\"handleItemRemoveClick(item)\">\r\n </span>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container panel>\r\n <div class=\"panel-box\">\r\n <ax-validation-form #form>\r\n <ng-container *ngFor=\"let item of _items\">\r\n <div class=\"row\">\r\n <ng-container *ngFor=\"let prop of item.items\">\r\n <div *ngIf=\"prop.property.visible != false\" class=\"{{renderCol(prop.property.col)}}\">\r\n <div>\r\n <ax-label>{{prop.property.title}}</ax-label>\r\n <ng-container ax-property-editor-renderer [validationForm]=\"form\"\r\n [property]=\"prop\" [context]=\"_context\"\r\n (onValueChange)=\"handleValueChange($event)\"></ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <div class=\"footer-button\">\r\n <ax-button (click)=\"search()\">{{'common.search' | trans}}</ax-button>\r\n <ax-button type=\"blank danger\" (click)=\"clear()\">{{'dataGrid.clearFilter' | trans}}</ax-button>\r\n </div>\r\n </ax-validation-form>\r\n </div>\r\n </ng-container>\r\n <ng-container end>\r\n <ax-button end icon=\"far fa-sliders-h icon\" type=\"light blank\" [disabled]=\"disabled\" [size]=\"size\"\r\n [tabIndex]=\"-1\" (click)=\"handleButtonClick()\">{{'common.search' | trans}}</ax-button>\r\n </ng-container>\r\n\r\n </ax-drop-down>\r\n</div>", styles: [".ax.chips-container{height:100%}.panel-box{padding:1rem}.panel-box .footer-button{margin-top:1rem;display:flex;align-items:center;gap:.5rem}\n"] }]
|
|
10449
10461
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { dropdown: [{
|
|
10450
10462
|
type: ViewChild,
|
|
10451
10463
|
args: ['dropdown', { static: true }]
|
|
@@ -10463,10 +10475,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
10463
10475
|
type: Input
|
|
10464
10476
|
}], dropdownWidth: [{
|
|
10465
10477
|
type: Input
|
|
10466
|
-
}], items: [{
|
|
10467
|
-
type: Input
|
|
10468
10478
|
}], rtl: [{
|
|
10469
10479
|
type: Input
|
|
10480
|
+
}], items: [{
|
|
10481
|
+
type: Input
|
|
10470
10482
|
}], onValueChange: [{
|
|
10471
10483
|
type: Output
|
|
10472
10484
|
}], onSearchValue: [{
|