@calends/vue 0.0.0 → 0.2.0

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.
package/README.md CHANGED
@@ -96,10 +96,12 @@ const events = [
96
96
  ```
97
97
 
98
98
  Bars sit inside their start day's gridcell (so the ARIA grid stays intact) and span across with
99
- `--event-span`. Inside the views, events are typed as plain `CalendarEventInput`; read your own
100
- fields from an event primitive's slot (`event.source`), which is typed loosely for that. Every segment of a multi-week event gets `data-highlighted` together on hover or
99
+ `--event-span`. Every segment of a multi-week event gets `data-highlighted` together on hover or
101
100
  focus.
102
101
 
102
+ Inside the views, events are typed as plain `CalendarEventInput`, so read your own fields from an event
103
+ primitive's slot (`event.source`), which is typed loosely for that.
104
+
103
105
  ## Components
104
106
 
105
107
  | View | Primitives |
package/dist/index.js CHANGED
@@ -2,7 +2,7 @@ import { computed as e, createBlock as t, createCommentVNode as n, createElement
2
2
  import { Primitive as T } from "reka-ui";
3
3
  import { createGantt as E, createMonthGrid as D, createResourceGrid as O, createTimeGrid as k, createTimeline as A, daysBetween as j, ganttLinkArrow as M, isSamePeriod as N, localTimeZone as P, moveEvent as F, navigate as I, normalizeEvents as L, orderedRange as R, periodRange as z, periodTitle as ee, resizeEvent as B, roundedPath as te, routeGanttLink as ne, snapMinutes as re, startOfWeek as V, wallMinutes as H, withTimes as U } from "@calends/core";
4
4
  // src/useInteractions.ts
5
- var ie = 4, W = "a[href], button, [tabindex]:not([tabindex=\"-1\"])";
5
+ var ie = 4, W = "a[href], button, [tabindex]:not([tabindex=\"-1\"])", ae = "[data-event-id], [data-calendar-control], a[href], button, input, select, textarea";
6
6
  function G(t) {
7
7
  let n = _(null), r = _(null), i = h(""), a = e(() => y(t.editable) ?? !1), o = e(() => y(t.selectable) ?? !1), s = e(() => y(t.snapMinutes) ?? 15), l = e(() => y(t.slotMinMinutes) ?? 0), u = e(() => y(t.slotMaxMinutes) ?? 1440);
8
8
  function d(e) {
@@ -147,7 +147,7 @@ function G(t) {
147
147
  }
148
148
  function D(e) {
149
149
  let n = e.target;
150
- if (!o.value || e.button !== 0 || e.pointerType === "touch" || n?.closest("[data-event-id], [data-calendar-control]")) return;
150
+ if (!o.value || e.button !== 0 || e.pointerType === "touch" || n?.closest(ae)) return;
151
151
  let i = m(e.clientX, e.clientY);
152
152
  if (!i) return;
153
153
  e.preventDefault(), n?.closest("[role=\"gridcell\"]")?.focus(), r.value = {
@@ -434,7 +434,7 @@ function Y(e) {
434
434
  return t;
435
435
  }
436
436
  // src/CalendarHeading.vue
437
- var ae = /* @__PURE__ */ a({
437
+ var oe = /* @__PURE__ */ a({
438
438
  __name: "CalendarHeading",
439
439
  props: {
440
440
  asChild: { type: Boolean },
@@ -451,7 +451,7 @@ var ae = /* @__PURE__ */ a({
451
451
  _: 3
452
452
  }, 8, ["as", "as-child"]));
453
453
  }
454
- }), oe = /* @__PURE__ */ a({
454
+ }), se = /* @__PURE__ */ a({
455
455
  __name: "CalendarNav",
456
456
  props: {
457
457
  asChild: { type: Boolean },
@@ -481,7 +481,7 @@ var ae = /* @__PURE__ */ a({
481
481
  "data-current"
482
482
  ]));
483
483
  }
484
- }), se = /* @__PURE__ */ a({
484
+ }), ce = /* @__PURE__ */ a({
485
485
  __name: "CalendarRoot",
486
486
  props: /*@__PURE__*/ s({
487
487
  asChild: { type: Boolean },
@@ -582,7 +582,7 @@ var ae = /* @__PURE__ */ a({
582
582
  "data-view"
583
583
  ]));
584
584
  }
585
- }), ce = /* @__PURE__ */ a({
585
+ }), le = /* @__PURE__ */ a({
586
586
  __name: "MonthDay",
587
587
  props: {
588
588
  asChild: { type: Boolean },
@@ -636,7 +636,7 @@ var ae = /* @__PURE__ */ a({
636
636
  "data-selected"
637
637
  ]));
638
638
  }
639
- }), le = /* @__PURE__ */ a({
639
+ }), ue = /* @__PURE__ */ a({
640
640
  __name: "MonthDayMore",
641
641
  props: {
642
642
  asChild: { type: Boolean },
@@ -656,7 +656,8 @@ var ae = /* @__PURE__ */ a({
656
656
  as: r.as,
657
657
  "as-child": r.asChild,
658
658
  type: r.as === "button" ? "button" : void 0,
659
- "aria-label": s.value
659
+ "aria-label": s.value,
660
+ "data-calendar-control": ""
660
661
  }, {
661
662
  default: C(() => [g(e.$slots, "default", {
662
663
  hiddenCount: r.day.hiddenCount,
@@ -772,7 +773,7 @@ var $ = /* @__PURE__ */ a({
772
773
  "onKeydown"
773
774
  ]));
774
775
  }
775
- }), ue = /* @__PURE__ */ a({
776
+ }), de = /* @__PURE__ */ a({
776
777
  __name: "EventResizeHandle",
777
778
  props: {
778
779
  asChild: { type: Boolean },
@@ -799,7 +800,7 @@ var $ = /* @__PURE__ */ a({
799
800
  "data-edge"
800
801
  ])) : n("", !0);
801
802
  }
802
- }), de = /* @__PURE__ */ a({
803
+ }), fe = /* @__PURE__ */ a({
803
804
  __name: "Gantt",
804
805
  props: {
805
806
  asChild: { type: Boolean },
@@ -830,7 +831,7 @@ var $ = /* @__PURE__ */ a({
830
831
  "onPointerdown"
831
832
  ]));
832
833
  }
833
- }), fe = /* @__PURE__ */ a({
834
+ }), pe = /* @__PURE__ */ a({
834
835
  __name: "GanttBar",
835
836
  props: {
836
837
  asChild: { type: Boolean },
@@ -887,7 +888,7 @@ var $ = /* @__PURE__ */ a({
887
888
  "onKeydown"
888
889
  ]));
889
890
  }
890
- }), pe = /* @__PURE__ */ a({
891
+ }), me = /* @__PURE__ */ a({
891
892
  __name: "GanttLinks",
892
893
  props: {
893
894
  gap: { default: 12 },
@@ -945,7 +946,7 @@ var $ = /* @__PURE__ */ a({
945
946
  "aria-hidden": "true"
946
947
  }, [g(e.$slots, "default", { links: y.value })], 512));
947
948
  }
948
- }), me = /* @__PURE__ */ a({
949
+ }), he = /* @__PURE__ */ a({
949
950
  __name: "GanttRow",
950
951
  props: {
951
952
  asChild: { type: Boolean },
@@ -970,7 +971,7 @@ var $ = /* @__PURE__ */ a({
970
971
  "data-row-event-id"
971
972
  ]));
972
973
  }
973
- }), he = /* @__PURE__ */ a({
974
+ }), ge = /* @__PURE__ */ a({
974
975
  __name: "GanttToday",
975
976
  props: {
976
977
  asChild: { type: Boolean },
@@ -993,7 +994,7 @@ var $ = /* @__PURE__ */ a({
993
994
  "style"
994
995
  ]));
995
996
  }
996
- }), ge = /* @__PURE__ */ a({
997
+ }), _e = /* @__PURE__ */ a({
997
998
  __name: "GanttTrack",
998
999
  props: {
999
1000
  asChild: { type: Boolean },
@@ -1017,7 +1018,7 @@ var $ = /* @__PURE__ */ a({
1017
1018
  "data-axis-days"
1018
1019
  ]));
1019
1020
  }
1020
- }), _e = /* @__PURE__ */ a({
1021
+ }), ve = /* @__PURE__ */ a({
1021
1022
  __name: "MonthGrid",
1022
1023
  props: {
1023
1024
  asChild: { type: Boolean },
@@ -1066,7 +1067,7 @@ var $ = /* @__PURE__ */ a({
1066
1067
  "onPointerdown"
1067
1068
  ]));
1068
1069
  }
1069
- }), ve = /* @__PURE__ */ a({
1070
+ }), ye = /* @__PURE__ */ a({
1070
1071
  __name: "MonthWeek",
1071
1072
  props: {
1072
1073
  asChild: { type: Boolean },
@@ -1096,7 +1097,7 @@ var $ = /* @__PURE__ */ a({
1096
1097
  "data-overflow"
1097
1098
  ]));
1098
1099
  }
1099
- }), ye = /* @__PURE__ */ a({
1100
+ }), be = /* @__PURE__ */ a({
1100
1101
  __name: "MonthWeekday",
1101
1102
  props: {
1102
1103
  asChild: { type: Boolean },
@@ -1124,7 +1125,7 @@ var $ = /* @__PURE__ */ a({
1124
1125
  "data-weekend"
1125
1126
  ]));
1126
1127
  }
1127
- }), be = /* @__PURE__ */ a({
1128
+ }), xe = /* @__PURE__ */ a({
1128
1129
  __name: "NowIndicator",
1129
1130
  props: {
1130
1131
  asChild: { type: Boolean },
@@ -1148,7 +1149,7 @@ var $ = /* @__PURE__ */ a({
1148
1149
  "style"
1149
1150
  ])) : n("", !0);
1150
1151
  }
1151
- }), xe = /* @__PURE__ */ a({
1152
+ }), Se = /* @__PURE__ */ a({
1152
1153
  __name: "ResourceCell",
1153
1154
  props: {
1154
1155
  asChild: { type: Boolean },
@@ -1184,7 +1185,7 @@ var $ = /* @__PURE__ */ a({
1184
1185
  "data-today": a.value?.isToday ? "" : void 0,
1185
1186
  "data-weekend": a.value?.isWeekend ? "" : void 0,
1186
1187
  "data-busy": n.cell.eventCount ? "" : void 0,
1187
- "data-overlap": n.cell.eventCount > 1 ? "" : void 0,
1188
+ "data-overlap": n.cell.hasOverlap ? "" : void 0,
1188
1189
  "data-focused": o.value ? "" : void 0,
1189
1190
  "data-selected": c.value ? "" : void 0,
1190
1191
  "data-drop": "day",
@@ -1212,7 +1213,7 @@ var $ = /* @__PURE__ */ a({
1212
1213
  "data-resource-id"
1213
1214
  ]));
1214
1215
  }
1215
- }), Se = /* @__PURE__ */ a({
1216
+ }), Ce = /* @__PURE__ */ a({
1216
1217
  __name: "ResourceDayHeader",
1217
1218
  props: {
1218
1219
  asChild: { type: Boolean },
@@ -1242,7 +1243,7 @@ var $ = /* @__PURE__ */ a({
1242
1243
  "data-weekend"
1243
1244
  ]));
1244
1245
  }
1245
- }), Ce = /* @__PURE__ */ a({
1246
+ }), we = /* @__PURE__ */ a({
1246
1247
  __name: "ResourceGrid",
1247
1248
  props: {
1248
1249
  asChild: { type: Boolean },
@@ -1317,7 +1318,7 @@ var $ = /* @__PURE__ */ a({
1317
1318
  "onPointerdown"
1318
1319
  ]));
1319
1320
  }
1320
- }), we = /* @__PURE__ */ a({
1321
+ }), Te = /* @__PURE__ */ a({
1321
1322
  __name: "ResourceLabel",
1322
1323
  props: {
1323
1324
  asChild: { type: Boolean },
@@ -1339,7 +1340,7 @@ var $ = /* @__PURE__ */ a({
1339
1340
  _: 3
1340
1341
  }, 8, ["as", "as-child"]));
1341
1342
  }
1342
- }), Te = /* @__PURE__ */ a({
1343
+ }), Ee = /* @__PURE__ */ a({
1343
1344
  __name: "ResourceRow",
1344
1345
  props: {
1345
1346
  asChild: { type: Boolean },
@@ -1371,7 +1372,7 @@ var $ = /* @__PURE__ */ a({
1371
1372
  "data-overlap"
1372
1373
  ]));
1373
1374
  }
1374
- }), Ee = /* @__PURE__ */ a({
1375
+ }), De = /* @__PURE__ */ a({
1375
1376
  __name: "TimeColumn",
1376
1377
  props: {
1377
1378
  asChild: { type: Boolean },
@@ -1404,7 +1405,7 @@ var $ = /* @__PURE__ */ a({
1404
1405
  "data-weekend"
1405
1406
  ]));
1406
1407
  }
1407
- }), De = /* @__PURE__ */ a({
1408
+ }), Oe = /* @__PURE__ */ a({
1408
1409
  __name: "TimeEvent",
1409
1410
  props: {
1410
1411
  asChild: { type: Boolean },
@@ -1463,7 +1464,7 @@ var $ = /* @__PURE__ */ a({
1463
1464
  "onKeydown"
1464
1465
  ]));
1465
1466
  }
1466
- }), Oe = /* @__PURE__ */ a({
1467
+ }), ke = /* @__PURE__ */ a({
1467
1468
  __name: "TimeGrid",
1468
1469
  props: {
1469
1470
  asChild: { type: Boolean },
@@ -1498,7 +1499,7 @@ var $ = /* @__PURE__ */ a({
1498
1499
  "onPointerdown"
1499
1500
  ]));
1500
1501
  }
1501
- }), ke = /* @__PURE__ */ a({
1502
+ }), Ae = /* @__PURE__ */ a({
1502
1503
  __name: "TimeSelection",
1503
1504
  props: {
1504
1505
  asChild: { type: Boolean },
@@ -1533,7 +1534,7 @@ var $ = /* @__PURE__ */ a({
1533
1534
  "style"
1534
1535
  ])) : n("", !0);
1535
1536
  }
1536
- }), Ae = /* @__PURE__ */ a({
1537
+ }), je = /* @__PURE__ */ a({
1537
1538
  __name: "Timeline",
1538
1539
  props: {
1539
1540
  asChild: { type: Boolean },
@@ -1568,7 +1569,7 @@ var $ = /* @__PURE__ */ a({
1568
1569
  "onPointerdown"
1569
1570
  ]));
1570
1571
  }
1571
- }), je = /* @__PURE__ */ a({
1572
+ }), Me = /* @__PURE__ */ a({
1572
1573
  __name: "TimelineEvent",
1573
1574
  props: {
1574
1575
  asChild: { type: Boolean },
@@ -1633,7 +1634,7 @@ var $ = /* @__PURE__ */ a({
1633
1634
  "onKeydown"
1634
1635
  ]));
1635
1636
  }
1636
- }), Me = /* @__PURE__ */ a({
1637
+ }), Ne = /* @__PURE__ */ a({
1637
1638
  __name: "TimelineNow",
1638
1639
  props: {
1639
1640
  asChild: { type: Boolean },
@@ -1659,7 +1660,7 @@ var $ = /* @__PURE__ */ a({
1659
1660
  "style"
1660
1661
  ]));
1661
1662
  }
1662
- }), Ne = /* @__PURE__ */ a({
1663
+ }), Pe = /* @__PURE__ */ a({
1663
1664
  __name: "TimelineRow",
1664
1665
  props: {
1665
1666
  asChild: { type: Boolean },
@@ -1691,7 +1692,7 @@ var $ = /* @__PURE__ */ a({
1691
1692
  "data-idle"
1692
1693
  ]));
1693
1694
  }
1694
- }), Pe = /* @__PURE__ */ a({
1695
+ }), Fe = /* @__PURE__ */ a({
1695
1696
  __name: "TimelineSelection",
1696
1697
  props: {
1697
1698
  asChild: { type: Boolean },
@@ -1726,7 +1727,7 @@ var $ = /* @__PURE__ */ a({
1726
1727
  "style"
1727
1728
  ])) : n("", !0);
1728
1729
  }
1729
- }), Fe = /* @__PURE__ */ a({
1730
+ }), Ie = /* @__PURE__ */ a({
1730
1731
  __name: "TimelineTrack",
1731
1732
  props: {
1732
1733
  asChild: { type: Boolean },
@@ -1752,6 +1753,6 @@ var $ = /* @__PURE__ */ a({
1752
1753
  ]));
1753
1754
  }
1754
1755
  });
1755
- export { ae as CalendarHeading, oe as CalendarNav, se as CalendarRoot, $ as EventBar, $ as MonthEvent, ue as EventResizeHandle, de as Gantt, fe as GanttBar, pe as GanttLinks, me as GanttRow, he as GanttToday, ge as GanttTrack, ce as MonthDay, le as MonthDayMore, _e as MonthGrid, ve as MonthWeek, ye as MonthWeekday, be as NowIndicator, xe as ResourceCell, Se as ResourceDayHeader, Ce as ResourceGrid, we as ResourceLabel, Te as ResourceRow, Ee as TimeColumn, De as TimeEvent, Oe as TimeGrid, ke as TimeSelection, Ae as Timeline, je as TimelineEvent, Me as TimelineNow, Ne as TimelineRow, Pe as TimelineSelection, Fe as TimelineTrack, Y as injectCalendarContext, Q as injectEventPrimitive, J as provideCalendarContext, K as useCalendar, Z as useEventState, G as useInteractions };
1756
+ export { oe as CalendarHeading, se as CalendarNav, ce as CalendarRoot, $ as EventBar, $ as MonthEvent, de as EventResizeHandle, fe as Gantt, pe as GanttBar, me as GanttLinks, he as GanttRow, ge as GanttToday, _e as GanttTrack, le as MonthDay, ue as MonthDayMore, ve as MonthGrid, ye as MonthWeek, be as MonthWeekday, xe as NowIndicator, Se as ResourceCell, Ce as ResourceDayHeader, we as ResourceGrid, Te as ResourceLabel, Ee as ResourceRow, De as TimeColumn, Oe as TimeEvent, ke as TimeGrid, Ae as TimeSelection, je as Timeline, Me as TimelineEvent, Ne as TimelineNow, Pe as TimelineRow, Fe as TimelineSelection, Ie as TimelineTrack, Y as injectCalendarContext, Q as injectEventPrimitive, J as provideCalendarContext, K as useCalendar, Z as useEventState, G as useInteractions };
1756
1757
 
1757
1758
  //# sourceMappingURL=index.js.map