From 0b4f44c00845a48e4c518c0561e6f2f25e6347eb Mon Sep 17 00:00:00 2001 From: Matyas Angyal Date: Fri, 27 Jun 2025 11:31:12 +0200 Subject: [PATCH] fix: add check for nullish required config --- example/package-lock.json | 49 +++++++++----- example/package.json | 3 +- example/public/index.html | 27 +------- example/src/forms/Contact/forms.json | 2 +- src/Fields/Textarea/index.js | 8 +-- src/Questions/Input/index.js | 13 ++-- src/Questions/MultipleCheckboxes/index.js | 10 +-- src/Questions/Textarea/index.js | 78 ++++++++++++----------- 8 files changed, 95 insertions(+), 95 deletions(-) diff --git a/example/package-lock.json b/example/package-lock.json index 059c055e..1dfe5908 100644 --- a/example/package-lock.json +++ b/example/package-lock.json @@ -13,7 +13,8 @@ "react": "file:../node_modules/react", "react-dom": "file:../node_modules/react-dom", "react-router-dom": "^6.22.1", - "react-scripts": "file:../node_modules/react-scripts" + "react-scripts": "file:../node_modules/react-scripts", + "uuid": "file:../node_modules/uuid" }, "devDependencies": { "@babel/plugin-syntax-object-rest-spread": "^7.8.3", @@ -21,31 +22,32 @@ } }, "..": { - "version": "2.0.0", + "name": "@onebeyond/react-form-builder", + "version": "2.3.4", "license": "MIT", "dependencies": { - "countries-list": "^3.0.6", + "countries-list": "^3.1.0", "country-region-data": "^3.0.0", "debounce-promise": "^3.1.2", - "i18n-iso-countries": "^7.10.0", + "i18n-iso-countries": "^7.11.0", "install": "^0.13.0", "react-datepicker": "^4.23.0", "react-google-recaptcha": "^3.1.0", - "react-hook-form": "^7.50.1", + "react-hook-form": "^7.51.2", "react-markdown": "^5.0.3", - "react-phone-number-input": "^3.3.9", + "react-phone-number-input": "^3.3.12", "react-select": "^5.8.0", "react-ymd-date-select": "^0.3.0", "rimraf": "^5.0.5", "theme-ui": "^0.15.7" }, "devDependencies": { - "@babel/core": "^7.23.9", - "@babel/eslint-parser": "^7.23.10", + "@babel/core": "^7.24.4", + "@babel/eslint-parser": "^7.24.1", "@babel/plugin-proposal-private-property-in-object": "^7.21.11", - "@babel/preset-react": "^7.23.3", - "@commitlint/cli": "^19.0.0", - "@commitlint/config-conventional": "^19.0.0", + "@babel/preset-react": "^7.24.1", + "@commitlint/cli": "^19.2.1", + "@commitlint/config-conventional": "^19.1.0", "@hookform/devtools": "^4.3.1", "@rollup/plugin-babel": "^5.2.2", "@rollup/plugin-commonjs": "^17.1.0", @@ -58,7 +60,7 @@ "@storybook/preset-create-react-app": "^3.1.5", "@storybook/react": "^7.6.17", "@testing-library/jest-dom": "^5.16.5", - "@testing-library/react": "^14.2.1", + "@testing-library/react": "^14.3.0", "cross-env": "^7.0.3", "date-fns": "^2.30.0", "eslint": "^8.57.0", @@ -70,15 +72,15 @@ "eslint-plugin-node": "^11.1.0", "eslint-plugin-prettier": "^5.1.3", "eslint-plugin-promise": "^6.1.1", - "eslint-plugin-react": "^7.33.2", + "eslint-plugin-react": "^7.34.1", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-standard": "^4.1.0", "gh-pages": "^2.2.0", "husky": "^9.0.11", - "joi": "^17.12.2", - "npm-check-updates": "^16.14.15", + "joi": "^17.12.3", + "npm-check-updates": "^16.14.18", "npm-run-all": "^4.1.5", - "postcss": "^8.4.35", + "postcss": "^8.4.38", "prettier": "^3.2.5", "react": "^18.2.0", "react-dom": "^18.2.0", @@ -190,6 +192,17 @@ } } }, + "../node_modules/uuid": { + "version": "9.0.1", + "funding": [ + "https://github.com/sponsors/broofa", + "https://github.com/sponsors/ctavan" + ], + "license": "MIT", + "bin": { + "uuid": "dist/bin/uuid" + } + }, "node_modules/@ampproject/remapping": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz", @@ -5131,6 +5144,10 @@ "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==", "dev": true }, + "node_modules/uuid": { + "resolved": "../node_modules/uuid", + "link": true + }, "node_modules/validate-npm-package-license": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz", diff --git a/example/package.json b/example/package.json index 778494c4..e8d8366f 100644 --- a/example/package.json +++ b/example/package.json @@ -16,7 +16,8 @@ "react": "file:../node_modules/react", "react-dom": "file:../node_modules/react-dom", "react-router-dom": "^6.22.1", - "react-scripts": "file:../node_modules/react-scripts" + "react-scripts": "file:../node_modules/react-scripts", + "uuid": "file:../node_modules/uuid" }, "devDependencies": { "@babel/plugin-syntax-object-rest-spread": "^7.8.3", diff --git a/example/public/index.html b/example/public/index.html index 8b6b5783..7eee944c 100644 --- a/example/public/index.html +++ b/example/public/index.html @@ -8,21 +8,6 @@ content="width=device-width, initial-scale=1, shrink-to-fit=no" /> - - - - - react-form-builder @@ -30,16 +15,6 @@ -
- - - \ No newline at end of file + diff --git a/example/src/forms/Contact/forms.json b/example/src/forms/Contact/forms.json index c7368bad..146ce2d1 100644 --- a/example/src/forms/Contact/forms.json +++ b/example/src/forms/Contact/forms.json @@ -377,4 +377,4 @@ ], "id": "4HHq4GwrEE2bDL9YJUbUyi" } -} \ No newline at end of file +} diff --git a/src/Fields/Textarea/index.js b/src/Fields/Textarea/index.js index f59972c6..4c6464f9 100644 --- a/src/Fields/Textarea/index.js +++ b/src/Fields/Textarea/index.js @@ -4,7 +4,7 @@ import { Textarea as TextareaUI, jsx } from 'theme-ui' import React, { useState } from 'react' -const Textarea = React.forwardRef(({ ...props }, ref) => { +const Textarea = React.forwardRef(({ countType, maximumLen, ...props }, ref) => { const [count, setCount] = useState(0) const { 'data-haserrors': haserrors } = props @@ -15,15 +15,15 @@ const Textarea = React.forwardRef(({ ...props }, ref) => { className={haserrors ? 'error-input' : ''} {...props} onChange={(e) => { - if (props.countType === 'word') + if (countType === 'word') setCount(e.target.value.trim().split(/[\s,.\n]+/).length) // By default is char count else setCount(e.target.value.length) }} /> - {props.maximumLen && ( + {maximumLen && ( - {count}/{props.maximumLen} + {count}/{maximumLen} )} diff --git a/src/Questions/Input/index.js b/src/Questions/Input/index.js index cbe72f9a..5e68153c 100644 --- a/src/Questions/Input/index.js +++ b/src/Questions/Input/index.js @@ -69,10 +69,15 @@ const QuestionInput = ({ question, useForm, component, onLinkOpen }) => { placeholder={question.placeholder} defaultValue={question.defaultValue} data-haserrors={!!errors[question.name]} - {...register(question.name, { - ...question.registerConfig, - pattern: new RegExp(question.registerConfig.pattern) - })} + {...register( + question.name, + question.registerConfig + ? { + ...question.registerConfig, + pattern: new RegExp(question.registerConfig.pattern) + } + : {} + )} /> {errors[question.name] && errors[question.name].type && ( { (defaultValue) => defaultValue === option.value )} {...register(question.name, { - ...question.registerConfig, + ...(question.registerConfig ?? {}), onChange: option.disableOthers ? disableOthers(option) : undefined, validate: { - minimumLen: question.registerConfig.minimumLen + minimumLen: question.registerConfig?.minimumLen ? () => getValues()[question.name] && getValues()[question.name].length >= - question.registerConfig.minimumLen + question.registerConfig?.minimumLen : () => true, - maximumLen: question.registerConfig.maximumLen + maximumLen: question.registerConfig?.maximumLen ? () => getValues()[question.name] && getValues()[question.name].length <= - question.registerConfig.maximumLen + question.registerConfig?.maximumLen : () => true } })} diff --git a/src/Questions/Textarea/index.js b/src/Questions/Textarea/index.js index a8dd55d8..bd42c379 100644 --- a/src/Questions/Textarea/index.js +++ b/src/Questions/Textarea/index.js @@ -21,44 +21,44 @@ const QuestionTextarea = ({ question }) => { formState: { errors } } = useFormContext() - - const defaultRows = 5 - const reg = { - ...question.registerConfig, - pattern: new RegExp(question.registerConfig.pattern), - // By default is char count - minLength: - question.registerConfig.countType !== 'word' && - question.registerConfig.minimumLen, - maxLength: - question.registerConfig.countType !== 'word' && - question.registerConfig.maximumLen, - validate: { - minWordCount: (v) => { - if ( - question.registerConfig.countType === 'word' && - question.registerConfig.minimumLen - ) { - return ( - v.trim().split(/[\s,.\n]+/).length >= - question.registerConfig.minimumLen - ) - } else return true - }, - maxWordCount: (v) => { - if ( - question.registerConfig.countType === 'word' && - question.registerConfig.maximumLen - ) { - return ( - v.trim().split(/[\s,.\n]+/).length <= - question.registerConfig.maximumLen - ) - } else return true + const reg = question.registerConfig + ? { + ...question.registerConfig, + pattern: new RegExp(question.registerConfig.pattern), + // By default is char count + minLength: + question.registerConfig.countType !== 'word' && + question.registerConfig.minimumLen, + maxLength: + question.registerConfig.countType !== 'word' && + question.registerConfig.maximumLen, + validate: { + minWordCount: (v) => { + if ( + question.registerConfig.countType === 'word' && + question.registerConfig.minimumLen + ) { + return ( + v.trim().split(/[\s,.\n]+/).length >= + question.registerConfig.minimumLen + ) + } else return true + }, + maxWordCount: (v) => { + if ( + question.registerConfig.countType === 'word' && + question.registerConfig.maximumLen + ) { + return ( + v.trim().split(/[\s,.\n]+/).length <= + question.registerConfig.maximumLen + ) + } else return true + } + } } - } - } + : {} return (
{ name={question.name} placeholder={question.placeholder} defaultValue={question.defaultValue} - maximumLen={question.registerConfig.maximumLen} - countType={question.registerConfig.countType} data-haserrors={!!errors[question.name]} + maximumLen={ + question.registerConfig && question.registerConfig.maximumLen + } + countType={question.registerConfig && question.registerConfig.countType} {...register(question.name, reg)} /> {errors[question.name] &&