@goodfellow-cms/registry 0.0.0-stage → 0.2.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Goodfellow contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/LICENSE-shadcn.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 shadcn
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,107 @@
-# Temporary Holding Version
+# @goodfellow-cms/registry
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Goodfellow's block registry: blocks built with [shadcn/ui](https://ui.shadcn.com), which a site's admins add and remove on the admin panel's **Blocks** screen, with no developer. It's also the reference for anyone publishing a registry of Goodfellow blocks built with another component library.
+
+| Block | Category | Recommended |
+|---|---|---|
+| Hero | Page sections | Yes |
+| Cards | Page sections | Yes |
+| Call to action | Page sections | Yes |
+| Testimonials | Page sections | Yes |
+| Notice | Page sections | Yes |
+| Pricing table | Page sections | |
+| FAQ | Interactive | Yes |
+| Tabs | Interactive | Yes |
+| Image carousel | Interactive | |
+| Custom HTML | Advanced | |
+
+New sites made with `create-goodfellow` start with the recommended blocks unless the admin chooses "Built-in blocks only".
+
+## How a block gets into a site
+
+Adding a block copies its code into the site, as `npx shadcn add` would, in one publish:
+
+- the block's own files to `blocks/installed/<name>/`;
+- the shadcn components it uses to `components/ui/`, and any other shared code to `components/`, `lib/` or `hooks/`, unless the site already has them;
+- a record of what was added, `blocks/installed/installed.json`, with a hash of every file written;
+- `blocks/installed/index.ts`, which the site's `goodfellow.config.tsx` imports and which lists every installed block.
+
+The editor offers the block once the site has been rebuilt with it, which the host does after the publish (and `goodfellow dev` or `next dev` do straight away). Removing a block is refused while any page, collection page design, header or footer uses it. Removing deletes the files it added, except those someone has changed since or that another installed block uses.
+
+The admin panel installs a release of this registry that matches its own: `https://cdn.jsdelivr.net/npm/@goodfellow-cms/registry@<version>/r/{name}.json`. In development, `goodfellow dev` and `next dev` serve the copy in the site's `node_modules`.
+
+## Publishing your own registry
+
+A Goodfellow block registry is a [shadcn registry](https://ui.shadcn.com/docs/registry) whose block items follow a few extra rules. Build it with `npx shadcn build` and host the files anywhere that allows requests from browsers (CORS), such as GitHub Pages, npm through jsDelivr, or your own site.
+
+### Items
+
+A block is a `registry:block` item with `meta.goodfellow`:
+
+```json
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "acme-gallery",
+  "type": "registry:block",
+  "title": "Gallery",
+  "description": "Pictures in a grid that open larger when clicked.",
+  "registryDependencies": ["@acme/dialog"],
+  "dependencies": ["radix-ui"],
+  "files": [
+    { "path": "blocks/acme-gallery/block.tsx", "type": "registry:block", "content": "…" },
+    { "path": "blocks/acme-gallery/gallery-grid.tsx", "type": "registry:component", "content": "…" }
+  ],
+  "meta": {
+    "goodfellow": {
+      "category": "Pictures",
+      "recommended": false,
+      "image": "images/acme-gallery.png",
+      "version": "1.2.0"
+    }
+  }
+}
+```
+
+- **`name`** becomes the block's key in the site's content, so never change it once published. Use lowercase letters, numbers and dashes, and start names with your registry's own prefix so they don't clash with other registries' blocks.
+- **`title`** and **`description`** are what admins see on the Blocks screen. Write them for people who aren't developers.
+- **`meta.goodfellow.category`** is the group the block is listed under, on the Blocks screen and in the editor. `recommended` marks blocks a new site should start with. `image` is a picture of the block, relative to the item's address. `version` is recorded in the site when the block is added.
+- **Files:** the item has exactly one `registry:block` file, whose default export is the block's Puck `ComponentConfig`. Every other file of the item goes into the block's folder too (`blocks/installed/<name>/`), so import them with relative paths (`./gallery-grid`). Items without `meta.goodfellow`, such as shared components, are dependencies: their files go to `components/ui/` (`registry:ui`), `components/` (`registry:component`), `lib/` (`registry:lib`) or `hooks/` (`registry:hook`), and blocks import them as `@/components/ui/dialog` and so on. A file's `target` can name another place within those folders. Other file types, and files elsewhere in the site, are refused.
+- **`registryDependencies`** name items as `@namespace/name`, or as a plain name for shadcn/ui's own components (`"button"`), as with the shadcn CLI.
+- **`registry.json`**, at the same address as the items (`…/r/registry.json` for `…/r/{name}.json`), lists them, so the Blocks screen can show them without loading every item.
+
+### Packages
+
+The admin panel can't install npm packages, so every site includes the same set and blocks can use only those. Besides `react`, `@goodfellow-cms/react` and `@puckeditor/core`, which every site has, they are `class-variance-authority`, `clsx`, `cn`, `embla-carousel-react`, `lucide-react`, `radix-ui`, `tailwind-merge` and `tw-animate-css`. An item whose `dependencies` name anything else can't be added. To suggest a package for the list, open an issue.
+
+### Writing the blocks
+
+Registry blocks follow the same rules as any Goodfellow block (see [AGENTS.md](https://github.com/goodfellow-cms/goodfellow-cms/blob/master/AGENTS.md#blocks)):
+
+- Every block has a `className` prop (`className: classNameField`), applied to its outermost element and combined with `cx()` from `@goodfellow-cms/react`, last.
+- Use the theme's classes (`bg-primary`, `text-muted-foreground`, `rounded-lg`), which shadcn's components use too, so blocks follow the site's colors and fonts.
+- Render links and images with `SiteLink` and `SiteImage` from `@goodfellow-cms/react`, and image fields with `mediaField()`. To style a link as a button, give `SiteLink` the classes from shadcn's `buttonVariants()`.
+- Labels and options are for non-technical people: "Space above and below", not "padding-y".
+- `render` uses no hooks besides `useSite()`. Interactive parts go in a file starting with `"use client"`, which gets plain values and content (`children`, rich text) only.
+- **One Client Component per interactive part.** Sites built with `goodfellow build` run each Client Component a block renders as its own small React app (an island), and islands don't share React context. Components whose parts talk to each other through context, as Radix's `Accordion`, `AccordionItem` and `AccordionContent` do, must all be put together inside one `"use client"` file, which the block renders with its content as props. See `site/blocks/installed/shadcn-faq/` here.
+- **Keep content in the page.** Hidden content, such as closed answers or other tabs, should still be in the HTML (Radix's `forceMount`, hidden with CSS), so search engines and visitors without JavaScript see it.
+- Prefer HTML and CSS where they're enough: a `<details>` element rather than a Client Component, since a page with a Client Component loads React.
+
+### Letting a site use it
+
+Admins can only add blocks from registries the site's developer trusts, since a block's code runs in the admin panel with the editor's access to the site. Add yours to the site's `goodfellow.config.tsx`, and its blocks appear on the Blocks screen beside Goodfellow's:
+
+```tsx
+export default defineConfig({
+  blocks: { ...blocks, ...installedBlocks },
+  registries: { "@acme": "https://acme.example/r/{name}.json" },
+});
+```
+
+## Working on this registry
+
+- `registry.json` lists the blocks, whose files are in `site/blocks/installed/`, laid out as they'll be in a site.
+- `site/components/ui/` and `shadcn.json` are a snapshot of the shadcn/ui components the blocks use, so a release always installs the same code. `pnpm --filter @goodfellow-cms/registry update-shadcn` (`scripts/snapshot.mjs`) fetches them again; review and commit what it writes. Don't edit the snapshot by hand.
+- `pnpm build` (`scripts/build.mjs`) writes `r/`, which is what's published: an item per block and component, with its files, and `r/registry.json`.
+- The tests check that every item is valid, uses only the allowed packages, installs with every file it imports, and renders.
+
+The shadcn/ui components are © shadcn, under the MIT license in `LICENSE-shadcn.md`.

package/package.json

@@ -1,6 +1,56 @@
 {
   "name": "@goodfellow-cms/registry",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.2.0",
+  "description": "Goodfellow's block registry: blocks built with shadcn/ui, which sites install from the admin panel.",
+  "keywords": [
+    "goodfellow",
+    "cms",
+    "website-builder",
+    "puck",
+    "shadcn",
+    "shadcn-registry",
+    "blocks"
+  ],
+  "homepage": "https://goodfellow-cms.github.io/goodfellow-cms/docs/block-registries",
+  "bugs": "https://github.com/goodfellow-cms/goodfellow-cms/issues",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/goodfellow-cms/goodfellow-cms.git",
+    "directory": "packages/registry"
+  },
+  "type": "module",
+  "files": [
+    "r",
+    "LICENSE-shadcn.md"
+  ],
+  "exports": {
+    "./package.json": "./package.json"
+  },
+  "devDependencies": {
+    "@puckeditor/core": "0.23.0",
+    "@types/react": "^19.2.0",
+    "@types/react-dom": "^19.2.0",
+    "class-variance-authority": "0.7.1",
+    "cn": "0.4.0",
+    "embla-carousel-react": "8.6.0",
+    "lucide-react": "1.52.0",
+    "radix-ui": "1.7.0",
+    "react": "19.3.0",
+    "react-dom": "19.3.0",
+    "@goodfellow-cms/core": "0.2.0",
+    "@goodfellow-cms/react": "0.2.0"
+  },
+  "engines": {
+    "node": ">=22"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "node scripts/build.mjs",
+    "typecheck": "tsc -p tsconfig.json",
+    "test": "vitest run",
+    "update-shadcn": "node scripts/snapshot.mjs"
+  }
 }

package/r/accordion.json

@@ -0,0 +1,17 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "accordion",
+  "type": "registry:ui",
+  "dependencies": [
+    "cn",
+    "radix-ui"
+  ],
+  "registryDependencies": [],
+  "files": [
+    {
+      "path": "components/ui/accordion.tsx",
+      "type": "registry:ui",
+      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"cn\"\nimport { ChevronDownIcon } from \"lucide-react\"\nimport { Accordion as AccordionPrimitive } from \"radix-ui\"\n\nfunction Accordion({\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Root>) {\n  return <AccordionPrimitive.Root data-slot=\"accordion\" {...props} />\n}\n\nfunction AccordionItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Item>) {\n  return (\n    <AccordionPrimitive.Item\n      data-slot=\"accordion-item\"\n      className={cn(\"border-b last:border-b-0\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AccordionTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        data-slot=\"accordion-trigger\"\n        className={cn(\n          \"flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <ChevronDownIcon className=\"pointer-events-none size-4 shrink-0 translate-y-0.5 text-muted-foreground transition-transform duration-200\" />\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  )\n}\n\nfunction AccordionContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Content>) {\n  return (\n    <AccordionPrimitive.Content\n      data-slot=\"accordion-content\"\n      className=\"overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down\"\n      {...props}\n    >\n      <div className={cn(\"pt-0 pb-4\", className)}>{children}</div>\n    </AccordionPrimitive.Content>\n  )\n}\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent }\n"
+    }
+  ]
+}

package/r/alert.json

@@ -0,0 +1,16 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "alert",
+  "type": "registry:ui",
+  "dependencies": [
+    "cn"
+  ],
+  "registryDependencies": [],
+  "files": [
+    {
+      "path": "components/ui/alert.tsx",
+      "type": "registry:ui",
+      "content": "import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\n\nconst alertVariants = cva(\n  \"relative grid w-full grid-cols-[0_1fr] items-start gap-y-0.5 rounded-lg border px-4 py-3 text-sm has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] has-[>svg]:gap-x-3 [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-card text-card-foreground\",\n        destructive:\n          \"bg-card text-destructive *:data-[slot=alert-description]:text-destructive/90 [&>svg]:text-current\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction Alert({\n  className,\n  variant,\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof alertVariants>) {\n  return (\n    <div\n      data-slot=\"alert\"\n      role=\"alert\"\n      className={cn(alertVariants({ variant }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction AlertTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-title\"\n      className={cn(\n        \"col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction AlertDescription({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-description\"\n      className={cn(\n        \"col-start-2 grid justify-items-start gap-1 text-sm text-muted-foreground [&_p]:leading-relaxed\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Alert, AlertTitle, AlertDescription }\n"
+    }
+  ]
+}

package/r/badge.json

@@ -0,0 +1,17 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "badge",
+  "type": "registry:ui",
+  "dependencies": [
+    "cn",
+    "radix-ui"
+  ],
+  "registryDependencies": [],
+  "files": [
+    {
+      "path": "components/ui/badge.tsx",
+      "type": "registry:ui",
+      "content": "import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\nimport { Slot } from \"radix-ui\"\n\nconst badgeVariants = cva(\n  \"inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground [a&]:hover:bg-primary/90\",\n        secondary:\n          \"bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90\",\n        destructive:\n          \"bg-destructive text-white focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40 [a&]:hover:bg-destructive/90\",\n        outline:\n          \"border-border text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground\",\n        ghost: \"[a&]:hover:bg-accent [a&]:hover:text-accent-foreground\",\n        link: \"text-primary underline-offset-4 [a&]:hover:underline\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction Badge({\n  className,\n  variant = \"default\",\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"span\"> &\n  VariantProps<typeof badgeVariants> & { asChild?: boolean }) {\n  const Comp = asChild ? Slot.Root : \"span\"\n\n  return (\n    <Comp\n      data-slot=\"badge\"\n      data-variant={variant}\n      className={cn(badgeVariants({ variant }), className)}\n      {...props}\n    />\n  )\n}\n\nexport { Badge, badgeVariants }\n"
+    }
+  ]
+}

