@ldquocc/dynamic-form 0.0.6 → 0.0.8

package/lib/shared/models/fields/field.model.d.ts

@@ -1,10 +1,11 @@
-import { FormControl, ValidatorFn } from '@angular/forms';
-import { FIELD_TYPES } from '../../consts/fields';
-import { FieldGrid } from './field-grid.model';
-import { NzLabelAlignType } from 'ng-zorro-antd/form';
-import { ControlType } from '../controls';
-import { FormMode } from '../form';
-import { ViewMode } from '../common';
+import { FormControl, ValidatorFn } from "@angular/forms";
+import { FIELD_TYPES } from "../../consts/fields";
+import { FieldGrid } from "./field-grid.model";
+import { NzLabelAlignType } from "ng-zorro-antd/form";
+import { ControlType } from "../controls";
+import { FormMode } from "../form";
+import { ViewMode } from "../common";
+import { FieldUserConfig } from "../fields/field-user-config.model";
 /**
  * typeof FIELD_TYPES[number] có nghĩa là:
     - FIELD_TYPES là readonly ['input', 'select', 'checkbox']
@@ -45,6 +46,7 @@ export declare abstract class BaseField<T> {
     sublabel?: string;
     seqNum: number;
     enableFieldChange: boolean;
+    userConfigs?: FieldUserConfig;
     constructor(init?: Partial<BaseField<T>>);
     abstract toFormControl(): FormControl;
     abstract getDefaultValue(): T;

package/lib/shared/models/fields/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./field.model";
+export * from "./field-user-config.model";

package/lib/shared/models/fields/input/index.d.ts

@@ -1,3 +1,4 @@
-export * from './input-field.model';
-export * from './input-text-field.model';
-export * from './input-password-field.model';
+export * from "./input-field.model";
+export * from "./input-text-field.model";
+export * from "./input-password-field.model";
+export * from "./input-formatted-field.model";

package/lib/shared/models/fields/input/input-formatted-field.model.d.ts

@@ -0,0 +1,13 @@
+import { FormControl } from "@angular/forms";
+import { InputBaseField } from "./input-field.model";
+import { NumericPreset } from "../../../enums/fields/input-formatted-field.enum";
+import AutoNumeric from "@zeedhi/autonumeric";
+/**
+ * Interface của Input Field dạng format.
+ */
+export declare class InputFormattedField extends InputBaseField {
+    format: NumericPreset;
+    autoNumericOptions?: Partial<AutoNumeric.Options>;
+    constructor(init: Partial<InputFormattedField>);
+    toFormControl(): FormControl;
+}

package/lib/shared/models/fields/select/select-base-field.model.d.ts

@@ -1,9 +1,9 @@
-import { FormControl, ValidatorFn } from '@angular/forms';
-import { SELECT_FIELD_TYPES } from '../../../consts/fields/select-field.const';
-import { BaseField } from '../field.model';
-import { ApiConfig, FieldDependency, FieldDependencyType } from '../../common';
-import { SelectOutputValueType } from '../../common/output-value-type.model';
-import { Suffix } from '../../common/common.model';
+import { FormControl, ValidatorFn } from "@angular/forms";
+import { SELECT_FIELD_TYPES } from "../../../consts/fields/select-field.const";
+import { BaseField } from "../field.model";
+import { ApiConfig, FieldDependency, FieldDependencyType } from "../../common";
+import { SelectOutputValueType } from "../../common/output-value-type.model";
+import { Suffix } from "../../common/common.model";
 export type SelectFieldType = (typeof SELECT_FIELD_TYPES)[number];
 /**
  * Interface base chung cho Các dạng Input Field.

package/lib/shared/models/fields/upload/multi-image-upload-field.model.d.ts

@@ -1,4 +1,4 @@
-import { BaseUploadField } from './base-upload-field.model';
+import { BaseUploadField } from "./base-upload-field.model";
 /**
  * Interface của Multi image upload.
  */

package/lib/shared/services/field.service.d.ts

