@salutejs/plasma-new-hope 0.114.0-dev.0 → 0.115.0-canary.1335.10199765951.0

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

@@ -13,7 +13,7 @@ var _Sheet = /*#__PURE__*/require("./Sheet.tokens");
 var _Sheet2 = /*#__PURE__*/require("./Sheet.styles");
 var _base = /*#__PURE__*/require("./variations/_view/base");
 var _utils2 = /*#__PURE__*/require("./utils");
-var _excluded = ["opened", "children", "onClose", "hasHandle", "contentHeader", "isHeaderFixed", "contentFooter", "isFooterFixed", "withOverlay", "withBlur", "withTransition", "throttleMs", "className", "view"];
+var _excluded = ["opened", "isOpen", "children", "onClose", "hasHandle", "contentHeader", "isHeaderFixed", "contentFooter", "isFooterFixed", "withOverlay", "withBlur", "withTransition", "throttleMs", "className", "view"];
 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); }
@@ -26,6 +26,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 var sheetRoot = exports.sheetRoot = function sheetRoot(Root) {
   return /*#__PURE__*/(0, _react.forwardRef)(function (_ref, rootRef) {
     var opened = _ref.opened,
+      isOpen = _ref.isOpen,
       children = _ref.children,
       onClose = _ref.onClose,
       _ref$hasHandle = _ref.hasHandle,
@@ -46,11 +47,12 @@ var sheetRoot = exports.sheetRoot = function sheetRoot(Root) {
       className = _ref.className,
       view = _ref.view,
       restProps = _objectWithoutProperties(_ref, _excluded);
+    var innerIsOpen = opened || isOpen;
     var contentWrapperRef = (0, _react.useRef)(null);
     var contentRef = (0, _react.useRef)(null);
     var handleRef = (0, _react.useRef)(null);
     (0, _hooks.useOverflow)({
-      opened: opened
+      isOpen: innerIsOpen
     });
     (0, _hooks.useSheetSwipe)({
       contentWrapperRef: contentWrapperRef,
@@ -61,15 +63,15 @@ var sheetRoot = exports.sheetRoot = function sheetRoot(Root) {
     });
     var hasHeader = Boolean(contentHeader);
     var hasFooter = Boolean(contentFooter);
-    var closedClass = opened ? undefined : "".concat(_Sheet.classes.closed);
+    var closedClass = innerIsOpen ? undefined : "".concat(_Sheet.classes.closed);
     var overlayBackgroundToken = withBlur ? "var(".concat(_Sheet.tokens.sheetOverlayWithBlurColor, ")") : "var(".concat(_Sheet.tokens.sheetOverlayColor, ")");
     return /*#__PURE__*/_react["default"].createElement(Root, {
-      opened: opened,
+      isOpen: innerIsOpen,
       onClose: onClose,
       view: view,
       ref: rootRef
     }, /*#__PURE__*/_react["default"].createElement(_Sheet2.StyledContentWrapper, _extends({
-      opened: opened,
+      isOpen: innerIsOpen,
       withTransition: withTransition,
       className: (0, _utils.cx)(closedClass, className),
       ref: contentWrapperRef
@@ -83,7 +85,7 @@ var sheetRoot = exports.sheetRoot = function sheetRoot(Root) {
       isHeaderFixed: isHeaderFixed
     }, contentHeader), /*#__PURE__*/_react["default"].createElement(_Sheet2.StyledSheetBody, null, children), hasFooter && /*#__PURE__*/_react["default"].createElement(_Sheet2.StyledSheetFooter, {
       isFooterFixed: isFooterFixed
-    }, contentFooter))), withOverlay && opened && /*#__PURE__*/_react["default"].createElement(_Overlay.Overlay, {
+    }, contentFooter))), withOverlay && innerIsOpen && /*#__PURE__*/_react["default"].createElement(_Overlay.Overlay, {
       zIndex: _utils2.DEFAULT_Z_INDEX,
       backgroundColorProperty: overlayBackgroundToken,
       withBlur: withBlur,

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

@@ -26,7 +26,7 @@ export function App() {
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
 
-            <Sheet opened={opened}
+            <Sheet isOpen={opened}
                 onClose={() => setOpened(false)}
                 contentHeader={
                     <div>
@@ -50,7 +50,7 @@ export function App() {
 
 ### Закрепление заголовка и футера
 
-С помощью свойств `isHeaderFixed` и `isFooterFixed` можно закрепить заголовок и футер. 
+С помощью свойств `isHeaderFixed` и `isFooterFixed` можно закрепить заголовок и футер.
 В этом случае при появлении прокрутки контент будет скроллиться под них.
 
 ```tsx live
@@ -64,7 +64,7 @@ export function App() {
     return (
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
-            <Sheet opened={opened}
+            <Sheet isOpen={opened}
                 onClose={() => setOpened(false)}
                 contentHeader={
                     <div>
@@ -105,7 +105,7 @@ export function App() {
             <Button onClick={() => setOpened(!opened)}>
                 {opened ? 'Закрыть' : 'Открыть'}
             </Button>
-            <Sheet opened={opened}
+            <Sheet isOpen={opened}
                 onClose={() => setOpened(false)}
                 withOverlay={false}
             >
@@ -131,7 +131,7 @@ export function App() {
             <Button onClick={() => setOpened(!opened)}>
                 {opened ? 'Закрыть' : 'Открыть'}
             </Button>
-            <Sheet opened={opened}
+            <Sheet isOpen={opened}
                 onClose={() => setOpened(false)}
                 withBlur
             >
@@ -140,4 +140,4 @@ export function App() {
         </>
     );
 }
-```
+```

package/styled-components/cjs/components/Sheet/hooks/useOverflow.js

@@ -6,16 +6,16 @@ Object.defineProperty(exports, "__esModule", {
 exports.useOverflow = void 0;
 var _react = /*#__PURE__*/require("react");
 var useOverflow = exports.useOverflow = function useOverflow(_ref) {
-  var opened = _ref.opened;
+  var isOpen = _ref.isOpen;
   var overflow = (0, _react.useRef)(document.body.style.overflowY);
 
   // linaria не поддерживает динамический global
   (0, _react.useEffect)(function () {
-    if (opened) {
+    if (isOpen) {
       overflow.current = document.body.style.overflowY;
       document.body.style.overflowY = 'hidden';
       return;
     }
     document.body.style.overflowY = overflow.current;
-  }, [opened]);
+  }, [isOpen]);
 };

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

@@ -222,7 +222,7 @@ const StoryAddCustomItem = (args: StorySelectProps) => {
                 view={view}
                 disabled={disabled}
                 readOnly={readOnly}
-                opened={opened}
+                isOpen={opened}
                 onToggle={onToggle}
                 onChangeValue={onChangeValue}
                 onKeyDown={onKeyDown}

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

@@ -49,7 +49,7 @@ const StoryDefault = ({
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
             <Sheet
-                opened={opened}
+                isOpen={opened}
                 withOverlay={withOverlay}
                 withTransition={withTransition}
                 onClose={() => setOpened(false)}
@@ -92,7 +92,7 @@ const StoryWithoutOverlay = () => {
     return (
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
-            <Sheet opened={opened} withOverlay={false} onClose={() => setOpened(false)}>
+            <Sheet isOpen={opened} withOverlay={false} onClose={() => setOpened(false)}>
                 <StyledBody>
                     Lorem ipsum dolor sit amet consectetur adipisicing elit. Quae tempore vitae porro laboriosam
                     consectetur fugiat assumenda, earum nesciunt. Distinctio minima nesciunt dicta rem quae vel illum ea
@@ -125,7 +125,7 @@ const StoryWithScroll = ({
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
             <Sheet
-                opened={opened}
+                isOpen={opened}
                 withOverlay={withOverlay}
                 withTransition={withTransition}
                 onClose={() => setOpened(false)}
@@ -195,7 +195,7 @@ const StoryWithInsideScroll = ({
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
             <Sheet
-                opened={opened}
+                isOpen={opened}
                 withOverlay={withOverlay}
                 withTransition={withTransition}
                 onClose={() => setOpened(false)}
@@ -267,7 +267,7 @@ const StoryWithDoubleScroll = ({
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
             <Sheet
-                opened={opened}
+                isOpen={opened}
                 withOverlay={withOverlay}
                 withTransition={withTransition}
                 onClose={() => setOpened(false)}

package/styled-components/cjs/examples/plasma_web/components/Combobox/Combobox.stories.tsx

@@ -222,7 +222,7 @@ const StoryAddCustomItem = (args: StorySelectProps) => {
                 view={view}
                 disabled={disabled}
                 readOnly={readOnly}
-                opened={opened}
+                isOpen={opened}
                 onToggle={onToggle}
                 onChangeValue={onChangeValue}
                 onKeyDown={onKeyDown}

package/styled-components/cjs/examples/plasma_web/components/Sheet/Sheet.stories.tsx

@@ -49,7 +49,7 @@ const StoryDefault = ({
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
             <Sheet
-                opened={opened}
+                isOpen={opened}
                 withOverlay={withOverlay}
                 withTransition={withTransition}
                 onClose={() => setOpened(false)}
@@ -92,7 +92,7 @@ const StoryWithoutOverlay = () => {
     return (
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
-            <Sheet opened={opened} withOverlay={false} onClose={() => setOpened(false)}>
+            <Sheet isOpen={opened} withOverlay={false} onClose={() => setOpened(false)}>
                 <StyledBody>
                     Lorem ipsum dolor sit amet consectetur adipisicing elit. Quae tempore vitae porro laboriosam
                     consectetur fugiat assumenda, earum nesciunt. Distinctio minima nesciunt dicta rem quae vel illum ea
@@ -125,7 +125,7 @@ const StoryWithScroll = ({
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
             <Sheet
-                opened={opened}
+                isOpen={opened}
                 withOverlay={withOverlay}
                 withTransition={withTransition}
                 onClose={() => setOpened(false)}
@@ -195,7 +195,7 @@ const StoryWithInsideScroll = ({
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
             <Sheet
-                opened={opened}
+                isOpen={opened}
                 withOverlay={withOverlay}
                 withTransition={withTransition}
                 onClose={() => setOpened(false)}
@@ -267,7 +267,7 @@ const StoryWithDoubleScroll = ({
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
             <Sheet
-                opened={opened}
+                isOpen={opened}
                 withOverlay={withOverlay}
                 withTransition={withTransition}
                 onClose={() => setOpened(false)}

package/styled-components/es/components/Combobox/Combobox.js

@@ -1,4 +1,4 @@
-var _excluded = ["name", "form", "readOnly", "disabled", "label", "placeholder", "id", "children", "role", "view", "size", "frame", "usePortal", "negativeResultContent", "enumerationType", "opened", "placement", "onToggle", "onKeyDown", "filterFunction"];
+var _excluded = ["name", "form", "readOnly", "disabled", "label", "placeholder", "id", "children", "role", "view", "size", "frame", "usePortal", "negativeResultContent", "enumerationType", "opened", "isOpen", "placement", "onToggle", "onKeyDown", "filterFunction"];
 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); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -43,12 +43,15 @@ export var comboboxRoot = function comboboxRoot(Root) {
       enumerationType = _ref$enumerationType === void 0 ? 'comma' : _ref$enumerationType,
       _ref$opened = _ref.opened,
       opened = _ref$opened === void 0 ? false : _ref$opened,
+      _ref$isOpen = _ref.isOpen,
+      isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
       _ref$placement = _ref.placement,
       placement = _ref$placement === void 0 ? 'bottom' : _ref$placement,
       onToggle = _ref.onToggle,
       onKeyDown = _ref.onKeyDown,
       filterFunction = _ref.filterFunction,
       rest = _objectWithoutProperties(_ref, _excluded);
+    var innerIsOpen = opened || isOpen;
     var forceUpdate = useForceUpdate();
     var uniqId = safeUseId();
     var innerId = id || uniqId;
@@ -73,10 +76,10 @@ export var comboboxRoot = function comboboxRoot(Root) {
       itemsRefs: itemsRefs,
       inputRef: inputRef
     };
-    var _useState3 = useState(opened),
+    var _useState3 = useState(innerIsOpen),
       _useState4 = _slicedToArray(_useState3, 2),
-      innerOpened = _useState4[0],
-      setInnerOpened = _useState4[1];
+      isVisible = _useState4[0],
+      setIsVisible = _useState4[1];
     var _useState5 = useState(''),
       _useState6 = _slicedToArray(_useState5, 2),
       search = _useState6[0],
@@ -99,11 +102,11 @@ export var comboboxRoot = function comboboxRoot(Root) {
       if (disabled || readOnly) {
         return;
       }
-      setInnerOpened(opened);
-    }, [opened, disabled, readOnly]);
+      setIsVisible(innerIsOpen);
+    }, [innerIsOpen, disabled, readOnly]);
     useEffect(function () {
       // INFO: Для кейсов, когда значение выбрано и нужно вывести весь список
-      if (opened) {
+      if (innerIsOpen) {
         setFilterValue('');
       }
     }, []);
@@ -113,14 +116,14 @@ export var comboboxRoot = function comboboxRoot(Root) {
       }
 
       // INFO: Для кейсов, когда значение выбрано и нужно вывести весь список
-      if (!innerOpened) {
+      if (!isVisible) {
         setFilterValue('');
       }
       if (onToggle) {
         onToggle(openValue, event);
         return;
       }
-      setInnerOpened(openValue);
+      setIsVisible(openValue);
     };
     var closedWithoutChanges = useRef(true);
     var updateValue = function updateValue(item, event) {
@@ -152,7 +155,7 @@ export var comboboxRoot = function comboboxRoot(Root) {
     };
     var _useKeyNavigation = useKeyNavigation({
         controlledRefs: controlledRefs,
-        opened: innerOpened,
+        opened: isVisible,
         enumerationType: enumerationType,
         valueType: valueType,
         componentType: 'combobox',
@@ -172,7 +175,7 @@ export var comboboxRoot = function comboboxRoot(Root) {
     var onSearch = function onSearch(newSearch, newOpened) {
       setSearch(newSearch);
       setFilterValue(newSearch);
-      setInnerOpened(newOpened !== null && newOpened !== void 0 ? newOpened : true);
+      setIsVisible(newOpened !== null && newOpened !== void 0 ? newOpened : true);
     };
     var onKeyDownHandle = function onKeyDownHandle(event) {
       onKeyDown === null || onKeyDown === void 0 || onKeyDown(event);
@@ -191,10 +194,10 @@ export var comboboxRoot = function comboboxRoot(Root) {
       disabled: disabled || readOnly
     }), /*#__PURE__*/React.createElement(StyledPopover, {
       role: role,
-      isOpen: innerOpened,
+      isOpen: isVisible,
       onToggle: onInnerToggle,
       target: /*#__PURE__*/React.createElement(ComboboxTarget, _extends({
-        opened: innerOpened,
+        opened: isVisible,
         values: values,
         label: label,
         placeholder: placeholder,

package/styled-components/es/components/Select/Select.js

@@ -243,7 +243,7 @@ export var selectRoot = function selectRoot(Root) {
       onToggle: handleToggle,
       trigger: "click",
       target: /*#__PURE__*/React.createElement(Target, {
-        opened: isCurrentListOpen,
+        isOpen: isCurrentListOpen,
         target: target,
         value: value,
         isTargetAmount: isTargetAmount,

package/styled-components/es/components/Select/ui/Target/Target.js

@@ -5,7 +5,7 @@ export var Target = function Target(_ref) {
     multiselect = _ref.multiselect,
     isTargetAmount = _ref.isTargetAmount,
     target = _ref.target,
-    opened = _ref.opened,
+    isOpen = _ref.isOpen,
     valueToItemMap = _ref.valueToItemMap,
     onChipClick = _ref.onChipClick,
     label = _ref.label,
@@ -20,7 +20,7 @@ export var Target = function Target(_ref) {
     focusedPath = _ref.focusedPath,
     focusedToValueMap = _ref.focusedToValueMap;
   return target === 'button-like' ? /*#__PURE__*/React.createElement(Button, {
-    opened: opened,
+    isOpen: isOpen,
     value: value,
     isTargetAmount: isTargetAmount,
     multiselect: multiselect,
@@ -33,7 +33,7 @@ export var Target = function Target(_ref) {
     focusedPath: focusedPath,
     focusedToValueMap: focusedToValueMap
   }) : /*#__PURE__*/React.createElement(Textfield, {
-    opened: opened,
+    isOpen: isOpen,
     value: value,
     isTargetAmount: isTargetAmount,
     multiselect: multiselect,

package/styled-components/es/components/Select/ui/Target/ui/Button/Button.js

@@ -4,7 +4,7 @@ import { classes } from '../../../../Select.tokens';
 import { getButtonLabel, sizeToIconSize } from '../../../../utils';
 import { StyledButton, StyledArrow, Label, ButtonWrapper, IconArrowWrapper } from './Button.styles';
 export var Button = function Button(_ref) {
-  var opened = _ref.opened,
+  var isOpen = _ref.isOpen,
     value = _ref.value,
     isTargetAmount = _ref.isTargetAmount,
     multiselect = _ref.multiselect,
@@ -16,7 +16,7 @@ export var Button = function Button(_ref) {
     renderValue = _ref.renderValue,
     focusedPath = _ref.focusedPath,
     focusedToValueMap = _ref.focusedToValueMap;
-  var withArrowInverse = opened ? classes.arrowInverse : undefined;
+  var withArrowInverse = isOpen ? classes.arrowInverse : undefined;
   var getActiveDescendant = function getActiveDescendant() {
     var _focusedToValueMap$ge;
     var focusedPathAsString = focusedPath.reduce(function (acc, n) {
@@ -27,7 +27,7 @@ export var Button = function Button(_ref) {
   return /*#__PURE__*/React.createElement(ButtonWrapper, null, /*#__PURE__*/React.createElement(StyledButton, {
     stretching: "filled",
     onKeyDown: onKeyDown,
-    className: opened ? classes.selectWithoutBoxShadow : undefined,
+    className: isOpen ? classes.selectWithoutBoxShadow : undefined,
     disabled: disabled,
     contentRight: /*#__PURE__*/React.createElement(IconArrowWrapper, null, /*#__PURE__*/React.createElement(StyledArrow, {
       size: sizeToIconSize(size),
@@ -36,7 +36,7 @@ export var Button = function Button(_ref) {
     })),
     role: "combobox",
     "aria-controls": "tree_level_1",
-    "aria-expanded": opened,
+    "aria-expanded": isOpen,
     "aria-activedescendant": getActiveDescendant(),
     "aria-label": label
   }, /*#__PURE__*/React.createElement(Label, null, getButtonLabel({

package/styled-components/es/components/Select/ui/Target/ui/Textfield/Textfield.js

@@ -48,6 +48,7 @@ var getLabel = function getLabel(_ref) {
 };
 export var Textfield = function Textfield(_ref2) {
   var opened = _ref2.opened,
+    isOpen = _ref2.isOpen,
     value = _ref2.value,
     isTargetAmount = _ref2.isTargetAmount,
     multiselect = _ref2.multiselect,
@@ -64,7 +65,8 @@ export var Textfield = function Textfield(_ref2) {
     renderValue = _ref2.renderValue,
     focusedPath = _ref2.focusedPath,
     focusedToValueMap = _ref2.focusedToValueMap;
-  var withArrowInverse = opened ? classes.arrowInverse : undefined;
+  var innerIsOpen = opened || isOpen;
+  var withArrowInverse = innerIsOpen ? classes.arrowInverse : undefined;
   var getActiveDescendant = function getActiveDescendant() {
     var _focusedToValueMap$ge;
     var focusedPathAsString = focusedPath.reduce(function (acc, n) {
@@ -73,16 +75,16 @@ export var Textfield = function Textfield(_ref2) {
     return focusedToValueMap === null || focusedToValueMap === void 0 || (_focusedToValueMap$ge = focusedToValueMap.get(focusedPathAsString)) === null || _focusedToValueMap$ge === void 0 ? void 0 : _focusedToValueMap$ge.value.toString();
   };
   return /*#__PURE__*/React.createElement(TextfieldWrapper, {
-    opened: opened,
+    isOpen: innerIsOpen,
     value: value
   }, /*#__PURE__*/React.createElement(StyledButton, {
     stretching: "filled",
-    className: cx(classes.textfieldTarget, opened || focusedChipIndex !== null ? classes.selectWithoutBoxShadow : undefined),
+    className: cx(classes.textfieldTarget, innerIsOpen || focusedChipIndex !== null ? classes.selectWithoutBoxShadow : undefined),
     onKeyDown: onKeyDown,
     disabled: disabled,
     role: "combobox",
     "aria-controls": "tree_level_1",
-    "aria-expanded": opened,
+    "aria-expanded": innerIsOpen,
     "aria-activedescendant": getActiveDescendant(),
     "aria-label": label
   }, /*#__PURE__*/React.createElement(Wrapper, null, contentLeft && (!multiselect || isEmpty(value)) && /*#__PURE__*/React.createElement(ContentLeftWrapper, null, contentLeft), /*#__PURE__*/React.createElement(ChipWrapper, null, getLabel({

package/styled-components/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js

@@ -10,8 +10,8 @@ var Button = /*#__PURE__*/component(mergedButtonConfig);
 export var TextfieldWrapper = /*#__PURE__*/styled.div.withConfig({
   componentId: "plasma-new-hope__sc-1akl2tk-0"
 })(["display:inline;.", "{background:", ";padding:", ";}.", "::before{box-shadow:none !important;}"], classes.textfieldTarget, function (_ref) {
-  var opened = _ref.opened;
-  return opened ? "var(".concat(tokens.targetTextfieldBackgroundColorOpened, ")") : "var(".concat(tokens.targetTextfieldBackgroundColor, ")");
+  var isOpen = _ref.isOpen;
+  return isOpen ? "var(".concat(tokens.targetTextfieldBackgroundColorOpened, ")") : "var(".concat(tokens.targetTextfieldBackgroundColor, ")");
 }, function (_ref2) {
   var value = _ref2.value;
   return Array.isArray(value) && !isEmpty(value) ? "0 var(".concat(tokens.targetTextfieldChipPadding, ")") : "0 var(".concat(tokens.targetTextfieldPadding, ")");

package/styled-components/es/components/Sheet/Sheet.js

@@ -1,4 +1,4 @@
-var _excluded = ["opened", "children", "onClose", "hasHandle", "contentHeader", "isHeaderFixed", "contentFooter", "isFooterFixed", "withOverlay", "withBlur", "withTransition", "throttleMs", "className", "view"];
+var _excluded = ["opened", "isOpen", "children", "onClose", "hasHandle", "contentHeader", "isHeaderFixed", "contentFooter", "isFooterFixed", "withOverlay", "withBlur", "withTransition", "throttleMs", "className", "view"];
 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); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 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; }
@@ -18,6 +18,7 @@ import { DEFAULT_Z_INDEX } from './utils';
 export var sheetRoot = function sheetRoot(Root) {
   return /*#__PURE__*/forwardRef(function (_ref, rootRef) {
     var opened = _ref.opened,
+      isOpen = _ref.isOpen,
       children = _ref.children,
       onClose = _ref.onClose,
       _ref$hasHandle = _ref.hasHandle,
@@ -38,11 +39,12 @@ export var sheetRoot = function sheetRoot(Root) {
       className = _ref.className,
       view = _ref.view,
       restProps = _objectWithoutProperties(_ref, _excluded);
+    var innerIsOpen = opened || isOpen;
     var contentWrapperRef = useRef(null);
     var contentRef = useRef(null);
     var handleRef = useRef(null);
     useOverflow({
-      opened: opened
+      isOpen: innerIsOpen
     });
     useSheetSwipe({
       contentWrapperRef: contentWrapperRef,
@@ -53,15 +55,15 @@ export var sheetRoot = function sheetRoot(Root) {
     });
     var hasHeader = Boolean(contentHeader);
     var hasFooter = Boolean(contentFooter);
-    var closedClass = opened ? undefined : "".concat(classes.closed);
+    var closedClass = innerIsOpen ? undefined : "".concat(classes.closed);
     var overlayBackgroundToken = withBlur ? "var(".concat(tokens.sheetOverlayWithBlurColor, ")") : "var(".concat(tokens.sheetOverlayColor, ")");
     return /*#__PURE__*/React.createElement(Root, {
-      opened: opened,
+      isOpen: innerIsOpen,
       onClose: onClose,
       view: view,
       ref: rootRef
     }, /*#__PURE__*/React.createElement(StyledContentWrapper, _extends({
-      opened: opened,
+      isOpen: innerIsOpen,
       withTransition: withTransition,
       className: cx(closedClass, className),
       ref: contentWrapperRef
@@ -75,7 +77,7 @@ export var sheetRoot = function sheetRoot(Root) {
       isHeaderFixed: isHeaderFixed
     }, contentHeader), /*#__PURE__*/React.createElement(StyledSheetBody, null, children), hasFooter && /*#__PURE__*/React.createElement(StyledSheetFooter, {
       isFooterFixed: isFooterFixed
-    }, contentFooter))), withOverlay && opened && /*#__PURE__*/React.createElement(Overlay, {
+    }, contentFooter))), withOverlay && innerIsOpen && /*#__PURE__*/React.createElement(Overlay, {
       zIndex: DEFAULT_Z_INDEX,
       backgroundColorProperty: overlayBackgroundToken,
       withBlur: withBlur,

package/styled-components/es/components/Sheet/Sheet.template-doc.mdx

@@ -26,7 +26,7 @@ export function App() {
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
 
-            <Sheet opened={opened}
+            <Sheet isOpen={opened}
                 onClose={() => setOpened(false)}
                 contentHeader={
                     <div>
@@ -50,7 +50,7 @@ export function App() {
 
 ### Закрепление заголовка и футера
 
-С помощью свойств `isHeaderFixed` и `isFooterFixed` можно закрепить заголовок и футер. 
+С помощью свойств `isHeaderFixed` и `isFooterFixed` можно закрепить заголовок и футер.
 В этом случае при появлении прокрутки контент будет скроллиться под них.
 
 ```tsx live
@@ -64,7 +64,7 @@ export function App() {
     return (
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
-            <Sheet opened={opened}
+            <Sheet isOpen={opened}
                 onClose={() => setOpened(false)}
                 contentHeader={
                     <div>
@@ -105,7 +105,7 @@ export function App() {
             <Button onClick={() => setOpened(!opened)}>
                 {opened ? 'Закрыть' : 'Открыть'}
             </Button>
-            <Sheet opened={opened}
+            <Sheet isOpen={opened}
                 onClose={() => setOpened(false)}
                 withOverlay={false}
             >
@@ -131,7 +131,7 @@ export function App() {
             <Button onClick={() => setOpened(!opened)}>
                 {opened ? 'Закрыть' : 'Открыть'}
             </Button>
-            <Sheet opened={opened}
+            <Sheet isOpen={opened}
                 onClose={() => setOpened(false)}
                 withBlur
             >
@@ -140,4 +140,4 @@ export function App() {
         </>
     );
 }
-```
+```

package/styled-components/es/components/Sheet/hooks/useOverflow.js

@@ -1,15 +1,15 @@
 import { useEffect, useRef } from 'react';
 export var useOverflow = function useOverflow(_ref) {
-  var opened = _ref.opened;
+  var isOpen = _ref.isOpen;
   var overflow = useRef(document.body.style.overflowY);
 
   // linaria не поддерживает динамический global
   useEffect(function () {
-    if (opened) {
+    if (isOpen) {
       overflow.current = document.body.style.overflowY;
       document.body.style.overflowY = 'hidden';
       return;
     }
     document.body.style.overflowY = overflow.current;
-  }, [opened]);
+  }, [isOpen]);
 };

package/styled-components/es/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx

@@ -222,7 +222,7 @@ const StoryAddCustomItem = (args: StorySelectProps) => {
                 view={view}
                 disabled={disabled}
                 readOnly={readOnly}
-                opened={opened}
+                isOpen={opened}
                 onToggle={onToggle}
                 onChangeValue={onChangeValue}
                 onKeyDown={onKeyDown}

package/styled-components/es/examples/plasma_b2c/components/Sheet/Sheet.stories.tsx

@@ -49,7 +49,7 @@ const StoryDefault = ({
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
             <Sheet
-                opened={opened}
+                isOpen={opened}
                 withOverlay={withOverlay}
                 withTransition={withTransition}
                 onClose={() => setOpened(false)}
@@ -92,7 +92,7 @@ const StoryWithoutOverlay = () => {
     return (
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
-            <Sheet opened={opened} withOverlay={false} onClose={() => setOpened(false)}>
+            <Sheet isOpen={opened} withOverlay={false} onClose={() => setOpened(false)}>
                 <StyledBody>
                     Lorem ipsum dolor sit amet consectetur adipisicing elit. Quae tempore vitae porro laboriosam
                     consectetur fugiat assumenda, earum nesciunt. Distinctio minima nesciunt dicta rem quae vel illum ea
@@ -125,7 +125,7 @@ const StoryWithScroll = ({
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
             <Sheet
-                opened={opened}
+                isOpen={opened}
                 withOverlay={withOverlay}
                 withTransition={withTransition}
                 onClose={() => setOpened(false)}
@@ -195,7 +195,7 @@ const StoryWithInsideScroll = ({
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
             <Sheet
-                opened={opened}
+                isOpen={opened}
                 withOverlay={withOverlay}
                 withTransition={withTransition}
                 onClose={() => setOpened(false)}
@@ -267,7 +267,7 @@ const StoryWithDoubleScroll = ({
         <>
             <Button onClick={() => setOpened(true)}>Открыть</Button>
             <Sheet
-                opened={opened}
+                isOpen={opened}
                 withOverlay={withOverlay}
                 withTransition={withTransition}
                 onClose={() => setOpened(false)}