@savvycal/calendar 0.1.0

package/dist/components/resource-grid-view/EventChip.js

@@ -0,0 +1,112 @@
+import { jsx as i, jsxs as v, Fragment as L } from "react/jsx-runtime";
+import { memo as P } from "react";
+import { cn as z } from "../../lib/utils.js";
+import { formatEventStartTime as B, formatTimeRange as K } from "../../lib/time.js";
+const J = P(function({
+  positioned: h,
+  resource: k,
+  timeZone: f,
+  cls: n,
+  onClick: x,
+  renderEvent: N,
+  interactive: o = !0,
+  eventGap: w = 2,
+  eventLayout: E = "columns",
+  stackOffset: T = 8,
+  isSelected: g,
+  selectedEventRef: $
+}) {
+  const { event: e, top: b, height: r, subColumn: s, totalSubColumns: a } = h, l = e.color ?? k.color ?? void 0;
+  let c, m, d;
+  if (E === "stacked") {
+    const t = (a - 1) * T;
+    c = s > 0 ? `${s * T}px` : "0", m = t > 0 ? `calc(100% - ${t}px)` : "100%", d = s + 1;
+  } else {
+    const t = s / a * 100, C = 1 / a * 100, y = w, I = s * y / a, u = (a - 1) * y / a;
+    c = u ? `calc(${t}% + ${I}px)` : `${t}%`, m = u ? `calc(${C}% - ${u}px)` : `${C}%`;
+  }
+  g && (d = 10);
+  const S = r >= 36, j = r >= 52, D = e.status === "canceled";
+  if (N)
+    return /* @__PURE__ */ i(
+      "div",
+      {
+        ref: $,
+        style: {
+          position: "absolute",
+          top: b,
+          height: r,
+          left: c,
+          width: m,
+          zIndex: d,
+          pointerEvents: o ? "auto" : "none"
+        },
+        children: N({ event: e, position: h })
+      }
+    );
+  const p = B(e.startTime, f), F = o ? (() => {
+    const t = [
+      e.title,
+      K(e.startTime, e.endTime, f)
+    ];
+    return e.clientName && t.push(e.clientName), e.status === "canceled" ? t.push("canceled") : e.status === "tentative" && t.push("tentative"), t.join(", ");
+  })() : void 0;
+  return /* @__PURE__ */ v(
+    "div",
+    {
+      ref: $,
+      ...o ? { role: "button", tabIndex: 0, "aria-label": F } : {},
+      className: z(n("event"), g && n("eventSelected")),
+      style: {
+        top: b,
+        height: r,
+        left: c,
+        width: m,
+        zIndex: d,
+        pointerEvents: o ? "auto" : "none"
+      },
+      ...o ? {
+        onClick: () => x?.(e),
+        onKeyDown: (t) => {
+          (t.key === "Enter" || t.key === " ") && (t.preventDefault(), x?.(e));
+        }
+      } : {},
+      children: [
+        l && /* @__PURE__ */ i(
+          "div",
+          {
+            className: n("eventColorBar"),
+            style: e.status === "tentative" ? {
+              backgroundImage: `repeating-linear-gradient(
+                    -45deg,
+                    ${l},
+                    ${l} 3px,
+                    transparent 3px,
+                    transparent 6px
+                  )`
+            } : { backgroundColor: l }
+          }
+        ),
+        /* @__PURE__ */ i(
+          "div",
+          {
+            className: n("eventTitle"),
+            style: D ? { textDecoration: "line-through" } : void 0,
+            children: e.title
+          }
+        ),
+        S && (j ? /* @__PURE__ */ v(L, { children: [
+          /* @__PURE__ */ i("div", { className: n("eventTime"), children: p }),
+          e.clientName && /* @__PURE__ */ i("div", { className: n("eventClientName"), children: e.clientName })
+        ] }) : e.clientName ? /* @__PURE__ */ v("div", { className: n("eventTime"), children: [
+          p,
+          ", ",
+          e.clientName
+        ] }) : /* @__PURE__ */ i("div", { className: n("eventTime"), children: p }))
+      ]
+    }
+  );
+});
+export {
+  J as EventChip
+};

package/dist/components/resource-grid-view/GridHeader.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+import { CalendarResource, ResourceGridViewClassNames } from '../../types/calendar';
+interface GridHeaderProps {
+    resource: CalendarResource;
+    column: number;
+    cls: (key: keyof ResourceGridViewClassNames) => string;
+    renderHeader?: (props: {
+        resource: CalendarResource;
+    }) => ReactNode;
+}
+export declare const GridHeader: import('react').NamedExoticComponent<GridHeaderProps>;
+export {};
+//# sourceMappingURL=GridHeader.d.ts.map

