@acorex/components 16.19.49 → 16.19.50
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.
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import * as i0 from '@angular/core';
|
|
2
|
-
import { ElementRef, Input, Inject, Optional, Component, Injectable, EventEmitter, Output, Directive, ContentChild, ViewChild, TemplateRef, HostListener, ViewEncapsulation, NgModule, input, effect, ChangeDetectionStrategy, Attribute, ContentChildren, ViewChildren, output, inject, ChangeDetectorRef, model, contentChild, afterNextRender, contentChildren, NO_ERRORS_SCHEMA, ViewContainerRef, HostBinding, signal } from '@angular/core';
|
|
3
1
|
import * as i1$2 from '@acorex/core';
|
|
4
2
|
import { AXTranslator, AXHtmlUtil, AXConfig, AXDateTime, AXDateTimeRange, AXCoreModule, AXTranslatorModule, AXPlatform, AXScrollModule, AXObjectUtil, setPropByPath, AXColorUtil } from '@acorex/core';
|
|
3
|
+
import * as i0 from '@angular/core';
|
|
4
|
+
import { ElementRef, Input, Inject, Optional, Component, Injectable, EventEmitter, Output, Directive, ContentChild, ViewChild, TemplateRef, HostListener, ViewEncapsulation, NgModule, input, effect, ChangeDetectionStrategy, Attribute, ContentChildren, ViewChildren, output, inject, ChangeDetectorRef, model, contentChild, afterNextRender, contentChildren, NO_ERRORS_SCHEMA, ViewContainerRef, HostBinding, signal } from '@angular/core';
|
|
5
5
|
import * as i1 from '@angular/cdk/overlay';
|
|
6
6
|
import { OverlayContainer, Overlay, OverlayModule } from '@angular/cdk/overlay';
|
|
7
7
|
import * as i1$3 from '@angular/cdk/portal';
|
|
@@ -8005,6 +8005,7 @@ class AXAutoCompleteComponent extends AXBaseComponent {
|
|
|
8005
8005
|
resolvedItems = signal([]);
|
|
8006
8006
|
totalCount = signal(0);
|
|
8007
8007
|
localShowDropdownWhenClick = signal(false);
|
|
8008
|
+
clickTimer;
|
|
8008
8009
|
dropdown;
|
|
8009
8010
|
isDropdownOpen = signal(false);
|
|
8010
8011
|
showDropdownWhenClick = input(true);
|
|
@@ -8022,6 +8023,9 @@ class AXAutoCompleteComponent extends AXBaseComponent {
|
|
|
8022
8023
|
fitParent = input(true);
|
|
8023
8024
|
selectedItems = model([]);
|
|
8024
8025
|
onValueChanged = output();
|
|
8026
|
+
onItemClick = output();
|
|
8027
|
+
onFocus = output();
|
|
8028
|
+
onBlur = output();
|
|
8025
8029
|
mode = input('multiple');
|
|
8026
8030
|
textAlign = input(null);
|
|
8027
8031
|
textField = input('text');
|
|
@@ -8096,7 +8100,6 @@ class AXAutoCompleteComponent extends AXBaseComponent {
|
|
|
8096
8100
|
}
|
|
8097
8101
|
}
|
|
8098
8102
|
}
|
|
8099
|
-
handleInputBlur() { }
|
|
8100
8103
|
handleClick() {
|
|
8101
8104
|
if (this.disabled() || this.readonly()) {
|
|
8102
8105
|
return;
|
|
@@ -8211,7 +8214,6 @@ class AXAutoCompleteComponent extends AXBaseComponent {
|
|
|
8211
8214
|
}
|
|
8212
8215
|
return searchText;
|
|
8213
8216
|
}
|
|
8214
|
-
clickTimer;
|
|
8215
8217
|
handleItemClick(e, item) {
|
|
8216
8218
|
clearTimeout(this.clickTimer);
|
|
8217
8219
|
this.clickTimer = setTimeout(() => {
|
|
@@ -8244,6 +8246,11 @@ class AXAutoCompleteComponent extends AXBaseComponent {
|
|
|
8244
8246
|
else {
|
|
8245
8247
|
this.selectedItems.set([item]);
|
|
8246
8248
|
}
|
|
8249
|
+
this.onItemClick.emit({
|
|
8250
|
+
component: this,
|
|
8251
|
+
value: item,
|
|
8252
|
+
htmlElement: this.el.nativeElement,
|
|
8253
|
+
});
|
|
8247
8254
|
}
|
|
8248
8255
|
handleKeyPress(e) {
|
|
8249
8256
|
const items = this.resolvedItems();
|
|
@@ -8291,12 +8298,26 @@ class AXAutoCompleteComponent extends AXBaseComponent {
|
|
|
8291
8298
|
item.scrollIntoView({ block: 'nearest', behavior: 'smooth' });
|
|
8292
8299
|
}
|
|
8293
8300
|
}
|
|
8301
|
+
handleFocus(e) {
|
|
8302
|
+
this.onFocus.emit({
|
|
8303
|
+
component: this,
|
|
8304
|
+
htmlElement: this.el.nativeElement,
|
|
8305
|
+
htmlEvent: e,
|
|
8306
|
+
});
|
|
8307
|
+
}
|
|
8308
|
+
handleBlur(e) {
|
|
8309
|
+
this.onFocus.emit({
|
|
8310
|
+
component: this,
|
|
8311
|
+
htmlElement: this.el.nativeElement,
|
|
8312
|
+
htmlEvent: e,
|
|
8313
|
+
});
|
|
8314
|
+
}
|
|
8294
8315
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AXAutoCompleteComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
8295
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: AXAutoCompleteComponent, isStandalone: false, selector: "ax-auto-complete", inputs: { showDropdownWhenClick: { classPropertyName: "showDropdownWhenClick", publicName: "showDropdownWhenClick", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, remoteOperation: { classPropertyName: "remoteOperation", publicName: "remoteOperation", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, allowClear: { classPropertyName: "allowClear", publicName: "allowClear", isSignal: true, isRequired: false, transformFunction: null }, showDropDownButton: { classPropertyName: "showDropDownButton", publicName: "showDropDownButton", isSignal: true, isRequired: false, transformFunction: null }, onDemandTranslate: { classPropertyName: "onDemandTranslate", publicName: "onDemandTranslate", isSignal: true, isRequired: false, transformFunction: null }, rtl: { classPropertyName: "rtl", publicName: "rtl", isSignal: true, isRequired: false, transformFunction: null }, dropdownWidth: { classPropertyName: "dropdownWidth", publicName: "dropdownWidth", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, multiLine: { classPropertyName: "multiLine", publicName: "multiLine", isSignal: true, isRequired: false, transformFunction: null }, fitParent: { classPropertyName: "fitParent", publicName: "fitParent", isSignal: true, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, textAlign: { classPropertyName: "textAlign", publicName: "textAlign", isSignal: true, isRequired: false, transformFunction: null }, textField: { classPropertyName: "textField", publicName: "textField", isSignal: true, isRequired: false, transformFunction: null }, valueField: { classPropertyName: "valueField", publicName: "valueField", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, showCheckBox: { classPropertyName: "showCheckBox", publicName: "showCheckBox", isSignal: true, isRequired: false, transformFunction: null }, disabledField: { classPropertyName: "disabledField", publicName: "disabledField", isSignal: true, isRequired: false, transformFunction: null }, allowNull: { classPropertyName: "allowNull", publicName: "allowNull", isSignal: true, isRequired: false, transformFunction: null }, disabledCallback: { classPropertyName: "disabledCallback", publicName: "disabledCallback", isSignal: false, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { selectedItems: "selectedItemsChange", onValueChanged: "onValueChanged" }, queries: [{ propertyName: "_contentDataSource", first: true, predicate: AXDataSourceComponent, descendants: true, static: true }], viewQueries: [{ propertyName: "listContainer", first: true, predicate: ["listContainer"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["d"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ax-drop-down\n #d\n [readonly]=\"readonly()\"\n [fitParent]=\"fitParent()\"\n [disabled]=\"disabled()\"\n [size]=\"size()\"\n [showDropDownButton]=\"showDropDownButton()\"\n>\n <ng-container start>\n <ng-content select=\"[start]\"> </ng-content>\n </ng-container>\n <ng-container header>\n <ax-text-box\n #input\n [textAlign]=\"textAlign()\"\n [(value)]=\"value\"\n [disabled]=\"disabled()\"\n [placeholder]=\"placeholder()\"\n [size]=\"size()\"\n (onkey)=\"handleKeyPress($event)\"\n (
|
|
8316
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: AXAutoCompleteComponent, isStandalone: false, selector: "ax-auto-complete", inputs: { showDropdownWhenClick: { classPropertyName: "showDropdownWhenClick", publicName: "showDropdownWhenClick", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, remoteOperation: { classPropertyName: "remoteOperation", publicName: "remoteOperation", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, allowClear: { classPropertyName: "allowClear", publicName: "allowClear", isSignal: true, isRequired: false, transformFunction: null }, showDropDownButton: { classPropertyName: "showDropDownButton", publicName: "showDropDownButton", isSignal: true, isRequired: false, transformFunction: null }, onDemandTranslate: { classPropertyName: "onDemandTranslate", publicName: "onDemandTranslate", isSignal: true, isRequired: false, transformFunction: null }, rtl: { classPropertyName: "rtl", publicName: "rtl", isSignal: true, isRequired: false, transformFunction: null }, dropdownWidth: { classPropertyName: "dropdownWidth", publicName: "dropdownWidth", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, multiLine: { classPropertyName: "multiLine", publicName: "multiLine", isSignal: true, isRequired: false, transformFunction: null }, fitParent: { classPropertyName: "fitParent", publicName: "fitParent", isSignal: true, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, textAlign: { classPropertyName: "textAlign", publicName: "textAlign", isSignal: true, isRequired: false, transformFunction: null }, textField: { classPropertyName: "textField", publicName: "textField", isSignal: true, isRequired: false, transformFunction: null }, valueField: { classPropertyName: "valueField", publicName: "valueField", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, showCheckBox: { classPropertyName: "showCheckBox", publicName: "showCheckBox", isSignal: true, isRequired: false, transformFunction: null }, disabledField: { classPropertyName: "disabledField", publicName: "disabledField", isSignal: true, isRequired: false, transformFunction: null }, allowNull: { classPropertyName: "allowNull", publicName: "allowNull", isSignal: true, isRequired: false, transformFunction: null }, disabledCallback: { classPropertyName: "disabledCallback", publicName: "disabledCallback", isSignal: false, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { selectedItems: "selectedItemsChange", onValueChanged: "onValueChanged", onItemClick: "onItemClick", onFocus: "onFocus", onBlur: "onBlur" }, queries: [{ propertyName: "_contentDataSource", first: true, predicate: AXDataSourceComponent, descendants: true, static: true }], viewQueries: [{ propertyName: "listContainer", first: true, predicate: ["listContainer"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["d"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ax-drop-down\n #d\n [readonly]=\"readonly()\"\n [fitParent]=\"fitParent()\"\n [disabled]=\"disabled()\"\n [size]=\"size()\"\n [showDropDownButton]=\"showDropDownButton()\"\n>\n <ng-container start>\n <ng-content select=\"[start]\"> </ng-content>\n </ng-container>\n <ng-container header>\n <ax-text-box\n #input\n [textAlign]=\"textAlign()\"\n [(value)]=\"value\"\n [disabled]=\"disabled()\"\n [placeholder]=\"placeholder()\"\n [size]=\"size()\"\n (onkey)=\"handleKeyPress($event)\"\n (click)=\"handleClick()\"\n (onValueChanged)=\"textChange($event)\"\n (onFocus)=\"handleFocus($event)\"\n (onBlur)=\"handleBlur($event)\"\n ></ax-text-box>\n </ng-container>\n <ng-container panel>\n <div class=\"ax list-container\">\n <div\n #listContainer\n class=\"list-container-items\"\n (scroll)=\"scrolled($event)\"\n >\n @if(resolvedItems().length > 0){ @for (item of resolvedItems(); track\n $index) {\n <div\n class=\"list-item\"\n [class.focused]=\"$index == currentfocusedIndex()\"\n [class.selected]=\"isItemSelected(item)\"\n (click)=\"handleItemClick($event, item)\"\n (dblclick)=\"handleItemDbClick($event, item)\"\n >\n <div style=\"display: flex\">\n @if (showCheckBox()) {\n <ax-check-box\n [size]=\"size()\"\n [value]=\"isItemSelected(item)\"\n (onClick)=\"handleItemClick($event, item)\"\n >\n </ax-check-box>\n } @if (rowTemplate) {\n <div\n style=\"\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex: 1;\n \"\n [title]=\"item[textField()]\"\n [ngStyle]=\"\n showCheckBox() ? { 'padding-inline-start': '0.5rem' } : ''\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"rowTemplate; context: { $implicit: item }\"\n >\n </ng-container>\n </div>\n }@else {\n <div\n style=\"\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex: 1;\n \"\n [title]=\"item[textField()]\"\n [ngStyle]=\"\n showCheckBox() ? { 'padding-inline-start': '0.5rem' } : ''\n \"\n >\n {{ item[textField()] }}\n </div>\n }\n </div>\n </div>\n } }@else { @if(showLoading() == true){\n <div class=\"list-item\">\n {{ 'common.search' | trans }}\n </div>\n }@else {\n <div class=\"list-item\">\n {{ 'common.noDataFound' | trans }}\n </div>\n } } @if (showLoading()) {\n <div class=\"ax-pad-sm\" style=\"text-align: center\">\n <i\n class=\"far fa-spinner-third fa-pulse fa-2x\"\n style=\"color: var(--ax-primary-color)\"\n ></i>\n </div>\n }\n </div>\n </div></ng-container\n >\n <ng-container end>\n <ng-content select=\"[end]\"> </ng-content>\n </ng-container>\n</ax-drop-down>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: AXDropdownComponent, selector: "ax-drop-down", inputs: ["rtl", "readonly", "loading", "dropdownWidth"], outputs: ["dropdownToggle", "onButtonClick"] }, { kind: "component", type: AXTextBoxComponent, selector: "ax-text-box", inputs: ["mask", "showMask", "type", "maxLength", "maskGuid", "maskPlaceholder", "maskKeepCharPositions", "leadZeroDateTime"] }, { kind: "component", type: AXCheckBoxComponent, selector: "ax-check-box", inputs: ["readonly", "disabled", "size", "label", "tabIndex", "indeterminate", "value"], outputs: ["onValueChanged", "valueChange", "onClick"] }, { kind: "pipe", type: i1$2.AXTranslatorPipe, name: "trans" }], encapsulation: i0.ViewEncapsulation.None });
|
|
8296
8317
|
}
|
|
8297
8318
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AXAutoCompleteComponent, decorators: [{
|
|
8298
8319
|
type: Component,
|
|
8299
|
-
args: [{ selector: 'ax-auto-complete', encapsulation: ViewEncapsulation.None, standalone: false, template: "<ax-drop-down\n #d\n [readonly]=\"readonly()\"\n [fitParent]=\"fitParent()\"\n [disabled]=\"disabled()\"\n [size]=\"size()\"\n [showDropDownButton]=\"showDropDownButton()\"\n>\n <ng-container start>\n <ng-content select=\"[start]\"> </ng-content>\n </ng-container>\n <ng-container header>\n <ax-text-box\n #input\n [textAlign]=\"textAlign()\"\n [(value)]=\"value\"\n [disabled]=\"disabled()\"\n [placeholder]=\"placeholder()\"\n [size]=\"size()\"\n (onkey)=\"handleKeyPress($event)\"\n (
|
|
8320
|
+
args: [{ selector: 'ax-auto-complete', encapsulation: ViewEncapsulation.None, standalone: false, template: "<ax-drop-down\n #d\n [readonly]=\"readonly()\"\n [fitParent]=\"fitParent()\"\n [disabled]=\"disabled()\"\n [size]=\"size()\"\n [showDropDownButton]=\"showDropDownButton()\"\n>\n <ng-container start>\n <ng-content select=\"[start]\"> </ng-content>\n </ng-container>\n <ng-container header>\n <ax-text-box\n #input\n [textAlign]=\"textAlign()\"\n [(value)]=\"value\"\n [disabled]=\"disabled()\"\n [placeholder]=\"placeholder()\"\n [size]=\"size()\"\n (onkey)=\"handleKeyPress($event)\"\n (click)=\"handleClick()\"\n (onValueChanged)=\"textChange($event)\"\n (onFocus)=\"handleFocus($event)\"\n (onBlur)=\"handleBlur($event)\"\n ></ax-text-box>\n </ng-container>\n <ng-container panel>\n <div class=\"ax list-container\">\n <div\n #listContainer\n class=\"list-container-items\"\n (scroll)=\"scrolled($event)\"\n >\n @if(resolvedItems().length > 0){ @for (item of resolvedItems(); track\n $index) {\n <div\n class=\"list-item\"\n [class.focused]=\"$index == currentfocusedIndex()\"\n [class.selected]=\"isItemSelected(item)\"\n (click)=\"handleItemClick($event, item)\"\n (dblclick)=\"handleItemDbClick($event, item)\"\n >\n <div style=\"display: flex\">\n @if (showCheckBox()) {\n <ax-check-box\n [size]=\"size()\"\n [value]=\"isItemSelected(item)\"\n (onClick)=\"handleItemClick($event, item)\"\n >\n </ax-check-box>\n } @if (rowTemplate) {\n <div\n style=\"\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex: 1;\n \"\n [title]=\"item[textField()]\"\n [ngStyle]=\"\n showCheckBox() ? { 'padding-inline-start': '0.5rem' } : ''\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"rowTemplate; context: { $implicit: item }\"\n >\n </ng-container>\n </div>\n }@else {\n <div\n style=\"\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex: 1;\n \"\n [title]=\"item[textField()]\"\n [ngStyle]=\"\n showCheckBox() ? { 'padding-inline-start': '0.5rem' } : ''\n \"\n >\n {{ item[textField()] }}\n </div>\n }\n </div>\n </div>\n } }@else { @if(showLoading() == true){\n <div class=\"list-item\">\n {{ 'common.search' | trans }}\n </div>\n }@else {\n <div class=\"list-item\">\n {{ 'common.noDataFound' | trans }}\n </div>\n } } @if (showLoading()) {\n <div class=\"ax-pad-sm\" style=\"text-align: center\">\n <i\n class=\"far fa-spinner-third fa-pulse fa-2x\"\n style=\"color: var(--ax-primary-color)\"\n ></i>\n </div>\n }\n </div>\n </div></ng-container\n >\n <ng-container end>\n <ng-content select=\"[end]\"> </ng-content>\n </ng-container>\n</ax-drop-down>\n" }]
|
|
8300
8321
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { listContainer: [{
|
|
8301
8322
|
type: ViewChild,
|
|
8302
8323
|
args: ['listContainer']
|