@salutejs/plasma-new-hope 0.157.0-canary.1464.11120816324.0 → 0.157.1-canary.1374.11123970444.0

package/styled-components/cjs/components/Tabs/ui/{Tabs/Tabs.js → horizontal/HorizontalTabs/HorizontalTabs.js}

@@ -4,19 +4,19 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.tabsRoot = exports.tabsConfig = void 0;
+exports.horizontalTabsRoot = exports.horizontalTabsConfig = void 0;
 var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
 var _plasmaCore = /*#__PURE__*/require("@salutejs/plasma-core");
-var _Icon = /*#__PURE__*/require("../../../_Icon");
-var _tokens = /*#__PURE__*/require("../../tokens");
-var _utils = /*#__PURE__*/require("../../../../utils");
-var _TabsContext = /*#__PURE__*/require("../../TabsContext");
+var _Icon = /*#__PURE__*/require("../../../../_Icon");
+var _tokens = /*#__PURE__*/require("../../../tokens");
+var _utils = /*#__PURE__*/require("../../../../../utils");
+var _TabsContext = /*#__PURE__*/require("../../../TabsContext");
 var _base = /*#__PURE__*/require("./variations/_size/base");
 var _base2 = /*#__PURE__*/require("./variations/_view/base");
 var _base3 = /*#__PURE__*/require("./variations/_disabled/base");
 var _base4 = /*#__PURE__*/require("./variations/_pilled/base");
 var _base5 = /*#__PURE__*/require("./variations/_stretch/base");
-var _Tabs = /*#__PURE__*/require("./Tabs.styles");
+var _HorizontalTabs = /*#__PURE__*/require("./HorizontalTabs.styles");
 var _excluded = ["id", "stretch", "disabled", "clip", "size", "view", "children", "pilled", "index", "className"];
 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; }
@@ -36,7 +36,7 @@ var Keys = /*#__PURE__*/function (Keys) {
   Keys[Keys["right"] = 39] = "right";
   return Keys;
 }(Keys || {});
