/* Markdown README header — drop into the root of any Nexus ReGen repo.
   Unlike the HTML templates above, this template's payload is plain text:
   we render the source inside a styled <pre> block (no Markdown parser
   is loaded on this site) and offer a copy / download for the .md file. */

function readmeMarkdown({
  pkg = '@nexus/openwaste',
  tagline = 'Material listings & matching for the construction reuse network.',
  installCmd = 'pnpm add @nexus/openwaste',
  runCmd = 'pnpm dev',
} = {}) {
  return `<p align="center">
  <picture>
    <source media="(prefers-color-scheme: dark)" srcset="https://branding.nexusregen.com/downloads/marks/wordmark-on-navy.svg" />
    <img alt="Nexus ReGen" src="https://branding.nexusregen.com/downloads/marks/wordmark-on-paper.svg" width="320" />
  </picture>
  <br/>
  <em>${tagline}</em>
</p>

<p align="center">
  <a href="https://github.com/nexusregen/${pkg.replace(/^@nexus\//, '')}/actions"><img src="https://img.shields.io/github/actions/workflow/status/nexusregen/${pkg.replace(/^@nexus\//, '')}/ci.yml?style=flat-square&labelColor=121541&color=F7EC33" alt="build" /></a>
  <a href="./LICENSE"><img src="https://img.shields.io/badge/license-MIT-121541?style=flat-square&labelColor=121541" alt="license" /></a>
  <a href="https://www.npmjs.com/package/${pkg}"><img src="https://img.shields.io/npm/v/${pkg.replace('/', '%2F')}?style=flat-square&labelColor=121541&color=121541" alt="version" /></a>
</p>

## Overview

\`${pkg}\` is part of the Nexus ReGen platform — the chain-of-custody layer
for material reuse on construction sites. This package handles material
listings, matching candidates between sites, and the audit trail every
movement leaves behind. Designed to be run in-process by the platform
or pulled into partner stacks via the public SDK.

## Quick start

\`\`\`bash
# Install
${installCmd}

# Develop
${runCmd}

# Run the test suite
pnpm test
\`\`\`

## Architecture

- \`src/listings\` — listing schema, validators, geo-indexing
- \`src/matching\` — candidate scoring, distance + chemistry filters
- \`src/audit\` — append-only movement log, signed manifests
- \`src/adapters\` — ESP / waste-carrier API integrations

## Documentation

- Brand & design system — https://branding.nexusregen.com
- Platform docs — https://docs.nexusregen.com
- API reference — https://docs.nexusregen.com/api
- Status — https://status.nexusregen.com

## License

MIT © Nexus ReGen Ltd · Materially smarter construction
`;
}

/* Copy + download row — Markdown variant of TemplateActions. */
function MarkdownActions({ markdown, filename }) {
  const [copied, setCopied] = useState(false);
  const copyMd = () => {
    copy(markdown);
    setCopied(true);
    setTimeout(() => setCopied(false), 1400);
  };
  const downloadHref = useMemo(() => {
    const blob = new Blob([markdown], { type: 'text/markdown;charset=utf-8' });
    return URL.createObjectURL(blob);
  }, [markdown]);
  return (
    <div style={{ display: 'flex', gap: 10, alignItems: 'center', flexWrap: 'wrap' }}>
      <button
        onClick={copyMd}
        style={{
          background: 'var(--brand-600)', color: '#fff',
          border: '1px solid var(--brand-700)',
          padding: '10px 14px', borderRadius: 8,
          fontFamily: 'var(--font-mono)', fontSize: 12, fontWeight: 600,
          cursor: 'pointer',
        }}
      >
        {copied ? '✓ Copied Markdown' : '⧉ Copy Markdown'}
      </button>
      <a
        href={downloadHref}
        download={filename}
        style={{
          textDecoration: 'none',
          background: 'var(--accent-400)', color: 'var(--brand-700)',
          border: '1px solid var(--accent-500)',
          padding: '10px 14px', borderRadius: 8,
          fontFamily: 'var(--font-mono)', fontSize: 12, fontWeight: 700,
          display: 'inline-flex', alignItems: 'center', gap: 6,
        }}
      >↓ {filename}</a>
      <span style={{ fontSize: 12, color: 'var(--text-quaternary)' }}>
        Paste into a new repo as <code style={{ fontFamily: 'var(--font-mono)' }}>README.md</code> at the project root.
      </span>
    </div>
  );
}

function S_TplReadme() {
  const md = useMemo(() => readmeMarkdown(), []);
  return (
    <Section
      id="tpl-readme"
      eyebrow="08 · Templates"
      title="Repo README header"
      intro="A drop-in Markdown header for any Nexus ReGen repository. Centred wordmark, status badges in brand colours, and the canonical section order — overview, quick start, architecture, docs, license. Renders consistently on github.com and most Markdown viewers."
    >
      <Block title="Preview" note="Markdown source · paste verbatim into README.md">
        <pre style={{
          margin: 0,
          background: 'var(--brand-50)',
          color: 'var(--text-primary)',
          border: '1px solid var(--border-secondary)',
          borderRadius: 12,
          padding: 20,
          fontFamily: 'var(--font-mono)',
          fontSize: 12.5,
          lineHeight: 1.6,
          maxHeight: 520,
          overflow: 'auto',
          whiteSpace: 'pre',
        }}>
          <code>{md}</code>
        </pre>
      </Block>

      <Block title="Use it">
        <MarkdownActions markdown={md} filename="README.md" />
      </Block>
    </Section>
  );
}

window.S_TplReadme = S_TplReadme;