@itcase/forms 1.0.71 → 1.0.73

package/dist/css/form/Field/Group/Group.css

@@ -2,6 +2,15 @@
   &__group {
     width: 100%;
     margin: 0 0 12px 0;
+    &_hidden {
+      visibility: hidden;
+      display: none;
+      position: absolute;
+      z-index: -1;
+    }
+    &_type_row.&_hidden {
+      visibility: hidden
+    }
     &-wrapper {
       display: flex;
       flex-flow: column nowrap;

package/dist/itcase-forms.cjs.js

@@ -1463,21 +1463,22 @@ FileInput.propTypes = {
 
 const Group = /*#__PURE__*/React__default.default.memo(function Group(props) {
   const {
+    children,
+    isHidden,
     after,
     before,
     className,
+    dataTour,
     label,
     labelTextColor,
     labelTextSize,
     labelTextWeight,
     message,
+    messageTextColor,
     messageTextSize,
     messageTextWeight,
-    messageTextColor,
-    children,
-    dataTour,
-    showGroupMessage,
-    name
+    name,
+    showGroupMessage
   } = props;
   return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
     name: name
@@ -1493,7 +1494,6 @@ const Group = /*#__PURE__*/React__default.default.memo(function Group(props) {
      */
     const {
       isErrorState,
-      isValidState,
       errorKey,
       errorMessage
     } = useFieldValidationState({
@@ -1503,11 +1503,11 @@ const Group = /*#__PURE__*/React__default.default.memo(function Group(props) {
       meta: meta
     });
     const updatedProps = useValidationAppearanceInputProps({
-      validationStateKey: isErrorState ? errorKey : 'success',
-      inputProps: props
+      inputProps: props,
+      validationStateKey: isErrorState ? errorKey : 'success'
     });
     return /*#__PURE__*/React__default.default.createElement("div", {
-      className: clsx__default.default('form__group', className),
+      className: clsx__default.default('form__group', className, isHidden && 'form__group_hidden'),
       "data-tour": dataTour
     }, /*#__PURE__*/React__default.default.createElement("div", {
       className: "form__group-wrapper"
@@ -1537,19 +1537,19 @@ const Group = /*#__PURE__*/React__default.default.memo(function Group(props) {
   });
 });
 Group.defaultProps = {
-  inputProps: {},
-  fieldProps: {},
-  type: 'normal',
-  errorMessageTextSize: 's',
   errorMessageTextColor: 'errorTextPrimary',
+  errorMessageTextSize: 's',
+  fieldProps: {},
+  inputProps: {},
+  messageTextColor: 'surfaceTextTertiary',
   messageTextSize: 's',
-  messageTextColor: 'surfaceTextTertiary'
+  type: 'normal'
 };
 Group.propTypes = {
-  name: PropTypes__default.default.string.isRequired,
+  isRequired: PropTypes__default.default.bool,
   fieldProps: PropTypes__default.default.object,
   inputProps: PropTypes__default.default.object,
-  isRequired: PropTypes__default.default.bool
+  name: PropTypes__default.default.string.isRequired
 };
 
 const InputField = /*#__PURE__*/React__default.default.memo(function InputField(props) {
@@ -2066,7 +2066,9 @@ const SelectField = /*#__PURE__*/React__default.default.memo(function SelectFiel
       setSelectedOptions(option);
       onChangeField(value);
     }, [onChangeField]);
-    React.useEffect(() => setSelectedOptions(defaultValue), [defaultValue]);
+    React.useEffect(() => {
+      setSelectedOptions(defaultValue);
+    }, [defaultValue]);
     const {
       isErrorState,
       isValidState,

package/dist/itcase-forms.esm.js

@@ -1449,21 +1449,22 @@ FileInput.propTypes = {
 
 const Group = /*#__PURE__*/React.memo(function Group(props) {
   const {
+    children,
+    isHidden,
     after,
     before,
     className,
+    dataTour,
     label,
     labelTextColor,
     labelTextSize,
     labelTextWeight,
     message,
+    messageTextColor,
     messageTextSize,
     messageTextWeight,
-    messageTextColor,
-    children,
-    dataTour,
-    showGroupMessage,
-    name
+    name,
+    showGroupMessage
   } = props;
   return /*#__PURE__*/React.createElement(Field, {
     name: name
@@ -1479,7 +1480,6 @@ const Group = /*#__PURE__*/React.memo(function Group(props) {
      */
     const {
       isErrorState,
-      isValidState,
       errorKey,
       errorMessage
     } = useFieldValidationState({
@@ -1489,11 +1489,11 @@ const Group = /*#__PURE__*/React.memo(function Group(props) {
       meta: meta
     });
     const updatedProps = useValidationAppearanceInputProps({
-      validationStateKey: isErrorState ? errorKey : 'success',
-      inputProps: props
+      inputProps: props,
+      validationStateKey: isErrorState ? errorKey : 'success'
     });
     return /*#__PURE__*/React.createElement("div", {
-      className: clsx('form__group', className),
+      className: clsx('form__group', className, isHidden && 'form__group_hidden'),
       "data-tour": dataTour
     }, /*#__PURE__*/React.createElement("div", {
       className: "form__group-wrapper"
@@ -1523,19 +1523,19 @@ const Group = /*#__PURE__*/React.memo(function Group(props) {
   });
 });
 Group.defaultProps = {
-  inputProps: {},
-  fieldProps: {},
-  type: 'normal',
-  errorMessageTextSize: 's',
   errorMessageTextColor: 'errorTextPrimary',
+  errorMessageTextSize: 's',
+  fieldProps: {},
+  inputProps: {},
+  messageTextColor: 'surfaceTextTertiary',
   messageTextSize: 's',
-  messageTextColor: 'surfaceTextTertiary'
+  type: 'normal'
 };
 Group.propTypes = {
-  name: PropTypes.string.isRequired,
+  isRequired: PropTypes.bool,
   fieldProps: PropTypes.object,
   inputProps: PropTypes.object,
-  isRequired: PropTypes.bool
+  name: PropTypes.string.isRequired
 };
 
 const InputField = /*#__PURE__*/React.memo(function InputField(props) {
@@ -2052,7 +2052,9 @@ const SelectField = /*#__PURE__*/React.memo(function SelectField(props) {
       setSelectedOptions(option);
       onChangeField(value);
     }, [onChangeField]);
-    useEffect(() => setSelectedOptions(defaultValue), [defaultValue]);
+    useEffect(() => {
+      setSelectedOptions(defaultValue);
+    }, [defaultValue]);
     const {
       isErrorState,
       isValidState,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/forms",
-  "version": "1.0.71",
+  "version": "1.0.73",
   "description": "Forms fields, inputs, etc.",
   "keywords": [],
   "license": "MIT",
@@ -30,37 +30,37 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "@itcase/common": "^1.2.15",
-    "@itcase/ui": "^1.2.21",
-    "axios": "^1.7.7",
+    "@itcase/common": "^1.2.17",
+    "@itcase/ui": "^1.2.34",
+    "axios": "^1.7.9",
     "clsx": "^2.1.1",
     "final-form": "^4.20.10",
     "final-form-focus": "^1.1.2",
-    "libphonenumber-js": "^1.11.12",
+    "libphonenumber-js": "^1.11.16",
     "lodash": "^4.17.21",
     "luxon": "^3.5.0",
-    "postcss": "^8.4.47",
+    "postcss": "^8.4.49",
     "prop-types": "^15.8.1",
     "react": "^18.3.1",
     "react-date-range": "^2.0.1",
     "react-datepicker": "^7.5.0",
     "react-dom": "^18.3.1",
-    "react-dropzone": "^14.2.10",
+    "react-dropzone": "^14.3.5",
     "react-final-form": "^6.5.9",
     "react-imask": "^7.6.1",
-    "react-select": "^5.8.1"
+    "react-select": "^5.8.3"
   },
   "devDependencies": {
-    "@itcase/lint": "^1.0.14",
-    "@babel/core": "^7.25.9",
+    "@itcase/lint": "^1.0.33",
+    "@babel/core": "^7.26.0",
     "@babel/eslint-parser": "^7.25.9",
-    "@babel/preset-env": "^7.25.9",
+    "@babel/preset-env": "^7.26.0",
     "@babel/preset-react": "^7.25.9",
-    "@commitlint/cli": "^19.5.0",
-    "@commitlint/config-conventional": "^19.5.0",
-    "@eslint/compat": "^1.2.1",
-    "@eslint/eslintrc": "^3.1.0",
-    "@ianvs/prettier-plugin-sort-imports": "^4.3.1",
+    "@commitlint/cli": "^19.6.0",
+    "@commitlint/config-conventional": "^19.6.0",
+    "@eslint/compat": "^1.2.3",
+    "@eslint/eslintrc": "^3.2.0",
+    "@ianvs/prettier-plugin-sort-imports": "^4.4.0",
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^28.0.1",
     "@rollup/plugin-json": "^6.1.0",
@@ -74,21 +74,21 @@
     "babel-plugin-inline-react-svg": "^2.0.2",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "conventional-changelog-conventionalcommits": "^8.0.0",
-    "eslint": "9.13.0",
+    "eslint": "9.16.0",
     "eslint-config-prettier": "9.1.0",
     "eslint-config-standard": "17.1.0",
     "eslint-plugin-babel": "5.3.1",
     "eslint-plugin-import": "2.31.0",
-    "eslint-plugin-n": "17.11.1",
+    "eslint-plugin-n": "17.14.0",
     "eslint-plugin-node": "11.1.0",
     "eslint-plugin-prettier": "5.2.1",
-    "eslint-plugin-promise": "7.1.0",
+    "eslint-plugin-promise": "7.2.1",
     "eslint-plugin-react": "7.37.2",
     "eslint-plugin-react-hooks": "5.0.0",
     "eslint-plugin-standard": "5.0.0",
-    "husky": "^9.1.6",
+    "husky": "^9.1.7",
     "lint-staged": "^15.2.10",
-    "npm": "^10.9.0",
+    "npm": "^10.9.1",
     "postcss-aspect-ratio-polyfill": "^2.0.0",
     "postcss-cli": "^11.0.0",
     "postcss-combine-duplicated-selectors": "^10.0.3",
@@ -102,22 +102,22 @@
     "postcss-import": "^16.1.0",
     "postcss-import-ext-glob": "^2.1.1",
     "postcss-mixins": "^11.0.3",
-    "postcss-nested": "^6.2.0",
+    "postcss-nested": "^7.0.2",
     "postcss-nested-ancestors": "^3.0.0",
     "postcss-normalize": "^13.0.1",
     "postcss-prepend-imports": "^1.0.1",
-    "postcss-preset-env": "^10.0.8",
+    "postcss-preset-env": "^10.1.1",
     "postcss-pxtorem": "^6.1.0",
     "postcss-responsive-type": "github:ITCase/postcss-responsive-type",
     "postcss-sort-media-queries": "^5.2.0",
-    "prettier": "3.3.3",
-    "rollup": "^4.24.0",
+    "prettier": "3.4.2",
+    "rollup": "^4.28.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
-    "semantic-release": "^24.1.3",
-    "stylelint": "^16.10.0",
+    "semantic-release": "^24.2.0",
+    "stylelint": "^16.11.0",
     "stylelint-config-standard": "^36.0.1",
-    "stylelint-no-unsupported-browser-features": "^8.0.1",
+    "stylelint-no-unsupported-browser-features": "^8.0.2",
     "stylelint-order": "^6.0.4",
-    "typescript": "^5.6.3"
+    "typescript": "^5.7.2"
   }
 }