-var tabsRoot = exports.tabsRoot = function tabsRoot(Root) {
+var horizontalTabsRoot = exports.horizontalTabsRoot = function horizontalTabsRoot(Root) {
   return /*#__PURE__*/(0, _react.forwardRef)(function (props, outerRef) {
     var id = props.id,
       _props$stretch = props.stretch,
@@ -114,7 +114,7 @@ var tabsRoot = exports.tabsRoot = function tabsRoot(Root) {
       });
     }, [disabled, scrollRef, refs]);
     var PreviousButton = (0, _react.useMemo)(function () {
-      return /*#__PURE__*/_react["default"].createElement(_Tabs.StyledArrow, {
+      return /*#__PURE__*/_react["default"].createElement(_HorizontalTabs.StyledArrow, {
         type: "button",
         "aria-label": "\u041F\u0440\u0435\u0434\u044B\u0434\u0443\u0449\u0438\u0439 \u0442\u0430\u0431",
         onClick: onPrev,
@@ -128,7 +128,7 @@ var tabsRoot = exports.tabsRoot = function tabsRoot(Root) {
       }));
     }, [onPrev, disabled, isFilled]);
     var NextButton = (0, _react.useMemo)(function () {
-      return /*#__PURE__*/_react["default"].createElement(_Tabs.StyledArrow, {
+      return /*#__PURE__*/_react["default"].createElement(_HorizontalTabs.StyledArrow, {
         type: "button",
         "aria-label": "\u0421\u043B\u0435\u0434\u0443\u044E\u0449\u0438\u0439 \u0442\u0430\u0431",
         onClick: onNext,
@@ -206,20 +206,20 @@ var tabsRoot = exports.tabsRoot = function tabsRoot(Root) {
       disabled: disabled,
       className: (0, _utils.cx)(pilledClass, stretchClass, hasLeftArrowClass, hasRightArrowClass, className),
       onKeyDown: onKeyDown
-    }, rest), !firstItemVisible && PreviousButton, /*#__PURE__*/_react["default"].createElement(_Tabs.StyledContentWrapper, {
+    }, rest), !firstItemVisible && PreviousButton, /*#__PURE__*/_react["default"].createElement(_HorizontalTabs.StyledContentWrapper, {
       className: (0, _utils.cx)(clipScrollClass, clipShowAllClass),
       ref: scrollRef,
       onScroll: handleScroll
-    }, /*#__PURE__*/_react["default"].createElement(_Tabs.StyledContent, {
+    }, /*#__PURE__*/_react["default"].createElement(_HorizontalTabs.StyledContent, {
       ref: trackRef
     }, children)), !lastItemVisible && NextButton));
   });
 };
-var tabsConfig = exports.tabsConfig = {
-  name: 'Tabs',
+var horizontalTabsConfig = exports.horizontalTabsConfig = {
+  name: 'HorizontalTabs',
   tag: 'div',
-  layout: tabsRoot,
-  base: _Tabs.base,
+  layout: horizontalTabsRoot,
+  base: _HorizontalTabs.base,
   variations: {
     size: {
       css: _base.base

package/styled-components/cjs/components/Tabs/ui/{Tabs/Tabs.styles.js → horizontal/HorizontalTabs/HorizontalTabs.styles.js}

@@ -6,21 +6,21 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.base = exports.StyledContentWrapper = exports.StyledContent = exports.StyledArrow = void 0;
 var _styledComponents = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("styled-components"));
-var _mixins = /*#__PURE__*/require("../../../../mixins");
-var _tokens = /*#__PURE__*/require("../../tokens");
+var _mixins = /*#__PURE__*/require("../../../../../mixins");
+var _tokens = /*#__PURE__*/require("../../../tokens");
 var _templateObject;
 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 _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    display: flex;\n    gap: 0.125rem;\n    align-items: center;\n    position: relative;\n"])));
 var StyledContent = exports.StyledContent = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-1ibkmsl-0"
+  componentId: "plasma-new-hope__sc-1nr0m0h-0"
 })(["display:inline-flex;flex-direction:row;align-items:center;"]);
 var StyledContentWrapper = exports.StyledContentWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-1ibkmsl-1"
-})(["margin:-0.125rem;padding:0.25rem;box-sizing:content-box;position:relative;height:100%;width:100%;display:flex;align-items:center;&.", "{overflow:scroll;scroll-padding:0.25rem;overscroll-behavior:contain;scrollbar-width:none;::-webkit-scrollbar{display:none;}}&.", "{overflow:visible;}"], _tokens.classes.tabsClipScroll, _tokens.classes.tabsClipShowAll);
+  componentId: "plasma-new-hope__sc-1nr0m0h-1"
+})(["margin:-0.125rem;padding:0.25rem;box-sizing:content-box;position:relative;height:100%;width:100%;display:flex;align-items:center;z-index:1;&.", "{overflow:scroll;scroll-padding:0.25rem;overscroll-behavior:contain;scrollbar-width:none;::-webkit-scrollbar{display:none;}}&.", "{overflow:visible;}"], _tokens.classes.tabsClipScroll, _tokens.classes.tabsClipShowAll);
 var StyledArrow = exports.StyledArrow = /*#__PURE__*/_styledComponents["default"].button.withConfig({
-  componentId: "plasma-new-hope__sc-1ibkmsl-2"
+  componentId: "plasma-new-hope__sc-1nr0m0h-2"
 })(["display:flex;cursor:pointer;border:none;background-color:transparent;padding:0;outline:none;", ";&[disabled]{cursor:not-allowed;}--plasma_private-outer-padding:", ";padding-right:", ";padding-left:", ";"], /*#__PURE__*/(0, _mixins.addFocus)({
   outlineSize: '0.063rem',
   outlineOffset: '-0.125rem',

package/styled-components/cjs/components/Tabs/ui/{Tabs → horizontal/HorizontalTabs}/variations/_disabled/base.js

@@ -5,5 +5,5 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.base = void 0;
 var _styledComponents = /*#__PURE__*/require("styled-components");
-var _tokens = /*#__PURE__*/require("../../../../tokens");
+var _tokens = /*#__PURE__*/require("../../../../../tokens");
 var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["opacity:var(", ");"], _tokens.tokens.disabledOpacity);

package/styled-components/cjs/components/Tabs/ui/horizontal/HorizontalTabs/variations/_disabled/tokens.json

@@ -0,0 +1,4 @@
+{
+    "type": "boolean",
+    "tokens": ["--plasma-tabs-disabled-opacity"]
+}

package/styled-components/cjs/components/Tabs/ui/{Tabs → horizontal/HorizontalTabs}/variations/_pilled/base.js

@@ -5,5 +5,5 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.base = void 0;
 var _styledComponents = /*#__PURE__*/require("styled-components");
-var _tokens = /*#__PURE__*/require("../../../../tokens");
-var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{--plasma_private-outline-radius:var(", ");border-radius:var(", ");}"], /*#__PURE__*/String(_tokens.classes.tabsPilled), _tokens.tokens.tabsPilledBorderRadius, _tokens.tokens.tabsPilledBorderRadius);
+var _tokens = /*#__PURE__*/require("../../../../../tokens");
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{--plasma_private-outline-radius:var(", ");border-radius:var(", ");}"], _tokens.classes.tabsPilled, _tokens.tokens.tabsPilledBorderRadius, _tokens.tokens.tabsPilledBorderRadius);

package/styled-components/cjs/components/Tabs/ui/{Tabs → horizontal/HorizontalTabs}/variations/_size/base.js

@@ -5,5 +5,5 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.base = void 0;
 var _styledComponents = /*#__PURE__*/require("styled-components");
-var _tokens = /*#__PURE__*/require("../../../../tokens");
+var _tokens = /*#__PURE__*/require("../../../../../tokens");
 var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["width:var(", ");height:var(", ");--plasma_private-outline-radius:var(", ");border-radius:var(", ");"], _tokens.tokens.tabsWidth, _tokens.tokens.tabsHeight, _tokens.tokens.tabsBorderRadius, _tokens.tokens.tabsBorderRadius);

package/styled-components/cjs/components/Tabs/ui/{Tabs → horizontal/HorizontalTabs}/variations/_stretch/base.js

@@ -5,6 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.base = void 0;
 var _styledComponents = /*#__PURE__*/require("styled-components");
-var _tokens = /*#__PURE__*/require("../../../../tokens");
-var _Tabs = /*#__PURE__*/require("../../Tabs.styles");
-var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{width:100%;", ",", ",", " > button{width:100%;margin-left:0;}}"], _tokens.classes.tabsStretch, _Tabs.StyledContentWrapper, _Tabs.StyledContent, _Tabs.StyledContent);
+var _tokens = /*#__PURE__*/require("../../../../../tokens");
+var _HorizontalTabs = /*#__PURE__*/require("../../HorizontalTabs.styles");
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&.", "{width:100%;", ",", ",", " > button{width:100%;margin-left:0;}}"], _tokens.classes.tabsStretch, _HorizontalTabs.StyledContentWrapper, _HorizontalTabs.StyledContent, _HorizontalTabs.StyledContent);

package/styled-components/cjs/components/Tabs/ui/{Tabs → horizontal/HorizontalTabs}/variations/_view/base.js

@@ -5,5 +5,5 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.base = void 0;
 var _styledComponents = /*#__PURE__*/require("styled-components");
-var _tokens = /*#__PURE__*/require("../../../../tokens");
+var _tokens = /*#__PURE__*/require("../../../../../tokens");
 var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["background-color:var(", ");&::after{content:'';position:absolute;bottom:0.125rem;left:0.125rem;right:0.125rem;background:var(", ");height:var(", ");border-radius:var(", ");}&.", "{&::after{left:1.5rem;}}&.", "{&::after{right:1.5rem;}}"], _tokens.tokens.tabsBackgroundColor, _tokens.tokens.tabsDividerColor, _tokens.tokens.tabsDividerHeight, _tokens.tokens.tabsDividerBorderRadius, _tokens.classes.tabsHasLeftArrow, _tokens.classes.tabsHasRightArrow);

package/styled-components/cjs/components/Tabs/ui/horizontal/HorizontalTabs/variations/_view/tokens.json

@@ -0,0 +1 @@
+["--plasma-tabs-background-color", "--plasma-tabs-divider-height", "--plasma-tabs-divider-color"]

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.js

@@ -0,0 +1,129 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.verticalTabItemRoot = exports.verticalTabItemConfig = void 0;
+var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
+var _plasmaCore = /*#__PURE__*/require("@salutejs/plasma-core");
+var _tokens = /*#__PURE__*/require("../../../tokens");
+var _utils = /*#__PURE__*/require("../../../../../utils");
+var _TabsContext = /*#__PURE__*/require("../../../TabsContext");
+var _VerticalTabsContext = /*#__PURE__*/require("../VerticalTabsContext");
+var _VerticalTabItem = /*#__PURE__*/require("./VerticalTabItem.styles");
+var _base = /*#__PURE__*/require("./variations/_view/base");
+var _base2 = /*#__PURE__*/require("./variations/_size/base");
+var _base3 = /*#__PURE__*/require("./variations/_disabled/base");
+var _excluded = ["size", "view", "selected", "disabled", "children", "value", "contentRight", "onIndexChange", "itemIndex", "tabIndex", "className", "onClick"];
+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); }
+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; }
+var verticalTabItemRoot = exports.verticalTabItemRoot = function verticalTabItemRoot(Root) {
+  return /*#__PURE__*/(0, _react.forwardRef)(function (props, outerRef) {
+    var size = props.size,
+      view = props.view,
+      selected = props.selected,
+      _props$disabled = props.disabled,
+      disabled = _props$disabled === void 0 ? false : _props$disabled,
+      children = props.children,
+      value = props.value,
+      contentRight = props.contentRight,
+      onIndexChange = props.onIndexChange,
+      itemIndex = props.itemIndex,
+      tabIndex = props.tabIndex,
+      className = props.className,
+      onClick = props.onClick,
+      rest = _objectWithoutProperties(props, _excluded);
+    var innerRef = (0, _react.useRef)(null);
+    var ref = (0, _plasmaCore.useForkRef)(outerRef, innerRef);
+    var refs = (0, _react.useContext)(_TabsContext.TabsContext);
+    var contentLeft = (0, _react.useContext)(_VerticalTabsContext.VerticalTabsContext);
+    var role = 'tab';
+    var selectedClass = selected ? _tokens.classes.selectedTabsItem : undefined;
+    var hasKeyNavigation = itemIndex !== undefined && onIndexChange !== undefined;
+    var navigationTabIndex = !disabled && (refs === null || refs === void 0 ? void 0 : refs.current) === itemIndex ? 0 : -1;
+    (0, _react.useEffect)(function () {
+      if (!refs) {
+        return;
+      }
+      refs.register(innerRef);
+      return function () {
+        return refs.unregister(innerRef);
+      };
+    }, [refs]);
+    var onItemFocus = (0, _react.useCallback)(function (event) {
+      if (disabled) {
+        return;
+      }
+      if (!hasKeyNavigation && innerRef !== null && innerRef !== void 0 && innerRef.current) {
+        innerRef.current.scrollTo({
+          top: innerRef.current.offsetTop,
+          behavior: 'smooth'
+        });
+        return;
+      }
+      if (!refs) {
+        return;
+      }
+      var focusIndex = refs.items.findIndex(function (itemRef) {
+        return itemRef.current === event.target;
+      });
+      if (focusIndex === refs.current) {
+        return;
+      }
+      onIndexChange === null || onIndexChange === void 0 || onIndexChange(focusIndex);
+      refs.setCurrent(focusIndex);
+    }, [refs, innerRef, onIndexChange, disabled]);
+    var handleClick = function handleClick(event) {
+      event.currentTarget.scrollIntoView({
+        block: 'nearest',
+        inline: 'nearest'
+      });
+      if (!onClick) {
+        return;
+      }
+      onClick(event);
+    };
+    return /*#__PURE__*/_react["default"].createElement(Root, _extends({
+      ref: ref,
+      disabled: disabled,
+      role: role,
+      view: view,
+      size: size,
+      onFocus: onItemFocus,
+      tabIndex: hasKeyNavigation ? navigationTabIndex : tabIndex,
+      className: (0, _utils.cx)(selectedClass, className),
+      onClick: handleClick
+    }, rest), /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, contentLeft && /*#__PURE__*/_react["default"].createElement(_VerticalTabItem.LeftContent, {
+      className: _tokens.classes.tabLeftContent
+    }, contentLeft), /*#__PURE__*/_react["default"].createElement(_VerticalTabItem.StyledContent, {
+      className: _tokens.classes.tabContent
+    }, children), value && /*#__PURE__*/_react["default"].createElement(_VerticalTabItem.TabItemValue, null, value), contentRight && /*#__PURE__*/_react["default"].createElement(_VerticalTabItem.RightContent, {
+      className: _tokens.classes.tabRightContent
+    }, contentRight)));
+  });
+};
+var verticalTabItemConfig = exports.verticalTabItemConfig = {
+  name: 'VerticalTabItem',
+  tag: 'button',
+  layout: verticalTabItemRoot,
+  base: _VerticalTabItem.base,
+  variations: {
+    size: {
+      css: _base2.base
+    },
+    view: {
+      css: _base.base
+    },
+    disabled: {
+      css: _base3.base,
+      attrs: true
+    }
+  },
+  defaults: {
+    view: 'divider'
+  }
+};

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabItem/VerticalTabItem.styles.js

