@acorex/components 7.17.27 → 7.17.29
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/esm2022/action-sheet/lib/action-sheet.component.mjs +3 -3
- package/esm2022/calendar/lib/calendar.component.mjs +3 -3
- package/esm2022/chips/lib/chips.component.mjs +3 -3
- package/esm2022/data-table/lib/columns/row-index-column.component.mjs +6 -5
- package/esm2022/datetime-picker/lib/datetime-picker.component.mjs +3 -3
- package/esm2022/dialog/lib/dialog.component.mjs +3 -3
- package/esm2022/form/lib/validation-summary.component.mjs +4 -4
- package/esm2022/list/lib/list.component.mjs +3 -3
- package/esm2022/notification/lib/notification.component.mjs +4 -3
- package/esm2022/notification/lib/notification.module.mjs +5 -2
- package/esm2022/otp/lib/otp.class.mjs +1 -1
- package/esm2022/otp/lib/otp.component.mjs +13 -10
- package/esm2022/popup/lib/popup.component.mjs +4 -3
- package/esm2022/popup/lib/popup.module.mjs +5 -2
- package/esm2022/search-box/lib/search-box.component.mjs +3 -3
- package/esm2022/select-box/lib/select-box.component.mjs +3 -3
- package/esm2022/tabs/lib/tabs.component.mjs +3 -3
- package/esm2022/toast/lib/toast.component.mjs +4 -3
- package/esm2022/toast/lib/toast.module.mjs +4 -3
- package/esm2022/uploader/lib/uploader-dialog-container.component.mjs +4 -3
- package/esm2022/uploader/lib/uploader-list.component.mjs +3 -3
- package/fesm2022/acorex-components-action-sheet.mjs +2 -2
- package/fesm2022/acorex-components-action-sheet.mjs.map +1 -1
- package/fesm2022/acorex-components-calendar.mjs +2 -2
- package/fesm2022/acorex-components-calendar.mjs.map +1 -1
- package/fesm2022/acorex-components-chips.mjs +2 -2
- package/fesm2022/acorex-components-chips.mjs.map +1 -1
- package/fesm2022/acorex-components-data-table.mjs +4 -4
- package/fesm2022/acorex-components-data-table.mjs.map +1 -1
- package/fesm2022/acorex-components-datetime-picker.mjs +2 -2
- package/fesm2022/acorex-components-datetime-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-dialog.mjs +2 -2
- package/fesm2022/acorex-components-dialog.mjs.map +1 -1
- package/fesm2022/acorex-components-form.mjs +3 -3
- package/fesm2022/acorex-components-form.mjs.map +1 -1
- package/fesm2022/acorex-components-list.mjs +2 -2
- package/fesm2022/acorex-components-list.mjs.map +1 -1
- package/fesm2022/acorex-components-notification.mjs +7 -3
- package/fesm2022/acorex-components-notification.mjs.map +1 -1
- package/fesm2022/acorex-components-otp.mjs +12 -9
- package/fesm2022/acorex-components-otp.mjs.map +1 -1
- package/fesm2022/acorex-components-popup.mjs +7 -3
- package/fesm2022/acorex-components-popup.mjs.map +1 -1
- package/fesm2022/acorex-components-search-box.mjs +2 -2
- package/fesm2022/acorex-components-search-box.mjs.map +1 -1
- package/fesm2022/acorex-components-select-box.mjs +2 -2
- package/fesm2022/acorex-components-select-box.mjs.map +1 -1
- package/fesm2022/acorex-components-tabs.mjs +2 -2
- package/fesm2022/acorex-components-tabs.mjs.map +1 -1
- package/fesm2022/acorex-components-toast.mjs +6 -4
- package/fesm2022/acorex-components-toast.mjs.map +1 -1
- package/fesm2022/acorex-components-uploader.mjs +7 -7
- package/fesm2022/acorex-components-uploader.mjs.map +1 -1
- package/notification/lib/notification.module.d.ts +2 -1
- package/otp/lib/otp.class.d.ts +1 -0
- package/package.json +1 -1
- package/popup/lib/popup.module.d.ts +2 -1
- package/toast/lib/toast.module.d.ts +2 -1
|
@@ -4,6 +4,7 @@ import { AXClosbaleComponent } from '@acorex/components/common';
|
|
|
4
4
|
import * as i0 from "@angular/core";
|
|
5
5
|
import * as i1 from "@angular/common";
|
|
6
6
|
import * as i2 from "./uploader-list.component";
|
|
7
|
+
import * as i3 from "@acorex/core/translation";
|
|
7
8
|
export class AXUploaderDialogContainerComponent {
|
|
8
9
|
constructor() {
|
|
9
10
|
this.parent = inject(AXClosbaleComponent);
|
|
@@ -16,7 +17,7 @@ export class AXUploaderDialogContainerComponent {
|
|
|
16
17
|
this.isCollapsed = !this.isCollapsed;
|
|
17
18
|
}
|
|
18
19
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AXUploaderDialogContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
19
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: AXUploaderDialogContainerComponent, selector: "ax-uploader-dialog-container", ngImport: i0, template: "<div class=\"ax-uploader-list-header\">\n <div>Uploading</div>\n <div>\n <i class=\"ax-icon\" [ngClass]=\"{ 'ax-icon-chevron-down': !isCollapsed, 'ax-icon-chevron-up': isCollapsed }\"\n (click)=\"toggle()\"></i>\n <i class=\"ax-icon ax-icon-close\" (click)=\"close()\"></i>\n </div>\n</div>\n<div [@collapse]=\"isCollapsed\">\n <ax-uploader-list></ax-uploader-list>\n</div>", styles: ["ax-uploader-dialog-container{display:block;background-color:rgba(var(--ax-color-surface));-webkit-border-top-left-radius:.75rem;-webkit-border-top-right-radius:.75rem;-moz-border-radius-topleft:.75rem;-moz-border-radius-topright:.75rem;border-top-left-radius:.75rem;border-top-right-radius:.75rem;overflow:hidden;box-shadow:-1px -1px 10px rgba(0,0,0,.16);border:1px solid;border-color:rgba(var(--ax-color-border-default));outline-color:rgba(var(--ax-color-primary-500))}ax-uploader-dialog-container .ax-uploader-list-header{display:flex;justify-content:space-between;background-color:rgba(var(--ax-color-on-surface));padding:.75rem 1rem;font-weight:500;color:rgba(var(--ax-color-on-surface-fore))}ax-uploader-dialog-container .ax-uploader-list-header .ax-icon{-webkit-margin-start:.5rem;margin-inline-start:.5rem;cursor:pointer}ax-uploader-dialog-container .ax-uploader-list-header .ax-icon:hover{opacity:.75}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.AXUploaderListComponent, selector: "ax-uploader-list" }], animations: [
|
|
20
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: AXUploaderDialogContainerComponent, selector: "ax-uploader-dialog-container", ngImport: i0, template: "<div class=\"ax-uploader-list-header\">\n <div>{{'Uploading' | translate | async }}</div>\n <div>\n <i class=\"ax-icon\" [ngClass]=\"{ 'ax-icon-chevron-down': !isCollapsed, 'ax-icon-chevron-up': isCollapsed }\"\n (click)=\"toggle()\"></i>\n <i class=\"ax-icon ax-icon-close\" (click)=\"close()\"></i>\n </div>\n</div>\n<div [@collapse]=\"isCollapsed\">\n <ax-uploader-list></ax-uploader-list>\n</div>", styles: ["ax-uploader-dialog-container{display:block;background-color:rgba(var(--ax-color-surface));-webkit-border-top-left-radius:.75rem;-webkit-border-top-right-radius:.75rem;-moz-border-radius-topleft:.75rem;-moz-border-radius-topright:.75rem;border-top-left-radius:.75rem;border-top-right-radius:.75rem;overflow:hidden;box-shadow:-1px -1px 10px rgba(0,0,0,.16);border:1px solid;border-color:rgba(var(--ax-color-border-default));outline-color:rgba(var(--ax-color-primary-500))}ax-uploader-dialog-container .ax-uploader-list-header{display:flex;justify-content:space-between;background-color:rgba(var(--ax-color-on-surface));padding:.75rem 1rem;font-weight:500;color:rgba(var(--ax-color-on-surface-fore))}ax-uploader-dialog-container .ax-uploader-list-header .ax-icon{-webkit-margin-start:.5rem;margin-inline-start:.5rem;cursor:pointer}ax-uploader-dialog-container .ax-uploader-list-header .ax-icon:hover{opacity:.75}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.AXUploaderListComponent, selector: "ax-uploader-list" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], animations: [
|
|
20
21
|
trigger('collapse', [
|
|
21
22
|
state('false', style({ height: AUTO_STYLE, visibility: AUTO_STYLE })),
|
|
22
23
|
state('true', style({ height: '0', visibility: 'hidden' })),
|
|
@@ -34,6 +35,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
|
|
|
34
35
|
transition('false => true', animate(150 + 'ms ease-in')),
|
|
35
36
|
transition('true => false', animate(150 + 'ms ease-out')),
|
|
36
37
|
]),
|
|
37
|
-
], template: "<div class=\"ax-uploader-list-header\">\n <div>Uploading</div>\n <div>\n <i class=\"ax-icon\" [ngClass]=\"{ 'ax-icon-chevron-down': !isCollapsed, 'ax-icon-chevron-up': isCollapsed }\"\n (click)=\"toggle()\"></i>\n <i class=\"ax-icon ax-icon-close\" (click)=\"close()\"></i>\n </div>\n</div>\n<div [@collapse]=\"isCollapsed\">\n <ax-uploader-list></ax-uploader-list>\n</div>", styles: ["ax-uploader-dialog-container{display:block;background-color:rgba(var(--ax-color-surface));-webkit-border-top-left-radius:.75rem;-webkit-border-top-right-radius:.75rem;-moz-border-radius-topleft:.75rem;-moz-border-radius-topright:.75rem;border-top-left-radius:.75rem;border-top-right-radius:.75rem;overflow:hidden;box-shadow:-1px -1px 10px rgba(0,0,0,.16);border:1px solid;border-color:rgba(var(--ax-color-border-default));outline-color:rgba(var(--ax-color-primary-500))}ax-uploader-dialog-container .ax-uploader-list-header{display:flex;justify-content:space-between;background-color:rgba(var(--ax-color-on-surface));padding:.75rem 1rem;font-weight:500;color:rgba(var(--ax-color-on-surface-fore))}ax-uploader-dialog-container .ax-uploader-list-header .ax-icon{-webkit-margin-start:.5rem;margin-inline-start:.5rem;cursor:pointer}ax-uploader-dialog-container .ax-uploader-list-header .ax-icon:hover{opacity:.75}\n"] }]
|
|
38
|
+
], template: "<div class=\"ax-uploader-list-header\">\n <div>{{'Uploading' | translate | async }}</div>\n <div>\n <i class=\"ax-icon\" [ngClass]=\"{ 'ax-icon-chevron-down': !isCollapsed, 'ax-icon-chevron-up': isCollapsed }\"\n (click)=\"toggle()\"></i>\n <i class=\"ax-icon ax-icon-close\" (click)=\"close()\"></i>\n </div>\n</div>\n<div [@collapse]=\"isCollapsed\">\n <ax-uploader-list></ax-uploader-list>\n</div>", styles: ["ax-uploader-dialog-container{display:block;background-color:rgba(var(--ax-color-surface));-webkit-border-top-left-radius:.75rem;-webkit-border-top-right-radius:.75rem;-moz-border-radius-topleft:.75rem;-moz-border-radius-topright:.75rem;border-top-left-radius:.75rem;border-top-right-radius:.75rem;overflow:hidden;box-shadow:-1px -1px 10px rgba(0,0,0,.16);border:1px solid;border-color:rgba(var(--ax-color-border-default));outline-color:rgba(var(--ax-color-primary-500))}ax-uploader-dialog-container .ax-uploader-list-header{display:flex;justify-content:space-between;background-color:rgba(var(--ax-color-on-surface));padding:.75rem 1rem;font-weight:500;color:rgba(var(--ax-color-on-surface-fore))}ax-uploader-dialog-container .ax-uploader-list-header .ax-icon{-webkit-margin-start:.5rem;margin-inline-start:.5rem;cursor:pointer}ax-uploader-dialog-container .ax-uploader-list-header .ax-icon:hover{opacity:.75}\n"] }]
|
|
38
39
|
}] });
|
|
39
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
40
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXBsb2FkZXItZGlhbG9nLWNvbnRhaW5lci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbXBvbmVudHMvdXBsb2FkZXIvc3JjL2xpYi91cGxvYWRlci1kaWFsb2ctY29udGFpbmVyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy91cGxvYWRlci9zcmMvbGliL3VwbG9hZGVyLWRpYWxvZy1jb250YWluZXIuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFVBQVUsRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLEtBQUssRUFBRSxVQUFVLEVBQUUsT0FBTyxFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFDN0YsT0FBTyxFQUFFLFNBQVMsRUFBRSxpQkFBaUIsRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDckUsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sMkJBQTJCLENBQUM7Ozs7O0FBZ0JoRSxNQUFNLE9BQU8sa0NBQWtDO0lBZC9DO1FBZ0JZLFdBQU0sR0FBRyxNQUFNLENBQUMsbUJBQW1CLENBQUMsQ0FBQTtRQUU1QyxnQkFBVyxHQUFHLEtBQUssQ0FBQztLQVN2QjtJQVBHLEtBQUs7UUFDRCxJQUFJLENBQUMsTUFBTSxDQUFDLEtBQUssRUFBRSxDQUFDO0lBQ3hCLENBQUM7SUFFRCxNQUFNO1FBQ0YsSUFBSSxDQUFDLFdBQVcsR0FBRyxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUM7SUFDekMsQ0FBQzs4R0FaUSxrQ0FBa0M7a0dBQWxDLGtDQUFrQyxvRUNsQi9DLHViQVVNLHF1Q0REVTtZQUNSLE9BQU8sQ0FBQyxVQUFVLEVBQUU7Z0JBQ2hCLEtBQUssQ0FBQyxPQUFPLEVBQUUsS0FBSyxDQUFDLEVBQUUsTUFBTSxFQUFFLFVBQVUsRUFBRSxVQUFVLEVBQUUsVUFBVSxFQUFFLENBQUMsQ0FBQztnQkFDckUsS0FBSyxDQUFDLE1BQU0sRUFBRSxLQUFLLENBQUMsRUFBRSxNQUFNLEVBQUUsR0FBRyxFQUFFLFVBQVUsRUFBRSxRQUFRLEVBQUUsQ0FBQyxDQUFDO2dCQUMzRCxVQUFVLENBQUMsZUFBZSxFQUFFLE9BQU8sQ0FBQyxHQUFHLEdBQUcsWUFBWSxDQUFDLENBQUM7Z0JBQ3hELFVBQVUsQ0FBQyxlQUFlLEVBQUUsT0FBTyxDQUFDLEdBQUcsR0FBRyxhQUFhLENBQUMsQ0FBQzthQUM1RCxDQUFDO1NBQ0w7OzJGQUVRLGtDQUFrQztrQkFkOUMsU0FBUzsrQkFDSSw4QkFBOEIsaUJBR3pCLGlCQUFpQixDQUFDLElBQUksY0FDekI7d0JBQ1IsT0FBTyxDQUFDLFVBQVUsRUFBRTs0QkFDaEIsS0FBSyxDQUFDLE9BQU8sRUFBRSxLQUFLLENBQUMsRUFBRSxNQUFNLEVBQUUsVUFBVSxFQUFFLFVBQVUsRUFBRSxVQUFVLEVBQUUsQ0FBQyxDQUFDOzRCQUNyRSxLQUFLLENBQUMsTUFBTSxFQUFFLEtBQUssQ0FBQyxFQUFFLE1BQU0sRUFBRSxHQUFHLEVBQUUsVUFBVSxFQUFFLFFBQVEsRUFBRSxDQUFDLENBQUM7NEJBQzNELFVBQVUsQ0FBQyxlQUFlLEVBQUUsT0FBTyxDQUFDLEdBQUcsR0FBRyxZQUFZLENBQUMsQ0FBQzs0QkFDeEQsVUFBVSxDQUFDLGVBQWUsRUFBRSxPQUFPLENBQUMsR0FBRyxHQUFHLGFBQWEsQ0FBQyxDQUFDO3lCQUM1RCxDQUFDO3FCQUNMIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQVVUT19TVFlMRSwgYW5pbWF0ZSwgc3RhdGUsIHN0eWxlLCB0cmFuc2l0aW9uLCB0cmlnZ2VyIH0gZnJvbSAnQGFuZ3VsYXIvYW5pbWF0aW9ucyc7XG5pbXBvcnQgeyBDb21wb25lbnQsIFZpZXdFbmNhcHN1bGF0aW9uLCBpbmplY3QgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEFYQ2xvc2JhbGVDb21wb25lbnQgfSBmcm9tICdAYWNvcmV4L2NvbXBvbmVudHMvY29tbW9uJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdheC11cGxvYWRlci1kaWFsb2ctY29udGFpbmVyJyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vdXBsb2FkZXItZGlhbG9nLWNvbnRhaW5lci5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vdXBsb2FkZXItZGlhbG9nLWNvbnRhaW5lci5jb21wb25lbnQuc2NzcyddLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gICAgYW5pbWF0aW9uczogW1xuICAgICAgICB0cmlnZ2VyKCdjb2xsYXBzZScsIFtcbiAgICAgICAgICAgIHN0YXRlKCdmYWxzZScsIHN0eWxlKHsgaGVpZ2h0OiBBVVRPX1NUWUxFLCB2aXNpYmlsaXR5OiBBVVRPX1NUWUxFIH0pKSxcbiAgICAgICAgICAgIHN0YXRlKCd0cnVlJywgc3R5bGUoeyBoZWlnaHQ6ICcwJywgdmlzaWJpbGl0eTogJ2hpZGRlbicgfSkpLFxuICAgICAgICAgICAgdHJhbnNpdGlvbignZmFsc2UgPT4gdHJ1ZScsIGFuaW1hdGUoMTUwICsgJ21zIGVhc2UtaW4nKSksXG4gICAgICAgICAgICB0cmFuc2l0aW9uKCd0cnVlID0+IGZhbHNlJywgYW5pbWF0ZSgxNTAgKyAnbXMgZWFzZS1vdXQnKSksXG4gICAgICAgIF0pLFxuICAgIF0sXG59KVxuZXhwb3J0IGNsYXNzIEFYVXBsb2FkZXJEaWFsb2dDb250YWluZXJDb21wb25lbnQge1xuXG4gICAgcHJpdmF0ZSBwYXJlbnQgPSBpbmplY3QoQVhDbG9zYmFsZUNvbXBvbmVudClcblxuICAgIGlzQ29sbGFwc2VkID0gZmFsc2U7XG5cbiAgICBjbG9zZSgpIHtcbiAgICAgICAgdGhpcy5wYXJlbnQuY2xvc2UoKTtcbiAgICB9XG5cbiAgICB0b2dnbGUoKSB7XG4gICAgICAgIHRoaXMuaXNDb2xsYXBzZWQgPSAhdGhpcy5pc0NvbGxhcHNlZDtcbiAgICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwiYXgtdXBsb2FkZXItbGlzdC1oZWFkZXJcIj5cbiAgICA8ZGl2Pnt7J1VwbG9hZGluZycgfCB0cmFuc2xhdGUgfCBhc3luYyB9fTwvZGl2PlxuICAgIDxkaXY+XG4gICAgICAgIDxpIGNsYXNzPVwiYXgtaWNvblwiIFtuZ0NsYXNzXT1cInsgJ2F4LWljb24tY2hldnJvbi1kb3duJzogIWlzQ29sbGFwc2VkLCAnYXgtaWNvbi1jaGV2cm9uLXVwJzogaXNDb2xsYXBzZWQgfVwiXG4gICAgICAgICAgICAoY2xpY2spPVwidG9nZ2xlKClcIj48L2k+XG4gICAgICAgIDxpIGNsYXNzPVwiYXgtaWNvbiBheC1pY29uLWNsb3NlXCIgKGNsaWNrKT1cImNsb3NlKClcIj48L2k+XG4gICAgPC9kaXY+XG48L2Rpdj5cbjxkaXYgW0Bjb2xsYXBzZV09XCJpc0NvbGxhcHNlZFwiPlxuICAgIDxheC11cGxvYWRlci1saXN0PjwvYXgtdXBsb2FkZXItbGlzdD5cbjwvZGl2PiJdfQ==
|
|
@@ -12,10 +12,10 @@ export class AXUploaderListComponent extends AXBasePageComponent {
|
|
|
12
12
|
this.uploadService = inject(AXUploaderService);
|
|
13
13
|
}
|
|
14
14
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AXUploaderListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
15
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.8", type: AXUploaderListComponent, selector: "ax-uploader-list", usesInheritance: true, ngImport: i0, template: "@if((uploadService.totalEstimateTime | async) > 0)\n{\n<div class=\"ax-uploader-progress-status\">\n <div>{{ uploadService.totalEstimateTime | async | format: 'timeleft' }}</div>\n <button (click)=\"uploadService.cancelAll()\">{{ 'cancel' | translate }}</button>\n</div>\n}\n<ul class=\"ax-uploader-list-items\">\n @for (item of uploadService.files | async; track item.name) {\n <li>\n <div class=\"ax-file ax-bg-success-500\">\n <span>{{ item.ext }}</span>\n </div>\n <div class=\"ax-item-container\">\n <div class=\"ax-item-name\" [title]=\"item.name\">{{ item.name }}</div>\n <div><span>{{ item.size | format: 'filesize' }}</span>\n @switch (item.status()) {\n @case ('inprogress') {\n / {{ item.estimateTime() | format: 'timeleft' }}\n }\n }\n </div>\n </div>\n @switch (item.status()) {\n @case ('completed') {\n <div class=\"ax-status\">\n <i class=\"ax-icon ax-icon-solid ax-icon-check-circle ax-state-completed\"></i>\n </div>\n }\n @case ('canceled') {\n <span class=\"ax-state-canceled\">
|
|
15
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.8", type: AXUploaderListComponent, selector: "ax-uploader-list", usesInheritance: true, ngImport: i0, template: "@if((uploadService.totalEstimateTime | async) > 0)\n{\n<div class=\"ax-uploader-progress-status\">\n <div>{{ (uploadService.totalEstimateTime | async) | format: 'timeleft' | async }}</div>\n <button (click)=\"uploadService.cancelAll()\">{{ 'cancel' | translate | async }}</button>\n</div>\n}\n<ul class=\"ax-uploader-list-items\">\n @for (item of uploadService.files | async; track item.name) {\n <li>\n <div class=\"ax-file ax-bg-success-500\">\n <span>{{ item.ext }}</span>\n </div>\n <div class=\"ax-item-container\">\n <div class=\"ax-item-name\" [title]=\"item.name\">{{ item.name }}</div>\n <div><span>{{ item.size | format: 'filesize' | async }}</span>\n @switch (item.status()) {\n @case ('inprogress') {\n / {{ item.estimateTime() | format: 'timeleft' | async }}\n }\n }\n </div>\n </div>\n @switch (item.status()) {\n @case ('completed') {\n <div class=\"ax-status\">\n <i class=\"ax-icon ax-icon-solid ax-icon-check-circle ax-state-completed\"></i>\n </div>\n }\n @case ('canceled') {\n <span class=\"ax-state-canceled\">{{ 'canceled' | translate | async }}</span>\n }\n @case ('failed') {\n <span class=\"ax-state-failed\">{{ 'failed' | translate | async }}</span>\n }\n @default {\n <div class=\"ax-status\">\n <ax-circular-progress [size]=\"22\" [stroke]=\"6\" [progress]=\"item.progress()\" class=\"ax-show\">\n </ax-circular-progress>\n <i class=\"ax-icon ax-icon-solid ax-icon-close ax-hide\" (click)=\"item.cancel()\"\n title=\"{{ 'cancel' | translate | async }}\"></i>\n </div>\n }\n }\n </li>\n }\n</ul>", styles: [".ax-dark ax-uploader-list .ax-uploader-progress-status{border-color:rgba(var(--ax-color-primary-500));background-color:rgba(var(--ax-color-primary-500),.25);color:rgba(var(--ax-color-primary-fore))}ax-uploader-list .ax-uploader-progress-status{display:flex;align-items:center;justify-content:space-between;border-bottom-width:1px;border-top-width:1px;border-color:rgba(var(--ax-color-primary-200));background-color:rgba(var(--ax-color-primary-200));padding:.5rem .75rem;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-primary-fore-tint))}ax-uploader-list .ax-uploader-list-items{max-height:75vh;width:100%;overflow-y:auto;overflow-x:hidden;padding:.5rem 1rem;gap:.5rem;display:flex;flex-direction:column}ax-uploader-list .ax-uploader-list-items li{display:flex;align-items:center;font-size:.875rem;line-height:1.25rem;gap:1rem;width:100%}ax-uploader-list .ax-uploader-list-items li .ax-item-container{display:flex;flex-direction:column;flex:1;-webkit-user-select:none;-moz-user-select:none;user-select:none}ax-uploader-list .ax-uploader-list-items li .ax-item-container .ax-item-name{font-size:.875rem;line-height:1.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;width:12rem}ax-uploader-list .ax-uploader-list-items li .ax-status{position:relative;color:rgba(var(--ax-color-black),.5)}ax-uploader-list .ax-uploader-list-items li .ax-status .ax-icon{font-size:1.375rem}ax-uploader-list .ax-uploader-list-items li .ax-status .ax-icon-close{cursor:pointer}ax-uploader-list .ax-uploader-list-items li .ax-status .ax-state-canceled{color:rgba(var(--ax-color-neutral-500))}ax-uploader-list .ax-uploader-list-items li .ax-status .ax-state-failed{color:rgba(var(--ax-color-danger-500))}ax-uploader-list .ax-uploader-list-items li .ax-status .ax-state-completed{color:rgba(var(--ax-color-success-500))}ax-uploader-list .ax-uploader-list-items li:hover .ax-hide{display:flex!important}ax-uploader-list .ax-uploader-list-items li:hover .ax-show{display:none!important}ax-uploader-list .ax-uploader-list-items li .ax-show{display:flex!important}ax-uploader-list .ax-uploader-list-items li .ax-hide{display:none!important}.ax-file{position:relative;display:flex;align-items:center;justify-content:center;width:1.5rem;aspect-ratio:.7;border-radius:.25rem;color:rgba(var(--ax-color-white))}.ax-file>*{position:absolute;bottom:.3rem;font-weight:700;font-size:.65rem;line-height:.65rem}.ax-file:before{content:\"\";position:absolute;top:0;right:0;border-width:0 12px 12px 0;border-color:rgba(var(--ax-color-surface)) rgba(var(--ax-color-surface)) rgba(var(--ax-color-black),.3) rgba(var(--ax-color-black),.3)}\n"], dependencies: [{ kind: "component", type: i1.AXCircularProgressComponent, selector: "ax-circular-progress", inputs: ["color", "progress", "stroke", "size"], outputs: ["ValueChange", "strokeChange", "sizeChange"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: i4.AXFormatPipe, name: "format" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
16
16
|
}
|
|
17
17
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AXUploaderListComponent, decorators: [{
|
|
18
18
|
type: Component,
|
|
19
|
-
args: [{ selector: 'ax-uploader-list', encapsulation: ViewEncapsulation.None, template: "@if((uploadService.totalEstimateTime | async) > 0)\n{\n<div class=\"ax-uploader-progress-status\">\n <div>{{ uploadService.totalEstimateTime | async | format: 'timeleft' }}</div>\n <button (click)=\"uploadService.cancelAll()\">{{ 'cancel' | translate }}</button>\n</div>\n}\n<ul class=\"ax-uploader-list-items\">\n @for (item of uploadService.files | async; track item.name) {\n <li>\n <div class=\"ax-file ax-bg-success-500\">\n <span>{{ item.ext }}</span>\n </div>\n <div class=\"ax-item-container\">\n <div class=\"ax-item-name\" [title]=\"item.name\">{{ item.name }}</div>\n <div><span>{{ item.size | format: 'filesize' }}</span>\n @switch (item.status()) {\n @case ('inprogress') {\n / {{ item.estimateTime() | format: 'timeleft' }}\n }\n }\n </div>\n </div>\n @switch (item.status()) {\n @case ('completed') {\n <div class=\"ax-status\">\n <i class=\"ax-icon ax-icon-solid ax-icon-check-circle ax-state-completed\"></i>\n </div>\n }\n @case ('canceled') {\n <span class=\"ax-state-canceled\">
|
|
19
|
+
args: [{ selector: 'ax-uploader-list', encapsulation: ViewEncapsulation.None, template: "@if((uploadService.totalEstimateTime | async) > 0)\n{\n<div class=\"ax-uploader-progress-status\">\n <div>{{ (uploadService.totalEstimateTime | async) | format: 'timeleft' | async }}</div>\n <button (click)=\"uploadService.cancelAll()\">{{ 'cancel' | translate | async }}</button>\n</div>\n}\n<ul class=\"ax-uploader-list-items\">\n @for (item of uploadService.files | async; track item.name) {\n <li>\n <div class=\"ax-file ax-bg-success-500\">\n <span>{{ item.ext }}</span>\n </div>\n <div class=\"ax-item-container\">\n <div class=\"ax-item-name\" [title]=\"item.name\">{{ item.name }}</div>\n <div><span>{{ item.size | format: 'filesize' | async }}</span>\n @switch (item.status()) {\n @case ('inprogress') {\n / {{ item.estimateTime() | format: 'timeleft' | async }}\n }\n }\n </div>\n </div>\n @switch (item.status()) {\n @case ('completed') {\n <div class=\"ax-status\">\n <i class=\"ax-icon ax-icon-solid ax-icon-check-circle ax-state-completed\"></i>\n </div>\n }\n @case ('canceled') {\n <span class=\"ax-state-canceled\">{{ 'canceled' | translate | async }}</span>\n }\n @case ('failed') {\n <span class=\"ax-state-failed\">{{ 'failed' | translate | async }}</span>\n }\n @default {\n <div class=\"ax-status\">\n <ax-circular-progress [size]=\"22\" [stroke]=\"6\" [progress]=\"item.progress()\" class=\"ax-show\">\n </ax-circular-progress>\n <i class=\"ax-icon ax-icon-solid ax-icon-close ax-hide\" (click)=\"item.cancel()\"\n title=\"{{ 'cancel' | translate | async }}\"></i>\n </div>\n }\n }\n </li>\n }\n</ul>", styles: [".ax-dark ax-uploader-list .ax-uploader-progress-status{border-color:rgba(var(--ax-color-primary-500));background-color:rgba(var(--ax-color-primary-500),.25);color:rgba(var(--ax-color-primary-fore))}ax-uploader-list .ax-uploader-progress-status{display:flex;align-items:center;justify-content:space-between;border-bottom-width:1px;border-top-width:1px;border-color:rgba(var(--ax-color-primary-200));background-color:rgba(var(--ax-color-primary-200));padding:.5rem .75rem;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-primary-fore-tint))}ax-uploader-list .ax-uploader-list-items{max-height:75vh;width:100%;overflow-y:auto;overflow-x:hidden;padding:.5rem 1rem;gap:.5rem;display:flex;flex-direction:column}ax-uploader-list .ax-uploader-list-items li{display:flex;align-items:center;font-size:.875rem;line-height:1.25rem;gap:1rem;width:100%}ax-uploader-list .ax-uploader-list-items li .ax-item-container{display:flex;flex-direction:column;flex:1;-webkit-user-select:none;-moz-user-select:none;user-select:none}ax-uploader-list .ax-uploader-list-items li .ax-item-container .ax-item-name{font-size:.875rem;line-height:1.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;width:12rem}ax-uploader-list .ax-uploader-list-items li .ax-status{position:relative;color:rgba(var(--ax-color-black),.5)}ax-uploader-list .ax-uploader-list-items li .ax-status .ax-icon{font-size:1.375rem}ax-uploader-list .ax-uploader-list-items li .ax-status .ax-icon-close{cursor:pointer}ax-uploader-list .ax-uploader-list-items li .ax-status .ax-state-canceled{color:rgba(var(--ax-color-neutral-500))}ax-uploader-list .ax-uploader-list-items li .ax-status .ax-state-failed{color:rgba(var(--ax-color-danger-500))}ax-uploader-list .ax-uploader-list-items li .ax-status .ax-state-completed{color:rgba(var(--ax-color-success-500))}ax-uploader-list .ax-uploader-list-items li:hover .ax-hide{display:flex!important}ax-uploader-list .ax-uploader-list-items li:hover .ax-show{display:none!important}ax-uploader-list .ax-uploader-list-items li .ax-show{display:flex!important}ax-uploader-list .ax-uploader-list-items li .ax-hide{display:none!important}.ax-file{position:relative;display:flex;align-items:center;justify-content:center;width:1.5rem;aspect-ratio:.7;border-radius:.25rem;color:rgba(var(--ax-color-white))}.ax-file>*{position:absolute;bottom:.3rem;font-weight:700;font-size:.65rem;line-height:.65rem}.ax-file:before{content:\"\";position:absolute;top:0;right:0;border-width:0 12px 12px 0;border-color:rgba(var(--ax-color-surface)) rgba(var(--ax-color-surface)) rgba(var(--ax-color-black),.3) rgba(var(--ax-color-black),.3)}\n"] }]
|
|
20
20
|
}] });
|
|
21
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
21
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXBsb2FkZXItbGlzdC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbXBvbmVudHMvdXBsb2FkZXIvc3JjL2xpYi91cGxvYWRlci1saXN0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy91cGxvYWRlci9zcmMvbGliL3VwbG9hZGVyLWxpc3QuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxpQkFBaUIsRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDckUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFDdkQsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0seUJBQXlCLENBQUM7Ozs7OztBQVE5RCxNQUFNLE9BQU8sdUJBQXdCLFNBQVEsbUJBQW1CO0lBTmhFOztRQU9ZLGtCQUFhLEdBQXNCLE1BQU0sQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDO0tBQ3hFOzhHQUZZLHVCQUF1QjtrR0FBdkIsdUJBQXVCLCtFQ1ZwQywwb0RBOENLOzsyRkRwQ1EsdUJBQXVCO2tCQU5uQyxTQUFTOytCQUNFLGtCQUFrQixpQkFHYixpQkFBaUIsQ0FBQyxJQUFJIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBWaWV3RW5jYXBzdWxhdGlvbiwgaW5qZWN0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBBWFVwbG9hZGVyU2VydmljZSB9IGZyb20gJy4vdXBsb2FkZXIuc2VydmljZSc7XG5pbXBvcnQgeyBBWEJhc2VQYWdlQ29tcG9uZW50IH0gZnJvbSAnQGFjb3JleC9jb21wb25lbnRzL3BhZ2UnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdheC11cGxvYWRlci1saXN0JyxcbiAgdGVtcGxhdGVVcmw6ICcuL3VwbG9hZGVyLWxpc3QuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi91cGxvYWRlci1saXN0LmNvbXBvbmVudC5zY3NzJ10sXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG59KVxuZXhwb3J0IGNsYXNzIEFYVXBsb2FkZXJMaXN0Q29tcG9uZW50IGV4dGVuZHMgQVhCYXNlUGFnZUNvbXBvbmVudCB7XG4gIHByb3RlY3RlZCB1cGxvYWRTZXJ2aWNlOiBBWFVwbG9hZGVyU2VydmljZSA9IGluamVjdChBWFVwbG9hZGVyU2VydmljZSk7XG59XG4iLCJAaWYoKHVwbG9hZFNlcnZpY2UudG90YWxFc3RpbWF0ZVRpbWUgfCBhc3luYykgPiAwKVxue1xuPGRpdiBjbGFzcz1cImF4LXVwbG9hZGVyLXByb2dyZXNzLXN0YXR1c1wiPlxuICA8ZGl2Pnt7ICh1cGxvYWRTZXJ2aWNlLnRvdGFsRXN0aW1hdGVUaW1lIHwgYXN5bmMpIHwgZm9ybWF0OiAndGltZWxlZnQnIHwgYXN5bmMgfX08L2Rpdj5cbiAgPGJ1dHRvbiAoY2xpY2spPVwidXBsb2FkU2VydmljZS5jYW5jZWxBbGwoKVwiPnt7ICdjYW5jZWwnIHwgdHJhbnNsYXRlIHwgYXN5bmMgfX08L2J1dHRvbj5cbjwvZGl2PlxufVxuPHVsIGNsYXNzPVwiYXgtdXBsb2FkZXItbGlzdC1pdGVtc1wiPlxuICBAZm9yIChpdGVtIG9mIHVwbG9hZFNlcnZpY2UuZmlsZXMgfCBhc3luYzsgdHJhY2sgaXRlbS5uYW1lKSB7XG4gIDxsaT5cbiAgICA8ZGl2IGNsYXNzPVwiYXgtZmlsZSBheC1iZy1zdWNjZXNzLTUwMFwiPlxuICAgICAgPHNwYW4+e3sgaXRlbS5leHQgfX08L3NwYW4+XG4gICAgPC9kaXY+XG4gICAgPGRpdiBjbGFzcz1cImF4LWl0ZW0tY29udGFpbmVyXCI+XG4gICAgICA8ZGl2IGNsYXNzPVwiYXgtaXRlbS1uYW1lXCIgW3RpdGxlXT1cIml0ZW0ubmFtZVwiPnt7IGl0ZW0ubmFtZSB9fTwvZGl2PlxuICAgICAgPGRpdj48c3Bhbj57eyBpdGVtLnNpemUgfCBmb3JtYXQ6ICdmaWxlc2l6ZScgfCBhc3luYyB9fTwvc3Bhbj5cbiAgICAgICAgQHN3aXRjaCAoaXRlbS5zdGF0dXMoKSkge1xuICAgICAgICBAY2FzZSAoJ2lucHJvZ3Jlc3MnKSB7XG4gICAgICAgIC8ge3sgaXRlbS5lc3RpbWF0ZVRpbWUoKSB8IGZvcm1hdDogJ3RpbWVsZWZ0JyB8IGFzeW5jIH19XG4gICAgICAgIH1cbiAgICAgICAgfVxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gICAgQHN3aXRjaCAoaXRlbS5zdGF0dXMoKSkge1xuICAgIEBjYXNlICgnY29tcGxldGVkJykge1xuICAgIDxkaXYgY2xhc3M9XCJheC1zdGF0dXNcIj5cbiAgICAgIDxpIGNsYXNzPVwiYXgtaWNvbiBheC1pY29uLXNvbGlkIGF4LWljb24tY2hlY2stY2lyY2xlIGF4LXN0YXRlLWNvbXBsZXRlZFwiPjwvaT5cbiAgICA8L2Rpdj5cbiAgICB9XG4gICAgQGNhc2UgKCdjYW5jZWxlZCcpIHtcbiAgICA8c3BhbiBjbGFzcz1cImF4LXN0YXRlLWNhbmNlbGVkXCI+e3sgJ2NhbmNlbGVkJyB8IHRyYW5zbGF0ZSB8IGFzeW5jIH19PC9zcGFuPlxuICAgIH1cbiAgICBAY2FzZSAoJ2ZhaWxlZCcpIHtcbiAgICA8c3BhbiBjbGFzcz1cImF4LXN0YXRlLWZhaWxlZFwiPnt7ICdmYWlsZWQnIHwgdHJhbnNsYXRlIHwgYXN5bmMgfX08L3NwYW4+XG4gICAgfVxuICAgIEBkZWZhdWx0IHtcbiAgICA8ZGl2IGNsYXNzPVwiYXgtc3RhdHVzXCI+XG4gICAgICA8YXgtY2lyY3VsYXItcHJvZ3Jlc3MgW3NpemVdPVwiMjJcIiBbc3Ryb2tlXT1cIjZcIiBbcHJvZ3Jlc3NdPVwiaXRlbS5wcm9ncmVzcygpXCIgY2xhc3M9XCJheC1zaG93XCI+XG4gICAgICA8L2F4LWNpcmN1bGFyLXByb2dyZXNzPlxuICAgICAgPGkgY2xhc3M9XCJheC1pY29uIGF4LWljb24tc29saWQgYXgtaWNvbi1jbG9zZSBheC1oaWRlXCIgKGNsaWNrKT1cIml0ZW0uY2FuY2VsKClcIlxuICAgICAgICB0aXRsZT1cInt7ICdjYW5jZWwnIHwgdHJhbnNsYXRlIHwgYXN5bmMgIH19XCI+PC9pPlxuICAgIDwvZGl2PlxuICAgIH1cbiAgICB9XG4gIDwvbGk+XG4gIH1cbjwvdWw+Il19
|
|
@@ -83,7 +83,7 @@ class AXActionSheetComponent extends MXBaseComponent {
|
|
|
83
83
|
provide: AXFocusableComponent,
|
|
84
84
|
useExisting: AXActionSheetComponent,
|
|
85
85
|
},
|
|
86
|
-
], usesInheritance: true, ngImport: i0, template: "<ax-header *ngIf=\"data.header\">\n <ax-prefix>\n <ax-title>{{ data.title | translate }}</ax-title>\n <ax-sub-title *ngIf=\"data.subTitle\">{{ data.subTitle }}</ax-sub-title>\n </ax-prefix>\n <ax-suffix>\n <ax-close-button *ngIf=\"data.closeButton\"></ax-close-button>\n </ax-suffix>\n</ax-header>\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n <ng-container *ngFor=\"let item of data.items\">\n <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" tabindex=\"0\"\n (click)=\"onItemClick(item)\">\n <span class=\"item-icon\" *ngIf=\"item.icon\" [class]=\"item.icon\"></span>\n <span class=\"item-text\">{{ item.text }}</span>\n </div>\n </ng-container>\n</div>", styles: ["ax-action-sheet{display:block;width:100vw}@media (min-width: 768px){ax-action-sheet{width:70vw}}@media (min-width: 1024px){ax-action-sheet{width:50vw}}ax-action-sheet ax-header{padding:1rem;border-bottom-width:1px;font-size:1rem;line-height:1.5rem;font-weight:500}@media (min-width: 768px){ax-action-sheet ax-header{font-size:1.125rem;line-height:1.75rem}}ax-action-sheet ax-header ax-prefix,ax-action-sheet ax-header ax-suffix{display:flex;flex-direction:column;justify-content:flex-start}ax-action-sheet ax-header ax-prefix{align-items:flex-start}ax-action-sheet ax-header ax-suffix{align-items:flex-end}ax-action-sheet .ax-action-sheet-items{padding-top:.5rem;padding-bottom:.5rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item{display:flex;padding:.75rem 1rem;align-items:center;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item:hover{background-color:rgba(var(--ax-color-on-surface))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item .item-icon{-webkit-margin-end:.75rem;margin-inline-end:.75rem;font-size:1.5rem;line-height:2rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-primary{color:rgba(var(--ax-color-primary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-secondary{color:rgba(var(--ax-color-secondary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-success{color:rgba(var(--ax-color-success-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-warning{color:rgba(var(--ax-color-warning-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-danger{color:rgba(var(--ax-color-danger-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-info{color:rgba(var(--ax-color-info-500))}\n"], dependencies: [{ 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: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i4.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "pipe", type: i5.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
86
|
+
], usesInheritance: true, ngImport: i0, template: "<ax-header *ngIf=\"data.header\">\n <ax-prefix>\n <ax-title>{{ data.title | translate | async }}</ax-title>\n <ax-sub-title *ngIf=\"data.subTitle\">{{ data.subTitle }}</ax-sub-title>\n </ax-prefix>\n <ax-suffix>\n <ax-close-button *ngIf=\"data.closeButton\"></ax-close-button>\n </ax-suffix>\n</ax-header>\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n <ng-container *ngFor=\"let item of data.items\">\n <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" tabindex=\"0\"\n (click)=\"onItemClick(item)\">\n <span class=\"item-icon\" *ngIf=\"item.icon\" [class]=\"item.icon\"></span>\n <span class=\"item-text\">{{ item.text | translate | async }}</span>\n </div>\n </ng-container>\n</div>", styles: ["ax-action-sheet{display:block;width:100vw}@media (min-width: 768px){ax-action-sheet{width:70vw}}@media (min-width: 1024px){ax-action-sheet{width:50vw}}ax-action-sheet ax-header{padding:1rem;border-bottom-width:1px;font-size:1rem;line-height:1.5rem;font-weight:500}@media (min-width: 768px){ax-action-sheet ax-header{font-size:1.125rem;line-height:1.75rem}}ax-action-sheet ax-header ax-prefix,ax-action-sheet ax-header ax-suffix{display:flex;flex-direction:column;justify-content:flex-start}ax-action-sheet ax-header ax-prefix{align-items:flex-start}ax-action-sheet ax-header ax-suffix{align-items:flex-end}ax-action-sheet .ax-action-sheet-items{padding-top:.5rem;padding-bottom:.5rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item{display:flex;padding:.75rem 1rem;align-items:center;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item:hover{background-color:rgba(var(--ax-color-on-surface))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item .item-icon{-webkit-margin-end:.75rem;margin-inline-end:.75rem;font-size:1.5rem;line-height:2rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-primary{color:rgba(var(--ax-color-primary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-secondary{color:rgba(var(--ax-color-secondary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-success{color:rgba(var(--ax-color-success-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-warning{color:rgba(var(--ax-color-warning-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-danger{color:rgba(var(--ax-color-danger-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-info{color:rgba(var(--ax-color-info-500))}\n"], dependencies: [{ 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: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i4.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
87
87
|
}
|
|
88
88
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AXActionSheetComponent, decorators: [{
|
|
89
89
|
type: Component,
|
|
@@ -96,7 +96,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
|
|
|
96
96
|
provide: AXFocusableComponent,
|
|
97
97
|
useExisting: AXActionSheetComponent,
|
|
98
98
|
},
|
|
99
|
-
], template: "<ax-header *ngIf=\"data.header\">\n <ax-prefix>\n <ax-title>{{ data.title | translate }}</ax-title>\n <ax-sub-title *ngIf=\"data.subTitle\">{{ data.subTitle }}</ax-sub-title>\n </ax-prefix>\n <ax-suffix>\n <ax-close-button *ngIf=\"data.closeButton\"></ax-close-button>\n </ax-suffix>\n</ax-header>\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n <ng-container *ngFor=\"let item of data.items\">\n <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" tabindex=\"0\"\n (click)=\"onItemClick(item)\">\n <span class=\"item-icon\" *ngIf=\"item.icon\" [class]=\"item.icon\"></span>\n <span class=\"item-text\">{{ item.text }}</span>\n </div>\n </ng-container>\n</div>", styles: ["ax-action-sheet{display:block;width:100vw}@media (min-width: 768px){ax-action-sheet{width:70vw}}@media (min-width: 1024px){ax-action-sheet{width:50vw}}ax-action-sheet ax-header{padding:1rem;border-bottom-width:1px;font-size:1rem;line-height:1.5rem;font-weight:500}@media (min-width: 768px){ax-action-sheet ax-header{font-size:1.125rem;line-height:1.75rem}}ax-action-sheet ax-header ax-prefix,ax-action-sheet ax-header ax-suffix{display:flex;flex-direction:column;justify-content:flex-start}ax-action-sheet ax-header ax-prefix{align-items:flex-start}ax-action-sheet ax-header ax-suffix{align-items:flex-end}ax-action-sheet .ax-action-sheet-items{padding-top:.5rem;padding-bottom:.5rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item{display:flex;padding:.75rem 1rem;align-items:center;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item:hover{background-color:rgba(var(--ax-color-on-surface))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item .item-icon{-webkit-margin-end:.75rem;margin-inline-end:.75rem;font-size:1.5rem;line-height:2rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-primary{color:rgba(var(--ax-color-primary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-secondary{color:rgba(var(--ax-color-secondary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-success{color:rgba(var(--ax-color-success-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-warning{color:rgba(var(--ax-color-warning-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-danger{color:rgba(var(--ax-color-danger-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-info{color:rgba(var(--ax-color-info-500))}\n"] }]
|
|
99
|
+
], template: "<ax-header *ngIf=\"data.header\">\n <ax-prefix>\n <ax-title>{{ data.title | translate | async }}</ax-title>\n <ax-sub-title *ngIf=\"data.subTitle\">{{ data.subTitle }}</ax-sub-title>\n </ax-prefix>\n <ax-suffix>\n <ax-close-button *ngIf=\"data.closeButton\"></ax-close-button>\n </ax-suffix>\n</ax-header>\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n <ng-container *ngFor=\"let item of data.items\">\n <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" tabindex=\"0\"\n (click)=\"onItemClick(item)\">\n <span class=\"item-icon\" *ngIf=\"item.icon\" [class]=\"item.icon\"></span>\n <span class=\"item-text\">{{ item.text | translate | async }}</span>\n </div>\n </ng-container>\n</div>", styles: ["ax-action-sheet{display:block;width:100vw}@media (min-width: 768px){ax-action-sheet{width:70vw}}@media (min-width: 1024px){ax-action-sheet{width:50vw}}ax-action-sheet ax-header{padding:1rem;border-bottom-width:1px;font-size:1rem;line-height:1.5rem;font-weight:500}@media (min-width: 768px){ax-action-sheet ax-header{font-size:1.125rem;line-height:1.75rem}}ax-action-sheet ax-header ax-prefix,ax-action-sheet ax-header ax-suffix{display:flex;flex-direction:column;justify-content:flex-start}ax-action-sheet ax-header ax-prefix{align-items:flex-start}ax-action-sheet ax-header ax-suffix{align-items:flex-end}ax-action-sheet .ax-action-sheet-items{padding-top:.5rem;padding-bottom:.5rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item{display:flex;padding:.75rem 1rem;align-items:center;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item:hover{background-color:rgba(var(--ax-color-on-surface))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item .item-icon{-webkit-margin-end:.75rem;margin-inline-end:.75rem;font-size:1.5rem;line-height:2rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-primary{color:rgba(var(--ax-color-primary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-secondary{color:rgba(var(--ax-color-secondary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-success{color:rgba(var(--ax-color-success-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-warning{color:rgba(var(--ax-color-warning-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-danger{color:rgba(var(--ax-color-danger-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-info{color:rgba(var(--ax-color-info-500))}\n"] }]
|
|
100
100
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
101
101
|
type: Inject,
|
|
102
102
|
args: [DIALOG_DATA]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"acorex-components-action-sheet.mjs","sources":["../../../../libs/components/action-sheet/src/lib/action-sheet.component.ts","../../../../libs/components/action-sheet/src/lib/action-sheet.component.html","../../../../libs/components/action-sheet/src/lib/action-sheet.service.ts","../../../../libs/components/action-sheet/src/lib/action-sheet.module.ts","../../../../libs/components/action-sheet/src/acorex-components-action-sheet.ts"],"sourcesContent":["import {\n AXClosbaleComponent,\n AXComponentCloseEvent,\n AXFocusableComponent,\n MXBaseComponent,\n} from '@acorex/components/common';\nimport { DIALOG_DATA, DialogRef } from '@angular/cdk/dialog';\nimport { CdkPortalOutletAttachedRef, ComponentPortal, Portal, TemplatePortal } from '@angular/cdk/portal';\nimport {\n ChangeDetectionStrategy,\n Component,\n ComponentRef,\n HostListener,\n Inject,\n OnInit,\n TemplateRef,\n ViewEncapsulation,\n} from '@angular/core';\nimport { AXActionSheetData, AXActionSheetItem } from './action-sheet.class';\n\n@Component({\n selector: 'ax-action-sheet',\n templateUrl: './action-sheet.component.html',\n styleUrls: ['./action-sheet.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [\n {\n provide: AXClosbaleComponent,\n useExisting: AXActionSheetComponent,\n },\n {\n provide: AXFocusableComponent,\n useExisting: AXActionSheetComponent,\n },\n ],\n})\nexport class AXActionSheetComponent extends MXBaseComponent implements OnInit {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n protected _selectedPortal: Portal<any>;\n\n private _componentRef: unknown;\n\n /**\n * @ignore\n */\n constructor(\n @Inject(DIALOG_DATA)\n protected data: AXActionSheetData,\n private dialogRef: DialogRef<AXComponentCloseEvent>,\n ) {\n super();\n }\n\n ngOnInit(): void {\n super.ngOnInit();\n if (this.data.content) {\n if (this.data.content instanceof TemplateRef) {\n this._selectedPortal = new TemplatePortal(this.data.content, this.getViewContainer(), {\n $implicit: this.data,\n ref: this,\n });\n this.cdr.markForCheck();\n } else if (typeof this.data.content === 'function') {\n this._selectedPortal = new ComponentPortal(this.data.content);\n this.cdr.markForCheck();\n }\n }\n }\n\n @HostListener('keydown.escape')\n protected onKeydownHandler() {\n const focusedOrHasFocused = this.getHostElement().matches(':focus-within');\n if (this.data.closeButton && focusedOrHasFocused) {\n this.close();\n }\n }\n\n _handleAttched(ref: CdkPortalOutletAttachedRef) {\n ref = ref as ComponentRef<any>;\n if (ref.instance) {\n this._componentRef = ref.instance;\n Object.assign(this._componentRef, this.data);\n Object.assign(this._componentRef, { _isPopup: true });\n if (ref.instance.onClosed) {\n ref.instance.onClosed.subscribe((e: AXComponentCloseEvent) => {\n this.close();\n });\n }\n }\n }\n\n onItemClick(item: AXActionSheetItem) {\n this.close();\n if (item?.onClick) item.onClick();\n }\n\n close() {\n this.dialogRef.close({\n component: this._componentRef,\n htmlElement: this.getHostElement(),\n data: this.data,\n });\n }\n}\n","<ax-header *ngIf=\"data.header\">\n <ax-prefix>\n <ax-title>{{ data.title | translate }}</ax-title>\n <ax-sub-title *ngIf=\"data.subTitle\">{{ data.subTitle }}</ax-sub-title>\n </ax-prefix>\n <ax-suffix>\n <ax-close-button *ngIf=\"data.closeButton\"></ax-close-button>\n </ax-suffix>\n</ax-header>\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n <ng-container *ngFor=\"let item of data.items\">\n <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" tabindex=\"0\"\n (click)=\"onItemClick(item)\">\n <span class=\"item-icon\" *ngIf=\"item.icon\" [class]=\"item.icon\"></span>\n <span class=\"item-text\">{{ item.text }}</span>\n </div>\n </ng-container>\n</div>","import { Dialog } from '@angular/cdk/dialog';\nimport { GlobalPositionStrategy } from '@angular/cdk/overlay';\nimport { Injectable, inject } from '@angular/core';\nimport { Subject } from 'rxjs';\nimport { AXActionSheetConfig } from './action-sheet.class';\nimport { AXActionSheetComponent } from './action-sheet.component';\n\nexport interface AXActionSheetDialogRef {\n close(): void;\n closed: Subject<void>;\n}\n\n@Injectable()\nexport class AXActionSheetService {\n private dialog: Dialog = inject(Dialog);\n\n open(config: AXActionSheetConfig): Promise<AXActionSheetDialogRef> {\n const defaultConfig: AXActionSheetConfig = {\n title: 'action-sheet.title',\n closeButton: true,\n closeOnBackdropClick: true,\n header: true,\n };\n config = Object.assign(defaultConfig, config);\n\n const dialogRef = this.dialog.open(AXActionSheetComponent, {\n data: config,\n autoFocus: 'first-tabbable',\n restoreFocus: true,\n role: 'dialog',\n ariaModal: true,\n closeOnNavigation: true,\n closeOnDestroy: true,\n hasBackdrop: true,\n panelClass: ['ax-actionsheet-panel'],\n disableClose: config.closeOnBackdropClick ? false : true,\n positionStrategy: new GlobalPositionStrategy().centerHorizontally().bottom(),\n });\n const promise = new Promise<AXActionSheetDialogRef>((resolve) => {\n const closed = new Subject<void>();\n const axDialogRef: AXActionSheetDialogRef = {\n close: () => {\n dialogRef.close();\n },\n closed,\n };\n dialogRef.closed.subscribe(() => {\n closed.next();\n });\n if (resolve) {\n resolve(axDialogRef);\n }\n });\n return promise;\n }\n}\n","import { AXButtonModule } from '@acorex/components/button';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { AXCommonModule } from '@acorex/components/common';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { DialogModule } from '@angular/cdk/dialog';\nimport { AXActionSheetComponent } from './action-sheet.component';\nimport { AXActionSheetService } from './action-sheet.service';\nimport { AXTranslationModule } from '@acorex/core/translation';\n\nconst MODULES = [\n CommonModule,\n AXCommonModule,\n DragDropModule,\n A11yModule,\n AXButtonModule,\n PortalModule,\n AXDecoratorModule,\n AXTranslationModule,\n DialogModule,\n];\n\n@NgModule({\n declarations: [AXActionSheetComponent],\n imports: [...MODULES],\n exports: [AXActionSheetComponent],\n providers: [AXActionSheetService],\n})\nexport class AXActionSheetModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"acorex-components-action-sheet.mjs","sources":["../../../../libs/components/action-sheet/src/lib/action-sheet.component.ts","../../../../libs/components/action-sheet/src/lib/action-sheet.component.html","../../../../libs/components/action-sheet/src/lib/action-sheet.service.ts","../../../../libs/components/action-sheet/src/lib/action-sheet.module.ts","../../../../libs/components/action-sheet/src/acorex-components-action-sheet.ts"],"sourcesContent":["import {\n AXClosbaleComponent,\n AXComponentCloseEvent,\n AXFocusableComponent,\n MXBaseComponent,\n} from '@acorex/components/common';\nimport { DIALOG_DATA, DialogRef } from '@angular/cdk/dialog';\nimport { CdkPortalOutletAttachedRef, ComponentPortal, Portal, TemplatePortal } from '@angular/cdk/portal';\nimport {\n ChangeDetectionStrategy,\n Component,\n ComponentRef,\n HostListener,\n Inject,\n OnInit,\n TemplateRef,\n ViewEncapsulation,\n} from '@angular/core';\nimport { AXActionSheetData, AXActionSheetItem } from './action-sheet.class';\n\n@Component({\n selector: 'ax-action-sheet',\n templateUrl: './action-sheet.component.html',\n styleUrls: ['./action-sheet.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [\n {\n provide: AXClosbaleComponent,\n useExisting: AXActionSheetComponent,\n },\n {\n provide: AXFocusableComponent,\n useExisting: AXActionSheetComponent,\n },\n ],\n})\nexport class AXActionSheetComponent extends MXBaseComponent implements OnInit {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n protected _selectedPortal: Portal<any>;\n\n private _componentRef: unknown;\n\n /**\n * @ignore\n */\n constructor(\n @Inject(DIALOG_DATA)\n protected data: AXActionSheetData,\n private dialogRef: DialogRef<AXComponentCloseEvent>,\n ) {\n super();\n }\n\n ngOnInit(): void {\n super.ngOnInit();\n if (this.data.content) {\n if (this.data.content instanceof TemplateRef) {\n this._selectedPortal = new TemplatePortal(this.data.content, this.getViewContainer(), {\n $implicit: this.data,\n ref: this,\n });\n this.cdr.markForCheck();\n } else if (typeof this.data.content === 'function') {\n this._selectedPortal = new ComponentPortal(this.data.content);\n this.cdr.markForCheck();\n }\n }\n }\n\n @HostListener('keydown.escape')\n protected onKeydownHandler() {\n const focusedOrHasFocused = this.getHostElement().matches(':focus-within');\n if (this.data.closeButton && focusedOrHasFocused) {\n this.close();\n }\n }\n\n _handleAttched(ref: CdkPortalOutletAttachedRef) {\n ref = ref as ComponentRef<any>;\n if (ref.instance) {\n this._componentRef = ref.instance;\n Object.assign(this._componentRef, this.data);\n Object.assign(this._componentRef, { _isPopup: true });\n if (ref.instance.onClosed) {\n ref.instance.onClosed.subscribe((e: AXComponentCloseEvent) => {\n this.close();\n });\n }\n }\n }\n\n onItemClick(item: AXActionSheetItem) {\n this.close();\n if (item?.onClick) item.onClick();\n }\n\n close() {\n this.dialogRef.close({\n component: this._componentRef,\n htmlElement: this.getHostElement(),\n data: this.data,\n });\n }\n}\n","<ax-header *ngIf=\"data.header\">\n <ax-prefix>\n <ax-title>{{ data.title | translate | async }}</ax-title>\n <ax-sub-title *ngIf=\"data.subTitle\">{{ data.subTitle }}</ax-sub-title>\n </ax-prefix>\n <ax-suffix>\n <ax-close-button *ngIf=\"data.closeButton\"></ax-close-button>\n </ax-suffix>\n</ax-header>\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n <ng-container *ngFor=\"let item of data.items\">\n <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" tabindex=\"0\"\n (click)=\"onItemClick(item)\">\n <span class=\"item-icon\" *ngIf=\"item.icon\" [class]=\"item.icon\"></span>\n <span class=\"item-text\">{{ item.text | translate | async }}</span>\n </div>\n </ng-container>\n</div>","import { Dialog } from '@angular/cdk/dialog';\nimport { GlobalPositionStrategy } from '@angular/cdk/overlay';\nimport { Injectable, inject } from '@angular/core';\nimport { Subject } from 'rxjs';\nimport { AXActionSheetConfig } from './action-sheet.class';\nimport { AXActionSheetComponent } from './action-sheet.component';\n\nexport interface AXActionSheetDialogRef {\n close(): void;\n closed: Subject<void>;\n}\n\n@Injectable()\nexport class AXActionSheetService {\n private dialog: Dialog = inject(Dialog);\n\n open(config: AXActionSheetConfig): Promise<AXActionSheetDialogRef> {\n const defaultConfig: AXActionSheetConfig = {\n title: 'action-sheet.title',\n closeButton: true,\n closeOnBackdropClick: true,\n header: true,\n };\n config = Object.assign(defaultConfig, config);\n\n const dialogRef = this.dialog.open(AXActionSheetComponent, {\n data: config,\n autoFocus: 'first-tabbable',\n restoreFocus: true,\n role: 'dialog',\n ariaModal: true,\n closeOnNavigation: true,\n closeOnDestroy: true,\n hasBackdrop: true,\n panelClass: ['ax-actionsheet-panel'],\n disableClose: config.closeOnBackdropClick ? false : true,\n positionStrategy: new GlobalPositionStrategy().centerHorizontally().bottom(),\n });\n const promise = new Promise<AXActionSheetDialogRef>((resolve) => {\n const closed = new Subject<void>();\n const axDialogRef: AXActionSheetDialogRef = {\n close: () => {\n dialogRef.close();\n },\n closed,\n };\n dialogRef.closed.subscribe(() => {\n closed.next();\n });\n if (resolve) {\n resolve(axDialogRef);\n }\n });\n return promise;\n }\n}\n","import { AXButtonModule } from '@acorex/components/button';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { AXCommonModule } from '@acorex/components/common';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { DialogModule } from '@angular/cdk/dialog';\nimport { AXActionSheetComponent } from './action-sheet.component';\nimport { AXActionSheetService } from './action-sheet.service';\nimport { AXTranslationModule } from '@acorex/core/translation';\n\nconst MODULES = [\n CommonModule,\n AXCommonModule,\n DragDropModule,\n A11yModule,\n AXButtonModule,\n PortalModule,\n AXDecoratorModule,\n AXTranslationModule,\n DialogModule,\n];\n\n@NgModule({\n declarations: [AXActionSheetComponent],\n imports: [...MODULES],\n exports: [AXActionSheetComponent],\n providers: [AXActionSheetService],\n})\nexport class AXActionSheetModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAqCM,MAAO,sBAAuB,SAAQ,eAAe,CAAA;AAMzD;;AAEG;IACH,WAEY,CAAA,IAAuB,EACzB,SAA2C,EAAA;AAEnD,QAAA,KAAK,EAAE,CAAC;QAHE,IAAI,CAAA,IAAA,GAAJ,IAAI,CAAmB;QACzB,IAAS,CAAA,SAAA,GAAT,SAAS,CAAkC;KAGpD;IAED,QAAQ,GAAA;QACN,KAAK,CAAC,QAAQ,EAAE,CAAC;AACjB,QAAA,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;AACrB,YAAA,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,YAAY,WAAW,EAAE;AAC5C,gBAAA,IAAI,CAAC,eAAe,GAAG,IAAI,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAAE,EAAE;oBACpF,SAAS,EAAE,IAAI,CAAC,IAAI;AACpB,oBAAA,GAAG,EAAE,IAAI;AACV,iBAAA,CAAC,CAAC;AACH,gBAAA,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE,CAAC;AACzB,aAAA;iBAAM,IAAI,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO,KAAK,UAAU,EAAE;AAClD,gBAAA,IAAI,CAAC,eAAe,GAAG,IAAI,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;AAC9D,gBAAA,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE,CAAC;AACzB,aAAA;AACF,SAAA;KACF;IAGS,gBAAgB,GAAA;QACxB,MAAM,mBAAmB,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,OAAO,CAAC,eAAe,CAAC,CAAC;AAC3E,QAAA,IAAI,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,mBAAmB,EAAE;YAChD,IAAI,CAAC,KAAK,EAAE,CAAC;AACd,SAAA;KACF;AAED,IAAA,cAAc,CAAC,GAA+B,EAAA;QAC5C,GAAG,GAAG,GAAwB,CAAC;QAC/B,IAAI,GAAG,CAAC,QAAQ,EAAE;AAChB,YAAA,IAAI,CAAC,aAAa,GAAG,GAAG,CAAC,QAAQ,CAAC;YAClC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;AAC7C,YAAA,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;AACtD,YAAA,IAAI,GAAG,CAAC,QAAQ,CAAC,QAAQ,EAAE;gBACzB,GAAG,CAAC,QAAQ,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAwB,KAAI;oBAC3D,IAAI,CAAC,KAAK,EAAE,CAAC;AACf,iBAAC,CAAC,CAAC;AACJ,aAAA;AACF,SAAA;KACF;AAED,IAAA,WAAW,CAAC,IAAuB,EAAA;QACjC,IAAI,CAAC,KAAK,EAAE,CAAC;QACb,IAAI,IAAI,EAAE,OAAO;YAAE,IAAI,CAAC,OAAO,EAAE,CAAC;KACnC;IAED,KAAK,GAAA;AACH,QAAA,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC;YACnB,SAAS,EAAE,IAAI,CAAC,aAAa;AAC7B,YAAA,WAAW,EAAE,IAAI,CAAC,cAAc,EAAE;YAClC,IAAI,EAAE,IAAI,CAAC,IAAI;AAChB,SAAA,CAAC,CAAC;KACJ;AAlEU,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,sBAAsB,kBAUvB,WAAW,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,SAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAVV,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,sBAAsB,EAXtB,QAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,gBAAA,EAAA,oBAAA,EAAA,EAAA,EAAA,SAAA,EAAA;AACT,YAAA;AACE,gBAAA,OAAO,EAAE,mBAAmB;AAC5B,gBAAA,WAAW,EAAE,sBAAsB;AACpC,aAAA;AACD,YAAA;AACE,gBAAA,OAAO,EAAE,oBAAoB;AAC7B,gBAAA,WAAW,EAAE,sBAAsB;AACpC,aAAA;AACF,SAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnCH,w2BAkBM,EAAA,MAAA,EAAA,CAAA,8xDAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,iBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,iBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,+BAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,MAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,2BAAA,EAAA,QAAA,EAAA,gJAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,IAAA,EAAA,OAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FDmBO,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAjBlC,SAAS;+BACE,iBAAiB,EAAA,eAAA,EAGV,uBAAuB,CAAC,MAAM,iBAChC,iBAAiB,CAAC,IAAI,EAC1B,SAAA,EAAA;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,mBAAmB;AAC5B,4BAAA,WAAW,EAAwB,sBAAA;AACpC,yBAAA;AACD,wBAAA;AACE,4BAAA,OAAO,EAAE,oBAAoB;AAC7B,4BAAA,WAAW,EAAwB,sBAAA;AACpC,yBAAA;AACF,qBAAA,EAAA,QAAA,EAAA,w2BAAA,EAAA,MAAA,EAAA,CAAA,8xDAAA,CAAA,EAAA,CAAA;;0BAYE,MAAM;2BAAC,WAAW,CAAA;iEAwBX,gBAAgB,EAAA,CAAA;sBADzB,YAAY;uBAAC,gBAAgB,CAAA;;;MEzDnB,oBAAoB,CAAA;AADjC,IAAA,WAAA,GAAA;AAEU,QAAA,IAAA,CAAA,MAAM,GAAW,MAAM,CAAC,MAAM,CAAC,CAAC;AAyCzC,KAAA;AAvCC,IAAA,IAAI,CAAC,MAA2B,EAAA;AAC9B,QAAA,MAAM,aAAa,GAAwB;AACzC,YAAA,KAAK,EAAE,oBAAoB;AAC3B,YAAA,WAAW,EAAE,IAAI;AACjB,YAAA,oBAAoB,EAAE,IAAI;AAC1B,YAAA,MAAM,EAAE,IAAI;SACb,CAAC;QACF,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;QAE9C,MAAM,SAAS,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,sBAAsB,EAAE;AACzD,YAAA,IAAI,EAAE,MAAM;AACZ,YAAA,SAAS,EAAE,gBAAgB;AAC3B,YAAA,YAAY,EAAE,IAAI;AAClB,YAAA,IAAI,EAAE,QAAQ;AACd,YAAA,SAAS,EAAE,IAAI;AACf,YAAA,iBAAiB,EAAE,IAAI;AACvB,YAAA,cAAc,EAAE,IAAI;AACpB,YAAA,WAAW,EAAE,IAAI;YACjB,UAAU,EAAE,CAAC,sBAAsB,CAAC;YACpC,YAAY,EAAE,MAAM,CAAC,oBAAoB,GAAG,KAAK,GAAG,IAAI;YACxD,gBAAgB,EAAE,IAAI,sBAAsB,EAAE,CAAC,kBAAkB,EAAE,CAAC,MAAM,EAAE;AAC7E,SAAA,CAAC,CAAC;QACH,MAAM,OAAO,GAAG,IAAI,OAAO,CAAyB,CAAC,OAAO,KAAI;AAC9D,YAAA,MAAM,MAAM,GAAG,IAAI,OAAO,EAAQ,CAAC;AACnC,YAAA,MAAM,WAAW,GAA2B;gBAC1C,KAAK,EAAE,MAAK;oBACV,SAAS,CAAC,KAAK,EAAE,CAAC;iBACnB;gBACD,MAAM;aACP,CAAC;AACF,YAAA,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,MAAK;gBAC9B,MAAM,CAAC,IAAI,EAAE,CAAC;AAChB,aAAC,CAAC,CAAC;AACH,YAAA,IAAI,OAAO,EAAE;gBACX,OAAO,CAAC,WAAW,CAAC,CAAC;AACtB,aAAA;AACH,SAAC,CAAC,CAAC;AACH,QAAA,OAAO,OAAO,CAAC;KAChB;8GAzCU,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA,CAAA,EAAA;kHAApB,oBAAoB,EAAA,CAAA,CAAA,EAAA;;2FAApB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBADhC,UAAU;;;ACEX,MAAM,OAAO,GAAG;IACd,YAAY;IACZ,cAAc;IACd,cAAc;IACd,UAAU;IACV,cAAc;IACd,YAAY;IACZ,iBAAiB;IACjB,mBAAmB;IACnB,YAAY;CACb,CAAC;MAQW,mBAAmB,CAAA;8GAAnB,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;+GAAnB,mBAAmB,EAAA,YAAA,EAAA,CALf,sBAAsB,CAAA,EAAA,OAAA,EAAA,CAZrC,YAAY;YACZ,cAAc;YACd,cAAc;YACd,UAAU;YACV,cAAc;YACd,YAAY;YACZ,iBAAiB;YACjB,mBAAmB;AACnB,YAAA,YAAY,aAMF,sBAAsB,CAAA,EAAA,CAAA,CAAA,EAAA;AAGrB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,mBAAmB,EAFnB,SAAA,EAAA,CAAC,oBAAoB,CAAC,YAFpB,OAAO,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAIT,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAN/B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,sBAAsB,CAAC;AACtC,oBAAA,OAAO,EAAE,CAAC,GAAG,OAAO,CAAC;oBACrB,OAAO,EAAE,CAAC,sBAAsB,CAAC;oBACjC,SAAS,EAAE,CAAC,oBAAoB,CAAC;AAClC,iBAAA,CAAA;;;AC/BD;;AAEG;;;;"}
|
|
@@ -592,7 +592,7 @@ class AXCalendarComponent extends classes((MXValueComponent), MXInteractiveCompo
|
|
|
592
592
|
useExisting: AXCalendarComponent
|
|
593
593
|
},
|
|
594
594
|
AXUnsubscriber,
|
|
595
|
-
], usesInheritance: true, ngImport: i0, template: "<!-- ax-col-start-1 ax-col-start-2 ax-col-start-3 ax-col-start-4 ax-col-start-5 ax-col-start-6 ax-col-start-7 -->\n<ng-container *ngIf=\"interface === 'calendar'; else pickerTemplate\">\n <ng-content select=\"ax-header\"></ng-content>\n <div class=\"ax-calendar-body\">\n <ng-container *ngFor=\"let v of views; let first = first; let last = last\">\n <div [ngSwitch]=\"activeView\">\n <ng-container *ngSwitchCase=\"'year'\">\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-state-disabled\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }} - {{ v.range.endTime.format('YYYY') }}\n </button>\n </div>\n <div class=\"ax-calendar-header-buttons\" *ngIf=\"last\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon ax-next\" (click)=\"_handlePrevClick()\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-year\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <div tabindex=\"0\" *ngFor=\"let slot of v.slots\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n <ng-container *ngIf=\"cellTemplate; else yearTpl\">\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n </ng-container>\n <ng-template #yearTpl>\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n </ng-template>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'month'\">\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n </div>\n <div class=\"ax-calendar-header-buttons\" *ngIf=\"last\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-month\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <div tabindex=\"0\" *ngFor=\"let slot of v.slots\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n <ng-container *ngIf=\"cellTemplate; else monthTpl\">\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n </ng-container>\n <ng-template #monthTpl>\n <div [title]=\"slot.tooltip\">\n {{getMonthName(slot.date,'short') | translate}}\n </div>\n </ng-template>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'month')\">\n {{getMonthName(v.range.startTime,'long') | translate}}\n </button>\n </div>\n <div class=\"ax-calendar-header-buttons\" *ngIf=\"last\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n </div>\n <div class=\"ax-calendar-week\">\n <div *ngFor=\"let d of _weekdays\">{{ ('dateTime.weekdays.short.'+d) | translate }}</div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-day\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <ng-container *ngFor=\"let slot of v.slots\">\n <div tabindex=\"0\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n <ng-container *ngIf=\"cellTemplate; else dayTpl\">\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n </ng-container>\n <ng-template #dayTpl>\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n </ng-template>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </div>\n <ng-content select=\"ax-footer\"></ng-content>\n</ng-container>\n<ng-template #pickerTemplate>\n <div class=\"ax-calendar-picker\">//TODO: picker</div>\n</ng-template>", styles: [".ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-200))}.ax-dark ax-calendar .ax-calendar-footer:is(.ax-dark ax-calendar .ax-calendar-footer:focus,.ax-dark ax-calendar .ax-calendar-footer:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}html[dir=rtl] ax-calendar .ax-calendar-header-buttons{flex-direction:row-reverse}ax-calendar{display:block;width:100%;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity))}@media (min-width: 768px){ax-calendar{width:-webkit-max-content;width:-moz-max-content;width:max-content}}ax-calendar.ax-state-disabled .ax-calendar-slots{cursor:not-allowed;opacity:.5}ax-calendar.ax-state-readonly .ax-calendar-slots{cursor:text;opacity:.75}ax-calendar .ax-calendar-header{display:flex;justify-content:space-between;padding-left:.25rem;padding-right:.25rem;padding-top:.25rem}ax-calendar .ax-calendar-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body{display:flex;flex-direction:column}@media (min-width: 1024px){ax-calendar .ax-calendar-body{flex-direction:column}}ax-calendar .ax-calendar-body>div{width:100%;flex:1 1 0%}@media (min-width: 768px){ax-calendar .ax-calendar-body>div{width:20rem}}ax-calendar .ax-calendar-body .ax-calendar-view-header{display:flex;justify-content:space-between;border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.5rem}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body .ax-calendar-slots{display:grid;grid-gap:.25rem;gap:.25rem;padding:1rem}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-rounded-border-default);text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-surface-fore));transition-property:color,background-color,border-color,fill,stroke,-webkit-text-decoration-color;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,-webkit-text-decoration-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:before{content:\"\";float:left;padding-top:100%}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:after{content:\"\";clear:both;display:block}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-width:2px;outline-color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled{outline-style:dashed;outline-width:2px}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-1{grid-column-start:1}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-2{grid-column-start:2}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-3{grid-column-start:3}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-4{grid-column-start:4}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-5{grid-column-start:5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-6{grid-column-start:6}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-7{grid-column-start:7}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other{opacity:.05}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-width:1px;border-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-focused{border-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-500))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-day{grid-template-columns:repeat(7,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-year,ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-month{grid-template-columns:repeat(4,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding-left:.5rem;padding-right:.5rem;padding-top:.75rem}ax-calendar .ax-calendar-body .ax-calendar-week>div{position:relative;margin:.125rem;display:flex;cursor:pointer;align-items:center;justify-content:center;text-align:center;font-size:.875rem;line-height:1.25rem}ax-calendar .ax-calendar-footer{margin-top:1.25rem;display:flex;align-items:center;justify-content:center}ax-calendar .ax-calendar-footer .ax-today-button{display:block;height:var(--ax-size-default);width:100%;cursor:pointer;border-radius:var(--ax-rounded-border-default);background-color:rgba(var(--ax-color-primary-500));padding-left:1rem;padding-right:1rem;text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:hover):not(.ax-state-disabled){background-color:rgba(var(--ax-color-primary-600))}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:focus,ax-calendar .ax-calendar-footer .ax-today-button:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-500),1)}.ax-calendar-picker{display:flex;width:100%}.ax-calendar-picker ax-picker{flex:1 1 0%}.ax-overlay-pane ax-calendar{border-style:none}\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: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
595
|
+
], usesInheritance: true, ngImport: i0, template: "<!-- ax-col-start-1 ax-col-start-2 ax-col-start-3 ax-col-start-4 ax-col-start-5 ax-col-start-6 ax-col-start-7 -->\n<ng-container *ngIf=\"interface === 'calendar'; else pickerTemplate\">\n <ng-content select=\"ax-header\"></ng-content>\n <div class=\"ax-calendar-body\">\n <ng-container *ngFor=\"let v of views; let first = first; let last = last\">\n <div [ngSwitch]=\"activeView\">\n <ng-container *ngSwitchCase=\"'year'\">\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-state-disabled\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }} - {{ v.range.endTime.format('YYYY') }}\n </button>\n </div>\n <div class=\"ax-calendar-header-buttons\" *ngIf=\"last\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon ax-next\" (click)=\"_handlePrevClick()\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-year\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <div tabindex=\"0\" *ngFor=\"let slot of v.slots\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n <ng-container *ngIf=\"cellTemplate; else yearTpl\">\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n </ng-container>\n <ng-template #yearTpl>\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n </ng-template>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'month'\">\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n </div>\n <div class=\"ax-calendar-header-buttons\" *ngIf=\"last\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-month\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <div tabindex=\"0\" *ngFor=\"let slot of v.slots\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n <ng-container *ngIf=\"cellTemplate; else monthTpl\">\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n </ng-container>\n <ng-template #monthTpl>\n <div [title]=\"slot.tooltip\">\n {{getMonthName(slot.date,'short') | translate | async }}\n </div>\n </ng-template>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'month')\">\n {{getMonthName(v.range.startTime,'long') | translate | async }}\n </button>\n </div>\n <div class=\"ax-calendar-header-buttons\" *ngIf=\"last\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n </div>\n <div class=\"ax-calendar-week\">\n <div *ngFor=\"let d of _weekdays\">{{ ('dateTime.weekdays.short.'+d) | translate | async }}</div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-day\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <ng-container *ngFor=\"let slot of v.slots\">\n <div tabindex=\"0\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n <ng-container *ngIf=\"cellTemplate; else dayTpl\">\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n </ng-container>\n <ng-template #dayTpl>\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n </ng-template>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </div>\n <ng-content select=\"ax-footer\"></ng-content>\n</ng-container>\n<ng-template #pickerTemplate>\n <div class=\"ax-calendar-picker\">//TODO: picker</div>\n</ng-template>", styles: [".ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-200))}.ax-dark ax-calendar .ax-calendar-footer:is(.ax-dark ax-calendar .ax-calendar-footer:focus,.ax-dark ax-calendar .ax-calendar-footer:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}html[dir=rtl] ax-calendar .ax-calendar-header-buttons{flex-direction:row-reverse}ax-calendar{display:block;width:100%;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity))}@media (min-width: 768px){ax-calendar{width:-webkit-max-content;width:-moz-max-content;width:max-content}}ax-calendar.ax-state-disabled .ax-calendar-slots{cursor:not-allowed;opacity:.5}ax-calendar.ax-state-readonly .ax-calendar-slots{cursor:text;opacity:.75}ax-calendar .ax-calendar-header{display:flex;justify-content:space-between;padding-left:.25rem;padding-right:.25rem;padding-top:.25rem}ax-calendar .ax-calendar-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body{display:flex;flex-direction:column}@media (min-width: 1024px){ax-calendar .ax-calendar-body{flex-direction:column}}ax-calendar .ax-calendar-body>div{width:100%;flex:1 1 0%}@media (min-width: 768px){ax-calendar .ax-calendar-body>div{width:20rem}}ax-calendar .ax-calendar-body .ax-calendar-view-header{display:flex;justify-content:space-between;border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.5rem}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body .ax-calendar-slots{display:grid;grid-gap:.25rem;gap:.25rem;padding:1rem}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-rounded-border-default);text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-surface-fore));transition-property:color,background-color,border-color,fill,stroke,-webkit-text-decoration-color;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,-webkit-text-decoration-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:before{content:\"\";float:left;padding-top:100%}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:after{content:\"\";clear:both;display:block}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-width:2px;outline-color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled{outline-style:dashed;outline-width:2px}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-1{grid-column-start:1}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-2{grid-column-start:2}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-3{grid-column-start:3}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-4{grid-column-start:4}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-5{grid-column-start:5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-6{grid-column-start:6}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-7{grid-column-start:7}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other{opacity:.05}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-width:1px;border-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-focused{border-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-500))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-day{grid-template-columns:repeat(7,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-year,ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-month{grid-template-columns:repeat(4,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding-left:.5rem;padding-right:.5rem;padding-top:.75rem}ax-calendar .ax-calendar-body .ax-calendar-week>div{position:relative;margin:.125rem;display:flex;cursor:pointer;align-items:center;justify-content:center;text-align:center;font-size:.875rem;line-height:1.25rem}ax-calendar .ax-calendar-footer{margin-top:1.25rem;display:flex;align-items:center;justify-content:center}ax-calendar .ax-calendar-footer .ax-today-button{display:block;height:var(--ax-size-default);width:100%;cursor:pointer;border-radius:var(--ax-rounded-border-default);background-color:rgba(var(--ax-color-primary-500));padding-left:1rem;padding-right:1rem;text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:hover):not(.ax-state-disabled){background-color:rgba(var(--ax-color-primary-600))}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:focus,ax-calendar .ax-calendar-footer .ax-today-button:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-500),1)}.ax-calendar-picker{display:flex;width:100%}.ax-calendar-picker ax-picker{flex:1 1 0%}.ax-overlay-pane ax-calendar{border-style:none}\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: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
596
596
|
}
|
|
597
597
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AXCalendarComponent, decorators: [{
|
|
598
598
|
type: Component,
|
|
@@ -640,7 +640,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
|
|
|
640
640
|
useExisting: AXCalendarComponent
|
|
641
641
|
},
|
|
642
642
|
AXUnsubscriber,
|
|
643
|
-
], template: "<!-- ax-col-start-1 ax-col-start-2 ax-col-start-3 ax-col-start-4 ax-col-start-5 ax-col-start-6 ax-col-start-7 -->\n<ng-container *ngIf=\"interface === 'calendar'; else pickerTemplate\">\n <ng-content select=\"ax-header\"></ng-content>\n <div class=\"ax-calendar-body\">\n <ng-container *ngFor=\"let v of views; let first = first; let last = last\">\n <div [ngSwitch]=\"activeView\">\n <ng-container *ngSwitchCase=\"'year'\">\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-state-disabled\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }} - {{ v.range.endTime.format('YYYY') }}\n </button>\n </div>\n <div class=\"ax-calendar-header-buttons\" *ngIf=\"last\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon ax-next\" (click)=\"_handlePrevClick()\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-year\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <div tabindex=\"0\" *ngFor=\"let slot of v.slots\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n <ng-container *ngIf=\"cellTemplate; else yearTpl\">\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n </ng-container>\n <ng-template #yearTpl>\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n </ng-template>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'month'\">\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n </div>\n <div class=\"ax-calendar-header-buttons\" *ngIf=\"last\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-month\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <div tabindex=\"0\" *ngFor=\"let slot of v.slots\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n <ng-container *ngIf=\"cellTemplate; else monthTpl\">\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n </ng-container>\n <ng-template #monthTpl>\n <div [title]=\"slot.tooltip\">\n {{getMonthName(slot.date,'short') | translate}}\n </div>\n </ng-template>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'month')\">\n {{getMonthName(v.range.startTime,'long') | translate}}\n </button>\n </div>\n <div class=\"ax-calendar-header-buttons\" *ngIf=\"last\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n </div>\n <div class=\"ax-calendar-week\">\n <div *ngFor=\"let d of _weekdays\">{{ ('dateTime.weekdays.short.'+d) | translate }}</div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-day\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <ng-container *ngFor=\"let slot of v.slots\">\n <div tabindex=\"0\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n <ng-container *ngIf=\"cellTemplate; else dayTpl\">\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n </ng-container>\n <ng-template #dayTpl>\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n </ng-template>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </div>\n <ng-content select=\"ax-footer\"></ng-content>\n</ng-container>\n<ng-template #pickerTemplate>\n <div class=\"ax-calendar-picker\">//TODO: picker</div>\n</ng-template>", styles: [".ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-200))}.ax-dark ax-calendar .ax-calendar-footer:is(.ax-dark ax-calendar .ax-calendar-footer:focus,.ax-dark ax-calendar .ax-calendar-footer:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}html[dir=rtl] ax-calendar .ax-calendar-header-buttons{flex-direction:row-reverse}ax-calendar{display:block;width:100%;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity))}@media (min-width: 768px){ax-calendar{width:-webkit-max-content;width:-moz-max-content;width:max-content}}ax-calendar.ax-state-disabled .ax-calendar-slots{cursor:not-allowed;opacity:.5}ax-calendar.ax-state-readonly .ax-calendar-slots{cursor:text;opacity:.75}ax-calendar .ax-calendar-header{display:flex;justify-content:space-between;padding-left:.25rem;padding-right:.25rem;padding-top:.25rem}ax-calendar .ax-calendar-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body{display:flex;flex-direction:column}@media (min-width: 1024px){ax-calendar .ax-calendar-body{flex-direction:column}}ax-calendar .ax-calendar-body>div{width:100%;flex:1 1 0%}@media (min-width: 768px){ax-calendar .ax-calendar-body>div{width:20rem}}ax-calendar .ax-calendar-body .ax-calendar-view-header{display:flex;justify-content:space-between;border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.5rem}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body .ax-calendar-slots{display:grid;grid-gap:.25rem;gap:.25rem;padding:1rem}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-rounded-border-default);text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-surface-fore));transition-property:color,background-color,border-color,fill,stroke,-webkit-text-decoration-color;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,-webkit-text-decoration-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:before{content:\"\";float:left;padding-top:100%}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:after{content:\"\";clear:both;display:block}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-width:2px;outline-color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled{outline-style:dashed;outline-width:2px}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-1{grid-column-start:1}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-2{grid-column-start:2}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-3{grid-column-start:3}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-4{grid-column-start:4}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-5{grid-column-start:5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-6{grid-column-start:6}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-7{grid-column-start:7}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other{opacity:.05}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-width:1px;border-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-focused{border-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-500))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-day{grid-template-columns:repeat(7,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-year,ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-month{grid-template-columns:repeat(4,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding-left:.5rem;padding-right:.5rem;padding-top:.75rem}ax-calendar .ax-calendar-body .ax-calendar-week>div{position:relative;margin:.125rem;display:flex;cursor:pointer;align-items:center;justify-content:center;text-align:center;font-size:.875rem;line-height:1.25rem}ax-calendar .ax-calendar-footer{margin-top:1.25rem;display:flex;align-items:center;justify-content:center}ax-calendar .ax-calendar-footer .ax-today-button{display:block;height:var(--ax-size-default);width:100%;cursor:pointer;border-radius:var(--ax-rounded-border-default);background-color:rgba(var(--ax-color-primary-500));padding-left:1rem;padding-right:1rem;text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:hover):not(.ax-state-disabled){background-color:rgba(var(--ax-color-primary-600))}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:focus,ax-calendar .ax-calendar-footer .ax-today-button:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-500),1)}.ax-calendar-picker{display:flex;width:100%}.ax-calendar-picker ax-picker{flex:1 1 0%}.ax-overlay-pane ax-calendar{border-style:none}\n"] }]
|
|
643
|
+
], template: "<!-- ax-col-start-1 ax-col-start-2 ax-col-start-3 ax-col-start-4 ax-col-start-5 ax-col-start-6 ax-col-start-7 -->\n<ng-container *ngIf=\"interface === 'calendar'; else pickerTemplate\">\n <ng-content select=\"ax-header\"></ng-content>\n <div class=\"ax-calendar-body\">\n <ng-container *ngFor=\"let v of views; let first = first; let last = last\">\n <div [ngSwitch]=\"activeView\">\n <ng-container *ngSwitchCase=\"'year'\">\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-state-disabled\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }} - {{ v.range.endTime.format('YYYY') }}\n </button>\n </div>\n <div class=\"ax-calendar-header-buttons\" *ngIf=\"last\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon ax-next\" (click)=\"_handlePrevClick()\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-year\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <div tabindex=\"0\" *ngFor=\"let slot of v.slots\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n <ng-container *ngIf=\"cellTemplate; else yearTpl\">\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n </ng-container>\n <ng-template #yearTpl>\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n </ng-template>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'month'\">\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n </div>\n <div class=\"ax-calendar-header-buttons\" *ngIf=\"last\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-month\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <div tabindex=\"0\" *ngFor=\"let slot of v.slots\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n <ng-container *ngIf=\"cellTemplate; else monthTpl\">\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n </ng-container>\n <ng-template #monthTpl>\n <div [title]=\"slot.tooltip\">\n {{getMonthName(slot.date,'short') | translate | async }}\n </div>\n </ng-template>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'month')\">\n {{getMonthName(v.range.startTime,'long') | translate | async }}\n </button>\n </div>\n <div class=\"ax-calendar-header-buttons\" *ngIf=\"last\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n </div>\n <div class=\"ax-calendar-week\">\n <div *ngFor=\"let d of _weekdays\">{{ ('dateTime.weekdays.short.'+d) | translate | async }}</div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-day\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <ng-container *ngFor=\"let slot of v.slots\">\n <div tabindex=\"0\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n <ng-container *ngIf=\"cellTemplate; else dayTpl\">\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n </ng-container>\n <ng-template #dayTpl>\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n </ng-template>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </div>\n </ng-container>\n </div>\n <ng-content select=\"ax-footer\"></ng-content>\n</ng-container>\n<ng-template #pickerTemplate>\n <div class=\"ax-calendar-picker\">//TODO: picker</div>\n</ng-template>", styles: [".ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-200))}.ax-dark ax-calendar .ax-calendar-footer:is(.ax-dark ax-calendar .ax-calendar-footer:focus,.ax-dark ax-calendar .ax-calendar-footer:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}html[dir=rtl] ax-calendar .ax-calendar-header-buttons{flex-direction:row-reverse}ax-calendar{display:block;width:100%;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity))}@media (min-width: 768px){ax-calendar{width:-webkit-max-content;width:-moz-max-content;width:max-content}}ax-calendar.ax-state-disabled .ax-calendar-slots{cursor:not-allowed;opacity:.5}ax-calendar.ax-state-readonly .ax-calendar-slots{cursor:text;opacity:.75}ax-calendar .ax-calendar-header{display:flex;justify-content:space-between;padding-left:.25rem;padding-right:.25rem;padding-top:.25rem}ax-calendar .ax-calendar-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body{display:flex;flex-direction:column}@media (min-width: 1024px){ax-calendar .ax-calendar-body{flex-direction:column}}ax-calendar .ax-calendar-body>div{width:100%;flex:1 1 0%}@media (min-width: 768px){ax-calendar .ax-calendar-body>div{width:20rem}}ax-calendar .ax-calendar-body .ax-calendar-view-header{display:flex;justify-content:space-between;border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.5rem}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body .ax-calendar-slots{display:grid;grid-gap:.25rem;gap:.25rem;padding:1rem}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-rounded-border-default);text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-surface-fore));transition-property:color,background-color,border-color,fill,stroke,-webkit-text-decoration-color;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,-webkit-text-decoration-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:before{content:\"\";float:left;padding-top:100%}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:after{content:\"\";clear:both;display:block}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-width:2px;outline-color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled{outline-style:dashed;outline-width:2px}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-1{grid-column-start:1}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-2{grid-column-start:2}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-3{grid-column-start:3}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-4{grid-column-start:4}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-5{grid-column-start:5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-6{grid-column-start:6}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-7{grid-column-start:7}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other{opacity:.05}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-width:1px;border-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-focused{border-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-500))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-day{grid-template-columns:repeat(7,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-year,ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-month{grid-template-columns:repeat(4,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding-left:.5rem;padding-right:.5rem;padding-top:.75rem}ax-calendar .ax-calendar-body .ax-calendar-week>div{position:relative;margin:.125rem;display:flex;cursor:pointer;align-items:center;justify-content:center;text-align:center;font-size:.875rem;line-height:1.25rem}ax-calendar .ax-calendar-footer{margin-top:1.25rem;display:flex;align-items:center;justify-content:center}ax-calendar .ax-calendar-footer .ax-today-button{display:block;height:var(--ax-size-default);width:100%;cursor:pointer;border-radius:var(--ax-rounded-border-default);background-color:rgba(var(--ax-color-primary-500));padding-left:1rem;padding-right:1rem;text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:hover):not(.ax-state-disabled){background-color:rgba(var(--ax-color-primary-600))}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:focus,ax-calendar .ax-calendar-footer .ax-today-button:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-500),1)}.ax-calendar-picker{display:flex;width:100%}.ax-calendar-picker ax-picker{flex:1 1 0%}.ax-overlay-pane ax-calendar{border-style:none}\n"] }]
|
|
644
644
|
}], ctorParameters: () => [{ type: i1.AXUnsubscriber }], propDecorators: { __hostClass: [{
|
|
645
645
|
type: HostBinding,
|
|
646
646
|
args: ['class']
|