@laerdal/life-react-components 5.0.9 → 6.0.0-dev.1.full

package/dist/Tabs/HorizontalTabs.cjs

@@ -1,15 +1,12 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var React = _interopRequireWildcard(require("react"));
 var _types = require("../types");
@@ -17,9 +14,8 @@ var _styles = require("../styles");
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _common = require("../common");
 var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["size", "tabs", "sideFill", "fullWidth", "onTabChange", "variant"],
+const _excluded = ["size", "tabs", "sideFill", "fullWidth", "onTabChange", "variant"],
   _excluded2 = ["value", "selected", "to", "disabled", "className"];
-var _templateObject, _templateObject2, _templateObject3;
 /**
  * Import React libraries.
  */
@@ -29,64 +25,164 @@ var _templateObject, _templateObject2, _templateObject3;
 /**
  * Import third-party libraries.
  */
-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 _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (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 ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 // Add custom styles
-var HorizontalTabContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  width: 100%;\n  display: flex;\n  position: relative;\n  flex-direction: row;\n\n  &:focus {\n    ", ";\n  }\n\n"])), _styles.focusStyles);
-var TabSideFill = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  position: absolute;\n  border-bottom: 1px solid ", ";\n  bottom: 0;\n  width: 100%;\n\n  &.fill {\n    background: ", ";\n  }\n"])), function (props) {
-  return _styles.COLORS.getColor('neutral_100', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('white', props.theme);
-});
-var TabButton = _styledComponents["default"].button(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n  color: ", ";\n  border: none;\n  background-color: transparent;\n  position: relative;\n  cursor: pointer;\n  display: flex;\n  box-sizing: border-box;\n  justify-content: center;\n  align-items: center;\n  padding: 0;\n\n  &[aria-selected=\"true\"] {\n    z-index: ", ";\n  }\n\n  &.floating {\n    border-radius: 2px;\n  }\n  \n  &.selected {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.selected.floating {\n    background-color: ", ";\n  }\n\n  &.default {\n    border-left: 1px solid transparent;\n    border-right: 1px solid transparent;\n  }\n  \n  &.default.selected {\n    border-left: 1px solid ", ";\n    border-right: 1px solid ", ";\n  }\n\n  &.selected:after {\n    content: \"\";\n    position: absolute;\n    top: 0;\n    left: -1px;\n    right: -1px;\n    height: 2px;\n    background-color: ", ";\n  }\n\n  &.selected.floating:after {\n    top: unset;\n    bottom: 1px;\n    left: 1px;\n    right: 1px;\n    height: 2px;\n    border-radius: 2px;\n    background-color: ", ";\n  }\n\n\n  &:hover, &:hover.selected {\n    background: ", ";\n    color: ", ";\n  }\n\n  &:hover:after {\n    background-color: ", ";\n  }\n\n  &:active, &:active.selected {\n    background: ", ";\n    color: ", ";\n    outline: none;\n  }\n\n  &:active:after {\n    background-color: ", ";\n  }\n\n  &:disabled {\n    color: ", ";\n    background: transparent;\n    cursor: not-allowed;\n  }\n\n  // Sizes\n  &.", " {\n    ", "\n    padding: 0px 16px;\n    height: 32px;\n    margin-top: 16px;\n  }\n\n  &.", " {\n    ", "\n    padding: 0px 16px;\n    height: 40px;\n    margin-top: 8px;\n  }\n\n  &.", " {\n    ", "\n    height: 48px;\n    min-width: 96px;\n    padding: 0 16px;\n  }\n\n  &.", " {\n    ", "\n    height: 56px;\n    min-width: 144px;\n    padding: 0 16px;\n  }\n"])), function (props) {
-  return _styles.COLORS.getColor('neutral_600', props.theme);
-}, _styles.Z_INDEXES.active, function (props) {
-  return _styles.COLORS.getColor('white', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('neutral_800', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('neutral_20', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('neutral_100', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('neutral_100', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('primary_500', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('primary_500', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('primary_20', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('primary_700', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('primary_700', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('primary_100', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('primary_800', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('primary_800', props.theme);
-}, function (props) {
-  return _styles.COLORS.getColor('neutral_300', props.theme);
-}, _types.Size.XSmall, (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, null), _types.Size.Small, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, null), _types.Size.Medium, (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, null), _types.Size.Large, (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Regular, null));
+const HorizontalTabContainer = _styledComponents.default.div`
+  width: 100%;
+  display: flex;
+  position: relative;
+  flex-direction: row;
+
+  &:focus {
+    ${_styles.focusStyles};
+  }
+
+`;
+const TabSideFill = _styledComponents.default.div`
+  position: absolute;
+  border-bottom: 1px solid ${props => _styles.COLORS.getColor('neutral_100', props.theme)};
+  bottom: 0;
+  width: 100%;
+
+  &.fill {
+    background: ${props => _styles.COLORS.getColor('white', props.theme)};
+  }
+`;
+const TabButton = _styledComponents.default.button`
+  color: ${props => _styles.COLORS.getColor('neutral_600', props.theme)};
+  border: none;
+  background-color: transparent;
+  position: relative;
+  cursor: pointer;
+  display: flex;
+  box-sizing: border-box;
+  justify-content: center;
+  align-items: center;
+  padding: 0;
+
+  &[aria-selected="true"] {
+    z-index: ${_styles.Z_INDEXES.active};
+  }
+
+  &.floating {
+    border-radius: 2px;
+  }
+  
+  &.selected {
+    background-color: ${props => _styles.COLORS.getColor('white', props.theme)};
+    color: ${props => _styles.COLORS.getColor('neutral_800', props.theme)};
+  }
+
+  &.selected.floating {
+    background-color: ${props => _styles.COLORS.getColor('neutral_20', props.theme)};
+  }
+
+  &.default {
+    border-left: 1px solid transparent;
+    border-right: 1px solid transparent;
+  }
+  
+  &.default.selected {
+    border-left: 1px solid ${props => _styles.COLORS.getColor('neutral_100', props.theme)};
+    border-right: 1px solid ${props => _styles.COLORS.getColor('neutral_100', props.theme)};
+  }
+
+  &.selected:after {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: -1px;
+    right: -1px;
+    height: 2px;
+    background-color: ${props => _styles.COLORS.getColor('primary_500', props.theme)};
+  }
+
+  &.selected.floating:after {
+    top: unset;
+    bottom: 1px;
+    left: 1px;
+    right: 1px;
+    height: 2px;
+    border-radius: 2px;
+    background-color: ${props => _styles.COLORS.getColor('primary_500', props.theme)};
+  }
+
+
+  &:hover, &:hover.selected {
+    background: ${props => _styles.COLORS.getColor('primary_20', props.theme)};
+    color: ${props => _styles.COLORS.getColor('primary_700', props.theme)};
+  }
+
+  &:hover:after {
+    background-color: ${props => _styles.COLORS.getColor('primary_700', props.theme)};
+  }
+
+  &:active, &:active.selected {
+    background: ${props => _styles.COLORS.getColor('primary_100', props.theme)};
+    color: ${props => _styles.COLORS.getColor('primary_800', props.theme)};
+    outline: none;
+  }
+
+  &:active:after {
+    background-color: ${props => _styles.COLORS.getColor('primary_800', props.theme)};
+  }
+
+  &:disabled {
+    color: ${props => _styles.COLORS.getColor('neutral_300', props.theme)};
+    background: transparent;
+    cursor: not-allowed;
+  }
+
+  // Sizes
+  &.${_types.Size.XSmall} {
+    ${(0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, null)}
+    padding: 0px 16px;
+    height: 32px;
+    margin-top: 16px;
+  }
+
+  &.${_types.Size.Small} {
+    ${(0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, null)}
+    padding: 0px 16px;
+    height: 40px;
+    margin-top: 8px;
+  }
+
+  &.${_types.Size.Medium} {
+    ${(0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, null)}
+    height: 48px;
+    min-width: 96px;
+    padding: 0 16px;
+  }
+
+  &.${_types.Size.Large} {
+    ${(0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Regular, null)}
+    height: 56px;
+    min-width: 144px;
+    padding: 0 16px;
+  }
+`;
 
 // Add component-specific types
 
-var HorizontalTabs = function HorizontalTabs(_ref) {
-  var size = _ref.size,
-    tabs = _ref.tabs,
-    sideFill = _ref.sideFill,
-    fullWidth = _ref.fullWidth,
-    onTabChange = _ref.onTabChange,
-    variant = _ref.variant,
-    rest = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+const HorizontalTabs = _ref => {
+  let {
+      size,
+      tabs,
+      sideFill,
+      fullWidth,
+      onTabChange,
+      variant
+    } = _ref,
+    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   /**
    * Informs parent component of tab change and clears focus.
    * @param to - A link to which user should be navigated.
    */
-  var doTabChange = function doTabChange(to) {
+  const doTabChange = to => {
     // Let's inform parent component
     onTabChange(to);
 
@@ -95,42 +191,30 @@ var HorizontalTabs = function HorizontalTabs(_ref) {
       document.activeElement.blur();
     }
   };
-  var _React$useState = React.useState(false),
-    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
-    focused = _React$useState2[0],
-    setFocused = _React$useState2[1];
-  var _React$useState3 = React.useState(),
-    _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
-    currentTab = _React$useState4[0],
-    setCurrentTab = _React$useState4[1];
-  React.useEffect(function () {
-    var selectedTab = tabs.find(function (x) {
-      return x.selected && !x.disabled;
-    });
+  const [focused, setFocused] = React.useState(false);
+  const [currentTab, setCurrentTab] = React.useState();
+  React.useEffect(() => {
+    const selectedTab = tabs.find(x => x.selected && !x.disabled);
     if (selectedTab) setCurrentTab(selectedTab.to);
   }, [tabs]);
-  var tabListBlur = function tabListBlur() {
-    return setFocused(false);
-  };
-  var tabListFocus = function tabListFocus(e) {
-    return setFocused(true);
-  };
-  var changeTabInternal = function changeTabInternal(tab) {
+  const tabListBlur = () => setFocused(false);
+  const tabListFocus = e => setFocused(true);
+  const changeTabInternal = tab => {
     tab.selected = true;
-    tabs.forEach(function (x) {
+    tabs.forEach(x => {
       if (x.to != tab.to) x.selected = false;
     });
     setCurrentTab(tab.to);
     onTabChange(tab.to);
   };
-  var tabListKeyDown = function tabListKeyDown(e) {
+  const tabListKeyDown = e => {
     if (focused && (e.key === 'ArrowLeft' || e.key === 'ArrowRight')) {
       e.preventDefault();
       if (e.key === 'ArrowRight') {
-        tabs.forEach(function (x, i) {
+        tabs.forEach((x, i) => {
           if (x.to != currentTab) return;
-          for (var j = 1; j < tabs.length - 1; j++) {
-            var nextIndex = j + i;
+          for (let j = 1; j < tabs.length - 1; j++) {
+            let nextIndex = j + i;
             if (nextIndex > tabs.length - 1) nextIndex = nextIndex - tabs.length;
             if (tabs[nextIndex].disabled) continue;
             changeTabInternal(tabs[nextIndex]);
@@ -139,10 +223,10 @@ var HorizontalTabs = function HorizontalTabs(_ref) {
         });
       }
       if (e.key === 'ArrowLeft') {
-        tabs.forEach(function (x, i) {
+        tabs.forEach((x, i) => {
           if (x.to != currentTab) return;
-          for (var j = 1; j < tabs.length - 1; j++) {
-            var nextIndex = i - j;
+          for (let j = 1; j < tabs.length - 1; j++) {
+            let nextIndex = i - j;
             if (nextIndex < 0) nextIndex = nextIndex + tabs.length;
             if (tabs[nextIndex].disabled) continue;
             changeTabInternal(tabs[nextIndex]);
@@ -162,46 +246,45 @@ var HorizontalTabs = function HorizontalTabs(_ref) {
   }, rest), {}, {
     children: [variant !== 'floating' && /*#__PURE__*/(0, _jsxRuntime.jsx)(TabSideFill, {
       tabIndex: -1,
-      className: "".concat(sideFill ? 'fill' : '')
-    }), tabs.map(function (tab, index) {
-      var value = tab.value,
-        selected = tab.selected,
-        to = tab.to,
-        disabled = tab.disabled,
-        className = tab.className,
-        rest = (0, _objectWithoutProperties2["default"])(tab, _excluded2);
+      className: `${sideFill ? 'fill' : ''}`
+    }), tabs.map((tab, index) => {
+      const {
+          value,
+          selected,
+          to,
+          disabled,
+          className
+        } = tab,
+        rest = (0, _objectWithoutProperties2.default)(tab, _excluded2);
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(TabButton, _objectSpread(_objectSpread({
         role: "tab",
-        "data-testid": "tab_".concat(value),
+        "data-testid": `tab_${value}`,
         "aria-selected": selected,
         "aria-expanded": selected,
         tabIndex: -1,
         onMouseDown: _common.defaultOnMouseDownHandler,
         style: fullWidth ? {
-          width: "".concat(100 / tabs.length, "%")
+          width: `${100 / tabs.length}%`
         } : {},
         disabled: disabled,
-        className: "".concat(className || '', " ").concat(size, " ").concat(variant || 'default', " ").concat(tab.selected ? 'selected' : ''),
-        onClick: function onClick() {
-          return !disabled && changeTabInternal(tab);
-        }
+        className: `${className || ''} ${size} ${variant || 'default'} ${tab.selected ? 'selected' : ''}`,
+        onClick: () => !disabled && changeTabInternal(tab)
       }, rest), {}, {
         children: tab.value
-      }), "".concat(tab, "_").concat(index));
+      }), `${tab}_${index}`);
     })]
   }));
 };
 HorizontalTabs.propTypes = {
-  tabs: _propTypes["default"].arrayOf(_propTypes["default"].shape({
-    value: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].node]).isRequired,
-    selected: _propTypes["default"].bool.isRequired,
-    to: _propTypes["default"].string.isRequired
+  tabs: _propTypes.default.arrayOf(_propTypes.default.shape({
+    value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]).isRequired,
+    selected: _propTypes.default.bool.isRequired,
+    to: _propTypes.default.string.isRequired
   })).isRequired,
-  sideFill: _propTypes["default"].bool,
-  fullWidth: _propTypes["default"].bool,
-  onTabChange: _propTypes["default"].func.isRequired,
-  variant: _propTypes["default"].oneOf(['default', 'floating'])
+  sideFill: _propTypes.default.bool,
+  fullWidth: _propTypes.default.bool,
+  onTabChange: _propTypes.default.func.isRequired,
+  variant: _propTypes.default.oneOf(['default', 'floating'])
 };
-var _default = HorizontalTabs;
-exports["default"] = _default;
+var _default = exports.default = HorizontalTabs;
 //# sourceMappingURL=HorizontalTabs.cjs.map

package/dist/Tabs/HorizontalTabs.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalTabs.cjs","names":["React","_interopRequireWildcard","require","_types","_styles","_styledComponents","_interopRequireDefault","_common","_jsxRuntime","_excluded","_excluded2","_templateObject","_templateObject2","_templateObject3","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","HorizontalTabContainer","styled","div","_taggedTemplateLiteral2","focusStyles","TabSideFill","props","COLORS","getColor","theme","TabButton","button","Z_INDEXES","active","Size","XSmall","ComponentXSStyling","ComponentTextStyle","Regular","Small","ComponentSStyling","Medium","ComponentMStyling","Large","ComponentLStyling","HorizontalTabs","_ref","size","tabs","sideFill","fullWidth","onTabChange","variant","rest","_objectWithoutProperties2","doTabChange","to","document","activeElement","HTMLElement","blur","_React$useState","useState","_React$useState2","_slicedToArray2","focused","setFocused","_React$useState3","_React$useState4","currentTab","setCurrentTab","useEffect","selectedTab","find","x","selected","disabled","tabListBlur","tabListFocus","changeTabInternal","tab","tabListKeyDown","key","preventDefault","j","nextIndex","jsxs","tabIndex","onBlur","onFocus","onKeyDown","role","children","jsx","className","concat","map","index","value","onMouseDown","defaultOnMouseDownHandler","style","width","onClick","propTypes","_propTypes","arrayOf","shape","oneOfType","string","node","isRequired","bool","func","oneOf","_default","exports"],"sources":["../../src/Tabs/HorizontalTabs.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\nimport {Size} from '../types';\r\n\r\n/**\r\n * Import custom styles.\r\n */\r\nimport {COLORS, ComponentTextStyle, focusStyles} from '../styles';\r\n\r\n/**\r\n * Import third-party libraries.\r\n */\r\nimport styled from 'styled-components';\r\nimport {ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXSStyling} from '../styles';\r\nimport {Z_INDEXES} from '../styles';\r\nimport {defaultOnMouseDownHandler} from '../common';\r\nimport Colors from \"../styles/colors\";\r\n\r\n// Add custom styles\r\nconst HorizontalTabContainer = styled.div`\r\n  width: 100%;\r\n  display: flex;\r\n  position: relative;\r\n  flex-direction: row;\r\n\r\n  &:focus {\r\n    ${focusStyles};\r\n  }\r\n\r\n`;\r\n\r\nconst TabSideFill = styled.div`\r\n  position: absolute;\r\n  border-bottom: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  bottom: 0;\r\n  width: 100%;\r\n\r\n  &.fill {\r\n    background: ${props => COLORS.getColor('white', props.theme)};\r\n  }\r\n`;\r\n\r\nconst TabButton = styled.button`\r\n  color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n  border: none;\r\n  background-color: transparent;\r\n  position: relative;\r\n  cursor: pointer;\r\n  display: flex;\r\n  box-sizing: border-box;\r\n  justify-content: center;\r\n  align-items: center;\r\n  padding: 0;\r\n\r\n  &[aria-selected=\"true\"] {\r\n    z-index: ${Z_INDEXES.active};\r\n  }\r\n\r\n  &.floating {\r\n    border-radius: 2px;\r\n  }\r\n  \r\n  &.selected {\r\n    background-color: ${props => COLORS.getColor('white', props.theme)};\r\n    color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n  }\r\n\r\n  &.selected.floating {\r\n    background-color: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n  }\r\n\r\n  &.default {\r\n    border-left: 1px solid transparent;\r\n    border-right: 1px solid transparent;\r\n  }\r\n  \r\n  &.default.selected {\r\n    border-left: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n    border-right: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  }\r\n\r\n  &.selected:after {\r\n    content: \"\";\r\n    position: absolute;\r\n    top: 0;\r\n    left: -1px;\r\n    right: -1px;\r\n    height: 2px;\r\n    background-color: ${props => COLORS.getColor('primary_500', props.theme)};\r\n  }\r\n\r\n  &.selected.floating:after {\r\n    top: unset;\r\n    bottom: 1px;\r\n    left: 1px;\r\n    right: 1px;\r\n    height: 2px;\r\n    border-radius: 2px;\r\n    background-color: ${props => COLORS.getColor('primary_500', props.theme)};\r\n  }\r\n\r\n\r\n  &:hover, &:hover.selected {\r\n    background: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n  }\r\n\r\n  &:hover:after {\r\n    background-color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n  }\r\n\r\n  &:active, &:active.selected {\r\n    background: ${props => COLORS.getColor('primary_100', props.theme)};\r\n    color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    outline: none;\r\n  }\r\n\r\n  &:active:after {\r\n    background-color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n  }\r\n\r\n  &:disabled {\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n    background: transparent;\r\n    cursor: not-allowed;\r\n  }\r\n\r\n  // Sizes\r\n  &.${Size.XSmall} {\r\n    ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\r\n    padding: 0px 16px;\r\n    height: 32px;\r\n    margin-top: 16px;\r\n  }\r\n\r\n  &.${Size.Small} {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, null)}\r\n    padding: 0px 16px;\r\n    height: 40px;\r\n    margin-top: 8px;\r\n  }\r\n\r\n  &.${Size.Medium} {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, null)}\r\n    height: 48px;\r\n    min-width: 96px;\r\n    padding: 0 16px;\r\n  }\r\n\r\n  &.${Size.Large} {\r\n    ${ComponentLStyling(ComponentTextStyle.Regular, null)}\r\n    height: 56px;\r\n    min-width: 144px;\r\n    padding: 0 16px;\r\n  }\r\n`;\r\n\r\n// Add component-specific types\r\nexport interface HorizontalTabProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  /** Required. Size of the Tabs */\r\n  size: Size.XSmall | Size.Small | Size.Medium | Size.Large;\r\n  /** Required: Array of Tabs to show */\r\n  tabs: HorizontalTab[];\r\n  /** Optional. For 'default' variant of tabs if this flag is set, then white background will be added to the tabs  */\r\n  sideFill?: boolean;\r\n  /** Optional. If set, then whole width of the parent container will be equally split between Tabs, otherwise each tab will take width \r\n   * required for its content.\r\n   */\r\n  fullWidth?: boolean;\r\n  /** Required. Handler to be called when user tries to change the tab */\r\n  onTabChange: (to: string) => void;\r\n  /** Optional. Display variant of the tabs. If not set, then 'default' is used */\r\n  variant?: 'default' | 'floating';\r\n}\r\n\r\nexport interface HorizontalTab extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'style'> {\r\n  /** Required. Value of the tab */\r\n  value: string | React.ReactNode;\r\n  /** Required. State of the tab, selected or not. Use it to set initial state of the tabs. */\r\n  selected: boolean;\r\n  /** Required. URL related with the Tab */\r\n  to: string;\r\n}\r\n\r\nconst HorizontalTabs = ({size, tabs, sideFill, fullWidth, onTabChange, variant, ...rest}: HorizontalTabProps) => {\r\n  /**\r\n   * Informs parent component of tab change and clears focus.\r\n   * @param to - A link to which user should be navigated.\r\n   */\r\n  const doTabChange = (to: string): void => {\r\n    // Let's inform parent component\r\n    onTabChange(to);\r\n\r\n    // Let's clear focus\r\n    if (document.activeElement instanceof HTMLElement) {\r\n      document.activeElement!.blur();\r\n    }\r\n  };\r\n\r\n  const [focused, setFocused] = React.useState<boolean>(false);\r\n  const [currentTab, setCurrentTab] = React.useState<string>();\r\n\r\n  React.useEffect(() => {\r\n    const selectedTab = tabs.find(x => x.selected && !x.disabled);\r\n    if (selectedTab)\r\n      setCurrentTab(selectedTab.to);\r\n  }, [tabs]);\r\n\r\n  const tabListBlur = () => setFocused(false);\r\n\r\n  const tabListFocus = (e: React.FocusEvent<HTMLDivElement, Element>) => setFocused(true);\r\n\r\n  const changeTabInternal = (tab: HorizontalTab) => {\r\n    tab.selected = true;\r\n    tabs.forEach(x => {\r\n      if (x.to != tab.to)\r\n        x.selected = false;\r\n    });\r\n    setCurrentTab(tab.to);\r\n    onTabChange(tab.to);\r\n  }\r\n\r\n  const tabListKeyDown = (e: React.KeyboardEvent) => {\r\n    if (focused && (e.key === 'ArrowLeft' || e.key === 'ArrowRight')) {\r\n      e.preventDefault();\r\n      if (e.key === 'ArrowRight') {\r\n        tabs.forEach((x, i) => {\r\n          if (x.to != currentTab)\r\n            return;\r\n\r\n          for (let j = 1; j < tabs.length - 1; j++) {\r\n            let nextIndex = j + i;\r\n            if (nextIndex > tabs.length - 1)\r\n              nextIndex = nextIndex - tabs.length;\r\n            if (tabs[nextIndex].disabled)\r\n              continue;\r\n            changeTabInternal(tabs[nextIndex]);\r\n            break;\r\n          }\r\n        });\r\n      }\r\n\r\n      if (e.key === 'ArrowLeft') {\r\n        tabs.forEach((x, i) => {\r\n          if (x.to != currentTab)\r\n            return;\r\n\r\n          for (let j = 1; j < tabs.length - 1; j++) {\r\n            let nextIndex = i - j;\r\n            if (nextIndex < 0)\r\n              nextIndex = nextIndex + tabs.length;\r\n            if (tabs[nextIndex].disabled)\r\n              continue;\r\n            changeTabInternal(tabs[nextIndex]);\r\n            break;\r\n          }\r\n        });\r\n      }\r\n    }\r\n  };\r\n\r\n  return (\r\n    <HorizontalTabContainer tabIndex={0} onBlur={tabListBlur} onFocus={tabListFocus} onKeyDown={tabListKeyDown}\r\n                            role=\"tablist\" data-testid={'horizontal-tabs-container'} {...rest}>\r\n      {\r\n        variant !== 'floating' && <TabSideFill tabIndex={-1} className={`${sideFill ? 'fill' : ''}`}/>\r\n      }\r\n      {tabs.map((tab: HorizontalTab, index: number) => {\r\n        const {value, selected, to, disabled, className, ...rest} = tab;\r\n        return (\r\n          <TabButton\r\n            role=\"tab\"\r\n            data-testid={`tab_${value}`}\r\n            key={`${tab}_${index}`}\r\n            aria-selected={selected}\r\n            aria-expanded={selected}\r\n            tabIndex={-1}\r\n            onMouseDown={defaultOnMouseDownHandler}\r\n            style={fullWidth ? {width: `${100 / tabs.length}%`} : {}}\r\n            disabled={disabled}\r\n            className={`${className || ''} ${size} ${variant || 'default'} ${tab.selected ? 'selected' : ''}`}\r\n            onClick={() => !disabled && changeTabInternal(tab)}\r\n            {...rest}>\r\n            {tab.value}\r\n          </TabButton>\r\n        );\r\n      })}\r\n    </HorizontalTabContainer>\r\n  );\r\n};\r\n\r\nexport default HorizontalTabs;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"HorizontalTabs.cjs","names":["React","_interopRequireWildcard","require","_types","_styles","_styledComponents","_interopRequireDefault","_common","_jsxRuntime","_excluded","_excluded2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","HorizontalTabContainer","styled","div","focusStyles","TabSideFill","props","COLORS","getColor","theme","TabButton","button","Z_INDEXES","active","Size","XSmall","ComponentXSStyling","ComponentTextStyle","Regular","Small","ComponentSStyling","Medium","ComponentMStyling","Large","ComponentLStyling","HorizontalTabs","_ref","size","tabs","sideFill","fullWidth","onTabChange","variant","rest","_objectWithoutProperties2","doTabChange","to","document","activeElement","HTMLElement","blur","focused","setFocused","useState","currentTab","setCurrentTab","useEffect","selectedTab","find","x","selected","disabled","tabListBlur","tabListFocus","changeTabInternal","tab","tabListKeyDown","key","preventDefault","j","nextIndex","jsxs","tabIndex","onBlur","onFocus","onKeyDown","role","children","jsx","className","map","index","value","onMouseDown","defaultOnMouseDownHandler","style","width","onClick","propTypes","_propTypes","arrayOf","shape","oneOfType","string","node","isRequired","bool","func","oneOf","_default","exports"],"sources":["../../src/Tabs/HorizontalTabs.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\nimport {Size} from '../types';\r\n\r\n/**\r\n * Import custom styles.\r\n */\r\nimport {COLORS, ComponentTextStyle, focusStyles} from '../styles';\r\n\r\n/**\r\n * Import third-party libraries.\r\n */\r\nimport styled from 'styled-components';\r\nimport {ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXSStyling} from '../styles';\r\nimport {Z_INDEXES} from '../styles';\r\nimport {defaultOnMouseDownHandler} from '../common';\r\nimport Colors from \"../styles/colors\";\r\n\r\n// Add custom styles\r\nconst HorizontalTabContainer = styled.div`\r\n  width: 100%;\r\n  display: flex;\r\n  position: relative;\r\n  flex-direction: row;\r\n\r\n  &:focus {\r\n    ${focusStyles};\r\n  }\r\n\r\n`;\r\n\r\nconst TabSideFill = styled.div`\r\n  position: absolute;\r\n  border-bottom: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  bottom: 0;\r\n  width: 100%;\r\n\r\n  &.fill {\r\n    background: ${props => COLORS.getColor('white', props.theme)};\r\n  }\r\n`;\r\n\r\nconst TabButton = styled.button`\r\n  color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n  border: none;\r\n  background-color: transparent;\r\n  position: relative;\r\n  cursor: pointer;\r\n  display: flex;\r\n  box-sizing: border-box;\r\n  justify-content: center;\r\n  align-items: center;\r\n  padding: 0;\r\n\r\n  &[aria-selected=\"true\"] {\r\n    z-index: ${Z_INDEXES.active};\r\n  }\r\n\r\n  &.floating {\r\n    border-radius: 2px;\r\n  }\r\n  \r\n  &.selected {\r\n    background-color: ${props => COLORS.getColor('white', props.theme)};\r\n    color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n  }\r\n\r\n  &.selected.floating {\r\n    background-color: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n  }\r\n\r\n  &.default {\r\n    border-left: 1px solid transparent;\r\n    border-right: 1px solid transparent;\r\n  }\r\n  \r\n  &.default.selected {\r\n    border-left: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n    border-right: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  }\r\n\r\n  &.selected:after {\r\n    content: \"\";\r\n    position: absolute;\r\n    top: 0;\r\n    left: -1px;\r\n    right: -1px;\r\n    height: 2px;\r\n    background-color: ${props => COLORS.getColor('primary_500', props.theme)};\r\n  }\r\n\r\n  &.selected.floating:after {\r\n    top: unset;\r\n    bottom: 1px;\r\n    left: 1px;\r\n    right: 1px;\r\n    height: 2px;\r\n    border-radius: 2px;\r\n    background-color: ${props => COLORS.getColor('primary_500', props.theme)};\r\n  }\r\n\r\n\r\n  &:hover, &:hover.selected {\r\n    background: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n  }\r\n\r\n  &:hover:after {\r\n    background-color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n  }\r\n\r\n  &:active, &:active.selected {\r\n    background: ${props => COLORS.getColor('primary_100', props.theme)};\r\n    color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    outline: none;\r\n  }\r\n\r\n  &:active:after {\r\n    background-color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n  }\r\n\r\n  &:disabled {\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n    background: transparent;\r\n    cursor: not-allowed;\r\n  }\r\n\r\n  // Sizes\r\n  &.${Size.XSmall} {\r\n    ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\r\n    padding: 0px 16px;\r\n    height: 32px;\r\n    margin-top: 16px;\r\n  }\r\n\r\n  &.${Size.Small} {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, null)}\r\n    padding: 0px 16px;\r\n    height: 40px;\r\n    margin-top: 8px;\r\n  }\r\n\r\n  &.${Size.Medium} {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, null)}\r\n    height: 48px;\r\n    min-width: 96px;\r\n    padding: 0 16px;\r\n  }\r\n\r\n  &.${Size.Large} {\r\n    ${ComponentLStyling(ComponentTextStyle.Regular, null)}\r\n    height: 56px;\r\n    min-width: 144px;\r\n    padding: 0 16px;\r\n  }\r\n`;\r\n\r\n// Add component-specific types\r\nexport interface HorizontalTabProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  /** Required. Size of the Tabs */\r\n  size: Size.XSmall | Size.Small | Size.Medium | Size.Large;\r\n  /** Required: Array of Tabs to show */\r\n  tabs: HorizontalTab[];\r\n  /** Optional. For 'default' variant of tabs if this flag is set, then white background will be added to the tabs  */\r\n  sideFill?: boolean;\r\n  /** Optional. If set, then whole width of the parent container will be equally split between Tabs, otherwise each tab will take width \r\n   * required for its content.\r\n   */\r\n  fullWidth?: boolean;\r\n  /** Required. Handler to be called when user tries to change the tab */\r\n  onTabChange: (to: string) => void;\r\n  /** Optional. Display variant of the tabs. If not set, then 'default' is used */\r\n  variant?: 'default' | 'floating';\r\n}\r\n\r\nexport interface HorizontalTab extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'style'> {\r\n  /** Required. Value of the tab */\r\n  value: string | React.ReactNode;\r\n  /** Required. State of the tab, selected or not. Use it to set initial state of the tabs. */\r\n  selected: boolean;\r\n  /** Required. URL related with the Tab */\r\n  to: string;\r\n}\r\n\r\nconst HorizontalTabs = ({size, tabs, sideFill, fullWidth, onTabChange, variant, ...rest}: HorizontalTabProps) => {\r\n  /**\r\n   * Informs parent component of tab change and clears focus.\r\n   * @param to - A link to which user should be navigated.\r\n   */\r\n  const doTabChange = (to: string): void => {\r\n    // Let's inform parent component\r\n    onTabChange(to);\r\n\r\n    // Let's clear focus\r\n    if (document.activeElement instanceof HTMLElement) {\r\n      document.activeElement!.blur();\r\n    }\r\n  };\r\n\r\n  const [focused, setFocused] = React.useState<boolean>(false);\r\n  const [currentTab, setCurrentTab] = React.useState<string>();\r\n\r\n  React.useEffect(() => {\r\n    const selectedTab = tabs.find(x => x.selected && !x.disabled);\r\n    if (selectedTab)\r\n      setCurrentTab(selectedTab.to);\r\n  }, [tabs]);\r\n\r\n  const tabListBlur = () => setFocused(false);\r\n\r\n  const tabListFocus = (e: React.FocusEvent<HTMLDivElement, Element>) => setFocused(true);\r\n\r\n  const changeTabInternal = (tab: HorizontalTab) => {\r\n    tab.selected = true;\r\n    tabs.forEach(x => {\r\n      if (x.to != tab.to)\r\n        x.selected = false;\r\n    });\r\n    setCurrentTab(tab.to);\r\n    onTabChange(tab.to);\r\n  }\r\n\r\n  const tabListKeyDown = (e: React.KeyboardEvent) => {\r\n    if (focused && (e.key === 'ArrowLeft' || e.key === 'ArrowRight')) {\r\n      e.preventDefault();\r\n      if (e.key === 'ArrowRight') {\r\n        tabs.forEach((x, i) => {\r\n          if (x.to != currentTab)\r\n            return;\r\n\r\n          for (let j = 1; j < tabs.length - 1; j++) {\r\n            let nextIndex = j + i;\r\n            if (nextIndex > tabs.length - 1)\r\n              nextIndex = nextIndex - tabs.length;\r\n            if (tabs[nextIndex].disabled)\r\n              continue;\r\n            changeTabInternal(tabs[nextIndex]);\r\n            break;\r\n          }\r\n        });\r\n      }\r\n\r\n      if (e.key === 'ArrowLeft') {\r\n        tabs.forEach((x, i) => {\r\n          if (x.to != currentTab)\r\n            return;\r\n\r\n          for (let j = 1; j < tabs.length - 1; j++) {\r\n            let nextIndex = i - j;\r\n            if (nextIndex < 0)\r\n              nextIndex = nextIndex + tabs.length;\r\n            if (tabs[nextIndex].disabled)\r\n              continue;\r\n            changeTabInternal(tabs[nextIndex]);\r\n            break;\r\n          }\r\n        });\r\n      }\r\n    }\r\n  };\r\n\r\n  return (\r\n    <HorizontalTabContainer tabIndex={0} onBlur={tabListBlur} onFocus={tabListFocus} onKeyDown={tabListKeyDown}\r\n                            role=\"tablist\" data-testid={'horizontal-tabs-container'} {...rest}>\r\n      {\r\n        variant !== 'floating' && <TabSideFill tabIndex={-1} className={`${sideFill ? 'fill' : ''}`}/>\r\n      }\r\n      {tabs.map((tab: HorizontalTab, index: number) => {\r\n        const {value, selected, to, disabled, className, ...rest} = tab;\r\n        return (\r\n          <TabButton\r\n            role=\"tab\"\r\n            data-testid={`tab_${value}`}\r\n            key={`${tab}_${index}`}\r\n            aria-selected={selected}\r\n            aria-expanded={selected}\r\n            tabIndex={-1}\r\n            onMouseDown={defaultOnMouseDownHandler}\r\n            style={fullWidth ? {width: `${100 / tabs.length}%`} : {}}\r\n            disabled={disabled}\r\n            className={`${className || ''} ${size} ${variant || 'default'} ${tab.selected ? 'selected' : ''}`}\r\n            onClick={() => !disabled && changeTabInternal(tab)}\r\n            {...rest}>\r\n            {tab.value}\r\n          </TabButton>\r\n        );\r\n      })}\r\n    </HorizontalTabContainer>\r\n  );\r\n};\r\n\r\nexport default HorizontalTabs;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Tabs/HorizontalTabs.d.ts

@@ -1,31 +1,31 @@
-/**
- * Import React libraries.
- */
-import * as React from 'react';
-import { Size } from '../types';
-export interface HorizontalTabProps extends React.HTMLAttributes<HTMLDivElement> {
-    /** Required. Size of the Tabs */
-    size: Size.XSmall | Size.Small | Size.Medium | Size.Large;
-    /** Required: Array of Tabs to show */
-    tabs: HorizontalTab[];
-    /** Optional. For 'default' variant of tabs if this flag is set, then white background will be added to the tabs  */
-    sideFill?: boolean;
-    /** Optional. If set, then whole width of the parent container will be equally split between Tabs, otherwise each tab will take width
-     * required for its content.
-     */
-    fullWidth?: boolean;
-    /** Required. Handler to be called when user tries to change the tab */
-    onTabChange: (to: string) => void;
-    /** Optional. Display variant of the tabs. If not set, then 'default' is used */
-    variant?: 'default' | 'floating';
-}
-export interface HorizontalTab extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'style'> {
-    /** Required. Value of the tab */
-    value: string | React.ReactNode;
-    /** Required. State of the tab, selected or not. Use it to set initial state of the tabs. */
-    selected: boolean;
-    /** Required. URL related with the Tab */
-    to: string;
-}
-declare const HorizontalTabs: ({ size, tabs, sideFill, fullWidth, onTabChange, variant, ...rest }: HorizontalTabProps) => React.JSX.Element;
-export default HorizontalTabs;
+/**
+ * Import React libraries.
+ */
+import * as React from 'react';
+import { Size } from '../types';
+export interface HorizontalTabProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Required. Size of the Tabs */
+    size: Size.XSmall | Size.Small | Size.Medium | Size.Large;
+    /** Required: Array of Tabs to show */
+    tabs: HorizontalTab[];
+    /** Optional. For 'default' variant of tabs if this flag is set, then white background will be added to the tabs  */
+    sideFill?: boolean;
+    /** Optional. If set, then whole width of the parent container will be equally split between Tabs, otherwise each tab will take width
+     * required for its content.
+     */
+    fullWidth?: boolean;
+    /** Required. Handler to be called when user tries to change the tab */
+    onTabChange: (to: string) => void;
+    /** Optional. Display variant of the tabs. If not set, then 'default' is used */
+    variant?: 'default' | 'floating';
+}
+export interface HorizontalTab extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'style'> {
+    /** Required. Value of the tab */
+    value: string | React.ReactNode;
+    /** Required. State of the tab, selected or not. Use it to set initial state of the tabs. */
+    selected: boolean;
+    /** Required. URL related with the Tab */
+    to: string;
+}
+declare const HorizontalTabs: ({ size, tabs, sideFill, fullWidth, onTabChange, variant, ...rest }: HorizontalTabProps) => React.JSX.Element;
+export default HorizontalTabs;