@salutejs/plasma-new-hope 0.170.0-canary.1459.11367029149.0 → 0.170.0-canary.1484.11368065603.0

package/styled-components/cjs/components/TextField/TextField.js

@@ -9,21 +9,17 @@ var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react")
 var _plasmaCore = /*#__PURE__*/require("@salutejs/plasma-core");
 var _styledComponents = /*#__PURE__*/require("styled-components");
 var _utils = /*#__PURE__*/require("../../utils");
-var _hooks = /*#__PURE__*/require("../../hooks");
 var _base = /*#__PURE__*/require("./variations/_size/base");
 var _base2 = /*#__PURE__*/require("./variations/_view/base");
 var _base3 = /*#__PURE__*/require("./variations/_clear/base");
 var _base4 = /*#__PURE__*/require("./variations/_disabled/base");
 var _base5 = /*#__PURE__*/require("./variations/_read-only/base");
 var _base6 = /*#__PURE__*/require("./variations/_label-placement/base");
-var _base7 = /*#__PURE__*/require("./variations/_hint-view/base");
-var _base8 = /*#__PURE__*/require("./variations/_hint-size/base");
 var _TextField = /*#__PURE__*/require("./TextField.styles");
 var _TextField2 = /*#__PURE__*/require("./TextField.tokens");
 var _ui = /*#__PURE__*/require("./ui");
-var _hooks2 = /*#__PURE__*/require("./hooks");
-var _Hint = /*#__PURE__*/require("./ui/Hint/Hint");
-var _excluded = ["id", "className", "style", "contentLeft", "contentRight", "label", "labelPlacement", "textBefore", "textAfter", "placeholder", "leftHelper", "enumerationType", "requiredPlacement", "titleCaption", "hintTrigger", "hintText", "hintView", "hintSize", "hintTargetIcon", "hintPlacement", "hintHasArrow", "hintOffset", "hintWidth", "hintContentLeft", "view", "size", "readOnly", "disabled", "required", "clear", "optional", "hasDivider", "value", "chips", "onChange", "onChangeChips", "onSearch", "onKeyDown"];
+var _hooks = /*#__PURE__*/require("./hooks");
+var _excluded = ["id", "className", "style", "contentLeft", "contentRight", "label", "labelPlacement", "textBefore", "textAfter", "placeholder", "leftHelper", "enumerationType", "requiredPlacement", "view", "size", "readOnly", "disabled", "required", "clear", "optional", "hasDivider", "value", "chips", "onChange", "onChangeChips", "onSearch", "onKeyDown"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -37,7 +33,6 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 var optionalText = 'optional';
 var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["display:block;"]);
-var HINT_DEFAULT_OFFSET = [0, 0];
 var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
   return /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     var _inputRef$current, _inputRef$current3;
@@ -56,22 +51,6 @@ var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
       enumerationType = _ref$enumerationType === void 0 ? 'plain' : _ref$enumerationType,
       _ref$requiredPlacemen = _ref.requiredPlacement,
       requiredPlacement = _ref$requiredPlacemen === void 0 ? 'right' : _ref$requiredPlacemen,
-      titleCaption = _ref.titleCaption,
-      _ref$hintTrigger = _ref.hintTrigger,
-      hintTrigger = _ref$hintTrigger === void 0 ? 'hover' : _ref$hintTrigger,
-      hintText = _ref.hintText,
-      _ref$hintView = _ref.hintView,
-      hintView = _ref$hintView === void 0 ? 'default' : _ref$hintView,
-      _ref$hintSize = _ref.hintSize,
-      hintSize = _ref$hintSize === void 0 ? 'm' : _ref$hintSize,
-      hintTargetIcon = _ref.hintTargetIcon,
-      _ref$hintPlacement = _ref.hintPlacement,
-      hintPlacement = _ref$hintPlacement === void 0 ? 'auto' : _ref$hintPlacement,
-      hintHasArrow = _ref.hintHasArrow,
-      _ref$hintOffset = _ref.hintOffset,
-      hintOffset = _ref$hintOffset === void 0 ? HINT_DEFAULT_OFFSET : _ref$hintOffset,
-      hintWidth = _ref.hintWidth,
-      hintContentLeft = _ref.hintContentLeft,
       view = _ref.view,
       size = _ref.size,
       _ref$readOnly = _ref.readOnly,
@@ -108,10 +87,6 @@ var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
       _useState4 = _slicedToArray(_useState3, 2),
       chips = _useState4[0],
       setChips = _useState4[1];
