---
/**
 * Right-hand page sidebar override. Renders Starlight's default "On this page"
 * table of contents, then appends the release-subscribe form in its own panel
 * that mirrors Starlight's `.right-sidebar-panel > .sl-container` structure so
 * it inherits the exact narrow TOC column width (the default `.right-sidebar`
 * is position:fixed and full-width — content must live inside `.sl-container`).
 * Width CSS is replicated in custom.css (.ra-sub-panel-wrap) because Starlight's
 * scoped styles do not reach this component.
 */
import type { Props } from "@astrojs/starlight/props";
import Default from "@astrojs/starlight/components/PageSidebar.astro";
import EmailSubscribe from "./EmailSubscribe.astro";
import FeedbackButton from "./FeedbackButton.astro";
import HeroStarBadge from "./HeroStarBadge.astro";
import githubStats from "../data/github-stats.json";

const GITHUB_URL = "https://github.com/tylerjrbuell/reactive-agents-ts";
---

<Default {...Astro.props}><slot /></Default>

<div class="right-sidebar-panel sl-hidden lg:sl-block ra-sub-panel-wrap">
    <div class="sl-container">
        <a
          href={GITHUB_URL}
          target="_blank"
          rel="noopener"
          class="ra-star-cta"
        >
          <span class="ra-star-icon">⭐</span>
          <span class="ra-star-label">Star on GitHub</span>
          {/* SSR fallback from build-time snapshot; HeroStarBadge overwrites with the live count on load */}
          {githubStats.stars > 0 && (
            <span class="ra-star-count">{githubStats.stars}</span>
          )}
        </a>
        <EmailSubscribe sidebar />
        <FeedbackButton />
    </div>
</div>

<HeroStarBadge />
