import { jsxs, jsx } from 'react/jsx-runtime';
import clsx from 'clsx';
import { $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';

var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/8/11 2:55 PM\n* @description 标题\n*/\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-title {\n  display: flex;\n  align-items: center;\n  line-height: 20px;\n}\n.paraui-v3-title .title-ink {\n  width: 4px;\n  height: 14px;\n  background-color: rgb(54, 102, 214);\n  border-radius: 2px;\n}\n.paraui-v3-title .title-icon {\n  display: inline-flex;\n}\n.paraui-v3-title .title-text {\n  margin-left: 8px;\n  font-size: 14px;\n  font-weight: 700;\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-title .title-subtext {\n  margin-left: 12px;\n  font-size: 14px;\n  font-weight: 400;\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-title .title-link {\n  margin-left: 12px;\n  text-decoration: none;\n  outline: none;\n  font-size: 14px;\n  font-weight: 400;\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-title.paraui-v3-title-large .title-icon svg {\n  font-size: 30px;\n}\n.paraui-v3-title.paraui-v3-title-large .title-text {\n  font-size: 18px;\n}\n.paraui-v3-title.paraui-v3-title-medium .title-icon svg {\n  font-size: 24px;\n}\n.paraui-v3-title.paraui-v3-title-medium .title-text {\n  font-size: 16px;\n}\n.paraui-v3-title.paraui-v3-title-small .title-icon svg {\n  font-size: 20px;\n}\n.paraui-v3-title.paraui-v3-title-small .title-text {\n  margin-left: 4px;\n}";
styleInject(css_248z);

//标题
var Title = function Title(props) {
  var title = props.title,
    subTitle = props.subTitle,
    icon = props.icon,
    link = props.link,
    _props$size = props.size,
    size = _props$size === void 0 ? 'medium' : _props$size,
    className = props.className,
    style = props.style;
  //cls
  var makeCls = clsx("".concat($prefixCls, "-title"), className, icon && "".concat($prefixCls, "-title-").concat(size));
  return jsxs("div", Object.assign({
    className: makeCls,
    style: style
  }, {
    children: [icon ? jsx("span", Object.assign({
      className: "title-icon"
    }, {
      children: icon
    })) : jsx("span", {
      className: "title-ink"
    }), jsx("span", Object.assign({
      className: "title-text"
    }, {
      children: title
    })), subTitle && jsx("span", Object.assign({
      className: "title-subtext"
    }, {
      children: subTitle
    })), link && jsx("a", Object.assign({
      className: "title-link",
      target: link.target || '_blank',
      href: link.href,
      onClick: link.onClick
    }, {
      children: link.text
    }))]
  }));
};

export { Title, Title as default };
