ezux 1.1.13 → 1.1.15

package/dist/EzEventModal-MDtx4Gwd.js

@@ -0,0 +1,720 @@
+import { t as e } from "./rolldown-runtime-CAFD8bLK.js";
+import { t } from "./utils-hFRduYmq.js";
+import { t as n } from "./button-BN0DK137.js";
+import { t as r } from "./input-BE8Mmo8X.js";
+import { t as i } from "./label-BLMeK8-Z.js";
+import { t as a } from "./date-time-picker-C6i4TdP7.js";
+import { useEffect as o } from "react";
+import { Paperclip as s, Trash2 as c, X as l } from "lucide-react";
+import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
+import { useForm as p } from "@tanstack/react-form";
+import { createPortal as m } from "react-dom";
+//#region src/components/EzScheduler/components/EzEventModal.tsx
+var h = /* @__PURE__ */ e({ EzEventModal: () => _ }), g = [
+	{
+		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: e, onClose: h, mode: _, event: v, onSave: y, onDelete: b, locale: x, editorTemplate: S, headerTemplate: C, footerTemplate: w }) => {
+	let T = p({
+		defaultValues: {
+			title: v?.title || "",
+			start: v?.start,
+			end: v?.end,
+			resourceIds: v?.resourceIds || (v?.resourceId ? [v.resourceId] : []) || [],
+			location: v?.location || "",
+			isAllDay: !!v?.allDay || !!v?.isAllDay || !1,
+			description: v?.description || "",
+			isTimezoneEnabled: !!v?.timezone,
+			startTimezone: v?.timezone?.start || "Asia/Calcutta",
+			endTimezone: v?.timezone?.end || "Asia/Calcutta",
+			repeatFrequency: v?.recurrence?.frequency || "Never",
+			repeatInterval: v?.recurrence?.interval || 1,
+			repeatDays: v?.recurrence?.days || [],
+			repeatBy: v?.recurrence?.repeatBy || "day",
+			repeatEndLevel: v?.recurrence?.end || "Never",
+			repeatEndCount: v?.recurrence?.endCount || 1,
+			repeatEndUntil: v?.recurrence?.endUntil,
+			attachments: v?.attachments || []
+		},
+		onSubmit: async ({ value: e }) => {
+			y({
+				...v,
+				title: e.title,
+				start: e.start,
+				end: e.end,
+				resourceId: e.resourceIds[0],
+				resourceIds: e.resourceIds,
+				location: e.location,
+				allDay: e.isAllDay,
+				description: e.description,
+				timezone: e.isTimezoneEnabled ? {
+					start: e.startTimezone,
+					end: e.endTimezone
+				} : void 0,
+				recurrence: e.repeatFrequency === "Never" ? void 0 : {
+					frequency: e.repeatFrequency,
+					interval: e.repeatInterval,
+					unit: e.repeatFrequency.replace("ly", "") + "(s)",
+					end: e.repeatEndLevel,
+					endCount: e.repeatEndLevel === "Count" ? e.repeatEndCount : void 0,
+					endUntil: e.repeatEndLevel === "Until" ? e.repeatEndUntil : void 0,
+					days: e.repeatFrequency === "Weekly" ? e.repeatDays : void 0,
+					repeatBy: e.repeatFrequency === "Monthly" || e.repeatFrequency === "Yearly" ? e.repeatBy : void 0
+				},
+				attachments: e.attachments
+			}), h();
+		}
+	});
+	if (o(() => {
+		e && T.reset();
+	}, [
+		e,
+		v,
+		T
+	]), !e) return null;
+	let E = (e) => {
+		e.preventDefault(), e.stopPropagation(), T.handleSubmit();
+	}, D = _ === "view";
+	return m(/* @__PURE__ */ f("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__ */ d("div", {
+			style: {
+				position: "absolute",
+				inset: 0
+			},
+			onClick: h
+		}), /* @__PURE__ */ f("div", {
+			className: t("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__ */ d("div", {
+					className: "flex items-center justify-between shrink-0 bg-background",
+					style: { padding: "16px 40px" },
+					children: C ? C(v || {}, _) : /* @__PURE__ */ f(u, { children: [/* @__PURE__ */ f("h2", {
+						className: "text-xl font-bold tracking-tight text-foreground",
+						children: [
+							_ === "create" && "New Event",
+							_ === "edit" && "Edit Event",
+							_ === "view" && "Event Details"
+						]
+					}), /* @__PURE__ */ d(n, {
+						variant: "ghost",
+						size: "icon",
+						className: "h-9 w-9 rounded-full hover:bg-muted text-muted-foreground mr-[-8px]",
+						onClick: h,
+						children: /* @__PURE__ */ d(l, { className: "w-5 h-5" })
+					})] })
+				}),
+				S ? /* @__PURE__ */ d("div", {
+					className: "overflow-y-auto custom-scrollbar flex-1 bg-background",
+					style: { padding: "8px 40px 32px 40px" },
+					children: S(v || {})
+				}) : /* @__PURE__ */ f("form", {
+					onSubmit: E,
+					className: "space-y-6 overflow-y-auto custom-scrollbar flex-1 bg-background",
+					style: { padding: "8px 40px 32px 40px" },
+					children: [
+						/* @__PURE__ */ f("div", {
+							className: "grid grid-cols-1 md:grid-cols-2 gap-6",
+							children: [/* @__PURE__ */ d(T.Field, {
+								name: "title",
+								validators: { onChange: ({ value: e }) => e ? void 0 : "Title is required" },
+								children: (e) => /* @__PURE__ */ f("div", {
+									className: "space-y-2",
+									children: [
+										/* @__PURE__ */ d(i, {
+											htmlFor: "title",
+											className: "text-[13px] font-semibold text-foreground/70",
+											children: "Title"
+										}),
+										/* @__PURE__ */ d(r, {
+											id: "title",
+											placeholder: "Add title",
+											value: e.state.value,
+											onChange: (t) => e.handleChange(t.target.value),
+											onBlur: e.handleBlur,
+											disabled: D,
+											className: t("h-10 rounded-md border-border focus-visible:border-primary focus-visible:ring-1 focus-visible:ring-primary/20 bg-background transition-all", e.state.meta.errors.length > 0 && "border-destructive focus-visible:border-destructive ring-destructive/20")
+										}),
+										e.state.meta.errors.length > 0 && /* @__PURE__ */ d("p", {
+											className: "text-[12px] font-medium text-destructive mt-1.5 animate-in fade-in slide-in-from-top-1",
+											children: e.state.meta.errors.join(", ")
+										})
+									]
+								})
+							}), /* @__PURE__ */ d(T.Field, {
+								name: "location",
+								children: (e) => /* @__PURE__ */ f("div", {
+									className: "space-y-2",
+									children: [/* @__PURE__ */ d(i, {
+										htmlFor: "location",
+										className: "text-[13px] font-semibold text-foreground/70",
+										children: "Location"
+									}), /* @__PURE__ */ d(r, {
+										id: "location",
+										placeholder: "Add location",
+										value: e.state.value,
+										onChange: (t) => e.handleChange(t.target.value),
+										disabled: D,
+										className: "h-10 rounded-md border-border focus-visible:border-primary focus-visible:ring-1 focus-visible:ring-primary/20 bg-background transition-all"
+									})]
+								})
+							})]
+						}),
+						/* @__PURE__ */ f("div", {
+							className: "grid grid-cols-1 md:grid-cols-2 gap-6",
+							children: [/* @__PURE__ */ d(T.Field, {
+								name: "start",
+								validators: { onChange: ({ value: e }) => e ? void 0 : "Start date is required" },
+								children: (e) => /* @__PURE__ */ f("div", {
+									className: "space-y-2",
+									children: [
+										/* @__PURE__ */ d(i, {
+											className: "text-[13px] font-semibold text-foreground/70",
+											children: "Start"
+										}),
+										/* @__PURE__ */ d(a, {
+											date: e.state.value,
+											setDate: (t) => e.handleChange(t),
+											disabled: D,
+											required: !0,
+											locale: x,
+											mode: T.getFieldValue("isAllDay") ? "date" : "datetime",
+											className: "border-border focus-visible:border-primary focus-visible:ring-1 focus-visible:ring-primary/20"
+										}),
+										e.state.meta.errors.length > 0 && /* @__PURE__ */ d("p", {
+											className: "text-[12px] font-medium text-destructive mt-1.5",
+											children: e.state.meta.errors.join(", ")
+										})
+									]
+								})
+							}), /* @__PURE__ */ d(T.Field, {
+								name: "end",
+								validators: { onChange: ({ value: e, fieldApi: t }) => {
+									if (!e) return "End date is required";
+									let n = t.form.getFieldValue("start");
+									if (n && e <= n) return "End time must be after start time";
+								} },
+								children: (e) => /* @__PURE__ */ f("div", {
+									className: "space-y-2",
+									children: [
+										/* @__PURE__ */ d(i, {
+											className: "text-[13px] font-semibold text-foreground/70",
+											children: "End"
+										}),
+										/* @__PURE__ */ d(a, {
+											date: e.state.value,
+											setDate: (t) => e.handleChange(t),
+											disabled: D,
+											required: !0,
+											locale: x,
+											mode: T.getFieldValue("isAllDay") ? "date" : "datetime",
+											minDate: T.getFieldValue("start"),
+											className: t("border-border focus-visible:border-primary focus-visible:ring-1 focus-visible:ring-primary/20", e.state.meta.errors.length > 0 && "border-destructive focus-visible:border-destructive ring-destructive/20")
+										}),
+										e.state.meta.errors.length > 0 && /* @__PURE__ */ d("p", {
+											className: "text-[12px] font-medium text-destructive mt-1.5 animate-in fade-in slide-in-from-top-1",
+											children: e.state.meta.errors.join(", ")
+										})
+									]
+								})
+							})]
+						}),
+						/* @__PURE__ */ f("div", {
+							className: "grid grid-cols-1 md:grid-cols-2 gap-6",
+							children: [/* @__PURE__ */ d(T.Field, {
+								name: "isAllDay",
+								children: (e) => /* @__PURE__ */ d("div", {
+									className: "flex items-center h-10",
+									children: /* @__PURE__ */ f("label", {
+										className: "flex items-center space-x-3 cursor-pointer group select-none",
+										children: [/* @__PURE__ */ d("input", {
+											type: "checkbox",
+											checked: e.state.value,
+											onChange: (t) => e.handleChange(t.target.checked),
+											disabled: D,
+											className: "h-4 w-4 rounded border-border/50 text-primary focus:ring-primary/30 accent-primary transition-all cursor-pointer"
+										}), /* @__PURE__ */ d("span", {
+											className: "text-[14px] font-medium text-foreground/70 group-hover:text-foreground",
+											children: "All day event"
+										})]
+									})
+								})
+							}), /* @__PURE__ */ d(T.Field, {
+								name: "isTimezoneEnabled",
+								children: (e) => /* @__PURE__ */ d("div", {
+									className: "flex items-center h-10",
+									children: /* @__PURE__ */ f("label", {
+										className: "flex items-center space-x-3 cursor-pointer group select-none",
+										children: [/* @__PURE__ */ d("input", {
+											type: "checkbox",
+											checked: e.state.value,
+											onChange: (t) => e.handleChange(t.target.checked),
+											disabled: D,
+											className: "h-4 w-4 rounded border-border/50 text-primary focus:ring-primary/30 accent-primary transition-all cursor-pointer"
+										}), /* @__PURE__ */ d("span", {
+											className: "text-[14px] font-medium text-foreground/70 group-hover:text-foreground",
+											children: "Enable timezone"
+										})]
+									})
+								})
+							})]
+						}),
+						/* @__PURE__ */ d(T.Subscribe, {
+							selector: (e) => [e.values.isTimezoneEnabled],
+							children: ([e]) => e && /* @__PURE__ */ f("div", {
+								className: "grid grid-cols-1 md:grid-cols-2 gap-6 p-6 bg-highlight/50 rounded-lg border border-border animate-in slide-in-from-top-2 duration-300",
+								children: [/* @__PURE__ */ d(T.Field, {
+									name: "startTimezone",
+									children: (e) => /* @__PURE__ */ f("div", {
+										className: "space-y-2",
+										children: [/* @__PURE__ */ d(i, {
+											className: "text-[13px] font-semibold text-foreground/70",
+											children: "Start Timezone"
+										}), /* @__PURE__ */ f("select", {
+											className: "w-full h-10 px-3 rounded-md border-border 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: e.state.value,
+											onChange: (t) => e.handleChange(t.target.value),
+											children: [
+												/* @__PURE__ */ d("option", {
+													value: "Asia/Calcutta",
+													children: "Asia/Calcutta"
+												}),
+												/* @__PURE__ */ d("option", {
+													value: "UTC",
+													children: "UTC"
+												}),
+												/* @__PURE__ */ d("option", {
+													value: "America/New_York",
+													children: "America/New_York"
+												})
+											]
+										})]
+									})
+								}), /* @__PURE__ */ d(T.Field, {
+									name: "endTimezone",
+									children: (e) => /* @__PURE__ */ f("div", {
+										className: "space-y-2",
+										children: [/* @__PURE__ */ d(i, {
+											className: "text-[13px] font-semibold text-foreground/70",
+											children: "End Timezone"
+										}), /* @__PURE__ */ f("select", {
+											className: "w-full h-10 px-3 rounded-md border-border 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: e.state.value,
+											onChange: (t) => e.handleChange(t.target.value),
+											children: [
+												/* @__PURE__ */ d("option", {
+													value: "Asia/Calcutta",
+													children: "Asia/Calcutta"
+												}),
+												/* @__PURE__ */ d("option", {
+													value: "UTC",
+													children: "UTC"
+												}),
+												/* @__PURE__ */ d("option", {
+													value: "America/New_York",
+													children: "America/New_York"
+												})
+											]
+										})]
+									})
+								})]
+							})
+						}),
+						/* @__PURE__ */ f("div", {
+							className: "grid grid-cols-1 md:grid-cols-2 gap-6",
+							children: [/* @__PURE__ */ d(T.Field, {
+								name: "repeatFrequency",
+								children: (e) => /* @__PURE__ */ f("div", {
+									className: "space-y-2",
+									children: [/* @__PURE__ */ d(i, {
+										className: "text-[13px] font-semibold text-foreground/70",
+										children: "Repeat"
+									}), /* @__PURE__ */ f("select", {
+										className: "w-full h-10 px-3 rounded-md border-border 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: e.state.value,
+										onChange: (t) => e.handleChange(t.target.value),
+										children: [
+											/* @__PURE__ */ d("option", {
+												value: "Never",
+												children: "Never"
+											}),
+											/* @__PURE__ */ d("option", {
+												value: "Daily",
+												children: "Daily"
+											}),
+											/* @__PURE__ */ d("option", {
+												value: "Weekly",
+												children: "Weekly"
+											}),
+											/* @__PURE__ */ d("option", {
+												value: "Monthly",
+												children: "Monthly"
+											}),
+											/* @__PURE__ */ d("option", {
+												value: "Yearly",
+												children: "Yearly"
+											})
+										]
+									})]
+								})
+							}), /* @__PURE__ */ d(T.Subscribe, {
+								selector: (e) => [e.values.repeatFrequency],
+								children: ([e]) => e !== "Never" && /* @__PURE__ */ d(T.Field, {
+									name: "repeatEndLevel",
+									children: (e) => /* @__PURE__ */ f("div", {
+										className: "space-y-2 animate-in slide-in-from-top-2 duration-300",
+										children: [/* @__PURE__ */ d(i, {
+											className: "text-[13px] font-semibold text-foreground/70",
+											children: "End"
+										}), /* @__PURE__ */ f("select", {
+											className: "w-full h-10 px-3 rounded-md border-border 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: e.state.value,
+											onChange: (t) => e.handleChange(t.target.value),
+											children: [
+												/* @__PURE__ */ d("option", {
+													value: "Never",
+													children: "Never"
+												}),
+												/* @__PURE__ */ d("option", {
+													value: "Until",
+													children: "Until"
+												}),
+												/* @__PURE__ */ d("option", {
+													value: "Count",
+													children: "Count"
+												})
+											]
+										})]
+									})
+								})
+							})]
+						}),
+						/* @__PURE__ */ d(T.Subscribe, {
+							selector: (e) => [e.values.repeatFrequency, e.values.repeatEndLevel],
+							children: ([e, t]) => e !== "Never" && /* @__PURE__ */ f("div", {
+								className: "grid grid-cols-1 md:grid-cols-2 gap-6 animate-in slide-in-from-top-2 duration-300",
+								children: [
+									/* @__PURE__ */ d(T.Field, {
+										name: "repeatInterval",
+										children: (t) => /* @__PURE__ */ f("div", {
+											className: "space-y-2",
+											children: [/* @__PURE__ */ d(i, {
+												className: "text-[13px] font-semibold text-foreground/70",
+												children: "Repeat every"
+											}), /* @__PURE__ */ f("div", {
+												className: "flex items-center gap-3",
+												children: [/* @__PURE__ */ d("select", {
+													className: "flex-1 h-10 px-3 rounded-md border-border 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: (e) => t.handleChange(parseInt(e.target.value)),
+													children: [
+														1,
+														2,
+														3,
+														4,
+														5,
+														6,
+														7,
+														8,
+														9,
+														10,
+														11,
+														12,
+														13,
+														14,
+														15,
+														20,
+														30
+													].map((e) => /* @__PURE__ */ d("option", {
+														value: e,
+														children: e
+													}, e))
+												}), /* @__PURE__ */ d("span", {
+													className: "text-sm font-medium text-muted-foreground whitespace-nowrap",
+													children: e === "Daily" ? "Day(s)" : e.replace("ly", "") + "(s)"
+												})]
+											})]
+										})
+									}),
+									t === "Until" && /* @__PURE__ */ d(T.Field, {
+										name: "repeatEndUntil",
+										children: (e) => /* @__PURE__ */ f("div", {
+											className: "space-y-2 animate-in slide-in-from-top-1",
+											children: [/* @__PURE__ */ d(i, {
+												className: "text-[13px] font-semibold text-foreground/70",
+												children: "Until"
+											}), /* @__PURE__ */ d(a, {
+												date: e.state.value,
+												setDate: (t) => e.handleChange(t),
+												disabled: D,
+												locale: x,
+												mode: "date",
+												minDate: T.getFieldValue("start"),
+												className: "border-border focus:border-primary"
+											})]
+										})
+									}),
+									t === "Count" && /* @__PURE__ */ d(T.Field, {
+										name: "repeatEndCount",
+										children: (e) => /* @__PURE__ */ f("div", {
+											className: "space-y-2 animate-in slide-in-from-top-1",
+											children: [/* @__PURE__ */ d(i, {
+												className: "text-[13px] font-semibold text-foreground/70",
+												children: "Occurrences"
+											}), /* @__PURE__ */ d(r, {
+												type: "number",
+												min: 1,
+												value: e.state.value,
+												onChange: (t) => e.handleChange(parseInt(t.target.value)),
+												className: "h-10 rounded-md border-border focus-visible:border-primary focus-visible:ring-1 focus-visible:ring-primary/20 bg-background transition-all"
+											})]
+										})
+									})
+								]
+							})
+						}),
+						/* @__PURE__ */ d(T.Subscribe, {
+							selector: (e) => [e.values.repeatFrequency],
+							children: ([e]) => e === "Weekly" && /* @__PURE__ */ d(T.Field, {
+								name: "repeatDays",
+								children: (e) => /* @__PURE__ */ f("div", {
+									className: "space-y-3 animate-in fade-in duration-300",
+									children: [/* @__PURE__ */ d(i, {
+										className: "text-[13px] font-semibold text-foreground/70",
+										children: "Repeat On"
+									}), /* @__PURE__ */ d("div", {
+										className: "flex flex-wrap gap-2",
+										children: g.map((n) => /* @__PURE__ */ d("button", {
+											type: "button",
+											onClick: () => {
+												let t = e.state.value || [];
+												t.includes(n.value) ? e.handleChange(t.filter((e) => e !== n.value)) : e.handleChange([...t, n.value]);
+											},
+											className: t("w-9 h-9 rounded-full flex items-center justify-center text-sm font-bold transition-all border", (e.state.value || []).includes(n.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: n.label
+										}, n.value))
+									})]
+								})
+							})
+						}),
+						/* @__PURE__ */ d(T.Subscribe, {
+							selector: (e) => [e.values.repeatFrequency],
+							children: ([e]) => (e === "Monthly" || e === "Yearly") && /* @__PURE__ */ d(T.Field, {
+								name: "repeatBy",
+								children: (e) => /* @__PURE__ */ f("div", {
+									className: "space-y-4 animate-in fade-in duration-300",
+									children: [/* @__PURE__ */ d(i, {
+										className: "text-[13px] font-semibold text-foreground/70",
+										children: "Repeat On"
+									}), /* @__PURE__ */ f("div", {
+										className: "space-y-3",
+										children: [/* @__PURE__ */ f("label", {
+											className: "flex items-center space-x-3 cursor-pointer group",
+											children: [/* @__PURE__ */ d("input", {
+												type: "radio",
+												name: "repeatBy",
+												checked: e.state.value === "day",
+												onChange: () => e.handleChange("day"),
+												className: "h-4 w-4 border-border text-primary focus:ring-primary"
+											}), /* @__PURE__ */ d("span", {
+												className: "text-sm text-foreground/80",
+												children: "Day of the month"
+											})]
+										}), /* @__PURE__ */ f("label", {
+											className: "flex items-center space-x-3 cursor-pointer group",
+											children: [/* @__PURE__ */ d("input", {
+												type: "radio",
+												name: "repeatBy",
+												checked: e.state.value === "ordinal",
+												onChange: () => e.handleChange("ordinal"),
+												className: "h-4 w-4 border-border text-primary focus:ring-primary"
+											}), /* @__PURE__ */ d("span", {
+												className: "text-sm text-foreground/80",
+												children: "Ordinal position"
+											})]
+										})]
+									})]
+								})
+							})
+						}),
+						/* @__PURE__ */ d(T.Field, {
+							name: "description",
+							children: (e) => /* @__PURE__ */ f("div", {
+								className: "space-y-2",
+								children: [/* @__PURE__ */ d(i, {
+									htmlFor: "description",
+									className: "text-[13px] font-semibold text-foreground/70",
+									children: "Description"
+								}), /* @__PURE__ */ d("textarea", {
+									id: "description",
+									placeholder: "Add description",
+									className: "flex min-h-[100px] w-full rounded-md border-border 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-border",
+									value: e.state.value,
+									onChange: (t) => e.handleChange(t.target.value),
+									disabled: D
+								})]
+							})
+						}),
+						/* @__PURE__ */ d(T.Field, {
+							name: "attachments",
+							children: (e) => /* @__PURE__ */ f("div", {
+								className: "space-y-4 pt-4 pb-2",
+								children: [/* @__PURE__ */ f("div", {
+									className: "flex items-center justify-between",
+									children: [
+										/* @__PURE__ */ f(i, {
+											className: "text-[13px] font-semibold text-foreground/70 flex items-center gap-2",
+											children: [/* @__PURE__ */ d(s, { className: "w-4 h-4" }), " Attachments"]
+										}),
+										/* @__PURE__ */ d("input", {
+											type: "file",
+											id: "file-upload",
+											multiple: !0,
+											className: "hidden",
+											onChange: (t) => {
+												t.target.files && e.handleChange([...e.state.value || [], ...Array.from(t.target.files)]);
+											}
+										}),
+										/* @__PURE__ */ f(n, {
+											type: "button",
+											variant: "outline",
+											size: "sm",
+											className: "h-8 text-xs font-semibold gap-2 border-dashed border-border/50 hover:border-primary/40 hover:text-primary transition-all",
+											onClick: () => document.getElementById("file-upload")?.click(),
+											children: [/* @__PURE__ */ d(s, { className: "w-3 h-3" }), " Add Files"]
+										})
+									]
+								}), (e.state.value || []).length > 0 && /* @__PURE__ */ d("div", {
+									className: "grid grid-cols-1 gap-3",
+									children: (e.state.value || []).map((t, r) => /* @__PURE__ */ f("div", {
+										className: "flex items-center justify-between p-3 rounded-lg bg-highlight border border-border group hover:border-border transition-all",
+										children: [/* @__PURE__ */ f("div", {
+											className: "flex items-center gap-3 overflow-hidden",
+											children: [/* @__PURE__ */ d("div", {
+												className: "w-9 h-9 rounded-md bg-white border border-border flex items-center justify-center shrink-0 shadow-sm",
+												children: /* @__PURE__ */ d(s, { className: "w-4 h-4 text-muted-foreground" })
+											}), /* @__PURE__ */ f("div", {
+												className: "flex flex-col overflow-hidden",
+												children: [/* @__PURE__ */ d("span", {
+													className: "text-[13px] font-medium text-foreground truncate",
+													children: t.name
+												}), /* @__PURE__ */ d("span", {
+													className: "text-[11px] text-muted-foreground font-medium",
+													children: typeof t.size == "number" ? `${(t.size / 1024).toFixed(1)} KB` : "Attachment"
+												})]
+											})]
+										}), /* @__PURE__ */ d(n, {
+											type: "button",
+											variant: "ghost",
+											size: "icon",
+											className: "h-8 w-8 text-muted-foreground/50 hover:text-destructive hover:bg-destructive/10 opacity-0 group-hover:opacity-100 transition-all",
+											onClick: () => e.handleChange((e.state.value || []).filter((e, t) => t !== r)),
+											children: /* @__PURE__ */ d(c, { className: "w-4 h-4" })
+										})]
+									}, r))
+								})]
+							})
+						})
+					]
+				}),
+				w ? w(v || {}, _, () => E({}), h) : /* @__PURE__ */ f("div", {
+					style: {
+						display: "flex",
+						alignItems: "center",
+						justifyContent: "flex-end",
+						padding: "24px 40px",
+						backgroundColor: "var(--highlight)",
+						gap: "12px",
+						width: "100%",
+						flexShrink: 0
+					},
+					children: [!D && b && _ === "edit" && /* @__PURE__ */ d(n, {
+						type: "button",
+						variant: "ghost",
+						className: "text-destructive hover:bg-destructive/10 hover:text-destructive h-10 px-5 font-bold mr-auto",
+						onClick: () => {
+							b(v?.id), h();
+						},
+						children: "Delete"
+					}), /* @__PURE__ */ f("div", {
+						style: {
+							display: "flex",
+							alignItems: "center",
+							gap: "12px"
+						},
+						children: [!D && /* @__PURE__ */ d(T.Subscribe, {
+							selector: (e) => [e.canSubmit, e.isSubmitting],
+							children: ([e, t]) => /* @__PURE__ */ d(n, {
+								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: !e || t,
+								onClick: (e) => {
+									e.preventDefault(), e.stopPropagation(), T.handleSubmit();
+								},
+								children: t ? "Saving..." : "Save"
+							})
+						}), /* @__PURE__ */ d(n, {
+							type: "button",
+							variant: "outline",
+							className: "h-10 px-8 font-bold border border-border hover:bg-highlight text-foreground shrink-0 rounded-md transition-all",
+							style: { minWidth: "100px" },
+							onClick: h,
+							children: "Cancel"
+						})]
+					})]
+				})
+			]
+		})]
+	}), document.body);
+};
+//#endregion
+export { h as n, _ as t };