@itcase/forms 1.1.34 → 1.1.36

package/dist/css/form/Field/RadioGroup/RadioGroup.css

@@ -12,11 +12,11 @@
 }
 
 .form-field {
-  &_type {
-    &_radio {
-      &.form-field_size {
-        @each $size in xxl, xl, l, m, s, xs, xxs {
-          &_$(size) {
+  &_radio {
+    &.form-field_size {
+      @each $size in xxl, xl, l, m, s, xs, xxs {
+        &_$(size) {
+          & .form-radio {
             gap: var(--form-filed-radio-size-$(size)-gap);
           }
         }
@@ -26,4 +26,5 @@
 }
 
 :root {
+  --form-filed-radio-size-m-gap: 12px;
 }

package/dist/itcase-forms.cjs.js

@@ -442,7 +442,7 @@ function FieldWrapper(props) {
 }
 
 const defaultDropzoneProps = {
-  fill: 'surfacePrimary',
+  fill: 'surfaceSecondary',
   borderColor: 'surfaceBorderTertiary',
   borderColorHover: 'surfaceBorderQuaternary',
   hintTitle: 'Перетащите изображение или выберите файл с компьютера',
@@ -646,11 +646,12 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
     thumbNameTextWrap
   } = propsGenerator;
   return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, /*#__PURE__*/React__default.default.createElement("div", getRootProps({
-    className: `form-dropzone__dropzone dropzone ${className} form-dropzone__dropzone_size_${size} ${shapeClass}`
+    // className: `form-dropzone__dropzone dropzone  ${className} form-dropzone__dropzone_size_${size} ${shapeClass}`,
+    className: `form-dropzone__dropzone dropzone`
   }), /*#__PURE__*/React__default.default.createElement("input", Object.assign({}, getInputProps(), {
     name: inputName
   })), /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default('form-dropzone__dropzone-wrapper', thumbColumn && `form-dropzone__dropzone-wrapper_column_${thumbColumn}`, fillClass, fillHoverClass, borderWidthClass, borderColorClass, borderColorHoverClass, borderTypeClass)
+    className: clsx__default.default('form-dropzone__dropzone-wrapper', thumbColumn && `form-dropzone__dropzone-wrapper_column_${thumbColumn}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderTypeClass && `border_type_${borderTypeClass}`, shapeClass && `shape_${shapeClass}`)
   }, filesList.map((file, index) => /*#__PURE__*/React__default.default.createElement("aside", {
     className: clsx__default.default('form-dropzone__thumb', fillClass, thumbDirectionClass, thumbBorderWidthClass, thumbBorderColorClass, thumbBorderColorHoverClass, thumbBorderTypeClass),
     key: file.id || `${file.name}_${index}`
@@ -680,10 +681,7 @@ const FileInputDropzone = /*#__PURE__*/React__default.default.memo(function File
     className: "form-dropzone__thumb-loader"
   }, /*#__PURE__*/React__default.default.createElement(Loader.Loader, {
     width: "fill",
-    height: "fill",
-    fill: "surfacePrimary",
-    itemFill: "surfaceItemAccent",
-    set: "simple"
+    height: "fill"
   })), /*#__PURE__*/React__default.default.createElement("div", {
     className: clsx__default.default('form-dropzone__thumb-remove')
   }, /*#__PURE__*/React__default.default.createElement(Button.Button, {
@@ -844,9 +842,9 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
     hintTitleTextWeight,
     hintTitleTextWrap,
     removeThumbAppearance,
+    removeThumbShape,
     removeThumbText,
     removeThumbTextWeight,
-    removeThumbShape,
     shape,
     thumbBorderColor,
     thumbBorderColorHover,
@@ -938,9 +936,9 @@ const FileInput = /*#__PURE__*/React__default.default.memo(function FileInput(pr
       inputValue: input.value,
       metaTouched: meta.touched,
       removeThumbAppearance: removeThumbAppearance,
+      removeThumbShape: removeThumbShape,
       removeThumbText: removeThumbText,
       removeThumbTextWeight: removeThumbTextWeight,
-      removeThumbShape: removeThumbShape,
       shape: shape,
       showFilename: showFilename,
       thumbBorderColor: thumbBorderColor,
@@ -996,6 +994,11 @@ const FormBlockGroup = /*#__PURE__*/React__default.default.memo(function Group(p
     isHidden,
     children
   } = props;
+
+  // @ts-expect-error
+  const {
+    styles: styles
+  } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement(reactFinalForm.Field, {
     name: name
   }, function Render({
@@ -1024,7 +1027,8 @@ const FormBlockGroup = /*#__PURE__*/React__default.default.memo(function Group(p
     });
     return /*#__PURE__*/React__default.default.createElement("div", {
       className: clsx__default.default('form__group', className, isHidden && 'form__group_hidden', column && `form__group_column_${column}`),
-      "data-tour": dataTour
+      "data-tour": dataTour,
+      style: styles
     }, /*#__PURE__*/React__default.default.createElement("div", {
       className: "form__group-wrapper"
     }, before, title && /*#__PURE__*/React__default.default.createElement("div", {
@@ -2372,7 +2376,7 @@ const RadioGroup = /*#__PURE__*/React__default.default.memo(function RadioGroup(
       validationStateKey: isErrorState ? errorKey : 'success'
     });
     return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
-      className: clsx__default.default('form-field_radio', 'form__item_radio"', classNameGroupItem),
+      className: clsx__default.default('form-field_radio', 'form__item_radio', classNameGroupItem),
       errorKey: errorKey,
       errorMessage: errorMessage,
       isErrorState: isErrorState,

package/dist/itcase-forms.esm.js

@@ -431,7 +431,7 @@ function FieldWrapper(props) {
 }
 
 const defaultDropzoneProps = {
-  fill: 'surfacePrimary',
+  fill: 'surfaceSecondary',
   borderColor: 'surfaceBorderTertiary',
   borderColorHover: 'surfaceBorderQuaternary',
   hintTitle: 'Перетащите изображение или выберите файл с компьютера',
@@ -635,11 +635,12 @@ const FileInputDropzone = /*#__PURE__*/React.memo(function FileInputDropzone(pro
     thumbNameTextWrap
   } = propsGenerator;
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", getRootProps({
-    className: `form-dropzone__dropzone dropzone ${className} form-dropzone__dropzone_size_${size} ${shapeClass}`
+    // className: `form-dropzone__dropzone dropzone  ${className} form-dropzone__dropzone_size_${size} ${shapeClass}`,
+    className: `form-dropzone__dropzone dropzone`
   }), /*#__PURE__*/React.createElement("input", Object.assign({}, getInputProps(), {
     name: inputName
   })), /*#__PURE__*/React.createElement("div", {
-    className: clsx('form-dropzone__dropzone-wrapper', thumbColumn && `form-dropzone__dropzone-wrapper_column_${thumbColumn}`, fillClass, fillHoverClass, borderWidthClass, borderColorClass, borderColorHoverClass, borderTypeClass)
+    className: clsx('form-dropzone__dropzone-wrapper', thumbColumn && `form-dropzone__dropzone-wrapper_column_${thumbColumn}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderTypeClass && `border_type_${borderTypeClass}`, shapeClass && `shape_${shapeClass}`)
   }, filesList.map((file, index) => /*#__PURE__*/React.createElement("aside", {
     className: clsx('form-dropzone__thumb', fillClass, thumbDirectionClass, thumbBorderWidthClass, thumbBorderColorClass, thumbBorderColorHoverClass, thumbBorderTypeClass),
     key: file.id || `${file.name}_${index}`
@@ -669,10 +670,7 @@ const FileInputDropzone = /*#__PURE__*/React.memo(function FileInputDropzone(pro
     className: "form-dropzone__thumb-loader"
   }, /*#__PURE__*/React.createElement(Loader, {
     width: "fill",
-    height: "fill",
-    fill: "surfacePrimary",
-    itemFill: "surfaceItemAccent",
-    set: "simple"
+    height: "fill"
   })), /*#__PURE__*/React.createElement("div", {
     className: clsx('form-dropzone__thumb-remove')
   }, /*#__PURE__*/React.createElement(Button, {
@@ -833,9 +831,9 @@ const FileInput = /*#__PURE__*/React.memo(function FileInput(props) {
     hintTitleTextWeight,
     hintTitleTextWrap,
     removeThumbAppearance,
+    removeThumbShape,
     removeThumbText,
     removeThumbTextWeight,
-    removeThumbShape,
     shape,
     thumbBorderColor,
     thumbBorderColorHover,
@@ -927,9 +925,9 @@ const FileInput = /*#__PURE__*/React.memo(function FileInput(props) {
       inputValue: input.value,
       metaTouched: meta.touched,
       removeThumbAppearance: removeThumbAppearance,
+      removeThumbShape: removeThumbShape,
       removeThumbText: removeThumbText,
       removeThumbTextWeight: removeThumbTextWeight,
-      removeThumbShape: removeThumbShape,
       shape: shape,
       showFilename: showFilename,
       thumbBorderColor: thumbBorderColor,
@@ -985,6 +983,11 @@ const FormBlockGroup = /*#__PURE__*/React.memo(function Group(props) {
     isHidden,
     children
   } = props;
+
+  // @ts-expect-error
+  const {
+    styles: styles
+  } = useStyles(props);
   return /*#__PURE__*/React.createElement(Field, {
     name: name
   }, function Render({
@@ -1013,7 +1016,8 @@ const FormBlockGroup = /*#__PURE__*/React.memo(function Group(props) {
     });
     return /*#__PURE__*/React.createElement("div", {
       className: clsx('form__group', className, isHidden && 'form__group_hidden', column && `form__group_column_${column}`),
-      "data-tour": dataTour
+      "data-tour": dataTour,
+      style: styles
     }, /*#__PURE__*/React.createElement("div", {
       className: "form__group-wrapper"
     }, before, title && /*#__PURE__*/React.createElement("div", {
@@ -2361,7 +2365,7 @@ const RadioGroup = /*#__PURE__*/React.memo(function RadioGroup(props) {
       validationStateKey: isErrorState ? errorKey : 'success'
     });
     return /*#__PURE__*/React.createElement(FieldWrapper, Object.assign({
-      className: clsx('form-field_radio', 'form__item_radio"', classNameGroupItem),
+      className: clsx('form-field_radio', 'form__item_radio', classNameGroupItem),
       errorKey: errorKey,
       errorMessage: errorMessage,
       isErrorState: isErrorState,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/forms",
-  "version": "1.1.34",
+  "version": "1.1.36",
   "description": "Forms fields, inputs, etc.",
   "keywords": [],
   "license": "MIT",