@@ -1,13 +1,25 @@
-import { Signal } from '@angular/core';
-import { ApiResponse } from '../models/common/api-response.model';
-import { LastChangedParent } from '../models/common';
+import { Signal } from "@angular/core";
+import { ApiResponse } from "../models/common/api-response.model";
+import { LastChangedParent } from "../models/common";
+import { Observable } from "rxjs";
 import * as i0 from "@angular/core";
 export declare class FieldService {
     private httpClient;
-    getAllOptions<T = Record<string, unknown>>(apiUrl: string, queryParams: Record<string, unknown>): import("rxjs").Observable<ApiResponse<T[]>>;
+    getAllOptions<T = Record<string, unknown>>(apiUrl: string, queryParams: Record<string, unknown>): Observable<ApiResponse<T[]>>;
     private dependValuesMap;
     updateDependValuesMap(key: string, value: string): void;
     getDependValuesMap(): Map<string, Signal<string>>;
+    private dependValuesSubjectMap;
+    /**
+     * Bắn (Emit) giá trị thay đổi của một trường Parent vào stream.
+     * Sẽ được gọi bởi Component đóng vai trò là Cha (isParent = true).
+     */
+    emitDependValueChange(key: string, value: string): void;
+    /**
+     * Trả về Observable của một trường để các Component Con có thể subscribe/nghe ngóng.
+     * Sẽ được gọi bởi các Component có chứa `dependsOn`.
+     */
+    getDependValueChanges$(key: string): Observable<string | null>;
     private dependValues;
     updateDependValues(key: string, value: string): void;
     removeDependValues(key: string): void;
@@ -19,7 +31,7 @@ export declare class FieldService {
     getLastChangedParent(): LastChangedParent | null;
     clearLastChangedParent(): void;
     private fieldChange;
-    fieldChange$: import("rxjs").Observable<{
+    fieldChange$: Observable<{
         key: string;
         value: any;
     }>;

package/lib/shared/utils/dynamic-form/dynamic-form.d.ts

@@ -1,7 +1,11 @@
-import { FormGroup } from '@angular/forms';
-import { BaseField } from '../../models/fields/field.model';
-import { FormMode } from '../../models/form';
-import { SelectBaseField } from '../../models/fields/select/select-base-field.model';
+import { FormGroup } from "@angular/forms";
+import { BaseField } from "../../models/fields/field.model";
+import { FormMode } from "../../models/form";
+import { SelectBaseField } from "../../models/fields/select/select-base-field.model";
 export declare const buildForm: (fields: BaseField<any>[], mode: FormMode, model?: Record<string, any>) => FormGroup;
+export declare const createInputPlaceholder: (field: BaseField<any>) => string;
+export declare const createSingleSelectPlaceholder: (field: BaseField<any>) => string;
+export declare const createMultiSelectPlaceholder: (field: BaseField<any>) => string;
+export declare const createDatePickerPlaceholder: (field: BaseField<any>) => string;
 export declare const createPlaceholder: (field: BaseField<any>) => string;
 export declare const createSelectPlaceholder: <K>(field: SelectBaseField<K>) => string;

package/package.json

@@ -1,21 +1,20 @@
 {
   "name": "@ldquocc/dynamic-form",
-  "version": "0.0.6",
+  "version": "0.0.8",
   "peerDependencies": {
     "@angular/common": "^19.2.0",
     "@angular/core": "^19.2.0",
     "@angular/forms": "^19.2.0",
     "@angular/router": "^19.2.0",
-    "@ngx-translate/core": "^16.0.4",
     "ng-zorro-antd": "^19.2.1",
     "ngx-currency": "^19.0.0",
-    "ngx-toastr": "^19.0.0",
     "rxjs": "~7.8.0"
   },
   "dependencies": {
     "tslib": "^2.3.0",
     "date-fns": "^2.30.0",
-    "lodash-es": "^4.17.21"
+    "lodash-es": "^4.17.21",
+    "@zeedhi/autonumeric": "^4.6.5"
   },
   "sideEffects": false,
   "module": "fesm2022/ldquocc-dynamic-form.mjs",

package/public-api.d.ts

@@ -1,7 +1,7 @@
 export * from "./lib/shared/models/fields/field.model";
 export * from "./lib/shared/models/fields/field-grid.model";
 export * from "./lib/shared/models/fields/field-group.model";
-export * from "./lib/shared/models/fields/index.model";
+export * from "./lib/shared/models/fields/index";
 export * from "./lib/dynamic-form.component";
 export * from "./lib/shared/config/dynamic-form.config";
 export * from "./lib/shared/services/form-config.service";
@@ -18,11 +18,11 @@ export * from "./lib/shared/enums/form/index";
 export * from "./lib/shared/models/common/index";
 export * from "./lib/shared/models/common/table-models";
 export * from "./lib/shared/models/fields/input/index";
+export * from "./lib/shared/models/fields/input/input-formatted-field.model";
 export * from "./lib/shared/models/fields/textarea/textarea-field.model";
 export * from "./lib/shared/models/fields/date/index";
 export * from "./lib/shared/models/fields/select/select-base-field.model";
 export * from "./lib/shared/models/fields/select/single-select-field.model";
 export * from "./lib/shared/models/fields/select/multi-select-field.model";
-export * from "./lib/shared/models/fields/select/tree-select-field.model";
 export * from "./lib/shared/models/fields/upload/index";
 export * from "./lib/shared/models/fields/radio/radio-base-field.model";

package/styles/_common-form.scss

@@ -1,3 +1,12 @@
+// @import "@mdi/font/css/materialdesignicons.css";
+
+.no-text-info {
+  pointer-events: none;
+  background-color: white;
+  font-size: 12px;
+  color: #575757 !important;
+}
+
 .w-100 {
   width: 100%;
 }
@@ -22,6 +31,18 @@
   align-items: center;
 }
 
+.flex-1 {
+  flex: 1;
+}
+
+.gap-8 {
+  gap: 8px;
+}
+
+.min-w-0 {
+  min-width: 0;
+}
+
 .mb-0 {
   margin-bottom: 0 !important;
 }
@@ -29,3 +50,25 @@
 .break-work {
   word-break: break-word;
 }
+
+.text-white {
+  color: #ffffff !important;
+}
+
+.fs-12 {
+  font-size: 12px !important;
+}
+
+.pointer {
+  cursor: pointer;
+}
+
+.text-danger {
+  color: #eb0c0c;
+}
+
+.modeView {
+  pointer-events: none;
+  color: #575757;
+  // font-size: 12px;
+}

package/lib/shared/models/fields/index.model.d.ts

@@ -1 +0,0 @@
-export * from './field.model';