package/r/button.json

@@ -0,0 +1,17 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "button",
+  "type": "registry:ui",
+  "dependencies": [
+    "cn",
+    "radix-ui"
+  ],
+  "registryDependencies": [],
+  "files": [
+    {
+      "path": "components/ui/button.tsx",
+      "type": "registry:ui",
+      "content": "import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\nimport { Slot } from \"radix-ui\"\n\nconst buttonVariants = cva(\n  \"inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n        destructive:\n          \"bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40\",\n        outline:\n          \"border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50\",\n        secondary:\n          \"bg-secondary text-secondary-foreground hover:bg-secondary/80\",\n        ghost:\n          \"hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n      size: {\n        default: \"h-9 px-4 py-2 has-[>svg]:px-3\",\n        xs: \"h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3\",\n        sm: \"h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5\",\n        lg: \"h-10 rounded-md px-6 has-[>svg]:px-4\",\n        icon: \"size-9\",\n        \"icon-xs\": \"size-6 rounded-md [&_svg:not([class*='size-'])]:size-3\",\n        \"icon-sm\": \"size-8\",\n        \"icon-lg\": \"size-10\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nfunction Button({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"button\"> &\n  VariantProps<typeof buttonVariants> & {\n    asChild?: boolean\n  }) {\n  const Comp = asChild ? Slot.Root : \"button\"\n\n  return (\n    <Comp\n      data-slot=\"button\"\n      data-variant={variant}\n      data-size={size}\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  )\n}\n\nexport { Button, buttonVariants }\n"
+    }
+  ]
+}

package/r/card.json

@@ -0,0 +1,16 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "card",
+  "type": "registry:ui",
+  "dependencies": [
+    "cn"
+  ],
+  "registryDependencies": [],
+  "files": [
+    {
+      "path": "components/ui/card.tsx",
+      "type": "registry:ui",
+      "content": "import * as React from \"react\"\nimport { cn } from \"cn\"\n\nfunction Card({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card\"\n      className={cn(\n        \"flex flex-col gap-6 rounded-xl border bg-card py-6 text-card-foreground shadow-sm\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-header\"\n      className={cn(\n        \"@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-title\"\n      className={cn(\"leading-none font-semibold\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-description\"\n      className={cn(\"text-sm text-muted-foreground\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardAction({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-action\"\n      className={cn(\n        \"col-start-2 row-span-2 row-start-1 self-start justify-self-end\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-content\"\n      className={cn(\"px-6\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-footer\"\n      className={cn(\"flex items-center px-6 [.border-t]:pt-6\", className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Card,\n  CardHeader,\n  CardFooter,\n  CardTitle,\n  CardAction,\n  CardDescription,\n  CardContent,\n}\n"
+    }
+  ]
+}

package/r/carousel.json

