@acorex/components 7.0.8 → 7.0.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/action-sheet/public-api.d.ts +1 -1
- package/action-sheet/src/action-sheet.component.d.ts +19 -13
- package/action-sheet/src/action-sheet.interface.d.ts +20 -0
- package/action-sheet/src/action-sheet.module.d.ts +8 -4
- package/action-sheet/src/action-sheet.service.d.ts +13 -0
- package/alert/src/alert.component.d.ts +2 -2
- package/badge/src/badge.component.d.ts +2 -2
- package/breadcrumbs/src/breadcrumbs-item.component.d.ts +6 -6
- package/button/src/button-group.component.d.ts +6 -6
- package/button/src/button-item.component.d.ts +6 -6
- package/color-picker/src/color-picker.component.d.ts +16 -16
- package/common/public-api.d.ts +12 -12
- package/common/src/{components.class.d.ts → classes/components.class.d.ts} +21 -1
- package/common/src/{drawing.class.d.ts → classes/drawing.class.d.ts} +0 -0
- package/common/src/{events.class.d.ts → classes/events.class.d.ts} +0 -0
- package/common/src/{styles.class.d.ts → classes/styles.class.d.ts} +0 -0
- package/common/src/common.module.d.ts +5 -5
- package/common/src/{auto-focus.directive.d.ts → directives/auto-focus.directive.d.ts} +1 -1
- package/common/src/{debounce-time.directive.d.ts → directives/debounce-time.directive.d.ts} +0 -0
- package/common/src/{hotkey.directive.d.ts → directives/hotkey.directive.d.ts} +2 -2
- package/common/src/{infinite-scroll.directive.d.ts → directives/infinite-scroll.directive.d.ts} +0 -0
- package/common/src/{responsive.directive.d.ts → directives/responsive.directive.d.ts} +0 -0
- package/common/src/{custom-cdk-overlay.service.d.ts → services/custom-cdk-overlay.service.d.ts} +0 -0
- package/common/src/{hotkey.service.d.ts → services/hotkey.service.d.ts} +0 -0
- package/common/src/{overlay.service.d.ts → services/overlay.service.d.ts} +4 -3
- package/context-menu/src/context-menu.component.d.ts +1 -1
- package/date-picker/src/datepicker.component.d.ts +14 -14
- package/dialog/src/dialog.class.d.ts +2 -1
- package/esm2020/action-sheet/public-api.mjs +2 -2
- package/esm2020/action-sheet/src/action-sheet.component.mjs +49 -74
- package/esm2020/action-sheet/src/action-sheet.interface.mjs +3 -0
- package/esm2020/action-sheet/src/action-sheet.module.mjs +12 -7
- package/esm2020/action-sheet/src/action-sheet.service.mjs +85 -0
- package/esm2020/button/src/button.component.mjs +2 -2
- package/esm2020/collapse/src/collapse.component.mjs +3 -3
- package/esm2020/common/public-api.mjs +13 -13
- package/esm2020/common/src/classes/components.class.mjs +71 -0
- package/esm2020/common/src/classes/drawing.class.mjs +2 -0
- package/esm2020/common/src/classes/events.class.mjs +58 -0
- package/esm2020/common/src/classes/styles.class.mjs +22 -0
- package/esm2020/common/src/common.module.mjs +6 -6
- package/esm2020/common/src/directives/auto-focus.directive.mjs +55 -0
- package/esm2020/common/src/directives/debounce-time.directive.mjs +47 -0
- package/esm2020/common/src/directives/hotkey.directive.mjs +79 -0
- package/esm2020/common/src/directives/infinite-scroll.directive.mjs +63 -0
- package/esm2020/common/src/directives/responsive.directive.mjs +34 -0
- package/esm2020/common/src/services/custom-cdk-overlay.service.mjs +48 -0
- package/esm2020/common/src/services/hotkey.service.mjs +38 -0
- package/esm2020/common/src/services/overlay.service.mjs +96 -0
- package/esm2020/context-menu/src/context-menu.component.mjs +4 -4
- package/esm2020/data-pager/src/data-pager-numeric-selector.component.mjs +3 -3
- package/esm2020/decorators/src/close-button.component.mjs +4 -4
- package/esm2020/dialog/src/dialog.class.mjs +1 -1
- package/esm2020/dialog/src/dialog.component.mjs +3 -3
- package/esm2020/dialog/src/dialog.service.mjs +2 -1
- package/esm2020/menu/src/menu.component.mjs +16 -16
- package/esm2020/mixin/src/base-menu-mixin.class.mjs +3 -3
- package/esm2020/notification/acorex-components-notification.mjs +5 -0
- package/esm2020/notification/public-api.mjs +5 -0
- package/esm2020/notification/src/notification.class.mjs +2 -0
- package/esm2020/notification/src/notification.component.mjs +63 -0
- package/esm2020/notification/src/notification.module.mjs +21 -0
- package/esm2020/notification/src/notification.service.mjs +136 -0
- package/esm2020/number-box/src/number-box.component.mjs +3 -3
- package/esm2020/page/src/base-page.class.mjs +1 -27
- package/esm2020/popup/src/popup.component.mjs +4 -5
- package/esm2020/popup/src/popup.service.mjs +3 -3
- package/esm2020/range-slider/src/range-slider.component.mjs +2 -2
- package/esm2020/select-box/src/selectbox.component.mjs +3 -3
- package/esm2020/tabs/src/tab-content.directive.mjs +1 -1
- package/esm2020/tabs/src/tab-item.component.mjs +1 -1
- package/esm2020/tabs/src/tabs.component.mjs +1 -1
- package/esm2020/toast/src/toast.class.mjs +1 -1
- package/esm2020/toast/src/toast.component.mjs +29 -21
- package/esm2020/toast/src/toast.module.mjs +3 -6
- package/fesm2015/acorex-components-action-sheet.mjs +140 -124
- package/fesm2015/acorex-components-action-sheet.mjs.map +1 -1
- package/fesm2015/acorex-components-alert.mjs +0 -1
- package/fesm2015/acorex-components-avatar.mjs +0 -1
- package/fesm2015/acorex-components-badge.mjs +0 -1
- package/fesm2015/acorex-components-breadcrumbs.mjs +0 -1
- package/fesm2015/acorex-components-button.mjs +2 -3
- package/fesm2015/acorex-components-button.mjs.map +1 -1
- package/fesm2015/acorex-components-calendar.mjs +0 -1
- package/fesm2015/acorex-components-checkbox.mjs +0 -1
- package/fesm2015/acorex-components-chips.mjs +0 -1
- package/fesm2015/acorex-components-collapse.mjs +2 -3
- package/fesm2015/acorex-components-collapse.mjs.map +1 -1
- package/fesm2015/acorex-components-color-palette.mjs +0 -1
- package/fesm2015/acorex-components-color-picker.mjs +0 -1
- package/fesm2015/acorex-components-common.mjs +149 -120
- package/fesm2015/acorex-components-common.mjs.map +1 -1
- package/fesm2015/acorex-components-context-menu.mjs +3 -4
- package/fesm2015/acorex-components-context-menu.mjs.map +1 -1
- package/fesm2015/acorex-components-data-pager.mjs +2 -3
- package/fesm2015/acorex-components-data-pager.mjs.map +1 -1
- package/fesm2015/acorex-components-data-table.mjs +0 -1
- package/fesm2015/acorex-components-date-picker.mjs +0 -1
- package/fesm2015/acorex-components-decorators.mjs +3 -4
- package/fesm2015/acorex-components-decorators.mjs.map +1 -1
- package/fesm2015/acorex-components-dialog.mjs +3 -3
- package/fesm2015/acorex-components-dialog.mjs.map +1 -1
- package/fesm2015/acorex-components-drawer.mjs +0 -1
- package/fesm2015/acorex-components-dropdown.mjs +0 -1
- package/fesm2015/acorex-components-form.mjs +0 -1
- package/fesm2015/acorex-components-image.mjs +0 -1
- package/fesm2015/acorex-components-label.mjs +0 -1
- package/fesm2015/acorex-components-loading.mjs +0 -1
- package/fesm2015/acorex-components-menu.mjs +15 -16
- package/fesm2015/acorex-components-menu.mjs.map +1 -1
- package/fesm2015/acorex-components-mixin.mjs +2 -3
- package/fesm2015/acorex-components-mixin.mjs.map +1 -1
- package/fesm2015/acorex-components-notification.mjs +221 -0
- package/fesm2015/acorex-components-notification.mjs.map +1 -0
- package/fesm2015/acorex-components-number-box.mjs +2 -3
- package/fesm2015/acorex-components-number-box.mjs.map +1 -1
- package/fesm2015/acorex-components-page.mjs +1 -28
- package/fesm2015/acorex-components-page.mjs.map +1 -1
- package/fesm2015/acorex-components-password-box.mjs +0 -1
- package/fesm2015/acorex-components-popover.mjs +0 -1
- package/fesm2015/acorex-components-popup.mjs +4 -6
- package/fesm2015/acorex-components-popup.mjs.map +1 -1
- package/fesm2015/acorex-components-progress-bar.mjs +0 -1
- package/fesm2015/acorex-components-radio.mjs +0 -1
- package/fesm2015/acorex-components-range-slider.mjs +2 -3
- package/fesm2015/acorex-components-range-slider.mjs.map +1 -1
- package/fesm2015/acorex-components-rating.mjs +0 -1
- package/fesm2015/acorex-components-result.mjs +0 -1
- package/fesm2015/acorex-components-search-box.mjs +0 -1
- package/fesm2015/acorex-components-select-box.mjs +2 -3
- package/fesm2015/acorex-components-select-box.mjs.map +1 -1
- package/fesm2015/acorex-components-selection-list.mjs +0 -1
- package/fesm2015/acorex-components-switch.mjs +0 -1
- package/fesm2015/acorex-components-tabs.mjs.map +1 -1
- package/fesm2015/acorex-components-tag.mjs +0 -1
- package/fesm2015/acorex-components-textarea.mjs +0 -1
- package/fesm2015/acorex-components-textbox.mjs +0 -1
- package/fesm2015/acorex-components-time-box.mjs +0 -1
- package/fesm2015/acorex-components-toast.mjs +30 -26
- package/fesm2015/acorex-components-toast.mjs.map +1 -1
- package/fesm2015/acorex-components-tooltip.mjs +0 -1
- package/fesm2015/acorex-components-tree-view.mjs +0 -1
- package/fesm2015/acorex-components-uploader.mjs +0 -1
- package/fesm2015/acorex-components.mjs +0 -1
- package/fesm2020/acorex-components-action-sheet.mjs +139 -124
- package/fesm2020/acorex-components-action-sheet.mjs.map +1 -1
- package/fesm2020/acorex-components-alert.mjs +0 -1
- package/fesm2020/acorex-components-avatar.mjs +0 -1
- package/fesm2020/acorex-components-badge.mjs +0 -1
- package/fesm2020/acorex-components-breadcrumbs.mjs +0 -1
- package/fesm2020/acorex-components-button.mjs +2 -3
- package/fesm2020/acorex-components-button.mjs.map +1 -1
- package/fesm2020/acorex-components-calendar.mjs +0 -1
- package/fesm2020/acorex-components-checkbox.mjs +0 -1
- package/fesm2020/acorex-components-chips.mjs +0 -1
- package/fesm2020/acorex-components-collapse.mjs +2 -3
- package/fesm2020/acorex-components-collapse.mjs.map +1 -1
- package/fesm2020/acorex-components-color-palette.mjs +0 -1
- package/fesm2020/acorex-components-color-picker.mjs +0 -1
- package/fesm2020/acorex-components-common.mjs +149 -120
- package/fesm2020/acorex-components-common.mjs.map +1 -1
- package/fesm2020/acorex-components-context-menu.mjs +3 -4
- package/fesm2020/acorex-components-context-menu.mjs.map +1 -1
- package/fesm2020/acorex-components-data-pager.mjs +2 -3
- package/fesm2020/acorex-components-data-pager.mjs.map +1 -1
- package/fesm2020/acorex-components-data-table.mjs +0 -1
- package/fesm2020/acorex-components-date-picker.mjs +0 -1
- package/fesm2020/acorex-components-decorators.mjs +3 -4
- package/fesm2020/acorex-components-decorators.mjs.map +1 -1
- package/fesm2020/acorex-components-dialog.mjs +3 -3
- package/fesm2020/acorex-components-dialog.mjs.map +1 -1
- package/fesm2020/acorex-components-drawer.mjs +0 -1
- package/fesm2020/acorex-components-dropdown.mjs +0 -1
- package/fesm2020/acorex-components-form.mjs +0 -1
- package/fesm2020/acorex-components-image.mjs +0 -1
- package/fesm2020/acorex-components-label.mjs +0 -1
- package/fesm2020/acorex-components-loading.mjs +0 -1
- package/fesm2020/acorex-components-menu.mjs +15 -16
- package/fesm2020/acorex-components-menu.mjs.map +1 -1
- package/fesm2020/acorex-components-mixin.mjs +2 -3
- package/fesm2020/acorex-components-mixin.mjs.map +1 -1
- package/fesm2020/acorex-components-notification.mjs +221 -0
- package/fesm2020/acorex-components-notification.mjs.map +1 -0
- package/fesm2020/acorex-components-number-box.mjs +2 -3
- package/fesm2020/acorex-components-number-box.mjs.map +1 -1
- package/fesm2020/acorex-components-page.mjs +1 -28
- package/fesm2020/acorex-components-page.mjs.map +1 -1
- package/fesm2020/acorex-components-password-box.mjs +0 -1
- package/fesm2020/acorex-components-popover.mjs +0 -1
- package/fesm2020/acorex-components-popup.mjs +4 -6
- package/fesm2020/acorex-components-popup.mjs.map +1 -1
- package/fesm2020/acorex-components-progress-bar.mjs +0 -1
- package/fesm2020/acorex-components-radio.mjs +0 -1
- package/fesm2020/acorex-components-range-slider.mjs +2 -3
- package/fesm2020/acorex-components-range-slider.mjs.map +1 -1
- package/fesm2020/acorex-components-rating.mjs +0 -1
- package/fesm2020/acorex-components-result.mjs +0 -1
- package/fesm2020/acorex-components-search-box.mjs +0 -1
- package/fesm2020/acorex-components-select-box.mjs +2 -3
- package/fesm2020/acorex-components-select-box.mjs.map +1 -1
- package/fesm2020/acorex-components-selection-list.mjs +0 -1
- package/fesm2020/acorex-components-switch.mjs +0 -1
- package/fesm2020/acorex-components-tabs.mjs.map +1 -1
- package/fesm2020/acorex-components-tag.mjs +0 -1
- package/fesm2020/acorex-components-textarea.mjs +0 -1
- package/fesm2020/acorex-components-textbox.mjs +0 -1
- package/fesm2020/acorex-components-time-box.mjs +0 -1
- package/fesm2020/acorex-components-toast.mjs +30 -26
- package/fesm2020/acorex-components-toast.mjs.map +1 -1
- package/fesm2020/acorex-components-tooltip.mjs +0 -1
- package/fesm2020/acorex-components-tree-view.mjs +0 -1
- package/fesm2020/acorex-components-uploader.mjs +0 -1
- package/fesm2020/acorex-components.mjs +0 -1
- package/menu/src/menu.component.d.ts +1 -1
- package/mixin/src/base-components.class.d.ts +2 -2
- package/mixin/src/base-menu-mixin.class.d.ts +6 -6
- package/mixin/src/button-mixin.class.d.ts +2 -2
- package/mixin/src/clickable-mixin.class.d.ts +2 -2
- package/mixin/src/color-look-mixing.class.d.ts +2 -2
- package/mixin/src/datalist-component.class.d.ts +10 -10
- package/mixin/src/dropdown-mixin.class.d.ts +2 -2
- package/mixin/src/interactive-mixin.class.d.ts +4 -4
- package/mixin/src/loading-mixin.class.d.ts +2 -2
- package/mixin/src/mixin.class.d.ts +62 -62
- package/mixin/src/page-component.class.d.ts +2 -2
- package/mixin/src/selection-component.class.d.ts +2 -2
- package/mixin/src/sizable-mixin.class.d.ts +2 -2
- package/mixin/src/textbox-mixin.class.d.ts +2 -2
- package/mixin/src/value-mixin.class.d.ts +8 -8
- package/notification/index.d.ts +5 -0
- package/notification/public-api.d.ts +4 -0
- package/notification/src/notification.class.d.ts +16 -0
- package/notification/src/notification.component.d.ts +25 -0
- package/notification/src/notification.module.d.ts +8 -0
- package/notification/src/notification.service.d.ts +21 -0
- package/package.json +9 -1
- package/page/src/base-page.class.d.ts +3 -23
- package/popup/src/popup.component.d.ts +2 -2
- package/popup/src/popup.service.d.ts +3 -4
- package/tabs/src/tab-content.directive.d.ts +2 -2
- package/tabs/src/tab-item.component.d.ts +4 -4
- package/toast/src/toast.class.d.ts +1 -0
- package/toast/src/toast.component.d.ts +1 -0
- package/toast/src/toast.module.d.ts +1 -4
- package/action-sheet/src/action-sheet-item.component.d.ts +0 -16
- package/esm2020/action-sheet/src/action-sheet-item.component.mjs +0 -47
- package/esm2020/common/src/auto-focus.directive.mjs +0 -55
- package/esm2020/common/src/components.class.mjs +0 -45
- package/esm2020/common/src/custom-cdk-overlay.service.mjs +0 -48
- package/esm2020/common/src/debounce-time.directive.mjs +0 -47
- package/esm2020/common/src/drawing.class.mjs +0 -2
- package/esm2020/common/src/events.class.mjs +0 -58
- package/esm2020/common/src/hotkey.directive.mjs +0 -79
- package/esm2020/common/src/hotkey.service.mjs +0 -38
- package/esm2020/common/src/infinite-scroll.directive.mjs +0 -63
- package/esm2020/common/src/overlay.service.mjs +0 -91
- package/esm2020/common/src/responsive.directive.mjs +0 -34
- package/esm2020/common/src/styles.class.mjs +0 -22
@@ -3,8 +3,7 @@ import { EventEmitter, TemplateRef, Component, ChangeDetectionStrategy, ViewEnca
|
|
3
3
|
import * as i6 from '@angular/cdk/portal';
|
4
4
|
import { TemplatePortal, ComponentPortal, PortalModule } from '@angular/cdk/portal';
|
5
5
|
import * as i1$1 from '@acorex/components/common';
|
6
|
-
import { AXClosbaleComponent, AXCommonModule } from '@acorex/components/common';
|
7
|
-
import { TAB_META_KEY, AXPageClosedPromise } from '@acorex/components/page';
|
6
|
+
import { TAB_META_KEY, AXClosbaleComponent, AXComponentClosedPromise, AXCommonModule } from '@acorex/components/common';
|
8
7
|
import { AXBaseComponentMixin } from '@acorex/components/mixin';
|
9
8
|
import * as i1 from '@acorex/components/loading';
|
10
9
|
import * as i2 from '@acorex/core/platform';
|
@@ -133,10 +132,10 @@ class AXPopupComponent extends AXBaseComponentMixin {
|
|
133
132
|
onFullScreen() { }
|
134
133
|
}
|
135
134
|
AXPopupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXPopupComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i0.ViewContainerRef }, { token: i1.AXLoadingService }, { token: i2.AXPlatform }], target: i0.ɵɵFactoryTarget.Component });
|
136
|
-
AXPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AXPopupComponent, selector: "ax-popup", host: { listeners: { "keydown.escape": "onKeydownHandler($event)" } }, providers: [{ provide: AXClosbaleComponent, useExisting: AXPopupComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-popup-wrapper\" aria-modal=\"true\" [cdkTrapFocus]=\"true\">\r\n <div class=\"ax-popup ax-popup-{{size}}\" tabindex=\"0\" cdkDrag [cdkDragDisabled]=\"!draggable\">\r\n <div cdkDragHandle class=\"ax-popup-header-container\">\r\n <div class=\"ax-popup-header\" *ngIf=\"showHeader\">\r\n <span class=\"ax-popup-title\">{{title}}</span>\r\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleCloseClick()\" tabindex=\"1\"></span>\r\n </div>\r\n </div>\r\n <div class=\"ax-popup-main-container\">\r\n <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\r\n </div>\r\n <div class=\"ax-popup-footer-container\"></div>\r\n </div>\r\n</div>", styles: [".ax-popup{display:flex;flex-direction:column;background-color:rgb(var(--ax-color-surface));box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;border:1px solid;border-color:rgb(var(--ax-color-border-default));border-radius:var(--ax-rounded-border-default);outline-color:transparent;padding:0;width:50%;max-height:98vh;min-height:-moz-fit-content;min-height:fit-content;margin:0 auto}.ax-popup .ax-popup-header{padding:.75rem;display:flex;align-items:center;justify-content:space-between}.ax-popup .ax-popup-header .ax-popup-title{font-size:1rem}.ax-popup .ax-popup-header .ax-icon{font-size:1.5rem;cursor:pointer}.ax-popup .ax-popup-header .ax-icon:hover{opacity:.5}.ax-popup ax-footer{padding:.75rem;display:flex;align-items:center;justify-content:space-between}.ax-popup:focus{outline-color:rgb(var(--ax-color-primary-500))}.ax-popup ax-footer{background-color:rgba(var(--ax-color-ghost),.02)}.ax-popup .ax-popup-main-container{overflow:auto;flex:1 1 0%}.ax-popup.ax-popup-full{width:100vw;max-height:calc(100 * var(--ax-vh));height:calc(100 * var(--ax-vh))}.ax-popup.ax-fit{width:-moz-fit-content;width:fit-content}@media all and (min-width: 1280px){.ax-popup.ax-popup-sm{width:420px!important}.ax-popup.ax-popup-md{width:680px!important}.ax-popup.ax-popup-lg{width:1024px!important}}@media all and (min-width: 1024px) and (max-width: 1279px){.ax-popup.ax-popup-sm{width:100vw;max-height:calc(100 * var(--ax-vh))}.ax-popup.ax-popup-sm .ax-popup-main{@apply ax-h-screen;}.ax-popup.ax-popup-md{width:500px!important}.ax-popup.ax-popup-lg{width:900px!important}}@media all and (min-width: 768px) and (max-width: 1023px){.ax-popup.ax-popup-md{width:500px!important}.ax-popup.ax-popup-lg{width:700px!important}}@media all and (min-width: 425px) and (max-width: 767px){.ax-popup.ax-popup-sm{width:100vw;height:calc(100 * var(--ax-vh));max-height:calc(100 * var(--ax-vh))}.ax-popup.ax-popup-sm .ax-popup-main{height:100vh}.ax-popup.ax-popup-md,.ax-popup.ax-popup-lg{width:460px!important}}@media all and (min-width: 0px) and (max-width: 424px){.ax-popup.ax-popup-md,.ax-popup.ax-popup-lg{width:calc(var(--ax-overlay-full-width) * 1vw);height:calc(var(--ax-overlay-full-width) * var(--ax-vh));max-height:calc(var(--ax-overlay-full-width) * var(--ax-vh))}.ax-popup.ax-popup-md .ax-popup-main,.ax-popup.ax-popup-lg .ax-popup-main{height:100vh}}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i5.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: i6.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
135
|
+
AXPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AXPopupComponent, selector: "ax-popup", host: { listeners: { "keydown.escape": "onKeydownHandler($event)" } }, providers: [{ provide: AXClosbaleComponent, useExisting: AXPopupComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-popup-wrapper\" aria-modal=\"true\" [cdkTrapFocus]=\"true\">\r\n <div class=\"ax-popup ax-popup-{{size}}\" tabindex=\"0\" cdkDrag [cdkDragDisabled]=\"!draggable\">\r\n <div cdkDragHandle class=\"ax-popup-header-container\">\r\n <div class=\"ax-popup-header\" *ngIf=\"showHeader\">\r\n <span class=\"ax-popup-title\">{{title}}</span>\r\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleCloseClick()\" tabindex=\"1\"></span>\r\n </div>\r\n </div>\r\n <div class=\"ax-popup-main-container\">\r\n <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\r\n </div>\r\n <div class=\"ax-popup-footer-container\"></div>\r\n </div>\r\n</div>", styles: [".ax-popup{display:flex;flex-direction:column;background-color:rgb(var(--ax-color-surface));box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;border:1px solid;border-color:rgb(var(--ax-color-border-default));border-radius:var(--ax-rounded-border-default);outline-color:transparent;padding:0;width:50%;max-height:98vh;min-height:-moz-fit-content;min-height:fit-content;margin:0 auto}.ax-popup .ax-popup-header{padding:.75rem;display:flex;align-items:center;justify-content:space-between}.ax-popup .ax-popup-header .ax-popup-title{font-size:1rem}.ax-popup .ax-popup-header .ax-icon-close{font-size:1.5rem;cursor:pointer}.ax-popup .ax-popup-header .ax-icon-close:hover{opacity:.5}.ax-popup ax-footer{padding:.75rem;display:flex;align-items:center;justify-content:space-between}.ax-popup:focus{outline-color:rgb(var(--ax-color-primary-500))}.ax-popup ax-footer{background-color:rgba(var(--ax-color-ghost),.02)}.ax-popup .ax-popup-main-container{overflow:auto;flex:1 1 0%}.ax-popup.ax-popup-full{width:100vw;max-height:calc(100 * var(--ax-vh));height:calc(100 * var(--ax-vh))}.ax-popup.ax-fit{width:-moz-fit-content;width:fit-content}@media all and (min-width: 1280px){.ax-popup.ax-popup-sm{width:420px!important}.ax-popup.ax-popup-md{width:680px!important}.ax-popup.ax-popup-lg{width:1024px!important}}@media all and (min-width: 1024px) and (max-width: 1279px){.ax-popup.ax-popup-sm{width:100vw;max-height:calc(100 * var(--ax-vh))}.ax-popup.ax-popup-sm .ax-popup-main{@apply ax-h-screen;}.ax-popup.ax-popup-md{width:500px!important}.ax-popup.ax-popup-lg{width:900px!important}}@media all and (min-width: 768px) and (max-width: 1023px){.ax-popup.ax-popup-md{width:500px!important}.ax-popup.ax-popup-lg{width:700px!important}}@media all and (min-width: 425px) and (max-width: 767px){.ax-popup.ax-popup-sm{width:100vw;height:calc(100 * var(--ax-vh));max-height:calc(100 * var(--ax-vh))}.ax-popup.ax-popup-sm .ax-popup-main{height:100vh}.ax-popup.ax-popup-md,.ax-popup.ax-popup-lg{width:460px!important}}@media all and (min-width: 0px) and (max-width: 424px){.ax-popup.ax-popup-md,.ax-popup.ax-popup-lg{width:calc(var(--ax-overlay-full-width) * 1vw);height:calc(var(--ax-overlay-full-width) * var(--ax-vh));max-height:calc(var(--ax-overlay-full-width) * var(--ax-vh))}.ax-popup.ax-popup-md .ax-popup-main,.ax-popup.ax-popup-lg .ax-popup-main{height:100vh}}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i5.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: i6.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
137
136
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXPopupComponent, decorators: [{
|
138
137
|
type: Component,
|
139
|
-
args: [{ selector: 'ax-popup', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: AXClosbaleComponent, useExisting: AXPopupComponent }], template: "<div class=\"ax-popup-wrapper\" aria-modal=\"true\" [cdkTrapFocus]=\"true\">\r\n <div class=\"ax-popup ax-popup-{{size}}\" tabindex=\"0\" cdkDrag [cdkDragDisabled]=\"!draggable\">\r\n <div cdkDragHandle class=\"ax-popup-header-container\">\r\n <div class=\"ax-popup-header\" *ngIf=\"showHeader\">\r\n <span class=\"ax-popup-title\">{{title}}</span>\r\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleCloseClick()\" tabindex=\"1\"></span>\r\n </div>\r\n </div>\r\n <div class=\"ax-popup-main-container\">\r\n <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\r\n </div>\r\n <div class=\"ax-popup-footer-container\"></div>\r\n </div>\r\n</div>", styles: [".ax-popup{display:flex;flex-direction:column;background-color:rgb(var(--ax-color-surface));box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;border:1px solid;border-color:rgb(var(--ax-color-border-default));border-radius:var(--ax-rounded-border-default);outline-color:transparent;padding:0;width:50%;max-height:98vh;min-height:-moz-fit-content;min-height:fit-content;margin:0 auto}.ax-popup .ax-popup-header{padding:.75rem;display:flex;align-items:center;justify-content:space-between}.ax-popup .ax-popup-header .ax-popup-title{font-size:1rem}.ax-popup .ax-popup-header .ax-icon{font-size:1.5rem;cursor:pointer}.ax-popup .ax-popup-header .ax-icon:hover{opacity:.5}.ax-popup ax-footer{padding:.75rem;display:flex;align-items:center;justify-content:space-between}.ax-popup:focus{outline-color:rgb(var(--ax-color-primary-500))}.ax-popup ax-footer{background-color:rgba(var(--ax-color-ghost),.02)}.ax-popup .ax-popup-main-container{overflow:auto;flex:1 1 0%}.ax-popup.ax-popup-full{width:100vw;max-height:calc(100 * var(--ax-vh));height:calc(100 * var(--ax-vh))}.ax-popup.ax-fit{width:-moz-fit-content;width:fit-content}@media all and (min-width: 1280px){.ax-popup.ax-popup-sm{width:420px!important}.ax-popup.ax-popup-md{width:680px!important}.ax-popup.ax-popup-lg{width:1024px!important}}@media all and (min-width: 1024px) and (max-width: 1279px){.ax-popup.ax-popup-sm{width:100vw;max-height:calc(100 * var(--ax-vh))}.ax-popup.ax-popup-sm .ax-popup-main{@apply ax-h-screen;}.ax-popup.ax-popup-md{width:500px!important}.ax-popup.ax-popup-lg{width:900px!important}}@media all and (min-width: 768px) and (max-width: 1023px){.ax-popup.ax-popup-md{width:500px!important}.ax-popup.ax-popup-lg{width:700px!important}}@media all and (min-width: 425px) and (max-width: 767px){.ax-popup.ax-popup-sm{width:100vw;height:calc(100 * var(--ax-vh));max-height:calc(100 * var(--ax-vh))}.ax-popup.ax-popup-sm .ax-popup-main{height:100vh}.ax-popup.ax-popup-md,.ax-popup.ax-popup-lg{width:460px!important}}@media all and (min-width: 0px) and (max-width: 424px){.ax-popup.ax-popup-md,.ax-popup.ax-popup-lg{width:calc(var(--ax-overlay-full-width) * 1vw);height:calc(var(--ax-overlay-full-width) * var(--ax-vh));max-height:calc(var(--ax-overlay-full-width) * var(--ax-vh))}.ax-popup.ax-popup-md .ax-popup-main,.ax-popup.ax-popup-lg .ax-popup-main{height:100vh}}\n"] }]
|
138
|
+
args: [{ selector: 'ax-popup', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: AXClosbaleComponent, useExisting: AXPopupComponent }], template: "<div class=\"ax-popup-wrapper\" aria-modal=\"true\" [cdkTrapFocus]=\"true\">\r\n <div class=\"ax-popup ax-popup-{{size}}\" tabindex=\"0\" cdkDrag [cdkDragDisabled]=\"!draggable\">\r\n <div cdkDragHandle class=\"ax-popup-header-container\">\r\n <div class=\"ax-popup-header\" *ngIf=\"showHeader\">\r\n <span class=\"ax-popup-title\">{{title}}</span>\r\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleCloseClick()\" tabindex=\"1\"></span>\r\n </div>\r\n </div>\r\n <div class=\"ax-popup-main-container\">\r\n <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\r\n </div>\r\n <div class=\"ax-popup-footer-container\"></div>\r\n </div>\r\n</div>", styles: [".ax-popup{display:flex;flex-direction:column;background-color:rgb(var(--ax-color-surface));box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;border:1px solid;border-color:rgb(var(--ax-color-border-default));border-radius:var(--ax-rounded-border-default);outline-color:transparent;padding:0;width:50%;max-height:98vh;min-height:-moz-fit-content;min-height:fit-content;margin:0 auto}.ax-popup .ax-popup-header{padding:.75rem;display:flex;align-items:center;justify-content:space-between}.ax-popup .ax-popup-header .ax-popup-title{font-size:1rem}.ax-popup .ax-popup-header .ax-icon-close{font-size:1.5rem;cursor:pointer}.ax-popup .ax-popup-header .ax-icon-close:hover{opacity:.5}.ax-popup ax-footer{padding:.75rem;display:flex;align-items:center;justify-content:space-between}.ax-popup:focus{outline-color:rgb(var(--ax-color-primary-500))}.ax-popup ax-footer{background-color:rgba(var(--ax-color-ghost),.02)}.ax-popup .ax-popup-main-container{overflow:auto;flex:1 1 0%}.ax-popup.ax-popup-full{width:100vw;max-height:calc(100 * var(--ax-vh));height:calc(100 * var(--ax-vh))}.ax-popup.ax-fit{width:-moz-fit-content;width:fit-content}@media all and (min-width: 1280px){.ax-popup.ax-popup-sm{width:420px!important}.ax-popup.ax-popup-md{width:680px!important}.ax-popup.ax-popup-lg{width:1024px!important}}@media all and (min-width: 1024px) and (max-width: 1279px){.ax-popup.ax-popup-sm{width:100vw;max-height:calc(100 * var(--ax-vh))}.ax-popup.ax-popup-sm .ax-popup-main{@apply ax-h-screen;}.ax-popup.ax-popup-md{width:500px!important}.ax-popup.ax-popup-lg{width:900px!important}}@media all and (min-width: 768px) and (max-width: 1023px){.ax-popup.ax-popup-md{width:500px!important}.ax-popup.ax-popup-lg{width:700px!important}}@media all and (min-width: 425px) and (max-width: 767px){.ax-popup.ax-popup-sm{width:100vw;height:calc(100 * var(--ax-vh));max-height:calc(100 * var(--ax-vh))}.ax-popup.ax-popup-sm .ax-popup-main{height:100vh}.ax-popup.ax-popup-md,.ax-popup.ax-popup-lg{width:460px!important}}@media all and (min-width: 0px) and (max-width: 424px){.ax-popup.ax-popup-md,.ax-popup.ax-popup-lg{width:calc(var(--ax-overlay-full-width) * 1vw);height:calc(var(--ax-overlay-full-width) * var(--ax-vh));max-height:calc(var(--ax-overlay-full-width) * var(--ax-vh))}.ax-popup.ax-popup-md .ax-popup-main,.ax-popup.ax-popup-lg .ax-popup-main{height:100vh}}\n"] }]
|
140
139
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i0.ViewContainerRef }, { type: i1.AXLoadingService }, { type: i2.AXPlatform }]; }, propDecorators: { onKeydownHandler: [{
|
141
140
|
type: HostListener,
|
142
141
|
args: ['keydown.escape', ['$event']]
|
@@ -184,7 +183,7 @@ class AXPopupService {
|
|
184
183
|
popup.onClosed.subscribe(c => {
|
185
184
|
this.closePopup(popup, com, c, lastActiveElement);
|
186
185
|
});
|
187
|
-
const promise = new
|
186
|
+
const promise = new AXComponentClosedPromise((resolve) => {
|
188
187
|
popup[TAB_META_KEY].close = (e) => {
|
189
188
|
if (resolve) {
|
190
189
|
resolve(e);
|
@@ -259,4 +258,3 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
|
|
259
258
|
|
260
259
|
export { AXPopupComponent, AXPopupModule, AXPopupService };
|
261
260
|
//# sourceMappingURL=acorex-components-popup.mjs.map
|
262
|
-
//# sourceMappingURL=acorex-components-popup.mjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"acorex-components-popup.mjs","sources":["../../../../projects/acorex/components/popup/src/popup.component.ts","../../../../projects/acorex/components/popup/src/popup.component.html","../../../../projects/acorex/components/popup/src/popup.service.ts","../../../../projects/acorex/components/popup/src/popup.module.ts","../../../../projects/acorex/components/popup/acorex-components-popup.ts"],"sourcesContent":["import {\r\n Component,\r\n ViewEncapsulation,\r\n ChangeDetectionStrategy,\r\n ElementRef,\r\n ChangeDetectorRef,\r\n ViewContainerRef,\r\n HostListener,\r\n ComponentRef,\r\n EventEmitter,\r\n TemplateRef,\r\n NgZone,\r\n} from '@angular/core';\r\nimport {\r\n CdkPortalOutletAttachedRef,\r\n ComponentPortal,\r\n Portal,\r\n TemplatePortal,\r\n} from '@angular/cdk/portal';\r\nimport { AXPlatform } from '@acorex/core/platform';\r\n\r\nimport { AXClosbaleComponent } from '@acorex/components/common';\r\nimport { AXPageCloseEvent, TAB_META_KEY } from '@acorex/components/page';\r\nimport { AXLoadingService } from '@acorex/components/loading';\r\nimport { AXBaseComponentMixin } from '@acorex/components/mixin';\r\n\r\n/**\r\n * The Button is a component which detects user interaction and triggers a corresponding event\r\n *\r\n * @category Components\r\n */\r\n@Component({\r\n selector: 'ax-popup',\r\n templateUrl: './popup.component.html',\r\n styleUrls: ['./popup.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n providers: [{ provide: AXClosbaleComponent, useExisting: AXPopupComponent }],\r\n})\r\nexport class AXPopupComponent extends AXBaseComponentMixin {\r\n isLoading: boolean = true;\r\n private _loadingId: number;\r\n\r\n title: string;\r\n\r\n onClosed: EventEmitter<AXPageCloseEvent> =\r\n new EventEmitter<AXPageCloseEvent>();\r\n\r\n size: 'sm' | 'md' | 'lg' | 'full' = 'sm';\r\n draggable: boolean = true;\r\n\r\n data: any = {};\r\n\r\n showCloseButton: boolean = true;\r\n showHeader: boolean = true;\r\n\r\n content: any;\r\n\r\n _selectedPortal: Portal<any>;\r\n _footerPortal: Portal<any>;\r\n _headerPortal: Portal<any>;\r\n\r\n /**\r\n * @ignore\r\n */\r\n constructor(\r\n elementRef: ElementRef,\r\n cdr: ChangeDetectorRef,\r\n private _zone: NgZone,\r\n private _viewContainerRef: ViewContainerRef,\r\n private loadingService: AXLoadingService,\r\n private _platform: AXPlatform\r\n ) {\r\n super(elementRef, cdr);\r\n }\r\n\r\n onInit() {\r\n super.onInit();\r\n if (this._platform.is('Mobile')) {\r\n this.draggable = false;\r\n }\r\n\r\n this._loadingId = this.loadingService.show(\r\n //TODO: check ts error\r\n //@ts-ignore\r\n this._getHostElement().querySelector('.ax-popup-body-container')\r\n );\r\n //\r\n if (typeof this.content === 'string') {\r\n // this.rendererService.findLoadedComponentByRoute(this.content, 20).then(route => {\r\n // setTimeout(() => {\r\n // this.loadComponent(route.component);\r\n // }, 300);\r\n // });\r\n } else if (this.content instanceof TemplateRef) {\r\n this._selectedPortal = new TemplatePortal(\r\n this.content,\r\n this._viewContainerRef,\r\n { $implicit: this.data, ref: this }\r\n );\r\n this._cdr.markForCheck();\r\n } else if (typeof this.content === 'function') {\r\n this._selectedPortal = new ComponentPortal(this.content);\r\n this._cdr.markForCheck();\r\n }\r\n //\r\n // this._platform.keydown.subscribe((e) => {\r\n // debugger;\r\n // this.close();\r\n // e.nativeEvent.stopPropagation();\r\n // });\r\n }\r\n\r\n _handleAttched(ref: CdkPortalOutletAttachedRef) {\r\n ref = ref as ComponentRef<any>;\r\n if (ref.instance) {\r\n this[TAB_META_KEY].component = ref.instance;\r\n Object.assign(this[TAB_META_KEY].component, this.data);\r\n Object.assign(this[TAB_META_KEY].component, { _isPopup: true });\r\n if (ref.instance.onClosed) {\r\n ref.instance.onClosed.subscribe((e: AXPageCloseEvent) => {\r\n this.onClosed.emit(e);\r\n });\r\n }\r\n }\r\n this._zone.runOutsideAngular(() => {\r\n setTimeout(() => {\r\n const main = this._getHostElement().querySelector<HTMLDivElement>(\r\n '.ax-popup-main-container'\r\n );\r\n const popHeader = this._getHostElement().querySelector<HTMLDivElement>(\r\n '.ax-popup-header-container'\r\n );\r\n const popFooter = this._getHostElement().querySelector<HTMLDivElement>(\r\n '.ax-popup-footer-container'\r\n );\r\n const footer = main!.querySelector<HTMLDivElement>('ax-footer');\r\n const header = main!.querySelector<HTMLDivElement>('ax-header');\r\n if (footer) {\r\n popFooter!.append(footer);\r\n }\r\n if (header) {\r\n //TODO: check ts error\r\n //@ts-ignore\r\n popHeader.innerHTML = '';\r\n popHeader!.append(header);\r\n }\r\n this.focus();\r\n });\r\n });\r\n this.loadingService.hide(this._loadingId);\r\n this._cdr.markForCheck();\r\n }\r\n\r\n @HostListener('keydown.escape', ['$event'])\r\n onKeydownHandler(event: KeyboardEvent) {\r\n let focusedOrHasFocused = this._getHostElement().matches(':focus-within');\r\n if (this.showCloseButton && focusedOrHasFocused) {\r\n this.close();\r\n }\r\n }\r\n\r\n _handleCloseClick() {\r\n this.close();\r\n }\r\n\r\n ngOnDestroy() {\r\n this.loadingService.hide(this._loadingId);\r\n }\r\n\r\n focus() {\r\n setTimeout(() => this._getHostElement().querySelector<HTMLDivElement>('.ax-popup')?.focus());\r\n }\r\n\r\n close() {\r\n this.onClosed.emit({\r\n //TODO: check ts error\r\n //@ts-ignore\r\n component: this[TAB_META_KEY].component,\r\n htmlElement: this._getHostElement(),\r\n });\r\n this._cdr.detectChanges();\r\n }\r\n\r\n onFullScreen() { }\r\n}\r\n","<div class=\"ax-popup-wrapper\" aria-modal=\"true\" [cdkTrapFocus]=\"true\">\r\n <div class=\"ax-popup ax-popup-{{size}}\" tabindex=\"0\" cdkDrag [cdkDragDisabled]=\"!draggable\">\r\n <div cdkDragHandle class=\"ax-popup-header-container\">\r\n <div class=\"ax-popup-header\" *ngIf=\"showHeader\">\r\n <span class=\"ax-popup-title\">{{title}}</span>\r\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleCloseClick()\" tabindex=\"1\"></span>\r\n </div>\r\n </div>\r\n <div class=\"ax-popup-main-container\">\r\n <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\r\n </div>\r\n <div class=\"ax-popup-footer-container\"></div>\r\n </div>\r\n</div>","import { Injectable, TemplateRef } from '@angular/core';\r\nimport { AXOverlayService, AXOverlayViewRef } from '@acorex/components/common';\r\nimport { AXPageClosedPromise, AXPageCloseEvent, TAB_META_KEY } from '@acorex/components/page';\r\nimport { AXPopupComponent } from './popup.component';\r\n\r\nexport type AXPopupContentType = string | TemplateRef<any> | Function;\r\n\r\n/**\r\n * This is a service which you can create popup with it\r\n *\r\n * @category Components\r\n */\r\n@Injectable({ providedIn: 'root' })\r\nexport class AXPopupService {\r\n\r\n\r\n private stack: Array<AXPopupComponent> = [];\r\n\r\n\r\n /**\r\n * @ignore\r\n */\r\n constructor(private overlayService: AXOverlayService) { }\r\n\r\n\r\n /**\r\n * Open popup 1\r\n */\r\n open(content: AXPopupContentType, title: string): AXPageClosedPromise;\r\n /**\r\n * Open popup 2\r\n * @ignore\r\n */\r\n open(\r\n content: AXPopupContentType,\r\n options?: {\r\n title: string;\r\n showCloseButton?: boolean;\r\n showHeader?: boolean;\r\n maximizable?: boolean;\r\n size?: 'sm' | 'md' | 'lg' | 'full' | 'fit';\r\n data?: any;\r\n draggable?: boolean\r\n }\r\n ): AXPageClosedPromise;\r\n\r\n /**\r\n * @ignore\r\n */\r\n open(arg1, arg2): AXPageClosedPromise {\r\n const options: any = {\r\n showCloseButton: true,\r\n showHeader: true,\r\n size: 'md',\r\n maximizable: false,\r\n draggable: true\r\n };\r\n if (typeof arg2 === 'string') {\r\n options.title = arg2;\r\n } else {\r\n Object.assign(options, arg2);\r\n }\r\n const lastActiveElement = document.activeElement as HTMLElement;\r\n const com = this.overlayService.show(AXPopupComponent, options, { transparentBackdrop: false, closeOnClickOutside: false, scroll: 'block' });\r\n const popup = com.instance as AXPopupComponent;\r\n popup.content = arg1;\r\n popup[TAB_META_KEY] = {};\r\n if (options.size) {\r\n popup.size = options.size;\r\n }\r\n this.stack.push(popup);\r\n popup.onClosed.subscribe(c => {\r\n this.closePopup(popup, com, c, lastActiveElement);\r\n\r\n });\r\n const promise = new AXPageClosedPromise((resolve) => {\r\n popup[TAB_META_KEY].close = (e) => {\r\n if (resolve) {\r\n resolve(e);\r\n }\r\n };\r\n });\r\n promise['closeMethod'] = () => { popup.close(); };\r\n return promise;\r\n }\r\n\r\n\r\n private closePopup(popup: AXPopupComponent, com: AXOverlayViewRef, result: AXPageCloseEvent, lastActiveElement?: HTMLElement) {\r\n const closeFunc = (e) => {\r\n com.dispose();\r\n this.stack.pop();\r\n delete e.cancel;\r\n popup[TAB_META_KEY].close(e);\r\n if (lastActiveElement?.focus) {\r\n lastActiveElement.focus()\r\n }\r\n else if (this.stack.length) { this.stack.reverse()[0].focus(); }\r\n };\r\n const e = { cancel: false };\r\n const closingFunc = popup[TAB_META_KEY].component.onClosing;\r\n if (closingFunc) {\r\n const res = closingFunc(e);\r\n if (res instanceof Promise) {\r\n res.then(() => {\r\n if (e == null || e.cancel !== true) {\r\n closeFunc(result);\r\n }\r\n });\r\n }\r\n else {\r\n if (e == null || e.cancel !== true) {\r\n closeFunc(result);\r\n }\r\n }\r\n } else {\r\n closeFunc(result);\r\n }\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { A11yModule } from '@angular/cdk/a11y';\r\nimport { DragDropModule } from '@angular/cdk/drag-drop';\r\nimport { PortalModule } from '@angular/cdk/portal';\r\nimport { AXPopupComponent } from './popup.component';\r\nimport { AXButtonModule } from '@acorex/components/button';\r\n\r\nimport { AXDecoratorModule } from '@acorex/components/decorators';\r\nimport { AXCommonModule } from '@acorex/components/common';\r\n\r\nconst COMPONENT = [AXPopupComponent];\r\nconst MODULES = [CommonModule,AXCommonModule, DragDropModule, A11yModule, AXButtonModule, PortalModule, AXDecoratorModule];\r\n\r\n@NgModule({\r\n declarations: [...COMPONENT],\r\n imports: [...MODULES],\r\n exports: [...COMPONENT],\r\n providers: [],\r\n})\r\nexport class AXPopupModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"acorex-components-popup.mjs","sources":["../../../../projects/acorex/components/popup/src/popup.component.ts","../../../../projects/acorex/components/popup/src/popup.component.html","../../../../projects/acorex/components/popup/src/popup.service.ts","../../../../projects/acorex/components/popup/src/popup.module.ts","../../../../projects/acorex/components/popup/acorex-components-popup.ts"],"sourcesContent":["import {\r\n Component,\r\n ViewEncapsulation,\r\n ChangeDetectionStrategy,\r\n ElementRef,\r\n ChangeDetectorRef,\r\n ViewContainerRef,\r\n HostListener,\r\n ComponentRef,\r\n EventEmitter,\r\n TemplateRef,\r\n NgZone,\r\n} from '@angular/core';\r\nimport {\r\n CdkPortalOutletAttachedRef,\r\n ComponentPortal,\r\n Portal,\r\n TemplatePortal,\r\n} from '@angular/cdk/portal';\r\nimport { AXPlatform } from '@acorex/core/platform';\r\n\r\nimport { AXClosbaleComponent,AXComponentCloseEvent, TAB_META_KEY } from '@acorex/components/common';\r\nimport { AXLoadingService } from '@acorex/components/loading';\r\nimport { AXBaseComponentMixin } from '@acorex/components/mixin';\r\n\r\n/**\r\n * The Button is a component which detects user interaction and triggers a corresponding event\r\n *\r\n * @category Components\r\n */\r\n@Component({\r\n selector: 'ax-popup',\r\n templateUrl: './popup.component.html',\r\n styleUrls: ['./popup.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n providers: [{ provide: AXClosbaleComponent, useExisting: AXPopupComponent }],\r\n})\r\nexport class AXPopupComponent extends AXBaseComponentMixin {\r\n isLoading: boolean = true;\r\n private _loadingId: number;\r\n\r\n title: string;\r\n\r\n onClosed: EventEmitter<AXComponentCloseEvent> =\r\n new EventEmitter<AXComponentCloseEvent>();\r\n\r\n size: 'sm' | 'md' | 'lg' | 'full' = 'sm';\r\n draggable: boolean = true;\r\n\r\n data: any = {};\r\n\r\n showCloseButton: boolean = true;\r\n showHeader: boolean = true;\r\n\r\n content: any;\r\n\r\n _selectedPortal: Portal<any>;\r\n _footerPortal: Portal<any>;\r\n _headerPortal: Portal<any>;\r\n\r\n /**\r\n * @ignore\r\n */\r\n constructor(\r\n elementRef: ElementRef,\r\n cdr: ChangeDetectorRef,\r\n private _zone: NgZone,\r\n private _viewContainerRef: ViewContainerRef,\r\n private loadingService: AXLoadingService,\r\n private _platform: AXPlatform\r\n ) {\r\n super(elementRef, cdr);\r\n }\r\n\r\n onInit() {\r\n super.onInit();\r\n if (this._platform.is('Mobile')) {\r\n this.draggable = false;\r\n }\r\n\r\n this._loadingId = this.loadingService.show(\r\n //TODO: check ts error\r\n //@ts-ignore\r\n this._getHostElement().querySelector('.ax-popup-body-container')\r\n );\r\n //\r\n if (typeof this.content === 'string') {\r\n // this.rendererService.findLoadedComponentByRoute(this.content, 20).then(route => {\r\n // setTimeout(() => {\r\n // this.loadComponent(route.component);\r\n // }, 300);\r\n // });\r\n } else if (this.content instanceof TemplateRef) {\r\n this._selectedPortal = new TemplatePortal(\r\n this.content,\r\n this._viewContainerRef,\r\n { $implicit: this.data, ref: this }\r\n );\r\n this._cdr.markForCheck();\r\n } else if (typeof this.content === 'function') {\r\n this._selectedPortal = new ComponentPortal(this.content);\r\n this._cdr.markForCheck();\r\n }\r\n //\r\n // this._platform.keydown.subscribe((e) => {\r\n // debugger;\r\n // this.close();\r\n // e.nativeEvent.stopPropagation();\r\n // });\r\n }\r\n\r\n _handleAttched(ref: CdkPortalOutletAttachedRef) {\r\n ref = ref as ComponentRef<any>;\r\n if (ref.instance) {\r\n this[TAB_META_KEY].component = ref.instance;\r\n Object.assign(this[TAB_META_KEY].component, this.data);\r\n Object.assign(this[TAB_META_KEY].component, { _isPopup: true });\r\n if (ref.instance.onClosed) {\r\n ref.instance.onClosed.subscribe((e: AXComponentCloseEvent) => {\r\n this.onClosed.emit(e);\r\n });\r\n }\r\n }\r\n this._zone.runOutsideAngular(() => {\r\n setTimeout(() => {\r\n const main = this._getHostElement().querySelector<HTMLDivElement>(\r\n '.ax-popup-main-container'\r\n );\r\n const popHeader = this._getHostElement().querySelector<HTMLDivElement>(\r\n '.ax-popup-header-container'\r\n );\r\n const popFooter = this._getHostElement().querySelector<HTMLDivElement>(\r\n '.ax-popup-footer-container'\r\n );\r\n const footer = main!.querySelector<HTMLDivElement>('ax-footer');\r\n const header = main!.querySelector<HTMLDivElement>('ax-header');\r\n if (footer) {\r\n popFooter!.append(footer);\r\n }\r\n if (header) {\r\n //TODO: check ts error\r\n //@ts-ignore\r\n popHeader.innerHTML = '';\r\n popHeader!.append(header);\r\n }\r\n this.focus();\r\n });\r\n });\r\n this.loadingService.hide(this._loadingId);\r\n this._cdr.markForCheck();\r\n }\r\n\r\n @HostListener('keydown.escape', ['$event'])\r\n onKeydownHandler(event: KeyboardEvent) {\r\n let focusedOrHasFocused = this._getHostElement().matches(':focus-within');\r\n if (this.showCloseButton && focusedOrHasFocused) {\r\n this.close();\r\n }\r\n }\r\n\r\n _handleCloseClick() {\r\n this.close();\r\n }\r\n\r\n ngOnDestroy() {\r\n this.loadingService.hide(this._loadingId);\r\n }\r\n\r\n focus() {\r\n setTimeout(() => this._getHostElement().querySelector<HTMLDivElement>('.ax-popup')?.focus());\r\n }\r\n\r\n close() {\r\n this.onClosed.emit({\r\n //TODO: check ts error\r\n //@ts-ignore\r\n component: this[TAB_META_KEY].component,\r\n htmlElement: this._getHostElement(),\r\n });\r\n this._cdr.detectChanges();\r\n }\r\n\r\n onFullScreen() { }\r\n}\r\n","<div class=\"ax-popup-wrapper\" aria-modal=\"true\" [cdkTrapFocus]=\"true\">\r\n <div class=\"ax-popup ax-popup-{{size}}\" tabindex=\"0\" cdkDrag [cdkDragDisabled]=\"!draggable\">\r\n <div cdkDragHandle class=\"ax-popup-header-container\">\r\n <div class=\"ax-popup-header\" *ngIf=\"showHeader\">\r\n <span class=\"ax-popup-title\">{{title}}</span>\r\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleCloseClick()\" tabindex=\"1\"></span>\r\n </div>\r\n </div>\r\n <div class=\"ax-popup-main-container\">\r\n <ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\r\n </div>\r\n <div class=\"ax-popup-footer-container\"></div>\r\n </div>\r\n</div>","import { Injectable, TemplateRef } from '@angular/core';\r\nimport { AXOverlayService, AXOverlayViewRef,AXComponentClosedPromise, AXComponentCloseEvent, TAB_META_KEY } from '@acorex/components/common';\r\nimport { AXPopupComponent } from './popup.component';\r\n\r\nexport type AXPopupContentType = string | TemplateRef<any> | Function;\r\n\r\n/**\r\n * This is a service which you can create popup with it\r\n *\r\n * @category Components\r\n */\r\n@Injectable({ providedIn: 'root' })\r\nexport class AXPopupService {\r\n\r\n\r\n private stack: Array<AXPopupComponent> = [];\r\n\r\n\r\n /**\r\n * @ignore\r\n */\r\n constructor(private overlayService: AXOverlayService) { }\r\n\r\n\r\n /**\r\n * Open popup 1\r\n */\r\n open(content: AXPopupContentType, title: string): AXComponentClosedPromise;\r\n /**\r\n * Open popup 2\r\n * @ignore\r\n */\r\n open(\r\n content: AXPopupContentType,\r\n options?: {\r\n title: string;\r\n showCloseButton?: boolean;\r\n showHeader?: boolean;\r\n maximizable?: boolean;\r\n size?: 'sm' | 'md' | 'lg' | 'full' | 'fit';\r\n data?: any;\r\n draggable?: boolean\r\n }\r\n ): AXComponentClosedPromise;\r\n\r\n /**\r\n * @ignore\r\n */\r\n open(arg1, arg2): AXComponentClosedPromise {\r\n const options: any = {\r\n showCloseButton: true,\r\n showHeader: true,\r\n size: 'md',\r\n maximizable: false,\r\n draggable: true\r\n };\r\n if (typeof arg2 === 'string') {\r\n options.title = arg2;\r\n } else {\r\n Object.assign(options, arg2);\r\n }\r\n const lastActiveElement = document.activeElement as HTMLElement;\r\n const com = this.overlayService.show(AXPopupComponent, options, { transparentBackdrop: false, closeOnClickOutside: false, scroll: 'block' });\r\n const popup = com.instance as AXPopupComponent;\r\n popup.content = arg1;\r\n popup[TAB_META_KEY] = {};\r\n if (options.size) {\r\n popup.size = options.size;\r\n }\r\n this.stack.push(popup);\r\n popup.onClosed.subscribe(c => {\r\n this.closePopup(popup, com, c, lastActiveElement);\r\n\r\n });\r\n const promise = new AXComponentClosedPromise((resolve) => {\r\n popup[TAB_META_KEY].close = (e) => {\r\n if (resolve) {\r\n resolve(e);\r\n }\r\n };\r\n });\r\n promise['closeMethod'] = () => { popup.close(); };\r\n return promise;\r\n }\r\n\r\n\r\n private closePopup(popup: AXPopupComponent, com: AXOverlayViewRef, result: AXComponentCloseEvent, lastActiveElement?: HTMLElement) {\r\n const closeFunc = (e) => {\r\n com.dispose();\r\n this.stack.pop();\r\n delete e.cancel;\r\n popup[TAB_META_KEY].close(e);\r\n if (lastActiveElement?.focus) {\r\n lastActiveElement.focus()\r\n }\r\n else if (this.stack.length) { this.stack.reverse()[0].focus(); }\r\n };\r\n const e = { cancel: false };\r\n const closingFunc = popup[TAB_META_KEY].component.onClosing;\r\n if (closingFunc) {\r\n const res = closingFunc(e);\r\n if (res instanceof Promise) {\r\n res.then(() => {\r\n if (e == null || e.cancel !== true) {\r\n closeFunc(result);\r\n }\r\n });\r\n }\r\n else {\r\n if (e == null || e.cancel !== true) {\r\n closeFunc(result);\r\n }\r\n }\r\n } else {\r\n closeFunc(result);\r\n }\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { A11yModule } from '@angular/cdk/a11y';\r\nimport { DragDropModule } from '@angular/cdk/drag-drop';\r\nimport { PortalModule } from '@angular/cdk/portal';\r\nimport { AXPopupComponent } from './popup.component';\r\nimport { AXButtonModule } from '@acorex/components/button';\r\n\r\nimport { AXDecoratorModule } from '@acorex/components/decorators';\r\nimport { AXCommonModule } from '@acorex/components/common';\r\n\r\nconst COMPONENT = [AXPopupComponent];\r\nconst MODULES = [CommonModule,AXCommonModule, DragDropModule, A11yModule, AXButtonModule, PortalModule, AXDecoratorModule];\r\n\r\n@NgModule({\r\n declarations: [...COMPONENT],\r\n imports: [...MODULES],\r\n exports: [...COMPONENT],\r\n providers: [],\r\n})\r\nexport class AXPopupModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1"],"mappings":"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"}
|
@@ -94,12 +94,12 @@ class AXRangeSliderComponent extends AXBaseValueComponentMixin {
|
|
94
94
|
AXRangeSliderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXRangeSliderComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
|
95
95
|
AXRangeSliderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AXRangeSliderComponent, selector: "ax-range-slider", inputs: { readonly: "readonly", allowNull: "allowNull", value: "value", name: "name", checked: "checked", minValue: "minValue", maxValue: "maxValue", step: "step", color: "color", oriantaion: "oriantaion" }, outputs: { valueChange: "valueChange", onValueChanged: "onValueChanged", colorChange: "colorChange" }, host: { properties: { "class": "this.__hostClass" }, classAttribute: "ax-range-slider" }, providers: [
|
96
96
|
{ provide: AXValuableComponent, useExisting: AXRangeSliderComponent },
|
97
|
-
], usesInheritance: true, ngImport: i0, template: "<input type=\"range\" [min]=\"minValue\" [max]=\"maxValue\" [(ngModel)]=\"value\" [step]=\"step\">", styles: [".ax-range-slider{width:100%;--ax-current-value: 0%}.ax-range-slider input{-webkit-appearance:none;appearance:none;width:100%;height:.5rem;background:rgba(var(--ax-color-
|
97
|
+
], usesInheritance: true, ngImport: i0, template: "<input type=\"range\" [min]=\"minValue\" [max]=\"maxValue\" [(ngModel)]=\"value\" [step]=\"step\">", styles: [".ax-range-slider{width:100%;--ax-current-value: 0%}.ax-range-slider input{-webkit-appearance:none;appearance:none;width:100%;height:.5rem;background:rgba(var(--ax-color-surface),.05);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;border-radius:999rem}.ax-range-slider input::-webkit-slider-thumb{width:1.5rem;height:1.5rem;background:rgb(var(--ax-color-surface));border:1px solid;border-color:rgb(var(--ax-color-border-default));cursor:pointer;border-radius:999rem;appearance:none;-webkit-appearance:none;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.ax-range-slider input::-moz-range-thumb{width:1.25rem;height:1.25rem;background:rgb(var(--ax-color-surface));border:1px solid;border-color:rgb(var(--ax-color-border-default));cursor:pointer;border-radius:999rem;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.ax-range-slider.ax-vertical{display:block;transform:rotate(90deg)}.ax-range-slider.ax-vertical input[type=range]{-webkit-appearance:slider-vertical}.ax-range-slider.ax-primary-default input{background:linear-gradient(to right,rgb(var(--ax-color-primary-500)) 0%,rgb(var(--ax-color-primary-500)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) 100%)}.ax-range-slider.ax-secondary-default input{background:linear-gradient(to right,rgb(var(--ax-color-secondary-500)) 0%,rgb(var(--ax-color-secondary-500)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) 100%)}.ax-range-slider.ax-success-default input{background:linear-gradient(to right,rgb(var(--ax-color-success-500)) 0%,rgb(var(--ax-color-success-500)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) 100%)}.ax-range-slider.ax-warning-default input{background:linear-gradient(to right,rgb(var(--ax-color-warning-500)) 0%,rgb(var(--ax-color-warning-500)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) 100%)}.ax-range-slider.ax-danger-default input{background:linear-gradient(to right,rgb(var(--ax-color-danger-500)) 0%,rgb(var(--ax-color-danger-500)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) 100%)}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.RangeValueAccessor, selector: "input[type=range][formControlName],input[type=range][formControl],input[type=range][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
98
98
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXRangeSliderComponent, decorators: [{
|
99
99
|
type: Component,
|
100
100
|
args: [{ selector: 'ax-range-slider', changeDetection: ChangeDetectionStrategy.OnPush, inputs: ['readonly', 'allowNull', 'value', 'name', 'checked'], outputs: ['valueChange', 'onValueChanged'], host: { class: 'ax-range-slider' }, encapsulation: ViewEncapsulation.None, providers: [
|
101
101
|
{ provide: AXValuableComponent, useExisting: AXRangeSliderComponent },
|
102
|
-
], template: "<input type=\"range\" [min]=\"minValue\" [max]=\"maxValue\" [(ngModel)]=\"value\" [step]=\"step\">", styles: [".ax-range-slider{width:100%;--ax-current-value: 0%}.ax-range-slider input{-webkit-appearance:none;appearance:none;width:100%;height:.5rem;background:rgba(var(--ax-color-
|
102
|
+
], template: "<input type=\"range\" [min]=\"minValue\" [max]=\"maxValue\" [(ngModel)]=\"value\" [step]=\"step\">", styles: [".ax-range-slider{width:100%;--ax-current-value: 0%}.ax-range-slider input{-webkit-appearance:none;appearance:none;width:100%;height:.5rem;background:rgba(var(--ax-color-surface),.05);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;border-radius:999rem}.ax-range-slider input::-webkit-slider-thumb{width:1.5rem;height:1.5rem;background:rgb(var(--ax-color-surface));border:1px solid;border-color:rgb(var(--ax-color-border-default));cursor:pointer;border-radius:999rem;appearance:none;-webkit-appearance:none;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.ax-range-slider input::-moz-range-thumb{width:1.25rem;height:1.25rem;background:rgb(var(--ax-color-surface));border:1px solid;border-color:rgb(var(--ax-color-border-default));cursor:pointer;border-radius:999rem;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.ax-range-slider.ax-vertical{display:block;transform:rotate(90deg)}.ax-range-slider.ax-vertical input[type=range]{-webkit-appearance:slider-vertical}.ax-range-slider.ax-primary-default input{background:linear-gradient(to right,rgb(var(--ax-color-primary-500)) 0%,rgb(var(--ax-color-primary-500)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) 100%)}.ax-range-slider.ax-secondary-default input{background:linear-gradient(to right,rgb(var(--ax-color-secondary-500)) 0%,rgb(var(--ax-color-secondary-500)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) 100%)}.ax-range-slider.ax-success-default input{background:linear-gradient(to right,rgb(var(--ax-color-success-500)) 0%,rgb(var(--ax-color-success-500)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) 100%)}.ax-range-slider.ax-warning-default input{background:linear-gradient(to right,rgb(var(--ax-color-warning-500)) 0%,rgb(var(--ax-color-warning-500)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) 100%)}.ax-range-slider.ax-danger-default input{background:linear-gradient(to right,rgb(var(--ax-color-danger-500)) 0%,rgb(var(--ax-color-danger-500)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) var(--ax-current-value),rgb(var(--ax-color-on-surface)) 100%)}\n"] }]
|
103
103
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }]; }, propDecorators: { minValue: [{
|
104
104
|
type: Input
|
105
105
|
}], maxValue: [{
|
@@ -140,4 +140,3 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
|
|
140
140
|
|
141
141
|
export { AXRangeSliderComponent, AXRangeSliderModule };
|
142
142
|
//# sourceMappingURL=acorex-components-range-slider.mjs.map
|
143
|
-
//# sourceMappingURL=acorex-components-range-slider.mjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"acorex-components-range-slider.mjs","sources":["../../../../projects/acorex/components/range-slider/src/range-slider.component.ts","../../../../projects/acorex/components/range-slider/src/range-slider.component.html","../../../../projects/acorex/components/range-slider/src/range-slider.module.ts","../../../../projects/acorex/components/range-slider/acorex-components-range-slider.ts"],"sourcesContent":["import {\r\n Component,\r\n ViewEncapsulation,\r\n ChangeDetectionStrategy,\r\n ElementRef,\r\n ChangeDetectorRef,\r\n Input,\r\n EventEmitter,\r\n HostBinding,\r\n Output,\r\n NgZone,\r\n} from '@angular/core';\r\n\r\nimport {\r\n AXStyleColorType,\r\n AXValuableComponent,\r\n} from '@acorex/components/common';\r\nimport {\r\n AXBaseValueComponentMixin,\r\n AXComponentOptionChanged,\r\n} from '@acorex/components/mixin';\r\n\r\n@Component({\r\n selector: 'ax-range-slider',\r\n templateUrl: './range-slider.component.html',\r\n styleUrls: ['./range-slider.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n inputs: ['readonly', 'allowNull', 'value', 'name', 'checked'],\r\n outputs: ['valueChange', 'onValueChanged'],\r\n host: { class: 'ax-range-slider' },\r\n encapsulation: ViewEncapsulation.None,\r\n providers: [\r\n { provide: AXValuableComponent, useExisting: AXRangeSliderComponent },\r\n ],\r\n})\r\nexport class AXRangeSliderComponent extends AXBaseValueComponentMixin {\r\n constructor(\r\n elementRef: ElementRef,\r\n cdr: ChangeDetectorRef,\r\n private _zone: NgZone\r\n ) {\r\n super(elementRef, cdr);\r\n }\r\n\r\n private _minValue: number = 0;\r\n /**\r\n * Specifies the smallest value that is valid\r\n */\r\n @Input()\r\n public get minValue(): number {\r\n return this._minValue ?? 0;\r\n }\r\n public set minValue(v: number) {\r\n this._setOption({\r\n name: 'minValue',\r\n value: v != null ? Number(v) : 0,\r\n });\r\n }\r\n\r\n private _maxValue: number = 100;\r\n /**\r\n * Specifies the greatest value that is valid\r\n */\r\n @Input()\r\n public get maxValue(): number {\r\n return this._maxValue ?? 100;\r\n }\r\n public set maxValue(v: number) {\r\n this._setOption({\r\n name: 'maxValue',\r\n value: v != null ? Number(v) : 100,\r\n });\r\n }\r\n\r\n private _step: number = 1;\r\n /**\r\n * Specifies the greatest value that is valid\r\n */\r\n @Input()\r\n public get step(): number {\r\n return this._step ?? 100;\r\n }\r\n public set step(v: number) {\r\n this._setOption({\r\n name: 'step',\r\n value: v != null ? Number(v) : 1,\r\n });\r\n }\r\n\r\n @Output()\r\n colorChange: EventEmitter<AXStyleColorType> = new EventEmitter();\r\n _color: AXStyleColorType = 'primary';\r\n /**\r\n * Predefined color schemes\r\n */\r\n @Input()\r\n get color(): AXStyleColorType {\r\n return this._color;\r\n }\r\n set color(value: AXStyleColorType) {\r\n this._setOption({\r\n name: 'color',\r\n value,\r\n afterCallback: () => {\r\n this._cdr.markForCheck();\r\n },\r\n });\r\n }\r\n\r\n @Input() oriantaion: 'vertical' | 'horizontal' = 'horizontal';\r\n\r\n onViewInit() {\r\n this._calcVars();\r\n this.value = this.value ?? (this.maxValue - this.minValue) / 2;\r\n }\r\n\r\n _onValueChanged(oldValue: number, newValue: number) {\r\n this._calcVars();\r\n }\r\n\r\n _onOptionChanged(e: AXComponentOptionChanged) {\r\n this._calcVars();\r\n }\r\n\r\n private _calcVars() {\r\n this._zone.runOutsideAngular(() => {\r\n const per =\r\n (((this.value ?? 0) - this.minValue) /\r\n (this.maxValue - this.minValue)) *\r\n 100 -\r\n 0.1;\r\n this._getHostElement().style.setProperty('--ax-current-value', `${per}%`);\r\n });\r\n }\r\n\r\n @HostBinding('class')\r\n private get __hostClass(): string {\r\n return `ax-${this.color}-default ax-${this.oriantaion}`;\r\n }\r\n}\r\n","<input type=\"range\" [min]=\"minValue\" [max]=\"maxValue\" [(ngModel)]=\"value\" [step]=\"step\">","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { AXRangeSliderComponent } from './range-slider.component';\r\nimport { FormsModule } from '@angular/forms';\r\n\r\nconst COMPONENT = [AXRangeSliderComponent];\r\nconst MODULES = [CommonModule,FormsModule];\r\n\r\n@NgModule({\r\n declarations: [...COMPONENT],\r\n imports: [...MODULES],\r\n exports: [...COMPONENT],\r\n providers: [],\r\n})\r\nexport class AXRangeSliderModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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
|
1
|
+
{"version":3,"file":"acorex-components-range-slider.mjs","sources":["../../../../projects/acorex/components/range-slider/src/range-slider.component.ts","../../../../projects/acorex/components/range-slider/src/range-slider.component.html","../../../../projects/acorex/components/range-slider/src/range-slider.module.ts","../../../../projects/acorex/components/range-slider/acorex-components-range-slider.ts"],"sourcesContent":["import {\r\n Component,\r\n ViewEncapsulation,\r\n ChangeDetectionStrategy,\r\n ElementRef,\r\n ChangeDetectorRef,\r\n Input,\r\n EventEmitter,\r\n HostBinding,\r\n Output,\r\n NgZone,\r\n} from '@angular/core';\r\n\r\nimport {\r\n AXStyleColorType,\r\n AXValuableComponent,\r\n} from '@acorex/components/common';\r\nimport {\r\n AXBaseValueComponentMixin,\r\n AXComponentOptionChanged,\r\n} from '@acorex/components/mixin';\r\n\r\n@Component({\r\n selector: 'ax-range-slider',\r\n templateUrl: './range-slider.component.html',\r\n styleUrls: ['./range-slider.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n inputs: ['readonly', 'allowNull', 'value', 'name', 'checked'],\r\n outputs: ['valueChange', 'onValueChanged'],\r\n host: { class: 'ax-range-slider' },\r\n encapsulation: ViewEncapsulation.None,\r\n providers: [\r\n { provide: AXValuableComponent, useExisting: AXRangeSliderComponent },\r\n ],\r\n})\r\nexport class AXRangeSliderComponent extends AXBaseValueComponentMixin {\r\n constructor(\r\n elementRef: ElementRef,\r\n cdr: ChangeDetectorRef,\r\n private _zone: NgZone\r\n ) {\r\n super(elementRef, cdr);\r\n }\r\n\r\n private _minValue: number = 0;\r\n /**\r\n * Specifies the smallest value that is valid\r\n */\r\n @Input()\r\n public get minValue(): number {\r\n return this._minValue ?? 0;\r\n }\r\n public set minValue(v: number) {\r\n this._setOption({\r\n name: 'minValue',\r\n value: v != null ? Number(v) : 0,\r\n });\r\n }\r\n\r\n private _maxValue: number = 100;\r\n /**\r\n * Specifies the greatest value that is valid\r\n */\r\n @Input()\r\n public get maxValue(): number {\r\n return this._maxValue ?? 100;\r\n }\r\n public set maxValue(v: number) {\r\n this._setOption({\r\n name: 'maxValue',\r\n value: v != null ? Number(v) : 100,\r\n });\r\n }\r\n\r\n private _step: number = 1;\r\n /**\r\n * Specifies the greatest value that is valid\r\n */\r\n @Input()\r\n public get step(): number {\r\n return this._step ?? 100;\r\n }\r\n public set step(v: number) {\r\n this._setOption({\r\n name: 'step',\r\n value: v != null ? Number(v) : 1,\r\n });\r\n }\r\n\r\n @Output()\r\n colorChange: EventEmitter<AXStyleColorType> = new EventEmitter();\r\n _color: AXStyleColorType = 'primary';\r\n /**\r\n * Predefined color schemes\r\n */\r\n @Input()\r\n get color(): AXStyleColorType {\r\n return this._color;\r\n }\r\n set color(value: AXStyleColorType) {\r\n this._setOption({\r\n name: 'color',\r\n value,\r\n afterCallback: () => {\r\n this._cdr.markForCheck();\r\n },\r\n });\r\n }\r\n\r\n @Input() oriantaion: 'vertical' | 'horizontal' = 'horizontal';\r\n\r\n onViewInit() {\r\n this._calcVars();\r\n this.value = this.value ?? (this.maxValue - this.minValue) / 2;\r\n }\r\n\r\n _onValueChanged(oldValue: number, newValue: number) {\r\n this._calcVars();\r\n }\r\n\r\n _onOptionChanged(e: AXComponentOptionChanged) {\r\n this._calcVars();\r\n }\r\n\r\n private _calcVars() {\r\n this._zone.runOutsideAngular(() => {\r\n const per =\r\n (((this.value ?? 0) - this.minValue) /\r\n (this.maxValue - this.minValue)) *\r\n 100 -\r\n 0.1;\r\n this._getHostElement().style.setProperty('--ax-current-value', `${per}%`);\r\n });\r\n }\r\n\r\n @HostBinding('class')\r\n private get __hostClass(): string {\r\n return `ax-${this.color}-default ax-${this.oriantaion}`;\r\n }\r\n}\r\n","<input type=\"range\" [min]=\"minValue\" [max]=\"maxValue\" [(ngModel)]=\"value\" [step]=\"step\">","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { AXRangeSliderComponent } from './range-slider.component';\r\nimport { FormsModule } from '@angular/forms';\r\n\r\nconst COMPONENT = [AXRangeSliderComponent];\r\nconst MODULES = [CommonModule,FormsModule];\r\n\r\n@NgModule({\r\n declarations: [...COMPONENT],\r\n imports: [...MODULES],\r\n exports: [...COMPONENT],\r\n providers: [],\r\n})\r\nexport class AXRangeSliderModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
@@ -328,7 +328,7 @@ AXSelectBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", ver
|
|
328
328
|
AXSelectBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: { isOpen: "isOpen", fitParent: "fitParent", dropdownWidth: "dropdownWidth", position: "position", disabled: "disabled", tabIndex: "tabIndex", readonly: "readonly", allowNull: "allowNull", value: "value", name: "name", checked: "checked", placeholder: "placeholder", maxLength: "maxLength", type: "type", autoComplete: "autoComplete", pageSize: "pageSize", valueField: "valueField", textField: "textField", items: "items", 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", valueChanged: "valueChanged" }, host: { listeners: { "keydown": "_handleKeydown($event)" }, classAttribute: "ax-editor-container ax-drop-down" }, providers: [
|
329
329
|
{ provide: AXClosbaleComponent, useExisting: AXSelectBoxComponent },
|
330
330
|
{ provide: AXSearchableComponent, useExisting: AXSelectBoxComponent },
|
331
|
-
], 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\">\r\n</ng-content>\r\n<div class=\"ax-dropdown-content\" [class.ax-state-disabled]=\"disabled\" (click)=\"_handleInputClickEvent($event)\">\r\n <div class=\"ax-select-box-selection\" [tabindex]=\"tabIndex\" (focus)=\"_emitOnFocusEvent($event)\"\r\n (blur)=\"_emitOnBlurEvent($event)\">\r\n <ng-container *ngIf=\"selectedItems && selectedItems.length; else showPlaceholder\">\r\n <ng-container *ngIf=\"!multiple; then singleSelectedTemplate; else multipleSelectedTemplate\"></ng-container>\r\n <ng-template #singleSelectedTemplate>\r\n <ng-container *ngFor=\"let item of selectedItems\">\r\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n </ng-container>\r\n </ng-template>\r\n <ng-template #multipleSelectedTemplate>\r\n <ng-container *ngFor=\"let item of selectedItems\">\r\n <div class=\"ax-select-multi-item\">\r\n {{_getItemDisplayTextTemplte(item)}}\r\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event,item)\">\r\n </span>\r\n </div>\r\n </ng-container>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #showPlaceholder>\r\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\"> {{placeholder}}</div>\r\n </ng-template>\r\n </div>\r\n</div>\r\n<ax-button color=\"light\" look=\"blank\" (onClick)=\"clear()\" [tabIndex]=\"-1\"\r\n *ngIf=\"value && clearButton && !(disabled || readonly)\">\r\n <ax-icon icon=\"ax-icon ax-icon-close\"></ax-icon>\r\n</ax-button>\r\n<button [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-editor-control\"\r\n (click)=\"_handleArrowClickEvent($event)\">\r\n <ng-container *ngIf=\"isLoading && !this.popover.isOpen; else iconTemplate\">\r\n <ax-loading type=\"spinner\"></ax-loading>\r\n </ng-container>\r\n <ng-template #iconTemplate>\r\n <span class=\"ax-icon ax-icon-chevron-left ax-transition-all\" [ngClass]=\"{'-ax-rotate-90': !isOpen, 'ax-rotate-90':isOpen}\"></span>\r\n </ng-template>\r\n</button>\r\n<ng-content select=\"ax-validation-rule\">\r\n</ng-content>\r\n<ng-content select=\"ax-suffix\">\r\n</ng-content>\r\n<ax-popover [target]=\"_target\" [position]=\"position\" [openTrigger]=\"'manual'\" [closeTrigger]=\"'clickout'\"\r\n [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\">\r\n <div class=\"ax-overlay-pane\" (keydown)=\"_handlePopoverKeydown($event)\" tabindex=\"0\" aria-modal=\"true\" cdkTrapFocus\r\n [class.ax-overlay-actionsheet]=\"_isMobile\" [class.ax-full]=\"_searchBox || isLazy\"\r\n [style.min-width.px]=\"_popoverWidth\">\r\n <div class=\"ax-list\">\r\n <ax-header *ngIf=\"_isMobile && placeholder\">\r\n <ax-title [text]=\"_popoverTitle\"></ax-title>\r\n <ax-close-button class=\"ax-icon\" [icon]=\"multiple?'ax-icon-done !ax-text-primary-500':'ax-icon-close'\"></ax-close-button>\r\n </ax-header>\r\n <div class=\"ax-search-box-container\" [class.ax-state-hidden]=\"!_searchBox\" [cdkTrapFocus]=\"_searchBox!=null\">\r\n <ng-content select=\"ax-search-box\"></ng-content>\r\n </div>\r\n <div class=\"ax-content ax-list-items-container ax-default\" (scroll)=\"_handleListScroll($event)\"\r\n #listContainer>\r\n <ng-container *ngIf=\"displayItems.length; else tmpEmpty\">\r\n <ul>\r\n <ng-container *ngTemplateOutlet=\"tmpTree; context:{ list: displayItems }\">\r\n </ng-container>\r\n <ng-template #tmpTree let-list=\"list\">\r\n <ng-container *ngFor=\"let item of list;let i = index;trackBy : _trackByFunction\">\r\n <ng-container *ngIf=\"itemTemplate; else defualtTemplate\">\r\n <li class=\"ax-list-item\" (click)=\"_handleOnItemClick($event,item)\"\r\n [attr.data-id]=\"item[this.valueField]\">\r\n <ng-container\r\n *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item,direction:direction}\">\r\n </ng-container>\r\n </li>\r\n </ng-container>\r\n <ng-template #defualtTemplate>\r\n <ng-container *ngIf=\"item.children?.length > 0;else tmpItem\">\r\n <li class=\"ax-list-item-group\" [attr.data-id]=\"item[this.valueField]\">\r\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n <ul *ngIf=\"item.children?.length > 0\">\r\n <ng-container\r\n *ngTemplateOutlet=\"tmpTree; context:{ list: item.children }\">\r\n </ng-container>\r\n </ul>\r\n </li>\r\n </ng-container>\r\n <ng-template #tmpItem>\r\n <ng-container *ngIf=\"!multiple; else multipleTemplate\">\r\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\r\n [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\r\n (click)=\"_handleOnItemClick($event,item)\"\r\n [attr.data-id]=\"item[this.valueField]\">\r\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n </li>\r\n </ng-container>\r\n <ng-template #multipleTemplate>\r\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\r\n [class.ax-state-disabled]=\"isItemDisabled(item)\"\r\n [class.ax-check-box]=\"checkbox\" [attr.tabindex]=\"i\"\r\n (click)=\"_handleOnItemClick($event,item)\"\r\n [attr.data-id]=\"item[this.valueField]\">\r\n <input class=\"ax-checkbox\" type=\"checkbox\"\r\n [class.ax-state-disabled]=\"isItemDisabled(item)\" *ngIf=\"checkbox\"\r\n [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\">\r\n <span class=\"ax-ms-2\"> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n </li>\r\n </ng-template>\r\n </ng-template>\r\n </ng-template>\r\n </ng-container>\r\n </ng-template>\r\n </ul>\r\n </ng-container>\r\n <ng-container *ngIf=\"isLoading\">\r\n <ng-container *ngIf=\"loadingTemplate; else elseLoadingTemplate\">\r\n <ng-container *ngTemplateOutlet=\"loadingTemplate\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #elseLoadingTemplate>\r\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\r\n <ax-loading text=\"{{ 'layout.loading.text' | trans }}\"></ax-loading>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #tmpEmpty>\r\n <ng-container *ngIf=\"!isLoading\">\r\n <ng-container *ngIf=\"emptyTemplate; else elseEmptyTemplate\">\r\n <ng-container *ngTemplateOutlet=\"emptyTemplate\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #elseEmptyTemplate>\r\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\"\r\n [innerHTML]=\"'common.no-result-for' | trans:{exp:this._searchBox? this._searchBox.searchExp :''}\">\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n </ng-template>\r\n\r\n </div>\r\n <!-- <div class=\"ax-list-items-container ax-vertical ax-default\" [class.ax-full]=\"_isMobile\"\r\n >\r\n \r\n </div> -->\r\n <!-- <div class=\"ax-footer\">footer</div> -->\r\n </div>\r\n </div>\r\n</ax-popover>", styles: ["ax-select-box .ax-select-multi-item{display:flex;align-items:center;padding:.25rem .5rem;background-color:rgb(var(--ax-color-ghost),.05);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;padding:0 .5rem}ax-select-box .ax-select-box-selection .ax-selectbox-input{opacity:0;width:0}\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.AXDecoratorHeaderComponent, selector: "ax-header" }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorTitleComponent, selector: "ax-title", inputs: ["text"] }, { kind: "component", type: i3.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i4.AXPopoverComponent, selector: "ax-popover", inputs: ["target", "position", "openTrigger", "closeTrigger", "hasBackdrop", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i5.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange"] }, { kind: "component", type: i6.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "text"], outputs: ["visibleChange"] }, { kind: "directive", type: i7.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "pipe", type: i8.AXTranslatorPipe, name: "trans" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
331
|
+
], 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\">\r\n</ng-content>\r\n<div class=\"ax-dropdown-content\" [class.ax-state-disabled]=\"disabled\" (click)=\"_handleInputClickEvent($event)\">\r\n <div class=\"ax-select-box-selection\" [tabindex]=\"tabIndex\" (focus)=\"_emitOnFocusEvent($event)\"\r\n (blur)=\"_emitOnBlurEvent($event)\">\r\n <ng-container *ngIf=\"selectedItems && selectedItems.length; else showPlaceholder\">\r\n <ng-container *ngIf=\"!multiple; then singleSelectedTemplate; else multipleSelectedTemplate\"></ng-container>\r\n <ng-template #singleSelectedTemplate>\r\n <ng-container *ngFor=\"let item of selectedItems\">\r\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n </ng-container>\r\n </ng-template>\r\n <ng-template #multipleSelectedTemplate>\r\n <ng-container *ngFor=\"let item of selectedItems\">\r\n <div class=\"ax-select-multi-item\">\r\n {{_getItemDisplayTextTemplte(item)}}\r\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event,item)\">\r\n </span>\r\n </div>\r\n </ng-container>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #showPlaceholder>\r\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\"> {{placeholder}}</div>\r\n </ng-template>\r\n </div>\r\n</div>\r\n<ax-button color=\"light\" look=\"blank\" (onClick)=\"clear()\" [tabIndex]=\"-1\"\r\n *ngIf=\"value && clearButton && !(disabled || readonly)\">\r\n <ax-icon icon=\"ax-icon ax-icon-close\"></ax-icon>\r\n</ax-button>\r\n<button [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-editor-control\"\r\n (click)=\"_handleArrowClickEvent($event)\">\r\n <ng-container *ngIf=\"isLoading && !this.popover.isOpen; else iconTemplate\">\r\n <ax-loading type=\"spinner\"></ax-loading>\r\n </ng-container>\r\n <ng-template #iconTemplate>\r\n <span class=\"ax-icon ax-icon-chevron-left ax-transition-all\" [ngClass]=\"{'-ax-rotation-90': !isOpen, 'ax-rotation-90':isOpen}\"></span>\r\n </ng-template>\r\n</button>\r\n<ng-content select=\"ax-validation-rule\">\r\n</ng-content>\r\n<ng-content select=\"ax-suffix\">\r\n</ng-content>\r\n<ax-popover [target]=\"_target\" [position]=\"position\" [openTrigger]=\"'manual'\" [closeTrigger]=\"'clickout'\"\r\n [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\">\r\n <div class=\"ax-overlay-pane\" (keydown)=\"_handlePopoverKeydown($event)\" tabindex=\"0\" aria-modal=\"true\" cdkTrapFocus\r\n [class.ax-overlay-actionsheet]=\"_isMobile\" [class.ax-full]=\"_searchBox || isLazy\"\r\n [style.min-width.px]=\"_popoverWidth\">\r\n <div class=\"ax-list\">\r\n <ax-header *ngIf=\"_isMobile && placeholder\">\r\n <ax-title [text]=\"_popoverTitle\"></ax-title>\r\n <ax-close-button class=\"ax-icon\" [icon]=\"multiple?'ax-icon-done !ax-text-primary-500':'ax-icon-close'\"></ax-close-button>\r\n </ax-header>\r\n <div class=\"ax-search-box-container\" [class.ax-state-hidden]=\"!_searchBox\" [cdkTrapFocus]=\"_searchBox!=null\">\r\n <ng-content select=\"ax-search-box\"></ng-content>\r\n </div>\r\n <div class=\"ax-content ax-list-items-container ax-default\" (scroll)=\"_handleListScroll($event)\"\r\n #listContainer>\r\n <ng-container *ngIf=\"displayItems.length; else tmpEmpty\">\r\n <ul>\r\n <ng-container *ngTemplateOutlet=\"tmpTree; context:{ list: displayItems }\">\r\n </ng-container>\r\n <ng-template #tmpTree let-list=\"list\">\r\n <ng-container *ngFor=\"let item of list;let i = index;trackBy : _trackByFunction\">\r\n <ng-container *ngIf=\"itemTemplate; else defualtTemplate\">\r\n <li class=\"ax-list-item\" (click)=\"_handleOnItemClick($event,item)\"\r\n [attr.data-id]=\"item[this.valueField]\">\r\n <ng-container\r\n *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item,direction:direction}\">\r\n </ng-container>\r\n </li>\r\n </ng-container>\r\n <ng-template #defualtTemplate>\r\n <ng-container *ngIf=\"item.children?.length > 0;else tmpItem\">\r\n <li class=\"ax-list-item-group\" [attr.data-id]=\"item[this.valueField]\">\r\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n <ul *ngIf=\"item.children?.length > 0\">\r\n <ng-container\r\n *ngTemplateOutlet=\"tmpTree; context:{ list: item.children }\">\r\n </ng-container>\r\n </ul>\r\n </li>\r\n </ng-container>\r\n <ng-template #tmpItem>\r\n <ng-container *ngIf=\"!multiple; else multipleTemplate\">\r\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\r\n [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\r\n (click)=\"_handleOnItemClick($event,item)\"\r\n [attr.data-id]=\"item[this.valueField]\">\r\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n </li>\r\n </ng-container>\r\n <ng-template #multipleTemplate>\r\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\r\n [class.ax-state-disabled]=\"isItemDisabled(item)\"\r\n [class.ax-check-box]=\"checkbox\" [attr.tabindex]=\"i\"\r\n (click)=\"_handleOnItemClick($event,item)\"\r\n [attr.data-id]=\"item[this.valueField]\">\r\n <input class=\"ax-checkbox\" type=\"checkbox\"\r\n [class.ax-state-disabled]=\"isItemDisabled(item)\" *ngIf=\"checkbox\"\r\n [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\">\r\n <span class=\"ax-ms-2\"> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n </li>\r\n </ng-template>\r\n </ng-template>\r\n </ng-template>\r\n </ng-container>\r\n </ng-template>\r\n </ul>\r\n </ng-container>\r\n <ng-container *ngIf=\"isLoading\">\r\n <ng-container *ngIf=\"loadingTemplate; else elseLoadingTemplate\">\r\n <ng-container *ngTemplateOutlet=\"loadingTemplate\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #elseLoadingTemplate>\r\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\r\n <ax-loading text=\"{{ 'layout.loading.text' | trans }}\"></ax-loading>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #tmpEmpty>\r\n <ng-container *ngIf=\"!isLoading\">\r\n <ng-container *ngIf=\"emptyTemplate; else elseEmptyTemplate\">\r\n <ng-container *ngTemplateOutlet=\"emptyTemplate\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #elseEmptyTemplate>\r\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\"\r\n [innerHTML]=\"'common.no-result-for' | trans:{exp:this._searchBox? this._searchBox.searchExp :''}\">\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n </ng-template>\r\n\r\n </div>\r\n <!-- <div class=\"ax-list-items-container ax-vertical ax-default\" [class.ax-full]=\"_isMobile\"\r\n >\r\n \r\n </div> -->\r\n <!-- <div class=\"ax-footer\">footer</div> -->\r\n </div>\r\n </div>\r\n</ax-popover>", styles: ["ax-select-box .ax-select-multi-item{display:flex;align-items:center;padding:.25rem .5rem;background-color:rgb(var(--ax-color-ghost),.05);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;padding:0 .5rem}ax-select-box .ax-select-box-selection .ax-selectbox-input{opacity:0;width:0}\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.AXDecoratorHeaderComponent, selector: "ax-header" }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorTitleComponent, selector: "ax-title", inputs: ["text"] }, { kind: "component", type: i3.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i4.AXPopoverComponent, selector: "ax-popover", inputs: ["target", "position", "openTrigger", "closeTrigger", "hasBackdrop", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: i5.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange"] }, { kind: "component", type: i6.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "text"], outputs: ["visibleChange"] }, { kind: "directive", type: i7.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "pipe", type: i8.AXTranslatorPipe, name: "trans" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
332
332
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AXSelectBoxComponent, decorators: [{
|
333
333
|
type: Component,
|
334
334
|
args: [{ selector: 'ax-select-box', inputs: [
|
@@ -352,7 +352,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
|
|
352
352
|
], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
353
353
|
{ provide: AXClosbaleComponent, useExisting: AXSelectBoxComponent },
|
354
354
|
{ provide: AXSearchableComponent, useExisting: AXSelectBoxComponent },
|
355
|
-
], host: { class: 'ax-editor-container ax-drop-down' }, template: "<ng-content select=\"ax-prefix\">\r\n</ng-content>\r\n<div class=\"ax-dropdown-content\" [class.ax-state-disabled]=\"disabled\" (click)=\"_handleInputClickEvent($event)\">\r\n <div class=\"ax-select-box-selection\" [tabindex]=\"tabIndex\" (focus)=\"_emitOnFocusEvent($event)\"\r\n (blur)=\"_emitOnBlurEvent($event)\">\r\n <ng-container *ngIf=\"selectedItems && selectedItems.length; else showPlaceholder\">\r\n <ng-container *ngIf=\"!multiple; then singleSelectedTemplate; else multipleSelectedTemplate\"></ng-container>\r\n <ng-template #singleSelectedTemplate>\r\n <ng-container *ngFor=\"let item of selectedItems\">\r\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n </ng-container>\r\n </ng-template>\r\n <ng-template #multipleSelectedTemplate>\r\n <ng-container *ngFor=\"let item of selectedItems\">\r\n <div class=\"ax-select-multi-item\">\r\n {{_getItemDisplayTextTemplte(item)}}\r\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event,item)\">\r\n </span>\r\n </div>\r\n </ng-container>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #showPlaceholder>\r\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\"> {{placeholder}}</div>\r\n </ng-template>\r\n </div>\r\n</div>\r\n<ax-button color=\"light\" look=\"blank\" (onClick)=\"clear()\" [tabIndex]=\"-1\"\r\n *ngIf=\"value && clearButton && !(disabled || readonly)\">\r\n <ax-icon icon=\"ax-icon ax-icon-close\"></ax-icon>\r\n</ax-button>\r\n<button [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-editor-control\"\r\n (click)=\"_handleArrowClickEvent($event)\">\r\n <ng-container *ngIf=\"isLoading && !this.popover.isOpen; else iconTemplate\">\r\n <ax-loading type=\"spinner\"></ax-loading>\r\n </ng-container>\r\n <ng-template #iconTemplate>\r\n <span class=\"ax-icon ax-icon-chevron-left ax-transition-all\" [ngClass]=\"{'-ax-rotate-90': !isOpen, 'ax-rotate-90':isOpen}\"></span>\r\n </ng-template>\r\n</button>\r\n<ng-content select=\"ax-validation-rule\">\r\n</ng-content>\r\n<ng-content select=\"ax-suffix\">\r\n</ng-content>\r\n<ax-popover [target]=\"_target\" [position]=\"position\" [openTrigger]=\"'manual'\" [closeTrigger]=\"'clickout'\"\r\n [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\">\r\n <div class=\"ax-overlay-pane\" (keydown)=\"_handlePopoverKeydown($event)\" tabindex=\"0\" aria-modal=\"true\" cdkTrapFocus\r\n [class.ax-overlay-actionsheet]=\"_isMobile\" [class.ax-full]=\"_searchBox || isLazy\"\r\n [style.min-width.px]=\"_popoverWidth\">\r\n <div class=\"ax-list\">\r\n <ax-header *ngIf=\"_isMobile && placeholder\">\r\n <ax-title [text]=\"_popoverTitle\"></ax-title>\r\n <ax-close-button class=\"ax-icon\" [icon]=\"multiple?'ax-icon-done !ax-text-primary-500':'ax-icon-close'\"></ax-close-button>\r\n </ax-header>\r\n <div class=\"ax-search-box-container\" [class.ax-state-hidden]=\"!_searchBox\" [cdkTrapFocus]=\"_searchBox!=null\">\r\n <ng-content select=\"ax-search-box\"></ng-content>\r\n </div>\r\n <div class=\"ax-content ax-list-items-container ax-default\" (scroll)=\"_handleListScroll($event)\"\r\n #listContainer>\r\n <ng-container *ngIf=\"displayItems.length; else tmpEmpty\">\r\n <ul>\r\n <ng-container *ngTemplateOutlet=\"tmpTree; context:{ list: displayItems }\">\r\n </ng-container>\r\n <ng-template #tmpTree let-list=\"list\">\r\n <ng-container *ngFor=\"let item of list;let i = index;trackBy : _trackByFunction\">\r\n <ng-container *ngIf=\"itemTemplate; else defualtTemplate\">\r\n <li class=\"ax-list-item\" (click)=\"_handleOnItemClick($event,item)\"\r\n [attr.data-id]=\"item[this.valueField]\">\r\n <ng-container\r\n *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item,direction:direction}\">\r\n </ng-container>\r\n </li>\r\n </ng-container>\r\n <ng-template #defualtTemplate>\r\n <ng-container *ngIf=\"item.children?.length > 0;else tmpItem\">\r\n <li class=\"ax-list-item-group\" [attr.data-id]=\"item[this.valueField]\">\r\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n <ul *ngIf=\"item.children?.length > 0\">\r\n <ng-container\r\n *ngTemplateOutlet=\"tmpTree; context:{ list: item.children }\">\r\n </ng-container>\r\n </ul>\r\n </li>\r\n </ng-container>\r\n <ng-template #tmpItem>\r\n <ng-container *ngIf=\"!multiple; else multipleTemplate\">\r\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\r\n [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\r\n (click)=\"_handleOnItemClick($event,item)\"\r\n [attr.data-id]=\"item[this.valueField]\">\r\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n </li>\r\n </ng-container>\r\n <ng-template #multipleTemplate>\r\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\r\n [class.ax-state-disabled]=\"isItemDisabled(item)\"\r\n [class.ax-check-box]=\"checkbox\" [attr.tabindex]=\"i\"\r\n (click)=\"_handleOnItemClick($event,item)\"\r\n [attr.data-id]=\"item[this.valueField]\">\r\n <input class=\"ax-checkbox\" type=\"checkbox\"\r\n [class.ax-state-disabled]=\"isItemDisabled(item)\" *ngIf=\"checkbox\"\r\n [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\">\r\n <span class=\"ax-ms-2\"> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n </li>\r\n </ng-template>\r\n </ng-template>\r\n </ng-template>\r\n </ng-container>\r\n </ng-template>\r\n </ul>\r\n </ng-container>\r\n <ng-container *ngIf=\"isLoading\">\r\n <ng-container *ngIf=\"loadingTemplate; else elseLoadingTemplate\">\r\n <ng-container *ngTemplateOutlet=\"loadingTemplate\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #elseLoadingTemplate>\r\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\r\n <ax-loading text=\"{{ 'layout.loading.text' | trans }}\"></ax-loading>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #tmpEmpty>\r\n <ng-container *ngIf=\"!isLoading\">\r\n <ng-container *ngIf=\"emptyTemplate; else elseEmptyTemplate\">\r\n <ng-container *ngTemplateOutlet=\"emptyTemplate\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #elseEmptyTemplate>\r\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\"\r\n [innerHTML]=\"'common.no-result-for' | trans:{exp:this._searchBox? this._searchBox.searchExp :''}\">\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n </ng-template>\r\n\r\n </div>\r\n <!-- <div class=\"ax-list-items-container ax-vertical ax-default\" [class.ax-full]=\"_isMobile\"\r\n >\r\n \r\n </div> -->\r\n <!-- <div class=\"ax-footer\">footer</div> -->\r\n </div>\r\n </div>\r\n</ax-popover>", styles: ["ax-select-box .ax-select-multi-item{display:flex;align-items:center;padding:.25rem .5rem;background-color:rgb(var(--ax-color-ghost),.05);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;padding:0 .5rem}ax-select-box .ax-select-box-selection .ax-selectbox-input{opacity:0;width:0}\n"] }]
|
355
|
+
], host: { class: 'ax-editor-container ax-drop-down' }, template: "<ng-content select=\"ax-prefix\">\r\n</ng-content>\r\n<div class=\"ax-dropdown-content\" [class.ax-state-disabled]=\"disabled\" (click)=\"_handleInputClickEvent($event)\">\r\n <div class=\"ax-select-box-selection\" [tabindex]=\"tabIndex\" (focus)=\"_emitOnFocusEvent($event)\"\r\n (blur)=\"_emitOnBlurEvent($event)\">\r\n <ng-container *ngIf=\"selectedItems && selectedItems.length; else showPlaceholder\">\r\n <ng-container *ngIf=\"!multiple; then singleSelectedTemplate; else multipleSelectedTemplate\"></ng-container>\r\n <ng-template #singleSelectedTemplate>\r\n <ng-container *ngFor=\"let item of selectedItems\">\r\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n </ng-container>\r\n </ng-template>\r\n <ng-template #multipleSelectedTemplate>\r\n <ng-container *ngFor=\"let item of selectedItems\">\r\n <div class=\"ax-select-multi-item\">\r\n {{_getItemDisplayTextTemplte(item)}}\r\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event,item)\">\r\n </span>\r\n </div>\r\n </ng-container>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #showPlaceholder>\r\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\"> {{placeholder}}</div>\r\n </ng-template>\r\n </div>\r\n</div>\r\n<ax-button color=\"light\" look=\"blank\" (onClick)=\"clear()\" [tabIndex]=\"-1\"\r\n *ngIf=\"value && clearButton && !(disabled || readonly)\">\r\n <ax-icon icon=\"ax-icon ax-icon-close\"></ax-icon>\r\n</ax-button>\r\n<button [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-editor-control\"\r\n (click)=\"_handleArrowClickEvent($event)\">\r\n <ng-container *ngIf=\"isLoading && !this.popover.isOpen; else iconTemplate\">\r\n <ax-loading type=\"spinner\"></ax-loading>\r\n </ng-container>\r\n <ng-template #iconTemplate>\r\n <span class=\"ax-icon ax-icon-chevron-left ax-transition-all\" [ngClass]=\"{'-ax-rotation-90': !isOpen, 'ax-rotation-90':isOpen}\"></span>\r\n </ng-template>\r\n</button>\r\n<ng-content select=\"ax-validation-rule\">\r\n</ng-content>\r\n<ng-content select=\"ax-suffix\">\r\n</ng-content>\r\n<ax-popover [target]=\"_target\" [position]=\"position\" [openTrigger]=\"'manual'\" [closeTrigger]=\"'clickout'\"\r\n [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\">\r\n <div class=\"ax-overlay-pane\" (keydown)=\"_handlePopoverKeydown($event)\" tabindex=\"0\" aria-modal=\"true\" cdkTrapFocus\r\n [class.ax-overlay-actionsheet]=\"_isMobile\" [class.ax-full]=\"_searchBox || isLazy\"\r\n [style.min-width.px]=\"_popoverWidth\">\r\n <div class=\"ax-list\">\r\n <ax-header *ngIf=\"_isMobile && placeholder\">\r\n <ax-title [text]=\"_popoverTitle\"></ax-title>\r\n <ax-close-button class=\"ax-icon\" [icon]=\"multiple?'ax-icon-done !ax-text-primary-500':'ax-icon-close'\"></ax-close-button>\r\n </ax-header>\r\n <div class=\"ax-search-box-container\" [class.ax-state-hidden]=\"!_searchBox\" [cdkTrapFocus]=\"_searchBox!=null\">\r\n <ng-content select=\"ax-search-box\"></ng-content>\r\n </div>\r\n <div class=\"ax-content ax-list-items-container ax-default\" (scroll)=\"_handleListScroll($event)\"\r\n #listContainer>\r\n <ng-container *ngIf=\"displayItems.length; else tmpEmpty\">\r\n <ul>\r\n <ng-container *ngTemplateOutlet=\"tmpTree; context:{ list: displayItems }\">\r\n </ng-container>\r\n <ng-template #tmpTree let-list=\"list\">\r\n <ng-container *ngFor=\"let item of list;let i = index;trackBy : _trackByFunction\">\r\n <ng-container *ngIf=\"itemTemplate; else defualtTemplate\">\r\n <li class=\"ax-list-item\" (click)=\"_handleOnItemClick($event,item)\"\r\n [attr.data-id]=\"item[this.valueField]\">\r\n <ng-container\r\n *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item,direction:direction}\">\r\n </ng-container>\r\n </li>\r\n </ng-container>\r\n <ng-template #defualtTemplate>\r\n <ng-container *ngIf=\"item.children?.length > 0;else tmpItem\">\r\n <li class=\"ax-list-item-group\" [attr.data-id]=\"item[this.valueField]\">\r\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n <ul *ngIf=\"item.children?.length > 0\">\r\n <ng-container\r\n *ngTemplateOutlet=\"tmpTree; context:{ list: item.children }\">\r\n </ng-container>\r\n </ul>\r\n </li>\r\n </ng-container>\r\n <ng-template #tmpItem>\r\n <ng-container *ngIf=\"!multiple; else multipleTemplate\">\r\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\r\n [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\r\n (click)=\"_handleOnItemClick($event,item)\"\r\n [attr.data-id]=\"item[this.valueField]\">\r\n <span> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n </li>\r\n </ng-container>\r\n <ng-template #multipleTemplate>\r\n <li class=\"ax-list-item\" [class.ax-state-selected]=\"isItemSelected(item)\"\r\n [class.ax-state-disabled]=\"isItemDisabled(item)\"\r\n [class.ax-check-box]=\"checkbox\" [attr.tabindex]=\"i\"\r\n (click)=\"_handleOnItemClick($event,item)\"\r\n [attr.data-id]=\"item[this.valueField]\">\r\n <input class=\"ax-checkbox\" type=\"checkbox\"\r\n [class.ax-state-disabled]=\"isItemDisabled(item)\" *ngIf=\"checkbox\"\r\n [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\">\r\n <span class=\"ax-ms-2\"> {{ _getItemDisplayTextTemplte(item) }}</span>\r\n </li>\r\n </ng-template>\r\n </ng-template>\r\n </ng-template>\r\n </ng-container>\r\n </ng-template>\r\n </ul>\r\n </ng-container>\r\n <ng-container *ngIf=\"isLoading\">\r\n <ng-container *ngIf=\"loadingTemplate; else elseLoadingTemplate\">\r\n <ng-container *ngTemplateOutlet=\"loadingTemplate\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #elseLoadingTemplate>\r\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\">\r\n <ax-loading text=\"{{ 'layout.loading.text' | trans }}\"></ax-loading>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #tmpEmpty>\r\n <ng-container *ngIf=\"!isLoading\">\r\n <ng-container *ngIf=\"emptyTemplate; else elseEmptyTemplate\">\r\n <ng-container *ngTemplateOutlet=\"emptyTemplate\">\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #elseEmptyTemplate>\r\n <div class=\"ax-flex ax-items-center ax-justify-center ax-p-4\"\r\n [innerHTML]=\"'common.no-result-for' | trans:{exp:this._searchBox? this._searchBox.searchExp :''}\">\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n </ng-template>\r\n\r\n </div>\r\n <!-- <div class=\"ax-list-items-container ax-vertical ax-default\" [class.ax-full]=\"_isMobile\"\r\n >\r\n \r\n </div> -->\r\n <!-- <div class=\"ax-footer\">footer</div> -->\r\n </div>\r\n </div>\r\n</ax-popover>", styles: ["ax-select-box .ax-select-multi-item{display:flex;align-items:center;padding:.25rem .5rem;background-color:rgb(var(--ax-color-ghost),.05);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;padding:0 .5rem}ax-select-box .ax-select-box-selection .ax-selectbox-input{opacity:0;width:0}\n"] }]
|
356
356
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i1.AXPlatform }]; }, propDecorators: { popover: [{
|
357
357
|
type: ViewChild,
|
358
358
|
args: [AXPopoverComponent, { static: true }]
|
@@ -429,4 +429,3 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
|
|
429
429
|
|
430
430
|
export { AXSelectBoxComponent, AXSelectBoxModule };
|
431
431
|
//# sourceMappingURL=acorex-components-select-box.mjs.map
|
432
|
-
//# sourceMappingURL=acorex-components-select-box.mjs.map
|