import {
  HandleInput
} from "./chunk-HJ56YXBU.js";
import {
  TabbedForm,
  defineTabMeta,
  useTabbedForm
} from "./chunk-4LXBQTFN.js";
import "./chunk-TKGWSUEI.js";
import "./chunk-U2ZFCAPX.js";
import {
  RouteFocusModal,
  useRouteModal
} from "./chunk-FWJLS7XD.js";
import {
  Form
} from "./chunk-3QSRE5LS.js";
import "./chunk-PBQ5M44A.js";
import "./chunk-OH4AABUT.js";
import "./chunk-YKDEE7ZL.js";
import "./chunk-AEMDNTW5.js";
import "./chunk-LYD3C73Z.js";
import "./chunk-7O5NDICV.js";
import "./chunk-46M463BR.js";
import "./chunk-YFRC6GEN.js";
import "./chunk-N6SI4IIT.js";
import "./chunk-JPNPTILP.js";
import "./chunk-DAXXLQKB.js";
import "./chunk-OHOWEMHO.js";
import "./chunk-GKGLVDDV.js";
import {
  useMembers
} from "./chunk-WJJXUXSO.js";
import "./chunk-LAPEZATU.js";
import "./chunk-DBNPVU3L.js";
import "./chunk-U7WZYWGA.js";
import "./chunk-ZN7LWXVC.js";
import "./chunk-VYMODH6P.js";
import {
  useCreateSeller
} from "./chunk-LEG67A2R.js";
import "./chunk-PRBE5CM3.js";
import "./chunk-5TRY5IMZ.js";
import "./chunk-TAKEQAZZ.js";
import "./chunk-B6FG7A6W.js";
import "./chunk-EPHVGD5Z.js";
import "./chunk-ESPLVOFC.js";
import {
  useStore
} from "./chunk-FXWKGNRV.js";
import "./chunk-VDKOJ5WD.js";
import "./chunk-DL2ZIXBO.js";
import "./chunk-Z2QQZOG3.js";
import "./chunk-5CK6XEFV.js";
import "./chunk-RHKRREUU.js";
import "./chunk-ZA2KFUFR.js";
import "./chunk-ZBWL72TB.js";
import "./chunk-NBMM2TZK.js";

// src/pages/stores/store-create/components/store-create-form.tsx
import { zodResolver } from "@hookform/resolvers/zod";
import { toast } from "@medusajs/ui";
import { Children, useMemo as useMemo2 } from "react";
import { useForm } from "react-hook-form";
import { useTranslation as useTranslation3 } from "react-i18next";

// src/pages/stores/store-create/components/schema.ts
import i18n from "i18next";
import { z } from "zod";
var CreateStoreSchema = z.object({
  name: z.string().min(1, { message: i18n.t("stores.create.validation.nameRequired") }),
  email: z.string().min(1, { message: i18n.t("stores.create.validation.emailRequired") }).email({ message: i18n.t("stores.create.validation.emailInvalid") }),
  phone: z.string().optional().or(z.literal("")),
  currency_code: z.string().min(1, { message: i18n.t("stores.create.validation.currencyRequired") }),
  handle: z.string().optional().or(z.literal("")),
  member_email: z.string().min(1, { message: i18n.t("stores.create.validation.emailRequired") }).email({ message: i18n.t("stores.create.validation.emailInvalid") })
});