@@ -0,0 +1,19 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "carousel",
+  "type": "registry:ui",
+  "dependencies": [
+    "cn",
+    "embla-carousel-react"
+  ],
+  "registryDependencies": [
+    "@goodfellow/button"
+  ],
+  "files": [
+    {
+      "path": "components/ui/carousel.tsx",
+      "type": "registry:ui",
+      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"cn\"\nimport useEmblaCarousel, {\n  type UseEmblaCarouselType,\n} from \"embla-carousel-react\"\nimport { ArrowLeft, ArrowRight } from \"lucide-react\"\n\nimport { Button } from \"@/components/ui/button\"\n\ntype CarouselApi = UseEmblaCarouselType[1]\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>\ntype CarouselOptions = UseCarouselParameters[0]\ntype CarouselPlugin = UseCarouselParameters[1]\n\ntype CarouselProps = {\n  opts?: CarouselOptions\n  plugins?: CarouselPlugin\n  orientation?: \"horizontal\" | \"vertical\"\n  setApi?: (api: CarouselApi) => void\n}\n\ntype CarouselContextProps = {\n  carouselRef: ReturnType<typeof useEmblaCarousel>[0]\n  api: ReturnType<typeof useEmblaCarousel>[1]\n  scrollPrev: () => void\n  scrollNext: () => void\n  canScrollPrev: boolean\n  canScrollNext: boolean\n} & CarouselProps\n\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null)\n\nfunction useCarousel() {\n  const context = React.useContext(CarouselContext)\n\n  if (!context) {\n    throw new Error(\"useCarousel must be used within a <Carousel />\")\n  }\n\n  return context\n}\n\nfunction Carousel({\n  orientation = \"horizontal\",\n  opts,\n  setApi,\n  plugins,\n  className,\n  children,\n  ...props\n}: React.ComponentProps<\"div\"> & CarouselProps) {\n  const [carouselRef, api] = useEmblaCarousel(\n    {\n      ...opts,\n      axis: orientation === \"horizontal\" ? \"x\" : \"y\",\n    },\n    plugins\n  )\n  const [canScrollPrev, setCanScrollPrev] = React.useState(false)\n  const [canScrollNext, setCanScrollNext] = React.useState(false)\n\n  const onSelect = React.useCallback((api: CarouselApi) => {\n    if (!api) return\n    setCanScrollPrev(api.canScrollPrev())\n    setCanScrollNext(api.canScrollNext())\n  }, [])\n\n  const scrollPrev = React.useCallback(() => {\n    api?.scrollPrev()\n  }, [api])\n\n  const scrollNext = React.useCallback(() => {\n    api?.scrollNext()\n  }, [api])\n\n  const handleKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (event.key === \"ArrowLeft\") {\n        event.preventDefault()\n        scrollPrev()\n      } else if (event.key === \"ArrowRight\") {\n        event.preventDefault()\n        scrollNext()\n      }\n    },\n    [scrollPrev, scrollNext]\n  )\n\n  React.useEffect(() => {\n    if (!api || !setApi) return\n    setApi(api)\n  }, [api, setApi])\n\n  React.useEffect(() => {\n    if (!api) return\n    onSelect(api)\n    api.on(\"reInit\", onSelect)\n    api.on(\"select\", onSelect)\n\n    return () => {\n      api?.off(\"select\", onSelect)\n    }\n  }, [api, onSelect])\n\n  return (\n    <CarouselContext.Provider\n      value={{\n        carouselRef,\n        api: api,\n        opts,\n        orientation:\n          orientation || (opts?.axis === \"y\" ? \"vertical\" : \"horizontal\"),\n        scrollPrev,\n        scrollNext,\n        canScrollPrev,\n        canScrollNext,\n      }}\n    >\n      <div\n        onKeyDownCapture={handleKeyDown}\n        className={cn(\"relative\", className)}\n        role=\"region\"\n        aria-roledescription=\"carousel\"\n        data-slot=\"carousel\"\n        {...props}\n      >\n        {children}\n      </div>\n    </CarouselContext.Provider>\n  )\n}\n\nfunction CarouselContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  const { carouselRef, orientation } = useCarousel()\n\n  return (\n    <div\n      ref={carouselRef}\n      className=\"overflow-hidden\"\n      data-slot=\"carousel-content\"\n    >\n      <div\n        className={cn(\n          \"flex\",\n          orientation === \"horizontal\" ? \"-ml-4\" : \"-mt-4 flex-col\",\n          className\n        )}\n        {...props}\n      />\n    </div>\n  )\n}\n\nfunction CarouselItem({ className, ...props }: React.ComponentProps<\"div\">) {\n  const { orientation } = useCarousel()\n\n  return (\n    <div\n      role=\"group\"\n      aria-roledescription=\"slide\"\n      data-slot=\"carousel-item\"\n      className={cn(\n        \"min-w-0 shrink-0 grow-0 basis-full\",\n        orientation === \"horizontal\" ? \"pl-4\" : \"pt-4\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CarouselPrevious({\n  className,\n  variant = \"outline\",\n  size = \"icon\",\n  ...props\n}: React.ComponentProps<typeof Button>) {\n  const { orientation, scrollPrev, canScrollPrev } = useCarousel()\n\n  return (\n    <Button\n      data-slot=\"carousel-previous\"\n      variant={variant}\n      size={size}\n      className={cn(\n        \"absolute size-8 rounded-full\",\n        orientation === \"horizontal\"\n          ? \"top-1/2 -left-12 -translate-y-1/2\"\n          : \"-top-12 left-1/2 -translate-x-1/2 rotate-90\",\n        className\n      )}\n      disabled={!canScrollPrev}\n      onClick={scrollPrev}\n      {...props}\n    >\n      <ArrowLeft />\n      <span className=\"sr-only\">Previous slide</span>\n    </Button>\n  )\n}\n\nfunction CarouselNext({\n  className,\n  variant = \"outline\",\n  size = \"icon\",\n  ...props\n}: React.ComponentProps<typeof Button>) {\n  const { orientation, scrollNext, canScrollNext } = useCarousel()\n\n  return (\n    <Button\n      data-slot=\"carousel-next\"\n      variant={variant}\n      size={size}\n      className={cn(\n        \"absolute size-8 rounded-full\",\n        orientation === \"horizontal\"\n          ? \"top-1/2 -right-12 -translate-y-1/2\"\n          : \"-bottom-12 left-1/2 -translate-x-1/2 rotate-90\",\n        className\n      )}\n      disabled={!canScrollNext}\n      onClick={scrollNext}\n      {...props}\n    >\n      <ArrowRight />\n      <span className=\"sr-only\">Next slide</span>\n    </Button>\n  )\n}\n\nexport {\n  type CarouselApi,\n  Carousel,\n  CarouselContent,\n  CarouselItem,\n  CarouselPrevious,\n  CarouselNext,\n}\n"
+    }
+  ]
+}

package/r/custom-html.json

@@ -0,0 +1,31 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "custom-html",
+  "type": "registry:block",
+  "title": "Custom HTML",
+  "description": "HTML written by hand, such as a widget's embed code. Made safe unless you choose to use it exactly as written.",
+  "files": [
+    {
+      "path": "blocks/installed/custom-html/block.tsx",
+      "type": "registry:block",
+      "content": "import { classNameField, sanitizeHtml } from \"@goodfellow-cms/react\";\nimport type { ComponentConfig } from \"@puckeditor/core\";\nimport { HtmlPreview } from \"./html-preview\";\nimport { HtmlWithScripts } from \"./html-scripts\";\n\nexport interface CustomHtmlProps {\n  html: string;\n  sanitize: boolean;\n  className: string;\n}\n\n/**\n * HTML written by hand, such as a widget's embed code. It's made safe by\n * default: scripts, styles, frames, forms and inline styles are left out. Used\n * as it's written, it runs on the site, but in the editor only inside a\n * sandboxed frame, where it can't reach the admin panel. Its scripts run\n * whenever its page is shown, also after moving to it on a Next.js site.\n */\nconst CustomHtml: ComponentConfig<CustomHtmlProps> = {\n  label: \"Custom HTML\",\n  fields: {\n    html: { type: \"textarea\", label: \"HTML\" },\n    sanitize: {\n      type: \"radio\",\n      label: \"Make it safe\",\n      options: [\n        { label: \"Yes: leave out scripts, styles and frames\", value: true },\n        { label: \"No: use it exactly as written\", value: false },\n      ],\n    },\n    className: classNameField,\n  },\n  defaultProps: { html: \"<p>Your HTML goes here.</p>\", sanitize: true, className: \"\" },\n  render: ({ html, sanitize, className, puck }) => {\n    if (!sanitize && puck.isEditing) return <HtmlPreview html={html} className={className} />;\n    // Only HTML with scripts needs the browser's help, which loads React on the page.\n    if (!sanitize && /<script[\\s>]/i.test(html)) return <HtmlWithScripts html={html} className={className} />;\n    return (\n      <div\n        className={className || undefined}\n        // biome-ignore lint/security/noDangerouslySetInnerHtml: sanitized unless the editor chose to use it as written\n        dangerouslySetInnerHTML={{ __html: sanitize ? sanitizeHtml(html) : html }}\n      />\n    );\n  },\n};\n\nexport default CustomHtml;\n"
+    },
+    {
+      "path": "blocks/installed/custom-html/html-preview.tsx",
+      "type": "registry:component",
+      "content": "\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\n\n/** Tells the editor how tall the HTML is, so the frame fits it. */\nconst REPORT_HEIGHT =\n  \"<script>new ResizeObserver(function(){parent.postMessage({goodfellowHtmlHeight:document.documentElement.scrollHeight},'*')}).observe(document.documentElement)</script>\";\n\n/**\n * Shows HTML as it was written, in the editor only: inside a frame sandboxed\n * without `allow-same-origin`, so its scripts run on their own and can't reach\n * the admin panel or the editor's sign-in. It has the page's styles.\n */\nexport function HtmlPreview({ html, className }: { html: string; className: string }) {\n  const frame = useRef<HTMLIFrameElement>(null);\n  const [height, setHeight] = useState(120);\n  const [styles, setStyles] = useState(\"\");\n\n  useEffect(() => {\n    const document = frame.current?.ownerDocument;\n    const view = document?.defaultView;\n    if (!document || !view) return;\n    setStyles(\n      [...document.querySelectorAll('link[rel=\"stylesheet\"], style')].map((element) => element.outerHTML).join(\"\"),\n    );\n    const onMessage = (event: MessageEvent) => {\n      const reported = (event.data as { goodfellowHtmlHeight?: unknown } | null)?.goodfellowHtmlHeight;\n      if (event.source === frame.current?.contentWindow && typeof reported === \"number\") setHeight(Math.ceil(reported));\n    };\n    view.addEventListener(\"message\", onMessage);\n    return () => view.removeEventListener(\"message\", onMessage);\n  }, []);\n\n  return (\n    <iframe\n      ref={frame}\n      title=\"Custom HTML\"\n      sandbox=\"allow-scripts\"\n      srcDoc={`<!doctype html><html><head><meta charset=\"utf-8\">${styles}</head><body style=\"margin:0\">${html}${REPORT_HEIGHT}</body></html>`}\n      className={className || undefined}\n      style={{ display: \"block\", width: \"100%\", height, border: 0 }}\n    />\n  );\n}\n"
+    },
+    {
+      "path": "blocks/installed/custom-html/html-scripts.tsx",
+      "type": "registry:component",
+      "content": "\"use client\";\n\nimport { useEffect, useRef, useSyncExternalStore } from \"react\";\n\n/** Scripts that have already run, so a second pass (React's Strict Mode runs effects twice) doesn't run them again. */\nconst ran = new WeakSet<Element>();\n\nconst noSubscription = () => () => {};\n\n/** Runs a script that was put in the page as HTML, which browsers never run on their own. */\nfunction run(original: HTMLScriptElement): Promise<void> {\n  const script = document.createElement(\"script\");\n  for (const { name, value } of original.attributes) script.setAttribute(name, value);\n  script.text = original.text;\n  ran.add(script);\n  // An external script runs once it has loaded; the next one waits for it, as when the page is first opened.\n  const waits = Boolean(original.src) && !original.async && original.type !== \"module\";\n  const loaded = waits\n    ? new Promise<void>((resolve) => {\n        script.addEventListener(\"load\", () => resolve());\n        script.addEventListener(\"error\", () => resolve());\n      })\n    : Promise.resolve();\n  if (waits) script.async = false;\n  original.replaceWith(script);\n  return loaded;\n}\n\n/**\n * HTML with scripts, used as it was written. When the page is first opened\n * the browser runs its scripts; when it's shown without a new page load (moving\n * between pages on a Next.js site), this runs them, in order.\n */\nexport function HtmlWithScripts({ html, className }: { html: string; className: string }) {\n  const container = useRef<HTMLDivElement>(null);\n  // True when React takes over HTML the browser loaded with the page, whose scripts have already run.\n  const hydrating = useSyncExternalStore(\n    noSubscription,\n    () => false,\n    () => true,\n  );\n  const fromPage = useRef(hydrating);\n\n  // biome-ignore lint/correctness/useExhaustiveDependencies: runs the scripts again whenever the HTML changes\n  useEffect(() => {\n    const scripts = [...(container.current?.querySelectorAll(\"script\") ?? [])].filter((script) => !ran.has(script));\n    if (fromPage.current) {\n      fromPage.current = false;\n      for (const script of scripts) ran.add(script);\n      return;\n    }\n    let cancelled = false;\n    (async () => {\n      for (const script of scripts) {\n        if (cancelled) return;\n        await run(script);\n      }\n    })();\n    return () => {\n      cancelled = true;\n    };\n  }, [html]);\n\n  return (\n    <div\n      ref={container}\n      className={className || undefined}\n      // biome-ignore lint/security/noDangerouslySetInnerHtml: the editor chose to use this HTML as written\n      dangerouslySetInnerHTML={{ __html: html }}\n    />\n  );\n}\n"
+    }
+  ],
+  "meta": {
+    "goodfellow": {
+      "category": "Advanced",
+      "version": "0.2.0"
+    }
+  },
+  "dependencies": []
+}

