function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

/*
Copyright (c) Uber Technologies, Inc.

This source code is licensed under the MIT license found in the
LICENSE file in the root directory of this source tree.
*/
import { styled } from '../styles';
import { ORIENTATION, FILL } from './constants';
import { isHorizontal, isVertical, isRTL, isIntrinsic, isFixed } from './utils';
export var StyledRoot = styled('div', function (_ref) {
  var $theme = _ref.$theme,
      _ref$$orientation = _ref.$orientation,
      $orientation = _ref$$orientation === void 0 ? ORIENTATION.horizontal : _ref$$orientation;
  var style = {
    // Creates a stacking context so we can use z-index on the TabHighlight
    // without affecting anything outside of this element.
    transform: 'scale(1)'
  };

  if (isVertical($orientation)) {
    style.display = 'flex';
  }

  return style;
});
StyledRoot.displayName = "StyledRoot";
StyledRoot.displayName = 'StyledRoot';
export var StyledTabBar = styled('div', function (_ref2) {
  var $hasEndEnhancer = _ref2.$hasEndEnhancer,
      $orientation = _ref2.$orientation;
  return $hasEndEnhancer || !isHorizontal($orientation) ? {
    display: 'flex'
  } : {};
});
StyledTabBar.displayName = "StyledTabBar";
StyledTabBar.displayName = 'StyledTabBar';
export var StyledTabList = styled('div', function (_ref3) {
  var $theme = _ref3.$theme,
      _ref3$$fill = _ref3.$fill,
      $fill = _ref3$$fill === void 0 ? FILL.intrinsic : _ref3$$fill,
      _ref3$$orientation = _ref3.$orientation,
      $orientation = _ref3$$orientation === void 0 ? ORIENTATION.horizontal : _ref3$$orientation;
  var style = {
    position: 'relative',
    display: 'flex',
    flexWrap: 'nowrap',
    flexGrow: 1
  };

  if (isHorizontal($orientation)) {
    style.flexDirection = 'row';
    style.paddingBottom = '5px';
    style.marginBottom = '-5px';
  } else {
    style.flexDirection = 'column';

    if (isRTL($theme.direction)) {
      style.paddingLeft = '5px';
      style.marginLeft = '-5px';
    } else {
      style.paddingRight = '5px';
      style.marginRight = '-5px';
    }
  }

  if (isIntrinsic($fill)) {
    style['::-webkit-scrollbar'] = {
      display: 'none'
    };
    style['-ms-overflow-style'] = 'none';
    style.scrollbarWidth = 'none';

    if (isHorizontal($orientation)) {
      style.overflowX = 'scroll';
    } else {
      style.overflowY = 'scroll';
    }
  }

  return style;
});
StyledTabList.displayName = "StyledTabList";
StyledTabList.displayName = 'StyledTabList';
export var StyledTab = styled('button', function (_ref4) {
  var $theme = _ref4.$theme,
      _ref4$$orientation = _ref4.$orientation,
      $orientation = _ref4$$orientation === void 0 ? ORIENTATION.horizontal : _ref4$$orientation,
      _ref4$$fill = _ref4.$fill,
      $fill = _ref4$$fill === void 0 ? FILL.intrinsic : _ref4$$fill,
      _ref4$$focusVisible = _ref4.$focusVisible,
      $focusVisible = _ref4$$focusVisible === void 0 ? false : _ref4$$focusVisible,
      _ref4$$isActive = _ref4.$isActive,
      $isActive = _ref4$$isActive === void 0 ? false : _ref4$$isActive;

  var style = _objectSpread({
    cursor: 'pointer',
    WebkitAppearance: 'none',
    marginLeft: '0',
    marginRight: '0',
    marginTop: '0',
    marginBottom: '0',
    boxSizing: 'border-box',
    display: 'inline-flex',
    alignItems: 'center',
    paddingLeft: $theme.sizing.scale600,
    paddingTop: $theme.sizing.scale600,
    paddingRight: $theme.sizing.scale600,
    paddingBottom: $theme.sizing.scale600,
    borderLeftWidth: 0,
    borderTopWidth: 0,
    borderRightWidth: 0,
    borderBottomWidth: 0,
    borderLeftStyle: 'none',
    borderTopStyle: 'none',
    borderRightStyle: 'none',
    borderBottomStyle: 'none',
    color: $theme.colors.contentPrimary,
    background: $theme.colors.backgroundPrimary,
    transitionProperty: 'background',
    transitionDuration: $theme.animation.timing200,
    transitionTimingFunction: $theme.animation.linearCurve,
    outline: 'none',
    outlineOffset: '-3px',
    ':disabled': {
      cursor: 'not-allowed',
      color: $theme.colors.contentStateDisabled
    },
    ':hover': {
      background: $theme.colors.backgroundSecondary
    },
    ':disabled:hover': {
      background: 'none'
    }
  }, $theme.typography.LabelSmall);

  if ($focusVisible) {
    style.outline = "3px solid ".concat($theme.colors.borderAccent);
  }

  if (isFixed($fill)) {
    style.flexGrow = 1;
    style.flexBasis = 0;
  }

  if (isHorizontal($orientation)) {
    style.justifyContent = 'center';
  } else {
    style.justifyContent = 'flex-end';
  }

  return style;
});
StyledTab.displayName = "StyledTab";
StyledTab.displayName = 'StyledTab';
export var StyledEndEnhancerContainer = styled('div', function (_ref5) {
  var $theme = _ref5.$theme;
  var marginDirection = $theme.direction === 'rtl' ? 'marginRight' : 'marginLeft';
  return _defineProperty({
    display: 'flex',
    alignItems: 'center',
    justifyContent: 'flex-end'
  }, marginDirection, $theme.sizing.scale600);
});
StyledEndEnhancerContainer.displayName = "StyledEndEnhancerContainer";
StyledEndEnhancerContainer.displayName = 'StyledEndEnhancerContainer';
export var StyledArtworkContainer = styled('div', function (_ref7) {
  var $theme = _ref7.$theme,
      _ref7$$orientation = _ref7.$orientation,
      $orientation = _ref7$$orientation === void 0 ? ORIENTATION.horizontal : _ref7$$orientation;
  var style = {
    display: 'flex'
  };

  if (isRTL($theme.direction)) {
    style.marginLeft = $theme.sizing.scale300;
  } else {
    style.marginRight = $theme.sizing.scale300;
  }

  return style;
});
StyledArtworkContainer.displayName = "StyledArtworkContainer";
StyledArtworkContainer.displayName = 'StyledArtworkContainer';
export var StyledTabBorder = styled('div', function (_ref8) {
  var $theme = _ref8.$theme,
      _ref8$$orientation = _ref8.$orientation,
      $orientation = _ref8$$orientation === void 0 ? ORIENTATION.horizontal : _ref8$$orientation;
  var style = {
    backgroundColor: $theme.colors.borderOpaque,
    position: 'relative'
  };

  if (isHorizontal($orientation)) {
    style.height = '5px';
  } else {
    style.width = '5px';
  }

  return style;
});
StyledTabBorder.displayName = "StyledTabBorder";
StyledTabBorder.displayName = 'StyledTabBorder';
export var StyledTabHighlight = styled('div', function (_ref9) {
  var $theme = _ref9.$theme,
      _ref9$$orientation = _ref9.$orientation,
      $orientation = _ref9$$orientation === void 0 ? ORIENTATION.horizontal : _ref9$$orientation,
      _ref9$$length = _ref9.$length,
      $length = _ref9$$length === void 0 ? 0 : _ref9$$length,
      _ref9$$distance = _ref9.$distance,
      $distance = _ref9$$distance === void 0 ? 0 : _ref9$$distance,
      _ref9$$animate = _ref9.$animate,
      $animate = _ref9$$animate === void 0 ? false : _ref9$$animate;
  var style = {
    backgroundColor: $theme.colors.borderSelected,
    position: 'absolute',
    zIndex: 1
  };

  if (isHorizontal($orientation)) {
    style.bottom = '0px';
    style.left = '0px';
    style.height = '5px';
    style.width = "".concat($length, "px");
    style.transform = "translateX(".concat($distance, "px)");
  } else {
    style.transform = "translateY(".concat($distance, "px)");
    style.width = '5px';
    style.height = "".concat($length, "px");

    if (isRTL($theme.direction)) {
      style.left = '0px';
    } else {
      style.right = '0px';
    }
  }

  if ($animate) {
    style.transitionProperty = 'all';
    style.transitionDuration = $theme.animation.timing400;
    style.transitionTimingFunction = $theme.animation.easeInOutQuinticCurve;
  }

  return style;
});
StyledTabHighlight.displayName = "StyledTabHighlight";
StyledTabHighlight.displayName = 'StyledTabHighlight';
export var StyledTabPanel = styled('div', function (_ref10) {
  var $theme = _ref10.$theme,
      _ref10$$pad = _ref10.$pad,
      $pad = _ref10$$pad === void 0 ? true : _ref10$$pad;
  var style = {
    flexGrow: 1,
    // only used in vertical orientation
    outline: 'none'
  };

  if ($pad) {
    style.paddingTop = $theme.sizing.scale600;
    style.paddingRight = $theme.sizing.scale600;
    style.paddingBottom = $theme.sizing.scale600;
    style.paddingLeft = $theme.sizing.scale600;
  }

  return style;
});
StyledTabPanel.displayName = "StyledTabPanel";
StyledTabPanel.displayName = 'StyledTabPanel';