package/dist/components/resource-grid-view/GridHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridHeader.d.ts","sourceRoot":"","sources":["../../../src/components/resource-grid-view/GridHeader.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EACV,gBAAgB,EAChB,0BAA0B,EAC3B,MAAM,kBAAkB,CAAC;AAE1B,UAAU,eAAe;IACvB,QAAQ,EAAE,gBAAgB,CAAC;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,0BAA0B,KAAK,MAAM,CAAC;IACvD,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,QAAQ,EAAE,gBAAgB,CAAA;KAAE,KAAK,SAAS,CAAC;CACrE;AAED,eAAO,MAAM,UAAU,uDA4BrB,CAAC"}

package/dist/components/resource-grid-view/GridHeader.js

@@ -0,0 +1,31 @@
+import { jsx as e, jsxs as d, Fragment as i } from "react/jsx-runtime";
+import { memo as t } from "react";
+const h = t(function({
+  resource: a,
+  column: l,
+  cls: r,
+  renderHeader: m
+}) {
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      role: "columnheader",
+      className: r("headerCell"),
+      style: { gridRow: 1, gridColumn: l },
+      children: m ? m({ resource: a }) : /* @__PURE__ */ d(i, { children: [
+        a.avatarUrl && /* @__PURE__ */ e(
+          "img",
+          {
+            src: a.avatarUrl,
+            alt: "",
+            className: r("headerAvatar")
+          }
+        ),
+        /* @__PURE__ */ e("span", { className: r("headerName"), children: a.name })
+      ] })
+    }
+  );
+});
+export {
+  h as GridHeader
+};

package/dist/components/resource-grid-view/NowIndicator.d.ts

@@ -0,0 +1,13 @@
+import { Temporal } from 'temporal-polyfill';
+import { ResourceGridViewClassNames } from '../../types/calendar';
+interface NowIndicatorProps {
+    date: Temporal.PlainDate;
+    timeZone: string;
+    startHour: number;
+    endHour: number;
+    hourHeight: number;
+    cls: (key: keyof ResourceGridViewClassNames) => string;
+}
+export declare const NowIndicator: import('react').NamedExoticComponent<NowIndicatorProps>;
+export {};
+//# sourceMappingURL=NowIndicator.d.ts.map

package/dist/components/resource-grid-view/NowIndicator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NowIndicator.d.ts","sourceRoot":"","sources":["../../../src/components/resource-grid-view/NowIndicator.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,kBAAkB,CAAC;AAEnE,UAAU,iBAAiB;IACzB,IAAI,EAAE,QAAQ,CAAC,SAAS,CAAC;IACzB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,0BAA0B,KAAK,MAAM,CAAC;CACxD;AA0BD,eAAO,MAAM,YAAY,yDAuCvB,CAAC"}

package/dist/components/resource-grid-view/NowIndicator.js

@@ -0,0 +1,43 @@
+import { jsx as d } from "react/jsx-runtime";
+import { memo as p, useState as I, useEffect as v } from "react";
+import { Temporal as c } from "temporal-polyfill";
+function w(e, n) {
+  const t = c.Now.plainDateISO(n);
+  return c.PlainDate.compare(t, e) === 0;
+}
+function T(e, n, t, s) {
+  const r = c.Now.zonedDateTimeISO(e), o = r.hour * 60 + r.minute, i = n * 60, a = t * 60;
+  return o < i || o >= a ? null : (o - i) / 60 * s;
+}
+const M = p(function({
+  date: n,
+  timeZone: t,
+  startHour: s,
+  endHour: r,
+  hourHeight: o,
+  cls: i
+}) {
+  const [, a] = I(0), u = w(n, t), l = u ? T(t, s, r, o) : null;
+  return v(() => {
+    if (!u) return;
+    const f = setInterval(() => {
+      a((m) => m + 1);
+    }, 6e4);
+    return () => clearInterval(f);
+  }, [u]), l === null ? null : /* @__PURE__ */ d(
+    "div",
+    {
+      "aria-hidden": "true",
+      style: {
+        gridRow: "3 / -1",
+        gridColumn: "1 / -1",
+        position: "relative",
+        pointerEvents: "none"
+      },
+      children: /* @__PURE__ */ d("div", { className: i("nowIndicator"), style: { top: l } })
+    }
+  );
+});
+export {
+  M as NowIndicator
+};

