@acorex/components 19.10.0-next.4 → 19.10.0-next.6
Sign up to get free protection for your applications and to get access to all the features.
- package/fesm2022/acorex-components-conversation.mjs +2 -2
- package/fesm2022/acorex-components-conversation.mjs.map +1 -1
- package/fesm2022/acorex-components-data-table.mjs +10 -6
- package/fesm2022/acorex-components-data-table.mjs.map +1 -1
- package/fesm2022/acorex-components-dialog.mjs +2 -2
- package/fesm2022/acorex-components-navbar.mjs +2 -2
- package/fesm2022/acorex-components-navbar.mjs.map +1 -1
- package/fesm2022/acorex-components-progress-bar.mjs +2 -2
- package/fesm2022/acorex-components-progress-bar.mjs.map +1 -1
- package/fesm2022/acorex-components-rate-picker.mjs +2 -2
- package/fesm2022/acorex-components-rate-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-skeleton.mjs +2 -2
- package/fesm2022/acorex-components-skeleton.mjs.map +1 -1
- package/fesm2022/acorex-components-step-wizard.mjs +2 -2
- package/fesm2022/acorex-components-step-wizard.mjs.map +1 -1
- package/fesm2022/acorex-components-switch.mjs +2 -2
- package/fesm2022/acorex-components-switch.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-text-box.mjs +2 -2
- package/fesm2022/acorex-components-text-box.mjs.map +1 -1
- package/fesm2022/acorex-components-tree-view.mjs +4 -4
- package/fesm2022/acorex-components-tree-view.mjs.map +1 -1
- package/package.json +13 -13
|
@@ -69,7 +69,7 @@ class AXDialogComponent extends MXBaseComponent {
|
|
|
69
69
|
provide: AXClosbaleComponent,
|
|
70
70
|
useExisting: AXDialogComponent,
|
|
71
71
|
},
|
|
72
|
-
], usesInheritance: true, ngImport: i0, template: "<div\n class=\"ax-dialog ax-orientation-{{ data.orientation }}\"\n tabindex=\"-1\"\n cdkDrag\n cdkDragHandle\n [cdkDragDisabled]=\"!data.draggable\"\n>\n <div class=\"ax-dialog-content-wrapper\">\n @if (data.icon !== 'none') {\n <div class=\"ax-dialog-icon-side\">\n <i class=\"ax-dialog-icon {{ data.icon }}\"></i>\n </div>\n }\n <div class=\"ax-dialog-content-side\">\n <div class=\"ax-dialog-title\">{{ data.title }}</div>\n <div class=\"ax-dialog-content\">{{ data.content }}</div>\n </div>\n <div class=\"ax-dialog-dismiss-icon\">\n @if (data.closeButton) {\n <i class=\"ax-icon ax-icon-close\"></i>\n }\n </div>\n </div>\n <ax-footer>\n @for (button of data.buttons; let i = $index; track i) {\n <ax-button\n [text]=\"button.text | translate | async\"\n [tabindex]=\"i\"\n [axHotkey]=\"button.hotkey\"\n [axAutoFocus]=\"_hasAutoFocus(button)\"\n (onClick)=\"_handleButtonClick(button)\"\n [look]=\"button.look\"\n [disabled]=\"button.disabled\"\n [color]=\"button.color\"\n >\n @if (button.loading) {\n <ax-loading></ax-loading>\n }\n </ax-button>\n }\n </ax-footer>\n</div>\n", styles: ["ax-dialog.ax-primary{--ax-comp-dialog-icon-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-dialog-icon-text-color: var(--ax-sys-color-primary-
|
|
72
|
+
], usesInheritance: true, ngImport: i0, template: "<div\n class=\"ax-dialog ax-orientation-{{ data.orientation }}\"\n tabindex=\"-1\"\n cdkDrag\n cdkDragHandle\n [cdkDragDisabled]=\"!data.draggable\"\n>\n <div class=\"ax-dialog-content-wrapper\">\n @if (data.icon !== 'none') {\n <div class=\"ax-dialog-icon-side\">\n <i class=\"ax-dialog-icon {{ data.icon }}\"></i>\n </div>\n }\n <div class=\"ax-dialog-content-side\">\n <div class=\"ax-dialog-title\">{{ data.title }}</div>\n <div class=\"ax-dialog-content\">{{ data.content }}</div>\n </div>\n <div class=\"ax-dialog-dismiss-icon\">\n @if (data.closeButton) {\n <i class=\"ax-icon ax-icon-close\"></i>\n }\n </div>\n </div>\n <ax-footer>\n @for (button of data.buttons; let i = $index; track i) {\n <ax-button\n [text]=\"button.text | translate | async\"\n [tabindex]=\"i\"\n [axHotkey]=\"button.hotkey\"\n [axAutoFocus]=\"_hasAutoFocus(button)\"\n (onClick)=\"_handleButtonClick(button)\"\n [look]=\"button.look\"\n [disabled]=\"button.disabled\"\n [color]=\"button.color\"\n >\n @if (button.loading) {\n <ax-loading></ax-loading>\n }\n </ax-button>\n }\n </ax-footer>\n</div>\n", styles: ["ax-dialog.ax-primary{--ax-comp-dialog-icon-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-dialog-icon-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-dialog-border-color: var(--ax-sys-color-border-primary-surface)}ax-dialog.ax-secondary{--ax-comp-dialog-icon-bg-color: var(--ax-sys-color-secondary-surface);--ax-comp-dialog-icon-text-color: var(--ax-sys-color-on-secondary-surface);--ax-comp-dialog-border-color: var(--ax-sys-color-border-secondary-surface)}ax-dialog.ax-success{--ax-comp-dialog-icon-bg-color: var(--ax-sys-color-success-surface);--ax-comp-dialog-icon-text-color: var(--ax-sys-color-on-success-surface);--ax-comp-dialog-border-color: var(--ax-sys-color-border-success-surface)}ax-dialog.ax-warning{--ax-comp-dialog-icon-bg-color: var(--ax-sys-color-warning-surface);--ax-comp-dialog-icon-text-color: var(--ax-sys-color-on-warning-surface);--ax-comp-dialog-border-color: var(--ax-sys-color-border-warning-surface)}ax-dialog.ax-danger{--ax-comp-dialog-icon-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-dialog-icon-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-dialog-border-color: var(--ax-sys-color-border-danger-surface)}.ax-dialog{position:relative;display:flex;width:93vw;flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));color:rgba(var(--ax-sys-color-on-lightest-surface));outline:2px solid transparent;outline-offset:2px}@media (min-width: 768px){.ax-dialog{width:75vw}}@media (min-width: 1024px){.ax-dialog{width:50vw}}@media (min-width: 1280px){.ax-dialog{width:35vw}}@media (min-width: 1536px){.ax-dialog{width:25vw}}.ax-dialog.ax-orientation-horizontal .ax-dialog-content-wrapper{flex-direction:row}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper{flex-direction:column;align-items:center}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-icon-side{margin-bottom:1rem}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-content-side{margin:0;text-align:center}.ax-dialog.ax-orientation-vertical ax-footer ax-button{flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper{display:flex;gap:.5rem;padding:1.5rem 1.5rem 1rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-icon-side .ax-dialog-icon{background-color:rgba(var(--ax-comp-dialog-icon-bg-color));color:rgba(var(--ax-comp-dialog-icon-text-color));border-width:1px;border-color:rgba(var(--ax-comp-dialog-border-color));border-style:solid;display:flex;height:3rem;width:3rem;cursor:move;align-items:center;justify-content:center;border-radius:9999px;font-size:1.5rem;line-height:2rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side{margin-inline-start:1rem;flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-title{margin-bottom:.5rem;font-size:1.125rem;line-height:1.5rem;font-weight:500}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-content{font-size:.875rem;line-height:1.25rem}.ax-dialog ax-footer{justify-content:flex-end;padding:.75rem 1.5rem}\n"], dependencies: [{ kind: "directive", type: i2.AXAutoFocusDirective, selector: "[axAutoFocus]", inputs: ["axAutoFocus", "axAutoFocusTime"] }, { kind: "directive", type: i2.AXHotkeyDirective, selector: "[axHotkey]", inputs: ["axHotkey"] }, { kind: "directive", type: i3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i3.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i5.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: i6.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "pipe", type: i7.AsyncPipe, name: "async" }, { kind: "pipe", type: i8.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
73
73
|
}
|
|
74
74
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXDialogComponent, decorators: [{
|
|
75
75
|
type: Component,
|
|
@@ -78,7 +78,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
|
|
|
78
78
|
provide: AXClosbaleComponent,
|
|
79
79
|
useExisting: AXDialogComponent,
|
|
80
80
|
},
|
|
81
|
-
], standalone: false, template: "<div\n class=\"ax-dialog ax-orientation-{{ data.orientation }}\"\n tabindex=\"-1\"\n cdkDrag\n cdkDragHandle\n [cdkDragDisabled]=\"!data.draggable\"\n>\n <div class=\"ax-dialog-content-wrapper\">\n @if (data.icon !== 'none') {\n <div class=\"ax-dialog-icon-side\">\n <i class=\"ax-dialog-icon {{ data.icon }}\"></i>\n </div>\n }\n <div class=\"ax-dialog-content-side\">\n <div class=\"ax-dialog-title\">{{ data.title }}</div>\n <div class=\"ax-dialog-content\">{{ data.content }}</div>\n </div>\n <div class=\"ax-dialog-dismiss-icon\">\n @if (data.closeButton) {\n <i class=\"ax-icon ax-icon-close\"></i>\n }\n </div>\n </div>\n <ax-footer>\n @for (button of data.buttons; let i = $index; track i) {\n <ax-button\n [text]=\"button.text | translate | async\"\n [tabindex]=\"i\"\n [axHotkey]=\"button.hotkey\"\n [axAutoFocus]=\"_hasAutoFocus(button)\"\n (onClick)=\"_handleButtonClick(button)\"\n [look]=\"button.look\"\n [disabled]=\"button.disabled\"\n [color]=\"button.color\"\n >\n @if (button.loading) {\n <ax-loading></ax-loading>\n }\n </ax-button>\n }\n </ax-footer>\n</div>\n", styles: ["ax-dialog.ax-primary{--ax-comp-dialog-icon-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-dialog-icon-text-color: var(--ax-sys-color-primary-
|
|
81
|
+
], standalone: false, template: "<div\n class=\"ax-dialog ax-orientation-{{ data.orientation }}\"\n tabindex=\"-1\"\n cdkDrag\n cdkDragHandle\n [cdkDragDisabled]=\"!data.draggable\"\n>\n <div class=\"ax-dialog-content-wrapper\">\n @if (data.icon !== 'none') {\n <div class=\"ax-dialog-icon-side\">\n <i class=\"ax-dialog-icon {{ data.icon }}\"></i>\n </div>\n }\n <div class=\"ax-dialog-content-side\">\n <div class=\"ax-dialog-title\">{{ data.title }}</div>\n <div class=\"ax-dialog-content\">{{ data.content }}</div>\n </div>\n <div class=\"ax-dialog-dismiss-icon\">\n @if (data.closeButton) {\n <i class=\"ax-icon ax-icon-close\"></i>\n }\n </div>\n </div>\n <ax-footer>\n @for (button of data.buttons; let i = $index; track i) {\n <ax-button\n [text]=\"button.text | translate | async\"\n [tabindex]=\"i\"\n [axHotkey]=\"button.hotkey\"\n [axAutoFocus]=\"_hasAutoFocus(button)\"\n (onClick)=\"_handleButtonClick(button)\"\n [look]=\"button.look\"\n [disabled]=\"button.disabled\"\n [color]=\"button.color\"\n >\n @if (button.loading) {\n <ax-loading></ax-loading>\n }\n </ax-button>\n }\n </ax-footer>\n</div>\n", styles: ["ax-dialog.ax-primary{--ax-comp-dialog-icon-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-dialog-icon-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-dialog-border-color: var(--ax-sys-color-border-primary-surface)}ax-dialog.ax-secondary{--ax-comp-dialog-icon-bg-color: var(--ax-sys-color-secondary-surface);--ax-comp-dialog-icon-text-color: var(--ax-sys-color-on-secondary-surface);--ax-comp-dialog-border-color: var(--ax-sys-color-border-secondary-surface)}ax-dialog.ax-success{--ax-comp-dialog-icon-bg-color: var(--ax-sys-color-success-surface);--ax-comp-dialog-icon-text-color: var(--ax-sys-color-on-success-surface);--ax-comp-dialog-border-color: var(--ax-sys-color-border-success-surface)}ax-dialog.ax-warning{--ax-comp-dialog-icon-bg-color: var(--ax-sys-color-warning-surface);--ax-comp-dialog-icon-text-color: var(--ax-sys-color-on-warning-surface);--ax-comp-dialog-border-color: var(--ax-sys-color-border-warning-surface)}ax-dialog.ax-danger{--ax-comp-dialog-icon-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-dialog-icon-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-dialog-border-color: var(--ax-sys-color-border-danger-surface)}.ax-dialog{position:relative;display:flex;width:93vw;flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));color:rgba(var(--ax-sys-color-on-lightest-surface));outline:2px solid transparent;outline-offset:2px}@media (min-width: 768px){.ax-dialog{width:75vw}}@media (min-width: 1024px){.ax-dialog{width:50vw}}@media (min-width: 1280px){.ax-dialog{width:35vw}}@media (min-width: 1536px){.ax-dialog{width:25vw}}.ax-dialog.ax-orientation-horizontal .ax-dialog-content-wrapper{flex-direction:row}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper{flex-direction:column;align-items:center}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-icon-side{margin-bottom:1rem}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-content-side{margin:0;text-align:center}.ax-dialog.ax-orientation-vertical ax-footer ax-button{flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper{display:flex;gap:.5rem;padding:1.5rem 1.5rem 1rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-icon-side .ax-dialog-icon{background-color:rgba(var(--ax-comp-dialog-icon-bg-color));color:rgba(var(--ax-comp-dialog-icon-text-color));border-width:1px;border-color:rgba(var(--ax-comp-dialog-border-color));border-style:solid;display:flex;height:3rem;width:3rem;cursor:move;align-items:center;justify-content:center;border-radius:9999px;font-size:1.5rem;line-height:2rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side{margin-inline-start:1rem;flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-title{margin-bottom:.5rem;font-size:1.125rem;line-height:1.5rem;font-weight:500}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-content{font-size:.875rem;line-height:1.25rem}.ax-dialog ax-footer{justify-content:flex-end;padding:.75rem 1.5rem}\n"] }]
|
|
82
82
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
83
83
|
type: Inject,
|
|
84
84
|
args: [DIALOG_DATA]
|
|
@@ -13,11 +13,11 @@ class AXNavbarComponent extends MXLookComponent {
|
|
|
13
13
|
return `ax-alert ax-none ax-${this.look}`;
|
|
14
14
|
}
|
|
15
15
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXNavbarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
16
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: AXNavbarComponent, isStandalone: false, selector: "ax-navbar", inputs: { look: "look" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-navbar-start-side\">\n <ng-content select=\"ax-prefix\"></ng-content>\n <ng-content select=\"ax-title\"></ng-content>\n</div>\n<ng-content></ng-content>\n<div class=\"ax-navbar-end-side\">\n <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n", styles: ["ax-navbar{display:flex;min-height:3.5rem;width:100%;align-items:center;justify-content:space-between;gap:.75rem;padding-inline:1rem;padding-block:.5rem
|
|
16
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: AXNavbarComponent, isStandalone: false, selector: "ax-navbar", inputs: { look: "look" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-navbar-start-side\">\n <ng-content select=\"ax-prefix\"></ng-content>\n <ng-content select=\"ax-title\"></ng-content>\n</div>\n<ng-content></ng-content>\n<div class=\"ax-navbar-end-side\">\n <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n", styles: ["ax-navbar.ax-fill{--ax-comp-navbar-bg-color: var(--ax-sys-color-surface)}ax-navbar.ax-flat{--ax-comp-navbar-border-color: var(--ax-sys-color-border-lightest-surface);--ax-comp-navbar-border-width: 1px}.ax-dark ax-navbar.ax-flat{--ax-comp-navbar-border-color: var(--ax-sys-color-border-darkest-surface)}ax-navbar.ax-solid{--ax-comp-navbar-bg-color: var(--ax-sys-color-lightest-surface)}.ax-dark ax-navbar.ax-solid{--ax-comp-navbar-bg-color: var(--ax-sys-color-darkest-surface)}ax-navbar{display:flex;min-height:3.5rem;width:100%;align-items:center;justify-content:space-between;gap:.75rem;padding-inline:1rem;padding-block:.5rem;background-color:rgba(var(--ax-comp-navbar-bg-color, none));border-bottom-width:var(--ax-comp-navbar-border-width, 0);border-color:rgba(var(--ax-comp-navbar-border-color, none))}ax-navbar .ax-navbar-start-side{margin-inline-end:2rem;display:flex;align-items:center;gap:.5rem;font-size:1rem;line-height:1.5rem}ax-navbar .ax-navbar-start-side ax-title{font-size:1.125rem;line-height:1.75rem;font-weight:600}ax-navbar .ax-navbar-end-side ax-suffix{display:flex;gap:.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
17
17
|
}
|
|
18
18
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXNavbarComponent, decorators: [{
|
|
19
19
|
type: Component,
|
|
20
|
-
args: [{ selector: 'ax-navbar', inputs: ['look'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: false, template: "<div class=\"ax-navbar-start-side\">\n <ng-content select=\"ax-prefix\"></ng-content>\n <ng-content select=\"ax-title\"></ng-content>\n</div>\n<ng-content></ng-content>\n<div class=\"ax-navbar-end-side\">\n <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n", styles: ["ax-navbar{display:flex;min-height:3.5rem;width:100%;align-items:center;justify-content:space-between;gap:.75rem;padding-inline:1rem;padding-block:.5rem
|
|
20
|
+
args: [{ selector: 'ax-navbar', inputs: ['look'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: false, template: "<div class=\"ax-navbar-start-side\">\n <ng-content select=\"ax-prefix\"></ng-content>\n <ng-content select=\"ax-title\"></ng-content>\n</div>\n<ng-content></ng-content>\n<div class=\"ax-navbar-end-side\">\n <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n", styles: ["ax-navbar.ax-fill{--ax-comp-navbar-bg-color: var(--ax-sys-color-surface)}ax-navbar.ax-flat{--ax-comp-navbar-border-color: var(--ax-sys-color-border-lightest-surface);--ax-comp-navbar-border-width: 1px}.ax-dark ax-navbar.ax-flat{--ax-comp-navbar-border-color: var(--ax-sys-color-border-darkest-surface)}ax-navbar.ax-solid{--ax-comp-navbar-bg-color: var(--ax-sys-color-lightest-surface)}.ax-dark ax-navbar.ax-solid{--ax-comp-navbar-bg-color: var(--ax-sys-color-darkest-surface)}ax-navbar{display:flex;min-height:3.5rem;width:100%;align-items:center;justify-content:space-between;gap:.75rem;padding-inline:1rem;padding-block:.5rem;background-color:rgba(var(--ax-comp-navbar-bg-color, none));border-bottom-width:var(--ax-comp-navbar-border-width, 0);border-color:rgba(var(--ax-comp-navbar-border-color, none))}ax-navbar .ax-navbar-start-side{margin-inline-end:2rem;display:flex;align-items:center;gap:.5rem;font-size:1rem;line-height:1.5rem}ax-navbar .ax-navbar-start-side ax-title{font-size:1.125rem;line-height:1.75rem;font-weight:600}ax-navbar .ax-navbar-end-side ax-suffix{display:flex;gap:.5rem}\n"] }]
|
|
21
21
|
}], propDecorators: { __hostClass: [{
|
|
22
22
|
type: HostBinding,
|
|
23
23
|
args: ['class']
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"acorex-components-navbar.mjs","sources":["../../../../libs/components/navbar/src/lib/navbar.component.ts","../../../../libs/components/navbar/src/lib/navbar.component.html","../../../../libs/components/navbar/src/lib/navbar.module.ts","../../../../libs/components/navbar/src/acorex-components-navbar.ts"],"sourcesContent":["import { MXLookComponent } from '@acorex/components/common';\nimport { ChangeDetectionStrategy, Component, HostBinding, ViewEncapsulation } from '@angular/core';\n\n/**\n * @category Components\n * A navigation bar component that supports custom styling and encapsulation.\n */\n@Component({\n selector: 'ax-navbar',\n templateUrl: './navbar.component.html',\n styleUrls: ['./navbar.component.scss'],\n inputs: ['look'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n standalone: false,\n})\nexport class AXNavbarComponent extends MXLookComponent {\n /** @ignore */\n @HostBinding('class')\n get __hostClass(): string {\n return `ax-alert ax-none ax-${this.look}`;\n }\n}\n","<div class=\"ax-navbar-start-side\">\n <ng-content select=\"ax-prefix\"></ng-content>\n <ng-content select=\"ax-title\"></ng-content>\n</div>\n<ng-content></ng-content>\n<div class=\"ax-navbar-end-side\">\n <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXNavbarComponent } from './navbar.component';\n\n@NgModule({\n declarations: [AXNavbarComponent],\n imports: [CommonModule],\n exports: [AXNavbarComponent],\n})\nexport class AXNavbarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAGA;;;AAGG;AAUG,MAAO,iBAAkB,SAAQ,eAAe,CAAA;;AAEpD,IAAA,IACI,WAAW,GAAA;AACb,QAAA,OAAO,CAAuB,oBAAA,EAAA,IAAI,CAAC,IAAI,EAAE;;8GAJhC,iBAAiB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,8KChB9B,4QAQA,EAAA,MAAA,EAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"acorex-components-navbar.mjs","sources":["../../../../libs/components/navbar/src/lib/navbar.component.ts","../../../../libs/components/navbar/src/lib/navbar.component.html","../../../../libs/components/navbar/src/lib/navbar.module.ts","../../../../libs/components/navbar/src/acorex-components-navbar.ts"],"sourcesContent":["import { MXLookComponent } from '@acorex/components/common';\nimport { ChangeDetectionStrategy, Component, HostBinding, ViewEncapsulation } from '@angular/core';\n\n/**\n * @category Components\n * A navigation bar component that supports custom styling and encapsulation.\n */\n@Component({\n selector: 'ax-navbar',\n templateUrl: './navbar.component.html',\n styleUrls: ['./navbar.component.scss'],\n inputs: ['look'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n standalone: false,\n})\nexport class AXNavbarComponent extends MXLookComponent {\n /** @ignore */\n @HostBinding('class')\n get __hostClass(): string {\n return `ax-alert ax-none ax-${this.look}`;\n }\n}\n","<div class=\"ax-navbar-start-side\">\n <ng-content select=\"ax-prefix\"></ng-content>\n <ng-content select=\"ax-title\"></ng-content>\n</div>\n<ng-content></ng-content>\n<div class=\"ax-navbar-end-side\">\n <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXNavbarComponent } from './navbar.component';\n\n@NgModule({\n declarations: [AXNavbarComponent],\n imports: [CommonModule],\n exports: [AXNavbarComponent],\n})\nexport class AXNavbarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAGA;;;AAGG;AAUG,MAAO,iBAAkB,SAAQ,eAAe,CAAA;;AAEpD,IAAA,IACI,WAAW,GAAA;AACb,QAAA,OAAO,CAAuB,oBAAA,EAAA,IAAI,CAAC,IAAI,EAAE;;8GAJhC,iBAAiB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,8KChB9B,4QAQA,EAAA,MAAA,EAAA,CAAA,4kCAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FDQa,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAT7B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,EAGb,MAAA,EAAA,CAAC,MAAM,CAAC,EACC,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAChC,aAAA,EAAA,iBAAiB,CAAC,IAAI,cACzB,KAAK,EAAA,QAAA,EAAA,4QAAA,EAAA,MAAA,EAAA,CAAA,4kCAAA,CAAA,EAAA;8BAKb,WAAW,EAAA,CAAA;sBADd,WAAW;uBAAC,OAAO;;;METT,cAAc,CAAA;8GAAd,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAd,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,cAAc,EAJV,YAAA,EAAA,CAAA,iBAAiB,CACtB,EAAA,OAAA,EAAA,CAAA,YAAY,aACZ,iBAAiB,CAAA,EAAA,CAAA,CAAA;AAEhB,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,cAAc,YAHf,YAAY,CAAA,EAAA,CAAA,CAAA;;2FAGX,cAAc,EAAA,UAAA,EAAA,CAAA;kBAL1B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,iBAAiB,CAAC;oBACjC,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,iBAAiB,CAAC;AAC7B,iBAAA;;;ACRD;;AAEG;;;;"}
|
|
@@ -63,11 +63,11 @@ class AXProgressBarComponent extends MXColorComponent {
|
|
|
63
63
|
return `ax-${this['color']}`;
|
|
64
64
|
}
|
|
65
65
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXProgressBarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
66
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXProgressBarComponent, isStandalone: false, selector: "ax-progress-bar", inputs: { color: "color", mode: "mode", progress: "progress", height: "height" }, outputs: { ValueChange: "ValueChange", sizeChange: "sizeChange" }, host: { properties: { "class": "this.__hostClass" } }, viewQueries: [{ propertyName: "circle", first: true, predicate: ["c"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\"></ng-content>\n@switch (mode) {\n @case ('indeterminate') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-indeterminate-progress\"></div>\n </div>\n }\n @case ('query') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-query-progress\"></div>\n </div>\n }\n @case ('buffer') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-buffer-progress\"></div>\n </div>\n }\n @default {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar\" [style.width.%]=\"progress\"></div>\n </div>\n }\n}\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["ax-progress-bar.ax-default{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-
|
|
66
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXProgressBarComponent, isStandalone: false, selector: "ax-progress-bar", inputs: { color: "color", mode: "mode", progress: "progress", height: "height" }, outputs: { ValueChange: "ValueChange", sizeChange: "sizeChange" }, host: { properties: { "class": "this.__hostClass" } }, viewQueries: [{ propertyName: "circle", first: true, predicate: ["c"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-prefix\"></ng-content>\n@switch (mode) {\n @case ('indeterminate') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-indeterminate-progress\"></div>\n </div>\n }\n @case ('query') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-query-progress\"></div>\n </div>\n }\n @case ('buffer') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-buffer-progress\"></div>\n </div>\n }\n @default {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar\" [style.width.%]=\"progress\"></div>\n </div>\n }\n}\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["ax-progress-bar.ax-default{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-primary-surface)}ax-progress-bar{--ax-comp-progress-bar-backdrop-bg-color: var(--ax-sys-color-light-surface)}ax-progress-bar.ax-primary{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-primary-surface)}ax-progress-bar.ax-secondary{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-secondary-surface)}ax-progress-bar.ax-success{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-success-surface)}ax-progress-bar.ax-warning{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-warning-surface)}ax-progress-bar.ax-danger{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-danger-surface)}ax-progress-bar{display:flex;width:100%;align-items:center;justify-content:center;gap:.5rem;position:relative}ax-progress-bar .ax-progress{width:100%;overflow:hidden;background-color:rgba(var(--ax-comp-progress-bar-backdrop-bg-color));border-radius:var(--ax-sys-border-radius)}ax-progress-bar .ax-progress .ax-progress-bar{height:100%;background-color:rgba(var(--ax-comp-progress-bar-bg-color));transition-property:all;transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function);border-style:solid}ax-progress-bar .ax-indeterminate-progress{animation:indeterminateAnimation 1s infinite linear;transform-origin:0% 50%;width:100%;height:100%}@keyframes indeterminateAnimation{0%{transform:translate(0) scaleX(0)}40%{transform:translate(0) scaleX(.4)}to{transform:translate(100%) scaleX(.5)}}ax-progress-bar .ax-query-progress{animation:queryAnimation 1s infinite linear;transform-origin:0% 50%;width:100%;height:100%}@keyframes queryAnimation{0%{transform:translate(100%) scaleX(0)}40%{transform:translate(0) scaleX(.7)}to{transform:translate(-50%) scaleX(.5)}}ax-progress-bar .ax-buffer-progress{animation:bufferAnimation 5s infinite linear;transform-origin:0% 50%;width:100%;height:100%;background-color:transparent!important;background-image:repeating-linear-gradient(to right,transparent,transparent .5rem,rgba(var(--ax-comp-progress-bar-bg-color)) .5rem,rgba(var(--ax-comp-progress-bar-bg-color)) 1rem)!important;background-size:100%}@keyframes bufferAnimation{0%{transform:translate(-100%)}to{transform:translate(100%)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
67
67
|
}
|
|
68
68
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXProgressBarComponent, decorators: [{
|
|
69
69
|
type: Component,
|
|
70
|
-
args: [{ selector: 'ax-progress-bar', inputs: ['color'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: false, template: "<ng-content select=\"ax-prefix\"></ng-content>\n@switch (mode) {\n @case ('indeterminate') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-indeterminate-progress\"></div>\n </div>\n }\n @case ('query') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-query-progress\"></div>\n </div>\n }\n @case ('buffer') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-buffer-progress\"></div>\n </div>\n }\n @default {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar\" [style.width.%]=\"progress\"></div>\n </div>\n }\n}\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["ax-progress-bar.ax-default{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-
|
|
70
|
+
args: [{ selector: 'ax-progress-bar', inputs: ['color'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: false, template: "<ng-content select=\"ax-prefix\"></ng-content>\n@switch (mode) {\n @case ('indeterminate') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-indeterminate-progress\"></div>\n </div>\n }\n @case ('query') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-query-progress\"></div>\n </div>\n }\n @case ('buffer') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-buffer-progress\"></div>\n </div>\n }\n @default {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar\" [style.width.%]=\"progress\"></div>\n </div>\n }\n}\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["ax-progress-bar.ax-default{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-primary-surface)}ax-progress-bar{--ax-comp-progress-bar-backdrop-bg-color: var(--ax-sys-color-light-surface)}ax-progress-bar.ax-primary{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-primary-surface)}ax-progress-bar.ax-secondary{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-secondary-surface)}ax-progress-bar.ax-success{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-success-surface)}ax-progress-bar.ax-warning{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-warning-surface)}ax-progress-bar.ax-danger{--ax-comp-progress-bar-bg-color: var(--ax-sys-color-danger-surface)}ax-progress-bar{display:flex;width:100%;align-items:center;justify-content:center;gap:.5rem;position:relative}ax-progress-bar .ax-progress{width:100%;overflow:hidden;background-color:rgba(var(--ax-comp-progress-bar-backdrop-bg-color));border-radius:var(--ax-sys-border-radius)}ax-progress-bar .ax-progress .ax-progress-bar{height:100%;background-color:rgba(var(--ax-comp-progress-bar-bg-color));transition-property:all;transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function);border-style:solid}ax-progress-bar .ax-indeterminate-progress{animation:indeterminateAnimation 1s infinite linear;transform-origin:0% 50%;width:100%;height:100%}@keyframes indeterminateAnimation{0%{transform:translate(0) scaleX(0)}40%{transform:translate(0) scaleX(.4)}to{transform:translate(100%) scaleX(.5)}}ax-progress-bar .ax-query-progress{animation:queryAnimation 1s infinite linear;transform-origin:0% 50%;width:100%;height:100%}@keyframes queryAnimation{0%{transform:translate(100%) scaleX(0)}40%{transform:translate(0) scaleX(.7)}to{transform:translate(-50%) scaleX(.5)}}ax-progress-bar .ax-buffer-progress{animation:bufferAnimation 5s infinite linear;transform-origin:0% 50%;width:100%;height:100%;background-color:transparent!important;background-image:repeating-linear-gradient(to right,transparent,transparent .5rem,rgba(var(--ax-comp-progress-bar-bg-color)) .5rem,rgba(var(--ax-comp-progress-bar-bg-color)) 1rem)!important;background-size:100%}@keyframes bufferAnimation{0%{transform:translate(-100%)}to{transform:translate(100%)}}\n"] }]
|
|
71
71
|
}], propDecorators: { circle: [{
|
|
72
72
|
type: ViewChild,
|
|
73
73
|
args: ['c']
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"acorex-components-progress-bar.mjs","sources":["../../../../libs/components/progress-bar/src/lib/progress-bar.component.ts","../../../../libs/components/progress-bar/src/lib/progress-bar.component.html","../../../../libs/components/progress-bar/src/lib/progress-bar.module.ts","../../../../libs/components/progress-bar/src/acorex-components-progress-bar.ts"],"sourcesContent":["import { MXColorComponent } from '@acorex/components/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n EventEmitter,\n HostBinding,\n Input,\n Output,\n ViewChild,\n ViewEncapsulation,\n} from '@angular/core';\n\n/**\n * The Button is a component which detects user interaction and triggers a corresponding event\n *\n * @category Components\n */\n\nexport type AXProgressMode = 'determinate' | 'indeterminate' | 'buffer' | 'query';\n\n@Component({\n selector: 'ax-progress-bar',\n templateUrl: './progress-bar.component.html',\n styleUrls: ['./progress-bar.component.scss'],\n inputs: ['color'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n standalone: false,\n})\nexport class AXProgressBarComponent extends MXColorComponent {\n /** @ignore */\n @ViewChild('c') circle: ElementRef;\n\n /**\n * @event\n * Emits when the slider value changes.\n */\n @Output()\n ValueChange: EventEmitter<number> = new EventEmitter();\n\n /** @ignore */\n private _progress = 0;\n\n /**\n * Specifies the progress indicator mode.\n */\n @Input()\n mode: AXProgressMode = 'determinate';\n\n /**\n * Gets or sets the progress value (0-100).\n */\n @Input()\n\n /**\n * Retrieves the current progress value (0-100).\n */\n public get progress(): number {\n return this._progress;\n }\n\n /**\n * Sets the progress value (0-100).\n * @param {number} v\n */\n public set progress(v: number) {\n this.setOption({\n name: 'progress',\n value: v,\n });\n }\n\n /**\n * Emitted when the size changes.\n * @event\n */\n @Output()\n sizeChange: EventEmitter<number> = new EventEmitter();\n\n /** @ignore */\n private _height = 8;\n\n /**\n * Gets or sets the height of the component.\n * @param {number} v\n */\n @Input()\n\n /**\n * Gets the height of the component.\n */\n public get height(): number {\n return this._height;\n }\n\n /**\n * Sets the height of the component.\n * @param {number} v\n */\n public set height(v: number) {\n this.setOption({\n name: 'height',\n value: v,\n });\n }\n\n /** @ignore */\n @HostBinding('class')\n private get __hostClass(): string {\n return `ax-${this['color']}`;\n }\n}\n","<ng-content select=\"ax-prefix\"></ng-content>\n@switch (mode) {\n @case ('indeterminate') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-indeterminate-progress\"></div>\n </div>\n }\n @case ('query') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-query-progress\"></div>\n </div>\n }\n @case ('buffer') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-buffer-progress\"></div>\n </div>\n }\n @default {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar\" [style.width.%]=\"progress\"></div>\n </div>\n }\n}\n<ng-content select=\"ax-suffix\"></ng-content>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXProgressBarComponent } from './progress-bar.component';\n\n@NgModule({\n declarations: [AXProgressBarComponent],\n imports: [CommonModule],\n exports: [AXProgressBarComponent],\n providers: [],\n})\nexport class AXProgressBarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AA8BM,MAAO,sBAAuB,SAAQ,gBAAgB,CAAA;AAT5D,IAAA,WAAA,GAAA;;AAaE;;;AAGG;AAEH,QAAA,IAAA,CAAA,WAAW,GAAyB,IAAI,YAAY,EAAE;;QAG9C,IAAS,CAAA,SAAA,GAAG,CAAC;AAErB;;AAEG;QAEH,IAAI,CAAA,IAAA,GAAmB,aAAa;AAyBpC;;;AAGG;AAEH,QAAA,IAAA,CAAA,UAAU,GAAyB,IAAI,YAAY,EAAE;;QAG7C,IAAO,CAAA,OAAA,GAAG,CAAC;AA+BpB;AA9DC;;AAEG;AACH,IAAA,IAKW,QAAQ,GAAA;QACjB,OAAO,IAAI,CAAC,SAAS;;AAGvB;;;AAGG;IACH,IAAW,QAAQ,CAAC,CAAS,EAAA;QAC3B,IAAI,CAAC,SAAS,CAAC;AACb,YAAA,IAAI,EAAE,UAAU;AAChB,YAAA,KAAK,EAAE,CAAC;AACT,SAAA,CAAC;;AAaJ;;;AAGG;AACH,IAAA,IAKW,MAAM,GAAA;QACf,OAAO,IAAI,CAAC,OAAO;;AAGrB;;;AAGG;IACH,IAAW,MAAM,CAAC,CAAS,EAAA;QACzB,IAAI,CAAC,SAAS,CAAC;AACb,YAAA,IAAI,EAAE,QAAQ;AACd,YAAA,KAAK,EAAE,CAAC;AACT,SAAA,CAAC;;;AAIJ,IAAA,IACY,WAAW,GAAA;AACrB,QAAA,OAAO,MAAM,IAAI,CAAC,OAAO,CAAC,EAAE;;8GAhFnB,sBAAsB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAtB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,sBAAsB,4YC9BnC,62BAwBA,EAAA,MAAA,EAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"acorex-components-progress-bar.mjs","sources":["../../../../libs/components/progress-bar/src/lib/progress-bar.component.ts","../../../../libs/components/progress-bar/src/lib/progress-bar.component.html","../../../../libs/components/progress-bar/src/lib/progress-bar.module.ts","../../../../libs/components/progress-bar/src/acorex-components-progress-bar.ts"],"sourcesContent":["import { MXColorComponent } from '@acorex/components/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n EventEmitter,\n HostBinding,\n Input,\n Output,\n ViewChild,\n ViewEncapsulation,\n} from '@angular/core';\n\n/**\n * The Button is a component which detects user interaction and triggers a corresponding event\n *\n * @category Components\n */\n\nexport type AXProgressMode = 'determinate' | 'indeterminate' | 'buffer' | 'query';\n\n@Component({\n selector: 'ax-progress-bar',\n templateUrl: './progress-bar.component.html',\n styleUrls: ['./progress-bar.component.scss'],\n inputs: ['color'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n standalone: false,\n})\nexport class AXProgressBarComponent extends MXColorComponent {\n /** @ignore */\n @ViewChild('c') circle: ElementRef;\n\n /**\n * @event\n * Emits when the slider value changes.\n */\n @Output()\n ValueChange: EventEmitter<number> = new EventEmitter();\n\n /** @ignore */\n private _progress = 0;\n\n /**\n * Specifies the progress indicator mode.\n */\n @Input()\n mode: AXProgressMode = 'determinate';\n\n /**\n * Gets or sets the progress value (0-100).\n */\n @Input()\n\n /**\n * Retrieves the current progress value (0-100).\n */\n public get progress(): number {\n return this._progress;\n }\n\n /**\n * Sets the progress value (0-100).\n * @param {number} v\n */\n public set progress(v: number) {\n this.setOption({\n name: 'progress',\n value: v,\n });\n }\n\n /**\n * Emitted when the size changes.\n * @event\n */\n @Output()\n sizeChange: EventEmitter<number> = new EventEmitter();\n\n /** @ignore */\n private _height = 8;\n\n /**\n * Gets or sets the height of the component.\n * @param {number} v\n */\n @Input()\n\n /**\n * Gets the height of the component.\n */\n public get height(): number {\n return this._height;\n }\n\n /**\n * Sets the height of the component.\n * @param {number} v\n */\n public set height(v: number) {\n this.setOption({\n name: 'height',\n value: v,\n });\n }\n\n /** @ignore */\n @HostBinding('class')\n private get __hostClass(): string {\n return `ax-${this['color']}`;\n }\n}\n","<ng-content select=\"ax-prefix\"></ng-content>\n@switch (mode) {\n @case ('indeterminate') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-indeterminate-progress\"></div>\n </div>\n }\n @case ('query') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-query-progress\"></div>\n </div>\n }\n @case ('buffer') {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar ax-buffer-progress\"></div>\n </div>\n }\n @default {\n <div class=\"ax-progress\" [style.height.px]=\"height\" role=\"progressbar\">\n <div class=\"ax-progress-bar\" [style.width.%]=\"progress\"></div>\n </div>\n }\n}\n<ng-content select=\"ax-suffix\"></ng-content>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXProgressBarComponent } from './progress-bar.component';\n\n@NgModule({\n declarations: [AXProgressBarComponent],\n imports: [CommonModule],\n exports: [AXProgressBarComponent],\n providers: [],\n})\nexport class AXProgressBarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -274,7 +274,7 @@ class AXRatePickerComponent extends MXValueComponent {
|
|
|
274
274
|
useExisting: forwardRef(() => AXRatePickerComponent),
|
|
275
275
|
multi: true,
|
|
276
276
|
},
|
|
277
|
-
], viewQueries: [{ propertyName: "containerEl", first: true, predicate: ["c"], descendants: true, isSignal: true }, { propertyName: "ratingEl", first: true, predicate: ["r"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n #c\n class=\"ax-rate-picker-container\"\n (click)=\"calculateRate($event)\"\n (touchstart)=\"calculateRate($event)\"\n (mouseenter)=\"mouseEnter()\"\n (mouseleave)=\"mouseLeave()\"\n>\n <div #r class=\"ax-rate-picker-rating\" [style.width.%]=\"ratePercentage()\">\n <div class=\"ax-rate-picker-icons ax-rp-active\">\n @for (rate of rates(); track rate) {\n <i class=\"ax-rate-picker-icon fa-solid\" [class]=\"iconName()\" [class.pointer]=\"!this.readonly\"></i>\n }\n </div>\n </div>\n <div class=\"ax-rate-picker-icons ax-rp-inactive\">\n @for (rate of rates(); track rate) {\n <i class=\"ax-rate-picker-icon fa-solid\" [class]=\"iconName()\"></i>\n }\n </div>\n</div>\n", styles: [".ax-xs ax-rate-picker,ax-rate-picker.ax-xs{--ax-comp-rate-picker-font-size: 1rem}.ax-sm ax-rate-picker,ax-rate-picker.ax-sm{--ax-comp-rate-picker-font-size: 1.5rem}.ax-md ax-rate-picker,ax-rate-picker{--ax-comp-rate-picker-font-size: 2rem}.ax-lg ax-rate-picker,ax-rate-picker.ax-lg{--ax-comp-rate-picker-font-size: 2.5rem}.ax-xl ax-rate-picker,ax-rate-picker.ax-xl{--ax-comp-rate-picker-font-size: 3rem}ax-rate-picker{font-size:var(--ax-comp-rate-picker-font-size, 1.5rem)}ax-rate-picker.ax-active{cursor:pointer}ax-rate-picker.ax-disable{cursor:not-allowed;opacity:.5}ax-rate-picker .ax-rate-picker-container{position:relative;width:min-content}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-rating{position:relative;z-index:10;overflow:hidden}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-rating .ax-rate-picker-icons{display:flex}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-rating .ax-rate-picker-icons.ax-rp-active{color:rgba(var(--ax-comp-rate-picker-
|
|
277
|
+
], viewQueries: [{ propertyName: "containerEl", first: true, predicate: ["c"], descendants: true, isSignal: true }, { propertyName: "ratingEl", first: true, predicate: ["r"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n #c\n class=\"ax-rate-picker-container\"\n (click)=\"calculateRate($event)\"\n (touchstart)=\"calculateRate($event)\"\n (mouseenter)=\"mouseEnter()\"\n (mouseleave)=\"mouseLeave()\"\n>\n <div #r class=\"ax-rate-picker-rating\" [style.width.%]=\"ratePercentage()\">\n <div class=\"ax-rate-picker-icons ax-rp-active\">\n @for (rate of rates(); track rate) {\n <i class=\"ax-rate-picker-icon fa-solid\" [class]=\"iconName()\" [class.pointer]=\"!this.readonly\"></i>\n }\n </div>\n </div>\n <div class=\"ax-rate-picker-icons ax-rp-inactive\">\n @for (rate of rates(); track rate) {\n <i class=\"ax-rate-picker-icon fa-solid\" [class]=\"iconName()\"></i>\n }\n </div>\n</div>\n", styles: ["ax-rate-picker{--ax-comp-rate-picker-bg-color: var(--ax-sys-color-warning-surface);--ax-comp-rate-picker-inactive-bg-color: var(--ax-sys-color-dark);--ax-comp-rate-picker-inactive-bg-color-opacity: .2}.ax-dark ax-rate-picker{--ax-comp-rate-picker-inactive-bg-color: var(--ax-sys-color-light)}.ax-xs ax-rate-picker,ax-rate-picker.ax-xs{--ax-comp-rate-picker-font-size: 1rem}.ax-sm ax-rate-picker,ax-rate-picker.ax-sm{--ax-comp-rate-picker-font-size: 1.5rem}.ax-md ax-rate-picker,ax-rate-picker{--ax-comp-rate-picker-font-size: 2rem}.ax-lg ax-rate-picker,ax-rate-picker.ax-lg{--ax-comp-rate-picker-font-size: 2.5rem}.ax-xl ax-rate-picker,ax-rate-picker.ax-xl{--ax-comp-rate-picker-font-size: 3rem}ax-rate-picker{font-size:var(--ax-comp-rate-picker-font-size, 1.5rem)}ax-rate-picker.ax-active{cursor:pointer}ax-rate-picker.ax-disable{cursor:not-allowed;opacity:.5}ax-rate-picker .ax-rate-picker-container{position:relative;width:min-content}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-rating{position:relative;z-index:10;overflow:hidden}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-rating .ax-rate-picker-icons{display:flex}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-rating .ax-rate-picker-icons.ax-rp-active{color:rgba(var(--ax-comp-rate-picker-bg-color))}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-icons{display:flex}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-icons.ax-rp-inactive{color:rgba(var(--ax-comp-rate-picker-inactive-bg-color),var(--ax-comp-rate-picker-inactive-bg-color-opacity));position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:5}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
278
278
|
}
|
|
279
279
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXRatePickerComponent, decorators: [{
|
|
280
280
|
type: Component,
|
|
@@ -285,7 +285,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
|
|
|
285
285
|
useExisting: forwardRef(() => AXRatePickerComponent),
|
|
286
286
|
multi: true,
|
|
287
287
|
},
|
|
288
|
-
], standalone: false, template: "<div\n #c\n class=\"ax-rate-picker-container\"\n (click)=\"calculateRate($event)\"\n (touchstart)=\"calculateRate($event)\"\n (mouseenter)=\"mouseEnter()\"\n (mouseleave)=\"mouseLeave()\"\n>\n <div #r class=\"ax-rate-picker-rating\" [style.width.%]=\"ratePercentage()\">\n <div class=\"ax-rate-picker-icons ax-rp-active\">\n @for (rate of rates(); track rate) {\n <i class=\"ax-rate-picker-icon fa-solid\" [class]=\"iconName()\" [class.pointer]=\"!this.readonly\"></i>\n }\n </div>\n </div>\n <div class=\"ax-rate-picker-icons ax-rp-inactive\">\n @for (rate of rates(); track rate) {\n <i class=\"ax-rate-picker-icon fa-solid\" [class]=\"iconName()\"></i>\n }\n </div>\n</div>\n", styles: [".ax-xs ax-rate-picker,ax-rate-picker.ax-xs{--ax-comp-rate-picker-font-size: 1rem}.ax-sm ax-rate-picker,ax-rate-picker.ax-sm{--ax-comp-rate-picker-font-size: 1.5rem}.ax-md ax-rate-picker,ax-rate-picker{--ax-comp-rate-picker-font-size: 2rem}.ax-lg ax-rate-picker,ax-rate-picker.ax-lg{--ax-comp-rate-picker-font-size: 2.5rem}.ax-xl ax-rate-picker,ax-rate-picker.ax-xl{--ax-comp-rate-picker-font-size: 3rem}ax-rate-picker{font-size:var(--ax-comp-rate-picker-font-size, 1.5rem)}ax-rate-picker.ax-active{cursor:pointer}ax-rate-picker.ax-disable{cursor:not-allowed;opacity:.5}ax-rate-picker .ax-rate-picker-container{position:relative;width:min-content}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-rating{position:relative;z-index:10;overflow:hidden}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-rating .ax-rate-picker-icons{display:flex}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-rating .ax-rate-picker-icons.ax-rp-active{color:rgba(var(--ax-comp-rate-picker-
|
|
288
|
+
], standalone: false, template: "<div\n #c\n class=\"ax-rate-picker-container\"\n (click)=\"calculateRate($event)\"\n (touchstart)=\"calculateRate($event)\"\n (mouseenter)=\"mouseEnter()\"\n (mouseleave)=\"mouseLeave()\"\n>\n <div #r class=\"ax-rate-picker-rating\" [style.width.%]=\"ratePercentage()\">\n <div class=\"ax-rate-picker-icons ax-rp-active\">\n @for (rate of rates(); track rate) {\n <i class=\"ax-rate-picker-icon fa-solid\" [class]=\"iconName()\" [class.pointer]=\"!this.readonly\"></i>\n }\n </div>\n </div>\n <div class=\"ax-rate-picker-icons ax-rp-inactive\">\n @for (rate of rates(); track rate) {\n <i class=\"ax-rate-picker-icon fa-solid\" [class]=\"iconName()\"></i>\n }\n </div>\n</div>\n", styles: ["ax-rate-picker{--ax-comp-rate-picker-bg-color: var(--ax-sys-color-warning-surface);--ax-comp-rate-picker-inactive-bg-color: var(--ax-sys-color-dark);--ax-comp-rate-picker-inactive-bg-color-opacity: .2}.ax-dark ax-rate-picker{--ax-comp-rate-picker-inactive-bg-color: var(--ax-sys-color-light)}.ax-xs ax-rate-picker,ax-rate-picker.ax-xs{--ax-comp-rate-picker-font-size: 1rem}.ax-sm ax-rate-picker,ax-rate-picker.ax-sm{--ax-comp-rate-picker-font-size: 1.5rem}.ax-md ax-rate-picker,ax-rate-picker{--ax-comp-rate-picker-font-size: 2rem}.ax-lg ax-rate-picker,ax-rate-picker.ax-lg{--ax-comp-rate-picker-font-size: 2.5rem}.ax-xl ax-rate-picker,ax-rate-picker.ax-xl{--ax-comp-rate-picker-font-size: 3rem}ax-rate-picker{font-size:var(--ax-comp-rate-picker-font-size, 1.5rem)}ax-rate-picker.ax-active{cursor:pointer}ax-rate-picker.ax-disable{cursor:not-allowed;opacity:.5}ax-rate-picker .ax-rate-picker-container{position:relative;width:min-content}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-rating{position:relative;z-index:10;overflow:hidden}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-rating .ax-rate-picker-icons{display:flex}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-rating .ax-rate-picker-icons.ax-rp-active{color:rgba(var(--ax-comp-rate-picker-bg-color))}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-icons{display:flex}ax-rate-picker .ax-rate-picker-container .ax-rate-picker-icons.ax-rp-inactive{color:rgba(var(--ax-comp-rate-picker-inactive-bg-color),var(--ax-comp-rate-picker-inactive-bg-color-opacity));position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:5}\n"] }]
|
|
289
289
|
}], ctorParameters: () => [], propDecorators: { isActive: [{
|
|
290
290
|
type: HostBinding,
|
|
291
291
|
args: ['class.ax-active']
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"acorex-components-rate-picker.mjs","sources":["../../../../libs/components/rate-picker/src/lib/calculatePercentage.ts","../../../../libs/components/rate-picker/src/lib/rate-picker.component.ts","../../../../libs/components/rate-picker/src/lib/rate-picker.component.html","../../../../libs/components/rate-picker/src/lib/rate-picker.module.ts","../../../../libs/components/rate-picker/src/acorex-components-rate-picker.ts"],"sourcesContent":["/**\n * Calculates the horizontal position of a pointer event (mouse or touch) as a percentage\n * of the target element's width.\n *\n * @param event - The mouse or touch event to get the pointer position from.\n * @returns The percentage of the event's position relative to the target element's width,\n * or -1 if the event is invalid.\n *\n * @remarks\n * - For `MouseEvent`, it uses the `clientX` property.\n * - For `TouchEvent`, it uses the `clientX` of the first touch point.\n * - Returns `-1` if the event is neither a valid `MouseEvent` nor a `TouchEvent`.\n *\n * @example\n * ```typescript\n * document.addEventListener('click', function(event) {\n * const percentage = getPointerPercentage(event);\n * console.log(`Click position: ${percentage.toFixed(2)}% of the element's width`);\n * });\n *\n * document.addEventListener('touchstart', function(event) {\n * const percentage = getPointerPercentage(event);\n * console.log(`Touch position: ${percentage.toFixed(2)}% of the element's width`);\n * });\n * ```\n */\nexport function getPointerPercentage(event: MouseEvent | TouchEvent): number {\n let clientX: number;\n\n if (event instanceof MouseEvent) {\n clientX = event.clientX; // Mouse event uses clientX\n } else if (event instanceof TouchEvent && event.touches.length > 0) {\n clientX = event.touches[0].clientX; // Touch event uses the first touch's clientX\n } else {\n return -1; // Return -1 for invalid events\n }\n\n // Use currentTarget to get the bounding box of the element the event listener is attached to\n const rect = (event.currentTarget as HTMLElement).getBoundingClientRect();\n const clickX = clientX - rect.left; // Calculate X position relative to the element\n const divWidth = rect.width; // Get the width from the bounding box\n const percentage = (clickX / divWidth) * 100; // Calculate percentage\n\n return percentage;\n}\n","import { AXValuableComponent, MXValueComponent } from '@acorex/components/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n effect,\n ElementRef,\n forwardRef,\n HostBinding,\n inject,\n input,\n Renderer2,\n signal,\n viewChild,\n ViewEncapsulation,\n} from '@angular/core';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { getPointerPercentage } from './calculatePercentage';\n\n/**\n * @description\n * The `AXRatePickerComponent` provides a customizable rating picker.\n * The component allows users to select a rating between 0 and the defined maximum.\n * It supports transitions, dynamic value changes, and hover states.\n *\n * @example\n * <ax-rate-picker [max]=\"5\" [readonly]=\"false\" [disabled]=\"false\"></ax-rate-picker>\n */\n@Component({\n selector: 'ax-rate-picker',\n templateUrl: './rate-picker.component.html',\n styleUrls: ['./rate-picker.component.scss'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n inputs: ['readonly', 'disabled'],\n providers: [\n { provide: AXValuableComponent, useExisting: AXRatePickerComponent },\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => AXRatePickerComponent),\n multi: true,\n },\n ],\n standalone: false,\n})\nexport class AXRatePickerComponent extends MXValueComponent<number> {\n /**\n * @description\n * The icon to be used for each rating point.\n * @default 'fa-star'\n */\n iconName = input('fa-star');\n\n /**\n * @description\n * Maximum value for the rating.\n * Defines how many rating points are available.\n * @default 5\n */\n max = input(5);\n\n /**\n * @description\n * Defines the step increment between rating values.\n * The rating value will be rounded to the nearest multiple of this step.\n * @default 0.01\n */\n step = input(0.01);\n\n /**\n * @description\n * Whether the rating should have a transition effect when changing values.\n * @default true\n */\n hasTransition = input(true);\n\n /**\n * @description\n * The percentage of the current rating value relative to the maximum rating.\n */\n protected ratePercentage = computed(() => Math.round((this.currentValue() / this.max()) * 10000) / 100);\n\n /**\n * @description\n * The current rating value as a signal.\n */\n private currentValue = signal(this.max());\n\n /**\n * @description\n * State for tracking hover status and previous value.\n */\n private prevState: { ishover: boolean; previousValue?: number } = {\n ishover: false,\n previousValue: undefined,\n };\n\n /**\n * @description\n * Reference to the container element.\n */\n containerEl = viewChild.required<ElementRef>('c');\n\n /**\n * @description\n * Reference to the rating element.\n */\n ratingEl = viewChild.required<ElementRef>('r');\n\n /**\n * @description\n * Renderer for manipulating styles.\n */\n renderer = inject(Renderer2);\n\n /**\n * @description\n * Array of rating values from 1 to `max`.\n */\n protected rates = computed(() =>\n Array(this.max())\n .fill(0)\n .map((_, index) => index + 1),\n );\n\n /**\n * @description\n * Initializes the component and sets up value change subscription.\n */\n constructor() {\n super();\n effect(() => {\n if (!this.hasTransition()) {\n this.renderer.removeStyle(this.ratingEl().nativeElement, 'transition');\n }\n return this.hasTransition();\n });\n this.onValueChanged.subscribe((val: { value }) => {\n if (val.value < 0) {\n this.currentValue.set(0);\n console.warn('ax-rate-picker: value cant be negative!');\n } else if (val.value > this.max()) {\n this.currentValue.set(this.max());\n console.warn('ax-rate-picker: value cant be more than max!');\n } else {\n this.currentValue.set(val.value);\n }\n });\n }\n\n /**\n * @description\n * Calculates and updates the rating based on the mouse or touch event.\n *\n * @param event - The mouse or touch event triggering the rating calculation.\n */\n protected calculateRate(event: MouseEvent | TouchEvent): void {\n if (this.hasTransition()) {\n this.renderer.removeStyle(this.ratingEl().nativeElement, 'transition');\n }\n event.preventDefault();\n if (!this.readonly && !this.disabled) {\n const pointerPercentage = getPointerPercentage(event);\n if (pointerPercentage === -1) {\n return console.warn('Only support touch and click events.');\n }\n const value = this.roundToStep(pointerPercentage);\n const decimals = this.countDecimals(this.step());\n if (this.prevState.ishover === true) {\n this.currentValue.set(value);\n } else {\n this.commitValue(Number(value.toFixed(decimals)));\n this.mouseEnter();\n }\n }\n }\n\n /**\n * @description\n * Rounds the rating value to the nearest step.\n *\n * @param percentage - The calculated percentage from pointer event.\n * @returns The rounded rating value.\n */\n private roundToStep(percentage: number): number {\n const value = (percentage / 100) * this.max();\n const value2 = Math.round(value / (this.step() || 0.01)) * this.step();\n return value2;\n }\n\n /**\n * @description\n * Handles mouse enter events to start tracking mouse movements for rating.\n */\n protected mouseEnter() {\n this.prevState = {\n ishover: true,\n previousValue: this.value,\n };\n if (this.hasTransition()) {\n this.renderer.setStyle(this.ratingEl().nativeElement, 'opacity', '80%');\n }\n const moveListener = (moveEvent: MouseEvent | TouchEvent) => this.calculateRate(moveEvent);\n const endListener = () => this.onEnd(moveListener, endListener);\n const container = this.containerEl().nativeElement;\n container.addEventListener('mousemove', moveListener);\n container.addEventListener('mouseup', endListener);\n container.addEventListener('mouseleave', endListener);\n }\n\n /**\n * @description\n * Handles mouse leave events to reset styles.\n */\n mouseLeave() {\n if (this.hasTransition()) {\n this.renderer.removeStyle(this.ratingEl().nativeElement, 'opacity');\n }\n }\n\n /**\n * @description\n * Cleans up event listeners and restores the previous rating value.\n *\n * @param moveListener - The function to remove for mouse move events.\n * @param endListener - The function to remove for mouse end events.\n */\n private onEnd(moveListener: (event: MouseEvent | TouchEvent) => void, endListener: () => void): void {\n if (this.hasTransition()) {\n this.renderer.setStyle(\n this.ratingEl().nativeElement,\n 'transition',\n `width ${this.max() * 50 + 250}ms cubic-bezier(0.29, 0.72, 0.68, 0.85)`,\n );\n this.renderer.removeStyle(this.ratingEl().nativeElement, 'opacity');\n }\n this.currentValue.set(this.prevState.previousValue);\n this.prevState = {\n ishover: false,\n previousValue: undefined,\n };\n const container = this.containerEl().nativeElement;\n container.removeEventListener('mousemove', moveListener);\n container.removeEventListener('mouseup', endListener);\n container.removeEventListener('mouseleave', endListener);\n }\n\n private countDecimals(number: number): number {\n if (Math.floor(number) === number) return 0;\n return number.toString().split('.')[1].length || 0;\n }\n\n /**\n * @description\n * Determines if the component is active (i.e., not readonly or disabled).\n */\n @HostBinding('class.ax-active') get isActive() {\n return !this.readonly && !this.disabled;\n }\n\n /**\n * @description\n * Determines if the component is in readonly mode.\n */\n @HostBinding('class.ax-readonly') get isReadonly() {\n return this.readonly;\n }\n\n /**\n * @description\n * Determines if the component is disabled.\n */\n @HostBinding('class.ax-disable') get isDisabled() {\n return this.disabled;\n }\n}\n","<div\n #c\n class=\"ax-rate-picker-container\"\n (click)=\"calculateRate($event)\"\n (touchstart)=\"calculateRate($event)\"\n (mouseenter)=\"mouseEnter()\"\n (mouseleave)=\"mouseLeave()\"\n>\n <div #r class=\"ax-rate-picker-rating\" [style.width.%]=\"ratePercentage()\">\n <div class=\"ax-rate-picker-icons ax-rp-active\">\n @for (rate of rates(); track rate) {\n <i class=\"ax-rate-picker-icon fa-solid\" [class]=\"iconName()\" [class.pointer]=\"!this.readonly\"></i>\n }\n </div>\n </div>\n <div class=\"ax-rate-picker-icons ax-rp-inactive\">\n @for (rate of rates(); track rate) {\n <i class=\"ax-rate-picker-icon fa-solid\" [class]=\"iconName()\"></i>\n }\n </div>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXRatePickerComponent } from './rate-picker.component';\n\n@NgModule({\n declarations: [AXRatePickerComponent],\n imports: [CommonModule],\n exports: [AXRatePickerComponent],\n})\nexport class AXRatePickerModule {}\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-rate-picker.mjs","sources":["../../../../libs/components/rate-picker/src/lib/calculatePercentage.ts","../../../../libs/components/rate-picker/src/lib/rate-picker.component.ts","../../../../libs/components/rate-picker/src/lib/rate-picker.component.html","../../../../libs/components/rate-picker/src/lib/rate-picker.module.ts","../../../../libs/components/rate-picker/src/acorex-components-rate-picker.ts"],"sourcesContent":["/**\n * Calculates the horizontal position of a pointer event (mouse or touch) as a percentage\n * of the target element's width.\n *\n * @param event - The mouse or touch event to get the pointer position from.\n * @returns The percentage of the event's position relative to the target element's width,\n * or -1 if the event is invalid.\n *\n * @remarks\n * - For `MouseEvent`, it uses the `clientX` property.\n * - For `TouchEvent`, it uses the `clientX` of the first touch point.\n * - Returns `-1` if the event is neither a valid `MouseEvent` nor a `TouchEvent`.\n *\n * @example\n * ```typescript\n * document.addEventListener('click', function(event) {\n * const percentage = getPointerPercentage(event);\n * console.log(`Click position: ${percentage.toFixed(2)}% of the element's width`);\n * });\n *\n * document.addEventListener('touchstart', function(event) {\n * const percentage = getPointerPercentage(event);\n * console.log(`Touch position: ${percentage.toFixed(2)}% of the element's width`);\n * });\n * ```\n */\nexport function getPointerPercentage(event: MouseEvent | TouchEvent): number {\n let clientX: number;\n\n if (event instanceof MouseEvent) {\n clientX = event.clientX; // Mouse event uses clientX\n } else if (event instanceof TouchEvent && event.touches.length > 0) {\n clientX = event.touches[0].clientX; // Touch event uses the first touch's clientX\n } else {\n return -1; // Return -1 for invalid events\n }\n\n // Use currentTarget to get the bounding box of the element the event listener is attached to\n const rect = (event.currentTarget as HTMLElement).getBoundingClientRect();\n const clickX = clientX - rect.left; // Calculate X position relative to the element\n const divWidth = rect.width; // Get the width from the bounding box\n const percentage = (clickX / divWidth) * 100; // Calculate percentage\n\n return percentage;\n}\n","import { AXValuableComponent, MXValueComponent } from '@acorex/components/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n computed,\n effect,\n ElementRef,\n forwardRef,\n HostBinding,\n inject,\n input,\n Renderer2,\n signal,\n viewChild,\n ViewEncapsulation,\n} from '@angular/core';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { getPointerPercentage } from './calculatePercentage';\n\n/**\n * @description\n * The `AXRatePickerComponent` provides a customizable rating picker.\n * The component allows users to select a rating between 0 and the defined maximum.\n * It supports transitions, dynamic value changes, and hover states.\n *\n * @example\n * <ax-rate-picker [max]=\"5\" [readonly]=\"false\" [disabled]=\"false\"></ax-rate-picker>\n */\n@Component({\n selector: 'ax-rate-picker',\n templateUrl: './rate-picker.component.html',\n styleUrls: ['./rate-picker.component.scss'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n inputs: ['readonly', 'disabled'],\n providers: [\n { provide: AXValuableComponent, useExisting: AXRatePickerComponent },\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => AXRatePickerComponent),\n multi: true,\n },\n ],\n standalone: false,\n})\nexport class AXRatePickerComponent extends MXValueComponent<number> {\n /**\n * @description\n * The icon to be used for each rating point.\n * @default 'fa-star'\n */\n iconName = input('fa-star');\n\n /**\n * @description\n * Maximum value for the rating.\n * Defines how many rating points are available.\n * @default 5\n */\n max = input(5);\n\n /**\n * @description\n * Defines the step increment between rating values.\n * The rating value will be rounded to the nearest multiple of this step.\n * @default 0.01\n */\n step = input(0.01);\n\n /**\n * @description\n * Whether the rating should have a transition effect when changing values.\n * @default true\n */\n hasTransition = input(true);\n\n /**\n * @description\n * The percentage of the current rating value relative to the maximum rating.\n */\n protected ratePercentage = computed(() => Math.round((this.currentValue() / this.max()) * 10000) / 100);\n\n /**\n * @description\n * The current rating value as a signal.\n */\n private currentValue = signal(this.max());\n\n /**\n * @description\n * State for tracking hover status and previous value.\n */\n private prevState: { ishover: boolean; previousValue?: number } = {\n ishover: false,\n previousValue: undefined,\n };\n\n /**\n * @description\n * Reference to the container element.\n */\n containerEl = viewChild.required<ElementRef>('c');\n\n /**\n * @description\n * Reference to the rating element.\n */\n ratingEl = viewChild.required<ElementRef>('r');\n\n /**\n * @description\n * Renderer for manipulating styles.\n */\n renderer = inject(Renderer2);\n\n /**\n * @description\n * Array of rating values from 1 to `max`.\n */\n protected rates = computed(() =>\n Array(this.max())\n .fill(0)\n .map((_, index) => index + 1),\n );\n\n /**\n * @description\n * Initializes the component and sets up value change subscription.\n */\n constructor() {\n super();\n effect(() => {\n if (!this.hasTransition()) {\n this.renderer.removeStyle(this.ratingEl().nativeElement, 'transition');\n }\n return this.hasTransition();\n });\n this.onValueChanged.subscribe((val: { value }) => {\n if (val.value < 0) {\n this.currentValue.set(0);\n console.warn('ax-rate-picker: value cant be negative!');\n } else if (val.value > this.max()) {\n this.currentValue.set(this.max());\n console.warn('ax-rate-picker: value cant be more than max!');\n } else {\n this.currentValue.set(val.value);\n }\n });\n }\n\n /**\n * @description\n * Calculates and updates the rating based on the mouse or touch event.\n *\n * @param event - The mouse or touch event triggering the rating calculation.\n */\n protected calculateRate(event: MouseEvent | TouchEvent): void {\n if (this.hasTransition()) {\n this.renderer.removeStyle(this.ratingEl().nativeElement, 'transition');\n }\n event.preventDefault();\n if (!this.readonly && !this.disabled) {\n const pointerPercentage = getPointerPercentage(event);\n if (pointerPercentage === -1) {\n return console.warn('Only support touch and click events.');\n }\n const value = this.roundToStep(pointerPercentage);\n const decimals = this.countDecimals(this.step());\n if (this.prevState.ishover === true) {\n this.currentValue.set(value);\n } else {\n this.commitValue(Number(value.toFixed(decimals)));\n this.mouseEnter();\n }\n }\n }\n\n /**\n * @description\n * Rounds the rating value to the nearest step.\n *\n * @param percentage - The calculated percentage from pointer event.\n * @returns The rounded rating value.\n */\n private roundToStep(percentage: number): number {\n const value = (percentage / 100) * this.max();\n const value2 = Math.round(value / (this.step() || 0.01)) * this.step();\n return value2;\n }\n\n /**\n * @description\n * Handles mouse enter events to start tracking mouse movements for rating.\n */\n protected mouseEnter() {\n this.prevState = {\n ishover: true,\n previousValue: this.value,\n };\n if (this.hasTransition()) {\n this.renderer.setStyle(this.ratingEl().nativeElement, 'opacity', '80%');\n }\n const moveListener = (moveEvent: MouseEvent | TouchEvent) => this.calculateRate(moveEvent);\n const endListener = () => this.onEnd(moveListener, endListener);\n const container = this.containerEl().nativeElement;\n container.addEventListener('mousemove', moveListener);\n container.addEventListener('mouseup', endListener);\n container.addEventListener('mouseleave', endListener);\n }\n\n /**\n * @description\n * Handles mouse leave events to reset styles.\n */\n mouseLeave() {\n if (this.hasTransition()) {\n this.renderer.removeStyle(this.ratingEl().nativeElement, 'opacity');\n }\n }\n\n /**\n * @description\n * Cleans up event listeners and restores the previous rating value.\n *\n * @param moveListener - The function to remove for mouse move events.\n * @param endListener - The function to remove for mouse end events.\n */\n private onEnd(moveListener: (event: MouseEvent | TouchEvent) => void, endListener: () => void): void {\n if (this.hasTransition()) {\n this.renderer.setStyle(\n this.ratingEl().nativeElement,\n 'transition',\n `width ${this.max() * 50 + 250}ms cubic-bezier(0.29, 0.72, 0.68, 0.85)`,\n );\n this.renderer.removeStyle(this.ratingEl().nativeElement, 'opacity');\n }\n this.currentValue.set(this.prevState.previousValue);\n this.prevState = {\n ishover: false,\n previousValue: undefined,\n };\n const container = this.containerEl().nativeElement;\n container.removeEventListener('mousemove', moveListener);\n container.removeEventListener('mouseup', endListener);\n container.removeEventListener('mouseleave', endListener);\n }\n\n private countDecimals(number: number): number {\n if (Math.floor(number) === number) return 0;\n return number.toString().split('.')[1].length || 0;\n }\n\n /**\n * @description\n * Determines if the component is active (i.e., not readonly or disabled).\n */\n @HostBinding('class.ax-active') get isActive() {\n return !this.readonly && !this.disabled;\n }\n\n /**\n * @description\n * Determines if the component is in readonly mode.\n */\n @HostBinding('class.ax-readonly') get isReadonly() {\n return this.readonly;\n }\n\n /**\n * @description\n * Determines if the component is disabled.\n */\n @HostBinding('class.ax-disable') get isDisabled() {\n return this.disabled;\n }\n}\n","<div\n #c\n class=\"ax-rate-picker-container\"\n (click)=\"calculateRate($event)\"\n (touchstart)=\"calculateRate($event)\"\n (mouseenter)=\"mouseEnter()\"\n (mouseleave)=\"mouseLeave()\"\n>\n <div #r class=\"ax-rate-picker-rating\" [style.width.%]=\"ratePercentage()\">\n <div class=\"ax-rate-picker-icons ax-rp-active\">\n @for (rate of rates(); track rate) {\n <i class=\"ax-rate-picker-icon fa-solid\" [class]=\"iconName()\" [class.pointer]=\"!this.readonly\"></i>\n }\n </div>\n </div>\n <div class=\"ax-rate-picker-icons ax-rp-inactive\">\n @for (rate of rates(); track rate) {\n <i class=\"ax-rate-picker-icon fa-solid\" [class]=\"iconName()\"></i>\n }\n </div>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXRatePickerComponent } from './rate-picker.component';\n\n@NgModule({\n declarations: [AXRatePickerComponent],\n imports: [CommonModule],\n exports: [AXRatePickerComponent],\n})\nexport class AXRatePickerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -22,11 +22,11 @@ class AXSkeletonComponent extends MXBaseComponent {
|
|
|
22
22
|
return `ax-skeleton ${this.animated ? 'ax-skeleton-animate' : ''}`;
|
|
23
23
|
}
|
|
24
24
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXSkeletonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
25
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: AXSkeletonComponent, isStandalone: false, selector: "ax-skeleton", inputs: { animated: "animated" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["ax-skeleton.ax-skeleton{position:relative;display:block;overflow:hidden;background-color:rgba(var(--ax-comp-skeleton-bg-color,
|
|
25
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: AXSkeletonComponent, isStandalone: false, selector: "ax-skeleton", inputs: { animated: "animated" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["ax-skeleton{--ax-comp-skeleton-bg-color: var(--ax-sys-color-dark);--ax-comp-skeleton-bg-opacity: .2}.ax-dark ax-skeleton{--ax-comp-skeleton-bg-color: var(--ax-sys-color-light)}ax-skeleton.ax-skeleton{position:relative;display:block;overflow:hidden;background-color:rgba(var(--ax-comp-skeleton-bg-color),var(--ax-comp-skeleton-bg-opacity))}ax-skeleton.ax-skeleton-animate:before{position:absolute;inset-inline-start:-13rem;top:0;display:block;height:100%;width:var(--ax-comp-skeleton-line-width, 14rem);content:\"\";background:linear-gradient(to right,transparent 0%,rgba(var(--ax-comp-skeleton-bg-color),var(--ax-comp-skeleton-bg-opacity)) 50%,transparent 100%);animation:load 1s cubic-bezier(.4,0,.2,1) infinite}@keyframes load{0%{inset-inline-start:-13rem}to{inset-inline-start:100%}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
26
26
|
}
|
|
27
27
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXSkeletonComponent, decorators: [{
|
|
28
28
|
type: Component,
|
|
29
|
-
args: [{ selector: 'ax-skeleton', template: '<ng-content></ng-content>', encapsulation: ViewEncapsulation.None, standalone: false, styles: ["ax-skeleton.ax-skeleton{position:relative;display:block;overflow:hidden;background-color:rgba(var(--ax-comp-skeleton-bg-color,
|
|
29
|
+
args: [{ selector: 'ax-skeleton', template: '<ng-content></ng-content>', encapsulation: ViewEncapsulation.None, standalone: false, styles: ["ax-skeleton{--ax-comp-skeleton-bg-color: var(--ax-sys-color-dark);--ax-comp-skeleton-bg-opacity: .2}.ax-dark ax-skeleton{--ax-comp-skeleton-bg-color: var(--ax-sys-color-light)}ax-skeleton.ax-skeleton{position:relative;display:block;overflow:hidden;background-color:rgba(var(--ax-comp-skeleton-bg-color),var(--ax-comp-skeleton-bg-opacity))}ax-skeleton.ax-skeleton-animate:before{position:absolute;inset-inline-start:-13rem;top:0;display:block;height:100%;width:var(--ax-comp-skeleton-line-width, 14rem);content:\"\";background:linear-gradient(to right,transparent 0%,rgba(var(--ax-comp-skeleton-bg-color),var(--ax-comp-skeleton-bg-opacity)) 50%,transparent 100%);animation:load 1s cubic-bezier(.4,0,.2,1) infinite}@keyframes load{0%{inset-inline-start:-13rem}to{inset-inline-start:100%}}\n"] }]
|
|
30
30
|
}], propDecorators: { animated: [{
|
|
31
31
|
type: Input
|
|
32
32
|
}], __hostClass: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"acorex-components-skeleton.mjs","sources":["../../../../libs/components/skeleton/src/lib/skeleton.component.ts","../../../../libs/components/skeleton/src/lib/skeleton.module.ts","../../../../libs/components/skeleton/src/acorex-components-skeleton.ts"],"sourcesContent":["import { MXBaseComponent } from '@acorex/components/common';\nimport { Component, HostBinding, Input, ViewEncapsulation } from '@angular/core';\n\n/**\n * @category\n * A skeleton component used for loading placeholders.\n */\n@Component({\n selector: 'ax-skeleton',\n template: '<ng-content></ng-content>',\n styleUrls: ['./skeleton.component.scss'],\n encapsulation: ViewEncapsulation.None,\n standalone: false\n})\nexport class AXSkeletonComponent extends MXBaseComponent {\n /**\n * Determines whether animations are enabled.\n *\n * @defaultValue true\n */\n @Input() animated = true;\n\n /** @ignore */\n @HostBinding('class')\n get __hostClass(): string {\n return `ax-skeleton ${this.animated ? 'ax-skeleton-animate' : ''}`;\n }\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXSkeletonComponent } from './skeleton.component';\n@NgModule({\n declarations: [AXSkeletonComponent],\n imports: [CommonModule],\n exports: [AXSkeletonComponent],\n})\nexport class AXSkeletonModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAGA;;;AAGG;AAQG,MAAO,mBAAoB,SAAQ,eAAe,CAAA;AAPxD,IAAA,WAAA,GAAA;;AAQE;;;;AAIG;QACM,IAAQ,CAAA,QAAA,GAAG,IAAI;AAOzB;;AAJC,IAAA,IACI,WAAW,GAAA;AACb,QAAA,OAAO,CAAe,YAAA,EAAA,IAAI,CAAC,QAAQ,GAAG,qBAAqB,GAAG,EAAE,EAAE;;8GAXzD,mBAAmB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAnB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,mBAAmB,wLALlB,2BAA2B,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"acorex-components-skeleton.mjs","sources":["../../../../libs/components/skeleton/src/lib/skeleton.component.ts","../../../../libs/components/skeleton/src/lib/skeleton.module.ts","../../../../libs/components/skeleton/src/acorex-components-skeleton.ts"],"sourcesContent":["import { MXBaseComponent } from '@acorex/components/common';\nimport { Component, HostBinding, Input, ViewEncapsulation } from '@angular/core';\n\n/**\n * @category\n * A skeleton component used for loading placeholders.\n */\n@Component({\n selector: 'ax-skeleton',\n template: '<ng-content></ng-content>',\n styleUrls: ['./skeleton.component.scss'],\n encapsulation: ViewEncapsulation.None,\n standalone: false\n})\nexport class AXSkeletonComponent extends MXBaseComponent {\n /**\n * Determines whether animations are enabled.\n *\n * @defaultValue true\n */\n @Input() animated = true;\n\n /** @ignore */\n @HostBinding('class')\n get __hostClass(): string {\n return `ax-skeleton ${this.animated ? 'ax-skeleton-animate' : ''}`;\n }\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXSkeletonComponent } from './skeleton.component';\n@NgModule({\n declarations: [AXSkeletonComponent],\n imports: [CommonModule],\n exports: [AXSkeletonComponent],\n})\nexport class AXSkeletonModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAGA;;;AAGG;AAQG,MAAO,mBAAoB,SAAQ,eAAe,CAAA;AAPxD,IAAA,WAAA,GAAA;;AAQE;;;;AAIG;QACM,IAAQ,CAAA,QAAA,GAAG,IAAI;AAOzB;;AAJC,IAAA,IACI,WAAW,GAAA;AACb,QAAA,OAAO,CAAe,YAAA,EAAA,IAAI,CAAC,QAAQ,GAAG,qBAAqB,GAAG,EAAE,EAAE;;8GAXzD,mBAAmB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAnB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,mBAAmB,wLALlB,2BAA2B,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,sxBAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAK5B,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAP/B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,YACb,2BAA2B,EAAA,aAAA,EAEtB,iBAAiB,CAAC,IAAI,cACzB,KAAK,EAAA,MAAA,EAAA,CAAA,sxBAAA,CAAA,EAAA;8BAQV,QAAQ,EAAA,CAAA;sBAAhB;gBAIG,WAAW,EAAA,CAAA;sBADd,WAAW;uBAAC,OAAO;;;MCfT,gBAAgB,CAAA;8GAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAhB,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,gBAAgB,EAJZ,YAAA,EAAA,CAAA,mBAAmB,CACxB,EAAA,OAAA,EAAA,CAAA,YAAY,aACZ,mBAAmB,CAAA,EAAA,CAAA,CAAA;AAElB,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,gBAAgB,YAHjB,YAAY,CAAA,EAAA,CAAA,CAAA;;2FAGX,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAL5B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,mBAAmB,CAAC;oBACnC,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,mBAAmB,CAAC;AAC/B,iBAAA;;;ACPD;;AAEG;;;;"}
|