@@ -0,0 +1,33 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.base = exports.TabItemValue = exports.StyledContent = exports.RightContent = exports.LeftContent = void 0;
+var _styledComponents = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("styled-components"));
+var _mixins = /*#__PURE__*/require("../../../../../mixins");
+var _tokens = /*#__PURE__*/require("../../../tokens");
+var _templateObject;
+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 _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n    position: relative;\n    display: flex;\n    align-items: center;\n    justify-content: flex-start;\n    box-sizing: border-box;\n    align-items: center;\n\n    gap: var(", ");\n    padding: var(", ");\n\n    appearance: none;\n    border: none;\n    outline: none;\n    cursor: pointer;\n    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n    ", ";\n"])), _tokens.tokens.itemContentGap, _tokens.tokens.itemPaddingOrientationVertical, /*#__PURE__*/(0, _mixins.addFocus)({
+  outlineSize: '0.063rem',
+  outlineOffset: '-0.125rem',
+  outlineColor: /*#__PURE__*/"var(".concat(_tokens.tokens.outlineFocusColor, ")"),
+  outlineRadius: 'calc(var(--plasma_private-outline-radius) + 0.063rem)',
+  customFocusRules: /*#__PURE__*/"\n            &.focus-visible:focus,\n            &[data-focus-visible-added] {\n                &::before {\n                    z-index: 1;\n                    outline: none;\n                    box-shadow: 0 0 0 0.063rem var(".concat(_tokens.tokens.outlineFocusColor, ");\n                }\n            }\n        ")
+}));
+var StyledContent = exports.StyledContent = /*#__PURE__*/_styledComponents["default"].div.withConfig({
+  componentId: "plasma-new-hope__sc-1pflgj8-0"
+})(["display:inline-block;width:fit-content;padding:0 var(", ",var(", "));"], _tokens.tokens.itemContentPaddingClear, _tokens.tokens.itemContentPadding);
+var TabItemValue = exports.TabItemValue = /*#__PURE__*/_styledComponents["default"].span.withConfig({
+  componentId: "plasma-new-hope__sc-1pflgj8-1"
+})(["color:var(", ");"], _tokens.tokens.itemValueColor);
+var RightContent = exports.RightContent = /*#__PURE__*/_styledComponents["default"].div.withConfig({
+  componentId: "plasma-new-hope__sc-1pflgj8-2"
+})(["display:flex;color:inherit;&:hover{color:inherit;}"]);
+var LeftContent = exports.LeftContent = /*#__PURE__*/_styledComponents["default"].div.withConfig({
+  componentId: "plasma-new-hope__sc-1pflgj8-3"
+})(["display:flex;color:inherit;&:hover{color:inherit;}"]);

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabItem/variations/_disabled/base.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.base = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var _tokens = /*#__PURE__*/require("../../../../../tokens");
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&[disabled]{cursor:not-allowed;&:hover{color:var(", ");background-color:var(", ");}&.", ":hover{color:var(", ");background-color:var(", ");}}"], _tokens.tokens.itemColor, _tokens.tokens.itemBackgroundColor, _tokens.classes.selectedTabsItem, _tokens.tokens.itemSelectedColor, _tokens.tokens.itemSelectedBackgroundColor);

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabItem/variations/_disabled/tokens.json

