@wizishop/angular-components 0.0.206 → 0.0.207

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.
@@ -3303,6 +3303,16 @@ $wac-subtitle-color: #7A87A1!default;
3303
3303
  display: inline-block;
3304
3304
  }
3305
3305
 
3306
+ .control {
3307
+ &.has-icons-right {
3308
+ .icon {
3309
+ top: 50%;
3310
+ transform: translateY(-50%);
3311
+ margin: 0!important;
3312
+ }
3313
+ }
3314
+ }
3315
+
3306
3316
  &__info,
3307
3317
  &__error {
3308
3318
  font-size: rem(12);
@@ -1997,6 +1997,7 @@
1997
1997
  this.placeholder = '';
1998
1998
  this.textInfo = '';
1999
1999
  this.textError = '';
2000
+ this.error = '';
2000
2001
  this.size = null;
2001
2002
  this.min = null;
2002
2003
  this.max = null;
@@ -2036,7 +2037,7 @@
2036
2037
  TextAreaComponent.decorators = [
2037
2038
  { type: i0.Component, args: [{
2038
2039
  selector: 'wac-text-area',
2039
- 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",
2040
+ 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 || error }\">\n <textarea\n class=\"textarea\"\n [id]=\"id\"\n [ngClass]=\"{ 'is-danger': textError || error, '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 || error\" 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",
2040
2041
  providers: [{ provide: forms.NG_VALUE_ACCESSOR, useExisting: TextAreaComponent, multi: true }]
2041
2042
  },] }
2042
2043
  ];
@@ -2046,6 +2047,7 @@
2046
2047
  placeholder: [{ type: i0.Input }],
2047
2048
  textInfo: [{ type: i0.Input }],
2048
2049
  textError: [{ type: i0.Input }],
2050
+ error: [{ type: i0.Input }],
2049
2051
  size: [{ type: i0.Input }],
2050
2052
  min: [{ type: i0.Input }],
2051
2053
  max: [{ type: i0.Input }],
@@ -2164,6 +2166,7 @@
2164
2166
  this.disabled = false;
2165
2167
  this.indication = false;
2166
2168
  this.success = false;
2169
+ this.error = false;
2167
2170
  this.indicationLeft = false;
2168
2171
  this.keypressEnter = new i0.EventEmitter();
2169
2172
  this.KEYPRESS_ENTER = "Enter";
@@ -2220,7 +2223,7 @@
2220
2223
  InputComponent.decorators = [
2221
2224
  { type: i0.Component, args: [{
2222
2225
  selector: 'wac-input',
2223
- 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 && value\" 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",
2226
+ 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 && value\" 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 || error, '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 || error,\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 || error) && !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",
2224
2227
  providers: [{ provide: forms.NG_VALUE_ACCESSOR, useExisting: InputComponent, multi: true }]
2225
2228
  },] }
2226
2229
  ];
@@ -2255,6 +2258,7 @@
2255
2258
  disabled: [{ type: i0.Input }],
2256
2259
  indication: [{ type: i0.Input }],
2257
2260
  success: [{ type: i0.Input }],
2261
+ error: [{ type: i0.Input }],
2258
2262
  maxlength: [{ type: i0.Input }],
2259
2263
  minlength: [{ type: i0.Input }],
2260
2264
  indicationLeft: [{ type: i0.Input }],