@calcom/atoms 2.8.9 → 2.9.1

package/dist/calendar-view/scheduler/components/event/all-day-events.js

@@ -0,0 +1,156 @@
+import { jsxs as C, jsx as d } from "react/jsx-runtime";
+import { useAtomsLocale as _ } from "../../../../hooks/use-atoms-locale.js";
+import { cn as N } from "../../../../lib/utils.js";
+import "../../../../vendor/dayjs/index.js";
+import { useCalendarStore as k } from "../../state/store.js";
+import { getStatusColorClass as H } from "./event.js";
+import m from "dayjs";
+const S = 32, O = 2, P = 4, M = 1440 * 60 * 1e3, w = (s, t, e) => Math.max(t, Math.min(e, s));
+function j(s, t) {
+  var r;
+  if ((r = s.options) != null && r.allDay) return !0;
+  const e = t ? m(s.start).tz(t) : m(s.start), n = t ? m(s.end).tz(t) : m(s.end);
+  return !e.isSame(n, "day");
+}
+function B(s, t, e, n) {
+  return s.isBefore(n) && t.isAfter(e);
+}
+function L(s) {
+  const t = s.map((r, o) => ({ interval: r, i: o }));
+  t.sort((r, o) => r.interval.start - o.interval.start);
+  const e = [], n = new Array(s.length);
+  for (const { interval: r, i: o } of t) {
+    let a = e.findIndex((i) => i <= r.start);
+    a === -1 ? (a = e.length, e.push(r.end)) : e[a] = r.end, n[o] = a;
+  }
+  return n;
+}
+function T({ events: s, days: t, timezone: e }) {
+  const n = [];
+  for (const l of s) {
+    if (!j(l, e)) continue;
+    const f = m(l.start).tz(e), u = m(l.end).tz(e);
+    n.push({ event: l, eventStart: f, eventEnd: u });
+  }
+  if (n.length === 0) return [];
+  const r = t[0], o = t[t.length - 1];
+  if (!r || !o) return [];
+  const a = t.map((l) => l.tz(e).startOf("day")), i = t.map((l) => l.tz(e).endOf("day")), b = a[0], y = i[i.length - 1], h = [];
+  for (const { event: l, eventStart: f, eventEnd: u } of n) {
+    if (u.isBefore(b) || f.isAfter(y))
+      continue;
+    let p = -1, v = -1;
+    for (let c = 0; c < t.length; c++)
+      B(f, u, a[c], i[c]) && (p === -1 && (p = c), v = c);
+    if (p === -1) continue;
+    const A = f.diff(a[p]), g = u.diff(a[v]), x = w(A / M, 0, 1), D = w(g / M, 0, 1);
+    h.push({ event: l, startCol: p, endCol: v, startOffsetInDay: x, endOffsetInDay: D, lane: 0 });
+  }
+  const E = L(
+    h.map((l) => ({
+      start: l.startCol + l.startOffsetInDay,
+      end: l.endCol + l.endOffsetInDay
+    }))
+  );
+  return h.forEach((l, f) => {
+    l.lane = E[f];
+  }), h;
+}
+function $({
+  span: s,
+  colCount: t,
+  timezone: e
+}) {
+  var g, x, D, c, I;
+  const { event: n, startCol: r, endCol: o, startOffsetInDay: a, endOffsetInDay: i, lane: b } = s, y = r + a, h = o + i, E = y / t * 100, l = (h - y) / t * 100, u = r !== o ? "MMM D, HH:mm" : "HH:mm", p = `${m(n.start).tz(e).format(u)} – ${m(n.end).tz(e).format(u)}`, v = (g = n.options) != null && g.color ? void 0 : H((x = n.options) == null ? void 0 : x.status), A = !!((D = n.options) != null && D.color || v);
+  return {
+    title: n.title,
+    timeRange: p,
+    dataTestId: (c = n.options) == null ? void 0 : c["data-test-id"],
+    containerStyle: {
+      left: `calc(${E}% + 2px)`,
+      width: `calc(${l}% - 4px)`,
+      top: P + b * (S + O),
+      height: S
+    },
+    strip: A ? { colorClass: v, backgroundColor: (I = n.options) == null ? void 0 : I.color } : null
+  };
+}
+function G(s) {
+  const { title: t, timeRange: e, dataTestId: n, containerStyle: r, strip: o } = $(s);
+  return /* @__PURE__ */ C(
+    "div",
+    {
+      "data-testid": n,
+      className: "bg-subtle text-emphasis border-default absolute flex overflow-hidden rounded-[6px] border px-[6px] text-[11px] font-medium leading-tight",
+      style: r,
+      children: [
+        o && /* @__PURE__ */ d(
+          "div",
+          {
+            "data-testid": "allday-color-strip",
+            className: N("-ml-1.5 mr-1.5 h-full w-[3px] shrink-0", o.colorClass),
+            style: o.backgroundColor ? { backgroundColor: o.backgroundColor } : void 0
+          }
+        ),
+        /* @__PURE__ */ C("div", { className: "flex min-w-0 flex-1 flex-col justify-center", children: [
+          /* @__PURE__ */ d("span", { className: "truncate", children: t }),
+          /* @__PURE__ */ d("span", { className: "text-subtle truncate text-[10px]", children: e })
+        ] })
+      ]
+    }
+  );
+}
+function R({ days: s, borderColor: t }) {
+  const e = t === "subtle" ? "border-l-subtle border-l" : "border-l-default border-l", n = `repeat(${s.length}, 1fr)`, r = s.map((o, a) => ({
+    key: o.toISOString(),
+    className: a > 0 ? e : ""
+  }));
+  return { gridTemplateColumns: n, columns: r };
+}
+function X(s) {
+  const { gridTemplateColumns: t, columns: e } = R(s);
+  return /* @__PURE__ */ d("div", { className: "grid h-full auto-cols-fr", style: { gridTemplateColumns: t }, children: e.map(({ key: n, className: r }) => /* @__PURE__ */ d("div", { className: r }, n)) });
+}
+function z({ days: s, timezone: t }) {
+  const e = k((a) => a.events), n = T({ events: e, days: s, timezone: t }), r = n.reduce((a, i) => Math.max(a, i.lane + 1), 0), o = P * 2 + r * S + (r - 1) * O;
+  return { spans: n, containerHeight: o, isEmpty: n.length === 0 };
+}
+function V({ days: s, showBorder: t, borderColor: e, timezone: n }) {
+  const { t: r } = _(), { spans: o, containerHeight: a, isEmpty: i } = z({ days: s, timezone: n });
+  return i ? null : /* @__PURE__ */ C(
+    "div",
+    {
+      className: N(
+        "bg-default dark:bg-cal-muted flex border-b",
+        e === "subtle" ? "border-b-subtle" : "border-b-default",
+        t && (e === "subtle" ? "border-r-subtle border-r" : "border-r-default border-r")
+      ),
+      children: [
+        /* @__PURE__ */ d(
+          "div",
+          {
+            "data-testid": "allday-row-label",
+            className: N(
+              "text-subtle flex w-16 shrink-0 items-center justify-center text-[10px]",
+              t && (e === "subtle" ? "border-l-subtle border-r-subtle border-l border-r" : "border-l-default border-r-default border-l border-r")
+            ),
+            children: r("all_day")
+          }
+        ),
+        /* @__PURE__ */ C("div", { className: "relative flex-auto", style: { height: a }, children: [
+          /* @__PURE__ */ d(X, { days: s, borderColor: e }),
+          /* @__PURE__ */ d("div", { className: "absolute inset-0 px-0.5", children: o.map((b) => /* @__PURE__ */ d(G, { span: b, colCount: s.length, timezone: n }, b.event.id)) })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  V as AllDayEvents,
+  L as assignLanes,
+  j as isInAllDayBar,
+  B as isOverlapping,
+  $ as useAllDayEventBar,
+  T as useAllDayEventSpans
+};

package/dist/calendar-view/scheduler/components/event/empty.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+import { CalendarAvailableTimeslots, OutOfOfficeRenderProps } from '../../types/state';
+import { GridCellToDateProps } from '../../utils';
+type EmptyCellProps = GridCellToDateProps & {
+    isDisabled?: boolean;
+    topOffsetMinutes?: number;
+};
+export declare function EmptyCell(props: EmptyCellProps): JSX.Element;
+type AvailableCellProps = {
+    timezone: string;
+    availableSlots: CalendarAvailableTimeslots;
+    day: GridCellToDateProps["day"];
+    startHour: GridCellToDateProps["startHour"];
+    renderOutOfOffice?: (props: OutOfOfficeRenderProps) => ReactNode;
+};
+export declare function AvailableCellsForDay({ timezone, availableSlots, day, startHour, renderOutOfOffice, }: AvailableCellProps): JSX.Element | null;
+export {};
+//# sourceMappingURL=empty.d.ts.map

package/dist/calendar-view/scheduler/components/event/empty.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty.d.ts","sourceRoot":"","sources":["../../../../../src/calendar-view/scheduler/components/event/empty.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQvC,OAAO,KAAK,EAAE,0BAA0B,EAAE,sBAAsB,EAAE,MAAM,mBAAmB,CAAC;AAC5F,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAIvD,KAAK,cAAc,GAAG,mBAAmB,GAAG;IAC1C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEF,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,eAa9C;AAED,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,0BAA0B,CAAC;IAC3C,GAAG,EAAE,mBAAmB,CAAC,KAAK,CAAC,CAAC;IAChC,SAAS,EAAE,mBAAmB,CAAC,WAAW,CAAC,CAAC;IAC5C,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,sBAAsB,KAAK,SAAS,CAAC;CAClE,CAAC;AAEF,wBAAgB,oBAAoB,CAAC,EACnC,QAAQ,EACR,cAAc,EACd,GAAG,EACH,SAAS,EACT,iBAAiB,GAClB,EAAE,kBAAkB,sBA0FpB"}

package/dist/calendar-view/scheduler/components/event/empty.js

@@ -0,0 +1,162 @@
+import { jsx as n, Fragment as D } from "react/jsx-runtime";
+import { useMemo as O } from "react";
+import { shallow as E } from "zustand/shallow";
+import { cn as v } from "../../../../lib/utils.js";
+import "../../../../vendor/dayjs/index.js";
+import { useTimePreferences as N } from "../../../../vendor/time-preferences.js";
+import { useCalendarStore as k } from "../../state/store.js";
+import { gridCellToDateTime as z } from "../../utils/index.js";
+import { DefaultOutOfOfficeSlot as I } from "../default-out-of-office-slot.js";
+import s from "dayjs";
+function L(t) {
+  const r = z({
+    day: t.day,
+    gridCellIdx: t.gridCellIdx,
+    totalGridCells: t.totalGridCells,
+    selectionLength: t.selectionLength,
+    startHour: t.startHour,
+    timezone: t.timezone
+  }), o = (r.hour() - t.startHour) * 60 + r.minute();
+  return /* @__PURE__ */ n(C, { topOffsetMinutes: o, timeSlot: s(r).tz(t.timezone) });
+}
+function q({
+  timezone: t,
+  availableSlots: r,
+  day: o,
+  startHour: c,
+  renderOutOfOffice: m
+}) {
+  var b;
+  const h = s(o).format("YYYY-MM-DD"), d = r && r[h], u = O(() => {
+    const e = [];
+    let l = -1, f = -1, p = !0, x = 0;
+    if (d == null || d.forEach((i, g) => {
+      const y = s(i.start).tz(t), w = (y.hour() - c) * 60 + y.minute();
+      e.push({ slot: i, topOffsetMinutes: w }), i.away ? (l === -1 && (l = g), f = g) : p = !1;
+    }), p && l !== -1) {
+      const i = d[l], g = d[f];
+      return x = s(g.end).diff(s(i.start), "minutes"), i.toUser == null && !i.showNotePublicly ? null : {
+        slots: e,
+        startEndTimeDuration: x,
+        firstSlot: i,
+        timezone: t
+      };
+    }
+    return { slots: e, startEndTimeDuration: x };
+  }, [d, c, t]);
+  if (u === null) return null;
+  if (u.startEndTimeDuration) {
+    const { firstSlot: e, startEndTimeDuration: l } = u, f = m ?? ((p) => /* @__PURE__ */ n(I, { ...p }));
+    return /* @__PURE__ */ n(
+      T,
+      {
+        timeSlot: s(e == null ? void 0 : e.start).tz(u.timezone),
+        topOffsetMinutes: (b = u.slots[0]) == null ? void 0 : b.topOffsetMinutes,
+        startEndTimeDuration: l,
+        children: f({
+          fromUser: e == null ? void 0 : e.fromUser,
+          toUser: e == null ? void 0 : e.toUser,
+          reason: e == null ? void 0 : e.reason,
+          emoji: e == null ? void 0 : e.emoji,
+          notes: e == null ? void 0 : e.notes,
+          showNotePublicly: e == null ? void 0 : e.showNotePublicly,
+          borderDashed: !1,
+          date: h,
+          className: "pb-0"
+        })
+      }
+    );
+  }
+  return /* @__PURE__ */ n(D, { children: u.slots.map((e, l) => /* @__PURE__ */ n(
+    C,
+    {
+      timeSlot: s(e.slot.start).tz(t),
+      topOffsetMinutes: e.topOffsetMinutes
+    },
+    l
+  )) });
+}
+function C({ isDisabled: t, topOffsetMinutes: r, timeSlot: o }) {
+  const { timeFormat: c } = N(), { onEmptyCellClick: m, hoverEventDuration: a } = k(
+    (h) => ({
+      onEmptyCellClick: h.onEmptyCellClick,
+      hoverEventDuration: h.hoverEventDuration
+    }),
+    E
+  );
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      className: v(
+        "group flex w-[calc(100%-1px)] items-center justify-center",
+        t && "pointer-events-none",
+        !t && "bg-default dark:bg-cal-muted",
+        r && "absolute"
+      ),
+      "data-disabled": t,
+      "data-slot": o.toISOString(),
+      "data-testid": "calendar-empty-cell",
+      style: {
+        height: `calc(${a}*var(--one-minute-height))`,
+        overflow: "visible",
+        top: r ? `calc(${r}*var(--one-minute-height))` : void 0
+      },
+      onClick: () => {
+        m == null || m(o.toDate());
+      },
+      children: !t && a !== 0 && /* @__PURE__ */ n(
+        "div",
+        {
+          className: v(
+            "bg-brand-default hover:bg-brand-default text-brand dark:border-emphasis absolute hidden rounded-[4px] p-[6px] text-xs font-semibold leading-5 group-hover:flex group-hover:cursor-pointer",
+            a && a > 15 && "items-start pt-3",
+            a && a < 15 && "items-center"
+          ),
+          style: {
+            height: `calc(${a}*var(--one-minute-height) - 2px)`,
+            zIndex: 80,
+            width: "calc(100% - 2px)"
+          },
+          children: /* @__PURE__ */ n("div", { className: "text-ellipsis leading-0", children: o.format(c) })
+        }
+      )
+    }
+  );
+}
+function T({
+  timeSlot: t,
+  children: r,
+  topOffsetMinutes: o,
+  startEndTimeDuration: c
+}) {
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      className: v(
+        "bg-default dark:bg-cal-muted group absolute z-65 flex w-[calc(100%-1px)] items-center justify-center"
+      ),
+      "data-slot": t.toISOString(),
+      style: {
+        top: o ? `calc(${o}*var(--one-minute-height))` : void 0,
+        overflow: "visible"
+      },
+      children: /* @__PURE__ */ n(
+        "div",
+        {
+          className: v(
+            "dark:border-emphasis bg-default dark:bg-cal-muted cursor-pointer rounded-[4px] p-[6px] text-xs font-semibold dark:text-white"
+          ),
+          style: {
+            height: `calc(${c}*var(--one-minute-height) - 2px)`,
+            width: "calc(100% - 2px)"
+          },
+          children: r
+        }
+      )
+    }
+  );
+}
+export {
+  q as AvailableCellsForDay,
+  L as EmptyCell
+};

package/dist/calendar-view/scheduler/components/event/event-list.d.ts

@@ -0,0 +1,7 @@
+import { default as dayjs } from '../../../../vendor/dayjs';
+type Props = {
+    day: dayjs.Dayjs;
+};
+export declare function EventList({ day }: Props): JSX.Element;
+export {};
+//# sourceMappingURL=event-list.d.ts.map

package/dist/calendar-view/scheduler/components/event/event-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"event-list.d.ts","sourceRoot":"","sources":["../../../../../src/calendar-view/scheduler/components/event/event-list.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,MAAM,0BAA0B,CAAC;AAM7C,KAAK,KAAK,GAAG;IACX,GAAG,EAAE,KAAK,CAAC,KAAK,CAAC;CAClB,CAAC;AAEF,wBAAgB,SAAS,CAAC,EAAE,GAAG,EAAE,EAAE,KAAK,eAyHvC"}

package/dist/calendar-view/scheduler/components/event/event-list.js

@@ -0,0 +1,97 @@
+import { jsx as p, Fragment as w } from "react/jsx-runtime";
+import { useState as D, useMemo as s, useEffect as O } from "react";
+import { shallow as z } from "zustand/shallow";
+import { cn as B } from "../../../../lib/utils.js";
+import "../../../../vendor/dayjs/index.js";
+import { useCalendarStore as U } from "../../state/store.js";
+import { calculateEventLayouts as L, createLayoutMap as j } from "../../utils/overlap.js";
+import { isInAllDayBar as q } from "./all-day-events.js";
+import { Event as A } from "./event.js";
+import v from "dayjs";
+function T({ day: h }) {
+  const { startHour: S, events: g, eventOnClick: $, selectedBookingUid: a, timezone: E } = U(
+    (t) => ({
+      startHour: t.startHour,
+      events: t.events,
+      eventOnClick: t.onEventClick,
+      selectedBookingUid: t.selectedBookingUid,
+      timezone: t.timezone
+    }),
+    z
+  ), [c, I] = D(null), n = s(() => g.filter((t) => v(t.start).isSame(h, "day") && !q(t, E)), [g, h, E]), y = s(() => {
+    const t = L(n);
+    return j(t);
+  }, [n]), b = s(() => new Map(
+    n.map((t) => {
+      const e = v(t.start), u = v(t.end).diff(e, "minutes"), f = (e.hour() - (S || 0)) * 60 + e.minute();
+      return [
+        t.id,
+        {
+          eventStart: e,
+          eventDuration: u,
+          eventStartDiff: f
+        }
+      ];
+    })
+  ), [n, S]), l = c ? y.get(c) : null, d = (l == null ? void 0 : l.groupIndex) ?? null, r = s(() => {
+    if (!a) return;
+    const t = n.find((e) => {
+      var o;
+      return ((o = e.options) == null ? void 0 : o.bookingUid) === a;
+    });
+    return t == null ? void 0 : t.id;
+  }, [n, a]);
+  return O(() => {
+    r !== void 0 && requestAnimationFrame(() => {
+      const t = document.querySelector(`[data-calendar-event-id="${r}"]`);
+      t && t.scrollIntoView({
+        behavior: "smooth",
+        block: "nearest"
+      });
+    });
+  }, [r]), /* @__PURE__ */ p(w, { children: n.map((t) => {
+    var x, H;
+    const e = y.get(t.id);
+    if (!e) return null;
+    const o = b.get(t.id);
+    if (!o) return null;
+    const { eventStart: u, eventDuration: m, eventStartDiff: f } = o, i = c === t.id, k = r === t.id, C = d !== null && e.groupIndex === d, M = i || k ? 79 : e.baseZIndex;
+    return /* @__PURE__ */ p(
+      "div",
+      {
+        className: B(
+          "absolute transition-all duration-100 ease-out",
+          ((x = t.options) == null ? void 0 : x.borderOnly) && "pointer-events-none"
+        ),
+        "data-testid": (H = t.options) == null ? void 0 : H["data-test-id"],
+        "data-calendar-event-id": t.id,
+        "data-calendar-event-source": t.source,
+        onMouseEnter: () => I(t.id),
+        onMouseLeave: () => I(null),
+        style: {
+          left: `${e.leftOffsetPercent}%`,
+          width: `${e.widthPercent}%`,
+          zIndex: M,
+          top: `calc(${f}*var(--one-minute-height))`,
+          height: `max(15px, calc(${m}*var(--one-minute-height)))`,
+          transform: i || k ? "scale(1.02)" : "scale(1)",
+          opacity: d !== null && !i && C ? 0.6 : 1
+        },
+        children: /* @__PURE__ */ p(
+          A,
+          {
+            event: t,
+            eventDuration: m,
+            onEventClick: $,
+            isHovered: i,
+            currentlySelectedEventId: r
+          }
+        )
+      },
+      `${t.id}-${u.toISOString()}`
+    );
+  }) });
+}
+export {
+  T as EventList
+};

package/dist/calendar-view/scheduler/components/event/event.d.ts

@@ -0,0 +1,14 @@
+import { BookingStatus, CalendarEvent } from '../../types/events';
+type EventProps = {
+    event: CalendarEvent;
+    currentlySelectedEventId?: number;
+    eventDuration: number;
+    onEventClick?: (event: CalendarEvent) => void;
+    disabled?: boolean;
+    isHovered?: boolean;
+};
+export declare const STATUS_COLOR_MAP: Record<BookingStatus, string>;
+export declare const getStatusColorClass: (status?: BookingStatus) => string | undefined;
+export declare function Event({ event, currentlySelectedEventId, eventDuration, disabled, onEventClick, isHovered, }: EventProps): JSX.Element;
+export {};
+//# sourceMappingURL=event.d.ts.map

package/dist/calendar-view/scheduler/components/event/event.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"event.d.ts","sourceRoot":"","sources":["../../../../../src/calendar-view/scheduler/components/event/event.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEvE,KAAK,UAAU,GAAG;IAChB,KAAK,EAAE,aAAa,CAAC;IACrB,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC9C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AA6BF,eAAO,MAAM,gBAAgB,EAAE,MAAM,CAAC,aAAa,EAAE,MAAM,CAM1D,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,SAAS,aAAa,KAAG,MAAM,GAAG,SAGrE,CAAC;AAEF,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,wBAAwB,EACxB,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,SAAiB,GAClB,EAAE,UAAU,eAmGZ"}

package/dist/calendar-view/scheduler/components/event/event.js

@@ -0,0 +1,131 @@
+import { jsx as l, jsxs as r } from "react/jsx-runtime";
+import { cva as C } from "class-variance-authority";
+import { Tooltip as T } from "../../../../components/ui/tooltip.js";
+import { cn as a } from "../../../../lib/utils.js";
+import "../../../../vendor/dayjs/index.js";
+import s from "dayjs";
+const y = C(
+  "group flex h-full w-full overflow-hidden rounded-[6px] px-[6px] text-xs leading-5 border-default font-medium",
+  {
+    variants: {
+      status: {
+        ACCEPTED: "bg-subtle hover:bg-emphasis text-emphasis border-[1px] border-default",
+        PENDING: "bg-subtle text-subtle border-[1px] border-dashed border-default",
+        REJECTED: "bg-subtle border-[1px] border-dashed text-subtle line-through",
+        CANCELLED: "bg-subtle border-[1px] border-dashed text-subtle line-through",
+        AWAITING_HOST: "bg-subtle text-emphasis border-[1px] border-dashed border-default"
+      },
+      disabled: {
+        true: "hover:cursor-default",
+        false: "hover:cursor-pointer"
+      },
+      selected: {
+        true: "",
+        false: ""
+      },
+      borderOnly: {
+        true: "bg-transparent border-[1.5px] border-subtle border-dashed opacity-60",
+        false: ""
+      }
+    }
+  }
+), E = {
+  ACCEPTED: "bg-green-500",
+  PENDING: "bg-orange-500",
+  REJECTED: "bg-red-500",
+  CANCELLED: "bg-red-500",
+  AWAITING_HOST: "bg-blue-500"
+}, H = (t) => {
+  if (t)
+    return E[t];
+};
+function P({
+  event: t,
+  currentlySelectedEventId: f,
+  eventDuration: m,
+  disabled: h,
+  onEventClick: i,
+  isHovered: g = !1
+}) {
+  var u, x, b;
+  const c = f === t.id, { options: e } = t, o = e != null && e.color ? void 0 : H(e == null ? void 0 : e.status), p = i ? "button" : "div", n = s(t.start).day(), N = n >= 1 && n <= 4 ? "right" : "left", w = /* @__PURE__ */ l("div", { className: "flex min-w-[200px] max-w-[300px] flex-col gap-1 py-1", children: /* @__PURE__ */ r("div", { className: "flex items-start gap-2", children: [
+    ((e == null ? void 0 : e.color) || o) && /* @__PURE__ */ l(
+      "div",
+      {
+        className: a("mt-1 h-3 w-1 shrink-0 rounded-sm", o),
+        style: e != null && e.color ? { backgroundColor: e.color } : void 0
+      }
+    ),
+    /* @__PURE__ */ r("div", { className: "flex-1", children: [
+      /* @__PURE__ */ l("div", { className: "font-semibold leading-tight", children: t.title }),
+      !((u = t.options) != null && u.hideTime) && /* @__PURE__ */ r("div", { className: "text-inverted-muted mt-1 text-xs", children: [
+        s(t.start).format("HH:mm"),
+        " - ",
+        s(t.end).format("HH:mm")
+      ] }),
+      t.description && /* @__PURE__ */ l("div", { className: "text-inverted-muted mt-1 text-xs leading-snug", children: t.description }),
+      (e == null ? void 0 : e.status) && e.status !== "ACCEPTED" && /* @__PURE__ */ l("div", { className: "text-inverted-muted mt-1 text-xs capitalize", children: e.status.toLowerCase().replace("_", " ") })
+    ] })
+  ] }) }), d = m < 40 ? "single-line" : m < 45 ? "multi-line" : "full";
+  return /* @__PURE__ */ l(T, { content: w, className: "max-w-none", side: N, children: /* @__PURE__ */ r(
+    p,
+    {
+      "data-booking-calendar-event": "true",
+      onClick: () => i == null ? void 0 : i(t),
+      ...e != null && e.bookingUid ? { "data-booking-uid": e.bookingUid } : {},
+      className: a(
+        y({
+          status: e == null ? void 0 : e.status,
+          disabled: h,
+          selected: c,
+          borderOnly: (e == null ? void 0 : e.borderOnly) ?? !1
+        }),
+        e == null ? void 0 : e.className,
+        (g || c) && "ring-brand-default shadow-lg ring-2 ring-offset-0"
+      ),
+      style: {
+        transition: "all 100ms ease-out"
+      },
+      children: [
+        ((e == null ? void 0 : e.color) || o) && /* @__PURE__ */ l(
+          "div",
+          {
+            className: a("-ml-1.5 mr-1.5 h-full w-[3px] shrink-0", o),
+            style: e != null && e.color ? { backgroundColor: e.color } : void 0
+          }
+        ),
+        /* @__PURE__ */ r("div", { className: a("flex w-full", d !== "single-line" && "flex-col py-1"), children: [
+          d === "single-line" && /* @__PURE__ */ r(
+            "div",
+            {
+              className: a(
+                "flex w-full shrink-0 gap-2 overflow-hidden text-ellipsis whitespace-nowrap text-left leading-4",
+                "items-center"
+              ),
+              children: [
+                /* @__PURE__ */ l("span", { children: t.title }),
+                !((x = t.options) != null && x.hideTime) && /* @__PURE__ */ r("p", { className: "text-subtle mt-1 w-full whitespace-nowrap text-left text-[10px] leading-none", children: [
+                  s(t.start).format("HH:mm"),
+                  " - ",
+                  s(t.end).format("HH:mm")
+                ] })
+              ]
+            }
+          ),
+          d !== "single-line" && /* @__PURE__ */ l("p", { className: a("shrink-0 whitespace-nowrap text-left leading-4"), children: t.title }),
+          d !== "single-line" && !((b = t.options) != null && b.hideTime) && /* @__PURE__ */ r("p", { className: "text-subtle mt-1 whitespace-nowrap text-left text-[10px] leading-none", children: [
+            s(t.start).format("HH:mm"),
+            " - ",
+            s(t.end).format("HH:mm")
+          ] }),
+          d === "full" && t.description && /* @__PURE__ */ l("p", { className: "text-subtle mt-1 text-left text-[10px] leading-none", children: t.description })
+        ] })
+      ]
+    }
+  ) });
+}
+export {
+  P as Event,
+  E as STATUS_COLOR_MAP,
+  H as getStatusColorClass
+};

package/dist/calendar-view/scheduler/components/event/index.d.ts

@@ -0,0 +1,5 @@
+export { AllDayEvents, isInAllDayBar } from './all-day-events';
+export { AvailableCellsForDay, EmptyCell } from './empty';
+export { Event } from './event';
+export { EventList } from './event-list';
+//# sourceMappingURL=index.d.ts.map

package/dist/calendar-view/scheduler/components/event/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/calendar-view/scheduler/components/event/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAC/D,OAAO,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAC1D,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC"}

package/dist/calendar-view/scheduler/components/event/index.js

@@ -0,0 +1,12 @@
+import { AllDayEvents as r, isInAllDayBar as o } from "./all-day-events.js";
+import { AvailableCellsForDay as a, EmptyCell as m } from "./empty.js";
+import { Event as f } from "./event.js";
+import { EventList as s } from "./event-list.js";
+export {
+  r as AllDayEvents,
+  a as AvailableCellsForDay,
+  m as EmptyCell,
+  f as Event,
+  s as EventList,
+  o as isInAllDayBar
+};

package/dist/calendar-view/scheduler/components/grid/index.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+type Props = {
+    offsetHeight: number | undefined;
+    gridStopsPerDay: number;
+    children: React.ReactNode;
+    zIndex?: number;
+};
+export declare const SchedulerColumns: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLOListElement>>;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/calendar-view/scheduler/components/grid/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/calendar-view/scheduler/components/grid/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,KAAK,KAAK,GAAG;IACX,YAAY,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,eAAe,EAAE,MAAM,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,eAAO,MAAM,gBAAgB,gFAc3B,CAAC"}

package/dist/calendar-view/scheduler/components/grid/index.js

@@ -0,0 +1,17 @@
+import { jsx as l } from "react/jsx-runtime";
+import s from "react";
+const p = s.forwardRef(function({ offsetHeight: r, gridStopsPerDay: e, children: t, zIndex: o }, a) {
+  return /* @__PURE__ */ l(
+    "ol",
+    {
+      ref: a,
+      className: "scheduler-grid-row-template col-start-1 col-end-2 row-start-1 grid auto-cols-auto text-[0px] scheduler-wrapper",
+      style: { marginTop: r || "var(--gridDefaultSize)", zIndex: o },
+      "data-gridstopsperday": e,
+      children: t
+    }
+  );
+});
+export {
+  p as SchedulerColumns
+};

package/dist/calendar-view/scheduler/components/heading/index.d.ts

@@ -0,0 +1,2 @@
+export { SchedulerHeading } from './scheduler-heading';
+//# sourceMappingURL=index.d.ts.map

package/dist/calendar-view/scheduler/components/heading/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/calendar-view/scheduler/components/heading/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC"}