import { tv, type VariantProps } from "tailwind-variants"; import * as z from "zod"; // Tailwind Variants for LayoutWrapper export const tvLayoutWrapper = tv({ slots: { base: "", inner: "", }, variants: { // LayoutColored color: { default: { base: "bg-default" }, muted: { base: "bg-muted" }, elevated: { base: "bg-elevated" }, accented: { base: "bg-accented" }, inverted: { base: "bg-inverted text-inverted" }, primary: { base: "bg-primary text-inverted" }, }, // LayoutContained container: { default: { inner: "container" }, xl: { inner: "container-xl" }, lg: { inner: "container-lg" }, fluid: { inner: "container-fluid" }, fullbleed: { inner: "container-fullbleed" }, }, // LayoutPadded verticalPadding: { sm: { base: "py-3" }, md: { base: "py-6" }, lg: { base: "py-12" }, none: {}, }, }, defaultVariants: { color: "default", container: "default", verticalPadding: "md", }, }); export type LayoutWrapperProps = VariantProps; // Zod schemas for validating layout settings const colorEnum = z.enum(["default", "muted", "elevated", "accented", "inverted", "primary"]); const containerEnum = z.enum(["default", "xl", "lg", "fluid", "fullbleed"]); const verticalPaddingEnum = z.enum(["sm", "md", "lg", "none"]); const layoutSettingsSchema = z.object({ color: z.string().pipe(colorEnum).optional(), container: z.string().pipe(containerEnum).optional(), verticalPadding: z.string().pipe(verticalPaddingEnum).optional(), }); export type LayoutSettings = z.input; export function useLayoutWrapper(input?: LayoutSettings) { try { return tvLayoutWrapper(layoutSettingsSchema.parse(input)); } catch { return tvLayoutWrapper(); } }