-    var _useState5 = (0, _react.useState)(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      isHintVisible = _useState6[0],
-      setIsHintVisible = _useState6[1];
     var uniqId = (0, _plasmaCore.safeUseId)();
     var innerId = id || uniqId;
     var labelId = (0, _plasmaCore.safeUseId)();
@@ -130,37 +105,14 @@ var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
     var placeholderShown = Boolean(innerPlaceholderValue) && !hasValue;
     var clearClass = clear ? _TextField2.classes.clear : undefined;
     var hasDividerClass = hasDivider ? _TextField2.classes.hasDivider : undefined;
-    var hasHintClass = hintText ? _TextField2.classes.hasHint : undefined;
     var requiredPlacementClass = requiredPlacement === 'right' ? 'align-right ' : undefined;
     var labelPlacementClass = innerLabelPlacementValue ? _TextField2.classes["".concat(innerLabelPlacementValue, "LabelPlacement")] : undefined;
     var hasValueClass = hasValue ? _TextField2.classes.hasValue : undefined;
     var wrapperWithoutLeftContent = !contentLeft && isChipsVisible ? _TextField2.classes.hasEmptyContentLeft : undefined;
     var wrapperWithoutRightContent = !contentRight && isChipsVisible ? _TextField2.classes.hasEmptyContentRight : undefined;
-    var hintRef = (0, _hooks.useOutsideClick)(function () {
-      setIsHintVisible(false);
-    });
-    var hintInnerRef = (0, _react.useRef)(null);
-    var hintForkRef = (0, _plasmaCore.useForkRef)(hintRef, hintInnerRef);
     var handleInput = function handleInput(event) {
       setHasValue(Boolean(event.target.value));
     };
-    var handleHintShow = function handleHintShow() {
-      return setIsHintVisible(true);
-    };
-    var handleHintHide = function handleHintHide() {
-      return setIsHintVisible(false);
-    };
-    var handleHintClick = function handleHintClick(event) {
-      if (hintText && hintTrigger === 'click') {
-        var _hintInnerRef$current;
-        event.stopPropagation();
-        var targetIsPopover = event.target === hintInnerRef.current;
-        var rootHasTarget = (_hintInnerRef$current = hintInnerRef.current) === null || _hintInnerRef$current === void 0 ? void 0 : _hintInnerRef$current.contains(event.target);
-        if (!targetIsPopover && !rootHasTarget) {
-          setIsHintVisible(true);
-        }
-      }
-    };
     var handleChange = function handleChange(event) {
       if (disabled || readOnly) {
         return;
@@ -177,7 +129,7 @@ var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
       setChips(newChips);
       onChangeChips === null || onChangeChips === void 0 || onChangeChips(newValues);
     };
-    var _useKeyNavigation = (0, _hooks2.useKeyNavigation)({
+    var _useKeyNavigation = (0, _hooks.useKeyNavigation)({
         controlledRefs: controlledRefs,
         disabled: disabled,
         readOnly: readOnly,
@@ -239,7 +191,7 @@ var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
     var innerOptional = Boolean(required ? false : optional);
     var hasPlaceholderOptional = innerOptional && !innerLabelValue && !hasOuterLabel;
     var optionalTextNode = innerOptional ? /*#__PURE__*/_react["default"].createElement(_TextField.StyledOptionalText, null, Boolean(hasPlaceholderOptional ? innerPlaceholderValue : innerLabelValue) && '\xa0', optionalText) : null;
-    return /*#__PURE__*/_react["default"].createElement(Root, _extends({
+    return /*#__PURE__*/_react["default"].createElement(Root, {
       view: view,
       size: size,
       disabled: disabled,
@@ -247,56 +199,21 @@ var textFieldRoot = exports.textFieldRoot = function textFieldRoot(Root) {
       clear: clear,
       labelPlacement: innerLabelPlacementValue,
       onClick: handleInputFocus,
-      className: (0, _utils.cx)(labelPlacementClass, clearClass, hasDividerClass, hasHintClass, _TextField2.classes.textFieldGroupItem, className),
+      className: (0, _utils.cx)(labelPlacementClass, clearClass, hasDividerClass, _TextField2.classes.textFieldGroupItem, className),
       style: style
-    }, hintText && {
-      hintView: hintView,
-      hintSize: hintSize
-    }), (hasOuterLabel || titleCaption) && /*#__PURE__*/_react["default"].createElement(_TextField.OuterLabelWrapper, {
-      isInnnerLabel: labelPlacement === 'inner'
-    }, hasOuterLabel && /*#__PURE__*/_react["default"].createElement(_TextField.StyledIndicatorWrapper, null, /*#__PURE__*/_react["default"].createElement(_TextField.Label, {
+    }, hasOuterLabel && /*#__PURE__*/_react["default"].createElement(_TextField.Label, {
       id: labelId,
       htmlFor: id
-    }, innerLabelValue), hintText && /*#__PURE__*/_react["default"].createElement(_TextField.StyledHintWrapper, null, /*#__PURE__*/_react["default"].createElement(_Hint.HintComponent, {
-      ref: hintForkRef,
-      hintText: hintText,
-      hintTrigger: hintTrigger,
-      isHintVisible: isHintVisible,
-      hintTargetIcon: hintTargetIcon,
-      hintPlacement: hintPlacement,
-      hintHasArrow: hintHasArrow,
-      hintOffset: hintOffset,
-      hintWidth: hintWidth,
-      hintContentLeft: hintContentLeft,
-      handleHintShow: handleHintShow,
-      handleHintHide: handleHintHide,
-      handleHintClick: handleHintClick
-    })), required && /*#__PURE__*/_react["default"].createElement(_TextField.StyledIndicator, {
-      className: (0, _utils.cx)(_TextField2.classes.outerLabelPlacement, requiredPlacementClass, hasHintClass)
-    }), optionalTextNode), titleCaption && /*#__PURE__*/_react["default"].createElement(_TextField.TitleCaption, null, titleCaption)), /*#__PURE__*/_react["default"].createElement(_TextField.InputWrapper
+    }, required && /*#__PURE__*/_react["default"].createElement(_TextField.StyledIndicator, {
+      className: (0, _utils.cx)(_TextField2.classes.outerLabelPlacement, requiredPlacementClass)
+    }), innerLabelValue, optionalTextNode), /*#__PURE__*/_react["default"].createElement(_TextField.InputWrapper
     // Ref для внутреннего использования. Не отдается наружу.
     , {
       ref: rest.inputWrapperRef,
       className: (0, _utils.cx)(withHasChips, wrapperWithoutLeftContent, wrapperWithoutRightContent)
-    }, !hasOuterLabel && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, required && /*#__PURE__*/_react["default"].createElement(_TextField.StyledIndicator, {
+    }, !hasOuterLabel && required && /*#__PURE__*/_react["default"].createElement(_TextField.StyledIndicator, {
       className: (0, _utils.cx)(_TextField2.classes.innerLabelPlacement, requiredPlacementClass)
-    }), hintText && /*#__PURE__*/_react["default"].createElement(_TextField.StyledHintWrapper, {
-      className: _TextField2.classes.innerLabelPlacement
-    }, /*#__PURE__*/_react["default"].createElement(_Hint.HintComponent, {
-      ref: hintForkRef,
-      hintText: hintText,
-      hintTrigger: hintTrigger,
-      isHintVisible: isHintVisible,
-      hintTargetIcon: hintTargetIcon,
-      hintPlacement: hintPlacement,
-      hintHasArrow: hintHasArrow,
-      hintOffset: hintOffset,
-      hintWidth: hintWidth,
-      hintContentLeft: hintContentLeft,
-      handleHintShow: handleHintShow,
-      handleHintHide: handleHintHide,
-      handleHintClick: handleHintClick
-    }))), contentLeft && /*#__PURE__*/_react["default"].createElement(_TextField.StyledContentLeft, {
+    }), contentLeft && /*#__PURE__*/_react["default"].createElement(_TextField.StyledContentLeft, {
       isClear: clear,
       isDefaultView: isDefaultView
     }, contentLeft), /*#__PURE__*/_react["default"].createElement(_TextField.InputLabelWrapper, {
@@ -372,12 +289,6 @@ var textFieldConfig = exports.textFieldConfig = {
     },
     labelPlacement: {
       css: _base6.base
-    },
-    hintView: {
-      css: _base7.base
-    },
-    hintSize: {
-      css: _base8.base
     }
   },
   defaults: {

package/styled-components/cjs/components/TextField/TextField.styles.js

@@ -3,81 +3,56 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TitleCaption = exports.StyledTextBefore = exports.StyledTextAfter = exports.StyledOptionalText = exports.StyledIndicatorWrapper = exports.StyledIndicator = exports.StyledHintWrapper = exports.StyledContentRight = exports.StyledContentLeft = exports.StyledChips = exports.OuterLabelWrapper = exports.LeftHelper = exports.Label = exports.InputWrapper = exports.InputPlaceholder = exports.InputLabelWrapper = exports.InputContainer = exports.Input = exports.HintTargetWrapper = exports.Hint = void 0;
+exports.StyledTextBefore = exports.StyledTextAfter = exports.StyledOptionalText = exports.StyledIndicator = exports.StyledContentRight = exports.StyledContentLeft = exports.StyledChips = exports.LeftHelper = exports.Label = exports.InputWrapper = exports.InputPlaceholder = exports.InputLabelWrapper = exports.InputContainer = exports.Input = void 0;
 var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
-var _engines = /*#__PURE__*/require("../../engines");
-var _Tooltip = /*#__PURE__*/require("../Tooltip");
 var _TextField = /*#__PURE__*/require("./TextField.tokens");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Tooltip.tooltipConfig);
-var Tooltip = /*#__PURE__*/(0, _engines.component)(mergedConfig);
-var Hint = exports.Hint = /*#__PURE__*/(0, _styledComponents["default"])(Tooltip).withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-0"
-})([""]);
 var InputWrapper = exports.InputWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-1"
+  componentId: "plasma-new-hope__sc-g4vxbb-0"
 })(["position:relative;display:flex;align-items:center;box-sizing:border-box;"]);
 var InputLabelWrapper = exports.InputLabelWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-2"
+  componentId: "plasma-new-hope__sc-g4vxbb-1"
 })(["flex:1;overflow:scroll;position:relative;width:100%;display:inline-flex;align-items:center;::-webkit-scrollbar{display:none;}scrollbar-width:none;overscroll-behavior:contain;&.", "{height:var(", ");border-radius:var(", ");}"], /*#__PURE__*/String(_TextField.classes.hasChips), _TextField.tokens.chipHeight, _TextField.tokens.chipBorderRadius);
 var StyledChips = exports.StyledChips = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-3"
+  componentId: "plasma-new-hope__sc-g4vxbb-2"
 })(["display:flex;gap:var(", ");margin-right:var(", ");user-select:none;"], _TextField.tokens.chipGap, _TextField.tokens.chipGap);
 var Input = exports.Input = /*#__PURE__*/_styledComponents["default"].input.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-4"
+  componentId: "plasma-new-hope__sc-g4vxbb-3"
 })(["box-sizing:border-box;appearance:none;border:0;padding:0;background-color:transparent;outline:none;width:100%;z-index:1;&::placeholder{opacity:0;}"]);
 var InputContainer = exports.InputContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-5"
+  componentId: "plasma-new-hope__sc-g4vxbb-4"
 })(["position:relative;flex:1;min-width:60%;"]);
 var InputPlaceholder = exports.InputPlaceholder = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-6"
