import { jsx as i, Fragment as N, jsxs as D } from "react/jsx-runtime";
import { S as M } from "./shared.EdGf6tcG.js";
import { useState as R, useMemo as S } from "react";
import { a as w } from "./TextInput.63vMRxAK.js";
import { U as z } from "./Upload.X0oU32lw.js";
import { T as P } from "./Typography.a1p6WNM8.js";
import { I as E } from "./ItemCreationTemplate.DZj_4KLv.js";
import "./ItemCreationContext.CFI6PyWk.js";
import { a as L } from "./index.CfQlFjZU.js";
import { f as O, c as _ } from "./image.Cmad0xlQ.js";
const B = "creator_header_WSqZ2", F = "creator_body_BbMoZ", W = { header: B, body: F }, Y = ({
  pageTitle: p,
  pageSectionDescription: u,
  previousPageUrl: g,
  preview: h,
  imageFile: a,
  item: n,
  setItem: s,
  onCancel: C,
  onNext: b,
  onImageChange: r,
  submitting: m,
  disableNext: f,
  errors: v
}) => {
  const [T, o] = R(!1), [e, d] = R(), A = S(() => {
    if (a)
      return e ? {
        name: a.name || "",
        src: URL.createObjectURL(e)
      } : a;
  }, [a, e]), l = S(() => ({
    ...n,
    title: n?.title || "",
    callToAction: n?.callToAction || ""
  }), [n]), I = () => {
    b(l);
  }, c = (t) => {
    r(t);
  }, k = () => {
    r(void 0), d(void 0);
  }, x = async (t, U) => {
    const j = await O(a?.src || "", "thumbnail.jpg"), y = await _(j, t, U);
    d(y), r(y);
  };
  return {
    steps: [{ label: "Item" }, { label: "Landing Page" }],
    buttons: [
      {
        label: "Cancel",
        semantic: M.SECONDARY,
        onClick: () => o(!0)
      },
      {
        label: "Next",
        semantic: M.PRIMARY,
        onClick: I,
        loading: m,
        disabled: f
      }
    ],
    pageTitle: p,
    pageSectionDescription: u,
    previousPageUrl: g,
    preview: h,
    title: l.title,
    callToAction: l.callToAction,
    setTitle: (t) => s({ ...l, title: t }),
    setCallToAction: (t) => s({ ...l, callToAction: t }),
    onImageSelect: c,
    onImageRemove: k,
    onCropComplete: x,
    imageFile: A,
    submitting: m,
    errors: v,
    onPreviousClicked: (t) => {
      t.preventDefault(), o(!0);
    },
    isWarningModalOpen: T,
    onWarningModalClose: () => o(!1),
    onWarningModalConfirm: () => {
      o(!1), C();
    }
  };
}, Z = ({
  pageTitle: p,
  pageSectionDescription: u,
  steps: g,
  buttons: h,
  previousPageUrl: a,
  preview: n,
  title: s,
  callToAction: C,
  setTitle: b,
  setCallToAction: r,
  onCropComplete: m,
  onImageSelect: f,
  onImageRemove: v,
  imageFile: T,
  submitting: o,
  errors: e,
  onPreviousClicked: d,
  isWarningModalOpen: A,
  onWarningModalClose: l,
  onWarningModalConfirm: I
}) => /* @__PURE__ */ i(N, { children: /* @__PURE__ */ D(
  E,
  {
    steps: g,
    activeStepIndex: 0,
    title: p || "Add Free Download",
    previousPageUrl: a,
    buttons: h,
    preview: n,
    onClickPrevious: d,
    showWarningModal: A,
    onKeepEditing: l,
    onGoBack: I,
    children: [
      /* @__PURE__ */ D("div", { children: [
        /* @__PURE__ */ i(
          P,
          {
            variant: "header",
            size: "medium",
            component: "h2",
            className: W.header,
            children: "Customize item"
          }
        ),
        /* @__PURE__ */ i(P, { variant: "body", size: "small", className: W.body, children: u })
      ] }),
      /* @__PURE__ */ i(
        z,
        {
          placeholder: "Upload an image",
          suggestedAllowedTypes: ["image/jpeg", "image/png"],
          onFileSelect: f,
          onFileRemove: v,
          file: T,
          label: "Thumbnail",
          helper: e?.thumbnail || "Max image size 16mb",
          error: !!e?.thumbnail,
          disabled: o,
          allowCropping: !0,
          onCropComplete: m,
          cropAspectRatio: 1 / 1
        }
      ),
      /* @__PURE__ */ i(
        w,
        {
          label: "Item title",
          value: s,
          onChange: (c) => b(c.target.value),
          helper: e?.title,
          isError: !!e?.title,
          isDisabled: o
        }
      ),
      /* @__PURE__ */ i(
        w,
        {
          label: "Call-to-action button",
          value: C,
          onChange: (c) => r(c.target.value),
          helper: e?.callToAction,
          isError: !!e?.callToAction,
          isDisabled: o,
          maxLength: 24
        }
      )
    ]
  }
) }), te = L(
  Z,
  Y
);
export {
  te as D
};
