@kiwicom/orbit-components/lib/Separator/index.js

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
exports.__esModule = true;
exports.default = exports.StyledSeparator = void 0;
var React = _interopRequireWildcard(require("react"));
var _styledComponents = _interopRequireWildcard(require("styled-components"));
var _defaultTheme = _interopRequireDefault(require("../defaultTheme"));
var _getSpacingToken = _interopRequireDefault(require("../common/getSpacingToken"));
var _rtl = require("../utils/rtl");
var _useTheme = _interopRequireDefault(require("../hooks/useTheme"));
function capitalize(string) {
  return string.charAt(0).toUpperCase() + string.slice(1);
}
function getIndentAmount({
  theme,
  $indent
}) {
  return $indent === "none" ? 0 : theme.orbit[`space${capitalize($indent)}`];
}
const StyledContainer = _styledComponents.default.div.withConfig({
  displayName: "Separator__StyledContainer",
  componentId: "sc-1k4hjle-0"
})(["", ";"], ({
  $align
}) => (0, _styledComponents.css)(["box-sizing:border-box;width:100%;padding-", ":", ";padding-", ":", ";padding:", ";"], _rtl.right, $align === "left" && getIndentAmount, _rtl.left, $align === "right" && getIndentAmount, $align === "center" && `0 ${getIndentAmount}`));
const StyledSeparator = _styledComponents.default.hr.withConfig({
  displayName: "Separator__StyledSeparator",
  componentId: "sc-1k4hjle-1"
})(["", ";"], ({
  theme,
  $type,
  $color
}) => (0, _styledComponents.css)(["height:", ";background:", ";box-sizing:border-box;border-style:", ";border-color:", ";margin-top:0;margin-bottom:", ";"], theme.orbit.heightSeparator, theme.orbit.backgroundSeparator, $type, $color, _getSpacingToken.default));
exports.StyledSeparator = StyledSeparator;
StyledSeparator.defaultProps = {
  theme: _defaultTheme.default
};
const Separator = ({
  align = "left",
  indent = "none",
  spaceAfter,
  type = "none",
  color
}) => {
  const theme = (0, _useTheme.default)();
  return /*#__PURE__*/React.createElement(StyledContainer, {
    $align: align,
    $indent: indent
  }, /*#__PURE__*/React.createElement(StyledSeparator, {
    $type: type,
    spaceAfter: spaceAfter,
    $color: color && theme.orbit[color]
  }));
};
var _default = Separator;
exports.default = _default;