@progress/kendo-react-scheduler/slots/SchedulerSlot.mjs

React Scheduler brings the functionality of Outlook's Calendar to a single UI component. KendoReact Scheduler package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import * as a from "react";
import { classNames as F } from "@progress/kendo-react-common";
import { useSchedulerSlot as L } from "../hooks/useSchedulerSlot.mjs";
const R = a.forwardRef(
  (e, g) => {
    const {
      // Focus
      onFocus: n,
      onBlur: o,
      // Mouse
      onClick: r,
      onMouseEnter: c,
      onMouseLeave: u,
      onMouseOut: s,
      onMouseOver: d,
      onDoubleClick: i,
      // Keyboard
      onKeyDown: k,
      onKeyPress: v,
      onKeyUp: y
    } = e, { slot: l, element: m } = L(e, g), C = e.tabIndex !== void 0 ? e.tabIndex === null ? void 0 : e.tabIndex : e.selected ? 0 : -1, M = a.useMemo(() => {
      var b, f;
      const t = (b = e.isWorkHour) != null ? b : h.isWorkHour, B = (f = e.isWorkDay) != null ? f : h.isWorkDay;
      return F("k-scheduler-cell", e.className, "k-slot-cell", {
        "k-nonwork-hour": !t || !B,
        "k-selected": e.selected
      });
    }, [e.className, e.selected, e.isWorkHour, e.isWorkDay]), D = a.useMemo(
      () => ({
        userSelect: "none",
        ...e.style
      }),
      [e.style]
    ), K = a.useCallback(
      (t) => {
        n && n.call(void 0, {
          syntheticEvent: t,
          target: l.current
        });
      },
      [n, l]
    ), W = a.useCallback(
      (t) => {
        o && o.call(void 0, {
          syntheticEvent: t,
          target: l.current
        });
      },
      [o, l]
    ), x = a.useCallback(
      (t) => {
        r && r.call(void 0, {
          syntheticEvent: t,
          target: l.current
        });
      },
      [r, l]
    ), S = a.useCallback(
      (t) => {
        d && d.call(void 0, {
          syntheticEvent: t,
          target: l.current
        });
      },
      [d, l]
    ), O = a.useCallback(
      (t) => {
        s && s.call(void 0, {
          syntheticEvent: t,
          target: l.current
        });
      },
      [s, l]
    ), w = a.useCallback(
      (t) => {
        c && c.call(void 0, {
          syntheticEvent: t,
          target: l.current
        });
      },
      [c, l]
    ), H = a.useCallback(
      (t) => {
        u && u.call(void 0, {
          syntheticEvent: t,
          target: l.current
        });
      },
      [u, l]
    ), N = a.useCallback(
      (t) => {
        i && i.call(void 0, {
          syntheticEvent: t,
          target: l.current
        });
      },
      [i, l]
    ), E = a.useCallback(
      (t) => {
        k && k.call(void 0, {
          syntheticEvent: t,
          target: l.current
        });
      },
      [k, l]
    ), I = a.useCallback(
      (t) => {
        v && v.call(void 0, {
          syntheticEvent: t,
          target: l.current
        });
      },
      [v, l]
    ), P = a.useCallback(
      (t) => {
        y && y.call(void 0, {
          syntheticEvent: t,
          target: l.current
        });
      },
      [y, l]
    );
    return /* @__PURE__ */ a.createElement(
      "div",
      {
        ref: m,
        id: e.id,
        style: D,
        className: M,
        tabIndex: C,
        "aria-selected": e.selected || void 0,
        onFocus: K,
        onBlur: W,
        onClick: x,
        onMouseEnter: w,
        onMouseLeave: H,
        onMouseOver: S,
        onMouseOut: O,
        onDoubleClick: N,
        onKeyDown: E,
        onKeyPress: I,
        onKeyUp: P,
        "data-slot": !0,
        "data-slot-allday": e.isAllDay,
        "data-slot-start": e.start.getTime(),
        "data-slot-end": e.end.getTime(),
        "data-slot-group": e.group.index,
        "data-slot-range": e.range.index,
        "data-slot-index": e.index
      },
      e.children
    );
  }
), h = {
  isWorkHour: !0,
  isWorkDay: !0
};
R.displayName = "KendoReactSchedulerSlot";
export {
  R as SchedulerSlot,
  h as schedulerSlotDefaultProps
};