@oneie/plugin-pages 0.2.0 → 0.2.1

package/package.json

@@ -1,8 +1,25 @@
 {
   "name": "@oneie/plugin-pages",
-  "version": "0.2.0",
-  "description": "ONE pages — renders a workspace's published Puck pages on any Astro site via the public pages:view receiver",
+  "version": "0.2.1",
+  "description": "Astro integration that renders a ONE workspace's visually-edited Puck pages on any Astro site.",
   "license": "SEE LICENSE IN LICENSE",
+  "keywords": [
+    "astro-integration",
+    "astro-component",
+    "astro",
+    "withastro",
+    "puck",
+    "cms",
+    "visual-editor",
+    "pages",
+    "one"
+  ],
+  "homepage": "https://github.com/one-ie/one",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/one-ie/packages.git",
+    "directory": "plugin-pages"
+  },
   "type": "module",
   "main": "src/index.ts",
   "exports": {
@@ -15,18 +32,18 @@
     "build": "tsc --noEmit",
     "test": "vitest run"
   },
+  "peerDependencies": {
+    "astro": ">=6.0.0",
+    "@oneie/frontend": "^0.1.2",
+    "@puckeditor/core": ">=0.21.0",
+    "react": ">=19.0.0"
+  },
   "dependencies": {
     "clsx": "^2.1.1",
     "lucide-react": "^1.14.0",
     "radix-ui": "^1.6.2",
     "tailwind-merge": "^3.5.0"
   },
