@spark-web/divider/dist/spark-web-divider.cjs.dev.js

--- title: Divider storybookPath: page-layout-divider--default isExperimentalPackage: false ---

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var css = require('@emotion/css');
var theme = require('@spark-web/theme');
var jsxRuntime = require('react/jsx-runtime');

var directionMap = {
  row: ['minHeight', 'width'],
  column: ['minWidth', 'height']
}; // TODO: handle dark backgrounds

var Divider = function Divider(_ref) {
  var _styles;

  var _ref$color = _ref.color,
      color = _ref$color === void 0 ? 'standard' : _ref$color,
      vertical = _ref.vertical,
      _ref$width = _ref.width,
      width = _ref$width === void 0 ? 'standard' : _ref$width;
  var theme$1 = theme.useTheme();
  var direction = vertical ? 'row' : 'column';

  var _directionMap$directi = _slicedToArray(directionMap[direction], 2),
      mainAxis = _directionMap$directi[0],
      crossAxis = _directionMap$directi[1];

  var styles = (_styles = {
    alignSelf: 'stretch',
    // 1.
    backgroundColor: theme$1.border.color[color],
    flexShrink: 0
  }, _defineProperty(_styles, crossAxis, theme$1.border.width[width]), _defineProperty(_styles, mainAxis, '100%'), _styles);
  return /*#__PURE__*/jsxRuntime.jsx("div", {
    className: css.css(styles)
  });
};

exports.Divider = Divider;