+  componentId: "plasma-new-hope__sc-g4vxbb-5"
 })(["position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;white-space:nowrap;pointer-events:none;user-select:none;font:inherit;letter-spacing:inherit;line-height:inherit;color:var(", ");"], _TextField.tokens.placeholderColor);
-var OuterLabelWrapper = exports.OuterLabelWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-7"
-})(["display:flex;align-items:center;margin-bottom:", ";"], function (_ref) {
-  var isInnnerLabel = _ref.isInnnerLabel;
-  return isInnnerLabel ? "var(".concat(_TextField.tokens.titleCaptionInnerLabelOffset, ")") : "var(".concat(_TextField.tokens.labelOffset, ")");
-});
-var TitleCaption = exports.TitleCaption = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-8"
-})(["display:inline-block;margin-left:auto;"]);
-var StyledIndicatorWrapper = exports.StyledIndicatorWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-9"
-})(["position:relative;display:inline-flex;align-items:center;"]);
 var Label = exports.Label = /*#__PURE__*/_styledComponents["default"].label.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-10"
-})(["display:inline-flex;"]);
+  componentId: "plasma-new-hope__sc-g4vxbb-6"
+})(["position:relative;display:inline-flex;"]);
 var StyledContentSlot = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-11"
-})(["color:", ";line-height:0;"], function (_ref2) {
-  var isDefaultView = _ref2.isDefaultView,
-    isClear = _ref2.isClear;
+  componentId: "plasma-new-hope__sc-g4vxbb-7"
+})(["color:", ";line-height:0;"], function (_ref) {
+  var isDefaultView = _ref.isDefaultView,
+    isClear = _ref.isClear;
   return !isDefaultView && isClear ? "var(".concat(_TextField.tokens.clearColor, ")") : "var(".concat(_TextField.tokens.contentSlotColor, ")");
 });
 var StyledContentLeft = exports.StyledContentLeft = /*#__PURE__*/(0, _styledComponents["default"])(StyledContentSlot).withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-12"
+  componentId: "plasma-new-hope__sc-g4vxbb-8"
 })(["margin:var(", ");"], _TextField.tokens.leftContentMargin);
 var StyledContentRight = exports.StyledContentRight = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-13"
+  componentId: "plasma-new-hope__sc-g4vxbb-9"
 })(["line-height:0;margin:var(", ");color:var(", ",var(", "));&:hover{color:var(", ");color:var(", ",var(", "));cursor:pointer;}&:active{color:var(", ",var(", "));}"], _TextField.tokens.rightContentMargin, _TextField.tokens.contentSlotRightColor, _TextField.tokens.contentSlotColor, _TextField.tokens.contentSlotColorHover, _TextField.tokens.contentSlotRightColorHover, _TextField.tokens.contentSlotColorHover, _TextField.tokens.contentSlotRightColorActive, _TextField.tokens.contentSlotColorActive);
 var LeftHelper = exports.LeftHelper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-14"
+  componentId: "plasma-new-hope__sc-g4vxbb-10"
 })([""]);
 var StyledTextBefore = exports.StyledTextBefore = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-15"
+  componentId: "plasma-new-hope__sc-g4vxbb-11"
 })([""]);
 var StyledTextAfter = exports.StyledTextAfter = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-16"
+  componentId: "plasma-new-hope__sc-g4vxbb-12"
 })([""]);
 var StyledOptionalText = exports.StyledOptionalText = /*#__PURE__*/_styledComponents["default"].span.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-17"
+  componentId: "plasma-new-hope__sc-g4vxbb-13"
 })(["color:var(", ");"], _TextField.tokens.optionalColor);
-var StyledHintWrapper = exports.StyledHintWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-18"
-})(["display:inline-block;line-height:0;&.", "{position:absolute;margin:0;inset:var(", ");}"], _TextField.classes.innerLabelPlacement, _TextField.tokens.hintInnerLabelPlacementOffset);
-var HintTargetWrapper = exports.HintTargetWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-19"
-})(["color:var(", ");display:flex;justify-content:center;align-items:center;"], _TextField.tokens.hintIconColor);
 var StyledIndicator = exports.StyledIndicator = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-g4vxbb-20"
