datasync-dynamic-form 1.3.5 → 1.3.6

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.
@@ -9,10 +9,8 @@ import { Button, Label, FormGroup, Input, InputGroupText, InputGroup, Row as Rea
9
9
  import "./flex-grid.css";
10
10
  const FlexRow = ({ className, ...props }) => (_jsx(ReactstrapRow, { className: ["flex-row", className].filter(Boolean).join(" "), ...props }));
11
11
  const FlexCol = ({ className, ...props }) => (_jsx(ReactstrapCol, { className: ["flex-col", className].filter(Boolean).join(" "), ...props }));
12
- const debugging = false;
13
12
  const globals = {
14
13
  parameters: {
15
- debugging: debugging,
16
14
  local: true,
17
15
  production: false,
18
16
  use_navigate: false,
@@ -35,19 +33,19 @@ export class DsDynamicForm extends Component {
35
33
  */
36
34
  this.updatePageDomElement = (p_pageIndex, p_page_isVisible) => {
37
35
  let pageObject = document.getElementById(`dsdf_page_${p_pageIndex}`);
38
- if (globals.parameters.debugging)
36
+ if (this.debugging)
39
37
  console.log(`updatePageDomElement = (${p_pageIndex}, ${p_page_isVisible ? "show" : "hide"})`);
40
38
  if (!pageObject) {
41
39
  console.error(`Page element with id 'dsdf_page_${p_pageIndex}' not found`);
42
40
  return;
43
41
  }
44
- if (globals.parameters.debugging)
42
+ if (this.debugging)
45
43
  console.log("pageObject.classList(before)->", pageObject.classList);
46
44
  if (p_page_isVisible)
47
45
  pageObject.classList.add("page_visible");
48
46
  else
49
47
  pageObject.classList.remove("page_visible");
50
- if (globals.parameters.debugging)
48
+ if (this.debugging)
51
49
  console.log("pageObject.classList(after)->", pageObject.classList);
52
50
  };
53
51
  /**
@@ -67,7 +65,7 @@ export class DsDynamicForm extends Component {
67
65
  if (this.props.foreign_keys && typeof this.props.foreign_keys !== "object")
68
66
  throw new Error("foreign_keys must be a json object !");
69
67
  this.local_data_blob.data_tier = Object.assign(this.props.foreign_keys ? this.props.foreign_keys : {}, duplicate_data_tier);
70
- if (globals.parameters.debugging)
68
+ if (this.debugging)
71
69
  console.log("clearForm->this.local_data_blob.data_tier =>", this.local_data_blob.data_tier);
72
70
  };
73
71
  this.getFieldData = (fieldName) => {
@@ -77,7 +75,7 @@ export class DsDynamicForm extends Component {
77
75
  };
78
76
  this.setFieldData = (fieldName, value) => {
79
77
  try {
80
- if (globals.parameters.debugging)
78
+ if (this.debugging)
81
79
  console.log("setFieldData:fieldName ->", fieldName, " value ->", value);
82
80
  let duplicate_data_tier = JSON.parse(JSON.stringify(this.local_data_blob.data_tier));
83
81
  duplicate_data_tier[fieldName] = value;
@@ -104,7 +102,7 @@ export class DsDynamicForm extends Component {
104
102
  this.getFieldError = (pFieldObject) => {
105
103
  /** Return data value form field object */
106
104
  try {
107
- if (globals.parameters.debugging)
105
+ if (this.debugging)
108
106
  console.log(`getFieldError(${JSON.stringify(pFieldObject)}) -> ${this.state.fieldError}`);
109
107
  let dbg = (this.state.fieldError && this.state.fieldError[pFieldObject.name]) ? this.state.fieldError[pFieldObject.name] : "";
110
108
  return `${dbg}`;
@@ -217,7 +215,7 @@ export class DsDynamicForm extends Component {
217
215
  if (!canSubmit) {
218
216
  // Scroll to the first field with error only on submit
219
217
  if (firstErrFieldName) {
220
- if (globals.parameters.debugging)
218
+ if (this.debugging)
221
219
  console.log("WScrollTo invoked :-)");
222
220
  WScrollTo(firstErrFieldName);
223
221
  }
@@ -230,7 +228,7 @@ export class DsDynamicForm extends Component {
230
228
  }
231
229
  //Invoke onFormSubmit props
232
230
  if (this.props.onFormSubmit) {
233
- if (globals.parameters.debugging)
231
+ if (this.debugging)
234
232
  alert("onFormSubmit => filter log with AsyncDebug:: prefixe");
235
233
  //If props function return false then cancel form submit and do not save !
236
234
  this.props.onFormSubmit(this.local_data_blob);
@@ -293,7 +291,7 @@ export class DsDynamicForm extends Component {
293
291
  if (this.props.onFormSaved)
294
292
  this.props.onFormSaved(blob);
295
293
  else
296
- console.error("DynamicForm3Tiers2.onFormSaved props is not defined !");
294
+ console.error("DsDynamicForm.onFormSaved props is not defined !");
297
295
  //clear form
298
296
  if (this.props.clearOnSave)
299
297
  this.clearForm();
@@ -306,7 +304,7 @@ export class DsDynamicForm extends Component {
306
304
  if (this.props.onFormUpdated)
307
305
  this.props.onFormUpdated(blob);
308
306
  else
309
- console.error("DynamicForm3Tiers2.onFormUpdated props is not defined !");
307
+ console.error("DsDynamicForm.onFormUpdated props is not defined !");
310
308
  //clear form
311
309
  if (this.props.clearOnUpdate)
312
310
  this.clearForm();
@@ -322,10 +320,18 @@ export class DsDynamicForm extends Component {
322
320
  if (this.props.onFormFailed)
323
321
  this.props.onFormFailed(err);
324
322
  else {
325
- console.error("DynamicForm3Tiers2.onFormFailed props is not defined !");
323
+ console.error("DsDynamicForm.onFormFailed props is not defined !");
326
324
  alert("Erreur de sauvegarde !!!");
327
325
  }
328
326
  };
327
+ this.onBlobErrorLocalHandler = (errorObject) => {
328
+ if (this.props.onBlobErrorHandler)
329
+ this.props.onBlobErrorHandler(errorObject);
330
+ else {
331
+ console.error("DsDynamicForm.onBlobErrorHandler props is not defined !");
332
+ alert(errorObject.message);
333
+ }
334
+ };
329
335
  this.checkValidation = (pFieldObject) => {
330
336
  /** Get field properties */
331
337
  let min = pFieldObject.min_length || 0;
@@ -354,7 +360,7 @@ export class DsDynamicForm extends Component {
354
360
  }
355
361
  if ((max > 0) && (fieldValue.trim().length > max))
356
362
  nextErrors.push(`trop long, ${fieldValue.trim().length - max} caractères en trop.`);
357
- if (globals.parameters.debugging) {
363
+ if (this.debugging) {
358
364
  console.log(`pFieldObject.name->`, JSON.stringify(pFieldObject.name));
359
365
  console.log(`nextErrors->`, JSON.stringify(nextErrors));
360
366
  console.log(`-----------`);
@@ -379,7 +385,7 @@ export class DsDynamicForm extends Component {
379
385
  !isNaN(parseFloat(eventObject.event.target.value)))
380
386
  this.setFieldData(eventObject.fieldObject.name, eventObject.event.target.value);
381
387
  else {
382
- if (globals.parameters.debugging)
388
+ if (this.debugging)
383
389
  console.error(`Value rejected -> ${eventObject.event.target.value}`);
384
390
  }
385
391
  this.checkValidation(eventObject.fieldObject);
@@ -461,7 +467,7 @@ export class DsDynamicForm extends Component {
461
467
  /* Checkbox is override with combobox */
462
468
  return (_jsxs("div", { children: [this.getFieldLabelTitle(field), _jsx(Multiselect, { showArrow: true, options: ["Oui", "Non"], isObject: false, displayValue: "key", selectedValues: this.getFieldData(field.name) ? this.getFieldData(field.name).split(";") : [], placeholder: field.placeholder, emptyRecordMsg: "", onSelect: (selectedList, selectedItem) => { this.setFieldData(field.name, selectedList.join(";")); }, onRemove: (selectedList, selectedItem) => { this.setFieldData(field.name, selectedList.join(";")); }, disable: this.props.read_only, singleSelect: true }), this._error_label(field)] }));
463
469
  case "blob":
464
- return (_jsxs(_Fragment, { children: [this.getFieldLabelTitle(field), _jsxs("div", { className: "col-md-10", children: [_jsx(DsBlob, { item_id: field.name, readOnly: this.props.read_only ? this.props.read_only : false, Caption: `${this.getFieldPrompt(field)} ...`, data: this.getFieldData(field.name), uploadPicture: (UploadFile) => { this.setFieldData(field.name, UploadFile.data); this.checkValidation(field); }, pictureStyle: "pic", buttonStyle: "btn btn-secondary", width: field.width ? field.width : undefined, height: field.height ? field.height : undefined, maxWidth: field.maxWidth ? field.maxWidth : undefined, maxHeight: field.maxHeight ? field.maxHeight : undefined, reduceImage: field.reduceImage ? field.reduceImage : undefined }), this._error_label(field)] })] }));
470
+ return (_jsxs(_Fragment, { children: [this.getFieldLabelTitle(field), _jsxs("div", { className: "col-md-10", children: [_jsx(DsBlob, { item_id: field.name, readOnly: this.props.read_only ? this.props.read_only : false, Caption: `${this.getFieldPrompt(field)} ...`, data: this.getFieldData(field.name), uploadPicture: (UploadFile) => { this.setFieldData(field.name, UploadFile.data); this.checkValidation(field); }, pictureStyle: "pic", buttonStyle: "btn btn-secondary", width: field.width ? field.width : undefined, height: field.height ? field.height : undefined, maxWidth: field.max_width ? field.max_width : undefined, maxHeight: field.max_height ? field.max_height : undefined, maxKBytes: field.max_kbytes ? field.max_kbytes : undefined, reduceImage: field.reduceImage ? field.reduceImage : undefined, onErrorHandler: (errorObject) => { this.onBlobErrorLocalHandler(errorObject); }, debugging: this.debugging }), this._error_label(field)] })] }));
465
471
  case "pdf":
466
472
  return (_jsxs(_Fragment, { children: [this.getFieldLabelTitle(field), _jsxs("div", { className: "col-md-10", children: [_jsx(DsPdf, { item_id: field.name, readOnly: this.props.read_only ? this.props.read_only : false, Caption: `${this.getFieldPrompt(field)} ...`, data: this.getFieldData(field.name), uploadPdf: (UploadFile) => { this.setFieldData(field.name, UploadFile.data); this.checkValidation(field); }, pictureStyle: "pic", buttonStyle: "btn btn-secondary" }), this._error_label(field)] })] }));
467
473
  case "email":
@@ -534,7 +540,7 @@ export class DsDynamicForm extends Component {
534
540
  _jsx("div", { children: _jsx("h1", { children: "Form Missing Pages !!!" }) }), _jsx("form", { children: this.state.form &&
535
541
  this.state.form.Pages &&
536
542
  this.state.form.Pages.map((page, pageIndex) => {
537
- if (globals.parameters.debugging)
543
+ if (this.debugging)
538
544
  console.log(`Rendering page ${pageIndex}:`, page);
539
545
  return (_jsx("div", { id: `dsdf_page_${pageIndex}`, className: `form-page ${((pageIndex == this.state.active_page) || this.props.read_only) ? "page_visible" : ""}`, children: page.Rows.map((row, rowIndex) => {
540
546
  return (_jsx("div", { children: this._rowRendering(row) }, rowIndex));
@@ -552,6 +558,10 @@ export class DsDynamicForm extends Component {
552
558
  this.state = { form: { Pages: [] }, active_page: 0 };
553
559
  this.local_data_blob = { data_tier: {} };
554
560
  }
561
+ // Helper method to get debugging value from props with default fallback
562
+ get debugging() {
563
+ return this.props.debugging ?? false;
564
+ }
555
565
  componentDidUpdate(prevProps) {
556
566
  // Typical usage (don't forget to compare props):
557
567
  if (this.props.form !== prevProps.form) {
@@ -566,7 +576,7 @@ export class DsDynamicForm extends Component {
566
576
  //Page is about to change, then triger onPageChanging Handler
567
577
  if (this.props.onPageChanging)
568
578
  this.props.onPageChanging({ "active_page": prevProps.active_page ?? 0, "next_page": this.props.active_page ?? 0, "last_page": this.state.form.Pages.length - 1 });
569
- if (globals.parameters.debugging)
579
+ if (this.debugging)
570
580
  console.log("active_page has changed !");
571
581
  try {
572
582
  if (prevProps.active_page !== undefined) {
@@ -13,8 +13,9 @@ interface Field {
13
13
  hidden?: boolean;
14
14
  width?: number;
15
15
  height?: number;
16
- maxWidth?: number;
17
- maxHeight?: number;
16
+ max_width?: number;
17
+ max_height?: number;
18
+ max_kbytes?: number;
18
19
  reduceImage?: boolean;
19
20
  name_day?: string;
20
21
  name_month?: string;
@@ -90,6 +91,7 @@ interface DsDynamicFormProps {
90
91
  next_page: number;
91
92
  last_page: number;
92
93
  }) => void;
94
+ onBlobErrorHandler?: (errorObject: ErrorObject) => void;
93
95
  clearOnSave?: boolean;
94
96
  clearOnUpdate?: boolean;
95
97
  onTerminated?: () => void;
@@ -108,6 +110,7 @@ interface DsDynamicFormProps {
108
110
  col_sm?: number | string;
109
111
  col_md?: number | string;
110
112
  col_lg?: number | string;
113
+ debugging?: boolean;
111
114
  }
112
115
  interface DsDynamicFormState {
113
116
  form: Form;
@@ -118,9 +121,15 @@ interface DsDynamicFormState {
118
121
  captcha2?: number;
119
122
  active_page?: number;
120
123
  }
124
+ interface ErrorObject {
125
+ error_code: string;
126
+ error_definition: string;
127
+ message: string;
128
+ }
121
129
  export declare class DsDynamicForm extends Component<DsDynamicFormProps, DsDynamicFormState> {
122
130
  private local_data_blob;
123
131
  constructor(props: DsDynamicFormProps);
132
+ private get debugging();
124
133
  componentDidMount: () => void;
125
134
  componentDidUpdate(prevProps: DsDynamicFormProps): void;
126
135
  /**
@@ -155,6 +164,7 @@ export declare class DsDynamicForm extends Component<DsDynamicFormProps, DsDynam
155
164
  onFormSavedLocalHandler: (blob: DataBlob) => void;
156
165
  onFormUpdatedLocalHandler: (blob: DataBlob) => void;
157
166
  onFormFailedLocalHandler: (err: string) => void;
167
+ onBlobErrorLocalHandler: (errorObject: ErrorObject) => void;
158
168
  checkValidation: (pFieldObject: Field) => boolean;
159
169
  dynamicInputTextChangeHandler: (eventObject: EventObject) => void;
160
170
  dynamicInputNumericChangeHandler: (eventObject: EventObject) => void;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "datasync-dynamic-form",
3
3
  "description": "Datasync Dynamic Form component",
4
- "version": "1.3.5",
4
+ "version": "1.3.6",
5
5
  "main": "dist/DsDynamicForm.js",
6
6
  "module": "dist/DsDynamicForm.js",
7
7
  "types": "dist/types/DsDynamicForm.d.ts",
@@ -17,13 +17,13 @@
17
17
  "email": "pmabiala@me.com"
18
18
  },
19
19
  "devDependencies": {
20
+ "@types/react": "^18.2.75",
21
+ "@types/react-dom": "^18.2.25",
20
22
  "datasync-core": "^1.0.44",
21
23
  "multiselect-react-dropdown": "^2.0.25",
22
24
  "react": ">=18.2.0",
23
25
  "reactstrap": ">=8.4.1",
24
- "typescript": "^5.9.2",
25
- "@types/react": "^18.2.75",
26
- "@types/react-dom": "^18.2.25"
26
+ "typescript": "^5.9.2"
27
27
  },
28
28
  "peerDependencies": {
29
29
  "multiselect-react-dropdown": "^2.0.25",
@@ -37,7 +37,7 @@
37
37
  "license": "ISC",
38
38
  "dependencies": {
39
39
  "axios": "^1.7.2",
40
- "datasync-blob": "^1.1.10",
40
+ "datasync-blob": "^1.1.12",
41
41
  "datasync-pdf": "^0.0.1",
42
42
  "runscripts": "^0.0.1"
43
43
  }