chesai-ui 0.16.9 → 0.16.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/components/full-calendar/event-popover.mjs +270 -522
  2. package/dist/components/full-calendar/index.d.ts +1 -0
  3. package/dist/components/full-calendar/recurrence-dialog.d.ts +10 -0
  4. package/dist/components/full-calendar/recurrence-dialog.mjs +386 -0
  5. package/dist/components/full-calendar/types.d.ts +6 -0
  6. package/dist/components/full-calendar/utils.mjs +153 -139
  7. package/dist/index.mjs +285 -283
  8. package/package.json +16 -16
package/dist/components/full-calendar/event-popover.mjs CHANGED
@@ -1,219 +1,145 @@
1
- import { jsxs as r, jsx as t, Fragment as R } from "react/jsx-runtime";
2
- import { useMediaQuery as me } from "@uidotdev/usehooks";
3
- import { clsx as H } from "clsx";
1
+ import { jsxs as s, jsx as a, Fragment as N } from "react/jsx-runtime";
2
+ import { useMediaQuery as Z } from "@uidotdev/usehooks";
4
3
  import { format as W } from "date-fns";
5
- import { useDragControls as fe, useMotionValue as L, AnimatePresence as Q, motion as S } from "framer-motion";
6
- import { Clock as he, Repeat as pe, X as U, Trash2 as J, GripHorizontal as ye } from "lucide-react";
7
- import { useRef as ve, useState as O, useEffect as K } from "react";
8
- import { createPortal as P } from "react-dom";
9
- import { Button as M } from "../button/index.mjs";
10
- import { DatePicker as z } from "../date-picker/date-picker.mjs";
11
- import { IconButton as x } from "../icon-button/index.mjs";
12
- import { Input as ge } from "../input/index.mjs";
13
- import { Sheet as xe, SheetContent as we, SheetHeader as be, SheetTitle as Ne } from "../sheet/index.mjs";
14
- import { TimePicker as Z } from "../time-picker/index.mjs";
15
- import { Typography as w } from "../typography/index.mjs";
16
- import { Switch as ke } from "../switch/index.mjs";
17
- import { Select as ee } from "../select/index.mjs";
18
- import { NumberInput as te } from "../number-input/index.mjs";
19
- import { useFullCalendar as De } from "./calendar-context.mjs";
20
- const b = 380, Ce = (s, i) => {
21
- const o = s.frequency, a = s.interval;
22
- let d = "";
23
- if (a > 1 ? d = `Every ${a} ${o === "daily" ? "days" : o === "weekly" ? "weeks" : o === "monthly" ? "months" : "years"}` : d = o === "daily" ? "Daily" : o === "weekly" ? "Weekly" : o === "monthly" ? "Monthly" : "Annually", o === "weekly" && s.daysOfWeek && s.daysOfWeek.length > 0) {
24
- const N = [
25
- "Sunday",
26
- "Monday",
27
- "Tuesday",
28
- "Wednesday",
29
- "Thursday",
30
- "Friday",
31
- "Saturday"
32
- ];
33
- s.daysOfWeek.length === 7 ? d = a > 1 ? `Every ${a} weeks on all days` : "Every day" : s.daysOfWeek.length === 5 && [1, 2, 3, 4, 5].every((y) => s.daysOfWeek.includes(y)) ? d = a > 1 ? `Every ${a} weeks on weekdays` : "Every weekday (Monday to Friday)" : d += ` on ${s.daysOfWeek.map((y) => N[y]).join(", ")}`;
34
- } else o === "monthly" ? d += ` on day ${i.getDate()}` : o === "yearly" && (d += ` on ${W(i, "MMM d")}`);
35
- return s.endType === "on_date" && s.until ? d += `, until ${W(s.until, "MMM d, yyyy")}` : s.endType === "after_occurrences" && s.count && (d += `, for ${s.count} occurrences`), d;
36
- }, A = ({
37
- checked: s,
38
- onChange: i,
39
- label: o,
40
- children: a
41
- }) => /* @__PURE__ */ r("div", { className: "flex items-center gap-4 h-10 w-full", children: [
42
- /* @__PURE__ */ r("label", { className: "flex items-center gap-3 cursor-pointer shrink-0", children: [
43
- /* @__PURE__ */ r("div", { className: "relative flex items-center justify-center w-5 h-5 shrink-0", children: [
44
- /* @__PURE__ */ t(
45
- "input",
46
- {
47
- type: "radio",
48
- className: "peer sr-only",
49
- checked: s,
50
- onChange: i
51
- }
52
- ),
53
- /* @__PURE__ */ t(
54
- "div",
55
- {
56
- className: H(
57
- "w-5 h-5 rounded-full border-2 transition-colors",
58
- s ? "border-primary" : "border-outline-variant hover:border-on-surface-variant"
59
- )
60
- }
61
- ),
62
- /* @__PURE__ */ t(
63
- "div",
64
- {
65
- className: H(
66
- "absolute w-2.5 h-2.5 rounded-full bg-primary transition-transform duration-200",
67
- s ? "scale-100" : "scale-0"
68
- )
69
- }
70
- )
71
- ] }),
72
- /* @__PURE__ */ t("span", { className: "text-sm font-medium text-on-surface select-none", children: o })
73
- ] }),
74
- a && /* @__PURE__ */ t("div", { className: "flex-1 flex items-center", children: a })
75
- ] }), Be = () => {
76
- const s = De(), {
4
+ import { useDragControls as ee, useMotionValue as Y, AnimatePresence as te, motion as ae } from "framer-motion";
5
+ import { Clock as re, Repeat as ne, X as T, Trash2 as V, GripHorizontal as ie } from "lucide-react";
6
+ import { useRef as se, useState as D, useEffect as q } from "react";
7
+ import { Button as j } from "../button/index.mjs";
8
+ import { DatePicker as B } from "../date-picker/date-picker.mjs";
9
+ import { IconButton as m } from "../icon-button/index.mjs";
10
+ import { Input as le } from "../input/index.mjs";
11
+ import { Sheet as oe, SheetContent as ce, SheetHeader as de, SheetTitle as ue } from "../sheet/index.mjs";
12
+ import { TimePicker as I } from "../time-picker/index.mjs";
13
+ import { Switch as fe } from "../switch/index.mjs";
14
+ import { Select as he } from "../select/index.mjs";
15
+ import { useFullCalendar as me } from "./calendar-context.mjs";
16
+ import { RecurrenceDialog as _ } from "./recurrence-dialog.mjs";
17
+ const p = 380, Pe = () => {
18
+ const $ = me(), {
77
19
  popover: i,
78
- closePopover: o,
79
- draftEvent: a,
80
- setDraftEvent: d,
81
- onEventCreate: N,
82
- onEventUpdate: y,
83
- onEventDelete: q,
84
- hidePopoverTitle: ae,
85
- hidePopoverTime: ne,
86
- hidePopoverRecurrence: re,
87
- renderPopoverHeader: Y,
88
- renderPopoverFooter: j,
89
- renderPopoverCustomFields: V
90
- } = s, v = me("(max-width: 768px)"), E = ve(null), _ = fe(), k = L(0), D = L(0), [ie, C] = O(!1), [g, le] = O(450), [c, m] = O({
91
- frequency: "weekly",
92
- interval: 1,
93
- daysOfWeek: [],
94
- endType: "never",
95
- count: 13,
96
- until: new Date(Date.now() + 720 * 60 * 60 * 1e3)
97
- });
98
- K(() => {
99
- if (!i.isOpen || v || typeof window > "u" || !window.ResizeObserver)
20
+ closePopover: c,
21
+ draftEvent: t,
22
+ setDraftEvent: k,
23
+ onEventCreate: C,
24
+ onEventUpdate: O,
25
+ onEventDelete: M,
26
+ hidePopoverTitle: X,
27
+ hidePopoverTime: G,
28
+ hidePopoverRecurrence: L,
29
+ renderPopoverHeader: E,
30
+ renderPopoverFooter: F,
31
+ renderPopoverCustomFields: R
32
+ } = $, d = Z("(max-width: 768px)"), y = se(null), P = ee(), v = Y(0), g = Y(0), [S, x] = D(!1), [u, Q] = D(450);
33
+ q(() => {
34
+ if (!i.isOpen || d || typeof window > "u" || !window.ResizeObserver)
100
35
  return;
101
- const e = new ResizeObserver((n) => {
102
- for (const l of n)
103
- le(l.target.getBoundingClientRect().height);
36
+ const e = new ResizeObserver((r) => {
37
+ for (const n of r)
38
+ Q(n.target.getBoundingClientRect().height);
104
39
  });
105
- return E.current && e.observe(E.current), () => e.disconnect();
106
- }, [i.isOpen, v]), K(() => {
107
- if (i.isOpen && !v) {
108
- const n = window.innerWidth, l = window.innerHeight;
40
+ return y.current && e.observe(y.current), () => e.disconnect();
41
+ }, [i.isOpen, d]), q(() => {
42
+ if (i.isOpen && !d) {
43
+ const r = window.innerWidth, n = window.innerHeight;
109
44
  if (i.anchorRect) {
110
- let p = i.anchorRect.right + 16, f = i.anchorRect.top;
111
- p + b > n && (p = i.anchorRect.left - b - 16), f + g > l && (f = l - g - 16), p = Math.max(
45
+ let f = i.anchorRect.right + 16, h = i.anchorRect.top;
46
+ f + p > r && (f = i.anchorRect.left - p - 16), h + u > n && (h = n - u - 16), f = Math.max(
112
47
  16,
113
- Math.min(p, n - b - 16)
114
- ), f = Math.max(
48
+ Math.min(f, r - p - 16)
49
+ ), h = Math.max(
115
50
  16,
116
- Math.min(f, l - g - 16)
117
- ), k.set(p), D.set(f);
51
+ Math.min(h, n - u - 16)
52
+ ), v.set(f), g.set(h);
118
53
  } else
119
- k.set(n / 2 - b / 2), D.set(l / 2 - g / 2);
54
+ v.set(r / 2 - p / 2), g.set(n / 2 - u / 2);
120
55
  }
121
- }, [i.isOpen, i.anchorRect, v, g, k, D]);
122
- const [se, oe] = O(1), $ = async () => {
123
- if (!a) return;
124
- const e = new Date(a.start);
125
- a.isAllDay ? e.setHours(0, 0, 0, 0) : e.setHours(
126
- a.start.getHours(),
127
- a.start.getMinutes(),
56
+ }, [i.isOpen, i.anchorRect, d, u, v, g]);
57
+ const [U, J] = D(1), z = async () => {
58
+ if (!t) return;
59
+ const e = new Date(t.start);
60
+ t.isAllDay ? e.setHours(0, 0, 0, 0) : e.setHours(
61
+ t.start.getHours(),
62
+ t.start.getMinutes(),
128
63
  0,
129
64
  0
130
65
  );
131
- const n = new Date(a.end);
132
- a.isAllDay ? n.setHours(23, 59, 59, 999) : n.setHours(
133
- a.end.getHours(),
134
- a.end.getMinutes(),
66
+ const r = new Date(t.end);
67
+ t.isAllDay ? r.setHours(23, 59, 59, 999) : r.setHours(
68
+ t.end.getHours(),
69
+ t.end.getMinutes(),
135
70
  0,
136
71
  0
137
72
  );
138
- const l = {
139
- ...a,
73
+ const n = {
74
+ ...t,
140
75
  start: e,
141
- end: n,
142
- title: a.title || "(No title)"
76
+ end: r,
77
+ title: t.title || "(No title)"
143
78
  };
144
- delete l.isDraft, i.mode === "create" && N ? await N(l) : i.mode === "edit" && y && await y(l), o();
145
- }, I = async () => {
146
- a?.id && q && await q(a.id), o();
147
- }, u = (e) => {
148
- d((n) => n ? { ...n, ...e } : null);
149
- }, T = (e) => {
150
- d((n) => {
151
- if (!n) return null;
152
- const l = e.data !== void 0 ? { ...n.data || {}, ...e.data } : n.data;
153
- return { ...n, ...e, data: l };
79
+ delete n.isDraft, i.mode === "create" && C ? await C(n) : i.mode === "edit" && O && await O(n), c();
80
+ }, H = async () => {
81
+ t?.id && M && await M(t.id), c();
82
+ }, l = (e) => {
83
+ k((r) => r ? { ...r, ...e } : null);
84
+ }, w = (e) => {
85
+ k((r) => {
86
+ if (!r) return null;
87
+ const n = e.data !== void 0 ? { ...r.data || {}, ...e.data } : r.data;
88
+ return { ...r, ...e, data: n };
154
89
  });
155
- }, F = a ? [
90
+ }, b = t ? [
156
91
  { value: "none", label: "Does not repeat" },
157
92
  { value: "daily", label: "Daily" },
158
93
  {
159
94
  value: "weekly",
160
- label: `Weekly on ${W(a.start, "EEEE")}`
95
+ label: `Weekly on ${W(t.start, "EEEE")}`
161
96
  },
162
97
  {
163
98
  value: "monthly",
164
- label: `Monthly on the ${a.start.getDate()}`
99
+ label: `Monthly on the ${t.start.getDate()}`
165
100
  },
166
101
  {
167
102
  value: "yearly",
168
- label: `Annually on ${W(a.start, "MMM d")}`
103
+ label: `Annually on ${W(t.start, "MMM d")}`
169
104
  },
170
105
  { value: "weekdays", label: "Every weekday (Monday to Friday)" }
171
106
  ] : [];
172
- let h = "none";
173
- if (a?.recurrence) {
174
- const e = a.recurrence;
175
- e.interval === 1 && e.endType === "never" && (e.frequency === "daily" ? h = "daily" : e.frequency === "weekly" && e.daysOfWeek?.length === 1 && e.daysOfWeek[0] === a.start.getDay() ? h = "weekly" : e.frequency === "weekly" && e.daysOfWeek?.length === 5 && [1, 2, 3, 4, 5].every((n) => e.daysOfWeek.includes(n)) ? h = "weekdays" : e.frequency === "monthly" ? h = "monthly" : e.frequency === "yearly" && (h = "yearly")), h === "none" && (h = "custom_active", F.push({
107
+ let o = "none";
108
+ if (t?.recurrence) {
109
+ const e = t.recurrence;
110
+ e.interval === 1 && e.endType === "never" && (e.frequency === "daily" ? o = "daily" : e.frequency === "weekly" && e.daysOfWeek?.length === 1 && e.daysOfWeek[0] === t.start.getDay() ? o = "weekly" : e.frequency === "weekly" && e.daysOfWeek?.length === 5 && [1, 2, 3, 4, 5].every((r) => e.daysOfWeek.includes(r)) ? o = "weekdays" : e.frequency === "monthly" ? o = "monthly" : e.frequency === "yearly" && (o = "yearly")), o === "none" && (o = "custom_active", b.push({
176
111
  value: "custom_active",
177
- label: Ce(e, a.start)
112
+ label: "Custom Recurrence"
178
113
  }));
179
114
  }
180
- F.push({ value: "custom", label: "Custom..." });
181
- const ce = (e) => {
182
- e === "none" ? u({ recurrence: void 0 }) : e === "custom" ? (m(
183
- a?.recurrence || {
184
- frequency: "weekly",
185
- interval: 1,
186
- daysOfWeek: [a?.start?.getDay() || 0],
187
- endType: "never",
188
- count: 13,
189
- until: new Date(Date.now() + 720 * 60 * 60 * 1e3)
190
- }
191
- ), C(!0)) : e === "weekdays" ? u({
115
+ b.push({ value: "custom", label: "Custom..." });
116
+ const K = (e) => {
117
+ e === "none" ? l({ recurrence: void 0 }) : e === "custom" ? x(!0) : e === "weekdays" ? l({
192
118
  recurrence: {
193
119
  frequency: "weekly",
194
120
  interval: 1,
195
121
  endType: "never",
196
122
  daysOfWeek: [1, 2, 3, 4, 5]
197
123
  }
198
- }) : e !== "custom_active" && u({
124
+ }) : e !== "custom_active" && l({
199
125
  recurrence: {
200
126
  frequency: e,
201
127
  interval: 1,
202
128
  endType: "never",
203
- daysOfWeek: e === "weekly" ? [a?.start?.getDay() || 0] : void 0
129
+ daysOfWeek: e === "weekly" ? [t?.start?.getDay() || 0] : void 0
204
130
  }
205
131
  });
206
132
  };
207
- if (!a) return null;
208
- const B = /* @__PURE__ */ r("div", { className: "flex flex-col gap-6 p-6 font-manrope text-on-surface min-w-[340px]", children: [
209
- Y && /* @__PURE__ */ t("div", { className: "flex flex-col gap-4", children: Y(a, T) }),
210
- !ae && /* @__PURE__ */ t("div", { className: "pl-10 pr-2", children: /* @__PURE__ */ t(
211
- ge,
133
+ if (!t) return null;
134
+ const A = /* @__PURE__ */ s("div", { className: "flex flex-col gap-6 p-6 font-manrope text-on-surface min-w-[340px]", children: [
135
+ E && /* @__PURE__ */ a("div", { className: "flex flex-col gap-4", children: E(t, w) }),
136
+ !X && /* @__PURE__ */ a("div", { className: "pl-10 pr-2", children: /* @__PURE__ */ a(
137
+ le,
212
138
  {
213
139
  variant: "underlined",
214
140
  placeholder: "Add title",
215
- value: a.title,
216
- onChange: (e) => u({ title: e.target.value }),
141
+ value: t.title,
142
+ onChange: (e) => l({ title: e.target.value }),
217
143
  autoFocus: !0,
218
144
  className: "shadow-none px-0",
219
145
  classNames: {
@@ -222,91 +148,91 @@ const b = 380, Ce = (s, i) => {
222
148
  }
223
149
  }
224
150
  ) }),
225
- !ne && /* @__PURE__ */ r("div", { className: "flex items-start gap-4", children: [
226
- /* @__PURE__ */ t(he, { className: "w-5 h-5 mt-2.5 text-on-surface-variant shrink-0" }),
227
- /* @__PURE__ */ r("div", { className: "flex flex-col gap-3 w-full min-w-0", children: [
228
- /* @__PURE__ */ r("div", { className: "flex items-center gap-1.5 w-full", children: [
229
- /* @__PURE__ */ t(
230
- z,
151
+ !G && /* @__PURE__ */ s("div", { className: "flex items-start gap-4", children: [
152
+ /* @__PURE__ */ a(re, { className: "w-5 h-5 mt-2.5 text-on-surface-variant shrink-0" }),
153
+ /* @__PURE__ */ s("div", { className: "flex flex-col gap-3 w-full min-w-0", children: [
154
+ /* @__PURE__ */ s("div", { className: "flex items-center gap-1.5 w-full", children: [
155
+ /* @__PURE__ */ a(
156
+ B,
231
157
  {
232
158
  variant: "docked",
233
159
  inputVariant: "filled",
234
160
  size: "sm",
235
161
  shape: "full",
236
- value: a.start,
162
+ value: t.start,
237
163
  onChange: (e) => {
238
164
  if (!e) return;
239
- const n = new Date(a.start);
240
- n.setFullYear(
165
+ const r = new Date(t.start);
166
+ r.setFullYear(
241
167
  e.getFullYear(),
242
168
  e.getMonth(),
243
169
  e.getDate()
244
170
  );
245
- let l = new Date(a.end);
246
- a.isAllDay ? a.end < n && l.setFullYear(
171
+ let n = new Date(t.end);
172
+ t.isAllDay ? t.end < r && n.setFullYear(
247
173
  e.getFullYear(),
248
174
  e.getMonth(),
249
175
  e.getDate()
250
- ) : l.setFullYear(
176
+ ) : n.setFullYear(
251
177
  e.getFullYear(),
252
178
  e.getMonth(),
253
179
  e.getDate()
254
- ), u({ start: n, end: l });
180
+ ), l({ start: r, end: n });
255
181
  }
256
182
  }
257
183
  ),
258
- a.isAllDay && /* @__PURE__ */ r(R, { children: [
259
- /* @__PURE__ */ t("span", { className: "text-on-surface-variant shrink-0", children: "-" }),
260
- /* @__PURE__ */ t(
261
- z,
184
+ t.isAllDay && /* @__PURE__ */ s(N, { children: [
185
+ /* @__PURE__ */ a("span", { className: "text-on-surface-variant shrink-0", children: "-" }),
186
+ /* @__PURE__ */ a(
187
+ B,
262
188
  {
263
189
  variant: "docked",
264
190
  inputVariant: "filled",
265
191
  size: "sm",
266
192
  shape: "full",
267
- value: a.end,
193
+ value: t.end,
268
194
  onChange: (e) => {
269
195
  if (!e) return;
270
- const n = new Date(a.end);
271
- if (n.setFullYear(
196
+ const r = new Date(t.end);
197
+ if (r.setFullYear(
272
198
  e.getFullYear(),
273
199
  e.getMonth(),
274
200
  e.getDate()
275
- ), u({ end: n }), a.start > n) {
276
- const l = new Date(a.start);
277
- l.setFullYear(
201
+ ), l({ end: r }), t.start > r) {
202
+ const n = new Date(t.start);
203
+ n.setFullYear(
278
204
  e.getFullYear(),
279
205
  e.getMonth(),
280
206
  e.getDate()
281
- ), u({ start: l });
207
+ ), l({ start: n });
282
208
  }
283
209
  }
284
210
  }
285
211
  )
286
212
  ] })
287
213
  ] }),
288
- /* @__PURE__ */ r("div", { className: "flex items-center gap-2 mt-1 w-fit", children: [
289
- /* @__PURE__ */ t(
290
- ke,
214
+ /* @__PURE__ */ s("div", { className: "flex items-center gap-2 mt-1 w-fit", children: [
215
+ /* @__PURE__ */ a(
216
+ fe,
291
217
  {
292
218
  id: "all-day-switch",
293
219
  size: "sm",
294
- checked: !!a.isAllDay,
220
+ checked: !!t.isAllDay,
295
221
  onCheckedChange: (e) => {
296
222
  if (e)
297
- u({ isAllDay: e });
223
+ l({ isAllDay: e });
298
224
  else {
299
- const n = new Date(a.end);
300
- n.setFullYear(
301
- a.start.getFullYear(),
302
- a.start.getMonth(),
303
- a.start.getDate()
304
- ), u({ isAllDay: e, end: n });
225
+ const r = new Date(t.end);
226
+ r.setFullYear(
227
+ t.start.getFullYear(),
228
+ t.start.getMonth(),
229
+ t.start.getDate()
230
+ ), l({ isAllDay: e, end: r });
305
231
  }
306
232
  }
307
233
  }
308
234
  ),
309
- /* @__PURE__ */ t(
235
+ /* @__PURE__ */ a(
310
236
  "label",
311
237
  {
312
238
  htmlFor: "all-day-switch",
@@ -315,367 +241,189 @@ const b = 380, Ce = (s, i) => {
315
241
  }
316
242
  )
317
243
  ] }),
318
- !a.isAllDay && /* @__PURE__ */ r("div", { className: "flex items-center gap-1.5 w-full mt-1", children: [
319
- /* @__PURE__ */ t(
320
- Z,
244
+ !t.isAllDay && /* @__PURE__ */ s("div", { className: "flex items-center gap-1.5 w-full mt-1", children: [
245
+ /* @__PURE__ */ a(
246
+ I,
321
247
  {
322
248
  variant: "docked",
323
249
  inputVariant: "filled",
324
250
  size: "sm",
325
251
  shape: "full",
326
- value: a.start,
327
- onChange: (e) => u({ start: e })
252
+ value: t.start,
253
+ onChange: (e) => l({ start: e })
328
254
  }
329
255
  ),
330
- /* @__PURE__ */ t("span", { className: "text-on-surface-variant shrink-0", children: "-" }),
331
- /* @__PURE__ */ t(
332
- Z,
256
+ /* @__PURE__ */ a("span", { className: "text-on-surface-variant shrink-0", children: "-" }),
257
+ /* @__PURE__ */ a(
258
+ I,
333
259
  {
334
260
  variant: "docked",
335
261
  inputVariant: "filled",
336
262
  size: "sm",
337
263
  shape: "full",
338
- value: a.end,
339
- onChange: (e) => u({ end: e })
264
+ value: t.end,
265
+ onChange: (e) => l({ end: e })
340
266
  }
341
267
  )
342
268
  ] })
343
269
  ] })
344
270
  ] }),
345
- !re && /* @__PURE__ */ r("div", { className: "flex items-center gap-4 mt-2", children: [
346
- /* @__PURE__ */ t(pe, { className: "w-5 h-5 text-on-surface-variant shrink-0" }),
347
- /* @__PURE__ */ t("div", { className: "w-full", children: /* @__PURE__ */ t(
348
- ee,
271
+ !L && /* @__PURE__ */ s("div", { className: "flex items-center gap-4 mt-2", children: [
272
+ /* @__PURE__ */ a(ne, { className: "w-5 h-5 text-on-surface-variant shrink-0" }),
273
+ /* @__PURE__ */ a("div", { className: "w-full", children: /* @__PURE__ */ a(
274
+ he,
349
275
  {
350
276
  variant: "filled",
351
277
  size: "sm",
352
278
  shape: "full",
353
- value: h,
354
- onValueChange: ce,
355
- items: F
279
+ value: o,
280
+ onValueChange: K,
281
+ items: b
356
282
  }
357
283
  ) })
358
284
  ] }),
359
- V && /* @__PURE__ */ t("div", { className: "mt-2 border-t border-outline-variant/30 pt-4 flex flex-col gap-4", children: V(a, T) }),
360
- j && /* @__PURE__ */ t("div", { className: "mt-2 border-t border-outline-variant/30 pt-4 flex flex-col gap-4", children: j(a, T) })
361
- ] }), X = /* @__PURE__ */ t(Q, { children: ie && /* @__PURE__ */ r("div", { className: "fixed inset-0 z-[100] flex items-center justify-center px-4 pointer-events-auto", children: [
362
- /* @__PURE__ */ t(
363
- S.div,
285
+ R && /* @__PURE__ */ a("div", { className: "mt-2 border-t border-outline-variant/30 pt-4 flex flex-col gap-4", children: R(t, w) }),
286
+ F && /* @__PURE__ */ a("div", { className: "mt-2 border-t border-outline-variant/30 pt-4 flex flex-col gap-4", children: F(t, w) })
287
+ ] });
288
+ return i.isOpen ? d ? /* @__PURE__ */ s(N, { children: [
289
+ /* @__PURE__ */ a(
290
+ oe,
364
291
  {
365
- initial: { opacity: 0 },
366
- animate: { opacity: 1 },
367
- exit: { opacity: 0 },
368
- transition: { duration: 0.2 },
369
- className: "absolute inset-0 bg-black/50",
370
- onClick: () => C(!1)
292
+ open: i.isOpen,
293
+ onOpenChange: (e) => !e && c(),
294
+ forceBottomSheet: !0,
295
+ snapPoints: [0.6, 1],
296
+ activeSnapPoint: U,
297
+ setActiveSnapPoint: J,
298
+ children: /* @__PURE__ */ s(ce, { className: "p-0 flex flex-col overflow-hidden h-full", children: [
299
+ /* @__PURE__ */ s(de, { className: "px-4 py-2 border-b border-outline-variant/20 shrink-0 flex-row justify-between items-center !space-y-0", children: [
300
+ /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
301
+ /* @__PURE__ */ a(m, { variant: "ghost", onClick: c, children: /* @__PURE__ */ a(T, { className: "w-5 h-5" }) }),
302
+ /* @__PURE__ */ a(ue, { className: "text-base font-semibold m-0", children: i.mode === "create" ? "New Event" : "Edit Event" })
303
+ ] }),
304
+ i.mode === "edit" && /* @__PURE__ */ a(
305
+ m,
306
+ {
307
+ variant: "ghost",
308
+ size: "sm",
309
+ onClick: H,
310
+ className: "text-error hover:bg-error/10 hover:text-error",
311
+ children: /* @__PURE__ */ a(V, { className: "w-5 h-5" })
312
+ }
313
+ )
314
+ ] }),
315
+ /* @__PURE__ */ a("div", { className: "flex-1 overflow-y-auto no-scrollbar", children: A }),
316
+ /* @__PURE__ */ a("div", { className: "p-3 border-t border-outline-variant/20 bg-surface-container shrink-0 flex justify-end items-center pb-safe", children: /* @__PURE__ */ a(
317
+ j,
318
+ {
319
+ variant: "primary",
320
+ onClick: z,
321
+ className: "px-8 rounded-full font-bold",
322
+ children: "Save"
323
+ }
324
+ ) })
325
+ ] })
371
326
  }
372
327
  ),
373
- /* @__PURE__ */ r(
374
- S.div,
328
+ /* @__PURE__ */ a(
329
+ _,
330
+ {
331
+ isOpen: S,
332
+ onClose: () => x(!1),
333
+ value: t.recurrence,
334
+ onChange: (e) => l({ recurrence: e }),
335
+ startDate: t.start
336
+ }
337
+ )
338
+ ] }) : /* @__PURE__ */ s(N, { children: [
339
+ /* @__PURE__ */ a("div", { className: "fixed inset-0 pointer-events-none z-[50]", children: /* @__PURE__ */ a(te, { children: i.isOpen && /* @__PURE__ */ s(
340
+ ae.div,
375
341
  {
342
+ ref: y,
343
+ drag: !0,
344
+ dragMomentum: !1,
345
+ dragControls: P,
346
+ dragListener: !1,
347
+ style: {
348
+ x: v,
349
+ y: g,
350
+ width: "auto",
351
+ minWidth: p,
352
+ maxWidth: "calc(100vw - 32px)"
353
+ },
376
354
  initial: { opacity: 0, scale: 0.95 },
377
355
  animate: { opacity: 1, scale: 1 },
378
356
  exit: { opacity: 0, scale: 0.95 },
379
- transition: { duration: 0.2 },
380
- className: "relative bg-surface-container-high rounded-3xl shadow-2xl p-6 w-full max-w-[420px] flex flex-col gap-6",
357
+ transition: { duration: 0.15 },
358
+ className: "absolute bg-surface-container-high border border-outline-variant/50 rounded-2xl shadow-2xl pointer-events-auto flex flex-col h-auto max-h-[90vh]",
381
359
  children: [
382
- /* @__PURE__ */ t(w, { variant: "title-medium", className: "font-bold", children: "Custom recurrence" }),
383
- /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
384
- /* @__PURE__ */ t(
385
- w,
386
- {
387
- variant: "body-medium",
388
- className: "shrink-0 w-24 font-medium",
389
- children: "Repeat every"
390
- }
391
- ),
392
- /* @__PURE__ */ t("div", { className: "w-20", children: /* @__PURE__ */ t(
393
- te,
394
- {
395
- size: "sm",
396
- variant: "filled",
397
- value: c.interval,
398
- onValueChange: (e) => m((n) => ({ ...n, interval: Number(e) })),
399
- min: 1,
400
- classNames: {
401
- inputWrapper: "h-10 min-h-[40px] px-2",
402
- input: "text-center"
403
- }
404
- }
405
- ) }),
406
- /* @__PURE__ */ t("div", { className: "flex-1", children: /* @__PURE__ */ t(
407
- ee,
408
- {
409
- size: "sm",
410
- variant: "filled",
411
- value: c.frequency,
412
- onValueChange: (e) => m((n) => ({ ...n, frequency: e })),
413
- items: [
414
- {
415
- value: "daily",
416
- label: c.interval > 1 ? "days" : "day"
417
- },
418
- {
419
- value: "weekly",
420
- label: c.interval > 1 ? "weeks" : "week"
421
- },
422
- {
423
- value: "monthly",
424
- label: c.interval > 1 ? "months" : "month"
425
- },
360
+ /* @__PURE__ */ s(
361
+ "div",
362
+ {
363
+ onPointerDown: (e) => {
364
+ e.stopPropagation(), P.start(e);
365
+ },
366
+ className: "flex items-center justify-between px-2 py-1.5 bg-surface-container-high border-b border-outline-variant/20 drag-handle cursor-move rounded-t-2xl shrink-0",
367
+ children: [
368
+ /* @__PURE__ */ a(
369
+ m,
426
370
  {
427
- value: "yearly",
428
- label: c.interval > 1 ? "years" : "year"
371
+ variant: "ghost",
372
+ size: "sm",
373
+ className: "pointer-events-none opacity-50",
374
+ children: /* @__PURE__ */ a(ie, { className: "w-4 h-4" })
429
375
  }
430
- ],
431
- classNames: { trigger: "h-10 px-3" }
432
- }
433
- ) })
434
- ] }),
435
- c.frequency === "weekly" && /* @__PURE__ */ r("div", { className: "flex flex-col gap-2 mt-2", children: [
436
- /* @__PURE__ */ t(w, { variant: "body-medium", className: "font-medium", children: "Repeat on" }),
437
- /* @__PURE__ */ t("div", { className: "flex justify-between gap-1 mt-1", children: ["S", "M", "T", "W", "T", "F", "S"].map((e, n) => {
438
- const l = c.daysOfWeek?.includes(n);
439
- return /* @__PURE__ */ t(
440
- "button",
441
- {
442
- onClick: () => {
443
- m((p) => {
444
- const f = p.daysOfWeek || [], G = f.includes(n) ? f.filter((ue) => ue !== n) : [...f, n];
445
- return {
446
- ...p,
447
- daysOfWeek: G.length ? G : [n]
448
- };
449
- });
450
- },
451
- className: H(
452
- "w-9 h-9 rounded-full flex items-center justify-center text-sm font-semibold transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary",
453
- l ? "bg-primary text-on-primary" : "bg-surface-container-highest text-on-surface hover:bg-surface-container-highest/80"
376
+ ),
377
+ /* @__PURE__ */ s("div", { className: "flex items-center gap-1", children: [
378
+ i.mode === "edit" && t && /* @__PURE__ */ a(
379
+ m,
380
+ {
381
+ variant: "ghost",
382
+ size: "sm",
383
+ onClick: H,
384
+ className: "text-error hover:bg-error/10 hover:text-error cursor-pointer pointer-events-auto",
385
+ children: /* @__PURE__ */ a(V, { className: "w-4 h-4" })
386
+ }
454
387
  ),
455
- children: e
456
- },
457
- n
458
- );
459
- }) })
460
- ] }),
461
- /* @__PURE__ */ r("div", { className: "flex flex-col gap-3 mt-2", children: [
462
- /* @__PURE__ */ t(w, { variant: "body-medium", className: "font-medium mb-1", children: "Ends" }),
463
- /* @__PURE__ */ r("div", { className: "flex flex-col gap-4", children: [
464
- /* @__PURE__ */ t(
465
- A,
466
- {
467
- checked: c.endType === "never",
468
- onChange: () => m((e) => ({ ...e, endType: "never" })),
469
- label: "Never"
470
- }
471
- ),
472
- /* @__PURE__ */ t(
473
- A,
474
- {
475
- checked: c.endType === "on_date",
476
- onChange: () => m((e) => ({ ...e, endType: "on_date" })),
477
- label: "On",
478
- children: /* @__PURE__ */ t("div", { className: "w-[180px]", children: /* @__PURE__ */ t(
479
- z,
388
+ /* @__PURE__ */ a(
389
+ m,
480
390
  {
481
- variant: "docked",
482
- inputVariant: "filled",
391
+ variant: "ghost",
483
392
  size: "sm",
484
- disabled: c.endType !== "on_date",
485
- value: c.until,
486
- onChange: (e) => e && m((n) => ({ ...n, until: e })),
487
- classNames: { inputWrapper: "h-10 min-h-[40px]" }
393
+ onClick: c,
394
+ className: "pointer-events-auto hover:bg-surface-container-highest cursor-pointer",
395
+ children: /* @__PURE__ */ a(T, { className: "w-4 h-4" })
488
396
  }
489
- ) })
490
- }
491
- ),
492
- /* @__PURE__ */ t(
493
- A,
494
- {
495
- checked: c.endType === "after_occurrences",
496
- onChange: () => m((e) => ({
497
- ...e,
498
- endType: "after_occurrences"
499
- })),
500
- label: "After",
501
- children: /* @__PURE__ */ r("div", { className: "w-[180px] flex items-center gap-3", children: [
502
- /* @__PURE__ */ t(
503
- te,
504
- {
505
- variant: "filled",
506
- size: "sm",
507
- disabled: c.endType !== "after_occurrences",
508
- value: c.count,
509
- onValueChange: (e) => m((n) => ({ ...n, count: Number(e) })),
510
- min: 1,
511
- classNames: {
512
- inputWrapper: "h-10 min-h-[40px] px-2",
513
- input: "text-center"
514
- }
515
- }
516
- ),
517
- /* @__PURE__ */ t(
518
- w,
519
- {
520
- variant: "body-medium",
521
- className: "whitespace-nowrap opacity-80 font-normal",
522
- children: "occurrences"
523
- }
524
- )
525
- ] })
526
- }
527
- )
528
- ] })
529
- ] }),
530
- /* @__PURE__ */ r("div", { className: "flex justify-end gap-2 pt-4", children: [
531
- /* @__PURE__ */ t(
532
- M,
533
- {
534
- variant: "ghost",
535
- onClick: () => C(!1),
536
- children: "Cancel"
537
- }
538
- ),
539
- /* @__PURE__ */ t(
540
- M,
541
- {
542
- variant: "primary",
543
- onClick: () => {
544
- u({ recurrence: c }), C(!1);
545
- },
546
- children: "Done"
547
- }
548
- )
549
- ] })
397
+ )
398
+ ] })
399
+ ]
400
+ }
401
+ ),
402
+ /* @__PURE__ */ a("div", { className: "flex-1 max-h-[80vh] overflow-y-auto scrollbar-thin overflow-x-hidden min-h-0", children: A }),
403
+ /* @__PURE__ */ a("div", { className: "flex items-center justify-end gap-2 p-4 border-t border-outline-variant/20 bg-surface-container-high shrink-0 rounded-b-2xl", children: /* @__PURE__ */ a(
404
+ j,
405
+ {
406
+ variant: "primary",
407
+ onClick: z,
408
+ className: "px-6 rounded-full font-bold",
409
+ children: "Save"
410
+ }
411
+ ) })
550
412
  ]
551
413
  }
414
+ ) }) }),
415
+ /* @__PURE__ */ a(
416
+ _,
417
+ {
418
+ isOpen: S,
419
+ onClose: () => x(!1),
420
+ value: t.recurrence,
421
+ onChange: (e) => l({ recurrence: e }),
422
+ startDate: t.start
423
+ }
552
424
  )
553
- ] }) });
554
- if (!i.isOpen) return null;
555
- if (v)
556
- return /* @__PURE__ */ r(R, { children: [
557
- /* @__PURE__ */ t(
558
- xe,
559
- {
560
- open: i.isOpen,
561
- onOpenChange: (e) => !e && o(),
562
- forceBottomSheet: !0,
563
- snapPoints: [0.6, 1],
564
- activeSnapPoint: se,
565
- setActiveSnapPoint: oe,
566
- children: /* @__PURE__ */ r(we, { className: "p-0 flex flex-col overflow-hidden h-full", children: [
567
- /* @__PURE__ */ r(be, { className: "px-4 py-2 border-b border-outline-variant/20 shrink-0 flex-row justify-between items-center !space-y-0", children: [
568
- /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
569
- /* @__PURE__ */ t(x, { variant: "ghost", onClick: o, children: /* @__PURE__ */ t(U, { className: "w-5 h-5" }) }),
570
- /* @__PURE__ */ t(Ne, { className: "text-base font-semibold m-0", children: i.mode === "create" ? "New Event" : "Edit Event" })
571
- ] }),
572
- i.mode === "edit" && /* @__PURE__ */ t(
573
- x,
574
- {
575
- variant: "ghost",
576
- size: "sm",
577
- onClick: I,
578
- className: "text-error hover:bg-error/10 hover:text-error",
579
- children: /* @__PURE__ */ t(J, { className: "w-5 h-5" })
580
- }
581
- )
582
- ] }),
583
- /* @__PURE__ */ t("div", { className: "flex-1 overflow-y-auto no-scrollbar", children: B }),
584
- /* @__PURE__ */ t("div", { className: "p-3 border-t border-outline-variant/20 bg-surface-container shrink-0 flex justify-end items-center pb-safe", children: /* @__PURE__ */ t(
585
- M,
586
- {
587
- variant: "primary",
588
- onClick: $,
589
- className: "px-8 rounded-full font-bold",
590
- children: "Save"
591
- }
592
- ) })
593
- ] })
594
- }
595
- ),
596
- typeof document < "u" && P(X, document.body)
597
- ] });
598
- const de = /* @__PURE__ */ t("div", { className: "fixed inset-0 pointer-events-none z-[50]", children: /* @__PURE__ */ t(Q, { children: i.isOpen && /* @__PURE__ */ r(
599
- S.div,
600
- {
601
- ref: E,
602
- drag: !0,
603
- dragMomentum: !1,
604
- dragControls: _,
605
- dragListener: !1,
606
- style: {
607
- x: k,
608
- y: D,
609
- width: "auto",
610
- minWidth: b,
611
- maxWidth: "calc(100vw - 32px)"
612
- },
613
- initial: { opacity: 0, scale: 0.95 },
614
- animate: { opacity: 1, scale: 1 },
615
- exit: { opacity: 0, scale: 0.95 },
616
- transition: { duration: 0.15 },
617
- className: "absolute bg-surface-container-high border border-outline-variant/50 rounded-2xl shadow-2xl pointer-events-auto flex flex-col h-auto max-h-[90vh]",
618
- children: [
619
- /* @__PURE__ */ r(
620
- "div",
621
- {
622
- onPointerDown: (e) => {
623
- e.stopPropagation(), _.start(e);
624
- },
625
- className: "flex items-center justify-between px-2 py-1.5 bg-surface-container-high border-b border-outline-variant/20 drag-handle cursor-move rounded-t-2xl shrink-0",
626
- children: [
627
- /* @__PURE__ */ t(
628
- x,
629
- {
630
- variant: "ghost",
631
- size: "sm",
632
- className: "pointer-events-none opacity-50",
633
- children: /* @__PURE__ */ t(ye, { className: "w-4 h-4" })
634
- }
635
- ),
636
- /* @__PURE__ */ r("div", { className: "flex items-center gap-1", children: [
637
- i.mode === "edit" && a && /* @__PURE__ */ t(
638
- x,
639
- {
640
- variant: "ghost",
641
- size: "sm",
642
- onClick: I,
643
- className: "text-error hover:bg-error/10 hover:text-error cursor-pointer pointer-events-auto",
644
- children: /* @__PURE__ */ t(J, { className: "w-4 h-4" })
645
- }
646
- ),
647
- /* @__PURE__ */ t(
648
- x,
649
- {
650
- variant: "ghost",
651
- size: "sm",
652
- onClick: o,
653
- className: "pointer-events-auto hover:bg-surface-container-highest cursor-pointer",
654
- children: /* @__PURE__ */ t(U, { className: "w-4 h-4" })
655
- }
656
- )
657
- ] })
658
- ]
659
- }
660
- ),
661
- /* @__PURE__ */ t("div", { className: "flex-1 max-h-[80vh] overflow-y-auto scrollbar-thin overflow-x-hidden min-h-0", children: B }),
662
- /* @__PURE__ */ t("div", { className: "flex items-center justify-end gap-2 p-4 border-t border-outline-variant/20 bg-surface-container-high shrink-0 rounded-b-2xl", children: /* @__PURE__ */ t(
663
- M,
664
- {
665
- variant: "primary",
666
- onClick: $,
667
- className: "px-6 rounded-full font-bold",
668
- children: "Save"
669
- }
670
- ) })
671
- ]
672
- }
673
- ) }) });
674
- return /* @__PURE__ */ r(R, { children: [
675
- typeof document < "u" && P(de, document.body),
676
- typeof document < "u" && P(X, document.body)
677
- ] });
425
+ ] }) : null;
678
426
  };
679
427
  export {
680
- Be as EventPopover
428
+ Pe as EventPopover
681
429
  };