@itcase/forms 1.1.14 → 1.1.16

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

@@ -12,6 +12,18 @@
     &_type_row.&_hidden {
       visibility: hidden;
     }
+    &_column {
+      @each $count in 2, 3, 4, 5 {
+        &_$(count) {
+          ^^&-items {
+            display: grid;
+            column-gap: 24px;
+            grid-template-columns: repeat($(count), 1fr);
+            align-items: end;
+          }
+        }
+      }
+    }
     &-wrapper {
       display: flex;
       flex-flow: column nowrap;

package/dist/itcase-forms.cjs.js

@@ -1380,6 +1380,13 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
   });
 });
 
+const defaultGroupProps = {
+  width: 'fill',
+  labelTextColor: 'surfaceTextPrimary',
+  labelTextSize: 'h5',
+  labelTextWeight: 500
+};
+
 const Group = /*#__PURE__*/React__default.default.memo(function Group(props) {
   const {
     className,
@@ -1389,7 +1396,12 @@ const Group = /*#__PURE__*/React__default.default.memo(function Group(props) {
     labelTextSize,
     labelTextWeight,
     message,
+    column,
     dataTour,
+    title,
+    titleTextSize,
+    titleTextColor,
+    titleTextWeight,
     messageTextColor = 'surfaceTextTertiary',
     messageTextSize = 's',
     messageTextWeight,
@@ -1426,13 +1438,19 @@ const Group = /*#__PURE__*/React__default.default.memo(function Group(props) {
       validationStateKey: isErrorState ? errorKey : 'success'
     });
     return /*#__PURE__*/React__default.default.createElement("div", {
-      className: clsx__default.default('form__group', className, isHidden && 'form__group_hidden'),
+      className: clsx__default.default('form__group', className, isHidden && 'form__group_hidden', column && `form__group_column_${column}`),
       "data-tour": dataTour
     }, /*#__PURE__*/React__default.default.createElement("div", {
       className: "form__group-wrapper"
-    }, before, label && /*#__PURE__*/React__default.default.createElement("div", {
-      className: "form__group-label"
+    }, before, title && /*#__PURE__*/React__default.default.createElement("div", {
+      className: "form__group-title"
     }, /*#__PURE__*/React__default.default.createElement(Title.Title, {
+      size: titleTextSize,
+      textColor: titleTextColor,
+      textWeight: titleTextWeight
+    }, title)), label && /*#__PURE__*/React__default.default.createElement("div", {
+      className: "form__group-label"
+    }, /*#__PURE__*/React__default.default.createElement(Text.Text, {
       size: labelTextSize,
       textColor: labelTextColor,
       textWeight: labelTextWeight
@@ -3089,6 +3107,7 @@ exports.defaultCodeProps = defaultCodeProps;
 exports.defaultDatepickerProps = defaultDatepickerProps;
 exports.defaultDropzoneProps = defaultDropzoneProps;
 exports.defaultFieldProps = defaultFieldProps;
+exports.defaultGroupProps = defaultGroupProps;
 exports.defaultInputProps = defaultInputProps;
 exports.defaultRadioProps = defaultRadioProps;
 exports.defaultSegmentedProps = defaultSegmentedProps;

package/dist/itcase-forms.esm.js

@@ -1369,6 +1369,13 @@ const FileInput = /*#__PURE__*/React$1.memo(function FileInput(props) {
   });
 });
 
+const defaultGroupProps = {
+  width: 'fill',
+  labelTextColor: 'surfaceTextPrimary',
+  labelTextSize: 'h5',
+  labelTextWeight: 500
+};
+
 const Group = /*#__PURE__*/React$1.memo(function Group(props) {
   const {
     className,
@@ -1378,7 +1385,12 @@ const Group = /*#__PURE__*/React$1.memo(function Group(props) {
     labelTextSize,
     labelTextWeight,
     message,
+    column,
     dataTour,
+    title,
+    titleTextSize,
+    titleTextColor,
+    titleTextWeight,
     messageTextColor = 'surfaceTextTertiary',
     messageTextSize = 's',
     messageTextWeight,
@@ -1415,13 +1427,19 @@ const Group = /*#__PURE__*/React$1.memo(function Group(props) {
       validationStateKey: isErrorState ? errorKey : 'success'
     });
     return /*#__PURE__*/React$1.createElement("div", {
-      className: clsx('form__group', className, isHidden && 'form__group_hidden'),
+      className: clsx('form__group', className, isHidden && 'form__group_hidden', column && `form__group_column_${column}`),
       "data-tour": dataTour
     }, /*#__PURE__*/React$1.createElement("div", {
       className: "form__group-wrapper"
-    }, before, label && /*#__PURE__*/React$1.createElement("div", {
-      className: "form__group-label"
+    }, before, title && /*#__PURE__*/React$1.createElement("div", {
+      className: "form__group-title"
     }, /*#__PURE__*/React$1.createElement(Title, {
+      size: titleTextSize,
+      textColor: titleTextColor,
+      textWeight: titleTextWeight
+    }, title)), label && /*#__PURE__*/React$1.createElement("div", {
+      className: "form__group-label"
+    }, /*#__PURE__*/React$1.createElement(Text, {
       size: labelTextSize,
       textColor: labelTextColor,
       textWeight: labelTextWeight
@@ -3038,4 +3056,4 @@ const getErrorsForFinalForm = error => {
   return formErrors;
 };
 
-export { CheckboxField, ChipsField, ChoiceField, CodeField, CustomField, DEFAULT_MESSAGES_FIELDS, DatePickerField, FieldWrapper, FieldWrapperBase, FileInput, FinalForm, Group, InputField, MaskedInputField, RadioGroup, SegmentedField, SelectField, SwitchField, TextareaField, addRequiredFieldsParamToSchema, dateValidation, defaultCheckboxProps, defaultChipsProps, defaultChoiceProps, defaultCodeProps, defaultDatepickerProps, defaultDropzoneProps, defaultFieldProps, defaultInputProps, defaultRadioProps, defaultSegmentedProps, defaultSelectProps, defaultSwitchProps, defaultTextareaProps, emailValidation, focusOnError, focusOnErrorDecorator, formTypes, generateField, getErrorsForFinalForm, parseNumericField, phoneValidation, sendFormDataToServer, setErrorsMutator, useYupValidationSchema };
+export { CheckboxField, ChipsField, ChoiceField, CodeField, CustomField, DEFAULT_MESSAGES_FIELDS, DatePickerField, FieldWrapper, FieldWrapperBase, FileInput, FinalForm, Group, InputField, MaskedInputField, RadioGroup, SegmentedField, SelectField, SwitchField, TextareaField, addRequiredFieldsParamToSchema, dateValidation, defaultCheckboxProps, defaultChipsProps, defaultChoiceProps, defaultCodeProps, defaultDatepickerProps, defaultDropzoneProps, defaultFieldProps, defaultGroupProps, defaultInputProps, defaultRadioProps, defaultSegmentedProps, defaultSelectProps, defaultSwitchProps, defaultTextareaProps, emailValidation, focusOnError, focusOnErrorDecorator, formTypes, generateField, getErrorsForFinalForm, parseNumericField, phoneValidation, sendFormDataToServer, setErrorsMutator, useYupValidationSchema };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/forms",
-  "version": "1.1.14",
+  "version": "1.1.16",
   "description": "Forms fields, inputs, etc.",
   "keywords": [],
   "license": "MIT",
@@ -32,14 +32,14 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "@itcase/common": "^1.2.26",
-    "@itcase/config": "^1.0.47",
-    "@itcase/icons": "^1.1.1",
-    "@itcase/storybook-config": "^1.1.13",
+    "@itcase/common": "^1.2.28",
+    "@itcase/config": "^1.0.48",
+    "@itcase/icons": "^1.1.4",
+    "@itcase/storybook-config": "^1.1.14",
     "@itcase/tokens-am": "^1.1.9",
     "@itcase/tokens-baikal": "^1.1.9",
-    "@itcase/ui": "^1.8.21",
-    "axios": "^1.9.0",
+    "@itcase/ui": "^1.8.31",
+    "axios": "^1.10.0",
     "clsx": "^2.1.1",
     "final-form": "4.20.10",
     "final-form-focus": "1.1.2",
@@ -56,7 +56,7 @@
     "react-select": "^5.10.1"
   },
   "devDependencies": {
-    "@itcase/lint": "^1.1.10",
+    "@itcase/lint": "^1.1.18",
     "@babel/core": "^7.27.4",
     "@babel/eslint-parser": "^7.27.5",
     "@babel/preset-env": "^7.27.2",
@@ -64,7 +64,7 @@
     "@commitlint/cli": "^19.8.1",
     "@commitlint/config-conventional": "^19.8.1",
     "@rollup/plugin-babel": "^6.0.4",
-    "@rollup/plugin-commonjs": "^28.0.3",
+    "@rollup/plugin-commonjs": "^28.0.6",
     "@rollup/plugin-json": "^6.1.0",
     "@rollup/plugin-node-resolve": "^16.0.1",
     "@rollup/plugin-terser": "^0.4.4",
@@ -76,15 +76,15 @@
     "babel-plugin-inline-react-svg": "^2.0.2",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "conventional-changelog-conventionalcommits": "^9.0.0",
-    "eslint": "9.28.0",
+    "eslint": "9.29.0",
     "husky": "^9.1.7",
-    "lint-staged": "^16.1.0",
-    "postcss": "^8.5.4",
+    "lint-staged": "^16.1.2",
+    "postcss": "^8.5.6",
     "prettier": "3.5.3",
-    "rollup": "^4.42.0",
+    "rollup": "^4.44.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "semantic-release": "^24.2.5",
-    "stylelint": "^16.20.0",
+    "stylelint": "^16.21.0",
     "typescript": "^5.8.3",
     "yup": "^1.6.1"
   }