import { _ as _sfc_main$2 } from "./index-m9AqQ9dr.js";
import { defineComponent, mergeProps, createVNode, resolveDynamicComponent, withCtx, createTextVNode, toDisplayString, useSSRContext, ref, unref, createBlock, openBlock } from "vue";
import { ssrRenderAttrs, ssrRenderVNode, ssrInterpolate, ssrRenderClass, ssrRenderComponent, ssrIncludeBooleanAttr } from "vue/server-renderer";
import { u as useUtmPayload, _ as _sfc_main$3, a as _sfc_main$4, b as _sfc_main$5, c as _sfc_main$6 } from "./useUtmPayload-DlQ2OH8k.js";
import { useForm, Field } from "vee-validate";
import * as z from "zod";
import { toTypedSchema } from "@vee-validate/zod";
import { d as useI18n, a as _export_sfc } from "../server.mjs";
import { u as useApi } from "./useApi-Dv-cyvzn.js";
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
  __name: "Title",
  __ssrInlineRender: true,
  props: {
    title: {},
    description: { default: "" },
    buttonText: { default: "اشترك الآن" },
    showButton: { type: Boolean, default: false },
    customStyle: { default: "" },
    titleHeading: { default: "h1" },
    descriptionCustomStyle: { default: "" }
  },
  setup(__props) {
    const props = __props;
    return (_ctx, _push, _parent, _attrs) => {
      const _component_Button = _sfc_main$2;
      _push(`<div${ssrRenderAttrs(mergeProps({
        class: ["flex flex-col justify-center gap-10 px-4", _ctx.customStyle]
      }, _attrs))}>`);
      if (props.title) {
        ssrRenderVNode(_push, createVNode(resolveDynamicComponent(props.titleHeading), { class: "dark-text-gradient mx-auto max-w-[735px] text-center text-2xl leading-10 font-semibold md:text-4xl md:leading-14 2xl:text-5xl 2xl:leading-16" }, {
          default: withCtx((_, _push2, _parent2, _scopeId) => {
            if (_push2) {
              _push2(`${ssrInterpolate(props.title)}`);
            } else {
              return [
                createTextVNode(toDisplayString(props.title), 1)
              ];
            }
          }),
          _: 1
        }), _parent);
      } else {
        _push(`<!---->`);
      }
      if (props.description) {
        _push(`<p class="${ssrRenderClass([_ctx.descriptionCustomStyle, "dark-text-gradient text-center"])}">${ssrInterpolate(props.description)}</p>`);
      } else {
        _push(`<!---->`);
      }
      if (props.showButton) {
        _push(ssrRenderComponent(_component_Button, {
          class: "mx-auto cursor-pointer",
          variant: "wsDefault",
          size: "wsDefault"
        }, {
          default: withCtx((_, _push2, _parent2, _scopeId) => {
            if (_push2) {
              _push2(`${ssrInterpolate(props.buttonText)}`);
            } else {
              return [
                createTextVNode(toDisplayString(props.buttonText), 1)
              ];
            }
          }),
          _: 1
        }, _parent));
      } else {
        _push(`<!---->`);
      }
      _push(`</div>`);
    };
  }
});
const _sfc_setup$1 = _sfc_main$1.setup;
_sfc_main$1.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("components/blogs/Title.vue");
  return _sfc_setup$1 ? _sfc_setup$1(props, ctx) : void 0;
};
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "SubscribeSection",
  __ssrInlineRender: true,
  setup(__props) {
    const { t } = useI18n();
    const { getUTMPayload } = useUtmPayload();
    const formSchema = toTypedSchema(
      z.object({
        email: z.string({
          required_error: t("schemaErrors.email_required_error")
        }).email(t("schemaErrors.email_invalid_error"))
      })
    );
    const { handleSubmit, resetForm } = useForm({
      validationSchema: formSchema,
      validateOnMount: false
    });
    const loading = ref(false);
    const successMessage = ref("");
    const errorMessage = ref("");
    handleSubmit(async (values) => {
      var _a, _b;
      const { post } = useApi();
      try {
        loading.value = true;
        errorMessage.value = "";
        successMessage.value = "";
        const payload = {
          ...values,
          utm: getUTMPayload()
        };
        await post("news-letter", payload);
        successMessage.value = t("success_message");
        resetForm();
        setTimeout(() => {
          successMessage.value = "";
        }, 3e3);
      } catch (err) {
        const message = ((_b = (_a = err == null ? void 0 : err.response) == null ? void 0 : _a.data) == null ? void 0 : _b.message) || t("error_message");
        errorMessage.value = message;
        setTimeout(() => {
          errorMessage.value = "";
        }, 3e3);
      } finally {
        loading.value = false;
      }
    });
    return (_ctx, _push, _parent, _attrs) => {
      const _component_BlogsTitle = _sfc_main$1;
      const _component_FormField = Field;
      const _component_FormItem = _sfc_main$3;
      const _component_FormControl = _sfc_main$4;
      const _component_Input = _sfc_main$5;
      const _component_FormMessage = _sfc_main$6;
      _push(`<section${ssrRenderAttrs(mergeProps({
        id: "subscribe",
        class: "bg-surface-background container mx-auto flex flex-col items-center justify-center rounded-lg px-4 py-12 text-center"
      }, _attrs))} data-v-42fed81c>`);
      _push(ssrRenderComponent(_component_BlogsTitle, {
        title: unref(t)("subscriptionSection.title"),
        description: unref(t)("subscriptionSection.description"),
        "custom-style": "!gap-1 text-[32px] md:text-[40px] font-bold",
        "title-heading": "h2",
        "description-custom-style": "text-base md:text-lg font-normal"
      }, null, _parent));
      _push(`<form class="mt-6 w-full max-w-[600px]" data-v-42fed81c>`);
      _push(ssrRenderComponent(_component_FormField, {
        name: "email",
        "validate-on-blur": true,
        "validate-on-input": false
      }, {
        default: withCtx(({ componentField }, _push2, _parent2, _scopeId) => {
          if (_push2) {
            _push2(ssrRenderComponent(_component_FormItem, null, {
              default: withCtx((_, _push3, _parent3, _scopeId2) => {
                if (_push3) {
                  _push3(`<div class="flex w-full flex-col items-stretch overflow-hidden rounded-md sm:flex-row" data-v-42fed81c${_scopeId2}>`);
                  _push3(ssrRenderComponent(_component_FormControl, null, {
                    default: withCtx((_2, _push4, _parent4, _scopeId3) => {
                      if (_push4) {
                        _push4(ssrRenderComponent(_component_Input, mergeProps({
                          class: "bg-input placeholder:text-primary relative h-[50px] w-full rounded-none border-none px-4 text-sm focus:ring-0 focus:outline-none focus-visible:ring-0",
                          placeholder: unref(t)("placeholders.email")
                        }, componentField), null, _parent4, _scopeId3));
                      } else {
                        return [
                          createVNode(_component_Input, mergeProps({
                            class: "bg-input placeholder:text-primary relative h-[50px] w-full rounded-none border-none px-4 text-sm focus:ring-0 focus:outline-none focus-visible:ring-0",
                            placeholder: unref(t)("placeholders.email")
                          }, componentField), null, 16, ["placeholder"])
                        ];
                      }
                    }),
                    _: 2
                  }, _parent3, _scopeId2));
                  _push3(`<button type="submit"${ssrIncludeBooleanAttr(unref(loading)) ? " disabled" : ""} class="${ssrRenderClass([[
                    _ctx.$i18n.locale === "ar" ? "left-0 sm:left-1" : "right-0 sm:right-1",
                    { "cursor-not-allowed opacity-50": unref(loading) }
                  ], "ws-gradient-border border-input-border text-primary borderRedius absolute bottom-1 w-full cursor-pointer !rounded-t-none border-t px-4 py-2 text-lg font-medium sm:bottom-0 sm:w-[34%] sm:!rounded-t-md sm:!rounded-l-none sm:border-t-0 sm:border-r sm:border-l-0 rtl:!rounded-l-md rtl:sm:!rounded-r-none"])}" data-v-42fed81c${_scopeId2}>`);
                  if (unref(loading)) {
                    _push3(`<span class="animate-spin-loader" data-v-42fed81c${_scopeId2}></span>`);
                  } else {
                    _push3(`<span data-v-42fed81c${_scopeId2}>${ssrInterpolate(unref(t)("buttons.subscribe_button"))}</span>`);
                  }
                  _push3(`</button></div><div class="text-destructive mt-1 min-h-[20px] text-center text-base" data-v-42fed81c${_scopeId2}>`);
                  _push3(ssrRenderComponent(_component_FormMessage, null, null, _parent3, _scopeId2));
                  _push3(`</div>`);
                } else {
                  return [
                    createVNode("div", { class: "flex w-full flex-col items-stretch overflow-hidden rounded-md sm:flex-row" }, [
                      createVNode(_component_FormControl, null, {
                        default: withCtx(() => [
                          createVNode(_component_Input, mergeProps({
                            class: "bg-input placeholder:text-primary relative h-[50px] w-full rounded-none border-none px-4 text-sm focus:ring-0 focus:outline-none focus-visible:ring-0",
                            placeholder: unref(t)("placeholders.email")
                          }, componentField), null, 16, ["placeholder"])
                        ]),
                        _: 2
                      }, 1024),
                      createVNode("button", {
                        type: "submit",
                        disabled: unref(loading),
                        class: ["ws-gradient-border border-input-border text-primary borderRedius absolute bottom-1 w-full cursor-pointer !rounded-t-none border-t px-4 py-2 text-lg font-medium sm:bottom-0 sm:w-[34%] sm:!rounded-t-md sm:!rounded-l-none sm:border-t-0 sm:border-r sm:border-l-0 rtl:!rounded-l-md rtl:sm:!rounded-r-none", [
                          _ctx.$i18n.locale === "ar" ? "left-0 sm:left-1" : "right-0 sm:right-1",
                          { "cursor-not-allowed opacity-50": unref(loading) }
                        ]]
                      }, [
                        unref(loading) ? (openBlock(), createBlock("span", {
                          key: 0,
                          class: "animate-spin-loader"
                        })) : (openBlock(), createBlock("span", { key: 1 }, toDisplayString(unref(t)("buttons.subscribe_button")), 1))
                      ], 10, ["disabled"])
                    ]),
                    createVNode("div", { class: "text-destructive mt-1 min-h-[20px] text-center text-base" }, [
                      createVNode(_component_FormMessage)
                    ])
                  ];
                }
              }),
              _: 2
            }, _parent2, _scopeId));
          } else {
            return [
              createVNode(_component_FormItem, null, {
                default: withCtx(() => [
                  createVNode("div", { class: "flex w-full flex-col items-stretch overflow-hidden rounded-md sm:flex-row" }, [
                    createVNode(_component_FormControl, null, {
                      default: withCtx(() => [
                        createVNode(_component_Input, mergeProps({
                          class: "bg-input placeholder:text-primary relative h-[50px] w-full rounded-none border-none px-4 text-sm focus:ring-0 focus:outline-none focus-visible:ring-0",
                          placeholder: unref(t)("placeholders.email")
                        }, componentField), null, 16, ["placeholder"])
                      ]),
                      _: 2
                    }, 1024),
                    createVNode("button", {
                      type: "submit",
                      disabled: unref(loading),
                      class: ["ws-gradient-border border-input-border text-primary borderRedius absolute bottom-1 w-full cursor-pointer !rounded-t-none border-t px-4 py-2 text-lg font-medium sm:bottom-0 sm:w-[34%] sm:!rounded-t-md sm:!rounded-l-none sm:border-t-0 sm:border-r sm:border-l-0 rtl:!rounded-l-md rtl:sm:!rounded-r-none", [
                        _ctx.$i18n.locale === "ar" ? "left-0 sm:left-1" : "right-0 sm:right-1",
                        { "cursor-not-allowed opacity-50": unref(loading) }
                      ]]
                    }, [
                      unref(loading) ? (openBlock(), createBlock("span", {
                        key: 0,
                        class: "animate-spin-loader"
                      })) : (openBlock(), createBlock("span", { key: 1 }, toDisplayString(unref(t)("buttons.subscribe_button")), 1))
                    ], 10, ["disabled"])
                  ]),
                  createVNode("div", { class: "text-destructive mt-1 min-h-[20px] text-center text-base" }, [
                    createVNode(_component_FormMessage)
                  ])
                ]),
                _: 2
              }, 1024)
            ];
          }
        }),
        _: 1
      }, _parent));
      _push(`</form>`);
      if (unref(successMessage)) {
        _push(`<p class="mt-2 text-center text-base text-green-600" data-v-42fed81c>${ssrInterpolate(unref(successMessage))}</p>`);
      } else {
        _push(`<!---->`);
      }
      if (unref(errorMessage)) {
        _push(`<p class="mt-2 text-center text-base text-red-600" data-v-42fed81c>${ssrInterpolate(unref(errorMessage))}</p>`);
      } else {
        _push(`<!---->`);
      }
      _push(`</section>`);
    };
  }
});
const _sfc_setup = _sfc_main.setup;
_sfc_main.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("components/global/SubscribeSection.vue");
  return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
};
const __nuxt_component_3 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-42fed81c"]]);
const SubscribeSection = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  default: __nuxt_component_3
}, Symbol.toStringTag, { value: "Module" }));
export {
  SubscribeSection as S,
  __nuxt_component_3 as _,
  _sfc_main$1 as a
};
//# sourceMappingURL=SubscribeSection-D6lSAdXw.js.map
