@megafon/ui-core 4.0.0-beta.20 → 4.0.0-beta.23

package/CHANGELOG.md

@@ -3,6 +3,44 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [4.0.0-beta.23](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.0.0-beta.22...@megafon/ui-core@4.0.0-beta.23) (2022-09-08)
+
+
+### Bug Fixes
+
+* **accordion:** fixes top and bottom padding for title wrap ([ee61836](https://github.com/MegafonWebLab/megafon-ui/commit/ee61836618f6689b87b17f1e13378442a5a7caee))
+* **notification:** fixes passive close icon color for colored error type ([6233e9f](https://github.com/MegafonWebLab/megafon-ui/commit/6233e9f16b0a45ff168323fc241f05634e663fd0))
+* **search:** fixes hidden placeholder on focus for firefox ([eab12c3](https://github.com/MegafonWebLab/megafon-ui/commit/eab12c34e25236015bffe072ffdbea31535d4d99))
+* **select:** fixes hidden placeholder on focus for firefox ([2e5366d](https://github.com/MegafonWebLab/megafon-ui/commit/2e5366d5842754d8a26a4798f2e678dfe4d44372))
+* **textfield:** fixes notice text transition ([c435aa9](https://github.com/MegafonWebLab/megafon-ui/commit/c435aa9223f5f0a4d10254b677b6bd9075fdaf07))
+
+
+
+
+
+# [4.0.0-beta.22](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.0.0-beta.21...@megafon/ui-core@4.0.0-beta.22) (2022-08-31)
+
+
+### Bug Fixes
+
+* **tabs:** fix swiper arrows ([cac401d](https://github.com/MegafonWebLab/megafon-ui/commit/cac401ddc6ecfde58353827f3a362d8d941d4db8))
+* **textfield:** hide verification icon for disabled field ([c950d3c](https://github.com/MegafonWebLab/megafon-ui/commit/c950d3c64f13412e166c5d358b59638bc3c255ae))
+
+
+
+
+
+# [4.0.0-beta.21](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.0.0-beta.20...@megafon/ui-core@4.0.0-beta.21) (2022-08-24)
+
+
+### Bug Fixes
+
+* **notification:** fix margin for bottom block ([38d768c](https://github.com/MegafonWebLab/megafon-ui/commit/38d768cb48baf167863b6a143e84909217eff462))
+
+
+
+
+
 # [4.0.0-beta.20](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@4.0.0-beta.19...@megafon/ui-core@4.0.0-beta.20) (2022-08-24)
 
 

package/dist/es/components/Accordion/Accordion.css

@@ -12,7 +12,7 @@
 }
 .mfui-accordion__title-wrap {
   position: relative;
-  padding: 20px 44px 20px 16px;
+  padding: 24px 44px 24px 16px;
   border-radius: 12px;
   cursor: pointer;
   -webkit-transition: background-color 0.3s;
@@ -20,7 +20,7 @@
 }
 @media screen and (min-width: 768px) {
   .mfui-accordion__title-wrap {
-    padding: 20px 56px 20px 24px;
+    padding: 24px 56px 24px 24px;
   }
 }
 .mfui-accordion__title-wrap:hover {

package/dist/es/components/Notification/Notification.css

@@ -160,7 +160,6 @@ h5 {
   -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
-  margin-left: 16px;
   cursor: pointer;
 }
 @media screen and (max-width: 767px) {
@@ -169,6 +168,9 @@ h5 {
     line-height: 18px;
   }
 }
+.mfui-notification__button + .mfui-notification__link {
+  margin-left: 16px;
+}
 .mfui-notification__link-arrow,
 .mfui-notification__collapse-arrow {
   width: 20px;
@@ -197,7 +199,6 @@ h5 {
   height: -webkit-fit-content;
   height: -moz-fit-content;
   height: fit-content;
-  margin-left: 20px;
   padding: 0;
   border: none;
   color: var(--systemBlue);
@@ -212,6 +213,14 @@ h5 {
     margin-left: 16px;
   }
 }
+.mfui-notification__bottom-block + .mfui-notification__collapse-button {
+  margin-left: 20px;
+}
+@media screen and (max-width: 767px) {
+  .mfui-notification__bottom-block + .mfui-notification__collapse-button {
+    margin-left: 16px;
+  }
+}
 .mfui-notification__collapse_hidden {
   visibility: hidden;
 }
@@ -327,3 +336,11 @@ h5 {
   /* stylelint-disable-line max-nesting-depth */
   fill: var(--stcWhite);
 }
+.mfui-notification_colored.mfui-notification_type_error .mfui-notification__close:not(:hover) {
+  background-color: var(--stcWhite20);
+}
+.mfui-notification_colored.mfui-notification_type_error .mfui-notification__close:not(:hover) .mfui-notification__close-icon {
+  /* stylelint-disable-line max-nesting-depth */
+  opacity: 1;
+  fill: var(--stcWhite);
+}

package/dist/es/components/Search/Search.css

@@ -141,6 +141,15 @@
 .mfui-search__search-wrapper_labeled .mfui-search__search-field:focus:-ms-input-placeholder {
   opacity: 1;
 }
+.mfui-search__search-wrapper_labeled .mfui-search__search-field:focus::-moz-placeholder {
+  opacity: 1;
+}
+.mfui-search__search-wrapper_labeled .mfui-search__search-field:focus::-ms-input-placeholder {
+  opacity: 1;
+}
+.mfui-search__search-wrapper_labeled .mfui-search__search-field:focus::placeholder {
+  opacity: 1;
+}
 .mfui-search__search-field_filled + .mfui-search__label,
 .mfui-search__search-field:focus + .mfui-search__label {
   -webkit-transform: scale(0.8) translate(-12.5%, -75%);

package/dist/es/components/Select/Select.css

@@ -328,6 +328,15 @@
 .mfui-select__control_labeled .mfui-select__combobox:focus:-ms-input-placeholder {
   opacity: 1;
 }
+.mfui-select__control_labeled .mfui-select__combobox:focus::-moz-placeholder {
+  opacity: 1;
+}
+.mfui-select__control_labeled .mfui-select__combobox:focus::-ms-input-placeholder {
+  opacity: 1;
+}
+.mfui-select__control_labeled .mfui-select__combobox:focus::placeholder {
+  opacity: 1;
+}
 .mfui-select_open {
   z-index: 100;
 }

package/dist/es/components/Tabs/Tabs.css

@@ -92,7 +92,7 @@
   width: 16px;
   height: 16px;
   border-radius: 50%;
-  background-color: var(--stcBlack);
+  background-color: var(--content);
   -webkit-transform: translateY(-50%);
           transform: translateY(-50%);
   cursor: pointer;

package/dist/es/components/Tabs/Tabs.js

@@ -78,7 +78,7 @@ var Tabs = function Tabs(_ref) {
       isBeginning = _React$useState4[0],
       setBeginning = _React$useState4[1];
 
-  var _React$useState5 = React.useState(false),
+  var _React$useState5 = React.useState(true),
       _React$useState6 = _slicedToArray(_React$useState5, 2),
       isEnd = _React$useState6[0],
       setEnd = _React$useState6[1];

package/dist/es/components/TextField/TextField.css

@@ -113,6 +113,21 @@
 .mfui-text-field__field:focus::-webkit-input-placeholder {
   opacity: 1;
 }
+.mfui-text-field__field:focus:-moz-placeholder {
+  opacity: 1;
+}
+.mfui-text-field__field:focus:-ms-input-placeholder {
+  opacity: 1;
+}
+.mfui-text-field__field:focus::-moz-placeholder {
+  opacity: 1;
+}
+.mfui-text-field__field:focus::-ms-input-placeholder {
+  opacity: 1;
+}
+.mfui-text-field__field:focus::placeholder {
+  opacity: 1;
+}
 .mfui-text-field__field::-webkit-scrollbar {
   width: 16px;
 }
@@ -125,12 +140,6 @@
 .mfui-text-field__field::-webkit-scrollbar-thumb:hover {
   background-color: #999999;
 }
-.mfui-text-field__field:focus:-moz-placeholder {
-  opacity: 1;
-}
-.mfui-text-field__field:focus:-ms-input-placeholder {
-  opacity: 1;
-}
 .mfui-text-field__label {
   position: absolute;
   top: 18px;
@@ -171,6 +180,19 @@
   display: flex;
   overflow: hidden;
 }
+.mfui-text-field__field-bottom-wrapper {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  margin-top: 0;
+  overflow: hidden;
+  color: var(--spbSky3);
+  font-size: 12px;
+  line-height: 18px;
+}
+.mfui-text-field__field-bottom-wrapper_filled {
+  margin-top: 8px;
+}
 .mfui-text-field__notice-text {
   height: 0;
   opacity: 0;
@@ -180,7 +202,7 @@
           transition-duration: 0.3s;
 }
 .mfui-text-field__notice-text_active {
-  height: 18px;
+  height: 100%;
   opacity: 1;
 }
 .mfui-text-field__icon-box {
@@ -231,16 +253,6 @@
 .mfui-text-field__require-mark {
   color: var(--fury);
 }
-.mfui-text-field__field-bottom-wrapper {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  margin-top: 8px;
-  overflow: hidden;
-  color: var(--spbSky3);
-  font-size: 12px;
-  line-height: 18px;
-}
 .mfui-text-field__counter {
   margin-left: auto;
 }

package/dist/es/components/TextField/TextField.js

@@ -146,8 +146,8 @@ var TextField = function TextField(_ref) {
 
   var _useState9 = useState(noticeText),
       _useState10 = _slicedToArray(_useState9, 2),
-      displayedNoticeText = _useState10[0],
-      setDisplayedNoticeText = _useState10[1];
+      currentNoticeText = _useState10[0],
+      setCurrentNoticeText = _useState10[1];
 
   var _useState11 = useState(false),
       _useState12 = _slicedToArray(_useState11, 2),
@@ -169,8 +169,8 @@ var TextField = function TextField(_ref) {
     return isPasswordType && !isPasswordHidden;
   }, [isPasswordHidden, isPasswordType]);
   var hasValue = isControlled ? !!value : !!inputValue;
-  var isValidVerification = verification === Verification.VALID;
-  var isErrorVerification = verification === Verification.ERROR;
+  var isValidVerification = verification === Verification.VALID && !disabled;
+  var isErrorVerification = verification === Verification.ERROR && !disabled;
   var hasValueForClear = hasValue && !isPasswordType && !customIcon && !isValidVerification;
   var hasClearIcon = !disabled && (hasValueForClear || isErrorVerification);
   var actualPlaceholder = placeholder || DEFAULT_PLACEHOLDERS[type];
@@ -188,7 +188,7 @@ var TextField = function TextField(_ref) {
     checkSymbolMaxLimit(value);
   }, [value, checkSymbolMaxLimit, isControlled]);
   useEffect(function () {
-    noticeText && setDisplayedNoticeText(noticeText);
+    noticeText && setCurrentNoticeText(noticeText);
   }, [noticeText]);
   useEffect(function () {
     if (!resizerRef.current || textarea !== TextareaTypes.FLEXIBLE) {
@@ -257,7 +257,7 @@ var TextField = function TextField(_ref) {
   };
 
   var handleNoticeTransitionEnd = useCallback(function () {
-    !noticeText && setDisplayedNoticeText(noticeText);
+    !noticeText && setCurrentNoticeText(noticeText);
   }, [noticeText]);
 
   var handleTextareaScroll = function handleTextareaScroll() {
@@ -430,7 +430,6 @@ var TextField = function TextField(_ref) {
   var isPlaceholderShowed = isPasswordType && isPasswordHidden && !!inputValue;
   var valueHasSymbols = inputValue !== null && inputValue !== undefined;
   var currentSymbolCount = valueHasSymbols && String(inputValue).length || 0;
-  var showAdditionalBlock = displayedNoticeText || symbolCounter;
   return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn({
       disabled: disabled,
@@ -447,14 +446,16 @@ var TextField = function TextField(_ref) {
   }, renderField(), textareaType === TextareaTypes.FLEXIBLE && /*#__PURE__*/React.createElement("div", {
     className: cn('resizer'),
     ref: resizerRef
-  }, /*#__PURE__*/React.createElement(ResizeIcon, null))), showAdditionalBlock && /*#__PURE__*/React.createElement("div", {
-    className: cn('field-bottom-wrapper')
-  }, displayedNoticeText && /*#__PURE__*/React.createElement("div", _extends({
+  }, /*#__PURE__*/React.createElement(ResizeIcon, null))), /*#__PURE__*/React.createElement("div", {
+    className: cn('field-bottom-wrapper', {
+      filled: !!currentNoticeText || !!symbolCounter
+    })
+  }, /*#__PURE__*/React.createElement("div", _extends({
     className: cn('notice-text', {
       active: !!noticeText
     }),
     onTransitionEnd: handleNoticeTransitionEnd
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.notice)), displayedNoticeText), symbolCounter && /*#__PURE__*/React.createElement("span", {
+  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.notice)), currentNoticeText), symbolCounter && /*#__PURE__*/React.createElement("span", {
     className: cn('counter', {
       error: isMaxLimitExceeded
     })

package/dist/lib/components/Accordion/Accordion.css

@@ -12,7 +12,7 @@
 }
 .mfui-accordion__title-wrap {
   position: relative;
-  padding: 20px 44px 20px 16px;
+  padding: 24px 44px 24px 16px;
   border-radius: 12px;
   cursor: pointer;
   -webkit-transition: background-color 0.3s;
@@ -20,7 +20,7 @@
 }
 @media screen and (min-width: 768px) {
   .mfui-accordion__title-wrap {
-    padding: 20px 56px 20px 24px;
+    padding: 24px 56px 24px 24px;
   }
 }
 .mfui-accordion__title-wrap:hover {

package/dist/lib/components/Notification/Notification.css

@@ -160,7 +160,6 @@ h5 {
   -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
-  margin-left: 16px;
   cursor: pointer;
 }
 @media screen and (max-width: 767px) {
@@ -169,6 +168,9 @@ h5 {
     line-height: 18px;
   }
 }
+.mfui-notification__button + .mfui-notification__link {
+  margin-left: 16px;
+}
 .mfui-notification__link-arrow,
 .mfui-notification__collapse-arrow {
   width: 20px;
@@ -197,7 +199,6 @@ h5 {
   height: -webkit-fit-content;
   height: -moz-fit-content;
   height: fit-content;
-  margin-left: 20px;
   padding: 0;
   border: none;
   color: var(--systemBlue);
@@ -212,6 +213,14 @@ h5 {
     margin-left: 16px;
   }
 }
+.mfui-notification__bottom-block + .mfui-notification__collapse-button {
+  margin-left: 20px;
+}
+@media screen and (max-width: 767px) {
+  .mfui-notification__bottom-block + .mfui-notification__collapse-button {
+    margin-left: 16px;
+  }
+}
 .mfui-notification__collapse_hidden {
   visibility: hidden;
 }
@@ -327,3 +336,11 @@ h5 {
   /* stylelint-disable-line max-nesting-depth */
   fill: var(--stcWhite);
 }
+.mfui-notification_colored.mfui-notification_type_error .mfui-notification__close:not(:hover) {
+  background-color: var(--stcWhite20);
+}
+.mfui-notification_colored.mfui-notification_type_error .mfui-notification__close:not(:hover) .mfui-notification__close-icon {
+  /* stylelint-disable-line max-nesting-depth */
+  opacity: 1;
+  fill: var(--stcWhite);
+}

package/dist/lib/components/Search/Search.css

@@ -141,6 +141,15 @@
 .mfui-search__search-wrapper_labeled .mfui-search__search-field:focus:-ms-input-placeholder {
   opacity: 1;
 }
+.mfui-search__search-wrapper_labeled .mfui-search__search-field:focus::-moz-placeholder {
+  opacity: 1;
+}
+.mfui-search__search-wrapper_labeled .mfui-search__search-field:focus::-ms-input-placeholder {
+  opacity: 1;
+}
+.mfui-search__search-wrapper_labeled .mfui-search__search-field:focus::placeholder {
+  opacity: 1;
+}
 .mfui-search__search-field_filled + .mfui-search__label,
 .mfui-search__search-field:focus + .mfui-search__label {
   -webkit-transform: scale(0.8) translate(-12.5%, -75%);

package/dist/lib/components/Select/Select.css

@@ -328,6 +328,15 @@
 .mfui-select__control_labeled .mfui-select__combobox:focus:-ms-input-placeholder {
   opacity: 1;
 }
+.mfui-select__control_labeled .mfui-select__combobox:focus::-moz-placeholder {
+  opacity: 1;
+}
+.mfui-select__control_labeled .mfui-select__combobox:focus::-ms-input-placeholder {
+  opacity: 1;
+}
+.mfui-select__control_labeled .mfui-select__combobox:focus::placeholder {
+  opacity: 1;
+}
 .mfui-select_open {
   z-index: 100;
 }

package/dist/lib/components/Tabs/Tabs.css

@@ -92,7 +92,7 @@
   width: 16px;
   height: 16px;
   border-radius: 50%;
-  background-color: var(--stcBlack);
+  background-color: var(--content);
   -webkit-transform: translateY(-50%);
           transform: translateY(-50%);
   cursor: pointer;

package/dist/lib/components/Tabs/Tabs.js

@@ -108,7 +108,7 @@ var Tabs = function Tabs(_ref) {
       isBeginning = _React$useState4[0],
       setBeginning = _React$useState4[1];
 
-  var _React$useState5 = React.useState(false),
+  var _React$useState5 = React.useState(true),
       _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
       isEnd = _React$useState6[0],
       setEnd = _React$useState6[1];

package/dist/lib/components/TextField/TextField.css

@@ -113,6 +113,21 @@
 .mfui-text-field__field:focus::-webkit-input-placeholder {
   opacity: 1;
 }
+.mfui-text-field__field:focus:-moz-placeholder {
+  opacity: 1;
+}
+.mfui-text-field__field:focus:-ms-input-placeholder {
+  opacity: 1;
+}
+.mfui-text-field__field:focus::-moz-placeholder {
+  opacity: 1;
+}
+.mfui-text-field__field:focus::-ms-input-placeholder {
+  opacity: 1;
+}
+.mfui-text-field__field:focus::placeholder {
+  opacity: 1;
+}
 .mfui-text-field__field::-webkit-scrollbar {
   width: 16px;
 }
@@ -125,12 +140,6 @@
 .mfui-text-field__field::-webkit-scrollbar-thumb:hover {
   background-color: #999999;
 }
-.mfui-text-field__field:focus:-moz-placeholder {
-  opacity: 1;
-}
-.mfui-text-field__field:focus:-ms-input-placeholder {
-  opacity: 1;
-}
 .mfui-text-field__label {
   position: absolute;
   top: 18px;
@@ -171,6 +180,19 @@
   display: flex;
   overflow: hidden;
 }
+.mfui-text-field__field-bottom-wrapper {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  margin-top: 0;
+  overflow: hidden;
+  color: var(--spbSky3);
+  font-size: 12px;
+  line-height: 18px;
+}
+.mfui-text-field__field-bottom-wrapper_filled {
+  margin-top: 8px;
+}
 .mfui-text-field__notice-text {
   height: 0;
   opacity: 0;
@@ -180,7 +202,7 @@
           transition-duration: 0.3s;
 }
 .mfui-text-field__notice-text_active {
-  height: 18px;
+  height: 100%;
   opacity: 1;
 }
 .mfui-text-field__icon-box {
@@ -231,16 +253,6 @@
 .mfui-text-field__require-mark {
   color: var(--fury);
 }
-.mfui-text-field__field-bottom-wrapper {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  margin-top: 8px;
-  overflow: hidden;
-  color: var(--spbSky3);
-  font-size: 12px;
-  line-height: 18px;
-}
 .mfui-text-field__counter {
   margin-left: auto;
 }

package/dist/lib/components/TextField/TextField.js

@@ -174,8 +174,8 @@ var TextField = function TextField(_ref) {
 
   var _useState9 = (0, React.useState)(noticeText),
       _useState10 = (0, _slicedToArray2["default"])(_useState9, 2),
-      displayedNoticeText = _useState10[0],
-      setDisplayedNoticeText = _useState10[1];
+      currentNoticeText = _useState10[0],
+      setCurrentNoticeText = _useState10[1];
 
   var _useState11 = (0, React.useState)(false),
       _useState12 = (0, _slicedToArray2["default"])(_useState11, 2),
@@ -197,8 +197,8 @@ var TextField = function TextField(_ref) {
     return isPasswordType && !isPasswordHidden;
   }, [isPasswordHidden, isPasswordType]);
   var hasValue = isControlled ? !!value : !!inputValue;
-  var isValidVerification = verification === Verification.VALID;
-  var isErrorVerification = verification === Verification.ERROR;
+  var isValidVerification = verification === Verification.VALID && !disabled;
+  var isErrorVerification = verification === Verification.ERROR && !disabled;
   var hasValueForClear = hasValue && !isPasswordType && !customIcon && !isValidVerification;
   var hasClearIcon = !disabled && (hasValueForClear || isErrorVerification);
   var actualPlaceholder = placeholder || DEFAULT_PLACEHOLDERS[type];
@@ -216,7 +216,7 @@ var TextField = function TextField(_ref) {
     checkSymbolMaxLimit(value);
   }, [value, checkSymbolMaxLimit, isControlled]);
   (0, React.useEffect)(function () {
-    noticeText && setDisplayedNoticeText(noticeText);
+    noticeText && setCurrentNoticeText(noticeText);
   }, [noticeText]);
   (0, React.useEffect)(function () {
     if (!resizerRef.current || textarea !== TextareaTypes.FLEXIBLE) {
@@ -285,7 +285,7 @@ var TextField = function TextField(_ref) {
   };
 
   var handleNoticeTransitionEnd = (0, React.useCallback)(function () {
-    !noticeText && setDisplayedNoticeText(noticeText);
+    !noticeText && setCurrentNoticeText(noticeText);
   }, [noticeText]);
 
   var handleTextareaScroll = function handleTextareaScroll() {
@@ -454,7 +454,6 @@ var TextField = function TextField(_ref) {
   var isPlaceholderShowed = isPasswordType && isPasswordHidden && !!inputValue;
   var valueHasSymbols = inputValue !== null && inputValue !== undefined;
   var currentSymbolCount = valueHasSymbols && String(inputValue).length || 0;
-  var showAdditionalBlock = displayedNoticeText || symbolCounter;
   return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn({
       disabled: disabled,
@@ -471,14 +470,16 @@ var TextField = function TextField(_ref) {
   }, renderField(), textareaType === TextareaTypes.FLEXIBLE && /*#__PURE__*/React.createElement("div", {
     className: cn('resizer'),
     ref: resizerRef
-  }, /*#__PURE__*/React.createElement(ResizeIcon, null))), showAdditionalBlock && /*#__PURE__*/React.createElement("div", {
-    className: cn('field-bottom-wrapper')
-  }, displayedNoticeText && /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
+  }, /*#__PURE__*/React.createElement(ResizeIcon, null))), /*#__PURE__*/React.createElement("div", {
+    className: cn('field-bottom-wrapper', {
+      filled: !!currentNoticeText || !!symbolCounter
+    })
+  }, /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
     className: cn('notice-text', {
       active: !!noticeText
     }),
     onTransitionEnd: handleNoticeTransitionEnd
-  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.notice)), displayedNoticeText), symbolCounter && /*#__PURE__*/React.createElement("span", {
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.notice)), currentNoticeText), symbolCounter && /*#__PURE__*/React.createElement("span", {
     className: cn('counter', {
       error: isMaxLimitExceeded
     })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@megafon/ui-core",
-  "version": "4.0.0-beta.20",
+  "version": "4.0.0-beta.23",
   "files": [
     "dist",
     "styles"
@@ -97,5 +97,5 @@
     "react-popper": "^2.2.3",
     "swiper": "^6.5.6"
   },
-  "gitHead": "0757940d05a058c5eb0a5044767bf59a993eaace"
+  "gitHead": "f2e436a3b1d1afe36e055d5a36f50760dddbc156"
 }