@activecollab/components/dist/esm/components/TitledText/TitledText.js

ActiveCollab Components

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["title", "variant", "children"];
import React, { forwardRef } from "react";
import { StyledTitle1 } from "./Styles";
import { Stack } from "../Stack";
import { Header2, Title2 } from "../Typography";

/** Heading typography of a TitledText — a component prop, not wire data. */

/** Props every heading in the trio accepts: content plus an optional anchor id. */

const BoldTitle2 = _ref => {
  let id = _ref.id,
    children = _ref.children;
  return /*#__PURE__*/React.createElement(Title2, {
    id: id,
    weight: "bold"
  }, children);
};

/**
 * The one heading trio the envelope renders — TitledText variants and the
 * Portable Text `heading` / `titled-text` levels all resolve through this
 * map, so the typography can never drift between them.
 */
export const titledTextHeadings = {
  title1: StyledTitle1,
  title2: BoldTitle2,
  header2: Header2
};
/** A heading plus body, with typography control on the heading. */
export const TitledText = /*#__PURE__*/forwardRef((_ref2, ref) => {
  var _titledTextHeadings$v;
  let title = _ref2.title,
    _ref2$variant = _ref2.variant,
    variant = _ref2$variant === void 0 ? "header2" : _ref2$variant,
    children = _ref2.children,
    rest = _objectWithoutPropertiesLoose(_ref2, _excluded);
  const Heading = (_titledTextHeadings$v = titledTextHeadings[variant]) != null ? _titledTextHeadings$v : titledTextHeadings.header2;
  return /*#__PURE__*/React.createElement(Stack, _extends({
    ref: ref,
    space: children ? "xs" : "none"
  }, rest), /*#__PURE__*/React.createElement(Heading, null, title), children);
});
TitledText.displayName = "TitledText";
//# sourceMappingURL=TitledText.js.map