@acorex/components 19.5.0-next.1 → 19.5.0
Sign up to get free protection for your applications and to get access to all the features.
- package/common/lib/classes/styles.class.d.ts +1 -1
- package/decorators/index.d.ts +1 -0
- package/decorators/lib/components/full-screen-button.component.d.ts +7 -0
- package/decorators/lib/decorators.module.d.ts +3 -2
- package/fesm2022/acorex-components-alert.mjs +3 -6
- package/fesm2022/acorex-components-alert.mjs.map +1 -1
- package/fesm2022/acorex-components-avatar.mjs +2 -2
- package/fesm2022/acorex-components-avatar.mjs.map +1 -1
- package/fesm2022/acorex-components-button-group.mjs +2 -2
- package/fesm2022/acorex-components-button-group.mjs.map +1 -1
- package/fesm2022/acorex-components-check-box.mjs +2 -2
- package/fesm2022/acorex-components-check-box.mjs.map +1 -1
- package/fesm2022/acorex-components-circular-progress.mjs +2 -2
- package/fesm2022/acorex-components-circular-progress.mjs.map +1 -1
- package/fesm2022/acorex-components-common.mjs +1 -1
- package/fesm2022/acorex-components-common.mjs.map +1 -1
- package/fesm2022/acorex-components-conversation.mjs +2 -2
- package/fesm2022/acorex-components-conversation.mjs.map +1 -1
- package/fesm2022/acorex-components-decorators.mjs +41 -4
- package/fesm2022/acorex-components-decorators.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-image-editor.mjs +2 -0
- package/fesm2022/acorex-components-image-editor.mjs.map +1 -1
- package/fesm2022/acorex-components-loading.mjs +2 -2
- package/fesm2022/acorex-components-loading.mjs.map +1 -1
- package/fesm2022/acorex-components-media-viewer.mjs +64 -66
- package/fesm2022/acorex-components-media-viewer.mjs.map +1 -1
- package/fesm2022/acorex-components-notification.mjs +3 -6
- package/fesm2022/acorex-components-notification.mjs.map +1 -1
- package/fesm2022/acorex-components-paint.mjs +8 -25
- package/fesm2022/acorex-components-paint.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-rail-navigation.mjs +2 -2
- package/fesm2022/acorex-components-rail-navigation.mjs.map +1 -1
- package/fesm2022/acorex-components-range-slider.mjs +2 -2
- package/fesm2022/acorex-components-range-slider.mjs.map +1 -1
- package/fesm2022/acorex-components-side-menu.mjs +15 -3
- package/fesm2022/acorex-components-side-menu.mjs.map +1 -1
- package/fesm2022/acorex-components-slider.mjs +2 -2
- package/fesm2022/acorex-components-slider.mjs.map +1 -1
- package/fesm2022/acorex-components-step-wizard.mjs +11 -8
- 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-toast.mjs +5 -8
- package/fesm2022/acorex-components-toast.mjs.map +1 -1
- package/fesm2022/acorex-components-toolbar.mjs +79 -0
- package/fesm2022/acorex-components-toolbar.mjs.map +1 -0
- package/fesm2022/acorex-components-wysiwyg.mjs +15 -37
- package/fesm2022/acorex-components-wysiwyg.mjs.map +1 -1
- package/media-viewer/index.d.ts +0 -1
- package/media-viewer/lib/media-viewer-container/media-viewer-container.component.d.ts +4 -2
- package/media-viewer/lib/media-viewer-slider/media-viewer-slider.component.d.ts +1 -2
- package/media-viewer/lib/media-viewer.module.d.ts +11 -12
- package/media-viewer/lib/media-viewer.service.d.ts +0 -1
- package/package.json +5 -1
- package/paint/index.d.ts +0 -1
- package/paint/lib/paint.module.d.ts +12 -13
- package/range-slider/lib/range-slider.component.d.ts +1 -1
- package/side-menu/lib/side-menu.component.d.ts +7 -1
- package/step-wizard/lib/step-wizard-item/step-wizard-item.component.d.ts +4 -3
- package/step-wizard/lib/step-wizard.class.d.ts +1 -0
- package/step-wizard/lib/step-wizard.module.d.ts +2 -1
- package/toast/lib/toast.service.d.ts +1 -1
- package/toolbar/README.md +3 -0
- package/toolbar/index.d.ts +2 -0
- package/toolbar/lib/toolbar.component.d.ts +13 -0
- package/toolbar/lib/toolbar.module.d.ts +8 -0
- package/wysiwyg/index.d.ts +0 -1
- package/wysiwyg/lib/wysiwyg.module.d.ts +14 -15
- package/media-viewer/lib/media-viewer-tools/full-screen/full-screen.component.d.ts +0 -8
- package/paint/lib/paint/paint-toolbar/paint-toolbar.component.d.ts +0 -9
- package/wysiwyg/lib/wysiwyg/wysiwyg-toolbar/wysiwyg-toolbar.component.d.ts +0 -10
|
@@ -2,7 +2,7 @@ export declare const AX_STYLE_COLOR_TYPES: string[];
|
|
|
2
2
|
/**
|
|
3
3
|
* A token that specifies the color style of component.
|
|
4
4
|
*/
|
|
5
|
-
export type AXStyleColorType = 'primary' | '
|
|
5
|
+
export type AXStyleColorType = 'primary' | 'success' | 'warning' | 'danger' | 'neutral' | 'ghost';
|
|
6
6
|
export type AXStyleLookType = 'solid' | 'blank' | 'outline' | 'twotone' | 'flat' | 'fill' | 'link' | 'none';
|
|
7
7
|
export declare const AX_STYLE_LOOK_TYPES: string[];
|
|
8
8
|
export declare const AX_LOCATIONS: string[];
|
package/decorators/index.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export * from './lib/components/clear-button.component';
|
|
2
2
|
export * from './lib/components/close-button.component';
|
|
3
|
+
export * from './lib/components/full-screen-button.component';
|
|
3
4
|
export * from './lib/components/generic-content.component';
|
|
4
5
|
export * from './lib/components/icon.component';
|
|
5
6
|
export * from './lib/decorators.module';
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { MXBaseComponent } from '@acorex/components/common';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export declare class AXDecoratorFullScreenButtonComponent extends MXBaseComponent {
|
|
4
|
+
isActive: import("@angular/core").WritableSignal<boolean>;
|
|
5
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<AXDecoratorFullScreenButtonComponent, never>;
|
|
6
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<AXDecoratorFullScreenButtonComponent, "ax-fullscreen-button", never, {}, {}, never, never, false, never>;
|
|
7
|
+
}
|
|
@@ -3,9 +3,10 @@ import * as i1 from "./components/icon.component";
|
|
|
3
3
|
import * as i2 from "./components/clear-button.component";
|
|
4
4
|
import * as i3 from "./components/close-button.component";
|
|
5
5
|
import * as i4 from "./components/generic-content.component";
|
|
6
|
-
import * as i5 from "
|
|
6
|
+
import * as i5 from "./components/full-screen-button.component";
|
|
7
|
+
import * as i6 from "@angular/common";
|
|
7
8
|
export declare class AXDecoratorModule {
|
|
8
9
|
static ɵfac: i0.ɵɵFactoryDeclaration<AXDecoratorModule, never>;
|
|
9
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<AXDecoratorModule, [typeof i1.AXDecoratorIconComponent, typeof i2.AXDecoratorClearButtonComponent, typeof i3.AXDecoratorCloseButtonComponent, typeof i4.AXDecoratorGenericComponent], [typeof
|
|
10
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<AXDecoratorModule, [typeof i1.AXDecoratorIconComponent, typeof i2.AXDecoratorClearButtonComponent, typeof i3.AXDecoratorCloseButtonComponent, typeof i4.AXDecoratorGenericComponent, typeof i5.AXDecoratorFullScreenButtonComponent], [typeof i6.CommonModule], [typeof i1.AXDecoratorIconComponent, typeof i2.AXDecoratorClearButtonComponent, typeof i3.AXDecoratorCloseButtonComponent, typeof i4.AXDecoratorGenericComponent, typeof i5.AXDecoratorFullScreenButtonComponent]>;
|
|
10
11
|
static ɵinj: i0.ɵɵInjectorDeclaration<AXDecoratorModule>;
|
|
11
12
|
}
|
|
@@ -104,11 +104,8 @@ class AXAlertComponent extends MXColorComponent {
|
|
|
104
104
|
case 'warning':
|
|
105
105
|
this.axIcon().icon = 'ax-icon ax-icon-warning';
|
|
106
106
|
break;
|
|
107
|
-
case 'info':
|
|
108
|
-
this.axIcon().icon = 'ax-icon ax-icon-info';
|
|
109
|
-
break;
|
|
110
107
|
default:
|
|
111
|
-
this.axIcon().icon = this.customIcon() || 'ax-icon ax-icon-
|
|
108
|
+
this.axIcon().icon = this.customIcon() || 'ax-icon ax-icon-info';
|
|
112
109
|
break;
|
|
113
110
|
}
|
|
114
111
|
}
|
|
@@ -133,11 +130,11 @@ class AXAlertComponent extends MXColorComponent {
|
|
|
133
130
|
return `ax-alert ax-none ax-${this.color}-solid`;
|
|
134
131
|
}
|
|
135
132
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
136
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXAlertComponent, isStandalone: false, selector: "ax-alert", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, timeOut: { classPropertyName: "timeOut", publicName: "timeOut", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { colorChange: "colorChange", onClosed: "onClosed", timeOut: "timeOutChange" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }], queries: [{ propertyName: "axIcon", first: true, predicate: ["ax-icon"], descendants: true, isSignal: true }, { propertyName: "axTitle", first: true, predicate: ["ax-title"], descendants: true, isSignal: true }, { propertyName: "axContent", first: true, predicate: ["ax-content"], descendants: true, isSignal: true }, { propertyName: "axFooter", first: true, predicate: ["ax-footer"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (showInline()) {\n <div class=\"ax-alert-inline\">\n <div class=\"ax-alert-icon ax-icon-solid\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <div class=\"ax-alert-buttons\">\n <ng-container [ngTemplateOutlet]=\"buttons\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container>\n </div>\n} @else {\n <div class=\"ax-alert-block\">\n <div class=\"ax-alert-icon ax-icon-solid\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-content\">\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n <ng-container [ngTemplateOutlet]=\"footer\"></ng-container>\n </div>\n <div><ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container></div>\n </div>\n}\n\n@if (timeOut()) {\n <div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut()\"></div>\n}\n\n<ng-template #buttons>\n <ng-content select=\"ax-button\"> </ng-content>\n</ng-template>\n<ng-template #closeButton>\n <ng-content select=\"ax-close-button\"> </ng-content>\n</ng-template>\n<ng-template #title>\n <ng-content select=\"ax-title\"> </ng-content>\n</ng-template>\n<ng-template #icon>\n <ng-content select=\"ax-icon\"> </ng-content>\n</ng-template>\n<ng-template #content>\n <ng-content select=\"ax-content\"> </ng-content>\n</ng-template>\n<ng-template #footer>\n <ng-content select=\"ax-footer\"> </ng-content>\n</ng-template>\n", styles: [".ax-dark ax-alert.ax-primary-solid{background-color:rgba(var(--ax-color-primary-900),.25);border-color:rgba(var(--ax-color-primary-400))}.ax-dark ax-alert.ax-primary-solid .ax-alert-icon{color:rgba(var(--ax-color-primary-400))}.ax-dark ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-
|
|
133
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXAlertComponent, isStandalone: false, selector: "ax-alert", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, timeOut: { classPropertyName: "timeOut", publicName: "timeOut", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { colorChange: "colorChange", onClosed: "onClosed", timeOut: "timeOutChange" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }], queries: [{ propertyName: "axIcon", first: true, predicate: ["ax-icon"], descendants: true, isSignal: true }, { propertyName: "axTitle", first: true, predicate: ["ax-title"], descendants: true, isSignal: true }, { propertyName: "axContent", first: true, predicate: ["ax-content"], descendants: true, isSignal: true }, { propertyName: "axFooter", first: true, predicate: ["ax-footer"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (showInline()) {\n <div class=\"ax-alert-inline\">\n <div class=\"ax-alert-icon ax-icon-solid\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <div class=\"ax-alert-buttons\">\n <ng-container [ngTemplateOutlet]=\"buttons\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container>\n </div>\n} @else {\n <div class=\"ax-alert-block\">\n <div class=\"ax-alert-icon ax-icon-solid\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-content\">\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n <ng-container [ngTemplateOutlet]=\"footer\"></ng-container>\n </div>\n <div><ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container></div>\n </div>\n}\n\n@if (timeOut()) {\n <div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut()\"></div>\n}\n\n<ng-template #buttons>\n <ng-content select=\"ax-button\"> </ng-content>\n</ng-template>\n<ng-template #closeButton>\n <ng-content select=\"ax-close-button\"> </ng-content>\n</ng-template>\n<ng-template #title>\n <ng-content select=\"ax-title\"> </ng-content>\n</ng-template>\n<ng-template #icon>\n <ng-content select=\"ax-icon\"> </ng-content>\n</ng-template>\n<ng-template #content>\n <ng-content select=\"ax-content\"> </ng-content>\n</ng-template>\n<ng-template #footer>\n <ng-content select=\"ax-footer\"> </ng-content>\n</ng-template>\n", styles: [".ax-dark ax-alert.ax-primary-solid{background-color:rgba(var(--ax-color-primary-900),.25);border-color:rgba(var(--ax-color-primary-400))}.ax-dark ax-alert.ax-primary-solid .ax-alert-icon{color:rgba(var(--ax-color-primary-400))}.ax-dark ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-success-solid{background-color:rgba(var(--ax-color-success-900),.25);border-color:rgba(var(--ax-color-success-400))}.ax-dark ax-alert.ax-success-solid .ax-alert-icon{color:rgba(var(--ax-color-success-400))}.ax-dark ax-alert.ax-success-solid .ax-alert-progress{background-color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-warning-solid{background-color:rgba(var(--ax-color-warning-900),.25);border-color:rgba(var(--ax-color-warning-400))}.ax-dark ax-alert.ax-warning-solid .ax-alert-icon{color:rgba(var(--ax-color-warning-400))}.ax-dark ax-alert.ax-warning-solid .ax-alert-progress{background-color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-danger-solid{background-color:rgba(var(--ax-color-danger-900),.25);border-color:rgba(var(--ax-color-danger-400))}.ax-dark ax-alert.ax-danger-solid .ax-alert-icon{color:rgba(var(--ax-color-danger-400))}.ax-dark ax-alert.ax-danger-solid .ax-alert-progress{background-color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-neutral-solid{background-color:rgba(var(--ax-color-neutral-900),.25);border-color:rgba(var(--ax-color-neutral-400))}.ax-dark ax-alert.ax-neutral-solid .ax-alert-icon{color:rgba(var(--ax-color-neutral-400))}.ax-dark ax-alert.ax-neutral-solid .ax-alert-progress{background-color:rgba(var(--ax-color-neutral-fore))}ax-alert{position:relative;display:flex;gap:1rem;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));padding:1rem;font-size:.875rem;line-height:1.25rem}ax-alert .ax-alert-inline{display:flex;flex:1 1 0%;align-items:center;justify-content:center}ax-alert .ax-alert-block{display:flex}ax-alert .ax-alert-block .ax-alert-content{display:flex;flex-direction:column;line-height:1.5}ax-alert .ax-alert-block .ax-alert-content .ax-alert-title:empty{display:none}ax-alert .ax-alert-block .ax-alert-content .ax-alert-title:not(:empty)+ax-content:not(:empty){margin-top:.5rem}ax-alert .ax-alert-block .ax-alert-content ax-footer{margin-top:1rem}ax-alert .ax-alert-icon{display:grid;border-radius:9999px;padding-inline-end:.5rem;font-size:1.125rem;line-height:1.75rem}ax-alert .ax-alert-buttons{padding-inline-start:1rem}ax-alert .ax-alert-title{display:flex;flex:1 1 0%;flex-direction:column}ax-alert .ax-alert-title ax-title{font-size:.875rem;line-height:1.25rem;font-weight:500}ax-alert .ax-alert-progress{position:absolute;bottom:0;inset-inline-start:0px;height:.25rem}@keyframes progressBar{0%{width:100%}to{width:0%}}ax-alert.ax-primary-solid{background-color:rgba(var(--ax-color-primary-100));border-color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-solid ax-button[class$=blank]{color:rgb(var(--ax-color-text-default))}ax-alert.ax-primary-solid ax-title,ax-alert.ax-primary-solid ax-content{color:rgb(var(--ax-color-text-default))}ax-alert.ax-primary-solid .ax-alert-icon{color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-500))}ax-alert.ax-success-solid{background-color:rgba(var(--ax-color-success-100));border-color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-solid ax-button[class$=blank]{color:rgb(var(--ax-color-text-default))}ax-alert.ax-success-solid ax-title,ax-alert.ax-success-solid ax-content{color:rgb(var(--ax-color-text-default))}ax-alert.ax-success-solid .ax-alert-icon{color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-solid .ax-alert-progress{background-color:rgba(var(--ax-color-success-500))}ax-alert.ax-warning-solid{background-color:rgba(var(--ax-color-warning-100));border-color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-solid ax-button[class$=blank]{color:rgb(var(--ax-color-text-default))}ax-alert.ax-warning-solid ax-title,ax-alert.ax-warning-solid ax-content{color:rgb(var(--ax-color-text-default))}ax-alert.ax-warning-solid .ax-alert-icon{color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-solid .ax-alert-progress{background-color:rgba(var(--ax-color-warning-500))}ax-alert.ax-danger-solid{background-color:rgba(var(--ax-color-danger-100));border-color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-solid ax-button[class$=blank]{color:rgb(var(--ax-color-text-default))}ax-alert.ax-danger-solid ax-title,ax-alert.ax-danger-solid ax-content{color:rgb(var(--ax-color-text-default))}ax-alert.ax-danger-solid .ax-alert-icon{color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-solid .ax-alert-progress{background-color:rgba(var(--ax-color-danger-500))}ax-alert.ax-neutral-solid{background-color:rgba(var(--ax-color-neutral-100));border-color:rgba(var(--ax-color-neutral-500))}ax-alert.ax-neutral-solid ax-button[class$=blank]{color:rgb(var(--ax-color-text-default))}ax-alert.ax-neutral-solid ax-title,ax-alert.ax-neutral-solid ax-content{color:rgb(var(--ax-color-text-default))}ax-alert.ax-neutral-solid .ax-alert-icon{color:rgba(var(--ax-color-neutral-500))}ax-alert.ax-neutral-solid .ax-alert-progress{background-color:rgba(var(--ax-color-neutral-500))}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
137
134
|
}
|
|
138
135
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXAlertComponent, decorators: [{
|
|
139
136
|
type: Component,
|
|
140
|
-
args: [{ selector: 'ax-alert', inputs: ['color'], outputs: ['colorChange'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }], standalone: false, template: "@if (showInline()) {\n <div class=\"ax-alert-inline\">\n <div class=\"ax-alert-icon ax-icon-solid\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <div class=\"ax-alert-buttons\">\n <ng-container [ngTemplateOutlet]=\"buttons\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container>\n </div>\n} @else {\n <div class=\"ax-alert-block\">\n <div class=\"ax-alert-icon ax-icon-solid\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-content\">\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n <ng-container [ngTemplateOutlet]=\"footer\"></ng-container>\n </div>\n <div><ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container></div>\n </div>\n}\n\n@if (timeOut()) {\n <div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut()\"></div>\n}\n\n<ng-template #buttons>\n <ng-content select=\"ax-button\"> </ng-content>\n</ng-template>\n<ng-template #closeButton>\n <ng-content select=\"ax-close-button\"> </ng-content>\n</ng-template>\n<ng-template #title>\n <ng-content select=\"ax-title\"> </ng-content>\n</ng-template>\n<ng-template #icon>\n <ng-content select=\"ax-icon\"> </ng-content>\n</ng-template>\n<ng-template #content>\n <ng-content select=\"ax-content\"> </ng-content>\n</ng-template>\n<ng-template #footer>\n <ng-content select=\"ax-footer\"> </ng-content>\n</ng-template>\n", styles: [".ax-dark ax-alert.ax-primary-solid{background-color:rgba(var(--ax-color-primary-900),.25);border-color:rgba(var(--ax-color-primary-400))}.ax-dark ax-alert.ax-primary-solid .ax-alert-icon{color:rgba(var(--ax-color-primary-400))}.ax-dark ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-
|
|
137
|
+
args: [{ selector: 'ax-alert', inputs: ['color'], outputs: ['colorChange'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }], standalone: false, template: "@if (showInline()) {\n <div class=\"ax-alert-inline\">\n <div class=\"ax-alert-icon ax-icon-solid\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <div class=\"ax-alert-buttons\">\n <ng-container [ngTemplateOutlet]=\"buttons\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container>\n </div>\n} @else {\n <div class=\"ax-alert-block\">\n <div class=\"ax-alert-icon ax-icon-solid\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-content\">\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n <ng-container [ngTemplateOutlet]=\"footer\"></ng-container>\n </div>\n <div><ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container></div>\n </div>\n}\n\n@if (timeOut()) {\n <div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut()\"></div>\n}\n\n<ng-template #buttons>\n <ng-content select=\"ax-button\"> </ng-content>\n</ng-template>\n<ng-template #closeButton>\n <ng-content select=\"ax-close-button\"> </ng-content>\n</ng-template>\n<ng-template #title>\n <ng-content select=\"ax-title\"> </ng-content>\n</ng-template>\n<ng-template #icon>\n <ng-content select=\"ax-icon\"> </ng-content>\n</ng-template>\n<ng-template #content>\n <ng-content select=\"ax-content\"> </ng-content>\n</ng-template>\n<ng-template #footer>\n <ng-content select=\"ax-footer\"> </ng-content>\n</ng-template>\n", styles: [".ax-dark ax-alert.ax-primary-solid{background-color:rgba(var(--ax-color-primary-900),.25);border-color:rgba(var(--ax-color-primary-400))}.ax-dark ax-alert.ax-primary-solid .ax-alert-icon{color:rgba(var(--ax-color-primary-400))}.ax-dark ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-fore))}.ax-dark ax-alert.ax-success-solid{background-color:rgba(var(--ax-color-success-900),.25);border-color:rgba(var(--ax-color-success-400))}.ax-dark ax-alert.ax-success-solid .ax-alert-icon{color:rgba(var(--ax-color-success-400))}.ax-dark ax-alert.ax-success-solid .ax-alert-progress{background-color:rgba(var(--ax-color-success-fore))}.ax-dark ax-alert.ax-warning-solid{background-color:rgba(var(--ax-color-warning-900),.25);border-color:rgba(var(--ax-color-warning-400))}.ax-dark ax-alert.ax-warning-solid .ax-alert-icon{color:rgba(var(--ax-color-warning-400))}.ax-dark ax-alert.ax-warning-solid .ax-alert-progress{background-color:rgba(var(--ax-color-warning-fore))}.ax-dark ax-alert.ax-danger-solid{background-color:rgba(var(--ax-color-danger-900),.25);border-color:rgba(var(--ax-color-danger-400))}.ax-dark ax-alert.ax-danger-solid .ax-alert-icon{color:rgba(var(--ax-color-danger-400))}.ax-dark ax-alert.ax-danger-solid .ax-alert-progress{background-color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-alert.ax-neutral-solid{background-color:rgba(var(--ax-color-neutral-900),.25);border-color:rgba(var(--ax-color-neutral-400))}.ax-dark ax-alert.ax-neutral-solid .ax-alert-icon{color:rgba(var(--ax-color-neutral-400))}.ax-dark ax-alert.ax-neutral-solid .ax-alert-progress{background-color:rgba(var(--ax-color-neutral-fore))}ax-alert{position:relative;display:flex;gap:1rem;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;border-color:rgba(var(--ax-color-border-default));padding:1rem;font-size:.875rem;line-height:1.25rem}ax-alert .ax-alert-inline{display:flex;flex:1 1 0%;align-items:center;justify-content:center}ax-alert .ax-alert-block{display:flex}ax-alert .ax-alert-block .ax-alert-content{display:flex;flex-direction:column;line-height:1.5}ax-alert .ax-alert-block .ax-alert-content .ax-alert-title:empty{display:none}ax-alert .ax-alert-block .ax-alert-content .ax-alert-title:not(:empty)+ax-content:not(:empty){margin-top:.5rem}ax-alert .ax-alert-block .ax-alert-content ax-footer{margin-top:1rem}ax-alert .ax-alert-icon{display:grid;border-radius:9999px;padding-inline-end:.5rem;font-size:1.125rem;line-height:1.75rem}ax-alert .ax-alert-buttons{padding-inline-start:1rem}ax-alert .ax-alert-title{display:flex;flex:1 1 0%;flex-direction:column}ax-alert .ax-alert-title ax-title{font-size:.875rem;line-height:1.25rem;font-weight:500}ax-alert .ax-alert-progress{position:absolute;bottom:0;inset-inline-start:0px;height:.25rem}@keyframes progressBar{0%{width:100%}to{width:0%}}ax-alert.ax-primary-solid{background-color:rgba(var(--ax-color-primary-100));border-color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-solid ax-button[class$=blank]{color:rgb(var(--ax-color-text-default))}ax-alert.ax-primary-solid ax-title,ax-alert.ax-primary-solid ax-content{color:rgb(var(--ax-color-text-default))}ax-alert.ax-primary-solid .ax-alert-icon{color:rgba(var(--ax-color-primary-500))}ax-alert.ax-primary-solid .ax-alert-progress{background-color:rgba(var(--ax-color-primary-500))}ax-alert.ax-success-solid{background-color:rgba(var(--ax-color-success-100));border-color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-solid ax-button[class$=blank]{color:rgb(var(--ax-color-text-default))}ax-alert.ax-success-solid ax-title,ax-alert.ax-success-solid ax-content{color:rgb(var(--ax-color-text-default))}ax-alert.ax-success-solid .ax-alert-icon{color:rgba(var(--ax-color-success-500))}ax-alert.ax-success-solid .ax-alert-progress{background-color:rgba(var(--ax-color-success-500))}ax-alert.ax-warning-solid{background-color:rgba(var(--ax-color-warning-100));border-color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-solid ax-button[class$=blank]{color:rgb(var(--ax-color-text-default))}ax-alert.ax-warning-solid ax-title,ax-alert.ax-warning-solid ax-content{color:rgb(var(--ax-color-text-default))}ax-alert.ax-warning-solid .ax-alert-icon{color:rgba(var(--ax-color-warning-500))}ax-alert.ax-warning-solid .ax-alert-progress{background-color:rgba(var(--ax-color-warning-500))}ax-alert.ax-danger-solid{background-color:rgba(var(--ax-color-danger-100));border-color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-solid ax-button[class$=blank]{color:rgb(var(--ax-color-text-default))}ax-alert.ax-danger-solid ax-title,ax-alert.ax-danger-solid ax-content{color:rgb(var(--ax-color-text-default))}ax-alert.ax-danger-solid .ax-alert-icon{color:rgba(var(--ax-color-danger-500))}ax-alert.ax-danger-solid .ax-alert-progress{background-color:rgba(var(--ax-color-danger-500))}ax-alert.ax-neutral-solid{background-color:rgba(var(--ax-color-neutral-100));border-color:rgba(var(--ax-color-neutral-500))}ax-alert.ax-neutral-solid ax-button[class$=blank]{color:rgb(var(--ax-color-text-default))}ax-alert.ax-neutral-solid ax-title,ax-alert.ax-neutral-solid ax-content{color:rgb(var(--ax-color-text-default))}ax-alert.ax-neutral-solid .ax-alert-icon{color:rgba(var(--ax-color-neutral-500))}ax-alert.ax-neutral-solid .ax-alert-progress{background-color:rgba(var(--ax-color-neutral-500))}\n"] }]
|
|
141
138
|
}], ctorParameters: () => [], propDecorators: { __hostClass: [{
|
|
142
139
|
type: HostBinding,
|
|
143
140
|
args: ['class']
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"acorex-components-alert.mjs","sources":["../../../../libs/components/alert/src/lib/alert.component.ts","../../../../libs/components/alert/src/lib/alert.component.html","../../../../libs/components/alert/src/lib/alert.module.ts","../../../../libs/components/alert/src/acorex-components-alert.ts"],"sourcesContent":["import { AXClosbaleComponent, AXEvent, MXColorComponent } from '@acorex/components/common';\nimport { AXDecoratorGenericComponent, AXDecoratorIconComponent } from '@acorex/components/decorators';\nimport { isBrowser } from '@acorex/core/platform';\n\nimport {\n afterNextRender,\n ChangeDetectionStrategy,\n Component,\n contentChild,\n effect,\n HostBinding,\n model,\n output,\n signal,\n ViewEncapsulation,\n} from '@angular/core';\n\n/**\n * The Alert component is used to display notifications or alerts to users.\n *\n * @category Components\n */\n@Component({\n selector: 'ax-alert',\n templateUrl: './alert.component.html',\n styleUrls: ['./alert.component.scss'],\n inputs: ['color'],\n outputs: ['colorChange'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }],\n standalone: false\n})\nexport class AXAlertComponent extends MXColorComponent {\n /**\n * @ignore\n */\n axIcon = contentChild<AXDecoratorIconComponent>('ax-icon');\n /**\n * @ignore\n */\n axTitle = contentChild<AXDecoratorGenericComponent>('ax-title');\n /**\n * @ignore\n */\n axContent = contentChild<AXDecoratorGenericComponent>('ax-content');\n /**\n * @ignore\n */\n axFooter = contentChild<AXDecoratorGenericComponent>('ax-footer');\n\n /**\n * @ignore\n */\n protected showInline = signal(false);\n\n /**\n * Emits an event when the alert component is closed.\n *\n * @event\n */\n onClosed = output<AXEvent>();\n\n /**\n * @ignore\n */\n private customIcon = signal('');\n\n /**\n * @ignore\n */\n private _timeOutRef: number;\n\n /**\n * Sets the duration (in milliseconds) after which the alert will automatically close.\n *\n * @defaultValue 0\n */\n timeOut = model<number>(0);\n\n /**\n * @ignore\n */\n //TODO: Check Console for effect() can only be used within an injection context such as a constructor, a factory function, a field initializer, or a function used with `runInInjectionContext`\n timeOutEffect = () => {\n effect(() => {\n if (this.timeOut()) {\n clearTimeout(this._timeOutRef);\n this._timeOutRef = window.setTimeout(() => {\n this.close();\n }, this.timeOut());\n }\n });\n };\n\n /**\n * @ignore\n */\n constructor() {\n super();\n afterNextRender(() => {\n this.onOptionChanged.subscribe(this._handleOnOptionChanged.bind(this));\n this._setLayout();\n this.customIcon.set(this.axIcon()?.icon);\n });\n this.timeOutEffect();\n }\n\n /**\n * @ignore\n */\n private _setLayout() {\n this._setIcon();\n this.showInline.set(this.axContent() == null && this.axFooter() == null);\n this.cdr.markForCheck();\n }\n\n /**\n * @ignore\n */\n protected _handleOnOptionChanged() {\n this._setIcon();\n }\n\n /**\n * @ignore\n */\n private _setIcon() {\n if (!this.axIcon() || this.axIcon().getHostElement().firstElementChild) return;\n\n switch (this.color) {\n case 'success':\n this.axIcon().icon = 'ax-icon ax-icon-check-circle';\n break;\n case 'danger':\n this.axIcon().icon = 'ax-icon ax-icon-error';\n break;\n case 'warning':\n this.axIcon().icon = 'ax-icon ax-icon-warning';\n break;\n case 'info':\n this.axIcon().icon = 'ax-icon ax-icon-info';\n break;\n default:\n this.axIcon().icon = this.customIcon() || 'ax-icon ax-icon-check-circle';\n break;\n }\n }\n\n /**\n * Removes the alert from the container after a transition effect.\n *\n * @ignore\n */\n close(): void {\n if (isBrowser()) {\n const host = this.getHostElement();\n host.parentElement?.removeChild(host);\n this.onClosed.emit({\n component: this,\n });\n }\n }\n\n /**\n * @ignore\n */\n @HostBinding('class')\n get __hostClass(): string {\n return `ax-alert ax-none ax-${this.color}-solid`;\n }\n}\n","@if (showInline()) {\n <div class=\"ax-alert-inline\">\n <div class=\"ax-alert-icon ax-icon-solid\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <div class=\"ax-alert-buttons\">\n <ng-container [ngTemplateOutlet]=\"buttons\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container>\n </div>\n} @else {\n <div class=\"ax-alert-block\">\n <div class=\"ax-alert-icon ax-icon-solid\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-content\">\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n <ng-container [ngTemplateOutlet]=\"footer\"></ng-container>\n </div>\n <div><ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container></div>\n </div>\n}\n\n@if (timeOut()) {\n <div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut()\"></div>\n}\n\n<ng-template #buttons>\n <ng-content select=\"ax-button\"> </ng-content>\n</ng-template>\n<ng-template #closeButton>\n <ng-content select=\"ax-close-button\"> </ng-content>\n</ng-template>\n<ng-template #title>\n <ng-content select=\"ax-title\"> </ng-content>\n</ng-template>\n<ng-template #icon>\n <ng-content select=\"ax-icon\"> </ng-content>\n</ng-template>\n<ng-template #content>\n <ng-content select=\"ax-content\"> </ng-content>\n</ng-template>\n<ng-template #footer>\n <ng-content select=\"ax-footer\"> </ng-content>\n</ng-template>\n","import { AXDecoratorModule } from '@acorex/components/decorators';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXAlertComponent } from './alert.component';\n\nconst COMPONENT = [AXAlertComponent];\nconst MODULES = [CommonModule, AXDecoratorModule];\n\n@NgModule({\n declarations: [...COMPONENT],\n imports: [...MODULES],\n exports: [...COMPONENT],\n providers: [],\n})\nexport class AXAlertModule {}\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-alert.mjs","sources":["../../../../libs/components/alert/src/lib/alert.component.ts","../../../../libs/components/alert/src/lib/alert.component.html","../../../../libs/components/alert/src/lib/alert.module.ts","../../../../libs/components/alert/src/acorex-components-alert.ts"],"sourcesContent":["import { AXClosbaleComponent, AXEvent, MXColorComponent } from '@acorex/components/common';\nimport { AXDecoratorGenericComponent, AXDecoratorIconComponent } from '@acorex/components/decorators';\nimport { isBrowser } from '@acorex/core/platform';\n\nimport {\n afterNextRender,\n ChangeDetectionStrategy,\n Component,\n contentChild,\n effect,\n HostBinding,\n model,\n output,\n signal,\n ViewEncapsulation,\n} from '@angular/core';\n\n/**\n * The Alert component is used to display notifications or alerts to users.\n *\n * @category Components\n */\n@Component({\n selector: 'ax-alert',\n templateUrl: './alert.component.html',\n styleUrls: ['./alert.component.scss'],\n inputs: ['color'],\n outputs: ['colorChange'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [{ provide: AXClosbaleComponent, useExisting: AXAlertComponent }],\n standalone: false,\n})\nexport class AXAlertComponent extends MXColorComponent {\n /**\n * @ignore\n */\n axIcon = contentChild<AXDecoratorIconComponent>('ax-icon');\n /**\n * @ignore\n */\n axTitle = contentChild<AXDecoratorGenericComponent>('ax-title');\n /**\n * @ignore\n */\n axContent = contentChild<AXDecoratorGenericComponent>('ax-content');\n /**\n * @ignore\n */\n axFooter = contentChild<AXDecoratorGenericComponent>('ax-footer');\n\n /**\n * @ignore\n */\n protected showInline = signal(false);\n\n /**\n * Emits an event when the alert component is closed.\n *\n * @event\n */\n onClosed = output<AXEvent>();\n\n /**\n * @ignore\n */\n private customIcon = signal('');\n\n /**\n * @ignore\n */\n private _timeOutRef: number;\n\n /**\n * Sets the duration (in milliseconds) after which the alert will automatically close.\n *\n * @defaultValue 0\n */\n timeOut = model<number>(0);\n\n /**\n * @ignore\n */\n //TODO: Check Console for effect() can only be used within an injection context such as a constructor, a factory function, a field initializer, or a function used with `runInInjectionContext`\n timeOutEffect = () => {\n effect(() => {\n if (this.timeOut()) {\n clearTimeout(this._timeOutRef);\n this._timeOutRef = window.setTimeout(() => {\n this.close();\n }, this.timeOut());\n }\n });\n };\n\n /**\n * @ignore\n */\n constructor() {\n super();\n afterNextRender(() => {\n this.onOptionChanged.subscribe(this._handleOnOptionChanged.bind(this));\n this._setLayout();\n this.customIcon.set(this.axIcon()?.icon);\n });\n this.timeOutEffect();\n }\n\n /**\n * @ignore\n */\n private _setLayout() {\n this._setIcon();\n this.showInline.set(this.axContent() == null && this.axFooter() == null);\n this.cdr.markForCheck();\n }\n\n /**\n * @ignore\n */\n protected _handleOnOptionChanged() {\n this._setIcon();\n }\n\n /**\n * @ignore\n */\n private _setIcon() {\n if (!this.axIcon() || this.axIcon().getHostElement().firstElementChild) return;\n\n switch (this.color) {\n case 'success':\n this.axIcon().icon = 'ax-icon ax-icon-check-circle';\n break;\n case 'danger':\n this.axIcon().icon = 'ax-icon ax-icon-error';\n break;\n case 'warning':\n this.axIcon().icon = 'ax-icon ax-icon-warning';\n break;\n default:\n this.axIcon().icon = this.customIcon() || 'ax-icon ax-icon-info';\n break;\n }\n }\n\n /**\n * Removes the alert from the container after a transition effect.\n *\n * @ignore\n */\n close(): void {\n if (isBrowser()) {\n const host = this.getHostElement();\n host.parentElement?.removeChild(host);\n this.onClosed.emit({\n component: this,\n });\n }\n }\n\n /**\n * @ignore\n */\n @HostBinding('class')\n get __hostClass(): string {\n return `ax-alert ax-none ax-${this.color}-solid`;\n }\n}\n","@if (showInline()) {\n <div class=\"ax-alert-inline\">\n <div class=\"ax-alert-icon ax-icon-solid\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <div class=\"ax-alert-buttons\">\n <ng-container [ngTemplateOutlet]=\"buttons\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container>\n </div>\n} @else {\n <div class=\"ax-alert-block\">\n <div class=\"ax-alert-icon ax-icon-solid\">\n <ng-container [ngTemplateOutlet]=\"icon\"></ng-container>\n </div>\n <div class=\"ax-alert-content\">\n <div class=\"ax-alert-title\">\n <ng-container [ngTemplateOutlet]=\"title\"></ng-container>\n </div>\n <ng-container [ngTemplateOutlet]=\"content\"></ng-container>\n <ng-container [ngTemplateOutlet]=\"footer\"></ng-container>\n </div>\n <div><ng-container [ngTemplateOutlet]=\"closeButton\"></ng-container></div>\n </div>\n}\n\n@if (timeOut()) {\n <div class=\"ax-alert-progress\" [style.animation-duration.ms]=\"timeOut()\"></div>\n}\n\n<ng-template #buttons>\n <ng-content select=\"ax-button\"> </ng-content>\n</ng-template>\n<ng-template #closeButton>\n <ng-content select=\"ax-close-button\"> </ng-content>\n</ng-template>\n<ng-template #title>\n <ng-content select=\"ax-title\"> </ng-content>\n</ng-template>\n<ng-template #icon>\n <ng-content select=\"ax-icon\"> </ng-content>\n</ng-template>\n<ng-template #content>\n <ng-content select=\"ax-content\"> </ng-content>\n</ng-template>\n<ng-template #footer>\n <ng-content select=\"ax-footer\"> </ng-content>\n</ng-template>\n","import { AXDecoratorModule } from '@acorex/components/decorators';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXAlertComponent } from './alert.component';\n\nconst COMPONENT = [AXAlertComponent];\nconst MODULES = [CommonModule, AXDecoratorModule];\n\n@NgModule({\n declarations: [...COMPONENT],\n imports: [...MODULES],\n exports: [...COMPONENT],\n providers: [],\n})\nexport class AXAlertModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -54,11 +54,11 @@ class AXAvatarComponent extends MXColorComponent {
|
|
|
54
54
|
return `width: ${this.size()}px; height: ${this.size()}px`;
|
|
55
55
|
}
|
|
56
56
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXAvatarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
57
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXAvatarComponent, isStandalone: false, selector: "ax-avatar", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { size: "sizeChange" }, host: { properties: { "class": "this.__hostClass", "style": "this.__hostStyle" } }, queries: [{ propertyName: "children", predicate: ["ax-image, ax-icon, ax-text"], isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-text, ax-image, ax-icon\"></ng-content>\n\n@if (!children()?.length) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"ax-solid\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 512 512\">\n <g style=\"isolation: isolate\">\n <g id=\"Layer_2\" data-name=\"Layer 2\">\n <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n <rect width=\"512\" height=\"512\" />\n <path\n d=\"M419.16,511.94s-2.85-154-142.28-176.19a139.93,139.93,0,0,0-22-1.67h0a55.8,55.8,0,0,0-5.93.29C99.25,350.35,96.26,511.94,96.26,511.94\"\n style=\"fill: rgba(var(--ax-color-white)); opacity: 0.7\"\n />\n <path\n d=\"M256,355.18c-17.29,0-32.22-4.63-46.38-12.41-3.86,1.31-8.15,2.93-11.75,4.46A96.48,96.48,0,0,0,256,366.62a100.29,100.29,0,0,0,60.07-20c-3.6-1.49-6.41-2.55-10.27-3.83C291.48,350.79,273.58,355.18,256,355.18Z\"\n style=\"opacity: 0.05\"\n />\n <circle cx=\"257.71\" cy=\"255.94\" r=\"99.24\" style=\"fill: rgba(var(--ax-color-white))\" />\n </g>\n </g>\n </g>\n </svg>\n}\n<ng-content select=\"ax-badge\"></ng-content>\n", styles: ["ax-avatar-group{display:flex}ax-avatar-group ax-avatar{margin:-.25rem;overflow:hidden;border-width:2px;border-color:rgba(var(--ax-color-surface))}ax-avatar{position:relative;display:flex;justify-content:center}ax-avatar.ax-shape-sharp{border-radius:0}ax-avatar.ax-shape-soft{border-radius:var(--ax-rounded-border-default)}ax-avatar.ax-shape-rounded{border-radius:9999px}ax-avatar *{border-radius:inherit}ax-avatar ax-text{font-size:1.5rem;line-height:2rem}ax-avatar ax-icon,ax-avatar ax-text{display:flex;min-height:100%;min-width:100%;align-items:center;justify-content:center}ax-avatar ax-badge{position:absolute}ax-avatar.ax-primary-solid .ax-solid{fill:rgba(var(--ax-color-primary-400))}ax-avatar.ax-primary-solid ax-text,ax-avatar.ax-primary-solid ax-icon{background-color:rgba(var(--ax-color-primary-100));color:rgba(var(--ax-color-primary-400))}ax-avatar.ax-
|
|
57
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: AXAvatarComponent, isStandalone: false, selector: "ax-avatar", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { size: "sizeChange" }, host: { properties: { "class": "this.__hostClass", "style": "this.__hostStyle" } }, queries: [{ propertyName: "children", predicate: ["ax-image, ax-icon, ax-text"], isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-text, ax-image, ax-icon\"></ng-content>\n\n@if (!children()?.length) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"ax-solid\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 512 512\">\n <g style=\"isolation: isolate\">\n <g id=\"Layer_2\" data-name=\"Layer 2\">\n <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n <rect width=\"512\" height=\"512\" />\n <path\n d=\"M419.16,511.94s-2.85-154-142.28-176.19a139.93,139.93,0,0,0-22-1.67h0a55.8,55.8,0,0,0-5.93.29C99.25,350.35,96.26,511.94,96.26,511.94\"\n style=\"fill: rgba(var(--ax-color-white)); opacity: 0.7\"\n />\n <path\n d=\"M256,355.18c-17.29,0-32.22-4.63-46.38-12.41-3.86,1.31-8.15,2.93-11.75,4.46A96.48,96.48,0,0,0,256,366.62a100.29,100.29,0,0,0,60.07-20c-3.6-1.49-6.41-2.55-10.27-3.83C291.48,350.79,273.58,355.18,256,355.18Z\"\n style=\"opacity: 0.05\"\n />\n <circle cx=\"257.71\" cy=\"255.94\" r=\"99.24\" style=\"fill: rgba(var(--ax-color-white))\" />\n </g>\n </g>\n </g>\n </svg>\n}\n<ng-content select=\"ax-badge\"></ng-content>\n", styles: ["ax-avatar-group{display:flex}ax-avatar-group ax-avatar{margin:-.25rem;overflow:hidden;border-width:2px;border-color:rgba(var(--ax-color-surface))}ax-avatar{position:relative;display:flex;justify-content:center}ax-avatar.ax-shape-sharp{border-radius:0}ax-avatar.ax-shape-soft{border-radius:var(--ax-rounded-border-default)}ax-avatar.ax-shape-rounded{border-radius:9999px}ax-avatar *{border-radius:inherit}ax-avatar ax-text{font-size:1.5rem;line-height:2rem}ax-avatar ax-icon,ax-avatar ax-text{display:flex;min-height:100%;min-width:100%;align-items:center;justify-content:center}ax-avatar ax-badge{position:absolute}ax-avatar.ax-primary-solid .ax-solid{fill:rgba(var(--ax-color-primary-400))}ax-avatar.ax-primary-solid ax-text,ax-avatar.ax-primary-solid ax-icon{background-color:rgba(var(--ax-color-primary-100));color:rgba(var(--ax-color-primary-400))}ax-avatar.ax-success-solid .ax-solid{fill:rgba(var(--ax-color-success-400))}ax-avatar.ax-success-solid ax-text,ax-avatar.ax-success-solid ax-icon{background-color:rgba(var(--ax-color-success-100));color:rgba(var(--ax-color-success-400))}ax-avatar.ax-warning-solid .ax-solid{fill:rgba(var(--ax-color-warning-400))}ax-avatar.ax-warning-solid ax-text,ax-avatar.ax-warning-solid ax-icon{background-color:rgba(var(--ax-color-warning-100));color:rgba(var(--ax-color-warning-400))}ax-avatar.ax-danger-solid .ax-solid{fill:rgba(var(--ax-color-danger-400))}ax-avatar.ax-danger-solid ax-text,ax-avatar.ax-danger-solid ax-icon{background-color:rgba(var(--ax-color-danger-100));color:rgba(var(--ax-color-danger-400))}ax-avatar.ax-neutral-solid .ax-solid{fill:rgba(var(--ax-color-neutral-400))}ax-avatar.ax-neutral-solid ax-text,ax-avatar.ax-neutral-solid ax-icon{background-color:rgba(var(--ax-color-neutral-100));color:rgba(var(--ax-color-neutral-400))}ax-avatar.ax-ghost-solid ax-text,ax-avatar.ax-ghost-solid ax-icon{background-color:rgba(var(--ax-color-neutral-200));color:rgba(var(--ax-color-neutral-fore-tint))}ax-avatar.ax-ghost-solid ax-icon svg{fill:rgba(var(--ax-color-neutral-200))}.ax-dark ax-avatar.ax-primary-solid .ax-solid{fill:rgba(var(--ax-color-primary-700))}.ax-dark ax-avatar.ax-primary-solid ax-text,.ax-dark ax-avatar.ax-primary-solid ax-icon{background-color:rgba(var(--ax-color-primary-400));color:rgba(var(--ax-color-primary-100))}.ax-dark ax-avatar.ax-success-solid .ax-solid{fill:rgba(var(--ax-color-success-700))}.ax-dark ax-avatar.ax-success-solid ax-text,.ax-dark ax-avatar.ax-success-solid ax-icon{background-color:rgba(var(--ax-color-success-400));color:rgba(var(--ax-color-success-100))}.ax-dark ax-avatar.ax-warning-solid .ax-solid{fill:rgba(var(--ax-color-warning-700))}.ax-dark ax-avatar.ax-warning-solid ax-text,.ax-dark ax-avatar.ax-warning-solid ax-icon{background-color:rgba(var(--ax-color-warning-400));color:rgba(var(--ax-color-warning-100))}.ax-dark ax-avatar.ax-danger-solid .ax-solid{fill:rgba(var(--ax-color-danger-700))}.ax-dark ax-avatar.ax-danger-solid ax-text,.ax-dark ax-avatar.ax-danger-solid ax-icon{background-color:rgba(var(--ax-color-danger-400));color:rgba(var(--ax-color-danger-100))}.ax-dark ax-avatar.ax-neutral-solid .ax-solid{fill:rgba(var(--ax-color-neutral-700))}.ax-dark ax-avatar.ax-neutral-solid ax-text,.ax-dark ax-avatar.ax-neutral-solid ax-icon{background-color:rgba(var(--ax-color-neutral-400));color:rgba(var(--ax-color-neutral-100))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
58
58
|
}
|
|
59
59
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: AXAvatarComponent, decorators: [{
|
|
60
60
|
type: Component,
|
|
61
|
-
args: [{ selector: 'ax-avatar', inputs: ['color'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-content select=\"ax-text, ax-image, ax-icon\"></ng-content>\n\n@if (!children()?.length) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"ax-solid\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 512 512\">\n <g style=\"isolation: isolate\">\n <g id=\"Layer_2\" data-name=\"Layer 2\">\n <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n <rect width=\"512\" height=\"512\" />\n <path\n d=\"M419.16,511.94s-2.85-154-142.28-176.19a139.93,139.93,0,0,0-22-1.67h0a55.8,55.8,0,0,0-5.93.29C99.25,350.35,96.26,511.94,96.26,511.94\"\n style=\"fill: rgba(var(--ax-color-white)); opacity: 0.7\"\n />\n <path\n d=\"M256,355.18c-17.29,0-32.22-4.63-46.38-12.41-3.86,1.31-8.15,2.93-11.75,4.46A96.48,96.48,0,0,0,256,366.62a100.29,100.29,0,0,0,60.07-20c-3.6-1.49-6.41-2.55-10.27-3.83C291.48,350.79,273.58,355.18,256,355.18Z\"\n style=\"opacity: 0.05\"\n />\n <circle cx=\"257.71\" cy=\"255.94\" r=\"99.24\" style=\"fill: rgba(var(--ax-color-white))\" />\n </g>\n </g>\n </g>\n </svg>\n}\n<ng-content select=\"ax-badge\"></ng-content>\n", styles: ["ax-avatar-group{display:flex}ax-avatar-group ax-avatar{margin:-.25rem;overflow:hidden;border-width:2px;border-color:rgba(var(--ax-color-surface))}ax-avatar{position:relative;display:flex;justify-content:center}ax-avatar.ax-shape-sharp{border-radius:0}ax-avatar.ax-shape-soft{border-radius:var(--ax-rounded-border-default)}ax-avatar.ax-shape-rounded{border-radius:9999px}ax-avatar *{border-radius:inherit}ax-avatar ax-text{font-size:1.5rem;line-height:2rem}ax-avatar ax-icon,ax-avatar ax-text{display:flex;min-height:100%;min-width:100%;align-items:center;justify-content:center}ax-avatar ax-badge{position:absolute}ax-avatar.ax-primary-solid .ax-solid{fill:rgba(var(--ax-color-primary-400))}ax-avatar.ax-primary-solid ax-text,ax-avatar.ax-primary-solid ax-icon{background-color:rgba(var(--ax-color-primary-100));color:rgba(var(--ax-color-primary-400))}ax-avatar.ax-
|
|
61
|
+
args: [{ selector: 'ax-avatar', inputs: ['color'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-content select=\"ax-text, ax-image, ax-icon\"></ng-content>\n\n@if (!children()?.length) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"ax-solid\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 512 512\">\n <g style=\"isolation: isolate\">\n <g id=\"Layer_2\" data-name=\"Layer 2\">\n <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n <rect width=\"512\" height=\"512\" />\n <path\n d=\"M419.16,511.94s-2.85-154-142.28-176.19a139.93,139.93,0,0,0-22-1.67h0a55.8,55.8,0,0,0-5.93.29C99.25,350.35,96.26,511.94,96.26,511.94\"\n style=\"fill: rgba(var(--ax-color-white)); opacity: 0.7\"\n />\n <path\n d=\"M256,355.18c-17.29,0-32.22-4.63-46.38-12.41-3.86,1.31-8.15,2.93-11.75,4.46A96.48,96.48,0,0,0,256,366.62a100.29,100.29,0,0,0,60.07-20c-3.6-1.49-6.41-2.55-10.27-3.83C291.48,350.79,273.58,355.18,256,355.18Z\"\n style=\"opacity: 0.05\"\n />\n <circle cx=\"257.71\" cy=\"255.94\" r=\"99.24\" style=\"fill: rgba(var(--ax-color-white))\" />\n </g>\n </g>\n </g>\n </svg>\n}\n<ng-content select=\"ax-badge\"></ng-content>\n", styles: ["ax-avatar-group{display:flex}ax-avatar-group ax-avatar{margin:-.25rem;overflow:hidden;border-width:2px;border-color:rgba(var(--ax-color-surface))}ax-avatar{position:relative;display:flex;justify-content:center}ax-avatar.ax-shape-sharp{border-radius:0}ax-avatar.ax-shape-soft{border-radius:var(--ax-rounded-border-default)}ax-avatar.ax-shape-rounded{border-radius:9999px}ax-avatar *{border-radius:inherit}ax-avatar ax-text{font-size:1.5rem;line-height:2rem}ax-avatar ax-icon,ax-avatar ax-text{display:flex;min-height:100%;min-width:100%;align-items:center;justify-content:center}ax-avatar ax-badge{position:absolute}ax-avatar.ax-primary-solid .ax-solid{fill:rgba(var(--ax-color-primary-400))}ax-avatar.ax-primary-solid ax-text,ax-avatar.ax-primary-solid ax-icon{background-color:rgba(var(--ax-color-primary-100));color:rgba(var(--ax-color-primary-400))}ax-avatar.ax-success-solid .ax-solid{fill:rgba(var(--ax-color-success-400))}ax-avatar.ax-success-solid ax-text,ax-avatar.ax-success-solid ax-icon{background-color:rgba(var(--ax-color-success-100));color:rgba(var(--ax-color-success-400))}ax-avatar.ax-warning-solid .ax-solid{fill:rgba(var(--ax-color-warning-400))}ax-avatar.ax-warning-solid ax-text,ax-avatar.ax-warning-solid ax-icon{background-color:rgba(var(--ax-color-warning-100));color:rgba(var(--ax-color-warning-400))}ax-avatar.ax-danger-solid .ax-solid{fill:rgba(var(--ax-color-danger-400))}ax-avatar.ax-danger-solid ax-text,ax-avatar.ax-danger-solid ax-icon{background-color:rgba(var(--ax-color-danger-100));color:rgba(var(--ax-color-danger-400))}ax-avatar.ax-neutral-solid .ax-solid{fill:rgba(var(--ax-color-neutral-400))}ax-avatar.ax-neutral-solid ax-text,ax-avatar.ax-neutral-solid ax-icon{background-color:rgba(var(--ax-color-neutral-100));color:rgba(var(--ax-color-neutral-400))}ax-avatar.ax-ghost-solid ax-text,ax-avatar.ax-ghost-solid ax-icon{background-color:rgba(var(--ax-color-neutral-200));color:rgba(var(--ax-color-neutral-fore-tint))}ax-avatar.ax-ghost-solid ax-icon svg{fill:rgba(var(--ax-color-neutral-200))}.ax-dark ax-avatar.ax-primary-solid .ax-solid{fill:rgba(var(--ax-color-primary-700))}.ax-dark ax-avatar.ax-primary-solid ax-text,.ax-dark ax-avatar.ax-primary-solid ax-icon{background-color:rgba(var(--ax-color-primary-400));color:rgba(var(--ax-color-primary-100))}.ax-dark ax-avatar.ax-success-solid .ax-solid{fill:rgba(var(--ax-color-success-700))}.ax-dark ax-avatar.ax-success-solid ax-text,.ax-dark ax-avatar.ax-success-solid ax-icon{background-color:rgba(var(--ax-color-success-400));color:rgba(var(--ax-color-success-100))}.ax-dark ax-avatar.ax-warning-solid .ax-solid{fill:rgba(var(--ax-color-warning-700))}.ax-dark ax-avatar.ax-warning-solid ax-text,.ax-dark ax-avatar.ax-warning-solid ax-icon{background-color:rgba(var(--ax-color-warning-400));color:rgba(var(--ax-color-warning-100))}.ax-dark ax-avatar.ax-danger-solid .ax-solid{fill:rgba(var(--ax-color-danger-700))}.ax-dark ax-avatar.ax-danger-solid ax-text,.ax-dark ax-avatar.ax-danger-solid ax-icon{background-color:rgba(var(--ax-color-danger-400));color:rgba(var(--ax-color-danger-100))}.ax-dark ax-avatar.ax-neutral-solid .ax-solid{fill:rgba(var(--ax-color-neutral-700))}.ax-dark ax-avatar.ax-neutral-solid ax-text,.ax-dark ax-avatar.ax-neutral-solid ax-icon{background-color:rgba(var(--ax-color-neutral-400));color:rgba(var(--ax-color-neutral-100))}\n"] }]
|
|
62
62
|
}], propDecorators: { __hostClass: [{
|
|
63
63
|
type: HostBinding,
|
|
64
64
|
args: ['class']
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"acorex-components-avatar.mjs","sources":["../../../../libs/components/avatar/src/lib/avatar-group.component.ts","../../../../libs/components/avatar/src/lib/avatar.component.ts","../../../../libs/components/avatar/src/lib/avatar.component.html","../../../../libs/components/avatar/src/lib/avatar.module.ts","../../../../libs/components/avatar/src/acorex-components-avatar.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n selector: 'ax-avatar-group',\n template: `<ng-content select=\"ax-avatar\"></ng-content>`,\n standalone: false\n})\nexport class AXAvatarGroupComponent {}\n","import { MXColorComponent } from '@acorex/components/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n contentChildren,\n HostBinding,\n input,\n model,\n QueryList,\n ViewEncapsulation,\n} from '@angular/core';\n\n/**\n * The Avatar component displays a user's profile image or initials, typically used for user identification.\n *\n * @category Components\n */\n@Component({\n selector: 'ax-avatar',\n templateUrl: './avatar.component.html',\n styleUrls: ['./avatar.component.scss'],\n inputs: ['color'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: false\n})\nexport class AXAvatarComponent extends MXColorComponent {\n /**\n * @ignore\n */\n protected children = contentChildren<QueryList<unknown>>('ax-image, ax-icon, ax-text');\n\n /**\n * Defines the size of the avatar in pixels.\n *\n * @defaultValue 48\n */\n size = model<number>(48);\n\n /**\n * Specifies the visual style of the avatar.\n *\n * @defaultValue 'rounded'\n */\n look = input<'sharp' | 'soft' | 'rounded'>('rounded');\n\n /**\n * @ignore\n */\n @HostBinding('class')\n private get __hostClass(): string {\n return `ax-${this.color}-solid ax-shape-${this.look()}`;\n }\n\n /**\n * @ignore\n */\n @HostBinding('style')\n private get __hostStyle(): string {\n return `width: ${this.size()}px; height: ${this.size()}px`;\n }\n}\n","<ng-content select=\"ax-text, ax-image, ax-icon\"></ng-content>\n\n@if (!children()?.length) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"ax-solid\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 512 512\">\n <g style=\"isolation: isolate\">\n <g id=\"Layer_2\" data-name=\"Layer 2\">\n <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n <rect width=\"512\" height=\"512\" />\n <path\n d=\"M419.16,511.94s-2.85-154-142.28-176.19a139.93,139.93,0,0,0-22-1.67h0a55.8,55.8,0,0,0-5.93.29C99.25,350.35,96.26,511.94,96.26,511.94\"\n style=\"fill: rgba(var(--ax-color-white)); opacity: 0.7\"\n />\n <path\n d=\"M256,355.18c-17.29,0-32.22-4.63-46.38-12.41-3.86,1.31-8.15,2.93-11.75,4.46A96.48,96.48,0,0,0,256,366.62a100.29,100.29,0,0,0,60.07-20c-3.6-1.49-6.41-2.55-10.27-3.83C291.48,350.79,273.58,355.18,256,355.18Z\"\n style=\"opacity: 0.05\"\n />\n <circle cx=\"257.71\" cy=\"255.94\" r=\"99.24\" style=\"fill: rgba(var(--ax-color-white))\" />\n </g>\n </g>\n </g>\n </svg>\n}\n<ng-content select=\"ax-badge\"></ng-content>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXAvatarGroupComponent } from './avatar-group.component';\nimport { AXAvatarComponent } from './avatar.component';\n\nconst COMPONENT = [AXAvatarComponent, AXAvatarGroupComponent];\nconst MODULES = [CommonModule];\n\n@NgModule({\n declarations: [...COMPONENT],\n imports: [...MODULES],\n exports: [...COMPONENT],\n providers: [],\n})\nexport class AXAvatarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAOa,sBAAsB,CAAA;8GAAtB,sBAAsB,EAAA,IAAA,EAAA,EAAA,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,4EAHrB,CAA8C,4CAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,CAAA;;2FAG/C,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBALlC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,iBAAiB;AAC3B,oBAAA,QAAQ,EAAE,CAA8C,4CAAA,CAAA;AACxD,oBAAA,UAAU,EAAE;AACf,iBAAA;;;ACMD;;;;AAIG;AAUG,MAAO,iBAAkB,SAAQ,gBAAgB,CAAA;AATvD,IAAA,WAAA,GAAA;;AAUE;;AAEG;AACO,QAAA,IAAA,CAAA,QAAQ,GAAG,eAAe,CAAqB,4BAA4B,CAAC;AAEtF;;;;AAIG;AACH,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAS,EAAE,CAAC;AAExB;;;;AAIG;AACH,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAA+B,SAAS,CAAC;AAiBtD;AAfC;;AAEG;AACH,IAAA,IACY,WAAW,GAAA;QACrB,OAAO,CAAA,GAAA,EAAM,IAAI,CAAC,KAAK,CAAA,gBAAA,EAAmB,IAAI,CAAC,IAAI,EAAE,CAAA,CAAE;;AAGzD;;AAEG;AACH,IAAA,IACY,WAAW,GAAA;QACrB,OAAO,CAAA,OAAA,EAAU,IAAI,CAAC,IAAI,EAAE,CAAe,YAAA,EAAA,IAAI,CAAC,IAAI,EAAE,CAAA,EAAA,CAAI;;8GAjCjD,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,qqBC1B9B,6oCAuBA,EAAA,MAAA,EAAA,CAAA,
|
|
1
|
+
{"version":3,"file":"acorex-components-avatar.mjs","sources":["../../../../libs/components/avatar/src/lib/avatar-group.component.ts","../../../../libs/components/avatar/src/lib/avatar.component.ts","../../../../libs/components/avatar/src/lib/avatar.component.html","../../../../libs/components/avatar/src/lib/avatar.module.ts","../../../../libs/components/avatar/src/acorex-components-avatar.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n selector: 'ax-avatar-group',\n template: `<ng-content select=\"ax-avatar\"></ng-content>`,\n standalone: false\n})\nexport class AXAvatarGroupComponent {}\n","import { MXColorComponent } from '@acorex/components/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n contentChildren,\n HostBinding,\n input,\n model,\n QueryList,\n ViewEncapsulation,\n} from '@angular/core';\n\n/**\n * The Avatar component displays a user's profile image or initials, typically used for user identification.\n *\n * @category Components\n */\n@Component({\n selector: 'ax-avatar',\n templateUrl: './avatar.component.html',\n styleUrls: ['./avatar.component.scss'],\n inputs: ['color'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: false\n})\nexport class AXAvatarComponent extends MXColorComponent {\n /**\n * @ignore\n */\n protected children = contentChildren<QueryList<unknown>>('ax-image, ax-icon, ax-text');\n\n /**\n * Defines the size of the avatar in pixels.\n *\n * @defaultValue 48\n */\n size = model<number>(48);\n\n /**\n * Specifies the visual style of the avatar.\n *\n * @defaultValue 'rounded'\n */\n look = input<'sharp' | 'soft' | 'rounded'>('rounded');\n\n /**\n * @ignore\n */\n @HostBinding('class')\n private get __hostClass(): string {\n return `ax-${this.color}-solid ax-shape-${this.look()}`;\n }\n\n /**\n * @ignore\n */\n @HostBinding('style')\n private get __hostStyle(): string {\n return `width: ${this.size()}px; height: ${this.size()}px`;\n }\n}\n","<ng-content select=\"ax-text, ax-image, ax-icon\"></ng-content>\n\n@if (!children()?.length) {\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"ax-solid\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 512 512\">\n <g style=\"isolation: isolate\">\n <g id=\"Layer_2\" data-name=\"Layer 2\">\n <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n <rect width=\"512\" height=\"512\" />\n <path\n d=\"M419.16,511.94s-2.85-154-142.28-176.19a139.93,139.93,0,0,0-22-1.67h0a55.8,55.8,0,0,0-5.93.29C99.25,350.35,96.26,511.94,96.26,511.94\"\n style=\"fill: rgba(var(--ax-color-white)); opacity: 0.7\"\n />\n <path\n d=\"M256,355.18c-17.29,0-32.22-4.63-46.38-12.41-3.86,1.31-8.15,2.93-11.75,4.46A96.48,96.48,0,0,0,256,366.62a100.29,100.29,0,0,0,60.07-20c-3.6-1.49-6.41-2.55-10.27-3.83C291.48,350.79,273.58,355.18,256,355.18Z\"\n style=\"opacity: 0.05\"\n />\n <circle cx=\"257.71\" cy=\"255.94\" r=\"99.24\" style=\"fill: rgba(var(--ax-color-white))\" />\n </g>\n </g>\n </g>\n </svg>\n}\n<ng-content select=\"ax-badge\"></ng-content>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXAvatarGroupComponent } from './avatar-group.component';\nimport { AXAvatarComponent } from './avatar.component';\n\nconst COMPONENT = [AXAvatarComponent, AXAvatarGroupComponent];\nconst MODULES = [CommonModule];\n\n@NgModule({\n declarations: [...COMPONENT],\n imports: [...MODULES],\n exports: [...COMPONENT],\n providers: [],\n})\nexport class AXAvatarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|