_hublib-web/packages/tach-typography/dist/react/index.cjs

'use strict';

var React = require('react');
var antd = require('antd');
var jsxRuntime = require('react/jsx-runtime');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var React__default = /*#__PURE__*/_interopDefault(React);

// src/react/index.tsx

// src/core/classnames.ts
var BASE_CLASS = "tach-typography";
var join = (...parts) => parts.filter(Boolean).join(" ");
var tachTypographyClassName = ({
  variant = "Body",
  color = "primary",
  weight = "normal",
  clickable = false,
  className
} = {}) => {
  return join(
    BASE_CLASS,
    `${BASE_CLASS}--${variant}`,
    `${BASE_CLASS}--color-${color}`,
    weight === "bold" && `${BASE_CLASS}--bold`,
    clickable && `${BASE_CLASS}--pointer`,
    className
  );
};

// src/core/markdown.ts
var TOKEN_PREFIX = "TACHMDTOKEN";
var SAFE_HREF_PATTERN = /^(https?:|mailto:|tel:|\/|#)/i;
var escapeHtml = (value) => value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
var normalizeMarkdown = (value) => value.replace(/\r\n?/g, "\n");
var sanitizeHref = (value) => {
  const href = value.trim();
  if (!href || !SAFE_HREF_PATTERN.test(href)) {
    return null;
  }
  return href;
};
var tachTypographyMarkdownToHtml = (markdown) => {
  const source = normalizeMarkdown(markdown);
  const tokenMap = /* @__PURE__ */ new Map();
  let tokenId = 0;
  const tokenized = source.replace(/`([^`\n]+)`/g, (_match, code) => {
    const token = `${TOKEN_PREFIX}${tokenId++}`;
    tokenMap.set(
      token,
      `<code class="tach-typography__md-code">${escapeHtml(code)}</code>`
    );
    return token;
  }).replace(/\[([^\]\n]+)\]\(([^)\n]+)\)/g, (_match, label, hrefRaw) => {
    const token = `${TOKEN_PREFIX}${tokenId++}`;
    const href = sanitizeHref(hrefRaw);
    if (!href) {
      tokenMap.set(token, escapeHtml(label));
      return token;
    }
    tokenMap.set(
      token,
      `<a class="tach-typography__md-link" href="${escapeHtml(href)}" target="_blank" rel="noopener noreferrer">${escapeHtml(label)}</a>`
    );
    return token;
  });
  let html = escapeHtml(tokenized).replace(/\*\*([^*\n]+)\*\*/g, "<strong>$1</strong>").replace(/__([^_\n]+)__/g, "<strong>$1</strong>").replace(/\*([^*\n]+)\*/g, "<em>$1</em>").replace(/_([^_\n]+)_/g, "<em>$1</em>").replace(/~~([^~\n]+)~~/g, "<del>$1</del>").replace(/\n/g, "<br />");
  html = html.replace(new RegExp(`${TOKEN_PREFIX}\\d+`, "g"), (token) => tokenMap.get(token) || token);
  return html;
};
var createTypographyVariant = (Component, variant) => {
  const Variant = React__default.default.forwardRef(
    ({
      color = "primary",
      weight = "normal",
      className,
      onClick,
      markdownEnabled = false,
      children,
      ...rest
    }, ref) => {
      const markdownHtml = markdownEnabled && typeof children === "string" ? tachTypographyMarkdownToHtml(children) : void 0;
      const renderedChildren = markdownHtml ? /* @__PURE__ */ jsxRuntime.jsx("span", { dangerouslySetInnerHTML: { __html: markdownHtml } }) : children;
      const contentProps = { children: renderedChildren };
      return /* @__PURE__ */ jsxRuntime.jsx(
        Component,
        {
          ref,
          className: tachTypographyClassName({
            variant,
            color,
            weight,
            className,
            clickable: Boolean(onClick)
          }),
          onClick,
          ...rest,
          ...contentProps
        }
      );
    }
  );
  Variant.displayName = String(variant);
  return Variant;
};
var createTypographyComponent = (Component) => ({
  LargeTitle: createTypographyVariant(Component, "LargeTitle"),
  Title1: createTypographyVariant(Component, "Title1"),
  Title2: createTypographyVariant(Component, "Title2"),
  Title3: createTypographyVariant(Component, "Title3"),
  Headline: createTypographyVariant(Component, "Headline"),
  Body: createTypographyVariant(Component, "Body"),
  Inputs: createTypographyVariant(Component, "Inputs"),
  Subheadline: createTypographyVariant(Component, "Subheadline"),
  FootnoteUnderline: createTypographyVariant(Component, "FootnoteUnderline"),
  Footnote: createTypographyVariant(Component, "Footnote"),
  Caption: createTypographyVariant(Component, "Caption"),
  Caption2: createTypographyVariant(Component, "Caption2"),
  AccentH1: createTypographyVariant(Component, "AccentH1"),
  AccentH2: createTypographyVariant(Component, "AccentH2"),
  AccentSubttl: createTypographyVariant(Component, "AccentSubttl"),
  AccentSubttl2: createTypographyVariant(Component, "AccentSubttl2"),
  AccentCaption: createTypographyVariant(Component, "AccentCaption"),
  AccentCaption2: createTypographyVariant(Component, "AccentCaption2"),
  AccentRegularM: createTypographyVariant(Component, "AccentRegularM"),
  AccentRegularS: createTypographyVariant(Component, "AccentRegularS"),
  AccentLargeTtl: createTypographyVariant(Component, "AccentLargeTtl"),
  AppMediumBody: createTypographyVariant(Component, "AppMediumBody"),
  AppMediumSubtext: createTypographyVariant(Component, "AppMediumSubtext"),
  AppMediumSubtextUnderline: createTypographyVariant(Component, "AppMediumSubtextUnderline")
});
var TachTypography = {
  Text: createTypographyComponent(antd.Typography.Text),
  Paragraph: createTypographyComponent(antd.Typography.Paragraph),
  Link: createTypographyComponent(antd.Typography.Link),
  Title: createTypographyComponent(antd.Typography.Title)
};

exports.TachTypography = TachTypography;
//# sourceMappingURL=index.cjs.map
//# sourceMappingURL=index.cjs.map