"use strict";

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

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

var _components = require("@patternplate/components");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var _default = DocPane;
exports.default = _default;

function DocPane(props) {
  return _react.default.createElement(StyledDocPane, {
    className: props.className,
    hermit: props.hermit
  }, _react.default.createElement(StyledScrollbox, null, _react.default.createElement(_components.Markdown, {
    source: props.doc,
    linkable: false
  })));
}

const BORDER_RADIUS = 10;

const StyledDocPane = _components.styled.div.withConfig({
  displayName: "doc-pane__StyledDocPane"
})(["position:relative;height:100%;width:100%;box-sizing:border-box;&::before{content:\"\";position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;border-radius:", ";background:", ";}"], props => props.hermit ? `${BORDER_RADIUS}px` : `0 ${BORDER_RADIUS}px ${BORDER_RADIUS}px 0`, props => props.theme.background);

const StyledScrollbox = _components.styled.div.withConfig({
  displayName: "doc-pane__StyledScrollbox"
})(["position:relative;z-index:2;height:100%;width:100%;box-sizing:border-box;overflow:scroll;-webkit-overflow-scrolling:touch;padding:10px 15px;"]);
//# sourceMappingURL=doc-pane.js.map