Some checks are pending
Deploy to Cloudflare Workers (OpenNext) / deploy (push) Waiting to run
43 lines
1.2 KiB
TypeScript
43 lines
1.2 KiB
TypeScript
import type { ReactNode } from "react";
|
|
import { RiftSectionAccent } from "@/components/brand/RiftSectionAccent";
|
|
import type { RiftPattern } from "@/components/brand/rift-patterns";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
type Props = {
|
|
id?: string;
|
|
className?: string;
|
|
children: ReactNode;
|
|
variant?: "default" | "muted" | "inverse";
|
|
/** Subtle line accent for this section — page spine handles vertical flow */
|
|
riftPattern?: RiftPattern;
|
|
/** @deprecated Use riftPattern instead */
|
|
riftFlow?: boolean;
|
|
};
|
|
|
|
export function Section({
|
|
id,
|
|
className,
|
|
children,
|
|
variant = "default",
|
|
riftPattern = "none",
|
|
riftFlow,
|
|
}: Props) {
|
|
const pattern: RiftPattern = riftFlow && riftPattern === "none" ? "whisper" : riftPattern;
|
|
|
|
return (
|
|
<section
|
|
id={id}
|
|
className={cn(
|
|
"relative py-16 md:py-24",
|
|
variant === "muted" && "section-muted",
|
|
variant === "inverse" && "section-inverse",
|
|
pattern !== "none" && "overflow-hidden",
|
|
className
|
|
)}
|
|
>
|
|
<RiftSectionAccent pattern={pattern} inverse={variant === "inverse"} />
|
|
<div className="relative z-10 mx-auto max-w-6xl px-4 md:px-6">{children}</div>
|
|
</section>
|
|
);
|
|
}
|