@salutejs/plasma-new-hope 0.337.0-canary.2250.17939562431.0 → 0.337.0-canary.2253.17999209101.0

package/es/utils/scopeTab.js

@@ -5,7 +5,7 @@ import { findTabbableDescendants } from './tabbable.js';
  * @param node
  * @param event
  */
-var scopeTab = function scopeTab(node, event) {
+var scopeTab = function scopeTab(node, event, activeFocusTrap) {
   var tabbable = findTabbableDescendants(node);
   if (!tabbable.length) {
     event.preventDefault();
@@ -17,7 +17,7 @@ var scopeTab = function scopeTab(node, event) {
   var leavingFinalTabbable = finalTabbable === document.activeElement || node === document.activeElement;
 
   // если не является, то передаем обработку таба самому браузеру
-  if (!leavingFinalTabbable) {
+  if (!leavingFinalTabbable || !activeFocusTrap) {
     return;
   }
 

package/es/utils/scopeTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"scopeTab.js","sources":["../../src/utils/scopeTab.ts"],"sourcesContent":["import { findTabbableDescendants } from './tabbable';\n\n/**\n * Управлление фокусом лишь внутри ноды через tab\n * @param node\n * @param event\n */\nexport const scopeTab = (node: HTMLElement, event: KeyboardEvent) => {\n    const tabbable = findTabbableDescendants(node);\n    if (!tabbable.length) {\n        event.preventDefault();\n        return;\n    }\n\n    // смотрим, является ли элемент крайним - первый или последним\n    const finalTabbable = tabbable[event.shiftKey ? 0 : tabbable.length - 1];\n    const leavingFinalTabbable = finalTabbable === document.activeElement || node === document.activeElement;\n\n    // если не является, то передаем обработку таба самому браузеру\n    if (!leavingFinalTabbable) {\n        return;\n    }\n\n    // иначе зацкливаемся\n    event.preventDefault();\n    const target = tabbable[event.shiftKey ? tabbable.length - 1 : 0];\n    if (target) {\n        target.focus();\n    }\n};\n"],"names":["scopeTab","node","event","tabbable","findTabbableDescendants","length","preventDefault","finalTabbable","shiftKey","leavingFinalTabbable","document","activeElement","target","focus"],"mappings":";;AAEA;AACA;AACA;AACA;AACA;AACO,IAAMA,QAAQ,GAAG,SAAXA,QAAQA,CAAIC,IAAiB,EAAEC,KAAoB,EAAK;AACjE,EAAA,IAAMC,QAAQ,GAAGC,uBAAuB,CAACH,IAAI,CAAC,CAAA;AAC9C,EAAA,IAAI,CAACE,QAAQ,CAACE,MAAM,EAAE;IAClBH,KAAK,CAACI,cAAc,EAAE,CAAA;AACtB,IAAA,OAAA;AACJ,GAAA;;AAEA;AACA,EAAA,IAAMC,aAAa,GAAGJ,QAAQ,CAACD,KAAK,CAACM,QAAQ,GAAG,CAAC,GAAGL,QAAQ,CAACE,MAAM,GAAG,CAAC,CAAC,CAAA;AACxE,EAAA,IAAMI,oBAAoB,GAAGF,aAAa,KAAKG,QAAQ,CAACC,aAAa,IAAIV,IAAI,KAAKS,QAAQ,CAACC,aAAa,CAAA;;AAExG;EACA,IAAI,CAACF,oBAAoB,EAAE;AACvB,IAAA,OAAA;AACJ,GAAA;;AAEA;EACAP,KAAK,CAACI,cAAc,EAAE,CAAA;AACtB,EAAA,IAAMM,MAAM,GAAGT,QAAQ,CAACD,KAAK,CAACM,QAAQ,GAAGL,QAAQ,CAACE,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC,CAAA;AACjE,EAAA,IAAIO,MAAM,EAAE;IACRA,MAAM,CAACC,KAAK,EAAE,CAAA;AAClB,GAAA;AACJ;;;;"}
+{"version":3,"file":"scopeTab.js","sources":["../../src/utils/scopeTab.ts"],"sourcesContent":["import { findTabbableDescendants } from './tabbable';\n\n/**\n * Управлление фокусом лишь внутри ноды через tab\n * @param node\n * @param event\n */\nexport const scopeTab = (node: HTMLElement, event: KeyboardEvent, activeFocusTrap?: boolean) => {\n    const tabbable = findTabbableDescendants(node);\n    if (!tabbable.length) {\n        event.preventDefault();\n        return;\n    }\n\n    // смотрим, является ли элемент крайним - первый или последним\n    const finalTabbable = tabbable[event.shiftKey ? 0 : tabbable.length - 1];\n    const leavingFinalTabbable = finalTabbable === document.activeElement || node === document.activeElement;\n\n    // если не является, то передаем обработку таба самому браузеру\n    if (!leavingFinalTabbable || !activeFocusTrap) {\n        return;\n    }\n\n    // иначе зацкливаемся\n    event.preventDefault();\n    const target = tabbable[event.shiftKey ? tabbable.length - 1 : 0];\n    if (target) {\n        target.focus();\n    }\n};\n"],"names":["scopeTab","node","event","activeFocusTrap","tabbable","findTabbableDescendants","length","preventDefault","finalTabbable","shiftKey","leavingFinalTabbable","document","activeElement","target","focus"],"mappings":";;AAEA;AACA;AACA;AACA;AACA;AACO,IAAMA,QAAQ,GAAG,SAAXA,QAAQA,CAAIC,IAAiB,EAAEC,KAAoB,EAAEC,eAAyB,EAAK;AAC5F,EAAA,IAAMC,QAAQ,GAAGC,uBAAuB,CAACJ,IAAI,CAAC,CAAA;AAC9C,EAAA,IAAI,CAACG,QAAQ,CAACE,MAAM,EAAE;IAClBJ,KAAK,CAACK,cAAc,EAAE,CAAA;AACtB,IAAA,OAAA;AACJ,GAAA;;AAEA;AACA,EAAA,IAAMC,aAAa,GAAGJ,QAAQ,CAACF,KAAK,CAACO,QAAQ,GAAG,CAAC,GAAGL,QAAQ,CAACE,MAAM,GAAG,CAAC,CAAC,CAAA;AACxE,EAAA,IAAMI,oBAAoB,GAAGF,aAAa,KAAKG,QAAQ,CAACC,aAAa,IAAIX,IAAI,KAAKU,QAAQ,CAACC,aAAa,CAAA;;AAExG;AACA,EAAA,IAAI,CAACF,oBAAoB,IAAI,CAACP,eAAe,EAAE;AAC3C,IAAA,OAAA;AACJ,GAAA;;AAEA;EACAD,KAAK,CAACK,cAAc,EAAE,CAAA;AACtB,EAAA,IAAMM,MAAM,GAAGT,QAAQ,CAACF,KAAK,CAACO,QAAQ,GAAGL,QAAQ,CAACE,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC,CAAA;AACjE,EAAA,IAAIO,MAAM,EAAE;IACRA,MAAM,CAACC,KAAK,EAAE,CAAA;AAClB,GAAA;AACJ;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salutejs/plasma-new-hope",
-  "version": "0.337.0-canary.2250.17939562431.0",
+  "version": "0.337.0-canary.2253.17999209101.0",
   "description": "Salute Design System blueprint",
   "main": "cjs/index.js",
   "module": "es/index.js",
@@ -137,5 +137,5 @@
   "sideEffects": [
     "*.css"
   ],
-  "gitHead": "1903d7531f4193da486df1b8e92490cb1464ebd0"
+  "gitHead": "982bd027e3a864c998f36352eb4563b4ad17d469"
 }

package/styled-components/cjs/components/Dropdown/ui/DropdownInner/DropdownInner.js

@@ -101,7 +101,7 @@ var DropdownInner = function(param) {
             id: listId,
             role: "group",
             listMaxHeight: item.listMaxHeight
-        }, item.beforeList, item.items.map(function(innerItem, innerIndex) {
+        }, item.items.map(function(innerItem, innerIndex) {
             return /*#__PURE__*/ _react.default.createElement(DropdownInner, {
                 key: "".concat(innerIndex, "/").concat(currentLevel),
                 item: innerItem,

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

@@ -130,7 +130,7 @@ function _object_without_properties_loose(source, excluded) {
 var Popup = (0, _engines.component)(_Popup.popupConfig);
 var modalRoot = function(Root) {
     return /*#__PURE__*/ (0, _react.forwardRef)(function(_param, outerRootRef) {
-        var id = _param.id, withAnimation = _param.withAnimation, onClose = _param.onClose, onOverlayClick = _param.onOverlayClick, onEscKeyDown = _param.onEscKeyDown, _param_closeOnEsc = _param.closeOnEsc, closeOnEsc = _param_closeOnEsc === void 0 ? true : _param_closeOnEsc, _param_closeOnOverlayClick = _param.closeOnOverlayClick, closeOnOverlayClick = _param_closeOnOverlayClick === void 0 ? true : _param_closeOnOverlayClick, withBlur = _param.withBlur, initialFocusRef = _param.initialFocusRef, focusAfterRef = _param.focusAfterRef, zIndex = _param.zIndex, popupInfo = _param.popupInfo, children = _param.children, view = _param.view, opened = _param.opened, isOpen = _param.isOpen, hasBody = _param.hasBody, hasClose = _param.hasClose, resizable = _param.resizable, draggable = _param.draggable, rest = _object_without_properties(_param, [
+        var id = _param.id, withAnimation = _param.withAnimation, onClose = _param.onClose, onOverlayClick = _param.onOverlayClick, onEscKeyDown = _param.onEscKeyDown, _param_closeOnEsc = _param.closeOnEsc, closeOnEsc = _param_closeOnEsc === void 0 ? true : _param_closeOnEsc, _param_closeOnOverlayClick = _param.closeOnOverlayClick, closeOnOverlayClick = _param_closeOnOverlayClick === void 0 ? true : _param_closeOnOverlayClick, withBlur = _param.withBlur, _param_isFocusTrapped = _param.isFocusTrapped, isFocusTrapped = _param_isFocusTrapped === void 0 ? true : _param_isFocusTrapped, initialFocusRef = _param.initialFocusRef, focusAfterRef = _param.focusAfterRef, zIndex = _param.zIndex, popupInfo = _param.popupInfo, children = _param.children, view = _param.view, opened = _param.opened, isOpen = _param.isOpen, hasBody = _param.hasBody, hasClose = _param.hasClose, resizable = _param.resizable, draggable = _param.draggable, rest = _object_without_properties(_param, [
             "id",
             "withAnimation",
             "onClose",
@@ -139,6 +139,7 @@ var modalRoot = function(Root) {
             "closeOnEsc",
             "closeOnOverlayClick",
             "withBlur",
+            "isFocusTrapped",
             "initialFocusRef",
             "focusAfterRef",
             "zIndex",
@@ -154,7 +155,7 @@ var modalRoot = function(Root) {
         ]);
         var innerIsOpen = Boolean(isOpen || opened);
         var innerHasClose = hasClose === undefined && hasBody || hasClose;
-        var trapRef = (0, _hooks.useFocusTrap)(true, initialFocusRef, focusAfterRef, true);
+        var trapRef = (0, _hooks.useFocusTrap)(isFocusTrapped, initialFocusRef, focusAfterRef, true, !isFocusTrapped);
         var popupController = (0, _Popup.usePopupContext)();
         var innerRef = (0, _plasmacore.useForkRef)(trapRef, outerRootRef);
         var uniqId = (0, _utils.safeUseId)();

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

@@ -219,7 +219,7 @@ var noteRoot = function(Root) {
         var contentWidthWithOffsetToken = contentBefore ? "calc(100% - ".concat(contentBeforeWidth, " - var(").concat(contentGapToken, "))") : '100%';
         var setTruncatedText = function() {
             var _titleHelperRef_current;
-            if (!_utils.canUseDOM || !text || !(contentWrapperRef === null || contentWrapperRef === void 0 ? void 0 : contentWrapperRef.current) || !(textRenderHelperRef === null || textRenderHelperRef === void 0 ? void 0 : textRenderHelperRef.current) || !width && !height) {
+            if (!_utils.canUseDOM || !text || typeof text !== 'string' || !(contentWrapperRef === null || contentWrapperRef === void 0 ? void 0 : contentWrapperRef.current) || !(textRenderHelperRef === null || textRenderHelperRef === void 0 ? void 0 : textRenderHelperRef.current) || !width && !height) {
                 return;
             }
             var contentHeight = contentWrapperRef.current.offsetHeight;

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

@@ -46,5 +46,5 @@ var base = (0, _styledcomponents.css)([
     ");font-weight:var(",
     ");letter-spacing:var(",
     ");line-height:var(",
-    ");word-break:break-all;}"
+    ");overflow-wrap:break-word;}"
 ], _Notetokens.tokens.padding, _Notetokens.tokens.borderRadius, _Notetokens.privateTokens.height, _Notetokens.privateTokens.width, _Notetokens.tokens.gap, _Notetokens.classes.stretch, _Notestyles.ContentBefore, _Notetokens.tokens.fixedContentBeforeWidth, _Notetokens.tokens.fixedContentBeforeHeight, _Notetokens.tokens.fixedContentBeforePadding, _Notetokens.classes.contentAlignCenter, _Notetokens.tokens.paddingScalable, _Notetokens.tokens.gapScalable, _Notestyles.ContentBefore, _Notestyles.ContentWrapper, _Notetokens.privateTokens.contentWidthWithOffset, _Notetokens.tokens.contentGap, _Notestyles.Title, _Notestyles.TitleHelper, _Notetokens.tokens.titleLineHeight, _Notetokens.tokens.titleFontFamily, _Notetokens.tokens.titleFontSize, _Notetokens.tokens.titleFontStyle, _Notetokens.tokens.titleFontWeight, _Notetokens.tokens.titleLetterSpacing, _Notetokens.tokens.titleLineHeight, _Notestyles.Text, _Notestyles.TextHelper, _Notetokens.tokens.textFontFamily, _Notetokens.tokens.textFontSize, _Notetokens.tokens.textFontStyle, _Notetokens.tokens.textFontWeight, _Notetokens.tokens.textLetterSpacing, _Notetokens.tokens.textLineHeight);

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

@@ -25,14 +25,16 @@ function _interop_require_default(obj) {
 }
 var TooltipRoot = _styledcomponents.default.div.withConfig({
     displayName: "Tooltip.styles__TooltipRoot",
-    componentId: "sc-e6446bfb-0"
+    componentId: "sc-7a496a90-0"
 })([
-    "padding:var(",
+    "display:flex;align-items:center;padding:var(",
     ") var(",
     ") var(",
     ") var(",
     ");min-height:var(",
-    ");box-sizing:border-box;background-color:var(",
+    ");max-width:",
+    ";min-width:",
+    ";width:max-content;background-color:var(",
     ");border-radius:var(",
     ");box-shadow:var(",
     ");color:var(",
@@ -42,19 +44,17 @@ var TooltipRoot = _styledcomponents.default.div.withConfig({
     ");font-weight:var(",
     ");letter-spacing:var(",
     ");line-height:var(",
-    ");max-width:",
-    ";min-width:",
-    ";width:max-content;word-break:break-word;pointer-events:none;display:flex;align-items:center;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;"
-], _Tooltiptokens.tokens.paddingTop, _Tooltiptokens.tokens.paddingRight, _Tooltiptokens.tokens.paddingBottom, _Tooltiptokens.tokens.paddingLeft, _Tooltiptokens.tokens.minHeight, _Tooltiptokens.tokens.backgroundColor, _Tooltiptokens.tokens.borderRadius, _Tooltiptokens.tokens.boxShadow, _Tooltiptokens.tokens.color, _Tooltiptokens.tokens.textFontFamily, _Tooltiptokens.tokens.textFontSize, _Tooltiptokens.tokens.textFontStyle, _Tooltiptokens.tokens.textFontWeight, _Tooltiptokens.tokens.textFontLetterSpacing, _Tooltiptokens.tokens.textFontLineHeight, function(param) {
+    ");box-sizing:border-box;word-break:break-word;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;"
+], _Tooltiptokens.tokens.paddingTop, _Tooltiptokens.tokens.paddingRight, _Tooltiptokens.tokens.paddingBottom, _Tooltiptokens.tokens.paddingLeft, _Tooltiptokens.tokens.minHeight, function(param) {
     var maxWidth = param.maxWidth;
     return maxWidth || 'unset';
 }, function(param) {
     var minWidth = param.minWidth;
     return minWidth || 'unset';
-});
+}, _Tooltiptokens.tokens.backgroundColor, _Tooltiptokens.tokens.borderRadius, _Tooltiptokens.tokens.boxShadow, _Tooltiptokens.tokens.color, _Tooltiptokens.tokens.textFontFamily, _Tooltiptokens.tokens.textFontSize, _Tooltiptokens.tokens.textFontStyle, _Tooltiptokens.tokens.textFontWeight, _Tooltiptokens.tokens.textFontLetterSpacing, _Tooltiptokens.tokens.textFontLineHeight);
 var StyledContentLeft = _styledcomponents.default.div.withConfig({
     displayName: "Tooltip.styles__StyledContentLeft",
-    componentId: "sc-e6446bfb-1"
+    componentId: "sc-7a496a90-1"
 })([
     "display:flex;align-items:center;margin-right:var(",
     ");height:var(",

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

@@ -18,9 +18,9 @@ _export(exports, {
 });
 var _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 var _rctree = /*#__PURE__*/ _interop_require_default(require("rc-tree"));
-var _utils = require("../../utils");
+var _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
 var _Treestyles = require("./Tree.styles");
-var _utils1 = require("./utils");
+var _utils = require("./utils");
 var _Treetokens = require("./Tree.tokens");
 function _array_like_to_array(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
@@ -168,7 +168,7 @@ function _unsupported_iterable_to_array(o, minLen) {
 }
 var treeRoot = function(Root) {
     return /*#__PURE__*/ (0, _react.forwardRef)(function(param, ref) {
-        var items = param.items, _param_arrowPlacement = param.arrowPlacement, arrowPlacement = _param_arrowPlacement === void 0 ? 'left' : _param_arrowPlacement, _param_virtual = param.virtual, virtual = _param_virtual === void 0 ? true : _param_virtual, height = param.height, itemHeight = param.itemHeight, size = param.size, view = param.view, _param_fullWidthItemSelection = param.fullWidthItemSelection, fullWidthItemSelection = _param_fullWidthItemSelection === void 0 ? false : _param_fullWidthItemSelection, _param_multiple = param.multiple, multiple = _param_multiple === void 0 ? false : _param_multiple, _param_defaultExpandAll = param.defaultExpandAll, defaultExpandAll = _param_defaultExpandAll === void 0 ? false : _param_defaultExpandAll, _param_autoExpandParent = param.autoExpandParent, autoExpandParent = _param_autoExpandParent === void 0 ? false : _param_autoExpandParent, _param_checkable = param.checkable, checkable = _param_checkable === void 0 ? false : _param_checkable, outerSelectedKeys = param.selectedKeys, checkedKeys = param.checkedKeys, expandedKeys = param.expandedKeys, defaultCheckedKeys = param.defaultCheckedKeys, defaultExpandedKeys = param.defaultExpandedKeys, defaultSelectedKeys = param.defaultSelectedKeys, className = param.className, onTreeSelect = param.onTreeSelect, onTreeCheck = param.onTreeCheck, onTreeExpand = param.onTreeExpand, _param_hasIcon = param.hasIcon, hasIcon = _param_hasIcon === void 0 ? false : _param_hasIcon, icon = param.icon, renderTitle = param.renderTitle, _param_mode = param.mode, mode = _param_mode === void 0 ? 'default' : _param_mode, _param_draggable = param.draggable, draggable = _param_draggable === void 0 ? false : _param_draggable, onDragStart = param.onDragStart, onDragEnter = param.onDragEnter, onDragOver = param.onDragOver, onDragLeave = param.onDragLeave, onDragEnd = param.onDragEnd, onDrop = param.onDrop, allowDrop = param.allowDrop;
+        var items = param.items, _param_arrowPlacement = param.arrowPlacement, arrowPlacement = _param_arrowPlacement === void 0 ? 'left' : _param_arrowPlacement, _param_virtual = param.virtual, virtual = _param_virtual === void 0 ? true : _param_virtual, height = param.height, itemHeight = param.itemHeight, size = param.size, view = param.view, variant = param.variant, _param_fullWidthItemSelection = param.fullWidthItemSelection, fullWidthItemSelection = _param_fullWidthItemSelection === void 0 ? false : _param_fullWidthItemSelection, _param_multiple = param.multiple, multiple = _param_multiple === void 0 ? false : _param_multiple, _param_defaultExpandAll = param.defaultExpandAll, defaultExpandAll = _param_defaultExpandAll === void 0 ? false : _param_defaultExpandAll, _param_autoExpandParent = param.autoExpandParent, autoExpandParent = _param_autoExpandParent === void 0 ? false : _param_autoExpandParent, _param_checkable = param.checkable, checkable = _param_checkable === void 0 ? false : _param_checkable, outerSelectedKeys = param.selectedKeys, checkedKeys = param.checkedKeys, expandedKeys = param.expandedKeys, defaultCheckedKeys = param.defaultCheckedKeys, defaultExpandedKeys = param.defaultExpandedKeys, defaultSelectedKeys = param.defaultSelectedKeys, className = param.className, onTreeSelect = param.onTreeSelect, onTreeCheck = param.onTreeCheck, onTreeExpand = param.onTreeExpand, _param_hasIcon = param.hasIcon, hasIcon = _param_hasIcon === void 0 ? false : _param_hasIcon, icon = param.icon, renderTitle = param.renderTitle, _param_singleLine = param.singleLine, singleLine = _param_singleLine === void 0 ? true : _param_singleLine, _param_mode = param.mode, mode = _param_mode === void 0 ? 'default' : _param_mode, _param_draggable = param.draggable, draggable = _param_draggable === void 0 ? false : _param_draggable, onDragStart = param.onDragStart, onDragEnter = param.onDragEnter, onDragOver = param.onDragOver, onDragLeave = param.onDragLeave, onDragEnd = param.onDragEnd, onDrop = param.onDrop, allowDrop = param.allowDrop;
         var _useState = _sliced_to_array((0, _react.useState)(defaultSelectedKeys || []), 2), selected = _useState[0], setSelected = _useState[1];
         var selectedKeys = outerSelectedKeys !== null && outerSelectedKeys !== void 0 ? outerSelectedKeys : selected;
         var isRadioMode = mode === 'radio' && !multiple;
@@ -184,10 +184,11 @@ var treeRoot = function(Root) {
         var invertedClass = arrowPlacement === 'right' ? _Treetokens.classes.treeInverted : undefined;
         var itemFilledClass = fullWidthItemSelection ? _Treetokens.classes.treeItemFilled : undefined;
         var radioModeClass = isRadioMode ? _Treetokens.classes.treeRadioMode : undefined;
+        var tightVariantClass = variant === 'tight' ? _Treetokens.classes.treeTightVariant : undefined;
         // Проходимся по дереву и устанавливаем соответствующие классы для узлов дерева,
         // чтобы соблюсти иерархию вложенности в UI.
         var treeData = (0, _react.useMemo)(function() {
-            return (0, _utils1.traverseTree)(items, selectedKeys);
+            return (0, _utils.traverseTree)(items, selectedKeys);
         }, [
             items,
             selectedKeys
@@ -195,6 +196,7 @@ var treeRoot = function(Root) {
         return /*#__PURE__*/ _react.default.createElement(Root, {
             view: view,
             size: size,
+            variant: variant,
             ref: ref,
             items: items
         }, /*#__PURE__*/ _react.default.createElement(_rctree.default, _object_spread_props(_object_spread({
@@ -203,7 +205,7 @@ var treeRoot = function(Root) {
             virtual: virtual,
             multiple: multiple,
             checkable: checkable,
-            className: (0, _utils.cx)(className, invertedClass, itemFilledClass, radioModeClass),
+            className: (0, _classnames.default)(className, invertedClass, itemFilledClass, radioModeClass, tightVariantClass),
             defaultExpandAll: defaultExpandAll,
             autoExpandParent: autoExpandParent,
             style: {
@@ -227,20 +229,23 @@ var treeRoot = function(Root) {
                     return null;
                 }
                 return /*#__PURE__*/ _react.default.createElement(_Treestyles.IconArrowWrapper, null, /*#__PURE__*/ _react.default.createElement(_Treestyles.StyledArrow, {
-                    size: (0, _utils1.sizeToIconSize)(size),
+                    size: (0, _utils.sizeToIconSize)(size),
                     color: "inherit",
                     className: "arrow"
                 }));
             },
             icon: hasIcon && (icon || /*#__PURE__*/ _react.default.createElement(_Treestyles.StyledFolder, {
-                size: (0, _utils1.sizeToIconSize)(size),
+                size: (0, _utils.sizeToIconSize)(size),
                 color: "inherit"
             })),
             titleRender: function(item) {
                 return /*#__PURE__*/ _react.default.createElement(_Treestyles.TitleWrapper, {
                     fullWidthItemSelection: fullWidthItemSelection,
-                    arrowPlacement: arrowPlacement
-                }, /*#__PURE__*/ _react.default.createElement(_Treestyles.Title, null, renderTitle ? renderTitle(item) : typeof item.title === 'function' ? item.title(item) : item.title), item.contentRight && /*#__PURE__*/ _react.default.createElement(_Treestyles.ContentRight, null, item.contentRight));
+                    arrowPlacement: arrowPlacement,
+                    singleLine: singleLine
+                }, /*#__PURE__*/ _react.default.createElement(_Treestyles.Title, {
+                    singleLine: singleLine
+                }, renderTitle ? renderTitle(item) : typeof item.title === 'function' ? item.title(item) : item.title), item.contentRight && /*#__PURE__*/ _react.default.createElement(_Treestyles.ContentRight, null, item.contentRight));
             },
             draggable: draggable,
             onDragStart: onDragStart,

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

@@ -35,7 +35,6 @@ _export(exports, {
     }
 });
 var _styledcomponents = /*#__PURE__*/ _interop_require_wildcard(require("styled-components"));
-var _mixins = require("../../mixins");
 var _Icon = require("../_Icon");
 var _Treetokens = require("./Tree.tokens");
 function _getRequireWildcardCache(nodeInterop) {
@@ -81,7 +80,7 @@ function _interop_require_wildcard(obj, nodeInterop) {
 }
 var IconArrowWrapper = _styledcomponents.default.div.withConfig({
     displayName: "Tree.styles__IconArrowWrapper",
-    componentId: "sc-8ac26406-0"
+    componentId: "sc-292dc6de-0"
 })([
     "line-height:0;color:var(",
     ");&:hover{color:var(",
@@ -90,44 +89,58 @@ var IconArrowWrapper = _styledcomponents.default.div.withConfig({
 ], _Treetokens.treeTokens.arrowColor, _Treetokens.treeTokens.arrowColorHover, _Treetokens.treeTokens.arrowColorActive);
 var StyledArrow = (0, _styledcomponents.default)(_Icon.IconDisclosureRightCentered).withConfig({
     displayName: "Tree.styles__StyledArrow",
-    componentId: "sc-8ac26406-1"
+    componentId: "sc-292dc6de-1"
 })([
     "transition:color 0.3s ease-in,transform 0.15s ease-in;pointer-events:none;user-select:none;"
 ]);
 var StyledFolder = (0, _styledcomponents.default)(_Icon.IconFolder).withConfig({
     displayName: "Tree.styles__StyledFolder",
-    componentId: "sc-8ac26406-2"
+    componentId: "sc-292dc6de-2"
 })([
     ""
 ]);
 var TitleWrapper = _styledcomponents.default.div.withConfig({
     displayName: "Tree.styles__TitleWrapper",
-    componentId: "sc-8ac26406-3"
+    componentId: "sc-292dc6de-3"
 })([
     "display:flex;align-items:center;justify-content:space-between;margin:",
-    ";",
+    ";overflow:",
     ";"
 ], function(param) {
     var arrowPlacement = param.arrowPlacement, fullWidthItemSelection = param.fullWidthItemSelection;
     return arrowPlacement === 'left' && !fullWidthItemSelection ? "var(".concat(_Treetokens.treeTokens.iconFolderMargin, ")") : 0;
-}, (0, _mixins.applyEllipsis)());
+}, function(param) {
+    var singleLine = param.singleLine;
+    return singleLine ? 'hidden' : 'visible';
+});
 var Title = _styledcomponents.default.span.withConfig({
     displayName: "Tree.styles__Title",
-    componentId: "sc-8ac26406-4"
+    componentId: "sc-292dc6de-4"
 })([
     "margin:var(",
-    ");",
+    ");overflow:",
+    ";text-overflow:",
+    ";white-space:",
     ";"
-], _Treetokens.treeTokens.iconFolderMargin, (0, _mixins.applyEllipsis)());
+], _Treetokens.treeTokens.iconFolderMargin, function(param) {
+    var singleLine = param.singleLine;
+    return singleLine ? 'hidden' : 'visible';
+}, function(param) {
+    var singleLine = param.singleLine;
+    return singleLine ? 'ellipsis' : 'unset';
+}, function(param) {
+    var singleLine = param.singleLine;
+    return singleLine ? 'nowrap' : 'normal';
+});
 var ContentRight = _styledcomponents.default.div.withConfig({
     displayName: "Tree.styles__ContentRight",
-    componentId: "sc-8ac26406-5"
+    componentId: "sc-292dc6de-5"
 })([
     "line-height:0;"
 ]);
 var Line = _styledcomponents.default.div.withConfig({
     displayName: "Tree.styles__Line",
-    componentId: "sc-8ac26406-6"
+    componentId: "sc-292dc6de-6"
 })([
     "left:",
     "px;right:0;position:absolute;z-index:1;height:0.125rem;background-color:var(",
@@ -137,20 +150,18 @@ var Line = _styledcomponents.default.div.withConfig({
     return left;
 }, _Treetokens.treeTokens.itemDraggableLineColor);
 var base = (0, _styledcomponents.css)([
-    ".rc-tree{margin:0;border:1px solid transparent;}.rc-tree-focused:not(.rc-tree-active-focused){border-color:cyan;}.rc-tree .rc-tree-treenode{margin:0;padding:0;line-height:24px;white-space:nowrap;list-style:none;outline:0;}.rc-tree .rc-tree-treenode .draggable{color:#333;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;user-select:none;}.rc-tree .rc-tree-treenode.dragging{opacity:0.28;}.rc-tree .rc-tree-treenode.drop-container::before,.rc-tree:not(:has(.drop-container)) .rc-tree-treenode.drop-target.",
+    ".rc-tree{margin:0;border:1px solid transparent;}.rc-tree-focused:not(.rc-tree-active-focused){border-color:cyan;}.rc-tree .rc-tree-treenode{display:flex;align-items:center;box-sizing:border-box;margin:0;padding:var(",
+    ");position:relative;z-index:0;width:100%;min-height:var(",
+    ");line-height:24px;white-space:nowrap;list-style:none;outline:0;}.rc-tree.",
+    " .rc-tree-treenode{padding:var(",
+    ");}.rc-tree .rc-tree-treenode .draggable{color:#333;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;user-select:none;}.rc-tree .rc-tree-treenode.dragging{opacity:0.28;}.rc-tree .rc-tree-treenode.drop-container::before,.rc-tree:not(:has(.drop-container)) .rc-tree-treenode.drop-target.",
     "::before,.rc-tree:not(:has(.drop-container)) .rc-tree-treenode.drop-target.drag-over::before{box-shadow:inset 0 0 0 1px var(",
-    ");}.rc-tree .rc-tree-treenode.filter-node > .rc-tree-node-content-wrapper{color:#a60000 !important;font-weight:bold !important;}.rc-tree .rc-tree-treenode ul{margin:0;padding:0 0 0 18px;}.rc-tree .rc-tree-treenode .rc-tree-node-content-wrapper{position:relative;display:inline-block;height:24px;margin:0;padding:0;text-decoration:none;vertical-align:top;cursor:pointer;color:var(",
-    ");}.rc-tree.",
+    ");}.rc-tree .rc-tree-treenode.filter-node > .rc-tree-node-content-wrapper{color:#a60000 !important;font-weight:bold !important;}.rc-tree .rc-tree-treenode ul{margin:0;padding:0 0 0 18px;}.rc-tree .rc-tree-treenode .rc-tree-node-content-wrapper{position:relative;margin:0;padding:0;text-decoration:none;vertical-align:top;cursor:pointer;color:var(",
+    ");display:flex;align-items:center;width:100%;}.rc-tree.",
     " .rc-tree-treenode.rc-tree-treenode-selected .rc-tree-node-content-wrapper{cursor:default;}.rc-tree .rc-tree-treenode.rc-tree-treenode-disabled .rc-tree-node-content-wrapper,.rc-tree .rc-tree-treenode.rc-tree-treenode-disabled span.rc-tree-switcher,.rc-tree .rc-tree-treenode.rc-tree-treenode-disabled span.rc-tree-checkbox,.rc-tree .rc-tree-treenode.rc-tree-treenode-disabled span.rc-tree-iconEle{cursor:default;}.rc-tree .rc-tree-treenode span.rc-tree-switcher,.rc-tree .rc-tree-treenode span.rc-tree-checkbox,.rc-tree .rc-tree-treenode span.rc-tree-iconEle{cursor:pointer;}.rc-tree .rc-tree-treenode span.rc-tree-switcher.rc-tree-icon__customize,.rc-tree .rc-tree-treenode span.rc-tree-checkbox.rc-tree-icon__customize,.rc-tree .rc-tree-treenode span.rc-tree-iconEle.rc-tree-icon__customize{background-image:none;}.rc-tree .rc-tree-treenode span.rc-tree-icon_loading{margin-right:2px;vertical-align:top;background:url('data:image/gif;base64,R0lGODlhEAAQAKIGAMLY8YSx5HOm4Mjc88/g9Ofw+v///wAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQFCgAGACwAAAAAEAAQAAADMGi6RbUwGjKIXCAA016PgRBElAVlG/RdLOO0X9nK61W39qvqiwz5Ls/rRqrggsdkAgAh+QQFCgAGACwCAAAABwAFAAADD2hqELAmiFBIYY4MAutdCQAh+QQFCgAGACwGAAAABwAFAAADD1hU1kaDOKMYCGAGEeYFCQAh+QQFCgAGACwKAAIABQAHAAADEFhUZjSkKdZqBQG0IELDQAIAIfkEBQoABgAsCgAGAAUABwAAAxBoVlRKgyjmlAIBqCDCzUoCACH5BAUKAAYALAYACgAHAAUAAAMPaGpFtYYMAgJgLogA610JACH5BAUKAAYALAIACgAHAAUAAAMPCAHWFiI4o1ghZZJB5i0JACH5BAUKAAYALAAABgAFAAcAAAMQCAFmIaEp1motpDQySMNFAgA7') no-repeat scroll 0 0 transparent;}.rc-tree .rc-tree-treenode span.rc-tree-switcher.rc-tree-switcher-noop{flex:none;}.rc-tree.",
     " .rc-tree-treenode span.rc-tree-switcher.rc-tree-switcher-noop{display:none;}.rc-tree .rc-tree-treenode span.rc-tree-switcher.rc-tree-switcher_open{background-position:-93px -56px;}.rc-tree .rc-tree-treenode span.rc-tree-switcher.rc-tree-switcher_close{background-position:-75px -56px;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox{width:13px;height:13px;margin:0 3px;background-position:0 0;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox-checked{background-position:-14px 0;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox-indeterminate{background-position:-14px -28px;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox-disabled{background-position:0 -56px;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox.rc-tree-checkbox-checked.rc-tree-checkbox-disabled{background-position:-14px -56px;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox.rc-tree-checkbox-indeterminate.rc-tree-checkbox-disabled{position:relative;background:#ccc;border-radius:3px;}.rc-tree .rc-tree-treenode span.rc-tree-checkbox.rc-tree-checkbox-indeterminate.rc-tree-checkbox-disabled::after{position:absolute;top:5px;left:3px;width:5px;height:0;border:2px solid #fff;border-top:0;border-left:0;-webkit-transform:scale(1);transform:scale(1);content:' ';}.rc-tree:not(.rc-tree-show-line) .rc-tree-treenode .rc-tree-switcher-noop{background:none;}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) > ul{background:url('data:image/gif;base64,R0lGODlhCQACAIAAAMzMzP///yH5BAEAAAEALAAAAAAJAAIAAAIEjI9pUAA7') 0 0 repeat-y;}.rc-tree.rc-tree-show-line .rc-tree-treenode:not(:last-child) > .rc-tree-switcher-noop{background-position:-56px -18px;}.rc-tree.rc-tree-show-line .rc-tree-treenode:last-child > .rc-tree-switcher-noop{background-position:-56px -36px;}.rc-tree-child-tree{display:none;}.rc-tree-child-tree-open{display:block;}.rc-tree-treenode-disabled > span:not(.rc-tree-switcher),.rc-tree-treenode-disabled > a,.rc-tree-treenode-disabled > a span{color:#767676;cursor:not-allowed;}.rc-tree-treenode-active{background:rgba(0,0,0,0.1);}.rc-tree-node-selected{background-color:#ffe6b0;box-shadow:0 0 0 1px #ffb951;opacity:0.8;}.rc-tree-icon__open{margin-right:0;vertical-align:top;background-position:-110px -16px;}.rc-tree-icon__close{margin-right:0;vertical-align:top;background-position:-110px 0;}.rc-tree-icon__docu{margin-right:0;vertical-align:top;background-position:-110px -32px;}.rc-tree-icon__customize{display:block;line-height:0;color:var(",
     ");margin:var(",
-    ");}.rc-tree-title{display:inline-block;width:100%;}.rc-tree-indent{display:inline-flex;height:0;vertical-align:bottom;}.rc-tree-indent-unit{display:inline-block;width:16px;}.rc-tree-draggable-icon{display:inline-flex;justify-content:center;width:16px;}.rc-tree,.rc-tree-list{border:none !important;}.rc-tree .rc-tree-list-holder{overflow:hidden auto;}.rc-tree .rc-tree-treenode{position:relative;z-index:0;display:flex;align-items:center;min-height:var(",
-    ");padding:0;}.rc-tree.",
-    " .rc-tree-treenode{padding:0 var(",
-    ") !important;}.rc-tree.",
-    ":not(",
-    ") .rc-tree-treenode{padding:0 var(",
-    ");}.rc-tree .rc-tree-treenode::before{content:'';position:absolute;z-index:-1;top:var(",
+    ");}.rc-tree-title{display:grid;width:100%;}.rc-tree-indent{display:inline-flex;height:0;vertical-align:bottom;}.rc-tree-indent-unit{display:inline-block;width:16px;}.rc-tree-draggable-icon{display:inline-flex;justify-content:center;width:16px;}.rc-tree,.rc-tree-list{border:none !important;}.rc-tree .rc-tree-list-holder{overflow:hidden auto;}.rc-tree .rc-tree-treenode::before{content:'';position:absolute;z-index:-1;top:var(",
     ");bottom:var(",
     ");left:var(",
     ");right:0;background:transparent;border-radius:var(",
@@ -167,7 +178,7 @@ var base = (0, _styledcomponents.css)([
     " .rc-tree-treenode.rc-tree-treenode-selected):hover::before{background:var(",
     ");}.rc-tree .rc-tree-treenode:not(.rc-tree-treenode-disabled):not(.rc-tree.",
     " .rc-tree-treenode.rc-tree-treenode-selected):active::before{background:var(",
-    ");}.rc-tree .rc-tree-treenode .rc-tree-node-content-wrapper{display:flex;align-items:center;align-self:stretch;height:auto;flex:1;min-width:max-content;}.rc-tree .rc-tree-treenode span.rc-tree-switcher{width:var(",
+    ");}.rc-tree .rc-tree-treenode span.rc-tree-switcher{width:var(",
     ");height:var(",
     ");margin:var(",
     ");line-height:0;vertical-align:0;background:transparent;}.rc-tree.",
@@ -199,6 +210,6 @@ var base = (0, _styledcomponents.css)([
     ");}.rc-tree .rc-tree-treenode.rc-tree-treenode-disabled .rc-tree-title{color:var(",
     ");}.rc-tree-node-selected .rc-tree-icon__customize{color:var(",
     ");}.rc-tree .rc-tree-treenode.rc-tree-treenode-disabled .rc-tree-icon__customize{color:var(",
-    ");;}.rc-tree-indent-unit{width:var(",
+    ");}.rc-tree-indent-unit{width:var(",
     ");}"
-], _Treetokens.classes.treeLeafNode, _Treetokens.treeTokens.itemDraggableBorderColor, _Treetokens.treeTokens.color, _Treetokens.classes.treeRadioMode, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.iconFolderColor, _Treetokens.treeTokens.iconFolderMargin, _Treetokens.treeTokens.itemHeight, _Treetokens.classes.treeItemFilled, _Treetokens.treeTokens.itemPadding, _Treetokens.classes.treeInverted, _Treetokens.classes.treeItemFilled, _Treetokens.treeTokens.itemPaddingTight, _Treetokens.treeTokens.itemTop, _Treetokens.treeTokens.itemBottom, _Treetokens.treeTokens.switcherSize, _Treetokens.treeTokens.itemBorderRadius, _Treetokens.treeTokens.itemDisabledOpacity, _Treetokens.classes.treeItemFilled, _Treetokens.classes.treeItemHasSelectedChildren, _Treetokens.treeTokens.colorSelected, _Treetokens.classes.treeItemHasSelectedChildren, _Treetokens.treeTokens.colorSelected, _Treetokens.classes.treeItemPrimaryBackground, _Treetokens.treeTokens.itemBackgroundColorPrimary, _Treetokens.treeTokens.itemBackgroundColorSelected, _Treetokens.classes.treeRadioMode, _Treetokens.treeTokens.itemBackgroundColorHover, _Treetokens.classes.treeRadioMode, _Treetokens.treeTokens.itemBackgroundColorActive, _Treetokens.treeTokens.switcherSize, _Treetokens.treeTokens.switcherSize, _Treetokens.treeTokens.switcherMargin, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.switcherMarginInverted, _Treetokens.classes.treeInverted, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.checkboxSize, _Treetokens.treeTokens.checkboxSize, _Treetokens.treeTokens.checkboxMargin, _Treetokens.treeTokens.checkboxInnerSize, _Treetokens.treeTokens.checkboxInnerSize, _Treetokens.treeTokens.checkboxBorderColor, _Treetokens.treeTokens.checkboxBorderRadius, _Treetokens.treeTokens.itemDisabledBorderColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.color, _Treetokens.treeTokens.fontFamily, _Treetokens.treeTokens.fontSize, _Treetokens.treeTokens.fontStyle, _Treetokens.treeTokens.fontWeight, _Treetokens.treeTokens.letterSpacing, _Treetokens.treeTokens.lineHeight, _Treetokens.classes.treeInverted, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.colorSelected, _Treetokens.treeTokens.itemDisabledColor, _Treetokens.treeTokens.colorSelected, _Treetokens.treeTokens.itemDisabledColor, _Treetokens.treeTokens.itemIndent);
+], _Treetokens.treeTokens.itemPadding, _Treetokens.treeTokens.itemHeight, _Treetokens.classes.treeTightVariant, _Treetokens.treeTokens.itemPaddingTight, _Treetokens.classes.treeLeafNode, _Treetokens.treeTokens.itemDraggableBorderColor, _Treetokens.treeTokens.color, _Treetokens.classes.treeRadioMode, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.iconFolderColor, _Treetokens.treeTokens.iconFolderMargin, _Treetokens.treeTokens.itemTop, _Treetokens.treeTokens.itemBottom, _Treetokens.treeTokens.switcherSize, _Treetokens.treeTokens.itemBorderRadius, _Treetokens.treeTokens.itemDisabledOpacity, _Treetokens.classes.treeItemFilled, _Treetokens.classes.treeItemHasSelectedChildren, _Treetokens.treeTokens.colorSelected, _Treetokens.classes.treeItemHasSelectedChildren, _Treetokens.treeTokens.colorSelected, _Treetokens.classes.treeItemPrimaryBackground, _Treetokens.treeTokens.itemBackgroundColorPrimary, _Treetokens.treeTokens.itemBackgroundColorSelected, _Treetokens.classes.treeRadioMode, _Treetokens.treeTokens.itemBackgroundColorHover, _Treetokens.classes.treeRadioMode, _Treetokens.treeTokens.itemBackgroundColorActive, _Treetokens.treeTokens.switcherSize, _Treetokens.treeTokens.switcherSize, _Treetokens.treeTokens.switcherMargin, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.switcherMarginInverted, _Treetokens.classes.treeInverted, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.checkboxSize, _Treetokens.treeTokens.checkboxSize, _Treetokens.treeTokens.checkboxMargin, _Treetokens.treeTokens.checkboxInnerSize, _Treetokens.treeTokens.checkboxInnerSize, _Treetokens.treeTokens.checkboxBorderColor, _Treetokens.treeTokens.checkboxBorderRadius, _Treetokens.treeTokens.itemDisabledBorderColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.checkboxBackgroundColor, _Treetokens.treeTokens.color, _Treetokens.treeTokens.fontFamily, _Treetokens.treeTokens.fontSize, _Treetokens.treeTokens.fontStyle, _Treetokens.treeTokens.fontWeight, _Treetokens.treeTokens.letterSpacing, _Treetokens.treeTokens.lineHeight, _Treetokens.classes.treeInverted, _Treetokens.classes.treeInverted, _Treetokens.treeTokens.colorSelected, _Treetokens.treeTokens.itemDisabledColor, _Treetokens.treeTokens.colorSelected, _Treetokens.treeTokens.itemDisabledColor, _Treetokens.treeTokens.itemIndent);

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

@@ -22,7 +22,8 @@ var classes = {
     treeItemPrimaryBackground: 'tree-item-primary-background',
     treeItemHasSelectedChildren: 'tree-item-has-selected-children',
     treeRadioMode: 'tree-radio-mode',
-    treeLeafNode: 'tree-leaf-node'
+    treeLeafNode: 'tree-leaf-node',
+    treeTightVariant: 'tree-tight-variant'
 };
 var treeTokens = {
     arrowColor: '--plasma-tree-arrow-color',

package/styled-components/cjs/examples/components/Tree/Tree.config.js

@@ -45,7 +45,7 @@ var config = {
                 "",
                 ":3.5rem;",
                 ":1rem;",
-                ":0.375rem;",
+                ":0.75rem 1rem;",
                 ":2rem;",
                 ":0.75rem;",
                 ":0.25rem;",
@@ -68,8 +68,8 @@ var config = {
             m: (0, _styledcomponents.css)([
                 "",
                 ":3rem;",
-                ":0.875rem;",
-                ":0.375rem;",
+                ":0.75rem 0.875rem;",
+                ":0.5rem 0.875rem;",
                 ":2rem;",
                 ":0.625rem;",
                 ":0.25rem;",
@@ -92,8 +92,8 @@ var config = {
             s: (0, _styledcomponents.css)([
                 "",
                 ":2.5rem;",
-                ":0.75rem;",
-                ":0.25rem;",
+                ":0.5rem 0.75rem;",
+                ":0.4375rem 0.5rem;",
                 ":1.875rem;",
                 ":0.5rem;",
                 ":0.25rem;",
@@ -117,7 +117,7 @@ var config = {
                 "",
                 ":2rem;",
                 ":0.5rem;",
-                ":0.125rem;",
+                ":0.25rem 0.5rem;",
                 ":1.25rem;",
                 ":0.375rem;",
                 ":0.25rem;",

package/styled-components/cjs/hooks/useFocusTrap.js

@@ -47,14 +47,14 @@ var processNode = function(node, firstFocusSelector, ref) {
 };
 var focusManager = new _focusManager.FocusManager();
 var useFocusTrap = function() {
-    var active = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true, firstFocusSelector = arguments.length > 1 ? arguments[1] : void 0, focusAfterNode = arguments.length > 2 ? arguments[2] : void 0, focusAfterAnimation = arguments.length > 3 ? arguments[3] : void 0;
+    var active = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true, firstFocusSelector = arguments.length > 1 ? arguments[1] : void 0, focusAfterNode = arguments.length > 2 ? arguments[2] : void 0, focusAfterAnimation = arguments.length > 3 ? arguments[3] : void 0, enableOnFirstMount = arguments.length > 4 ? arguments[4] : void 0;
     var ref = (0, _react.useRef)();
     var setRef = (0, _react.useCallback)(function(node) {
         if (ref.current) {
             focusManager.teardownScopedFocus();
             focusManager.returnFocus();
         }
-        if (active && node) {
+        if ((active || enableOnFirstMount) && node) {
             focusManager.setupScopedFocus(node);
             focusManager.markForFocusAfter(focusAfterNode);
             // Delay processing the HTML node by a frame. This ensures focus is assigned correctly.
@@ -73,15 +73,21 @@ var useFocusTrap = function() {
         ref.current = null;
     }, [
         active,
+        enableOnFirstMount,
         firstFocusSelector
     ]);
     (0, _react.useEffect)(function() {
-        if (!active) {
+        if (!active && !enableOnFirstMount) {
             return;
         }
         var handleKeyDown = function(event) {
             if (event.key === 'Tab' && ref.current) {
-                (0, _scopeTab.scopeTab)(ref.current, event);
+                (0, _scopeTab.scopeTab)(ref.current, event, active);
+                if (enableOnFirstMount) {
+                    setTimeout(function() {
+                        focusManager.teardownScopedFocus();
+                    });
+                }
             }
         };
         document.addEventListener('keydown', handleKeyDown);
@@ -89,7 +95,8 @@ var useFocusTrap = function() {
             document.removeEventListener('keydown', handleKeyDown);
         };
     }, [
-        active
+        active,
+        enableOnFirstMount
     ]);
     return setRef;
 };

package/styled-components/cjs/utils/scopeTab.js

@@ -9,7 +9,7 @@ Object.defineProperty(exports, "scopeTab", {
     }
 });
 var _tabbable = require("./tabbable");
-var scopeTab = function(node, event) {
+var scopeTab = function(node, event, activeFocusTrap) {
     var tabbable = (0, _tabbable.findTabbableDescendants)(node);
     if (!tabbable.length) {
         event.preventDefault();
@@ -19,7 +19,7 @@ var scopeTab = function(node, event) {
     var finalTabbable = tabbable[event.shiftKey ? 0 : tabbable.length - 1];
     var leavingFinalTabbable = finalTabbable === document.activeElement || node === document.activeElement;
     // если не является, то передаем обработку таба самому браузеру
-    if (!leavingFinalTabbable) {
+    if (!leavingFinalTabbable || !activeFocusTrap) {
         return;
     }
     // иначе зацкливаемся

package/styled-components/es/components/Dropdown/ui/DropdownInner/DropdownInner.js

@@ -50,7 +50,7 @@ var DropdownInner = function(param) {
             id: listId,
             role: "group",
             listMaxHeight: item.listMaxHeight
-        }, item.beforeList, item.items.map(function(innerItem, innerIndex) {
+        }, item.items.map(function(innerItem, innerIndex) {
             return /*#__PURE__*/ React.createElement(DropdownInner, {
                 key: "".concat(innerIndex, "/").concat(currentLevel),
                 item: innerItem,

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

@@ -74,7 +74,7 @@ var Popup = component(popupConfig);
  * Управляет показом/скрытием, подложкой и анимацией визуальной части модального окна.
  */ export var modalRoot = function(Root) {
     return /*#__PURE__*/ forwardRef(function(_param, outerRootRef) {
-        var id = _param.id, withAnimation = _param.withAnimation, onClose = _param.onClose, onOverlayClick = _param.onOverlayClick, onEscKeyDown = _param.onEscKeyDown, _param_closeOnEsc = _param.closeOnEsc, closeOnEsc = _param_closeOnEsc === void 0 ? true : _param_closeOnEsc, _param_closeOnOverlayClick = _param.closeOnOverlayClick, closeOnOverlayClick = _param_closeOnOverlayClick === void 0 ? true : _param_closeOnOverlayClick, withBlur = _param.withBlur, initialFocusRef = _param.initialFocusRef, focusAfterRef = _param.focusAfterRef, zIndex = _param.zIndex, popupInfo = _param.popupInfo, children = _param.children, view = _param.view, opened = _param.opened, isOpen = _param.isOpen, hasBody = _param.hasBody, hasClose = _param.hasClose, resizable = _param.resizable, draggable = _param.draggable, rest = _object_without_properties(_param, [
+        var id = _param.id, withAnimation = _param.withAnimation, onClose = _param.onClose, onOverlayClick = _param.onOverlayClick, onEscKeyDown = _param.onEscKeyDown, _param_closeOnEsc = _param.closeOnEsc, closeOnEsc = _param_closeOnEsc === void 0 ? true : _param_closeOnEsc, _param_closeOnOverlayClick = _param.closeOnOverlayClick, closeOnOverlayClick = _param_closeOnOverlayClick === void 0 ? true : _param_closeOnOverlayClick, withBlur = _param.withBlur, _param_isFocusTrapped = _param.isFocusTrapped, isFocusTrapped = _param_isFocusTrapped === void 0 ? true : _param_isFocusTrapped, initialFocusRef = _param.initialFocusRef, focusAfterRef = _param.focusAfterRef, zIndex = _param.zIndex, popupInfo = _param.popupInfo, children = _param.children, view = _param.view, opened = _param.opened, isOpen = _param.isOpen, hasBody = _param.hasBody, hasClose = _param.hasClose, resizable = _param.resizable, draggable = _param.draggable, rest = _object_without_properties(_param, [
             "id",
             "withAnimation",
             "onClose",
@@ -83,6 +83,7 @@ var Popup = component(popupConfig);
             "closeOnEsc",
             "closeOnOverlayClick",
             "withBlur",
+            "isFocusTrapped",
             "initialFocusRef",
             "focusAfterRef",
             "zIndex",
@@ -98,7 +99,7 @@ var Popup = component(popupConfig);
         ]);
         var innerIsOpen = Boolean(isOpen || opened);
         var innerHasClose = hasClose === undefined && hasBody || hasClose;
-        var trapRef = useFocusTrap(true, initialFocusRef, focusAfterRef, true);
+        var trapRef = useFocusTrap(isFocusTrapped, initialFocusRef, focusAfterRef, true, !isFocusTrapped);
         var popupController = usePopupContext();
         var innerRef = useForkRef(trapRef, outerRootRef);
         var uniqId = safeUseId();

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

@@ -160,7 +160,7 @@ export var noteRoot = function(Root) {
         var contentWidthWithOffsetToken = contentBefore ? "calc(100% - ".concat(contentBeforeWidth, " - var(").concat(contentGapToken, "))") : '100%';
         var setTruncatedText = function() {
             var _titleHelperRef_current;
-            if (!canUseDOM || !text || !(contentWrapperRef === null || contentWrapperRef === void 0 ? void 0 : contentWrapperRef.current) || !(textRenderHelperRef === null || textRenderHelperRef === void 0 ? void 0 : textRenderHelperRef.current) || !width && !height) {
+            if (!canUseDOM || !text || typeof text !== 'string' || !(contentWrapperRef === null || contentWrapperRef === void 0 ? void 0 : contentWrapperRef.current) || !(textRenderHelperRef === null || textRenderHelperRef === void 0 ? void 0 : textRenderHelperRef.current) || !width && !height) {
                 return;
             }
             var contentHeight = contentWrapperRef.current.offsetHeight;

package/styled-components/es/components/Note/variations/_size/base.js

@@ -36,5 +36,5 @@ export var base = css([
     ");font-weight:var(",
     ");letter-spacing:var(",
     ");line-height:var(",
-    ");word-break:break-all;}"
+    ");overflow-wrap:break-word;}"
 ], tokens.padding, tokens.borderRadius, privateTokens.height, privateTokens.width, tokens.gap, classes.stretch, ContentBefore, tokens.fixedContentBeforeWidth, tokens.fixedContentBeforeHeight, tokens.fixedContentBeforePadding, classes.contentAlignCenter, tokens.paddingScalable, tokens.gapScalable, ContentBefore, ContentWrapper, privateTokens.contentWidthWithOffset, tokens.contentGap, Title, TitleHelper, tokens.titleLineHeight, tokens.titleFontFamily, tokens.titleFontSize, tokens.titleFontStyle, tokens.titleFontWeight, tokens.titleLetterSpacing, tokens.titleLineHeight, Text, TextHelper, tokens.textFontFamily, tokens.textFontSize, tokens.textFontStyle, tokens.textFontWeight, tokens.textLetterSpacing, tokens.textLineHeight);

package/styled-components/es/components/Tooltip/Tooltip.styles.js

@@ -2,14 +2,16 @@ import styled from "styled-components";
 import { tokens } from "./Tooltip.tokens";
 export var TooltipRoot = styled.div.withConfig({
     displayName: "Tooltip.styles__TooltipRoot",
-    componentId: "sc-e6446bfb-0"
+    componentId: "sc-7a496a90-0"
 })([
-    "padding:var(",
+    "display:flex;align-items:center;padding:var(",
     ") var(",
     ") var(",
     ") var(",
     ");min-height:var(",
-    ");box-sizing:border-box;background-color:var(",
+    ");max-width:",
+    ";min-width:",
+    ";width:max-content;background-color:var(",
     ");border-radius:var(",
     ");box-shadow:var(",
     ");color:var(",
@@ -19,19 +21,17 @@ export var TooltipRoot = styled.div.withConfig({
     ");font-weight:var(",
     ");letter-spacing:var(",
     ");line-height:var(",
-    ");max-width:",
-    ";min-width:",
-    ";width:max-content;word-break:break-word;pointer-events:none;display:flex;align-items:center;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;"
-], tokens.paddingTop, tokens.paddingRight, tokens.paddingBottom, tokens.paddingLeft, tokens.minHeight, tokens.backgroundColor, tokens.borderRadius, tokens.boxShadow, tokens.color, tokens.textFontFamily, tokens.textFontSize, tokens.textFontStyle, tokens.textFontWeight, tokens.textFontLetterSpacing, tokens.textFontLineHeight, function(param) {
+    ");box-sizing:border-box;word-break:break-word;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;"
+], tokens.paddingTop, tokens.paddingRight, tokens.paddingBottom, tokens.paddingLeft, tokens.minHeight, function(param) {
     var maxWidth = param.maxWidth;
     return maxWidth || 'unset';
 }, function(param) {
     var minWidth = param.minWidth;
     return minWidth || 'unset';
-});
+}, tokens.backgroundColor, tokens.borderRadius, tokens.boxShadow, tokens.color, tokens.textFontFamily, tokens.textFontSize, tokens.textFontStyle, tokens.textFontWeight, tokens.textFontLetterSpacing, tokens.textFontLineHeight);
 export var StyledContentLeft = styled.div.withConfig({
     displayName: "Tooltip.styles__StyledContentLeft",
-    componentId: "sc-e6446bfb-1"
+    componentId: "sc-7a496a90-1"
 })([
     "display:flex;align-items:center;margin-right:var(",
     ");height:var(",