Donor component reuse, without the leaks

The isolation boundary is a package boundary

astro-reuse-proof/
├── packages/donor-ui          the "existing production site" component family
│   ├── Hero.astro             all content by props, all color through CSS custom properties
│   ├── ReviewList.astro       static first, accessible, no DOM cloned slides
│   ├── PropertyCard.astro
│   ├── tokens.css             DONOR brand tokens   ← never imported by the new site
│   └── donor-site-config.ts   donor GA4 id, Turnstile key, site name ← never imported
└── apps/harborline            the new site (fictional brand, created for this demo)
    ├── src/styles/tokens.css  the ONLY brand tokens in the build
    ├── src/layouts/Layout     own metadata, canonical, GA4 id, favicon
    ├── src/content + data     cities collection, professionals, reviews, featured
    ├── public/admin/config.yml  Decap models for the profile fields
    ├── src/server/leadValidation.ts  honeypot, min submit timing, dedupe, formats
    └── tests/reuse.test.mjs   the automated gates below

Donor components carry no embedded brand: content arrives by props, color by custom properties. The donor package still ships its own tokens and config, exactly as a real donor repository would, and the new site simply never imports them. The gate then proves the negative.

The automated gates, all passing

$ node tests/reuse.test.mjs
PASS  donor leakage gate: 0 occurrences of 5 donor markers across 11 built files
PASS  JSON-LD valid on index.html (@type RealEstateAgent)
PASS  JSON-LD valid on professionals/amara-okafor/index.html (@type Person)
PASS  robots.txt and llms.txt shipped
PASS  review content appears exactly once (no DOM cloning)
PASS  lead validation: honeypot, min submit timing, format, duplicate replay all enforced

ALL GATES PASS

The leakage gate scans every built HTML, CSS, JS and text file for the donor brand name, donor GA4 ID, donor Turnstile key, donor brand color and donor font, and fails the build on a single occurrence. The same pattern extends to any list of markers a real donor repository needs.

Lighthouse, against the targets set for this build

The first audit run measured accessibility at 95 on desktop and 89 on mobile. Two changes in the site layer, a darker accent token for contrast and a site favicon, took both to the figures above, with the donor package untouched. Measure, change the right layer, measure again: that is the working method.

The result on screen

What else the build includes

Decap CMS models for the professional profile fields, covering portrait, contact, biography with word guidance, specialties, areas, languages, credentials and each social link toggled individually, plus cities, reviews and featured properties with active flags and display order. A reusable city page template driven by a content collection. A typed server side lead validation pipeline covering honeypot, minimum submit timing, format checks and duplicate replay, unit tested, with Turnstile server verification and the owner webhook documented at the endpoint boundary. robots.txt and llms.txt ship in the build.

Built on August 31, 2026. Every gate result and Lighthouse figure above comes from real runs against the built output. Harborline Realty is a fictional brand created for this demonstration, and its listings, people and reviews are invented demo content. Screenshots are captures of the built demo, cropped to size.