@grove-dev/astro 0.7.0 → 0.9.0

package/src/components/FinalCta.astro

@@ -1,43 +0,0 @@
----
-import { buttonClass } from "../ui/button.js";
-
-interface Props {
-  itemLabel?: string;
-  itemsLabel?: string;
-  browseHref?: string;
-  submitHref?: string;
-  class?: string;
-}
-
-const {
-  itemLabel = "item",
-  itemsLabel = "items",
-  browseHref = "/items",
-  submitHref = "/submit",
-  class: className = "",
-} = Astro.props;
----
-
-<section class:list={["border-t border-ink-200 py-10 sm:py-12 dark:border-ink-800", className]} aria-labelledby="grove-final-cta-heading">
-  <div class="mx-auto w-full max-w-container px-5 sm:px-7">
-    <div class="rounded-[calc(var(--radius)+0.25rem)] border border-border bg-card px-6 py-7 sm:flex sm:items-center sm:justify-between sm:gap-10 sm:px-8 sm:py-8 dark:border-ink-800">
-      <div class="max-w-2xl">
-        <p class="m-0 text-2xs font-semibold uppercase tracking-wider text-ink-500 dark:text-ink-400">Keep the directory useful</p>
-        <h2 id="grove-final-cta-heading" class="m-0 mt-1.5 text-[1.5rem] font-semibold tracking-tight text-ink-900 sm:text-[1.75rem] dark:text-ink-100">
-          Know {itemLabel === "app" ? "an" : "a"} {itemLabel} that belongs here?
-        </h2>
-        <p class="m-0 mt-2 max-w-xl text-sm leading-relaxed text-ink-500 dark:text-ink-400">
-          Add a real, inspectable project or improve the metadata behind an existing listing.
-        </p>
-      </div>
-      <div class="mt-5 flex shrink-0 flex-wrap items-center gap-2 sm:mt-0 sm:justify-end">
-        <a href={submitHref} class={buttonClass("primary", "md", "px-4")}>
-          Submit {itemLabel}
-        </a>
-        <a href={browseHref} class={buttonClass("outline", "md", "px-4")}>
-          Explore {itemsLabel}
-        </a>
-      </div>
-    </div>
-  </div>
-</section>

package/src/components/Hero.astro

