@masterteam/components 0.0.9 → 0.0.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/button-group/index.d.ts +8 -0
- package/checkbox-field/index.d.ts +5 -2
- package/color-picker-field/index.d.ts +30 -0
- package/date-field/index.d.ts +2 -0
- package/editor-field/index.d.ts +2 -0
- package/fesm2022/masterteam-components-avatar-text.mjs +3 -3
- package/fesm2022/masterteam-components-avatar.mjs +3 -3
- package/fesm2022/masterteam-components-button-group.mjs +20 -0
- package/fesm2022/masterteam-components-button-group.mjs.map +1 -0
- package/fesm2022/masterteam-components-button.mjs +3 -3
- package/fesm2022/masterteam-components-card.mjs +6 -4
- package/fesm2022/masterteam-components-card.mjs.map +1 -1
- package/fesm2022/masterteam-components-checkbox-field.mjs +12 -8
- package/fesm2022/masterteam-components-checkbox-field.mjs.map +1 -1
- package/fesm2022/masterteam-components-chip.mjs +3 -3
- package/fesm2022/masterteam-components-color-picker-field.mjs +76 -0
- package/fesm2022/masterteam-components-color-picker-field.mjs.map +1 -0
- package/fesm2022/masterteam-components-date-field.mjs +9 -6
- package/fesm2022/masterteam-components-date-field.mjs.map +1 -1
- package/fesm2022/masterteam-components-editor-field.mjs +8 -6
- package/fesm2022/masterteam-components-editor-field.mjs.map +1 -1
- package/fesm2022/masterteam-components-field-validation.mjs +78 -113
- package/fesm2022/masterteam-components-field-validation.mjs.map +1 -1
- package/fesm2022/masterteam-components-icon-field.mjs +9 -6
- package/fesm2022/masterteam-components-icon-field.mjs.map +1 -1
- package/fesm2022/masterteam-components-list.mjs +3 -3
- package/fesm2022/masterteam-components-multi-select-field.mjs +9 -6
- package/fesm2022/masterteam-components-multi-select-field.mjs.map +1 -1
- package/fesm2022/masterteam-components-number-field.mjs +9 -6
- package/fesm2022/masterteam-components-number-field.mjs.map +1 -1
- package/fesm2022/masterteam-components-select-field.mjs +9 -7
- package/fesm2022/masterteam-components-select-field.mjs.map +1 -1
- package/fesm2022/masterteam-components-slider-field.mjs +9 -6
- package/fesm2022/masterteam-components-slider-field.mjs.map +1 -1
- package/fesm2022/masterteam-components-text-field.mjs +8 -6
- package/fesm2022/masterteam-components-text-field.mjs.map +1 -1
- package/fesm2022/masterteam-components-textarea-field.mjs +9 -6
- package/fesm2022/masterteam-components-textarea-field.mjs.map +1 -1
- package/fesm2022/masterteam-components-toggle-field.mjs +80 -0
- package/fesm2022/masterteam-components-toggle-field.mjs.map +1 -0
- package/fesm2022/masterteam-components.mjs +23 -1
- package/fesm2022/masterteam-components.mjs.map +1 -1
- package/field-validation/index.d.ts +3 -3
- package/icon-field/index.d.ts +3 -1
- package/index.d.ts +19 -4
- package/multi-select-field/index.d.ts +2 -0
- package/number-field/index.d.ts +2 -0
- package/package.json +42 -30
- package/select-field/index.d.ts +2 -0
- package/slider-field/index.d.ts +2 -0
- package/text-field/index.d.ts +2 -0
- package/textarea-field/index.d.ts +2 -0
- package/toggle-field/index.d.ts +33 -0
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
|
|
3
|
+
declare class ButtonGroup {
|
|
4
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ButtonGroup, never>;
|
|
5
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ButtonGroup, "mt-buttonGroup, mt-buttongroup, mt-button-group", never, {}, {}, never, ["*"], true, never>;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
export { ButtonGroup };
|
|
@@ -1,16 +1,19 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
2
|
import { ControlValueAccessor, NgControl, Validators } from '@angular/forms';
|
|
3
3
|
import { Checkbox, CheckboxChangeEvent } from 'primeng/checkbox';
|
|
4
|
+
import { isInvalid } from '@masterteam/components';
|
|
4
5
|
|
|
5
6
|
declare class CheckboxField implements ControlValueAccessor {
|
|
6
7
|
checkbox: Checkbox;
|
|
7
8
|
label: _angular_core.InputSignal<string | undefined>;
|
|
9
|
+
labelPosition: _angular_core.InputSignal<"top" | "start" | "end" | "bottom">;
|
|
8
10
|
placeholder: _angular_core.InputSignal<string | undefined>;
|
|
9
|
-
class: _angular_core.InputSignal<string>;
|
|
10
11
|
readonly: _angular_core.InputSignal<boolean>;
|
|
11
12
|
pInputs: _angular_core.InputSignal<Partial<Checkbox> | undefined>;
|
|
12
13
|
onChange: _angular_core.OutputEmitterRef<CheckboxChangeEvent>;
|
|
13
14
|
ngControl: NgControl;
|
|
15
|
+
isInvalid: typeof isInvalid;
|
|
16
|
+
isVertical: _angular_core.Signal<boolean>;
|
|
14
17
|
requiredValidator: typeof Validators.required;
|
|
15
18
|
value: _angular_core.WritableSignal<boolean | null>;
|
|
16
19
|
disabled: _angular_core.WritableSignal<boolean>;
|
|
@@ -24,7 +27,7 @@ declare class CheckboxField implements ControlValueAccessor {
|
|
|
24
27
|
registerOnTouched(fn: any): void;
|
|
25
28
|
setDisabledState(disabled: boolean): void;
|
|
26
29
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<CheckboxField, never>;
|
|
27
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<CheckboxField, "mt-checkbox-field", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "
|
|
30
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<CheckboxField, "mt-checkbox-field", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "labelPosition": { "alias": "labelPosition"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "pInputs": { "alias": "pInputs"; "required": false; "isSignal": true; }; }, { "onChange": "onChange"; }, never, never, true, never>;
|
|
28
31
|
}
|
|
29
32
|
|
|
30
33
|
export { CheckboxField };
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import * as _angular_core from '@angular/core';
|
|
2
|
+
import { ControlValueAccessor, NgControl, Validators } from '@angular/forms';
|
|
3
|
+
import { ColorPicker, ColorPickerChangeEvent } from 'primeng/colorpicker';
|
|
4
|
+
|
|
5
|
+
declare class ColorPickerField implements ControlValueAccessor {
|
|
6
|
+
colorPicker: ColorPicker;
|
|
7
|
+
label: _angular_core.InputSignal<string | undefined>;
|
|
8
|
+
placeholder: _angular_core.InputSignal<string | undefined>;
|
|
9
|
+
class: _angular_core.InputSignal<string>;
|
|
10
|
+
readonly: _angular_core.InputSignal<boolean>;
|
|
11
|
+
pInputs: _angular_core.InputSignal<Partial<ColorPicker> | undefined>;
|
|
12
|
+
onChange: _angular_core.OutputEmitterRef<ColorPickerChangeEvent>;
|
|
13
|
+
ngControl: NgControl;
|
|
14
|
+
requiredValidator: typeof Validators.required;
|
|
15
|
+
value: _angular_core.WritableSignal<string | null>;
|
|
16
|
+
disabled: _angular_core.WritableSignal<boolean>;
|
|
17
|
+
onTouched: () => void;
|
|
18
|
+
onModelChange: (value: string | null) => void;
|
|
19
|
+
constructor();
|
|
20
|
+
applyInputsToColorPicker(): void;
|
|
21
|
+
onValueChange(value: string | null): void;
|
|
22
|
+
writeValue(value: string | null): void;
|
|
23
|
+
registerOnChange(fn: any): void;
|
|
24
|
+
registerOnTouched(fn: any): void;
|
|
25
|
+
setDisabledState(disabled: boolean): void;
|
|
26
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ColorPickerField, never>;
|
|
27
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ColorPickerField, "mt-color-picker-field", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "pInputs": { "alias": "pInputs"; "required": false; "isSignal": true; }; }, { "onChange": "onChange"; }, never, never, true, never>;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
export { ColorPickerField };
|
package/date-field/index.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ import * as _angular_core from '@angular/core';
|
|
|
2
2
|
import { OnInit, OnChanges, SimpleChanges } from '@angular/core';
|
|
3
3
|
import { ControlValueAccessor, Validators, NgControl } from '@angular/forms';
|
|
4
4
|
import { DatePicker } from 'primeng/datepicker';
|
|
5
|
+
import { isInvalid } from '@masterteam/components';
|
|
5
6
|
|
|
6
7
|
declare class DateField implements ControlValueAccessor, OnInit, OnChanges {
|
|
7
8
|
calendar: DatePicker;
|
|
@@ -21,6 +22,7 @@ declare class DateField implements ControlValueAccessor, OnInit, OnChanges {
|
|
|
21
22
|
onTouched: () => void;
|
|
22
23
|
onModelChange: (value: string) => void;
|
|
23
24
|
ngControl: NgControl;
|
|
25
|
+
isInvalid: typeof isInvalid;
|
|
24
26
|
constructor();
|
|
25
27
|
applyInputsToCalendar(): void;
|
|
26
28
|
ngOnInit(): void;
|
package/editor-field/index.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
2
|
import { ControlValueAccessor, Validators, NgControl } from '@angular/forms';
|
|
3
|
+
import { isInvalid } from '@masterteam/components';
|
|
3
4
|
|
|
4
5
|
declare class EditorField implements ControlValueAccessor {
|
|
5
6
|
readonly label: _angular_core.InputSignal<string | undefined>;
|
|
@@ -14,6 +15,7 @@ declare class EditorField implements ControlValueAccessor {
|
|
|
14
15
|
onTouched: () => void;
|
|
15
16
|
onChange: (value: any) => void;
|
|
16
17
|
ngControl: NgControl | null;
|
|
18
|
+
isInvalid: typeof isInvalid;
|
|
17
19
|
constructor();
|
|
18
20
|
onModelChange(value: string): void;
|
|
19
21
|
onFocus(): void;
|
|
@@ -30,10 +30,10 @@ class AvatarText {
|
|
|
30
30
|
};
|
|
31
31
|
textSizeClass = computed(() => this.sizeMap[this.size() ?? 'normal'].text, ...(ngDevMode ? [{ debugName: "textSizeClass" }] : []));
|
|
32
32
|
gapClass = computed(() => this.sizeMap[this.size() ?? 'normal'].gap, ...(ngDevMode ? [{ debugName: "gapClass" }] : []));
|
|
33
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.
|
|
34
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.
|
|
33
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AvatarText, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
34
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: AvatarText, isStandalone: true, selector: "mt-avatar-text", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, avatarLabel: { classPropertyName: "avatarLabel", publicName: "avatarLabel", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, badge: { classPropertyName: "badge", publicName: "badge", isSignal: true, isRequired: false, transformFunction: null }, badgeSize: { classPropertyName: "badgeSize", publicName: "badgeSize", isSignal: true, isRequired: false, transformFunction: null }, badgeSeverity: { classPropertyName: "badgeSeverity", publicName: "badgeSeverity", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onImageError: "onImageError" }, ngImport: i0, template: "<div [class]=\"'flex items-center ' + gapClass()\">\n <mt-avatar\n [size]=\"size()\"\n [shape]=\"shape()\"\n [label]=\"avatarLabel()\"\n [image]=\"image()\"\n [icon]=\"icon()\"\n [badge]=\"badge()\"\n [badgeSize]=\"badgeSize()\"\n [badgeSeverity]=\"badgeSeverity()\"\n (onImageError)=\"onImageError.emit($event)\"\n >\n </mt-avatar>\n @if (title()) {\n <div [class]=\"textSizeClass()\">\n <div class=\"font-semibold\">\n {{ title() }}\n </div>\n @if (subTitle()) {\n <div class=\"text-muted-color\" [class.font-semibold]=\"!title()\">\n {{ subTitle() }}\n </div>\n }\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: Avatar, selector: "mt-avatar", inputs: ["label", "icon", "image", "size", "shape", "badge", "badgeSize", "badgeSeverity"], outputs: ["onImageError"] }] });
|
|
35
35
|
}
|
|
36
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.
|
|
36
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AvatarText, decorators: [{
|
|
37
37
|
type: Component,
|
|
38
38
|
args: [{ selector: 'mt-avatar-text', standalone: true, imports: [Avatar], template: "<div [class]=\"'flex items-center ' + gapClass()\">\n <mt-avatar\n [size]=\"size()\"\n [shape]=\"shape()\"\n [label]=\"avatarLabel()\"\n [image]=\"image()\"\n [icon]=\"icon()\"\n [badge]=\"badge()\"\n [badgeSize]=\"badgeSize()\"\n [badgeSeverity]=\"badgeSeverity()\"\n (onImageError)=\"onImageError.emit($event)\"\n >\n </mt-avatar>\n @if (title()) {\n <div [class]=\"textSizeClass()\">\n <div class=\"font-semibold\">\n {{ title() }}\n </div>\n @if (subTitle()) {\n <div class=\"text-muted-color\" [class.font-semibold]=\"!title()\">\n {{ subTitle() }}\n </div>\n }\n </div>\n }\n</div>\n" }]
|
|
39
39
|
}] });
|
|
@@ -26,10 +26,10 @@ class Avatar {
|
|
|
26
26
|
return this.badgeSize();
|
|
27
27
|
return this.badgeSizeMap[this.size() ?? 'normal'];
|
|
28
28
|
}, ...(ngDevMode ? [{ debugName: "internalBadgeSize" }] : []));
|
|
29
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.
|
|
30
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.
|
|
29
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: Avatar, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
30
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: Avatar, isStandalone: true, selector: "mt-avatar", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, badge: { classPropertyName: "badge", publicName: "badge", isSignal: true, isRequired: false, transformFunction: null }, badgeSize: { classPropertyName: "badgeSize", publicName: "badgeSize", isSignal: true, isRequired: false, transformFunction: null }, badgeSeverity: { classPropertyName: "badgeSeverity", publicName: "badgeSeverity", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onImageError: "onImageError" }, host: { classAttribute: "grid gap-1" }, ngImport: i0, template: "@if (!badge()) {\n <p-avatar\n [size]=\"size()\"\n [shape]=\"shape()\"\n [label]=\"label()\"\n [image]=\"image()\"\n (onImageError)=\"onImageError.emit($event)\"\n >\n @if (icon()) {\n <mt-icon [icon]=\"icon()\" />\n }\n </p-avatar>\n} @else {\n <p-overlaybadge\n [badgeSize]=\"internalBadgeSize()\"\n [value]=\"badge()\"\n [severity]=\"badgeSeverity()\"\n >\n <p-avatar\n [size]=\"size()\"\n [shape]=\"shape()\"\n [label]=\"label()\"\n [image]=\"image()\"\n (onImageError)=\"onImageError($event)\"\n >\n @if (icon()) {\n <mt-icon [icon]=\"icon()\" />\n }\n </p-avatar>\n </p-overlaybadge>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i1.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "ngmodule", type: OverlayBadgeModule }, { kind: "component", type: i2.OverlayBadge, selector: "p-overlayBadge, p-overlay-badge, p-overlaybadge", inputs: ["styleClass", "style", "badgeSize", "severity", "value", "badgeDisabled", "size"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }] });
|
|
31
31
|
}
|
|
32
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.
|
|
32
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: Avatar, decorators: [{
|
|
33
33
|
type: Component,
|
|
34
34
|
args: [{ selector: 'mt-avatar', standalone: true, imports: [AvatarModule, OverlayBadgeModule, Icon], host: {
|
|
35
35
|
class: 'grid gap-1',
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
|
+
import * as i1 from 'primeng/buttongroup';
|
|
4
|
+
import { ButtonGroupModule } from 'primeng/buttongroup';
|
|
5
|
+
|
|
6
|
+
class ButtonGroup {
|
|
7
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ButtonGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: ButtonGroup, isStandalone: true, selector: "mt-buttonGroup, mt-buttongroup, mt-button-group", ngImport: i0, template: "<p-buttongroup>\n <ng-content></ng-content>\n</p-buttongroup>\n", styles: [":host ::ng-deep .p-buttongroup mt-button:first-of-type:not(:only-of-type) p-button .p-button{border-start-end-radius:0;border-end-end-radius:0}:host ::ng-deep .p-buttongroup mt-button:last-of-type:not(:only-of-type) p-button .p-button{border-start-start-radius:0;border-end-start-radius:0}:host ::ng-deep .p-buttongroup mt-button:not(:first-of-type):not(:last-of-type) p-button .p-button{border-radius:0}:host ::ng-deep .p-buttongroup mt-button:not(:last-child) p-button .p-button,:host ::ng-deep .p-buttongroup mt-button:not(:last-child) p-button .p-button:hover{border-right:0 none}\n"], dependencies: [{ kind: "ngmodule", type: ButtonGroupModule }, { kind: "component", type: i1.ButtonGroup, selector: "p-buttonGroup, p-buttongroup, p-button-group" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9
|
+
}
|
|
10
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ButtonGroup, decorators: [{
|
|
11
|
+
type: Component,
|
|
12
|
+
args: [{ selector: 'mt-buttonGroup, mt-buttongroup, mt-button-group', standalone: true, imports: [ButtonGroupModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-buttongroup>\n <ng-content></ng-content>\n</p-buttongroup>\n", styles: [":host ::ng-deep .p-buttongroup mt-button:first-of-type:not(:only-of-type) p-button .p-button{border-start-end-radius:0;border-end-end-radius:0}:host ::ng-deep .p-buttongroup mt-button:last-of-type:not(:only-of-type) p-button .p-button{border-start-start-radius:0;border-end-start-radius:0}:host ::ng-deep .p-buttongroup mt-button:not(:first-of-type):not(:last-of-type) p-button .p-button{border-radius:0}:host ::ng-deep .p-buttongroup mt-button:not(:last-child) p-button .p-button,:host ::ng-deep .p-buttongroup mt-button:not(:last-child) p-button .p-button:hover{border-right:0 none}\n"] }]
|
|
13
|
+
}] });
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* Generated bundle index. Do not edit.
|
|
17
|
+
*/
|
|
18
|
+
|
|
19
|
+
export { ButtonGroup };
|
|
20
|
+
//# sourceMappingURL=masterteam-components-button-group.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"masterteam-components-button-group.mjs","sources":["../../../../packages/masterteam/components/button-group/button-group.ts","../../../../packages/masterteam/components/button-group/button-group.html","../../../../packages/masterteam/components/button-group/masterteam-components-button-group.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component } from '@angular/core';\nimport { ButtonGroupModule } from 'primeng/buttongroup';\n\n@Component({\n selector: 'mt-buttonGroup, mt-buttongroup, mt-button-group',\n standalone: true,\n imports: [ButtonGroupModule],\n templateUrl: './button-group.html',\n styleUrls: ['./button-group.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ButtonGroup {}\n","<p-buttongroup>\n <ng-content></ng-content>\n</p-buttongroup>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;MAWa,WAAW,CAAA;uGAAX,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAX,WAAW,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iDAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECXxB,kEAGA,EAAA,MAAA,EAAA,CAAA,4kBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDGY,iBAAiB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,WAAA,EAAA,QAAA,EAAA,8CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FAKhB,WAAW,EAAA,UAAA,EAAA,CAAA;kBARvB,SAAS;+BACE,iDAAiD,EAAA,UAAA,EAC/C,IAAI,EAAA,OAAA,EACP,CAAC,iBAAiB,CAAC,EAAA,eAAA,EAGX,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,kEAAA,EAAA,MAAA,EAAA,CAAA,4kBAAA,CAAA,EAAA;;;AETjD;;AAEG;;;;"}
|
|
@@ -50,10 +50,10 @@ class Button {
|
|
|
50
50
|
onClick = output();
|
|
51
51
|
onFocus = output();
|
|
52
52
|
onBlur = output();
|
|
53
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.
|
|
54
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.
|
|
53
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: Button, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
54
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: Button, isStandalone: true, selector: "mt-button", inputs: { iconText: { classPropertyName: "iconText", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, severity: { classPropertyName: "severity", publicName: "severity", isSignal: true, isRequired: false, transformFunction: null }, badge: { classPropertyName: "badge", publicName: "badge", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, badgeSeverity: { classPropertyName: "badgeSeverity", publicName: "badgeSeverity", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, iconPos: { classPropertyName: "iconPos", publicName: "iconPos", isSignal: true, isRequired: false, transformFunction: null }, autofocus: { classPropertyName: "autofocus", publicName: "autofocus", isSignal: true, isRequired: false, transformFunction: null }, fluid: { classPropertyName: "fluid", publicName: "fluid", isSignal: true, isRequired: false, transformFunction: null }, raised: { classPropertyName: "raised", publicName: "raised", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, plain: { classPropertyName: "plain", publicName: "plain", isSignal: true, isRequired: false, transformFunction: null }, outlined: { classPropertyName: "outlined", publicName: "outlined", isSignal: true, isRequired: false, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, pInputs: { classPropertyName: "pInputs", publicName: "pInputs", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClick: "onClick", onFocus: "onFocus", onBlur: "onBlur" }, host: { classAttribute: "grid gap-1" }, ngImport: i0, template: "<p-button\n [fluid]=\"fluid()\"\n [severity]=\"severity()\"\n [size]=\"size()\"\n [label]=\"label()\"\n [iconPos]=\"iconPos()\"\n [type]=\"type()\"\n [badge]=\"badge()\"\n [badgeSeverity]=\"badgeSeverity()\"\n [variant]=\"variant()\"\n [loading]=\"loading()\"\n [disabled]=\"disabled()\"\n [link]=\"link()\"\n [plain]=\"plain()\"\n [text]=\"text()\"\n [raised]=\"raised()\"\n [outlined]=\"outlined()\"\n [rounded]=\"rounded()\"\n [autofocus]=\"autofocus()\"\n (onClick)=\"onClick.emit($event)\"\n (onFocus)=\"onFocus.emit($event)\"\n (onBlur)=\"onBlur.emit($event)\"\n>\n @if (iconText()) {\n <ng-template #icon>\n <mt-icon\n [class.order-1]=\"iconPos() === 'end' || iconPos() === 'bottom'\"\n [icon]=\"iconText()\"\n />\n </ng-template>\n }\n\n <!-- <ng-template #loadingicon> -->\n <!-- <mt-icon -->\n <!-- class=\"p-icon-spin\" -->\n <!-- [class.order-1]=\"iconPos() === 'end' || iconPos() === 'bottom'\" -->\n <!-- icon=\"general.loading-01\" -->\n <!-- /> -->\n <!-- </ng-template> -->\n</p-button>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }] });
|
|
55
55
|
}
|
|
56
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.
|
|
56
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: Button, decorators: [{
|
|
57
57
|
type: Component,
|
|
58
58
|
args: [{ selector: 'mt-button', standalone: true, imports: [ButtonModule, Icon], host: {
|
|
59
59
|
class: 'grid gap-1',
|
|
@@ -11,12 +11,14 @@ class Card {
|
|
|
11
11
|
}]));
|
|
12
12
|
// Content child to get the headless template
|
|
13
13
|
headless = contentChild('headless', ...(ngDevMode ? [{ debugName: "headless" }] : []));
|
|
14
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.
|
|
15
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.
|
|
14
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: Card, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
15
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: Card, isStandalone: true, selector: "mt-card", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, paddingless: { classPropertyName: "paddingless", publicName: "paddingless", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block bg-white rounded-2xl border-1 border-surface-300" }, queries: [{ propertyName: "headless", first: true, predicate: ["headless"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"size-full flex flex-col\">\n @if (headless()) {\n <!-- Custom headless template -->\n <ng-container [ngTemplateOutlet]=\"headless()\"></ng-container>\n } @else {\n @if (title()) {\n <!-- Default header with dynamic title -->\n <div\n class=\"flex items-center justify-between px-4 py-5 border-b border-surface-300\"\n >\n <h3 class=\"text-xl font-semibold\">{{ title() }}</h3>\n </div>\n }\n\n <div class=\"flex-1\" [class.p-4]=\"!paddingless()\">\n <ng-content></ng-content>\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
16
16
|
}
|
|
17
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.
|
|
17
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: Card, decorators: [{
|
|
18
18
|
type: Component,
|
|
19
|
-
args: [{ selector: 'mt-card', standalone: true, imports: [CommonModule],
|
|
19
|
+
args: [{ selector: 'mt-card', standalone: true, imports: [CommonModule], host: {
|
|
20
|
+
class: 'block bg-white rounded-2xl border-1 border-surface-300',
|
|
21
|
+
}, template: "<div class=\"size-full flex flex-col\">\n @if (headless()) {\n <!-- Custom headless template -->\n <ng-container [ngTemplateOutlet]=\"headless()\"></ng-container>\n } @else {\n @if (title()) {\n <!-- Default header with dynamic title -->\n <div\n class=\"flex items-center justify-between px-4 py-5 border-b border-surface-300\"\n >\n <h3 class=\"text-xl font-semibold\">{{ title() }}</h3>\n </div>\n }\n\n <div class=\"flex-1\" [class.p-4]=\"!paddingless()\">\n <ng-content></ng-content>\n </div>\n }\n</div>\n" }]
|
|
20
22
|
}] });
|
|
21
23
|
|
|
22
24
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"masterteam-components-card.mjs","sources":["../../../../packages/masterteam/components/card/card.ts","../../../../packages/masterteam/components/card/card.html","../../../../packages/masterteam/components/card/masterteam-components-card.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport {\n Component,\n input,\n contentChild,\n TemplateRef,\n booleanAttribute,\n} from '@angular/core';\n\n@Component({\n selector: 'mt-card',\n standalone: true,\n templateUrl: './card.html',\n styleUrl: './card.scss',\n imports: [CommonModule],\n})\nexport class Card {\n readonly class = input<string>('');\n readonly title = input<string>('');\n readonly paddingless = input<boolean, unknown>(false, {\n transform: booleanAttribute,\n });\n // Content child to get the headless template\n headless = contentChild<TemplateRef<any>>('headless');\n}\n","<div class=\"
|
|
1
|
+
{"version":3,"file":"masterteam-components-card.mjs","sources":["../../../../packages/masterteam/components/card/card.ts","../../../../packages/masterteam/components/card/card.html","../../../../packages/masterteam/components/card/masterteam-components-card.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport {\n Component,\n input,\n contentChild,\n TemplateRef,\n booleanAttribute,\n} from '@angular/core';\n\n@Component({\n selector: 'mt-card',\n standalone: true,\n templateUrl: './card.html',\n styleUrl: './card.scss',\n imports: [CommonModule],\n host: {\n class: 'block bg-white rounded-2xl border-1 border-surface-300',\n },\n})\nexport class Card {\n readonly class = input<string>('');\n readonly title = input<string>('');\n readonly paddingless = input<boolean, unknown>(false, {\n transform: booleanAttribute,\n });\n // Content child to get the headless template\n headless = contentChild<TemplateRef<any>>('headless');\n}\n","<div class=\"size-full flex flex-col\">\n @if (headless()) {\n <!-- Custom headless template -->\n <ng-container [ngTemplateOutlet]=\"headless()\"></ng-container>\n } @else {\n @if (title()) {\n <!-- Default header with dynamic title -->\n <div\n class=\"flex items-center justify-between px-4 py-5 border-b border-surface-300\"\n >\n <h3 class=\"text-xl font-semibold\">{{ title() }}</h3>\n </div>\n }\n\n <div class=\"flex-1\" [class.p-4]=\"!paddingless()\">\n <ng-content></ng-content>\n </div>\n }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;MAmBa,IAAI,CAAA;AACN,IAAA,KAAK,GAAG,KAAK,CAAS,EAAE,iDAAC;AACzB,IAAA,KAAK,GAAG,KAAK,CAAS,EAAE,iDAAC;IACzB,WAAW,GAAG,KAAK,CAAmB,KAAK,+CAClD,SAAS,EAAE,gBAAgB,EAAA,CAAA,GAAA,CADyB;AACpD,YAAA,SAAS,EAAE,gBAAgB;AAC5B,SAAA,CAAA,CAAA,CAAC;;AAEF,IAAA,QAAQ,GAAG,YAAY,CAAmB,UAAU,oDAAC;uGAP1C,IAAI,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAJ,IAAI,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,wDAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,UAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnBjB,6jBAmBA,EAAA,MAAA,EAAA,CAAA,EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDLY,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAKX,IAAI,EAAA,UAAA,EAAA,CAAA;kBAVhB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,SAAS,cACP,IAAI,EAAA,OAAA,EAGP,CAAC,YAAY,CAAC,EAAA,IAAA,EACjB;AACJ,wBAAA,KAAK,EAAE,wDAAwD;AAChE,qBAAA,EAAA,QAAA,EAAA,6jBAAA,EAAA;;;AEjBH;;AAEG;;;;"}
|
|
@@ -1,19 +1,23 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { input, output, inject, signal, effect, ViewChild, Component } from '@angular/core';
|
|
2
|
+
import { input, output, inject, computed, signal, effect, ViewChild, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/forms';
|
|
4
4
|
import { NgControl, Validators, FormsModule } from '@angular/forms';
|
|
5
5
|
import * as i2 from 'primeng/checkbox';
|
|
6
6
|
import { CheckboxModule } from 'primeng/checkbox';
|
|
7
|
+
import { FieldValidation } from '@masterteam/components/field-validation';
|
|
8
|
+
import { isInvalid } from '@masterteam/components';
|
|
7
9
|
|
|
8
10
|
class CheckboxField {
|
|
9
11
|
checkbox;
|
|
10
12
|
label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : []));
|
|
13
|
+
labelPosition = input('end', ...(ngDevMode ? [{ debugName: "labelPosition" }] : []));
|
|
11
14
|
placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : []));
|
|
12
|
-
class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
|
|
13
15
|
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
|
|
14
16
|
pInputs = input(...(ngDevMode ? [undefined, { debugName: "pInputs" }] : []));
|
|
15
17
|
onChange = output();
|
|
16
18
|
ngControl = inject(NgControl, { self: true });
|
|
19
|
+
isInvalid = isInvalid;
|
|
20
|
+
isVertical = computed(() => this.labelPosition() === 'top' || this.labelPosition() === 'bottom', ...(ngDevMode ? [{ debugName: "isVertical" }] : []));
|
|
17
21
|
requiredValidator = Validators.required;
|
|
18
22
|
value = signal(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
|
|
19
23
|
disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
|
|
@@ -55,14 +59,14 @@ class CheckboxField {
|
|
|
55
59
|
setDisabledState(disabled) {
|
|
56
60
|
this.disabled.set(disabled);
|
|
57
61
|
}
|
|
58
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.
|
|
59
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.
|
|
62
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: CheckboxField, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
63
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: CheckboxField, isStandalone: true, selector: "mt-checkbox-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, pInputs: { classPropertyName: "pInputs", publicName: "pInputs", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChange: "onChange" }, host: { classAttribute: "grid gap-1" }, viewQueries: [{ propertyName: "checkbox", first: true, predicate: ["checkbox"], descendants: true, static: true }], ngImport: i0, template: "<div\n class=\"flex gap-1\"\n [class.items-center]=\"!isVertical()\"\n [class.gap-2]=\"!isVertical()\"\n [class.flex-col]=\"isVertical()\"\n [class.flex-col-reverse]=\"labelPosition() === 'top'\"\n [class.flex-row-reverse]=\"labelPosition() === 'start'\"\n [class.justify-end]=\"labelPosition() === 'start'\"\n>\n <p-checkbox\n #checkbox\n [ngModel]=\"value()\"\n (ngModelChange)=\"onValueChange($event)\"\n (onChange)=\"onChange.emit($event)\"\n (onBlur)=\"onTouched()\"\n [disabled]=\"disabled() || readonly()\"\n [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\n [binary]=\"true\"\n [invalid]=\"isInvalid(ngControl?.control)\"\n class=\"leading-none\"\n ></p-checkbox>\n @if (label()) {\n <label\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n [for]=\"ngControl?.name || label()\"\n >{{ label() }}</label\n >\n }\n</div>\n\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i2.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "component", type: FieldValidation, selector: "mt-field-validation", inputs: ["control", "touched"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
60
64
|
}
|
|
61
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.
|
|
65
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: CheckboxField, decorators: [{
|
|
62
66
|
type: Component,
|
|
63
|
-
args: [{ selector: 'mt-checkbox-field', standalone: true, imports: [FormsModule, CheckboxModule], host: {
|
|
64
|
-
|
|
65
|
-
}, template: "<
|
|
67
|
+
args: [{ selector: 'mt-checkbox-field', standalone: true, imports: [FormsModule, CheckboxModule, FieldValidation], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
68
|
+
class: 'grid gap-1',
|
|
69
|
+
}, template: "<div\n class=\"flex gap-1\"\n [class.items-center]=\"!isVertical()\"\n [class.gap-2]=\"!isVertical()\"\n [class.flex-col]=\"isVertical()\"\n [class.flex-col-reverse]=\"labelPosition() === 'top'\"\n [class.flex-row-reverse]=\"labelPosition() === 'start'\"\n [class.justify-end]=\"labelPosition() === 'start'\"\n>\n <p-checkbox\n #checkbox\n [ngModel]=\"value()\"\n (ngModelChange)=\"onValueChange($event)\"\n (onChange)=\"onChange.emit($event)\"\n (onBlur)=\"onTouched()\"\n [disabled]=\"disabled() || readonly()\"\n [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\n [binary]=\"true\"\n [invalid]=\"isInvalid(ngControl?.control)\"\n class=\"leading-none\"\n ></p-checkbox>\n @if (label()) {\n <label\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n [for]=\"ngControl?.name || label()\"\n >{{ label() }}</label\n >\n }\n</div>\n\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\n" }]
|
|
66
70
|
}], ctorParameters: () => [], propDecorators: { checkbox: [{
|
|
67
71
|
type: ViewChild,
|
|
68
72
|
args: ['checkbox', { static: true }]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"masterteam-components-checkbox-field.mjs","sources":["../../../../packages/masterteam/components/checkbox-field/checkbox-field.ts","../../../../packages/masterteam/components/checkbox-field/checkbox-field.html","../../../../packages/masterteam/components/checkbox-field/masterteam-components-checkbox-field.ts"],"sourcesContent":["import {\n Component,\n ViewChild,\n signal,\n input,\n effect,\n output,\n inject,\n} from '@angular/core';\nimport {\n ControlValueAccessor,\n FormsModule,\n NgControl,\n Validators,\n} from '@angular/forms';\nimport {\n CheckboxModule,\n Checkbox,\n CheckboxChangeEvent,\n} from 'primeng/checkbox';\n\n@Component({\n selector: 'mt-checkbox-field',\n standalone: true,\n imports: [FormsModule, CheckboxModule],\n templateUrl: './checkbox-field.html',\n styleUrls: ['./checkbox-field.scss'],\n host: {\n
|
|
1
|
+
{"version":3,"file":"masterteam-components-checkbox-field.mjs","sources":["../../../../packages/masterteam/components/checkbox-field/checkbox-field.ts","../../../../packages/masterteam/components/checkbox-field/checkbox-field.html","../../../../packages/masterteam/components/checkbox-field/masterteam-components-checkbox-field.ts"],"sourcesContent":["import {\n Component,\n ViewChild,\n signal,\n input,\n effect,\n output,\n inject,\n ChangeDetectionStrategy,\n computed,\n} from '@angular/core';\nimport {\n ControlValueAccessor,\n FormsModule,\n NgControl,\n Validators,\n} from '@angular/forms';\nimport {\n CheckboxModule,\n Checkbox,\n CheckboxChangeEvent,\n} from 'primeng/checkbox';\nimport { FieldValidation } from '@masterteam/components/field-validation';\nimport { isInvalid } from '@masterteam/components';\n\n@Component({\n selector: 'mt-checkbox-field',\n standalone: true,\n imports: [FormsModule, CheckboxModule, FieldValidation],\n templateUrl: './checkbox-field.html',\n styleUrls: ['./checkbox-field.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'grid gap-1',\n },\n})\nexport class CheckboxField implements ControlValueAccessor {\n @ViewChild('checkbox', { static: true })\n checkbox: Checkbox;\n\n label = input<string>();\n labelPosition = input<'top' | 'start' | 'end' | 'bottom'>('end');\n placeholder = input<string>();\n readonly = input<boolean>(false);\n pInputs = input<Partial<Checkbox>>();\n\n onChange = output<CheckboxChangeEvent>();\n\n public ngControl = inject(NgControl, { self: true });\n\n isInvalid = isInvalid;\n\n isVertical = computed(\n () => this.labelPosition() === 'top' || this.labelPosition() === 'bottom',\n );\n\n requiredValidator = Validators.required;\n value = signal<boolean | null>(null);\n disabled = signal<boolean>(false);\n\n onTouched: () => void = () => {};\n onModelChange: (value: boolean | null) => void = () => {};\n\n constructor() {\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n\n // Effect to apply pInputs reactively when the pInputs signal changes\n effect(() => {\n const currentPInputs = this.pInputs();\n // Ensure checkbox ViewChild is initialized and pInputs has a value\n // @ViewChild with static: true makes 'checkbox' available during construction/ngOnInit\n if (this.checkbox && currentPInputs) {\n this.applyInputsToCheckbox();\n }\n });\n }\n\n applyInputsToCheckbox() {\n const currentPInputs = this.pInputs();\n if (currentPInputs) {\n Object.assign(this.checkbox, currentPInputs);\n }\n }\n\n onValueChange(value: boolean | null) {\n this.onModelChange(value);\n this.value.set(value);\n }\n\n writeValue(value: boolean | null) {\n this.value.set(value);\n }\n\n registerOnChange(fn: any) {\n this.onModelChange = fn;\n }\n\n registerOnTouched(fn: any) {\n this.onTouched = fn;\n }\n\n setDisabledState(disabled: boolean) {\n this.disabled.set(disabled);\n }\n}\n","<div\n class=\"flex gap-1\"\n [class.items-center]=\"!isVertical()\"\n [class.gap-2]=\"!isVertical()\"\n [class.flex-col]=\"isVertical()\"\n [class.flex-col-reverse]=\"labelPosition() === 'top'\"\n [class.flex-row-reverse]=\"labelPosition() === 'start'\"\n [class.justify-end]=\"labelPosition() === 'start'\"\n>\n <p-checkbox\n #checkbox\n [ngModel]=\"value()\"\n (ngModelChange)=\"onValueChange($event)\"\n (onChange)=\"onChange.emit($event)\"\n (onBlur)=\"onTouched()\"\n [disabled]=\"disabled() || readonly()\"\n [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\n [binary]=\"true\"\n [invalid]=\"isInvalid(ngControl?.control)\"\n class=\"leading-none\"\n ></p-checkbox>\n @if (label()) {\n <label\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n [for]=\"ngControl?.name || label()\"\n >{{ label() }}</label\n >\n }\n</div>\n\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -21,10 +21,10 @@ class Chip {
|
|
|
21
21
|
onChipImageError(event) {
|
|
22
22
|
this.onImageError.emit(event);
|
|
23
23
|
}
|
|
24
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.
|
|
25
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.
|
|
24
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: Chip, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
25
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: Chip, isStandalone: true, selector: "mt-chip", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, removable: { classPropertyName: "removable", publicName: "removable", isSignal: true, isRequired: false, transformFunction: null }, removeIcon: { classPropertyName: "removeIcon", publicName: "removeIcon", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onRemove: "onRemove", onImageError: "onImageError" }, ngImport: i0, template: "<p-chip\n [label]=\"label()\"\n [image]=\"image()\"\n [removable]=\"removable()\"\n [removeIcon]=\"removeIcon()\"\n [class]=\"styleClass()\"\n (onRemove)=\"onChipRemove($event)\"\n (onImageError)=\"onChipImageError($event)\"\n>\n <ng-template #removeicon>\n <mt-icon class=\"align-super!\" [icon]=\"removeIcon()\" />\n </ng-template>\n @if (icon()) {\n <mt-icon #iconTemplate class=\"align-super!\" [icon]=\"icon()\" />\n }\n</p-chip>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ChipModule }, { kind: "component", type: i1.Chip, selector: "p-chip", inputs: ["label", "icon", "image", "alt", "styleClass", "removable", "removeIcon", "chipProps"], outputs: ["onRemove", "onImageError"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }] });
|
|
26
26
|
}
|
|
27
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.
|
|
27
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: Chip, decorators: [{
|
|
28
28
|
type: Component,
|
|
29
29
|
args: [{ selector: 'mt-chip', standalone: true, imports: [ChipModule, Icon], template: "<p-chip\n [label]=\"label()\"\n [image]=\"image()\"\n [removable]=\"removable()\"\n [removeIcon]=\"removeIcon()\"\n [class]=\"styleClass()\"\n (onRemove)=\"onChipRemove($event)\"\n (onImageError)=\"onChipImageError($event)\"\n>\n <ng-template #removeicon>\n <mt-icon class=\"align-super!\" [icon]=\"removeIcon()\" />\n </ng-template>\n @if (icon()) {\n <mt-icon #iconTemplate class=\"align-super!\" [icon]=\"icon()\" />\n }\n</p-chip>\n" }]
|
|
30
30
|
}] });
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { input, output, inject, signal, effect, ViewChild, Component } from '@angular/core';
|
|
3
|
+
import * as i1 from '@angular/forms';
|
|
4
|
+
import { NgControl, Validators, FormsModule } from '@angular/forms';
|
|
5
|
+
import * as i2 from 'primeng/colorpicker';
|
|
6
|
+
import { ColorPickerModule } from 'primeng/colorpicker';
|
|
7
|
+
|
|
8
|
+
class ColorPickerField {
|
|
9
|
+
colorPicker;
|
|
10
|
+
label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : []));
|
|
11
|
+
placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : []));
|
|
12
|
+
class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
|
|
13
|
+
readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : []));
|
|
14
|
+
pInputs = input(...(ngDevMode ? [undefined, { debugName: "pInputs" }] : []));
|
|
15
|
+
onChange = output();
|
|
16
|
+
ngControl = inject(NgControl, { self: true });
|
|
17
|
+
requiredValidator = Validators.required;
|
|
18
|
+
value = signal(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
|
|
19
|
+
disabled = signal(false, ...(ngDevMode ? [{ debugName: "disabled" }] : []));
|
|
20
|
+
onTouched = () => { };
|
|
21
|
+
onModelChange = () => { };
|
|
22
|
+
constructor() {
|
|
23
|
+
if (this.ngControl) {
|
|
24
|
+
this.ngControl.valueAccessor = this;
|
|
25
|
+
}
|
|
26
|
+
// Effect to apply pInputs reactively when the pInputs signal changes
|
|
27
|
+
effect(() => {
|
|
28
|
+
const currentPInputs = this.pInputs();
|
|
29
|
+
// Ensure colorPicker ViewChild is initialized and pInputs has a value
|
|
30
|
+
// @ViewChild with static: true makes 'colorPicker' available during construction/ngOnInit
|
|
31
|
+
if (this.colorPicker && currentPInputs) {
|
|
32
|
+
this.applyInputsToColorPicker();
|
|
33
|
+
}
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
applyInputsToColorPicker() {
|
|
37
|
+
const currentPInputs = this.pInputs();
|
|
38
|
+
if (currentPInputs) {
|
|
39
|
+
Object.assign(this.colorPicker, currentPInputs);
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
onValueChange(value) {
|
|
43
|
+
this.onModelChange(value);
|
|
44
|
+
this.value.set(value);
|
|
45
|
+
}
|
|
46
|
+
writeValue(value) {
|
|
47
|
+
this.value.set(value);
|
|
48
|
+
}
|
|
49
|
+
registerOnChange(fn) {
|
|
50
|
+
this.onModelChange = fn;
|
|
51
|
+
}
|
|
52
|
+
registerOnTouched(fn) {
|
|
53
|
+
this.onTouched = fn;
|
|
54
|
+
}
|
|
55
|
+
setDisabledState(disabled) {
|
|
56
|
+
this.disabled.set(disabled);
|
|
57
|
+
}
|
|
58
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ColorPickerField, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
59
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: ColorPickerField, isStandalone: true, selector: "mt-color-picker-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, pInputs: { classPropertyName: "pInputs", publicName: "pInputs", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChange: "onChange" }, host: { properties: { "class": "class()" } }, viewQueries: [{ propertyName: "colorPicker", first: true, predicate: ["colorPicker"], descendants: true, static: true }], ngImport: i0, template: "<p-colorpicker\n #colorPicker=\"\"\n [ngModel]=\"value()\"\n (ngModelChange)=\"onValueChange($event)\"\n (onChange)=\"onChange.emit($event)\"\n (onBlur)=\"onTouched()\"\n [disabled]=\"disabled() || readonly()\"\n [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\n [class.ng-invalid]=\"ngControl?.control?.invalid\"\n class=\"leading-none\"\n></p-colorpicker>\n@if (label()) {\n <label\n class=\"ms-2\"\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n [for]=\"ngControl?.name || label()\"\n >{{ label() }}</label\n >\n}\n", styles: [":host{display:flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ColorPickerModule }, { kind: "component", type: i2.ColorPicker, selector: "p-colorPicker, p-colorpicker, p-color-picker", inputs: ["styleClass", "inline", "format", "tabindex", "inputId", "autoZIndex", "showTransitionOptions", "hideTransitionOptions", "autofocus", "defaultColor", "appendTo"], outputs: ["onChange", "onShow", "onHide"] }] });
|
|
60
|
+
}
|
|
61
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ColorPickerField, decorators: [{
|
|
62
|
+
type: Component,
|
|
63
|
+
args: [{ selector: 'mt-color-picker-field', standalone: true, imports: [FormsModule, ColorPickerModule], host: {
|
|
64
|
+
'[class]': 'class()',
|
|
65
|
+
}, template: "<p-colorpicker\n #colorPicker=\"\"\n [ngModel]=\"value()\"\n (ngModelChange)=\"onValueChange($event)\"\n (onChange)=\"onChange.emit($event)\"\n (onBlur)=\"onTouched()\"\n [disabled]=\"disabled() || readonly()\"\n [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\n [class.ng-invalid]=\"ngControl?.control?.invalid\"\n class=\"leading-none\"\n></p-colorpicker>\n@if (label()) {\n <label\n class=\"ms-2\"\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n [for]=\"ngControl?.name || label()\"\n >{{ label() }}</label\n >\n}\n", styles: [":host{display:flex;align-items:center}\n"] }]
|
|
66
|
+
}], ctorParameters: () => [], propDecorators: { colorPicker: [{
|
|
67
|
+
type: ViewChild,
|
|
68
|
+
args: ['colorPicker', { static: true }]
|
|
69
|
+
}] } });
|
|
70
|
+
|
|
71
|
+
/**
|
|
72
|
+
* Generated bundle index. Do not edit.
|
|
73
|
+
*/
|
|
74
|
+
|
|
75
|
+
export { ColorPickerField };
|
|
76
|
+
//# sourceMappingURL=masterteam-components-color-picker-field.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"masterteam-components-color-picker-field.mjs","sources":["../../../../packages/masterteam/components/color-picker-field/color-picker-field.ts","../../../../packages/masterteam/components/color-picker-field/color-picker-field.html","../../../../packages/masterteam/components/color-picker-field/masterteam-components-color-picker-field.ts"],"sourcesContent":["import {\n Component,\n ViewChild,\n signal,\n input,\n effect,\n output,\n inject,\n} from '@angular/core';\nimport {\n ControlValueAccessor,\n FormsModule,\n NgControl,\n Validators,\n} from '@angular/forms';\nimport {\n ColorPickerModule,\n ColorPicker,\n ColorPickerChangeEvent,\n} from 'primeng/colorpicker';\n\n@Component({\n selector: 'mt-color-picker-field',\n standalone: true,\n imports: [FormsModule, ColorPickerModule],\n templateUrl: './color-picker-field.html',\n styleUrls: ['./color-picker-field.scss'],\n host: {\n '[class]': 'class()',\n },\n})\nexport class ColorPickerField implements ControlValueAccessor {\n @ViewChild('colorPicker', { static: true })\n colorPicker: ColorPicker;\n\n label = input<string>();\n placeholder = input<string>();\n class = input<string>('');\n readonly = input<boolean>(false);\n pInputs = input<Partial<ColorPicker>>();\n\n onChange = output<ColorPickerChangeEvent>();\n\n public ngControl = inject(NgControl, { self: true });\n\n requiredValidator = Validators.required;\n value = signal<string | null>(null);\n disabled = signal<boolean>(false);\n\n onTouched: () => void = () => {};\n onModelChange: (value: string | null) => void = () => {};\n\n constructor() {\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n\n // Effect to apply pInputs reactively when the pInputs signal changes\n effect(() => {\n const currentPInputs = this.pInputs();\n // Ensure colorPicker ViewChild is initialized and pInputs has a value\n // @ViewChild with static: true makes 'colorPicker' available during construction/ngOnInit\n if (this.colorPicker && currentPInputs) {\n this.applyInputsToColorPicker();\n }\n });\n }\n\n applyInputsToColorPicker() {\n const currentPInputs = this.pInputs();\n if (currentPInputs) {\n Object.assign(this.colorPicker, currentPInputs);\n }\n }\n\n onValueChange(value: string | null) {\n this.onModelChange(value);\n this.value.set(value);\n }\n\n writeValue(value: string | null) {\n this.value.set(value);\n }\n\n registerOnChange(fn: any) {\n this.onModelChange = fn;\n }\n\n registerOnTouched(fn: any) {\n this.onTouched = fn;\n }\n\n setDisabledState(disabled: boolean) {\n this.disabled.set(disabled);\n }\n}\n","<p-colorpicker\n #colorPicker=\"\"\n [ngModel]=\"value()\"\n (ngModelChange)=\"onValueChange($event)\"\n (onChange)=\"onChange.emit($event)\"\n (onBlur)=\"onTouched()\"\n [disabled]=\"disabled() || readonly()\"\n [inputId]=\"ngControl?.name ? ngControl?.name?.toString() : label()\"\n [class.ng-invalid]=\"ngControl?.control?.invalid\"\n class=\"leading-none\"\n></p-colorpicker>\n@if (label()) {\n <label\n class=\"ms-2\"\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\n [for]=\"ngControl?.name || label()\"\n >{{ label() }}</label\n >\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;MA+Ba,gBAAgB,CAAA;AAE3B,IAAA,WAAW;IAEX,KAAK,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,OAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;IACvB,WAAW,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,aAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;AAC7B,IAAA,KAAK,GAAG,KAAK,CAAS,EAAE,iDAAC;AACzB,IAAA,QAAQ,GAAG,KAAK,CAAU,KAAK,oDAAC;IAChC,OAAO,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,SAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAwB;IAEvC,QAAQ,GAAG,MAAM,EAA0B;IAEpC,SAAS,GAAG,MAAM,CAAC,SAAS,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;AAEpD,IAAA,iBAAiB,GAAG,UAAU,CAAC,QAAQ;AACvC,IAAA,KAAK,GAAG,MAAM,CAAgB,IAAI,iDAAC;AACnC,IAAA,QAAQ,GAAG,MAAM,CAAU,KAAK,oDAAC;AAEjC,IAAA,SAAS,GAAe,MAAK,EAAE,CAAC;AAChC,IAAA,aAAa,GAAmC,MAAK,EAAE,CAAC;AAExD,IAAA,WAAA,GAAA;AACE,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAClB,YAAA,IAAI,CAAC,SAAS,CAAC,aAAa,GAAG,IAAI;QACrC;;QAGA,MAAM,CAAC,MAAK;AACV,YAAA,MAAM,cAAc,GAAG,IAAI,CAAC,OAAO,EAAE;;;AAGrC,YAAA,IAAI,IAAI,CAAC,WAAW,IAAI,cAAc,EAAE;gBACtC,IAAI,CAAC,wBAAwB,EAAE;YACjC;AACF,QAAA,CAAC,CAAC;IACJ;IAEA,wBAAwB,GAAA;AACtB,QAAA,MAAM,cAAc,GAAG,IAAI,CAAC,OAAO,EAAE;QACrC,IAAI,cAAc,EAAE;YAClB,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,EAAE,cAAc,CAAC;QACjD;IACF;AAEA,IAAA,aAAa,CAAC,KAAoB,EAAA;AAChC,QAAA,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC;AACzB,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC;IACvB;AAEA,IAAA,UAAU,CAAC,KAAoB,EAAA;AAC7B,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC;IACvB;AAEA,IAAA,gBAAgB,CAAC,EAAO,EAAA;AACtB,QAAA,IAAI,CAAC,aAAa,GAAG,EAAE;IACzB;AAEA,IAAA,iBAAiB,CAAC,EAAO,EAAA;AACvB,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE;IACrB;AAEA,IAAA,gBAAgB,CAAC,QAAiB,EAAA;AAChC,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,CAAC;IAC7B;uGA/DW,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,aAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,aAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC/B7B,klBAmBA,EAAA,MAAA,EAAA,CAAA,0CAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDKY,WAAW,8VAAE,iBAAiB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,WAAA,EAAA,QAAA,EAAA,8CAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,QAAA,EAAA,QAAA,EAAA,UAAA,EAAA,SAAA,EAAA,YAAA,EAAA,uBAAA,EAAA,uBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,QAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAO7B,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAV5B,SAAS;+BACE,uBAAuB,EAAA,UAAA,EACrB,IAAI,EAAA,OAAA,EACP,CAAC,WAAW,EAAE,iBAAiB,CAAC,EAAA,IAAA,EAGnC;AACJ,wBAAA,SAAS,EAAE,SAAS;AACrB,qBAAA,EAAA,QAAA,EAAA,klBAAA,EAAA,MAAA,EAAA,CAAA,0CAAA,CAAA,EAAA;wDAID,WAAW,EAAA,CAAA;sBADV,SAAS;AAAC,gBAAA,IAAA,EAAA,CAAA,aAAa,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE;;;AEhC5C;;AAEG;;;;"}
|