(function registerPageIssueDrawer(global) {
  'use strict';

  function PageIssueDrawer(props) {
    var React = global.React;
    var issue = props && props.issue;
    var onClose = props && props.onClose || function noop() {};
    if (!issue) return null;
    return React.createElement('aside', { className: 'free-seo-drawer', role: 'dialog', 'aria-label': 'Issue detail' }, [
      React.createElement('button', { key: 'close', type: 'button', className: 'free-seo-drawer-close', onClick: onClose }, 'Close'),
      React.createElement('p', { key: 'eyebrow', className: 'eyebrow' }, issue.severity + ' / ' + issue.category),
      React.createElement('h2', { key: 'title' }, issue.code),
      React.createElement('p', { key: 'message' }, issue.message),
      React.createElement('h3', { key: 'recTitle' }, 'Recommended fix'),
      React.createElement('p', { key: 'rec' }, issue.recommendation),
      React.createElement('h3', { key: 'pageTitle' }, 'Page'),
      React.createElement('p', { key: 'page' }, React.createElement('a', { href: issue.pageUrl, target: '_blank', rel: 'noreferrer' }, issue.pageUrl)),
      React.createElement('pre', { key: 'evidence' }, JSON.stringify(issue.evidence || {}, null, 2))
    ]);
  }

  global.FreeSeoPageIssueDrawer = PageIssueDrawer;
})(typeof window !== 'undefined' ? window : globalThis);