@@ -1,243 +0,0 @@
----
-/**
- * Hero — the home page banner.
- *
- * Mirrors the openapps layout: trust-stats row across the top,
- * big two-line headline with a gradient accent on the second
- * line, descriptive paragraph, search form with a Filters
- * shortcut, quick-filter chips, and up to 3 CTAs.
- *
- * Generic: every value comes through props (or `siteConfig` for
- * the trust stats). The label next to the count is blueprint-
- * driven via `itemsLabel` — so a project-directory renders
- * "apps indexed", a resource-hub renders "resources indexed",
- * an ecosystem-map renders "entities indexed".
- */
-import Container from "../layouts/Container.astro";
-import { compact } from "../lib/format";
-
-interface CTA {
-  label: string;
-  href: string;
-  variant?: "primary" | "outline" | "ghost";
-  external?: boolean;
-}
-
-interface Props {
-  /** Site/brand name. */
-  name: string;
-  /** Short tagline — usually pulled from siteConfig.tagline. */
-  tagline: string;
-  /** Longer descriptive paragraph. */
-  description?: string;
-  /** Trust stats: items count, categories, stacks, contributors, stars. */
-  stats?: {
-    totalApps?: number;
-    totalCategories?: number;
-    totalStacks?: number;
-    totalOwners?: number;
-    totalStars?: number;
-    repositoryContributors?: number;
-    originalRepo?: string;
-  };
-  /** Search form target — the list page. */
-  searchHref?: string;
-  /** Search input placeholder. */
-  searchPlaceholder?: string;
-  /**
-   * Plural noun for the primary count (e.g. "apps", "resources",
-   * "entities"). Used in the trust-stats label and CTA copy.
-   */
-  itemsLabel?: string;
-  /** Singular noun for the Submit / Browse copy. */
-  itemLabel?: string;
-  /** Quick filter chips under the search bar. */
-  quickFilters?: Array<{ label: string; href: string }>;
-  /** CTAs rendered below the form. */
-  ctas?: CTA[];
-  /** Extra class. */
-  class?: string;
-  /** Eyebrow text rendered above the title. */
-  eyebrow?: string;
-  /** Optional badge content rendered next to the eyebrow. */
-  eyebrowBadge?: string;
-}
-
-const {
-  name,
-  tagline,
-  description,
-  stats = {},
-  searchHref = "/",
-  searchPlaceholder = "Search the directory...",
-  itemsLabel = "items",
-  itemLabel,
-  quickFilters = [],
-  ctas = [],
-  class: className = "",
-  eyebrow = "A directory of curated knowledge",
-  eyebrowBadge,
-} = Astro.props;
-
-// Singular for the Submit-style CTA copy. Defaults to the lowercased
-// items label so "apps" → "app" without an extra prop.
-const singular = (itemLabel ?? itemsLabel.replace(/s$/, "")).toLowerCase();
-
-// One compact stats line: "6 projects indexed · 5 categories · 3 stacks".
-// Every entry is guarded so a fresh directory never renders a zero-value.
-const statParts: string[] = [
-  ...(stats.totalApps !== undefined && stats.totalApps > 0
-    ? [`${compact(stats.totalApps)} ${itemsLabel} indexed`]
-    : []),
-  ...(stats.totalCategories !== undefined && stats.totalCategories > 0
-    ? [`${stats.totalCategories} categories`]
-    : []),
-  ...(stats.totalStacks !== undefined && stats.totalStacks > 0
-    ? [`${stats.totalStacks} stacks`]
-    : []),
-  ...(stats.totalOwners !== undefined && stats.totalOwners > 0
-    ? [`${compact(stats.totalOwners)} owners`]
-    : []),
-  ...(stats.totalStars !== undefined && stats.totalStars > 0
-    ? [`${compact(stats.totalStars)} stars`]
-    : []),
-];
-
-// One primary CTA only — Submit already lives in the navbar
-// (BaseLayout → Header submitHref), so the hero never duplicates it.
-const primaryCta: CTA | undefined =
-  ctas.find((c) => c.variant === "primary") ??
-  ctas[0] ??
-  { label: `Browse ${itemsLabel}`, href: searchHref, variant: "primary" };
----
-
-<section
-  class:list={[
-    "relative overflow-hidden border-b border-ink-200 dark:border-ink-800",
-    className,
-  ]}
->
-  {/* Dark mode only: a barely-there radial lift behind the headline. */}
-  <div
-    aria-hidden="true"
-    class="pointer-events-none absolute inset-0 hidden dark:block"
-    style="background: radial-gradient(60% 55% at 50% 0%, color-mix(in oklab, var(--grove-foreground) 5%, transparent) 0%, transparent 70%);"
-  ></div>
-
-  <Container>
-    <div class="relative mx-auto flex max-w-[900px] flex-col items-center py-[88px] text-center lg:py-[104px]">
-      {/* Eyebrow. The `eyebrow` slot replaces the whole line — dot
-          included — so a consumer can put richer content here (a
-          `PoweredBy` link, a release badge) without forking the Hero. */}
-      <span class="inline-flex animate-fade-in items-center gap-2 text-[13px] font-medium text-ink-500 dark:text-ink-400">
-        <slot name="eyebrow">
-          <span aria-hidden="true" class="inline-block h-1.5 w-1.5 animate-pulse rounded-full bg-emerald-500"></span>
-          {eyebrow}
-          {eyebrowBadge && (
-            <span
-              class="inline-flex items-center rounded-full border border-amber-300 bg-amber-50 px-1.5 py-0.5 text-[10px] font-semibold uppercase tracking-wider text-amber-800 dark:border-amber-700/50 dark:bg-amber-900/20 dark:text-amber-300"
-              aria-label={eyebrowBadge}
-            >
-              {eyebrowBadge}
-            </span>
-          )}
-        </slot>
-      </span>
-
-      {/* Headline */}
-      <h1
-        class="m-0 mt-5 max-w-[820px] animate-fade-in-up text-balance text-[clamp(44px,5vw,64px)] font-[650] leading-[1.08] tracking-[-0.035em] text-ink-900 dark:text-ink-100"
-        style="animation-delay: 0.05s;"
-      >
-        <span class="block">{name}</span>
-        <span class="block">{tagline}</span>
-      </h1>
-
-      {description && (
-        <p
-          class="m-0 mt-5 max-w-[640px] animate-fade-in-up text-[16px] leading-[1.6] text-ink-500 dark:text-ink-400"
-          style="animation-delay: 0.1s;"
-        >
-          {description}
-        </p>
-      )}
-
-      {/* Search — primary interaction. The FORM is the visual control:
-          it owns the border, radius, and the single focus treatment
-          (focus-within border + soft ring). The inner input opts out
-          of the global input styling (`grove-input-unstyled`) so it
-          stays a transparent, chrome-free text slot — no second box
-          or ring appearing inside the pill on focus. */}
-      <form
-        class="mt-8 flex h-[58px] w-full max-w-[840px] animate-fade-in-up items-center gap-3 rounded-xl border border-ink-200 bg-background p-1.5 pl-4 transition-[border-color,box-shadow] focus-within:border-ink-400 focus-within:ring-3 focus-within:ring-ring/15 dark:border-ink-800 dark:focus-within:border-ink-600"
-        style="animation-delay: 0.15s;"
-        role="search"
-        action={searchHref}
-        method="get"
-      >
-        <label class="flex min-w-0 flex-1 items-center gap-3">
-          <span class="sr-only">Search {itemsLabel}, stacks, and categories</span>
-          <svg viewBox="0 0 16 16" width="20" height="20" aria-hidden="true" class="shrink-0 text-ink-400 dark:text-ink-500" fill="currentColor">
-            <path d="M10.68 11.74a6 6 0 0 1-7.922-8.982 6 6 0 0 1 8.982 7.922l3.04 3.04a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215ZM11.5 7a4.499 4.499 0 1 0-8.997 0A4.499 4.499 0 0 0 11.5 7Z"></path>
-          </svg>
-          <input
-            type="search"
-            name="q"
-            placeholder={searchPlaceholder}
-            class="grove-input-unstyled h-full w-full min-w-0 rounded-none border-0 bg-transparent px-0 text-[16px] text-ink-900 outline-none placeholder:text-ink-400 dark:text-ink-100 dark:placeholder:text-ink-500"
-          />
-        </label>
-        <button
-          type="submit"
-          class="inline-flex h-[46px] shrink-0 cursor-pointer items-center justify-center rounded-lg border border-transparent bg-primary px-5 text-[15px] font-medium leading-none text-primary-foreground outline-none transition-colors hover:bg-primary/90 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/35"
-        >
-          Search
-        </button>
-      </form>
-
-      {quickFilters.length > 0 && (
-        <p class="m-0 mt-4 text-[13px] text-ink-500 dark:text-ink-400">
-          Try{" "}
-          {quickFilters.map((f, i) => (
-            <>
-              <a href={f.href} class="font-mono text-ink-700 underline-offset-2 hover:underline dark:text-ink-300">{f.label}</a>
-              {i < quickFilters.length - 1 && <span aria-hidden="true" class="mx-1">·</span>}
-            </>
-          ))}
-        </p>
-      )}
-
-      {/* Inline stats — single compact line, middle-dot separators */}
-      {statParts.length > 0 && (
-        <p class="m-0 mt-5 text-[13px] text-ink-500 dark:text-ink-400">
-          {statParts.map((part, i) => (
-            <>
-              {i > 0 && <span aria-hidden="true" class="mx-2 opacity-60">·</span>}
-              <span>{part}</span>
-            </>
-          ))}
-        </p>
-      )}
-
-      {/* Primary CTA only */}
-      {primaryCta && (
-        <div class="mt-8">
-          <a
-            href={primaryCta.href}
-            class="inline-flex h-11 cursor-pointer items-center justify-center gap-2 rounded-[var(--radius)] border border-transparent bg-primary px-5 text-[15px] font-medium leading-none text-primary-foreground outline-none transition-colors hover:bg-primary/90 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/35"
-            {...(primaryCta.external ? { target: "_blank", rel: "noopener noreferrer" } : {})}
-            data-event="hero_cta_click"
-            data-event-source="hero"
-          >
-            {primaryCta.label}
-            <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
-              <path d="M5 12h14"></path>
-              <path d="m12 5 7 7-7 7"></path>
-            </svg>
-          </a>
-        </div>
-      )}
-      {singular /* suppress unused warning on the singular variable */ ? null : null}
-    </div>
-  </Container>
-</section>

