@webilix/ngx-form-m3 0.0.31 → 0.0.38

package/index.d.ts

@@ -5,7 +5,7 @@ import { Router } from '@angular/router';
 import { MatFormFieldAppearance } from '@angular/material/form-field';
 import { ComponentType } from '@angular/cdk/portal';
 
-type NgxFormInputs = IInputAutoComplete | IInputBankCard | IInputBankSheba | IInputCheckbox | IInputColor | IInputComponent | IInputCoordinates | IInputDate | IInputEmail | IInputFile | IInputIcon | IInputIp | IInputMobile | IInputMoment | IInputMultiSelect | IInputName | IInputNumber | IInputPassword | IInputPrice | IInputSelect | IInputText | IInputTextarea | IInputUrl;
+type NgxFormInputs = IInputAutoComplete | IInputBankCard | IInputBankSheba | IInputCheckbox | IInputColor | IInputComponent | IInputCoordinates | IInputDate | IInputEmail | IInputFile | IInputIcon | IInputIp | IInputItemList | IInputMobile | IInputMoment | IInputMultiSelect | IInputName | IInputNumber | IInputOptionList | IInputPassword | IInputPrice | IInputRoute | IInputSelect | IInputText | IInputTextarea | IInputUrl;
 type Inputs = NgxFormInputs | {
     readonly header: string;
     readonly input: NgxFormInputs;
@@ -97,24 +97,43 @@ interface IInputColor extends Omit<IInput, 'english' | 'autoFocus'> {
     readonly type: 'COLOR';
 }
 
+type NgxFormComponentInputs = {
+    [key: string]: any;
+};
+interface INgxFormCoordinates {
+    readonly latitude: number;
+    readonly longitude: number;
+}
+interface INgxFormOption {
+    readonly id: string;
+    readonly title: string;
+}
+interface INgxFormOptionGroup {
+    readonly title: string;
+    readonly ids: string[];
+}
+interface INgxFormName {
+    readonly first: string;
+    readonly last: string;
+}
+interface INgxFormOptionList {
+    readonly id: string | null;
+    readonly title: string;
+}
+type NgxFormRoute = INgxFormCoordinates[];
+
 interface IInputComponent extends Omit<IInput, 'value' | 'english' | 'autoFocus'> {
     readonly type: 'COMPONENT';
     readonly value?: any;
     readonly component: ComponentType<any>;
-    readonly componentInputs?: {
-        [key: string]: any;
-    };
+    readonly componentInputs?: NgxFormComponentInputs;
     readonly zeroPadding?: boolean;
 }
 
-interface ICoordinates {
-    latitude: number;
-    longitude: number;
-}
 interface IInputCoordinates extends Omit<IInput, 'value' | 'english' | 'autoFocus'> {
     readonly type: 'COORDINATES';
-    readonly value?: ICoordinates | null;
-    readonly center?: ICoordinates;
+    readonly value?: INgxFormCoordinates | null;
+    readonly center?: INgxFormCoordinates;
     readonly zoom?: number;
 }
 
@@ -144,6 +163,16 @@ interface IInputIp extends Omit<IInput, 'english'> {
     readonly showIcon?: boolean;
 }
 
+interface IInputItemList extends Omit<IInput, 'value' | 'optional'> {
+    readonly type: 'ITEM-LIST';
+    readonly title: string;
+    readonly value?: string[];
+    readonly minCount?: number;
+    readonly maxCount?: number;
+    readonly disableSort?: boolean;
+    readonly allowDuplicates?: boolean;
+}
+
 interface IInputMobile extends Omit<IInput, 'english'> {
     readonly type: 'MOBILE';
     readonly showIcon?: boolean;
@@ -160,14 +189,8 @@ interface IInputMultiSelect extends Omit<IInput, 'value' | 'optional' | 'autoFoc
     readonly type: 'MULTI-SELECT';
     readonly title: string;
     readonly value?: string[] | null;
-    readonly options: {
-        readonly id: string;
-        readonly title: string;
-    }[];
-    readonly groups?: {
-        readonly title: string;
-        readonly ids: string[];
-    }[];
+    readonly options: INgxFormOption[];
+    readonly groups?: INgxFormOptionGroup[];
     readonly minCount?: number;
     readonly maxCount?: number;
     readonly listMaxHeight?: number;
@@ -175,13 +198,9 @@ interface IInputMultiSelect extends Omit<IInput, 'value' | 'optional' | 'autoFoc
     readonly view?: 'SELECT';
 }
 
-interface IName {
-    readonly first: string;
-    readonly last: string;
-}
 interface IInputName extends Omit<IInput, 'value' | 'hint' | 'english' | 'description' | 'button'> {
     readonly type: 'NAME';
-    readonly value?: IName | null;
+    readonly value?: INgxFormName | null;
 }
 
 interface IInputNumber extends Omit<IInput, 'value' | 'english'> {
@@ -198,6 +217,16 @@ interface IInputNumber extends Omit<IInput, 'value' | 'english'> {
     readonly showText?: boolean;
 }
 
+interface IInputOptionList extends Omit<IInput, 'value' | 'optional'> {
+    readonly type: 'OPTION-LIST';
+    readonly title: string;
+    readonly value?: INgxFormOptionList[];
+    readonly minCount?: number;
+    readonly maxCount?: number;
+    readonly disableSort?: boolean;
+    readonly allowDuplicates?: boolean;
+}
+
 interface IInputPassword extends Omit<IInput, 'english' | 'value'> {
     readonly type: 'PASSWORD';
     readonly verify?: {
@@ -219,13 +248,17 @@ interface IInputPrice extends Omit<IInput, 'value' | 'english'> {
     readonly hideText?: boolean;
 }
 
+interface IInputRoute extends Omit<IInput, 'value' | 'english' | 'autoFocus'> {
+    readonly type: 'ROUTE';
+    readonly value?: NgxFormRoute | null;
+    readonly center?: INgxFormCoordinates;
+    readonly zoom?: number;
+}
+
 interface IInputSelect extends IInput {
     readonly type: 'SELECT';
     readonly title: string;
-    readonly options: {
-        readonly id: string;
-        readonly title: string;
-    }[];
+    readonly options: INgxFormOption[];
     readonly hideSearch?: boolean;
 }
 
@@ -297,6 +330,7 @@ declare class NgxFormComponent implements OnInit, OnChanges, AfterViewInit {
     ngAfterViewInit(): void;
     getInputs(): NgxFormInputs[];
     getValues(): INgxFormValues;
+    updateValues(changedInputs: string[]): void;
     setInput(input: NgxFormInputs): void;
     checkInputs(): void;
     checkSubmit(): void;
@@ -311,4 +345,4 @@ declare class NgxFormComponent implements OnInit, OnChanges, AfterViewInit {
 }
 
 export { NGX_FORM_CONFIG, NGX_FORM_CONTROL, NGX_FORM_INPUT, NgxFormComponent, provideNgxFormConfig };
-export type { IInputComponent, INgxForm, INgxFormButton, INgxFormConfig, INgxFormInit, INgxFormValues, NgxFormInputs };
+export type { IInputComponent, INgxForm, INgxFormButton, INgxFormConfig, INgxFormCoordinates, INgxFormInit, INgxFormName, INgxFormOption, INgxFormOptionGroup, INgxFormOptionList, INgxFormValues, NgxFormComponentInputs, NgxFormInputs, NgxFormRoute };

package/ngx-form-m3.css

@@ -224,6 +224,23 @@
     }
 }
 
+/* INPUTS: ROUTE */
+.ngx-helper-form-m3-route-input {
+    display: flex;
+    align-items: center;
+    column-gap: 1rem;
+
+    cursor: pointer;
+
+    div.distance {
+        flex: 1;
+    }
+
+    div.point {
+        font-size: 90%;
+    }
+}
+
 /* INPUTS: NAME */
 .ngx-helper-form-m3-name-input {
     display: flex;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webilix/ngx-form-m3",
-  "version": "0.0.31",
+  "version": "0.0.38",
   "author": "Ali Amirnezhad",
   "description": "Persian form library for Angular and Material 3",
   "repository": {
@@ -24,10 +24,10 @@
     "@angular/core": ">=20.0.0",
     "@angular/forms": ">=20.0.0",
     "@angular/material": ">=20.0.1",
-    "@webilix/helper-library": ">=6.1.3",
+    "@webilix/helper-library": ">=6.1.5",
     "@webilix/jalali-date-time": ">=2.0.7",
     "@webilix/ngx-calendar-m3": ">=0.0.15",
-    "@webilix/ngx-helper-m3": ">=0.0.29",
+    "@webilix/ngx-helper-m3": ">=0.0.32",
     "ngx-mask": ">=19.0.7"
   },
   "dependencies": {