import React__default from 'react';
import { Prism } from 'react-syntax-highlighter';
import { tokens } from '../Markdown.tokens.js';
import { InlineCode, CodeBlock, CodeBlockHeader, CodeLanguage, CodeBlockBody, syntaxTheme, TableScroll, StyledBlockImage, StyledInlineImage } from '../Markdown.styles.js';
import { sanitizeUrl } from '../utils/sanitizeUrl.js';
import { renderElement } from './renderUtils.js';

var getCodeLanguage = function getCodeLanguage(className) {
  if (!className) {
    return undefined;
  }
  var match = className.match(/(?:lang(?:uage)?-)([a-z0-9+#.-]+)/i);
  return match && match[1] ? match[1].toLowerCase() : undefined;
};
var CodeRenderer = function CodeRenderer(_ref) {
  var children = _ref.children,
    className = _ref.className,
    inline = _ref.inline;
  var value = String(children || '').replace(/\n$/, '');
  if (inline) {
    return /*#__PURE__*/React__default.createElement(InlineCode, {
      className: className
    }, children);
  }
  var language = getCodeLanguage(className) || 'text';
  return /*#__PURE__*/React__default.createElement(CodeBlock, null, /*#__PURE__*/React__default.createElement(CodeBlockHeader, null, /*#__PURE__*/React__default.createElement(CodeLanguage, null, language)), /*#__PURE__*/React__default.createElement(CodeBlockBody, null, /*#__PURE__*/React__default.createElement(Prism, {
    PreTag: "div",
    codeTagProps: {
      style: {
        fontFamily: 'SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace'
      }
    },
    customStyle: {
      margin: 0,
      padding: "var(".concat(tokens.codeBlockPadding, ", 1rem 1.125rem)")
    },
    language: language,
    style: syntaxTheme,
    wrapLongLines: true
  }, value)));
};
var renderCode = function renderCode(key, props) {
  return renderElement(key, CodeRenderer, props, props.children);
};
var ImageRenderer = function ImageRenderer(_ref2) {
  var alt = _ref2.alt,
    _ref2$imageDisplay = _ref2.imageDisplay,
    imageDisplay = _ref2$imageDisplay === void 0 ? 'inline' : _ref2$imageDisplay,
    src = _ref2.src,
    title = _ref2.title;
  var sanitizedSrc = sanitizeUrl(src);
  if (!sanitizedSrc) {
    return null;
  }
  var Image = imageDisplay === 'block' ? StyledBlockImage : StyledInlineImage;
  return /*#__PURE__*/React__default.createElement(Image, {
    alt: alt || '',
    loading: "lazy",
    src: sanitizedSrc,
    title: title
  });
};
var LinkRenderer = function LinkRenderer(_ref3) {
  var href = _ref3.href,
    children = _ref3.children,
    title = _ref3.title;
  var sanitizedHref = sanitizeUrl(href);
  var isExternal = typeof sanitizedHref === 'string' && /^https?:\/\//.test(sanitizedHref);
  return /*#__PURE__*/React__default.createElement("a", {
    href: sanitizedHref,
    rel: isExternal ? 'noreferrer noopener' : undefined,
    target: isExternal ? '_blank' : undefined,
    title: title
  }, children);
};
var TableRenderer = function TableRenderer(_ref4) {
  var children = _ref4.children;
  return /*#__PURE__*/React__default.createElement(TableScroll, null, /*#__PURE__*/React__default.createElement("table", null, children));
};

export { ImageRenderer, LinkRenderer, TableRenderer, renderCode };
