import React from "react";
import CssFlex from "../../../../../ui/CssFlex";
import Circle from "../../../../../ui/Icon/Circle";
import Typography from "../../../../../ui/Typography";

var TextSectionHeader = function TextSectionHeader(props) {
  var translations = props.translations,
      warning = props.warning;
  return /*#__PURE__*/React.createElement(CssFlex, {
    direction: "column",
    gap: "md"
  }, /*#__PURE__*/React.createElement(CssFlex, {
    gap: "xs"
  }, /*#__PURE__*/React.createElement(Typography, {
    variant: "inputText",
    shade: 800,
    weight: "semibold"
  }, translations.title), warning && /*#__PURE__*/React.createElement(Circle, {
    size: 8,
    color: "warning"
  })), /*#__PURE__*/React.createElement(Typography, {
    variant: "paragraph",
    shade: 400
  }, translations.description));
};

export default TextSectionHeader;