@r365/react-calendar-timeline/dist/react-calendar-timeline.index.es.js

react-calendar-timeline

import { jsx as m, jsxs as E } from "react/jsx-runtime";
import { Temporal as M } from "@js-temporal/polyfill";
import S, { useContext as Re, Component as I, createElement as Ze, PureComponent as Xe } from "react";
import { windowListeners as fe } from "./react-calendar-timeline.resize-detector.es.js";
import { containerListeners as Ir } from "./react-calendar-timeline.resize-detector.es.js";
import V from "classnames";
import X from "interactjs";
import './styles.css';/* empty css                                  */
const Ve = typeof Element < "u", Be = typeof Map == "function", Ye = typeof Set == "function", _e = typeof ArrayBuffer == "function" && !!ArrayBuffer.isView;
function U(r, e) {
  if (r === e)
    return !0;
  if (r && e && typeof r == "object" && typeof e == "object") {
    if (r.constructor !== e.constructor)
      return !1;
    let t, i;
    if (Array.isArray(r)) {
      if (t = r.length, t != e.length)
        return !1;
      for (i = t; i-- !== 0; )
        if (!U(r[i], e[i]))
          return !1;
      return !0;
    }
    let s;
    if (Be && r instanceof Map && e instanceof Map) {
      if (r.size !== e.size)
        return !1;
      for (s = r.entries(); !(i = s.next()).done; )
        if (!e.has(i.value[0]))
          return !1;
      for (s = r.entries(); !(i = s.next()).done; )
        if (!U(i.value[1], e.get(i.value[0])))
          return !1;
      return !0;
    }
    if (Ye && r instanceof Set && e instanceof Set) {
      if (r.size !== e.size)
        return !1;
      for (s = r.entries(); !(i = s.next()).done; )
        if (!e.has(i.value[0]))
          return !1;
      return !0;
    }
    if (_e && ArrayBuffer.isView(r) && ArrayBuffer.isView(e)) {
      if (t = r.length, t != e.length)
        return !1;
      for (i = t; i-- !== 0; )
        if (r[i] !== e[i])
          return !1;
      return !0;
    }
    if (r.constructor === RegExp)
      return r.source === e.source && r.flags === e.flags;
    if (r.constructor === M.ZonedDateTime)
      return r.equals(e);
    if (r.valueOf !== Object.prototype.valueOf && typeof r.valueOf == "function" && typeof e.valueOf == "function")
      return r.valueOf() === e.valueOf();
    if (r.toString !== Object.prototype.toString && typeof r.toString == "function" && typeof e.toString == "function")
      return r.toString() === e.toString();
    const n = Object.keys(r);
    if (t = n.length, t !== Object.keys(e).length)
      return !1;
    for (i = t; i-- !== 0; )
      if (!Object.prototype.hasOwnProperty.call(e, n[i]))
        return !1;
    if (Ve && r instanceof Element)
      return !1;
    for (i = t; i-- !== 0; )
      if (!((n[i] === "_owner" || n[i] === "__v" || n[i] === "__o") && r.$$typeof) && !U(r[n[i]], e[n[i]]))
        return !1;
    return !0;
  }
  return r !== r && e !== e;
}
function B(r, e) {
  try {
    return U(r, e);
  } catch (t) {
    if (typeof t == "object" && t !== null && "message" in t && typeof t.message == "string" && (t.message || "").match(/stack|recursion/i))
      return console.warn("react-fast-compare cannot handle circular refs"), !1;
    throw t;
  }
}
function v(r, e) {
  return typeof r.get == "function" ? r.get(e) : r[e];
}
function ge(r) {
  return typeof r.count == "function" ? r.count() : r.length;
}
function W(r, e) {
  return ge(r) === ge(e) && r.every((t, i) => t === v(e, i.toString()));
}
function qe(r, e) {
  const t = {};
  return r.forEach((i) => {
    t[i[e]] = i;
  }), t;
}
function N() {
}
function G(r, e) {
  return M.Instant.fromEpochMilliseconds(r).toZonedDateTimeISO(e);
}
function ie(r, e, t) {
  const i = `${t}s`;
  return r.add({ [i]: e });
}
function L(r, e) {
  const t = { millisecond: 0, microsecond: 0, nanosecond: 0 };
  switch (e) {
    case "year":
      return r.with({ ...t, second: 0, minute: 0, hour: 0, day: 1, month: 1 });
    case "month":
      return r.with({ ...t, second: 0, minute: 0, hour: 0, day: 1 });
    case "day":
      return r.with({ ...t, second: 0, minute: 0, hour: 0 });
    case "hour":
      return r.with({ ...t, second: 0, minute: 0 });
    case "minute":
      return r.with({ ...t, second: 0 });
    case "second":
      return r.with(t);
    default:
      return r;
  }
}
function Ie(r, e) {
  return L(ie(r, 1, e), e).subtract({ milliseconds: 1 });
}
function Je(r, e, t) {
  if (t <= 1)
    return r;
  const i = r[e] % t;
  return i === 0 ? r : L(ie(r, -i, e), e);
}
function O(r) {
  if (typeof r == "number")
    return r;
  if (r instanceof M.ZonedDateTime || r instanceof M.Instant)
    return r.epochMilliseconds;
  if (r instanceof Date)
    return r.valueOf();
  if (typeof r == "object" && r !== null && "valueOf" in r && typeof r.valueOf == "function") {
    const e = r.valueOf();
    if (typeof e == "number")
      return e;
  }
  throw new Error("Unable to convert value to epoch milliseconds");
}
function ze(r) {
  try {
    return M.Now.instant().toZonedDateTimeISO(r).offsetNanoseconds / 1e6;
  } catch {
    return 0;
  }
}
function Y(r, e, t) {
  return (e - r) / t;
}
function $(r, e, t, i) {
  const s = t / (e - r);
  return (i - r) * s;
}
function se(r, e, t, i) {
  return (e - r) / t * i + r;
}
function ne(r, e, t, i, s, n) {
  const a = i[t] || 1;
  let l = Je(L(G(r, s), t), t, a);
  for (; l.epochMilliseconds < e; ) {
    const h = L(ie(l, a, t), t);
    n(l, h), l = h;
  }
}
const _ = 17;
function F(r, e, t) {
  const i = {
    second: 1e3,
    minute: 60,
    hour: 60,
    day: 24,
    month: 30,
    year: 12
  };
  let s = "year", n = r;
  return Object.keys(i).some((a) => {
    const l = a;
    n = n / i[l];
    const h = n / t[l], p = t[l] && t[l] > 1 ? 3 * _ : _, d = e / p;
    if (h < d)
      return s = a, !0;
  }), s;
}
const q = {
  second: "minute",
  minute: "hour",
  hour: "day",
  day: "month",
  month: "year",
  year: "year"
};
function oe(r) {
  if (!q[r])
    throw new Error(`unit ${r} is not acceptable`);
  return q[r];
}
function Me({ itemTimeStart: r, itemTimeEnd: e, dragTime: t, isDragging: i, isResizing: s, resizingEdge: n, resizeTime: a }) {
  const l = e - r;
  return [
    i && t ? t : s && n === "left" && a ? a : r,
    i && t ? t + l : s && n === "right" && a ? a : e
  ];
}
function Oe({ itemTimeStart: r, itemTimeEnd: e, canvasTimeStart: t, canvasTimeEnd: i, canvasWidth: s }) {
  const n = e - r, a = Math.max(r, t), l = Math.min(e, i), h = $(t, i, s, a), d = $(t, i, s, l) - h;
  return {
    left: h,
    width: Math.max(d, 3),
    collisionLeft: r,
    collisionWidth: n
  };
}
function ae(r, e) {
  const { groupIdKey: t } = e, i = {};
  for (let s = 0; s < r.length; s++)
    i[v(r[s], t)] = {
      index: s,
      group: r[s]
    };
  return i;
}
function ke(r, e) {
  var s, n;
  const t = {}, i = Object.keys(e);
  for (let a = 0; a < i.length; a++) {
    const l = e[i[a]];
    t[a] = {
      index: l.index,
      group: l.group,
      items: []
    };
  }
  for (let a = 0; a < r.length; a++)
    if (r[a].dimensions !== void 0 && ((s = r[a].dimensions) == null ? void 0 : s.order) !== void 0) {
      const l = t[((n = r[a].dimensions) == null ? void 0 : n.order.index) ?? 0];
      l && l.items.push(r[a]);
    }
  return t;
}
function le(r, e, t, i) {
  const { itemTimeStartKey: s, itemTimeEndKey: n } = i;
  return r.filter((a) => {
    const l = O(v(a, s)), h = O(v(a, n));
    return l <= t && h >= e;
  });
}
const Qe = 1e-3;
function De(r, e, t, i = Qe) {
  return r.collisionLeft + i < e.collisionLeft + e.collisionWidth && r.collisionLeft + r.collisionWidth - i > e.collisionLeft && r.top - t + i < e.top + e.height && r.top + r.height + t - i > e.top;
}
function Pe(r, e, t, i, s, n, a) {
  let l = i;
  const h = a ?? (r - e.dimensions.height) / 2;
  if (e.dimensions.stack && e.dimensions.top === null) {
    e.dimensions.top = s + h, l = Math.max(l, r, e.dimensions.height + h * 2);
    do {
      var p = null;
      for (let d = n - 1, b = 0; d >= b; d--) {
        const o = t[d];
        if (o.dimensions.top !== null && o.dimensions.stack && De(e.dimensions, o.dimensions, h)) {
          p = o;
          break;
        }
      }
      p != null && (e.dimensions.top = p.dimensions.top + p.dimensions.height + /* backward compatibility where gap between items is 2 */
      h * (a !== void 0 ? 1 : 2), l = Math.max(l, e.dimensions.top + e.dimensions.height + h - s));
    } while (p);
  }
  return {
    groupHeight: l,
    verticalMargin: h,
    itemTop: e.dimensions.top
  };
}
function Ee(r, e, t, i, s) {
  var a, l;
  const n = s ?? (r - (((a = e.dimensions) == null ? void 0 : a.height) ?? 1)) / 2;
  return e.dimensions && e.dimensions.top === null && (e.dimensions.top = i + n, t = Math.max(t, r, e.dimensions.height + n)), { groupHeight: t, verticalMargin: 0, itemTop: ((l = e.dimensions) == null ? void 0 : l.top) ?? 0 };
}
function be(r = []) {
  return r.reduce((e, t) => e + t, 0);
}
function je(r, e, t, i, s) {
  const n = [], a = [], l = ke(r, e);
  for (const h in l) {
    const p = l[h], { items: d, group: b } = p, o = be(n), c = b.stackItems !== void 0 ? b.stackItems : i, { groupHeight: u } = Le(d, c, t, o, s);
    a.push(o), b.height ? n.push(b.height) : n.push(Math.max(u, t));
  }
  return {
    height: be(n),
    groupHeights: n,
    groupTops: a
  };
}
function Le(r, e, t, i, s) {
  let n = 0, a = 0;
  for (let l = 0; l < r.length; l++) {
    const h = e ? Pe(t, r[l], r, n, i, l, s) : Ee(t, r[l], n, i, s);
    n = h.groupHeight, a = h.verticalMargin;
  }
  return { groupHeight: n, verticalMargin: a };
}
function j(r, e, t, i, s, n, a, l, h, p, d, b, o, c, u, f) {
  const T = le(r, i, s, n).map((R) => xe({
    item: R,
    keys: n,
    draggingItem: p,
    resizingItem: d,
    dragTime: b,
    resizingEdge: o,
    resizeTime: c,
    groups: e,
    newGroupOrder: u
  }));
  if (e.length === 0)
    return {
      dimensionItems: [],
      height: 0,
      groupHeights: [],
      groupTops: []
    };
  const y = ae(e, n), w = T.map((R) => We({
    item: R,
    keys: n,
    canvasTimeStart: i,
    canvasTimeEnd: s,
    canvasWidth: t,
    groupOrders: y,
    lineHeight: a,
    itemHeightRatio: l,
    itemVerticalGap: f
  })).filter((R) => !!R), { height: C, groupHeights: z, groupTops: x } = je(w, y, a, h, f);
  return { dimensionItems: w, height: C, groupHeights: z, groupTops: x };
}
function J(r = !0) {
  return r ? 3 : 1;
}
function k(r, e) {
  return r * e;
}
function We({ item: r, keys: e, canvasTimeStart: t, canvasTimeEnd: i, canvasWidth: s, groupOrders: n, lineHeight: a, itemHeightRatio: l, itemVerticalGap: h }) {
  const p = v(r, e.itemIdKey), d = Oe({
    itemTimeStart: O(v(r, e.itemTimeStartKey)),
    itemTimeEnd: O(v(r, e.itemTimeEndKey)),
    canvasTimeStart: t,
    canvasTimeEnd: i,
    canvasWidth: s
  });
  if (d)
    return d.top = null, d.order = n[v(r, e.itemGroupKey)], d.stack = !r.isOverlay, d.height = (r.height || a) * (typeof h > "u" ? l : 1), {
      id: p,
      dimensions: d
    };
}
function xe({ item: r, keys: e, draggingItem: t, resizingItem: i, dragTime: s, resizingEdge: n, resizeTime: a, groups: l, newGroupOrder: h }) {
  if (!i && !t)
    return r;
  const p = v(r, e.itemIdKey), d = p === t, b = p === i, o = v(r, e.itemTimeStartKey), c = v(r, e.itemTimeEndKey), [u, f] = Me({
    itemTimeStart: O(o),
    itemTimeEnd: O(c),
    isDragging: d,
    isResizing: b,
    dragTime: s,
    resizingEdge: n,
    resizeTime: a
  });
  return {
    ...r,
    [e.itemTimeStartKey]: o instanceof M.ZonedDateTime ? G(u, o.timeZoneId) : u,
    [e.itemTimeEndKey]: c instanceof M.ZonedDateTime ? G(f, c.timeZoneId) : f,
    [e.itemGroupKey]: d ? v(l[h], e.groupIdKey) : v(r, e.itemGroupKey)
  };
}
function ue(r, e, t, i = !0) {
  if (!i)
    return [r, e];
  const s = e - r, n = r - s * (t - 1) / 2, a = n + s * t;
  return [n, a];
}
function Q(r, e, t, i, s, n, a) {
  const l = n.buffer, h = a.canvasTimeStart, p = a.canvasTimeEnd, d = a.visibleTimeEnd - a.visibleTimeStart, b = e - r, o = {
    ...a,
    visibleTimeStart: r,
    visibleTimeEnd: e
  };
  if (!(b === d && r >= h + d * 0.5 && r <= p - d * 1.5 && e >= h + d * 1.5 && e <= p - d * 0.5) || t) {
    const [u, f] = ue(r, e, l, n.resizableCanvas);
    o.canvasTimeStart = u, o.canvasTimeEnd = f;
    const g = {
      ...a,
      ...o
    }, T = k(g.width, a.canvasWidthFactor);
    Object.assign(o, j(i, s, T, g.canvasTimeStart, g.canvasTimeEnd, n.keys, n.lineHeight, n.itemHeightRatio, n.stackItems, g.draggingItem, g.resizingItem, g.dragTime, g.resizingEdge, g.resizeTime, g.newGroupOrder, n.itemVerticalGap));
  }
  return o;
}
const vr = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  NEXT_UNITS: q,
  calculateDimensions: Oe,
  calculateInteractionNewTimes: Me,
  calculateScrollCanvas: Q,
  calculateTimeForXPosition: se,
  calculateXPositionForTime: $,
  collision: De,
  coordinateToTimeRatio: Y,
  getCanvasBoundariesFromVisibleTime: ue,
  getCanvasWidth: k,
  getCanvasWidthFactor: J,
  getEndOfUnit: Ie,
  getGroupOrders: ae,
  getGroupedItems: ke,
  getItemDimensions: We,
  getItemWithInteractions: xe,
  getMinUnit: F,
  getNextUnit: oe,
  getStartOfUnit: L,
  getTimezoneOffsetMs: ze,
  getVisibleItems: le,
  groupNoStack: Ee,
  groupStack: Pe,
  iterateTimes: ne,
  minCellWidth: _,
  stackAll: je,
  stackGroup: Le,
  stackTimelineItems: j,
  toEpochMilliseconds: O,
  toTimelineDate: G
}, Symbol.toStringTag, { value: "Module" })), et = {
  getTimelineState: () => (console.warn('"getTimelineState" default func is being used'), {}),
  getLeftOffsetFromDate: () => (console.warn('"getLeftOffsetFromDate" default func is being used'), 0),
  getDateFromLeftOffsetPosition: () => (console.warn('"getDateFromLeftOffsetPosition" default func is being used'), 0),
  showPeriod: () => {
    console.warn('"showPeriod" default func is being used');
  }
}, ce = S.createContext(et), { Consumer: tt, Provider: rt } = ce;
class it extends S.Component {
  constructor(e) {
    super(e), Object.defineProperty(this, "getTimelineState", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: () => {
        const { visibleTimeStart: t, visibleTimeEnd: i, canvasTimeStart: s, canvasTimeEnd: n, canvasWidth: a, timelineUnit: l, timelineWidth: h, timezone: p } = this.props;
        return {
          visibleTimeStart: t,
          visibleTimeEnd: i,
          canvasTimeStart: s,
          canvasTimeEnd: n,
          canvasWidth: a,
          timelineUnit: l,
          timelineWidth: h,
          timezone: p
        };
      }
    }), Object.defineProperty(this, "getLeftOffsetFromDate", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t) => {
        const { canvasTimeStart: i, canvasTimeEnd: s, canvasWidth: n } = this.props;
        return $(i, s, n, t);
      }
    }), Object.defineProperty(this, "getDateFromLeftOffsetPosition", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t) => {
        const { canvasTimeStart: i, canvasTimeEnd: s, canvasWidth: n } = this.props;
        return se(i, s, n, t);
      }
    }), this.state = {
      timelineContext: {
        getTimelineState: this.getTimelineState,
        getLeftOffsetFromDate: this.getLeftOffsetFromDate,
        getDateFromLeftOffsetPosition: this.getDateFromLeftOffsetPosition,
        showPeriod: this.props.showPeriod
      }
    };
  }
  render() {
    return m(rt, { value: this.state.timelineContext, children: this.props.children });
  }
}
const A = tt, st = () => Re(ce);
class nt extends I {
  shouldComponentUpdate(e) {
    return !(e.canvasTimeStart === this.props.canvasTimeStart && e.canvasTimeEnd === this.props.canvasTimeEnd && e.canvasWidth === this.props.canvasWidth && e.lineCount === this.props.lineCount && e.minUnit === this.props.minUnit && e.timeSteps === this.props.timeSteps && e.height === this.props.height && e.timezone === this.props.timezone && e.verticalLineClassNamesForTime === this.props.verticalLineClassNamesForTime);
  }
  render() {
    const { canvasTimeStart: e, canvasTimeEnd: t, timezone: i, minUnit: s, timeSteps: n, height: a, verticalLineClassNamesForTime: l, getLeftOffsetFromDate: h } = this.props, p = [];
    return ne(e, t, s, n, i, (d, b) => {
      const c = d[s === "day" ? "day" : s] === (s === "day" ? 1 : 0);
      let u = [];
      l && (u = l(d.epochMilliseconds, b.epochMilliseconds - 1));
      const f = V("rct-vl", {
        "rct-vl-first": c,
        [`rct-day-${d.dayOfWeek}`]: s === "day" || s === "hour" || s === "minute"
      }, u), g = h(d.epochMilliseconds), T = h(b.epochMilliseconds);
      p.push(m("div", { className: f, style: {
        pointerEvents: "none",
        top: "0px",
        left: `${g}px`,
        width: `${T - g}px`,
        height: `${a}px`
      } }, `line-${d.epochMilliseconds}`));
    }), m("div", { className: "rct-vertical-lines", children: p });
  }
}
const ot = ({ ...r }) => m(A, { children: ({ getLeftOffsetFromDate: e, getTimelineState: t }) => {
  const i = t();
  return m(nt, { getLeftOffsetFromDate: e, timezone: i.timezone, ...r });
} }), at = {
  groupIdKey: "id",
  groupTitleKey: "title",
  groupRightTitleKey: "rightTitle",
  groupLabelKey: "title",
  itemIdKey: "id",
  itemTitleKey: "title",
  itemDivTitleKey: "title",
  itemGroupKey: "group",
  itemTimeStartKey: "start_time",
  itemTimeEndKey: "end_time"
}, lt = {
  second: 1,
  minute: 1,
  hour: 1,
  day: 1,
  month: 1,
  year: 1
}, ut = {
  year: {
    long: { year: "numeric" },
    mediumLong: { year: "numeric" },
    medium: { year: "numeric" },
    short: { year: "2-digit" }
  },
  month: {
    long: { month: "long", year: "numeric" },
    mediumLong: { month: "long" },
    medium: { month: "short" },
    short: { month: "numeric", year: "2-digit" }
  },
  week: {
    long: { month: "short", day: "numeric" },
    mediumLong: { month: "short", day: "numeric" },
    medium: { month: "short", day: "numeric" },
    short: { month: "short", day: "numeric" }
  },
  day: {
    long: { weekday: "long", month: "long", day: "numeric" },
    mediumLong: { weekday: "long", month: "long", day: "numeric" },
    medium: { day: "numeric", weekday: "short" },
    short: { day: "numeric" }
  },
  hour: {
    long: { weekday: "long", month: "long", day: "numeric", hour: "numeric", minute: "numeric" },
    mediumLong: { month: "numeric", day: "numeric", hour: "numeric", minute: "numeric" },
    medium: { hour: "numeric", minute: "numeric" },
    short: { hour: "numeric" }
  },
  minute: {
    long: { hour: "numeric", minute: "numeric" },
    mediumLong: { hour: "numeric", minute: "numeric" },
    medium: { hour: "numeric", minute: "numeric" },
    short: { minute: "numeric" }
  },
  second: {
    long: { minute: "numeric", second: "numeric" },
    mediumLong: { minute: "numeric", second: "numeric" },
    medium: { minute: "numeric", second: "numeric" },
    short: { second: "numeric" }
  }
}, ct = {
  registerScroll: () => (console.warn("default registerScroll header used"), N),
  rightSidebarWidth: 0,
  leftSidebarWidth: 150,
  timeSteps: {}
}, He = S.createContext(ct);
class ht extends S.Component {
  render() {
    const e = {
      rightSidebarWidth: this.props.rightSidebarWidth,
      leftSidebarWidth: this.props.leftSidebarWidth,
      timeSteps: this.props.timeSteps,
      registerScroll: this.props.registerScroll
    };
    return m(He.Provider, { value: e, children: this.props.children });
  }
}
const dt = He, he = () => Re(dt);
class Ue extends S.Component {
  constructor(e) {
    super(e), Object.defineProperty(this, "getHeaderIntervals", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: ({ canvasTimeStart: p, canvasTimeEnd: d, unit: b, timezone: o, timeSteps: c, getLeftOffsetFromDate: u }) => {
        const f = [];
        return ne(p, d, b, c, o, (g, T) => {
          const y = u(g.epochMilliseconds), C = u(T.epochMilliseconds) - y;
          f.push({ startTime: g, endTime: T, labelWidth: C, left: y });
        }), f;
      }
    }), Object.defineProperty(this, "getRootProps", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (p = {}) => {
        const { style: d } = p;
        return {
          style: Object.assign({}, d || {}, {
            position: "relative",
            width: this.props.canvasWidth,
            height: this.props.height
          })
        };
      }
    }), Object.defineProperty(this, "getIntervalProps", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (p = {}) => {
        const { interval: d, style: b } = p;
        if (!d)
          throw new Error("you should provide interval to the prop getter");
        const { startTime: o, labelWidth: c, left: u } = d;
        return {
          style: {
            ...b,
            left: u,
            width: c,
            position: "absolute"
          },
          key: `label-${o.epochMilliseconds}`
        };
      }
    }), Object.defineProperty(this, "getStateAndHelpers", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: () => {
        const { canvasTimeStart: p, canvasTimeEnd: d, timelineWidth: b, visibleTimeStart: o, visibleTimeEnd: c, unit: u, showPeriod: f, headerData: g, timezone: T } = this.props;
        return {
          timelineContext: {
            timelineWidth: b,
            visibleTimeStart: o,
            visibleTimeEnd: c,
            canvasTimeStart: p,
            canvasTimeEnd: d,
            timezone: T
          },
          headerContext: {
            unit: u,
            intervals: this.state.intervals
          },
          getRootProps: this.getRootProps,
          getIntervalProps: this.getIntervalProps,
          showPeriod: f,
          data: g
        };
      }
    });
    const { canvasTimeStart: t, canvasTimeEnd: i, unit: s, timeSteps: n, getLeftOffsetFromDate: a, timezone: l } = e, h = this.getHeaderIntervals({
      canvasTimeStart: t,
      canvasTimeEnd: i,
      timeSteps: n,
      timezone: l,
      unit: s,
      getLeftOffsetFromDate: a
    });
    this.state = {
      intervals: h
    };
  }
  /*shouldComponentUpdate(nextProps: CustomHeaderProps<Data>) {
    if (
      nextProps.canvasTimeStart !== this.props.canvasTimeStart ||
      nextProps.canvasTimeEnd !== this.props.canvasTimeEnd ||
      nextProps.canvasWidth !== this.props.canvasWidth ||
      nextProps.unit !== this.props.unit ||
      nextProps.timeSteps !== this.props.timeSteps ||
      nextProps.showPeriod !== this.props.showPeriod ||
      nextProps.children !== this.props.children ||
      nextProps.headerData !== this.props.headerData
    ) {
      return true
    }
    return false
  }*/
  componentDidUpdate(e) {
    if (!B(e, this.props)) {
      const { canvasTimeStart: t, canvasTimeEnd: i, unit: s, timeSteps: n, getLeftOffsetFromDate: a, timezone: l } = this.props, h = this.getHeaderIntervals({
        canvasTimeStart: t,
        canvasTimeEnd: i,
        timeSteps: n,
        timezone: l,
        unit: s,
        getLeftOffsetFromDate: a
      });
      this.setState({ intervals: h });
    }
  }
  render() {
    const e = this.getStateAndHelpers();
    return this.props.children(e);
  }
}
Object.defineProperty(Ue, "defaultProps", {
  enumerable: !0,
  configurable: !0,
  writable: !0,
  value: {
    height: 30
  }
});
function pt({ children: r, unit: e, headerData: t, height: i }) {
  const { getTimelineState: s, showPeriod: n, getLeftOffsetFromDate: a } = st(), l = s(), { timeSteps: h } = he();
  return m(Ue, { children: r, timeSteps: h, showPeriod: n, unit: e || l.timelineUnit, ...l, headerData: t, getLeftOffsetFromDate: a, height: i });
}
var ve = Number.isNaN || function(e) {
  return typeof e == "number" && e !== e;
};
function mt(r, e) {
  return !!(r === e || ve(r) && ve(e));
}
function ft(r, e) {
  if (r.length !== e.length)
    return !1;
  for (var t = 0; t < r.length; t++)
    if (!mt(r[t], e[t]))
      return !1;
  return !0;
}
function Te(r, e) {
  e === void 0 && (e = ft);
  var t = null;
  function i() {
    for (var s = [], n = 0; n < arguments.length; n++)
      s[n] = arguments[n];
    if (t && t.lastThis === this && e(s, t.lastArgs))
      return t.lastResult;
    var a = r.apply(this, s);
    return t = {
      lastResult: a,
      lastArgs: s,
      lastThis: this
    }, a;
  }
  return i.clear = function() {
    t = null;
  }, i;
}
function P(...r) {
  return (e, ...t) => {
    e.preventDefault(), r.forEach((i) => i && i(e, ...t));
  };
}
class gt extends S.PureComponent {
  constructor() {
    super(...arguments), Object.defineProperty(this, "onIntervalClick", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: () => {
        const { primaryHeader: e, interval: t, unit: i, showPeriod: s } = this.props;
        if (e) {
          const n = oe(i), a = L(t.startTime, n), l = Ie(t.startTime, n);
          s(a, l);
        } else
          s(t.startTime, t.endTime);
      }
    }), Object.defineProperty(this, "getIntervalProps", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (e = {}) => ({
        ...this.props.getIntervalProps({
          interval: this.props.interval,
          ...e
        }),
        onClick: P(this.onIntervalClick, e.onClick)
      })
    });
  }
  render() {
    const { intervalText: e, interval: t, intervalRenderer: i, headerData: s } = this.props, n = i;
    if (n)
      return n({
        getIntervalProps: this.getIntervalProps,
        intervalContext: {
          interval: t,
          intervalText: e
        },
        data: s
      });
    const { key: a, ...l } = this.getIntervalProps();
    return Ze(
      "div",
      { "data-testid": "dateHeaderInterval", ...l, key: a, className: `rct-dateHeader ${this.props.primaryHeader ? "rct-dateHeader-primary" : ""}` },
      m("span", { children: e })
    );
  }
}
function bt({ headerContext: { intervals: r, unit: e }, getRootProps: t, getIntervalProps: i, showPeriod: s, data: { style: n, intervalRenderer: a, className: l, getLabelFormat: h, unitProp: p, headerData: d } }) {
  return m("div", { "data-testid": "dateHeader", className: l, ...t({ style: n }), children: r.map((b) => {
    const o = h([b.startTime, b.endTime], e, b.labelWidth);
    return m(gt, { unit: e, interval: b, showPeriod: s, intervalText: o, primaryHeader: p === "primaryHeader", getIntervalProps: i, intervalRenderer: a, headerData: d }, `label-${b.startTime.epochMilliseconds}`);
  }) });
}
class vt extends S.Component {
  constructor() {
    super(...arguments), Object.defineProperty(this, "getHeaderUnit", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: () => this.props.unit === "primaryHeader" ? oe(this.props.timelineUnit) : this.props.unit ? this.props.unit : this.props.timelineUnit
    }), Object.defineProperty(this, "getRootStyle", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: Te((e) => ({
        height: 30,
        ...e
      }))
    }), Object.defineProperty(this, "getLabelFormat", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (e, t, i) => {
        const { labelFormat: s } = this.props;
        if (typeof s == "function")
          return s(e, t, i);
        throw new Error("labelFormat should be function or string");
      }
    }), Object.defineProperty(this, "getHeaderData", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: Te((e, t, i, s, n, a) => ({
        intervalRenderer: e,
        style: t,
        className: i,
        getLabelFormat: s,
        unitProp: n,
        headerData: a
      }))
    });
  }
  render() {
    const e = this.getHeaderUnit(), { height: t } = this.props;
    return m(pt, { children: bt, unit: e, height: t, headerData: this.getHeaderData(this.props.intervalRenderer, this.getRootStyle(this.props.style), this.props.className, this.getLabelFormat, this.props.unit, this.props.headerData) });
  }
}
function ye({ labelFormat: r, unit: e, style: t, className: i, intervalRenderer: s, headerData: n, height: a }) {
  return m(A, { children: ({ getTimelineState: l }) => {
    const h = l();
    return m(vt, { timelineUnit: h.timelineUnit, unit: e, labelFormat: r || Tt, style: t, className: i, intervalRenderer: s, headerData: n, height: a });
  } });
}
function Tt([r], e, t, i = ut) {
  let s;
  return t >= 150 ? s = i[e].long : t >= 100 ? s = i[e].mediumLong : t >= 50 ? s = i[e].medium : s = i[e].short, r.toLocaleString("en-US", s);
}
const yt = "left", Ne = "right";
class St extends Xe {
  constructor() {
    super(...arguments), Object.defineProperty(this, "getRootProps", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (e = {}) => {
        const { style: t } = e, i = this.props.variant === Ne ? this.props.rightSidebarWidth : this.props.leftSidebarWidth;
        return {
          style: {
            ...t,
            width: i
          }
        };
      }
    }), Object.defineProperty(this, "getStateAndHelpers", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: () => ({
        getRootProps: this.getRootProps,
        data: this.props.headerData
      })
    });
  }
  render() {
    const e = this.getStateAndHelpers();
    return this.props.children(e);
  }
}
const Ct = ({ getRootProps: r }) => m("div", { "data-testid": "sidebarHeader", ...r() }), K = (r) => {
  const { children: e, variant: t = yt, headerData: i } = r, { leftSidebarWidth: s, rightSidebarWidth: n } = he();
  return m(St, { leftSidebarWidth: s, rightSidebarWidth: n, variant: t, headerData: i, children: e || Ct });
};
K.secretKey = "SidebarHeader";
class wt extends S.Component {
  constructor() {
    super(...arguments), Object.defineProperty(this, "getRootStyle", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: () => ({
        ...this.props.style,
        display: "flex",
        width: "100%"
      })
    }), Object.defineProperty(this, "getCalendarHeaderStyle", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: () => {
        const { leftSidebarWidth: e, rightSidebarWidth: t, calendarHeaderStyle: i } = this.props;
        return {
          ...i,
          overflow: "hidden",
          width: `calc(100% - ${e + t}px)`
        };
      }
    }), Object.defineProperty(this, "isSidebarHeader", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (e) => e.type === void 0 ? !1 : e.type.secretKey === K.secretKey
    });
  }
  render() {
    let e, t;
    const i = [], s = Array.isArray(this.props.children) ? this.props.children.filter((n) => n) : [this.props.children];
    return S.Children.map(s, (n) => {
      var a;
      this.isSidebarHeader(n) ? ((a = n == null ? void 0 : n.props) == null ? void 0 : a.variant) === Ne ? e = n : t = n : i.push(n);
    }), t || (t = m(K, {})), !e && this.props.rightSidebarWidth && (e = m(K, { variant: "right" })), E("div", { "data-testid": "headerRootDiv", style: this.getRootStyle(), className: V("rct-header-root", this.props.className), children: [t, m("div", { ref: this.props.registerScroll, style: this.getCalendarHeaderStyle(), className: V("rct-calendar-header", this.props.calendarHeaderClassName), "data-testid": "headerContainer", children: i }), e] });
  }
}
const ee = ({ children: r, style: e, className: t, calendarHeaderStyle: i, calendarHeaderClassName: s }) => {
  const { leftSidebarWidth: n, rightSidebarWidth: a, registerScroll: l } = he();
  return m(wt, { leftSidebarWidth: n, rightSidebarWidth: a, registerScroll: l, style: e, className: t, calendarHeaderStyle: i, calendarHeaderClassName: s, children: r });
};
ee.secretKey = "TimelineHeaders";
function Rt({ item: r, itemContext: e, getItemProps: t, getResizeProps: i }) {
  const { left: s, right: n } = i();
  return E("div", { ...t(r.itemProps), children: [e.useResizeHandle ? m("div", { ...s }) : "", m("div", { className: "rct-item-content", style: { maxHeight: `${e.dimensions.height}` }, children: e.title }), e.useResizeHandle ? m("div", { ...n }) : ""] });
}
function Se(r) {
  let e = 0, t = 0, i = !0;
  for (; r; )
    !r.offsetParent && r.tagName === "BODY" && r.scrollLeft === 0 && r.scrollTop === 0 && (r = document.scrollingElement || r), e += r.offsetLeft - (i ? 0 : r.scrollLeft) + r.clientLeft, t += r.offsetTop - (i ? 0 : r.scrollTop) + r.clientTop, r = r.offsetParent, i = !1;
  return { x: e, y: t };
}
function te(r) {
  if (r === document.body)
    return { scrollLeft: 0, scrollTop: 0 };
  {
    const e = te(r.parentNode);
    return {
      scrollLeft: r.scrollLeft + e.scrollLeft,
      scrollTop: r.scrollTop + e.scrollTop
    };
  }
}
function re(r) {
  if (r === document.body || !r.offsetParent)
    return { offsetLeft: 0, offsetTop: 0 };
  {
    const e = re(r.offsetParent);
    return {
      offsetLeft: r.offsetLeft + e.offsetLeft,
      offsetTop: r.offsetTop + e.offsetTop
    };
  }
}
const It = {
  fontSize: 12,
  color: "white",
  cursor: "pointer",
  background: "#2196f3",
  border: "1px solid #1a6fb3",
  zIndex: 80
}, zt = {
  background: "#ffc107",
  border: "1px solid #ff9800",
  zIndex: 82
}, Mt = {
  willChange: "left, top, width",
  cursor: "move"
}, Ot = {
  borderLeftWidth: 3
}, kt = {
  cursor: "w-resize"
}, Dt = {
  borderRightWidth: 3
}, Pt = {
  cursor: "e-resize"
}, Et = {
  position: "absolute",
  width: 24,
  maxWidth: "20%",
  minWidth: 2,
  height: "100%",
  top: 0,
  left: 0,
  cursor: "pointer",
  zIndex: 88
}, jt = {
  position: "absolute",
  width: 24,
  maxWidth: "20%",
  minWidth: 2,
  height: "100%",
  top: 0,
  right: 0,
  cursor: "pointer",
  zIndex: 88
};
class de extends I {
  constructor(e) {
    super(e), Object.defineProperty(this, "state", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: {
        interactMounted: !1,
        dragging: !1,
        dragStart: null,
        preDragPosition: null,
        dragTime: null,
        dragGroupDelta: null,
        resizing: !1,
        resizeEdge: null,
        resizeStart: null,
        resizeTime: null
      }
    }), Object.defineProperty(this, "itemId", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: ""
    }), Object.defineProperty(this, "itemTitle", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: ""
    }), Object.defineProperty(this, "itemDivTitle", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: void 0
    }), Object.defineProperty(this, "itemTimeStart", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: void 0
    }), Object.defineProperty(this, "itemTimeEnd", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: void 0
    }), Object.defineProperty(this, "item", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: void 0
    }), Object.defineProperty(this, "dragLeft", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: void 0
    }), Object.defineProperty(this, "dragRight", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: void 0
    }), Object.defineProperty(this, "startedClicking", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: !1
    }), Object.defineProperty(this, "startedTouching", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: !1
    }), Object.defineProperty(this, "dragInProgress", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: !1
    }), Object.defineProperty(this, "fireInteractEvent", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t) => {
        if (this.item) {
          const i = new CustomEvent("itemInteraction", {
            bubbles: !0,
            detail: {
              itemInteraction: t
            }
          });
          this.item.dispatchEvent(i);
        }
      }
    }), Object.defineProperty(this, "onMouseDown", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t) => {
        this.state.interactMounted || (t.preventDefault(), this.startedClicking = !0);
      }
    }), Object.defineProperty(this, "onMouseUp", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t) => {
        !this.state.interactMounted && this.startedClicking && (this.startedClicking = !1, this.actualClick(t, "click"));
      }
    }), Object.defineProperty(this, "onTouchStart", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t) => {
        this.state.interactMounted || (t.preventDefault(), this.startedTouching = !0);
      }
    }), Object.defineProperty(this, "onTouchEnd", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t) => {
        !this.state.interactMounted && this.startedTouching && (this.startedTouching = !1, this.actualClick(t, "touch"));
      }
    }), Object.defineProperty(this, "handleDoubleClick", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t) => {
        t.stopPropagation(), this.props.onItemDoubleClick && this.props.onItemDoubleClick(this.itemId, t);
      }
    }), Object.defineProperty(this, "handleContextMenu", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t) => {
        this.props.onContextMenu && (t.preventDefault(), t.stopPropagation(), this.props.onContextMenu(this.itemId, t));
      }
    }), Object.defineProperty(this, "getItemRef", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t) => this.item = t
    }), Object.defineProperty(this, "getDragLeftRef", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t) => this.dragLeft = t
    }), Object.defineProperty(this, "getDragRightRef", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t) => this.dragRight = t
    }), Object.defineProperty(this, "getItemProps", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t = {}) => {
        const i = "rct-item" + (this.props.item.className ? ` ${this.props.item.className}` : "");
        return {
          key: this.itemId,
          ref: this.getItemRef,
          title: this.itemDivTitle,
          className: i + ` ${t.className ? t.className : ""}`,
          onMouseDown: P(this.onMouseDown, t.onMouseDown),
          onMouseUp: P(this.onMouseUp, t.onMouseUp),
          onTouchStart: P(this.onTouchStart, t.onTouchStart),
          onTouchEnd: P(this.onTouchEnd, t.onTouchEnd),
          onDoubleClick: P(this.handleDoubleClick, t.onDoubleClick),
          onContextMenu: P(this.handleContextMenu, t.onContextMenu),
          style: Object.assign({}, this.getItemStyle(t))
        };
      }
    }), Object.defineProperty(this, "getResizeProps", {
      enumerable: !0,
      configurable: !0,
      writable: !0,
      value: (t = {}) => {
        let i = "rct-item-handler rct-item-handler-left rct-item-handler-resize-left";
        t.leftClassName && (i += ` ${t.leftClassName}`);
        let s = "rct-item-handler rct-item-handler-right rct-item-handler-resize-right";
        return t.rightClassName && (s += ` ${t.rightClassName}`), {
          left: {
            ref: this.getDragLeftRef,
            className: i,
            style: Object.assign({}, Et, t.leftStyle)
          },
          right: {
            ref: this.getDragRightRef,
            className: s,
            style: Object.assign({}, jt, t.rightStyle)
          }
        };
      }
    }), this.cacheDataFromProps(e);
  }
  shouldComponentUpdate(e, t) {
    return !B(this.props, e) || !B(this.state, t);
  }
  cacheDataFromProps(e) {
    this.itemId = v(e.item, e.keys.itemIdKey), this.itemTitle = v(e.item, e.keys.itemTitleKey), this.itemDivTitle = e.keys.itemDivTitleKey ? v(e.item, e.keys.itemDivTitleKey) : this.itemTitle;
    const t = v(e.item, e.keys.itemTimeStartKey), i = v(e.item, e.keys.itemTimeEndKey);
    this.itemTimeStart = t !== null ? O(t) : void 0, this.itemTimeEnd = i !== null ? O(i) : void 0;
  }
  getTimeRatio() {
    const { canvasTimeStart: e, canvasTimeEnd: t, canvasWidth: i } = this.props;
    return Y(e, t, i);
  }
  dragTimeSnap(e, t) {
    const { dragSnap: i, timezone: s } = this.props;
    if (i) {
      const n = t ? ze(s) : 0;
      return Math.round(e / i) * i - n % i;
    } else
      return e;
  }
  resizeTimeSnap(e) {
    const { dragSnap: t } = this.props;
    if (t) {
      const i = this.itemTimeEnd % t;
      return Math.round((e - i) / t) * t + i;
    } else
      return e;
  }
  dragTime(e) {
    if (this.state.dragging)
      return this.dragTimeSnap(this.timeFor(e) + this.state.dragStart.offset, !0);
    {
      const { timezone: t } = this.props;
      return M.Instant.fromEpochMilliseconds(this.itemTimeStart).toZonedDateTimeISO(t).epochMilliseconds;
    }
  }
  timeFor(e) {
    const t = Y(this.props.canvasTimeStart, this.props.canvasTimeEnd, this.props.canvasWidth), i = re(this.props.scrollRef).offsetLeft, s = te(this.props.scrollRef);
    return (e.pageX - i + s.scrollLeft) * t + this.props.canvasTimeStart;
  }
  dragGroupDelta(e) {
    const { groupTops: t, order: i } = this.props;
    if (this.state.dragging) {
      if (!this.props.canChangeGroup)
        return 0;
      let s = 0;
      const n = re(this.props.scrollRef).offsetTop, a = te(this.props.scrollRef);
      for (const l of Object.keys(t)) {
        const h = t[l];
        if (e.pageY - n + a.scrollTop > h)
          s = parseInt(l, 10) - i.index;
        else
          break;
      }
      return this.props.order.index + s < 0 ? 0 - this.props.order.index : s;
    } else
      return 0;
  }
  resizeTimeDelta(e, t) {
    const i = this.itemTimeEnd - this.itemTimeStart, s = this.dragTimeSnap((e.pageX - this.state.resizeStart) * this.getTimeRatio());
    return i + (t === "left" ? -s : s) < (this.props.dragSnap || 1e3) ? t === "left" ? i - (this.props.dragSnap || 1e3) : (this.props.dragSnap || 1e3) - i : s;
  }
  mountInteract() {
    const e = this.props.useResizeHandle ? ".rct-item-handler-resize-left" : !0, t = this.props.useResizeHandle ? ".rct-item-handler-resize-right" : !0;
    X(this.item).resizable({
      edges: {
        left: this.canResizeLeft() && e,
        right: this.canResizeRight() && t,
        top: !1,
        bottom: !1
      },
      enabled: this.props.selected && (this.canResizeLeft() || this.canResizeRight())
    }).draggable({
      enabled: this.props.selected && this.canMove()
    }).styleCursor(!1).on("dragstart", (i) => {
      if (this.props.selected) {
        this.dragInProgress = !0, this.fireInteractEvent(!0);
        const s = this.timeFor(i);
        this.setState({
          dragging: !0,
          dragStart: {
            x: i.pageX,
            y: i.pageY,
            offset: this.itemTimeStart - s
          },
          preDragPosition: { x: i.target.offsetLeft, y: i.target.offsetTop },
          dragTime: this.itemTimeStart,
          dragGroupDelta: 0
        });
      } else
        return !1;
    }).on("dragmove", (i) => {
      this.state.dragging && this.setState((s) => {
        if (!this.dragInProgress)
          return { ...s };
        let n = this.dragTime(i);
        const a = this.dragGroupDelta(i);
        return this.props.moveResizeValidator && (n = this.props.moveResizeValidator("move", this.props.item, n)), this.props.onDrag && this.props.onDrag(this.itemId, n, this.props.order.index + a), {
          dragTime: n,
          dragGroupDelta: a
        };
      });
    }).on("dragend", (i) => {
      if (this.state.dragging) {
        if (this.props.onDrop) {
          this.dragInProgress = !1, this.fireInteractEvent(!1);
          let s = this.dragTime(i);
          this.props.moveResizeValidator && (s = this.props.moveResizeValidator("move", this.props.item, s)), this.props.onDrop(this.itemId, s, this.props.order.index + this.dragGroupDelta(i));
        }
        this.setState({
          dragging: !1,
          dragStart: null,
          preDragPosition: null,
          dragTime: null,
          dragGroupDelta: null
        });
      }
    }).on("resizestart", (i) => {
      if (this.props.selected)
        this.fireInteractEvent(!0), this.setState({
          resizing: !0,
          resizeEdge: null,
          // we don't know yet
          resizeStart: i.pageX,
          resizeTime: 0
        });
      else
        return !1;
    }).on("resizemove", (i) => {
      if (this.state.resizing) {
        let s = this.state.resizeEdge;
        s || (s = i.deltaRect.left !== 0 ? "left" : "right", this.setState({ resizeEdge: s }));
        let n = this.resizeTimeSnap(this.timeFor(i));
        this.props.moveResizeValidator && (n = this.props.moveResizeValidator("resize", this.props.item, n, s)), this.props.onResizing && this.props.onResizing(this.itemId, n, s), this.setState({
          resizeTime: n
        });
      }
    }).on("resizeend", (i) => {
      if (this.state.resizing) {
        this.fireInteractEvent(!1);
        const { resizeEdge: s } = this.state;
        let n = this.resizeTimeSnap(this.timeFor(i));
        this.props.moveResizeValidator && (n = this.props.moveResizeValidator("resize", this.props.item, n, s)), this.props.onResized && this.props.onResized(this.itemId, n, s, this.resizeTimeDelta(i, s)), this.setState({
          resizing: !1,
          resizeStart: null,
          resizeEdge: null,
          resizeTime: null
        });
      }
    }).on("tap", (i) => {
      this.actualClick(i, i.pointerType === "mouse" ? "click" : "touch");
    }), this.setState({
      interactMounted: !0
    });
  }
  canResizeLeft(e = this.props) {
    var i;
    return !e.canResizeLeft || e.minResizeWidth === void 0 ? !1 : parseInt((i = e.dimensions.width) == null ? void 0 : i.toString(), 10) >= e.minResizeWidth;
  }
  canResizeRight(e = this.props) {
    var i;
    return !e.canResizeRight || e.minResizeWidth === void 0 ? !1 : parseInt((i = e.dimensions.width) == null ? void 0 : i.toString(), 10) >= e.minResizeWidth;
  }
  canMove(e = this.props) {
    return !!e.canMove;
  }
  componentDidUpdate(e) {
    this.cacheDataFromProps(this.props);
    let { interactMounted: t } = this.state;
    const i = e.selected && this.canMove(e), s = e.selected && this.canResizeLeft(e), n = e.selected && this.canResizeRight(e), a = this.props.selected && this.canMove(this.props), l = this.props.selected && this.canResizeLeft(this.props), h = this.props.selected && this.canResizeRight(this.props);
    if (this.item) {
      if (this.props.selected && !t && (this.mountInteract(), t = !0), t && (s !== l || n !== h)) {
        const p = this.props.useResizeHandle ? this.dragLeft : !0, d = this.props.useResizeHandle ? this.dragRight : !0;
        X(this.item).resizable({
          enabled: l || h,
          edges: {
            top: !1,
            bottom: !1,
            left: l && p,
            right: h && d
          }
        });
      }
      t && i !== a && X(this.item).draggable({ enabled: a });
    } else
      t = !1;
    t !== this.state.interactMounted && this.setState({
      interactMounted: t
    });
  }
  actualClick(e, t) {
    this.props.canSelect && this.props.onSelect && this.props.onSelect(this.itemId, t, e);
  }
  getItemStyle(e) {
    const t = this.props.dimensions, i = {
      position: "absolute",
      boxSizing: "border-box",
      left: `${t.left}px`,
      top: `${t.top}px`,
      width: `${t.width}px`,
      height: `${t.height}px`,
      lineHeight: `${t.height}px`
    };
    return Object.assign({}, It, this.props.selected ? zt : {}, this.props.selected && this.canMove(this.props) ? Mt : {}, this.props.selected && this.canResizeLeft(this.props) ? Ot : {}, this.props.selected && this.canResizeLeft(this.props) && this.state.dragging ? kt : {}, this.props.selected && this.canResizeRight(this.props) ? Dt : {}, this.props.selected && this.canResizeRight(this.props) && this.state.dragging ? Pt : {}, e.style, i);
  }
  render() {
    var i, s;
    if (typeof this.props.order > "u" || this.props.order === null)
      return null;
    const e = this.context, t = {
      dimensions: this.props.dimensions,
      useResizeHandle: !!this.props.useResizeHandle,
      title: this.itemTitle,
      canMove: this.canMove(this.props),
      canResizeLeft: this.canResizeLeft(this.props),
      canResizeRight: this.canResizeRight(this.props),
      selected: this.props.selected,
      dragging: this.state.dragging,
      dragStart: this.state.dragStart,
      dragTime: this.state.dragTime,
      dragGroupDelta: this.state.dragGroupDelta,
      resizing: this.state.resizing,
      resizeEdge: this.state.resizeEdge,
      resizeStart: this.state.resizeStart,
      resizeTime: this.state.resizeTime
    };
    return (s = (i = this.props) == null ? void 0 : i.itemRenderer) == null ? void 0 : s.call(i, {
      item: this.props.item,
      timelineContext: e,
      itemContext: t,
      getItemProps: this.getItemProps,
      getResizeProps: this.getResizeProps
    });
  }
}
Object.defineProperty(de, "defaultProps", {
  enumerable: !0,
  configurable: !0,
  writable: !0,
  value: {
    selected: !1,
    itemRenderer: Rt
  }
});
Object.defineProperty(de, "contextType", {
  enumerable: !0,
  configurable: !0,
  writable: !0,
  value: ce
});
function Lt(r, e) {
  const t = v(r, "canResize") !== void 0 ? v(r, "canResize") : e;
  return t === "left" || t === "both";
}
function Wt(r, e) {
  const t = v(r, "canResize") !== void 0 ? v(r, "canResize") : e;
  return t === "right" || t === "both" || t === !0;
}
class xt extends I {
  shouldComponentUpdate(e) {
    return !(W(e.groups, this.props.groups) && W(e.items, this.props.items) && W(e.dimensionItems, this.props.dimensionItems) && e.keys === this.props.keys && e.canvasTimeStart ==