import { HeaderLayouts } from "./Headers/types";
import { BenefitLayouts } from "./Benefits/types";
import { CTALayouts } from "./CTA/types";
import { ContentLayouts } from "./Content/types";
import { PricingLayouts } from "./Pricing/types";
import { SocialProofLayouts } from "./SocialProof/types";
import { FormLayouts } from "./Forms/types";
import { NavigationLayouts } from "./Navigation/types";
import { FooterLayouts } from "./Footers/types";
import { GuaranteeLayouts } from "./Guarantee/types";
import { QuizLayouts } from "./Quiz/types";
import { UrgencyLayouts } from "./Urgency/types";
import { ComponentTypes } from "@sc/plugins/webcomponents/v2/types";

export enum PageSectionCategory {
  HEADER = "Header",
  BENEFIT = "Benefit",
  CTA = "CTA",
  CONTENT = "Content",
  PRICING = "Pricing",
  SOCIALPROOF = "SocialProof",
  FORM = "Form",
  NAVIGATION = "Navigation",
  FOOTER = "Footer",
  GUARANTEE = "Guarantee",
  QUIZ = "Quiz",
  URGENCY = "Urgency",
}

export type AllPageLayouts =
  | HeaderLayouts
  | BenefitLayouts
  | CTALayouts
  | ContentLayouts
  | PricingLayouts
  | NavigationLayouts
  | FooterLayouts
  | SocialProofLayouts
  | GuaranteeLayouts
  | QuizLayouts
  | UrgencyLayouts
  | FormLayouts;

export interface iProps {
  type: AllPageLayouts;
  data?: any;
}

export interface ILayoutSettings {
  label: AllPageLayouts | string;
  layout: AllPageLayouts;
  previewImage?: string;
  default: {
    label?: PageSectionCategory;
    type: ComponentTypes;
    bodyOnly: boolean;
    canHaveChildren: boolean;
    properties?: React.CSSProperties;
    children?: any[];
  };
}