@semcore/tab-line 16.0.11 → 17.0.0-prerelease.18

package/lib/cjs/index.js

@@ -1,14 +1,14 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 var _exportNames = {};
 Object.defineProperty(exports, "default", {
   enumerable: true,
-  get: function get() {
-    return _TabLine["default"];
+  get: function () {
+    return _TabLine.default;
   }
 });
 var _TabLine = _interopRequireWildcard(require("./TabLine"));
@@ -18,7 +18,7 @@ Object.keys(_TabLine).forEach(function (key) {
   if (key in exports && exports[key] === _TabLine[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
-    get: function get() {
+    get: function () {
       return _TabLine[key];
     }
   });

package/lib/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_TabLine","_interopRequireWildcard","require","Object","keys","forEach","key","prototype","hasOwnProperty","call","_exportNames","exports","defineProperty","enumerable","get"],"sources":["../../src/index.js"],"sourcesContent":["export { default } from './TabLine';\nexport * from './TabLine';\n"],"mappings":";;;;;;;;;;;;;AAAA,IAAAA,QAAA,GAAAC,uBAAA,CAAAC,OAAA;AACAC,MAAA,CAAAC,IAAA,CAAAJ,QAAA,EAAAK,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAN,QAAA,CAAAM,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAd,QAAA,CAAAM,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}
+{"version":3,"file":"index.js","names":["_TabLine","_interopRequireWildcard","require","Object","keys","forEach","key","prototype","hasOwnProperty","call","_exportNames","exports","defineProperty","enumerable","get"],"sources":["../../src/index.js"],"sourcesContent":["export { default } from './TabLine';\nexport * from './TabLine';\n"],"mappings":";;;;;;;;;;;;;AAAA,IAAAA,QAAA,GAAAC,uBAAA,CAAAC,OAAA;AACAC,MAAA,CAAAC,IAAA,CAAAJ,QAAA,EAAAK,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAN,QAAA,CAAAM,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAd,QAAA,CAAAM,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/lib/cjs/style/tab-line.shadow.css

@@ -97,13 +97,6 @@ STabLineItem[disabled] {
   pointer-events: none;
 }
 
-SText {
-  display: inline-block;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
 SAddon {
   display: inline-flex;
   align-items: center;
@@ -113,21 +106,11 @@ SAddon {
 STabLineItem[size='m'] {
   height: 28px;
   min-width: 18px;
-
-  & SText {
-    font-size: var(--intergalactic-fs-200, 14px);
-    line-height: var(--intergalactic-lh-200, 142%);
-  }
 }
 
 STabLineItem[size='l'] {
   height: 40px;
   min-width: 26px;
-
-  & SText {
-    font-size: var(--intergalactic-fs-300, 16px);
-    line-height: var(--intergalactic-lh-300, 150%);
-  }
 }
 
 STabLineItem[neighborLocation='left'] {

package/lib/es6/TabLine.js

@@ -1,38 +1,33 @@
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _callSuper from "@babel/runtime/helpers/callSuper";
-import _inherits from "@babel/runtime/helpers/inherits";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { sstyled as _sstyled } from "@semcore/core";
 import { assignProps as _assignProps4 } from "@semcore/core";
 import { assignProps as _assignProps3 } from "@semcore/core";
 import { assignProps as _assignProps2 } from "@semcore/core";
 import { assignProps as _assignProps } from "@semcore/core";
+import { NeighborLocation, Box } from '@semcore/base-components';
 import { createComponent, Component, sstyled, Root } from '@semcore/core';
 import addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';
 import a11yEnhance from '@semcore/core/lib/utils/enhances/a11yEnhance';
-import { Box } from '@semcore/flex-box';
-import NeighborLocation from '@semcore/neighbor-location';
+import { Text as UikitText } from '@semcore/typography';
 import React from 'react';
 /*!__reshadow-styles__:"./style/tab-line.shadow.css"*/
-var style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___STabLine_1y535_gg_{position:relative;display:flex;width:100%;max-width:100%}.___STabLine_1y535_gg_.__underlined_1y535_gg_{border-bottom:1px solid var(--intergalactic-border-primary, #c4c7cf)}.___STabLineItem_1y535_gg_{display:inline-flex;align-items:center;justify-content:center;position:relative;touch-action:manipulation;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;box-shadow:none;-webkit-text-decoration:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;text-align:center;vertical-align:middle;font-family:inherit;cursor:pointer;border:0;background:0 0;color:var(--intergalactic-text-primary, #191b23);margin-right:var(--intergalactic-spacing-4x, 16px);font-weight:var(--intergalactic-medium, 500)}.___STabLineItem_1y535_gg_::-moz-focus-inner{border:0;padding:0}.___STabLineItem_1y535_gg_:active{-webkit-text-decoration:none;text-decoration:none}@media (hover:hover){.___STabLineItem_1y535_gg_:hover{-webkit-text-decoration:none;text-decoration:none}}.___STabLineItem_1y535_gg_::after,.___STabLineItem_1y535_gg_::before{content:\"\";position:absolute;left:0;bottom:-1px;height:3px;width:100%;background-color:transparent}.___STabLineItem_1y535_gg_::before{transition:background-color calc(var(--intergalactic-duration-control, 200)*1ms) ease-in-out}@media (hover:hover){.___STabLineItem_1y535_gg_:hover::before{background-color:var(--intergalactic-border-primary, #c4c7cf)}}.___STabLineItem_1y535_gg_.__selected_1y535_gg_::after{transition-delay:calc(var(--intergalactic-duration-control, 200)*1ms);background-color:var(--intergalactic-border-info-active, #006dca)}.___STabLineItem_1y535_gg_ .___SAddon_1y535_gg_:not(:last-child),.___STabLineItem_1y535_gg_ .___SText_1y535_gg_:not(:last-child){margin-right:var(--intergalactic-spacing-2x, 8px)}.___SCaret_1y535_gg_{position:absolute;bottom:-1px;height:3px;background:var(--intergalactic-border-info-active, #006dca);transition:calc(var(--intergalactic-duration-control, 200)*1ms) all ease-in-out}.___STabLineItem_1y535_gg_.__selected_1y535_gg_{flex-shrink:0}.___STabLineItem_1y535_gg_.__disabled_1y535_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SText_1y535_gg_{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.___SAddon_1y535_gg_{display:inline-flex;align-items:center;justify-content:center}.___STabLineItem_1y535_gg_._size_m_1y535_gg_{height:28px;min-width:18px}.___STabLineItem_1y535_gg_._size_m_1y535_gg_ .___SText_1y535_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___STabLineItem_1y535_gg_._size_l_1y535_gg_{height:40px;min-width:26px}.___STabLineItem_1y535_gg_._size_l_1y535_gg_ .___SText_1y535_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___STabLineItem_1y535_gg_._neighborLocation_left_1y535_gg_{margin-right:0}@media (prefers-reduced-motion){.___STabLineItem_1y535_gg_.__selected_1y535_gg_::after,.___STabLineItem_1y535_gg_::after,.___STabLineItem_1y535_gg_::before{transition:none}.___SCaret_1y535_gg_{display:none}}", /*__inner_css_end__*/"1y535_gg_"),
+const style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___STabLine_1i3e2_gg_{position:relative;display:flex;width:100%;max-width:100%}.___STabLine_1i3e2_gg_.__underlined_1i3e2_gg_{border-bottom:1px solid var(--intergalactic-border-primary, #c4c7cf)}.___STabLineItem_1i3e2_gg_{display:inline-flex;align-items:center;justify-content:center;position:relative;touch-action:manipulation;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;box-shadow:none;-webkit-text-decoration:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;text-align:center;vertical-align:middle;font-family:inherit;cursor:pointer;border:0;background:0 0;color:var(--intergalactic-text-primary, #191b23);margin-right:var(--intergalactic-spacing-4x, 16px);font-weight:var(--intergalactic-medium, 500)}.___STabLineItem_1i3e2_gg_::-moz-focus-inner{border:0;padding:0}.___STabLineItem_1i3e2_gg_:active{-webkit-text-decoration:none;text-decoration:none}@media (hover:hover){.___STabLineItem_1i3e2_gg_:hover{-webkit-text-decoration:none;text-decoration:none}}.___STabLineItem_1i3e2_gg_::after,.___STabLineItem_1i3e2_gg_::before{content:\"\";position:absolute;left:0;bottom:-1px;height:3px;width:100%;background-color:transparent}.___STabLineItem_1i3e2_gg_::before{transition:background-color calc(var(--intergalactic-duration-control, 200)*1ms) ease-in-out}@media (hover:hover){.___STabLineItem_1i3e2_gg_:hover::before{background-color:var(--intergalactic-border-primary, #c4c7cf)}}.___STabLineItem_1i3e2_gg_.__selected_1i3e2_gg_::after{transition-delay:calc(var(--intergalactic-duration-control, 200)*1ms);background-color:var(--intergalactic-border-info-active, #006dca)}.___STabLineItem_1i3e2_gg_ .___SAddon_1i3e2_gg_:not(:last-child),.___STabLineItem_1i3e2_gg_ .___SText_1i3e2_gg_:not(:last-child){margin-right:var(--intergalactic-spacing-2x, 8px)}.___SCaret_1i3e2_gg_{position:absolute;bottom:-1px;height:3px;background:var(--intergalactic-border-info-active, #006dca);transition:calc(var(--intergalactic-duration-control, 200)*1ms) all ease-in-out}.___STabLineItem_1i3e2_gg_.__selected_1i3e2_gg_{flex-shrink:0}.___STabLineItem_1i3e2_gg_.__disabled_1i3e2_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SAddon_1i3e2_gg_{display:inline-flex;align-items:center;justify-content:center}.___STabLineItem_1i3e2_gg_._size_m_1i3e2_gg_{height:28px;min-width:18px}.___STabLineItem_1i3e2_gg_._size_l_1i3e2_gg_{height:40px;min-width:26px}.___STabLineItem_1i3e2_gg_._neighborLocation_left_1i3e2_gg_{margin-right:0}@media (prefers-reduced-motion){.___STabLineItem_1i3e2_gg_.__selected_1i3e2_gg_::after,.___STabLineItem_1i3e2_gg_::after,.___STabLineItem_1i3e2_gg_::before{transition:none}.___SCaret_1i3e2_gg_{display:none}}", /*__inner_css_end__*/"1i3e2_gg_"),
 /*__reshadow_css_end__*/
 {
-  "__STabLine": "___STabLine_1y535_gg_",
-  "_underlined": "__underlined_1y535_gg_",
-  "__SCaret": "___SCaret_1y535_gg_",
-  "__STabLineItem": "___STabLineItem_1y535_gg_",
-  "_selected": "__selected_1y535_gg_",
-  "_disabled": "__disabled_1y535_gg_",
-  "__SText": "___SText_1y535_gg_",
-  "__SAddon": "___SAddon_1y535_gg_",
-  "_neighborLocation_left": "_neighborLocation_left_1y535_gg_",
-  "_size_m": "_size_m_1y535_gg_",
-  "_size_l": "_size_l_1y535_gg_"
+  "__STabLine": "___STabLine_1i3e2_gg_",
+  "_underlined": "__underlined_1i3e2_gg_",
+  "__SCaret": "___SCaret_1i3e2_gg_",
+  "__STabLineItem": "___STabLineItem_1i3e2_gg_",
+  "_selected": "__selected_1i3e2_gg_",
+  "_disabled": "__disabled_1i3e2_gg_",
+  "__SAddon": "___SAddon_1i3e2_gg_",
+  "_size_m": "_size_m_1i3e2_gg_",
+  "_size_l": "_size_l_1i3e2_gg_",
+  "_neighborLocation_left": "_neighborLocation_left_1i3e2_gg_",
+  "__SText": "___SText_1i3e2_gg_"
 });
-var optionsA11yEnhance = {
-  onNeighborChange: function onNeighborChange(neighborElement, props) {
+const optionsA11yEnhance = {
+  onNeighborChange: (neighborElement, props) => {
     if (neighborElement) {
       neighborElement.focus();
       if (props.behavior === 'auto') {
@@ -42,155 +37,152 @@ var optionsA11yEnhance = {
   },
   childSelector: ['role', 'tab']
 };
-var TabLineRoot = /*#__PURE__*/function (_Component) {
-  function TabLineRoot() {
-    var _this;
-    _classCallCheck(this, TabLineRoot);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _callSuper(this, TabLineRoot, [].concat(args));
-    _defineProperty(_this, "state", {
+class TabLineRoot extends Component {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "state", {
       animation: null
     });
-    _defineProperty(_this, "prevValue", undefined);
-    _defineProperty(_this, "itemRefs", {});
-    _defineProperty(_this, "containerRef", /*#__PURE__*/React.createRef());
-    _defineProperty(_this, "animationStartTimeout", -1);
-    _defineProperty(_this, "handleAnimationStart", function () {
-      var _this$state$animation;
-      if (((_this$state$animation = _this.state.animation) === null || _this$state$animation === void 0 ? void 0 : _this$state$animation.started) === false) {
-        _this.setState({
-          animation: _objectSpread(_objectSpread({}, _this.state.animation), {}, {
+    _defineProperty(this, "prevValue", undefined);
+    _defineProperty(this, "itemRefs", {});
+    _defineProperty(this, "containerRef", /*#__PURE__*/React.createRef());
+    _defineProperty(this, "animationStartTimeout", -1);
+    _defineProperty(this, "buttonRefsList", []);
+    _defineProperty(this, "handleAnimationStart", () => {
+      if (this.state.animation?.started === false) {
+        this.setState({
+          animation: {
+            ...this.state.animation,
             started: true
-          })
+          }
         });
       }
     });
-    _defineProperty(_this, "handleAnimationEnd", function () {
-      _this.setState({
+    _defineProperty(this, "handleAnimationEnd", () => {
+      this.setState({
         animation: null
       });
     });
-    _defineProperty(_this, "bindHandlerClick", function (value) {
-      return function (e) {
-        _this.handlers.value(value, e);
-      };
+    _defineProperty(this, "bindHandlerClick", value => e => {
+      this.handlers.value(value, e);
     });
-    return _this;
   }
-  _inherits(TabLineRoot, _Component);
-  return _createClass(TabLineRoot, [{
-    key: "uncontrolledProps",
-    value: function uncontrolledProps() {
-      return {
-        value: null
-      };
-    }
-  }, {
-    key: "componentDidUpdate",
-    value: function componentDidUpdate() {
-      if (this.prevValue !== null && this.asProps.value !== null && this.prevValue !== this.asProps.value) {
-        this.animate();
-      }
-      this.prevValue = this.asProps.value;
-    }
-  }, {
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      this.prevValue = this.asProps.value;
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      clearTimeout(this.animationStartTimeout);
+  uncontrolledProps() {
+    return {
+      value: null
+    };
+  }
+  componentDidUpdate() {
+    if (this.prevValue !== null && this.asProps.value !== null && this.prevValue !== this.asProps.value) {
+      this.animate();
     }
-  }, {
-    key: "animate",
-    value: function animate() {
-      var fromNode = this.itemRefs[this.prevValue];
-      var toNode = this.itemRefs[this.asProps.value];
-      var containerNode = this.containerRef.current;
-      if (!fromNode || !toNode || !containerNode) return;
-      var containerRect = containerNode.getBoundingClientRect();
-      var fromRect = fromNode.getBoundingClientRect();
-      var toRect = toNode.getBoundingClientRect();
-      var animation = {
-        fromLeft: fromRect.x - containerRect.x,
-        fromWidth: fromRect.width,
-        toLeft: toRect.x - containerRect.x,
-        toWidth: toRect.width,
-        started: false
+    this.prevValue = this.asProps.value;
+  }
+  componentDidMount() {
+    this.prevValue = this.asProps.value;
+  }
+  componentWillUnmount() {
+    clearTimeout(this.animationStartTimeout);
+  }
+  animate() {
+    const fromNode = this.itemRefs[this.prevValue];
+    const toNode = this.itemRefs[this.asProps.value];
+    const containerNode = this.containerRef.current;
+    if (!fromNode || !toNode || !containerNode) return;
+    const containerRect = containerNode.getBoundingClientRect();
+    const fromRect = fromNode.getBoundingClientRect();
+    const toRect = toNode.getBoundingClientRect();
+    const animation = {
+      fromLeft: fromRect.x - containerRect.x,
+      fromWidth: fromRect.width,
+      toLeft: toRect.x - containerRect.x,
+      toWidth: toRect.width,
+      started: false
+    };
+    this.setState({
+      animation
+    });
+    clearTimeout(this.animationStartTimeout);
+    this.animationStartTimeout = setTimeout(this.handleAnimationStart, 0);
+  }
+  getItemProps(props, index) {
+    const {
+      value,
+      size
+    } = this.asProps;
+    const isSelected = value === props.value;
+    return {
+      size,
+      'selected': isSelected,
+      'onClick': this.bindHandlerClick(props.value),
+      'tabIndex': isSelected ? 0 : -1,
+      'aria-selected': isSelected,
+      'ref': node => {
+        this.itemRefs[props.value] = node;
+      },
+      'buttonRefsList': this.buttonRefsList,
+      index
+    };
+  }
+  getItemTextProps(props, index) {
+    const {
+      size: tabLineSize
+    } = this.asProps;
+    const size = props.size ? props.size : tabLineSize === 'm' ? 200 : 300;
+    return {
+      size,
+      buttonRefsList: this.buttonRefsList,
+      index
+    };
+  }
+  getCaretProps() {
+    const {
+      animation
+    } = this.state;
+    if (!animation) return {};
+    if (animation.started) {
+      return {
+        style: {
+          left: animation.toLeft,
+          width: animation.toWidth
+        },
+        onTransitionEnd: this.handleAnimationEnd
       };
-      this.setState({
-        animation: animation
-      });
-      clearTimeout(this.animationStartTimeout);
-      this.animationStartTimeout = setTimeout(this.handleAnimationStart, 0);
-    }
-  }, {
-    key: "getItemProps",
-    value: function getItemProps(props, _index) {
-      var _this2 = this;
-      var _this$asProps = this.asProps,
-        value = _this$asProps.value,
-        size = _this$asProps.size;
-      var isSelected = value === props.value;
+    } else {
       return {
-        size: size,
-        'selected': isSelected,
-        'onClick': this.bindHandlerClick(props.value),
-        'tabIndex': isSelected ? 0 : -1,
-        'aria-selected': isSelected,
-        'ref': function ref(node) {
-          _this2.itemRefs[props.value] = node;
-        }
+        style: {
+          left: animation.fromLeft,
+          width: animation.fromWidth
+        },
+        onTransitionEnd: this.handleAnimationEnd
       };
     }
-  }, {
-    key: "getCaretProps",
-    value: function getCaretProps() {
-      var animation = this.state.animation;
-      if (!animation) return {};
-      if (animation.started) {
-        return {
-          style: {
-            left: animation.toLeft,
-            width: animation.toWidth
-          },
-          onTransitionEnd: this.handleAnimationEnd
-        };
-      } else {
-        return {
-          style: {
-            left: animation.fromLeft,
-            width: animation.fromWidth
-          },
-          onTransitionEnd: this.handleAnimationEnd
-        };
-      }
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _ref = this.asProps,
-        _ref5;
-      var STabLine = Box;
-      var SCaret = Box;
-      var _this$asProps2 = this.asProps,
-        styles = _this$asProps2.styles,
-        Children = _this$asProps2.Children,
-        controlsLength = _this$asProps2.controlsLength;
-      var animation = this.state.animation;
-      return _ref5 = sstyled(styles), /*#__PURE__*/React.createElement(STabLine, _ref5.cn("STabLine", _objectSpread({}, _assignProps({
+  }
+  render() {
+    var _ref = this.asProps,
+      _ref5;
+    const STabLine = Box;
+    const SCaret = Box;
+    const {
+      styles,
+      Children,
+      controlsLength
+    } = this.asProps;
+    const {
+      animation
+    } = this.state;
+    return _ref5 = sstyled(styles), /*#__PURE__*/React.createElement(STabLine, _ref5.cn("STabLine", {
+      ..._assignProps({
         "role": 'tablist',
         "ref": this.containerRef
-      }, _ref))), /*#__PURE__*/React.createElement(NeighborLocation, _ref5.cn("NeighborLocation", {
-        "controlsLength": controlsLength
-      }), /*#__PURE__*/React.createElement(Children, _ref5.cn("Children", {}))), animation && /*#__PURE__*/React.createElement(SCaret, _ref5.cn("SCaret", _objectSpread({}, this.getCaretProps()))));
-    }
-  }]);
-}(Component);
+      }, _ref)
+    }), /*#__PURE__*/React.createElement(NeighborLocation, _ref5.cn("NeighborLocation", {
+      "controlsLength": controlsLength
+    }), /*#__PURE__*/React.createElement(Children, _ref5.cn("Children", {}))), animation && /*#__PURE__*/React.createElement(SCaret, _ref5.cn("SCaret", {
+      ...this.getCaretProps()
+    })));
+  }
+}
 _defineProperty(TabLineRoot, "displayName", 'TabLine');
 _defineProperty(TabLineRoot, "style", style);
 _defineProperty(TabLineRoot, "defaultProps", {
@@ -202,23 +194,32 @@ _defineProperty(TabLineRoot, "defaultProps", {
 _defineProperty(TabLineRoot, "enhance", [a11yEnhance(optionsA11yEnhance)]);
 function TabLineItem(props) {
   var _ref2 = arguments[0];
-  var STabLineItem = Box;
-  var Children = props.Children,
-    styles = props.styles,
-    addonLeft = props.addonLeft,
-    addonRight = props.addonRight,
-    neighborLocation = props.neighborLocation;
+  const STabLineItem = Box;
+  const {
+    Children,
+    styles,
+    addonLeft,
+    addonRight,
+    neighborLocation,
+    buttonRefsList,
+    index
+  } = props;
+  const buttonRef = React.useRef();
+  buttonRefsList[index] = buttonRef;
   return /*#__PURE__*/React.createElement(NeighborLocation.Detect, {
     neighborLocation: neighborLocation
-  }, function (neighborLocation) {
+  }, neighborLocation => {
     var _ref6;
-    return _ref6 = sstyled(styles), /*#__PURE__*/React.createElement(STabLineItem, _ref6.cn("STabLineItem", _objectSpread({}, _assignProps2({
-      "tag": 'button',
-      "tabIndex": 0,
-      "neighborLocation": neighborLocation,
-      "type": 'button',
-      "role": 'tab'
-    }, _ref2))), addonLeft ? /*#__PURE__*/React.createElement(TabLine.Item.Addon, {
+    return _ref6 = sstyled(styles), /*#__PURE__*/React.createElement(STabLineItem, _ref6.cn("STabLineItem", {
+      ..._assignProps2({
+        "tag": 'button',
+        "tabIndex": 0,
+        "neighborLocation": neighborLocation,
+        "type": 'button',
+        "role": 'tab',
+        "ref": buttonRef
+      }, _ref2)
+    }), addonLeft ? /*#__PURE__*/React.createElement(TabLine.Item.Addon, {
       tag: addonLeft
     }) : null, addonTextChildren(Children, TabLine.Item.Text, TabLine.Item.Addon), addonRight ? /*#__PURE__*/React.createElement(TabLine.Item.Addon, {
       tag: addonRight
@@ -228,29 +229,45 @@ function TabLineItem(props) {
 function Text(props) {
   var _ref3 = arguments[0],
     _ref7;
-  var styles = props.styles;
-  var SText = Box;
-  return _ref7 = sstyled(styles), /*#__PURE__*/React.createElement(SText, _ref7.cn("SText", _objectSpread({}, _assignProps3({
-    "tag": 'span'
-  }, _ref3))));
+  const {
+    styles,
+    ellipsis = true,
+    size,
+    buttonRefsList,
+    index,
+    hintProps = {}
+  } = props;
+  const SText = UikitText;
+  return _ref7 = sstyled(styles), /*#__PURE__*/React.createElement(SText, _ref7.cn("SText", {
+    ..._assignProps3({
+      "ellipsis": ellipsis,
+      "size": size,
+      "use:hintProps": {
+        triggerRef: buttonRefsList[index],
+        ...hintProps
+      }
+    }, _ref3)
+  }));
 }
 function Addon(props) {
   var _ref4 = arguments[0],
     _ref8;
-  var styles = props.styles;
-  var SAddon = Box;
-  return _ref8 = sstyled(styles), /*#__PURE__*/React.createElement(SAddon, _ref8.cn("SAddon", _objectSpread({}, _assignProps4({
-    "tag": 'span'
-  }, _ref4))));
+  const {
+    styles
+  } = props;
+  const SAddon = Box;
+  return _ref8 = sstyled(styles), /*#__PURE__*/React.createElement(SAddon, _ref8.cn("SAddon", {
+    ..._assignProps4({
+      "tag": 'span'
+    }, _ref4)
+  }));
 }
-var TabLine = createComponent(TabLineRoot, {
+const TabLine = createComponent(TabLineRoot, {
   Item: [TabLineItem, {
-    Text: Text,
-    Addon: Addon
+    Text,
+    Addon
   }]
 });
-export var wrapTabLine = function wrapTabLine(wrapper) {
-  return wrapper;
-};
+export const wrapTabLine = wrapper => wrapper;
 export default TabLine;
 //# sourceMappingURL=TabLine.js.map

package/lib/es6/TabLine.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabLine.js","names":["createComponent","Component","sstyled","Root","addonTextChildren","a11yEnhance","Box","NeighborLocation","React","style","_sstyled","insert","optionsA11yEnhance","onNeighborChange","neighborElement","props","focus","behavior","click","childSelector","TabLineRoot","_Component","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","concat","_defineProperty","animation","undefined","createRef","_this$state$animation","state","started","setState","_objectSpread","value","e","handlers","_inherits","_createClass","key","uncontrolledProps","componentDidUpdate","prevValue","asProps","animate","componentDidMount","componentWillUnmount","clearTimeout","animationStartTimeout","fromNode","itemRefs","toNode","containerNode","containerRef","current","containerRect","getBoundingClientRect","fromRect","toRect","fromLeft","x","fromWidth","width","toLeft","toWidth","setTimeout","handleAnimationStart","getItemProps","_index","_this2","_this$asProps","size","isSelected","bindHandlerClick","ref","node","getCaretProps","left","onTransitionEnd","handleAnimationEnd","render","_ref","_ref5","STabLine","SCaret","_this$asProps2","styles","Children","controlsLength","createElement","cn","_assignProps","defaultValue","underlined","TabLineItem","_ref2","arguments[0]","STabLineItem","addonLeft","addonRight","neighborLocation","Detect","_ref6","_assignProps2","TabLine","Item","Addon","tag","Text","_ref3","_ref7","SText","_assignProps3","_ref4","_ref8","SAddon","_assignProps4","wrapTabLine","wrapper"],"sources":["../../src/TabLine.jsx"],"sourcesContent":["import { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';\nimport a11yEnhance from '@semcore/core/lib/utils/enhances/a11yEnhance';\nimport { Box } from '@semcore/flex-box';\nimport NeighborLocation from '@semcore/neighbor-location';\nimport React from 'react';\n\nimport style from './style/tab-line.shadow.css';\n\nconst optionsA11yEnhance = {\n  onNeighborChange: (neighborElement, props) => {\n    if (neighborElement) {\n      neighborElement.focus();\n      if (props.behavior === 'auto') {\n        neighborElement.click();\n      }\n    }\n  },\n  childSelector: ['role', 'tab'],\n};\n\nclass TabLineRoot extends Component {\n  static displayName = 'TabLine';\n  static style = style;\n  static defaultProps = {\n    defaultValue: null,\n    size: 'm',\n    underlined: true,\n    behavior: 'auto',\n  };\n\n  static enhance = [a11yEnhance(optionsA11yEnhance)];\n  state = { animation: null };\n  prevValue = undefined;\n  itemRefs = {};\n  containerRef = React.createRef();\n  animationStartTimeout = -1;\n\n  uncontrolledProps() {\n    return {\n      value: null,\n    };\n  }\n\n  componentDidUpdate() {\n    if (\n      this.prevValue !== null &&\n      this.asProps.value !== null &&\n      this.prevValue !== this.asProps.value\n    ) {\n      this.animate();\n    }\n    this.prevValue = this.asProps.value;\n  }\n\n  componentDidMount() {\n    this.prevValue = this.asProps.value;\n  }\n\n  componentWillUnmount() {\n    clearTimeout(this.animationStartTimeout);\n  }\n\n  animate() {\n    const fromNode = this.itemRefs[this.prevValue];\n    const toNode = this.itemRefs[this.asProps.value];\n    const containerNode = this.containerRef.current;\n\n    if (!fromNode || !toNode || !containerNode) return;\n    const containerRect = containerNode.getBoundingClientRect();\n    const fromRect = fromNode.getBoundingClientRect();\n    const toRect = toNode.getBoundingClientRect();\n    const animation = {\n      fromLeft: fromRect.x - containerRect.x,\n      fromWidth: fromRect.width,\n      toLeft: toRect.x - containerRect.x,\n      toWidth: toRect.width,\n      started: false,\n    };\n    this.setState({ animation });\n    clearTimeout(this.animationStartTimeout);\n    this.animationStartTimeout = setTimeout(this.handleAnimationStart, 0);\n  }\n\n  handleAnimationStart = () => {\n    if (this.state.animation?.started === false) {\n      this.setState({ animation: { ...this.state.animation, started: true } });\n    }\n  };\n\n  handleAnimationEnd = () => {\n    this.setState({ animation: null });\n  };\n\n  bindHandlerClick = (value) => (e) => {\n    this.handlers.value(value, e);\n  };\n\n  getItemProps(props, _index) {\n    const { value, size } = this.asProps;\n    const isSelected = value === props.value;\n    return {\n      size,\n      'selected': isSelected,\n      'onClick': this.bindHandlerClick(props.value),\n      'tabIndex': isSelected ? 0 : -1,\n      'aria-selected': isSelected,\n      'ref': (node) => {\n        this.itemRefs[props.value] = node;\n      },\n    };\n  }\n\n  getCaretProps() {\n    const { animation } = this.state;\n    if (!animation) return {};\n    if (animation.started) {\n      return {\n        style: {\n          left: animation.toLeft,\n          width: animation.toWidth,\n        },\n        onTransitionEnd: this.handleAnimationEnd,\n      };\n    } else {\n      return {\n        style: {\n          left: animation.fromLeft,\n          width: animation.fromWidth,\n        },\n        onTransitionEnd: this.handleAnimationEnd,\n      };\n    }\n  }\n\n  render() {\n    const STabLine = Root;\n    const SCaret = Box;\n    const { styles, Children, controlsLength } = this.asProps;\n    const { animation } = this.state;\n\n    return sstyled(styles)(\n      <STabLine render={Box} role='tablist' ref={this.containerRef}>\n        <NeighborLocation controlsLength={controlsLength}>\n          <Children />\n        </NeighborLocation>\n        {animation && <SCaret {...this.getCaretProps()} />}\n      </STabLine>,\n    );\n  }\n}\n\nfunction TabLineItem(props) {\n  const STabLineItem = Root;\n  const { Children, styles, addonLeft, addonRight, neighborLocation } = props;\n\n  return (\n    <NeighborLocation.Detect neighborLocation={neighborLocation}>\n      {(neighborLocation) =>\n        sstyled(styles)(\n          <STabLineItem\n            render={Box}\n            tag='button'\n            tabIndex={0}\n            neighborLocation={neighborLocation}\n            type='button'\n            role='tab'\n          >\n            {addonLeft ? <TabLine.Item.Addon tag={addonLeft} /> : null}\n            {addonTextChildren(Children, TabLine.Item.Text, TabLine.Item.Addon)}\n            {addonRight ? <TabLine.Item.Addon tag={addonRight} /> : null}\n          </STabLineItem>,\n        )}\n    </NeighborLocation.Detect>\n  );\n}\n\nfunction Text(props) {\n  const { styles } = props;\n  const SText = Root;\n  return sstyled(styles)(<SText render={Box} tag='span' />);\n}\n\nfunction Addon(props) {\n  const { styles } = props;\n  const SAddon = Root;\n  return sstyled(styles)(<SAddon render={Box} tag='span' />);\n}\n\nconst TabLine = createComponent(TabLineRoot, {\n  Item: [TabLineItem, { Text, Addon }],\n});\n\nexport const wrapTabLine = (wrapper) => wrapper;\n\nexport default TabLine;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"TabLine.js","names":["NeighborLocation","Box","createComponent","Component","sstyled","Root","addonTextChildren","a11yEnhance","Text","UikitText","React","style","_sstyled","insert","optionsA11yEnhance","onNeighborChange","neighborElement","props","focus","behavior","click","childSelector","TabLineRoot","constructor","args","_defineProperty","animation","undefined","createRef","state","started","setState","value","e","handlers","uncontrolledProps","componentDidUpdate","prevValue","asProps","animate","componentDidMount","componentWillUnmount","clearTimeout","animationStartTimeout","fromNode","itemRefs","toNode","containerNode","containerRef","current","containerRect","getBoundingClientRect","fromRect","toRect","fromLeft","x","fromWidth","width","toLeft","toWidth","setTimeout","handleAnimationStart","getItemProps","index","size","isSelected","bindHandlerClick","node","buttonRefsList","getItemTextProps","tabLineSize","getCaretProps","left","onTransitionEnd","handleAnimationEnd","render","_ref","_ref5","STabLine","SCaret","styles","Children","controlsLength","createElement","cn","_assignProps","defaultValue","underlined","TabLineItem","_ref2","arguments[0]","STabLineItem","addonLeft","addonRight","neighborLocation","buttonRef","useRef","Detect","_ref6","_assignProps2","TabLine","Item","Addon","tag","_ref3","_ref7","ellipsis","hintProps","SText","_assignProps3","triggerRef","_ref4","_ref8","SAddon","_assignProps4","wrapTabLine","wrapper"],"sources":["../../src/TabLine.jsx"],"sourcesContent":["import { NeighborLocation, Box } from '@semcore/base-components';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';\nimport a11yEnhance from '@semcore/core/lib/utils/enhances/a11yEnhance';\nimport { Text as UikitText } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/tab-line.shadow.css';\n\nconst optionsA11yEnhance = {\n  onNeighborChange: (neighborElement, props) => {\n    if (neighborElement) {\n      neighborElement.focus();\n      if (props.behavior === 'auto') {\n        neighborElement.click();\n      }\n    }\n  },\n  childSelector: ['role', 'tab'],\n};\n\nclass TabLineRoot extends Component {\n  static displayName = 'TabLine';\n  static style = style;\n  static defaultProps = {\n    defaultValue: null,\n    size: 'm',\n    underlined: true,\n    behavior: 'auto',\n  };\n\n  static enhance = [a11yEnhance(optionsA11yEnhance)];\n  state = { animation: null };\n  prevValue = undefined;\n  itemRefs = {};\n  containerRef = React.createRef();\n  animationStartTimeout = -1;\n  buttonRefsList = [];\n\n  uncontrolledProps() {\n    return {\n      value: null,\n    };\n  }\n\n  componentDidUpdate() {\n    if (\n      this.prevValue !== null &&\n      this.asProps.value !== null &&\n      this.prevValue !== this.asProps.value\n    ) {\n      this.animate();\n    }\n    this.prevValue = this.asProps.value;\n  }\n\n  componentDidMount() {\n    this.prevValue = this.asProps.value;\n  }\n\n  componentWillUnmount() {\n    clearTimeout(this.animationStartTimeout);\n  }\n\n  animate() {\n    const fromNode = this.itemRefs[this.prevValue];\n    const toNode = this.itemRefs[this.asProps.value];\n    const containerNode = this.containerRef.current;\n\n    if (!fromNode || !toNode || !containerNode) return;\n    const containerRect = containerNode.getBoundingClientRect();\n    const fromRect = fromNode.getBoundingClientRect();\n    const toRect = toNode.getBoundingClientRect();\n    const animation = {\n      fromLeft: fromRect.x - containerRect.x,\n      fromWidth: fromRect.width,\n      toLeft: toRect.x - containerRect.x,\n      toWidth: toRect.width,\n      started: false,\n    };\n    this.setState({ animation });\n    clearTimeout(this.animationStartTimeout);\n    this.animationStartTimeout = setTimeout(this.handleAnimationStart, 0);\n  }\n\n  handleAnimationStart = () => {\n    if (this.state.animation?.started === false) {\n      this.setState({ animation: { ...this.state.animation, started: true } });\n    }\n  };\n\n  handleAnimationEnd = () => {\n    this.setState({ animation: null });\n  };\n\n  bindHandlerClick = (value) => (e) => {\n    this.handlers.value(value, e);\n  };\n\n  getItemProps(props, index) {\n    const { value, size } = this.asProps;\n    const isSelected = value === props.value;\n    return {\n      size,\n      'selected': isSelected,\n      'onClick': this.bindHandlerClick(props.value),\n      'tabIndex': isSelected ? 0 : -1,\n      'aria-selected': isSelected,\n      'ref': (node) => {\n        this.itemRefs[props.value] = node;\n      },\n      'buttonRefsList': this.buttonRefsList,\n      index,\n    };\n  }\n\n  getItemTextProps(props, index) {\n    const { size: tabLineSize } = this.asProps;\n    const size = props.size\n      ? props.size\n      : tabLineSize === 'm' ? 200 : 300;\n\n    return {\n      size,\n      buttonRefsList: this.buttonRefsList,\n      index,\n    };\n  }\n\n  getCaretProps() {\n    const { animation } = this.state;\n    if (!animation) return {};\n    if (animation.started) {\n      return {\n        style: {\n          left: animation.toLeft,\n          width: animation.toWidth,\n        },\n        onTransitionEnd: this.handleAnimationEnd,\n      };\n    } else {\n      return {\n        style: {\n          left: animation.fromLeft,\n          width: animation.fromWidth,\n        },\n        onTransitionEnd: this.handleAnimationEnd,\n      };\n    }\n  }\n\n  render() {\n    const STabLine = Root;\n    const SCaret = Box;\n    const { styles, Children, controlsLength } = this.asProps;\n    const { animation } = this.state;\n\n    return sstyled(styles)(\n      <STabLine render={Box} role='tablist' ref={this.containerRef}>\n        <NeighborLocation controlsLength={controlsLength}>\n          <Children />\n        </NeighborLocation>\n        {animation && <SCaret {...this.getCaretProps()} />}\n      </STabLine>,\n    );\n  }\n}\n\nfunction TabLineItem(props) {\n  const STabLineItem = Root;\n  const { Children, styles, addonLeft, addonRight, neighborLocation, buttonRefsList, index } = props;\n  const buttonRef = React.useRef();\n\n  buttonRefsList[index] = buttonRef;\n\n  return (\n    <NeighborLocation.Detect neighborLocation={neighborLocation}>\n      {(neighborLocation) =>\n        sstyled(styles)(\n          <STabLineItem\n            render={Box}\n            tag='button'\n            tabIndex={0}\n            neighborLocation={neighborLocation}\n            type='button'\n            role='tab'\n            ref={buttonRef}\n          >\n            {addonLeft ? <TabLine.Item.Addon tag={addonLeft} /> : null}\n            {addonTextChildren(Children, TabLine.Item.Text, TabLine.Item.Addon)}\n            {addonRight ? <TabLine.Item.Addon tag={addonRight} /> : null}\n          </STabLineItem>,\n        )}\n    </NeighborLocation.Detect>\n  );\n}\n\nfunction Text(props) {\n  const { styles, ellipsis = true, size, buttonRefsList, index, hintProps = {} } = props;\n  const SText = Root;\n  return sstyled(styles)(<SText render={UikitText} ellipsis={ellipsis} size={size} use:hintProps={{ triggerRef: buttonRefsList[index], ...hintProps }} />);\n}\n\nfunction Addon(props) {\n  const { styles } = props;\n  const SAddon = Root;\n  return sstyled(styles)(<SAddon render={Box} tag='span' />);\n}\n\nconst TabLine = createComponent(TabLineRoot, {\n  Item: [TabLineItem, { Text, Addon }],\n});\n\nexport const wrapTabLine = (wrapper) => wrapper;\n\nexport default TabLine;\n"],"mappings":"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","ignoreList":[]}

package/lib/es6/index.d.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport type { Box, BoxProps } from '@semcore/flex-box';\nimport type { NeighborItemProps, NeighborLocationProps } from '@semcore/neighbor-location';\nimport type React from 'react';\n\nexport type TabLineValue = string | number | boolean;\n\n/** @deprecated */\nexport interface ITabLineProps<T extends TabLineValue = TabLineValue>\n  extends TabLineProps<T>,\n  UnknownProperties {}\nexport type TabLineProps<T extends TabLineValue = TabLineValue> = BoxProps &\n  NeighborLocationProps & {\n    /** TabLine size\n     * @default m\n     * */\n    size?: 'm' | 'l' | false;\n    /** Adds a bottom border for the entire component\n     * @default true\n     * */\n    underlined?: boolean;\n    /** Is invoked when changing the selection */\n    onChange?:\n      | ((value: T, e?: React.SyntheticEvent<HTMLButtonElement>) => void)\n      | React.Dispatch<React.SetStateAction<T>>;\n    /** Value of the selected tab */\n    value?: T;\n    /** Default value of the selected tab\n     * @default null\n     * */\n    defaultValue?: T;\n\n    /**\n     * Behavior of tabs.\n     * In `auto`, changes the tab immediately when press arrow.\n     * In `manual`, needs to press `space` or `enter` for select a choice.\n     * @default 'auto'\n     */\n    behavior?: 'auto' | 'manual';\n  };\n\n/** @deprecated */\nexport interface ITabLineItemProps extends TabLineItemProps, UnknownProperties {}\nexport type TabLineItemProps = BoxProps &\n  NeighborItemProps & {\n    /** Makes a tab selected. This property is determined automatically depending on the value. */\n    selected?: boolean;\n    /** Disabled state  */\n    disabled?: boolean;\n    /** Tab value */\n    value?: TabLineValue;\n    /** Left addon tag */\n    addonLeft?: React.ElementType;\n    /** Right addon tag  */\n    addonRight?: React.ElementType;\n  };\n\n/** @deprecated */\nexport interface ITabLineContext extends TabLineContext, UnknownProperties {}\nexport type TabLineContext = {\n  getItemProps: PropGetterFn;\n};\n\n/** @deprecated */\nexport interface ITabLineHandlers extends TabLineHandlers, UnknownProperties {}\nexport type TabLineHandlers = {\n  value: (value: TabLineValue) => void;\n};\n\ntype IntergalacticTabLineComponent<PropsExtending = {}> = (<\n  Value extends TabLineValue,\n  Tag extends Intergalactic.Tag = 'div',\n>(\n  props: Intergalactic.InternalTypings.ComponentProps<\n    Tag,\n    'div',\n    TabLineProps<Value>,\n    TabLineContext,\n    [handlers: TabLineHandlers]\n  > &\n  PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\nIntergalactic.InternalTypings.ComponentAdditive<'div', 'div', TabLineProps>;\n\ndeclare const TabLine: IntergalacticTabLineComponent & {\n  Item: Intergalactic.Component<'div', TabLineItemProps, {}, [handlers: TabLineHandlers]> & {\n    Text: typeof Box;\n    Addon: typeof Box;\n  };\n};\n\ndeclare const wrapTabLine: <PropsExtending extends {}>(\n  wrapper: (\n    props: Intergalactic.InternalTypings.UntypeRefAndTag<\n      Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticTabLineComponent>\n    > &\n    PropsExtending,\n  ) => React.ReactNode,\n) => IntergalacticTabLineComponent<PropsExtending>;\nexport { wrapTabLine };\n\nexport default TabLine;\n"],"mappings":"","ignoreList":[]}
+{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { Box, BoxProps, NeighborItemProps, NeighborLocationProps } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\nimport type React from 'react';\n\nexport type TabLineValue = string | number | boolean;\n\nexport type TabLineProps<T extends TabLineValue = TabLineValue> = BoxProps &\n  NeighborLocationProps & {\n    /** TabLine size\n     * @default m\n     * */\n    size?: 'm' | 'l' | false;\n    /** Adds a bottom border for the entire component\n     * @default true\n     * */\n    underlined?: boolean;\n    /** Is invoked when changing the selection */\n    onChange?:\n      | ((value: T, e?: React.SyntheticEvent<HTMLButtonElement>) => void)\n      | React.Dispatch<React.SetStateAction<T>>;\n    /** Value of the selected tab */\n    value?: T;\n    /** Default value of the selected tab\n     * @default null\n     * */\n    defaultValue?: T;\n\n    /**\n     * Behavior of tabs.\n     * In `auto`, changes the tab immediately when press arrow.\n     * In `manual`, needs to press `space` or `enter` for select a choice.\n     * @default 'auto'\n     */\n    behavior?: 'auto' | 'manual';\n  };\n\nexport type TabLineItemProps = BoxProps &\n  NeighborItemProps & {\n    /** Makes a tab selected. This property is determined automatically depending on the value. */\n    selected?: boolean;\n    /** Disabled state  */\n    disabled?: boolean;\n    /** Tab value */\n    value?: TabLineValue;\n    /** Left addon tag */\n    addonLeft?: React.ElementType;\n    /** Right addon tag  */\n    addonRight?: React.ElementType;\n  };\n\nexport type TabLineContext = {\n  getItemProps: PropGetterFn;\n};\n\nexport type TabLineHandlers = {\n  value: (value: TabLineValue) => void;\n};\n\ntype IntergalacticTabLineComponent<PropsExtending = {}> = (<\n  Value extends TabLineValue,\n  Tag extends Intergalactic.Tag = 'div',\n>(\n  props: Intergalactic.InternalTypings.ComponentProps<\n    Tag,\n    'div',\n    TabLineProps<Value>,\n    TabLineContext,\n    [handlers: TabLineHandlers]\n  > &\n  PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\nIntergalactic.InternalTypings.ComponentAdditive<'div', 'div', TabLineProps>;\n\ndeclare const TabLine: IntergalacticTabLineComponent & {\n  Item: Intergalactic.Component<'div', TabLineItemProps, {}, [handlers: TabLineHandlers]> & {\n    Text: typeof Box;\n    Addon: typeof Box;\n  };\n};\n\ndeclare const wrapTabLine: <PropsExtending extends {}>(\n  wrapper: (\n    props: Intergalactic.InternalTypings.UntypeRefAndTag<\n      Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticTabLineComponent>\n    > &\n    PropsExtending,\n  ) => React.ReactNode,\n) => IntergalacticTabLineComponent<PropsExtending>;\nexport { wrapTabLine };\n\nexport default TabLine;\n"],"mappings":"","ignoreList":[]}