-})(["position:absolute;border-radius:50%;background-color:var(", ");&.", "{width:var(", ");height:var(", ");inset:var(", ");&.align-right{inset:var(", ");&.", "{right:calc(-1 * var(", "));}}}&.", "{width:var(", ");height:var(", ");inset:var(", ");&.align-right{inset:var(", ");}}"], _TextField.tokens.indicatorColor, _TextField.classes.outerLabelPlacement, _TextField.tokens.indicatorSizeOuter, _TextField.tokens.indicatorSizeOuter, _TextField.tokens.indicatorLabelPlacementOuter, _TextField.tokens.indicatorLabelPlacementOuterRight, _TextField.classes.hasHint, _TextField.tokens.indicatorSizeOuter, _TextField.classes.innerLabelPlacement, _TextField.tokens.indicatorSizeInner, _TextField.tokens.indicatorSizeInner, _TextField.tokens.indicatorLabelPlacementInner, _TextField.tokens.indicatorLabelPlacementInnerRight);
+  componentId: "plasma-new-hope__sc-g4vxbb-14"
+})(["position:absolute;border-radius:50%;background-color:var(", ");&.", "{width:var(", ");height:var(", ");inset:var(", ");&.align-right{inset:var(", ");}}&.", "{width:var(", ");height:var(", ");inset:var(", ");&.align-right{inset:var(", ");}}"], _TextField.tokens.indicatorColor, _TextField.classes.outerLabelPlacement, _TextField.tokens.indicatorSizeOuter, _TextField.tokens.indicatorSizeOuter, _TextField.tokens.indicatorLabelPlacementOuter, _TextField.tokens.indicatorLabelPlacementOuterRight, _TextField.classes.innerLabelPlacement, _TextField.tokens.indicatorSizeInner, _TextField.tokens.indicatorSizeInner, _TextField.tokens.indicatorLabelPlacementInner, _TextField.tokens.indicatorLabelPlacementInnerRight);

package/styled-components/cjs/components/TextField/TextField.template-doc.mdx

