chesai-ui 0.16.10 → 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 +271 -523
  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 +129 -115
  7. package/dist/index.mjs +285 -283
  8. package/package.json +1 -1
package/dist/components/full-calendar/event-popover.mjs CHANGED
@@ -1,220 +1,145 @@
1
- import { jsxs as r, jsx as t, Fragment as R } from "react/jsx-runtime";
2
- import { useMediaQuery as ue } from "@uidotdev/usehooks";
3
- import { clsx as X } 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 M, useEffect as K } from "react";
8
- import { createPortal as P } from "react-dom";
9
- import { Button as x } from "../button/index.mjs";
10
- import { ButtonGroup as ge } from "../button-group/index.mjs";
11
- import { DatePicker as z } from "../date-picker/date-picker.mjs";
12
- import { IconButton as w } from "../icon-button/index.mjs";
13
- import { Input as xe } from "../input/index.mjs";
14
- import { Sheet as we, SheetContent as be, SheetHeader as Ne, SheetTitle as ke } from "../sheet/index.mjs";
15
- import { TimePicker as Z } from "../time-picker/index.mjs";
16
- import { Typography as b } from "../typography/index.mjs";
17
- import { Switch as De } from "../switch/index.mjs";
18
- import { Select as ee } from "../select/index.mjs";
19
- import { NumberInput as te } from "../number-input/index.mjs";
20
- import { useFullCalendar as Ce } from "./calendar-context.mjs";
21
- const N = 380, Oe = (s, i) => {
22
- const o = s.frequency, a = s.interval;
23
- let d = "";
24
- 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) {
25
- const k = [
26
- "Sunday",
27
- "Monday",
28
- "Tuesday",
29
- "Wednesday",
30
- "Thursday",
31
- "Friday",
32
- "Saturday"
33
- ];
34
- 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) => k[y]).join(", ")}`;
35
- } else o === "monthly" ? d += ` on day ${i.getDate()}` : o === "yearly" && (d += ` on ${W(i, "MMM d")}`);
36
- 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;
37
- }, A = ({
38
- checked: s,
39
- onChange: i,
40
- label: o,
41
- children: a
42
- }) => /* @__PURE__ */ r("div", { className: "flex items-center gap-4 h-10 w-full", children: [
43
- /* @__PURE__ */ r("label", { className: "flex items-center gap-3 cursor-pointer shrink-0", children: [
44
- /* @__PURE__ */ r("div", { className: "relative flex items-center justify-center w-5 h-5 shrink-0", children: [
45
- /* @__PURE__ */ t(
46
- "input",
47
- {
48
- type: "radio",
49
- className: "peer sr-only",
50
- checked: s,
51
- onChange: i
52
- }
53
- ),
54
- /* @__PURE__ */ t(
55
- "div",
56
- {
57
- className: X(
58
- "w-5 h-5 rounded-full border-2 transition-colors",
59
- s ? "border-primary" : "border-outline-variant hover:border-on-surface-variant"
60
- )
61
- }
62
- ),
63
- /* @__PURE__ */ t(
64
- "div",
65
- {
66
- className: X(
67
- "absolute w-2.5 h-2.5 rounded-full bg-primary transition-transform duration-200",
68
- s ? "scale-100" : "scale-0"
69
- )
70
- }
71
- )
72
- ] }),
73
- /* @__PURE__ */ t("span", { className: "text-sm font-medium text-on-surface select-none", children: o })
74
- ] }),
75
- a && /* @__PURE__ */ t("div", { className: "flex-1 flex items-center", children: a })
76
- ] }), Xe = () => {
77
- const s = Ce(), {
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(), {
78
19
  popover: i,
79
- closePopover: o,
80
- draftEvent: a,
81
- setDraftEvent: d,
82
- onEventCreate: k,
83
- onEventUpdate: y,
84
- onEventDelete: H,
85
- hidePopoverTitle: ae,
86
- hidePopoverTime: ne,
87
- hidePopoverRecurrence: re,
88
- renderPopoverHeader: q,
89
- renderPopoverFooter: Y,
90
- renderPopoverCustomFields: V
91
- } = s, v = ue("(max-width: 768px)"), E = ve(null), _ = fe(), D = L(0), C = L(0), [ie, O] = M(!1), [g, le] = M(450), [c, u] = M({
92
- frequency: "weekly",
93
- interval: 1,
94
- daysOfWeek: [],
95
- endType: "never",
96
- count: 13,
97
- until: new Date(Date.now() + 720 * 60 * 60 * 1e3)
98
- });
99
- K(() => {
100
- 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)
101
35
  return;
102
- const e = new ResizeObserver((n) => {
103
- for (const l of n)
104
- le(l.target.getBoundingClientRect().height);
36
+ const e = new ResizeObserver((r) => {
37
+ for (const n of r)
38
+ Q(n.target.getBoundingClientRect().height);
105
39
  });
106
- return E.current && e.observe(E.current), () => e.disconnect();
107
- }, [i.isOpen, v]), K(() => {
108
- if (i.isOpen && !v) {
109
- 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;
110
44
  if (i.anchorRect) {
111
- let p = i.anchorRect.right + 16, f = i.anchorRect.top;
112
- p + N > n && (p = i.anchorRect.left - N - 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(
113
47
  16,
114
- Math.min(p, n - N - 16)
115
- ), f = Math.max(
48
+ Math.min(f, r - p - 16)
49
+ ), h = Math.max(
116
50
  16,
117
- Math.min(f, l - g - 16)
118
- ), D.set(p), C.set(f);
51
+ Math.min(h, n - u - 16)
52
+ ), v.set(f), g.set(h);
119
53
  } else
120
- D.set(n / 2 - N / 2), C.set(l / 2 - g / 2);
54
+ v.set(r / 2 - p / 2), g.set(n / 2 - u / 2);
121
55
  }
122
- }, [i.isOpen, i.anchorRect, v, g, D, C]);
123
- const [se, oe] = M(1), $ = async () => {
124
- if (!a) return;
125
- const e = new Date(a.start);
126
- a.isAllDay ? e.setHours(0, 0, 0, 0) : e.setHours(
127
- a.start.getHours(),
128
- 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(),
129
63
  0,
130
64
  0
131
65
  );
132
- const n = new Date(a.end);
133
- a.isAllDay ? n.setHours(23, 59, 59, 999) : n.setHours(
134
- a.end.getHours(),
135
- 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(),
136
70
  0,
137
71
  0
138
72
  );
139
- const l = {
140
- ...a,
73
+ const n = {
74
+ ...t,
141
75
  start: e,
142
- end: n,
143
- title: a.title || "(No title)"
76
+ end: r,
77
+ title: t.title || "(No title)"
144
78
  };
145
- delete l.isDraft, i.mode === "create" && k ? await k(l) : i.mode === "edit" && y && await y(l), o();
146
- }, j = async () => {
147
- a?.id && H && await H(a.id), o();
148
- }, m = (e) => {
149
- d((n) => n ? { ...n, ...e } : null);
150
- }, T = (e) => {
151
- d((n) => {
152
- if (!n) return null;
153
- const l = e.data !== void 0 ? { ...n.data || {}, ...e.data } : n.data;
154
- 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 };
155
89
  });
156
- }, F = a ? [
90
+ }, b = t ? [
157
91
  { value: "none", label: "Does not repeat" },
158
92
  { value: "daily", label: "Daily" },
159
93
  {
160
94
  value: "weekly",
161
- label: `Weekly on ${W(a.start, "EEEE")}`
95
+ label: `Weekly on ${W(t.start, "EEEE")}`
162
96
  },
163
97
  {
164
98
  value: "monthly",
165
- label: `Monthly on the ${a.start.getDate()}`
99
+ label: `Monthly on the ${t.start.getDate()}`
166
100
  },
167
101
  {
168
102
  value: "yearly",
169
- label: `Annually on ${W(a.start, "MMM d")}`
103
+ label: `Annually on ${W(t.start, "MMM d")}`
170
104
  },
171
105
  { value: "weekdays", label: "Every weekday (Monday to Friday)" }
172
106
  ] : [];
173
- let h = "none";
174
- if (a?.recurrence) {
175
- const e = a.recurrence;
176
- 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({
177
111
  value: "custom_active",
178
- label: Oe(e, a.start)
112
+ label: "Custom Recurrence"
179
113
  }));
180
114
  }
181
- F.push({ value: "custom", label: "Custom..." });
182
- const ce = (e) => {
183
- e === "none" ? m({ recurrence: void 0 }) : e === "custom" ? (u(
184
- a?.recurrence || {
185
- frequency: "weekly",
186
- interval: 1,
187
- daysOfWeek: [a?.start?.getDay() || 0],
188
- endType: "never",
189
- count: 13,
190
- until: new Date(Date.now() + 720 * 60 * 60 * 1e3)
191
- }
192
- ), O(!0)) : e === "weekdays" ? m({
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({
193
118
  recurrence: {
194
119
  frequency: "weekly",
195
120
  interval: 1,
196
121
  endType: "never",
197
122
  daysOfWeek: [1, 2, 3, 4, 5]
198
123
  }
199
- }) : e !== "custom_active" && m({
124
+ }) : e !== "custom_active" && l({
200
125
  recurrence: {
201
126
  frequency: e,
202
127
  interval: 1,
203
128
  endType: "never",
204
- daysOfWeek: e === "weekly" ? [a?.start?.getDay() || 0] : void 0
129
+ daysOfWeek: e === "weekly" ? [t?.start?.getDay() || 0] : void 0
205
130
  }
206
131
  });
207
132
  };
208
- if (!a) return null;
209
- const B = /* @__PURE__ */ r("div", { className: "flex flex-col gap-6 p-6 font-manrope text-on-surface min-w-[340px]", children: [
210
- q && /* @__PURE__ */ t("div", { className: "flex flex-col gap-4", children: q(a, T) }),
211
- !ae && /* @__PURE__ */ t("div", { className: "pl-10 pr-2", children: /* @__PURE__ */ t(
212
- xe,
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,
213
138
  {
214
139
  variant: "underlined",
215
140
  placeholder: "Add title",
216
- value: a.title,
217
- onChange: (e) => m({ title: e.target.value }),
141
+ value: t.title,
142
+ onChange: (e) => l({ title: e.target.value }),
218
143
  autoFocus: !0,
219
144
  className: "shadow-none px-0",
220
145
  classNames: {
@@ -223,91 +148,91 @@ const N = 380, Oe = (s, i) => {
223
148
  }
224
149
  }
225
150
  ) }),
226
- !ne && /* @__PURE__ */ r("div", { className: "flex items-start gap-4", children: [
227
- /* @__PURE__ */ t(he, { className: "w-5 h-5 mt-2.5 text-on-surface-variant shrink-0" }),
228
- /* @__PURE__ */ r("div", { className: "flex flex-col gap-3 w-full min-w-0", children: [
229
- /* @__PURE__ */ r("div", { className: "flex items-center gap-1.5 w-full", children: [
230
- /* @__PURE__ */ t(
231
- 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,
232
157
  {
233
158
  variant: "docked",
234
159
  inputVariant: "filled",
235
160
  size: "sm",
236
161
  shape: "full",
237
- value: a.start,
162
+ value: t.start,
238
163
  onChange: (e) => {
239
164
  if (!e) return;
240
- const n = new Date(a.start);
241
- n.setFullYear(
165
+ const r = new Date(t.start);
166
+ r.setFullYear(
242
167
  e.getFullYear(),
243
168
  e.getMonth(),
244
169
  e.getDate()
245
170
  );
246
- let l = new Date(a.end);
247
- a.isAllDay ? a.end < n && l.setFullYear(
171
+ let n = new Date(t.end);
172
+ t.isAllDay ? t.end < r && n.setFullYear(
248
173
  e.getFullYear(),
249
174
  e.getMonth(),
250
175
  e.getDate()
251
- ) : l.setFullYear(
176
+ ) : n.setFullYear(
252
177
  e.getFullYear(),
253
178
  e.getMonth(),
254
179
  e.getDate()
255
- ), m({ start: n, end: l });
180
+ ), l({ start: r, end: n });
256
181
  }
257
182
  }
258
183
  ),
259
- a.isAllDay && /* @__PURE__ */ r(R, { children: [
260
- /* @__PURE__ */ t("span", { className: "text-on-surface-variant shrink-0", children: "-" }),
261
- /* @__PURE__ */ t(
262
- 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,
263
188
  {
264
189
  variant: "docked",
265
190
  inputVariant: "filled",
266
191
  size: "sm",
267
192
  shape: "full",
268
- value: a.end,
193
+ value: t.end,
269
194
  onChange: (e) => {
270
195
  if (!e) return;
271
- const n = new Date(a.end);
272
- if (n.setFullYear(
196
+ const r = new Date(t.end);
197
+ if (r.setFullYear(
273
198
  e.getFullYear(),
274
199
  e.getMonth(),
275
200
  e.getDate()
276
- ), m({ end: n }), a.start > n) {
277
- const l = new Date(a.start);
278
- l.setFullYear(
201
+ ), l({ end: r }), t.start > r) {
202
+ const n = new Date(t.start);
203
+ n.setFullYear(
279
204
  e.getFullYear(),
280
205
  e.getMonth(),
281
206
  e.getDate()
282
- ), m({ start: l });
207
+ ), l({ start: n });
283
208
  }
284
209
  }
285
210
  }
286
211
  )
287
212
  ] })
288
213
  ] }),
289
- /* @__PURE__ */ r("div", { className: "flex items-center gap-2 mt-1 w-fit", children: [
290
- /* @__PURE__ */ t(
291
- De,
214
+ /* @__PURE__ */ s("div", { className: "flex items-center gap-2 mt-1 w-fit", children: [
215
+ /* @__PURE__ */ a(
216
+ fe,
292
217
  {
293
218
  id: "all-day-switch",
294
219
  size: "sm",
295
- checked: !!a.isAllDay,
220
+ checked: !!t.isAllDay,
296
221
  onCheckedChange: (e) => {
297
222
  if (e)
298
- m({ isAllDay: e });
223
+ l({ isAllDay: e });
299
224
  else {
300
- const n = new Date(a.end);
301
- n.setFullYear(
302
- a.start.getFullYear(),
303
- a.start.getMonth(),
304
- a.start.getDate()
305
- ), m({ 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 });
306
231
  }
307
232
  }
308
233
  }
309
234
  ),
310
- /* @__PURE__ */ t(
235
+ /* @__PURE__ */ a(
311
236
  "label",
312
237
  {
313
238
  htmlFor: "all-day-switch",
@@ -316,366 +241,189 @@ const N = 380, Oe = (s, i) => {
316
241
  }
317
242
  )
318
243
  ] }),
319
- !a.isAllDay && /* @__PURE__ */ r("div", { className: "flex items-center gap-1.5 w-full mt-1", children: [
320
- /* @__PURE__ */ t(
321
- Z,
244
+ !t.isAllDay && /* @__PURE__ */ s("div", { className: "flex items-center gap-1.5 w-full mt-1", children: [
245
+ /* @__PURE__ */ a(
246
+ I,
322
247
  {
323
248
  variant: "docked",
324
249
  inputVariant: "filled",
325
250
  size: "sm",
326
251
  shape: "full",
327
- value: a.start,
328
- onChange: (e) => m({ start: e })
252
+ value: t.start,
253
+ onChange: (e) => l({ start: e })
329
254
  }
330
255
  ),
331
- /* @__PURE__ */ t("span", { className: "text-on-surface-variant shrink-0", children: "-" }),
332
- /* @__PURE__ */ t(
333
- Z,
256
+ /* @__PURE__ */ a("span", { className: "text-on-surface-variant shrink-0", children: "-" }),
257
+ /* @__PURE__ */ a(
258
+ I,
334
259
  {
335
260
  variant: "docked",
336
261
  inputVariant: "filled",
337
262
  size: "sm",
338
263
  shape: "full",
339
- value: a.end,
340
- onChange: (e) => m({ end: e })
264
+ value: t.end,
265
+ onChange: (e) => l({ end: e })
341
266
  }
342
267
  )
343
268
  ] })
344
269
  ] })
345
270
  ] }),
346
- !re && /* @__PURE__ */ r("div", { className: "flex items-center gap-4 mt-2", children: [
347
- /* @__PURE__ */ t(pe, { className: "w-5 h-5 text-on-surface-variant shrink-0" }),
348
- /* @__PURE__ */ t("div", { className: "w-full", children: /* @__PURE__ */ t(
349
- 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,
350
275
  {
351
276
  variant: "filled",
352
277
  size: "sm",
353
278
  shape: "full",
354
- value: h,
355
- onValueChange: ce,
356
- items: F
279
+ value: o,
280
+ onValueChange: K,
281
+ items: b
357
282
  }
358
283
  ) })
359
284
  ] }),
360
- V && /* @__PURE__ */ t("div", { className: "mt-2 border-t border-outline-variant/30 pt-4 flex flex-col gap-4", children: V(a, T) }),
361
- Y && /* @__PURE__ */ t("div", { className: "mt-2 border-t border-outline-variant/30 pt-4 flex flex-col gap-4", children: Y(a, T) })
362
- ] }), I = /* @__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: [
363
- /* @__PURE__ */ t(
364
- 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,
365
291
  {
366
- initial: { opacity: 0 },
367
- animate: { opacity: 1 },
368
- exit: { opacity: 0 },
369
- transition: { duration: 0.2 },
370
- className: "absolute inset-0 bg-black/50",
371
- onClick: () => O(!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
+ ] })
372
326
  }
373
327
  ),
374
- /* @__PURE__ */ r(
375
- 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,
376
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
+ },
377
354
  initial: { opacity: 0, scale: 0.95 },
378
355
  animate: { opacity: 1, scale: 1 },
379
356
  exit: { opacity: 0, scale: 0.95 },
380
- transition: { duration: 0.2 },
381
- 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]",
382
359
  children: [
383
- /* @__PURE__ */ t(b, { variant: "title-medium", className: "font-bold", children: "Custom recurrence" }),
384
- /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
385
- /* @__PURE__ */ t(
386
- b,
387
- {
388
- variant: "body-medium",
389
- className: "shrink-0 w-24 font-medium",
390
- children: "Repeat every"
391
- }
392
- ),
393
- /* @__PURE__ */ t("div", { className: "w-20", children: /* @__PURE__ */ t(
394
- te,
395
- {
396
- size: "sm",
397
- variant: "filled",
398
- value: c.interval,
399
- onValueChange: (e) => u((n) => ({ ...n, interval: Number(e) })),
400
- min: 1,
401
- classNames: {
402
- inputWrapper: "h-10 min-h-[40px] px-2",
403
- input: "text-center"
404
- }
405
- }
406
- ) }),
407
- /* @__PURE__ */ t("div", { className: "flex-1", children: /* @__PURE__ */ t(
408
- ee,
409
- {
410
- size: "sm",
411
- variant: "filled",
412
- value: c.frequency,
413
- onValueChange: (e) => u((n) => ({ ...n, frequency: e })),
414
- items: [
415
- {
416
- value: "daily",
417
- label: c.interval > 1 ? "days" : "day"
418
- },
419
- {
420
- value: "weekly",
421
- label: c.interval > 1 ? "weeks" : "week"
422
- },
423
- {
424
- value: "monthly",
425
- label: c.interval > 1 ? "months" : "month"
426
- },
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,
427
370
  {
428
- value: "yearly",
429
- 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" })
430
375
  }
431
- ],
432
- classNames: { trigger: "h-10 px-3" }
433
- }
434
- ) })
435
- ] }),
436
- c.frequency === "weekly" && /* @__PURE__ */ r("div", { className: "flex flex-col gap-2 mt-2", children: [
437
- /* @__PURE__ */ t(b, { variant: "body-medium", className: "font-medium", children: "Repeat on" }),
438
- /* @__PURE__ */ t("div", { className: "flex justify-between mt-1 w-full", children: /* @__PURE__ */ t(ge, { shape: "full", gap: "xs", className: "w-full flex", children: ["S", "M", "T", "W", "T", "F", "S"].map((e, n) => {
439
- const l = c.daysOfWeek?.includes(n);
440
- return /* @__PURE__ */ t(
441
- x,
442
- {
443
- variant: l ? "primary" : "secondary",
444
- isActive: l,
445
- onClick: () => {
446
- u((p) => {
447
- const f = p.daysOfWeek || [], G = f.includes(n) ? f.filter((me) => me !== n) : [...f, n];
448
- return {
449
- ...p,
450
- daysOfWeek: G.length ? G : [n]
451
- };
452
- });
453
- },
454
- className: "flex-1 !px-0 min-w-0",
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(b, { 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: () => u((e) => ({ ...e, endType: "never" })),
469
- label: "Never"
470
- }
471
- ),
472
- /* @__PURE__ */ t(
473
- A,
474
- {
475
- checked: c.endType === "on_date",
476
- onChange: () => u((e) => ({ ...e, endType: "on_date" })),
477
- label: "On",
478
- children: /* @__PURE__ */ t("div", { className: "w-[180px]", children: /* @__PURE__ */ t(
479
- z,
376
+ ),
377
+ /* @__PURE__ */ s("div", { className: "flex items-center gap-1", children: [
378
+ i.mode === "edit" && t && /* @__PURE__ */ a(
379
+ m,
480
380
  {
481
- variant: "docked",
482
- inputVariant: "filled",
381
+ variant: "ghost",
483
382
  size: "sm",
484
- disabled: c.endType !== "on_date",
485
- value: c.until,
486
- onChange: (e) => e && u((n) => ({ ...n, until: e })),
487
- classNames: { inputWrapper: "h-10 min-h-[40px]" }
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" })
488
386
  }
489
- ) })
490
- }
491
- ),
492
- /* @__PURE__ */ t(
493
- A,
494
- {
495
- checked: c.endType === "after_occurrences",
496
- onChange: () => u((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) => u((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
- b,
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
- x,
533
- {
534
- variant: "ghost",
535
- onClick: () => O(!1),
536
- children: "Cancel"
537
- }
538
- ),
539
- /* @__PURE__ */ t(
540
- x,
541
- {
542
- variant: "primary",
543
- onClick: () => {
544
- m({ recurrence: c }), O(!1);
545
- },
546
- children: "Done"
547
- }
548
- )
549
- ] })
387
+ ),
388
+ /* @__PURE__ */ a(
389
+ m,
390
+ {
391
+ variant: "ghost",
392
+ size: "sm",
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" })
396
+ }
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
- we,
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(be, { className: "p-0 flex flex-col overflow-hidden h-full", children: [
567
- /* @__PURE__ */ r(Ne, { 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(w, { variant: "ghost", onClick: o, children: /* @__PURE__ */ t(U, { className: "w-5 h-5" }) }),
570
- /* @__PURE__ */ t(ke, { className: "text-base font-semibold m-0", children: i.mode === "create" ? "New Event" : "Edit Event" })
571
- ] }),
572
- i.mode === "edit" && /* @__PURE__ */ t(
573
- w,
574
- {
575
- variant: "ghost",
576
- size: "sm",
577
- onClick: j,
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
- x,
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(I, 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: D,
608
- y: C,
609
- width: "auto",
610
- minWidth: N,
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
- w,
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
- w,
639
- {
640
- variant: "ghost",
641
- size: "sm",
642
- onClick: j,
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
- w,
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
- x,
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(I, document.body)
677
- ] });
425
+ ] }) : null;
678
426
  };
679
427
  export {
680
- Xe as EventPopover
428
+ Pe as EventPopover
681
429
  };