package/dist/components/resource-grid-view/ResourceColumn.d.ts

@@ -0,0 +1,22 @@
+import { Ref } from 'react';
+import { CalendarEvent, CalendarResource, EventLayout, PositionedEvent, ResourceGridViewClassNames, TimedCalendarEvent } from '../../types/calendar';
+interface ResourceColumnProps {
+    resource: CalendarResource;
+    positionedEvents: PositionedEvent[];
+    column: number;
+    timeZone: string;
+    cls: (key: keyof ResourceGridViewClassNames) => string;
+    onEventClick?: (event: CalendarEvent) => void;
+    renderEvent?: (props: {
+        event: TimedCalendarEvent;
+        position: PositionedEvent;
+    }) => React.ReactNode;
+    eventGap?: number;
+    eventLayout?: EventLayout;
+    stackOffset?: number;
+    selectedEventId?: string | null;
+    selectedEventRef?: Ref<HTMLDivElement>;
+}
+export declare const ResourceColumn: import('react').NamedExoticComponent<ResourceColumnProps>;
+export {};
+//# sourceMappingURL=ResourceColumn.d.ts.map

package/dist/components/resource-grid-view/ResourceColumn.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResourceColumn.d.ts","sourceRoot":"","sources":["../../../src/components/resource-grid-view/ResourceColumn.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EACV,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,eAAe,EACf,0BAA0B,EAC1B,kBAAkB,EACnB,MAAM,kBAAkB,CAAC;AAG1B,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,gBAAgB,CAAC;IAC3B,gBAAgB,EAAE,eAAe,EAAE,CAAC;IACpC,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,0BAA0B,KAAK,MAAM,CAAC;IACvD,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE;QACpB,KAAK,EAAE,kBAAkB,CAAC;QAC1B,QAAQ,EAAE,eAAe,CAAC;KAC3B,KAAK,KAAK,CAAC,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAChC,gBAAgB,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CACxC;AAED,eAAO,MAAM,cAAc,2DA4CzB,CAAC"}

package/dist/components/resource-grid-view/ResourceColumn.js

@@ -0,0 +1,52 @@
+import { jsx as r } from "react/jsx-runtime";
+import { memo as p } from "react";
+import { EventChip as R } from "./EventChip.js";
+const x = p(function({
+  resource: t,
+  positionedEvents: m,
+  column: i,
+  timeZone: c,
+  cls: n,
+  onEventClick: l,
+  renderEvent: u,
+  eventGap: s,
+  eventLayout: v,
+  stackOffset: d,
+  selectedEventId: C,
+  selectedEventRef: f
+}) {
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      className: n("eventColumn"),
+      style: {
+        gridRow: "3 / -1",
+        gridColumn: i,
+        pointerEvents: "none"
+      },
+      children: m.map((e) => {
+        const o = e.event.id === C;
+        return /* @__PURE__ */ r(
+          R,
+          {
+            positioned: e,
+            resource: t,
+            timeZone: c,
+            cls: n,
+            onClick: l,
+            renderEvent: u,
+            eventGap: s,
+            eventLayout: v,
+            stackOffset: d,
+            isSelected: o,
+            selectedEventRef: o ? f : void 0
+          },
+          e.event.id
+        );
+      })
+    }
+  );
+});
+export {
+  x as ResourceColumn
+};

package/dist/components/resource-grid-view/ResourceGridView.d.ts

