npm - @acorex/components - Versions diffs - 7.4.4 → 7.4.7 - Mend

@acorex/components 7.4.4 → 7.4.7

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 (179) hide show

package/fesm2022/acorex-components-popup.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"acorex-components-popup.mjs","sources":["../../../../libs/components/popup/src/lib/popup.component.ts","../../../../libs/components/popup/src/lib/popup.component.html","../../../../libs/components/popup/src/lib/popup.service.ts","../../../../libs/components/popup/src/lib/popup.module.ts","../../../../libs/components/popup/src/acorex-components-popup.ts"],"sourcesContent":["import { AXPlatform } from '@acorex/core/platform';\nimport {\n CdkPortalOutletAttachedRef,\n ComponentPortal,\n Portal,\n TemplatePortal,\n} from '@angular/cdk/portal';\nimport {\n ChangeDetectionStrategy,\n Component,\n ComponentRef,\n HostListener,\n Inject,\n NgZone,\n OnInit,\n TemplateRef,\n ViewContainerRef,\n ViewEncapsulation,\n} from '@angular/core';\n\nimport { AXClosbaleComponent, AXComponentCloseEvent, AXComponentClosing, MXBaseComponent } from '@acorex/components/common';\nimport { AXLoadingService } from '@acorex/components/loading';\nimport { DIALOG_DATA, DialogRef } from '@angular/cdk/dialog';\nimport { AXPopupData } from './popup.interface';\n\n\n/*\n The Button is a component which detects user interaction and triggers a corresponding event\n \n @category Components\n /\n@Component({\n selector: 'ax-popup',\n templateUrl: './popup.component.html',\n styleUrls: ['./popup.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [{ provide: AXClosbaleComponent, useExisting: AXPopupComponent }],\n})\nexport class AXPopupComponent extends MXBaseComponent implements OnInit {\n isLoading = true;\n private _loadingId: number;\n\n protected _selectedPortal: Portal<unknown>;\n protected _footerPortal: Portal<unknown>;\n protected _headerPortal: Portal<unknown>;\n\n private _componentRef: any;\n\n /\n @ignore\n /\n constructor(\n private _zone: NgZone,\n private _viewContainerRef: ViewContainerRef,\n private loadingService: AXLoadingService,\n private _platform: AXPlatform,\n @Inject(DIALOG_DATA)\n protected data: AXPopupData,\n private dialogRef: DialogRef<AXComponentCloseEvent>,\n ) {\n super();\n }\n\n ngOnInit() {\n if (this._platform.is('Mobile')) {\n this.data.draggable = false;\n }\n this._loadingId = this.loadingService.show({\n location: this.getHostElement(),\n });\n //\n if (this.data.content instanceof TemplateRef) {\n this._selectedPortal = new TemplatePortal(this.data.content, this._viewContainerRef, {\n $implicit: this.data,\n ref: this,\n });\n this.cdr.markForCheck();\n } else if (typeof this.data.content === 'function') {\n this._selectedPortal = new ComponentPortal(this.data.content);\n this.cdr.markForCheck();\n }\n }\n\n _handleAttched(ref: CdkPortalOutletAttachedRef) {\n ref = ref as ComponentRef<unknown>;\n if (ref.instance) {\n this._componentRef = ref.instance;\n Object.assign(this._componentRef, this.data);\n Object.assign(this._componentRef, { _isPopup: true });\n if (ref.instance.onClosed) {\n ref.instance.onClosed.subscribe((e: AXComponentCloseEvent) => {\n this.close(e.data);\n });\n }\n }\n this._zone.runOutsideAngular(() => {\n setTimeout(() => {\n const main = this.getHostElement().querySelector<HTMLDivElement>('.ax-popup-main-container');\n const popHeader = this.getHostElement().querySelector<HTMLDivElement>('.ax-popup-header-container');\n const popFooter = this.getHostElement().querySelector<HTMLDivElement>('.ax-popup-footer-container');\n const footer = main.querySelector<HTMLDivElement>('ax-footer');\n const header = main.querySelector<HTMLDivElement>('ax-header');\n if (footer) {\n popFooter?.append(footer);\n }\n if (header) {\n popHeader.innerHTML = '';\n popHeader.append(header);\n }\n this.focus();\n });\n });\n this.loadingService.hide(this._loadingId);\n this.cdr.markForCheck();\n }\n\n @HostListener('keydown.escape', ['$event'])\n onKeydownHandler(event: KeyboardEvent) {\n const focusedOrHasFocused = this.getHostElement().matches(':focus-within');\n if (this.data.closeButton && focusedOrHasFocused) {\n this.close();\n }\n }\n\n _handleCloseClick() {\n this.close();\n }\n\n ngOnDestroy() {\n this.loadingService.hide(this._loadingId);\n }\n\n focus() {\n setTimeout(() => this.getHostElement().querySelector<HTMLDivElement>('.ax-popup')?.focus());\n }\n\n close(data?: unknown) {\n const closeFn = () => {\n this.dialogRef.close({\n component: this._componentRef,\n htmlElement: this.getHostElement(),\n data: data\n });\n }\n if (typeof this._componentRef.onClosing === 'function') {\n const ee: AXComponentClosing = {\n cancel: false,\n data\n }\n const closingResult = this._componentRef.onClosing(ee);\n if (closingResult instanceof Promise) {\n closingResult.then(() => {\n if (!ee.cancel) {\n closeFn();\n }\n });\n }\n else {\n if (!ee.cancel) {\n closeFn();\n }\n }\n }\n else {\n closeFn();\n }\n }\n}\n","<div class=\"ax-popup-wrapper \" aria-modal=\"true\" [cdkTrapFocus]=\"true\">\n <div class=\"ax-popup ax-popup-{{ data.size }}\" tabindex=\"0\" cdkDrag [cdkDragDisabled]=\"!data.draggable\">\n <div cdkDragHandle class=\"ax-popup-header-container\">\n <div class=\"ax-popup-header\" ngIf=\"data.header\">\n <span class=\"ax-popup-title\">{{ data.title }}</span>\n <ax-close-button tabindex=\"1\" ngIf=\"data.closeButton\"></ax-close-button>\n </div>\n </div>\n <div class=\"ax-popup-main-container ax-loading-container\">\n <div class=\"ax-popup-body-container\">\n <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n </div>\n <div class=\"ax-popup-footer-container\"></div>\n </div>\n </div>\n</div>","import { AXComponentCloseEvent, AXComponentClosedPromise } from '@acorex/components/common';\nimport { Dialog } from '@angular/cdk/dialog';\nimport { Injectable, inject } from '@angular/core';\nimport { AXPopupComponent } from './popup.component';\nimport { AXPopupContentType, AXPopupConfig } from './popup.interface';\n\n\n/\n This is a service which you can create popup with it\n \n @category Components\n /\n@Injectable()\nexport class AXPopupService {\n private dialog: Dialog = inject(Dialog);\n\n /\n Open popup 1\n /\n open(content: AXPopupContentType, title: string): AXComponentClosedPromise;\n /\n Open popup 2\n /\n open(content: AXPopupContentType, config?: AXPopupConfig): AXComponentClosedPromise;\n\n /\n @ignore\n /\n open(arg1, arg2): AXComponentClosedPromise {\n let config: AXPopupConfig = {\n closeButton: true,\n header: true,\n size: 'md',\n maximizable: false,\n draggable: true,\n hasBackdrop: true,\n closeOnBackdropClick: false,\n };\n if (typeof arg2 === 'string') {\n config.title = arg2;\n } else {\n config = Object.assign(config, arg2);\n }\n\n const dialogRef = this.dialog.open<AXComponentCloseEvent, AXPopupConfig, AXPopupComponent>(AXPopupComponent, {\n data: Object.assign(config, { content: arg1 }),\n autoFocus: true,\n restoreFocus: true,\n closeOnNavigation: true,\n closeOnDestroy: true,\n hasBackdrop: config.hasBackdrop,\n backdropClass: config.backdropClass,\n disableClose: config.closeOnBackdropClick ? false : true,\n });\n const promise = new AXComponentClosedPromise((resolve) => {\n dialogRef.closed.subscribe(d => {\n if (resolve) {\n resolve({\n sender: d.component,\n data: d.data\n });\n }\n });\n });\n return promise;\n }\n}\n","import { AXCommonModule } from '@acorex/components/common';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { DialogModule } from '@angular/cdk/dialog';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXPopupComponent } from './popup.component';\nimport { AXPopupService } from './popup.service';\n\nconst COMPONENT = [AXPopupComponent];\nconst MODULES = [\n CommonModule,\n AXCommonModule,\n DragDropModule,\n A11yModule,\n PortalModule,\n AXDecoratorModule,\n DialogModule\n];\n\n@NgModule({\n declarations: [...COMPONENT],\n imports: [...MODULES],\n exports: [...COMPONENT],\n providers: [AXPopupService],\n})\nexport class AXPopupModule { }\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"acorex-components-popup.mjs","sources":["../../../../libs/components/popup/src/lib/popup.component.ts","../../../../libs/components/popup/src/lib/popup.component.html","../../../../libs/components/popup/src/lib/popup.service.ts","../../../../libs/components/popup/src/lib/popup.module.ts","../../../../libs/components/popup/src/acorex-components-popup.ts"],"sourcesContent":["import { AXPlatform } from '@acorex/core/platform';\nimport { CdkPortalOutletAttachedRef, ComponentPortal, Portal, TemplatePortal } from '@angular/cdk/portal';\nimport {\n ChangeDetectionStrategy,\n Component,\n ComponentRef,\n HostListener,\n Inject,\n NgZone,\n OnInit,\n TemplateRef,\n ViewContainerRef,\n ViewEncapsulation,\n} from '@angular/core';\n\nimport {\n AXClosbaleComponent,\n AXComponentCloseEvent,\n AXComponentClosing,\n MXBaseComponent,\n} from '@acorex/components/common';\nimport { AXLoadingService } from '@acorex/components/loading';\nimport { DIALOG_DATA, DialogRef } from '@angular/cdk/dialog';\nimport { AXPopupData } from './popup.interface';\n\n/*\n The Button is a component which detects user interaction and triggers a corresponding event\n \n @category Components\n /\n@Component({\n selector: 'ax-popup',\n templateUrl: './popup.component.html',\n styleUrls: ['./popup.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [{ provide: AXClosbaleComponent, useExisting: AXPopupComponent }],\n})\nexport class AXPopupComponent extends MXBaseComponent implements OnInit {\n isLoading = true;\n private _loadingId: number;\n\n protected _selectedPortal: Portal<unknown>;\n protected _footerPortal: Portal<unknown>;\n protected _headerPortal: Portal<unknown>;\n\n private _componentRef: any;\n\n /\n @ignore\n /\n constructor(\n private _zone: NgZone,\n private _viewContainerRef: ViewContainerRef,\n private loadingService: AXLoadingService,\n private _platform: AXPlatform,\n @Inject(DIALOG_DATA)\n protected data: AXPopupData,\n private dialogRef: DialogRef<AXComponentCloseEvent>,\n ) {\n super();\n }\n\n ngOnInit() {\n super.ngOnInit();\n debugger;\n if (this._platform.is('Mobile')) {\n this.data.draggable = false;\n }\n this._loadingId = this.loadingService.show({\n location: this.getHostElement(),\n });\n //\n if (this.data.content instanceof TemplateRef) {\n this._selectedPortal = new TemplatePortal(this.data.content, this._viewContainerRef, {\n $implicit: this.data,\n ref: this,\n });\n this.cdr.markForCheck();\n } else if (typeof this.data.content === 'function') {\n this._selectedPortal = new ComponentPortal(this.data.content);\n this.cdr.markForCheck();\n }\n }\n\n _handleAttched(ref: CdkPortalOutletAttachedRef) {\n ref = ref as ComponentRef<unknown>;\n if (ref.instance) {\n this._componentRef = ref.instance;\n Object.assign(this._componentRef, this.data.data);\n Object.assign(this._componentRef, { _isPopup: true });\n if (ref.instance.onClosed) {\n ref.instance.onClosed.subscribe((e: AXComponentCloseEvent) => {\n this.close(e.data);\n });\n }\n }\n this._zone.runOutsideAngular(() => {\n setTimeout(() => {\n const main = this.getHostElement().querySelector<HTMLDivElement>('.ax-popup-main-container');\n const popHeader = this.getHostElement().querySelector<HTMLDivElement>('.ax-popup-header-container');\n const popFooter = this.getHostElement().querySelector<HTMLDivElement>('.ax-popup-footer-container');\n const footer = main.querySelector<HTMLDivElement>('ax-footer');\n const header = main.querySelector<HTMLDivElement>('ax-header');\n if (footer) {\n popFooter?.append(footer);\n }\n if (header) {\n popHeader.innerHTML = '';\n popHeader.append(header);\n }\n this.focus();\n });\n });\n this.loadingService.hide(this._loadingId);\n this.cdr.markForCheck();\n }\n\n @HostListener('keydown.escape', ['$event'])\n onKeydownHandler(event: KeyboardEvent) {\n const focusedOrHasFocused = this.getHostElement().matches(':focus-within');\n if (this.data.closeButton && focusedOrHasFocused) {\n this.close();\n }\n }\n\n _handleCloseClick() {\n this.close();\n }\n\n ngOnDestroy() {\n this.loadingService.hide(this._loadingId);\n }\n\n focus() {\n setTimeout(() => this.getHostElement().querySelector<HTMLDivElement>('.ax-popup')?.focus());\n }\n\n close(data?: unknown) {\n const closeFn = () => {\n this.dialogRef.close({\n component: this._componentRef,\n htmlElement: this.getHostElement(),\n data: data,\n });\n };\n if (typeof this._componentRef.onClosing === 'function') {\n const ee: AXComponentClosing = {\n cancel: false,\n data,\n };\n const closingResult = this._componentRef.onClosing(ee);\n if (closingResult instanceof Promise) {\n closingResult.then(() => {\n if (!ee.cancel) {\n closeFn();\n }\n });\n } else {\n if (!ee.cancel) {\n closeFn();\n }\n }\n } else {\n closeFn();\n }\n }\n}\n","<div class=\"ax-popup-wrapper \" aria-modal=\"true\" [cdkTrapFocus]=\"true\">\n <div class=\"ax-popup ax-popup-{{ data.size }}\" tabindex=\"0\" cdkDrag [cdkDragDisabled]=\"!data.draggable\">\n <div cdkDragHandle class=\"ax-popup-header-container\">\n <div class=\"ax-popup-header\" ngIf=\"data.header\">\n <span class=\"ax-popup-title\">{{ data.title }}</span>\n <ax-close-button tabindex=\"1\" ngIf=\"data.closeButton\"></ax-close-button>\n </div>\n </div>\n <div class=\"ax-popup-main-container ax-loading-container\">\n <div class=\"ax-popup-body-container\">\n <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n </div>\n <div class=\"ax-popup-footer-container\"></div>\n </div>\n </div>\n</div>","import { AXComponentCloseEvent, AXComponentClosedPromise } from '@acorex/components/common';\nimport { Dialog } from '@angular/cdk/dialog';\nimport { Injectable, inject } from '@angular/core';\nimport { AXPopupComponent } from './popup.component';\nimport { AXPopupConfig, AXPopupContentType } from './popup.interface';\n\n/\n This is a service which you can create popup with it\n \n @category Components\n /\n@Injectable()\nexport class AXPopupService {\n private dialog: Dialog = inject(Dialog);\n\n /\n Open popup 1\n /\n open(content: AXPopupContentType, title: string): AXComponentClosedPromise;\n /\n Open popup 2\n /\n open(content: AXPopupContentType, config?: AXPopupConfig): AXComponentClosedPromise;\n\n /\n @ignore\n /\n open(arg1, arg2): AXComponentClosedPromise {\n let config: AXPopupConfig = {\n closeButton: true,\n header: true,\n size: 'md',\n maximizable: false,\n draggable: true,\n hasBackdrop: true,\n closeOnBackdropClick: false,\n data: {},\n };\n if (typeof arg2 === 'string') {\n config.title = arg2;\n } else {\n config = Object.assign(config, arg2);\n }\n\n const dialogRef = this.dialog.open<AXComponentCloseEvent, AXPopupConfig, AXPopupComponent>(\n AXPopupComponent,\n {\n data: Object.assign(config, { content: arg1 }),\n autoFocus: true,\n restoreFocus: true,\n closeOnNavigation: true,\n closeOnDestroy: true,\n hasBackdrop: config.hasBackdrop,\n backdropClass: config.backdropClass,\n disableClose: config.closeOnBackdropClick ? false : true,\n },\n );\n debugger;\n const promise = new AXComponentClosedPromise((resolve) => {\n dialogRef.closed.subscribe((d) => {\n if (resolve) {\n resolve({\n sender: d.component,\n data: d.data,\n });\n }\n });\n });\n return promise;\n }\n}\n","import { AXCommonModule } from '@acorex/components/common';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { DialogModule } from '@angular/cdk/dialog';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXPopupComponent } from './popup.component';\nimport { AXPopupService } from './popup.service';\n\nconst COMPONENT = [AXPopupComponent];\nconst MODULES = [\n CommonModule,\n AXCommonModule,\n DragDropModule,\n A11yModule,\n PortalModule,\n AXDecoratorModule,\n DialogModule\n];\n\n@NgModule({\n declarations: [...COMPONENT],\n imports: [...MODULES],\n exports: [...COMPONENT],\n providers: [AXPopupService],\n})\nexport class AXPopupModule { }\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/acorex-components-scheduler.mjs CHANGED Viewed

@@ -29,6 +29,7 @@ class AXSchedulerMonthViewComponent extends MXBaseComponent {
         this.generateSlots();
     }
     ngOnInit() {
+        super.ngOnInit();
         this.generateSlots();
         this._platform.resize.subscribe((c) => {
             this.cdr.markForCheck();
@@ -74,6 +75,7 @@ class AXSchedulerComponent extends MXBaseComponent {
     }
     handleOnItemClick() { }
     ngOnInit() {
+        super.ngOnInit();
         this.detectSize();
         this._platform.resize.subscribe(() => {
             this.detectSize();
@@ -82,7 +84,6 @@ class AXSchedulerComponent extends MXBaseComponent {
     }
     detectSize() {
         this._size = this._platform.screenSize;
-        console.log(this._size);
     }
     _handleNextClick() {
         this.current = this.current.add('month', 1);

package/fesm2022/acorex-components-scheduler.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"acorex-components-scheduler.mjs","sources":["../../../../libs/components/scheduler/src/lib/scheduler-month-view.component.ts","../../../../libs/components/scheduler/src/lib/scheduler-month-view.component.html","../../../../libs/components/scheduler/src/lib/scheduler-week-view.component.ts","../../../../libs/components/scheduler/src/lib/scheduler-week-view.component.html","../../../../libs/components/scheduler/src/lib/scheduler.component.ts","../../../../libs/components/scheduler/src/lib/scheduler.component.html","../../../../libs/components/scheduler/src/lib/scheduler.module.ts","../../../../libs/components/scheduler/src/acorex-components-scheduler.ts"],"sourcesContent":["import { MXBaseComponent } from '@acorex/components/common';\nimport { AXDateTime, AXDateTimeRange } from '@acorex/core/dateTime';\nimport { AXPlatform } from '@acorex/core/platform';\nimport { ChangeDetectionStrategy, Component, Input, ViewEncapsulation, inject } from '@angular/core';\n\n@Component({\n selector: 'ax-scheduler-month-view',\n templateUrl: './scheduler-month-view.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXSchedulerMonthViewComponent extends MXBaseComponent {\n private _platform = inject(AXPlatform);\n\n protected _slots: { date: AXDateTime; cssClass: { [key: string]: boolean }; isToday: boolean }[] = [];\n protected get dayNames(): string[] {\n return this._platform.is('SM') ? this.date.calendar.dayNames.map(c => c.letter) : this.date.calendar.dayNames.map(c => c.short);\n }\n\n private _date: AXDateTime;\n @Input()\n public get date(): AXDateTime {\n return this._date;\n }\n public set date(v: AXDateTime) {\n this._date = v;\n this.generateSlots();\n }\n\n ngOnInit() {\n this.generateSlots();\n this._platform.resize.subscribe((c) => {\n this.cdr.markForCheck();\n });\n }\n\n generateSlots() {\n const startDate = this.date.startOf('month').startOf('week');\n const endDate = this.date.endOf('month').endOf('week');\n const range = new AXDateTimeRange(startDate, endDate).enumurate('day');\n this._slots = range.map((c: AXDateTime) => ({\n date: c,\n cssClass: {\n '!ax-bg-neutral-100': c.monthOfYear != this.date.monthOfYear,\n },\n isToday: c.dayOfYear == this.date.dayOfYear,\n }));\n }\n}\n","<!-- <div class=\"ax-flex ax-flex-col ax-flex-auto ax-shadow-md\"> -->\n<div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full ax-bg-neutral-200 ax-border-b\">\n <ng-container ngFor=\"let item of dayNames\">\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-2 ax-bg-white ax-font-medium\">\n {{item}}\n </div>\n </ng-container>\n</div>\n<div class=\"ax-flex ax-flex-auto ax-bg-neutral-200\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full\">\n <ng-container ngFor=\"let item of _slots\">\n <div class=\"ax-py-2 ax-px-3 ax-bg-white ax-cursor-pointer hover:ax-bg-neutral-100\n ax-flex ax-flex-col ax-justify-between\" [ngClass]=\"item.cssClass\">\n <time class=\"ax-text-sm ax-flex ax-items-center ax-justify-center ax-rounded-full ax-w-6 ax-h-6\"\n [class.ax-bg-primary-500]=\"item.isToday\" [class.ax-text-white]=\"item.isToday\"\n datetime=\"item.date.format('dd')\">{{item.date.format('d')}}</time>\n <ol class=\"ax-mt-2 ax-hidden lg:ax-flex ax-flex-col ax-gap-1\">\n <li ngIf=\"item.date.dayOfMonth % 6 === 0\">\n <a href=\"#\"\n class=\"ax-flex ax-justify-between ax-text-sm ax-bg-primary-500 ax-py-1 ax-px-2 ax-rounded ax-text-primary-fore\">\n <p class=\"ax-text-sm\">Launch Time</p>\n <time class=\"ax-ms-3\" datetime=\"item.date.format('HH A')\">\n {{item.date.format('hh A')}}\n </time>\n </a>\n </li>\n <li ngIf=\"item.date.dayOfMonth % 5 === 0\">\n <a href=\"#\"\n class=\"ax-flex ax-justify-between ax-text-sm ax-bg-success-500 ax-py-1 ax-px-2 ax-rounded ax-text-success-fore\">\n <p class=\"ax-text-sm\">Daily meeting</p>\n <time class=\"ax-ms-3\" datetime=\"item.date.format('HH A')\">\n {{item.date.format('hh A')}}\n </time>\n </a>\n </li>\n </ol>\n <ol class=\"ax-flex ax-gap-1 ax-self-center md:ax-hidden\">\n <li ngIf=\"item.date.dayOfMonth % 5 === 0\">\n <span class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-primary-500 lg:ax-hidden\"></span>\n </li>\n <li ngIf=\"item.date.dayOfMonth % 6 === 0\">\n <span class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-danger-500 lg:ax-hidden\"></span>\n </li>\n <li ngIf=\"item.date.dayOfMonth % 8 === 0\">\n <span class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-warning-500 lg:ax-hidden\"></span>\n </li>\n <li ngIf=\"item.date.dayOfMonth % 3 === 0\">\n <span class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-success-500 lg:ax-hidden\"></span>\n </li>\n </ol>\n </div>\n </ng-container>\n </div>\n</div>\n<!-- </div> -->\n<div class=\"ax-p-4 lg:ax-hidden\">\n <ol\n class=\"ax-flex ax-flex-col ax-rounded-lg ax-border ax-bg-surface ax-divide-y ax-overflow-hidden ax-cursor-pointer\">\n <li class=\"ax-flex ax-items-start ax-justify-between ax-p-4 hover:ax-bg-neutral-100 mobile-task\">\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <p class=\"ax-font-medium\">Daily Meeting at the Office</p>\n <div class=\"ax-flex ax-gap-2 ax-items-center\">\n <ax-icon class=\"fa-solid fa-clock ax-text-neutral-400\"></ax-icon>\n <p class=\"ax-text-sm\">3 PM</p>\n </div>\n </div>\n <ax-button text=\"Edit\" class=\"!ax-bg-surface ax-border ax-sm ax-opacity-0\"></ax-button>\n </li>\n </ol>\n</div>","import { MXBaseComponent } from '@acorex/components/common';\nimport { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';\n\n@Component({\n selector: 'ax-scheduler-week-view',\n templateUrl: './scheduler-week-view.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXSchedulerWeekViewComponent extends MXBaseComponent {}\n","<div class=\"ax-flex ax-flex-col ax-flex-auto ax-isolate ax-overflow-auto ax-bg-white\">\n <div class=\"ax-flex ax-flex-col ax-max-w-full\">\n <div class=\"ax-shadow-md ax-pr-8 ax-z-30 ax-sticky ax-top-0\">\n <div class=\"ax-grid ax-leading-6 ax-border-r ax-grid-cols-7\">\n <div class=\"ax-w-14 ax-col-end-1\"></div>\n <div\n class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-l ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium\">\n Mon 10\n </div>\n </div>\n </div>\n <div class=\"ax-flex ax-flex-auto\">\n <div class=\"ax-w-14 ax-z-10 ax-sticky ax-left-0 ax-bg-white ax-shadow\"></div>\n <div class=\"ax-grid ax-flex-auto ax-grid-cols-1 ax-grid-rows-1\">\n <div class=\"ax-grid ax-col-start-1 ax-col-end-2 ax-row-start-1\"\n style=\"grid-template-rows: repeat(45, minmax(3.5rem, 1fr))\">\n <div class=\"ax-row-end-1 ax-h-7\"></div>\n <div class=\"ax-border-t ax-border-b\">\n <div class=\"ax-leading-5 ax-text-right ax-w-14 -ax-mt-[0.625rem] -ax-ml-14 ax-sticky ax-left-0\">\n </div>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-rows-1 ax-grid-cols-7 ax-row-start-1 ax-col-end-2 ax-col-start-1\">\n <div class=\"ax-col-start-1 ax-row-start-1 ax-row-end-[-1]\"></div>\n <div class=\"ax-col-start-2 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-3 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-4 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-5 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-6 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-7 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-8 ax-row-start-1 ax-row-end-[-1] ax-border-l ax-w-8\"></div>\n </div>\n <ol class=\"ax-grid ax-pr-8 ax-grid-cols-7 ax-row-start-1 ax-col-end-2 ax-col-start-2\"\n style=\"grid-template-rows: 1.75rem repeat(288, minmax(0px, 1fr)) auto\"></ol>\n </div>\n </div>\n </div>\n</div>","import { MXBaseComponent } from '@acorex/components/common';\nimport { AXDateTime, AXCalendarService } from '@acorex/core/dateTime';\nimport { AXPlatform, AXScreenSizes } from '@acorex/core/platform';\nimport { ChangeDetectionStrategy, Component, ViewEncapsulation, inject } from '@angular/core';\n\n@Component({\n selector: 'ax-scheduler',\n templateUrl: './scheduler.component.html',\n styleUrls: ['./scheduler.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXSchedulerComponent extends MXBaseComponent {\n\n private _calendarService: AXCalendarService = inject(AXCalendarService);\n protected _platform: AXPlatform = inject(AXPlatform);\n protected current: AXDateTime = this._calendarService.now();\n\n protected _size: AXScreenSizes;\n\n handleOnItemClick() { }\n\n ngOnInit(): void {\n this.detectSize();\n this._platform.resize.subscribe(() => {\n this.detectSize();\n super.cdr.markForCheck();\n });\n }\n\n private detectSize() {\n this._size = this._platform.screenSize;\n console.log(this._size);\n }\n\n _handleNextClick() {\n this.current = this.current.add('month', 1);\n }\n\n _handlePrevClick() {\n this.current = this.current.add('month', -1);\n }\n}\n","<div class=\"ax-flex ax-flex-col ax-h-full\">\n <div class=\"scheduler-header\">\n <p>\n {{ current.format('MMMM yyyy') }}\n </p>\n <div class=\"scheduler-actions\">\n <div class=\"ax-flex ax-border ax-rounded-md ax-items-center ax-px-1 ax-gap-0.5 ax-bg-surface\">\n <button class=\"ax-w-8 ax-h-8 ax-rounded-md hover:ax-bg-neutral-100\" (click)=\"_handlePrevClick()\">\n <ax-icon class=\"fa-solid fa-chevron-left\"> </ax-icon>\n </button>\n <ng-container ngIf=\"_size === 'SM'; else elseTemplate\">\n <span class=\"ax-text-neutral-200\">\|</span>\n </ng-container>\n <ng-template #elseTemplate>\n <ax-button look=\"blank\" class=\"ax-sm\" text=\"Today\"> </ax-button>\n </ng-template>\n <button class=\"ax-w-8 ax-h-8 ax-rounded-md hover:ax-bg-neutral-100\" (click)=\"_handleNextClick()\">\n <ax-icon class=\"fa-solid fa-chevron-right\"> </ax-icon>\n </button>\n </div>\n <ax-button [text]=\"_size === 'SM' ? '' : 'Week View'\" class=\"!ax-bg-surface ax-border\">\n <ax-suffix>\n <ax-icon [class]=\"\n _size === 'SM'\n ? 'fa-solid fa-ellipsis-vertical'\n : 'fa-solid fa-chevron-down ax-text-neutral-400'\n \">\n </ax-icon>\n </ax-suffix>\n <ax-dropdown-panel (onItemClick)=\"handleOnItemClick()\" [adaptivityEnabled]=\"true\">\n <ax-button-item ngIf=\"_size === 'SM' \|\| _size === 'MD'\" text=\"Add Event\" name=\"text\" [divided]=\"true\"\n color=\"primary\">\n </ax-button-item>\n <ax-button-item ngIf=\"_size === 'SM'\" text=\"Go to Today\" name=\"text\" [divided]=\"true\">\n </ax-button-item>\n <ax-button-item text=\"Day View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Week View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Month View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Year View\" name=\"text\"> </ax-button-item>\n </ax-dropdown-panel>\n <ax-suffix>\n <ax-icon icon=\"\"></ax-icon>\n </ax-suffix>\n </ax-button>\n <ax-button color=\"primary\" text=\"Add Event\" class=\"ax-hidden lg:ax-block\">\n <ax-prefix>\n <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n </div>\n <ax-scheduler-month-view [date]=\"current\"></ax-scheduler-month-view>\n <!-- <ax-scheduler-week-view></ax-scheduler-week-view> -->\n</div>","import { AXButtonModule } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXDropdownModule } from '@acorex/components/dropdown';\nimport { AXDateTimeModule } from '@acorex/core/dateTime';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXSchedulerMonthViewComponent } from './scheduler-month-view.component';\nimport { AXSchedulerWeekViewComponent } from './scheduler-week-view.component';\nimport { AXSchedulerComponent } from './scheduler.component';\n\nconst COMPONENT = [AXSchedulerComponent, AXSchedulerMonthViewComponent, AXSchedulerWeekViewComponent];\nconst MODULES = [CommonModule, AXButtonModule, AXDecoratorModule, AXDropdownModule, AXDateTimeModule];\n\n@NgModule({\n declarations: [...COMPONENT],\n imports: [...MODULES],\n exports: [...COMPONENT],\n providers: [],\n})\nexport class AXSchedulerModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":["i5.AXSchedulerMonthViewComponent"],"mappings":"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"}
1	+ {"version":3,"file":"acorex-components-scheduler.mjs","sources":["../../../../libs/components/scheduler/src/lib/scheduler-month-view.component.ts","../../../../libs/components/scheduler/src/lib/scheduler-month-view.component.html","../../../../libs/components/scheduler/src/lib/scheduler-week-view.component.ts","../../../../libs/components/scheduler/src/lib/scheduler-week-view.component.html","../../../../libs/components/scheduler/src/lib/scheduler.component.ts","../../../../libs/components/scheduler/src/lib/scheduler.component.html","../../../../libs/components/scheduler/src/lib/scheduler.module.ts","../../../../libs/components/scheduler/src/acorex-components-scheduler.ts"],"sourcesContent":["import { MXBaseComponent } from '@acorex/components/common';\nimport { AXDateTime, AXDateTimeRange } from '@acorex/core/dateTime';\nimport { AXPlatform } from '@acorex/core/platform';\nimport { ChangeDetectionStrategy, Component, Input, ViewEncapsulation, inject } from '@angular/core';\n\n@Component({\n selector: 'ax-scheduler-month-view',\n templateUrl: './scheduler-month-view.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXSchedulerMonthViewComponent extends MXBaseComponent {\n private _platform = inject(AXPlatform);\n\n protected _slots: { date: AXDateTime; cssClass: { [key: string]: boolean }; isToday: boolean }[] = [];\n protected get dayNames(): string[] {\n return this._platform.is('SM') ? this.date.calendar.dayNames.map(c => c.letter) : this.date.calendar.dayNames.map(c => c.short);\n }\n\n private _date: AXDateTime;\n @Input()\n public get date(): AXDateTime {\n return this._date;\n }\n public set date(v: AXDateTime) {\n this._date = v;\n this.generateSlots();\n }\n\n ngOnInit() {\n super.ngOnInit();\n this.generateSlots();\n this._platform.resize.subscribe((c) => {\n this.cdr.markForCheck();\n });\n }\n\n generateSlots() {\n const startDate = this.date.startOf('month').startOf('week');\n const endDate = this.date.endOf('month').endOf('week');\n const range = new AXDateTimeRange(startDate, endDate).enumurate('day');\n this._slots = range.map((c: AXDateTime) => ({\n date: c,\n cssClass: {\n '!ax-bg-neutral-100': c.monthOfYear != this.date.monthOfYear,\n },\n isToday: c.dayOfYear == this.date.dayOfYear,\n }));\n }\n}\n","<!-- <div class=\"ax-flex ax-flex-col ax-flex-auto ax-shadow-md\"> -->\n<div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full ax-bg-neutral-200 ax-border-b\">\n <ng-container ngFor=\"let item of dayNames\">\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-2 ax-bg-white ax-font-medium\">\n {{item}}\n </div>\n </ng-container>\n</div>\n<div class=\"ax-flex ax-flex-auto ax-bg-neutral-200\">\n <div class=\"ax-grid ax-grid-cols-7 ax-gap-[1px] ax-w-full\">\n <ng-container ngFor=\"let item of _slots\">\n <div class=\"ax-py-2 ax-px-3 ax-bg-white ax-cursor-pointer hover:ax-bg-neutral-100\n ax-flex ax-flex-col ax-justify-between\" [ngClass]=\"item.cssClass\">\n <time class=\"ax-text-sm ax-flex ax-items-center ax-justify-center ax-rounded-full ax-w-6 ax-h-6\"\n [class.ax-bg-primary-500]=\"item.isToday\" [class.ax-text-white]=\"item.isToday\"\n datetime=\"item.date.format('dd')\">{{item.date.format('d')}}</time>\n <ol class=\"ax-mt-2 ax-hidden lg:ax-flex ax-flex-col ax-gap-1\">\n <li ngIf=\"item.date.dayOfMonth % 6 === 0\">\n <a href=\"#\"\n class=\"ax-flex ax-justify-between ax-text-sm ax-bg-primary-500 ax-py-1 ax-px-2 ax-rounded ax-text-primary-fore\">\n <p class=\"ax-text-sm\">Launch Time</p>\n <time class=\"ax-ms-3\" datetime=\"item.date.format('HH A')\">\n {{item.date.format('hh A')}}\n </time>\n </a>\n </li>\n <li ngIf=\"item.date.dayOfMonth % 5 === 0\">\n <a href=\"#\"\n class=\"ax-flex ax-justify-between ax-text-sm ax-bg-success-500 ax-py-1 ax-px-2 ax-rounded ax-text-success-fore\">\n <p class=\"ax-text-sm\">Daily meeting</p>\n <time class=\"ax-ms-3\" datetime=\"item.date.format('HH A')\">\n {{item.date.format('hh A')}}\n </time>\n </a>\n </li>\n </ol>\n <ol class=\"ax-flex ax-gap-1 ax-self-center md:ax-hidden\">\n <li ngIf=\"item.date.dayOfMonth % 5 === 0\">\n <span class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-primary-500 lg:ax-hidden\"></span>\n </li>\n <li ngIf=\"item.date.dayOfMonth % 6 === 0\">\n <span class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-danger-500 lg:ax-hidden\"></span>\n </li>\n <li ngIf=\"item.date.dayOfMonth % 8 === 0\">\n <span class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-warning-500 lg:ax-hidden\"></span>\n </li>\n <li ngIf=\"item.date.dayOfMonth % 3 === 0\">\n <span class=\"ax-flex ax-w-1.5 ax-h-1.5 ax-rounded-full ax-bg-success-500 lg:ax-hidden\"></span>\n </li>\n </ol>\n </div>\n </ng-container>\n </div>\n</div>\n<!-- </div> -->\n<div class=\"ax-p-4 lg:ax-hidden\">\n <ol\n class=\"ax-flex ax-flex-col ax-rounded-lg ax-border ax-bg-surface ax-divide-y ax-overflow-hidden ax-cursor-pointer\">\n <li class=\"ax-flex ax-items-start ax-justify-between ax-p-4 hover:ax-bg-neutral-100 mobile-task\">\n <div class=\"ax-flex ax-flex-col ax-gap-2\">\n <p class=\"ax-font-medium\">Daily Meeting at the Office</p>\n <div class=\"ax-flex ax-gap-2 ax-items-center\">\n <ax-icon class=\"fa-solid fa-clock ax-text-neutral-400\"></ax-icon>\n <p class=\"ax-text-sm\">3 PM</p>\n </div>\n </div>\n <ax-button text=\"Edit\" class=\"!ax-bg-surface ax-border ax-sm ax-opacity-0\"></ax-button>\n </li>\n </ol>\n</div>","import { MXBaseComponent } from '@acorex/components/common';\nimport { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';\n\n@Component({\n selector: 'ax-scheduler-week-view',\n templateUrl: './scheduler-week-view.component.html',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXSchedulerWeekViewComponent extends MXBaseComponent {}\n","<div class=\"ax-flex ax-flex-col ax-flex-auto ax-isolate ax-overflow-auto ax-bg-white\">\n <div class=\"ax-flex ax-flex-col ax-max-w-full\">\n <div class=\"ax-shadow-md ax-pr-8 ax-z-30 ax-sticky ax-top-0\">\n <div class=\"ax-grid ax-leading-6 ax-border-r ax-grid-cols-7\">\n <div class=\"ax-w-14 ax-col-end-1\"></div>\n <div\n class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-l ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium ax-border-r\">\n Mon 10\n </div>\n <div class=\"ax-flex ax-items-center ax-justify-center ax-py-3 ax-bg-white ax-font-medium\">\n Mon 10\n </div>\n </div>\n </div>\n <div class=\"ax-flex ax-flex-auto\">\n <div class=\"ax-w-14 ax-z-10 ax-sticky ax-left-0 ax-bg-white ax-shadow\"></div>\n <div class=\"ax-grid ax-flex-auto ax-grid-cols-1 ax-grid-rows-1\">\n <div class=\"ax-grid ax-col-start-1 ax-col-end-2 ax-row-start-1\"\n style=\"grid-template-rows: repeat(45, minmax(3.5rem, 1fr))\">\n <div class=\"ax-row-end-1 ax-h-7\"></div>\n <div class=\"ax-border-t ax-border-b\">\n <div class=\"ax-leading-5 ax-text-right ax-w-14 -ax-mt-[0.625rem] -ax-ml-14 ax-sticky ax-left-0\">\n </div>\n </div>\n </div>\n <div class=\"ax-grid ax-grid-rows-1 ax-grid-cols-7 ax-row-start-1 ax-col-end-2 ax-col-start-1\">\n <div class=\"ax-col-start-1 ax-row-start-1 ax-row-end-[-1]\"></div>\n <div class=\"ax-col-start-2 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-3 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-4 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-5 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-6 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-7 ax-row-start-1 ax-row-end-[-1] ax-border-l\"></div>\n <div class=\"ax-col-start-8 ax-row-start-1 ax-row-end-[-1] ax-border-l ax-w-8\"></div>\n </div>\n <ol class=\"ax-grid ax-pr-8 ax-grid-cols-7 ax-row-start-1 ax-col-end-2 ax-col-start-2\"\n style=\"grid-template-rows: 1.75rem repeat(288, minmax(0px, 1fr)) auto\"></ol>\n </div>\n </div>\n </div>\n</div>","import { MXBaseComponent } from '@acorex/components/common';\nimport { AXDateTime, AXCalendarService } from '@acorex/core/dateTime';\nimport { AXPlatform, AXScreenSizes } from '@acorex/core/platform';\nimport { ChangeDetectionStrategy, Component, ViewEncapsulation, inject } from '@angular/core';\n\n@Component({\n selector: 'ax-scheduler',\n templateUrl: './scheduler.component.html',\n styleUrls: ['./scheduler.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXSchedulerComponent extends MXBaseComponent {\n\n private _calendarService: AXCalendarService = inject(AXCalendarService);\n protected _platform: AXPlatform = inject(AXPlatform);\n protected current: AXDateTime = this._calendarService.now();\n\n protected _size: AXScreenSizes;\n\n handleOnItemClick() { }\n\n ngOnInit(): void {\n super.ngOnInit();\n this.detectSize();\n this._platform.resize.subscribe(() => {\n this.detectSize();\n super.cdr.markForCheck();\n });\n }\n\n private detectSize() {\n this._size = this._platform.screenSize;\n }\n\n _handleNextClick() {\n this.current = this.current.add('month', 1);\n }\n\n _handlePrevClick() {\n this.current = this.current.add('month', -1);\n }\n}\n","<div class=\"ax-flex ax-flex-col ax-h-full\">\n <div class=\"scheduler-header\">\n <p>\n {{ current.format('MMMM yyyy') }}\n </p>\n <div class=\"scheduler-actions\">\n <div class=\"ax-flex ax-border ax-rounded-md ax-items-center ax-px-1 ax-gap-0.5 ax-bg-surface\">\n <button class=\"ax-w-8 ax-h-8 ax-rounded-md hover:ax-bg-neutral-100\" (click)=\"_handlePrevClick()\">\n <ax-icon class=\"fa-solid fa-chevron-left\"> </ax-icon>\n </button>\n <ng-container ngIf=\"_size === 'SM'; else elseTemplate\">\n <span class=\"ax-text-neutral-200\">\|</span>\n </ng-container>\n <ng-template #elseTemplate>\n <ax-button look=\"blank\" class=\"ax-sm\" text=\"Today\"> </ax-button>\n </ng-template>\n <button class=\"ax-w-8 ax-h-8 ax-rounded-md hover:ax-bg-neutral-100\" (click)=\"_handleNextClick()\">\n <ax-icon class=\"fa-solid fa-chevron-right\"> </ax-icon>\n </button>\n </div>\n <ax-button [text]=\"_size === 'SM' ? '' : 'Week View'\" class=\"!ax-bg-surface ax-border\">\n <ax-suffix>\n <ax-icon [class]=\"\n _size === 'SM'\n ? 'fa-solid fa-ellipsis-vertical'\n : 'fa-solid fa-chevron-down ax-text-neutral-400'\n \">\n </ax-icon>\n </ax-suffix>\n <ax-dropdown-panel (onItemClick)=\"handleOnItemClick()\" [adaptivityEnabled]=\"true\">\n <ax-button-item ngIf=\"_size === 'SM' \|\| _size === 'MD'\" text=\"Add Event\" name=\"text\" [divided]=\"true\"\n color=\"primary\">\n </ax-button-item>\n <ax-button-item ngIf=\"_size === 'SM'\" text=\"Go to Today\" name=\"text\" [divided]=\"true\">\n </ax-button-item>\n <ax-button-item text=\"Day View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Week View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Month View\" name=\"text\"> </ax-button-item>\n <ax-button-item text=\"Year View\" name=\"text\"> </ax-button-item>\n </ax-dropdown-panel>\n <ax-suffix>\n <ax-icon icon=\"\"></ax-icon>\n </ax-suffix>\n </ax-button>\n <ax-button color=\"primary\" text=\"Add Event\" class=\"ax-hidden lg:ax-block\">\n <ax-prefix>\n <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n </ax-prefix>\n </ax-button>\n </div>\n </div>\n <ax-scheduler-month-view [date]=\"current\"></ax-scheduler-month-view>\n <!-- <ax-scheduler-week-view></ax-scheduler-week-view> -->\n</div>","import { AXButtonModule } from '@acorex/components/button';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXDropdownModule } from '@acorex/components/dropdown';\nimport { AXDateTimeModule } from '@acorex/core/dateTime';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXSchedulerMonthViewComponent } from './scheduler-month-view.component';\nimport { AXSchedulerWeekViewComponent } from './scheduler-week-view.component';\nimport { AXSchedulerComponent } from './scheduler.component';\n\nconst COMPONENT = [AXSchedulerComponent, AXSchedulerMonthViewComponent, AXSchedulerWeekViewComponent];\nconst MODULES = [CommonModule, AXButtonModule, AXDecoratorModule, AXDropdownModule, AXDateTimeModule];\n\n@NgModule({\n declarations: [...COMPONENT],\n imports: [...MODULES],\n exports: [...COMPONENT],\n providers: [],\n})\nexport class AXSchedulerModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":["i5.AXSchedulerMonthViewComponent"],"mappings":"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"}

package/fesm2022/acorex-components-select-box.mjs CHANGED Viewed

@@ -1,14 +1,14 @@
+import { AXClosbaleComponent, AXSearchableComponent, AXValuableComponent, AXCommonModule } from '@acorex/components/common';
 import * as i1 from '@acorex/core/platform';
 import * as i7 from '@acorex/core/translation';
 import { AXTranslator, AXTranslationModule } from '@acorex/core/translation';
 import * as i0 from '@angular/core';
-import { Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, ContentChild, Input, HostListener, NgModule } from '@angular/core';
+import { Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, ContentChild, Input, HostListener, HostBinding, NgModule } from '@angular/core';
 import { findLast, first, last, findLastIndex, nth } from 'lodash-es';
-import { AXClosbaleComponent, AXSearchableComponent, AXValuableComponent, AXCommonModule } from '@acorex/components/common';
+import { AXBaseSelectionDropdownMixin } from '@acorex/components/mixin';
 import * as i4 from '@acorex/components/popover';
 import { AXPopoverComponent, AXPopoverModule } from '@acorex/components/popover';
 import { AXSearchBoxComponent } from '@acorex/components/search-box';
-import { AXBaseSelectionDropdownMixin } from '@acorex/components/mixin';
 import * as i2 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i3 from '@acorex/components/decorators';
@@ -108,8 +108,7 @@ class AXSelectBoxComponent extends AXBaseSelectionDropdownMixin {
     }
     _checkForLoadData() {
         const list = this.listContainer.nativeElement;
-        if (this.loadedCount < this.totalCount &&
-            list.scrollHeight < list.parentElement.clientHeight * 1.5) {
+        if (this.loadedCount < this.totalCount && list.scrollHeight < list.parentElement.clientHeight * 1.5) {
             this._fetchData();
         }
     }
@@ -242,9 +241,7 @@ class AXSelectBoxComponent extends AXBaseSelectionDropdownMixin {
     _focusItemByNav(sign) {
         const list = this.listContainer.nativeElement;
         const fn = (s) => list.querySelector(s);
-        const itemDiv = fn(`.ax-list-item.ax-state-focus`) ||
-            fn(`.ax-list-item.ax-state-selected`) ||
-            fn(`.ax-list-item`);
+        const itemDiv = fn(`.ax-list-item.ax-state-focus`) || fn(`.ax-list-item.ax-state-selected`) || fn(`.ax-list-item`);
         let next = (sign == 1 ? itemDiv.nextElementSibling : itemDiv.previousElementSibling);
         if (next) {
             this._focusItemElement(next);
@@ -315,12 +312,15 @@ class AXSelectBoxComponent extends AXBaseSelectionDropdownMixin {
     _fetchData() {
         super._fetchData({ searchQuery: this._searchBox?.value });
     }
+    get __hostClass() {
+        return `ax-editor-container ax-drop-down ax-appearance-solid`;
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSelectBoxComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i1.AXPlatform }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.9", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: { isOpen: "isOpen", fitParent: "fitParent", dropdownWidth: "dropdownWidth", position: "position", disabled: "disabled", tabIndex: "tabIndex", allowNull: "allowNull", value: "value", name: "name", checked: "checked", placeholder: "placeholder", maxLength: "maxLength", type: "type", autoComplete: "autoComplete", readonly: "readonly", pageSize: "pageSize", items: "items", valueField: "valueField", textField: "textField", disabledField: "disabledField", disabledCallback: "disabledCallback", multiple: "multiple", selectionMode: "selectionMode", clearButton: "clearButton", checkbox: "checkbox" }, outputs: { onOpened: "onOpened", onClosed: "onClosed", onBlur: "onBlur", onFocus: "onFocus", valueChange: "valueChange", onValueChanged: "onValueChanged" }, host: { listeners: { "keydown": "_handleKeydown($event)" }, classAttribute: "ax-editor-container ax-drop-down" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.9", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: { isOpen: "isOpen", fitParent: "fitParent", dropdownWidth: "dropdownWidth", position: "position", disabled: "disabled", tabIndex: "tabIndex", allowNull: "allowNull", value: "value", name: "name", checked: "checked", placeholder: "placeholder", maxLength: "maxLength", type: "type", autoComplete: "autoComplete", readonly: "readonly", pageSize: "pageSize", items: "items", valueField: "valueField", textField: "textField", disabledField: "disabledField", disabledCallback: "disabledCallback", multiple: "multiple", selectionMode: "selectionMode", clearButton: "clearButton", checkbox: "checkbox" }, outputs: { onOpened: "onOpened", onClosed: "onClosed", onBlur: "onBlur", onFocus: "onFocus", valueChange: "valueChange", onValueChanged: "onValueChanged" }, host: { listeners: { "keydown": "_handleKeydown($event)" }, properties: { "class": "this.__hostClass" } }, providers: [
             { provide: AXClosbaleComponent, useExisting: AXSelectBoxComponent },
             { provide: AXSearchableComponent, useExisting: AXSelectBoxComponent },
             { provide: AXValuableComponent, useExisting: AXSelectBoxComponent },
-        ], queries: [{ propertyName: "_searchBox", first: true, predicate: AXSearchBoxComponent, descendants: true, static: true }, { propertyName: "_contentEmptyTemplate", first: true, predicate: ["emptyTemplate"], descendants: true }], viewQueries: [{ propertyName: "popover", first: true, predicate: AXPopoverComponent, descendants: true, static: true }, { propertyName: "listContainer", first: true, predicate: ["listContainer"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\"> </ng-content>\n<div class=\"ax-dropdown-content\" [class.ax-state-disabled]=\"disabled\" (click)=\"_handleInputClickEvent($event)\">\n  <div class=\"ax-select-box-selection\" [tabindex]=\"tabIndex\" (focus)=\"_emitOnFocusEvent($event)\"\n    (blur)=\"_emitOnBlurEvent($event)\">\n    <ng-container *ngIf=\"selectedItems && selectedItems.length; else showPlaceholder\">\n      <ng-container *ngIf=\"!multiple; then singleSelectedTemplate; else multipleSelectedTemplate\"></ng-container>\n      <ng-template #singleSelectedTemplate>\n        <ng-container *ngFor=\"let item of selectedItems\">\n          <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n        </ng-container>\n      </ng-template>\n      <ng-template #multipleSelectedTemplate>\n        <div class=\"ax-select-box-multi-selection\">\n          <ng-container *ngFor=\"let item of selectedItems\">\n            <div class=\"ax-select-multi-item\">\n              {{ _getItemDisplayTextTemplte(item) }}\n              <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\n            </div>\n          </ng-container>\n        </div>\n      </ng-template>\n    </ng-container>\n    <ng-template #showPlaceholder>\n      <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\n        {{ placeholder }}\n      </div>\n    </ng-template>\n  </div>\n</div>\n<button type=\"button\" class=\"ax-general-button ax-button-icon\" (click)=\"clear()\" [tabIndex]=\"-1\"\n  *ngIf=\"value && clearButton && !(disabled || readonly)\">\n  <span class=\"ax-icon ax-icon-close\"></span>\n</button>\n<button type=\"button\" [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-general-button ax-button-icon\"\n  (click)=\"_handleArrowClickEvent($event)\">\n  <ng-container *ngIf=\"isLoading && !this.popover.isOpen; else iconTemplate\">\n    <ax-loading type=\"spinner\"></ax-loading>\n  </ng-container>\n  <ng-template #iconTemplate>\n    <span class=\"ax-icon ax-icon-chevron-left ax-transition-all\" [ngClass]=\"{\n        '-ax-rotation-90': !isOpen,\n        'ax-rotation-90': isOpen\n      }\"></span>\n  </ng-template>\n</button>\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n<ng-content select=\"ax-suffix\"> </ng-content>\n<ax-popover [target]=\"_target\" [placement]=\"position\" [openOn]=\"'manual'\" [closeOn]=\"'clickout'\"\n  [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\">\n  <div class=\"ax-overlay-pane\" (keydown)=\"_handlePopoverKeydown($event)\" tabindex=\"0\" aria-modal=\"true\" cdkTrapFocus\n    [class.ax-overlay-actionsheet]=\"_isActionSheet\" [class.ax-full]=\"_searchBox || isLazy\"\n    [style.min-width.px]=\"_popoverWidth\">\n    <div class=\"ax-list\">\n      <ax-header *ngIf=\"_isActionSheet\">\n        <ax-title>{{ _popoverTitle }}</ax-title>\n        <ax-close-button class=\"ax-icon\"\n          [icon]=\"multiple ? 'ax-icon-done !ax-text-primary-500' : 'ax-icon-close'\"></ax-close-button>\n      </ax-header>\n      <div class=\"ax-search-box-container\" [class.ax-state-hidden]=\"!_searchBox\" [cdkTrapFocus]=\"_searchBox != null\">\n        <ng-content select=\"ax-search-box\"></ng-content>\n      </div>\n      <div class=\"ax-content ax-list-items-container ax-default\" (scroll)=\"_handleListScroll($event)\" #listContainer>\n        <ng-container *ngIf=\"displayItems.length; else tmpEmpty\">\n          <ul>\n            <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: displayItems }\"> </ng-container>\n            <ng-template #tmpTree let-list=\"list\">\n              <ng-container *ngFor=\"let item of list; let i = index; trackBy: _trackByFunction\">\n                <ng-container *ngIf=\"itemTemplate; else defualtTemplate\">\n                  <li class=\"ax-list-item\" (click)=\"_handleOnItemClick($event, item)\"\n                    [attr.data-id]=\"item[this.valueField]\">\n                    <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, direction: direction }\">\n                    </ng-container>\n                  </li>\n                </ng-container>\n                <ng-template #defualtTemplate>\n                  <ng-container *ngIf=\"item.children?.length > 0; else tmpItem\">\n                    <li class=\"ax-list-item-group\" [attr.data-id]=\"item[this.valueField]\">\n                      <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n                      <ul *ngIf=\"item.children?.length > 0\">\n                        <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: item.children }\"> </ng-container>\n                      </ul>\n                    </li>\n                  </ng-container>\n                  <ng-template #tmpItem>\n                    <ng-container *ngIf=\"!multiple; else multipleTemplate\">\n                      <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n                        (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"item[this.valueField]\">\n                        <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n                        <span class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item)\"></span>\n                      </li>\n                    </ng-container>\n                    <ng-template #multipleTemplate>\n                      <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [class.ax-state-checkbox]=\"checkbox\"\n                        [attr.tabindex]=\"i\" (click)=\"_handleOnItemClick($event, item)\"\n                        [attr.data-id]=\"item[this.valueField]\">\n                        <span>\n                          <input class=\"ax-checkbox\" type=\"checkbox\" [class.ax-state-disabled]=\"isItemDisabled(item)\"\n                            *ngIf=\"checkbox\" [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\" />\n                          <span class=\"ax-checkbox-label\">{{ _getItemDisplayTextTemplte(item) }}</span>\n                        </span>\n                        <span class=\"ax-icon ax-icon-done ax-selected-icon\"\n                          *ngIf=\"isItemSelected(item) && !checkbox\"></span>\n                      </li>\n                    </ng-template>\n                  </ng-template>\n                </ng-template>\n              </ng-container>\n            </ng-template>\n          </ul>\n        </ng-container>\n        <ng-container *ngIf=\"isLoading\">\n          <ng-container *ngIf=\"loadingTemplate; else elseLoadingTemplate\">\n            <ng-container *ngTemplateOutlet=\"loadingTemplate\"> </ng-container>\n          </ng-container>\n          <ng-template #elseLoadingTemplate>\n            <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\n              <ax-loading [context]=\"_loadingOptions\"></ax-loading>\n            </div>\n          </ng-template>\n        </ng-container>\n        <ng-template #tmpEmpty>\n          <ng-container *ngIf=\"!isLoading\">\n            <ng-container *ngIf=\"emptyTemplate; else elseEmptyTemplate\">\n              <ng-container *ngTemplateOutlet=\"emptyTemplate\"> </ng-container>\n            </ng-container>\n            <ng-template #elseEmptyTemplate>\n              <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\" [innerHTML]=\"\n                  'common.no-result-for'\n                    | trans\n                      : {\n                          exp: this._searchBox ? this._searchBox.value : ''\n                        }\n                \"></div>\n            </ng-template>\n          </ng-container>\n        </ng-template>\n      </div>\n      <!-- <div class=\"ax-list-items-container ax-vertical ax-default\" [class.ax-full]=\"_isMobile\"\n                >\n               \n            </div> -->\n      <!-- <div class=\"ax-footer\">footer</div> -->\n    </div>\n  </div>\n</ax-popover>", styles: ["ax-select-box .ax-select-multi-item{display:flex;align-items:center;padding:.25rem .5rem;background-color:rgba(var(--ax-color-default));color:rgba(var(--ax-color-default-fore));border-radius:var(--ax-rounded-border-default);margin-inline-end:.5rem}ax-select-box .ax-select-multi-item .ax-icon-close{cursor:pointer;margin-inline-start:.5rem}ax-select-box .ax-select-box-selection{display:flex;justify-content:center;align-items:center;outline-color:transparent;outline:transparent;-webkit-user-select:none;user-select:none}ax-select-box .ax-select-box-selection>span{padding-inline-start:1rem;padding-inline-end:.75rem;white-space:nowrap}ax-select-box .ax-select-box-selection .ax-selectbox-input{opacity:0;width:0}ax-select-box .ax-select-box-multi-selection{padding:0 .5rem;display:flex;justify-content:center;align-items:center}ax-select-box .ax-placeholder{padding-inline-start:1rem;padding-inline-end:.75rem}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title" }, { kind: "component", type: i4.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i5.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "directive", type: i6.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "pipe", type: i7.AXTranslatorPipe, name: "trans" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], queries: [{ propertyName: "_searchBox", first: true, predicate: AXSearchBoxComponent, descendants: true, static: true }, { propertyName: "_contentEmptyTemplate", first: true, predicate: ["emptyTemplate"], descendants: true }], viewQueries: [{ propertyName: "popover", first: true, predicate: AXPopoverComponent, descendants: true, static: true }, { propertyName: "listContainer", first: true, predicate: ["listContainer"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\"> </ng-content>\n<div class=\"ax-dropdown-content\" [class.ax-state-disabled]=\"disabled\" (click)=\"_handleInputClickEvent($event)\">\n  <div class=\"ax-select-box-selection\" [tabindex]=\"tabIndex\" (focus)=\"_emitOnFocusEvent($event)\"\n    (blur)=\"_emitOnBlurEvent($event)\">\n    <ng-container *ngIf=\"selectedItems && selectedItems.length; else showPlaceholder\">\n      <ng-container *ngIf=\"!multiple; then singleSelectedTemplate; else multipleSelectedTemplate\"></ng-container>\n      <ng-template #singleSelectedTemplate>\n        <ng-container *ngFor=\"let item of selectedItems\">\n          <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n        </ng-container>\n      </ng-template>\n      <ng-template #multipleSelectedTemplate>\n        <div class=\"ax-select-box-multi-selection\">\n          <ng-container *ngFor=\"let item of selectedItems\">\n            <div class=\"ax-select-multi-item\">\n              {{ _getItemDisplayTextTemplte(item) }}\n              <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\n            </div>\n          </ng-container>\n        </div>\n      </ng-template>\n    </ng-container>\n    <ng-template #showPlaceholder>\n      <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\n        {{ placeholder }}\n      </div>\n    </ng-template>\n  </div>\n</div>\n<button type=\"button\" class=\"ax-general-button ax-button-icon\" (click)=\"clear()\" [tabIndex]=\"-1\"\n  *ngIf=\"value && clearButton && !(disabled || readonly)\">\n  <span class=\"ax-icon ax-icon-close\"></span>\n</button>\n<button type=\"button\" [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-general-button ax-button-icon\"\n  (click)=\"_handleArrowClickEvent($event)\">\n  <ng-container *ngIf=\"isLoading && !this.popover.isOpen; else iconTemplate\">\n    <ax-loading type=\"spinner\"></ax-loading>\n  </ng-container>\n  <ng-template #iconTemplate>\n    <span class=\"ax-icon ax-icon-chevron-left ax-transition-all\" [ngClass]=\"{\n        '-ax-rotation-90': !isOpen,\n        'ax-rotation-90': isOpen\n      }\"></span>\n  </ng-template>\n</button>\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n<ng-content select=\"ax-suffix\"> </ng-content>\n<ax-popover [target]=\"_target\" [placement]=\"position\" [openOn]=\"'manual'\" [closeOn]=\"'clickout'\"\n  [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\">\n  <div class=\"ax-overlay-pane\" (keydown)=\"_handlePopoverKeydown($event)\" tabindex=\"0\" aria-modal=\"true\" cdkTrapFocus\n    [class.ax-overlay-actionsheet]=\"_isActionSheet\" [class.ax-full]=\"_searchBox || isLazy\"\n    [style.min-width.px]=\"_popoverWidth\">\n    <div class=\"ax-list\">\n      <ax-header *ngIf=\"_isActionSheet\">\n        <ax-title>{{ _popoverTitle }}</ax-title>\n        <ax-close-button class=\"ax-icon\"\n          [icon]=\"multiple ? 'ax-icon-done !ax-text-primary-500' : 'ax-icon-close'\"></ax-close-button>\n      </ax-header>\n      <div class=\"ax-search-box-container\" [class.ax-state-hidden]=\"!_searchBox\" [cdkTrapFocus]=\"_searchBox != null\">\n        <ng-content select=\"ax-search-box\"></ng-content>\n      </div>\n      <div class=\"ax-content ax-list-items-container ax-default\" (scroll)=\"_handleListScroll($event)\" #listContainer>\n        <ng-container *ngIf=\"displayItems.length; else tmpEmpty\">\n          <ul>\n            <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: displayItems }\"> </ng-container>\n            <ng-template #tmpTree let-list=\"list\">\n              <ng-container *ngFor=\"let item of list; let i = index; trackBy: _trackByFunction\">\n                <ng-container *ngIf=\"itemTemplate; else defualtTemplate\">\n                  <li class=\"ax-list-item\" (click)=\"_handleOnItemClick($event, item)\"\n                    [attr.data-id]=\"item[this.valueField]\">\n                    <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, direction: direction }\">\n                    </ng-container>\n                  </li>\n                </ng-container>\n                <ng-template #defualtTemplate>\n                  <ng-container *ngIf=\"item.children?.length > 0; else tmpItem\">\n                    <li class=\"ax-list-item-group\" [attr.data-id]=\"item[this.valueField]\">\n                      <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n                      <ul *ngIf=\"item.children?.length > 0\">\n                        <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: item.children }\"> </ng-container>\n                      </ul>\n                    </li>\n                  </ng-container>\n                  <ng-template #tmpItem>\n                    <ng-container *ngIf=\"!multiple; else multipleTemplate\">\n                      <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n                        (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"item[this.valueField]\">\n                        <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n                        <span class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item)\"></span>\n                      </li>\n                    </ng-container>\n                    <ng-template #multipleTemplate>\n                      <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [class.ax-state-checkbox]=\"checkbox\"\n                        [attr.tabindex]=\"i\" (click)=\"_handleOnItemClick($event, item)\"\n                        [attr.data-id]=\"item[this.valueField]\">\n                        <span>\n                          <input class=\"ax-checkbox\" type=\"checkbox\" [class.ax-state-disabled]=\"isItemDisabled(item)\"\n                            *ngIf=\"checkbox\" [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\" />\n                          <span class=\"ax-checkbox-label\">{{ _getItemDisplayTextTemplte(item) }}</span>\n                        </span>\n                        <span class=\"ax-icon ax-icon-done ax-selected-icon\"\n                          *ngIf=\"isItemSelected(item) && !checkbox\"></span>\n                      </li>\n                    </ng-template>\n                  </ng-template>\n                </ng-template>\n              </ng-container>\n            </ng-template>\n          </ul>\n        </ng-container>\n        <ng-container *ngIf=\"isLoading\">\n          <ng-container *ngIf=\"loadingTemplate; else elseLoadingTemplate\">\n            <ng-container *ngTemplateOutlet=\"loadingTemplate\"> </ng-container>\n          </ng-container>\n          <ng-template #elseLoadingTemplate>\n            <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\n              <ax-loading [context]=\"_loadingOptions\"></ax-loading>\n            </div>\n          </ng-template>\n        </ng-container>\n        <ng-template #tmpEmpty>\n          <ng-container *ngIf=\"!isLoading\">\n            <ng-container *ngIf=\"emptyTemplate; else elseEmptyTemplate\">\n              <ng-container *ngTemplateOutlet=\"emptyTemplate\"> </ng-container>\n            </ng-container>\n            <ng-template #elseEmptyTemplate>\n              <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\" [innerHTML]=\"\n                  'common.no-result-for'\n                    | trans\n                      : {\n                          exp: this._searchBox ? this._searchBox.value : ''\n                        }\n                \"></div>\n            </ng-template>\n          </ng-container>\n        </ng-template>\n      </div>\n      <!-- <div class=\"ax-list-items-container ax-vertical ax-default\" [class.ax-full]=\"_isMobile\"\n                >\n               \n            </div> -->\n      <!-- <div class=\"ax-footer\">footer</div> -->\n    </div>\n  </div>\n</ax-popover>", styles: ["ax-select-box .ax-select-multi-item{display:flex;align-items:center;padding:.25rem .5rem;background-color:rgba(var(--ax-color-default));color:rgba(var(--ax-color-default-fore));border-radius:var(--ax-rounded-border-default);margin-inline-end:.5rem}ax-select-box .ax-select-multi-item .ax-icon-close{cursor:pointer;margin-inline-start:.5rem}ax-select-box .ax-select-box-selection{display:flex;justify-content:center;align-items:center;outline-color:transparent;outline:transparent;-webkit-user-select:none;user-select:none}ax-select-box .ax-select-box-selection>span{padding-inline-start:1rem;padding-inline-end:.75rem;white-space:nowrap}ax-select-box .ax-select-box-selection .ax-selectbox-input{opacity:0;width:0}ax-select-box .ax-select-box-multi-selection{padding:0 .5rem;display:flex;justify-content:center;align-items:center}ax-select-box .ax-placeholder{padding-inline-start:1rem;padding-inline-end:.75rem}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title" }, { kind: "component", type: i4.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i5.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "directive", type: i6.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "pipe", type: i7.AXTranslatorPipe, name: "trans" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.9", ngImport: i0, type: AXSelectBoxComponent, decorators: [{
             type: Component,
@@ -352,7 +352,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.9", ngImpor
                         { provide: AXClosbaleComponent, useExisting: AXSelectBoxComponent },
                         { provide: AXSearchableComponent, useExisting: AXSelectBoxComponent },
                         { provide: AXValuableComponent, useExisting: AXSelectBoxComponent },
-                    ], host: { class: 'ax-editor-container ax-drop-down' }, template: "<ng-content select=\"ax-prefix\"> </ng-content>\n<div class=\"ax-dropdown-content\" [class.ax-state-disabled]=\"disabled\" (click)=\"_handleInputClickEvent($event)\">\n  <div class=\"ax-select-box-selection\" [tabindex]=\"tabIndex\" (focus)=\"_emitOnFocusEvent($event)\"\n    (blur)=\"_emitOnBlurEvent($event)\">\n    <ng-container *ngIf=\"selectedItems && selectedItems.length; else showPlaceholder\">\n      <ng-container *ngIf=\"!multiple; then singleSelectedTemplate; else multipleSelectedTemplate\"></ng-container>\n      <ng-template #singleSelectedTemplate>\n        <ng-container *ngFor=\"let item of selectedItems\">\n          <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n        </ng-container>\n      </ng-template>\n      <ng-template #multipleSelectedTemplate>\n        <div class=\"ax-select-box-multi-selection\">\n          <ng-container *ngFor=\"let item of selectedItems\">\n            <div class=\"ax-select-multi-item\">\n              {{ _getItemDisplayTextTemplte(item) }}\n              <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\n            </div>\n          </ng-container>\n        </div>\n      </ng-template>\n    </ng-container>\n    <ng-template #showPlaceholder>\n      <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\n        {{ placeholder }}\n      </div>\n    </ng-template>\n  </div>\n</div>\n<button type=\"button\" class=\"ax-general-button ax-button-icon\" (click)=\"clear()\" [tabIndex]=\"-1\"\n  *ngIf=\"value && clearButton && !(disabled || readonly)\">\n  <span class=\"ax-icon ax-icon-close\"></span>\n</button>\n<button type=\"button\" [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-general-button ax-button-icon\"\n  (click)=\"_handleArrowClickEvent($event)\">\n  <ng-container *ngIf=\"isLoading && !this.popover.isOpen; else iconTemplate\">\n    <ax-loading type=\"spinner\"></ax-loading>\n  </ng-container>\n  <ng-template #iconTemplate>\n    <span class=\"ax-icon ax-icon-chevron-left ax-transition-all\" [ngClass]=\"{\n        '-ax-rotation-90': !isOpen,\n        'ax-rotation-90': isOpen\n      }\"></span>\n  </ng-template>\n</button>\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n<ng-content select=\"ax-suffix\"> </ng-content>\n<ax-popover [target]=\"_target\" [placement]=\"position\" [openOn]=\"'manual'\" [closeOn]=\"'clickout'\"\n  [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\">\n  <div class=\"ax-overlay-pane\" (keydown)=\"_handlePopoverKeydown($event)\" tabindex=\"0\" aria-modal=\"true\" cdkTrapFocus\n    [class.ax-overlay-actionsheet]=\"_isActionSheet\" [class.ax-full]=\"_searchBox || isLazy\"\n    [style.min-width.px]=\"_popoverWidth\">\n    <div class=\"ax-list\">\n      <ax-header *ngIf=\"_isActionSheet\">\n        <ax-title>{{ _popoverTitle }}</ax-title>\n        <ax-close-button class=\"ax-icon\"\n          [icon]=\"multiple ? 'ax-icon-done !ax-text-primary-500' : 'ax-icon-close'\"></ax-close-button>\n      </ax-header>\n      <div class=\"ax-search-box-container\" [class.ax-state-hidden]=\"!_searchBox\" [cdkTrapFocus]=\"_searchBox != null\">\n        <ng-content select=\"ax-search-box\"></ng-content>\n      </div>\n      <div class=\"ax-content ax-list-items-container ax-default\" (scroll)=\"_handleListScroll($event)\" #listContainer>\n        <ng-container *ngIf=\"displayItems.length; else tmpEmpty\">\n          <ul>\n            <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: displayItems }\"> </ng-container>\n            <ng-template #tmpTree let-list=\"list\">\n              <ng-container *ngFor=\"let item of list; let i = index; trackBy: _trackByFunction\">\n                <ng-container *ngIf=\"itemTemplate; else defualtTemplate\">\n                  <li class=\"ax-list-item\" (click)=\"_handleOnItemClick($event, item)\"\n                    [attr.data-id]=\"item[this.valueField]\">\n                    <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, direction: direction }\">\n                    </ng-container>\n                  </li>\n                </ng-container>\n                <ng-template #defualtTemplate>\n                  <ng-container *ngIf=\"item.children?.length > 0; else tmpItem\">\n                    <li class=\"ax-list-item-group\" [attr.data-id]=\"item[this.valueField]\">\n                      <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n                      <ul *ngIf=\"item.children?.length > 0\">\n                        <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: item.children }\"> </ng-container>\n                      </ul>\n                    </li>\n                  </ng-container>\n                  <ng-template #tmpItem>\n                    <ng-container *ngIf=\"!multiple; else multipleTemplate\">\n                      <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n                        (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"item[this.valueField]\">\n                        <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n                        <span class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item)\"></span>\n                      </li>\n                    </ng-container>\n                    <ng-template #multipleTemplate>\n                      <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [class.ax-state-checkbox]=\"checkbox\"\n                        [attr.tabindex]=\"i\" (click)=\"_handleOnItemClick($event, item)\"\n                        [attr.data-id]=\"item[this.valueField]\">\n                        <span>\n                          <input class=\"ax-checkbox\" type=\"checkbox\" [class.ax-state-disabled]=\"isItemDisabled(item)\"\n                            *ngIf=\"checkbox\" [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\" />\n                          <span class=\"ax-checkbox-label\">{{ _getItemDisplayTextTemplte(item) }}</span>\n                        </span>\n                        <span class=\"ax-icon ax-icon-done ax-selected-icon\"\n                          *ngIf=\"isItemSelected(item) && !checkbox\"></span>\n                      </li>\n                    </ng-template>\n                  </ng-template>\n                </ng-template>\n              </ng-container>\n            </ng-template>\n          </ul>\n        </ng-container>\n        <ng-container *ngIf=\"isLoading\">\n          <ng-container *ngIf=\"loadingTemplate; else elseLoadingTemplate\">\n            <ng-container *ngTemplateOutlet=\"loadingTemplate\"> </ng-container>\n          </ng-container>\n          <ng-template #elseLoadingTemplate>\n            <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\n              <ax-loading [context]=\"_loadingOptions\"></ax-loading>\n            </div>\n          </ng-template>\n        </ng-container>\n        <ng-template #tmpEmpty>\n          <ng-container *ngIf=\"!isLoading\">\n            <ng-container *ngIf=\"emptyTemplate; else elseEmptyTemplate\">\n              <ng-container *ngTemplateOutlet=\"emptyTemplate\"> </ng-container>\n            </ng-container>\n            <ng-template #elseEmptyTemplate>\n              <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\" [innerHTML]=\"\n                  'common.no-result-for'\n                    | trans\n                      : {\n                          exp: this._searchBox ? this._searchBox.value : ''\n                        }\n                \"></div>\n            </ng-template>\n          </ng-container>\n        </ng-template>\n      </div>\n      <!-- <div class=\"ax-list-items-container ax-vertical ax-default\" [class.ax-full]=\"_isMobile\"\n                >\n               \n            </div> -->\n      <!-- <div class=\"ax-footer\">footer</div> -->\n    </div>\n  </div>\n</ax-popover>", styles: ["ax-select-box .ax-select-multi-item{display:flex;align-items:center;padding:.25rem .5rem;background-color:rgba(var(--ax-color-default));color:rgba(var(--ax-color-default-fore));border-radius:var(--ax-rounded-border-default);margin-inline-end:.5rem}ax-select-box .ax-select-multi-item .ax-icon-close{cursor:pointer;margin-inline-start:.5rem}ax-select-box .ax-select-box-selection{display:flex;justify-content:center;align-items:center;outline-color:transparent;outline:transparent;-webkit-user-select:none;user-select:none}ax-select-box .ax-select-box-selection>span{padding-inline-start:1rem;padding-inline-end:.75rem;white-space:nowrap}ax-select-box .ax-select-box-selection .ax-selectbox-input{opacity:0;width:0}ax-select-box .ax-select-box-multi-selection{padding:0 .5rem;display:flex;justify-content:center;align-items:center}ax-select-box .ax-placeholder{padding-inline-start:1rem;padding-inline-end:.75rem}\n"] }]
+                    ], template: "<ng-content select=\"ax-prefix\"> </ng-content>\n<div class=\"ax-dropdown-content\" [class.ax-state-disabled]=\"disabled\" (click)=\"_handleInputClickEvent($event)\">\n  <div class=\"ax-select-box-selection\" [tabindex]=\"tabIndex\" (focus)=\"_emitOnFocusEvent($event)\"\n    (blur)=\"_emitOnBlurEvent($event)\">\n    <ng-container *ngIf=\"selectedItems && selectedItems.length; else showPlaceholder\">\n      <ng-container *ngIf=\"!multiple; then singleSelectedTemplate; else multipleSelectedTemplate\"></ng-container>\n      <ng-template #singleSelectedTemplate>\n        <ng-container *ngFor=\"let item of selectedItems\">\n          <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n        </ng-container>\n      </ng-template>\n      <ng-template #multipleSelectedTemplate>\n        <div class=\"ax-select-box-multi-selection\">\n          <ng-container *ngFor=\"let item of selectedItems\">\n            <div class=\"ax-select-multi-item\">\n              {{ _getItemDisplayTextTemplte(item) }}\n              <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\n            </div>\n          </ng-container>\n        </div>\n      </ng-template>\n    </ng-container>\n    <ng-template #showPlaceholder>\n      <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\n        {{ placeholder }}\n      </div>\n    </ng-template>\n  </div>\n</div>\n<button type=\"button\" class=\"ax-general-button ax-button-icon\" (click)=\"clear()\" [tabIndex]=\"-1\"\n  *ngIf=\"value && clearButton && !(disabled || readonly)\">\n  <span class=\"ax-icon ax-icon-close\"></span>\n</button>\n<button type=\"button\" [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-general-button ax-button-icon\"\n  (click)=\"_handleArrowClickEvent($event)\">\n  <ng-container *ngIf=\"isLoading && !this.popover.isOpen; else iconTemplate\">\n    <ax-loading type=\"spinner\"></ax-loading>\n  </ng-container>\n  <ng-template #iconTemplate>\n    <span class=\"ax-icon ax-icon-chevron-left ax-transition-all\" [ngClass]=\"{\n        '-ax-rotation-90': !isOpen,\n        'ax-rotation-90': isOpen\n      }\"></span>\n  </ng-template>\n</button>\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n<ng-content select=\"ax-suffix\"> </ng-content>\n<ax-popover [target]=\"_target\" [placement]=\"position\" [openOn]=\"'manual'\" [closeOn]=\"'clickout'\"\n  [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\">\n  <div class=\"ax-overlay-pane\" (keydown)=\"_handlePopoverKeydown($event)\" tabindex=\"0\" aria-modal=\"true\" cdkTrapFocus\n    [class.ax-overlay-actionsheet]=\"_isActionSheet\" [class.ax-full]=\"_searchBox || isLazy\"\n    [style.min-width.px]=\"_popoverWidth\">\n    <div class=\"ax-list\">\n      <ax-header *ngIf=\"_isActionSheet\">\n        <ax-title>{{ _popoverTitle }}</ax-title>\n        <ax-close-button class=\"ax-icon\"\n          [icon]=\"multiple ? 'ax-icon-done !ax-text-primary-500' : 'ax-icon-close'\"></ax-close-button>\n      </ax-header>\n      <div class=\"ax-search-box-container\" [class.ax-state-hidden]=\"!_searchBox\" [cdkTrapFocus]=\"_searchBox != null\">\n        <ng-content select=\"ax-search-box\"></ng-content>\n      </div>\n      <div class=\"ax-content ax-list-items-container ax-default\" (scroll)=\"_handleListScroll($event)\" #listContainer>\n        <ng-container *ngIf=\"displayItems.length; else tmpEmpty\">\n          <ul>\n            <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: displayItems }\"> </ng-container>\n            <ng-template #tmpTree let-list=\"list\">\n              <ng-container *ngFor=\"let item of list; let i = index; trackBy: _trackByFunction\">\n                <ng-container *ngIf=\"itemTemplate; else defualtTemplate\">\n                  <li class=\"ax-list-item\" (click)=\"_handleOnItemClick($event, item)\"\n                    [attr.data-id]=\"item[this.valueField]\">\n                    <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, direction: direction }\">\n                    </ng-container>\n                  </li>\n                </ng-container>\n                <ng-template #defualtTemplate>\n                  <ng-container *ngIf=\"item.children?.length > 0; else tmpItem\">\n                    <li class=\"ax-list-item-group\" [attr.data-id]=\"item[this.valueField]\">\n                      <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n                      <ul *ngIf=\"item.children?.length > 0\">\n                        <ng-container *ngTemplateOutlet=\"tmpTree; context: { list: item.children }\"> </ng-container>\n                      </ul>\n                    </li>\n                  </ng-container>\n                  <ng-template #tmpItem>\n                    <ng-container *ngIf=\"!multiple; else multipleTemplate\">\n                      <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n                        (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"item[this.valueField]\">\n                        <span> {{ _getItemDisplayTextTemplte(item) }}</span>\n                        <span class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item)\"></span>\n                      </li>\n                    </ng-container>\n                    <ng-template #multipleTemplate>\n                      <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [class.ax-state-checkbox]=\"checkbox\"\n                        [attr.tabindex]=\"i\" (click)=\"_handleOnItemClick($event, item)\"\n                        [attr.data-id]=\"item[this.valueField]\">\n                        <span>\n                          <input class=\"ax-checkbox\" type=\"checkbox\" [class.ax-state-disabled]=\"isItemDisabled(item)\"\n                            *ngIf=\"checkbox\" [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\" />\n                          <span class=\"ax-checkbox-label\">{{ _getItemDisplayTextTemplte(item) }}</span>\n                        </span>\n                        <span class=\"ax-icon ax-icon-done ax-selected-icon\"\n                          *ngIf=\"isItemSelected(item) && !checkbox\"></span>\n                      </li>\n                    </ng-template>\n                  </ng-template>\n                </ng-template>\n              </ng-container>\n            </ng-template>\n          </ul>\n        </ng-container>\n        <ng-container *ngIf=\"isLoading\">\n          <ng-container *ngIf=\"loadingTemplate; else elseLoadingTemplate\">\n            <ng-container *ngTemplateOutlet=\"loadingTemplate\"> </ng-container>\n          </ng-container>\n          <ng-template #elseLoadingTemplate>\n            <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\n              <ax-loading [context]=\"_loadingOptions\"></ax-loading>\n            </div>\n          </ng-template>\n        </ng-container>\n        <ng-template #tmpEmpty>\n          <ng-container *ngIf=\"!isLoading\">\n            <ng-container *ngIf=\"emptyTemplate; else elseEmptyTemplate\">\n              <ng-container *ngTemplateOutlet=\"emptyTemplate\"> </ng-container>\n            </ng-container>\n            <ng-template #elseEmptyTemplate>\n              <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\" [innerHTML]=\"\n                  'common.no-result-for'\n                    | trans\n                      : {\n                          exp: this._searchBox ? this._searchBox.value : ''\n                        }\n                \"></div>\n            </ng-template>\n          </ng-container>\n        </ng-template>\n      </div>\n      <!-- <div class=\"ax-list-items-container ax-vertical ax-default\" [class.ax-full]=\"_isMobile\"\n                >\n               \n            </div> -->\n      <!-- <div class=\"ax-footer\">footer</div> -->\n    </div>\n  </div>\n</ax-popover>", styles: ["ax-select-box .ax-select-multi-item{display:flex;align-items:center;padding:.25rem .5rem;background-color:rgba(var(--ax-color-default));color:rgba(var(--ax-color-default-fore));border-radius:var(--ax-rounded-border-default);margin-inline-end:.5rem}ax-select-box .ax-select-multi-item .ax-icon-close{cursor:pointer;margin-inline-start:.5rem}ax-select-box .ax-select-box-selection{display:flex;justify-content:center;align-items:center;outline-color:transparent;outline:transparent;-webkit-user-select:none;user-select:none}ax-select-box .ax-select-box-selection>span{padding-inline-start:1rem;padding-inline-end:.75rem;white-space:nowrap}ax-select-box .ax-select-box-selection .ax-selectbox-input{opacity:0;width:0}ax-select-box .ax-select-box-multi-selection{padding:0 .5rem;display:flex;justify-content:center;align-items:center}ax-select-box .ax-placeholder{padding-inline-start:1rem;padding-inline-end:.75rem}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i1.AXPlatform }]; }, propDecorators: { popover: [{
                 type: ViewChild,
                 args: [AXPopoverComponent, { static: true }]
@@ -372,6 +372,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.9", ngImpor
             }], _handleKeydown: [{
                 type: HostListener,
                 args: ['keydown', ['$event']]
+            }], __hostClass: [{
+                type: HostBinding,
+                args: ['class']
             }] } });
 class AXSelectBoxModule {