@acorex/components 18.8.1 → 18.8.3
Sign up to get free protection for your applications and to get access to all the features.
- package/action-sheet/lib/action-sheet.component.d.ts +3 -12
- package/esm2022/action-sheet/lib/action-sheet.component.mjs +13 -22
- package/esm2022/color-palette/lib/color-palette-picker.component.mjs +8 -9
- package/esm2022/color-palette/lib/color-palette.component.mjs +2 -2
- package/esm2022/common/lib/components/value-component.class.mjs +1 -1
- package/esm2022/conversation/lib/conversation-messages/conversation-message-audio/conversation-message-audio.component.mjs +1 -1
- package/esm2022/number-box/lib/number-box.component.mjs +47 -29
- package/esm2022/paint/lib/paint/paint-tools/paint-color-picker/paint-color-picker.component.mjs +3 -3
- package/esm2022/paint/lib/paint/paint-tools/paint-pen-cap/paint-pen-cap.component.mjs +3 -3
- package/esm2022/paint/lib/paint/paint-tools/paint-pen-mode-changer/paint-pen-mode-changer.component.mjs +1 -1
- package/esm2022/paint/lib/paint/paint-view/paint-view.component.mjs +4 -3
- package/esm2022/phone-box/lib/phone-box.component.mjs +3 -3
- package/esm2022/range-slider/lib/range-slider.class.mjs +1 -1
- package/esm2022/range-slider/lib/range-slider.component.mjs +156 -134
- package/esm2022/wysiwyg/lib/wysiwyg/wysiwyg-container/wysiwyg-container.component.mjs +8 -2
- package/esm2022/wysiwyg/lib/wysiwyg/wysiwyg-tools/wysiwyg-alignment/wysiwyg-alignment.component.mjs +4 -4
- package/esm2022/wysiwyg/lib/wysiwyg/wysiwyg-tools/wysiwyg-colors/wysiwyg-colors.component.mjs +33 -5
- package/esm2022/wysiwyg/lib/wysiwyg/wysiwyg-tools/wysiwyg-font-style/wysiwyg-font-style.component.mjs +1 -19
- package/esm2022/wysiwyg/lib/wysiwyg/wysiwyg-tools/wysiwyg-insert/wysiwyg-insert.component.mjs +3 -3
- package/esm2022/wysiwyg/lib/wysiwyg/wysiwyg-view/wysiwyg-view.component.mjs +18 -8
- package/esm2022/wysiwyg/lib/wysiwyg/wysiwyg.service.mjs +2 -1
- package/fesm2022/acorex-components-action-sheet.mjs +12 -21
- package/fesm2022/acorex-components-action-sheet.mjs.map +1 -1
- package/fesm2022/acorex-components-color-palette.mjs +7 -7
- package/fesm2022/acorex-components-color-palette.mjs.map +1 -1
- package/fesm2022/acorex-components-common.mjs.map +1 -1
- package/fesm2022/acorex-components-conversation.mjs +1 -1
- package/fesm2022/acorex-components-conversation.mjs.map +1 -1
- package/fesm2022/acorex-components-number-box.mjs +46 -28
- package/fesm2022/acorex-components-number-box.mjs.map +1 -1
- package/fesm2022/acorex-components-paint.mjs +8 -7
- package/fesm2022/acorex-components-paint.mjs.map +1 -1
- package/fesm2022/acorex-components-phone-box.mjs +2 -2
- package/fesm2022/acorex-components-phone-box.mjs.map +1 -1
- package/fesm2022/acorex-components-range-slider.mjs +154 -132
- package/fesm2022/acorex-components-range-slider.mjs.map +1 -1
- package/fesm2022/acorex-components-wysiwyg.mjs +60 -33
- package/fesm2022/acorex-components-wysiwyg.mjs.map +1 -1
- package/number-box/lib/number-box.component.d.ts +30 -29
- package/package.json +54 -54
- package/range-slider/lib/range-slider.class.d.ts +1 -0
- package/range-slider/lib/range-slider.component.d.ts +43 -11
- package/wysiwyg/lib/wysiwyg/wysiwyg-tools/wysiwyg-colors/wysiwyg-colors.component.d.ts +8 -0
- package/wysiwyg/lib/wysiwyg/wysiwyg-tools/wysiwyg-font-style/wysiwyg-font-style.component.d.ts +0 -2
- package/wysiwyg/lib/wysiwyg/wysiwyg-view/wysiwyg-view.component.d.ts +3 -3
- package/wysiwyg/lib/wysiwyg/wysiwyg.service.d.ts +1 -0
|
@@ -50,19 +50,7 @@ class AXActionSheetComponent extends MXBaseComponent {
|
|
|
50
50
|
}
|
|
51
51
|
}
|
|
52
52
|
}
|
|
53
|
-
|
|
54
|
-
* @ignore
|
|
55
|
-
*/
|
|
56
|
-
onKeydownHandler() {
|
|
57
|
-
const focusedOrHasFocused = this.getHostElement().matches(':focus-within');
|
|
58
|
-
if (this.data.closeButton && focusedOrHasFocused) {
|
|
59
|
-
this.close(null);
|
|
60
|
-
}
|
|
61
|
-
}
|
|
62
|
-
/**
|
|
63
|
-
* @ignore
|
|
64
|
-
*/
|
|
65
|
-
_handleAttched(ref) {
|
|
53
|
+
handleAttched(ref) {
|
|
66
54
|
ref = ref;
|
|
67
55
|
if (ref.instance) {
|
|
68
56
|
this._componentRef = ref.instance;
|
|
@@ -75,17 +63,11 @@ class AXActionSheetComponent extends MXBaseComponent {
|
|
|
75
63
|
}
|
|
76
64
|
}
|
|
77
65
|
}
|
|
78
|
-
/**
|
|
79
|
-
* @ignore
|
|
80
|
-
*/
|
|
81
66
|
onItemClick(item) {
|
|
82
67
|
this.close(item);
|
|
83
68
|
if (item?.onClick)
|
|
84
69
|
item.onClick();
|
|
85
70
|
}
|
|
86
|
-
/**
|
|
87
|
-
* @ignore
|
|
88
|
-
*/
|
|
89
71
|
close(e) {
|
|
90
72
|
this.dialogRef.close({
|
|
91
73
|
component: this._componentRef,
|
|
@@ -93,6 +75,15 @@ class AXActionSheetComponent extends MXBaseComponent {
|
|
|
93
75
|
data: e,
|
|
94
76
|
});
|
|
95
77
|
}
|
|
78
|
+
/**
|
|
79
|
+
* @ignore
|
|
80
|
+
*/
|
|
81
|
+
onKeydownHandler() {
|
|
82
|
+
const focusedOrHasFocused = this.getHostElement().matches(':focus-within');
|
|
83
|
+
if (this.data.closeButton && focusedOrHasFocused) {
|
|
84
|
+
this.close(null);
|
|
85
|
+
}
|
|
86
|
+
}
|
|
96
87
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXActionSheetComponent, deps: [{ token: DIALOG_DATA }, { token: i1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
97
88
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: AXActionSheetComponent, selector: "ax-action-sheet", host: { listeners: { "keydown.escape": "onKeydownHandler()" } }, providers: [
|
|
98
89
|
{
|
|
@@ -103,7 +94,7 @@ class AXActionSheetComponent extends MXBaseComponent {
|
|
|
103
94
|
provide: AXFocusableComponent,
|
|
104
95
|
useExisting: AXActionSheetComponent,
|
|
105
96
|
},
|
|
106
|
-
], usesInheritance: true, ngImport: i0, template: "@if (data.header) {\n
|
|
97
|
+
], usesInheritance: true, ngImport: i0, template: "@if (data.header) {\n<ax-header>\n <ax-prefix>\n <ax-title>{{ data.title | translate | async }}</ax-title>\n\n @if (data.subTitle) {\n <ax-sub-title>\n {{ data.subTitle }}\n </ax-sub-title>\n }\n </ax-prefix>\n @if (data.closeButton) {\n <ax-suffix>\n <ax-close-button></ax-close-button>\n </ax-suffix>\n }\n</ax-header>\n}\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n @for (item of data.items; let i = $index; track i) {\n <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" [tabindex]=\"i\"\n (click)=\"onItemClick(item)\">\n @if (item.icon) {\n <span class=\"item-icon\" [class]=\"item.icon\"></span>\n }\n <span class=\"item-text\">{{ item.text | translate | async }}</span>\n </div>\n }\n</div>", styles: ["ax-action-sheet{display:block;width:100vw}@media (min-width: 768px){ax-action-sheet{width:70vw}}@media (min-width: 1024px){ax-action-sheet{width:50vw}}ax-action-sheet ax-header{padding:1rem;border-bottom-width:1px;font-size:1rem;line-height:1.5rem;font-weight:500}@media (min-width: 768px){ax-action-sheet ax-header{font-size:1.125rem;line-height:1.75rem}}ax-action-sheet ax-header ax-prefix,ax-action-sheet ax-header ax-suffix{display:flex;flex-direction:column;justify-content:flex-start}ax-action-sheet ax-header ax-prefix{align-items:flex-start}ax-action-sheet ax-header ax-prefix ax-title{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}ax-action-sheet ax-header ax-suffix{align-items:flex-end;max-width:fit-content}ax-action-sheet .ax-action-sheet-items{padding-top:.5rem;padding-bottom:.5rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item{display:flex;padding:.75rem 1rem;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item:hover{background-color:rgba(var(--ax-color-on-surface))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item .item-icon{margin-inline-end:.75rem;font-size:1.5rem;line-height:2rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-primary{color:rgba(var(--ax-color-primary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-secondary{color:rgba(var(--ax-color-secondary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-success{color:rgba(var(--ax-color-success-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-warning{color:rgba(var(--ax-color-warning-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-danger{color:rgba(var(--ax-color-danger-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-info{color:rgba(var(--ax-color-info-500))}\n"], dependencies: [{ kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i3.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["icon"] }, { kind: "component", type: i3.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "pipe", type: i4.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
107
98
|
}
|
|
108
99
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXActionSheetComponent, decorators: [{
|
|
109
100
|
type: Component,
|
|
@@ -116,7 +107,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
|
|
|
116
107
|
provide: AXFocusableComponent,
|
|
117
108
|
useExisting: AXActionSheetComponent,
|
|
118
109
|
},
|
|
119
|
-
], template: "@if (data.header) {\n
|
|
110
|
+
], template: "@if (data.header) {\n<ax-header>\n <ax-prefix>\n <ax-title>{{ data.title | translate | async }}</ax-title>\n\n @if (data.subTitle) {\n <ax-sub-title>\n {{ data.subTitle }}\n </ax-sub-title>\n }\n </ax-prefix>\n @if (data.closeButton) {\n <ax-suffix>\n <ax-close-button></ax-close-button>\n </ax-suffix>\n }\n</ax-header>\n}\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n @for (item of data.items; let i = $index; track i) {\n <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" [tabindex]=\"i\"\n (click)=\"onItemClick(item)\">\n @if (item.icon) {\n <span class=\"item-icon\" [class]=\"item.icon\"></span>\n }\n <span class=\"item-text\">{{ item.text | translate | async }}</span>\n </div>\n }\n</div>", styles: ["ax-action-sheet{display:block;width:100vw}@media (min-width: 768px){ax-action-sheet{width:70vw}}@media (min-width: 1024px){ax-action-sheet{width:50vw}}ax-action-sheet ax-header{padding:1rem;border-bottom-width:1px;font-size:1rem;line-height:1.5rem;font-weight:500}@media (min-width: 768px){ax-action-sheet ax-header{font-size:1.125rem;line-height:1.75rem}}ax-action-sheet ax-header ax-prefix,ax-action-sheet ax-header ax-suffix{display:flex;flex-direction:column;justify-content:flex-start}ax-action-sheet ax-header ax-prefix{align-items:flex-start}ax-action-sheet ax-header ax-prefix ax-title{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}ax-action-sheet ax-header ax-suffix{align-items:flex-end;max-width:fit-content}ax-action-sheet .ax-action-sheet-items{padding-top:.5rem;padding-bottom:.5rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item{display:flex;padding:.75rem 1rem;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item:hover{background-color:rgba(var(--ax-color-on-surface))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item .item-icon{margin-inline-end:.75rem;font-size:1.5rem;line-height:2rem}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-primary{color:rgba(var(--ax-color-primary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-secondary{color:rgba(var(--ax-color-secondary-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-success{color:rgba(var(--ax-color-success-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-warning{color:rgba(var(--ax-color-warning-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-danger{color:rgba(var(--ax-color-danger-500))}ax-action-sheet .ax-action-sheet-items .ax-action-sheet-item.ax-info{color:rgba(var(--ax-color-info-500))}\n"] }]
|
|
120
111
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
121
112
|
type: Inject,
|
|
122
113
|
args: [DIALOG_DATA]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"acorex-components-action-sheet.mjs","sources":["../../../../libs/components/action-sheet/src/lib/action-sheet.component.ts","../../../../libs/components/action-sheet/src/lib/action-sheet.component.html","../../../../libs/components/action-sheet/src/lib/action-sheet.service.ts","../../../../libs/components/action-sheet/src/lib/action-sheet.module.ts","../../../../libs/components/action-sheet/src/acorex-components-action-sheet.ts"],"sourcesContent":["import { AXClosbaleComponent, AXComponentCloseEvent, AXFocusableComponent, MXBaseComponent } from '@acorex/components/common';\nimport { DIALOG_DATA, DialogRef } from '@angular/cdk/dialog';\nimport { CdkPortalOutletAttachedRef, ComponentPortal, Portal, TemplatePortal } from '@angular/cdk/portal';\nimport {\n ChangeDetectionStrategy,\n Component,\n ComponentRef,\n HostListener,\n Inject,\n OnInit,\n TemplateRef,\n ViewEncapsulation,\n} from '@angular/core';\nimport { AXActionSheetConfig, AXActionSheetItem } from './action-sheet.class';\n\n/**\n * A component for displaying an action sheet, which is a menu that slides up from the bottom of the screen.\n *\n * @category Components\n */\n@Component({\n selector: 'ax-action-sheet',\n templateUrl: './action-sheet.component.html',\n styleUrls: ['./action-sheet.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [\n {\n provide: AXClosbaleComponent,\n useExisting: AXActionSheetComponent,\n },\n {\n provide: AXFocusableComponent,\n useExisting: AXActionSheetComponent,\n },\n ],\n})\nexport class AXActionSheetComponent extends MXBaseComponent implements OnInit {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n\n /**\n * @ignore\n */\n protected _selectedPortal: Portal<any>;\n\n /**\n * @ignore\n */\n private _componentRef: unknown;\n\n /**\n * @ignore\n */\n constructor(\n @Inject(DIALOG_DATA)\n protected data: AXActionSheetConfig,\n private dialogRef: DialogRef<AXComponentCloseEvent>,\n ) {\n super();\n }\n\n /**\n * @ignore\n */\n override ngOnInit(): void {\n super.ngOnInit();\n if (this.data.content) {\n if (this.data.content instanceof TemplateRef) {\n this._selectedPortal = new TemplatePortal(this.data.content, this.getViewContainer(), {\n $implicit: this.data,\n ref: this,\n });\n this.cdr.markForCheck();\n } else if (typeof this.data.content === 'function') {\n this._selectedPortal = new ComponentPortal(this.data.content);\n this.cdr.markForCheck();\n }\n }\n }\n\n /**\n * @ignore\n */\n @HostListener('keydown.escape')\n protected onKeydownHandler() {\n const focusedOrHasFocused = this.getHostElement().matches(':focus-within');\n if (this.data.closeButton && focusedOrHasFocused) {\n this.close(null);\n }\n }\n\n /**\n * @ignore\n */\n _handleAttched(ref: CdkPortalOutletAttachedRef) {\n ref = ref as ComponentRef<any>;\n if (ref.instance) {\n this._componentRef = ref.instance;\n Object.assign(this._componentRef, this.data);\n Object.assign(this._componentRef, { _isPopup: true });\n if (ref.instance.onClosed) {\n ref.instance.onClosed.subscribe((e: AXComponentCloseEvent) => {\n this.close(e);\n });\n }\n }\n }\n\n /**\n * @ignore\n */\n onItemClick(item: AXActionSheetItem) {\n this.close(item);\n if (item?.onClick) item.onClick();\n }\n\n /**\n * @ignore\n */\n close(e) {\n this.dialogRef.close({\n component: this._componentRef,\n htmlElement: this.getHostElement(),\n data: e,\n });\n }\n}\n","@if (data.header) {\n <ax-header>\n <ax-prefix>\n <ax-title>{{ data.title | translate | async }}</ax-title>\n\n @if (data.subTitle) {\n <ax-sub-title>\n {{ data.subTitle }}\n </ax-sub-title>\n }\n </ax-prefix>\n @if (data.closeButton) {\n <ax-suffix>\n <ax-close-button></ax-close-button>\n </ax-suffix>\n }\n </ax-header>\n}\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"_handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n @for (item of data.items; let i = $index; track i) {\n <div\n class=\"ax-action-sheet-item ax-{{ item.color }}\"\n [class.ax-state-disabled]=\"item.disabled\"\n [tabindex]=\"i\"\n (click)=\"onItemClick(item)\"\n >\n @if (item.icon) {\n <span class=\"item-icon\" [class]=\"item.icon\"></span>\n }\n <span class=\"item-text\">{{ item.text | translate | async }}</span>\n </div>\n }\n</div>\n","import { Dialog } from '@angular/cdk/dialog';\nimport { GlobalPositionStrategy } from '@angular/cdk/overlay';\nimport { Injectable, inject } from '@angular/core';\nimport { BehaviorSubject, Subject } from 'rxjs';\nimport { AXActionSheetConfig } from './action-sheet.class';\nimport { AXActionSheetComponent } from './action-sheet.component';\n\nexport interface AXActionSheetDialogRef {\n close: (e?) => void;\n closed: Subject<any>;\n}\n\n@Injectable()\nexport class AXActionSheetService {\n private dialog: Dialog = inject(Dialog);\n\n open(config: AXActionSheetConfig): Promise<AXActionSheetDialogRef> {\n const defaultConfig: AXActionSheetConfig = {\n title: 'action-sheet.title',\n closeButton: true,\n closeOnBackdropClick: true,\n header: true,\n };\n config = Object.assign(defaultConfig, config);\n\n const dialogRef = this.dialog.open(AXActionSheetComponent, {\n data: config,\n autoFocus: 'first-tabbable',\n restoreFocus: true,\n role: 'dialog',\n ariaModal: true,\n closeOnNavigation: true,\n closeOnDestroy: true,\n hasBackdrop: true,\n panelClass: ['ax-actionsheet-panel'],\n disableClose: config.closeOnBackdropClick ? false : true,\n positionStrategy: new GlobalPositionStrategy().centerHorizontally().bottom(),\n });\n const promise = new Promise<AXActionSheetDialogRef>((resolve) => {\n const closed = new BehaviorSubject<any>(null);\n const axDialogRef: AXActionSheetDialogRef = {\n close: (e) => {\n dialogRef.close(e);\n },\n closed,\n };\n dialogRef.closed.subscribe((c: any) => {\n if (c?.data) {\n closed.next({ data: c.data });\n } else {\n closed.next({});\n }\n });\n if (resolve) {\n resolve(axDialogRef);\n }\n });\n return promise;\n }\n}\n","import { AXButtonModule } from '@acorex/components/button';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { NgModule } from '@angular/core';\n\nimport { AXCommonModule } from '@acorex/components/common';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { DialogModule } from '@angular/cdk/dialog';\nimport { AsyncPipe } from '@angular/common';\nimport { AXActionSheetComponent } from './action-sheet.component';\nimport { AXActionSheetService } from './action-sheet.service';\n\nconst MODULES = [\n AXCommonModule,\n DragDropModule,\n A11yModule,\n AXButtonModule,\n PortalModule,\n AXDecoratorModule,\n AXTranslationModule,\n DialogModule,\n AsyncPipe,\n];\n\n@NgModule({\n declarations: [AXActionSheetComponent],\n imports: [...MODULES],\n exports: [AXActionSheetComponent],\n providers: [AXActionSheetService],\n})\nexport class AXActionSheetModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"acorex-components-action-sheet.mjs","sources":["../../../../libs/components/action-sheet/src/lib/action-sheet.component.ts","../../../../libs/components/action-sheet/src/lib/action-sheet.component.html","../../../../libs/components/action-sheet/src/lib/action-sheet.service.ts","../../../../libs/components/action-sheet/src/lib/action-sheet.module.ts","../../../../libs/components/action-sheet/src/acorex-components-action-sheet.ts"],"sourcesContent":["import { AXClosbaleComponent, AXComponentCloseEvent, AXFocusableComponent, MXBaseComponent } from '@acorex/components/common';\nimport { DIALOG_DATA, DialogRef } from '@angular/cdk/dialog';\nimport { CdkPortalOutletAttachedRef, ComponentPortal, Portal, TemplatePortal } from '@angular/cdk/portal';\nimport {\n ChangeDetectionStrategy,\n Component,\n ComponentRef,\n HostListener,\n Inject,\n OnInit,\n TemplateRef,\n ViewEncapsulation,\n} from '@angular/core';\nimport { AXActionSheetConfig, AXActionSheetItem } from './action-sheet.class';\n\n/**\n * A component for displaying an action sheet, which is a menu that slides up from the bottom of the screen.\n *\n * @category Components\n */\n@Component({\n selector: 'ax-action-sheet',\n templateUrl: './action-sheet.component.html',\n styleUrls: ['./action-sheet.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [\n {\n provide: AXClosbaleComponent,\n useExisting: AXActionSheetComponent,\n },\n {\n provide: AXFocusableComponent,\n useExisting: AXActionSheetComponent,\n },\n ],\n})\nexport class AXActionSheetComponent extends MXBaseComponent implements OnInit {\n /**\n * @ignore\n */\n protected _selectedPortal: Portal<any>;\n\n /**\n * @ignore\n */\n private _componentRef: unknown;\n\n /**\n * @ignore\n */\n constructor(\n @Inject(DIALOG_DATA)\n protected data: AXActionSheetConfig,\n private dialogRef: DialogRef<AXComponentCloseEvent>,\n ) {\n super();\n }\n\n /**\n * @ignore\n */\n override ngOnInit(): void {\n super.ngOnInit();\n if (this.data.content) {\n if (this.data.content instanceof TemplateRef) {\n this._selectedPortal = new TemplatePortal(this.data.content, this.getViewContainer(), {\n $implicit: this.data,\n ref: this,\n });\n this.cdr.markForCheck();\n } else if (typeof this.data.content === 'function') {\n this._selectedPortal = new ComponentPortal(this.data.content);\n this.cdr.markForCheck();\n }\n }\n }\n\n protected handleAttched(ref: CdkPortalOutletAttachedRef) {\n ref = ref as ComponentRef<any>;\n if (ref.instance) {\n this._componentRef = ref.instance;\n Object.assign(this._componentRef, this.data);\n Object.assign(this._componentRef, { _isPopup: true });\n if (ref.instance.onClosed) {\n ref.instance.onClosed.subscribe((e: AXComponentCloseEvent) => {\n this.close(e);\n });\n }\n }\n }\n\n onItemClick(item: AXActionSheetItem) {\n this.close(item);\n if (item?.onClick) item.onClick();\n }\n\n close(e) {\n this.dialogRef.close({\n component: this._componentRef,\n htmlElement: this.getHostElement(),\n data: e,\n });\n }\n\n /**\n * @ignore\n */\n @HostListener('keydown.escape')\n protected onKeydownHandler() {\n const focusedOrHasFocused = this.getHostElement().matches(':focus-within');\n if (this.data.closeButton && focusedOrHasFocused) {\n this.close(null);\n }\n }\n}\n","@if (data.header) {\n<ax-header>\n <ax-prefix>\n <ax-title>{{ data.title | translate | async }}</ax-title>\n\n @if (data.subTitle) {\n <ax-sub-title>\n {{ data.subTitle }}\n </ax-sub-title>\n }\n </ax-prefix>\n @if (data.closeButton) {\n <ax-suffix>\n <ax-close-button></ax-close-button>\n </ax-suffix>\n }\n</ax-header>\n}\n<ng-template [cdkPortalOutlet]=\"_selectedPortal\" (attached)=\"handleAttched($event)\"></ng-template>\n<div class=\"ax-action-sheet-items\">\n @for (item of data.items; let i = $index; track i) {\n <div class=\"ax-action-sheet-item ax-{{ item.color }}\" [class.ax-state-disabled]=\"item.disabled\" [tabindex]=\"i\"\n (click)=\"onItemClick(item)\">\n @if (item.icon) {\n <span class=\"item-icon\" [class]=\"item.icon\"></span>\n }\n <span class=\"item-text\">{{ item.text | translate | async }}</span>\n </div>\n }\n</div>","import { Dialog } from '@angular/cdk/dialog';\nimport { GlobalPositionStrategy } from '@angular/cdk/overlay';\nimport { Injectable, inject } from '@angular/core';\nimport { BehaviorSubject, Subject } from 'rxjs';\nimport { AXActionSheetConfig } from './action-sheet.class';\nimport { AXActionSheetComponent } from './action-sheet.component';\n\nexport interface AXActionSheetDialogRef {\n close: (e?) => void;\n closed: Subject<any>;\n}\n\n@Injectable()\nexport class AXActionSheetService {\n private dialog: Dialog = inject(Dialog);\n\n open(config: AXActionSheetConfig): Promise<AXActionSheetDialogRef> {\n const defaultConfig: AXActionSheetConfig = {\n title: 'action-sheet.title',\n closeButton: true,\n closeOnBackdropClick: true,\n header: true,\n };\n config = Object.assign(defaultConfig, config);\n\n const dialogRef = this.dialog.open(AXActionSheetComponent, {\n data: config,\n autoFocus: 'first-tabbable',\n restoreFocus: true,\n role: 'dialog',\n ariaModal: true,\n closeOnNavigation: true,\n closeOnDestroy: true,\n hasBackdrop: true,\n panelClass: ['ax-actionsheet-panel'],\n disableClose: config.closeOnBackdropClick ? false : true,\n positionStrategy: new GlobalPositionStrategy().centerHorizontally().bottom(),\n });\n const promise = new Promise<AXActionSheetDialogRef>((resolve) => {\n const closed = new BehaviorSubject<any>(null);\n const axDialogRef: AXActionSheetDialogRef = {\n close: (e) => {\n dialogRef.close(e);\n },\n closed,\n };\n dialogRef.closed.subscribe((c: any) => {\n if (c?.data) {\n closed.next({ data: c.data });\n } else {\n closed.next({});\n }\n });\n if (resolve) {\n resolve(axDialogRef);\n }\n });\n return promise;\n }\n}\n","import { AXButtonModule } from '@acorex/components/button';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { PortalModule } from '@angular/cdk/portal';\nimport { NgModule } from '@angular/core';\n\nimport { AXCommonModule } from '@acorex/components/common';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXTranslationModule } from '@acorex/core/translation';\nimport { DialogModule } from '@angular/cdk/dialog';\nimport { AsyncPipe } from '@angular/common';\nimport { AXActionSheetComponent } from './action-sheet.component';\nimport { AXActionSheetService } from './action-sheet.service';\n\nconst MODULES = [\n AXCommonModule,\n DragDropModule,\n A11yModule,\n AXButtonModule,\n PortalModule,\n AXDecoratorModule,\n AXTranslationModule,\n DialogModule,\n AsyncPipe,\n];\n\n@NgModule({\n declarations: [AXActionSheetComponent],\n imports: [...MODULES],\n exports: [AXActionSheetComponent],\n providers: [AXActionSheetService],\n})\nexport class AXActionSheetModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -9,9 +9,9 @@ import * as i3 from '@acorex/components/text-box';
|
|
|
9
9
|
import { AXTextBoxModule } from '@acorex/components/text-box';
|
|
10
10
|
import * as i4 from '@acorex/components/number-box';
|
|
11
11
|
import { AXNumberBoxModule } from '@acorex/components/number-box';
|
|
12
|
-
import * as
|
|
12
|
+
import * as i2$1 from '@acorex/components/range-slider';
|
|
13
13
|
import { AXRangeSliderModule } from '@acorex/components/range-slider';
|
|
14
|
-
import * as
|
|
14
|
+
import * as i3$1 from '@angular/cdk/drag-drop';
|
|
15
15
|
import { DragDropModule } from '@angular/cdk/drag-drop';
|
|
16
16
|
import { distinctUntilChanged } from 'rxjs/operators';
|
|
17
17
|
import * as i1$1 from '@angular/common';
|
|
@@ -500,7 +500,7 @@ class AXColorPalettePickerComponent extends MXBaseComponent {
|
|
|
500
500
|
_handleAlphaChanged(e) {
|
|
501
501
|
if (e != this._rgba.a) {
|
|
502
502
|
const { r, g, b } = this._rgba;
|
|
503
|
-
const _color = `rgba(${r},${g},${b},${e
|
|
503
|
+
const _color = `rgba(${r},${g},${b},${e})`;
|
|
504
504
|
this._parent.commitValue(AXColorUtil.toString(_color, 'rgba'), true);
|
|
505
505
|
}
|
|
506
506
|
}
|
|
@@ -598,7 +598,7 @@ class AXColorPalettePickerComponent extends MXBaseComponent {
|
|
|
598
598
|
useExisting: AXColorPalettePickerComponent,
|
|
599
599
|
},
|
|
600
600
|
AXUnsubscriber,
|
|
601
|
-
], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-color-box-overlay-trans\">\n <div class=\"ax-color-box-overlay\" [style.background-color]=\"_bgColor\">\n <div class=\"ax-color-box-overlay-g1\"></div>\n <div class=\"ax-color-box-overlay-g2\" (click)=\"_handleSurfaceClick($event)\"></div>\n <div\n class=\"ax-color-box-pointer\"\n cdkDrag\n cdkDragBoundary=\".ax-color-box-overlay\"\n [cdkDragFreeDragPosition]=\"dragPosition\"\n (cdkDragEnded)=\"_handleDrag()\"\n [cdkDragDisabled]=\"_parent.disabled || _parent.readonly\"\n ></div>\n </div>\n</div>\n\n<ax-range-slider\n class=\"ax-color-box-gradient\"\n [min]=\"0\"\n [max]=\"100\"\n [mode]=\"'single'\"\n [
|
|
601
|
+
], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-color-box-overlay-trans\">\n <div class=\"ax-color-box-overlay\" [style.background-color]=\"_bgColor\">\n <div class=\"ax-color-box-overlay-g1\"></div>\n <div class=\"ax-color-box-overlay-g2\" (click)=\"_handleSurfaceClick($event)\"></div>\n <div\n class=\"ax-color-box-pointer\"\n cdkDrag\n cdkDragBoundary=\".ax-color-box-overlay\"\n [cdkDragFreeDragPosition]=\"dragPosition\"\n (cdkDragEnded)=\"_handleDrag()\"\n [cdkDragDisabled]=\"_parent.disabled || _parent.readonly\"\n ></div>\n </div>\n</div>\n\n<ax-range-slider\n class=\"ax-color-box-gradient\"\n [min]=\"0\"\n [max]=\"100\"\n [mode]=\"'single'\"\n [values]=\"_gradient\"\n [disabled]=\"_parent.disabled\"\n [readonly]=\"_parent.readonly\"\n (ngModelChange)=\"_handleGradientChanged($event)\"\n>\n</ax-range-slider>\n<ax-range-slider\n class=\"ax-color-box-transparent\"\n [min]=\"0\"\n [max]=\"1\"\n [hasStep]=\"false\"\n [values]=\"_rgba.a\"\n [disabled]=\"_parent.disabled\"\n [readonly]=\"_parent.readonly\"\n (ngModelChange)=\"_handleAlphaChanged($event)\"\n>\n</ax-range-slider>\n", dependencies: [{ kind: "component", type: i2$1.AXRangeSliderComponent, selector: "ax-range-slider", inputs: ["disabled", "readonly", "orientation", "color", "values", "mode", "min", "max", "step", "snap", "tooltipMode", "snapMode", "hasStep", "hasSnap", "hasLable", "hasTooltip"], outputs: ["onStart", "valuesChange"] }, { kind: "directive", type: i3$1.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
602
602
|
}
|
|
603
603
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXColorPalettePickerComponent, decorators: [{
|
|
604
604
|
type: Component,
|
|
@@ -608,7 +608,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
|
|
|
608
608
|
useExisting: AXColorPalettePickerComponent,
|
|
609
609
|
},
|
|
610
610
|
AXUnsubscriber,
|
|
611
|
-
], template: "<div class=\"ax-color-box-overlay-trans\">\n <div class=\"ax-color-box-overlay\" [style.background-color]=\"_bgColor\">\n <div class=\"ax-color-box-overlay-g1\"></div>\n <div class=\"ax-color-box-overlay-g2\" (click)=\"_handleSurfaceClick($event)\"></div>\n <div\n class=\"ax-color-box-pointer\"\n cdkDrag\n cdkDragBoundary=\".ax-color-box-overlay\"\n [cdkDragFreeDragPosition]=\"dragPosition\"\n (cdkDragEnded)=\"_handleDrag()\"\n [cdkDragDisabled]=\"_parent.disabled || _parent.readonly\"\n ></div>\n </div>\n</div>\n\n<ax-range-slider\n class=\"ax-color-box-gradient\"\n [min]=\"0\"\n [max]=\"100\"\n [mode]=\"'single'\"\n [
|
|
611
|
+
], template: "<div class=\"ax-color-box-overlay-trans\">\n <div class=\"ax-color-box-overlay\" [style.background-color]=\"_bgColor\">\n <div class=\"ax-color-box-overlay-g1\"></div>\n <div class=\"ax-color-box-overlay-g2\" (click)=\"_handleSurfaceClick($event)\"></div>\n <div\n class=\"ax-color-box-pointer\"\n cdkDrag\n cdkDragBoundary=\".ax-color-box-overlay\"\n [cdkDragFreeDragPosition]=\"dragPosition\"\n (cdkDragEnded)=\"_handleDrag()\"\n [cdkDragDisabled]=\"_parent.disabled || _parent.readonly\"\n ></div>\n </div>\n</div>\n\n<ax-range-slider\n class=\"ax-color-box-gradient\"\n [min]=\"0\"\n [max]=\"100\"\n [mode]=\"'single'\"\n [values]=\"_gradient\"\n [disabled]=\"_parent.disabled\"\n [readonly]=\"_parent.readonly\"\n (ngModelChange)=\"_handleGradientChanged($event)\"\n>\n</ax-range-slider>\n<ax-range-slider\n class=\"ax-color-box-transparent\"\n [min]=\"0\"\n [max]=\"1\"\n [hasStep]=\"false\"\n [values]=\"_rgba.a\"\n [disabled]=\"_parent.disabled\"\n [readonly]=\"_parent.readonly\"\n (ngModelChange)=\"_handleAlphaChanged($event)\"\n>\n</ax-range-slider>\n" }]
|
|
612
612
|
}], ctorParameters: () => [{ type: AXColorPaletteParentComponent, decorators: [{
|
|
613
613
|
type: Inject,
|
|
614
614
|
args: [AXColorPaletteParentComponent]
|
|
@@ -827,7 +827,7 @@ class AXColorPalleteComponent extends MXValueComponent {
|
|
|
827
827
|
provide: AXColorPaletteParentComponent,
|
|
828
828
|
useExisting: AXColorPalleteComponent,
|
|
829
829
|
},
|
|
830
|
-
], queries: [{ propertyName: "_children", predicate: AXColorPaletteChildComponent }], usesInheritance: true, ngImport: i0, template: "<ng-content select='ax-header'></ng-content>\n\n@if(_children?.length){\n<ng-container [ngTemplateOutlet]=\"custom\"></ng-container>\n} @else{\n<ng-container [ngTemplateOutlet]=\"default\"></ng-container>\n\n}\n<ng-template #custom>\n <ng-content select='ax-color-palette-preview'></ng-content>\n <ng-content select='ax-color-palette-picker'></ng-content>\n <ng-content select='ax-color-palette-swatches'></ng-content>\n <ng-content select='ax-color-palette-favorite'></ng-content>\n <ng-content select='ax-color-palette-input'></ng-content>\n</ng-template>\n<ng-template #default>\n <ax-color-palette-preview></ax-color-palette-preview>\n <ax-color-palette-picker></ax-color-palette-picker>\n <ax-color-palette-swatches></ax-color-palette-swatches>\n <ax-color-palette-input></ax-color-palette-input>\n</ng-template>\n<ng-content select='ax-footer'></ng-content>", styles: ["ax-color-palette{display:flex;width:100%;flex-direction:column;border-radius:var(--ax-rounded-border-default);border-color:rgba(var(--ax-color-border-default));background-color:rgba(var(--ax-color-surface))}@media (min-width: 768px){ax-color-palette{width:20rem}}ax-color-palette.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-color-palette.ax-state-disabled ax-color-palette-swatches div:hover,ax-color-palette.ax-state-disabled ax-color-palette-swatches div.ax-state-selected,ax-color-palette.ax-state-disabled ax-color-palette-favorite div:hover,ax-color-palette.ax-state-disabled ax-color-palette-favorite div.ax-state-selected{cursor:not-allowed;opacity:.5}ax-color-palette ax-header,ax-color-palette ax-footer{display:flex;border-top-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.75rem}ax-color-palette ax-color-palette-preview{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=) left center;position:relative;height:6rem;width:100%;gap:.5rem;border-top-left-radius:var(--ax-rounded-border-default);border-top-right-radius:var(--ax-rounded-border-default)}ax-color-palette ax-color-palette-preview .palette-preview-overlay{position:absolute;inset-inline-start:0px;display:flex;height:100%;width:100%;align-items:center;justify-content:center;border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));text-transform:uppercase}ax-color-palette ax-color-palette-favorite{display:block;border-top-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-color-palette ax-color-palette-swatches,ax-color-palette ax-color-palette-favorite{display:grid;max-height:9rem;grid-template-columns:repeat(10,minmax(0,1fr));gap:.5rem;overflow-y:auto;overflow-x:hidden;padding:.5rem}ax-color-palette ax-color-palette-swatches div,ax-color-palette ax-color-palette-favorite div{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:9999px;border-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:before,ax-color-palette ax-color-palette-favorite div:after{content:\"\"}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-favorite div:before{float:left;padding-top:100%}ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:after{clear:both;display:block}ax-color-palette ax-color-palette-swatches div:hover,ax-color-palette ax-color-palette-swatches div.ax-state-selected,ax-color-palette ax-color-palette-favorite div:hover,ax-color-palette ax-color-palette-favorite div.ax-state-selected{box-shadow:0 0 0 1px rgba(var(--ax-color-white)),0 0 0 3px rgba(var(--ax-color-black))}ax-color-palette ax-color-palette-input{display:flex;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-input .palette-inputs{display:flex;flex:1 1 0%;gap:.5rem}ax-color-palette ax-color-palette-input .palette-inputs div{width:100%;text-align:center}ax-color-palette ax-color-palette-input .palette-inputs div label{margin-top:.75rem;font-size:.75rem;line-height:1rem}ax-color-palette ax-color-palette-input .palette-inputs .ax-editor-container .ax-input{padding:0}ax-color-palette ax-color-palette-picker{display:flex;flex-direction:column;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-picker .ax-color-box-overlay-trans{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}ax-color-palette ax-color-palette-picker .ax-color-box-overlay{position:relative;display:flex;height:8rem;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-pointer{position:relative;z-index:10;height:.75rem;width:.75rem;border-radius:9999px;border-width:1px;border-color:rgba(var(--ax-color-border-default));background-color:transparent}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1,ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{position:absolute;bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;height:100%;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1{background:linear-gradient(to right,#fff,#fff0);z-index:0}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{z-index:10;background:linear-gradient(to bottom,transparent 0%,#000 100%)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient .ax-range-slider-bar{background:linear-gradient(to right,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient .ax-range-slider-highlight{background:transparent!important}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient .ax-range-slider-handler{background:#fff!important;border:1px solid lightgray!important}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-transparent .ax-range-slider-bar{background-image:linear-gradient(to right,#f5f6fc00,#000),url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-transparent .ax-range-slider-highlight{background:transparent!important}
|
|
830
|
+
], queries: [{ propertyName: "_children", predicate: AXColorPaletteChildComponent }], usesInheritance: true, ngImport: i0, template: "<ng-content select='ax-header'></ng-content>\n\n@if(_children?.length){\n<ng-container [ngTemplateOutlet]=\"custom\"></ng-container>\n} @else{\n<ng-container [ngTemplateOutlet]=\"default\"></ng-container>\n\n}\n<ng-template #custom>\n <ng-content select='ax-color-palette-preview'></ng-content>\n <ng-content select='ax-color-palette-picker'></ng-content>\n <ng-content select='ax-color-palette-swatches'></ng-content>\n <ng-content select='ax-color-palette-favorite'></ng-content>\n <ng-content select='ax-color-palette-input'></ng-content>\n</ng-template>\n<ng-template #default>\n <ax-color-palette-preview></ax-color-palette-preview>\n <ax-color-palette-picker></ax-color-palette-picker>\n <ax-color-palette-swatches></ax-color-palette-swatches>\n <ax-color-palette-input></ax-color-palette-input>\n</ng-template>\n<ng-content select='ax-footer'></ng-content>", styles: ["ax-color-palette{display:flex;width:100%;flex-direction:column;border-radius:var(--ax-rounded-border-default);border-color:rgba(var(--ax-color-border-default));background-color:rgba(var(--ax-color-surface))}@media (min-width: 768px){ax-color-palette{width:20rem}}ax-color-palette.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-color-palette.ax-state-disabled ax-color-palette-swatches div:hover,ax-color-palette.ax-state-disabled ax-color-palette-swatches div.ax-state-selected,ax-color-palette.ax-state-disabled ax-color-palette-favorite div:hover,ax-color-palette.ax-state-disabled ax-color-palette-favorite div.ax-state-selected{cursor:not-allowed;opacity:.5}ax-color-palette ax-header,ax-color-palette ax-footer{display:flex;border-top-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.75rem}ax-color-palette ax-color-palette-preview{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=) left center;position:relative;height:6rem;width:100%;gap:.5rem;border-top-left-radius:var(--ax-rounded-border-default);border-top-right-radius:var(--ax-rounded-border-default)}ax-color-palette ax-color-palette-preview .palette-preview-overlay{position:absolute;inset-inline-start:0px;display:flex;height:100%;width:100%;align-items:center;justify-content:center;border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));text-transform:uppercase}ax-color-palette ax-color-palette-favorite{display:block;border-top-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-color-palette ax-color-palette-swatches,ax-color-palette ax-color-palette-favorite{display:grid;max-height:9rem;grid-template-columns:repeat(10,minmax(0,1fr));gap:.5rem;overflow-y:auto;overflow-x:hidden;padding:.5rem}ax-color-palette ax-color-palette-swatches div,ax-color-palette ax-color-palette-favorite div{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:9999px;border-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:before,ax-color-palette ax-color-palette-favorite div:after{content:\"\"}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-favorite div:before{float:left;padding-top:100%}ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:after{clear:both;display:block}ax-color-palette ax-color-palette-swatches div:hover,ax-color-palette ax-color-palette-swatches div.ax-state-selected,ax-color-palette ax-color-palette-favorite div:hover,ax-color-palette ax-color-palette-favorite div.ax-state-selected{box-shadow:0 0 0 1px rgba(var(--ax-color-white)),0 0 0 3px rgba(var(--ax-color-black))}ax-color-palette ax-color-palette-input{display:flex;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-input .palette-inputs{display:flex;flex:1 1 0%;gap:.5rem}ax-color-palette ax-color-palette-input .palette-inputs div{width:100%;text-align:center}ax-color-palette ax-color-palette-input .palette-inputs div label{margin-top:.75rem;font-size:.75rem;line-height:1rem}ax-color-palette ax-color-palette-input .palette-inputs .ax-editor-container .ax-input{padding:0}ax-color-palette ax-color-palette-picker{display:flex;flex-direction:column;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-picker .ax-color-box-overlay-trans{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}ax-color-palette ax-color-palette-picker .ax-color-box-overlay{position:relative;display:flex;height:8rem;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-pointer{position:relative;z-index:10;height:.75rem;width:.75rem;border-radius:9999px;border-width:1px;border-color:rgba(var(--ax-color-border-default));background-color:transparent}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1,ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{position:absolute;bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;height:100%;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1{background:linear-gradient(to right,#fff,#fff0);z-index:0}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{z-index:10;background:linear-gradient(to bottom,transparent 0%,#000 100%)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient .ax-range-slider-bar{background:linear-gradient(to right,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient .ax-range-slider-highlight{background:transparent!important}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient .ax-range-slider-handler{background:#fff!important;border:1px solid lightgray!important}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-transparent .ax-range-slider-bar{background-image:linear-gradient(to right,#f5f6fc00,#000),url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-transparent .ax-range-slider-highlight{background:transparent!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXColorPalettePreviewComponent, selector: "ax-color-palette-preview" }, { kind: "component", type: AXColorPaletteSwatchesComponent, selector: "ax-color-palette-swatches, ax-color-palette-favorite", inputs: ["colors"] }, { kind: "component", type: AXColorPaletteInputComponent, selector: "ax-color-palette-input" }, { kind: "component", type: AXColorPalettePickerComponent, selector: "ax-color-palette-picker" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
831
831
|
}
|
|
832
832
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXColorPalleteComponent, decorators: [{
|
|
833
833
|
type: Component,
|
|
@@ -842,7 +842,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
|
|
|
842
842
|
provide: AXColorPaletteParentComponent,
|
|
843
843
|
useExisting: AXColorPalleteComponent,
|
|
844
844
|
},
|
|
845
|
-
], template: "<ng-content select='ax-header'></ng-content>\n\n@if(_children?.length){\n<ng-container [ngTemplateOutlet]=\"custom\"></ng-container>\n} @else{\n<ng-container [ngTemplateOutlet]=\"default\"></ng-container>\n\n}\n<ng-template #custom>\n <ng-content select='ax-color-palette-preview'></ng-content>\n <ng-content select='ax-color-palette-picker'></ng-content>\n <ng-content select='ax-color-palette-swatches'></ng-content>\n <ng-content select='ax-color-palette-favorite'></ng-content>\n <ng-content select='ax-color-palette-input'></ng-content>\n</ng-template>\n<ng-template #default>\n <ax-color-palette-preview></ax-color-palette-preview>\n <ax-color-palette-picker></ax-color-palette-picker>\n <ax-color-palette-swatches></ax-color-palette-swatches>\n <ax-color-palette-input></ax-color-palette-input>\n</ng-template>\n<ng-content select='ax-footer'></ng-content>", styles: ["ax-color-palette{display:flex;width:100%;flex-direction:column;border-radius:var(--ax-rounded-border-default);border-color:rgba(var(--ax-color-border-default));background-color:rgba(var(--ax-color-surface))}@media (min-width: 768px){ax-color-palette{width:20rem}}ax-color-palette.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-color-palette.ax-state-disabled ax-color-palette-swatches div:hover,ax-color-palette.ax-state-disabled ax-color-palette-swatches div.ax-state-selected,ax-color-palette.ax-state-disabled ax-color-palette-favorite div:hover,ax-color-palette.ax-state-disabled ax-color-palette-favorite div.ax-state-selected{cursor:not-allowed;opacity:.5}ax-color-palette ax-header,ax-color-palette ax-footer{display:flex;border-top-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.75rem}ax-color-palette ax-color-palette-preview{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=) left center;position:relative;height:6rem;width:100%;gap:.5rem;border-top-left-radius:var(--ax-rounded-border-default);border-top-right-radius:var(--ax-rounded-border-default)}ax-color-palette ax-color-palette-preview .palette-preview-overlay{position:absolute;inset-inline-start:0px;display:flex;height:100%;width:100%;align-items:center;justify-content:center;border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));text-transform:uppercase}ax-color-palette ax-color-palette-favorite{display:block;border-top-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-color-palette ax-color-palette-swatches,ax-color-palette ax-color-palette-favorite{display:grid;max-height:9rem;grid-template-columns:repeat(10,minmax(0,1fr));gap:.5rem;overflow-y:auto;overflow-x:hidden;padding:.5rem}ax-color-palette ax-color-palette-swatches div,ax-color-palette ax-color-palette-favorite div{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:9999px;border-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:before,ax-color-palette ax-color-palette-favorite div:after{content:\"\"}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-favorite div:before{float:left;padding-top:100%}ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:after{clear:both;display:block}ax-color-palette ax-color-palette-swatches div:hover,ax-color-palette ax-color-palette-swatches div.ax-state-selected,ax-color-palette ax-color-palette-favorite div:hover,ax-color-palette ax-color-palette-favorite div.ax-state-selected{box-shadow:0 0 0 1px rgba(var(--ax-color-white)),0 0 0 3px rgba(var(--ax-color-black))}ax-color-palette ax-color-palette-input{display:flex;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-input .palette-inputs{display:flex;flex:1 1 0%;gap:.5rem}ax-color-palette ax-color-palette-input .palette-inputs div{width:100%;text-align:center}ax-color-palette ax-color-palette-input .palette-inputs div label{margin-top:.75rem;font-size:.75rem;line-height:1rem}ax-color-palette ax-color-palette-input .palette-inputs .ax-editor-container .ax-input{padding:0}ax-color-palette ax-color-palette-picker{display:flex;flex-direction:column;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-picker .ax-color-box-overlay-trans{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}ax-color-palette ax-color-palette-picker .ax-color-box-overlay{position:relative;display:flex;height:8rem;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-pointer{position:relative;z-index:10;height:.75rem;width:.75rem;border-radius:9999px;border-width:1px;border-color:rgba(var(--ax-color-border-default));background-color:transparent}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1,ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{position:absolute;bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;height:100%;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1{background:linear-gradient(to right,#fff,#fff0);z-index:0}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{z-index:10;background:linear-gradient(to bottom,transparent 0%,#000 100%)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient .ax-range-slider-bar{background:linear-gradient(to right,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient .ax-range-slider-highlight{background:transparent!important}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient .ax-range-slider-handler{background:#fff!important;border:1px solid lightgray!important}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-transparent .ax-range-slider-bar{background-image:linear-gradient(to right,#f5f6fc00,#000),url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-transparent .ax-range-slider-highlight{background:transparent!important}
|
|
845
|
+
], template: "<ng-content select='ax-header'></ng-content>\n\n@if(_children?.length){\n<ng-container [ngTemplateOutlet]=\"custom\"></ng-container>\n} @else{\n<ng-container [ngTemplateOutlet]=\"default\"></ng-container>\n\n}\n<ng-template #custom>\n <ng-content select='ax-color-palette-preview'></ng-content>\n <ng-content select='ax-color-palette-picker'></ng-content>\n <ng-content select='ax-color-palette-swatches'></ng-content>\n <ng-content select='ax-color-palette-favorite'></ng-content>\n <ng-content select='ax-color-palette-input'></ng-content>\n</ng-template>\n<ng-template #default>\n <ax-color-palette-preview></ax-color-palette-preview>\n <ax-color-palette-picker></ax-color-palette-picker>\n <ax-color-palette-swatches></ax-color-palette-swatches>\n <ax-color-palette-input></ax-color-palette-input>\n</ng-template>\n<ng-content select='ax-footer'></ng-content>", styles: ["ax-color-palette{display:flex;width:100%;flex-direction:column;border-radius:var(--ax-rounded-border-default);border-color:rgba(var(--ax-color-border-default));background-color:rgba(var(--ax-color-surface))}@media (min-width: 768px){ax-color-palette{width:20rem}}ax-color-palette.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-color-palette.ax-state-disabled ax-color-palette-swatches div:hover,ax-color-palette.ax-state-disabled ax-color-palette-swatches div.ax-state-selected,ax-color-palette.ax-state-disabled ax-color-palette-favorite div:hover,ax-color-palette.ax-state-disabled ax-color-palette-favorite div.ax-state-selected{cursor:not-allowed;opacity:.5}ax-color-palette ax-header,ax-color-palette ax-footer{display:flex;border-top-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.75rem}ax-color-palette ax-color-palette-preview{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=) left center;position:relative;height:6rem;width:100%;gap:.5rem;border-top-left-radius:var(--ax-rounded-border-default);border-top-right-radius:var(--ax-rounded-border-default)}ax-color-palette ax-color-palette-preview .palette-preview-overlay{position:absolute;inset-inline-start:0px;display:flex;height:100%;width:100%;align-items:center;justify-content:center;border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));text-transform:uppercase}ax-color-palette ax-color-palette-favorite{display:block;border-top-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-color-palette ax-color-palette-swatches,ax-color-palette ax-color-palette-favorite{display:grid;max-height:9rem;grid-template-columns:repeat(10,minmax(0,1fr));gap:.5rem;overflow-y:auto;overflow-x:hidden;padding:.5rem}ax-color-palette ax-color-palette-swatches div,ax-color-palette ax-color-palette-favorite div{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:9999px;border-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:before,ax-color-palette ax-color-palette-favorite div:after{content:\"\"}ax-color-palette ax-color-palette-swatches div:before,ax-color-palette ax-color-palette-favorite div:before{float:left;padding-top:100%}ax-color-palette ax-color-palette-swatches div:after,ax-color-palette ax-color-palette-favorite div:after{clear:both;display:block}ax-color-palette ax-color-palette-swatches div:hover,ax-color-palette ax-color-palette-swatches div.ax-state-selected,ax-color-palette ax-color-palette-favorite div:hover,ax-color-palette ax-color-palette-favorite div.ax-state-selected{box-shadow:0 0 0 1px rgba(var(--ax-color-white)),0 0 0 3px rgba(var(--ax-color-black))}ax-color-palette ax-color-palette-input{display:flex;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-input .palette-inputs{display:flex;flex:1 1 0%;gap:.5rem}ax-color-palette ax-color-palette-input .palette-inputs div{width:100%;text-align:center}ax-color-palette ax-color-palette-input .palette-inputs div label{margin-top:.75rem;font-size:.75rem;line-height:1rem}ax-color-palette ax-color-palette-input .palette-inputs .ax-editor-container .ax-input{padding:0}ax-color-palette ax-color-palette-picker{display:flex;flex-direction:column;gap:.5rem;padding:.5rem}ax-color-palette ax-color-palette-picker .ax-color-box-overlay-trans{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}ax-color-palette ax-color-palette-picker .ax-color-box-overlay{position:relative;display:flex;height:8rem;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-pointer{position:relative;z-index:10;height:.75rem;width:.75rem;border-radius:9999px;border-width:1px;border-color:rgba(var(--ax-color-border-default));background-color:transparent}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1,ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{position:absolute;bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;height:100%;width:100%}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g1{background:linear-gradient(to right,#fff,#fff0);z-index:0}ax-color-palette ax-color-palette-picker .ax-color-box-overlay .ax-color-box-overlay-g2{z-index:10;background:linear-gradient(to bottom,transparent 0%,#000 100%)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient .ax-range-slider-bar{background:linear-gradient(to right,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient .ax-range-slider-highlight{background:transparent!important}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-gradient .ax-range-slider-handler{background:#fff!important;border:1px solid lightgray!important}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-transparent .ax-range-slider-bar{background-image:linear-gradient(to right,#f5f6fc00,#000),url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=)}ax-color-palette ax-color-palette-picker ax-range-slider.ax-color-box-transparent .ax-range-slider-highlight{background:transparent!important}\n"] }]
|
|
846
846
|
}], propDecorators: { _children: [{
|
|
847
847
|
type: ContentChildren,
|
|
848
848
|
args: [AXColorPaletteChildComponent]
|