@cedros/data-react 0.1.0

package/dist/site-templates/solanaMicropayments.d.ts

@@ -0,0 +1,65 @@
+import type { TipCurrency, TipPayClient } from "./tipControls.js";
+/** Minimal Phantom/Solflare wallet interface — avoids external @types dep. */
+interface SolanaWallet {
+    isConnected: boolean;
+    publicKey: {
+        toBuffer(): Uint8Array;
+        toString(): string;
+    } | null;
+    connect(): Promise<{
+        publicKey: {
+            toString(): string;
+        };
+    }>;
+    signAndSendTransaction(tx: unknown): Promise<{
+        signature: string;
+    }>;
+}
+declare global {
+    interface Window {
+        solana?: SolanaWallet;
+    }
+}
+/** Returns true when a Solana wallet extension is detected in the browser. */
+export declare function detectSolanaWallet(): boolean;
+export declare const SOL_CURRENCY: TipCurrency;
+export declare const USDC_CURRENCY: TipCurrency;
+export interface SolanaMicropaymentsProps {
+    /** Solana wallet address that receives tips. */
+    recipient: string;
+    /** Preset tip amounts in SOL (used when `currencies` is not provided). */
+    presets?: number[];
+    /** Solana RPC endpoint. Defaults to mainnet-beta. */
+    rpcEndpoint?: string;
+    /** Label above the tip widget. */
+    label?: string;
+    /** Description text below the label. */
+    description?: string;
+    /** Available tip currencies. Defaults to SOL-only. */
+    currencies?: TipCurrency[];
+    /** Per-currency preset amounts. Overrides `presets` when provided. */
+    currencyPresets?: Record<string, number[]>;
+    /** When set, forces SOL-only tipping to this address (per-author tips). */
+    recipientOverride?: string;
+}
+/**
+ * Creates a TipPayClient that sends SOL or SPL token transfers via
+ * the connected Solana wallet extension (Phantom, Solflare, etc.).
+ *
+ * Branches on `currency.mint`:
+ * - No mint → native SOL transfer via SystemProgram
+ * - Has mint → SPL token transfer via @solana/spl-token
+ *
+ * @param rpcEndpoint - Optional RPC URL, defaults to mainnet-beta
+ * @returns TipPayClient implementation
+ */
+export declare function createSolanaTipClient(rpcEndpoint?: string): TipPayClient;
+/**
+ * Renders a TipWidget for Solana tips (SOL and/or SPL tokens).
+ *
+ * - Auto-detects wallet presence via `useEffect`; renders nothing when absent.
+ * - When `recipientOverride` is set, forces SOL-only tipping to override address.
+ * - Lazily creates the pay client on first render.
+ */
+export declare function SolanaMicropayments({ recipient, presets, rpcEndpoint, label, description, currencies, currencyPresets, recipientOverride, }: SolanaMicropaymentsProps): React.JSX.Element | null;
+export {};

package/dist/site-templates/solanaMicropayments.js