package/r/registry.json

@@ -0,0 +1,364 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry.json",
+  "name": "goodfellow",
+  "homepage": "https://github.com/goodfellow-cms/goodfellow-cms",
+  "items": [
+    {
+      "name": "shadcn-hero",
+      "type": "registry:block",
+      "title": "Hero",
+      "description": "A large heading at the top of a page, with text, buttons and a picture.",
+      "registryDependencies": [
+        "@goodfellow/button"
+      ],
+      "files": [
+        {
+          "path": "blocks/installed/shadcn-hero/block.tsx",
+          "type": "registry:block"
+        }
+      ],
+      "meta": {
+        "goodfellow": {
+          "category": "Page sections",
+          "recommended": true,
+          "version": "0.2.0"
+        }
+      },
+      "dependencies": []
+    },
+    {
+      "name": "shadcn-cards",
+      "type": "registry:block",
+      "title": "Cards",
+      "description": "A grid of cards, each with a picture, a heading, text and a link.",
+      "registryDependencies": [
+        "@goodfellow/card",
+        "@goodfellow/button"
+      ],
+      "files": [
+        {
+          "path": "blocks/installed/shadcn-cards/block.tsx",
+          "type": "registry:block"
+        }
+      ],
+      "meta": {
+        "goodfellow": {
+          "category": "Page sections",
+          "recommended": true,
+          "version": "0.2.0"
+        }
+      },
+      "dependencies": []
+    },
+    {
+      "name": "shadcn-call-to-action",
+      "type": "registry:block",
+      "title": "Call to action",
+      "description": "A highlighted box asking visitors to do something, with a button.",
+      "registryDependencies": [
+        "@goodfellow/card",
+        "@goodfellow/button"
+      ],
+      "files": [
+        {
+          "path": "blocks/installed/shadcn-call-to-action/block.tsx",
+          "type": "registry:block"
+        }
+      ],
+      "meta": {
+        "goodfellow": {
+          "category": "Page sections",
+          "recommended": true,
+          "version": "0.2.0"
+        }
+      },
+      "dependencies": []
+    },
+    {
+      "name": "shadcn-testimonials",
+      "type": "registry:block",
+      "title": "Testimonials",
+      "description": "Quotes from people, with their names and photos.",
+      "registryDependencies": [
+        "@goodfellow/card"
+      ],
+      "files": [
+        {
+          "path": "blocks/installed/shadcn-testimonials/block.tsx",
+          "type": "registry:block"
+        }
+      ],
+      "meta": {
+        "goodfellow": {
+          "category": "Page sections",
+          "recommended": true,
+          "version": "0.2.0"
+        }
+      },
+      "dependencies": []
+    },
+    {
+      "name": "shadcn-pricing",
+      "type": "registry:block",
+      "title": "Pricing table",
+      "description": "Plans side by side, with prices, what each includes and a button.",
+      "registryDependencies": [
+        "@goodfellow/card",
+        "@goodfellow/badge",
+        "@goodfellow/button"
+      ],
+      "dependencies": [
+        "lucide-react"
+      ],
+      "files": [
+        {
+          "path": "blocks/installed/shadcn-pricing/block.tsx",
+          "type": "registry:block"
+        }
+      ],
+      "meta": {
+        "goodfellow": {
+          "category": "Page sections",
+          "version": "0.2.0"
+        }
+      }
+    },
+    {
+      "name": "shadcn-notice",
+      "type": "registry:block",
+      "title": "Notice",
+      "description": "A short message that stands out, such as a closure or a change of times.",
+      "registryDependencies": [
+        "@goodfellow/alert"
+      ],
+      "dependencies": [
+        "lucide-react"
+      ],
+      "files": [
+        {
+          "path": "blocks/installed/shadcn-notice/block.tsx",
+          "type": "registry:block"
+        }
+      ],
+      "meta": {
+        "goodfellow": {
+          "category": "Page sections",
+          "recommended": true,
+          "version": "0.2.0"
+        }
+      }
+    },
+    {
+      "name": "custom-html",
+      "type": "registry:block",
+      "title": "Custom HTML",
+      "description": "HTML written by hand, such as a widget's embed code. Made safe unless you choose to use it exactly as written.",
+      "files": [
+        {
+          "path": "blocks/installed/custom-html/block.tsx",
+          "type": "registry:block"
+        },
+        {
+          "path": "blocks/installed/custom-html/html-preview.tsx",
+          "type": "registry:component"
+        },
+        {
+          "path": "blocks/installed/custom-html/html-scripts.tsx",
+          "type": "registry:component"
+        }
+      ],
+      "meta": {
+        "goodfellow": {
+          "category": "Advanced",
+          "version": "0.2.0"
+        }
+      },
+      "dependencies": []
+    },
+    {
+      "name": "shadcn-faq",
+      "type": "registry:block",
+      "title": "FAQ",
+      "description": "Questions that open to show their answers.",
+      "registryDependencies": [
+        "@goodfellow/accordion"
+      ],
+      "files": [
+        {
+          "path": "blocks/installed/shadcn-faq/block.tsx",
+          "type": "registry:block"
+        },
+        {
+          "path": "blocks/installed/shadcn-faq/faq-list.tsx",
+          "type": "registry:component"
+        }
+      ],
+      "meta": {
+        "goodfellow": {
+          "category": "Interactive",
+          "recommended": true,
+          "version": "0.2.0"
+        }
+      },
+      "dependencies": []
+    },
+    {
+      "name": "shadcn-tabs",
+      "type": "registry:block",
+      "title": "Tabs",
+      "description": "Content split into tabs, one shown at a time.",
+      "registryDependencies": [
+        "@goodfellow/tabs"
+      ],
+      "files": [
+        {
+          "path": "blocks/installed/shadcn-tabs/block.tsx",
+          "type": "registry:block"
+        },
+        {
+          "path": "blocks/installed/shadcn-tabs/tabs-view.tsx",
+          "type": "registry:component"
+        }
+      ],
+      "meta": {
+        "goodfellow": {
+          "category": "Interactive",
+          "recommended": true,
+          "version": "0.2.0"
+        }
+      },
+      "dependencies": []
+    },
+    {
+      "name": "shadcn-carousel",
+      "type": "registry:block",
+      "title": "Image carousel",
+      "description": "Pictures shown one at a time, with buttons to move between them.",
+      "registryDependencies": [
+        "@goodfellow/carousel"
+      ],
+      "files": [
+        {
+          "path": "blocks/installed/shadcn-carousel/block.tsx",
+          "type": "registry:block"
+        },
+        {
+          "path": "blocks/installed/shadcn-carousel/image-carousel.tsx",
+          "type": "registry:component"
+        }
+      ],
+      "meta": {
+        "goodfellow": {
+          "category": "Interactive",
+          "version": "0.2.0"
+        }
+      },
+      "dependencies": []
+    },
+    {
+      "name": "accordion",
+      "type": "registry:ui",
+      "dependencies": [
+        "cn",
+        "radix-ui"
+      ],
+      "registryDependencies": [],
+      "files": [
+        {
+          "path": "components/ui/accordion.tsx",
+          "type": "registry:ui"
+        }
+      ]
+    },
+    {
+      "name": "alert",
+      "type": "registry:ui",
+      "dependencies": [
+        "cn"
+      ],
+      "registryDependencies": [],
+      "files": [
+        {
+          "path": "components/ui/alert.tsx",
+          "type": "registry:ui"
+        }
+      ]
+    },
+    {
+      "name": "badge",
+      "type": "registry:ui",
+      "dependencies": [
+        "cn",
+        "radix-ui"
+      ],
+      "registryDependencies": [],
+      "files": [
+        {
+          "path": "components/ui/badge.tsx",
+          "type": "registry:ui"
+        }
+      ]
+    },
+    {
+      "name": "button",
+      "type": "registry:ui",
+      "dependencies": [
+        "cn",
+        "radix-ui"
+      ],
+      "registryDependencies": [],
+      "files": [
+        {
+          "path": "components/ui/button.tsx",
+          "type": "registry:ui"
+        }
+      ]
+    },
+    {
+      "name": "card",
+      "type": "registry:ui",
+      "dependencies": [
+        "cn"
+      ],
+      "registryDependencies": [],
+      "files": [
+        {
+          "path": "components/ui/card.tsx",
+          "type": "registry:ui"
+        }
+      ]
+    },
+    {
+      "name": "carousel",
+      "type": "registry:ui",
+      "dependencies": [
+        "cn",
+        "embla-carousel-react"
+      ],
+      "registryDependencies": [
+        "@goodfellow/button"
+      ],
+      "files": [
+        {
+          "path": "components/ui/carousel.tsx",
+          "type": "registry:ui"
+        }
+      ]
+    },
+    {
+      "name": "tabs",
+      "type": "registry:ui",
+      "dependencies": [
+        "cn",
+        "radix-ui"
+      ],
+      "registryDependencies": [],
+      "files": [
+        {
+          "path": "components/ui/tabs.tsx",
+          "type": "registry:ui"
+        }
+      ]
+    }
+  ]
+}

