import { jsx as i, jsxs as $ } from "react/jsx-runtime";
import { c as G } from "./index.dWlEA7uO.js";
import { useState as o, useEffect as K, useMemo as U } from "react";
import { M as k, S as D } from "./shared.EdGf6tcG.js";
import { B as W, a as _ } from "./Button.CpTwUWVr.js";
import { c as q } from "./Dropdown.CMeTYQwB.js";
import { a as C } from "./TextInput.63vMRxAK.js";
import { U as H } from "./Upload.X0oU32lw.js";
import { a as J } from "./message.CHKnnsjy.js";
import { a as Q } from "./Stack.XB4icBMm.js";
import { a as X, M as Z } from "./modal.BZAvb1Nx.js";
import { f as ee, c as ae, a as ie, b as ne } from "./image.Cmad0xlQ.js";
import { a as te } from "./index.CfQlFjZU.js";
import { n as oe } from "./index.B0wX8xO7.js";
import { C as E } from "./AffiliateCommissionTag.CT1MTbyb.js";
const F = ["image/png", "image/jpeg", "image/webp"], re = [
  {
    value: "USD",
    label: "$ USD"
  },
  {
    value: "EUR",
    label: "€ EUR"
  },
  {
    value: "GBP",
    label: "£ GBP"
  }
], O = 16, se = ({
  product: e,
  errors: t,
  loading: u,
  uploadingImage: b = !1,
  isEditing: h = !1,
  onDone: S,
  onPrevious: f,
  onClose: A
}) => {
  const [s, I] = o(e?.title || ""), [n, m] = o(void 0), [M, r] = o(void 0), [v, d] = o(!1), [p, l] = o(), [R, g] = o(), [N, P] = o();
  K(() => {
    e?.image && ee(e.image, "product.jpg").then((a) => {
      m(a);
    });
  }, [e.image]);
  const T = U(() => {
    if (!n) return;
    const a = p || n;
    return {
      name: a.name || "",
      src: URL.createObjectURL(a)
    };
  }, [n, p]), w = !!s.trim() && !!n && !!T && !t?.image && !t?.commission, x = () => {
    g(void 0), P(void 0), l(void 0);
  }, j = (a) => {
    if (x(), !a) {
      r("Please select an image");
      return;
    }
    if (!ie(a, O)) {
      r(`Max image size ${O}mb`);
      return;
    }
    if (!ne(a, F)) {
      r("File is invalid type, allowed types: png, jpeg, webp");
      return;
    }
    m(a), r(void 0), d(!0);
  }, z = () => {
    x(), m(void 0);
  }, B = async (a, c) => {
    g(a), P(c);
    const Y = await ae(n, a, c);
    l(Y);
  }, L = () => {
    w && S({
      title: s,
      image: n,
      imageChanged: v,
      croppedArea: R,
      croppedAreaPixels: N,
      product: e
    });
  }, y = U(
    () => new Intl.NumberFormat("en-US", {
      style: "currency",
      currency: e.currency
    }),
    [e.currency]
  ), V = U(() => {
    const c = e.affiliateMetadata?.commissionType === E.PERCENT ? `${e.affiliateMetadata?.commissionRate || 0}%` : e.affiliateMetadata?.commissionType === E.FLAT ? y.format(
      e.affiliateMetadata?.commissionRate || 0
    ) : null;
    return c ? `You can make ${c} commission whenever someone purchases this product.` : "";
  }, [y, e.affiliateMetadata]);
  return {
    buttons: [
      {
        label: "Done",
        semantic: D.PRIMARY,
        loading: u,
        disabled: !w,
        onClick: L
      },
      {
        label: h ? "Cancel" : "Previous",
        semantic: D.SECONDARY,
        onClick: f
      }
    ],
    currencies: re,
    errors: t,
    title: s,
    setTitle: I,
    image: T,
    imageError: M,
    setImage: j,
    removeImage: z,
    uploadingImage: b,
    onCropComplete: B,
    price: y.format(e.price || 0),
    discountedPrice: y.format(e.discountedPrice || 0),
    currency: e.currency || "USD",
    urlName: e.trackingUrl ? "Your affiliate link" : "Product URL",
    url: e.trackingUrl || e.url || "",
    messageSemantic: t?.commission ? k.ERROR : k.SUCCESS,
    messageText: t?.commission || V,
    onClose: A
  };
}, me = ({
  buttons: e,
  currencies: t,
  errors: u,
  title: b,
  setTitle: h,
  image: S,
  imageError: f,
  setImage: A,
  removeImage: s,
  uploadingImage: I,
  onCropComplete: n,
  price: m,
  discountedPrice: M,
  currency: r,
  urlName: v,
  url: d,
  messageSemantic: p,
  messageText: l,
  onClose: R
}) => /* @__PURE__ */ i(
  X,
  {
    isOpen: !0,
    type: Z.ADVANCED,
    heading: "Add affiliate product",
    buttons: e,
    onDismiss: R,
    children: /* @__PURE__ */ $(Q, { direction: "column", spacing: 2, children: [
      /* @__PURE__ */ i(
        H,
        {
          label: "Thumbnail",
          helper: u?.image || f || "Max image size 16mb",
          error: !!(u?.image || f),
          file: S,
          onFileSelect: A,
          onFileRemove: s,
          suggestedAllowedTypes: F,
          allowCropping: !0,
          cropAspectRatio: 1,
          onCropComplete: n,
          uploading: I
        }
      ),
      /* @__PURE__ */ i(
        C,
        {
          label: "Title",
          value: b,
          onChange: (g) => h(g.target.value)
        }
      ),
      /* @__PURE__ */ i(C, { label: "Price", value: m, readOnly: !0 }),
      /* @__PURE__ */ i(C, { label: "Discounted price", value: M, readOnly: !0 }),
      /* @__PURE__ */ i(
        q,
        {
          label: "Currency",
          placeholder: "Select currency",
          items: t,
          value: r,
          disabled: !0,
          readOnly: !0,
          onChange: () => {
          },
          onSelect: () => {
          },
          onClick: () => {
          }
        }
      ),
      /* @__PURE__ */ i(
        C,
        {
          label: v,
          value: d,
          suffixIcon: /* @__PURE__ */ i(
            W,
            {
              type: _.LINK,
              size: "2xsmall",
              prefixIcon: /* @__PURE__ */ i(G, { size: 24 }),
              label: "Open link in new tab",
              href: d,
              target: "_blank"
            }
          ),
          readOnly: !0
        }
      ),
      /* @__PURE__ */ i(
        oe,
        {
          value: l,
          then: /* @__PURE__ */ i(J, { semantic: p, text: l })
        }
      )
    ] })
  }
), ve = te(
  me,
  se
);
export {
  ve as A
};