package/src/components/Icon.astro

@@ -1,191 +0,0 @@
----
-/**
- * Icon — brand icon registry.
- *
- * Resolves a registry name to `/icons/{stacks|platforms|brands}/{name}.svg`
- * and renders it. The Astro integration syncs the packaged set into the
- * consumer's `public/icons/` on every build; consumers can ship their own
- * SVGs under the same paths (or override the `base` prop) without forking
- * this component.
- *
- * The component is **generic** — it does not import any consumer-side
- * `siteConfig`, `item`, or blueprint-specific module.
- *
- * `category` selects the subfolder:
- *
- *   - "stack"     → `/icons/stacks/{name}.svg`
- *   - "platform"  → `/icons/platforms/{name}.svg`
- *   - "brand"     → `/icons/brands/{name}.svg`   (consumer-supplied)
- *
- * ## Theming
- *
- * `ICON_KINDS` (generated by `scripts/sync-icons.mjs`) classifies each
- * packaged icon:
- *
- *   - **color** — the default. Any brand with a color mark keeps it,
- *     rendered as `<img>` with an `onerror` fallback to an initials
- *     chip.
- *   - **mono** — marks with no color to lose (Apple, Rust, Tauri,
- *     Solidity, Deno) plus the concept glyphs. Rendered as a CSS-masked
- *     `<span>` painted from `--grove-foreground`, which reproduces how
- *     those brands are actually used: solid black on light, solid white
- *     on dark, with no script and no second file. See
- *     `.grove-icon-mask` in `styles.css`.
- *
- * The map CLASSIFIES; it does not gate availability. A name it has never
- * heard of — a consumer's own SVG — takes the `<img>` path, exactly as
- * before. Pass `kind="mono"` to opt a custom mark into `currentColor`
- * tinting.
- *
- * Aliases: a tiny `aliases` map (e.g. `rn → react-native`) lets the
- * registry accept multiple ids for the same asset. Lookup falls through
- * `aliases` → the built-in stack aliases → the raw slug, then fails over
- * to the initials placeholder.
- */
-import { ICON_KINDS } from "../lib/icon-kinds";
-import type { IconKind } from "../lib/icon-kinds";
-import { resolveIconAsset, slugifyIconName } from "../lib/icon-registry";
-import type { IconCategory } from "../lib/icon-registry";
-
-export type { IconCategory, IconKind };
-
-/**
- * @deprecated Theme variants are no longer file-based — `mono` icons
- * inherit `currentColor`. Accepted and ignored so consumers passing
- * `mode="auto"` do not hit a type error.
- */
-export type IconMode = "static" | "auto";
-
-interface Props {
-  /**
-   * Registry id. Resolved through `aliases` first, then matched
-   * against the SVG file name (case-insensitive, slug-normalized).
-   */
-  name: string;
-  /** Subfolder under `/icons/`. */
-  category: IconCategory;
-  /** Pixel size (square). Defaults to 16. */
-  size?: number;
-  /** Extra class for the outer wrapper. */
-  class?: string;
-  /** Tooltip / aria-label. */
-  title?: string;
-  /** @deprecated No-op. Kept for one minor release. */
-  mode?: IconMode;
-  /**
-   * Override the packaged kind classification. Pass `"mono"` for a
-   * consumer-supplied single-color mark so it is painted black on
-   * light and white on dark instead of shipping two files.
-   */
-  kind?: IconKind;
-  /**
-   * Optional id → id remap. Lookup goes `name → aliases[name] →
-   * {name}.svg` (case-insensitive).
-   */
-  aliases?: Record<string, string>;
-  /**
-   * Optional complete asset registry supplied by a consumer. When omitted,
-   * Grove attempts the configured asset path and falls back on image error.
-   */
-  available?: string[];
-  /**
-   * Initials to render when the icon file is missing. Defaults to
-   * the first 1–2 characters of `name`.
-   */
-  fallbackInitials?: string;
-  /**
-   * Base path for icon files. Defaults to `/icons` (matches the
-   * synced `public/icons/`).
-   */
-  base?: string;
-}
-
-const {
-  name,
-  category,
-  size = 16,
-  class: className = "",
-  title,
-  kind,
-  aliases,
-  available,
-  fallbackInitials,
-  base = "/icons",
-} = Astro.props;
-
-const asset = resolveIconAsset(name, category, aliases);
-const resolved = asset.name;
-const availableIcons = available?.map(slugifyIconName);
-const hasAsset =
-  category === "brand" ||
-  availableIcons === undefined ||
-  availableIcons.includes(resolved);
-const src = `${base.replace(/\/$/, "")}/${asset.folder}/${resolved}.svg`;
-
-// Initials fallback: first 1–2 alphanumerics, uppercased.
-const init = (fallbackInitials ?? name ?? "")
-  .replace(/[^a-z0-9]/gi, "")
-  .slice(0, 2)
-  .toUpperCase();
-const showFallback = !resolved || !hasAsset || asset.textOnly;
-
-// Unknown names fall through to `<img>`, never to `mono` — a mask has
-// no `onerror`, so a missing file would render an invisible blank.
-const effectiveKind: IconKind = kind ?? ICON_KINDS[asset.key] ?? "color";
-
-// `name` reaches the mask branch as part of a CSS `url()` token, and
-// slugifying does not remove the characters that would close it. Astro
-// escapes the attribute; this escapes the CSS inside it.
-const cssUrl = src.replace(/['"()\\\s]/g, encodeURIComponent);
-
-// Build aria-label.
-const ariaLabel = title ?? name;
-const a11y: Record<string, string> = title
-  ? { "aria-label": ariaLabel, role: "img" }
-  : { "aria-hidden": "true", "focusable": "false" };
-
-const fallbackClass = [
-  "inline-flex shrink-0 select-none items-center justify-center rounded-sm bg-ink-100 align-middle font-semibold uppercase leading-none text-ink-700 dark:bg-ink-800 dark:text-ink-200",
-  className,
-];
-const fallbackStyle = `width:${size}px;height:${size}px;font-size:${Math.max(10, size - 6)}px;`;
----
-
-{
-  showFallback ? (
-    <span class:list={fallbackClass} style={fallbackStyle} {...a11y}>
-      {init || "·"}
-    </span>
-  ) : effectiveKind === "mono" ? (
-    <span
-      class:list={["grove-icon-mask", className]}
-      style={`width:${size}px;height:${size}px;--grove-icon-url:url('${cssUrl}');`}
-      {...a11y}
-    />
-  ) : (
-    <>
-      <img
-        src={src}
-        width={size}
-        height={size}
-        {/* The `width`/`height` attributes are only presentational
-            hints. These SVGs carry a `viewBox` and no intrinsic size,
-            so once one loads the browser re-derives the box and the
-            row reflows — Lighthouse reports it as "media element
-            lacking an explicit size" and it cost the browse page
-            0.115 CLS. An explicit CSS size pins the box before the
-            first byte arrives. */}
-        style={`width:${size}px;height:${size}px`}
-        alt=""
-        class:list={["inline-block shrink-0 align-middle", className]}
-        loading="lazy"
-        decoding="async"
-        onerror="this.hidden=true;this.nextElementSibling.hidden=false"
-        {...a11y}
-      />
-      <span hidden data-grove-icon-fallback-initials class:list={fallbackClass} style={fallbackStyle} {...a11y}>
-        {init || "·"}
-      </span>
-    </>
-  )
-}

package/src/components/IndexRow.astro

@@ -1,37 +0,0 @@
----
-/**
- * IndexRow — browse-page adapter around the canonical `ProjectCard`.
- *
- * Keeps the historical public props (`record`, `detailHref`,
- * `showChips`, `eager`) so consumer pages copied from earlier versions
- * keep working. The card itself is the same on every surface: a
- * record must not look like a different record depending on whether
- * you found it on the home page or in the browse list. The repository
- * is reached through the card's `owner/repo` line, so this adapter
- * adds nothing to the card at all.
- */
-import type { IndexRecord } from "@grove-dev/core";
-import ProjectCard from "./ProjectCard.astro";
-
-interface Props {
-  record: IndexRecord;
-  detailHref: string;
-  /** @deprecated Ignored — the card renders one fixed layout. */
-  showChips?: boolean;
-  /** Set true on the first 1-2 rows of a list to bypass lazy
-   * loading for the above-the-fold avatars. Pair with
-   * `fetchpriority="high"`. */
-  eager?: boolean;
-  class?: string;
-}
-
-const { record, detailHref, eager = false, class: className = "" } = Astro.props;
-
----
-
-<ProjectCard
-  record={record}
-  href={detailHref}
-  eager={eager}
-  class={className}
-/>

package/src/components/LanguageBreakdown.astro

@@ -1,67 +0,0 @@
----
-/**
- * LanguageBreakdown.astro
- *
- * Visual GitHub-Linguist-style code-composition bar plus a legend
- * showing each language's percentage. Reads from the record's
- * pre-computed `languages` array (top-5 by bytes) and `langColor`
- * (in @grove-dev/core).
- *
- * Used inside the Activity sidebar card.
- */
-import { langColor } from "@grove-dev/core";
-
-interface LangEntry {
-  name: string;
-  bytes: number;
-}
-
-interface Props {
-  /** Top-N languages as `[name, bytes]` tuples (already sorted). */
-  languages: ReadonlyArray<readonly [string, number]>;
-  /** Total bytes across all languages (denominator). */
-  totalBytes: number;
-  /** Optional max segments to show. */
-  maxSegments?: number;
-}
-
-const { languages, totalBytes, maxSegments = 5 } = Astro.props;
-
-const segments = languages.slice(0, maxSegments).map(([name, bytes]) => {
-  const pct = Math.round((bytes / Math.max(1, totalBytes)) * 100);
-  return { name, pct, color: langColor(name) };
-});
----
-
-{segments.length > 0 && (
-  <div class="grove-langbreak mt-4 border-t border-ink-100 pt-4 dark:border-ink-800">
-    <h3 class="m-0 text-2xs font-semibold uppercase tracking-wider text-ink-500 dark:text-ink-400">
-      Code composition
-    </h3>
-    <div
-      class="grove-langbreak-bar mt-2 flex h-2 w-full overflow-hidden rounded-full bg-ink-100 dark:bg-ink-800"
-      role="img"
-      aria-label={`Code composition: ${segments.map((s) => `${s.name} ${s.pct}%`).join(', ')}`}
-    >
-      {segments.map((s) => (
-        <span
-          class="grove-langbreak-seg h-full"
-          style={`width:${s.pct}%;background-color:${s.color}`}
-          title={`${s.name}: ${s.pct}%`}
-        />
-      ))}
-    </div>
-    <ul class="grove-langbreak-list mt-2 flex flex-wrap gap-x-3 gap-y-1 text-2xs text-ink-500 dark:text-ink-400">
-      {segments.map((s) => (
-        <li class="inline-flex items-center gap-1">
-          <span
-            class="inline-block h-2 w-2 rounded-sm"
-            style={`background-color:${s.color}`}
-          />
-          <span class="font-mono">{s.name}</span>
-          <span>{s.pct}%</span>
-        </li>
-      ))}
-    </ul>
-  </div>
-)}

package/src/components/MarkdownBody.astro

@@ -1,37 +0,0 @@
----
-/**
- * MarkdownBody.astro
- *
- * Renders a record's pre-sanitized Markdown body (`getContentHtml`)
- * inside the package's `.grove-prose` stylesheet.
- *
- * The renderer itself lives in `@grove-dev/astro/server/directory.ts`
- * (`renderMarkdownToSafeHtml`) and runs once per record at module
- * load; this component is the presentation half of that pipeline.
- *
- * Props:
- *   - `recordSlug`: the **record's** slug (not the route prefix).
- *     `getContentHtml` is keyed by record slug — `detail.slug` is the
- *     route prefix (e.g. "projects"), `detail.record.slug` is the
- *     record (e.g. "crewai").
- *   - `fallback`: optional content to render when the record has no
- *     body (e.g. an empty-state message).
- */
-import { getContentHtml } from "../server/directory.js";
-
-interface Props {
-  /** Record slug — looks up the pre-rendered HTML in the module map. */
-  recordSlug: string;
-  /** Optional fallback content for records without a body. */
-  fallback?: string;
-}
-
-const { recordSlug, fallback } = Astro.props;
-const html = getContentHtml(recordSlug);
----
-
-{html ? (
-  <div class="grove-prose" set:html={html} />
-) : fallback ? (
-  <p class="grove-prose text-ink-500 dark:text-ink-400">{fallback}</p>
-) : null}