@indigina/ui-kit 1.1.414 → 1.1.415
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.
|
@@ -833,6 +833,7 @@ var KitFormErrorCode;
|
|
|
833
833
|
KitFormErrorCode["Required"] = "required";
|
|
834
834
|
KitFormErrorCode["Email"] = "email";
|
|
835
835
|
KitFormErrorCode["MaxLength"] = "maxlength";
|
|
836
|
+
KitFormErrorCode["Duplicate"] = "duplicate";
|
|
836
837
|
})(KitFormErrorCode || (KitFormErrorCode = {}));
|
|
837
838
|
|
|
838
839
|
class KitFormErrors {
|
|
@@ -844,6 +845,7 @@ class KitFormErrors {
|
|
|
844
845
|
[KitFormErrorCode.MaxLength]: (errors) => this.translateService.instant('kit.formControlError.invalidLength', {
|
|
845
846
|
requiredLength: errors.requiredLength,
|
|
846
847
|
}),
|
|
848
|
+
[KitFormErrorCode.Duplicate]: () => this.translateService.instant('kit.formControlError.duplicate'),
|
|
847
849
|
};
|
|
848
850
|
}
|
|
849
851
|
getErrors(control) {
|
|
@@ -884,6 +886,8 @@ class KitTextboxActionsComponent {
|
|
|
884
886
|
this.validationErrors = signal([], ...(ngDevMode ? [{ debugName: "validationErrors" }] : []));
|
|
885
887
|
this.documentClickListener = null;
|
|
886
888
|
this.selectListener = null;
|
|
889
|
+
this.onChange = (_value) => { };
|
|
890
|
+
this.onTouched = () => { };
|
|
887
891
|
effect(() => {
|
|
888
892
|
const validators = this.validators();
|
|
889
893
|
this.formControl.setValidators(validators);
|
|
@@ -904,9 +908,6 @@ class KitTextboxActionsComponent {
|
|
|
904
908
|
this.removeSelectListener();
|
|
905
909
|
}
|
|
906
910
|
});
|
|
907
|
-
this.formControl.valueChanges.subscribe(() => {
|
|
908
|
-
this.updateValidationErrors();
|
|
909
|
-
});
|
|
910
911
|
}
|
|
911
912
|
ngOnInit() {
|
|
912
913
|
this.formControl.setValue(this.defaultValue(), { emitEvent: false });
|
|
@@ -916,11 +917,13 @@ class KitTextboxActionsComponent {
|
|
|
916
917
|
this.removeSelectListener();
|
|
917
918
|
}
|
|
918
919
|
updateValidationErrors() {
|
|
919
|
-
this.
|
|
920
|
+
const valueUnchanged = this.formControl.value === this.defaultValue();
|
|
921
|
+
this.validationErrors.set(valueUnchanged ? [] : this.kitFormErrors.getErrors(this.formControl));
|
|
920
922
|
}
|
|
921
923
|
onTextboxChange(value) {
|
|
922
924
|
this.formControl.setValue(value.trim());
|
|
923
925
|
this.formControl.markAsTouched();
|
|
926
|
+
this.formControl.markAsDirty();
|
|
924
927
|
this.updateValidationErrors();
|
|
925
928
|
}
|
|
926
929
|
revertChanges() {
|
|
@@ -931,14 +934,30 @@ class KitTextboxActionsComponent {
|
|
|
931
934
|
this.validationErrors.set([]);
|
|
932
935
|
this.canceled.emit();
|
|
933
936
|
}
|
|
937
|
+
isSaveDisabled() {
|
|
938
|
+
const hasErrors = this.formControl.invalid;
|
|
939
|
+
const valueUnchanged = this.formControl.value === this.defaultValue();
|
|
940
|
+
const isEmpty = !this.formControl.value?.trim();
|
|
941
|
+
return hasErrors || valueUnchanged || isEmpty;
|
|
942
|
+
}
|
|
934
943
|
save() {
|
|
935
|
-
this.
|
|
936
|
-
|
|
937
|
-
if (this.formControl.valid && this.formControl.value !== this.defaultValue()) {
|
|
938
|
-
this.isTextboxFocused.set(false);
|
|
939
|
-
this.defaultValue.set(this.formControl.value);
|
|
940
|
-
this.saved.emit(this.formControl.value);
|
|
944
|
+
if (this.isSaveDisabled()) {
|
|
945
|
+
return;
|
|
941
946
|
}
|
|
947
|
+
this.isTextboxFocused.set(false);
|
|
948
|
+
this.defaultValue.set(this.formControl.value);
|
|
949
|
+
this.onChange(this.formControl.value);
|
|
950
|
+
this.onTouched();
|
|
951
|
+
this.saved.emit(this.formControl.value);
|
|
952
|
+
}
|
|
953
|
+
writeValue(value) {
|
|
954
|
+
this.defaultValue.set(value);
|
|
955
|
+
}
|
|
956
|
+
registerOnChange(fn) {
|
|
957
|
+
this.onChange = fn;
|
|
958
|
+
}
|
|
959
|
+
registerOnTouched(fn) {
|
|
960
|
+
this.onTouched = fn;
|
|
942
961
|
}
|
|
943
962
|
addDocumentClickListener() {
|
|
944
963
|
if (this.documentClickListener) {
|
|
@@ -1003,7 +1022,12 @@ class KitTextboxActionsComponent {
|
|
|
1003
1022
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: KitTextboxActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1004
1023
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: KitTextboxActionsComponent, isStandalone: true, selector: "kit-textbox-actions", inputs: { defaultValue: { classPropertyName: "defaultValue", publicName: "defaultValue", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, validators: { classPropertyName: "validators", publicName: "validators", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, showActions: { classPropertyName: "showActions", publicName: "showActions", isSignal: true, isRequired: false, transformFunction: null }, clearOnFocus: { classPropertyName: "clearOnFocus", publicName: "clearOnFocus", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { defaultValue: "defaultValueChange", saved: "saved", canceled: "canceled" }, providers: [
|
|
1005
1024
|
KitFormErrors,
|
|
1006
|
-
|
|
1025
|
+
{
|
|
1026
|
+
provide: NG_VALUE_ACCESSOR,
|
|
1027
|
+
useExisting: forwardRef(() => KitTextboxActionsComponent),
|
|
1028
|
+
multi: true,
|
|
1029
|
+
},
|
|
1030
|
+
], viewQueries: [{ propertyName: "kitTextboxComponent", first: true, predicate: KitTextboxComponent, descendants: true, isSignal: true }], ngImport: i0, template: "@if (label()) {\n <kit-input-label class=\"label\"\n [text]=\"label()\"\n [for]=\"$any(textbox)\"/>\n}\n<div class=\"kit-textbox-wrapper\">\n <kit-textbox #textbox\n class=\"textbox\"\n maxLength=\"250\"\n [disabled]=\"disabled()\"\n [defaultValue]=\"defaultValue()\"\n [placeholder]=\"placeholder()\"\n [showStateIcon]=\"false\"\n [state]=\"validationErrors().length ? kitTextboxState.ERROR : kitTextboxState.DEFAULT\"\n [messageText]=\"validationErrors().join('. ')\"\n (changed)=\"onTextboxChange($event)\" />\n @if (isTextboxFocused() && showActions()) {\n <div class=\"kit-textbox-actions\">\n <kit-button [icon]=\"kitSvgIcon.CHECK\"\n [iconType]=\"kitSvgIconType.STROKE\"\n [type]=\"kitButtonType.GHOST\"\n [disabled]=\"isSaveDisabled()\"\n (clicked)=\"save()\"/>\n <kit-button [icon]=\"kitSvgIcon.CROSS\"\n [type]=\"kitButtonType.GHOST\"\n (clicked)=\"revertChanges()\"/>\n </div>\n }\n</div>\n", styles: [".label{display:block;margin-bottom:4px}.kit-textbox-wrapper{width:100%;display:flex;gap:10px}.kit-textbox-wrapper .textbox{width:100%}.kit-textbox-actions{display:flex;align-items:start;gap:10px}\n"], dependencies: [{ kind: "component", type: KitTextboxComponent, selector: "kit-textbox", inputs: ["placeholder", "label", "labelTooltip", "defaultValue", "messageIcon", "messageText", "messageTemplate", "disabled", "maxlength", "state", "size", "icon", "clearButton", "showStateIcon", "readonly", "customStateIcon"], outputs: ["defaultValueChange", "disabledChange", "blured", "focused", "changed"] }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: KitInputLabelComponent, selector: "kit-input-label", inputs: ["text", "for", "tooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1007
1031
|
}
|
|
1008
1032
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: KitTextboxActionsComponent, decorators: [{
|
|
1009
1033
|
type: Component,
|
|
@@ -1015,7 +1039,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
|
|
|
1015
1039
|
KitInputLabelComponent,
|
|
1016
1040
|
], providers: [
|
|
1017
1041
|
KitFormErrors,
|
|
1018
|
-
|
|
1042
|
+
{
|
|
1043
|
+
provide: NG_VALUE_ACCESSOR,
|
|
1044
|
+
useExisting: forwardRef(() => KitTextboxActionsComponent),
|
|
1045
|
+
multi: true,
|
|
1046
|
+
},
|
|
1047
|
+
], template: "@if (label()) {\n <kit-input-label class=\"label\"\n [text]=\"label()\"\n [for]=\"$any(textbox)\"/>\n}\n<div class=\"kit-textbox-wrapper\">\n <kit-textbox #textbox\n class=\"textbox\"\n maxLength=\"250\"\n [disabled]=\"disabled()\"\n [defaultValue]=\"defaultValue()\"\n [placeholder]=\"placeholder()\"\n [showStateIcon]=\"false\"\n [state]=\"validationErrors().length ? kitTextboxState.ERROR : kitTextboxState.DEFAULT\"\n [messageText]=\"validationErrors().join('. ')\"\n (changed)=\"onTextboxChange($event)\" />\n @if (isTextboxFocused() && showActions()) {\n <div class=\"kit-textbox-actions\">\n <kit-button [icon]=\"kitSvgIcon.CHECK\"\n [iconType]=\"kitSvgIconType.STROKE\"\n [type]=\"kitButtonType.GHOST\"\n [disabled]=\"isSaveDisabled()\"\n (clicked)=\"save()\"/>\n <kit-button [icon]=\"kitSvgIcon.CROSS\"\n [type]=\"kitButtonType.GHOST\"\n (clicked)=\"revertChanges()\"/>\n </div>\n }\n</div>\n", styles: [".label{display:block;margin-bottom:4px}.kit-textbox-wrapper{width:100%;display:flex;gap:10px}.kit-textbox-wrapper .textbox{width:100%}.kit-textbox-actions{display:flex;align-items:start;gap:10px}\n"] }]
|
|
1019
1048
|
}], ctorParameters: () => [], propDecorators: { defaultValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultValue", required: false }] }, { type: i0.Output, args: ["defaultValueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], showActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "showActions", required: false }] }], clearOnFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearOnFocus", required: false }] }], saved: [{ type: i0.Output, args: ["saved"] }], canceled: [{ type: i0.Output, args: ["canceled"] }], kitTextboxComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KitTextboxComponent), { isSignal: true }] }] } });
|
|
1020
1049
|
|
|
1021
1050
|
var KitNumericTextboxState;
|
|
@@ -6935,6 +6964,7 @@ const kitTranslations = {
|
|
|
6935
6964
|
required: 'Required',
|
|
6936
6965
|
invalidLength: 'The value should be less than {{ requiredLength }} characters',
|
|
6937
6966
|
invalidEmailFormat: 'Invalid email',
|
|
6967
|
+
duplicate: 'Duplicate value',
|
|
6938
6968
|
},
|
|
6939
6969
|
liveUpdates: {
|
|
6940
6970
|
pause: 'Pause Live Feed',
|