import type { ComponentType } from "react";
import { HeaderDefault } from "./HeaderDefault";
import { HeaderMinimal } from "./HeaderMinimal";
import { HeaderCentered } from "./HeaderCentered";
import { HeaderDefaultPreview, HeaderMinimalPreview, HeaderCenteredPreview } from "./HeaderPreviews";
import { FooterDefault } from "./FooterDefault";
import { FooterMinimal } from "./FooterMinimal";
import { FooterWithLinks } from "./FooterWithLinks";

export const HEADER_LAYOUTS: Record<string, { label: string; Component: ComponentType }> = {
  default: { label: "Default (logo left, search & actions right)", Component: HeaderDefault },
  minimal: { label: "Minimal (logo and logout only)", Component: HeaderMinimal },
  centered: { label: "Centered (logo center, actions on sides)", Component: HeaderCentered },
};

/** Header components safe for dashboard preview (no auth/search). */
export const HEADER_PREVIEWS: Record<string, ComponentType> = {
  default: HeaderDefaultPreview,
  minimal: HeaderMinimalPreview,
  centered: HeaderCenteredPreview,
};

export const FOOTER_LAYOUTS: Record<string, { label: string; Component: ComponentType }> = {
  default: { label: "Default (bark background, single line)", Component: FooterDefault },
  minimal: { label: "Minimal (subtle, compact)", Component: FooterMinimal },
  "with-links": { label: "With links (footer links row)", Component: FooterWithLinks },
};

export { HeaderDefault, HeaderMinimal, HeaderCentered };
export { FooterDefault, FooterMinimal, FooterWithLinks };