-  "peerDependencies": {
-    "astro": ">=6.0.0",
-    "@oneie/frontend": "^0.1.1",
-    "@puckeditor/core": ">=0.21.0",
-    "react": ">=19.0.0"
-  },
   "devDependencies": {
     "astro": "^6.2.2",
     "@puckeditor/core": "^0.21.3",

package/src/components/FAQSection.tsx

@@ -3,7 +3,7 @@ import { useState } from 'react'
 import { ChevronDown } from 'lucide-react'
 import { emitClick } from '../lib/ui-signal'
 
-const BRAND_TOKENS = new Set(['primary', 'secondary', 'tertiary'])
+import { onText } from '../lib/surface-chrome'
 
 interface FAQ {
   q: string
@@ -16,19 +16,21 @@ interface FAQSectionProps {
   bgToken?: string
 }
 
-export function FAQSection({ title = 'Common questions', faqs, bgToken }: FAQSectionProps) {
+// No default title — an omitted prop renders no heading, never borrowed copy.
+export function FAQSection({ title = '', faqs, bgToken }: FAQSectionProps) {
   const [open, setOpen] = useState<number | null>(null)
 
   const hasBgToken = !!bgToken && bgToken !== 'none'
-  const isBrandToken = hasBgToken && BRAND_TOKENS.has(bgToken)
+  // Per-token contrast. Was `text-on-primary` for all three brand fills.
+  const onTextClass = onText(bgToken)
 
   return (
     <section
-      className={`px-6 py-24 ${hasBgToken ? '' : 'bg-foreground/30'}${isBrandToken ? ' text-on-primary' : ''}`}
+      className={`px-6 py-24 ${hasBgToken ? '' : 'bg-foreground/30'}${onTextClass ? ` ${onTextClass}` : ''}`}
       style={hasBgToken ? { backgroundColor: `var(--color-${bgToken})` } : undefined}
     >
       <div className="max-w-3xl mx-auto">
-        <h2 className="text-3xl font-bold tracking-tight text-center mb-14">{title}</h2>
+        {title && <h2 className="text-3xl font-bold tracking-tight text-center mb-14">{title}</h2>}
         <div className="flex flex-col gap-2">
           {faqs.map((faq, i) => (
             <article

package/src/components/FooterSection.tsx

@@ -29,18 +29,24 @@ const ICONS = {
   youtube: Share2,
 } as const
 
+// No brand / copyright defaults. Both named ONE on EVERY render path (these are
+// default PARAMETERS, not Puck defaultProps — they fire whenever the prop is
+// omitted, on the Astro lane and in the editor alike), so a site that simply did
+// not pass them footered someone else's identity.
 export function FooterSection({
-  brand = 'ONE',
+  brand = '',
   links = [],
   socials = [],
-  copyright = `©${new Date().getFullYear()} ONE, Made for better web.`,
+  copyright = '',
 }: FooterSectionProps) {
   return (
     <footer>
       <div className="mx-auto flex max-w-7xl items-center justify-between gap-3 px-4 py-4 max-md:flex-col sm:px-6 sm:py-6 md:gap-6 md:py-8">
-        <a href="#" className="flex items-center gap-3 font-semibold text-lg">
-          {brand}
-        </a>
+        {brand && (
+          <a href="#" className="flex items-center gap-3 font-semibold text-lg">
+            {brand}
+          </a>
+        )}
 
         <nav className="flex items-center gap-5 whitespace-nowrap">
           {links.map((link, i) => (
@@ -64,9 +70,11 @@ export function FooterSection({
 
       <Separator />
 
-      <div className="mx-auto flex max-w-7xl justify-center px-4 py-8 sm:px-6">
-        <p className="text-center font-medium text-balance">{copyright}</p>
-      </div>
+      {copyright && (
+        <div className="mx-auto flex max-w-7xl justify-center px-4 py-8 sm:px-6">
+          <p className="text-center font-medium text-balance">{copyright}</p>
+        </div>
+      )}
     </footer>
   )
 }

package/src/components/HowItWorks.tsx

@@ -1,5 +1,5 @@
 // Ported verbatim from one.ie/web/src/components/cro/HowItWorks.tsx
-const BRAND_TOKENS = new Set(['primary', 'secondary', 'tertiary'])
+import { onText } from '../lib/surface-chrome'
 
 interface Step {
   label: string
@@ -16,11 +16,12 @@ interface HowItWorksProps {
 
 export function HowItWorks({ title = 'How it works', subtitle, steps, bgToken }: HowItWorksProps) {
   const hasBgToken = !!bgToken && bgToken !== 'none'
-  const isBrandToken = hasBgToken && BRAND_TOKENS.has(bgToken)
+  // Per-token contrast. Was `text-on-primary` for all three brand fills.
+  const onTextClass = onText(bgToken)
 
   return (
     <section
-      className={`px-6 py-24${isBrandToken ? ' text-on-primary' : ''}`}
+      className={`px-6 py-24${onTextClass ? ` ${onTextClass}` : ''}`}
       style={hasBgToken ? { backgroundColor: `var(--color-${bgToken})` } : undefined}
     >
       <div className="max-w-4xl mx-auto">

package/src/components/LandingFeatures.tsx

@@ -2,7 +2,7 @@
 import type { LucideIcon } from 'lucide-react'
 import { IconBadge, type IconBadgeTone } from './IconBadge'
 
-const BRAND_TOKENS = new Set(['primary', 'secondary', 'tertiary'])
+import { onText } from '../lib/surface-chrome'
 
 export interface LandingFeature {
   headline: string
@@ -20,24 +20,26 @@ interface LandingFeaturesProps {
 }
 
 export function LandingFeatures({
-  title = 'What you get',
+  // No default title — an omitted prop renders no heading, never borrowed copy.
+  title = '',
   subtitle,
   features,
   columns = 3,
   bgToken,
 }: LandingFeaturesProps) {
   const hasBgToken = !!bgToken && bgToken !== 'none'
-  const isBrandToken = hasBgToken && BRAND_TOKENS.has(bgToken)
+  // Per-token contrast. Was `text-on-primary` for all three brand fills.
+  const onTextClass = onText(bgToken)
 
   const gridClass = columns === 2 ? 'grid sm:grid-cols-2 gap-8' : 'grid sm:grid-cols-2 lg:grid-cols-3 gap-8'
 
   return (
     <section
-      className={`px-6 py-24 ${hasBgToken ? '' : 'bg-foreground/30'}${isBrandToken ? ' text-on-primary' : ''}`}
+      className={`px-6 py-24 ${hasBgToken ? '' : 'bg-foreground/30'}${onTextClass ? ` ${onTextClass}` : ''}`}
       style={hasBgToken ? { backgroundColor: `var(--color-${bgToken})` } : undefined}
     >
       <div className="max-w-5xl mx-auto">
-        <h2 className="text-3xl font-bold tracking-tight text-center mb-3">{title}</h2>
+        {title && <h2 className="text-3xl font-bold tracking-tight text-center mb-3">{title}</h2>}
         {subtitle && <p className="text-font/60 text-center mb-14 max-w-xl mx-auto">{subtitle}</p>}
         {!subtitle && <div className="mb-14" />}
         <div className={gridClass}>

package/src/components/LandingHero.tsx

@@ -7,7 +7,7 @@ import { Icon } from './Icon'
 import { emitClick } from '../lib/ui-signal'
 import { safeHref } from '../lib/safe-url'
 
-const BRAND_TOKENS = new Set(['primary', 'secondary', 'tertiary'])
+import { onText } from '../lib/surface-chrome'
 
 interface CTA {
   label: string
@@ -33,16 +33,19 @@ export function LandingHero({
   subhead,
   primaryCta,
   secondaryCta,
-  frictionText = 'No credit card · 2-minute setup',
+  // No default: an omitted prop must render NOTHING. A payment/setup claim that
+  // fires whenever an author leaves this out is the defect this empty string fixes.
+  frictionText = '',
   visual,
   bgToken,
 }: LandingHeroProps) {
   const hasBgToken = !!bgToken && bgToken !== 'none'
-  const isBrandToken = hasBgToken && BRAND_TOKENS.has(bgToken)
+  // Per-token contrast. Was `text-on-primary` for all three brand fills.
+  const onTextClass = onText(bgToken)
 
   return (
     <section
-      className={`px-6 pt-24 pb-20 md:pt-32 md:pb-28${isBrandToken ? ' text-on-primary' : ''}`}
+      className={`px-6 pt-24 pb-20 md:pt-32 md:pb-28${onTextClass ? ` ${onTextClass}` : ''}`}
       style={hasBgToken ? { backgroundColor: `var(--color-${bgToken})` } : undefined}
     >
       <div className="max-w-4xl mx-auto text-center">
@@ -70,15 +73,17 @@ export function LandingHero({
         </p>
 
         <div className="flex flex-col sm:flex-row gap-3 justify-center mb-4">
-          <a
-            href={safeHref(primaryCta.href) ?? '#'}
-            onClick={() => emitClick('ui:landing:primary-cta', { page: headline })}
-            className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-primary text-on-primary rounded-full font-medium text-base hover:brightness-110 transition"
-          >
-            {primaryCta.label}
-            <Icon icon={ArrowRight} size="md" />
-          </a>
-          {secondaryCta && (
+          {primaryCta?.label && (
+            <a
+              href={safeHref(primaryCta.href) ?? '#'}
+              onClick={() => emitClick('ui:landing:primary-cta', { page: headline })}
+              className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-primary text-on-primary rounded-full font-medium text-base hover:brightness-110 transition"
+            >
+              {primaryCta.label}
+              <Icon icon={ArrowRight} size="md" />
+            </a>
+          )}
+          {secondaryCta?.label && (
             <a
               href={safeHref(secondaryCta.href) ?? '#'}
               onClick={() => emitClick('ui:landing:secondary-cta', { page: headline })}

package/src/components/PricingSection.tsx

@@ -23,9 +23,11 @@ interface PricingSectionProps {
   tiers: PricingTier[]
 }
 
+// No default title or subtitle. The subtitle was a DISCOUNT CLAIM that fired on
+// every render where the prop was omitted; the title is the same class one line up.
 export function PricingSection({
-  title = 'Simple pricing',
-  subtitle = 'Annual billing pre-selected saves you 20%.',
+  title = '',
+  subtitle = '',
   tiers,
 }: PricingSectionProps) {
   const [annual, setAnnual] = useState(true)
@@ -33,8 +35,8 @@ export function PricingSection({
   return (
     <section className="px-6 py-24 bg-foreground/30">
       <div className="max-w-5xl mx-auto">
-        <h2 className="text-3xl font-bold tracking-tight text-center mb-3">{title}</h2>
-        <p className="text-font/60 text-center mb-10 max-w-xl mx-auto">{subtitle}</p>
+        {title && <h2 className="text-3xl font-bold tracking-tight text-center mb-3">{title}</h2>}
+        {subtitle && <p className="text-font/60 text-center mb-10 max-w-xl mx-auto">{subtitle}</p>}
 
         <div className="flex justify-center mb-12">
           <div
@@ -48,7 +50,9 @@ export function PricingSection({
               }}
               className={`px-4 py-1.5 rounded-full text-sm font-medium transition-colors ${annual ? 'bg-primary text-on-primary' : 'text-font/60 hover:text-font'}`}
             >
-              Annual <span className="text-xs opacity-70 ml-1">save 20%</span>
+              {/* The saving was hardcoded here — unoverridable at any price. A
+                  percentage claim belongs in `subtitle`, which an author controls. */}
+              Annual
             </button>
             <button
               onClick={() => {

package/src/components/ProofBar.tsx

@@ -1,5 +1,5 @@
 // Ported verbatim from one.ie/web/src/components/cro/ProofBar.tsx
-const BRAND_TOKENS = new Set(['primary', 'secondary', 'tertiary'])
+import { onText } from '../lib/surface-chrome'
 
 interface Stat {
   label: string
@@ -22,11 +22,12 @@ interface ProofBarProps {
 
 export function ProofBar({ stats, leadQuote, bgToken }: ProofBarProps) {
   const hasBgToken = !!bgToken && bgToken !== 'none'
-  const isBrandToken = hasBgToken && BRAND_TOKENS.has(bgToken)
+  // Per-token contrast. Was `text-on-primary` for all three brand fills.
+  const onTextClass = onText(bgToken)
 
   return (
     <section
-      className={`px-6 py-12 border-y${isBrandToken ? ' text-on-primary' : ''}`}
+      className={`px-6 py-12 border-y${onTextClass ? ` ${onTextClass}` : ''}`}
       style={{ borderColor: 'var(--color-border)', ...(hasBgToken ? { backgroundColor: `var(--color-${bgToken})` } : {}) }}
     >
       <div className="max-w-5xl mx-auto">

package/src/components/SecondaryCTA.tsx

@@ -5,7 +5,7 @@ import { Icon } from './Icon'
 import { emitClick } from '../lib/ui-signal'
 import { safeHref } from '../lib/safe-url'
 
-const BRAND_TOKENS = new Set(['primary', 'secondary', 'tertiary'])
+import { onText } from '../lib/surface-chrome'
 
 interface SecondaryCTAProps {
   headline: string
@@ -21,15 +21,17 @@ export function SecondaryCTA({
   subhead,
   primaryCta,
   secondaryCta,
-  frictionText = 'No credit card · 2-minute setup',
+  // No default — see LandingHero. An omitted prop renders nothing, never a claim.
+  frictionText = '',
   bgToken,
 }: SecondaryCTAProps) {
   const hasBgToken = !!bgToken && bgToken !== 'none'
-  const isBrandToken = hasBgToken && BRAND_TOKENS.has(bgToken)
+  // Per-token contrast. Was `text-on-primary` for all three brand fills.
+  const onTextClass = onText(bgToken)
 
   return (
     <section
-      className={`px-6 py-24${isBrandToken ? ' text-on-primary' : ''}`}
+      className={`px-6 py-24${onTextClass ? ` ${onTextClass}` : ''}`}
       style={hasBgToken ? { backgroundColor: `var(--color-${bgToken})` } : undefined}
     >
       <div className="max-w-2xl mx-auto text-center">
@@ -37,15 +39,17 @@ export function SecondaryCTA({
         {subhead && <p className="text-font/60 mb-10 text-lg leading-snug">{subhead}</p>}
         {!subhead && <div className="mb-10" />}
         <div className="flex flex-col sm:flex-row gap-3 justify-center mb-4">
-          <a
-            href={safeHref(primaryCta.href) ?? '#'}
-            onClick={() => emitClick('ui:landing:secondary-cta', { section: 'bottom-cta' })}
-            className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-primary text-on-primary rounded-full font-medium text-base hover:brightness-110 transition"
-          >
-            {primaryCta.label}
-            <Icon icon={ArrowRight} size="md" />
-          </a>
-          {secondaryCta && (
+          {primaryCta?.label && (
+            <a
+              href={safeHref(primaryCta.href) ?? '#'}
+              onClick={() => emitClick('ui:landing:secondary-cta', { section: 'bottom-cta' })}
+              className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-primary text-on-primary rounded-full font-medium text-base hover:brightness-110 transition"
+            >
+              {primaryCta.label}
+              <Icon icon={ArrowRight} size="md" />
+            </a>
+          )}
+          {secondaryCta?.label && (
             <a
               href={safeHref(secondaryCta.href) ?? '#'}
               className="inline-flex items-center justify-center gap-2 px-8 py-4 text-font rounded-full font-medium text-base hover:text-font/70 transition border"

package/src/components/Testimonials.tsx

@@ -1,5 +1,5 @@
 // Ported verbatim from one.ie/web/src/components/cro/Testimonials.tsx
-const BRAND_TOKENS = new Set(['primary', 'secondary', 'tertiary'])
+import { onText } from '../lib/surface-chrome'
 
 interface Testimonial {
   quote: string
@@ -14,17 +14,19 @@ interface TestimonialsProps {
   bgToken?: string
 }
 
-export function Testimonials({ title = 'What agencies say', testimonials, bgToken }: TestimonialsProps) {
+// No default title — an omitted prop renders no heading, never borrowed copy.
+export function Testimonials({ title = '', testimonials, bgToken }: TestimonialsProps) {
   const hasBgToken = !!bgToken && bgToken !== 'none'
-  const isBrandToken = hasBgToken && BRAND_TOKENS.has(bgToken)
+  // Per-token contrast. Was `text-on-primary` for all three brand fills.
+  const onTextClass = onText(bgToken)
 
   return (
     <section
-      className={`px-6 py-24${isBrandToken ? ' text-on-primary' : ''}`}
+      className={`px-6 py-24${onTextClass ? ` ${onTextClass}` : ''}`}
       style={hasBgToken ? { backgroundColor: `var(--color-${bgToken})` } : undefined}
     >
       <div className="max-w-5xl mx-auto">
-        <h2 className="text-3xl font-bold tracking-tight text-center mb-14">{title}</h2>
+        {title && <h2 className="text-3xl font-bold tracking-tight text-center mb-14">{title}</h2>}
         <div className="grid sm:grid-cols-3 gap-6">
           {testimonials.map((t) => (
             <blockquote

package/src/config.tsx

@@ -19,10 +19,25 @@
 // (Puck drops unknown types) — same distribution-lag limitation plugin-blog/
 // plugin-docs already carry for their own registries.
 //
-// `fields` below are intentionally minimal (`{}`) — this package only ever calls
-// Puck's read-only <Render>, which never consults `fields` (editor-only metadata).
-// Field/defaultProps shapes are otherwise ported verbatim from the real registry
-// for documentation parity.
+// `fields` WERE `{}` on all nine blocks, with the reasoning that this package only
+// calls Puck's read-only <Render>, which never consults them. Two things were wrong
+// with that. First, the editor DOES: a caseworker who inserts one of these blocks is
+// shown one input per declared field and NOTHING when the map is empty, so an empty
+// `fields` is an uneditable block. Second, the contract's load-bearing guard — every
+// `fields` key exists in the component's props type — is vacuously true against an
+// empty map: zero keys is zero possible mismatches, so the guard passed nine times
+// and proved nothing. The six blocks the EHC lane keeps now declare real fields,
+// DERIVED FROM EACH COMPONENT'S PROPS TYPE (see ./components/*.tsx). That is interim:
+// the contract wants one declaration — zod → z.infer → props → fields — and the Zod
+// page schema (the Astro lane's A1) does not exist yet. Re-point these at it when it
+// lands; until then two declarations are being kept in step by hand.
+//
+// `defaultProps` carry NO content. They used to ship ONE.ie's headline, two invented
+// testimonials, three invented statistics and a price list — inert under <Render>
+// (which merges only `config.root.defaultProps`), but the editor's insert reducer
+// does `props: {...defaultProps, id}`, so dragging a block WROTE the fabrication into
+// the page row, after which it renders publicly as ordinary stored props. Structural
+// defaults only: a background token and empty arrays.
 import type { Config } from '@puckeditor/core'
 import { LandingHero } from './components/LandingHero'
 import { HowItWorks } from './components/HowItWorks'
@@ -34,139 +49,230 @@ import { Testimonials } from './components/Testimonials'
 import { PricingSection } from './components/PricingSection'
 import { FooterSection } from './components/FooterSection'
 
+// The background-token vocabulary, verbatim from one.ie/web/src/lib/puck/bg-fields.ts
+// (the `BrandColorField` comment: 'primary' | 'secondary' | 'tertiary' | 'background' |
+// 'foreground' | 'none'). A `select` rather than that custom field: the swatch picker
+// reads the workspace's branding through a `@/` import this package cannot carry.
+const bgTokenField = {
+  type: 'select' as const,
+  label: 'Background colour',
+  options: [
+    { label: 'None', value: 'none' },
+    { label: 'Background', value: 'background' },
+    { label: 'Foreground', value: 'foreground' },
+    { label: 'Primary', value: 'primary' },
+    { label: 'Secondary', value: 'secondary' },
+    { label: 'Tertiary', value: 'tertiary' },
+  ],
+}
+
+// `{ label, href }` — the CTA shape both hero blocks declare.
+const ctaField = (label: string) => ({
+  type: 'object' as const,
+  label,
+  objectFields: {
+    label: { type: 'text' as const, label: 'Button text' },
+    href: { type: 'text' as const, label: 'Link' },
+  },
+})
+
 export const pagesPuckConfig: Config = {
   components: {
     LandingHero: {
-      fields: {},
+      fields: {
+        eyebrow: { type: 'text', label: 'Eyebrow' },
+        headline: { type: 'text', label: 'Headline' },
+        highlight: { type: 'text', label: 'Highlighted words' },
+        subhead: { type: 'textarea', label: 'Subhead' },
+        primaryCta: ctaField('Primary button'),
+        secondaryCta: ctaField('Secondary button'),
+        frictionText: { type: 'text', label: 'Small print under the buttons' },
+        visual: { type: 'textarea', label: 'Visual placeholder text' },
+        bgToken: bgTokenField,
+      },
       defaultProps: {
         bgToken: 'none',
-        headline: 'Build and sell smarter with AI agents',
-        subhead: 'ONE connects your website, your audience, and your AI — so you can launch, grow, and earn without the usual overhead.',
-        primaryCta: { label: 'Get started free', href: '#' },
-        secondaryCta: { label: 'See how it works', href: '#how' },
       },
       render: (props: Record<string, unknown>) => (
         <LandingHero
           {...(props as any)}
-          primaryCta={(props.primaryCta as any) ?? { label: 'Get started', href: '#' }}
+          primaryCta={(props.primaryCta as any) ?? { label: '', href: '#' }}
           secondaryCta={(props.secondaryCta as any)?.label ? (props.secondaryCta as any) : undefined}
         />
       ),
     },
 
+    // Not one of the six the EHC lane keeps, so no fields yet: a caseworker who
+    // inserts it still sees no inputs. It stays REGISTERED because real seeded
+    // pages use it — an unregistered type renders as nothing.
     ProofBar: {
       fields: {},
       defaultProps: {
         bgToken: 'none',
-        stats: [
-          { value: '12,000+', label: 'Businesses powered', source: '' },
-          { value: '99.9%', label: 'Uptime SLA', source: '' },
-          { value: '< 60s', label: 'Time to first agent', source: '' },
-        ],
+        stats: [],
       },
       render: (props: Record<string, unknown>) => <ProofBar {...(props as any)} stats={(props.stats as any) ?? []} />,
     },
 
     HowItWorks: {
-      fields: {},
+      fields: {
+        title: { type: 'text', label: 'Title' },
+        subtitle: { type: 'textarea', label: 'Subtitle' },
+        steps: {
+          type: 'array',
+          label: 'Steps',
+          arrayFields: {
+            label: { type: 'text', label: 'Step name' },
+            description: { type: 'textarea', label: 'Description' },
+            detail: { type: 'text', label: 'Small detail' },
+          },
+          defaultItemProps: { label: '', description: '', detail: '' },
+          getItemSummary: (item: { label?: string }, i?: number) => item?.label || `Step ${(i ?? 0) + 1}`,
+        },
+        bgToken: bgTokenField,
+      },
       defaultProps: {
         bgToken: 'none',
-        title: 'How it works',
-        steps: [
-          { label: 'Connect your site', description: 'Point ONE at your domain — takes 60 seconds.', detail: 'No code required' },
-          { label: 'Add your agents', description: 'Pick from the library or describe one in plain English.', detail: 'Works with any model' },
-          { label: 'Go live', description: 'Publish your page. Agents handle the rest.', detail: 'Scales automatically' },
-        ],
+        steps: [],
       },
       render: (props: Record<string, unknown>) => <HowItWorks {...(props as any)} steps={(props.steps as any) ?? []} />,
     },
 
     LandingFeatures: {
-      fields: {},
+      // `icon` (a LucideIcon) and `tone` are props no editor can type — deliberately
+      // absent rather than declared as text, which would be a key the component
+      // cannot read the value of.
+      fields: {
+        title: { type: 'text', label: 'Title' },
+        subtitle: { type: 'textarea', label: 'Subtitle' },
+        columns: {
+          type: 'radio',
+          label: 'Columns',
+          options: [
+            { label: '2', value: 2 },
+            { label: '3', value: 3 },
+          ],
+        },
+        features: {
+          type: 'array',
+          label: 'Features',
+          arrayFields: {
+            headline: { type: 'text', label: 'Headline' },
+            body: { type: 'textarea', label: 'Body' },
+          },
+          defaultItemProps: { headline: '', body: '' },
+          getItemSummary: (item: { headline?: string }, i?: number) => item?.headline || `Feature ${(i ?? 0) + 1}`,
+        },
+        bgToken: bgTokenField,
+      },
       defaultProps: {
         bgToken: 'none',
-        title: 'Everything you need',
-        subtitle: 'One platform, every capability.',
         columns: 3,
-        features: [
-          { headline: 'AI agents built in', body: 'Deploy agents for sales, support, and content — no integrations required.' },
-          { headline: 'Pages that convert', body: 'Drag-and-drop blocks built for every funnel stage.' },
-          { headline: 'Payments included', body: 'Accept crypto and card in minutes, globally.' },
-        ],
+        features: [],
       },
       render: (props: Record<string, unknown>) => <LandingFeatures {...(props as any)} features={(props.features as any) ?? []} />,
     },
 
+    // Not one of the six (see ProofBar).
     Testimonials: {
       fields: {},
       defaultProps: {
         bgToken: 'none',
-        title: 'What our customers say',
-        testimonials: [
-          { quote: 'ONE cut our onboarding time in half. The agents handle everything we used to do manually.', name: 'Sarah O.', role: 'Head of Growth', company: 'Elevate Labs' },
-          { quote: 'We launched our course site in a weekend. The drag-and-drop editor is genuinely impressive.', name: 'Marco D.', role: 'Founder', company: 'Skill Stack' },
-        ],
+        testimonials: [],
       },
       render: (props: Record<string, unknown>) => <Testimonials {...(props as any)} testimonials={(props.testimonials as any) ?? []} />,
     },
 
+    // Not one of the six (see ProofBar).
     PricingSection: {
       fields: {},
       defaultProps: {
-        title: 'Simple, transparent pricing',
-        subtitle: 'Start free. Scale as you grow.',
-        tiers: [
-          { name: 'Free', monthlyPrice: '$0', annualPrice: '$0', description: 'Everything you need to get started.', cta: 'Get started', ctaHref: '#' },
-          { name: 'Pro', monthlyPrice: '$49', annualPrice: '$39', description: 'For teams that want more power and scale.', cta: 'Start free trial', ctaHref: '#' },
-        ],
+        tiers: [],
       },
       render: (props: Record<string, unknown>) => <PricingSection {...(props as any)} tiers={(props.tiers as any) ?? []} />,
     },
 
     FAQSection: {
-      fields: {},
+      fields: {
+        title: { type: 'text', label: 'Title' },
+        faqs: {
+          type: 'array',
+          label: 'Questions',
+          arrayFields: {
+            q: { type: 'text', label: 'Question' },
+            a: { type: 'textarea', label: 'Answer' },
+          },
+          defaultItemProps: { q: '', a: '' },
+          getItemSummary: (item: { q?: string }, i?: number) => item?.q || `Question ${(i ?? 0) + 1}`,
+        },
+        bgToken: bgTokenField,
+      },
       defaultProps: {
         bgToken: 'none',
-        title: 'Frequently asked questions',
-        faqs: [
-          { q: 'Do I need to know how to code?', a: 'No. ONE is designed for non-technical founders and marketers. Everything is drag-and-drop or describe-in-plain-English.' },
-          { q: 'Can I use my own domain?', a: 'Yes. Connect any domain in under a minute from your settings panel.' },
-        ],
+        faqs: [],
       },
       render: (props: Record<string, unknown>) => <FAQSection {...(props as any)} faqs={(props.faqs as any) ?? []} />,
     },
 
     SecondaryCTA: {
-      fields: {},
+      fields: {
+        headline: { type: 'text', label: 'Headline' },
+        subhead: { type: 'textarea', label: 'Subhead' },
+        primaryCta: ctaField('Primary button'),
+        secondaryCta: ctaField('Secondary button'),
+        frictionText: { type: 'text', label: 'Small print under the buttons' },
+        bgToken: bgTokenField,
+      },
       defaultProps: {
         bgToken: 'none',
-        headline: 'Ready to start?',
-        primaryCta: { label: 'Get started', href: '#' },
       },
       render: (props: Record<string, unknown>) => (
         <SecondaryCTA
           {...(props as any)}
-          primaryCta={(props.primaryCta as any) ?? { label: 'Get started', href: '#' }}
+          primaryCta={(props.primaryCta as any) ?? { label: '', href: '#' }}
           secondaryCta={(props.secondaryCta as any)?.label ? (props.secondaryCta as any) : undefined}
         />
       ),
     },
 
     FooterSection: {
-      fields: {},
+      fields: {
+        brand: { type: 'text', label: 'Brand name' },
+        links: {
+          type: 'array',
+          label: 'Links',
+          arrayFields: {
+            label: { type: 'text', label: 'Text' },
+            href: { type: 'text', label: 'Link' },
+          },
+          defaultItemProps: { label: '', href: '' },
+          getItemSummary: (item: { label?: string }, i?: number) => item?.label || `Link ${(i ?? 0) + 1}`,
+        },
+        socials: {
+          type: 'array',
+          label: 'Social links',
+          arrayFields: {
+            // The four keys ./components/FooterSection.tsx's ICONS map answers to.
+            platform: {
+              type: 'select',
+              label: 'Platform',
+              options: [
+                { label: 'Facebook', value: 'facebook' },
+                { label: 'Instagram', value: 'instagram' },
+                { label: 'Twitter', value: 'twitter' },
+                { label: 'YouTube', value: 'youtube' },
+              ],
+            },
+            href: { type: 'text', label: 'Link' },
+          },
+          defaultItemProps: { platform: 'facebook', href: '' },
+          getItemSummary: (item: { platform?: string }, i?: number) => item?.platform || `Social ${(i ?? 0) + 1}`,
+        },
+        copyright: { type: 'text', label: 'Copyright line' },
+      },
       defaultProps: {
-        brand: 'ONE',
-        links: [
-          { label: 'About', href: '#' },
-          { label: 'Features', href: '#' },
-          { label: 'Pricing', href: '#' },
-          { label: 'Contact', href: '#' },
-        ],
-        socials: [
-          { platform: 'twitter', href: '#' },
-          { platform: 'instagram', href: '#' },
-        ],
-        copyright: '© ONE, made for better web.',
+        links: [],
+        socials: [],
       },
       render: (props: Record<string, unknown>) => (
         <FooterSection

package/src/lib/surface-chrome.ts

@@ -0,0 +1,34 @@
+/**
+ * The contrast label for a brand fill.
+ *
+ * VENDORED from `one.ie/web/src/lib/puck/surface-chrome.ts`. This package is
+ * published to npm and rendered on external sites, so it cannot use the `@/`
+ * alias — the copy is intentional. What is NOT intentional is drift, and this
+ * file existed as drift: every block here emitted `text-on-primary` for ALL
+ * THREE brand tokens, so a `secondary` or `tertiary` fill got the `primary`
+ * contrast label and the text could land unreadable on its own background.
+ *
+ * Keep the MAPPING identical to the upstream module. The class strings must stay
+ * static literals — Tailwind cannot see `text-on-${token}` and compiles it to
+ * nothing, which is how text ends up the same colour as the fill it sits on.
+ */
+export type BrandToken = 'primary' | 'secondary' | 'tertiary'
+
+export const ON_TEXT: Record<BrandToken, string> = {
+  primary: 'text-on-primary',
+  secondary: 'text-on-secondary',
+  tertiary: 'text-on-tertiary',
+}
+
+const BRAND = new Set<string>(['primary', 'secondary', 'tertiary'])
+
+export const isBrand = (t?: string | null): t is BrandToken => !!t && BRAND.has(t)
+
+/** A token that paints something. `'none'`/absent means "leave the background alone". */
+export const isFilled = (t?: string | null): boolean => !!t && t !== 'none'
+
+/**
+ * The contrast label for a fill. Empty string for a non-brand fill (background /
+ * foreground already sit under `text-font`) so it concatenates safely.
+ */
+export const onText = (t?: string | null): string => (isBrand(t) ? ON_TEXT[t] : '')

package/tests/no-borrowed-identity.test.ts

@@ -0,0 +1,134 @@
+// This package renders a local authority's public SEND site — pages read by the
+// parent of a disabled child. A fabricated proof point, a payment claim or somebody
+// else's brand name on one of those pages is the worst thing this estate can
+// publish, and every instance this test guards was a DEFAULT: it fired when an
+// author did the obvious thing and omitted a prop that did not apply.
+//
+// Two halves, because the two defect shapes reach the page by different doors and
+// neither half can see the other's:
+//
+//   A. DEFAULT PARAMETERS (`frictionText = 'No credit card · 2-minute setup'`) fire
+//      on EVERY render path — Astro lane, Puck lane, SSR, editor — whenever the prop
+//      is undefined. The block renders confidently with the wrong words, so no
+//      presence check and no empty-state test can see them. Rendering each component
+//      with only its required props is what sees them.
+//
+//   B. `defaultProps` in config.tsx are inert under Puck's read-only <Render>, which
+//      merges only `config.root.defaultProps` (@puckeditor/core 0.21.3,
+//      dist/index.js:14185). They are NOT inert in the editor: the insert reducer
+//      does `props: {…config.components[type].defaultProps, id}` (:1933), so dragging
+//      the block WRITES the fabrication into the D1 row, after which it is ordinary
+//      stored props and renders publicly with no merge needed. Half A renders
+//      components and cannot see a single byte of that. So half B walks the config.
+//      `defaultItemProps` under `fields` is the same door one level down — it lands
+//      in the row the moment a caseworker clicks "add item" — so the walk covers the
+//      whole component config, not just `defaultProps`.
+//
+// RED PROOF (run 2026-09-11, both halves): restoring `frictionText = 'No credit card
+// · 2-minute setup'` in LandingHero.tsx failed half A naming a payment claim;
+// restoring the `12,000+ Businesses powered` stat in config.tsx's ProofBar
+// defaultProps failed half B naming a grouped-number statistic. A checker never
+// driven red proves nothing.
+import { describe, it, expect } from 'vitest'
+import { createElement, type ComponentType } from 'react'
+import { renderToStaticMarkup } from 'react-dom/server'
+import { pagesPuckConfig } from '../src/config'
+import { LandingHero } from '../src/components/LandingHero'
+import { HowItWorks } from '../src/components/HowItWorks'
+import { LandingFeatures } from '../src/components/LandingFeatures'
+import { ProofBar } from '../src/components/ProofBar'
+import { SecondaryCTA } from '../src/components/SecondaryCTA'
+import { FAQSection } from '../src/components/FAQSection'
+import { Testimonials } from '../src/components/Testimonials'
+import { PricingSection } from '../src/components/PricingSection'
+import { FooterSection } from '../src/components/FooterSection'
+
+// Matched against SUBSTRINGS and shapes, never against a whole sentence. The brief
+// that commissioned this test quoted `'No credit card - 2-minute setup'` and
+// `'(c) ONE, made for better web.'`; the files carried `'No credit card · 2-minute
+// setup'` (U+00B7) and `'© ONE, made for better web.'`. A full-sentence assertion
+// would have been vacuously green while the real string shipped.
+const FORBIDDEN: ReadonlyArray<readonly [string, RegExp]> = [
+  ["ONE's name", /\bONE\b/],
+  ['a one.ie URL', /one\.ie/i],
+  ["ONE's tagline", /made for better web/i],
+  ['a payment claim', /credit card|free trial|billing/i],
+  ['a price', /[$€£]\s?\d/],
+  ['a percentage claim', /\d+(\.\d+)?\s?%/],
+  ['a grouped-number statistic', /\b\d{1,3}(,\d{3})+/],
+  ['an uptime / SLA claim', /uptime|\bSLA\b/i],
+  ['a named testimonial', /Elevate Labs|Skill Stack|Sarah O\.|Marco D\./i],
+  ['a setup-time claim', /\b\d+\s?-?\s?(second|minute|hour|day)s?\b/i],
+  ['a time-to-value claim', /[<>]\s?\d+\s?s\b/i],
+]
+
+/** The visible words, not the markup — a class name is not something a parent reads. */
+const visibleText = (html: string): string => html.replace(/<[^>]*>/g, ' ')
+
+function sweep(where: string, subject: string): string[] {
+  return FORBIDDEN.filter(([, re]) => re.test(subject)).map(
+    ([what, re]) => `${where} carries ${what}: ${JSON.stringify(subject.match(re)?.[0] ?? '')}`
+  )
+}
+
+// Only what the component's props type makes REQUIRED. Everything else is omitted on
+// purpose: omitting a prop that does not apply is the obvious thing an EHC author
+// does, and it is exactly what used to ship someone else's copy. Required strings are
+// empty so that any word in the output can only have come from a default.
+const REQUIRED_ONLY: ReadonlyArray<readonly [string, ComponentType<any>, Record<string, unknown>]> = [
+  ['LandingHero', LandingHero, { headline: '', subhead: '', primaryCta: { label: '', href: '#' } }],
+  ['HowItWorks', HowItWorks, { steps: [] }],
+  ['LandingFeatures', LandingFeatures, { features: [] }],
+  ['ProofBar', ProofBar, {}],
+  ['SecondaryCTA', SecondaryCTA, { headline: '', primaryCta: { label: '', href: '#' } }],
+  ['FAQSection', FAQSection, { faqs: [] }],
+  ['Testimonials', Testimonials, { testimonials: [] }],
+  ['PricingSection', PricingSection, { tiers: [] }],
+  ['FooterSection', FooterSection, {}],
+]
+
+describe('A — a component rendered with only its required props borrows no identity', () => {
+  it('covers every block the config registers (an empty sweep must not read as a pass)', () => {
+    const registered = Object.keys(pagesPuckConfig.components).sort()
+    const covered = REQUIRED_ONLY.map(([name]) => name).sort()
+    expect(covered).toEqual(registered)
+    expect(registered.length).toBeGreaterThan(0)
+  })
+
+  it.each(REQUIRED_ONLY)('%s', (name, Component, props) => {
+    const html = renderToStaticMarkup(createElement(Component, props as any))
+    // The component must actually have rendered — a component that threw or returned
+    // null would sweep clean and prove nothing.
+    expect(html.length, `${name} rendered nothing`).toBeGreaterThan(0)
+    expect(sweep(`<${name}> with required props only`, visibleText(html))).toEqual([])
+  })
+})
+
+describe('B — the config carries no content the editor could write into a page row', () => {
+  // Every string leaf under `components`, keyed by its path. `render` is a function
+  // and is skipped; everything else — defaultProps, defaultItemProps, field labels,
+  // select option labels and values — is data that can reach a row or a caseworker's
+  // screen.
+  const strings: Array<[string, string]> = []
+  const walk = (value: unknown, path: string): void => {
+    if (typeof value === 'string') return void strings.push([path, value])
+    if (typeof value === 'function') return
+    if (Array.isArray(value)) return value.forEach((v, i) => walk(v, `${path}[${i}]`))
+    if (value && typeof value === 'object') {
+      for (const [k, v] of Object.entries(value)) walk(v, `${path}.${k}`)
+    }
+  }
+  walk(pagesPuckConfig.components, 'components')
+
+  it('the walk actually visited the config (an empty walk must not read as a pass)', () => {
+    expect(strings.length).toBeGreaterThan(20)
+    // The path that matters most is named explicitly: this is the one the insert
+    // reducer copies into the row.
+    expect(strings.some(([p]) => p.includes('.defaultProps.'))).toBe(true)
+  })
+
+  it('no string leaf names ONE, a price, a statistic or a person', () => {
+    const findings = strings.flatMap(([path, value]) => sweep(path, value))
+    expect(findings).toEqual([])
+  })
+})

package/tests/plugin-pages.test.ts

@@ -5,23 +5,96 @@ import { PageRenderer, type PuckData } from '../src/PageRenderer'
 import { fetchPage } from '../src/fetchPage'
 
 // Real production fixture — the exact `pages:view` response for workspace `tony`,
-// page `beer`, captured live 2026-07-11. Not hand-invented: this is what caught
-// C1's stub-block bug (block type names that never matched any real page) — a
-// self-referential fixture would never have caught that, so this test uses real
-// content on purpose. `Heading` (id only) is a structural block outside this
-// cycle's ported set — expected to render nothing, not a failure.
+// page `beer`, captured live 2026-07-11. The BLOCK TYPES and ids are that capture,
+// untouched: they are what caught C1's stub-block bug (block type names that never
+// matched any real page), and a self-invented type list would never have caught it.
+//
+// The PROPS are added, and the reason is the point of the whole fixture. The capture
+// carried `{id}` only, so what rendered was each component's own default parameter —
+// which is what the assertions below used to read. Those defaults were ONE.ie's copy
+// ('What you get', 'What agencies say', 'No credit card · 2-minute setup') on a
+// package that renders a local authority's SEND site, so they are gone. Asserting on
+// props the fixture actually passes is the stronger test anyway: it proves the key
+// resolves to the right component AND that the component reads the prop, where the
+// old form only proved the first. `Heading` (id only) is a structural block outside
+// this cycle's ported set — expected to render nothing, not a failure.
 const beerPage = {
   root: {},
   content: [
-    { type: 'LandingHero', props: { id: 'LandingHero-kr5o1y' } },
+    {
+      type: 'LandingHero',
+      props: {
+        id: 'LandingHero-kr5o1y',
+        headline: 'Fixture hero headline',
+        subhead: 'Fixture hero subhead',
+        primaryCta: { label: 'Fixture hero button', href: '/fixture' },
+      },
+    },
     { type: 'Heading', props: { id: 'Heading-jxrapx' } },
-    { type: 'LandingFeatures', props: { id: 'LandingFeatures-al6pnl' } },
-    { type: 'HowItWorks', props: { id: 'HowItWorks-6gplnc' } },
-    { type: 'ProofBar', props: { id: 'ProofBar-g3yvbh' } },
-    { type: 'SecondaryCTA', props: { id: 'SecondaryCTA-drayza' } },
-    { type: 'FAQSection', props: { id: 'FAQSection-y7z0lt' } },
-    { type: 'Testimonials', props: { id: 'Testimonials-9cq0fo' } },
-    { type: 'PricingSection', props: { id: 'PricingSection-mtqhe8' } },
+    {
+      type: 'LandingFeatures',
+      props: {
+        id: 'LandingFeatures-al6pnl',
+        title: 'Fixture features title',
+        features: [{ headline: 'Fixture feature headline', body: 'Fixture feature body' }],
+      },
+    },
+    {
+      type: 'HowItWorks',
+      props: {
+        id: 'HowItWorks-6gplnc',
+        title: 'Fixture steps title',
+        steps: [{ label: 'Fixture step label', description: 'Fixture step description' }],
+      },
+    },
+    {
+      type: 'ProofBar',
+      props: { id: 'ProofBar-g3yvbh', stats: [{ value: 'Fixture value', label: 'Fixture stat label' }] },
+    },
+    {
+      type: 'SecondaryCTA',
+      props: {
+        id: 'SecondaryCTA-drayza',
+        headline: 'Fixture secondary headline',
+        primaryCta: { label: 'Fixture secondary button', href: '/fixture' },
+      },
+    },
+    {
+      type: 'FAQSection',
+      props: {
+        id: 'FAQSection-y7z0lt',
+        title: 'Fixture faq title',
+        faqs: [{ q: 'Fixture question', a: 'Fixture answer' }],
+      },
+    },
+    {
+      type: 'Testimonials',
+      props: {
+        id: 'Testimonials-9cq0fo',
+        title: 'Fixture quotes title',
+        testimonials: [
+          { quote: 'Fixture quote', name: 'Fixture name', role: 'Fixture role', company: 'Fixture company' },
+        ],
+      },
+    },
+    {
+      type: 'PricingSection',
+      props: {
+        id: 'PricingSection-mtqhe8',
+        title: 'Fixture pricing title',
+        tiers: [
+          {
+            name: 'Fixture tier',
+            monthlyPrice: 'Fixture monthly',
+            annualPrice: 'Fixture annual',
+            description: 'Fixture tier description',
+            features: ['Fixture tier feature'],
+            cta: 'Fixture tier button',
+            ctaHref: '/fixture',
+          },
+        ],
+      },
+    },
   ],
   zones: {},
 } as unknown as PuckData
@@ -36,19 +109,19 @@ const mockFetch = (body: unknown): typeof fetch =>
 describe('PageRenderer — real page content', () => {
   it('renders every block type from a real published page (not a self-invented fixture)', () => {
     const html = renderToStaticMarkup(createElement(PageRenderer, { data: beerPage }))
-    // The real beer page's stored props are just `{id}` per block (never customized
-    // past insertion) — Puck's read-only <Render> does NOT merge each component's
-    // config-level `defaultProps` (that's editor-only, for new-component insertion);
-    // it passes stored props straight through, so each *component's own* JS default
-    // parameter value is what actually renders. Asserting on those (not the config
-    // defaultProps) is what proves the real registry keys resolve to the right
-    // component — a stub-key config would render none of this.
-    expect(html).toContain('What you get') // LandingFeatures component default title
-    expect(html).toContain('How it works') // HowItWorks component default title
-    expect(html).toContain('Common questions') // FAQSection component default title
-    expect(html).toContain('What agencies say') // Testimonials component default title
-    expect(html).toContain('Simple pricing') // PricingSection component default title
-    expect(html).toContain('No credit card · 2-minute setup') // LandingHero + SecondaryCTA shared default frictionText
+    // Puck's read-only <Render> does NOT merge a component's config-level
+    // `defaultProps` (that is the editor's insert reducer, index.js:1933) — it passes
+    // stored props straight through. So one assertion per block type, each reading a
+    // prop only THAT component knows how to render: a stub-key config, or a key bound
+    // to the wrong component, renders none of them.
+    expect(html).toContain('Fixture hero headline') // LandingHero
+    expect(html).toContain('Fixture feature headline') // LandingFeatures (the card, not just the heading)
+    expect(html).toContain('Fixture step description') // HowItWorks
+    expect(html).toContain('Fixture stat label') // ProofBar
+    expect(html).toContain('Fixture secondary headline') // SecondaryCTA
+    expect(html).toContain('Fixture question') // FAQSection
+    expect(html).toContain('Fixture quote') // Testimonials
+    expect(html).toContain('Fixture tier') // PricingSection
     expect(html).toContain('lucide-arrow-right') // LandingHero/SecondaryCTA CTA icon actually rendered
     expect((html.match(/<section/g) ?? []).length).toBe(8) // 8 of the 9 fixture blocks are ported (Heading is out of scope)
   })