@@ -0,0 +1,115 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { TipWidget } from "./tipControls.js";
+/** Returns true when a Solana wallet extension is detected in the browser. */
+export function detectSolanaWallet() {
+    return typeof window !== "undefined" && !!window.solana;
+}
+export const SOL_CURRENCY = {
+    symbol: "SOL",
+    decimals: 9,
+    logo: "",
+};
+export const USDC_CURRENCY = {
+    symbol: "USDC",
+    decimals: 6,
+    logo: "",
+    mint: "EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v",
+};
+const DEFAULT_RPC = "https://api.mainnet-beta.solana.com";
+/**
+ * Creates a TipPayClient that sends SOL or SPL token transfers via
+ * the connected Solana wallet extension (Phantom, Solflare, etc.).
+ *
+ * Branches on `currency.mint`:
+ * - No mint → native SOL transfer via SystemProgram
+ * - Has mint → SPL token transfer via @solana/spl-token
+ *
+ * @param rpcEndpoint - Optional RPC URL, defaults to mainnet-beta
+ * @returns TipPayClient implementation
+ */
+export function createSolanaTipClient(rpcEndpoint = DEFAULT_RPC) {
+    return {
+        async sendTip(params) {
+            const wallet = window.solana;
+            if (!wallet)
+                throw new Error("No Solana wallet detected");
+            if (!wallet.isConnected) {
+                await wallet.connect();
+            }
+            if (!wallet.publicKey)
+                throw new Error("Wallet not connected");
+            if (params.currency.mint) {
+                await sendSplTransfer(wallet, rpcEndpoint, params);
+            }
+            else {
+                await sendSolTransfer(wallet, rpcEndpoint, params);
+            }
+        },
+    };
+}
+async function sendSolTransfer(wallet, rpcEndpoint, { amount, recipient }) {
+    const { Connection, PublicKey, SystemProgram, Transaction } = await import("@solana/web3.js");
+    const connection = new Connection(rpcEndpoint, "confirmed");
+    const lamports = Math.round(amount * 1e9);
+    const tx = new Transaction().add(SystemProgram.transfer({
+        fromPubkey: new PublicKey(wallet.publicKey.toString()),
+        toPubkey: new PublicKey(recipient),
+        lamports,
+    }));
+    tx.feePayer = new PublicKey(wallet.publicKey.toString());
+    tx.recentBlockhash = (await connection.getLatestBlockhash()).blockhash;
+    const { signature } = await wallet.signAndSendTransaction(tx);
+    await connection.confirmTransaction(signature, "confirmed");
+}
+async function sendSplTransfer(wallet, rpcEndpoint, { amount, recipient, currency }) {
+    const { Connection, PublicKey, Transaction } = await import("@solana/web3.js");
+    const { getAssociatedTokenAddress, createTransferInstruction } = await import("@solana/spl-token");
+    const connection = new Connection(rpcEndpoint, "confirmed");
+    const mintPubkey = new PublicKey(currency.mint);
+    const senderPubkey = new PublicKey(wallet.publicKey.toString());
+    const recipientPubkey = new PublicKey(recipient);
+    const senderAta = await getAssociatedTokenAddress(mintPubkey, senderPubkey);
+    const recipientAta = await getAssociatedTokenAddress(mintPubkey, recipientPubkey);
+    // Verify recipient ATA exists — admin must pre-create it
+    const recipientInfo = await connection.getAccountInfo(recipientAta);
+    if (!recipientInfo) {
+        throw new Error(`Recipient does not have a ${currency.symbol} token account. ` +
+            `The site admin must create it before accepting ${currency.symbol} tips.`);
+    }
+    const tokenAmount = Math.round(amount * 10 ** currency.decimals);
+    const tx = new Transaction().add(createTransferInstruction(senderAta, recipientAta, senderPubkey, tokenAmount));
+    tx.feePayer = senderPubkey;
+    tx.recentBlockhash = (await connection.getLatestBlockhash()).blockhash;
+    const { signature } = await wallet.signAndSendTransaction(tx);
+    await connection.confirmTransaction(signature, "confirmed");
+}
+/**
+ * Renders a TipWidget for Solana tips (SOL and/or SPL tokens).
+ *
+ * - Auto-detects wallet presence via `useEffect`; renders nothing when absent.
+ * - When `recipientOverride` is set, forces SOL-only tipping to override address.
+ * - Lazily creates the pay client on first render.
+ */
+export function SolanaMicropayments({ recipient, presets = [0.01, 0.05, 0.1], rpcEndpoint, label = "Tip with SOL", description, currencies, currencyPresets, recipientOverride, }) {
+    const [hasWallet, setHasWallet] = useState(false);
+    const [client, setClient] = useState(null);
+    useEffect(() => {
+        if (detectSolanaWallet()) {
+            setHasWallet(true);
+            setClient(createSolanaTipClient(rpcEndpoint));
+        }
+    }, [rpcEndpoint]);
+    if (!hasWallet || !client)
+        return null;
+    // Per-author override: force SOL-only
+    const effectiveRecipient = recipientOverride ?? recipient;
+    const effectiveCurrencies = recipientOverride
+        ? [SOL_CURRENCY]
+        : (currencies ?? [SOL_CURRENCY]);
+    const effectivePresets = recipientOverride
+        ? { SOL: presets }
+        : (currencyPresets ?? { SOL: presets });
+    return (_jsx(TipWidget, { recipient: effectiveRecipient, currencies: effectiveCurrencies, presets: effectivePresets, payClient: client, label: recipientOverride ? "Tip the author" : label, description: description }));
+}