package/r/shadcn-call-to-action.json

@@ -0,0 +1,26 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "shadcn-call-to-action",
+  "type": "registry:block",
+  "title": "Call to action",
+  "description": "A highlighted box asking visitors to do something, with a button.",
+  "registryDependencies": [
+    "@goodfellow/card",
+    "@goodfellow/button"
+  ],
+  "files": [
+    {
+      "path": "blocks/installed/shadcn-call-to-action/block.tsx",
+      "type": "registry:block",
+      "content": "import { classNameField, cx, SiteLink } from \"@goodfellow-cms/react\";\nimport type { ComponentConfig } from \"@puckeditor/core\";\nimport { buttonVariants } from \"@/components/ui/button\";\nimport { Card, CardContent } from \"@/components/ui/card\";\n\ntype Style = \"highlight\" | \"subtle\";\n\nexport interface CallToActionProps {\n  title: string;\n  text: string;\n  buttonLabel: string;\n  buttonLink: string;\n  style: Style;\n  className: string;\n}\n\n/** A highlighted box asking visitors to do something, with a button. */\nconst CallToAction: ComponentConfig<CallToActionProps> = {\n  label: \"Call to action\",\n  fields: {\n    title: { type: \"text\", label: \"Heading\", contentEditable: true },\n    text: { type: \"textarea\", label: \"Text\", contentEditable: true },\n    buttonLabel: { type: \"text\", label: \"Button\" },\n    buttonLink: { type: \"text\", label: \"Button links to\" },\n    style: {\n      type: \"radio\",\n      label: \"Style\",\n      options: [\n        { label: \"In the main color\", value: \"highlight\" },\n        { label: \"Subtle\", value: \"subtle\" },\n      ],\n    },\n    className: classNameField,\n  },\n  defaultProps: {\n    title: \"Ready to get started?\",\n    text: \"Tell visitors what to do next.\",\n    buttonLabel: \"Get in touch\",\n    buttonLink: \"/contact\",\n    style: \"highlight\",\n    className: \"\",\n  },\n  render: ({ title, text, buttonLabel, buttonLink, style, className }) => {\n    const highlight = style === \"highlight\";\n    return (\n      <section className={cx(\"mx-auto w-full max-w-5xl px-4 py-12\", className)}>\n        <Card className={cx(\"border-0\", highlight ? \"bg-primary text-primary-foreground\" : \"bg-muted\")}>\n          <CardContent className=\"flex flex-col items-start gap-6 p-8 md:flex-row md:items-center md:justify-between md:p-12\">\n            <div className=\"flex flex-col gap-2\">\n              <h2 className=\"text-2xl font-bold tracking-tight md:text-3xl\">{title}</h2>\n              {text && <p className={cx(\"text-lg\", highlight ? \"opacity-90\" : \"text-muted-foreground\")}>{text}</p>}\n            </div>\n            {buttonLabel && (\n              <SiteLink\n                href={buttonLink || \"/\"}\n                className={buttonVariants({ size: \"lg\", variant: highlight ? \"secondary\" : \"default\" })}\n              >\n                {buttonLabel}\n              </SiteLink>\n            )}\n          </CardContent>\n        </Card>\n      </section>\n    );\n  },\n};\n\nexport default CallToAction;\n"
+    }
+  ],
+  "meta": {
+    "goodfellow": {
+      "category": "Page sections",
+      "recommended": true,
+      "version": "0.2.0"
+    }
+  },
+  "dependencies": []
+}

package/r/shadcn-cards.json

@@ -0,0 +1,26 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "shadcn-cards",
+  "type": "registry:block",
+  "title": "Cards",
+  "description": "A grid of cards, each with a picture, a heading, text and a link.",
+  "registryDependencies": [
+    "@goodfellow/card",
+    "@goodfellow/button"
+  ],
+  "files": [
+    {
+      "path": "blocks/installed/shadcn-cards/block.tsx",
+      "type": "registry:block",
+      "content": "import { classNameField, cx, mediaField, SiteImage, SiteLink } from \"@goodfellow-cms/react\";\nimport type { ComponentConfig } from \"@puckeditor/core\";\nimport { buttonVariants } from \"@/components/ui/button\";\nimport { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from \"@/components/ui/card\";\n\ntype Columns = \"2\" | \"3\" | \"4\";\n\ninterface CardItem {\n  title: string;\n  text: string;\n  image: string;\n  imageAlt: string;\n  linkLabel: string;\n  link: string;\n}\n\nexport interface CardsProps {\n  title: string;\n  intro: string;\n  columns: Columns;\n  cards: CardItem[];\n  className: string;\n}\n\nconst columnClasses: Record<Columns, string> = {\n  \"2\": \"sm:grid-cols-2\",\n  \"3\": \"sm:grid-cols-2 lg:grid-cols-3\",\n  \"4\": \"sm:grid-cols-2 lg:grid-cols-4\",\n};\n\n/** A grid of cards, each with a picture, a heading, text and a link. */\nconst Cards: ComponentConfig<CardsProps> = {\n  label: \"Cards\",\n  fields: {\n    title: { type: \"text\", label: \"Heading\" },\n    intro: { type: \"textarea\", label: \"Introduction\" },\n    columns: {\n      type: \"radio\",\n      label: \"Cards in a row\",\n      options: [\n        { label: \"2\", value: \"2\" },\n        { label: \"3\", value: \"3\" },\n        { label: \"4\", value: \"4\" },\n      ],\n    },\n    cards: {\n      type: \"array\",\n      label: \"Cards\",\n      arrayFields: {\n        title: { type: \"text\", label: \"Heading\" },\n        text: { type: \"textarea\", label: \"Text\" },\n        image: mediaField(\"Picture\"),\n        imageAlt: { type: \"text\", label: \"Description of the picture for screen readers\" },\n        linkLabel: { type: \"text\", label: \"Link text\" },\n        link: { type: \"text\", label: \"Links to\" },\n      },\n      defaultItemProps: {\n        title: \"A card\",\n        text: \"Say something about it.\",\n        image: \"\",\n        imageAlt: \"\",\n        linkLabel: \"\",\n        link: \"\",\n      },\n      getItemSummary: (card) => card.title || \"Card\",\n    },\n    className: classNameField,\n  },\n  defaultProps: {\n    title: \"\",\n    intro: \"\",\n    columns: \"3\",\n    cards: [\n      { title: \"First\", text: \"Say something about it.\", image: \"\", imageAlt: \"\", linkLabel: \"\", link: \"\" },\n      { title: \"Second\", text: \"Say something about it.\", image: \"\", imageAlt: \"\", linkLabel: \"\", link: \"\" },\n      { title: \"Third\", text: \"Say something about it.\", image: \"\", imageAlt: \"\", linkLabel: \"\", link: \"\" },\n    ],\n    className: \"\",\n  },\n  render: ({ title, intro, columns, cards, className }) => (\n    <section className={cx(\"mx-auto w-full max-w-6xl px-4 py-12\", className)}>\n      {(title || intro) && (\n        <div className=\"mb-8 flex max-w-3xl flex-col gap-3\">\n          {title && <h2 className=\"text-3xl font-bold tracking-tight\">{title}</h2>}\n          {intro && <p className=\"text-lg text-muted-foreground\">{intro}</p>}\n        </div>\n      )}\n      <div className={cx(\"grid gap-6\", columnClasses[columns])}>\n        {cards.map((card, index) => (\n          // Cards have no ids of their own, and their order is all that tells them apart.\n          // biome-ignore lint/suspicious/noArrayIndexKey: see above\n          <Card key={index} className=\"overflow-hidden pt-0\">\n            {card.image ? (\n              <SiteImage src={card.image} alt={card.imageAlt} className=\"aspect-video w-full object-cover\" />\n            ) : (\n              <div className=\"h-0\" />\n            )}\n            <CardHeader>\n              <CardTitle className=\"text-xl\">{card.title}</CardTitle>\n              {card.text && <CardDescription className=\"text-base\">{card.text}</CardDescription>}\n            </CardHeader>\n            <CardContent className=\"flex-1\" />\n            {card.linkLabel && (\n              <CardFooter>\n                <SiteLink href={card.link || \"/\"} className={buttonVariants({ variant: \"outline\" })}>\n                  {card.linkLabel}\n                </SiteLink>\n              </CardFooter>\n            )}\n          </Card>\n        ))}\n      </div>\n    </section>\n  ),\n};\n\nexport default Cards;\n"
+    }
+  ],
+  "meta": {
+    "goodfellow": {
+      "category": "Page sections",
+      "recommended": true,
+      "version": "0.2.0"
+    }
+  },
+  "dependencies": []
+}

package/r/shadcn-carousel.json

