import { cn } from "@/lib/registry/cn"; import { Placeholder } from "@/lib/registry/sitecore"; import type { ComponentProps } from "@/lib/registry/sitecore-types"; export type FooterProps = ComponentProps & { params?: { [key: string]: string }; }; /** * Pure-placeholder footer shell. Owns layout (brand strip + columns * grid + bottom row) but NO inline rendering. Authors compose every * affordance via the slots below. * * **Three placeholders:** * * footer-brand-{*} brand strip — Image (logo) + RichText (description) * footer-columns-{*} column grid — N × LinkList (typical: 4-5 columns) * footer-bottom-{*} bottom row — ContentBlock (copyright) + LinkList (legal links) * * Each placeholder is optional; empty slots render nothing. The * `footer-columns-{*}` placeholder uses a responsive auto-fit grid * so column count adapts to the number of LinkList renderings placed * (typically 3-5 columns at desktop, 2 at tablet, 1 at mobile). * * **No baked-in datasource fields.** Logo / Description / * CopyrightText / TermsText / PolicyText all live on seed ContentItems * referenced from the standard-footer partial design. */ export const Default = (props: FooterProps) => { const params = props.params ?? {}; const { styles, RenderingIdentifier: id, DynamicPlaceholderId } = params; const ph = DynamicPlaceholderId ?? "1"; return ( ); }; export default Default; /** * `universal` opts this file into BOTH the server and client * component maps the SDK generates (component-map.ts + * component-map.client.ts). Without this marker the file lands in * the server map alone, so Pages chrome (browser-side) can't look * up Footer or resolve its named-export variants. */ export const componentType = "universal";

Footer

Showcase

Footer