// src/pages/stores/store-create/components/store-create-details-tab.tsx
import { Heading, Input, Select } from "@medusajs/ui";
import { useTranslation } from "react-i18next";
import { jsx, jsxs } from "react/jsx-runtime";
var Root = () => {
  const { t } = useTranslation();
  const form = useTabbedForm();
  const { store } = useStore();
  return /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto px-3", children: /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-[720px] flex-col gap-y-8 px-px py-16", children: [
    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Heading, { children: t("stores.create.header") }) }),
    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
      /* @__PURE__ */ jsx(
        Form.Field,
        {
          control: form.control,
          name: "name",
          render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
            /* @__PURE__ */ jsx(Form.Label, { children: t("fields.name") }),
            /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
            /* @__PURE__ */ jsx(Form.ErrorMessage, {})
          ] })
        }
      ),
      /* @__PURE__ */ jsx(
        Form.Field,
        {
          control: form.control,
          name: "handle",
          render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
            /* @__PURE__ */ jsx(Form.Label, { optional: true, tooltip: t("stores.handleTooltip"), children: t("fields.handle") }),
            /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(HandleInput, { ...field }) }),
            /* @__PURE__ */ jsx(Form.ErrorMessage, {})
          ] })
        }
      ),
      /* @__PURE__ */ jsx(
        Form.Field,
        {
          control: form.control,
          name: "email",
          render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
            /* @__PURE__ */ jsx(Form.Label, { children: t("fields.email") }),
            /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(Input, { type: "email", ...field }) }),
            /* @__PURE__ */ jsx(Form.ErrorMessage, {})
          ] })
        }
      ),
      /* @__PURE__ */ jsx(
        Form.Field,
        {
          control: form.control,
          name: "phone",
          render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
            /* @__PURE__ */ jsx(Form.Label, { optional: true, children: t("fields.phone") }),
            /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(Input, { type: "tel", ...field }) }),
            /* @__PURE__ */ jsx(Form.ErrorMessage, {})
          ] })
        }
      ),
      /* @__PURE__ */ jsx(
        Form.Field,
        {
          control: form.control,
          name: "currency_code",
          render: ({ field: { onChange, ref, ...field } }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
            /* @__PURE__ */ jsx(Form.Label, { children: t("fields.currency") }),
            /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsxs(Select, { ...field, onValueChange: onChange, children: [
              /* @__PURE__ */ jsx(Select.Trigger, { ref, children: /* @__PURE__ */ jsx(Select.Value, { placeholder: t("fields.selectPlaceholder", "Select") }) }),
              /* @__PURE__ */ jsx(Select.Content, { children: store?.supported_currencies?.map((sc) => /* @__PURE__ */ jsx(
                Select.Item,
                {
                  value: sc.currency_code,
                  children: sc.currency_code.toUpperCase()
                },
                sc.currency_code
              )) })
            ] }) }),
            /* @__PURE__ */ jsx(Form.ErrorMessage, {})
          ] })
        }
      )
    ] })
  ] }) });
};
Root._tabMeta = defineTabMeta({
  id: "details",
  labelKey: "stores.create.tabs.details",
  validationFields: ["name", "email", "phone", "currency_code"]
});
var StoreCreateDetailsTab = Root;

// src/pages/stores/store-create/components/store-create-users-tab.tsx
import { Heading as Heading2, Input as Input2, Text, clx } from "@medusajs/ui";
import { useEffect, useMemo, useRef, useState } from "react";
import { createPortal } from "react-dom";
import { useWatch } from "react-hook-form";
import { useTranslation as useTranslation2 } from "react-i18next";
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
var Root2 = () => {
  const { t } = useTranslation2();
  const form = useTabbedForm();
  const [suggestionsOpen, setSuggestionsOpen] = useState(false);
  const [dropdownStyle, setDropdownStyle] = useState({});
  const wrapperRef = useRef(null);
  const emailValue = useWatch({
    control: form.control,
    name: "member_email"
  });
  const { members } = useMembers(
    { q: emailValue || void 0, limit: 10 },
    { placeholderData: (prev) => prev }
  );
  const memberList = useMemo(
    () => members ?? [],
    [members]
  );
  useEffect(() => {
    if (!suggestionsOpen) return;
    const update = () => {
      const rect = wrapperRef.current?.getBoundingClientRect();
      if (!rect) return;
      setDropdownStyle({
        position: "fixed",
        top: rect.bottom + 4,
        left: rect.left,
        width: rect.width,
        maxHeight: `calc(100vh - ${rect.bottom + 24}px)`,
        overflowY: "auto"
      });
    };
    update();
    window.addEventListener("resize", update);
    document.addEventListener("scroll", update, true);
    return () => {
      window.removeEventListener("resize", update);
      document.removeEventListener("scroll", update, true);
    };
  }, [suggestionsOpen]);
  return /* @__PURE__ */ jsx2("div", { className: "flex flex-1 flex-col items-center overflow-y-auto px-3", children: /* @__PURE__ */ jsxs2("div", { className: "mx-auto flex w-full max-w-[720px] flex-col gap-y-8 px-px py-16", children: [
    /* @__PURE__ */ jsxs2("div", { children: [
      /* @__PURE__ */ jsx2(Heading2, { children: t("stores.create.usersHeader") }),
      /* @__PURE__ */ jsx2(Text, { size: "small", className: "text-ui-fg-subtle", children: t("stores.create.usersHint") }),
      /* @__PURE__ */ jsx2(Text, { size: "small", className: "text-ui-fg-subtle mt-1", children: t("stores.create.usersHintSecondary") })
    ] }),
    /* @__PURE__ */ jsx2("div", { className: "flex flex-col gap-y-4", children: /* @__PURE__ */ jsx2(
      Form.Field,
      {
        control: form.control,
        name: "member_email",
        render: ({ field }) => /* @__PURE__ */ jsxs2(Form.Item, { children: [
          /* @__PURE__ */ jsx2(Form.Label, { children: t("fields.email") }),
          /* @__PURE__ */ jsx2(Form.Control, { children: /* @__PURE__ */ jsxs2("div", { ref: wrapperRef, className: "relative", children: [
            /* @__PURE__ */ jsx2(
              Input2,
              {
                ...field,
                autoComplete: "off",
                placeholder: "admin@example.com",
                onFocus: () => setSuggestionsOpen(true),
                onBlur: () => {
                  field.onBlur();
                  setTimeout(() => setSuggestionsOpen(false), 150);
                }
              }
            ),
            suggestionsOpen && memberList.length > 0 && createPortal(
              /* @__PURE__ */ jsx2(
                "div",
                {
                  style: dropdownStyle,
                  className: clx(
                    "bg-ui-bg-base shadow-elevation-flyout border-ui-border-base z-50 flex flex-col rounded-md border p-1"
                  ),
                  children: memberList.map((member) => /* @__PURE__ */ jsx2(
                    "button",
                    {
                      type: "button",
                      onMouseDown: (e) => {
                        e.preventDefault();
                        field.onChange(member.email);
                        setSuggestionsOpen(false);
                      },
                      className: "hover:bg-ui-bg-base-hover text-ui-fg-base flex w-full items-center rounded-sm px-2 py-1.5 text-left text-sm",
                      children: member.email
                    },
                    member.id
                  ))
                }
              ),
              document.body
            )
          ] }) }),
          /* @__PURE__ */ jsx2(Form.ErrorMessage, {})
        ] })
      }
    ) })
  ] }) });
};
Root2._tabMeta = defineTabMeta({
  id: "users",
  labelKey: "stores.create.tabs.users"
});
var StoreCreateUsersTab = Root2;

