import { jsxs as _, jsx as a } from "react/jsx-runtime";
import { l as A } from "./index.C1ZfizMq.js";
import { a as B } from "./index.CfQlFjZU.js";
import { n as M } from "./index.B0wX8xO7.js";
import { useState as O, useEffect as V } from "react";
import { B as T, a as W } from "./Button.CpTwUWVr.js";
import { a as x } from "./TextInput.63vMRxAK.js";
import "./ProgressActivity.DYLCzf8q.js";
import "./formInputIcon.module.CU3tuFAI.js";
import { u as D } from "./useStateWithDirtyCheck.Ci56bBqE.js";
import { a as F } from "./ProgressTracker.DyY57Wb4.js";
import { P as U } from "./ProfilePreview.Dh7SMM-9.js";
import { e as z, f as N, g as w, i as E, S as C } from "./social.D59qnHFn.js";
import { a as $ } from "./SocialIcon.B0ronCv9.js";
import { O as q } from "./Onboarding.BDRBUM0D.js";
const H = "creator_contentContainerStretch_7qGIs", Q = "creator_mainContentContainer_eQVyR", R = "creator_formContainer_ibuXW", G = "creator_sectionFormContainer_3EnyH", X = "creator_header_zpyqZ", Z = "creator_body_4MLQA", J = "creator_input_pRSre", y = { contentContainerStretch: H, mainContentContainer: Q, formContainer: R, sectionFormContainer: G, header: X, body: Z, input: J };
function K({
  category: S,
  displayName: b,
  onSubmit: v,
  existingLinks: m,
  isSkippable: k,
  onSkip: I,
  loading: g,
  autoCompleteAutoCorrectOff: L,
  useHandles: l
}) {
  const c = z(S).map((e) => {
    const r = w(e);
    return {
      ...r,
      isHandle: N(r),
      type: e
    };
  }), [i, p, f] = D(
    () => c.map((e) => e.name).reduce((e, r) => ({
      ...e,
      [r]: ""
    }), {})
  ), [d, u] = O(
    () => c.map((e) => e.name).reduce((e, r) => ({
      ...e,
      [r]: void 0
    }), {})
  );
  V(() => {
    if (f || !m || m.length === 0)
      return;
    const r = m.filter((o) => {
      const n = o.type.toLowerCase();
      return i[n] !== void 0;
    }).reduce(
      (o, n) => {
        const j = l ? E(n.type, n.link) : n.link;
        return {
          ...o,
          [n.type.toLowerCase()]: j || ""
        };
      },
      {}
    );
    Object.values(r).every((o) => !o) || p((o) => ({
      ...o,
      ...r
    }));
  }, [
    m,
    i,
    f,
    p,
    l
  ]);
  function h(e, r, s) {
    if (p({
      ...i,
      [r]: s
    }), l && N(w(e)))
      try {
        E(e, s), u({
          ...d,
          [r]: void 0
        });
      } catch {
        u({
          ...d,
          [r]: "Please enter a valid handle or link"
        });
      }
  }
  function t(e) {
    e.preventDefault();
    const r = c.map((s) => ({
      type: s.type,
      link: i[s.name],
      isHandle: s.isHandle
    })).map(({ isHandle: s, ...o }) => {
      if (o.type === C.EMAIL)
        return o;
      const n = o.link;
      return l && s ? n.length === 0 ? o : {
        ...o,
        link: E(o.type, n) || ""
      } : n.startsWith("http://") || n.startsWith("https://") || n.length === 0 ? o : {
        ...o,
        link: `https://${n}`
      };
    });
    v(r);
  }
  const P = Object.values(i).every((e) => !e) || !!l && Object.values(d).some((e) => !!e);
  return {
    displayName: b,
    mainContentContainerClassName: y.mainContentContainer,
    headerClassName: y.header,
    bodyClassName: y.body,
    inputClassName: y.input,
    steps: [{ label: "Links" }, { label: "Image" }, { label: "Content" }],
    activeStepIndex: 0,
    socialLinkInputs: c.map((e) => ({
      ...e,
      value: i[e.name],
      error: d[e.name],
      onChange: (r) => {
        h(e.type, e.name, r.target.value);
      }
    })),
    onSubmit: t,
    isDisabled: P,
    loading: g,
    previewIcons: c.map((e) => {
      if (i[e.name])
        return e.type;
    }),
    isSkippable: k,
    onSkip: I,
    autoCompleteAutoCorrectOff: !!L,
    useHandles: !!l
  };
}
function Y({
  mainContentContainerClassName: S,
  headerClassName: b,
  bodyClassName: v,
  inputClassName: m,
  steps: k,
  activeStepIndex: I,
  socialLinkInputs: g,
  onSubmit: L,
  isDisabled: l,
  loading: c,
  previewIcons: i,
  displayName: p,
  isSkippable: f,
  onSkip: d,
  autoCompleteAutoCorrectOff: u,
  useHandles: h
}) {
  return /* @__PURE__ */ _(q, { layout: "plain", children: [
    /* @__PURE__ */ a(F, { steps: k, activeStepIndex: I }),
    /* @__PURE__ */ a("div", { children: /* @__PURE__ */ a(U, { icons: i, displayName: p }) }),
    /* @__PURE__ */ _(
      "form",
      {
        onSubmit: L,
        className: S,
        noValidate: u,
        children: [
          /* @__PURE__ */ _("div", { children: [
            /* @__PURE__ */ a("h1", { className: b, children: "Enter your social links" }),
            /* @__PURE__ */ a("p", { className: v, children: "Add social links so people can follow your accounts - you can add more later." })
          ] }),
          /* @__PURE__ */ a(
            A,
            {
              values: g,
              layout: (t) => /* @__PURE__ */ a(
                x,
                {
                  label: t.label,
                  helper: h && t.isHandle ? t.error || `Enter ${t.label} handle or link` : t.type !== C.EMAIL && t.type !== C.WEBSITE ? `Enter ${t.label} link` : void 0,
                  isError: h && !!t.error,
                  prefixIcon: /* @__PURE__ */ a($, { mode: "color", social: t.type }),
                  name: t.name,
                  value: t.value,
                  onChange: t.onChange,
                  inputClassName: m,
                  type: u ? t.type === C.EMAIL ? "email" : "url" : void 0
                },
                t.name
              )
            }
          ),
          /* @__PURE__ */ a(
            T,
            {
              label: "Next",
              size: "full",
              type: W.SUBMIT,
              disabled: l,
              loading: c
            }
          ),
          /* @__PURE__ */ a(
            M,
            {
              value: f,
              then: /* @__PURE__ */ a(T, { label: "Skip", size: "small", onClick: d })
            }
          )
        ]
      }
    )
  ] });
}
const he = B(Y, K);
export {
  he as S
};
