@wizishop/angular-components 0.0.166 → 0.0.170
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 +419 -419
- package/assets/i18n/en.json +1 -1
- package/assets/i18n/fr.json +1 -1
- package/bundles/wizishop-angular-components.umd.js +48 -32
- package/bundles/wizishop-angular-components.umd.js.map +1 -1
- package/bundles/wizishop-angular-components.umd.min.js +1 -1
- package/bundles/wizishop-angular-components.umd.min.js.map +1 -1
- package/esm2015/lib/components/block-with-checkbox/block-with-checkbox.component.js +5 -3
- package/esm2015/lib/components/inputs/input/input.component.js +4 -2
- package/esm2015/lib/components/mosaic/mosaic.component.js +31 -25
- package/esm2015/lib/components/text-area/text-area.component.js +5 -4
- package/esm2015/lib/components/wrapper-sidebar/wrapper-sidebar.component.js +4 -3
- package/fesm2015/wizishop-angular-components.js +43 -31
- package/fesm2015/wizishop-angular-components.js.map +1 -1
- package/lib/components/block-with-checkbox/block-with-checkbox.component.d.ts +1 -0
- package/lib/components/inputs/input/input.component.d.ts +2 -0
- package/lib/components/mosaic/mosaic.component.d.ts +18 -12
- package/lib/components/text-area/text-area.component.d.ts +2 -1
- package/lib/components/wrapper-sidebar/wrapper-sidebar.component.d.ts +1 -0
- package/package.json +1 -1
- package/wizishop-angular-components-0.0.170.tgz +0 -0
- package/wizishop-angular-components.metadata.json +1 -1
- package/wizishop-angular-components-0.0.166.tgz +0 -0
|
@@ -9,6 +9,7 @@ export class BlockWithCheckboxComponent {
|
|
|
9
9
|
this.checkboxAction = new EventEmitter();
|
|
10
10
|
this.nameRadio = 'wacBlockCheckboxRadio';
|
|
11
11
|
this.isFirst = false;
|
|
12
|
+
this.opacity = '.45';
|
|
12
13
|
}
|
|
13
14
|
ngOnInit() {
|
|
14
15
|
this.randomLabelName = 'radioBlock' + Math.random() * (900 - 700) + 700;
|
|
@@ -32,7 +33,7 @@ export class BlockWithCheckboxComponent {
|
|
|
32
33
|
BlockWithCheckboxComponent.decorators = [
|
|
33
34
|
{ type: Component, args: [{
|
|
34
35
|
selector: 'wac-block-with-checkbox',
|
|
35
|
-
template: "<div class=\"block-with-checkbox\" [ngClass]=\"{'selected': inputRadioA.checked, 'firstWacRadioBLock': isFirst}\" (mouseover)=\"removeFirstClass()\">\n <div class=\"block-with-checkbox__left\" (click)=\"inputRadioA.click()\">\n <div class=\"wac-radio-block\">\n <div class=\"wac-radio__row\">\n <input #inputRadioA [name]=\"nameRadio\" type=\"radio\" [value]=\"selected\" (change)=\"eventSelected($event)\" [id]=\"randomLabelName\">\n <label [for]=\"randomLabelName\"></label>\n </div>\n </div>\n </div>\n <div class=\"block-with-checkbox__center\" (click)=\"inputRadioA.click()\">\n <ng-content></ng-content>\n </div>\n <div class=\"block-with-checkbox__right\">\n <div><wac-button extraClasses=\"is-blue opacity static-width\" [iconFontSize]=\"18\" [icon]=\"iconCopy\" (click)=\"eventCopy()\"></wac-button></div>\n <div><wac-button extraClasses=\"is-green opacity static-width\" [iconFontSize]=\"18\" [icon]=\"iconWorld\" (click)=\"eventWorld()\"></wac-button></div>\n </div>\n</div>\n"
|
|
36
|
+
template: "<div class=\"block-with-checkbox\" [ngClass]=\"{'selected': inputRadioA.checked, 'firstWacRadioBLock': isFirst}\" [style.opacity]=\"opacity\" (mouseover)=\"removeFirstClass()\">\n <div class=\"block-with-checkbox__left\" (click)=\"inputRadioA.click()\">\n <div class=\"wac-radio-block\">\n <div class=\"wac-radio__row\">\n <input #inputRadioA [name]=\"nameRadio\" type=\"radio\" [value]=\"selected\" (change)=\"eventSelected($event)\" [id]=\"randomLabelName\">\n <label [for]=\"randomLabelName\"></label>\n </div>\n </div>\n </div>\n <div class=\"block-with-checkbox__center\" (click)=\"inputRadioA.click()\">\n <ng-content></ng-content>\n </div>\n <div class=\"block-with-checkbox__right\">\n <div><wac-button extraClasses=\"is-blue opacity static-width\" [iconFontSize]=\"18\" [icon]=\"iconCopy\" (click)=\"eventCopy()\"></wac-button></div>\n <div><wac-button extraClasses=\"is-green opacity static-width\" [iconFontSize]=\"18\" [icon]=\"iconWorld\" (click)=\"eventWorld()\"></wac-button></div>\n </div>\n</div>\n"
|
|
36
37
|
},] }
|
|
37
38
|
];
|
|
38
39
|
BlockWithCheckboxComponent.ctorParameters = () => [];
|
|
@@ -44,6 +45,7 @@ BlockWithCheckboxComponent.propDecorators = {
|
|
|
44
45
|
worldAction: [{ type: Output }],
|
|
45
46
|
checkboxAction: [{ type: Output }],
|
|
46
47
|
nameRadio: [{ type: Input }],
|
|
47
|
-
isFirst: [{ type: Input }]
|
|
48
|
+
isFirst: [{ type: Input }],
|
|
49
|
+
opacity: [{ type: Input }]
|
|
48
50
|
};
|
|
49
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
51
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmxvY2std2l0aC1jaGVja2JveC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLWNvbXBvbmVudHMvc3JjL2xpYi9jb21wb25lbnRzL2Jsb2NrLXdpdGgtY2hlY2tib3gvYmxvY2std2l0aC1jaGVja2JveC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFVLE1BQU0sRUFBQyxNQUFNLGVBQWUsQ0FBQztBQU03RSxNQUFNLE9BQU8sMEJBQTBCO0lBK0JyQztRQTVCQSxhQUFRLEdBQUcsS0FBSyxDQUFDO1FBR2pCLGFBQVEsR0FBRyxrQkFBa0IsQ0FBQztRQUc5QixjQUFTLEdBQUcsa0JBQWtCLENBQUM7UUFHL0IsZUFBVSxHQUFHLElBQUksWUFBWSxFQUFXLENBQUM7UUFHekMsZ0JBQVcsR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO1FBRzFDLG1CQUFjLEdBQUcsSUFBSSxZQUFZLEVBQVcsQ0FBQztRQUs3QyxjQUFTLEdBQUcsdUJBQXVCLENBQUM7UUFHcEMsWUFBTyxHQUFHLEtBQUssQ0FBQztRQUdoQixZQUFPLEdBQUcsS0FBSyxDQUFDO0lBRUEsQ0FBQztJQUVqQixRQUFRO1FBQ04sSUFBSSxDQUFDLGVBQWUsR0FBRyxZQUFZLEdBQUcsSUFBSSxDQUFDLE1BQU0sRUFBRSxHQUFHLENBQUMsR0FBRyxHQUFHLEdBQUcsQ0FBQyxHQUFHLEdBQUcsQ0FBQztJQUMxRSxDQUFDO0lBRUQsYUFBYSxDQUFDLEtBQUs7UUFDakIsT0FBTyxDQUFDLEdBQUcsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUNuQixJQUFJLENBQUMsUUFBUSxHQUFHLEtBQUssQ0FBQyxNQUFNLENBQUMsT0FBTyxDQUFDO1FBQ3JDLElBQUksQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztRQUN4QyxJQUFJLENBQUMsT0FBTyxHQUFHLEtBQUssQ0FBQztJQUN2QixDQUFDO0lBRUQsU0FBUztRQUNQLElBQUksQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQzdCLENBQUM7SUFFRCxVQUFVO1FBQ1IsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDOUIsQ0FBQztJQUVELGdCQUFnQjtRQUNkLFFBQVEsQ0FBQyxnQkFBZ0IsQ0FBQyxxQkFBcUIsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxNQUFNLENBQUMsb0JBQW9CLENBQUMsQ0FBQztJQUM3RixDQUFDOzs7WUExREYsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSx5QkFBeUI7Z0JBQ25DLGtqQ0FBbUQ7YUFDcEQ7Ozs7dUJBR0UsS0FBSzt1QkFHTCxLQUFLO3dCQUdMLEtBQUs7eUJBR0wsTUFBTTswQkFHTixNQUFNOzZCQUdOLE1BQU07d0JBS04sS0FBSztzQkFHTCxLQUFLO3NCQUdMLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0NvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT25Jbml0LCBPdXRwdXR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd3YWMtYmxvY2std2l0aC1jaGVja2JveCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9ibG9jay13aXRoLWNoZWNrYm94LmNvbXBvbmVudC5odG1sJyxcbn0pXG5leHBvcnQgY2xhc3MgQmxvY2tXaXRoQ2hlY2tib3hDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuXG4gIEBJbnB1dCgpXG4gIHNlbGVjdGVkID0gZmFsc2U7XG5cbiAgQElucHV0KClcbiAgaWNvbkNvcHkgPSAnZmEtc29saWQgZmEtY29weSc7XG5cbiAgQElucHV0KClcbiAgaWNvbldvcmxkID0gJ2ZhLXRoaW4gZmEtZ2xvYmUnO1xuXG4gIEBPdXRwdXQoKVxuICBjb3B5QWN0aW9uID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpO1xuXG4gIEBPdXRwdXQoKVxuICB3b3JsZEFjdGlvbiA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcblxuICBAT3V0cHV0KClcbiAgY2hlY2tib3hBY3Rpb24gPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7XG5cbiAgcmFuZG9tTGFiZWxOYW1lOiBzdHJpbmc7XG5cbiAgQElucHV0KClcbiAgbmFtZVJhZGlvID0gJ3dhY0Jsb2NrQ2hlY2tib3hSYWRpbyc7XG5cbiAgQElucHV0KClcbiAgaXNGaXJzdCA9IGZhbHNlO1xuXG4gIEBJbnB1dCgpXG4gIG9wYWNpdHkgPSAnLjQ1JztcblxuICBjb25zdHJ1Y3RvcigpIHsgfVxuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIHRoaXMucmFuZG9tTGFiZWxOYW1lID0gJ3JhZGlvQmxvY2snICsgTWF0aC5yYW5kb20oKSAqICg5MDAgLSA3MDApICsgNzAwO1xuICB9XG5cbiAgZXZlbnRTZWxlY3RlZChldmVudCkge1xuICAgIGNvbnNvbGUubG9nKGV2ZW50KTtcbiAgICB0aGlzLnNlbGVjdGVkID0gZXZlbnQudGFyZ2V0LmNoZWNrZWQ7XG4gICAgdGhpcy5jaGVja2JveEFjdGlvbi5lbWl0KHRoaXMuc2VsZWN0ZWQpO1xuICAgIHRoaXMuaXNGaXJzdCA9IGZhbHNlO1xuICB9XG5cbiAgZXZlbnRDb3B5KCkge1xuICAgIHRoaXMuY29weUFjdGlvbi5lbWl0KHRydWUpO1xuICB9XG5cbiAgZXZlbnRXb3JsZCgpIHtcbiAgICB0aGlzLndvcmxkQWN0aW9uLmVtaXQodHJ1ZSk7XG4gIH1cblxuICByZW1vdmVGaXJzdENsYXNzKCkge1xuICAgIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3JBbGwoJy5maXJzdFdhY1JhZGlvQkxvY2snKVswXS5jbGFzc0xpc3QucmVtb3ZlKCdmaXJzdFdhY1JhZGlvQkxvY2snKTtcbiAgfVxufVxuIl19
|
|
@@ -87,7 +87,7 @@ export class InputComponent {
|
|
|
87
87
|
InputComponent.decorators = [
|
|
88
88
|
{ type: Component, args: [{
|
|
89
89
|
selector: 'wac-input',
|
|
90
|
-
template: "<div\n class=\"field wac-input\"\n [ngClass]=\"{ 'has-no-block': withoutBlock, 'is-big': big, 'is-medium': medium, 'with-padding': padding, 'indication-left': indicationLeft, 'with-progress-bar': progressBar }\"\n>\n <div class=\"field-label is-normal has-text-left\" *ngIf=\"!withoutBlock\">\n <label\n [ngClass]=\"[boldLabel == 'true' ? 'label has-text-weight-bold' : 'label has-text-weight-normal', showTooltip ? 'label-inline' : '']\"\n [innerHTML]=\"label\"\n [for]=\"id\"\n ></label>\n <wac-tooltip\n *ngIf=\"showTooltip\"\n [tooltipIcon]=\"iconTooltip\"\n [tooltipText]=\"textTooltip\"\n [tooltipLink]=\"linkTooltip\"\n [tooltipUrl]=\"urlTooltip\"\n ></wac-tooltip>\n <!-- Size -->\n <span *ngIf=\"
|
|
90
|
+
template: "<div\n class=\"field wac-input\"\n [ngClass]=\"{ 'has-no-block': withoutBlock, 'is-big': big, 'is-medium': medium, 'with-padding': padding, 'indication-left': indicationLeft, 'with-progress-bar': progressBar }\"\n>\n <div class=\"field-label is-normal has-text-left\" *ngIf=\"!withoutBlock\">\n <label\n [ngClass]=\"[boldLabel == 'true' ? 'label has-text-weight-bold' : 'label has-text-weight-normal', showTooltip ? 'label-inline' : '']\"\n [innerHTML]=\"label\"\n [for]=\"id\"\n ></label>\n <wac-tooltip\n *ngIf=\"showTooltip\"\n [tooltipIcon]=\"iconTooltip\"\n [tooltipText]=\"textTooltip\"\n [tooltipLink]=\"linkTooltip\"\n [tooltipUrl]=\"urlTooltip\"\n ></wac-tooltip>\n <!-- Size -->\n <span *ngIf=\"size && !progressBar\" class=\"is-size-7 wac-input__size\">\n <strong>{{ value.toString().length }}</strong> / {{ size }}\n </span>\n </div>\n <div class=\"field-body\">\n <div class=\"field\">\n <p\n class=\"control\"\n [ngClass]=\"{ 'has-icons-right': textError || success, 'has-icons-left': icon !== '', 'has-input-group': textAppend || textPrepend }\"\n >\n <!-- Text Prepend -->\n <span *ngIf=\"textPrepend\" class=\"has-input-group\">\n <span class=\"has-input-group-text prepend\">{{ textPrepend }}</span>\n <span *ngIf=\"icon !== ''\" class=\"icon is-small is-left\">\n <i [class]=\"icon\"></i>\n </span>\n </span>\n\n <!-- Input -->\n <input\n [class]=\"'input ' + extraClasses\"\n [id]=\"id\"\n [ngClass]=\"{\n 'is-danger': textError,\n 'is-large': big,\n 'is-number': isNumber,\n 'remove-margin': disableMargin,\n 'text-append': textAppend\n }\"\n [type]=\"type\"\n [placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [(ngModel)]=\"value\"\n (ngModelChange)=\"onChange($event)\"\n (blur)=\"onBlur()\"\n [disabled]=\"disabled\"\n (focusout)=\"onFocusOut()\"\n [min]=\"min\"\n [max]=\"max\"\n [maxlength]=\"maxlength ? maxlength : 524288\"\n [minlength]=\"minlength ? minlength : 0\"\n (keypress)=\"keyPress($event)\"\n />\n\n <!-- Indication at the end of the input -->\n <span class=\"indication\" *ngIf=\"indication\" [ngClass]=\"{'reverse': indicationLeft}\">\n <span [innerHTML]=\"indication\"></span>\n </span>\n\n <!-- Text Append -->\n <span *ngIf=\"textAppend && !indicationLeft\" class=\"has-input-group\">\n <span class=\"has-input-group-text append\">{{ textAppend }}</span>\n <!-- error if text append not empty -->\n <span *ngIf=\"textError\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n </span>\n\n <!-- Icon Left -->\n <span *ngIf=\"icon !== '' && !textPrepend && !indicationLeft\" class=\"icon is-small is-left\">\n <i [class]=\"icon\"></i>\n </span>\n\n <!-- Icon error if textAppend empty -->\n <span *ngIf=\"textError && !textAppend && !indicationLeft\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n\n <!-- Icon success -->\n <span *ngIf=\"success\" class=\"icon is-small is-right\">\n <i class=\"fas fa-check has-text-success\"></i>\n </span>\n\n <!-- Text Info -->\n <span\n *ngIf=\"textInfo && (textError === null || textError === '') && !progressBar && !indicationLeft\"\n class=\"is-size-7 wac-input__info text-info\"\n [innerHtml]=\"textInfo\"\n ></span>\n\n <!-- Text Error -->\n <span *ngIf=\"textError && !progressBar && !indicationLeft\" class=\"is-size-7 wac-input__error has-text-danger\" [innerHtml]=\"textError\"></span>\n </p>\n\n <!-- Progress Bar -->\n <wac-progress-bar *ngIf=\"progressBar && !indicationLeft\" [min]=\"min\" [max]=\"max\" [valueLength]=\"value.length\"></wac-progress-bar>\n </div>\n </div>\n</div>\n",
|
|
91
91
|
providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: InputComponent, multi: true }]
|
|
92
92
|
},] }
|
|
93
93
|
];
|
|
@@ -122,7 +122,9 @@ InputComponent.propDecorators = {
|
|
|
122
122
|
disabled: [{ type: Input }],
|
|
123
123
|
indication: [{ type: Input }],
|
|
124
124
|
success: [{ type: Input }],
|
|
125
|
+
maxlength: [{ type: Input }],
|
|
126
|
+
minlength: [{ type: Input }],
|
|
125
127
|
indicationLeft: [{ type: Input }],
|
|
126
128
|
keypressEnter: [{ type: Output }]
|
|
127
129
|
};
|
|
128
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
130
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvYW5ndWxhci1jb21wb25lbnRzL3NyYy9saWIvY29tcG9uZW50cy9pbnB1dHMvaW5wdXQvaW5wdXQuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdkUsT0FBTyxFQUF3QixpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBT3pFLE1BQU0sT0FBTyxjQUFjO0lBTDNCO1FBT0UsVUFBSyxHQUFHLEVBQUUsQ0FBQztRQUVYLFVBQUssR0FBRyxFQUFFLENBQUM7UUFFWCxTQUFJLEdBQUcsTUFBTSxDQUFDO1FBRWQsZ0JBQVcsR0FBRyxFQUFFLENBQUM7UUFFakIsYUFBUSxHQUFHLElBQUksQ0FBQztRQUVoQixjQUFTLEdBQUcsSUFBSSxDQUFDO1FBRWpCLFNBQUksR0FBRyxJQUFJLENBQUM7UUFFWixhQUFRLEdBQUcsSUFBSSxDQUFDO1FBRWhCLGlCQUFZLEdBQUcsS0FBSyxDQUFDO1FBRXJCLFNBQUksR0FBRyxFQUFFLENBQUM7UUFFVixRQUFHLEdBQUcsS0FBSyxDQUFDO1FBRVosV0FBTSxHQUFHLEtBQUssQ0FBQztRQUVmLGNBQVMsR0FBRyxPQUFPLENBQUM7UUFFcEIsUUFBRyxHQUFHLElBQUksQ0FBQztRQUVYLFFBQUcsR0FBRyxJQUFJLENBQUM7UUFFWCxrQkFBYSxHQUFHLEtBQUssQ0FBQztRQUV0QixnQkFBVyxHQUFHLElBQUksQ0FBQztRQUVuQixlQUFVLEdBQUcsSUFBSSxDQUFDO1FBRWxCLGdCQUFXLEdBQUcsS0FBSyxDQUFDO1FBRXBCLGlCQUFZLEdBQUcsRUFBRSxDQUFDO1FBRWxCLHNCQUFpQixHQUFHLEVBQUUsQ0FBQztRQUV2QixnQkFBVyxHQUFH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QUs7cUJBRUwsS0FBSzt3QkFFTCxLQUFLO2tCQUVMLEtBQUs7a0JBRUwsS0FBSzs0QkFFTCxLQUFLOzBCQUVMLEtBQUs7eUJBRUwsS0FBSzswQkFFTCxLQUFLOzJCQUVMLEtBQUs7Z0NBRUwsS0FBSzswQkFFTCxLQUFLOzBCQUVMLEtBQUs7MEJBRUwsS0FBSzt5QkFFTCxLQUFLOzBCQUVMLEtBQUs7c0JBRUwsS0FBSzt1QkFFTCxLQUFLO3lCQUVMLEtBQUs7c0JBRUwsS0FBSzt3QkFFTCxLQUFLO3dCQUVMLEtBQUs7NkJBRUwsS0FBSzs0QkFHTCxNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbnRyb2xWYWx1ZUFjY2Vzc29yLCBOR19WQUxVRV9BQ0NFU1NPUiB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnd2FjLWlucHV0JyxcbiAgdGVtcGxhdGVVcmw6ICcuL2lucHV0LmNvbXBvbmVudC5odG1sJyxcbiAgcHJvdmlkZXJzOiBbeyBwcm92aWRlOiBOR19WQUxVRV9BQ0NFU1NPUiwgdXNlRXhpc3Rpbmc6IElucHV0Q29tcG9uZW50LCBtdWx0aTogdHJ1ZSB9XVxufSlcbmV4cG9ydCBjbGFzcyBJbnB1dENvbXBvbmVudCBpbXBsZW1lbnRzIENvbnRyb2xWYWx1ZUFjY2Vzc29yIHtcbiAgQElucHV0KClcbiAgbGFiZWwgPSAnJztcbiAgQElucHV0KClcbiAgdmFsdWUgPSAnJztcbiAgQElucHV0KClcbiAgdHlwZSA9ICd0ZXh0JztcbiAgQElucHV0KClcbiAgcGxhY2Vob2xkZXIgPSAnJztcbiAgQElucHV0KClcbiAgdGV4dEluZm8gPSBudWxsO1xuICBASW5wdXQoKVxuICB0ZXh0RXJyb3IgPSBudWxsO1xuICBASW5wdXQoKVxuICBzaXplID0gbnVsbDtcbiAgQElucHV0KClcbiAgaXNOdW1iZXIgPSBudWxsO1xuICBASW5wdXQoKVxuICB3aXRob3V0QmxvY2sgPSBmYWxzZTtcbiAgQElucHV0KClcbiAgaWNvbiA9ICcnO1xuICBASW5wdXQoKVxuICBiaWcgPSBmYWxzZTtcbiAgQElucHV0KClcbiAgbWVkaXVtID0gZmFsc2U7XG4gIEBJbnB1dCgpXG4gIGJvbGRMYWJlbCA9ICdmYWxzZSc7XG4gIEBJbnB1dCgpXG4gIG1pbiA9IG51bGw7XG4gIEBJbnB1dCgpXG4gIG1heCA9IG51bGw7XG4gIEBJbnB1dCgpXG4gIGRpc2FibGVNYXJnaW4gPSBmYWxzZTtcbiAgQElucHV0KClcbiAgdGV4dFByZXBlbmQgPSBudWxsO1xuICBASW5wdXQoKVxuICB0ZXh0QXBwZW5kID0gbnVsbDtcbiAgQElucHV0KClcbiAgcHJvZ3Jlc3NCYXIgPSBmYWxzZTtcbiAgQElucHV0KClcbiAgZXh0cmFDbGFzc2VzID0gJyc7XG4gIEBJbnB1dCgpXG4gIGtleVByZXZlbnREZWZhdWx0ID0gW107XG4gIEBJbnB1dCgpXG4gIHNob3dUb29sdGlwID0gZmFsc2U7XG4gIEBJbnB1dCgpXG4gIHRleHRUb29sdGlwID0gJyc7XG4gIEBJbnB1dCgpXG4gIGljb25Ub29sdGlwID0gJyc7XG4gIEBJbnB1dCgpXG4gIHVybFRvb2x0aXAgPSAnJztcbiAgQElucHV0KClcbiAgbGlua1Rvb2x0aXAgPSAnJztcbiAgQElucHV0KClcbiAgcGFkZGluZyA9IGZhbHNlO1xuICBASW5wdXQoKVxuICBkaXNhYmxlZCA9IGZhbHNlO1xuICBASW5wdXQoKVxuICBpbmRpY2F0aW9uID0gZmFsc2U7XG4gIEBJbnB1dCgpXG4gIHN1Y2Nlc3MgPSBmYWxzZTtcbiAgQElucHV0KClcbiAgbWF4bGVuZ3RoOiBudW1iZXIgfCBzdHJpbmc7XG4gIEBJbnB1dCgpXG4gIG1pbmxlbmd0aDogbnVtYmVyIHwgc3RyaW5nO1xuICBASW5wdXQoKVxuICBpbmRpY2F0aW9uTGVmdCA9IGZhbHNlO1xuXG4gIEBPdXRwdXQoKSBrZXlwcmVzc0VudGVyID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpO1xuXG4gIHByaXZhdGUgS0VZUFJFU1NfRU5URVIgPSBcIkVudGVyXCI7XG5cbiAgaWQgPVxuICAgICd3ei1pbnB1dF8nICtcbiAgICBNYXRoLnJhbmRvbSgpXG4gICAgICAudG9TdHJpbmcoMzYpXG4gICAgICAuc3Vic3RyKDIsIDkpO1xuXG4gIHByaXZhdGUgX29uQ2hhbmdlOiBGdW5jdGlvbjtcbiAgcHJpdmF0ZSBfb25Ub3VjaGVkOiBGdW5jdGlvbjtcblxuICByZWdpc3Rlck9uQ2hhbmdlKGZuOiBhbnkpOiB2b2lkIHtcbiAgICB0aGlzLl9vbkNoYW5nZSA9IGZuO1xuICB9XG5cbiAgcmVnaXN0ZXJPblRvdWNoZWQoZm46IGFueSk6IHZvaWQge1xuICAgIHRoaXMuX29uVG91Y2hlZCA9IGZuO1xuICB9XG5cbiAgc2V0RGlzYWJsZWRTdGF0ZShpc0Rpc2FibGVkOiBib29sZWFuKTogdm9pZCB7XG4gICAgdGhpcy5kaXNhYmxlZCA9IGlzRGlzYWJsZWQ7XG4gIH1cblxuICB3cml0ZVZhbHVlKG9iajogYW55KTogdm9pZCB7XG4gICAgdGhpcy52YWx1ZSA9IG9iajtcbiAgfVxuXG4gIG9uQ2hhbmdlKHZhbHVlKSB7XG4gICAgaWYgKHRoaXMuX29uQ2hhbmdlKSB7XG4gICAgICB0aGlzLl9vbkNoYW5nZSh2YWx1ZSk7XG4gICAgfVxuICB9XG5cbiAgb25CbHVyKCkge1xuICAgIGlmICh0aGlzLl9vblRvdWNoZWQpIHtcbiAgICAgIHRoaXMuX29uVG91Y2hlZCgpO1xuICAgIH1cbiAgfVxuXG4gIGNoZWNrTnVtYmVyVmFsdWUodmFsdWUpIHtcbiAgICBpZiAodGhpcy5taW4gJiYgdGhpcy5taW4gPiB2YWx1ZSkge1xuICAgICAgdGhpcy52YWx1ZSA9IHRoaXMubWluO1xuICAgIH1cbiAgICBpZiAodGhpcy5tYXggJiYgdGhpcy5tYXggPCB2YWx1ZSkge1xuICAgICAgdGhpcy52YWx1ZSA9IHRoaXMubWF4O1xuICAgIH1cbiAgfVxuXG4gIG9uRm9jdXNPdXQoKSB7XG4gICAgaWYgKHRoaXMudHlwZSA9PT0gJ251bWJlcicpIHtcbiAgICAgIHRoaXMuY2hlY2tOdW1iZXJWYWx1ZSh0aGlzLnZhbHVlKTtcbiAgICB9XG4gIH1cblxuICBrZXlQcmVzcyhldmVudDogS2V5Ym9hcmRFdmVudCkge1xuICAgIGlmICh0aGlzLmtleVByZXZlbnREZWZhdWx0LmluY2x1ZGVzKGV2ZW50LmtleSkpIHtcbiAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgfVxuXG4gICAgaWYgKGV2ZW50LmtleSA9PT0gdGhpcy5LRVlQUkVTU19FTlRFUikge1xuICAgICAgdGhpcy5rZXlwcmVzc0VudGVyLm5leHQodHJ1ZSk7XG4gICAgfVxuICB9XG59XG4iXX0=
|
|
@@ -1,41 +1,47 @@
|
|
|
1
|
-
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
|
1
|
+
import { Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';
|
|
2
2
|
export class MosaicComponent {
|
|
3
3
|
constructor() {
|
|
4
|
-
this.
|
|
5
|
-
this.import = new EventEmitter();
|
|
6
|
-
}
|
|
7
|
-
ngOnInit() {
|
|
8
|
-
if (this.items) {
|
|
9
|
-
const splitItems = this.sliceIntoChunks(this.items, (this.items.length / 3));
|
|
10
|
-
this.columnLeft = splitItems[0];
|
|
11
|
-
this.columnCenter = splitItems[1];
|
|
12
|
-
this.columnRight = splitItems[2];
|
|
13
|
-
}
|
|
4
|
+
this._imagesList = [];
|
|
14
5
|
this.isLoading = false;
|
|
6
|
+
this.numberOfColumn = 3;
|
|
7
|
+
this.importImageSrc = new EventEmitter();
|
|
8
|
+
}
|
|
9
|
+
set imagesList(imagesList) {
|
|
10
|
+
this._imagesList = imagesList;
|
|
11
|
+
this.generateColumns();
|
|
15
12
|
}
|
|
16
|
-
|
|
17
|
-
this.
|
|
13
|
+
get imagesList() {
|
|
14
|
+
return this._imagesList;
|
|
18
15
|
}
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
16
|
+
generateColumns() {
|
|
17
|
+
this.columns = this.sliceIntoChunks();
|
|
18
|
+
}
|
|
19
|
+
sliceIntoChunks() {
|
|
20
|
+
const columns = [];
|
|
21
|
+
const numberOfImagePerColumn = this.imagesList.length / this.numberOfColumn;
|
|
22
|
+
for (let i = 0; i < this.imagesList.length; i += numberOfImagePerColumn) {
|
|
23
|
+
const chunk = this.imagesList.slice(i, i + numberOfImagePerColumn);
|
|
24
|
+
columns.push(chunk);
|
|
24
25
|
}
|
|
25
|
-
return
|
|
26
|
+
return columns;
|
|
27
|
+
}
|
|
28
|
+
onImportImage(src) {
|
|
29
|
+
this.importImageSrc.emit(src);
|
|
26
30
|
}
|
|
27
31
|
}
|
|
28
32
|
MosaicComponent.decorators = [
|
|
29
33
|
{ type: Component, args: [{
|
|
30
34
|
selector: 'wac-mosaic',
|
|
31
|
-
template: "<div class=\"wac-
|
|
35
|
+
template: "<div class=\"wac-mosaic\" *ngIf=\"!isLoading; else loading\">\n <div class=\"wac-mosaic__wrapper\">\n <div class=\"wac-mosaic__wrapper__column\" *ngFor=\"let column of columns\">\n <div class=\"wac-mosaic__wrapper__column__image\" *ngFor=\"let image of column; let i = index;\">\n <img [src]=\"image.src\" [alt]=\"image.alt\"/>\n <div class=\"hover\">\n <ng-container\n [ngTemplateOutlet]=\"importButtonTemplate || defaultImportButton\"\n [ngTemplateOutletContext]=\"{ $implicit: image }\"\n >\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n<ng-template #defaultImportButton let-image>\n <wac-button [icon]=\"'fa-solid fa-image'\" [label]=\"'wac.MosaicComponent.import' | translate\" [extraClasses]=\"'is-success'\" (click)=\"onImportImage(image.src)\"></wac-button>\n</ng-template>\n\n<ng-template #loading>\n <div class=\"wac-mosaic__loader\" *ngIf=\"isLoading\">\n <wac-loader></wac-loader>\n </div>\n</ng-template>\n",
|
|
36
|
+
encapsulation: ViewEncapsulation.None
|
|
32
37
|
},] }
|
|
33
38
|
];
|
|
34
39
|
MosaicComponent.ctorParameters = () => [];
|
|
35
40
|
MosaicComponent.propDecorators = {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
41
|
+
imagesList: [{ type: Input }],
|
|
42
|
+
isLoading: [{ type: Input }],
|
|
43
|
+
numberOfColumn: [{ type: Input }],
|
|
44
|
+
importButtonTemplate: [{ type: Input }],
|
|
45
|
+
importImageSrc: [{ type: Output }]
|
|
40
46
|
};
|
|
41
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
47
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9zYWljLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2FuZ3VsYXItY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvbW9zYWljL21vc2FpYy5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBZSxpQkFBaUIsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQWVyRyxNQUFNLE9BQU8sZUFBZTtJQTBCMUI7UUFkQSxnQkFBVyxHQUFrQixFQUFFLENBQUM7UUFFdkIsY0FBUyxHQUFHLEtBQUssQ0FBQztRQUVsQixtQkFBYyxHQUFHLENBQUMsQ0FBQztRQU01QixtQkFBYyxHQUFHLElBQUksWUFBWSxFQUFlLENBQUM7SUFJakMsQ0FBQztJQXhCakIsSUFDSSxVQUFVLENBQUMsVUFBeUI7UUFDdEMsSUFBSSxDQUFDLFdBQVcsR0FBRyxVQUFVLENBQUM7UUFDOUIsSUFBSSxDQUFDLGVBQWUsRUFBRSxDQUFDO0lBQ3pCLENBQUM7SUFFRCxJQUFJLFVBQVU7UUFDWixPQUFPLElBQUksQ0FBQyxXQUFXLENBQUM7SUFDMUIsQ0FBQztJQWtCRCxlQUFlO1FBQ2IsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUMsZUFBZSxFQUFFLENBQUM7SUFDeEMsQ0FBQztJQUVELGVBQWU7UUFDYixNQUFNLE9BQU8sR0FBRyxFQUFFLENBQUM7UUFDbkIsTUFBTSxzQkFBc0IsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUMsY0FBYyxDQUFDO1FBQzVFLEtBQUssSUFBSSxDQUFDLEdBQUcsQ0FBQyxFQUFFLENBQUMsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLE1BQU0sRUFBRSxDQUFDLElBQUksc0JBQXNCLEVBQUU7WUFDdkUsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxLQUFLLENBQUMsQ0FBQyxFQUFFLENBQUMsR0FBRyxzQkFBc0IsQ0FBQyxDQUFDO1lBQ25FLE9BQU8sQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7U0FDckI7UUFDRCxPQUFPLE9BQU8sQ0FBQztJQUNqQixDQUFDO0lBRUQsYUFBYSxDQUFDLEdBQWdCO1FBQzVCLElBQUksQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO0lBQ2hDLENBQUM7OztZQWpERixTQUFTLFNBQUM7Z0JBQ1QsUUFBUSxFQUFFLFlBQVk7Z0JBQ3RCLHdpQ0FBc0M7Z0JBQ3RDLGFBQWEsRUFBRSxpQkFBaUIsQ0FBQyxJQUFJO2FBQ3RDOzs7O3lCQUdFLEtBQUs7d0JBWUwsS0FBSzs2QkFFTCxLQUFLO21DQUVMLEtBQUs7NkJBR0wsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQsIFRlbXBsYXRlUmVmLCBWaWV3RW5jYXBzdWxhdGlvbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmV4cG9ydCB0eXBlIEltYWdlU291cmNlID0gc3RyaW5nO1xuZXhwb3J0IHR5cGUgSW1hZ2VBbHQgPSBzdHJpbmc7XG5cbmV4cG9ydCB0eXBlIE1vc2FpY0ltYWdlID0ge1xuICBzcmM6IEltYWdlU291cmNlLFxuICBhbHQ6IEltYWdlQWx0XG59XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3dhYy1tb3NhaWMnLFxuICB0ZW1wbGF0ZVVybDogJy4vbW9zYWljLmNvbXBvbmVudC5odG1sJyxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZVxufSlcbmV4cG9ydCBjbGFzcyBNb3NhaWNDb21wb25lbnQge1xuXG4gIEBJbnB1dCgpXG4gIHNldCBpbWFnZXNMaXN0KGltYWdlc0xpc3Q6IE1vc2FpY0ltYWdlW10pIHtcbiAgICB0aGlzLl9pbWFnZXNMaXN0ID0gaW1hZ2VzTGlzdDtcbiAgICB0aGlzLmdlbmVyYXRlQ29sdW1ucygpO1xuICB9XG5cbiAgZ2V0IGltYWdlc0xpc3QoKTogTW9zYWljSW1hZ2VbXSB7XG4gICAgcmV0dXJuIHRoaXMuX2ltYWdlc0xpc3Q7XG4gIH1cblxuICBfaW1hZ2VzTGlzdDogTW9zYWljSW1hZ2VbXSA9IFtdO1xuXG4gIEBJbnB1dCgpIGlzTG9hZGluZyA9IGZhbHNlO1xuXG4gIEBJbnB1dCgpIG51bWJlck9mQ29sdW1uID0gMztcblxuICBASW5wdXQoKVxuICBpbXBvcnRCdXR0b25UZW1wbGF0ZTogVGVtcGxhdGVSZWY8YW55PjtcblxuICBAT3V0cHV0KClcbiAgaW1wb3J0SW1hZ2VTcmMgPSBuZXcgRXZlbnRFbWl0dGVyPEltYWdlU291cmNlPigpO1xuXG4gIGNvbHVtbnM6IE1vc2FpY0ltYWdlW11bXTtcblxuICBjb25zdHJ1Y3RvcigpIHsgfVxuXG4gIGdlbmVyYXRlQ29sdW1ucygpIHtcbiAgICB0aGlzLmNvbHVtbnMgPSB0aGlzLnNsaWNlSW50b0NodW5rcygpO1xuICB9XG5cbiAgc2xpY2VJbnRvQ2h1bmtzKCk6IE1vc2FpY0ltYWdlW11bXSB7IC8vIGh0dHBzOi8vc3RhY2tvdmVyZmxvdy5jb20vcXVlc3Rpb25zLzg0OTU2ODcvc3BsaXQtYXJyYXktaW50by1jaHVua3NcbiAgICBjb25zdCBjb2x1bW5zID0gW107XG4gICAgY29uc3QgbnVtYmVyT2ZJbWFnZVBlckNvbHVtbiA9IHRoaXMuaW1hZ2VzTGlzdC5sZW5ndGggLyB0aGlzLm51bWJlck9mQ29sdW1uO1xuICAgIGZvciAobGV0IGkgPSAwOyBpIDwgdGhpcy5pbWFnZXNMaXN0Lmxlbmd0aDsgaSArPSBudW1iZXJPZkltYWdlUGVyQ29sdW1uKSB7XG4gICAgICBjb25zdCBjaHVuayA9IHRoaXMuaW1hZ2VzTGlzdC5zbGljZShpLCBpICsgbnVtYmVyT2ZJbWFnZVBlckNvbHVtbik7XG4gICAgICBjb2x1bW5zLnB1c2goY2h1bmspO1xuICAgIH1cbiAgICByZXR1cm4gY29sdW1ucztcbiAgfVxuXG4gIG9uSW1wb3J0SW1hZ2Uoc3JjOiBJbWFnZVNvdXJjZSkge1xuICAgIHRoaXMuaW1wb3J0SW1hZ2VTcmMuZW1pdChzcmMpO1xuICB9XG59XG4iXX0=
|
|
@@ -46,7 +46,7 @@ export class TextAreaComponent {
|
|
|
46
46
|
TextAreaComponent.decorators = [
|
|
47
47
|
{ type: Component, args: [{
|
|
48
48
|
selector: 'wac-text-area',
|
|
49
|
-
template: "<div class=\"field wac-text-area\" [ngClass]=\"{'dynamic': dynamicSize}\">\n <div class=\"field-label is-normal has-text-left\">\n <label class=\"label has-text-weight-normal\" [innerHTML]=\"label\" [for]=\"id\"></label>\n </div>\n <div class=\"field-body\">\n <div class=\"field\">\n <p class=\"control\" [ngClass]=\"{ 'has-icons-right': textError }\">\n <textarea\n class=\"textarea\"\n [id]=\"id\"\n [ngClass]=\"{ 'is-danger': textError, 'has-help-text': textInfo != '' || size }\"\n [placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [(ngModel)]=\"value\"\n (ngModelChange)=\"onChange($event)\"\n (blur)=\"onBlur()\"\n [disabled]=\"disabled\"\n [autosize]=\"dynamicSize\"\n [onlyGrow]=\"true\"\n [maxlength]=\"maxlength ? maxlength : 524288\"\n ></textarea>\n\n <span *ngIf=\"textError\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n <span\n *ngIf=\"textInfo && (textError === null || textError === '')\"\n class=\"is-size-7 wac-text-area__info text-info\"\n [innerHtml]=\"textInfo\"\n ></span>\n <span *ngIf=\"textError\" class=\"is-size-7 wac-text-area__error has-text-danger\" [innerHtml]=\"textError\"></span>\n <span\n *ngIf=\"size && !progressBar\"\n class=\"is-size-7 wac-text-area__size\"\n [ngClass]=\"value
|
|
49
|
+
template: "<div class=\"field wac-text-area\" [ngClass]=\"{'dynamic': dynamicSize}\">\n <div class=\"field-label is-normal has-text-left\">\n <label class=\"label has-text-weight-normal\" [innerHTML]=\"label\" [for]=\"id\"></label>\n </div>\n <div class=\"field-body\">\n <div class=\"field\">\n <p class=\"control\" [ngClass]=\"{ 'has-icons-right': textError }\">\n <textarea\n class=\"textarea\"\n [id]=\"id\"\n [ngClass]=\"{ 'is-danger': textError, 'has-help-text': textInfo != '' || size }\"\n [placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [(ngModel)]=\"value\"\n (ngModelChange)=\"onChange($event)\"\n (blur)=\"onBlur()\"\n [disabled]=\"disabled\"\n [autosize]=\"dynamicSize\"\n [onlyGrow]=\"true\"\n [maxlength]=\"maxlength ? maxlength : 524288\"\n [minlength]=\"minlength ? minlength : 0\"\n ></textarea>\n\n <span *ngIf=\"textError\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n <span\n *ngIf=\"textInfo && (textError === null || textError === '')\"\n class=\"is-size-7 wac-text-area__info text-info\"\n [innerHtml]=\"textInfo\"\n ></span>\n <span *ngIf=\"textError\" class=\"is-size-7 wac-text-area__error has-text-danger\" [innerHtml]=\"textError\"></span>\n <span\n *ngIf=\"size && !progressBar\"\n class=\"is-size-7 wac-text-area__size\"\n [ngClass]=\"value.length > size ? 'has-text-danger' : ''\"\n >{{ value ? value.length : 0 }}/{{ size }}</span\n >\n </p>\n <wac-progress-bar *ngIf=\"progressBar && value\" [min]=\"min\" [max]=\"max\" [valueLength]=\"value.length\"></wac-progress-bar>\n </div>\n </div>\n</div>\n",
|
|
50
50
|
providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: TextAreaComponent, multi: true }]
|
|
51
51
|
},] }
|
|
52
52
|
];
|
|
@@ -58,10 +58,11 @@ TextAreaComponent.propDecorators = {
|
|
|
58
58
|
textError: [{ type: Input }],
|
|
59
59
|
size: [{ type: Input }],
|
|
60
60
|
min: [{ type: Input }],
|
|
61
|
-
maxlength: [{ type: Input }],
|
|
62
61
|
max: [{ type: Input }],
|
|
63
62
|
dynamicSize: [{ type: Input }],
|
|
64
63
|
progressBar: [{ type: Input }],
|
|
65
|
-
disabled: [{ type: Input }]
|
|
64
|
+
disabled: [{ type: Input }],
|
|
65
|
+
maxlength: [{ type: Input }],
|
|
66
|
+
minlength: [{ type: Input }]
|
|
66
67
|
};
|
|
67
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
68
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGV4dC1hcmVhLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2FuZ3VsYXItY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvdGV4dC1hcmVhL3RleHQtYXJlYS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDakQsT0FBTyxFQUF3QixpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBUXpFLE1BQU0sT0FBTyxpQkFBaUI7SUFOOUI7UUFPRSx5Q0FBeUM7UUFFekMsVUFBSyxHQUFHLEVBQUUsQ0FBQztRQUVYLFVBQUssR0FBRyxFQUFFLENBQUM7UUFFWCxnQkFBVyxHQUFHLEVBQUUsQ0FBQztRQUVqQixhQUFRLEdBQUcsSUFBSSxDQUFDO1FBRWhCLGNBQVMsR0FBRyxJQUFJLENBQUM7UUFFakIsU0FBSSxHQUFHLElBQUksQ0FBQztRQUVaLFFBQUcsR0FBRyxJQUFJLENBQUM7UUFFWCxRQUFHLEdBQUcsSUFBSSxDQUFDO1FBRVgsZ0JBQVcsR0FBRyxLQUFLLENBQUM7UUFFcEIsZ0JBQVcsR0FBRyxLQUFLLENBQUM7UUFFcEIsYUFBUSxHQUFHLEtBQUssQ0FBQztRQU1qQixPQUFFLEdBQ0EsZ0JBQWdCO1lBQ2hCLElBQUksQ0FBQyxNQUFNLEVBQUU7aUJBQ1YsUUFBUSxDQUFDLEVBQUUsQ0FBQztpQkFDWixNQUFNLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDO0lBaUNwQixDQUFDO0lBNUJDLGdCQUFnQixDQUFDLEVBQU87UUFDdEIsSUFBSSxDQUFDLFNBQVMsR0FBRyxFQUFFLENBQUM7SUFDdEIsQ0FBQztJQUVELGlCQUFpQixDQUFDLEVBQU87UUFDdkIsSUFBSSxDQUFDLFVBQVUsR0FBRyxFQUFFLENBQUM7SUFDdkIsQ0FBQztJQUVELGdCQUFnQixDQUFDLFVBQW1CO1FBQ2xDLElBQUksQ0FBQyxRQUFRLEdBQUcsVUFBVSxDQUFDO0lBQzdCLENBQUM7SUFFRCxVQUFVLENBQUMsR0FBUTtRQUNqQixJQUFJLENBQUMsS0FBSyxHQUFHLEdBQUcsQ0FBQztJQUNuQixDQUFDO0lBRUQsUUFBUSxDQUFDLEtBQUs7UUFDWixJQUFJLElBQUksQ0FBQyxTQUFTLEVBQUU7WUFDbEIsSUFBSSxDQUFDLFNBQVMsQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUN0QixJQUFJLENBQUMsVUFBVSxDQUFDLEtBQUssQ0FBQyxDQUFDO1NBQ3hCO0lBQ0gsQ0FBQztJQUVELE1BQU07UUFDSixJQUFJLElBQUksQ0FBQyxVQUFVLEVBQUU7WUFDbkIsSUFBSSxDQUFDLFVBQVUsRUFBRSxDQUFDO1NBQ25CO0lBQ0gsQ0FBQzs7O1lBdkVGLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUsZUFBZTtnQkFDekIsODBEQUF5QztnQkFFekMsU0FBUyxFQUFFLENBQUMsRUFBRSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsV0FBVyxFQUFFLGlCQUFpQixFQUFFLEtBQUssRUFBRSxJQUFJLEVBQUUsQ0FBQzthQUN6Rjs7O29CQUdFLEtBQUs7b0JBRUwsS0FBSzswQkFFTCxLQUFLO3VCQUVMLEtBQUs7d0JBRUwsS0FBSzttQkFFTCxLQUFLO2tCQUVMLEtBQUs7a0JBRUwsS0FBSzswQkFFTCxLQUFLOzBCQUVMLEtBQUs7dUJBRUwsS0FBSzt3QkFFTCxLQUFLO3dCQUVMLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb250cm9sVmFsdWVBY2Nlc3NvciwgTkdfVkFMVUVfQUNDRVNTT1IgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3dhYy10ZXh0LWFyZWEnLFxuICB0ZW1wbGF0ZVVybDogJy4vdGV4dC1hcmVhLmNvbXBvbmVudC5odG1sJyxcblxuICBwcm92aWRlcnM6IFt7IHByb3ZpZGU6IE5HX1ZBTFVFX0FDQ0VTU09SLCB1c2VFeGlzdGluZzogVGV4dEFyZWFDb21wb25lbnQsIG11bHRpOiB0cnVlIH1dXG59KVxuZXhwb3J0IGNsYXNzIFRleHRBcmVhQ29tcG9uZW50IGltcGxlbWVudHMgQ29udHJvbFZhbHVlQWNjZXNzb3Ige1xuICAvLyB0b2RvIHNpbXBsaWZ5IGFuZCBpbXByb3ZlIHByb2dyZXNzIGJhclxuICBASW5wdXQoKVxuICBsYWJlbCA9ICcnO1xuICBASW5wdXQoKVxuICB2YWx1ZSA9ICcnO1xuICBASW5wdXQoKVxuICBwbGFjZWhvbGRlciA9ICcnO1xuICBASW5wdXQoKVxuICB0ZXh0SW5mbyA9IG51bGw7XG4gIEBJbnB1dCgpXG4gIHRleHRFcnJvciA9IG51bGw7XG4gIEBJbnB1dCgpXG4gIHNpemUgPSBudWxsO1xuICBASW5wdXQoKVxuICBtaW4gPSBudWxsO1xuICBASW5wdXQoKVxuICBtYXggPSBudWxsO1xuICBASW5wdXQoKVxuICBkeW5hbWljU2l6ZSA9IGZhbHNlO1xuICBASW5wdXQoKVxuICBwcm9ncmVzc0JhciA9IGZhbHNlO1xuICBASW5wdXQoKVxuICBkaXNhYmxlZCA9IGZhbHNlO1xuICBASW5wdXQoKVxuICBtYXhsZW5ndGg6IG51bWJlciB8IHN0cmluZztcbiAgQElucHV0KClcbiAgbWlubGVuZ3RoOiBudW1iZXIgfCBzdHJpbmc7XG5cbiAgaWQgPVxuICAgICd3YWMtdGV4dGFyZWFfXycgK1xuICAgIE1hdGgucmFuZG9tKClcbiAgICAgIC50b1N0cmluZygzNilcbiAgICAgIC5zdWJzdHIoMiwgOSk7XG5cbiAgcHJpdmF0ZSBfb25DaGFuZ2U6IEZ1bmN0aW9uO1xuICBwcml2YXRlIF9vblRvdWNoZWQ6IEZ1bmN0aW9uO1xuXG4gIHJlZ2lzdGVyT25DaGFuZ2UoZm46IGFueSk6IHZvaWQge1xuICAgIHRoaXMuX29uQ2hhbmdlID0gZm47XG4gIH1cblxuICByZWdpc3Rlck9uVG91Y2hlZChmbjogYW55KTogdm9pZCB7XG4gICAgdGhpcy5fb25Ub3VjaGVkID0gZm47XG4gIH1cblxuICBzZXREaXNhYmxlZFN0YXRlKGlzRGlzYWJsZWQ6IGJvb2xlYW4pOiB2b2lkIHtcbiAgICB0aGlzLmRpc2FibGVkID0gaXNEaXNhYmxlZDtcbiAgfVxuXG4gIHdyaXRlVmFsdWUob2JqOiBhbnkpOiB2b2lkIHtcbiAgICB0aGlzLnZhbHVlID0gb2JqO1xuICB9XG5cbiAgb25DaGFuZ2UodmFsdWUpIHtcbiAgICBpZiAodGhpcy5fb25DaGFuZ2UpIHtcbiAgICAgIHRoaXMuX29uQ2hhbmdlKHZhbHVlKTtcbiAgICAgIHRoaXMud3JpdGVWYWx1ZSh2YWx1ZSk7XG4gICAgfVxuICB9XG5cbiAgb25CbHVyKCkge1xuICAgIGlmICh0aGlzLl9vblRvdWNoZWQpIHtcbiAgICAgIHRoaXMuX29uVG91Y2hlZCgpO1xuICAgIH1cbiAgfVxufVxuIl19
|
|
@@ -9,11 +9,12 @@ export class WrapperSidebarComponent {
|
|
|
9
9
|
WrapperSidebarComponent.decorators = [
|
|
10
10
|
{ type: Component, args: [{
|
|
11
11
|
selector: 'wac-wrapper-sidebar',
|
|
12
|
-
template: "<div class=\"wac-wrapper-sidebar\" [ngClass]=\"{'reverse': reverse}\">\n <div class=\"wac-wrapper-sidebar__left\">\n <ng-content select=\"[sidebar]\"></ng-content>\n </div>\n <div class=\"wac-wrapper-sidebar__right\">\n <ng-content select=\"[content]\"></ng-content>\n </div>\n</div>\n"
|
|
12
|
+
template: "<div class=\"wac-wrapper-sidebar\" [ngClass]=\"{'reverse': reverse}\">\n <div class=\"wac-wrapper-sidebar__left\">\n <ng-content select=\"[sidebar]\"></ng-content>\n </div>\n <div class=\"wac-wrapper-sidebar__right\" [style.backgroundImage]=\"'url(' + backgroundGrey + ')'\">\n <ng-content select=\"[content]\"></ng-content>\n </div>\n</div>\n"
|
|
13
13
|
},] }
|
|
14
14
|
];
|
|
15
15
|
WrapperSidebarComponent.ctorParameters = () => [];
|
|
16
16
|
WrapperSidebarComponent.propDecorators = {
|
|
17
|
-
reverse: [{ type: Input }]
|
|
17
|
+
reverse: [{ type: Input }],
|
|
18
|
+
backgroundGrey: [{ type: Input }]
|
|
18
19
|
};
|
|
19
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
20
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid3JhcHBlci1zaWRlYmFyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2FuZ3VsYXItY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvd3JhcHBlci1zaWRlYmFyL3dyYXBwZXItc2lkZWJhci5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxLQUFLLEVBQVMsTUFBTSxlQUFlLENBQUM7QUFNdkQsTUFBTSxPQUFPLHVCQUF1QjtJQUtsQztRQUhTLFlBQU8sR0FBRyxLQUFLLENBQUM7SUFHVCxDQUFDO0lBRWpCLFFBQVE7SUFDUixDQUFDOzs7WUFaRixTQUFTLFNBQUM7Z0JBQ1QsUUFBUSxFQUFFLHFCQUFxQjtnQkFDL0IsNldBQStDO2FBQ2hEOzs7O3NCQUdFLEtBQUs7NkJBQ0wsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tcG9uZW50LCBJbnB1dCwgT25Jbml0fSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnd2FjLXdyYXBwZXItc2lkZWJhcicsXG4gIHRlbXBsYXRlVXJsOiAnLi93cmFwcGVyLXNpZGViYXIuY29tcG9uZW50Lmh0bWwnXG59KVxuZXhwb3J0IGNsYXNzIFdyYXBwZXJTaWRlYmFyQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcblxuICBASW5wdXQoKSByZXZlcnNlID0gZmFsc2U7XG4gIEBJbnB1dCgpIGJhY2tncm91bmRHcmV5OiBzdHJpbmc7XG5cbiAgY29uc3RydWN0b3IoKSB7IH1cblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgfVxuXG59XG4iXX0=
|
|
@@ -1643,7 +1643,7 @@ class TextAreaComponent {
|
|
|
1643
1643
|
TextAreaComponent.decorators = [
|
|
1644
1644
|
{ type: Component, args: [{
|
|
1645
1645
|
selector: 'wac-text-area',
|
|
1646
|
-
template: "<div class=\"field wac-text-area\" [ngClass]=\"{'dynamic': dynamicSize}\">\n <div class=\"field-label is-normal has-text-left\">\n <label class=\"label has-text-weight-normal\" [innerHTML]=\"label\" [for]=\"id\"></label>\n </div>\n <div class=\"field-body\">\n <div class=\"field\">\n <p class=\"control\" [ngClass]=\"{ 'has-icons-right': textError }\">\n <textarea\n class=\"textarea\"\n [id]=\"id\"\n [ngClass]=\"{ 'is-danger': textError, 'has-help-text': textInfo != '' || size }\"\n [placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [(ngModel)]=\"value\"\n (ngModelChange)=\"onChange($event)\"\n (blur)=\"onBlur()\"\n [disabled]=\"disabled\"\n [autosize]=\"dynamicSize\"\n [onlyGrow]=\"true\"\n [maxlength]=\"maxlength ? maxlength : 524288\"\n ></textarea>\n\n <span *ngIf=\"textError\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n <span\n *ngIf=\"textInfo && (textError === null || textError === '')\"\n class=\"is-size-7 wac-text-area__info text-info\"\n [innerHtml]=\"textInfo\"\n ></span>\n <span *ngIf=\"textError\" class=\"is-size-7 wac-text-area__error has-text-danger\" [innerHtml]=\"textError\"></span>\n <span\n *ngIf=\"size && !progressBar\"\n class=\"is-size-7 wac-text-area__size\"\n [ngClass]=\"value
|
|
1646
|
+
template: "<div class=\"field wac-text-area\" [ngClass]=\"{'dynamic': dynamicSize}\">\n <div class=\"field-label is-normal has-text-left\">\n <label class=\"label has-text-weight-normal\" [innerHTML]=\"label\" [for]=\"id\"></label>\n </div>\n <div class=\"field-body\">\n <div class=\"field\">\n <p class=\"control\" [ngClass]=\"{ 'has-icons-right': textError }\">\n <textarea\n class=\"textarea\"\n [id]=\"id\"\n [ngClass]=\"{ 'is-danger': textError, 'has-help-text': textInfo != '' || size }\"\n [placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [(ngModel)]=\"value\"\n (ngModelChange)=\"onChange($event)\"\n (blur)=\"onBlur()\"\n [disabled]=\"disabled\"\n [autosize]=\"dynamicSize\"\n [onlyGrow]=\"true\"\n [maxlength]=\"maxlength ? maxlength : 524288\"\n [minlength]=\"minlength ? minlength : 0\"\n ></textarea>\n\n <span *ngIf=\"textError\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n <span\n *ngIf=\"textInfo && (textError === null || textError === '')\"\n class=\"is-size-7 wac-text-area__info text-info\"\n [innerHtml]=\"textInfo\"\n ></span>\n <span *ngIf=\"textError\" class=\"is-size-7 wac-text-area__error has-text-danger\" [innerHtml]=\"textError\"></span>\n <span\n *ngIf=\"size && !progressBar\"\n class=\"is-size-7 wac-text-area__size\"\n [ngClass]=\"value.length > size ? 'has-text-danger' : ''\"\n >{{ value ? value.length : 0 }}/{{ size }}</span\n >\n </p>\n <wac-progress-bar *ngIf=\"progressBar && value\" [min]=\"min\" [max]=\"max\" [valueLength]=\"value.length\"></wac-progress-bar>\n </div>\n </div>\n</div>\n",
|
|
1647
1647
|
providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: TextAreaComponent, multi: true }]
|
|
1648
1648
|
},] }
|
|
1649
1649
|
];
|
|
@@ -1655,11 +1655,12 @@ TextAreaComponent.propDecorators = {
|
|
|
1655
1655
|
textError: [{ type: Input }],
|
|
1656
1656
|
size: [{ type: Input }],
|
|
1657
1657
|
min: [{ type: Input }],
|
|
1658
|
-
maxlength: [{ type: Input }],
|
|
1659
1658
|
max: [{ type: Input }],
|
|
1660
1659
|
dynamicSize: [{ type: Input }],
|
|
1661
1660
|
progressBar: [{ type: Input }],
|
|
1662
|
-
disabled: [{ type: Input }]
|
|
1661
|
+
disabled: [{ type: Input }],
|
|
1662
|
+
maxlength: [{ type: Input }],
|
|
1663
|
+
minlength: [{ type: Input }]
|
|
1663
1664
|
};
|
|
1664
1665
|
|
|
1665
1666
|
class H1Component {
|
|
@@ -1820,7 +1821,7 @@ class InputComponent {
|
|
|
1820
1821
|
InputComponent.decorators = [
|
|
1821
1822
|
{ type: Component, args: [{
|
|
1822
1823
|
selector: 'wac-input',
|
|
1823
|
-
template: "<div\n class=\"field wac-input\"\n [ngClass]=\"{ 'has-no-block': withoutBlock, 'is-big': big, 'is-medium': medium, 'with-padding': padding, 'indication-left': indicationLeft, 'with-progress-bar': progressBar }\"\n>\n <div class=\"field-label is-normal has-text-left\" *ngIf=\"!withoutBlock\">\n <label\n [ngClass]=\"[boldLabel == 'true' ? 'label has-text-weight-bold' : 'label has-text-weight-normal', showTooltip ? 'label-inline' : '']\"\n [innerHTML]=\"label\"\n [for]=\"id\"\n ></label>\n <wac-tooltip\n *ngIf=\"showTooltip\"\n [tooltipIcon]=\"iconTooltip\"\n [tooltipText]=\"textTooltip\"\n [tooltipLink]=\"linkTooltip\"\n [tooltipUrl]=\"urlTooltip\"\n ></wac-tooltip>\n <!-- Size -->\n <span *ngIf=\"
|
|
1824
|
+
template: "<div\n class=\"field wac-input\"\n [ngClass]=\"{ 'has-no-block': withoutBlock, 'is-big': big, 'is-medium': medium, 'with-padding': padding, 'indication-left': indicationLeft, 'with-progress-bar': progressBar }\"\n>\n <div class=\"field-label is-normal has-text-left\" *ngIf=\"!withoutBlock\">\n <label\n [ngClass]=\"[boldLabel == 'true' ? 'label has-text-weight-bold' : 'label has-text-weight-normal', showTooltip ? 'label-inline' : '']\"\n [innerHTML]=\"label\"\n [for]=\"id\"\n ></label>\n <wac-tooltip\n *ngIf=\"showTooltip\"\n [tooltipIcon]=\"iconTooltip\"\n [tooltipText]=\"textTooltip\"\n [tooltipLink]=\"linkTooltip\"\n [tooltipUrl]=\"urlTooltip\"\n ></wac-tooltip>\n <!-- Size -->\n <span *ngIf=\"size && !progressBar\" class=\"is-size-7 wac-input__size\">\n <strong>{{ value.toString().length }}</strong> / {{ size }}\n </span>\n </div>\n <div class=\"field-body\">\n <div class=\"field\">\n <p\n class=\"control\"\n [ngClass]=\"{ 'has-icons-right': textError || success, 'has-icons-left': icon !== '', 'has-input-group': textAppend || textPrepend }\"\n >\n <!-- Text Prepend -->\n <span *ngIf=\"textPrepend\" class=\"has-input-group\">\n <span class=\"has-input-group-text prepend\">{{ textPrepend }}</span>\n <span *ngIf=\"icon !== ''\" class=\"icon is-small is-left\">\n <i [class]=\"icon\"></i>\n </span>\n </span>\n\n <!-- Input -->\n <input\n [class]=\"'input ' + extraClasses\"\n [id]=\"id\"\n [ngClass]=\"{\n 'is-danger': textError,\n 'is-large': big,\n 'is-number': isNumber,\n 'remove-margin': disableMargin,\n 'text-append': textAppend\n }\"\n [type]=\"type\"\n [placeholder]=\"placeholder\"\n [attr.size]=\"size\"\n [(ngModel)]=\"value\"\n (ngModelChange)=\"onChange($event)\"\n (blur)=\"onBlur()\"\n [disabled]=\"disabled\"\n (focusout)=\"onFocusOut()\"\n [min]=\"min\"\n [max]=\"max\"\n [maxlength]=\"maxlength ? maxlength : 524288\"\n [minlength]=\"minlength ? minlength : 0\"\n (keypress)=\"keyPress($event)\"\n />\n\n <!-- Indication at the end of the input -->\n <span class=\"indication\" *ngIf=\"indication\" [ngClass]=\"{'reverse': indicationLeft}\">\n <span [innerHTML]=\"indication\"></span>\n </span>\n\n <!-- Text Append -->\n <span *ngIf=\"textAppend && !indicationLeft\" class=\"has-input-group\">\n <span class=\"has-input-group-text append\">{{ textAppend }}</span>\n <!-- error if text append not empty -->\n <span *ngIf=\"textError\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n </span>\n\n <!-- Icon Left -->\n <span *ngIf=\"icon !== '' && !textPrepend && !indicationLeft\" class=\"icon is-small is-left\">\n <i [class]=\"icon\"></i>\n </span>\n\n <!-- Icon error if textAppend empty -->\n <span *ngIf=\"textError && !textAppend && !indicationLeft\" class=\"icon is-small is-right\">\n <i class=\"fal fa-times has-text-danger\"></i>\n </span>\n\n <!-- Icon success -->\n <span *ngIf=\"success\" class=\"icon is-small is-right\">\n <i class=\"fas fa-check has-text-success\"></i>\n </span>\n\n <!-- Text Info -->\n <span\n *ngIf=\"textInfo && (textError === null || textError === '') && !progressBar && !indicationLeft\"\n class=\"is-size-7 wac-input__info text-info\"\n [innerHtml]=\"textInfo\"\n ></span>\n\n <!-- Text Error -->\n <span *ngIf=\"textError && !progressBar && !indicationLeft\" class=\"is-size-7 wac-input__error has-text-danger\" [innerHtml]=\"textError\"></span>\n </p>\n\n <!-- Progress Bar -->\n <wac-progress-bar *ngIf=\"progressBar && !indicationLeft\" [min]=\"min\" [max]=\"max\" [valueLength]=\"value.length\"></wac-progress-bar>\n </div>\n </div>\n</div>\n",
|
|
1824
1825
|
providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: InputComponent, multi: true }]
|
|
1825
1826
|
},] }
|
|
1826
1827
|
];
|
|
@@ -1855,6 +1856,8 @@ InputComponent.propDecorators = {
|
|
|
1855
1856
|
disabled: [{ type: Input }],
|
|
1856
1857
|
indication: [{ type: Input }],
|
|
1857
1858
|
success: [{ type: Input }],
|
|
1859
|
+
maxlength: [{ type: Input }],
|
|
1860
|
+
minlength: [{ type: Input }],
|
|
1858
1861
|
indicationLeft: [{ type: Input }],
|
|
1859
1862
|
keypressEnter: [{ type: Output }]
|
|
1860
1863
|
};
|
|
@@ -3688,12 +3691,13 @@ class WrapperSidebarComponent {
|
|
|
3688
3691
|
WrapperSidebarComponent.decorators = [
|
|
3689
3692
|
{ type: Component, args: [{
|
|
3690
3693
|
selector: 'wac-wrapper-sidebar',
|
|
3691
|
-
template: "<div class=\"wac-wrapper-sidebar\" [ngClass]=\"{'reverse': reverse}\">\n <div class=\"wac-wrapper-sidebar__left\">\n <ng-content select=\"[sidebar]\"></ng-content>\n </div>\n <div class=\"wac-wrapper-sidebar__right\">\n <ng-content select=\"[content]\"></ng-content>\n </div>\n</div>\n"
|
|
3694
|
+
template: "<div class=\"wac-wrapper-sidebar\" [ngClass]=\"{'reverse': reverse}\">\n <div class=\"wac-wrapper-sidebar__left\">\n <ng-content select=\"[sidebar]\"></ng-content>\n </div>\n <div class=\"wac-wrapper-sidebar__right\" [style.backgroundImage]=\"'url(' + backgroundGrey + ')'\">\n <ng-content select=\"[content]\"></ng-content>\n </div>\n</div>\n"
|
|
3692
3695
|
},] }
|
|
3693
3696
|
];
|
|
3694
3697
|
WrapperSidebarComponent.ctorParameters = () => [];
|
|
3695
3698
|
WrapperSidebarComponent.propDecorators = {
|
|
3696
|
-
reverse: [{ type: Input }]
|
|
3699
|
+
reverse: [{ type: Input }],
|
|
3700
|
+
backgroundGrey: [{ type: Input }]
|
|
3697
3701
|
};
|
|
3698
3702
|
|
|
3699
3703
|
class BreadcrumbsComponent {
|
|
@@ -3786,6 +3790,7 @@ class BlockWithCheckboxComponent {
|
|
|
3786
3790
|
this.checkboxAction = new EventEmitter();
|
|
3787
3791
|
this.nameRadio = 'wacBlockCheckboxRadio';
|
|
3788
3792
|
this.isFirst = false;
|
|
3793
|
+
this.opacity = '.45';
|
|
3789
3794
|
}
|
|
3790
3795
|
ngOnInit() {
|
|
3791
3796
|
this.randomLabelName = 'radioBlock' + Math.random() * (900 - 700) + 700;
|
|
@@ -3809,7 +3814,7 @@ class BlockWithCheckboxComponent {
|
|
|
3809
3814
|
BlockWithCheckboxComponent.decorators = [
|
|
3810
3815
|
{ type: Component, args: [{
|
|
3811
3816
|
selector: 'wac-block-with-checkbox',
|
|
3812
|
-
template: "<div class=\"block-with-checkbox\" [ngClass]=\"{'selected': inputRadioA.checked, 'firstWacRadioBLock': isFirst}\" (mouseover)=\"removeFirstClass()\">\n <div class=\"block-with-checkbox__left\" (click)=\"inputRadioA.click()\">\n <div class=\"wac-radio-block\">\n <div class=\"wac-radio__row\">\n <input #inputRadioA [name]=\"nameRadio\" type=\"radio\" [value]=\"selected\" (change)=\"eventSelected($event)\" [id]=\"randomLabelName\">\n <label [for]=\"randomLabelName\"></label>\n </div>\n </div>\n </div>\n <div class=\"block-with-checkbox__center\" (click)=\"inputRadioA.click()\">\n <ng-content></ng-content>\n </div>\n <div class=\"block-with-checkbox__right\">\n <div><wac-button extraClasses=\"is-blue opacity static-width\" [iconFontSize]=\"18\" [icon]=\"iconCopy\" (click)=\"eventCopy()\"></wac-button></div>\n <div><wac-button extraClasses=\"is-green opacity static-width\" [iconFontSize]=\"18\" [icon]=\"iconWorld\" (click)=\"eventWorld()\"></wac-button></div>\n </div>\n</div>\n"
|
|
3817
|
+
template: "<div class=\"block-with-checkbox\" [ngClass]=\"{'selected': inputRadioA.checked, 'firstWacRadioBLock': isFirst}\" [style.opacity]=\"opacity\" (mouseover)=\"removeFirstClass()\">\n <div class=\"block-with-checkbox__left\" (click)=\"inputRadioA.click()\">\n <div class=\"wac-radio-block\">\n <div class=\"wac-radio__row\">\n <input #inputRadioA [name]=\"nameRadio\" type=\"radio\" [value]=\"selected\" (change)=\"eventSelected($event)\" [id]=\"randomLabelName\">\n <label [for]=\"randomLabelName\"></label>\n </div>\n </div>\n </div>\n <div class=\"block-with-checkbox__center\" (click)=\"inputRadioA.click()\">\n <ng-content></ng-content>\n </div>\n <div class=\"block-with-checkbox__right\">\n <div><wac-button extraClasses=\"is-blue opacity static-width\" [iconFontSize]=\"18\" [icon]=\"iconCopy\" (click)=\"eventCopy()\"></wac-button></div>\n <div><wac-button extraClasses=\"is-green opacity static-width\" [iconFontSize]=\"18\" [icon]=\"iconWorld\" (click)=\"eventWorld()\"></wac-button></div>\n </div>\n</div>\n"
|
|
3813
3818
|
},] }
|
|
3814
3819
|
];
|
|
3815
3820
|
BlockWithCheckboxComponent.ctorParameters = () => [];
|
|
@@ -3821,7 +3826,8 @@ BlockWithCheckboxComponent.propDecorators = {
|
|
|
3821
3826
|
worldAction: [{ type: Output }],
|
|
3822
3827
|
checkboxAction: [{ type: Output }],
|
|
3823
3828
|
nameRadio: [{ type: Input }],
|
|
3824
|
-
isFirst: [{ type: Input }]
|
|
3829
|
+
isFirst: [{ type: Input }],
|
|
3830
|
+
opacity: [{ type: Input }]
|
|
3825
3831
|
};
|
|
3826
3832
|
|
|
3827
3833
|
class ConfirmDeleteComponent {
|
|
@@ -3861,42 +3867,48 @@ ConfirmDeleteComponent.propDecorators = {
|
|
|
3861
3867
|
|
|
3862
3868
|
class MosaicComponent {
|
|
3863
3869
|
constructor() {
|
|
3864
|
-
this.
|
|
3865
|
-
this.import = new EventEmitter();
|
|
3866
|
-
}
|
|
3867
|
-
ngOnInit() {
|
|
3868
|
-
if (this.items) {
|
|
3869
|
-
const splitItems = this.sliceIntoChunks(this.items, (this.items.length / 3));
|
|
3870
|
-
this.columnLeft = splitItems[0];
|
|
3871
|
-
this.columnCenter = splitItems[1];
|
|
3872
|
-
this.columnRight = splitItems[2];
|
|
3873
|
-
}
|
|
3870
|
+
this._imagesList = [];
|
|
3874
3871
|
this.isLoading = false;
|
|
3872
|
+
this.numberOfColumn = 3;
|
|
3873
|
+
this.importImageSrc = new EventEmitter();
|
|
3874
|
+
}
|
|
3875
|
+
set imagesList(imagesList) {
|
|
3876
|
+
this._imagesList = imagesList;
|
|
3877
|
+
this.generateColumns();
|
|
3875
3878
|
}
|
|
3876
|
-
|
|
3877
|
-
this.
|
|
3879
|
+
get imagesList() {
|
|
3880
|
+
return this._imagesList;
|
|
3878
3881
|
}
|
|
3879
|
-
|
|
3880
|
-
|
|
3881
|
-
|
|
3882
|
-
|
|
3883
|
-
|
|
3882
|
+
generateColumns() {
|
|
3883
|
+
this.columns = this.sliceIntoChunks();
|
|
3884
|
+
}
|
|
3885
|
+
sliceIntoChunks() {
|
|
3886
|
+
const columns = [];
|
|
3887
|
+
const numberOfImagePerColumn = this.imagesList.length / this.numberOfColumn;
|
|
3888
|
+
for (let i = 0; i < this.imagesList.length; i += numberOfImagePerColumn) {
|
|
3889
|
+
const chunk = this.imagesList.slice(i, i + numberOfImagePerColumn);
|
|
3890
|
+
columns.push(chunk);
|
|
3884
3891
|
}
|
|
3885
|
-
return
|
|
3892
|
+
return columns;
|
|
3893
|
+
}
|
|
3894
|
+
onImportImage(src) {
|
|
3895
|
+
this.importImageSrc.emit(src);
|
|
3886
3896
|
}
|
|
3887
3897
|
}
|
|
3888
3898
|
MosaicComponent.decorators = [
|
|
3889
3899
|
{ type: Component, args: [{
|
|
3890
3900
|
selector: 'wac-mosaic',
|
|
3891
|
-
template: "<div class=\"wac-
|
|
3901
|
+
template: "<div class=\"wac-mosaic\" *ngIf=\"!isLoading; else loading\">\n <div class=\"wac-mosaic__wrapper\">\n <div class=\"wac-mosaic__wrapper__column\" *ngFor=\"let column of columns\">\n <div class=\"wac-mosaic__wrapper__column__image\" *ngFor=\"let image of column; let i = index;\">\n <img [src]=\"image.src\" [alt]=\"image.alt\"/>\n <div class=\"hover\">\n <ng-container\n [ngTemplateOutlet]=\"importButtonTemplate || defaultImportButton\"\n [ngTemplateOutletContext]=\"{ $implicit: image }\"\n >\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n<ng-template #defaultImportButton let-image>\n <wac-button [icon]=\"'fa-solid fa-image'\" [label]=\"'wac.MosaicComponent.import' | translate\" [extraClasses]=\"'is-success'\" (click)=\"onImportImage(image.src)\"></wac-button>\n</ng-template>\n\n<ng-template #loading>\n <div class=\"wac-mosaic__loader\" *ngIf=\"isLoading\">\n <wac-loader></wac-loader>\n </div>\n</ng-template>\n",
|
|
3902
|
+
encapsulation: ViewEncapsulation.None
|
|
3892
3903
|
},] }
|
|
3893
3904
|
];
|
|
3894
3905
|
MosaicComponent.ctorParameters = () => [];
|
|
3895
3906
|
MosaicComponent.propDecorators = {
|
|
3896
|
-
|
|
3897
|
-
|
|
3898
|
-
|
|
3899
|
-
|
|
3907
|
+
imagesList: [{ type: Input }],
|
|
3908
|
+
isLoading: [{ type: Input }],
|
|
3909
|
+
numberOfColumn: [{ type: Input }],
|
|
3910
|
+
importButtonTemplate: [{ type: Input }],
|
|
3911
|
+
importImageSrc: [{ type: Output }]
|
|
3900
3912
|
};
|
|
3901
3913
|
|
|
3902
3914
|
const components = [
|