import React, { useEffect } from 'react';
import { useDragonKitValue } from '../../context/DragonKitContext';
import { LinkTo } from '../LinkTo';

var BlogKit = function BlogKit(_ref) {
  var title = _ref.title,
      category = _ref.category,
      url = _ref.url,
      children = _ref.children,
      theme = _ref.theme;

  var _useDragonKitValue = useDragonKitValue(),
      setDragonKitValue = _useDragonKitValue[1];

  useEffect(function () {
    setDragonKitValue({
      type: 'theme',
      theme: theme
    });
    setDragonKitValue({
      type: 'blogUrl',
      blogUrl: url
    });
  }, []);
  return React.createElement(React.Fragment, null, title && React.createElement("div", {
    className: "blog-title clouds-dark"
  }, React.createElement("div", {
    className: "inner"
  }, !category && React.createElement("h1", null, title), category && React.createElement(React.Fragment, null, React.createElement(LinkTo, {
    type: "route",
    to: url
  }, title, " /"), React.createElement("span", null, category)))), React.createElement("div", {
    className: "blog"
  }, React.createElement("div", {
    className: "inner"
  }, children)));
};

BlogKit.displayName = 'Blog Kit';
var BlogKitDoc;

if (process.env.NODE_ENV !== 'production') {
  // eslint-disable-next-line global-require
  BlogKitDoc = require('./doc').doc(BlogKit);
}

var BlogKitWrapper = BlogKitDoc || BlogKit;
export { BlogKitWrapper as BlogKit };