@@ -0,0 +1,4 @@
+{
+    "type": "boolean",
+    "tokens": ["--plasma-tab-disabled-opacity"]
+}

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabItem/variations/_size/base.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.base = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var _tokens = /*#__PURE__*/require("../../../../../tokens");
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");--plasma_private-outline-radius:var(", ");border-radius:var(", ");width:100%;height:var(", ");"], _tokens.tokens.fontFamily, _tokens.tokens.fontSize, _tokens.tokens.fontStyle, _tokens.tokens.fontWeight, _tokens.tokens.letterSpacing, _tokens.tokens.lineHeight, _tokens.tokens.itemBorderRadius, _tokens.tokens.itemBorderRadius, _tokens.tokens.itemHeight);

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabItem/variations/_size/tokens.json

@@ -0,0 +1,11 @@
+[
+    "--plasma-tab-item-font-family",
+    "--plasma-tab-item-font-size",
+    "--plasma-tab-item-font-style",
+    "--plasma-tab-item-font-weight",
+    "--plasma-tab-item-letter-spacing",
+    "--plasma-tab-item-lineheight",
+    "--plasma-tab-item-border-radius",
+    "--plasma-tab-item-width",
+    "--plasma-tab-item-height"
+]

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabItem/variations/_view/base.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.base = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var _tokens = /*#__PURE__*/require("../../../../../tokens");
+var _VerticalTabItem = /*#__PURE__*/require("../../VerticalTabItem.styles");
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["color:var(", ");background-color:var(", ");&:hover{color:var(", ");background-color:var(", ");", "{color:var(", ");}}&:active{color:var(", ");", "{color:var(", ");}}&.", "{transition:var(", ");}&.", "{color:var(", ");background-color:var(", ");&:hover{color:var(", ");background-color:var(", ");&::after{background:var(", ");}}", "{color:var(", ");&:hover{color:var(", ");}}&::after{content:'';position:absolute;top:0;left:0;bottom:0;background:var(", ");width:var(", ");border-radius:1px;}}"], _tokens.tokens.itemColor, _tokens.tokens.itemBackgroundColor, _tokens.tokens.itemColorHover, _tokens.tokens.itemBackgroundColorHover, _VerticalTabItem.TabItemValue, _tokens.tokens.itemValueColorHover, _tokens.tokens.itemColorActive, _VerticalTabItem.TabItemValue, _tokens.tokens.itemValueColorActive, _tokens.classes.tabItemAnimated, _tokens.tokens.itemBackgroundTransition, _tokens.classes.selectedTabsItem, _tokens.tokens.itemSelectedColor, _tokens.tokens.itemSelectedBackgroundColor, _tokens.tokens.itemSelectedColorHover, _tokens.tokens.itemSelectedBackgroundColorHover, _tokens.tokens.itemSelectedDividerColorHover, _VerticalTabItem.TabItemValue, _tokens.tokens.itemSelectedValueColorHover, _tokens.tokens.itemSelectedValueColorHover, _tokens.tokens.itemSelectedDividerColor, _tokens.tokens.itemSelectedDividerWidth);

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabItem/variations/_view/tokens.json