// src/pages/stores/store-create/components/store-create-form.tsx
import { jsx as jsx3 } from "react/jsx-runtime";
var StoreCreateForm = ({ children }) => {
  const { t } = useTranslation3();
  const { handleSuccess } = useRouteModal();
  const form = useForm({
    defaultValues: {
      name: "",
      email: "",
      phone: "",
      currency_code: "",
      handle: "",
      member_email: ""
    },
    mode: "onSubmit",
    reValidateMode: "onSubmit",
    resolver: zodResolver(CreateStoreSchema)
  });
  const { mutateAsync: createSeller, isPending } = useCreateSeller();
  const handleSubmit = form.handleSubmit(async (values) => {
    try {
      await createSeller({
        name: values.name,
        email: values.email,
        phone: values.phone || void 0,
        currency_code: values.currency_code,
        handle: values.handle || void 0,
        member: {
          email: values.member_email
        }
      });
      toast.success(
        t("stores.create.successToast", "Store created successfully")
      );
      handleSuccess();
    } catch (error) {
      toast.error(error.message);
    }
  });
  const defaultTabs = useMemo2(
    () => [
      /* @__PURE__ */ jsx3(StoreCreateDetailsTab, {}, "details"),
      /* @__PURE__ */ jsx3(StoreCreateUsersTab, {}, "users")
    ],
    []
  );
  return /* @__PURE__ */ jsx3(TabbedForm, { form, onSubmit: handleSubmit, isLoading: isPending, children: Children.count(children) > 0 ? children : defaultTabs });
};

// src/pages/stores/store-create/index.tsx
import { jsx as jsx4 } from "react/jsx-runtime";
var Root3 = () => {
  return /* @__PURE__ */ jsx4(RouteFocusModal, { children: /* @__PURE__ */ jsx4(StoreCreateForm, {}) });
};
var StoreCreatePage = Object.assign(Root3, {
  Form: StoreCreateForm,
  DetailsTab: StoreCreateDetailsTab,
  UsersTab: StoreCreateUsersTab,
  Tab: TabbedForm.Tab
});
var Component = Root3;
export {
  Component,
  CreateStoreSchema,
  StoreCreatePage
};
