@acorex/components 16.20.1 → 16.20.3
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
1
|
import * as i1$2 from '@acorex/core';
|
|
2
|
-
import { AXTranslator, AXHtmlUtil,
|
|
2
|
+
import { AXTranslator, AXHtmlUtil, AXConfig, AXDateTime, AXDateTimeRange, AXCoreModule, AXTranslatorModule, AXPlatform, AXScrollModule, AXObjectUtil, setPropByPath, AXColorUtil } from '@acorex/core';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { ElementRef, Input, Inject, Optional, Component, Injectable, EventEmitter, Output, Directive, ContentChild, ViewChild, DOCUMENT, TemplateRef,
|
|
4
|
+
import { ElementRef, Input, Inject, Optional, Component, Injectable, EventEmitter, Output, Directive, ContentChild, ViewChild, DOCUMENT, 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$4 from '@angular/cdk/portal';
|
|
@@ -925,8 +925,6 @@ class AXButtonComponent extends AXBaseButtonComponent {
|
|
|
925
925
|
this.el = el;
|
|
926
926
|
}
|
|
927
927
|
container;
|
|
928
|
-
platFormSerivce = inject(AXPlatform);
|
|
929
|
-
isRtl = signal(this.platFormSerivce.isRtl(), ...(ngDevMode ? [{ debugName: "isRtl" }] : []));
|
|
930
928
|
type = 'primary';
|
|
931
929
|
icon;
|
|
932
930
|
submitBehavior = false;
|
|
@@ -963,11 +961,11 @@ class AXButtonComponent extends AXBaseButtonComponent {
|
|
|
963
961
|
this.container.nativeElement.focus();
|
|
964
962
|
}
|
|
965
963
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXButtonComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
966
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXButtonComponent, isStandalone: false, selector: "ax-button", inputs: { type: "type", icon: "icon", submitBehavior: "submitBehavior", cancelBehavior: "cancelBehavior", block: "block", loading: "loading", selected: "selected" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<button\n #container\n class=\"ax button form-control {{ type }} {{ size }} {{ cssClass }}\"\n [class.ax-button-icon]=\"\n refContent.innerText.length == 0 && refContent.children.length == 0\n \"\n [class.selected]=\"selected\"\n [class.icon]=\"icon\"\n [class.icon]=\"loading\"\n [class.disabled]=\"disabled || loading\"\n (click)=\"handleClick($event)\"\n [disabled]=\"disabled\"\n [ngStyle]=\"{ 'width.%': block ? 100 : 'auto' }\"\n [attr.tabindex]=\"tabIndex\"\n
|
|
964
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXButtonComponent, isStandalone: false, selector: "ax-button", inputs: { type: "type", icon: "icon", submitBehavior: "submitBehavior", cancelBehavior: "cancelBehavior", block: "block", loading: "loading", selected: "selected" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<button\n #container\n class=\"ax button form-control {{ type }} {{ size }} {{ cssClass }}\"\n [class.ax-button-icon]=\"\n refContent.innerText.length == 0 && refContent.children.length == 0\n \"\n [class.selected]=\"selected\"\n [class.icon]=\"icon\"\n [class.icon]=\"loading\"\n [class.disabled]=\"disabled || loading\"\n (click)=\"handleClick($event)\"\n [disabled]=\"disabled\"\n [ngStyle]=\"{ 'width.%': block ? 100 : 'auto' }\"\n [attr.tabindex]=\"tabIndex\"\n>\n <div class=\"button-inner-content\">\n @if (icon && !loading) {\n <i class=\"{{ icon }} icon\"></i>\n @if ( refContent.innerText.length == 0 && refContent.children.length == 0 )\n { } } @if (loading) {\n <i class=\"far fa-circle-notch fa-spin icon\"></i>\n @if ( refContent.innerText.length == 0 && refContent.children.length == 0 )\n { } }\n <div class=\"ax-wrapper\" #refContent>\n <ng-content></ng-content>\n </div>\n </div>\n</button>\n", dependencies: [{ kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
967
965
|
}
|
|
968
966
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXButtonComponent, decorators: [{
|
|
969
967
|
type: Component,
|
|
970
|
-
args: [{ selector: 'ax-button', encapsulation: ViewEncapsulation.None, standalone: false, template: "<button\n #container\n class=\"ax button form-control {{ type }} {{ size }} {{ cssClass }}\"\n [class.ax-button-icon]=\"\n refContent.innerText.length == 0 && refContent.children.length == 0\n \"\n [class.selected]=\"selected\"\n [class.icon]=\"icon\"\n [class.icon]=\"loading\"\n [class.disabled]=\"disabled || loading\"\n (click)=\"handleClick($event)\"\n [disabled]=\"disabled\"\n [ngStyle]=\"{ 'width.%': block ? 100 : 'auto' }\"\n [attr.tabindex]=\"tabIndex\"\n
|
|
968
|
+
args: [{ selector: 'ax-button', encapsulation: ViewEncapsulation.None, standalone: false, template: "<button\n #container\n class=\"ax button form-control {{ type }} {{ size }} {{ cssClass }}\"\n [class.ax-button-icon]=\"\n refContent.innerText.length == 0 && refContent.children.length == 0\n \"\n [class.selected]=\"selected\"\n [class.icon]=\"icon\"\n [class.icon]=\"loading\"\n [class.disabled]=\"disabled || loading\"\n (click)=\"handleClick($event)\"\n [disabled]=\"disabled\"\n [ngStyle]=\"{ 'width.%': block ? 100 : 'auto' }\"\n [attr.tabindex]=\"tabIndex\"\n>\n <div class=\"button-inner-content\">\n @if (icon && !loading) {\n <i class=\"{{ icon }} icon\"></i>\n @if ( refContent.innerText.length == 0 && refContent.children.length == 0 )\n { } } @if (loading) {\n <i class=\"far fa-circle-notch fa-spin icon\"></i>\n @if ( refContent.innerText.length == 0 && refContent.children.length == 0 )\n { } }\n <div class=\"ax-wrapper\" #refContent>\n <ng-content></ng-content>\n </div>\n </div>\n</button>\n" }]
|
|
971
969
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { container: [{
|
|
972
970
|
type: ViewChild,
|
|
973
971
|
args: ['container', { static: true }]
|
|
@@ -7153,8 +7151,6 @@ class AXPopupComponent extends AXBaseComponent {
|
|
|
7153
7151
|
this.loadingService = loadingService;
|
|
7154
7152
|
this.cdr = cdr;
|
|
7155
7153
|
}
|
|
7156
|
-
_platform = inject(AXPlatform);
|
|
7157
|
-
isRtl = signal(this._platform.isRtl(), ...(ngDevMode ? [{ debugName: "isRtl" }] : []));
|
|
7158
7154
|
ngAfterViewInit() {
|
|
7159
7155
|
this._loadingId = this.loadingService.show(this.ref.nativeElement.querySelector('.ax-popup-body-container'));
|
|
7160
7156
|
if (typeof this.content === 'string') {
|
|
@@ -7274,11 +7270,11 @@ class AXPopupComponent extends AXBaseComponent {
|
|
|
7274
7270
|
}
|
|
7275
7271
|
}
|
|
7276
7272
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXPopupComponent, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.ElementRef }, { token: i1$2.AXRenderService }, { token: AXLoadingService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
7277
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXPopupComponent, isStandalone: false, selector: "ng-component", host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, viewQueries: [{ propertyName: "popupBody", first: true, predicate: ["popupBody"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<div\n class=\"popup-wrapper\"\n role=\"dialog\"\n [attr.aria-labelledby]=\"'dialog' + uid + '_label'\"\n aria-modal=\"true\"\n cdkTrapFocus\n cdkDrag\n
|
|
7273
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXPopupComponent, isStandalone: false, selector: "ng-component", host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, viewQueries: [{ propertyName: "popupBody", first: true, predicate: ["popupBody"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<div\n class=\"popup-wrapper\"\n role=\"dialog\"\n [attr.aria-labelledby]=\"'dialog' + uid + '_label'\"\n aria-modal=\"true\"\n cdkTrapFocus\n cdkDrag\n>\n <div\n class=\"popup-container {{ size }}\"\n tabindex=\"0\"\n [class.has-border]=\"!modal\"\n >\n @if (hasHeader) {\n <div\n class=\"ax-popup-header\"\n cdkDragHandle\n [attr.id]=\"'dialog' + uid + '_label'\"\n >\n <span>\n {{ title }}\n </span>\n <span class=\"ax-buttons-containers\">\n @if (maximizable) {\n <i\n class=\"far fa-expand ax-popup-header-button\"\n (click)=\"onFullScreen()\"\n tabindex=\"2\"\n title=\"\u062A\u0645\u0627\u0645 \u0635\u0641\u062D\u0647\"\n ></i>\n } @if (closable) {\n <i\n class=\"far fa-times ax-popup-header-button\"\n (click)=\"onCloseClick()\"\n tabindex=\"1\"\n title=\"\u0628\u0633\u062A\u0646\"\n ></i>\n }\n </span>\n </div>\n }\n <div class=\"ax-popup-body ax-loading-host\">\n <div class=\"ax-popup-body-container\">\n <div [hidden]=\"isLoading\">\n <ng-template #popupBody></ng-template>\n </div>\n </div>\n @if (!isLoading && footerButtons.length > 0) {\n <div class=\"ax-popup-footer\">\n <div class=\"ax-buttons-containers\">\n @for (button of footerButtons; track button) {\n <ax-button\n [type]=\"button.style\"\n [icon]=\"button.icon\"\n [submitBehavior]=\"button.submitBehavior\"\n [disabled]=\"button.disable\"\n [cancelBehavior]=\"button.cancelBehavior\"\n (click)=\"handleFooterButtonClick(button)\"\n >\n {{ button.text }}\n </ax-button>\n }\n </div>\n </div>\n }\n </div>\n </div>\n</div>\n", styles: [".popup-wrapper{position:relative;display:flex;justify-content:center;align-items:center}.popup-wrapper .popup-container{position:absolute;opacity:1;background:var(--ax-white-color);display:flex;flex-direction:column;border-radius:var(--ax-size-border-radius);-webkit-border-radius:var(--ax-size-border-radius);-moz-border-radius:var(--ax-size-border-radius);overflow:hidden;max-height:calc(var(--ax-overlay-full-width) * var(--ax-vh));min-height:fit-content}.popup-wrapper .popup-container.has-border{border:1px solid var(--ax-border-color);box-shadow:1px 1px 10px var(--ax-border-color)}.popup-wrapper .popup-container:focus{box-shadow:0 0 0 .2rem rgba(var(--outline-color),.8);outline-color:transparent}.popup-wrapper .popup-container.full{width:100vw;max-height:calc(100 * var(--ax-vh));height:calc(100 * var(--ax-vh))}.popup-wrapper .popup-container .ax-popup-header{background:var(--ax-gray-light-color);color:var(--ax-gray-fore-color);display:flex;flex-direction:row;justify-content:space-between;align-items:center;font-size:1rem;font-weight:500;padding:.5rem .7rem}.popup-wrapper .popup-container .ax-popup-header .ax-buttons-containers{display:flex;flex-direction:row}.popup-wrapper .popup-container .ax-popup-header .ax-buttons-containers .ax-popup-header-button{border-radius:50%;font-size:1.1rem;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;cursor:pointer;margin-inline-start:.5em}.popup-wrapper .popup-container .ax-popup-body{max-height:90dvh;position:relative;overflow:hidden;display:flex;flex-direction:column}.popup-wrapper .popup-container .ax-popup-body .ax-popup-body-container{overflow:auto}.popup-wrapper .popup-container .ax-popup-body .ax-footer{background:var(--ax-white-color);border-top:1px solid;border-color:var(--ax-border-color);margin-block-start:.5em;padding:.4em .5em;display:flex;align-items:center}.popup-wrapper .popup-container .ax-popup-body .ax-footer .button{min-width:100px;margin-inline-end:.5em}.popup-wrapper .popup-container .ax-popup-body .ax-popup-footer{background-color:var(--ax-white-color);display:flex;flex-direction:row;align-items:center;padding:.5em;border-top:1px solid var(--ax-border-color);margin-block-start:.5em;justify-content:end}.popup-wrapper .popup-container .ax-popup-body .ax-popup-footer .ax-buttons-containers{flex:1;max-width:fit-content;max-width:-moz-fit-content}.popup-wrapper .popup-container .ax-popup-body .ax-popup-footer .ax-buttons-containers .button{margin-inline-end:.5em;min-width:80px}@media all and (min-width: 1280px){.popup-wrapper .popup-container.sm{width:420px!important}.popup-wrapper .popup-container.md{width:680px!important}.popup-wrapper .popup-container.lg{width:1024px!important}}@media all and (min-width: 1024px) and (max-width: 1279px){.popup-wrapper .popup-container.sm{width:100vw;max-height:100vh}.popup-wrapper .popup-container.md{width:500px!important}.popup-wrapper .popup-container.lg{width:900px!important}}@media all and (min-width: 768px) and (max-width: 1023px){.popup-wrapper .popup-container.sm{width:100vw;max-height:100vh}.popup-wrapper .popup-container.md{width:500px!important}.popup-wrapper .popup-container.lg{width:700px!important}}@media (max-width: 599px){.popup-wrapper .popup-container.sm,.popup-wrapper .popup-container.md,.popup-wrapper .popup-container.lg{width:93vw!important;height:calc(var(--ax-overlay-full-width) * var(--ax-vh))!important}}\n"], dependencies: [{ kind: "directive", type: i1$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i1$3.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i4.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["type", "icon", "submitBehavior", "cancelBehavior", "block", "loading", "selected"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
7278
7274
|
}
|
|
7279
7275
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXPopupComponent, decorators: [{
|
|
7280
7276
|
type: Component,
|
|
7281
|
-
args: [{ encapsulation: ViewEncapsulation.None, standalone: false, template: "<div\n class=\"popup-wrapper\"\n role=\"dialog\"\n [attr.aria-labelledby]=\"'dialog' + uid + '_label'\"\n aria-modal=\"true\"\n cdkTrapFocus\n cdkDrag\n
|
|
7277
|
+
args: [{ encapsulation: ViewEncapsulation.None, standalone: false, template: "<div\n class=\"popup-wrapper\"\n role=\"dialog\"\n [attr.aria-labelledby]=\"'dialog' + uid + '_label'\"\n aria-modal=\"true\"\n cdkTrapFocus\n cdkDrag\n>\n <div\n class=\"popup-container {{ size }}\"\n tabindex=\"0\"\n [class.has-border]=\"!modal\"\n >\n @if (hasHeader) {\n <div\n class=\"ax-popup-header\"\n cdkDragHandle\n [attr.id]=\"'dialog' + uid + '_label'\"\n >\n <span>\n {{ title }}\n </span>\n <span class=\"ax-buttons-containers\">\n @if (maximizable) {\n <i\n class=\"far fa-expand ax-popup-header-button\"\n (click)=\"onFullScreen()\"\n tabindex=\"2\"\n title=\"\u062A\u0645\u0627\u0645 \u0635\u0641\u062D\u0647\"\n ></i>\n } @if (closable) {\n <i\n class=\"far fa-times ax-popup-header-button\"\n (click)=\"onCloseClick()\"\n tabindex=\"1\"\n title=\"\u0628\u0633\u062A\u0646\"\n ></i>\n }\n </span>\n </div>\n }\n <div class=\"ax-popup-body ax-loading-host\">\n <div class=\"ax-popup-body-container\">\n <div [hidden]=\"isLoading\">\n <ng-template #popupBody></ng-template>\n </div>\n </div>\n @if (!isLoading && footerButtons.length > 0) {\n <div class=\"ax-popup-footer\">\n <div class=\"ax-buttons-containers\">\n @for (button of footerButtons; track button) {\n <ax-button\n [type]=\"button.style\"\n [icon]=\"button.icon\"\n [submitBehavior]=\"button.submitBehavior\"\n [disabled]=\"button.disable\"\n [cancelBehavior]=\"button.cancelBehavior\"\n (click)=\"handleFooterButtonClick(button)\"\n >\n {{ button.text }}\n </ax-button>\n }\n </div>\n </div>\n }\n </div>\n </div>\n</div>\n", styles: [".popup-wrapper{position:relative;display:flex;justify-content:center;align-items:center}.popup-wrapper .popup-container{position:absolute;opacity:1;background:var(--ax-white-color);display:flex;flex-direction:column;border-radius:var(--ax-size-border-radius);-webkit-border-radius:var(--ax-size-border-radius);-moz-border-radius:var(--ax-size-border-radius);overflow:hidden;max-height:calc(var(--ax-overlay-full-width) * var(--ax-vh));min-height:fit-content}.popup-wrapper .popup-container.has-border{border:1px solid var(--ax-border-color);box-shadow:1px 1px 10px var(--ax-border-color)}.popup-wrapper .popup-container:focus{box-shadow:0 0 0 .2rem rgba(var(--outline-color),.8);outline-color:transparent}.popup-wrapper .popup-container.full{width:100vw;max-height:calc(100 * var(--ax-vh));height:calc(100 * var(--ax-vh))}.popup-wrapper .popup-container .ax-popup-header{background:var(--ax-gray-light-color);color:var(--ax-gray-fore-color);display:flex;flex-direction:row;justify-content:space-between;align-items:center;font-size:1rem;font-weight:500;padding:.5rem .7rem}.popup-wrapper .popup-container .ax-popup-header .ax-buttons-containers{display:flex;flex-direction:row}.popup-wrapper .popup-container .ax-popup-header .ax-buttons-containers .ax-popup-header-button{border-radius:50%;font-size:1.1rem;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;cursor:pointer;margin-inline-start:.5em}.popup-wrapper .popup-container .ax-popup-body{max-height:90dvh;position:relative;overflow:hidden;display:flex;flex-direction:column}.popup-wrapper .popup-container .ax-popup-body .ax-popup-body-container{overflow:auto}.popup-wrapper .popup-container .ax-popup-body .ax-footer{background:var(--ax-white-color);border-top:1px solid;border-color:var(--ax-border-color);margin-block-start:.5em;padding:.4em .5em;display:flex;align-items:center}.popup-wrapper .popup-container .ax-popup-body .ax-footer .button{min-width:100px;margin-inline-end:.5em}.popup-wrapper .popup-container .ax-popup-body .ax-popup-footer{background-color:var(--ax-white-color);display:flex;flex-direction:row;align-items:center;padding:.5em;border-top:1px solid var(--ax-border-color);margin-block-start:.5em;justify-content:end}.popup-wrapper .popup-container .ax-popup-body .ax-popup-footer .ax-buttons-containers{flex:1;max-width:fit-content;max-width:-moz-fit-content}.popup-wrapper .popup-container .ax-popup-body .ax-popup-footer .ax-buttons-containers .button{margin-inline-end:.5em;min-width:80px}@media all and (min-width: 1280px){.popup-wrapper .popup-container.sm{width:420px!important}.popup-wrapper .popup-container.md{width:680px!important}.popup-wrapper .popup-container.lg{width:1024px!important}}@media all and (min-width: 1024px) and (max-width: 1279px){.popup-wrapper .popup-container.sm{width:100vw;max-height:100vh}.popup-wrapper .popup-container.md{width:500px!important}.popup-wrapper .popup-container.lg{width:900px!important}}@media all and (min-width: 768px) and (max-width: 1023px){.popup-wrapper .popup-container.sm{width:100vw;max-height:100vh}.popup-wrapper .popup-container.md{width:500px!important}.popup-wrapper .popup-container.lg{width:700px!important}}@media (max-width: 599px){.popup-wrapper .popup-container.sm,.popup-wrapper .popup-container.md,.popup-wrapper .popup-container.lg{width:93vw!important;height:calc(var(--ax-overlay-full-width) * var(--ax-vh))!important}}\n"] }]
|
|
7282
7278
|
}], ctorParameters: () => [{ type: i0.ComponentFactoryResolver }, { type: i0.ElementRef }, { type: i1$2.AXRenderService }, { type: AXLoadingService }, { type: i0.ChangeDetectorRef }], propDecorators: { popupBody: [{
|
|
7283
7279
|
type: ViewChild,
|
|
7284
7280
|
args: ['popupBody', { read: ViewContainerRef, static: true }]
|
|
@@ -12443,6 +12439,8 @@ class AXSearchBarComponent {
|
|
|
12443
12439
|
this.cdr = cdr;
|
|
12444
12440
|
this.ref = ref;
|
|
12445
12441
|
}
|
|
12442
|
+
_platform = inject(AXPlatform);
|
|
12443
|
+
isRtl = signal(this._platform.isRtl(), ...(ngDevMode ? [{ debugName: "isRtl" }] : []));
|
|
12446
12444
|
searchPopover;
|
|
12447
12445
|
_editors;
|
|
12448
12446
|
form;
|
|
@@ -12744,11 +12742,11 @@ class AXSearchBarComponent {
|
|
|
12744
12742
|
this.searchPopover.close();
|
|
12745
12743
|
}
|
|
12746
12744
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXSearchBarComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
12747
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXSearchBarComponent, isStandalone: false, selector: "ax-search-bar", inputs: { showBadge: { classPropertyName: "showBadge", publicName: "showBadge", isSignal: true, isRequired: false, transformFunction: null }, sizeButton: { classPropertyName: "sizeButton", publicName: "sizeButton", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, fitParent: { classPropertyName: "fitParent", publicName: "fitParent", isSignal: false, isRequired: false, transformFunction: null }, popoverWidth: { classPropertyName: "popoverWidth", publicName: "popoverWidth", isSignal: false, isRequired: false, transformFunction: null }, rtl: { classPropertyName: "rtl", publicName: "rtl", isSignal: false, isRequired: false, transformFunction: null }, loadOnInit: { classPropertyName: "loadOnInit", publicName: "loadOnInit", isSignal: false, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: false, isRequired: false, transformFunction: null }, block: { classPropertyName: "block", publicName: "block", isSignal: false, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onValueChange: "onValueChange", onSearchValue: "onSearchValue", onClose: "onClose" }, viewQueries: [{ propertyName: "searchPopover", first: true, predicate: ["searchPop"], descendants: true }, { propertyName: "form", first: true, predicate: AXValidationFormComponent, descendants: true }, { propertyName: "_editors", predicate: AXPropertyEditorRendererDirective, descendants: true }], ngImport: i0, template: "@if (showBadge()) {\n\n
|
|
12745
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXSearchBarComponent, isStandalone: false, selector: "ax-search-bar", inputs: { showBadge: { classPropertyName: "showBadge", publicName: "showBadge", isSignal: true, isRequired: false, transformFunction: null }, sizeButton: { classPropertyName: "sizeButton", publicName: "sizeButton", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, fitParent: { classPropertyName: "fitParent", publicName: "fitParent", isSignal: false, isRequired: false, transformFunction: null }, popoverWidth: { classPropertyName: "popoverWidth", publicName: "popoverWidth", isSignal: false, isRequired: false, transformFunction: null }, rtl: { classPropertyName: "rtl", publicName: "rtl", isSignal: false, isRequired: false, transformFunction: null }, loadOnInit: { classPropertyName: "loadOnInit", publicName: "loadOnInit", isSignal: false, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: false, isRequired: false, transformFunction: null }, block: { classPropertyName: "block", publicName: "block", isSignal: false, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onValueChange: "onValueChange", onSearchValue: "onSearchValue", onClose: "onClose" }, viewQueries: [{ propertyName: "searchPopover", first: true, predicate: ["searchPop"], descendants: true }, { propertyName: "form", first: true, predicate: AXValidationFormComponent, descendants: true }, { propertyName: "_editors", predicate: AXPropertyEditorRendererDirective, descendants: true }], ngImport: i0, template: "@if (showBadge()) {\n\n<div class=\"ax-search-bar-badge-container\">\n <ax-button\n [block]=\"block\"\n end\n icon=\"far fa-sliders-h icon\"\n [type]=\"'primary outline'\"\n [disabled]=\"disabled\"\n [size]=\"sizeButton\"\n [tabIndex]=\"-1\"\n (click)=\"handleButtonClick()\"\n >\n </ax-button>\n\n @if (_searchCount) {\n\n <span class=\"search-count\">\n {{ _searchCount }}\n </span>\n }\n</div>\n\n}@else {\n<ax-button\n [block]=\"block\"\n end\n icon=\"far fa-sliders-h icon\"\n [selected]=\"_searchCount ? true : false\"\n [type]=\"_searchCount ? 'primary' : 'primary outline'\"\n [disabled]=\"disabled\"\n [size]=\"sizeButton\"\n [tabIndex]=\"-1\"\n (click)=\"handleButtonClick()\"\n>\n {{ caption ? caption : ('common.search' | trans) }}\n @if (_searchCount) {\n <span class=\"search-count\">{{ _searchCount }}</span>\n }</ax-button\n>\n}\n\n<ax-popover\n #searchPop\n [target]=\"ref\"\n [rtl]=\"rtl\"\n [position]=\"{\n originX: 'end',\n originY: 'bottom',\n overlayX: 'end',\n overlayY: 'top',\n offsetY: 10\n }\"\n>\n <div class=\"panel-box ax-dropdown-container-bordered {{ size }}\">\n <ax-validation-form #form>\n @for (item of _items; track item) { @if (item?.groupTitle) {\n <ax-fieldset [caption]=\"item?.groupTitle\">\n @for (item of item.rows; track item) {\n <div class=\"row\">\n @for (prop of item.items; track prop) { @if (prop.property.visible !=\n false) {\n <div class=\"{{ renderCol(prop.property.col) }}\">\n <div\n [class.ax-search-bar-required-state]=\"\n prop.property.editorOptions?.validation?.rules?.length\n \"\n >\n <ax-label>{{ prop.property.title }}</ax-label>\n <ng-container\n ax-property-editor-renderer\n [validationForm]=\"form\"\n [property]=\"prop\"\n [context]=\"_context\"\n (onValueChange)=\"handleValueChange($event)\"\n ></ng-container>\n </div>\n </div>\n } }\n </div>\n }\n </ax-fieldset>\n }@else { @for (item of item.rows; track item) {\n <div class=\"row\">\n @for (prop of item.items; track prop) { @if (prop.property.visible !=\n false) {\n <div class=\"{{ renderCol(prop.property.col) }}\">\n <div\n [class.ax-search-bar-required-state]=\"\n prop.property.editorOptions?.validation?.rules?.length\n \"\n >\n <ax-label>{{ prop.property.title }}</ax-label>\n <ng-container\n ax-property-editor-renderer\n [validationForm]=\"form\"\n [property]=\"prop\"\n [context]=\"_context\"\n (onValueChange)=\"handleValueChange($event)\"\n ></ng-container>\n </div>\n </div>\n } }\n </div>\n } } }\n <div\n class=\"footer-button\"\n [style.flex-direction]=\"isRtl() ? 'row' : 'row-reverse'\"\n >\n <ax-button type=\"blank danger\" (click)=\"clear()\">{{\n 'common.reset' | trans\n }}</ax-button>\n <ax-button (click)=\"search()\">{{ 'common.search' | trans }}</ax-button>\n </div>\n </ax-validation-form>\n </div>\n</ax-popover>\n", styles: [".panel-box{padding:1rem}.panel-box.ax-dropdown-container-bordered{background:var(--ax-white-color);border:1px solid;border-color:var(--ax-border-color);border-radius:var(--ax-border-radius-size);box-shadow:0 5px 10px #0000004d}.panel-box .footer-button{margin-top:1rem;display:flex;align-items:center;gap:.5rem}.panel-box.sm{width:30vw}.panel-box.md{width:50vw}.panel-box.lg{width:70vw}.panel-box.full{width:80vw}@media all and (min-width: 1280px){.panel-box.sm{width:420px!important}.panel-box.md{width:680px!important}.panel-box.lg{width:1024px!important}}@media all and (min-width: 1024px) and (max-width: 1279px){.panel-box.sm{width:100vw;max-height:100vh}.panel-box.md{width:500px!important}.panel-box.lg{width:900px!important}}@media all and (min-width: 768px) and (max-width: 1023px){.panel-box.sm{width:100vw;max-height:100vh}.panel-box.md{width:500px!important}.panel-box.lg{width:700px!important}}@media all and (min-width: 425px) and (max-width: 767px){.panel-box.sm{width:100vw;max-height:100vh}.panel-box.md,.panel-box.lg{width:460px!important}}@media all and (min-width: 0px) and (max-width: 424px){.panel-box.sm,.panel-box.md,.panel-box.lg{width:100vw;max-height:100vh}}.search-count{background:#fff3;border-radius:50%;color:var(--ax-white-color);padding:.125rem;width:1.75rem;height:1.75rem;font-size:.875rem;display:inline-flex;align-items:center;justify-content:center;margin-inline-start:.5rem}.ax-search-bar-badge-container{position:relative;display:inline-block}.ax-search-bar-badge-container .search-count{background-color:var(--ax-primary-color);color:#fff;border-radius:50%;height:25px;width:25px;position:absolute;left:0;top:0;transform:translate(-30%,-30%)}\n"], dependencies: [{ kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["type", "icon", "submitBehavior", "cancelBehavior", "block", "loading", "selected"] }, { kind: "directive", type: AXPropertyEditorRendererDirective, selector: "[ax-property-editor-renderer]", inputs: ["property", "validationForm", "context", "host", "groupId"], outputs: ["onValueChange"] }, { kind: "component", type: AXLabelComponent, selector: "ax-label", inputs: ["size"], outputs: ["clickLabel"] }, { kind: "component", type: AXValidationFormComponent, selector: "ax-validation-form", inputs: ["validateOn"], outputs: ["onInit"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["target", "position", "openMode", "closeMode", "rtl", "visible"], outputs: ["onOutSideClick"] }, { kind: "component", type: AXFieldsetComponent, selector: "ax-fieldset", inputs: ["size", "caption", "allowCollapse"] }, { kind: "pipe", type: i1$2.AXTranslatorPipe, name: "trans" }] });
|
|
12748
12746
|
}
|
|
12749
12747
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXSearchBarComponent, decorators: [{
|
|
12750
12748
|
type: Component,
|
|
12751
|
-
args: [{ selector: 'ax-search-bar', standalone: false, template: "@if (showBadge()) {\n\n
|
|
12749
|
+
args: [{ selector: 'ax-search-bar', standalone: false, template: "@if (showBadge()) {\n\n<div class=\"ax-search-bar-badge-container\">\n <ax-button\n [block]=\"block\"\n end\n icon=\"far fa-sliders-h icon\"\n [type]=\"'primary outline'\"\n [disabled]=\"disabled\"\n [size]=\"sizeButton\"\n [tabIndex]=\"-1\"\n (click)=\"handleButtonClick()\"\n >\n </ax-button>\n\n @if (_searchCount) {\n\n <span class=\"search-count\">\n {{ _searchCount }}\n </span>\n }\n</div>\n\n}@else {\n<ax-button\n [block]=\"block\"\n end\n icon=\"far fa-sliders-h icon\"\n [selected]=\"_searchCount ? true : false\"\n [type]=\"_searchCount ? 'primary' : 'primary outline'\"\n [disabled]=\"disabled\"\n [size]=\"sizeButton\"\n [tabIndex]=\"-1\"\n (click)=\"handleButtonClick()\"\n>\n {{ caption ? caption : ('common.search' | trans) }}\n @if (_searchCount) {\n <span class=\"search-count\">{{ _searchCount }}</span>\n }</ax-button\n>\n}\n\n<ax-popover\n #searchPop\n [target]=\"ref\"\n [rtl]=\"rtl\"\n [position]=\"{\n originX: 'end',\n originY: 'bottom',\n overlayX: 'end',\n overlayY: 'top',\n offsetY: 10\n }\"\n>\n <div class=\"panel-box ax-dropdown-container-bordered {{ size }}\">\n <ax-validation-form #form>\n @for (item of _items; track item) { @if (item?.groupTitle) {\n <ax-fieldset [caption]=\"item?.groupTitle\">\n @for (item of item.rows; track item) {\n <div class=\"row\">\n @for (prop of item.items; track prop) { @if (prop.property.visible !=\n false) {\n <div class=\"{{ renderCol(prop.property.col) }}\">\n <div\n [class.ax-search-bar-required-state]=\"\n prop.property.editorOptions?.validation?.rules?.length\n \"\n >\n <ax-label>{{ prop.property.title }}</ax-label>\n <ng-container\n ax-property-editor-renderer\n [validationForm]=\"form\"\n [property]=\"prop\"\n [context]=\"_context\"\n (onValueChange)=\"handleValueChange($event)\"\n ></ng-container>\n </div>\n </div>\n } }\n </div>\n }\n </ax-fieldset>\n }@else { @for (item of item.rows; track item) {\n <div class=\"row\">\n @for (prop of item.items; track prop) { @if (prop.property.visible !=\n false) {\n <div class=\"{{ renderCol(prop.property.col) }}\">\n <div\n [class.ax-search-bar-required-state]=\"\n prop.property.editorOptions?.validation?.rules?.length\n \"\n >\n <ax-label>{{ prop.property.title }}</ax-label>\n <ng-container\n ax-property-editor-renderer\n [validationForm]=\"form\"\n [property]=\"prop\"\n [context]=\"_context\"\n (onValueChange)=\"handleValueChange($event)\"\n ></ng-container>\n </div>\n </div>\n } }\n </div>\n } } }\n <div\n class=\"footer-button\"\n [style.flex-direction]=\"isRtl() ? 'row' : 'row-reverse'\"\n >\n <ax-button type=\"blank danger\" (click)=\"clear()\">{{\n 'common.reset' | trans\n }}</ax-button>\n <ax-button (click)=\"search()\">{{ 'common.search' | trans }}</ax-button>\n </div>\n </ax-validation-form>\n </div>\n</ax-popover>\n", styles: [".panel-box{padding:1rem}.panel-box.ax-dropdown-container-bordered{background:var(--ax-white-color);border:1px solid;border-color:var(--ax-border-color);border-radius:var(--ax-border-radius-size);box-shadow:0 5px 10px #0000004d}.panel-box .footer-button{margin-top:1rem;display:flex;align-items:center;gap:.5rem}.panel-box.sm{width:30vw}.panel-box.md{width:50vw}.panel-box.lg{width:70vw}.panel-box.full{width:80vw}@media all and (min-width: 1280px){.panel-box.sm{width:420px!important}.panel-box.md{width:680px!important}.panel-box.lg{width:1024px!important}}@media all and (min-width: 1024px) and (max-width: 1279px){.panel-box.sm{width:100vw;max-height:100vh}.panel-box.md{width:500px!important}.panel-box.lg{width:900px!important}}@media all and (min-width: 768px) and (max-width: 1023px){.panel-box.sm{width:100vw;max-height:100vh}.panel-box.md{width:500px!important}.panel-box.lg{width:700px!important}}@media all and (min-width: 425px) and (max-width: 767px){.panel-box.sm{width:100vw;max-height:100vh}.panel-box.md,.panel-box.lg{width:460px!important}}@media all and (min-width: 0px) and (max-width: 424px){.panel-box.sm,.panel-box.md,.panel-box.lg{width:100vw;max-height:100vh}}.search-count{background:#fff3;border-radius:50%;color:var(--ax-white-color);padding:.125rem;width:1.75rem;height:1.75rem;font-size:.875rem;display:inline-flex;align-items:center;justify-content:center;margin-inline-start:.5rem}.ax-search-bar-badge-container{position:relative;display:inline-block}.ax-search-bar-badge-container .search-count{background-color:var(--ax-primary-color);color:#fff;border-radius:50%;height:25px;width:25px;position:absolute;left:0;top:0;transform:translate(-30%,-30%)}\n"] }]
|
|
12752
12750
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }], propDecorators: { searchPopover: [{
|
|
12753
12751
|
type: ViewChild,
|
|
12754
12752
|
args: ['searchPop']
|