@itcase/forms 1.0.21 → 1.0.23

package/dist/css/form/Field/Choice/Choice.css

@@ -1,44 +1,13 @@
-.form-tab-selector {
-  &__wrapper {
-    position: relative;
-    display: flex;
-    flex-flow: row wrap;
-    gap: 16px;
-  }
-  &__item {
-    background: var(--color-surface-primary);
-    padding: 3px 12px;
-    border: solid 1px var(--color-surface-border-secondary);
-    border-radius: 4px;
-    z-index: 1;
-    cursor: pointer;
-    @mixin easing easeOutQuart, all, 0.2s;
-    @mixin h5 300;
-    @media (--mobile) {
-      padding: 6px 6px;
-    }
-    &:hover {
-      background: var(--color-surface-secondary-hover);
-    }
-    &:focus {
-      background: var(--color-surface-secondary-hover);
-    }
-    &&_state_active {
-      color: var(--color-accent-text-primary);
-      background: var(--color-accent);
-      border: solid 1px var(--color-surface-border-accent);
-      &:hover {
-        color: var(--color-accent-text-primary);
-        background: var(--color-accent-hover-primary);
-        border: solid 1px var(--color-surface-border-accent);
-      }
+.form-choice {
+  &&_state {
+    &_success {
+      border: solid 1px var(--color-success-border-primary);
     }
-  }
-  &&_state_error {
-    ^&__item {
+    &_error {
       border: solid 1px var(--color-error-border-primary);
     }
-  }
-  &&_state_success {
+    &_focus {
+      /* border: solid 1px var(--color-error-border-primary); */
+    }
   }
 }

package/dist/css/form/Field/Custom/Custom.css

@@ -1,5 +1,22 @@
 .form-field {
   &_type_custom {
     width: 100%;
+    &&_state {
+      &_success {
+        & .input {
+          border: solid 1px var(--color-success-border-primary);
+        }
+      }
+      &_error {
+        & .input {
+          border: solid 1px var(--color-error-border-primary);
+        }
+      }
+      &_focus {
+        & .input {
+          background: var(--color-surface-primary);
+        }
+      }
+    }
   }
 }

package/dist/itcase-forms.cjs.js

@@ -796,10 +796,10 @@ CheckboxField.propTypes = {
 };
 
 var ChoiceField = /*#__PURE__*/React__default.default.memo(function ChoiceField(props) {
-  var options = props.options;
-    props.classNameInput;
-    props.classNameInputWrapper;
-    var classNameGroupItem = props.classNameGroupItem,
+  var options = props.options,
+    classNameGroupItem = props.classNameGroupItem,
+    fieldProps = props.fieldProps,
+    inputProps = props.inputProps,
     isMultiple = props.isMultiple,
     isRequired = props.isRequired,
     label = props.label,
@@ -814,8 +814,8 @@ var ChoiceField = /*#__PURE__*/React__default.default.memo(function ChoiceField(
   }, function (_ref) {
     var input = _ref.input,
       meta = _ref.meta;
-    return /*#__PURE__*/React__default.default.createElement(FieldWrapper, {
-      className: clsx__default.default('form-field_type_tab-selector', 'form__item_type_tab-selector', classNameGroupItem),
+    return /*#__PURE__*/React__default.default.createElement(FieldWrapper, Object.assign({
+      className: clsx__default.default('form-field_type_choice', 'form__item_type_choice', classNameGroupItem),
       inputName: input.name,
       inputValue: input.value || [],
       isRequired: isRequired,
@@ -829,7 +829,7 @@ var ChoiceField = /*#__PURE__*/React__default.default.memo(function ChoiceField(
       metaTouched: meta.touched,
       metaValid: meta.valid,
       hideMessage: hideMessage
-    }, /*#__PURE__*/React__default.default.createElement(Choice.Choice, {
+    }, fieldProps), /*#__PURE__*/React__default.default.createElement(Choice.Choice, Object.assign({
       options: options,
       inputName: input.name,
       inputValue: input.value || [],
@@ -837,7 +837,7 @@ var ChoiceField = /*#__PURE__*/React__default.default.memo(function ChoiceField(
       isRequired: isRequired,
       placeholder: placeholder,
       onChange: change
-    }));
+    }, inputProps)));
   });
 });
 ChoiceField.propTypes = {

package/dist/itcase-forms.esm.js

@@ -786,10 +786,10 @@ CheckboxField.propTypes = {
 };
 
 var ChoiceField = /*#__PURE__*/React.memo(function ChoiceField(props) {
-  var options = props.options;
-    props.classNameInput;
-    props.classNameInputWrapper;
-    var classNameGroupItem = props.classNameGroupItem,
+  var options = props.options,
+    classNameGroupItem = props.classNameGroupItem,
+    fieldProps = props.fieldProps,
+    inputProps = props.inputProps,
     isMultiple = props.isMultiple,
     isRequired = props.isRequired,
     label = props.label,
@@ -804,8 +804,8 @@ var ChoiceField = /*#__PURE__*/React.memo(function ChoiceField(props) {
   }, function (_ref) {
     var input = _ref.input,
       meta = _ref.meta;
-    return /*#__PURE__*/React.createElement(FieldWrapper, {
-      className: clsx('form-field_type_tab-selector', 'form__item_type_tab-selector', classNameGroupItem),
+    return /*#__PURE__*/React.createElement(FieldWrapper, Object.assign({
+      className: clsx('form-field_type_choice', 'form__item_type_choice', classNameGroupItem),
       inputName: input.name,
       inputValue: input.value || [],
       isRequired: isRequired,
@@ -819,7 +819,7 @@ var ChoiceField = /*#__PURE__*/React.memo(function ChoiceField(props) {
       metaTouched: meta.touched,
       metaValid: meta.valid,
       hideMessage: hideMessage
-    }, /*#__PURE__*/React.createElement(Choice, {
+    }, fieldProps), /*#__PURE__*/React.createElement(Choice, Object.assign({
       options: options,
       inputName: input.name,
       inputValue: input.value || [],
@@ -827,7 +827,7 @@ var ChoiceField = /*#__PURE__*/React.memo(function ChoiceField(props) {
       isRequired: isRequired,
       placeholder: placeholder,
       onChange: change
-    }));
+    }, inputProps)));
   });
 });
 ChoiceField.propTypes = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/forms",
-  "version": "1.0.21",
+  "version": "1.0.23",
   "description": "Forms fields, inputs, etc.",
   "keywords": [
     "forms",
@@ -35,15 +35,15 @@
   },
   "dependencies": {
     "@itcase/common": "^1.1.6",
-    "@itcase/ui": "^1.0.33",
+    "@itcase/ui": "^1.0.46",
     "axios": "^1.5.0",
     "clsx": "^2.0.0",
     "date-fns": "2.0.0-alpha.7",
     "final-form": "^4.20.10",
     "final-form-focus": "^1.1.2",
-    "libphonenumber-js": "^1.10.43",
+    "libphonenumber-js": "^1.10.44",
     "lodash": "^4.17.21",
-    "luxon": "^3.4.2",
+    "luxon": "^3.4.3",
     "prop-types": "^15.8.1",
     "react": "^18.2.0",
     "react-date-range": "^1.4.0",
@@ -53,10 +53,10 @@
     "react-select": "^5.7.4"
   },
   "devDependencies": {
-    "@babel/core": "^7.22.11",
-    "@babel/eslint-parser": "^7.22.11",
-    "@babel/preset-env": "^7.22.14",
-    "@babel/preset-react": "^7.22.5",
+    "@babel/core": "^7.22.17",
+    "@babel/eslint-parser": "^7.22.15",
+    "@babel/preset-env": "^7.22.15",
+    "@babel/preset-react": "^7.22.15",
     "@commitlint/cli": "^17.7.1",
     "@commitlint/config-conventional": "^17.7.0",
     "@rollup/plugin-babel": "^6.0.3",
@@ -67,17 +67,17 @@
     "@semantic-release/git": "^10.0.1",
     "babel-plugin-inline-react-svg": "^2.0.2",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
-    "eslint": "8.48.0",
+    "eslint": "8.49.0",
     "eslint-config-prettier": "^9.0.0",
     "eslint-config-standard": "^17.1.0",
     "eslint-plugin-import": "^2.28.1",
-    "eslint-plugin-n": "^16.0.2",
+    "eslint-plugin-n": "^16.1.0",
     "eslint-plugin-prettier": "^5.0.0",
     "eslint-plugin-promise": "^6.1.1",
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-standard": "^5.0.0",
     "husky": "^8.0.3",
-    "npm": "^9.8.1",
+    "npm": "^10.1.0",
     "postcss-aspect-ratio-polyfill": "^2.0.0",
     "postcss-cli": "^10.1.0",
     "postcss-combine-duplicated-selectors": "^10.0.3",
@@ -95,13 +95,13 @@
     "postcss-nested-ancestors": "^3.0.0",
     "postcss-normalize": "^10.0.1",
     "postcss-prepend-imports": "^1.0.1",
-    "postcss-preset-env": "^9.1.2",
+    "postcss-preset-env": "^9.1.3",
     "postcss-pxtorem": "^6.0.0",
     "postcss-responsive-type": "github:ITCase/postcss-responsive-type",
     "postcss-sort-media-queries": "^5.2.0",
     "prettier": "^3.0.3",
-    "react-datepicker": "^4.16.0",
-    "rollup": "^3.28.1",
+    "react-datepicker": "^4.17.0",
+    "rollup": "^3.29.1",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "semantic-release": "^21.1.1",
     "stylelint": "^15.10.3",