onshore-forms 0.0.10 → 0.0.12
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/esm2020/lib/components/form-input-item/form-input-item.component.mjs +8 -3
- package/esm2020/lib/components/form-item-container/form-item-container.component.mjs +3 -3
- package/esm2020/lib/components/form-validation-output/form-validation-output.component.mjs +5 -8
- package/esm2020/lib/models/form.models.mjs +1 -1
- package/esm2020/lib/onshore-forms.module.mjs +8 -8
- package/esm2020/lib/onshore-forms.service.mjs +3 -2
- package/esm2020/lib/validators/form.validators.mjs +15 -0
- package/esm2020/public-api.mjs +2 -1
- package/fesm2015/onshore-forms.mjs +39 -20
- package/fesm2015/onshore-forms.mjs.map +1 -1
- package/fesm2020/onshore-forms.mjs +38 -20
- package/fesm2020/onshore-forms.mjs.map +1 -1
- package/lib/components/form-validation-output/form-validation-output.component.d.ts +2 -4
- package/lib/models/form.models.d.ts +1 -6
- package/lib/onshore-forms.module.d.ts +19 -19
- package/lib/onshore-forms.service.d.ts +3 -3
- package/lib/validators/form.validators.d.ts +7 -0
- package/package.json +3 -3
- package/public-api.d.ts +1 -0
|
@@ -16,6 +16,7 @@ import { TooltipModule } from 'primeng/tooltip';
|
|
|
16
16
|
import * as i3 from 'primeng/togglebutton';
|
|
17
17
|
import { ToggleButtonModule } from 'primeng/togglebutton';
|
|
18
18
|
import * as i1 from '@ngx-translate/core';
|
|
19
|
+
import { TranslateModule } from '@ngx-translate/core';
|
|
19
20
|
import * as i2$2 from 'primeng/inputswitch';
|
|
20
21
|
import { InputSwitchModule } from 'primeng/inputswitch';
|
|
21
22
|
import * as i2$3 from 'primeng/dynamicdialog';
|
|
@@ -36,7 +37,6 @@ import { AutoCompleteModule } from 'primeng/autocomplete';
|
|
|
36
37
|
import * as i4$2 from 'primeng/api';
|
|
37
38
|
import { DialogModule } from 'primeng/dialog';
|
|
38
39
|
import { SelectButtonModule } from 'primeng/selectbutton';
|
|
39
|
-
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
|
40
40
|
import * as i2$6 from 'primeng/calendar';
|
|
41
41
|
import { CalendarModule } from 'primeng/calendar';
|
|
42
42
|
|
|
@@ -171,7 +171,8 @@ class OnshoreFormsService {
|
|
|
171
171
|
}, 100);
|
|
172
172
|
}
|
|
173
173
|
setError(control, error) {
|
|
174
|
-
this.formControl(control).
|
|
174
|
+
const errors = { ...this.formControl(control).errors ?? {}, ...error };
|
|
175
|
+
this.formControl(control).setErrors(errors);
|
|
175
176
|
}
|
|
176
177
|
setLoader(loaders$) {
|
|
177
178
|
loaders$.forEach($loader => {
|
|
@@ -245,16 +246,15 @@ class OnshoreFormValidationOutputComponent {
|
|
|
245
246
|
constructor(cdr, translate) {
|
|
246
247
|
this.cdr = cdr;
|
|
247
248
|
this.translate = translate;
|
|
248
|
-
this.externValidationPattern = "";
|
|
249
249
|
this.validationTranslation = '';
|
|
250
250
|
}
|
|
251
251
|
ngOnChanges(changes) {
|
|
252
252
|
this.validationTranslation = '';
|
|
253
253
|
if (changes['validationErrors'].currentValue && this.validationErrors) {
|
|
254
254
|
Object.keys(this.validationErrors).forEach(error => {
|
|
255
|
-
const exists = Object.values(this.validationItems ?? []).filter(validationItem => validationItem
|
|
255
|
+
const exists = Object.values(this.validationItems ?? []).filter(validationItem => validationItem == error);
|
|
256
256
|
if (exists && exists.length > 0) {
|
|
257
|
-
this.validationTranslation += this.translate.instant('
|
|
257
|
+
this.validationTranslation += this.translate.instant('form.validation.' + error) + '<br>';
|
|
258
258
|
}
|
|
259
259
|
else {
|
|
260
260
|
const errorValues = this.validationErrors[error];
|
|
@@ -266,14 +266,12 @@ class OnshoreFormValidationOutputComponent {
|
|
|
266
266
|
}
|
|
267
267
|
}
|
|
268
268
|
OnshoreFormValidationOutputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: OnshoreFormValidationOutputComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
269
|
-
OnshoreFormValidationOutputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: OnshoreFormValidationOutputComponent, selector: "onshore-form-validation-output", inputs: { validationErrors: "validationErrors",
|
|
269
|
+
OnshoreFormValidationOutputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: OnshoreFormValidationOutputComponent, selector: "onshore-form-validation-output", inputs: { validationErrors: "validationErrors", validationItems: "validationItems" }, usesOnChanges: true, ngImport: i0, template: "<small class=\"onshore-color-danger\"\n *ngIf=\"validationTranslation\"\n [innerHTML]=\"validationTranslation\">\n</small>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
270
270
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: OnshoreFormValidationOutputComponent, decorators: [{
|
|
271
271
|
type: Component,
|
|
272
|
-
args: [{ selector: 'onshore-form-validation-output', changeDetection: ChangeDetectionStrategy.OnPush, template: "<small class=\"onshore-color-danger\"\n
|
|
272
|
+
args: [{ selector: 'onshore-form-validation-output', changeDetection: ChangeDetectionStrategy.OnPush, template: "<small class=\"onshore-color-danger\"\n *ngIf=\"validationTranslation\"\n [innerHTML]=\"validationTranslation\">\n</small>\n" }]
|
|
273
273
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.TranslateService }]; }, propDecorators: { validationErrors: [{
|
|
274
274
|
type: Input
|
|
275
|
-
}], externValidationPattern: [{
|
|
276
|
-
type: Input
|
|
277
275
|
}], validationItems: [{
|
|
278
276
|
type: Input
|
|
279
277
|
}] } });
|
|
@@ -326,10 +324,10 @@ class OnshoreFormItemContainer {
|
|
|
326
324
|
}
|
|
327
325
|
}
|
|
328
326
|
OnshoreFormItemContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: OnshoreFormItemContainer, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
329
|
-
OnshoreFormItemContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: OnshoreFormItemContainer, selector: "onshore-form-item-container", inputs: { formTemplate: "formTemplate", ngControl: "ngControl" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"mb-4\">\n <div class=\"flex w-full\"\n [class.flex-column]=\"formTemplate.layout == OnshoreFormTemplateLayout.vertical\"\n [class.flex-row]=\"formTemplate.layout == OnshoreFormTemplateLayout.horizontal\"\n [class.justify-content-between]=\"formTemplate.layout == OnshoreFormTemplateLayout.horizontal\">\n\n <div #formLabel\n class=\"flex justify-content-between\"\n [style]=\"formTemplate.labelStyle ?? 'min-width: 200px'\">\n\n <b [class.mr-2]=\"formTemplate.layout == OnshoreFormTemplateLayout.horizontal\"\n [class.mb-2]=\"formTemplate.layout == OnshoreFormTemplateLayout.vertical\">\n {{formTemplate.label}}\n <small *ngIf=\"formTemplate.required\" class=\"onshore-color-danger\">*</small>\n </b>\n\n <div *ngIf=\"formTemplate.tooltip && formTemplate.layout == OnshoreFormTemplateLayout.vertical\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\" appendTo=\"body\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n\n </div>\n\n <div class=\"flex w-full\">\n <p-toggleButton\n *ngIf=\"formTemplate.locked\"\n (onChange)=\"enabled($event.checked)\"\n onIcon=\"fa fa-lock-open\"\n offIcon=\"fa fa-lock\"\n class=\"mr-2\"\n [style]=\"{height: '36px'}\">\n </p-toggleButton>\n\n <ng-content></ng-content>\n </div>\n\n <div *ngIf=\"formTemplate.tooltip && formTemplate.layout == OnshoreFormTemplateLayout.horizontal\" class=\"ml-2 align-self-center\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n </div>\n\n <div
|
|
327
|
+
OnshoreFormItemContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: OnshoreFormItemContainer, selector: "onshore-form-item-container", inputs: { formTemplate: "formTemplate", ngControl: "ngControl" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"mb-4\">\n <div class=\"flex w-full\"\n [class.flex-column]=\"formTemplate.layout == OnshoreFormTemplateLayout.vertical\"\n [class.flex-row]=\"formTemplate.layout == OnshoreFormTemplateLayout.horizontal\"\n [class.justify-content-between]=\"formTemplate.layout == OnshoreFormTemplateLayout.horizontal\">\n\n <div #formLabel\n class=\"flex justify-content-between\"\n [style]=\"formTemplate.labelStyle ?? 'min-width: 200px'\">\n\n <b [class.mr-2]=\"formTemplate.layout == OnshoreFormTemplateLayout.horizontal\"\n [class.mb-2]=\"formTemplate.layout == OnshoreFormTemplateLayout.vertical\">\n {{formTemplate.label}}\n <small *ngIf=\"formTemplate.required\" class=\"onshore-color-danger\">*</small>\n </b>\n\n <div *ngIf=\"formTemplate.tooltip && formTemplate.layout == OnshoreFormTemplateLayout.vertical\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\" appendTo=\"body\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n\n </div>\n\n <div class=\"flex w-full\">\n <p-toggleButton\n *ngIf=\"formTemplate.locked\"\n (onChange)=\"enabled($event.checked)\"\n onIcon=\"fa fa-lock-open\"\n offIcon=\"fa fa-lock\"\n class=\"mr-2\"\n [style]=\"{height: '36px'}\">\n </p-toggleButton>\n\n <ng-content></ng-content>\n </div>\n\n <div *ngIf=\"formTemplate.tooltip && formTemplate.layout == OnshoreFormTemplateLayout.horizontal\" class=\"ml-2 align-self-center\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n </div>\n\n <div [style]=\"{'margin-left': formTemplate.layout == OnshoreFormTemplateLayout.horizontal ? formLabel.clientWidth + 'px' : '0px'}\">\n <onshore-form-validation-output\n [validationItems]=\"formTemplate.validationItems\"\n [validationErrors]=\"ngControl.control.errors\">\n </onshore-form-validation-output>\n </div>\n\n <div [style]=\"{'margin-left': formTemplate.layout == OnshoreFormTemplateLayout.horizontal ? formLabel.clientWidth + 'px' : '0px'}\">\n <small *ngIf=\"formTemplate.description\" class=\"mt-2 onshore-color-gray-5\"><i class=\"fa fa-info-circle\"></i> {{formTemplate.description}}</small>\n </div>\n\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i3.ToggleButton, selector: "p-toggleButton", inputs: ["onLabel", "offLabel", "onIcon", "offIcon", "ariaLabelledBy", "disabled", "style", "styleClass", "inputId", "tabindex", "iconPos"], outputs: ["onChange"] }, { kind: "component", type: OnshoreFormValidationOutputComponent, selector: "onshore-form-validation-output", inputs: ["validationErrors", "validationItems"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
330
328
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: OnshoreFormItemContainer, decorators: [{
|
|
331
329
|
type: Component,
|
|
332
|
-
args: [{ selector: 'onshore-form-item-container', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mb-4\">\n <div class=\"flex w-full\"\n [class.flex-column]=\"formTemplate.layout == OnshoreFormTemplateLayout.vertical\"\n [class.flex-row]=\"formTemplate.layout == OnshoreFormTemplateLayout.horizontal\"\n [class.justify-content-between]=\"formTemplate.layout == OnshoreFormTemplateLayout.horizontal\">\n\n <div #formLabel\n class=\"flex justify-content-between\"\n [style]=\"formTemplate.labelStyle ?? 'min-width: 200px'\">\n\n <b [class.mr-2]=\"formTemplate.layout == OnshoreFormTemplateLayout.horizontal\"\n [class.mb-2]=\"formTemplate.layout == OnshoreFormTemplateLayout.vertical\">\n {{formTemplate.label}}\n <small *ngIf=\"formTemplate.required\" class=\"onshore-color-danger\">*</small>\n </b>\n\n <div *ngIf=\"formTemplate.tooltip && formTemplate.layout == OnshoreFormTemplateLayout.vertical\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\" appendTo=\"body\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n\n </div>\n\n <div class=\"flex w-full\">\n <p-toggleButton\n *ngIf=\"formTemplate.locked\"\n (onChange)=\"enabled($event.checked)\"\n onIcon=\"fa fa-lock-open\"\n offIcon=\"fa fa-lock\"\n class=\"mr-2\"\n [style]=\"{height: '36px'}\">\n </p-toggleButton>\n\n <ng-content></ng-content>\n </div>\n\n <div *ngIf=\"formTemplate.tooltip && formTemplate.layout == OnshoreFormTemplateLayout.horizontal\" class=\"ml-2 align-self-center\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n </div>\n\n <div
|
|
330
|
+
args: [{ selector: 'onshore-form-item-container', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mb-4\">\n <div class=\"flex w-full\"\n [class.flex-column]=\"formTemplate.layout == OnshoreFormTemplateLayout.vertical\"\n [class.flex-row]=\"formTemplate.layout == OnshoreFormTemplateLayout.horizontal\"\n [class.justify-content-between]=\"formTemplate.layout == OnshoreFormTemplateLayout.horizontal\">\n\n <div #formLabel\n class=\"flex justify-content-between\"\n [style]=\"formTemplate.labelStyle ?? 'min-width: 200px'\">\n\n <b [class.mr-2]=\"formTemplate.layout == OnshoreFormTemplateLayout.horizontal\"\n [class.mb-2]=\"formTemplate.layout == OnshoreFormTemplateLayout.vertical\">\n {{formTemplate.label}}\n <small *ngIf=\"formTemplate.required\" class=\"onshore-color-danger\">*</small>\n </b>\n\n <div *ngIf=\"formTemplate.tooltip && formTemplate.layout == OnshoreFormTemplateLayout.vertical\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\" appendTo=\"body\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n\n </div>\n\n <div class=\"flex w-full\">\n <p-toggleButton\n *ngIf=\"formTemplate.locked\"\n (onChange)=\"enabled($event.checked)\"\n onIcon=\"fa fa-lock-open\"\n offIcon=\"fa fa-lock\"\n class=\"mr-2\"\n [style]=\"{height: '36px'}\">\n </p-toggleButton>\n\n <ng-content></ng-content>\n </div>\n\n <div *ngIf=\"formTemplate.tooltip && formTemplate.layout == OnshoreFormTemplateLayout.horizontal\" class=\"ml-2 align-self-center\" [pTooltip]=\"formTemplate.tooltip\" [escape]=\"false\"><i class=\"fa fa-circle-question onshore-color-gray-5\"></i></div>\n </div>\n\n <div [style]=\"{'margin-left': formTemplate.layout == OnshoreFormTemplateLayout.horizontal ? formLabel.clientWidth + 'px' : '0px'}\">\n <onshore-form-validation-output\n [validationItems]=\"formTemplate.validationItems\"\n [validationErrors]=\"ngControl.control.errors\">\n </onshore-form-validation-output>\n </div>\n\n <div [style]=\"{'margin-left': formTemplate.layout == OnshoreFormTemplateLayout.horizontal ? formLabel.clientWidth + 'px' : '0px'}\">\n <small *ngIf=\"formTemplate.description\" class=\"mt-2 onshore-color-gray-5\"><i class=\"fa fa-info-circle\"></i> {{formTemplate.description}}</small>\n </div>\n\n</div>\n" }]
|
|
333
331
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { formTemplate: [{
|
|
334
332
|
type: Input
|
|
335
333
|
}], ngControl: [{
|
|
@@ -340,6 +338,11 @@ class OnshoreFormInputItemComponent {
|
|
|
340
338
|
constructor(ngControl, cdr) {
|
|
341
339
|
this.ngControl = ngControl;
|
|
342
340
|
this.cdr = cdr;
|
|
341
|
+
this.step = 1;
|
|
342
|
+
this.min = 0;
|
|
343
|
+
this.max = 999999;
|
|
344
|
+
this.minLength = 0;
|
|
345
|
+
this.maxLength = 999999;
|
|
343
346
|
this.OnshoreFormTemplateType = OnshoreFormTemplateType;
|
|
344
347
|
this.OnshoreFormTemplateLayout = OnshoreFormTemplateLayout;
|
|
345
348
|
this.passwordVisible = false;
|
|
@@ -367,10 +370,10 @@ class OnshoreFormInputItemComponent {
|
|
|
367
370
|
}
|
|
368
371
|
}
|
|
369
372
|
OnshoreFormInputItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: OnshoreFormInputItemComponent, deps: [{ token: i1$1.NgControl, optional: true, self: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
370
|
-
OnshoreFormInputItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: OnshoreFormInputItemComponent, selector: "onshore-form-input-item", inputs: { formTemplate: "formTemplate", step: "step", min: "min", max: "max", minLength: "minLength", maxLength: "maxLength" }, usesOnChanges: true, ngImport: i0, template: "<onshore-form-item-container [formTemplate]=\"formTemplate\" [ngControl]=\"ngControl\">\n <span class=\"p-inputgroup w-full\">\n\n <textarea *ngIf=\"formTemplate.type == OnshoreFormTemplateType.textarea\"\n class=\"w-full\"\n [name]=\"formTemplate.name\"\n [placeholder]=\"formTemplate.placeholder ?? ''\"\n [disabled]=\"disabled\"\n [rows]=\"3\"\n [cols]=\"30\"\n pInputTextarea\n [autoResize]=\"true\"\n [formControl]=\"ngControl.control\"\n [class.p-invalid]=\"ngControl.control?.touched && ngControl.control?.invalid\"\n [minLength]=\"minLength
|
|
373
|
+
OnshoreFormInputItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: OnshoreFormInputItemComponent, selector: "onshore-form-input-item", inputs: { formTemplate: "formTemplate", step: "step", min: "min", max: "max", minLength: "minLength", maxLength: "maxLength" }, usesOnChanges: true, ngImport: i0, template: "<onshore-form-item-container [formTemplate]=\"formTemplate\" [ngControl]=\"ngControl\">\n <span class=\"p-inputgroup w-full\">\n\n <textarea *ngIf=\"formTemplate.type == OnshoreFormTemplateType.textarea\"\n class=\"w-full\"\n [name]=\"formTemplate.name\"\n [placeholder]=\"formTemplate.placeholder ?? ''\"\n [disabled]=\"disabled\"\n [rows]=\"3\"\n [cols]=\"30\"\n pInputTextarea\n [autoResize]=\"true\"\n [formControl]=\"ngControl.control\"\n [class.p-invalid]=\"ngControl.control?.touched && ngControl.control?.invalid\"\n [minLength]=\"minLength\"\n [maxLength]=\"maxLength\"></textarea>\n\n <input *ngIf=\"formTemplate.type == OnshoreFormTemplateType.text || formTemplate.type == OnshoreFormTemplateType.email || formTemplate.type == OnshoreFormTemplateType.phone\"\n class=\"w-full\"\n [type]=\"formTemplate.type\"\n [name]=\"formTemplate.name\"\n [placeholder]=\"formTemplate.placeholder ?? ''\"\n [disabled]=\"disabled\"\n pInputText\n [formControl]=\"ngControl.control\"\n [autocomplete]=\"'prevent-template-' + formTemplate.name\"\n [minLength]=\"minLength\"\n [maxLength]=\"maxLength\"/>\n\n <input *ngIf=\"formTemplate.type == OnshoreFormTemplateType.password\"\n class=\"w-full\"\n [type]=\"passwordVisible ? 'text' : formTemplate.type\"\n [name]=\"formTemplate.name\"\n [placeholder]=\"formTemplate.placeholder ?? ''\"\n [disabled]=\"disabled\"\n pInputText\n [formControl]=\"ngControl.control\"\n [autocomplete]=\"'prevent-template-' + formTemplate.name\"\n [minLength]=\"minLength\"\n [maxLength]=\"maxLength\"/>\n\n <p-inputNumber *ngIf=\"formTemplate.type == OnshoreFormTemplateType.number\"\n class=\"w-full\"\n [name]=\"formTemplate.name\"\n [placeholder]=\"formTemplate.placeholder ?? 0\"\n [disabled]=\"disabled\"\n [formControl]=\"ngControl.control\"\n [autocomplete]=\"'prevent-template-' + formTemplate.name\"\n [showButtons]=\"true\"\n [step]=\"step ?? 1\"\n [min]=\"min\"\n [max]=\"max\">\n </p-inputNumber>\n\n <span class=\"p-inputgroup-addon\" *ngIf=\"!disabled\">\n <i class=\"fa\"\n [class.fa-check]=\"formTemplate.required && (ngControl.control.valid || ngControl.control.untouched)\"\n [class.fa-exclamation-triangle]=\"ngControl.control.touched && ngControl.control.invalid\"\n [class.onshore-color-gray-3]=\"ngControl.control.untouched\"\n [class.onshore-color-success]=\"ngControl.control.touched && ngControl.control.valid\"\n [class.onshore-color-danger]=\"ngControl.control.touched && ngControl.control.invalid\">\n </i>\n </span>\n\n <span *ngIf=\"formTemplate.type == OnshoreFormTemplateType.password\"\n (click)=\"passwordVisible = !passwordVisible\"\n class=\"p-inputgroup-addon cursor-pointer\">\n <i class=\"fa\"\n [class.fa-eye-slash]=\"passwordVisible\"\n [class.fa-eye]=\"!passwordVisible\"\n ></i>\n </span>\n\n </span>\n</onshore-form-item-container>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3$1.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]" }, { kind: "directive", type: i5.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { kind: "component", type: OnshoreFormItemContainer, selector: "onshore-form-item-container", inputs: ["formTemplate", "ngControl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
371
374
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: OnshoreFormInputItemComponent, decorators: [{
|
|
372
375
|
type: Component,
|
|
373
|
-
args: [{ selector: 'onshore-form-input-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<onshore-form-item-container [formTemplate]=\"formTemplate\" [ngControl]=\"ngControl\">\n <span class=\"p-inputgroup w-full\">\n\n <textarea *ngIf=\"formTemplate.type == OnshoreFormTemplateType.textarea\"\n class=\"w-full\"\n [name]=\"formTemplate.name\"\n [placeholder]=\"formTemplate.placeholder ?? ''\"\n [disabled]=\"disabled\"\n [rows]=\"3\"\n [cols]=\"30\"\n pInputTextarea\n [autoResize]=\"true\"\n [formControl]=\"ngControl.control\"\n [class.p-invalid]=\"ngControl.control?.touched && ngControl.control?.invalid\"\n [minLength]=\"minLength
|
|
376
|
+
args: [{ selector: 'onshore-form-input-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<onshore-form-item-container [formTemplate]=\"formTemplate\" [ngControl]=\"ngControl\">\n <span class=\"p-inputgroup w-full\">\n\n <textarea *ngIf=\"formTemplate.type == OnshoreFormTemplateType.textarea\"\n class=\"w-full\"\n [name]=\"formTemplate.name\"\n [placeholder]=\"formTemplate.placeholder ?? ''\"\n [disabled]=\"disabled\"\n [rows]=\"3\"\n [cols]=\"30\"\n pInputTextarea\n [autoResize]=\"true\"\n [formControl]=\"ngControl.control\"\n [class.p-invalid]=\"ngControl.control?.touched && ngControl.control?.invalid\"\n [minLength]=\"minLength\"\n [maxLength]=\"maxLength\"></textarea>\n\n <input *ngIf=\"formTemplate.type == OnshoreFormTemplateType.text || formTemplate.type == OnshoreFormTemplateType.email || formTemplate.type == OnshoreFormTemplateType.phone\"\n class=\"w-full\"\n [type]=\"formTemplate.type\"\n [name]=\"formTemplate.name\"\n [placeholder]=\"formTemplate.placeholder ?? ''\"\n [disabled]=\"disabled\"\n pInputText\n [formControl]=\"ngControl.control\"\n [autocomplete]=\"'prevent-template-' + formTemplate.name\"\n [minLength]=\"minLength\"\n [maxLength]=\"maxLength\"/>\n\n <input *ngIf=\"formTemplate.type == OnshoreFormTemplateType.password\"\n class=\"w-full\"\n [type]=\"passwordVisible ? 'text' : formTemplate.type\"\n [name]=\"formTemplate.name\"\n [placeholder]=\"formTemplate.placeholder ?? ''\"\n [disabled]=\"disabled\"\n pInputText\n [formControl]=\"ngControl.control\"\n [autocomplete]=\"'prevent-template-' + formTemplate.name\"\n [minLength]=\"minLength\"\n [maxLength]=\"maxLength\"/>\n\n <p-inputNumber *ngIf=\"formTemplate.type == OnshoreFormTemplateType.number\"\n class=\"w-full\"\n [name]=\"formTemplate.name\"\n [placeholder]=\"formTemplate.placeholder ?? 0\"\n [disabled]=\"disabled\"\n [formControl]=\"ngControl.control\"\n [autocomplete]=\"'prevent-template-' + formTemplate.name\"\n [showButtons]=\"true\"\n [step]=\"step ?? 1\"\n [min]=\"min\"\n [max]=\"max\">\n </p-inputNumber>\n\n <span class=\"p-inputgroup-addon\" *ngIf=\"!disabled\">\n <i class=\"fa\"\n [class.fa-check]=\"formTemplate.required && (ngControl.control.valid || ngControl.control.untouched)\"\n [class.fa-exclamation-triangle]=\"ngControl.control.touched && ngControl.control.invalid\"\n [class.onshore-color-gray-3]=\"ngControl.control.untouched\"\n [class.onshore-color-success]=\"ngControl.control.touched && ngControl.control.valid\"\n [class.onshore-color-danger]=\"ngControl.control.touched && ngControl.control.invalid\">\n </i>\n </span>\n\n <span *ngIf=\"formTemplate.type == OnshoreFormTemplateType.password\"\n (click)=\"passwordVisible = !passwordVisible\"\n class=\"p-inputgroup-addon cursor-pointer\">\n <i class=\"fa\"\n [class.fa-eye-slash]=\"passwordVisible\"\n [class.fa-eye]=\"!passwordVisible\"\n ></i>\n </span>\n\n </span>\n</onshore-form-item-container>\n" }]
|
|
374
377
|
}], ctorParameters: function () { return [{ type: i1$1.NgControl, decorators: [{
|
|
375
378
|
type: Self
|
|
376
379
|
}, {
|
|
@@ -878,7 +881,6 @@ OnshoreFormsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", vers
|
|
|
878
881
|
OnshoreFormAutocompleteItemComponent,
|
|
879
882
|
OnshoreFormItemContainer,
|
|
880
883
|
OnshoreFormDatetimeItemComponent], imports: [CommonModule,
|
|
881
|
-
BrowserAnimationsModule,
|
|
882
884
|
FormsModule,
|
|
883
885
|
ReactiveFormsModule,
|
|
884
886
|
ButtonModule,
|
|
@@ -896,7 +898,8 @@ OnshoreFormsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", vers
|
|
|
896
898
|
DialogModule,
|
|
897
899
|
SelectButtonModule,
|
|
898
900
|
ToggleButtonModule,
|
|
899
|
-
CalendarModule
|
|
901
|
+
CalendarModule,
|
|
902
|
+
TranslateModule], exports: [OnshoreFormsComponent,
|
|
900
903
|
OnshoreFormInputItemComponent,
|
|
901
904
|
OnshoreFormSwitchItemComponent,
|
|
902
905
|
OnshoreFormValidationOutputComponent,
|
|
@@ -910,7 +913,6 @@ OnshoreFormsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", vers
|
|
|
910
913
|
OnshoreFormsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: OnshoreFormsModule, providers: [
|
|
911
914
|
OnshoreFormsService
|
|
912
915
|
], imports: [CommonModule,
|
|
913
|
-
BrowserAnimationsModule,
|
|
914
916
|
FormsModule,
|
|
915
917
|
ReactiveFormsModule,
|
|
916
918
|
ButtonModule,
|
|
@@ -928,7 +930,8 @@ OnshoreFormsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", vers
|
|
|
928
930
|
DialogModule,
|
|
929
931
|
SelectButtonModule,
|
|
930
932
|
ToggleButtonModule,
|
|
931
|
-
CalendarModule
|
|
933
|
+
CalendarModule,
|
|
934
|
+
TranslateModule] });
|
|
932
935
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: OnshoreFormsModule, decorators: [{
|
|
933
936
|
type: NgModule,
|
|
934
937
|
args: [{
|
|
@@ -947,7 +950,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
|
|
|
947
950
|
],
|
|
948
951
|
imports: [
|
|
949
952
|
CommonModule,
|
|
950
|
-
BrowserAnimationsModule,
|
|
951
953
|
FormsModule,
|
|
952
954
|
ReactiveFormsModule,
|
|
953
955
|
ButtonModule,
|
|
@@ -965,7 +967,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
|
|
|
965
967
|
DialogModule,
|
|
966
968
|
SelectButtonModule,
|
|
967
969
|
ToggleButtonModule,
|
|
968
|
-
CalendarModule
|
|
970
|
+
CalendarModule,
|
|
971
|
+
TranslateModule
|
|
969
972
|
],
|
|
970
973
|
exports: [
|
|
971
974
|
OnshoreFormsComponent,
|
|
@@ -986,6 +989,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
|
|
|
986
989
|
}]
|
|
987
990
|
}] });
|
|
988
991
|
|
|
992
|
+
class OnshoreValidators {
|
|
993
|
+
}
|
|
994
|
+
OnshoreValidators.slug = (control) => {
|
|
995
|
+
return /^[a-zA-Z0-9_.+-].{1,}/.test(control.value) ? null : { slug: true };
|
|
996
|
+
};
|
|
997
|
+
OnshoreValidators.numeric = (control) => {
|
|
998
|
+
return /^[0-9]*$/.test(control.value) ? null : { numeric: true };
|
|
999
|
+
};
|
|
1000
|
+
OnshoreValidators.email = (control) => {
|
|
1001
|
+
return /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/.test(control.value) ? null : { email: true };
|
|
1002
|
+
};
|
|
1003
|
+
OnshoreValidators.cleanComment = (control) => {
|
|
1004
|
+
return /[A-Z]{5}\d{4}[A-Z]{1}/.test(control.value) ? null : { cleanComment: true };
|
|
1005
|
+
};
|
|
1006
|
+
|
|
989
1007
|
/*
|
|
990
1008
|
* Public API Surface of onshore-forms
|
|
991
1009
|
*/
|
|
@@ -994,5 +1012,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
|
|
|
994
1012
|
* Generated bundle index. Do not edit.
|
|
995
1013
|
*/
|
|
996
1014
|
|
|
997
|
-
export { OnshoreFormAutocompleteItemComponent, OnshoreFormCheckboxItemComponent, OnshoreFormColorpickerItemComponent, OnshoreFormDatetimeItemComponent, OnshoreFormDropdownItemComponent, OnshoreFormImageItemComponent, OnshoreFormInputItemComponent, OnshoreFormItemContainer, OnshoreFormSwitchItemComponent, OnshoreFormTemplateLayout, OnshoreFormTemplateType, OnshoreFormValidationOutputComponent, OnshoreFormsComponent, OnshoreFormsModule, OnshoreFormsService, OnshoreImageError };
|
|
1015
|
+
export { OnshoreFormAutocompleteItemComponent, OnshoreFormCheckboxItemComponent, OnshoreFormColorpickerItemComponent, OnshoreFormDatetimeItemComponent, OnshoreFormDropdownItemComponent, OnshoreFormImageItemComponent, OnshoreFormInputItemComponent, OnshoreFormItemContainer, OnshoreFormSwitchItemComponent, OnshoreFormTemplateLayout, OnshoreFormTemplateType, OnshoreFormValidationOutputComponent, OnshoreFormsComponent, OnshoreFormsModule, OnshoreFormsService, OnshoreImageError, OnshoreValidators };
|
|
998
1016
|
//# sourceMappingURL=onshore-forms.mjs.map
|