package/dist/site-templates/styles.css

@@ -0,0 +1,332 @@
+@import "./content-styles.css";
+
+.cedros-site {
+  --cds-bg: var(--cedros-background, #ffffff);
+  --cds-fg: var(--cedros-foreground, #0f172a);
+  --cds-muted: var(--cedros-muted-foreground, #64748b);
+  --cds-muted-bg: var(--cedros-muted, #f1f5f9);
+  --cds-border: var(--cedros-border, #e2e8f0);
+  --cds-link: var(--cedros-link, #2563eb);
+  --cds-primary: var(--cedros-primary, #0f172a);
+  --cds-primary-fg: var(--cedros-primary-foreground, #f8fafc);
+  --cds-radius: var(--cedros-radius, 0.5rem);
+  --cds-shadow: 0 1px 2px rgb(0 0 0 / 0.05);
+  color: var(--cds-fg);
+  background: var(--cds-bg);
+  min-height: 100%;
+  font-family:
+    ui-sans-serif,
+    system-ui,
+    -apple-system,
+    BlinkMacSystemFont,
+    "Segoe UI",
+    Roboto,
+    "Helvetica Neue",
+    Arial,
+    sans-serif;
+}
+
+.cedros-dark .cedros-site {
+  --cds-bg: hsl(222.2, 84%, 4.9%);
+  --cds-fg: hsl(210, 40%, 98%);
+  --cds-muted: hsl(215, 20.2%, 65.1%);
+  --cds-muted-bg: hsl(217.2, 32.6%, 17.5%);
+  --cds-border: hsl(217.2, 32.6%, 17.5%);
+  --cds-link: hsl(217.2, 91.2%, 59.8%);
+  --cds-primary: hsl(210, 40%, 98%);
+  --cds-primary-fg: hsl(222.2, 47.4%, 11.2%);
+}
+
+.cedros-site__container {
+  width: min(1080px, 100%);
+  margin: 0 auto;
+  padding: 0 1rem;
+}
+
+.cedros-site__header {
+  border-bottom: 1px solid var(--cds-border);
+  background: color-mix(in srgb, var(--cds-bg) 90%, var(--cds-muted-bg) 10%);
+}
+
+.cedros-site__header-inner {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  min-height: 4rem;
+}
+
+.cedros-site__brand {
+  font-size: 1rem;
+  font-weight: 700;
+  text-decoration: none;
+  color: var(--cds-fg);
+  letter-spacing: -0.02em;
+  flex-shrink: 0;
+}
+
+.cedros-site__nav {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 0.5rem;
+  margin-left: auto;
+}
+
+.cedros-site__nav-link {
+  display: inline-flex;
+  align-items: center;
+  border: 1px solid transparent;
+  border-radius: calc(var(--cds-radius) - 2px);
+  padding: 0.45rem 0.65rem;
+  color: var(--cds-muted);
+  text-decoration: none;
+  font-size: 0.85rem;
+  transition: color 120ms ease, background 120ms ease, border-color 120ms ease;
+}
+
+.cedros-site__nav-link:hover {
+  color: var(--cds-fg);
+  background: var(--cds-muted-bg);
+  border-color: var(--cds-border);
+}
+
+.cedros-site__nav-link--active {
+  color: var(--cds-fg);
+  background: color-mix(in srgb, var(--cds-link) 9%, var(--cds-muted-bg) 91%);
+  border-color: color-mix(in srgb, var(--cds-link) 55%, var(--cds-border) 45%);
+}
+
+.cedros-site__nav-link--disabled {
+  pointer-events: none;
+  opacity: 0.5;
+}
+
+.cedros-site__header-right {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.45rem;
+}
+
+.cedros-site__main {
+  padding: 1.5rem 0 2.4rem;
+}
+
+.cedros-site__footer {
+  border-top: 1px solid var(--cds-border);
+  background: color-mix(in srgb, var(--cds-bg) 90%, var(--cds-muted-bg) 10%);
+}
+
+.cedros-site__footer-inner {
+  min-height: 3.2rem;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 0.9rem;
+  color: var(--cds-muted);
+  font-size: 0.8rem;
+}
+
+.cedros-site__footer-brand {
+  display: inline-flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 0.7rem;
+}
+
+.cedros-site__footer-links {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.6rem;
+  margin-left: auto;
+}
+
+.cedros-site__footer-link {
+  text-decoration: none;
+  color: var(--cds-muted);
+  border-bottom: 1px solid transparent;
+}
+
+.cedros-site__footer-link:hover {
+  color: var(--cds-fg);
+  border-bottom-color: color-mix(in srgb, var(--cds-border) 80%, transparent);
+}
+
+.cedros-site__footer-right {
+  margin-left: auto;
+}
+
+.cedros-site__card {
+  border: 1px solid var(--cds-border);
+  border-radius: var(--cds-radius);
+  background: color-mix(in srgb, var(--cds-bg) 94%, var(--cds-muted-bg) 6%);
+  box-shadow: var(--cds-shadow);
+  padding: 1rem;
+}
+
+.cedros-site__title {
+  margin: 0;
+  font-size: clamp(1.4rem, 3vw, 2.2rem);
+  line-height: 1.1;
+  letter-spacing: -0.03em;
+}
+
+.cedros-site__subtitle {
+  margin: 0.8rem 0 0;
+  color: var(--cds-muted);
+  max-width: 72ch;
+}
+
+.cedros-site a {
+  color: var(--cds-link);
+}
+
+.cedros-site__pill {
+  display: inline-flex;
+  align-items: center;
+  border-radius: 999px;
+  border: 1px solid var(--cds-border);
+  background: var(--cds-muted-bg);
+  color: var(--cds-muted);
+  padding: 0.18rem 0.48rem;
+  font-size: 0.72rem;
+}
+
+.cedros-site-dashboard__layout {
+  display: grid;
+  grid-template-columns: minmax(220px, 250px) minmax(0, 1fr);
+  gap: 1rem;
+}
+
+.cedros-site-dashboard__sidebar {
+  display: grid;
+  align-content: start;
+  gap: 0.8rem;
+}
+
+.cedros-site-dashboard__profile {
+  display: grid;
+  gap: 0.3rem;
+}
+
+.cedros-site-dashboard__profile-name {
+  margin: 0;
+  font-size: 0.95rem;
+}
+
+.cedros-site-dashboard__profile-email {
+  margin: 0;
+  font-size: 0.78rem;
+  color: var(--cds-muted);
+}
+
+.cedros-site-dashboard__side-nav {
+  display: grid;
+  gap: 0.45rem;
+}
+
+.cedros-site-dashboard__side-link {
+  border: 1px solid var(--cds-border);
+  border-radius: calc(var(--cds-radius) - 1px);
+  background: color-mix(in srgb, var(--cds-bg) 94%, var(--cds-muted-bg) 6%);
+  color: var(--cds-fg);
+  text-decoration: none;
+  padding: 0.55rem 0.65rem;
+  display: grid;
+  gap: 0.2rem;
+  font-size: 0.82rem;
+  transition: border-color 130ms ease, background 130ms ease;
+}
+
+.cedros-site-dashboard__side-link:hover {
+  border-color: color-mix(in srgb, var(--cds-border) 60%, var(--cds-link) 40%);
+  background: color-mix(in srgb, var(--cds-muted-bg) 86%, transparent);
+}
+
+.cedros-site-dashboard__side-link--active {
+  border-color: color-mix(in srgb, var(--cds-link) 60%, var(--cds-border) 40%);
+  background: color-mix(in srgb, var(--cds-link) 10%, var(--cds-muted-bg) 90%);
+}
+
+.cedros-site-dashboard__side-description {
+  color: var(--cds-muted);
+  font-size: 0.72rem;
+}
+
+.cedros-site-dashboard__badge {
+  justify-self: start;
+  border: 1px solid var(--cds-border);
+  border-radius: 999px;
+  padding: 0.08rem 0.4rem;
+  font-size: 0.7rem;
+  color: var(--cds-muted);
+  background: color-mix(in srgb, var(--cds-muted-bg) 92%, transparent);
+}
+
+.cedros-site-dashboard__content {
+  min-width: 0;
+  display: grid;
+  gap: 0.8rem;
+}
+
+.cedros-site-dashboard__content-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 0.8rem;
+}
+
+.cedros-site-dashboard__title {
+  font-size: clamp(1.2rem, 2.2vw, 1.75rem);
+}
+
+.cedros-site-dashboard__actions {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.45rem;
+}
+
+.cedros-site-dashboard__panel {
+  min-width: 0;
+  display: grid;
+  gap: 0.9rem;
+}
+
+@media (max-width: 900px) {
+  .cedros-site-dashboard__layout {
+    grid-template-columns: 1fr;
+  }
+
+  .cedros-site-dashboard__side-nav {
+    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
+  }
+}
+
+@media (max-width: 700px) {
+  .cedros-site__header-inner {
+    min-height: auto;
+    padding: 0.8rem 0;
+    flex-wrap: wrap;
+  }
+
+  .cedros-site__nav {
+    margin-left: 0;
+  }
+
+  .cedros-site__header-right {
+    margin-left: auto;
+  }
+
+  .cedros-site__footer-inner {
+    min-height: auto;
+    padding: 0.75rem 0;
+    flex-wrap: wrap;
+  }
+
+  .cedros-site__footer-links {
+    margin-left: 0;
+  }
+
+  .cedros-site__footer-right {
+    margin-left: 0;
+  }
+}

package/dist/site-templates/tipControls.d.ts

@@ -0,0 +1,24 @@
+export interface TipCurrency {
+    symbol: string;
+    decimals: number;
+    logo: string;
+    mint?: string;
+}
+export interface TipParams {
+    currency: TipCurrency;
+    amount: number;
+    recipient: string;
+}
+/** Provided by @cedros/pay-react (or any compatible implementation). */
+export interface TipPayClient {
+    sendTip(params: TipParams): Promise<void>;
+}
+export interface TipWidgetProps {
+    recipient: string;
+    currencies: TipCurrency[];
+    presets?: Record<string, number[]>;
+    payClient: TipPayClient;
+    label?: string;
+    description?: string;
+}
+export declare function TipWidget({ recipient, currencies, presets, payClient, label, description }: TipWidgetProps): React.JSX.Element;

package/dist/site-templates/tipControls.js

@@ -0,0 +1,43 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useState } from "react";
+export function TipWidget({ recipient, currencies, presets, payClient, label = "Leave a tip", description }) {
+    const [selectedIndex, setSelectedIndex] = useState(0);
+    const [amount, setAmount] = useState("");
+    const [status, setStatus] = useState("idle");
+    const [errorMessage, setErrorMessage] = useState("");
+    const selectedCurrency = currencies[selectedIndex] ?? currencies[0];
+    const currentPresets = selectedCurrency ? presets?.[selectedCurrency.symbol] : undefined;
+    const handleSubmit = useCallback(async () => {
+        if (!selectedCurrency)
+            return;
+        const numericAmount = parseFloat(amount);
+        if (!numericAmount || numericAmount <= 0)
+            return;
+        setStatus("loading");
+        setErrorMessage("");
+        try {
+            await payClient.sendTip({ currency: selectedCurrency, amount: numericAmount, recipient });
+            setStatus("success");
+            setAmount("");
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setStatus("error");
+            setErrorMessage(error.message);
+        }
+    }, [selectedCurrency, amount, payClient, recipient]);
+    if (!selectedCurrency)
+        return _jsx("div", { className: "cedros-site__tip-widget" });
+    return (_jsxs("div", { className: "cedros-site__tip-widget", children: [_jsx("h3", { className: "cedros-site__tip-title", children: label }), description && _jsx("p", { className: "cedros-site__tip-description", children: description }), currencies.length > 1 && (_jsx("select", { className: "cedros-site__tip-currency", value: selectedIndex, onChange: (e) => {
+                    setSelectedIndex(Number(e.target.value));
+                    setAmount("");
+                    setStatus("idle");
+                }, children: currencies.map((c, i) => (_jsx("option", { value: i, children: c.symbol }, c.symbol))) })), currentPresets && currentPresets.length > 0 && (_jsx("div", { className: "cedros-site__tip-presets", children: currentPresets.map((presetAmount) => (_jsxs("button", { type: "button", className: "cedros-site__pill", onClick: () => {
+                        setAmount(String(presetAmount));
+                        setStatus("idle");
+                    }, children: [presetAmount, " ", selectedCurrency.symbol] }, presetAmount))) })), _jsx("div", { className: "cedros-site__tip-amount", children: _jsx("input", { type: "number", min: "0", step: "any", placeholder: `Amount in ${selectedCurrency.symbol}`, value: amount, onChange: (e) => {
+                        setAmount(e.target.value);
+                        setStatus("idle");
+                    } }) }), _jsx("button", { type: "button", className: "cedros-site__tip-submit", disabled: status === "loading" || !amount || parseFloat(amount) <= 0, onClick: () => void handleSubmit(), children: status === "loading" ? "Sending..." : "Send Tip" }), status === "success" && (_jsx("p", { className: "cedros-site__tip-status cedros-site__tip-status--success", children: "Tip sent successfully!" })), status === "error" && (_jsx("p", { className: "cedros-site__tip-status cedros-site__tip-status--error", children: errorMessage || "Failed to send tip." }))] }));
+}

package/dist/site-templates/tocExtractor.d.ts

@@ -0,0 +1,16 @@
+export interface TocEntry {
+    id: string;
+    label: string;
+    depth: 2 | 3 | 4;
+}
+/**
+ * Extracts a table-of-contents from raw markdown.
+ *
+ * Walks top-level heading nodes (h2–h4), slugifies the text content to
+ * produce `id` values matching `rehype-slug` output, and returns entries
+ * compatible with the `DocArticleTemplate` `toc` prop.
+ *
+ * @param markdown - Raw markdown string
+ * @returns Array of TOC entries ordered by document position
+ */
+export declare function extractTocFromMarkdown(markdown: string): TocEntry[];

package/dist/site-templates/tocExtractor.js

@@ -0,0 +1,58 @@
+import { unified } from "unified";
+import remarkParse from "remark-parse";
+/**
+ * Extracts a table-of-contents from raw markdown.
+ *
+ * Walks top-level heading nodes (h2–h4), slugifies the text content to
+ * produce `id` values matching `rehype-slug` output, and returns entries
+ * compatible with the `DocArticleTemplate` `toc` prop.
+ *
+ * @param markdown - Raw markdown string
+ * @returns Array of TOC entries ordered by document position
+ */
+export function extractTocFromMarkdown(markdown) {
+    if (!markdown || markdown.trim().length === 0)
+        return [];
+    const tree = unified().use(remarkParse).parse(markdown);
+    const entries = [];
+    for (const node of tree.children) {
+        if (node.type !== "heading")
+            continue;
+        const depth = node.depth;
+        if (depth < 2 || depth > 4)
+            continue;
+        const label = extractHeadingText(node);
+        if (!label)
+            continue;
+        entries.push({
+            id: slugify(label),
+            label,
+            depth: depth,
+        });
+    }
+    return entries;
+}
+/** Recursively extract plain text from a mdast node. */
+function extractHeadingText(node) {
+    if (!node.children)
+        return "";
+    return node.children
+        .map((child) => {
+        if (child.type === "text")
+            return child.value ?? "";
+        if (child.type === "inlineCode")
+            return child.value ?? "";
+        if (child.children)
+            return extractHeadingText(child);
+        return "";
+    })
+        .join("");
+}
+/** Slugify matching rehype-slug behavior: lowercase, spaces→hyphens, strip punctuation. */
+function slugify(text) {
+    return text
+        .toLowerCase()
+        .replace(/[^\w\s-]/g, "")
+        .replace(/\s+/g, "-")
+        .replace(/^-+|-+$/g, "");
+}

package/dist/site-templates/tocScrollSpy.d.ts

@@ -0,0 +1,16 @@
+export interface TocScrollSpyProps {
+    /** TOC entries with their heading IDs. */
+    entries: Array<{
+        id: string;
+        label: string;
+        depth?: 2 | 3 | 4;
+    }>;
+}
+/**
+ * Client-side scroll-spy TOC component.
+ *
+ * Uses IntersectionObserver to highlight the current section heading.
+ * Renders the same link structure as the static TOC in DocArticleTemplate
+ * but adds `cedros-site__toc-link--active` to the visible heading.
+ */
+export declare function TocScrollSpy({ entries }: TocScrollSpyProps): React.JSX.Element;