@@ -0,0 +1,29 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "shadcn-carousel",
+  "type": "registry:block",
+  "title": "Image carousel",
+  "description": "Pictures shown one at a time, with buttons to move between them.",
+  "registryDependencies": [
+    "@goodfellow/carousel"
+  ],
+  "files": [
+    {
+      "path": "blocks/installed/shadcn-carousel/block.tsx",
+      "type": "registry:block",
+      "content": "import { classNameField, cx, mediaField } from \"@goodfellow-cms/react\";\nimport type { ComponentConfig } from \"@puckeditor/core\";\nimport { ImageCarousel } from \"./image-carousel\";\n\ninterface Slide {\n  image: string;\n  alt: string;\n  caption: string;\n}\n\nexport interface CarouselProps {\n  slides: Slide[];\n  loop: boolean;\n  className: string;\n}\n\n/** Pictures shown one at a time, with buttons to move between them. */\nconst Carousel: ComponentConfig<CarouselProps> = {\n  label: \"Image carousel\",\n  fields: {\n    slides: {\n      type: \"array\",\n      label: \"Pictures\",\n      arrayFields: {\n        image: mediaField(\"Picture\"),\n        alt: { type: \"text\", label: \"Description for screen readers\" },\n        caption: { type: \"text\", label: \"Caption\" },\n      },\n      defaultItemProps: { image: \"\", alt: \"\", caption: \"\" },\n      getItemSummary: (slide, index) => slide.caption || slide.alt || `Picture ${(index ?? 0) + 1}`,\n    },\n    loop: {\n      type: \"radio\",\n      label: \"Start again after the last picture\",\n      options: [\n        { label: \"Yes\", value: true },\n        { label: \"No\", value: false },\n      ],\n    },\n    className: classNameField,\n  },\n  defaultProps: { slides: [], loop: true, className: \"\" },\n  render: ({ slides, loop, className }) => (\n    <section className={cx(\"mx-auto w-full max-w-4xl px-14 py-8\", className)}>\n      {slides.length > 0 ? (\n        <ImageCarousel slides={slides.filter((slide) => slide.image)} loop={loop} />\n      ) : (\n        <div className=\"aspect-video w-full rounded-xl bg-muted\" />\n      )}\n    </section>\n  ),\n};\n\nexport default Carousel;\n"
+    },
+    {
+      "path": "blocks/installed/shadcn-carousel/image-carousel.tsx",
+      "type": "registry:component",
+      "content": "\"use client\";\n\nimport { SiteImage } from \"@goodfellow-cms/react\";\nimport { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from \"@/components/ui/carousel\";\n\n/** The pictures, one at a time, with previous and next buttons. */\nexport function ImageCarousel({\n  slides,\n  loop,\n}: {\n  slides: Array<{ image: string; alt: string; caption: string }>;\n  loop: boolean;\n}) {\n  return (\n    <Carousel opts={{ loop }}>\n      <CarouselContent>\n        {slides.map((slide, index) => (\n          // biome-ignore lint/suspicious/noArrayIndexKey: pictures have no ids of their own\n          <CarouselItem key={index}>\n            <figure>\n              <SiteImage src={slide.image} alt={slide.alt} className=\"aspect-video w-full rounded-xl object-cover\" />\n              {slide.caption && (\n                <figcaption className=\"mt-2 text-center text-sm text-muted-foreground\">{slide.caption}</figcaption>\n              )}\n            </figure>\n          </CarouselItem>\n        ))}\n      </CarouselContent>\n      <CarouselPrevious />\n      <CarouselNext />\n    </Carousel>\n  );\n}\n"
+    }
+  ],
+  "meta": {
+    "goodfellow": {
+      "category": "Interactive",
+      "version": "0.2.0"
+    }
+  },
+  "dependencies": []
+}

package/r/shadcn-faq.json

@@ -0,0 +1,30 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "shadcn-faq",
+  "type": "registry:block",
+  "title": "FAQ",
+  "description": "Questions that open to show their answers.",
+  "registryDependencies": [
+    "@goodfellow/accordion"
+  ],
+  "files": [
+    {
+      "path": "blocks/installed/shadcn-faq/block.tsx",
+      "type": "registry:block",
+      "content": "import { classNameField, cx } from \"@goodfellow-cms/react\";\nimport type { ComponentConfig, RichText } from \"@puckeditor/core\";\nimport { FaqList } from \"./faq-list\";\n\ninterface Question {\n  question: string;\n  answer: RichText;\n}\n\nexport interface FaqProps {\n  title: string;\n  questions: Question[];\n  className: string;\n}\n\n/** Questions that open to show their answers. Every answer is in the page, so search engines see them. */\nconst Faq: ComponentConfig<FaqProps> = {\n  label: \"FAQ\",\n  fields: {\n    title: { type: \"text\", label: \"Heading\" },\n    questions: {\n      type: \"array\",\n      label: \"Questions\",\n      arrayFields: {\n        question: { type: \"text\", label: \"Question\" },\n        answer: { type: \"richtext\", label: \"Answer\" },\n      },\n      defaultItemProps: { question: \"A question\", answer: \"<p>Its answer.</p>\" },\n      getItemSummary: (item) => item.question || \"Question\",\n    },\n    className: classNameField,\n  },\n  defaultProps: {\n    title: \"Questions and answers\",\n    questions: [\n      { question: \"A question people ask\", answer: \"<p>Its answer.</p>\" },\n      { question: \"Another question\", answer: \"<p>Its answer.</p>\" },\n    ],\n    className: \"\",\n  },\n  render: ({ title, questions, className }) => (\n    <section className={cx(\"mx-auto w-full max-w-3xl px-4 py-12\", className)}>\n      {title && <h2 className=\"mb-6 text-3xl font-bold tracking-tight\">{title}</h2>}\n      <FaqList questions={questions.map(({ question, answer }) => ({ question, answer }))} />\n    </section>\n  ),\n};\n\nexport default Faq;\n"
+    },
+    {
+      "path": "blocks/installed/shadcn-faq/faq-list.tsx",
+      "type": "registry:component",
+      "content": "\"use client\";\n\nimport type { ReactNode } from \"react\";\nimport { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from \"@/components/ui/accordion\";\n\n/** The questions, one open at a time. Closed answers stay in the page, hidden, rather than being left out. */\nexport function FaqList({ questions }: { questions: Array<{ question: string; answer: ReactNode }> }) {\n  return (\n    <Accordion type=\"single\" collapsible className=\"w-full\">\n      {questions.map((item, index) => (\n        <AccordionItem\n          // biome-ignore lint/suspicious/noArrayIndexKey: questions have no ids of their own\n          key={index}\n          value={`question-${index}`}\n          className=\"[&>[data-slot=accordion-content][data-state=closed]]:hidden\"\n        >\n          <AccordionTrigger className=\"text-base\">{item.question}</AccordionTrigger>\n          <AccordionContent forceMount>\n            <div className=\"gf-prose\">{item.answer}</div>\n          </AccordionContent>\n        </AccordionItem>\n      ))}\n    </Accordion>\n  );\n}\n"
+    }
+  ],
+  "meta": {
+    "goodfellow": {
+      "category": "Interactive",
+      "recommended": true,
+      "version": "0.2.0"
+    }
+  },
+  "dependencies": []
+}

package/r/shadcn-hero.json

@@ -0,0 +1,25 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "shadcn-hero",
+  "type": "registry:block",
+  "title": "Hero",
+  "description": "A large heading at the top of a page, with text, buttons and a picture.",
+  "registryDependencies": [
+    "@goodfellow/button"
+  ],
+  "files": [
+    {
+      "path": "blocks/installed/shadcn-hero/block.tsx",
+      "type": "registry:block",
+      "content": "import { classNameField, cx, mediaField, SiteImage, SiteLink } from \"@goodfellow-cms/react\";\nimport type { ComponentConfig } from \"@puckeditor/core\";\nimport { buttonVariants } from \"@/components/ui/button\";\n\ntype Layout = \"centered\" | \"beside\";\n\nexport interface HeroProps {\n  title: string;\n  text: string;\n  image: string;\n  imageAlt: string;\n  layout: Layout;\n  primaryLabel: string;\n  primaryLink: string;\n  secondaryLabel: string;\n  secondaryLink: string;\n  className: string;\n}\n\n/** A large heading at the top of a page, with text, up to two buttons and a picture. */\nconst Hero: ComponentConfig<HeroProps> = {\n  label: \"Hero\",\n  fields: {\n    title: { type: \"text\", label: \"Heading\", contentEditable: true },\n    text: { type: \"textarea\", label: \"Text\", contentEditable: true },\n    image: mediaField(\"Picture\"),\n    imageAlt: { type: \"text\", label: \"Description of the picture for screen readers\" },\n    layout: {\n      type: \"radio\",\n      label: \"Layout\",\n      options: [\n        { label: \"Centered, picture below\", value: \"centered\" },\n        { label: \"Picture beside the text\", value: \"beside\" },\n      ],\n    },\n    primaryLabel: { type: \"text\", label: \"Main button\" },\n    primaryLink: { type: \"text\", label: \"Main button links to\" },\n    secondaryLabel: { type: \"text\", label: \"Second button (optional)\" },\n    secondaryLink: { type: \"text\", label: \"Second button links to\" },\n    className: classNameField,\n  },\n  defaultProps: {\n    title: \"Welcome\",\n    text: \"Say in a sentence or two what this site is about.\",\n    image: \"\",\n    imageAlt: \"\",\n    layout: \"centered\",\n    primaryLabel: \"Find out more\",\n    primaryLink: \"/about\",\n    secondaryLabel: \"\",\n    secondaryLink: \"\",\n    className: \"\",\n  },\n  render: ({\n    title,\n    text,\n    image,\n    imageAlt,\n    layout,\n    primaryLabel,\n    primaryLink,\n    secondaryLabel,\n    secondaryLink,\n    className,\n  }) => {\n    const beside = layout === \"beside\";\n    return (\n      <section className={cx(\"mx-auto w-full max-w-6xl px-4 py-16 md:py-24\", className)}>\n        <div\n          className={cx(\"flex flex-col gap-10\", beside ? \"md:flex-row md:items-center\" : \"items-center text-center\")}\n        >\n          <div className={cx(\"flex flex-col gap-6\", beside ? \"md:flex-1\" : \"max-w-3xl items-center\")}>\n            <h1 className=\"text-4xl font-bold tracking-tight text-balance md:text-6xl\">{title}</h1>\n            {text && <p className=\"text-lg text-muted-foreground md:text-xl\">{text}</p>}\n            {(primaryLabel || secondaryLabel) && (\n              <div className=\"flex flex-wrap gap-3\">\n                {primaryLabel && (\n                  <SiteLink href={primaryLink || \"/\"} className={buttonVariants({ size: \"lg\" })}>\n                    {primaryLabel}\n                  </SiteLink>\n                )}\n                {secondaryLabel && (\n                  <SiteLink href={secondaryLink || \"/\"} className={buttonVariants({ size: \"lg\", variant: \"outline\" })}>\n                    {secondaryLabel}\n                  </SiteLink>\n                )}\n              </div>\n            )}\n          </div>\n          {image && (\n            <SiteImage\n              src={image}\n              alt={imageAlt}\n              className={cx(\"w-full rounded-xl object-cover\", beside ? \"md:w-1/2\" : \"max-w-4xl\")}\n            />\n          )}\n        </div>\n      </section>\n    );\n  },\n};\n\nexport default Hero;\n"
+    }
+  ],
+  "meta": {
+    "goodfellow": {
+      "category": "Page sections",
+      "recommended": true,
+      "version": "0.2.0"
+    }
+  },
+  "dependencies": []
+}

