@krowdy-ui/views/SuperFilters/DividerWithText.js

React components that implement Google's Material Design.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _react = _interopRequireDefault(require("react"));

var _core = require("@krowdy-ui/core");

var useStyles = (0, _core.makeStyles)(function (theme) {
  return {
    divider: {
      width: '25%'
    },
    root: {
      alignItems: 'center',
      display: 'flex',
      justifyContent: 'center',
      width: '100%'
    },
    text: {
      color: theme.palette.secondary[100],
      fontSize: 14,
      margin: theme.spacing(.5, 1)
    }
  };
});

var DividerWithText = function DividerWithText(_ref) {
  var title = _ref.title;
  var classes = useStyles();
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: classes.root
  }, /*#__PURE__*/_react["default"].createElement(_core.Divider, {
    className: classes.divider
  }), /*#__PURE__*/_react["default"].createElement(_core.Typography, {
    className: classes.text,
    variant: "body2"
  }, title), /*#__PURE__*/_react["default"].createElement(_core.Divider, {
    className: classes.divider
  }));
};

var _default = DividerWithText;
exports["default"] = _default;