@@ -0,0 +1,3 @@
+import { ResourceGridViewProps } from '../../types/calendar';
+export declare function ResourceGridView({ date, timeZone, resources, events, availability, unavailability, timeAxis, onEventClick, snapDuration, placeholderDuration, selectedRange, onSelect, onSlotClick, className, classNames, hourHeight, columnMinWidth, renderHeader, renderEvent, selectionAppearance, dragPreviewAppearance, selectionRef, selectedEventId, selectedEventRef, renderCorner, eventGap, eventLayout, stackOffset, }: ResourceGridViewProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ResourceGridView.d.ts.map

package/dist/components/resource-grid-view/ResourceGridView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResourceGridView.d.ts","sourceRoot":"","sources":["../../../src/components/resource-grid-view/ResourceGridView.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAIV,qBAAqB,EAGtB,MAAM,kBAAkB,CAAC;AAa1B,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,MAAM,EACN,YAAY,EACZ,cAAc,EACd,QAAQ,EACR,YAAY,EACZ,YAAY,EACZ,mBAAmB,EACnB,aAAa,EACb,QAAQ,EACR,WAAW,EACX,SAAS,EACT,UAAU,EACV,UAAe,EACf,cAAoB,EACpB,YAAY,EACZ,WAAW,EACX,mBAAmB,EACnB,qBAAqB,EACrB,YAAY,EACZ,eAAe,EACf,gBAAgB,EAChB,YAAY,EACZ,QAAQ,EACR,WAAuB,EACvB,WAAe,GAChB,EAAE,qBAAqB,2CAkWvB"}

package/dist/components/resource-grid-view/ResourceGridView.js

@@ -0,0 +1,342 @@
+import { jsxs as M, jsx as n } from "react/jsx-runtime";
+import { useCallback as D, useMemo as p, useEffect as no } from "react";
+import { cn as R } from "../../lib/utils.js";
+import { generateTimeSlots as lo, formatDateLabel as ao, formatTimeRange as B } from "../../lib/time.js";
+import { groupByResource as mo, computePositionedEvents as so } from "../../lib/overlap.js";
+import { computeUnavailableBlocks as co } from "../../lib/availability.js";
+import { resourceGridViewDefaults as uo } from "./defaults.js";
+import { GridHeader as po } from "./GridHeader.js";
+import { TimeGutter as fo } from "./TimeGutter.js";
+import { ResourceColumn as ho } from "./ResourceColumn.js";
+import { SlotInteractionLayer as go } from "./SlotInteractionLayer.js";
+import { SelectionOverlay as yo } from "./SelectionOverlay.js";
+import { UnavailabilityOverlay as wo } from "./UnavailabilityOverlay.js";
+import { NowIndicator as Ho } from "./NowIndicator.js";
+import { AllDayRow as bo } from "./AllDayRow.js";
+import { useEffectiveHourHeight as Co } from "./useEffectiveHourHeight.js";
+import { useAnnouncer as Do } from "./useAnnouncer.js";
+function Uo({
+  date: d,
+  timeZone: l,
+  resources: i,
+  events: $,
+  availability: g,
+  unavailability: y,
+  timeAxis: w,
+  onEventClick: v,
+  snapDuration: x,
+  placeholderDuration: L,
+  selectedRange: f,
+  onSelect: c,
+  onSlotClick: G,
+  className: O,
+  classNames: S,
+  hourHeight: W = 60,
+  columnMinWidth: U = 120,
+  renderHeader: V,
+  renderEvent: H,
+  selectionAppearance: z,
+  dragPreviewAppearance: A,
+  selectionRef: F,
+  selectedEventId: T,
+  selectedEventRef: k,
+  renderCorner: K,
+  eventGap: P,
+  eventLayout: q = "columns",
+  stackOffset: J = 8
+}) {
+  const a = w?.startHour ?? 0, m = w?.endHour ?? 24, b = w?.intervalMinutes ?? 60, { effectiveHourHeight: s, rootRef: Q, headerRef: X, allDayRef: Y, headerHeight: N } = Co(W, m - a), e = D(
+    (o) => R(uo[o], S?.[o]),
+    [S]
+  ), C = p(
+    () => lo({ startHour: a, endHour: m, intervalMinutes: b }),
+    [a, m, b]
+  ), { allDayEvents: E, timedEvents: j } = p(() => {
+    const o = [], r = [];
+    for (const t of $)
+      t.allDay ? o.push(t) : r.push(t);
+    return { allDayEvents: o, timedEvents: r };
+  }, [$]), _ = p(
+    () => mo(E),
+    [E]
+  ), Z = p(
+    () => so(
+      j,
+      l,
+      d,
+      a,
+      m,
+      s
+    ),
+    [j, l, d, a, m, s]
+  ), oo = p(() => {
+    if (!g && !y)
+      return /* @__PURE__ */ new Map();
+    const o = /* @__PURE__ */ new Set([
+      ...Object.keys(g ?? {}),
+      ...Object.keys(y ?? {})
+    ]), r = /* @__PURE__ */ new Map();
+    for (const t of o) {
+      const u = co(
+        g?.[t],
+        y?.[t],
+        l,
+        d,
+        a,
+        m,
+        s
+      );
+      u.length > 0 && r.set(t, u);
+    }
+    return r;
+  }, [
+    g,
+    y,
+    l,
+    d,
+    a,
+    m,
+    s
+  ]), { message: ro, announce: h } = Do(), to = p(
+    () => `Schedule for ${ao(d)}`,
+    [d]
+  ), I = D(
+    (o) => {
+      if (c?.(null), v?.(o), o.allDay) {
+        const r = [o.title, "all day"];
+        o.clientName && r.push(o.clientName), h(`Selected: ${r.join(", ")}`);
+      } else {
+        const r = [
+          o.title,
+          B(o.startTime, o.endTime, l)
+        ];
+        o.clientName && r.push(o.clientName);
+        const t = i.find((u) => u.id === o.resourceId);
+        t && r.push(t.name), h(`Selected: ${r.join(", ")}`);
+      }
+    },
+    [c, v, l, i, h]
+  ), io = D(
+    (o) => {
+      if (c?.(o), o) {
+        const r = [
+          B(o.startTime, o.endTime, l)
+        ], t = i.find((u) => u.id === o.resourceId);
+        t && r.push(t.name), h(`Selected time: ${r.join(", ")}`);
+      }
+    },
+    [c, l, i, h]
+  );
+  no(() => {
+    if (!f || !c) return;
+    const o = (r) => {
+      r.key === "Escape" && c(null);
+    };
+    return document.addEventListener("keydown", o), () => document.removeEventListener("keydown", o);
+  }, [f, c]);
+  const eo = s * b / 60;
+  return /* @__PURE__ */ M("div", { ref: Q, className: R(e("root"), O), children: [
+    /* @__PURE__ */ M(
+      "div",
+      {
+        className: e("grid"),
+        role: "region",
+        "aria-roledescription": "calendar",
+        "aria-label": to,
+        style: {
+          display: "grid",
+          gridTemplateColumns: `max-content repeat(${i.length}, minmax(${U}px, 1fr))`,
+          gridTemplateRows: `auto auto repeat(${C.length}, ${eo}px)`
+        },
+        children: [
+          /* @__PURE__ */ n(
+            "div",
+            {
+              ref: X,
+              className: e("cornerCell"),
+              style: { gridRow: 1, gridColumn: 1 },
+              children: K?.()
+            }
+          ),
+          i.map((o, r) => /* @__PURE__ */ n(
+            po,
+            {
+              resource: o,
+              column: r + 2,
+              cls: e,
+              renderHeader: V
+            },
+            o.id
+          )),
+          /* @__PURE__ */ n(
+            "div",
+            {
+              ref: Y,
+              className: R(e("allDayCell"), "left-0 z-30"),
+              style: {
+                gridRow: 2,
+                gridColumn: 1,
+                top: N
+              }
+            }
+          ),
+          i.map((o, r) => /* @__PURE__ */ n(
+            "div",
+            {
+              className: e("allDayCell"),
+              style: {
+                gridRow: 2,
+                gridColumn: r + 2,
+                top: N,
+                ...r === i.length - 1 ? { borderRightWidth: 0 } : {}
+              },
+              children: /* @__PURE__ */ n(
+                bo,
+                {
+                  events: _.get(o.id) ?? [],
+                  cls: e,
+                  onEventClick: I,
+                  selectedEventId: T,
+                  selectedEventRef: k
+                }
+              )
+            },
+            `allday-${o.id}`
+          )),
+          C.map((o) => /* @__PURE__ */ n(
+            fo,
+            {
+              label: o.label,
+              row: o.index + 3,
+              isHourStart: o.isHourStart,
+              isFirst: o.index === 0,
+              cls: e
+            },
+            o.index
+          )),
+          C.map(
+            (o) => i.map((r, t) => /* @__PURE__ */ n(
+              "div",
+              {
+                className: e(o.isHourStart ? "bodyCell" : "bodyCellMinor"),
+                style: {
+                  gridRow: o.index + 3,
+                  gridColumn: t + 2,
+                  ...o.isHourStart ? {} : { borderTopStyle: "dotted" },
+                  ...o.index === 0 ? { borderTopWidth: 0 } : {},
+                  ...t === i.length - 1 ? { borderRightWidth: 0 } : {}
+                }
+              },
+              `${o.index}-${r.id}`
+            ))
+          ),
+          i.map((o, r) => {
+            const t = oo.get(o.id);
+            return t ? /* @__PURE__ */ n(
+              wo,
+              {
+                blocks: t,
+                column: r + 2,
+                cls: e
+              },
+              `unavail-${o.id}`
+            ) : null;
+          }),
+          x != null && i.map((o, r) => /* @__PURE__ */ n(
+            go,
+            {
+              resource: o,
+              column: r + 2,
+              date: d,
+              timeZone: l,
+              startHour: a,
+              endHour: m,
+              hourHeight: s,
+              snapDuration: x,
+              placeholderDuration: L ?? 15,
+              cls: e,
+              onSlotClick: G,
+              onSelect: io,
+              dragPreviewAppearance: A,
+              renderEvent: H
+            },
+            `slot-${o.id}`
+          )),
+          i.map((o, r) => /* @__PURE__ */ n(
+            ho,
+            {
+              resource: o,
+              positionedEvents: Z.get(o.id) ?? [],
+              column: r + 2,
+              timeZone: l,
+              cls: e,
+              onEventClick: I,
+              renderEvent: H,
+              eventGap: P,
+              eventLayout: q,
+              stackOffset: J,
+              selectedEventId: T,
+              selectedEventRef: k
+            },
+            o.id
+          )),
+          f != null && (() => {
+            const o = i.findIndex(
+              (r) => r.id === f.resourceId
+            );
+            return o === -1 ? null : /* @__PURE__ */ n(
+              yo,
+              {
+                selectedRange: f,
+                column: o + 2,
+                resource: i[o],
+                viewDate: d,
+                timeZone: l,
+                startHour: a,
+                hourHeight: s,
+                cls: e,
+                appearance: z,
+                selectionRef: F,
+                renderEvent: H
+              }
+            );
+          })(),
+          /* @__PURE__ */ n(
+            Ho,
+            {
+              date: d,
+              timeZone: l,
+              startHour: a,
+              endHour: m,
+              hourHeight: s,
+              cls: e
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ n(
+      "div",
+      {
+        "aria-live": "polite",
+        "aria-atomic": "true",
+        role: "status",
+        style: {
+          position: "absolute",
+          width: 1,
+          height: 1,
+          padding: 0,
+          margin: -1,
+          overflow: "hidden",
+          clip: "rect(0, 0, 0, 0)",
+          whiteSpace: "nowrap",
+          borderWidth: 0
+        },
+        children: ro
+      }
+    )
+  ] });
+}
+export {
+  Uo as ResourceGridView
+};

package/dist/components/resource-grid-view/SelectionOverlay.d.ts

@@ -0,0 +1,22 @@
+import { Ref } from 'react';
+import { Temporal } from 'temporal-polyfill';
+import { CalendarResource, PositionedEvent, ResourceGridViewClassNames, SelectedRange, SelectionAppearance, TimedCalendarEvent } from '../../types/calendar';
+interface SelectionOverlayProps {
+    selectedRange: SelectedRange;
+    column: number;
+    resource: CalendarResource;
+    viewDate: Temporal.PlainDate;
+    timeZone: string;
+    startHour: number;
+    hourHeight: number;
+    cls: (key: keyof ResourceGridViewClassNames) => string;
+    appearance?: SelectionAppearance;
+    selectionRef?: Ref<HTMLDivElement>;
+    renderEvent?: (props: {
+        event: TimedCalendarEvent;
+        position: PositionedEvent;
+    }) => React.ReactNode;
+}
+export declare const SelectionOverlay: import('react').NamedExoticComponent<SelectionOverlayProps>;
+export {};
+//# sourceMappingURL=SelectionOverlay.d.ts.map

package/dist/components/resource-grid-view/SelectionOverlay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectionOverlay.d.ts","sourceRoot":"","sources":["../../../src/components/resource-grid-view/SelectionOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,KAAK,EACV,gBAAgB,EAChB,eAAe,EACf,0BAA0B,EAC1B,aAAa,EACb,mBAAmB,EACnB,kBAAkB,EACnB,MAAM,kBAAkB,CAAC;AAK1B,UAAU,qBAAqB;IAC7B,aAAa,EAAE,aAAa,CAAC;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,gBAAgB,CAAC;IAC3B,QAAQ,EAAE,QAAQ,CAAC,SAAS,CAAC;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,0BAA0B,KAAK,MAAM,CAAC;IACvD,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,YAAY,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IACnC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE;QACpB,KAAK,EAAE,kBAAkB,CAAC;QAC1B,QAAQ,EAAE,eAAe,CAAC;KAC3B,KAAK,KAAK,CAAC,SAAS,CAAC;CACvB;AAED,eAAO,MAAM,gBAAgB,6DAsF3B,CAAC"}