package/r/shadcn-notice.json

@@ -0,0 +1,27 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "shadcn-notice",
+  "type": "registry:block",
+  "title": "Notice",
+  "description": "A short message that stands out, such as a closure or a change of times.",
+  "registryDependencies": [
+    "@goodfellow/alert"
+  ],
+  "dependencies": [
+    "lucide-react"
+  ],
+  "files": [
+    {
+      "path": "blocks/installed/shadcn-notice/block.tsx",
+      "type": "registry:block",
+      "content": "import { classNameField, cx } from \"@goodfellow-cms/react\";\nimport type { ComponentConfig, RichText } from \"@puckeditor/core\";\nimport { CircleCheckIcon, InfoIcon, TriangleAlertIcon } from \"lucide-react\";\nimport { Alert, AlertDescription, AlertTitle } from \"@/components/ui/alert\";\n\ntype Kind = \"info\" | \"warning\" | \"success\" | \"urgent\";\n\nexport interface NoticeProps {\n  kind: Kind;\n  title: string;\n  text: RichText;\n  className: string;\n}\n\nconst icons = { info: InfoIcon, warning: TriangleAlertIcon, success: CircleCheckIcon, urgent: TriangleAlertIcon };\n\n/** A short message that stands out, such as a closure or a change of times. */\nconst Notice: ComponentConfig<NoticeProps> = {\n  label: \"Notice\",\n  fields: {\n    kind: {\n      type: \"select\",\n      label: \"Kind\",\n      options: [\n        { label: \"Information\", value: \"info\" },\n        { label: \"Warning\", value: \"warning\" },\n        { label: \"Good news\", value: \"success\" },\n        { label: \"Urgent\", value: \"urgent\" },\n      ],\n    },\n    title: { type: \"text\", label: \"Heading\", contentEditable: true },\n    text: { type: \"richtext\", label: \"Text\", contentEditable: true },\n    className: classNameField,\n  },\n  defaultProps: { kind: \"info\", title: \"Please note\", text: \"<p>Say what's changed.</p>\", className: \"\" },\n  render: ({ kind, title, text, className }) => {\n    const Icon = icons[kind];\n    return (\n      <div className={cx(\"mx-auto w-full max-w-3xl px-4 py-4\", className)}>\n        <Alert variant={kind === \"urgent\" ? \"destructive\" : \"default\"}>\n          <Icon aria-hidden=\"true\" />\n          {title && <AlertTitle>{title}</AlertTitle>}\n          <AlertDescription>\n            <div className=\"gf-prose\">{text}</div>\n          </AlertDescription>\n        </Alert>\n      </div>\n    );\n  },\n};\n\nexport default Notice;\n"
+    }
+  ],
+  "meta": {
+    "goodfellow": {
+      "category": "Page sections",
+      "recommended": true,
+      "version": "0.2.0"
+    }
+  }
+}

package/r/shadcn-pricing.json

@@ -0,0 +1,28 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "shadcn-pricing",
+  "type": "registry:block",
+  "title": "Pricing table",
+  "description": "Plans side by side, with prices, what each includes and a button.",
+  "registryDependencies": [
+    "@goodfellow/card",
+    "@goodfellow/badge",
+    "@goodfellow/button"
+  ],
+  "dependencies": [
+    "lucide-react"
+  ],
+  "files": [
+    {
+      "path": "blocks/installed/shadcn-pricing/block.tsx",
+      "type": "registry:block",
+      "content": "import { classNameField, cx, SiteLink } from \"@goodfellow-cms/react\";\nimport type { ComponentConfig } from \"@puckeditor/core\";\nimport { CheckIcon } from \"lucide-react\";\nimport { Badge } from \"@/components/ui/badge\";\nimport { buttonVariants } from \"@/components/ui/button\";\nimport { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from \"@/components/ui/card\";\n\ninterface Plan {\n  name: string;\n  price: string;\n  period: string;\n  description: string;\n  features: string;\n  buttonLabel: string;\n  buttonLink: string;\n  badge: string;\n}\n\nexport interface PricingProps {\n  title: string;\n  intro: string;\n  plans: Plan[];\n  className: string;\n}\n\nconst emptyPlan: Plan = {\n  name: \"Plan\",\n  price: \"$10\",\n  period: \"a month\",\n  description: \"\",\n  features: \"Something included\\nSomething else included\",\n  buttonLabel: \"Choose\",\n  buttonLink: \"/contact\",\n  badge: \"\",\n};\n\n/** Plans side by side, with prices, what each includes and a button. */\nconst Pricing: ComponentConfig<PricingProps> = {\n  label: \"Pricing table\",\n  fields: {\n    title: { type: \"text\", label: \"Heading\" },\n    intro: { type: \"textarea\", label: \"Introduction\" },\n    plans: {\n      type: \"array\",\n      label: \"Plans\",\n      arrayFields: {\n        name: { type: \"text\", label: \"Name\" },\n        price: { type: \"text\", label: \"Price, such as $10\" },\n        period: { type: \"text\", label: \"Per, such as a month\" },\n        description: { type: \"textarea\", label: \"Description\" },\n        features: { type: \"textarea\", label: \"What's included, one per line\" },\n        buttonLabel: { type: \"text\", label: \"Button\" },\n        buttonLink: { type: \"text\", label: \"Button links to\" },\n        badge: { type: \"text\", label: \"Label at the top, such as Most popular (optional)\" },\n      },\n      defaultItemProps: emptyPlan,\n      getItemSummary: (plan) => plan.name || \"Plan\",\n    },\n    className: classNameField,\n  },\n  defaultProps: {\n    title: \"Prices\",\n    intro: \"\",\n    plans: [\n      { ...emptyPlan, name: \"Basic\" },\n      { ...emptyPlan, name: \"Standard\", price: \"$25\", badge: \"Most popular\" },\n      { ...emptyPlan, name: \"Premium\", price: \"$50\" },\n    ],\n    className: \"\",\n  },\n  render: ({ title, intro, plans, className }) => (\n    <section className={cx(\"mx-auto w-full max-w-6xl px-4 py-12\", className)}>\n      {(title || intro) && (\n        <div className=\"mb-8 flex flex-col items-center gap-3 text-center\">\n          {title && <h2 className=\"text-3xl font-bold tracking-tight\">{title}</h2>}\n          {intro && <p className=\"max-w-2xl text-lg text-muted-foreground\">{intro}</p>}\n        </div>\n      )}\n      <div className=\"grid gap-6 md:grid-cols-2 lg:grid-cols-3\">\n        {plans.map((plan, index) => (\n          // biome-ignore lint/suspicious/noArrayIndexKey: plans have no ids of their own\n          <Card key={index} className={cx(plan.badge && \"border-primary border-2\")}>\n            <CardHeader>\n              <div className=\"flex items-center justify-between gap-2\">\n                <CardTitle className=\"text-xl\">{plan.name}</CardTitle>\n                {plan.badge && <Badge>{plan.badge}</Badge>}\n              </div>\n              {plan.description && <CardDescription>{plan.description}</CardDescription>}\n            </CardHeader>\n            <CardContent className=\"flex flex-1 flex-col gap-6\">\n              <p>\n                <span className=\"text-4xl font-bold\">{plan.price}</span>\n                {plan.period && <span className=\"text-muted-foreground\"> {plan.period}</span>}\n              </p>\n              <ul className=\"flex flex-col gap-2\">\n                {plan.features\n                  .split(\"\\n\")\n                  .map((feature) => feature.trim())\n                  .filter(Boolean)\n                  .map((feature) => (\n                    <li key={feature} className=\"flex items-start gap-2\">\n                      <CheckIcon aria-hidden=\"true\" className=\"mt-0.5 size-4 shrink-0 text-primary\" />\n                      {feature}\n                    </li>\n                  ))}\n              </ul>\n            </CardContent>\n            {plan.buttonLabel && (\n              <CardFooter>\n                <SiteLink\n                  href={plan.buttonLink || \"/\"}\n                  className={cx(buttonVariants({ variant: plan.badge ? \"default\" : \"outline\" }), \"w-full\")}\n                >\n                  {plan.buttonLabel}\n                </SiteLink>\n              </CardFooter>\n            )}\n          </Card>\n        ))}\n      </div>\n    </section>\n  ),\n};\n\nexport default Pricing;\n"
+    }
+  ],
+  "meta": {
+    "goodfellow": {
+      "category": "Page sections",
+      "version": "0.2.0"
+    }
+  }
+}

