Integration Marquee
Three auto-scrolling rows of integration logos around a featured brand mark, with progressive edge fades.
New in 0.2.0 Lists the block under the Integration heading in the admin Blocks Drawer (admin.group). Needs Payload 3.25 or newer.
Installation
npx payload-components add integration-marqueeWhat it installs
Copies 4 source files into your project:
src/blocks/shared/integrationFields.tssharedsrc/components/ui/infinite-slider.tsxsrc/blocks/IntegrationMarquee/config.tssrc/blocks/IntegrationMarquee/Component.tsx
…and makes 4 edits to wire the block into your project:
| Registers the block | src/collections/Pages/index.ts |
| Maps the renderer | src/blocks/RenderBlocks.tsx |
| Regenerates types | src/payload-types.ts |
| Regenerates the admin import map | src/app/(payload)/admin/importMap.js |
src/collections/Pages/index.tssrc/blocks/RenderBlocks.tsxsrc/payload-types.tssrc/app/(payload)/admin/importMap.jsintegrationFields.ts is shared source for this component family. Components that install the same path reuse that local copy, and re-running an install never overwrites a copy you have changed.Re-running the CLI install detects existing source and wiring, then records install state in .payload-components/state.json.
Content model
heading, subtext, and integrations come from the shared integrationFields base. This variant
adds an optional featuredLogo over the center of the scrolling rows. The marquee respects
prefers-reduced-motion.
Prop
Type
Each item in integrations carries:
Prop
Type
Usage
IntegrationMarquee block to its layout.RenderBlocks on the frontend, fully typed — no extra wiring.Requirements
- Target
- payload-website-starter, payload-blocks-app
- Payload
- v3 (3.25 or newer) / v4 (experimental)
- Next.js
- 15 / 16 with v316 (16.4 or newer) with v4
- shadcn UI
- none
Payload v4 support is experimental: it needs Next.js 16 (16.4 or newer) and Node.js 24.22.1 or newer. Payload v3 (3.25 or newer) stays fully supported.
Your project must already expose components.json, src/payload.config.ts — the surfaces patched by payload-components add. The CLI verifies this against the support matrix before touching anything.
In this family
integration-gridintegration-clusterintegration-splitintegration-connectintegration-orbitintegration-listintegration-marqueecurrentintegration-testimonial