@@ -125,8 +125,7 @@ export function App() {
 ```
 
 ### Подсказка
-Для вывода подсказки снизу от поля используйте свойство `helperText`,
-для подсказки в виде Tooltip - `hintText`, для подсказки сверху справа - `titleCaption`:
+Для вывода подсказки снизу от поля используйте свойство `helperText`:
 
 ```tsx live
 import React from 'react';
@@ -139,10 +138,6 @@ export function App() {
                 placeholder="Введите значение"
                 defaultValue="Значение"
                 helperText="Подсказка снизу"
-                titleCaption="Подсказка сверху"
-                hintText="Подсказка в виде Tooltip"
-                hintView="default"
-                hintSize="m"
             />
         </div>
     );

package/styled-components/cjs/components/TextField/TextField.tokens.js

@@ -14,7 +14,6 @@ var classes = exports.classes = {
   hideLabel: 'hide-label',
   clear: 'textfield-clear',
   hasDivider: 'textfield-has-divider',
-  hasHint: 'textfield-has-hint',
   textFieldGroupItem: 'text-field-group-item'
 };
 var tokens = exports.tokens = {
@@ -84,15 +83,6 @@ var tokens = exports.tokens = {
   labelInnerLineHeight: '--plasma-textfield-placement_inner__label-line-height',
   labelInnerPadding: '--plasma-textfield-placement_inner__label-padding',
   contentLabelInnerPadding: '--plasma-textfield-placement_inner__content-padding',
-  titleCaptionColor: '--plasma-textfield__title-caption-color',
-  titleCaptionColorReadOnly: '--plasma-textfield__title-caption-color-readonly',
-  titleCaptionInnerLabelOffset: '--plasma-textfield__title-caption-label-inner-offset',
-  titleCaptionFontFamily: '--plasma-textfield__title-caption-font-family',
-  titleCaptionFontStyle: '--plasma-textfield__title-caption-font-style',
-  titleCaptionFontSize: '--plasma-textfield__title-caption-font-size',
-  titleCaptionFontWeight: '--plasma-textfield__title-caption-font-weight',
-  titleCaptionLetterSpacing: '--plasma-textfield__title-caption-letter-spacing',
-  titleCaptionLineHeight: '--plasma-textfield__title-caption-line-height',
   leftHelperColor: '--plasma-textfield__left-helper-color',
   leftHelperColorReadOnly: '--plasma-textfield__left-helper-color-readonly',
   leftHelperOffset: '--plasma-textfield__left-helper-offset',
@@ -109,34 +99,6 @@ var tokens = exports.tokens = {
   textAfterMargin: '--plasma-textfield__after-text-margin',
   /** Прозрачность для всего компонента в состоянии disabled */
   disabledOpacity: '--plasma-textfield-disabled-opacity',
-  /** Токены для tooltip */
-  hintMargin: '--plasma-textfield__hint-margin',
-  hintTargetSize: '--plasma-textfield__hint-target-size',
-  hintIconColor: '--plasma-textfield__hint-icon-color',
-  hintInnerLabelPlacementOffset: '--plasma-textfield__hint-inner-label-placement-offset',
-  clearHintInnerLabelPlacementOffset: '--plasma-textfield__clear-hint-inner-label-placement-offset',
-  tooltipBackgroundColor: '--plasma-textfield__tooltip-background-color',
-  tooltipBoxShadow: '--plasma-textfield__tooltip-box-shadow',
-  tooltipColor: '--plasma-textfield__tooltip-color',
-  tooltipPaddingTop: '--plasma-textfield__tooltip-padding-top',
-  tooltipPaddingRight: '--plasma-textfield__tooltip-padding-right',
-  tooltipPaddingBottom: '--plasma-textfield__tooltip-padding-bottom',
-  tooltipPaddingLeft: '--plasma-textfield__tooltip-padding-left',
-  tooltipMinHeight: '--plasma-textfield__tooltip-min-height',
-  tooltipBorderRadius: '--plasma-textfield__tooltip-border-radius',
-  tooltipTextFontFamily: '--plasma-textfield__tooltip-text-font-family',
-  tooltipTextFontSize: '--plasma-textfield__tooltip-text-font-size',
-  tooltipTextFontStyle: '--plasma-textfield__tooltip-text-font-style',
-  tooltipTextFontWeight: '--plasma-textfield__tooltip-text-font-weight',
-  tooltipTextFontLetterSpacing: '--plasma-textfield__tooltip-text-font-letter-spacing',
-  tooltipTextFontLineHeight: '--plasma-textfield__tooltip-text-font-line-height',
-  tooltipContentLeftMargin: '--plasma-textfield__tooltip-content-left-margin',
-  tooltipArrowMaskWidth: '--plasma-textfield__tooltip-arrow-mask-width',
-  tooltipArrowMaskHeight: '--plasma-textfield__tooltip-arrow-mask-height',
-  tooltipArrowMaskImage: '--plasma-textfield__tooltip-arrow-mask-image',
-  tooltipArrowHeight: '--plasma-textfield__tooltip-arrow-height',
-  tooltipArrowEdgeMargin: '--plasma-textfield__tooltip-arrow-edge-margin',
-  tooltipArrowBackground: '--plasma-textfield__tooltip-arrow-background',
   /** Токены чипа */
   chipHeight: '--plasma-textfield__chip-height',
   chipBorderRadius: '--plasma-textfield__chip-border-radius',
@@ -180,6 +142,5 @@ var tokens = exports.tokens = {
   indicatorLabelPlacementInnerRight: '--plasma-textfield__indicator-placement-inner-right',
   indicatorLabelPlacementOuterRight: '--plasma-textfield__indicator-placement-outer-right',
   clearIndicatorLabelPlacementInner: '--plasma-textfield__clear-indicator-placement-inner',
-  clearIndicatorLabelPlacementInnerRight: '--plasma-textfield__clear-indicator-placement-inner-right',
-  clearIndicatorHintInnerRight: '--plasma-textfield__clear-indicator-hint-placement-inner-right'
+  clearIndicatorLabelPlacementInnerRight: '--plasma-textfield__clear-indicator-placement-inner-right'
 };

package/styled-components/cjs/components/TextField/variations/_clear/base.js

@@ -7,4 +7,4 @@ exports.base = void 0;
 var _styledComponents = /*#__PURE__*/require("styled-components");
 var _TextField = /*#__PURE__*/require("../../TextField.tokens");
 var _TextField2 = /*#__PURE__*/require("../../TextField.styles");
-var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{&[readonly] ", ",", "{background-color:unset;box-shadow:none;border-radius:0;padding-left:0;padding-right:0;&:hover{background-color:unset;}}", "{margin-left:0;}", "{margin-right:0;}&.", "{", "{margin-bottom:var(", ");}}", "{color:var(", ");}", "{color:var(", ");}", "{&.", "{inset:var(", ");&.align-right{inset:var(", ");}}}&.", "{", "{&.", "{inset:var(", ");}}", "{&.", ".align-right{inset:var(", ");}}}&.", "{", "{--plasma_private-textfield-divider-color:var(", ");&:before{content:'';position:absolute;height:0.063rem;width:100%;bottom:0;left:0;background-color:var(--plasma_private-textfield-divider-color);transition:background-color 0.1s ease-in;}}&:not([readonly]) ", ":hover{--plasma_private-textfield-divider-color:var( ", ",var(", ") );}&:not([readonly]) ", ":focus-within{--plasma_private-textfield-divider-color:var( ", ",var(", ") );", "{color:var(", ");}}}}"], _TextField.classes.clear, _TextField2.InputWrapper, _TextField2.InputWrapper, _TextField2.StyledContentLeft, _TextField2.StyledContentRight, _TextField.classes.outerLabelPlacement, _TextField2.OuterLabelWrapper, _TextField.tokens.clearLabelOffset, _TextField2.Input, _TextField.tokens.clearColor, _TextField2.InputPlaceholder, _TextField.tokens.clearPlaceholderColor, _TextField2.StyledIndicator, _TextField.classes.innerLabelPlacement, _TextField.tokens.clearIndicatorLabelPlacementInner, _TextField.tokens.clearIndicatorLabelPlacementInnerRight, _TextField.classes.hasHint, _TextField2.StyledHintWrapper, _TextField.classes.innerLabelPlacement, _TextField.tokens.clearHintInnerLabelPlacementOffset, _TextField2.StyledIndicator, _TextField.classes.innerLabelPlacement, _TextField.tokens.clearIndicatorHintInnerRight, _TextField.classes.hasDivider, _TextField2.InputWrapper, /*#__PURE__*/String(_TextField.tokens.dividerColor), _TextField2.InputWrapper, _TextField.tokens.dividerColorHover, /*#__PURE__*/String(_TextField.tokens.dividerColor), _TextField2.InputWrapper, _TextField.tokens.dividerColorFocus, /*#__PURE__*/String(_TextField.tokens.dividerColor), _TextField2.InputPlaceholder, _TextField.tokens.clearPlaceholderColorFocus);
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{&[readonly] ", ",", "{background-color:unset;box-shadow:none;border-radius:0;padding-left:0;padding-right:0;&:hover{background-color:unset;}}", "{margin-left:0;}", "{margin-right:0;}&.", "{", "{margin-bottom:var(", ");}}", "{color:var(", ");}", "{color:var(", ");}", "{&.", "{inset:var(", ");&.align-right{inset:var(", ");}}}&.", "{", "{--plasma_private-textfield-divider-color:var(", ");&:before{content:'';position:absolute;height:0.063rem;width:100%;bottom:0;left:0;background-color:var(--plasma_private-textfield-divider-color);transition:background-color 0.1s ease-in;}}&:not([readonly]) ", ":hover{--plasma_private-textfield-divider-color:var( ", ",var(", ") );}&:not([readonly]) ", ":focus-within{--plasma_private-textfield-divider-color:var( ", ",var(", ") );", "{color:var(", ");}}}}"], _TextField.classes.clear, _TextField2.InputWrapper, _TextField2.InputWrapper, _TextField2.StyledContentLeft, _TextField2.StyledContentRight, _TextField.classes.outerLabelPlacement, _TextField2.Label, _TextField.tokens.clearLabelOffset, _TextField2.Input, _TextField.tokens.clearColor, _TextField2.InputPlaceholder, _TextField.tokens.clearPlaceholderColor, _TextField2.StyledIndicator, _TextField.classes.innerLabelPlacement, _TextField.tokens.clearIndicatorLabelPlacementInner, _TextField.tokens.clearIndicatorLabelPlacementInnerRight, _TextField.classes.hasDivider, _TextField2.InputWrapper, /*#__PURE__*/String(_TextField.tokens.dividerColor), _TextField2.InputWrapper, _TextField.tokens.dividerColorHover, /*#__PURE__*/String(_TextField.tokens.dividerColor), _TextField2.InputWrapper, _TextField.tokens.dividerColorFocus, /*#__PURE__*/String(_TextField.tokens.dividerColor), _TextField2.InputPlaceholder, _TextField.tokens.clearPlaceholderColorFocus);

package/styled-components/cjs/components/TextField/variations/_label-placement/base.js

@@ -7,4 +7,4 @@ exports.base = void 0;
 var _styledComponents = /*#__PURE__*/require("styled-components");
 var _TextField = /*#__PURE__*/require("../../TextField.tokens");
 var _TextField2 = /*#__PURE__*/require("../../TextField.styles");
-var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{", "{position:relative;display:inline-block;color:var(", ");}}&.", "{", "{padding:var(", ");}", ",", "{padding:var(", ");}", ":focus ~ ", ",", ".", " ~ ", "{color:var(", ");align-items:flex-start;padding:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{color:var(", ");pointer-events:none;position:absolute;top:0;display:flex;align-items:center;box-sizing:border-box;height:var(", ");padding-top:calc(calc(var(", ") - var(", ")) / 2);padding-bottom:calc(calc(var(", ") - var(", ")) / 2);}&.", " ", "{color:var(", ");}}"], _TextField.classes.outerLabelPlacement, _TextField2.Label, _TextField.tokens.labelColor, _TextField.classes.innerLabelPlacement, _TextField2.InputContainer, _TextField.tokens.contentLabelInnerPadding, _TextField2.StyledTextAfter, _TextField2.StyledTextBefore, _TextField.tokens.contentLabelInnerPadding, _TextField2.Input, _TextField2.Label, _TextField2.Input, _TextField.classes.hasValue, _TextField2.Label, _TextField.tokens.placeholderColor, _TextField.tokens.labelInnerPadding, _TextField.tokens.labelInnerFontFamily, _TextField.tokens.labelInnerFontSize, _TextField.tokens.labelInnerFontStyle, _TextField.tokens.labelInnerFontWeight, _TextField.tokens.labelInnerLetterSpacing, _TextField.tokens.labelInnerLineHeight, _TextField2.Label, _TextField.tokens.placeholderColor, _TextField.tokens.height, _TextField.tokens.height, _TextField.tokens.labelLineHeight, _TextField.tokens.height, _TextField.tokens.labelLineHeight, _TextField.classes.clear, _TextField2.Label, _TextField.tokens.clearPlaceholderColor);
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{", "{position:relative;display:inline-block;margin-bottom:var(", ");color:var(", ");}}&.", "{", "{padding:var(", ");}", ",", "{padding:var(", ");}", ":focus ~ ", ",", ".", " ~ ", "{color:var(", ");align-items:flex-start;padding:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{color:var(", ");pointer-events:none;position:absolute;top:0;display:flex;align-items:center;box-sizing:border-box;height:var(", ");padding-top:calc(calc(var(", ") - var(", ")) / 2);padding-bottom:calc(calc(var(", ") - var(", ")) / 2);}&.", " ", "{color:var(", ");}}"], _TextField.classes.outerLabelPlacement, _TextField2.Label, _TextField.tokens.labelOffset, _TextField.tokens.labelColor, _TextField.classes.innerLabelPlacement, _TextField2.InputContainer, _TextField.tokens.contentLabelInnerPadding, _TextField2.StyledTextAfter, _TextField2.StyledTextBefore, _TextField.tokens.contentLabelInnerPadding, _TextField2.Input, _TextField2.Label, _TextField2.Input, _TextField.classes.hasValue, _TextField2.Label, _TextField.tokens.placeholderColor, _TextField.tokens.labelInnerPadding, _TextField.tokens.labelInnerFontFamily, _TextField.tokens.labelInnerFontSize, _TextField.tokens.labelInnerFontStyle, _TextField.tokens.labelInnerFontWeight, _TextField.tokens.labelInnerLetterSpacing, _TextField.tokens.labelInnerLineHeight, _TextField2.Label, _TextField.tokens.placeholderColor, _TextField.tokens.height, _TextField.tokens.height, _TextField.tokens.labelLineHeight, _TextField.tokens.height, _TextField.tokens.labelLineHeight, _TextField.classes.clear, _TextField2.Label, _TextField.tokens.clearPlaceholderColor);

package/styled-components/cjs/components/TextField/variations/_read-only/base.js

@@ -7,4 +7,4 @@ exports.base = void 0;
 var _styledComponents = /*#__PURE__*/require("styled-components");
 var _TextField = /*#__PURE__*/require("../../TextField.tokens");
 var _TextField2 = /*#__PURE__*/require("../../TextField.styles");
-var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&[readonly]{", "{color:var(", ");background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");}&.", " ", "{&:before{background-color:var(", ");}}", ":hover{background-color:var(", ");}", ":focus-within ", ",", "{color:var(", ");}", "{color:var(", ");cursor:default;min-width:unset;}", "{color:var(", ");}", "{color:var(", ");}&.", " ", "{color:var(", ");}}"], _TextField2.InputWrapper, _TextField.tokens.colorReadOnly, /*#__PURE__*/String(_TextField.tokens.backgroundColorReadOnly), /*#__PURE__*/String(_TextField.tokens.borderWidth), /*#__PURE__*/String(_TextField.tokens.borderColorReadOnly), _TextField.classes.hasDivider, _TextField2.InputWrapper, /*#__PURE__*/String(_TextField.tokens.dividerColorReadOnly), _TextField2.InputWrapper, _TextField.tokens.backgroundColorReadOnly, _TextField2.InputWrapper, _TextField2.InputPlaceholder, _TextField2.InputPlaceholder, _TextField.tokens.placeholderColorReadOnly, _TextField2.Input, _TextField.tokens.colorReadOnly, _TextField2.TitleCaption, _TextField.tokens.titleCaptionColorReadOnly, _TextField2.LeftHelper, _TextField.tokens.leftHelperColorReadOnly, _TextField.classes.outerLabelPlacement, _TextField2.Label, _TextField.tokens.labelColorReadOnly);
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&[readonly]{", "{color:var(", ");background-color:var(", ");box-shadow:inset 0 0 0 var(", ") var(", ");}&.", " ", "{&:before{background-color:var(", ");}}", ":hover{background-color:var(", ");}", ":focus-within ", ",", "{color:var(", ");}", "{color:var(", ");cursor:default;min-width:unset;}", "{color:var(", ");}&.", " ", "{color:var(", ");}}"], _TextField2.InputWrapper, _TextField.tokens.colorReadOnly, /*#__PURE__*/String(_TextField.tokens.backgroundColorReadOnly), /*#__PURE__*/String(_TextField.tokens.borderWidth), /*#__PURE__*/String(_TextField.tokens.borderColorReadOnly), _TextField.classes.hasDivider, _TextField2.InputWrapper, /*#__PURE__*/String(_TextField.tokens.dividerColorReadOnly), _TextField2.InputWrapper, _TextField.tokens.backgroundColorReadOnly, _TextField2.InputWrapper, _TextField2.InputPlaceholder, _TextField2.InputPlaceholder, _TextField.tokens.placeholderColorReadOnly, _TextField2.Input, _TextField.tokens.colorReadOnly, _TextField2.LeftHelper, _TextField.tokens.leftHelperColorReadOnly, _TextField.classes.outerLabelPlacement, _TextField2.Label, _TextField.tokens.labelColorReadOnly);

package/styled-components/cjs/components/TextField/variations/_size/base.js

@@ -7,4 +7,4 @@ exports.base = void 0;
 var _styledComponents = /*#__PURE__*/require("styled-components");
 var _TextField = /*#__PURE__*/require("../../TextField.tokens");
 var _TextField2 = /*#__PURE__*/require("../../TextField.styles");
-var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{width:100%;font:inherit;letter-spacing:inherit;line-height:inherit;}", "{width:100%;font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{height:var(", ");border-radius:var(", ");padding:var(", ");&.", "{padding-top:var(", ");padding-bottom:var(", ");}&.", "{padding-left:var(", ");}&.", "{padding-right:var(", ");}}", ",&:not(.", ") ", "{font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{margin:var(", ");width:var(", ");height:var(", ");}", "{width:var(", ");height:var(", ");}", "{font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{margin-top:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", ",", "{font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{margin:var(", ");}", "{margin:var(", ");}"], _TextField2.Input, _TextField2.InputContainer, _TextField.tokens.fontFamily, _TextField.tokens.fontSize, _TextField.tokens.fontStyle, _TextField.tokens.fontWeight, _TextField.tokens.letterSpacing, _TextField.tokens.lineHeight, _TextField2.InputWrapper, _TextField.tokens.height, _TextField.tokens.borderRadius, _TextField.tokens.padding, _TextField.classes.hasChips, _TextField.tokens.paddingWithChips, _TextField.tokens.paddingWithChips, _TextField.classes.hasEmptyContentLeft, _TextField.tokens.paddingWithChips, _TextField.classes.hasEmptyContentRight, _TextField.tokens.paddingWithChips, _TextField2.Label, _TextField.classes.innerLabelPlacement, _TextField2.StyledOptionalText, _TextField.tokens.labelFontFamily, _TextField.tokens.labelFontSize, _TextField.tokens.labelFontStyle, _TextField.tokens.labelFontWeight, _TextField.tokens.labelLetterSpacing, _TextField.tokens.labelLineHeight, _TextField2.StyledHintWrapper, _TextField.tokens.hintMargin, _TextField.tokens.hintTargetSize, _TextField.tokens.hintTargetSize, _TextField2.HintTargetWrapper, _TextField.tokens.hintTargetSize, _TextField.tokens.hintTargetSize, _TextField2.TitleCaption, _TextField.tokens.titleCaptionFontFamily, _TextField.tokens.titleCaptionFontSize, _TextField.tokens.titleCaptionFontStyle, _TextField.tokens.titleCaptionFontWeight, _TextField.tokens.titleCaptionLetterSpacing, _TextField.tokens.titleCaptionLineHeight, _TextField2.LeftHelper, _TextField.tokens.leftHelperOffset, _TextField.tokens.leftHelperFontFamily, _TextField.tokens.leftHelperFontSize, _TextField.tokens.leftHelperFontStyle, _TextField.tokens.leftHelperFontWeight, _TextField.tokens.leftHelperLetterSpacing, _TextField.tokens.leftHelperLineHeight, _TextField2.StyledTextBefore, _TextField2.StyledTextAfter, _TextField.tokens.fontFamily, _TextField.tokens.fontSize, _TextField.tokens.fontStyle, _TextField.tokens.fontWeight, _TextField.tokens.letterSpacing, _TextField.tokens.lineHeight, _TextField2.StyledTextBefore, _TextField.tokens.textBeforeMargin, _TextField2.StyledTextAfter, _TextField.tokens.textAfterMargin);
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{width:100%;font:inherit;letter-spacing:inherit;line-height:inherit;}", "{width:100%;font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{height:var(", ");border-radius:var(", ");padding:var(", ");&.", "{padding-top:var(", ");padding-bottom:var(", ");}&.", "{padding-left:var(", ");}&.", "{padding-right:var(", ");}}", "{font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{margin-top:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", ",", "{font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{margin:var(", ");}", "{margin:var(", ");}"], _TextField2.Input, _TextField2.InputContainer, _TextField.tokens.fontFamily, _TextField.tokens.fontSize, _TextField.tokens.fontStyle, _TextField.tokens.fontWeight, _TextField.tokens.letterSpacing, _TextField.tokens.lineHeight, _TextField2.InputWrapper, _TextField.tokens.height, _TextField.tokens.borderRadius, _TextField.tokens.padding, _TextField.classes.hasChips, _TextField.tokens.paddingWithChips, _TextField.tokens.paddingWithChips, _TextField.classes.hasEmptyContentLeft, _TextField.tokens.paddingWithChips, _TextField.classes.hasEmptyContentRight, _TextField.tokens.paddingWithChips, _TextField2.Label, _TextField.tokens.labelFontFamily, _TextField.tokens.labelFontSize, _TextField.tokens.labelFontStyle, _TextField.tokens.labelFontWeight, _TextField.tokens.labelLetterSpacing, _TextField.tokens.labelLineHeight, _TextField2.LeftHelper, _TextField.tokens.leftHelperOffset, _TextField.tokens.leftHelperFontFamily, _TextField.tokens.leftHelperFontSize, _TextField.tokens.leftHelperFontStyle, _TextField.tokens.leftHelperFontWeight, _TextField.tokens.leftHelperLetterSpacing, _TextField.tokens.leftHelperLineHeight, _TextField2.StyledTextBefore, _TextField2.StyledTextAfter, _TextField.tokens.fontFamily, _TextField.tokens.fontSize, _TextField.tokens.fontStyle, _TextField.tokens.fontWeight, _TextField.tokens.letterSpacing, _TextField.tokens.lineHeight, _TextField2.StyledTextBefore, _TextField.tokens.textBeforeMargin, _TextField2.StyledTextAfter, _TextField.tokens.textAfterMargin);

package/styled-components/cjs/components/TextField/variations/_view/base.js

@@ -7,4 +7,4 @@ exports.base = void 0;
 var _styledComponents = /*#__PURE__*/require("styled-components");
 var _TextField = /*#__PURE__*/require("../../TextField.tokens");
 var _TextField2 = /*#__PURE__*/require("../../TextField.styles");
-var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{--plasma_private-textfield-border-color:var(", ");--plasma_private-textfield-bg-color:var(", ");color:var(", ");background-color:var(--plasma_private-textfield-bg-color);box-shadow:inset 0 0 0 var(", ") var(--plasma_private-textfield-border-color);caret-color:var(", ");transition:background-color 0.1s ease-in,color 0.1s ease-in,box-shadow 0.1s ease-in;}", ":hover{--plasma_private-textfield-border-color:var(", ",var(", "));--plasma_private-textfield-bg-color:var( ", ",var(", ") );}", "{color:var(", ");}", "{color:var(", ");}", ":focus-within{--plasma_private-textfield-border-color:var(", ",var(", "));--plasma_private-textfield-bg-color:var( ", ",var(", ") );", "{color:var(", ");}}", "{color:var(", ");}", "{color:var(", ");}", "{color:var(", ");}", "{color:var(", ");}"], _TextField2.InputWrapper, /*#__PURE__*/String(_TextField.tokens.borderColor), /*#__PURE__*/String(_TextField.tokens.backgroundColor), _TextField.tokens.color, _TextField.tokens.borderWidth, _TextField.tokens.caretColor, _TextField2.InputWrapper, _TextField.tokens.borderColorHover, /*#__PURE__*/String(_TextField.tokens.borderColor), _TextField.tokens.backgroundColorHover, /*#__PURE__*/String(_TextField.tokens.backgroundColor), _TextField2.Input, _TextField.tokens.color, _TextField2.InputPlaceholder, _TextField.tokens.placeholderColor, _TextField2.InputWrapper, _TextField.tokens.borderColorFocus, /*#__PURE__*/String(_TextField.tokens.borderColor), _TextField.tokens.backgroundColorFocus, /*#__PURE__*/String(_TextField.tokens.backgroundColor), _TextField2.InputPlaceholder, _TextField.tokens.placeholderColorFocus, _TextField2.TitleCaption, _TextField.tokens.titleCaptionColor, _TextField2.LeftHelper, _TextField.tokens.leftHelperColor, _TextField2.StyledTextBefore, _TextField.tokens.textBeforeColor, _TextField2.StyledTextAfter, _TextField.tokens.textAfterColor);
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{--plasma_private-textfield-border-color:var(", ");--plasma_private-textfield-bg-color:var(", ");color:var(", ");background-color:var(--plasma_private-textfield-bg-color);box-shadow:inset 0 0 0 var(", ") var(--plasma_private-textfield-border-color);caret-color:var(", ");transition:background-color 0.1s ease-in,color 0.1s ease-in,box-shadow 0.1s ease-in;}", ":hover{--plasma_private-textfield-border-color:var(", ",var(", "));--plasma_private-textfield-bg-color:var( ", ",var(", ") );}", "{color:var(", ");}", "{color:var(", ");}", ":focus-within{--plasma_private-textfield-border-color:var(", ",var(", "));--plasma_private-textfield-bg-color:var( ", ",var(", ") );", "{color:var(", ");}}", "{color:var(", ");}", "{color:var(", ");}", "{color:var(", ");}"], _TextField2.InputWrapper, /*#__PURE__*/String(_TextField.tokens.borderColor), /*#__PURE__*/String(_TextField.tokens.backgroundColor), _TextField.tokens.color, _TextField.tokens.borderWidth, _TextField.tokens.caretColor, _TextField2.InputWrapper, _TextField.tokens.borderColorHover, /*#__PURE__*/String(_TextField.tokens.borderColor), _TextField.tokens.backgroundColorHover, /*#__PURE__*/String(_TextField.tokens.backgroundColor), _TextField2.Input, _TextField.tokens.color, _TextField2.InputPlaceholder, _TextField.tokens.placeholderColor, _TextField2.InputWrapper, _TextField.tokens.borderColorFocus, /*#__PURE__*/String(_TextField.tokens.borderColor), _TextField.tokens.backgroundColorFocus, /*#__PURE__*/String(_TextField.tokens.backgroundColor), _TextField2.InputPlaceholder, _TextField.tokens.placeholderColorFocus, _TextField2.LeftHelper, _TextField.tokens.leftHelperColor, _TextField2.StyledTextBefore, _TextField.tokens.textBeforeColor, _TextField2.StyledTextAfter, _TextField.tokens.textAfterColor);

package/styled-components/cjs/components/_Icon/index.js

@@ -141,12 +141,6 @@ Object.defineProperty(exports, "IconDone", {
     return _IconDone.IconDone;
   }
 });
-Object.defineProperty(exports, "IconInfoCircleOutline", {
-  enumerable: true,
-  get: function get() {
-    return _IconInfoCircleOutline.IconInfoCircleOutline;
-  }
-});
 Object.defineProperty(exports, "IconMic", {
   enumerable: true,
   get: function get() {
@@ -190,5 +184,4 @@ var _IconBlankDocOutline = /*#__PURE__*/require("./Icons/IconBlankDocOutline");
 var _IconBlankOutline = /*#__PURE__*/require("./Icons/IconBlankOutline");
 var _IconBlankPdfOutline = /*#__PURE__*/require("./Icons/IconBlankPdfOutline");
 var _IconBlankTxtOutline = /*#__PURE__*/require("./Icons/IconBlankTxtOutline");
-var _IconBlankXlsOutline = /*#__PURE__*/require("./Icons/IconBlankXlsOutline");
-var _IconInfoCircleOutline = /*#__PURE__*/require("./Icons/IconInfoCircleOutline");
+var _IconBlankXlsOutline = /*#__PURE__*/require("./Icons/IconBlankXlsOutline");

package/styled-components/cjs/examples/plasma_b2c/components/Accordion/Accordion.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import type { ComponentProps, ReactNode } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { disableProps } from '@salutejs/plasma-sb-utils';
@@ -7,6 +7,8 @@ import { mergeConfig } from '../../../../engines';
 import { WithTheme, argTypesFromConfig } from '../../../_helpers';
 import { accordionConfig } from '../../../../components/Accordion';
 import { Pin } from '../../../../utils/roundness';
+import { IconButton } from '../IconButton/IconButton';
+import { IconPlus } from '../../../../components/_Icon';
 
 import { config } from './Accordion.config';
 import { Accordion, AccordionItem } from './Accordion';
@@ -91,3 +93,78 @@ export const Default: StoryObj<AccordionProps> = {
         );
     },
 };
+
+const map = {
+    mr: 's',
+    lr: 's',
+    m: 's',
+    l: 's',
+    sr: 's',
+    xsr: 'xs',
+};
+
+const getSizeForIcon = (size) => {
+    if (map[size]) {
+        return map[size];
+    }
+
+    return size;
+};
+
+const ControlledAccordion = (props: AccordionProps) => {
+    const args = { ...props, text: undefined };
+    const [activeFirst, setActiveFirst] = useState(false);
+    const [activeSecond, setActiveSecond] = useState(false);
+    const [activeThree, setActiveThree] = useState(false);
+
+    return (
+        <Accordion {...args}>
+            <AccordionItem
+                contentRight={
+                    <IconButton view="secondary" size={args.size} onClick={() => setActiveFirst(!activeFirst)}>
+                        <IconPlus size={getSizeForIcon(args.size)} />
+                    </IconButton>
+                }
+                alignWithTitle={args.alignWithTitle}
+                type={args.type}
+                pin={args.pin}
+                title={args.title}
+                opened={activeFirst}
+            >
+                {args.body}
+            </AccordionItem>
+            <AccordionItem
+                contentRight={
+                    <IconButton view="secondary" size={args.size} onClick={() => setActiveSecond(!activeSecond)}>
+                        <IconPlus size={getSizeForIcon(args.size)} />
+                    </IconButton>
+                }
+                alignWithTitle={args.alignWithTitle}
+                type={args.type}
+                pin={args.pin}
+                title={args.title}
+                opened={activeSecond}
+            >
+                {args.body}
+            </AccordionItem>
+            <AccordionItem
+                contentRight={
+                    <IconButton view="secondary" size={args.size} onClick={() => setActiveThree(!activeThree)}>
+                        <IconPlus size={getSizeForIcon(args.size)} />
+                    </IconButton>
+                }
+                alignWithTitle={args.alignWithTitle}
+                type={args.type}
+                pin={args.pin}
+                title={args.title}
+                opened={activeThree}
+            >
+                {args.body}
+            </AccordionItem>
+        </Accordion>
+    );
+};
+
+export const Controlled: StoryObj<AccordionProps> = {
+    render: (props: AccordionProps) => ControlledAccordion(props),
+};