package/r/shadcn-tabs.json

@@ -0,0 +1,30 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "shadcn-tabs",
+  "type": "registry:block",
+  "title": "Tabs",
+  "description": "Content split into tabs, one shown at a time.",
+  "registryDependencies": [
+    "@goodfellow/tabs"
+  ],
+  "files": [
+    {
+      "path": "blocks/installed/shadcn-tabs/block.tsx",
+      "type": "registry:block",
+      "content": "import { classNameField, cx } from \"@goodfellow-cms/react\";\nimport type { ComponentConfig, RichText } from \"@puckeditor/core\";\nimport { TabsView } from \"./tabs-view\";\n\ninterface Tab {\n  label: string;\n  content: RichText;\n}\n\nexport interface TabsProps {\n  tabs: Tab[];\n  className: string;\n}\n\n/** Content split into tabs, one shown at a time. Every tab's content is in the page, so search engines see it. */\nconst Tabs: ComponentConfig<TabsProps> = {\n  label: \"Tabs\",\n  fields: {\n    tabs: {\n      type: \"array\",\n      label: \"Tabs\",\n      arrayFields: {\n        label: { type: \"text\", label: \"Tab name\" },\n        content: { type: \"richtext\", label: \"Content\" },\n      },\n      defaultItemProps: { label: \"Tab\", content: \"<p>What this tab shows.</p>\" },\n      getItemSummary: (tab) => tab.label || \"Tab\",\n    },\n    className: classNameField,\n  },\n  defaultProps: {\n    tabs: [\n      { label: \"First\", content: \"<p>What the first tab shows.</p>\" },\n      { label: \"Second\", content: \"<p>What the second tab shows.</p>\" },\n    ],\n    className: \"\",\n  },\n  render: ({ tabs, className }) => (\n    <section className={cx(\"mx-auto w-full max-w-4xl px-4 py-8\", className)}>\n      <TabsView tabs={tabs.map(({ label, content }) => ({ label, content }))} />\n    </section>\n  ),\n};\n\nexport default Tabs;\n"
+    },
+    {
+      "path": "blocks/installed/shadcn-tabs/tabs-view.tsx",
+      "type": "registry:component",
+      "content": "\"use client\";\n\nimport type { ReactNode } from \"react\";\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from \"@/components/ui/tabs\";\n\n/** The tabs, with every tab's content in the page and the others hidden. */\nexport function TabsView({ tabs }: { tabs: Array<{ label: string; content: ReactNode }> }) {\n  if (tabs.length === 0) return null;\n  return (\n    <Tabs defaultValue=\"tab-0\">\n      <TabsList className=\"flex-wrap\">\n        {tabs.map((tab, index) => (\n          // biome-ignore lint/suspicious/noArrayIndexKey: tabs have no ids of their own\n          <TabsTrigger key={index} value={`tab-${index}`}>\n            {tab.label}\n          </TabsTrigger>\n        ))}\n      </TabsList>\n      {tabs.map((tab, index) => (\n        // biome-ignore lint/suspicious/noArrayIndexKey: tabs have no ids of their own\n        <TabsContent key={index} value={`tab-${index}`} forceMount className=\"pt-4 data-[state=inactive]:hidden\">\n          <div className=\"gf-prose\">{tab.content}</div>\n        </TabsContent>\n      ))}\n    </Tabs>\n  );\n}\n"
+    }
+  ],
+  "meta": {
+    "goodfellow": {
+      "category": "Interactive",
+      "recommended": true,
+      "version": "0.2.0"
+    }
+  },
+  "dependencies": []
+}

package/r/shadcn-testimonials.json

@@ -0,0 +1,25 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "shadcn-testimonials",
+  "type": "registry:block",
+  "title": "Testimonials",
+  "description": "Quotes from people, with their names and photos.",
+  "registryDependencies": [
+    "@goodfellow/card"
+  ],
+  "files": [
+    {
+      "path": "blocks/installed/shadcn-testimonials/block.tsx",
+      "type": "registry:block",
+      "content": "import { classNameField, cx, mediaField, SiteImage } from \"@goodfellow-cms/react\";\nimport type { ComponentConfig } from \"@puckeditor/core\";\nimport { Card, CardContent, CardFooter } from \"@/components/ui/card\";\n\ninterface Testimonial {\n  quote: string;\n  name: string;\n  role: string;\n  photo: string;\n}\n\nexport interface TestimonialsProps {\n  title: string;\n  testimonials: Testimonial[];\n  className: string;\n}\n\n/** Quotes from people, with their names and photos. */\nconst Testimonials: ComponentConfig<TestimonialsProps> = {\n  label: \"Testimonials\",\n  fields: {\n    title: { type: \"text\", label: \"Heading\" },\n    testimonials: {\n      type: \"array\",\n      label: \"Quotes\",\n      arrayFields: {\n        quote: { type: \"textarea\", label: \"What they said\" },\n        name: { type: \"text\", label: \"Name\" },\n        role: { type: \"text\", label: \"Who they are, such as a member since 2020\" },\n        photo: mediaField(\"Photo\"),\n      },\n      defaultItemProps: { quote: \"Something kind they said.\", name: \"A name\", role: \"\", photo: \"\" },\n      getItemSummary: (item) => item.name || \"Quote\",\n    },\n    className: classNameField,\n  },\n  defaultProps: {\n    title: \"What people say\",\n    testimonials: [\n      { quote: \"Something kind they said.\", name: \"A name\", role: \"\", photo: \"\" },\n      { quote: \"Something else kind they said.\", name: \"Another name\", role: \"\", photo: \"\" },\n    ],\n    className: \"\",\n  },\n  render: ({ title, testimonials, className }) => (\n    <section className={cx(\"mx-auto w-full max-w-6xl px-4 py-12\", className)}>\n      {title && <h2 className=\"mb-8 text-3xl font-bold tracking-tight\">{title}</h2>}\n      <div className=\"grid gap-6 md:grid-cols-2 lg:grid-cols-3\">\n        {testimonials.map((item, index) => (\n          // biome-ignore lint/suspicious/noArrayIndexKey: quotes have no ids of their own\n          <Card key={index}>\n            <CardContent className=\"flex-1\">\n              <blockquote className=\"text-lg leading-relaxed\">“{item.quote}”</blockquote>\n            </CardContent>\n            <CardFooter className=\"gap-3\">\n              {item.photo && (\n                <SiteImage src={item.photo} alt=\"\" className=\"size-10 shrink-0 rounded-full object-cover\" />\n              )}\n              <div className=\"flex flex-col\">\n                <span className=\"font-semibold\">{item.name}</span>\n                {item.role && <span className=\"text-sm text-muted-foreground\">{item.role}</span>}\n              </div>\n            </CardFooter>\n          </Card>\n        ))}\n      </div>\n    </section>\n  ),\n};\n\nexport default Testimonials;\n"
+    }
+  ],
+  "meta": {
+    "goodfellow": {
+      "category": "Page sections",
+      "recommended": true,
+      "version": "0.2.0"
+    }
+  },
+  "dependencies": []
+}

package/r/tabs.json

@@ -0,0 +1,17 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
+  "name": "tabs",
+  "type": "registry:ui",
+  "dependencies": [
+    "cn",
+    "radix-ui"
+  ],
+  "registryDependencies": [],
+  "files": [
+    {
+      "path": "components/ui/tabs.tsx",
+      "type": "registry:ui",
+      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\nimport { Tabs as TabsPrimitive } from \"radix-ui\"\n\nfunction Tabs({\n  className,\n  orientation = \"horizontal\",\n  ...props\n}: React.ComponentProps<typeof TabsPrimitive.Root>) {\n  return (\n    <TabsPrimitive.Root\n      data-slot=\"tabs\"\n      data-orientation={orientation}\n      orientation={orientation}\n      className={cn(\n        \"group/tabs flex gap-2 data-[orientation=horizontal]:flex-col\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nconst tabsListVariants = cva(\n  \"group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-[orientation=horizontal]/tabs:h-9 group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col data-[variant=line]:rounded-none\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-muted\",\n        line: \"gap-1 bg-transparent\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction TabsList({\n  className,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<typeof TabsPrimitive.List> &\n  VariantProps<typeof tabsListVariants>) {\n  return (\n    <TabsPrimitive.List\n      data-slot=\"tabs-list\"\n      data-variant={variant}\n      className={cn(tabsListVariants({ variant }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction TabsTrigger({\n  className,\n  ...props\n}: React.ComponentProps<typeof TabsPrimitive.Trigger>) {\n  return (\n    <TabsPrimitive.Trigger\n      data-slot=\"tabs-trigger\"\n      className={cn(\n        \"relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 group-data-[variant=default]/tabs-list:data-[state=active]:shadow-sm group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none dark:text-muted-foreground dark:hover:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n        \"group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:border-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent\",\n        \"data-[state=active]:bg-background data-[state=active]:text-foreground dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 dark:data-[state=active]:text-foreground\",\n        \"after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-[state=active]:after:opacity-100\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TabsContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof TabsPrimitive.Content>) {\n  return (\n    <TabsPrimitive.Content\n      data-slot=\"tabs-content\"\n      className={cn(\"flex-1 outline-none\", className)}\n      {...props}\n    />\n  )\n}\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants }\n"
+    }
+  ]
+}