@wizishop/angular-components 15.1.121 → 15.1.123
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/angular-components.scss +13 -0
- package/esm2020/lib/components/color-picker/color-picker.component.mjs +4 -6
- package/fesm2015/wizishop-angular-components.mjs +3 -5
- package/fesm2015/wizishop-angular-components.mjs.map +1 -1
- package/fesm2020/wizishop-angular-components.mjs +3 -5
- package/fesm2020/wizishop-angular-components.mjs.map +1 -1
- package/package.json +1 -1
- package/wizishop-angular-components-15.1.123.tgz +0 -0
- package/wizishop-angular-components-15.1.121.tgz +0 -0
package/angular-components.scss
CHANGED
|
@@ -959,6 +959,7 @@ wac-block {
|
|
|
959
959
|
height: 40px;
|
|
960
960
|
display: flex;
|
|
961
961
|
align-items: center;
|
|
962
|
+
justify-content: space-between;
|
|
962
963
|
gap: 10px;
|
|
963
964
|
padding: 8px;
|
|
964
965
|
border: 1px solid #dee2ed;
|
|
@@ -1001,6 +1002,8 @@ wac-block {
|
|
|
1001
1002
|
width: 100%;
|
|
1002
1003
|
max-width: 202px;
|
|
1003
1004
|
height: 4px;
|
|
1005
|
+
padding: 0;
|
|
1006
|
+
border: none;
|
|
1004
1007
|
background: transparent;
|
|
1005
1008
|
-webkit-appearance: none;
|
|
1006
1009
|
appearance: none;
|
|
@@ -1081,6 +1084,7 @@ wac-block {
|
|
|
1081
1084
|
width: 100%;
|
|
1082
1085
|
max-width: 45px;
|
|
1083
1086
|
height: 100%;
|
|
1087
|
+
padding: 0;
|
|
1084
1088
|
border: none;
|
|
1085
1089
|
font-size: 14px;
|
|
1086
1090
|
color: #1d2a3b;
|
|
@@ -3746,6 +3750,7 @@ wac-calendar {
|
|
|
3746
3750
|
}
|
|
3747
3751
|
|
|
3748
3752
|
.w-input {
|
|
3753
|
+
position: relative;
|
|
3749
3754
|
width: 210px;
|
|
3750
3755
|
height: 40px;
|
|
3751
3756
|
display: flex;
|
|
@@ -3761,6 +3766,14 @@ wac-calendar {
|
|
|
3761
3766
|
border: 1px solid #dee2ed;
|
|
3762
3767
|
border-radius: 3px;
|
|
3763
3768
|
}
|
|
3769
|
+
|
|
3770
|
+
.color-picker {
|
|
3771
|
+
left: 0 !important;
|
|
3772
|
+
|
|
3773
|
+
.arrow-bottom {
|
|
3774
|
+
left: 14px !important;
|
|
3775
|
+
}
|
|
3776
|
+
}
|
|
3764
3777
|
|
|
3765
3778
|
.cp-input {
|
|
3766
3779
|
width: 70%;
|
|
@@ -32,7 +32,6 @@ export class ColorPickerComponent {
|
|
|
32
32
|
this.colorChange.emit(this.value);
|
|
33
33
|
}
|
|
34
34
|
changeColor(color) {
|
|
35
|
-
// Remove any non-hexadecimal characters
|
|
36
35
|
color = color.replace(/[^a-fA-F0-9]/g, '');
|
|
37
36
|
// Add '#' if not present
|
|
38
37
|
if (!color.startsWith('#')) {
|
|
@@ -41,11 +40,10 @@ export class ColorPickerComponent {
|
|
|
41
40
|
// Validate and update color
|
|
42
41
|
if (this.isValidColor(color)) {
|
|
43
42
|
this.value = color;
|
|
44
|
-
this.onChange(this.value);
|
|
43
|
+
this.onChange(this.value);
|
|
45
44
|
this.colorChange.emit(this.value);
|
|
46
45
|
}
|
|
47
46
|
else {
|
|
48
|
-
// If invalid, reset to previous valid color
|
|
49
47
|
this.colorChange.emit(this.value);
|
|
50
48
|
}
|
|
51
49
|
}
|
|
@@ -62,7 +60,7 @@ ColorPickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
|
|
|
62
60
|
useExisting: forwardRef(() => ColorPickerComponent),
|
|
63
61
|
multi: true
|
|
64
62
|
}
|
|
65
|
-
], ngImport: i0, template: "<div class=\"w-color-picker\" [ngStyle]=\"{'gap': gap}\">\r\n\r\n <label class=\"cp-label\" for=\"colorPicker\" [ngStyle]=\"{'font-size': fontSize}\">{{ label }}</label>\r\n\r\n <div class=\"w-input\">\r\n\r\n <div\r\n class=\"color-preview\"\r\n [colorPicker]=\"value\"\r\n (click)=\"colorPickerInput.openDialog()\"\r\n [ngStyle]=\"{'background-color': value}\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n ></div>\r\n\r\n <input\r\n class=\"cp-input\"\r\n id=\"colorPicker\"\r\n #colorPickerInput=\"ngxColorPicker\"\r\n maxlength=\"7\"\r\n placeholder=\"#000000\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"changeColor($event)\"\r\n [colorPicker]=\"value\"\r\n (colorPickerChange)=\"changeColor($event)\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n (input)=\"setValue($event)\"\r\n />\r\n\r\n </div>\r\n\r\n</div>\r\n", styles: [".w-color-picker{display:flex;flex-direction:column}.w-color-picker .cp-label{font-weight:500}.w-color-picker .w-input{width:210px;height:40px;display:flex;align-items:center;gap:10px;padding:5px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .color-preview{width:30px;height:30px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .cp-input{width:70%;height:100%;border:none;font-size:14px;color:#1d2a3b;font-weight:400}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ColorPickerModule }, { kind: "directive", type: i3.ColorPickerDirective, selector: "[colorPicker]", inputs: ["colorPicker", "cpWidth", "cpHeight", "cpToggle", "cpDisabled", "cpIgnoredElements", "cpFallbackColor", "cpColorMode", "cpCmykEnabled", "cpOutputFormat", "cpAlphaChannel", "cpDisableInput", "cpDialogDisplay", "cpSaveClickOutside", "cpCloseClickOutside", "cpUseRootViewContainer", "cpPosition", "cpPositionOffset", "cpPositionRelativeToArrow", "cpOKButton", "cpOKButtonText", "cpOKButtonClass", "cpCancelButton", "cpCancelButtonText", "cpCancelButtonClass", "cpEyeDropper", "cpPresetLabel", "cpPresetColors", "cpPresetColorsClass", "cpMaxPresetColorsLength", "cpPresetEmptyMessage", "cpPresetEmptyMessageClass", "cpAddColorButton", "cpAddColorButtonText", "cpAddColorButtonClass", "cpRemoveColorButtonClass", "cpArrowPosition", "cpExtraTemplate"], outputs: ["cpInputChange", "cpToggleChange", "cpSliderChange", "cpSliderDragEnd", "cpSliderDragStart", "colorPickerOpen", "colorPickerClose", "colorPickerCancel", "colorPickerSelect", "colorPickerChange", "cpCmykColorChange", "cpPresetColorsChange"], exportAs: ["ngxColorPicker"] }] });
|
|
63
|
+
], ngImport: i0, template: "<div class=\"w-color-picker\" [ngStyle]=\"{'gap': gap}\">\r\n\r\n <label class=\"cp-label\" for=\"colorPicker\" [ngStyle]=\"{'font-size': fontSize}\">{{ label }}</label>\r\n\r\n <div class=\"w-input\">\r\n\r\n <div\r\n class=\"color-preview\"\r\n [colorPicker]=\"value\"\r\n (click)=\"colorPickerInput.openDialog()\"\r\n [ngStyle]=\"{'background-color': value}\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n ></div>\r\n\r\n <input\r\n class=\"cp-input\"\r\n id=\"colorPicker\"\r\n #colorPickerInput=\"ngxColorPicker\"\r\n maxlength=\"7\"\r\n placeholder=\"#000000\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"changeColor($event)\"\r\n [colorPicker]=\"value\"\r\n (colorPickerChange)=\"changeColor($event)\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n (input)=\"setValue($event)\"\r\n />\r\n\r\n </div>\r\n\r\n</div>\r\n", styles: [".w-color-picker{display:flex;flex-direction:column}.w-color-picker .cp-label{font-weight:500}.w-color-picker .w-input{position:relative;width:210px;height:40px;display:flex;align-items:center;gap:10px;padding:5px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .color-preview{width:30px;height:30px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .color-picker{left:0!important}.w-color-picker .w-input .color-picker .arrow-bottom{left:14px!important}.w-color-picker .w-input .cp-input{width:70%;height:100%;border:none;font-size:14px;color:#1d2a3b;font-weight:400}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ColorPickerModule }, { kind: "directive", type: i3.ColorPickerDirective, selector: "[colorPicker]", inputs: ["colorPicker", "cpWidth", "cpHeight", "cpToggle", "cpDisabled", "cpIgnoredElements", "cpFallbackColor", "cpColorMode", "cpCmykEnabled", "cpOutputFormat", "cpAlphaChannel", "cpDisableInput", "cpDialogDisplay", "cpSaveClickOutside", "cpCloseClickOutside", "cpUseRootViewContainer", "cpPosition", "cpPositionOffset", "cpPositionRelativeToArrow", "cpOKButton", "cpOKButtonText", "cpOKButtonClass", "cpCancelButton", "cpCancelButtonText", "cpCancelButtonClass", "cpEyeDropper", "cpPresetLabel", "cpPresetColors", "cpPresetColorsClass", "cpMaxPresetColorsLength", "cpPresetEmptyMessage", "cpPresetEmptyMessageClass", "cpAddColorButton", "cpAddColorButtonText", "cpAddColorButtonClass", "cpRemoveColorButtonClass", "cpArrowPosition", "cpExtraTemplate"], outputs: ["cpInputChange", "cpToggleChange", "cpSliderChange", "cpSliderDragEnd", "cpSliderDragStart", "colorPickerOpen", "colorPickerClose", "colorPickerCancel", "colorPickerSelect", "colorPickerChange", "cpCmykColorChange", "cpPresetColorsChange"], exportAs: ["ngxColorPicker"] }] });
|
|
66
64
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: ColorPickerComponent, decorators: [{
|
|
67
65
|
type: Component,
|
|
68
66
|
args: [{ selector: "wac-color-picker", standalone: true, imports: [
|
|
@@ -75,7 +73,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImpor
|
|
|
75
73
|
useExisting: forwardRef(() => ColorPickerComponent),
|
|
76
74
|
multi: true
|
|
77
75
|
}
|
|
78
|
-
], template: "<div class=\"w-color-picker\" [ngStyle]=\"{'gap': gap}\">\r\n\r\n <label class=\"cp-label\" for=\"colorPicker\" [ngStyle]=\"{'font-size': fontSize}\">{{ label }}</label>\r\n\r\n <div class=\"w-input\">\r\n\r\n <div\r\n class=\"color-preview\"\r\n [colorPicker]=\"value\"\r\n (click)=\"colorPickerInput.openDialog()\"\r\n [ngStyle]=\"{'background-color': value}\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n ></div>\r\n\r\n <input\r\n class=\"cp-input\"\r\n id=\"colorPicker\"\r\n #colorPickerInput=\"ngxColorPicker\"\r\n maxlength=\"7\"\r\n placeholder=\"#000000\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"changeColor($event)\"\r\n [colorPicker]=\"value\"\r\n (colorPickerChange)=\"changeColor($event)\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n (input)=\"setValue($event)\"\r\n />\r\n\r\n </div>\r\n\r\n</div>\r\n", styles: [".w-color-picker{display:flex;flex-direction:column}.w-color-picker .cp-label{font-weight:500}.w-color-picker .w-input{width:210px;height:40px;display:flex;align-items:center;gap:10px;padding:5px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .color-preview{width:30px;height:30px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .cp-input{width:70%;height:100%;border:none;font-size:14px;color:#1d2a3b;font-weight:400}\n"] }]
|
|
76
|
+
], template: "<div class=\"w-color-picker\" [ngStyle]=\"{'gap': gap}\">\r\n\r\n <label class=\"cp-label\" for=\"colorPicker\" [ngStyle]=\"{'font-size': fontSize}\">{{ label }}</label>\r\n\r\n <div class=\"w-input\">\r\n\r\n <div\r\n class=\"color-preview\"\r\n [colorPicker]=\"value\"\r\n (click)=\"colorPickerInput.openDialog()\"\r\n [ngStyle]=\"{'background-color': value}\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n ></div>\r\n\r\n <input\r\n class=\"cp-input\"\r\n id=\"colorPicker\"\r\n #colorPickerInput=\"ngxColorPicker\"\r\n maxlength=\"7\"\r\n placeholder=\"#000000\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"changeColor($event)\"\r\n [colorPicker]=\"value\"\r\n (colorPickerChange)=\"changeColor($event)\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n (input)=\"setValue($event)\"\r\n />\r\n\r\n </div>\r\n\r\n</div>\r\n", styles: [".w-color-picker{display:flex;flex-direction:column}.w-color-picker .cp-label{font-weight:500}.w-color-picker .w-input{position:relative;width:210px;height:40px;display:flex;align-items:center;gap:10px;padding:5px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .color-preview{width:30px;height:30px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .color-picker{left:0!important}.w-color-picker .w-input .color-picker .arrow-bottom{left:14px!important}.w-color-picker .w-input .cp-input{width:70%;height:100%;border:none;font-size:14px;color:#1d2a3b;font-weight:400}\n"] }]
|
|
79
77
|
}], ctorParameters: function () { return []; }, propDecorators: { label: [{
|
|
80
78
|
type: Input
|
|
81
79
|
}], value: [{
|
|
@@ -87,4 +85,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImpor
|
|
|
87
85
|
}], colorChange: [{
|
|
88
86
|
type: Output
|
|
89
87
|
}] } });
|
|
90
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
88
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3ItcGlja2VyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2FuZ3VsYXItY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvY29sb3ItcGlja2VyL2NvbG9yLXBpY2tlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLWNvbXBvbmVudHMvc3JjL2xpYi9jb21wb25lbnRzL2NvbG9yLXBpY2tlci9jb2xvci1waWNrZXIuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBQyxTQUFTLEVBQUUsWUFBWSxFQUFFLFVBQVUsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQ2pGLE9BQU8sRUFBdUIsV0FBVyxFQUFFLGlCQUFpQixFQUFDLE1BQU0sZ0JBQWdCLENBQUM7QUFDcEYsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sa0JBQWtCLENBQUM7Ozs7O0FBcUJyRCxNQUFNLE9BQU8sb0JBQW9CO0lBTy9CO1FBTFMsVUFBSyxHQUFXLEVBQUUsQ0FBQztRQUNuQixRQUFHLEdBQVcsTUFBTSxDQUFDO1FBQ3JCLGFBQVEsR0FBVyxNQUFNLENBQUM7UUFDekIsZ0JBQVcsR0FBRyxJQUFJLFlBQVksRUFBVSxDQUFDO1FBSW5ELGFBQVEsR0FBUSxHQUFHLEVBQUUsR0FBRSxDQUFDLENBQUM7UUFDekIsY0FBUyxHQUFRLEdBQUcsRUFBRSxHQUFFLENBQUMsQ0FBQztJQUhYLENBQUM7SUFLaEIsVUFBVSxDQUFDLEtBQWE7UUFDdEIsSUFBSSxLQUFLLEtBQUssU0FBUyxFQUFFO1lBQ3ZCLElBQUksQ0FBQyxLQUFLLEdBQUcsS0FBSyxDQUFDO1NBQ3BCO0lBQ0gsQ0FBQztJQUdELGdCQUFnQixDQUFDLEVBQU87UUFDdEIsSUFBSSxDQUFDLFFBQVEsR0FBRyxFQUFFLENBQUM7SUFDckIsQ0FBQztJQUVELGlCQUFpQixDQUFDLEVBQU87UUFDdkIsSUFBSSxDQUFDLFNBQVMsR0FBRyxFQUFFLENBQUM7SUFDdEIsQ0FBQztJQUVELFFBQVEsQ0FBQyxLQUFVO1FBQ2pCLElBQUksQ0FBQyxLQUFLLEdBQUcsS0FBSyxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUM7UUFDaEMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDMUIsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ3BDLENBQUM7SUFFRCxXQUFXLENBQUMsS0FBYTtRQUN2QixLQUFLLEdBQUcsS0FBSyxDQUFDLE9BQU8sQ0FBQyxlQUFlLEVBQUUsRUFBRSxDQUFDLENBQUM7UUFFM0MseUJBQXlCO1FBQ3pCLElBQUksQ0FBQyxLQUFLLENBQUMsVUFBVSxDQUFDLEdBQUcsQ0FBQyxFQUFFO1lBQzFCLEtBQUssR0FBRyxHQUFHLEdBQUcsS0FBSyxDQUFDO1NBQ3JCO1FBRUQsNEJBQTRCO1FBQzVCLElBQUksSUFBSSxDQUFDLFlBQVksQ0FBQyxLQUFLLENBQUMsRUFBRTtZQUM1QixJQUFJLENBQUMsS0FBSyxHQUFHLEtBQUssQ0FBQztZQUNuQixJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUMxQixJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7U0FDbkM7YUFBTTtZQUNMLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztTQUNuQztJQUNILENBQUM7SUFHRCxZQUFZLENBQUMsS0FBYTtRQUN4QixNQUFNLENBQUMsR0FBRyxJQUFJLE1BQU0sRUFBRSxDQUFDLEtBQUssQ0FBQztRQUM3QixDQUFDLENBQUMsS0FBSyxHQUFHLEtBQUssQ0FBQztRQUNoQixPQUFPLENBQUMsQ0FBQyxLQUFLLEtBQUssRUFBRSxDQUFDO0lBQ3hCLENBQUM7O2lIQXhEVSxvQkFBb0I7cUdBQXBCLG9CQUFvQixzTEFUcEI7UUFDVDtZQUNFLE9BQU8sRUFBRSxpQkFBaUI7WUFDMUIsV0FBVyxFQUFFLFVBQVUsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxvQkFBb0IsQ0FBQztZQUNuRCxLQUFLLEVBQUUsSUFBSTtTQUNaO0tBQ0YsMEJDckJILGc5QkFpQ0Esd3BCRHRCSSxZQUFZLG1IQUNaLFdBQVcsaXhCQUNYLGlCQUFpQjsyRkFXUixvQkFBb0I7a0JBbkJoQyxTQUFTOytCQUNFLGtCQUFrQixjQUdoQixJQUFJLFdBQ1A7d0JBQ1AsWUFBWTt3QkFDWixXQUFXO3dCQUNYLGlCQUFpQjtxQkFDbEIsYUFDVTt3QkFDVDs0QkFDRSxPQUFPLEVBQUUsaUJBQWlCOzRCQUMxQixXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxxQkFBcUIsQ0FBQzs0QkFDbkQsS0FBSyxFQUFFLElBQUk7eUJBQ1o7cUJBQ0Y7MEVBSVEsS0FBSztzQkFBYixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxHQUFHO3NCQUFYLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDSSxXQUFXO3NCQUFwQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2NvbW1vblwiO1xyXG5pbXBvcnQge0NvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBmb3J3YXJkUmVmLCBJbnB1dCwgT3V0cHV0fSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xyXG5pbXBvcnQge0NvbnRyb2xWYWx1ZUFjY2Vzc29yLCBGb3Jtc01vZHVsZSwgTkdfVkFMVUVfQUNDRVNTT1J9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuaW1wb3J0IHsgQ29sb3JQaWNrZXJNb2R1bGUgfSBmcm9tIFwibmd4LWNvbG9yLXBpY2tlclwiO1xyXG5cclxuQENvbXBvbmVudCAoe1xyXG4gIHNlbGVjdG9yOiBcIndhYy1jb2xvci1waWNrZXJcIixcclxuICB0ZW1wbGF0ZVVybDogXCIuL2NvbG9yLXBpY2tlci5jb21wb25lbnQuaHRtbFwiLFxyXG4gIHN0eWxlVXJsczogW1wiLi9jb2xvci1waWNrZXIuY29tcG9uZW50LnNjc3NcIl0sXHJcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcclxuICBpbXBvcnRzOiBbXHJcbiAgICBDb21tb25Nb2R1bGUsXHJcbiAgICBGb3Jtc01vZHVsZSxcclxuICAgIENvbG9yUGlja2VyTW9kdWxlXHJcbiAgXSxcclxuICBwcm92aWRlcnM6IFtcclxuICAgIHtcclxuICAgICAgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsXHJcbiAgICAgIHVzZUV4aXN0aW5nOiBmb3J3YXJkUmVmKCgpID0+IENvbG9yUGlja2VyQ29tcG9uZW50KSxcclxuICAgICAgbXVsdGk6IHRydWVcclxuICAgIH1cclxuICBdXHJcbn0pXHJcblxyXG5leHBvcnQgY2xhc3MgQ29sb3JQaWNrZXJDb21wb25lbnQgaW1wbGVtZW50cyBDb250cm9sVmFsdWVBY2Nlc3NvciB7XHJcbiAgQElucHV0KCkgbGFiZWw6IHN0cmluZztcclxuICBASW5wdXQoKSB2YWx1ZTogc3RyaW5nID0gJyc7XHJcbiAgQElucHV0KCkgZ2FwOiBzdHJpbmcgPSAnMTJweCc7XHJcbiAgQElucHV0KCkgZm9udFNpemU6IHN0cmluZyA9ICcxNHB4JztcclxuICBAT3V0cHV0KCkgY29sb3JDaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZz4oKTtcclxuXHJcbiAgY29uc3RydWN0b3IoKSB7fVxyXG5cclxuICBvbkNoYW5nZTogYW55ID0gKCkgPT4ge307XHJcbiAgb25Ub3VjaGVkOiBhbnkgPSAoKSA9PiB7fTtcclxuXHJcbiAgd3JpdGVWYWx1ZSh2YWx1ZTogc3RyaW5nKTogdm9pZCB7XHJcbiAgICBpZiAodmFsdWUgIT09IHVuZGVmaW5lZCkge1xyXG4gICAgICB0aGlzLnZhbHVlID0gdmFsdWU7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuXHJcbiAgcmVnaXN0ZXJPbkNoYW5nZShmbjogYW55KTogdm9pZCB7XHJcbiAgICB0aGlzLm9uQ2hhbmdlID0gZm47XHJcbiAgfVxyXG5cclxuICByZWdpc3Rlck9uVG91Y2hlZChmbjogYW55KTogdm9pZCB7XHJcbiAgICB0aGlzLm9uVG91Y2hlZCA9IGZuO1xyXG4gIH1cclxuXHJcbiAgc2V0VmFsdWUoZXZlbnQ6IGFueSkge1xyXG4gICAgdGhpcy52YWx1ZSA9IGV2ZW50LnRhcmdldC52YWx1ZTtcclxuICAgIHRoaXMub25DaGFuZ2UodGhpcy52YWx1ZSk7XHJcbiAgICB0aGlzLmNvbG9yQ2hhbmdlLmVtaXQodGhpcy52YWx1ZSk7XHJcbiAgfVxyXG5cclxuICBjaGFuZ2VDb2xvcihjb2xvcjogc3RyaW5nKSB7XHJcbiAgICBjb2xvciA9IGNvbG9yLnJlcGxhY2UoL1teYS1mQS1GMC05XS9nLCAnJyk7XHJcblxyXG4gICAgLy8gQWRkICcjJyBpZiBub3QgcHJlc2VudFxyXG4gICAgaWYgKCFjb2xvci5zdGFydHNXaXRoKCcjJykpIHtcclxuICAgICAgY29sb3IgPSAnIycgKyBjb2xvcjtcclxuICAgIH1cclxuXHJcbiAgICAvLyBWYWxpZGF0ZSBhbmQgdXBkYXRlIGNvbG9yXHJcbiAgICBpZiAodGhpcy5pc1ZhbGlkQ29sb3IoY29sb3IpKSB7XHJcbiAgICAgIHRoaXMudmFsdWUgPSBjb2xvcjtcclxuICAgICAgdGhpcy5vbkNoYW5nZSh0aGlzLnZhbHVlKTtcclxuICAgICAgdGhpcy5jb2xvckNoYW5nZS5lbWl0KHRoaXMudmFsdWUpO1xyXG4gICAgfSBlbHNlIHtcclxuICAgICAgdGhpcy5jb2xvckNoYW5nZS5lbWl0KHRoaXMudmFsdWUpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcblxyXG4gIGlzVmFsaWRDb2xvcihjb2xvcjogc3RyaW5nKTogYm9vbGVhbiB7XHJcbiAgICBjb25zdCBzID0gbmV3IE9wdGlvbigpLnN0eWxlO1xyXG4gICAgcy5jb2xvciA9IGNvbG9yO1xyXG4gICAgcmV0dXJuIHMuY29sb3IgIT09ICcnO1xyXG4gIH1cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwidy1jb2xvci1waWNrZXJcIiBbbmdTdHlsZV09XCJ7J2dhcCc6IGdhcH1cIj5cclxuXHJcbiAgPGxhYmVsIGNsYXNzPVwiY3AtbGFiZWxcIiBmb3I9XCJjb2xvclBpY2tlclwiIFtuZ1N0eWxlXT1cInsnZm9udC1zaXplJzogZm9udFNpemV9XCI+e3sgbGFiZWwgfX08L2xhYmVsPlxyXG5cclxuICA8ZGl2IGNsYXNzPVwidy1pbnB1dFwiPlxyXG5cclxuICAgIDxkaXZcclxuICAgICAgY2xhc3M9XCJjb2xvci1wcmV2aWV3XCJcclxuICAgICAgW2NvbG9yUGlja2VyXT1cInZhbHVlXCJcclxuICAgICAgKGNsaWNrKT1cImNvbG9yUGlja2VySW5wdXQub3BlbkRpYWxvZygpXCJcclxuICAgICAgW25nU3R5bGVdPVwieydiYWNrZ3JvdW5kLWNvbG9yJzogdmFsdWV9XCJcclxuICAgICAgW2NwUG9zaXRpb25dPVwiJ2JvdHRvbSdcIlxyXG4gICAgICBbY3BQb3NpdGlvbk9mZnNldF09XCInLTM1J1wiXHJcbiAgICA+PC9kaXY+XHJcblxyXG4gICAgPGlucHV0XHJcbiAgICAgIGNsYXNzPVwiY3AtaW5wdXRcIlxyXG4gICAgICBpZD1cImNvbG9yUGlja2VyXCJcclxuICAgICAgI2NvbG9yUGlja2VySW5wdXQ9XCJuZ3hDb2xvclBpY2tlclwiXHJcbiAgICAgIG1heGxlbmd0aD1cIjdcIlxyXG4gICAgICBwbGFjZWhvbGRlcj1cIiMwMDAwMDBcIlxyXG4gICAgICBbKG5nTW9kZWwpXT1cInZhbHVlXCJcclxuICAgICAgKG5nTW9kZWxDaGFuZ2UpPVwiY2hhbmdlQ29sb3IoJGV2ZW50KVwiXHJcbiAgICAgIFtjb2xvclBpY2tlcl09XCJ2YWx1ZVwiXHJcbiAgICAgIChjb2xvclBpY2tlckNoYW5nZSk9XCJjaGFuZ2VDb2xvcigkZXZlbnQpXCJcclxuICAgICAgW2NwUG9zaXRpb25dPVwiJ2JvdHRvbSdcIlxyXG4gICAgICBbY3BQb3NpdGlvbk9mZnNldF09XCInLTM1J1wiXHJcbiAgICAgIChpbnB1dCk9XCJzZXRWYWx1ZSgkZXZlbnQpXCJcclxuICAgIC8+XHJcblxyXG4gIDwvZGl2PlxyXG5cclxuPC9kaXY+XHJcbiJdfQ==
|
|
@@ -6630,7 +6630,6 @@ class ColorPickerComponent {
|
|
|
6630
6630
|
this.colorChange.emit(this.value);
|
|
6631
6631
|
}
|
|
6632
6632
|
changeColor(color) {
|
|
6633
|
-
// Remove any non-hexadecimal characters
|
|
6634
6633
|
color = color.replace(/[^a-fA-F0-9]/g, '');
|
|
6635
6634
|
// Add '#' if not present
|
|
6636
6635
|
if (!color.startsWith('#')) {
|
|
@@ -6639,11 +6638,10 @@ class ColorPickerComponent {
|
|
|
6639
6638
|
// Validate and update color
|
|
6640
6639
|
if (this.isValidColor(color)) {
|
|
6641
6640
|
this.value = color;
|
|
6642
|
-
this.onChange(this.value);
|
|
6641
|
+
this.onChange(this.value);
|
|
6643
6642
|
this.colorChange.emit(this.value);
|
|
6644
6643
|
}
|
|
6645
6644
|
else {
|
|
6646
|
-
// If invalid, reset to previous valid color
|
|
6647
6645
|
this.colorChange.emit(this.value);
|
|
6648
6646
|
}
|
|
6649
6647
|
}
|
|
@@ -6660,7 +6658,7 @@ ColorPickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
|
|
|
6660
6658
|
useExisting: forwardRef(() => ColorPickerComponent),
|
|
6661
6659
|
multi: true
|
|
6662
6660
|
}
|
|
6663
|
-
], ngImport: i0, template: "<div class=\"w-color-picker\" [ngStyle]=\"{'gap': gap}\">\r\n\r\n <label class=\"cp-label\" for=\"colorPicker\" [ngStyle]=\"{'font-size': fontSize}\">{{ label }}</label>\r\n\r\n <div class=\"w-input\">\r\n\r\n <div\r\n class=\"color-preview\"\r\n [colorPicker]=\"value\"\r\n (click)=\"colorPickerInput.openDialog()\"\r\n [ngStyle]=\"{'background-color': value}\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n ></div>\r\n\r\n <input\r\n class=\"cp-input\"\r\n id=\"colorPicker\"\r\n #colorPickerInput=\"ngxColorPicker\"\r\n maxlength=\"7\"\r\n placeholder=\"#000000\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"changeColor($event)\"\r\n [colorPicker]=\"value\"\r\n (colorPickerChange)=\"changeColor($event)\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n (input)=\"setValue($event)\"\r\n />\r\n\r\n </div>\r\n\r\n</div>\r\n", styles: [".w-color-picker{display:flex;flex-direction:column}.w-color-picker .cp-label{font-weight:500}.w-color-picker .w-input{width:210px;height:40px;display:flex;align-items:center;gap:10px;padding:5px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .color-preview{width:30px;height:30px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .cp-input{width:70%;height:100%;border:none;font-size:14px;color:#1d2a3b;font-weight:400}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ColorPickerModule }, { kind: "directive", type: i3$3.ColorPickerDirective, selector: "[colorPicker]", inputs: ["colorPicker", "cpWidth", "cpHeight", "cpToggle", "cpDisabled", "cpIgnoredElements", "cpFallbackColor", "cpColorMode", "cpCmykEnabled", "cpOutputFormat", "cpAlphaChannel", "cpDisableInput", "cpDialogDisplay", "cpSaveClickOutside", "cpCloseClickOutside", "cpUseRootViewContainer", "cpPosition", "cpPositionOffset", "cpPositionRelativeToArrow", "cpOKButton", "cpOKButtonText", "cpOKButtonClass", "cpCancelButton", "cpCancelButtonText", "cpCancelButtonClass", "cpEyeDropper", "cpPresetLabel", "cpPresetColors", "cpPresetColorsClass", "cpMaxPresetColorsLength", "cpPresetEmptyMessage", "cpPresetEmptyMessageClass", "cpAddColorButton", "cpAddColorButtonText", "cpAddColorButtonClass", "cpRemoveColorButtonClass", "cpArrowPosition", "cpExtraTemplate"], outputs: ["cpInputChange", "cpToggleChange", "cpSliderChange", "cpSliderDragEnd", "cpSliderDragStart", "colorPickerOpen", "colorPickerClose", "colorPickerCancel", "colorPickerSelect", "colorPickerChange", "cpCmykColorChange", "cpPresetColorsChange"], exportAs: ["ngxColorPicker"] }] });
|
|
6661
|
+
], ngImport: i0, template: "<div class=\"w-color-picker\" [ngStyle]=\"{'gap': gap}\">\r\n\r\n <label class=\"cp-label\" for=\"colorPicker\" [ngStyle]=\"{'font-size': fontSize}\">{{ label }}</label>\r\n\r\n <div class=\"w-input\">\r\n\r\n <div\r\n class=\"color-preview\"\r\n [colorPicker]=\"value\"\r\n (click)=\"colorPickerInput.openDialog()\"\r\n [ngStyle]=\"{'background-color': value}\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n ></div>\r\n\r\n <input\r\n class=\"cp-input\"\r\n id=\"colorPicker\"\r\n #colorPickerInput=\"ngxColorPicker\"\r\n maxlength=\"7\"\r\n placeholder=\"#000000\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"changeColor($event)\"\r\n [colorPicker]=\"value\"\r\n (colorPickerChange)=\"changeColor($event)\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n (input)=\"setValue($event)\"\r\n />\r\n\r\n </div>\r\n\r\n</div>\r\n", styles: [".w-color-picker{display:flex;flex-direction:column}.w-color-picker .cp-label{font-weight:500}.w-color-picker .w-input{position:relative;width:210px;height:40px;display:flex;align-items:center;gap:10px;padding:5px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .color-preview{width:30px;height:30px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .color-picker{left:0!important}.w-color-picker .w-input .color-picker .arrow-bottom{left:14px!important}.w-color-picker .w-input .cp-input{width:70%;height:100%;border:none;font-size:14px;color:#1d2a3b;font-weight:400}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ColorPickerModule }, { kind: "directive", type: i3$3.ColorPickerDirective, selector: "[colorPicker]", inputs: ["colorPicker", "cpWidth", "cpHeight", "cpToggle", "cpDisabled", "cpIgnoredElements", "cpFallbackColor", "cpColorMode", "cpCmykEnabled", "cpOutputFormat", "cpAlphaChannel", "cpDisableInput", "cpDialogDisplay", "cpSaveClickOutside", "cpCloseClickOutside", "cpUseRootViewContainer", "cpPosition", "cpPositionOffset", "cpPositionRelativeToArrow", "cpOKButton", "cpOKButtonText", "cpOKButtonClass", "cpCancelButton", "cpCancelButtonText", "cpCancelButtonClass", "cpEyeDropper", "cpPresetLabel", "cpPresetColors", "cpPresetColorsClass", "cpMaxPresetColorsLength", "cpPresetEmptyMessage", "cpPresetEmptyMessageClass", "cpAddColorButton", "cpAddColorButtonText", "cpAddColorButtonClass", "cpRemoveColorButtonClass", "cpArrowPosition", "cpExtraTemplate"], outputs: ["cpInputChange", "cpToggleChange", "cpSliderChange", "cpSliderDragEnd", "cpSliderDragStart", "colorPickerOpen", "colorPickerClose", "colorPickerCancel", "colorPickerSelect", "colorPickerChange", "cpCmykColorChange", "cpPresetColorsChange"], exportAs: ["ngxColorPicker"] }] });
|
|
6664
6662
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: ColorPickerComponent, decorators: [{
|
|
6665
6663
|
type: Component,
|
|
6666
6664
|
args: [{ selector: "wac-color-picker", standalone: true, imports: [
|
|
@@ -6673,7 +6671,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImpor
|
|
|
6673
6671
|
useExisting: forwardRef(() => ColorPickerComponent),
|
|
6674
6672
|
multi: true
|
|
6675
6673
|
}
|
|
6676
|
-
], template: "<div class=\"w-color-picker\" [ngStyle]=\"{'gap': gap}\">\r\n\r\n <label class=\"cp-label\" for=\"colorPicker\" [ngStyle]=\"{'font-size': fontSize}\">{{ label }}</label>\r\n\r\n <div class=\"w-input\">\r\n\r\n <div\r\n class=\"color-preview\"\r\n [colorPicker]=\"value\"\r\n (click)=\"colorPickerInput.openDialog()\"\r\n [ngStyle]=\"{'background-color': value}\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n ></div>\r\n\r\n <input\r\n class=\"cp-input\"\r\n id=\"colorPicker\"\r\n #colorPickerInput=\"ngxColorPicker\"\r\n maxlength=\"7\"\r\n placeholder=\"#000000\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"changeColor($event)\"\r\n [colorPicker]=\"value\"\r\n (colorPickerChange)=\"changeColor($event)\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n (input)=\"setValue($event)\"\r\n />\r\n\r\n </div>\r\n\r\n</div>\r\n", styles: [".w-color-picker{display:flex;flex-direction:column}.w-color-picker .cp-label{font-weight:500}.w-color-picker .w-input{width:210px;height:40px;display:flex;align-items:center;gap:10px;padding:5px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .color-preview{width:30px;height:30px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .cp-input{width:70%;height:100%;border:none;font-size:14px;color:#1d2a3b;font-weight:400}\n"] }]
|
|
6674
|
+
], template: "<div class=\"w-color-picker\" [ngStyle]=\"{'gap': gap}\">\r\n\r\n <label class=\"cp-label\" for=\"colorPicker\" [ngStyle]=\"{'font-size': fontSize}\">{{ label }}</label>\r\n\r\n <div class=\"w-input\">\r\n\r\n <div\r\n class=\"color-preview\"\r\n [colorPicker]=\"value\"\r\n (click)=\"colorPickerInput.openDialog()\"\r\n [ngStyle]=\"{'background-color': value}\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n ></div>\r\n\r\n <input\r\n class=\"cp-input\"\r\n id=\"colorPicker\"\r\n #colorPickerInput=\"ngxColorPicker\"\r\n maxlength=\"7\"\r\n placeholder=\"#000000\"\r\n [(ngModel)]=\"value\"\r\n (ngModelChange)=\"changeColor($event)\"\r\n [colorPicker]=\"value\"\r\n (colorPickerChange)=\"changeColor($event)\"\r\n [cpPosition]=\"'bottom'\"\r\n [cpPositionOffset]=\"'-35'\"\r\n (input)=\"setValue($event)\"\r\n />\r\n\r\n </div>\r\n\r\n</div>\r\n", styles: [".w-color-picker{display:flex;flex-direction:column}.w-color-picker .cp-label{font-weight:500}.w-color-picker .w-input{position:relative;width:210px;height:40px;display:flex;align-items:center;gap:10px;padding:5px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .color-preview{width:30px;height:30px;border:1px solid #dee2ed;border-radius:3px}.w-color-picker .w-input .color-picker{left:0!important}.w-color-picker .w-input .color-picker .arrow-bottom{left:14px!important}.w-color-picker .w-input .cp-input{width:70%;height:100%;border:none;font-size:14px;color:#1d2a3b;font-weight:400}\n"] }]
|
|
6677
6675
|
}], ctorParameters: function () { return []; }, propDecorators: { label: [{
|
|
6678
6676
|
type: Input
|
|
6679
6677
|
}], value: [{
|