ezux 1.0.0

package/dist/EzEventModal-DtpvYwGr.js

@@ -0,0 +1,684 @@
+import { j as e, B as u, L as i, I as g, c as m, D as b } from "./index-DBwoXp4n.js";
+import { useEffect as k } from "react";
+import { useForm as D } from "@tanstack/react-form";
+import { createPortal as E } from "react-dom";
+import { X as A, Paperclip as v, Trash2 as z } from "lucide-react";
+const S = [
+  { label: "S", value: "SU" },
+  { label: "M", value: "MO" },
+  { label: "T", value: "TU" },
+  { label: "W", value: "WE" },
+  { label: "T", value: "TH" },
+  { label: "F", value: "FR" },
+  { label: "S", value: "SA" }
+], _ = ({
+  isOpen: x,
+  onClose: c,
+  mode: d,
+  event: n,
+  onSave: w,
+  onDelete: f,
+  locale: p,
+  editorTemplate: j,
+  headerTemplate: y,
+  footerTemplate: N
+}) => {
+  const s = D({
+    defaultValues: {
+      title: n?.title || "",
+      start: n?.start,
+      end: n?.end,
+      resourceIds: n?.resourceIds || (n?.resourceId ? [n.resourceId] : []) || [],
+      location: n?.location || "",
+      isAllDay: !!n?.allDay || !!n?.isAllDay || !1,
+      description: n?.description || "",
+      isTimezoneEnabled: !!n?.timezone,
+      startTimezone: n?.timezone?.start || "Asia/Calcutta",
+      endTimezone: n?.timezone?.end || "Asia/Calcutta",
+      repeatFrequency: n?.recurrence?.frequency || "Never",
+      repeatInterval: n?.recurrence?.interval || 1,
+      repeatDays: n?.recurrence?.days || [],
+      repeatBy: n?.recurrence?.repeatBy || "day",
+      repeatEndLevel: n?.recurrence?.end || "Never",
+      repeatEndCount: n?.recurrence?.endCount || 1,
+      repeatEndUntil: n?.recurrence?.endUntil,
+      attachments: n?.attachments || []
+    },
+    onSubmit: async ({ value: t }) => {
+      w({
+        ...n,
+        title: t.title,
+        start: t.start,
+        end: t.end,
+        resourceId: t.resourceIds[0],
+        resourceIds: t.resourceIds,
+        location: t.location,
+        allDay: t.isAllDay,
+        description: t.description,
+        timezone: t.isTimezoneEnabled ? { start: t.startTimezone, end: t.endTimezone } : void 0,
+        recurrence: t.repeatFrequency !== "Never" ? {
+          frequency: t.repeatFrequency,
+          interval: t.repeatInterval,
+          unit: t.repeatFrequency.replace("ly", "") + "(s)",
+          end: t.repeatEndLevel,
+          endCount: t.repeatEndLevel === "Count" ? t.repeatEndCount : void 0,
+          endUntil: t.repeatEndLevel === "Until" ? t.repeatEndUntil : void 0,
+          days: t.repeatFrequency === "Weekly" ? t.repeatDays : void 0,
+          repeatBy: t.repeatFrequency === "Monthly" || t.repeatFrequency === "Yearly" ? t.repeatBy : void 0
+        } : void 0,
+        attachments: t.attachments
+      }), c();
+    }
+  });
+  if (k(() => {
+    x && s.reset();
+  }, [x, n, s]), !x) return null;
+  const C = (t) => {
+    t.preventDefault(), t.stopPropagation(), s.handleSubmit();
+  }, o = d === "view", F = /* @__PURE__ */ e.jsxs(
+    "div",
+    {
+      "data-testid": "ez-event-modal",
+      style: {
+        position: "fixed",
+        top: 0,
+        left: 0,
+        width: "100vw",
+        height: "100vh",
+        zIndex: 1e4,
+        backgroundColor: "rgba(0, 0, 0, 0.4)",
+        backdropFilter: "blur(2px)",
+        pointerEvents: "auto"
+      },
+      children: [
+        /* @__PURE__ */ e.jsx(
+          "div",
+          {
+            style: { position: "absolute", inset: 0 },
+            onClick: c
+          }
+        ),
+        /* @__PURE__ */ e.jsxs(
+          "div",
+          {
+            className: m(
+              "bg-background rounded-xl shadow-2xl flex flex-col border border-border overflow-hidden",
+              "animate-in zoom-in-95 fade-in duration-300 ease-out"
+            ),
+            style: {
+              backgroundColor: "white",
+              width: "650px",
+              maxWidth: "95vw",
+              maxHeight: "92vh",
+              position: "absolute",
+              top: "50%",
+              left: "50%",
+              transform: "translate(-50%, -50%)",
+              zIndex: 10001
+            },
+            children: [
+              /* @__PURE__ */ e.jsx(
+                "div",
+                {
+                  className: "flex items-center justify-between shrink-0 bg-background",
+                  style: { padding: "16px 40px" },
+                  children: y ? y(n || {}, d) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+                    /* @__PURE__ */ e.jsxs("h2", { className: "text-xl font-bold tracking-tight text-foreground", children: [
+                      d === "create" && "New Event",
+                      d === "edit" && "Edit Event",
+                      d === "view" && "Event Details"
+                    ] }),
+                    /* @__PURE__ */ e.jsx(u, { variant: "ghost", size: "icon", className: "h-9 w-9 rounded-full hover:bg-muted text-muted-foreground mr-[-8px]", onClick: c, children: /* @__PURE__ */ e.jsx(A, { className: "w-5 h-5" }) })
+                  ] })
+                }
+              ),
+              j ? /* @__PURE__ */ e.jsx("div", { className: "overflow-y-auto custom-scrollbar flex-1 bg-background", style: { padding: "8px 40px 32px 40px" }, children: j(n || {}) }) : /* @__PURE__ */ e.jsxs(
+                "form",
+                {
+                  onSubmit: C,
+                  className: "space-y-6 overflow-y-auto custom-scrollbar flex-1 bg-background",
+                  style: { padding: "8px 40px 32px 40px" },
+                  children: [
+                    /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
+                      /* @__PURE__ */ e.jsx(
+                        s.Field,
+                        {
+                          name: "title",
+                          validators: {
+                            onChange: ({ value: t }) => t ? void 0 : "Title is required"
+                          },
+                          children: (t) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+                            /* @__PURE__ */ e.jsx(i, { htmlFor: "title", className: "text-[13px] font-semibold text-foreground/70", children: "Title" }),
+                            /* @__PURE__ */ e.jsx(
+                              g,
+                              {
+                                id: "title",
+                                placeholder: "Add title",
+                                value: t.state.value,
+                                onChange: (r) => t.handleChange(r.target.value),
+                                onBlur: t.handleBlur,
+                                disabled: o,
+                                className: m(
+                                  "h-10 rounded-md border-slate-100 focus-visible:border-primary focus-visible:ring-1 focus-visible:ring-primary/20 bg-background transition-all",
+                                  t.state.meta.errors.length > 0 && "border-destructive focus-visible:border-destructive ring-destructive/20"
+                                )
+                              }
+                            ),
+                            t.state.meta.errors.length > 0 && /* @__PURE__ */ e.jsx("p", { className: "text-[12px] font-medium text-destructive mt-1.5 animate-in fade-in slide-in-from-top-1", children: t.state.meta.errors.join(", ") })
+                          ] })
+                        }
+                      ),
+                      /* @__PURE__ */ e.jsx(
+                        s.Field,
+                        {
+                          name: "location",
+                          children: (t) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+                            /* @__PURE__ */ e.jsx(i, { htmlFor: "location", className: "text-[13px] font-semibold text-foreground/70", children: "Location" }),
+                            /* @__PURE__ */ e.jsx(
+                              g,
+                              {
+                                id: "location",
+                                placeholder: "Add location",
+                                value: t.state.value,
+                                onChange: (r) => t.handleChange(r.target.value),
+                                disabled: o,
+                                className: "h-10 rounded-md border-slate-100 focus-visible:border-primary focus-visible:ring-1 focus-visible:ring-primary/20 bg-background transition-all"
+                              }
+                            )
+                          ] })
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
+                      /* @__PURE__ */ e.jsx(
+                        s.Field,
+                        {
+                          name: "start",
+                          validators: {
+                            onChange: ({ value: t }) => t ? void 0 : "Start date is required"
+                          },
+                          children: (t) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+                            /* @__PURE__ */ e.jsx(i, { className: "text-[13px] font-semibold text-foreground/70", children: "Start" }),
+                            /* @__PURE__ */ e.jsx(
+                              b,
+                              {
+                                date: t.state.value,
+                                setDate: (r) => t.handleChange(r),
+                                disabled: o,
+                                required: !0,
+                                locale: p,
+                                mode: s.getFieldValue("isAllDay") ? "date" : "datetime",
+                                className: "border-slate-200 focus-visible:border-primary focus-visible:ring-1 focus-visible:ring-primary/20"
+                              }
+                            ),
+                            t.state.meta.errors.length > 0 && /* @__PURE__ */ e.jsx("p", { className: "text-[12px] font-medium text-destructive mt-1.5", children: t.state.meta.errors.join(", ") })
+                          ] })
+                        }
+                      ),
+                      /* @__PURE__ */ e.jsx(
+                        s.Field,
+                        {
+                          name: "end",
+                          validators: {
+                            onChange: ({ value: t, fieldApi: r }) => {
+                              if (!t) return "End date is required";
+                              const a = r.form.getFieldValue("start");
+                              if (a && t <= a) return "End time must be after start time";
+                            }
+                          },
+                          children: (t) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+                            /* @__PURE__ */ e.jsx(i, { className: "text-[13px] font-semibold text-foreground/70", children: "End" }),
+                            /* @__PURE__ */ e.jsx(
+                              b,
+                              {
+                                date: t.state.value,
+                                setDate: (r) => t.handleChange(r),
+                                disabled: o,
+                                required: !0,
+                                locale: p,
+                                mode: s.getFieldValue("isAllDay") ? "date" : "datetime",
+                                minDate: s.getFieldValue("start"),
+                                className: m(
+                                  "border-slate-200 focus-visible:border-primary focus-visible:ring-1 focus-visible:ring-primary/20",
+                                  t.state.meta.errors.length > 0 && "border-destructive focus-visible:border-destructive ring-destructive/20"
+                                )
+                              }
+                            ),
+                            t.state.meta.errors.length > 0 && /* @__PURE__ */ e.jsx("p", { className: "text-[12px] font-medium text-destructive mt-1.5 animate-in fade-in slide-in-from-top-1", children: t.state.meta.errors.join(", ") })
+                          ] })
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
+                      /* @__PURE__ */ e.jsx(
+                        s.Field,
+                        {
+                          name: "isAllDay",
+                          children: (t) => /* @__PURE__ */ e.jsx("div", { className: "flex items-center h-10", children: /* @__PURE__ */ e.jsxs("label", { className: "flex items-center space-x-3 cursor-pointer group select-none", children: [
+                            /* @__PURE__ */ e.jsx(
+                              "input",
+                              {
+                                type: "checkbox",
+                                checked: t.state.value,
+                                onChange: (r) => t.handleChange(r.target.checked),
+                                disabled: o,
+                                className: "h-4 w-4 rounded border-slate-300 text-primary focus:ring-primary/30 accent-primary transition-all cursor-pointer"
+                              }
+                            ),
+                            /* @__PURE__ */ e.jsx("span", { className: "text-[14px] font-medium text-foreground/70 group-hover:text-foreground", children: "All day event" })
+                          ] }) })
+                        }
+                      ),
+                      /* @__PURE__ */ e.jsx(
+                        s.Field,
+                        {
+                          name: "isTimezoneEnabled",
+                          children: (t) => /* @__PURE__ */ e.jsx("div", { className: "flex items-center h-10", children: /* @__PURE__ */ e.jsxs("label", { className: "flex items-center space-x-3 cursor-pointer group select-none", children: [
+                            /* @__PURE__ */ e.jsx(
+                              "input",
+                              {
+                                type: "checkbox",
+                                checked: t.state.value,
+                                onChange: (r) => t.handleChange(r.target.checked),
+                                disabled: o,
+                                className: "h-4 w-4 rounded border-slate-300 text-primary focus:ring-primary/30 accent-primary transition-all cursor-pointer"
+                              }
+                            ),
+                            /* @__PURE__ */ e.jsx("span", { className: "text-[14px] font-medium text-foreground/70 group-hover:text-foreground", children: "Enable timezone" })
+                          ] }) })
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ e.jsx(
+                      s.Subscribe,
+                      {
+                        selector: (t) => [t.values.isTimezoneEnabled],
+                        children: ([t]) => t && /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6 p-6 bg-slate-50/50 rounded-lg border border-slate-100 animate-in slide-in-from-top-2 duration-300", children: [
+                          /* @__PURE__ */ e.jsx(
+                            s.Field,
+                            {
+                              name: "startTimezone",
+                              children: (r) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+                                /* @__PURE__ */ e.jsx(i, { className: "text-[13px] font-semibold text-foreground/70", children: "Start Timezone" }),
+                                /* @__PURE__ */ e.jsxs(
+                                  "select",
+                                  {
+                                    className: "w-full h-10 px-3 rounded-md border-slate-100 bg-background text-sm focus:outline-none focus-visible:ring-1 focus-visible:ring-primary/20 focus-visible:border-primary appearance-none bg-[url('data:image/svg+xml;charset=utf-8,%3Csvg%20xlmns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20fill%3D%27none%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20stroke%3D%27%236b7280%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%20stroke-width%3D%271.5%27%20d%3D%27m6%208%204%204%204-4%27%2F%3E%3C%2Fsvg%3E')] bg-[length:20px] bg-[right_8px_center] bg-no-repeat transition-all",
+                                    value: r.state.value,
+                                    onChange: (a) => r.handleChange(a.target.value),
+                                    children: [
+                                      /* @__PURE__ */ e.jsx("option", { value: "Asia/Calcutta", children: "Asia/Calcutta" }),
+                                      /* @__PURE__ */ e.jsx("option", { value: "UTC", children: "UTC" }),
+                                      /* @__PURE__ */ e.jsx("option", { value: "America/New_York", children: "America/New_York" })
+                                    ]
+                                  }
+                                )
+                              ] })
+                            }
+                          ),
+                          /* @__PURE__ */ e.jsx(
+                            s.Field,
+                            {
+                              name: "endTimezone",
+                              children: (r) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+                                /* @__PURE__ */ e.jsx(i, { className: "text-[13px] font-semibold text-foreground/70", children: "End Timezone" }),
+                                /* @__PURE__ */ e.jsxs(
+                                  "select",
+                                  {
+                                    className: "w-full h-10 px-3 rounded-md border-slate-100 bg-background text-sm focus:outline-none focus-visible:ring-1 focus-visible:ring-primary/20 focus-visible:border-primary appearance-none bg-[url('data:image/svg+xml;charset=utf-8,%3Csvg%20xlmns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20fill%3D%27none%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20stroke%3D%27%236b7280%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%20stroke-width%3D%271.5%27%20d%3D%27m6%208%204%204%204-4%27%2F%3E%3C%2Fsvg%3E')] bg-[length:20px] bg-[right_8px_center] bg-no-repeat transition-all",
+                                    value: r.state.value,
+                                    onChange: (a) => r.handleChange(a.target.value),
+                                    children: [
+                                      /* @__PURE__ */ e.jsx("option", { value: "Asia/Calcutta", children: "Asia/Calcutta" }),
+                                      /* @__PURE__ */ e.jsx("option", { value: "UTC", children: "UTC" }),
+                                      /* @__PURE__ */ e.jsx("option", { value: "America/New_York", children: "America/New_York" })
+                                    ]
+                                  }
+                                )
+                              ] })
+                            }
+                          )
+                        ] })
+                      }
+                    ),
+                    /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
+                      /* @__PURE__ */ e.jsx(
+                        s.Field,
+                        {
+                          name: "repeatFrequency",
+                          children: (t) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+                            /* @__PURE__ */ e.jsx(i, { className: "text-[13px] font-semibold text-foreground/70", children: "Repeat" }),
+                            /* @__PURE__ */ e.jsxs(
+                              "select",
+                              {
+                                className: "w-full h-10 px-3 rounded-md border-slate-100 bg-background text-sm focus:outline-none focus-visible:ring-1 focus-visible:ring-primary/20 focus-visible:border-primary appearance-none bg-[url('data:image/svg+xml;charset=utf-8,%3Csvg%20xlmns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20fill%3D%27none%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20stroke%3D%27%236b7280%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%20stroke-width%3D%271.5%27%20d%3D%27m6%208%204%204%204-4%27%2F%3E%3C%2Fsvg%3E')] bg-[length:20px] bg-[right_8px_center] bg-no-repeat transition-all",
+                                value: t.state.value,
+                                onChange: (r) => t.handleChange(r.target.value),
+                                children: [
+                                  /* @__PURE__ */ e.jsx("option", { value: "Never", children: "Never" }),
+                                  /* @__PURE__ */ e.jsx("option", { value: "Daily", children: "Daily" }),
+                                  /* @__PURE__ */ e.jsx("option", { value: "Weekly", children: "Weekly" }),
+                                  /* @__PURE__ */ e.jsx("option", { value: "Monthly", children: "Monthly" }),
+                                  /* @__PURE__ */ e.jsx("option", { value: "Yearly", children: "Yearly" })
+                                ]
+                              }
+                            )
+                          ] })
+                        }
+                      ),
+                      /* @__PURE__ */ e.jsx(
+                        s.Subscribe,
+                        {
+                          selector: (t) => [t.values.repeatFrequency],
+                          children: ([t]) => t !== "Never" && /* @__PURE__ */ e.jsx(
+                            s.Field,
+                            {
+                              name: "repeatEndLevel",
+                              children: (r) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-2 animate-in slide-in-from-top-2 duration-300", children: [
+                                /* @__PURE__ */ e.jsx(i, { className: "text-[13px] font-semibold text-foreground/70", children: "End" }),
+                                /* @__PURE__ */ e.jsxs(
+                                  "select",
+                                  {
+                                    className: "w-full h-10 px-3 rounded-md border-slate-100 bg-background text-sm focus:outline-none focus-visible:ring-1 focus-visible:ring-primary/20 focus-visible:border-primary appearance-none bg-[url('data:image/svg+xml;charset=utf-8,%3Csvg%20xlmns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20fill%3D%27none%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20stroke%3D%27%236b7280%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%20stroke-width%3D%271.5%27%20d%3D%27m6%208%204%204%204-4%27%2F%3E%3C%2Fsvg%3E')] bg-[length:20px] bg-[right_8px_center] bg-no-repeat transition-all",
+                                    value: r.state.value,
+                                    onChange: (a) => r.handleChange(a.target.value),
+                                    children: [
+                                      /* @__PURE__ */ e.jsx("option", { value: "Never", children: "Never" }),
+                                      /* @__PURE__ */ e.jsx("option", { value: "Until", children: "Until" }),
+                                      /* @__PURE__ */ e.jsx("option", { value: "Count", children: "Count" })
+                                    ]
+                                  }
+                                )
+                              ] })
+                            }
+                          )
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ e.jsx(
+                      s.Subscribe,
+                      {
+                        selector: (t) => [t.values.repeatFrequency, t.values.repeatEndLevel],
+                        children: ([t, r]) => t !== "Never" && /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6 animate-in slide-in-from-top-2 duration-300", children: [
+                          /* @__PURE__ */ e.jsx(
+                            s.Field,
+                            {
+                              name: "repeatInterval",
+                              children: (a) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+                                /* @__PURE__ */ e.jsx(i, { className: "text-[13px] font-semibold text-foreground/70", children: "Repeat every" }),
+                                /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-3", children: [
+                                  /* @__PURE__ */ e.jsx(
+                                    "select",
+                                    {
+                                      className: "flex-1 h-10 px-3 rounded-md border-slate-100 bg-background text-sm focus:outline-none focus-visible:ring-1 focus-visible:ring-primary/20 focus-visible:border-primary appearance-none bg-[url('data:image/svg+xml;charset=utf-8,%3Csvg%20xlmns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20fill%3D%27none%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20stroke%3D%27%236b7280%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%20stroke-width%3D%271.5%27%20d%3D%27m6%208%204%204%204-4%27%2F%3E%3C%2Fsvg%3E')] bg-[length:20px] bg-[right_8px_center] bg-no-repeat transition-all",
+                                      value: a.state.value,
+                                      onChange: (l) => a.handleChange(parseInt(l.target.value)),
+                                      children: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 20, 30].map((l) => /* @__PURE__ */ e.jsx("option", { value: l, children: l }, l))
+                                    }
+                                  ),
+                                  /* @__PURE__ */ e.jsx("span", { className: "text-sm font-medium text-muted-foreground whitespace-nowrap", children: t === "Daily" ? "Day(s)" : t.replace("ly", "") + "(s)" })
+                                ] })
+                              ] })
+                            }
+                          ),
+                          r === "Until" && /* @__PURE__ */ e.jsx(
+                            s.Field,
+                            {
+                              name: "repeatEndUntil",
+                              children: (a) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-2 animate-in slide-in-from-top-1", children: [
+                                /* @__PURE__ */ e.jsx(i, { className: "text-[13px] font-semibold text-foreground/70", children: "Until" }),
+                                /* @__PURE__ */ e.jsx(
+                                  b,
+                                  {
+                                    date: a.state.value,
+                                    setDate: (l) => a.handleChange(l),
+                                    disabled: o,
+                                    locale: p,
+                                    mode: "date",
+                                    minDate: s.getFieldValue("start"),
+                                    className: "border-slate-100 focus:border-primary"
+                                  }
+                                )
+                              ] })
+                            }
+                          ),
+                          r === "Count" && /* @__PURE__ */ e.jsx(
+                            s.Field,
+                            {
+                              name: "repeatEndCount",
+                              children: (a) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-2 animate-in slide-in-from-top-1", children: [
+                                /* @__PURE__ */ e.jsx(i, { className: "text-[13px] font-semibold text-foreground/70", children: "Occurrences" }),
+                                /* @__PURE__ */ e.jsx(
+                                  g,
+                                  {
+                                    type: "number",
+                                    min: 1,
+                                    value: a.state.value,
+                                    onChange: (l) => a.handleChange(parseInt(l.target.value)),
+                                    className: "h-10 rounded-md border-slate-100 focus-visible:border-primary focus-visible:ring-1 focus-visible:ring-primary/20 bg-background transition-all"
+                                  }
+                                )
+                              ] })
+                            }
+                          )
+                        ] })
+                      }
+                    ),
+                    /* @__PURE__ */ e.jsx(
+                      s.Subscribe,
+                      {
+                        selector: (t) => [t.values.repeatFrequency],
+                        children: ([t]) => t === "Weekly" && /* @__PURE__ */ e.jsx(
+                          s.Field,
+                          {
+                            name: "repeatDays",
+                            children: (r) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-3 animate-in fade-in duration-300", children: [
+                              /* @__PURE__ */ e.jsx(i, { className: "text-[13px] font-semibold text-foreground/70", children: "Repeat On" }),
+                              /* @__PURE__ */ e.jsx("div", { className: "flex flex-wrap gap-2", children: S.map((a) => /* @__PURE__ */ e.jsx(
+                                "button",
+                                {
+                                  type: "button",
+                                  onClick: () => {
+                                    const l = r.state.value || [];
+                                    l.includes(a.value) ? r.handleChange(l.filter((h) => h !== a.value)) : r.handleChange([...l, a.value]);
+                                  },
+                                  className: m(
+                                    "w-9 h-9 rounded-full flex items-center justify-center text-sm font-bold transition-all border",
+                                    (r.state.value || []).includes(a.value) ? "bg-primary text-white border-primary shadow-sm" : "bg-background text-foreground/60 border-border/60 hover:border-primary/40 hover:text-primary"
+                                  ),
+                                  children: a.label
+                                },
+                                a.value
+                              )) })
+                            ] })
+                          }
+                        )
+                      }
+                    ),
+                    /* @__PURE__ */ e.jsx(
+                      s.Subscribe,
+                      {
+                        selector: (t) => [t.values.repeatFrequency],
+                        children: ([t]) => (t === "Monthly" || t === "Yearly") && /* @__PURE__ */ e.jsx(
+                          s.Field,
+                          {
+                            name: "repeatBy",
+                            children: (r) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-4 animate-in fade-in duration-300", children: [
+                              /* @__PURE__ */ e.jsx(i, { className: "text-[13px] font-semibold text-foreground/70", children: "Repeat On" }),
+                              /* @__PURE__ */ e.jsxs("div", { className: "space-y-3", children: [
+                                /* @__PURE__ */ e.jsxs("label", { className: "flex items-center space-x-3 cursor-pointer group", children: [
+                                  /* @__PURE__ */ e.jsx(
+                                    "input",
+                                    {
+                                      type: "radio",
+                                      name: "repeatBy",
+                                      checked: r.state.value === "day",
+                                      onChange: () => r.handleChange("day"),
+                                      className: "h-4 w-4 border-border text-primary focus:ring-primary"
+                                    }
+                                  ),
+                                  /* @__PURE__ */ e.jsx("span", { className: "text-sm text-foreground/80", children: "Day of the month" })
+                                ] }),
+                                /* @__PURE__ */ e.jsxs("label", { className: "flex items-center space-x-3 cursor-pointer group", children: [
+                                  /* @__PURE__ */ e.jsx(
+                                    "input",
+                                    {
+                                      type: "radio",
+                                      name: "repeatBy",
+                                      checked: r.state.value === "ordinal",
+                                      onChange: () => r.handleChange("ordinal"),
+                                      className: "h-4 w-4 border-border text-primary focus:ring-primary"
+                                    }
+                                  ),
+                                  /* @__PURE__ */ e.jsx("span", { className: "text-sm text-foreground/80", children: "Ordinal position" })
+                                ] })
+                              ] })
+                            ] })
+                          }
+                        )
+                      }
+                    ),
+                    /* @__PURE__ */ e.jsx(
+                      s.Field,
+                      {
+                        name: "description",
+                        children: (t) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+                          /* @__PURE__ */ e.jsx(i, { htmlFor: "description", className: "text-[13px] font-semibold text-foreground/70", children: "Description" }),
+                          /* @__PURE__ */ e.jsx(
+                            "textarea",
+                            {
+                              id: "description",
+                              placeholder: "Add description",
+                              className: "flex min-h-[100px] w-full rounded-md border-slate-100 bg-background px-4 py-3 text-sm placeholder:text-muted-foreground focus:outline-none focus-visible:ring-1 focus-visible:ring-primary/20 focus-visible:border-primary disabled:cursor-not-allowed disabled:opacity-50 resize-none transition-all hover:border-slate-200",
+                              value: t.state.value,
+                              onChange: (r) => t.handleChange(r.target.value),
+                              disabled: o
+                            }
+                          )
+                        ] })
+                      }
+                    ),
+                    /* @__PURE__ */ e.jsx(
+                      s.Field,
+                      {
+                        name: "attachments",
+                        children: (t) => /* @__PURE__ */ e.jsxs("div", { className: "space-y-4 pt-4 pb-2", children: [
+                          /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between", children: [
+                            /* @__PURE__ */ e.jsxs(i, { className: "text-[13px] font-semibold text-foreground/70 flex items-center gap-2", children: [
+                              /* @__PURE__ */ e.jsx(v, { className: "w-4 h-4" }),
+                              " Attachments"
+                            ] }),
+                            /* @__PURE__ */ e.jsx(
+                              "input",
+                              {
+                                type: "file",
+                                id: "file-upload",
+                                multiple: !0,
+                                className: "hidden",
+                                onChange: (r) => {
+                                  r.target.files && t.handleChange([...t.state.value || [], ...Array.from(r.target.files)]);
+                                }
+                              }
+                            ),
+                            /* @__PURE__ */ e.jsxs(
+                              u,
+                              {
+                                type: "button",
+                                variant: "outline",
+                                size: "sm",
+                                className: "h-8 text-xs font-semibold gap-2 border-dashed border-slate-300 hover:border-indigo-600/40 hover:text-indigo-600 transition-all",
+                                onClick: () => document.getElementById("file-upload")?.click(),
+                                children: [
+                                  /* @__PURE__ */ e.jsx(v, { className: "w-3 h-3" }),
+                                  " Add Files"
+                                ]
+                              }
+                            )
+                          ] }),
+                          (t.state.value || []).length > 0 && /* @__PURE__ */ e.jsx("div", { className: "grid grid-cols-1 gap-3", children: (t.state.value || []).map((r, a) => /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between p-3 rounded-lg bg-slate-50 border border-slate-100 group hover:border-slate-200 transition-all", children: [
+                            /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-3 overflow-hidden", children: [
+                              /* @__PURE__ */ e.jsx("div", { className: "w-9 h-9 rounded-md bg-white border border-slate-200 flex items-center justify-center shrink-0 shadow-sm", children: /* @__PURE__ */ e.jsx(v, { className: "w-4 h-4 text-slate-400" }) }),
+                              /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col overflow-hidden", children: [
+                                /* @__PURE__ */ e.jsx("span", { className: "text-[13px] font-medium text-slate-700 truncate", children: r.name }),
+                                /* @__PURE__ */ e.jsxs("span", { className: "text-[11px] text-slate-400 font-medium", children: [
+                                  (r.size / 1024).toFixed(1),
+                                  " KB"
+                                ] })
+                              ] })
+                            ] }),
+                            /* @__PURE__ */ e.jsx(
+                              u,
+                              {
+                                type: "button",
+                                variant: "ghost",
+                                size: "icon",
+                                className: "h-8 w-8 text-slate-300 hover:text-destructive hover:bg-destructive/10 opacity-0 group-hover:opacity-100 transition-all",
+                                onClick: () => t.handleChange((t.state.value || []).filter((l, h) => h !== a)),
+                                children: /* @__PURE__ */ e.jsx(z, { className: "w-4 h-4" })
+                              }
+                            )
+                          ] }, a)) })
+                        ] })
+                      }
+                    )
+                  ]
+                }
+              ),
+              N ? N(n || {}, d, () => C({}), c) : /* @__PURE__ */ e.jsxs("div", { style: {
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "flex-end",
+                padding: "24px 40px",
+                backgroundColor: "#fafbfc",
+                gap: "12px",
+                width: "100%",
+                flexShrink: 0
+              }, children: [
+                !o && f && d === "edit" && /* @__PURE__ */ e.jsx(u, { type: "button", variant: "ghost", className: "text-destructive hover:bg-destructive/10 hover:text-destructive h-10 px-5 font-bold mr-auto", onClick: () => {
+                  f(n?.id), c();
+                }, children: "Delete" }),
+                /* @__PURE__ */ e.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "12px" }, children: [
+                  !o && /* @__PURE__ */ e.jsx(
+                    s.Subscribe,
+                    {
+                      selector: (t) => [t.canSubmit, t.isSubmitting],
+                      children: ([t, r]) => /* @__PURE__ */ e.jsx(
+                        u,
+                        {
+                          type: "submit",
+                          variant: "default",
+                          className: "h-10 px-10 font-bold rounded-md shrink-0 flex items-center justify-center transition-all hover:opacity-90",
+                          style: { minWidth: "120px" },
+                          disabled: !t || r,
+                          onClick: (a) => {
+                            a.preventDefault(), a.stopPropagation(), s.handleSubmit();
+                          },
+                          children: r ? "Saving..." : "Save"
+                        }
+                      )
+                    }
+                  ),
+                  /* @__PURE__ */ e.jsx(
+                    u,
+                    {
+                      type: "button",
+                      variant: "outline",
+                      className: "h-10 px-8 font-bold border border-slate-200 hover:bg-slate-50 text-slate-700 shrink-0 rounded-md transition-all",
+                      style: { minWidth: "100px" },
+                      onClick: c,
+                      children: "Cancel"
+                    }
+                  )
+                ] })
+              ] })
+            ]
+          }
+        )
+      ]
+    }
+  );
+  return E(F, document.body);
+};
+export {
+  _ as EzEventModal
+};