@@ -0,0 +1,8 @@
+[
+    "--plasma-tabs-underline-height",
+    "--plasma-tabs-underline-color",
+    "--plasma-tabs-font-weight",
+    "--plasma-tabs-font-color",
+    "--plasma-tabs-font-color-hover",
+    "--plasma-tabs-cursor"
+]

package/styled-components/cjs/components/Tabs/ui/vertical/VerticalTabs/VerticalTabs.js

@@ -0,0 +1,226 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.verticalTabsRoot = exports.verticalTabsConfig = void 0;
+var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
+var _plasmaCore = /*#__PURE__*/require("@salutejs/plasma-core");
+var _tokens = /*#__PURE__*/require("../../../tokens");
+var _utils = /*#__PURE__*/require("../../../../../utils");
+var _TabsContext = /*#__PURE__*/require("../../../TabsContext");
+var _Icon = /*#__PURE__*/require("../../../../_Icon");
+var _VerticalTabs = /*#__PURE__*/require("./VerticalTabs.styles");
+var _base = /*#__PURE__*/require("./variations/_size/base");
+var _base2 = /*#__PURE__*/require("./variations/_view/base");
+var _base3 = /*#__PURE__*/require("./variations/_disabled/base");
+var _excluded = ["id", "disabled", "clip", "size", "view", "children", "index", "className", "orientation", "hasDivider"];
+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); }
+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."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+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; }
+var Keys = /*#__PURE__*/function (Keys) {
+  Keys[Keys["end"] = 35] = "end";
+  Keys[Keys["home"] = 36] = "home";
+  Keys[Keys["up"] = 38] = "up";
+  Keys[Keys["down"] = 40] = "down";
+  return Keys;
+}(Keys || {});
+var verticalTabsRoot = exports.verticalTabsRoot = function verticalTabsRoot(Root) {
+  return /*#__PURE__*/(0, _react.forwardRef)(function (props, outerRef) {
+    var id = props.id,
+      _props$disabled = props.disabled,
+      disabled = _props$disabled === void 0 ? false : _props$disabled,
+      _props$clip = props.clip,
+      clip = _props$clip === void 0 ? 'showAll' : _props$clip,
+      size = props.size,
+      view = props.view,
+      children = props.children,
+      index = props.index,
+      className = props.className,
+      orientation = props.orientation,
+      _props$hasDivider = props.hasDivider,
+      hasDivider = _props$hasDivider === void 0 ? true : _props$hasDivider,
+      rest = _objectWithoutProperties(props, _excluded);
+    var _useState = (0, _react.useState)(true),
+      _useState2 = _slicedToArray(_useState, 2),
+      firstItemVisible = _useState2[0],
+      setFirstItemVisible = _useState2[1];
+    var _useState3 = (0, _react.useState)(true),
+      _useState4 = _slicedToArray(_useState3, 2),
+      lastItemVisible = _useState4[0],
+      setLastItemVisible = _useState4[1];
+    var refs = (0, _react.useMemo)(function () {
+      return new _TabsContext.TabItemRefs(index);
+    }, []);
+    var uniqId = (0, _plasmaCore.safeUseId)();
+    var tabsId = id || uniqId;
+    var noDividerClass = !hasDivider ? _tokens.classes.tabsNoDivider : undefined;
+    var hasTopArrowClass = !firstItemVisible ? _tokens.classes.tabsHasTopArrow : undefined;
+    var hasBottomArrowClass = !lastItemVisible ? _tokens.classes.tabsHasBottomArrow : undefined;
+    var clipScrollClass = clip === 'scroll' ? _tokens.classes.tabsClipScroll : undefined;
+    var clipShowAllClass = clip === 'showAll' ? _tokens.classes.tabsClipShowAll : undefined;
+    var scrollRef = (0, _react.useRef)(null);
+    var trackRef = (0, _react.useRef)(null);
+    var upArrowRef = (0, _react.useRef)(null);
+    var onPrev = (0, _react.useCallback)(function () {
+      var _firstOverflowingTab$;
+      if (disabled || !scrollRef.current) {
+        return;
+      }
+      var scrollTop = Math.round(scrollRef.current.scrollTop);
+      var firstOverflowingTab = refs.items.slice().reverse().find(function (item) {
+        if (!item.current || item.current.offsetTop === undefined) {
+          return;
+        }
+        var tabStartY = item.current.offsetTop;
+        return tabStartY < scrollTop;
+      });
+      firstOverflowingTab === null || firstOverflowingTab === void 0 || (_firstOverflowingTab$ = firstOverflowingTab.current) === null || _firstOverflowingTab$ === void 0 || _firstOverflowingTab$.scrollIntoView({
+        block: 'nearest',
+        inline: 'nearest'
+      });
+    }, [disabled, scrollRef, refs]);
+    var onNext = (0, _react.useCallback)(function () {
+      var _lastOverflowingTab$c;
+      if (disabled || !scrollRef.current) {
+        return;
+      }
+      var scrollBottom = Math.round(scrollRef.current.scrollTop + scrollRef.current.clientHeight);
+      var lastOverflowingTab = refs.items.find(function (item) {
+        if (!item.current || item.current.offsetTop === undefined) {
+          return;
+        }
+        var tabEndY = item.current.offsetTop + item.current.offsetHeight;
+        return tabEndY > scrollBottom;
+      });
+      lastOverflowingTab === null || lastOverflowingTab === void 0 || (_lastOverflowingTab$c = lastOverflowingTab.current) === null || _lastOverflowingTab$c === void 0 || _lastOverflowingTab$c.scrollIntoView({
+        block: 'nearest',
+        inline: 'nearest'
+      });
+    }, [disabled, scrollRef, refs]);
+    var PreviousButton = /*#__PURE__*/_react["default"].createElement(_VerticalTabs.StyledArrow, {
+      type: "button",
+      "aria-label": "\u041F\u0440\u0435\u0434\u044B\u0434\u0443\u0449\u0438\u0439 \u0442\u0430\u0431",
+      onClick: onPrev,
+      tabIndex: disabled ? -1 : 0,
+      disabled: disabled,
+      ref: upArrowRef
+    }, /*#__PURE__*/_react["default"].createElement(_Icon.IconDisclosureLeft, {
+      color: "var(".concat(_tokens.tokens.arrowColor, ")")
+    }));
+    var NextButton = /*#__PURE__*/_react["default"].createElement(_VerticalTabs.StyledArrow, {
+      type: "button",
+      "aria-label": "\u0421\u043B\u0435\u0434\u0443\u044E\u0449\u0438\u0439 \u0442\u0430\u0431",
+      onClick: onNext,
+      tabIndex: disabled ? -1 : 0,
+      disabled: disabled
+    }, /*#__PURE__*/_react["default"].createElement(_Icon.IconDisclosureRight, {
+      color: "var(".concat(_tokens.tokens.arrowColor, ")")
+    }));
+    var handleScroll = (0, _react.useCallback)(function (event) {
+      event.stopPropagation();
+      var maxScrollTop = event.currentTarget.scrollHeight - event.currentTarget.clientHeight;
+      var scrollTop = Math.round(event.currentTarget.scrollTop);
+      setFirstItemVisible(scrollTop <= 0);
+      setLastItemVisible(scrollTop >= maxScrollTop);
+    }, [setFirstItemVisible, setLastItemVisible]);
+    var onKeyDown = (0, _react.useCallback)(function (event) {
+      if (index === undefined) {
+        return;
+      }
+      var minIndex = 0;
+      var maxIndex = refs.items.length - 1;
+      var nextIndex;
+      switch (event.keyCode) {
+        case Keys.end:
+          nextIndex = maxIndex;
+          break;
+        case Keys.up:
+          nextIndex = index > minIndex ? index - 1 : index;
+          break;
+        case Keys.down:
+          nextIndex = index < maxIndex ? index + 1 : index;
+          break;
+        case Keys.home:
+          nextIndex = minIndex;
+          break;
+        default:
+          return;
+      }
+      if (nextIndex !== index) {
+        var _refs$items$nextIndex, _refs$items$nextIndex2;
+        event.preventDefault();
+        (_refs$items$nextIndex = refs.items[nextIndex].current) === null || _refs$items$nextIndex === void 0 || _refs$items$nextIndex.focus();
+        (_refs$items$nextIndex2 = refs.items[nextIndex].current) === null || _refs$items$nextIndex2 === void 0 || _refs$items$nextIndex2.scrollIntoView({
+          block: 'center',
+          inline: 'center',
+          behavior: 'smooth'
+        });
+      }
+    }, [index]);
+    (0, _react.useEffect)(function () {
+      var _scrollRef$current, _scrollRef$current2;
+      setLastItemVisible(((_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 ? void 0 : _scrollRef$current.scrollHeight) === ((_scrollRef$current2 = scrollRef.current) === null || _scrollRef$current2 === void 0 ? void 0 : _scrollRef$current2.clientHeight));
+    }, []);
+
+    // Этот хук компенсирует появление верхней стрелки при прокрутке
+    (0, _react.useEffect)(function () {
+      if (firstItemVisible || !scrollRef.current || !upArrowRef.current) {
+        return;
+      }
+      scrollRef.current.scrollTo({
+        top: Math.round(scrollRef.current.scrollTop + upArrowRef.current.clientHeight)
+      });
+    }, [firstItemVisible, scrollRef, upArrowRef]);
+    return /*#__PURE__*/_react["default"].createElement(_TabsContext.TabsContext.Provider, {
+      value: refs
+    }, /*#__PURE__*/_react["default"].createElement(Root, _extends({
+      view: view,
+      role: "tablist",
+      size: size,
+      id: tabsId,
+      ref: outerRef,
+      disabled: disabled,
+      className: (0, _utils.cx)(hasTopArrowClass, hasBottomArrowClass, noDividerClass, className),
+      onKeyDown: onKeyDown,
+      orientation: orientation
+    }, rest), !firstItemVisible && PreviousButton, /*#__PURE__*/_react["default"].createElement(_VerticalTabs.StyledContentWrapper, {
+      className: (0, _utils.cx)(clipScrollClass, clipShowAllClass),
+      ref: scrollRef,
+      onScroll: handleScroll
+    }, /*#__PURE__*/_react["default"].createElement(_VerticalTabs.StyledContent, {
+      ref: trackRef
+    }, children)), !lastItemVisible && NextButton));
+  });
+};
+var verticalTabsConfig = exports.verticalTabsConfig = {
+  name: 'VerticalTabs',
+  tag: 'div',
+  layout: verticalTabsRoot,
+  base: _VerticalTabs.base,
+  variations: {
+    size: {
+      css: _base.base
+    },
+    view: {
+      css: _base2.base
+    },
+    disabled: {
+      css: _base3.base,
+      attrs: true
+    }
+  },
+  defaults: {
+    view: 'divider',
+    size: 'xs'
+  }
+};