@wavemaker-ai/react-runtime 1.0.0-rc.647499 → 1.0.0-rc.647565

package/components/input/calendar/index.js

@@ -1,114 +1,127 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof3 = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.WmCalendar = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireWildcard(require("react"));
-var _momentTimezone = _interopRequireDefault(require("moment-timezone"));
-var _material = require("@mui/material");
-var _lodash = require("lodash");
-var _withBaseWrapper = require("@wavemaker-ai/react-runtime/higherOrder/withBaseWrapper");
-var _core = require("@fullcalendar/core");
-var _daygrid = _interopRequireDefault(require("@fullcalendar/daygrid"));
-var _timegrid = _interopRequireDefault(require("@fullcalendar/timegrid"));
-var _list = _interopRequireDefault(require("@fullcalendar/list"));
-var _interaction = _interopRequireDefault(require("@fullcalendar/interaction"));
-var _googleCalendar = _interopRequireDefault(require("@fullcalendar/google-calendar"));
-var _moment = _interopRequireDefault(require("@fullcalendar/moment"));
-var _utils = require("./utils");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof3(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
-var __jsx = _react["default"].createElement;
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var WmCalendar = exports.WmCalendar = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-  var _props$hidden;
-  var name = props.name,
-    dataset = props.dataset,
-    datavalue = props.datavalue,
-    _props$eventtitle = props.eventtitle,
-    eventtitle = _props$eventtitle === void 0 ? "title" : _props$eventtitle,
-    _props$eventstart = props.eventstart,
-    eventstart = _props$eventstart === void 0 ? "start" : _props$eventstart,
-    _props$eventend = props.eventend,
-    eventend = _props$eventend === void 0 ? "end" : _props$eventend,
-    _props$eventallday = props.eventallday,
-    eventallday = _props$eventallday === void 0 ? "allday" : _props$eventallday,
-    _props$eventclass = props.eventclass,
-    eventclass = _props$eventclass === void 0 ? "className" : _props$eventclass,
-    _props$tabindex = props.tabindex,
-    tabindex = _props$tabindex === void 0 ? 0 : _props$tabindex,
-    _props$controls = props.controls,
-    controls = _props$controls === void 0 ? "navigation, today, year, month, week, day" : _props$controls,
-    _props$calendartype = props.calendartype,
-    calendartype = _props$calendartype === void 0 ? "basic" : _props$calendartype,
-    _props$view = props.view,
-    view = _props$view === void 0 ? "month" : _props$view,
-    _props$selectionmode = props.selectionmode,
-    selectionmode = _props$selectionmode === void 0 ? "none" : _props$selectionmode,
-    _props$show = props.show,
-    show = _props$show === void 0 ? true : _props$show,
-    height = props.height,
-    width = props.width,
-    onSelect = props.onSelect,
-    onBeforerender = props.onBeforerender,
-    onEventdrop = props.onEventdrop,
-    onEventresize = props.onEventresize,
-    onEventclick = props.onEventclick,
-    onEventrender = props.onEventrender,
-    onViewrender = props.onViewrender,
-    onDateclick = props.onDateclick,
-    listener = props.listener;
-  var calendarRef = (0, _react.useRef)(null);
-  var calendarInstanceRef = (0, _react.useRef)(null);
-  var _useState = (0, _react.useState)(null),
-    selectedDateRange = _useState[0],
-    setSelectedDateRange = _useState[1];
-  var _useState2 = (0, _react.useState)(null),
-    selectedEventsInRange = _useState2[0],
-    setSelectedEventsInRange = _useState2[1];
-  var _useState3 = (0, _react.useState)(null),
-    currentView = _useState3[0],
-    setCurrentView = _useState3[1];
-  var _useState4 = (0, _react.useState)({
-      events: []
-    }),
-    dataSetEvents = _useState4[0],
-    setDataSetEvents = _useState4[1];
-  var _useState5 = (0, _react.useState)(false),
-    calendarReady = _useState5[0],
-    setCalendarReady = _useState5[1];
-  var updateCalendarHeaderOptions = (0, _react.useCallback)(function () {
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { jsx } from "react/jsx-runtime";
+import { useRef, useState, useEffect, useCallback, useMemo, forwardRef } from "react";
+import moment from "moment-timezone";
+import { Box } from "@mui/material";
+import { get, each, includes } from "lodash";
+import { withBaseWrapper } from "../../../higherOrder/withBaseWrapper";
+import { Calendar } from "@fullcalendar/core";
+import dayGridPlugin from "@fullcalendar/daygrid";
+import timeGridPlugin from "@fullcalendar/timegrid";
+import listPlugin from "@fullcalendar/list";
+import interactionPlugin from "@fullcalendar/interaction";
+import googleCalendarPlugin from "@fullcalendar/google-calendar";
+import momentPlugin from "@fullcalendar/moment";
+import {
+  getEventMomentValue,
+  getUTCDateTime,
+  calculateHeight,
+  getViewType,
+  VIEW_TYPES,
+  getSessionLocale,
+  convertEventObj,
+  convertEventObjForOldAndNewData,
+  filterEventsByDateRange,
+  constructCalendarDataset,
+  defaultHeaderOptions,
+  BUTTON_TEXT,
+  SELECTION_MODES,
+  NEXT_DAY_THRESHOLD,
+  selectDate as selectDateUtil,
+  gotoDate as gotoDateUtil,
+  gotoNextYear as gotoNextYearUtil,
+  gotoPrevYear as gotoPrevYearUtil,
+  gotoMonth as gotoMonthUtil,
+  gotoNextMonth as gotoNextMonthUtil,
+  gotoPrevMonth as gotoPrevMonthUtil,
+  unselect as unselectUtil,
+  rerenderEvents as rerenderEventsUtil,
+  addEventSource as addEventSourceUtil,
+  overrideDefaults as overrideDefaultsUtil,
+  getDefaultDate as getDefaultDateUtil,
+  getLib as getLibUtil,
+  getDefaultOptions as getDefaultOptionsUtil,
+  applyCalendarOptions as applyCalendarOptionsUtil
+} from "./utils";
+const WmCalendar = forwardRef((props, ref) => {
+  var _a;
+  const {
+    name,
+    dataset,
+    datavalue,
+    eventtitle = "title",
+    eventstart = "start",
+    eventend = "end",
+    eventallday = "allday",
+    eventclass = "className",
+    tabindex = 0,
+    controls = "navigation, today, year, month, week, day",
+    calendartype = "basic",
+    view = "month",
+    selectionmode = "none",
+    show = true,
+    height,
+    width,
+    onSelect,
+    onBeforerender,
+    onEventdrop,
+    onEventresize,
+    onEventclick,
+    onEventrender,
+    onViewrender,
+    onDateclick,
+    listener
+  } = props;
+  const calendarRef = useRef(null);
+  const calendarInstanceRef = useRef(null);
+  const [selectedDateRange, setSelectedDateRange] = useState(null);
+  const [selectedEventsInRange, setSelectedEventsInRange] = useState(null);
+  const [currentView, setCurrentView] = useState(null);
+  const [dataSetEvents, setDataSetEvents] = useState({ events: [] });
+  const [calendarReady, setCalendarReady] = useState(false);
+  const updateCalendarHeaderOptions = useCallback(() => {
     if (!calendarInstanceRef.current) return;
-    var ctrls = controls;
-    var viewType = calendartype;
-    var regEx = new RegExp("\\bday\\b", "g");
-    var left = "";
-    var right = "";
+    const ctrls = controls;
+    const viewType = calendartype;
+    const regEx = new RegExp("\\bday\\b", "g");
+    let left = "";
+    let right = "";
     if (ctrls && viewType) {
-      if ((0, _lodash.includes)(ctrls, "navigation")) {
+      if (includes(ctrls, "navigation")) {
         left += " prev next";
       }
-      if ((0, _lodash.includes)(ctrls, "today")) {
+      if (includes(ctrls, "today")) {
         left += " today";
       }
-      if ((0, _lodash.includes)(ctrls, "year")) {
-        right += viewType === _utils.VIEW_TYPES.LIST ? "listYear" : "";
+      if (includes(ctrls, "year")) {
+        right += viewType === VIEW_TYPES.LIST ? "listYear" : "";
       }
-      if ((0, _lodash.includes)(ctrls, "month")) {
-        right += viewType === _utils.VIEW_TYPES.LIST ? " listMonth" : " dayGridMonth";
+      if (includes(ctrls, "month")) {
+        right += viewType === VIEW_TYPES.LIST ? " listMonth" : " dayGridMonth";
       }
-      if ((0, _lodash.includes)(ctrls, "week")) {
-        right += viewType === _utils.VIEW_TYPES.BASIC ? " dayGridWeek" : viewType === _utils.VIEW_TYPES.LIST ? " listWeek" : " timeGridWeek";
+      if (includes(ctrls, "week")) {
+        right += viewType === VIEW_TYPES.BASIC ? " dayGridWeek" : viewType === VIEW_TYPES.LIST ? " listWeek" : " timeGridWeek";
       }
       if (regEx.test(ctrls)) {
-        right += viewType === _utils.VIEW_TYPES.BASIC ? " dayGridDay" : viewType === _utils.VIEW_TYPES.LIST ? " listDay" : " timeGridDay";
+        right += viewType === VIEW_TYPES.BASIC ? " dayGridDay" : viewType === VIEW_TYPES.LIST ? " listDay" : " timeGridDay";
       }
       if (left.charAt(0) === " ") {
         left = left.substring(1);
@@ -116,66 +129,74 @@ var WmCalendar = exports.WmCalendar = /*#__PURE__*/(0, _react.forwardRef)(functi
       if (right.charAt(0) === " ") {
         right = right.substring(1);
       }
-      calendarInstanceRef.current.setOption("headerToolbar", _objectSpread(_objectSpread({}, calendarInstanceRef.current.getOption("headerToolbar")), {}, {
+      calendarInstanceRef.current.setOption("headerToolbar", __spreadProps(__spreadValues({}, calendarInstanceRef.current.getOption("headerToolbar")), {
         start: left,
         end: right
       }));
     }
   }, [calendartype, controls]);
-  var invokeCallback = (0, _react.useCallback)(function (eventName, eventData) {
-    var $start = eventData.$start,
-      $end = eventData.$end,
-      $view = eventData.$view,
-      $data = eventData.$data,
-      $event = eventData.$event,
-      $newData = eventData.$newData,
-      $oldData = eventData.$oldData,
-      $delta = eventData.$delta,
-      $revertFunc = eventData.$revertFunc,
-      $ui = eventData.$ui;
-    switch (eventName) {
-      case "select":
-        onSelect === null || onSelect === void 0 || onSelect($start, $end, $view, $data);
-        break;
-      case "beforerender":
-        onBeforerender === null || onBeforerender === void 0 || onBeforerender(eventData, listener === null || listener === void 0 ? void 0 : listener.Widgets[name]);
-        break;
-      case "eventdrop":
-        onEventdrop === null || onEventdrop === void 0 || onEventdrop($event, $newData, $oldData, $delta, $revertFunc, $ui, $view);
-        break;
-      case "eventresize":
-        onEventresize === null || onEventresize === void 0 || onEventresize($event, $newData, $oldData, $delta, $revertFunc, $ui, $view);
-        break;
-      case "eventclick":
-        onEventclick === null || onEventclick === void 0 || onEventclick($event, $data, $view);
-        break;
-      case "eventrender":
-        onEventrender === null || onEventrender === void 0 || onEventrender($event, $data, $view);
-        break;
-      case "viewrender":
-        onViewrender === null || onViewrender === void 0 || onViewrender(eventData.$view);
-        break;
-      case "dateclick":
-        onDateclick === null || onDateclick === void 0 || onDateclick(eventData.$dateInfo);
-        break;
-    }
-  }, [onSelect, onBeforerender, onEventdrop, onEventresize, onEventclick, onEventrender, onViewrender, onDateclick]);
-  var calendarHeight = (0, _react.useMemo)(function () {
-    return (0, _utils.calculateHeight)(height);
-  }, [height]);
-  var calendarOptions = (0, _react.useMemo)(function () {
-    var computedHeight = calendarHeight;
-    var eventLimit = Math.floor(computedHeight / 200) + 1;
+  const invokeCallback = useCallback(
+    (eventName, eventData) => {
+      const { $start, $end, $view, $data, $event, $newData, $oldData, $delta, $revertFunc, $ui } = eventData;
+      switch (eventName) {
+        case "select":
+          onSelect == null ? void 0 : onSelect($start, $end, $view, $data);
+          break;
+        case "beforerender":
+          onBeforerender == null ? void 0 : onBeforerender(eventData, listener == null ? void 0 : listener.Widgets[name]);
+          break;
+        case "eventdrop":
+          onEventdrop == null ? void 0 : onEventdrop($event, $newData, $oldData, $delta, $revertFunc, $ui, $view);
+          break;
+        case "eventresize":
+          onEventresize == null ? void 0 : onEventresize($event, $newData, $oldData, $delta, $revertFunc, $ui, $view);
+          break;
+        case "eventclick":
+          onEventclick == null ? void 0 : onEventclick($event, $data, $view);
+          break;
+        case "eventrender":
+          onEventrender == null ? void 0 : onEventrender($event, $data, $view);
+          break;
+        case "viewrender":
+          onViewrender == null ? void 0 : onViewrender(eventData.$view);
+          break;
+        case "dateclick":
+          onDateclick == null ? void 0 : onDateclick(eventData.$dateInfo);
+          break;
+      }
+    },
+    [
+      onSelect,
+      onBeforerender,
+      onEventdrop,
+      onEventresize,
+      onEventclick,
+      onEventrender,
+      onViewrender,
+      onDateclick
+    ]
+  );
+  const calendarHeight = useMemo(() => calculateHeight(height), [height]);
+  const calendarOptions = useMemo(() => {
+    const computedHeight = calendarHeight;
+    const eventLimit = Math.floor(computedHeight / 200) + 1;
     return {
       calendar: {
         height: computedHeight,
-        plugins: [_daygrid["default"], _timegrid["default"], _interaction["default"], _list["default"], _googleCalendar["default"], _moment["default"]],
+        plugins: [
+          dayGridPlugin,
+          timeGridPlugin,
+          interactionPlugin,
+          listPlugin,
+          googleCalendarPlugin,
+          momentPlugin
+        ],
         editable: true,
-        locale: (0, _utils.getSessionLocale)(),
-        selectable: selectionmode !== _utils.SELECTION_MODES.NONE,
-        longPressDelay: 1000,
-        headerToolbar: _utils.defaultHeaderOptions,
-        nextDayThreshold: _utils.NEXT_DAY_THRESHOLD.START,
+        locale: getSessionLocale(),
+        selectable: selectionmode !== SELECTION_MODES.NONE,
+        longPressDelay: 1e3,
+        headerToolbar: defaultHeaderOptions,
+        nextDayThreshold: NEXT_DAY_THRESHOLD.START,
         eventSources: [dataSetEvents],
         views: {
           month: {
@@ -184,33 +205,31 @@ var WmCalendar = exports.WmCalendar = /*#__PURE__*/(0, _react.forwardRef)(functi
           }
         },
         unselectAuto: false,
-        initialView: (0, _utils.getViewType)(view, calendartype),
-        selectConstraint: selectionmode === _utils.SELECTION_MODES.SINGLE ? {
+        initialView: getViewType(view, calendartype),
+        selectConstraint: selectionmode === SELECTION_MODES.SINGLE ? {
           startTime: "00:00",
           endTime: "24:00"
         } : {},
-        selectAllow: selectionmode === _utils.SELECTION_MODES.MULTIPLE ? function () {
-          return true;
-        } : undefined,
+        selectAllow: selectionmode === SELECTION_MODES.MULTIPLE ? () => true : void 0,
         buttonText: {
-          year: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_YEAR", _utils.BUTTON_TEXT.YEAR),
-          month: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_MONTH", _utils.BUTTON_TEXT.MONTH),
-          week: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_WEEK", _utils.BUTTON_TEXT.WEEK),
-          day: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_DAY", _utils.BUTTON_TEXT.DAY),
-          today: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_TODAY", _utils.BUTTON_TEXT.TODAY),
-          listYear: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_YEAR", _utils.BUTTON_TEXT.YEAR),
-          listMonth: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_MONTH", _utils.BUTTON_TEXT.MONTH),
-          listWeek: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_WEEK", _utils.BUTTON_TEXT.WEEK),
-          listDay: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_DAY", _utils.BUTTON_TEXT.DAY)
+          year: get(window, "app.appLocale.LABEL_CALENDAR_YEAR", BUTTON_TEXT.YEAR),
+          month: get(window, "app.appLocale.LABEL_CALENDAR_MONTH", BUTTON_TEXT.MONTH),
+          week: get(window, "app.appLocale.LABEL_CALENDAR_WEEK", BUTTON_TEXT.WEEK),
+          day: get(window, "app.appLocale.LABEL_CALENDAR_DAY", BUTTON_TEXT.DAY),
+          today: get(window, "app.appLocale.LABEL_CALENDAR_TODAY", BUTTON_TEXT.TODAY),
+          listYear: get(window, "app.appLocale.LABEL_CALENDAR_YEAR", BUTTON_TEXT.YEAR),
+          listMonth: get(window, "app.appLocale.LABEL_CALENDAR_MONTH", BUTTON_TEXT.MONTH),
+          listWeek: get(window, "app.appLocale.LABEL_CALENDAR_WEEK", BUTTON_TEXT.WEEK),
+          listDay: get(window, "app.appLocale.LABEL_CALENDAR_DAY", BUTTON_TEXT.DAY)
         }
       }
     };
-  }, [calendartype, selectionmode, view, dataSetEvents, calendarHeight, _utils.getViewType]);
-  var eventHandlers = (0, _react.useMemo)(function () {
-    return {
-      eventDrop: function eventDrop(eventDropInfo) {
-        var newDataObj = (0, _utils.convertEventObjForOldAndNewData)(eventDropInfo.event);
-        var oldDataObj = (0, _utils.convertEventObjForOldAndNewData)(eventDropInfo.oldEvent);
+  }, [calendartype, selectionmode, view, dataSetEvents, calendarHeight, getViewType]);
+  const eventHandlers = useMemo(
+    () => ({
+      eventDrop: (eventDropInfo) => {
+        const newDataObj = convertEventObjForOldAndNewData(eventDropInfo.event);
+        const oldDataObj = convertEventObjForOldAndNewData(eventDropInfo.oldEvent);
         invokeCallback("eventdrop", {
           $event: eventDropInfo.jsEvent,
           $newData: newDataObj,
@@ -221,9 +240,9 @@ var WmCalendar = exports.WmCalendar = /*#__PURE__*/(0, _react.forwardRef)(functi
           $view: eventDropInfo.view
         });
       },
-      eventResize: function eventResize(eventResizeInfo) {
-        var newDataObj = (0, _utils.convertEventObjForOldAndNewData)(eventResizeInfo.event);
-        var oldDataObj = (0, _utils.convertEventObjForOldAndNewData)(eventResizeInfo.oldEvent);
+      eventResize: (eventResizeInfo) => {
+        const newDataObj = convertEventObjForOldAndNewData(eventResizeInfo.event);
+        const oldDataObj = convertEventObjForOldAndNewData(eventResizeInfo.oldEvent);
         invokeCallback("eventresize", {
           $event: eventResizeInfo.jsEvent,
           $newData: newDataObj,
@@ -234,20 +253,26 @@ var WmCalendar = exports.WmCalendar = /*#__PURE__*/(0, _react.forwardRef)(functi
           $view: eventResizeInfo.view
         });
       },
-      eventClick: function eventClick(eventClickInfo) {
-        var eventObj = (0, _utils.convertEventObj)(eventClickInfo.event);
+      eventClick: (eventClickInfo) => {
+        const eventObj = convertEventObj(eventClickInfo.event);
         invokeCallback("eventclick", {
           $event: eventClickInfo.jsEvent,
           $data: eventObj,
           $view: eventClickInfo.view
         });
       },
-      select: function select(selectionInfo) {
-        var selectDates = {
-          start: (0, _utils.getUTCDateTime)(selectionInfo.start),
-          end: (0, _utils.getUTCDateTime)(selectionInfo.end)
+      select: (selectionInfo) => {
+        const selectDates = {
+          start: getUTCDateTime(selectionInfo.start),
+          end: getUTCDateTime(selectionInfo.end)
         };
-        var filteredData = (0, _utils.filterEventsByDateRange)(dataset, selectionInfo.start, selectionInfo.end, eventstart, eventend);
+        const filteredData = filterEventsByDateRange(
+          dataset,
+          selectionInfo.start,
+          selectionInfo.end,
+          eventstart,
+          eventend
+        );
         setSelectedDateRange(selectDates);
         setSelectedEventsInRange(filteredData);
         invokeCallback("select", {
@@ -257,11 +282,11 @@ var WmCalendar = exports.WmCalendar = /*#__PURE__*/(0, _react.forwardRef)(functi
           $data: filteredData
         });
       },
-      eventDidMount: function eventDidMount(event) {
-        var eventObj = (0, _utils.convertEventObj)(event.event);
-        setTimeout(function () {
-          if (calendartype === _utils.VIEW_TYPES.LIST) {
-            var fcListTable = document.querySelector(".fc-list-table");
+      eventDidMount: (event) => {
+        const eventObj = convertEventObj(event.event);
+        setTimeout(() => {
+          if (calendartype === VIEW_TYPES.LIST) {
+            const fcListTable = document.querySelector(".fc-list-table");
             if (fcListTable && !fcListTable.classList.contains("table")) {
               fcListTable.classList.add("table");
             }
@@ -273,10 +298,10 @@ var WmCalendar = exports.WmCalendar = /*#__PURE__*/(0, _react.forwardRef)(functi
           $view: event.view
         });
       },
-      viewDidMount: function viewDidMount(viewInfo) {
-        setTimeout(function () {
-          if (calendartype === _utils.VIEW_TYPES.LIST) {
-            var fcListTable = document.querySelector(".fc-list-table");
+      viewDidMount: (viewInfo) => {
+        setTimeout(() => {
+          if (calendartype === VIEW_TYPES.LIST) {
+            const fcListTable = document.querySelector(".fc-list-table");
             if (fcListTable && !fcListTable.classList.contains("table")) {
               fcListTable.classList.add("table");
             }
@@ -289,115 +314,121 @@ var WmCalendar = exports.WmCalendar = /*#__PURE__*/(0, _react.forwardRef)(functi
           onViewrender(viewInfo);
         }
       },
-      datesSet: function datesSet(data) {
+      datesSet: (data) => {
         setCurrentView({
-          start: (0, _momentTimezone["default"])(data.start).format("YYYY-MM-DD"),
-          end: (0, _momentTimezone["default"])(data.end).format("YYYY-MM-DD")
+          start: moment(data.start).format("YYYY-MM-DD"),
+          end: moment(data.end).format("YYYY-MM-DD")
         });
       },
-      dateClick: function dateClick(info) {
-        var dateInfo = (0, _utils.getUTCDateTime)(info.date).valueOf();
-        invokeCallback("dateclick", {
-          $dateInfo: dateInfo
-        });
+      dateClick: (info) => {
+        const dateInfo = getUTCDateTime(info.date).valueOf();
+        invokeCallback("dateclick", { $dateInfo: dateInfo });
       }
-    };
-  }, [calendartype, invokeCallback, _utils.convertEventObj, _utils.convertEventObjForOldAndNewData, _utils.filterEventsByDateRange]);
-  (0, _react.useEffect)(function () {
+    }),
+    [
+      calendartype,
+      invokeCallback,
+      convertEventObj,
+      convertEventObjForOldAndNewData,
+      filterEventsByDateRange
+    ]
+  );
+  useEffect(() => {
     if (!dataset) {
-      setDataSetEvents({
-        events: []
-      });
+      setDataSetEvents({ events: [] });
       return;
     }
-    var dataSet;
+    let dataSet;
     if (Array.isArray(dataset)) {
       dataSet = dataset;
     } else if (dataset.data && Array.isArray(dataset.data)) {
       dataSet = dataset.data;
-    } else if ((0, _typeof2["default"])(dataset) === "object") {
-      dataSet = [dataset]; // Handle single object as array
+    } else if (typeof dataset === "object") {
+      dataSet = [dataset];
     } else {
       dataSet = [];
     }
-    var processedDataSet = (0, _utils.constructCalendarDataset)((0, _toConsumableArray2["default"])(dataSet), eventtitle, eventallday, eventstart, eventend, eventclass);
-    var filteredEvents = processedDataSet.filter(function (event) {
+    const processedDataSet = constructCalendarDataset(
+      [...dataSet],
+      eventtitle,
+      eventallday,
+      eventstart,
+      eventend,
+      eventclass
+    );
+    const filteredEvents = processedDataSet.filter((event) => {
       event.start = event.start || event.end;
       return !!event.start;
     });
-    setDataSetEvents({
-      events: filteredEvents
-    });
+    setDataSetEvents({ events: filteredEvents });
     if (calendarInstanceRef.current) {
       renderEventDataSet(filteredEvents);
     }
-  }, [dataset, _utils.constructCalendarDataset]);
-  (0, _react.useEffect)(function () {
+  }, [dataset, constructCalendarDataset]);
+  useEffect(() => {
     if (calendarInstanceRef.current) {
       updateCalendarHeaderOptions();
     }
   }, [controls, calendartype, updateCalendarHeaderOptions]);
-  (0, _react.useEffect)(function () {
+  useEffect(() => {
     if (!calendarInstanceRef.current) return;
-    var newView = (0, _utils.getViewType)(view, calendartype);
+    const newView = getViewType(view, calendartype);
     calendarInstanceRef.current.changeView(newView);
-  }, [view, calendartype, _utils.getViewType]);
-  (0, _react.useEffect)(function () {
+  }, [view, calendartype, getViewType]);
+  useEffect(() => {
     if (!calendarInstanceRef.current) return;
-    calendarInstanceRef.current.setOption("selectable", selectionmode !== _utils.SELECTION_MODES.NONE);
-    if (selectionmode === _utils.SELECTION_MODES.SINGLE) {
+    calendarInstanceRef.current.setOption("selectable", selectionmode !== SELECTION_MODES.NONE);
+    if (selectionmode === SELECTION_MODES.SINGLE) {
       calendarInstanceRef.current.setOption("selectConstraint", {
         startTime: "00:00",
         endTime: "24:00"
       });
-      calendarInstanceRef.current.setOption("selectAllow", undefined);
-    } else if (selectionmode === _utils.SELECTION_MODES.MULTIPLE) {
+      calendarInstanceRef.current.setOption("selectAllow", void 0);
+    } else if (selectionmode === SELECTION_MODES.MULTIPLE) {
       calendarInstanceRef.current.setOption("selectConstraint", {});
-      calendarInstanceRef.current.setOption("selectAllow", function () {
-        return true;
-      });
+      calendarInstanceRef.current.setOption("selectAllow", () => true);
     } else {
       calendarInstanceRef.current.setOption("selectConstraint", {});
-      calendarInstanceRef.current.setOption("selectAllow", undefined);
+      calendarInstanceRef.current.setOption("selectAllow", void 0);
     }
   }, [selectionmode]);
-  (0, _react.useEffect)(function () {
+  useEffect(() => {
     if (!calendarInstanceRef.current) return;
-    var newHeight = (0, _utils.calculateHeight)(height);
+    const newHeight = calculateHeight(height);
     calendarInstanceRef.current.setOption("height", newHeight);
   }, [height]);
-  var renderEventDataSet = (0, _react.useCallback)(function () {
-    var events = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : dataSetEvents.events;
-    if (!calendarInstanceRef.current) return;
-    calendarInstanceRef.current.batchRendering(function () {
-      var currentEvents = calendarInstanceRef.current.getEvents();
-      for (var i = 0; i < currentEvents.length; i++) {
-        currentEvents[i].remove();
-      }
-      var eventsToAdd = events || dataSetEvents.events;
-      (0, _lodash.each)(eventsToAdd, function (event) {
-        try {
-          calendarInstanceRef.current.addEvent(event);
-        } catch (e) {
-          console.warn("Failed to add event:", event, e);
+  const renderEventDataSet = useCallback(
+    (events = dataSetEvents.events) => {
+      if (!calendarInstanceRef.current) return;
+      calendarInstanceRef.current.batchRendering(() => {
+        const currentEvents = calendarInstanceRef.current.getEvents();
+        for (let i = 0; i < currentEvents.length; i++) {
+          currentEvents[i].remove();
         }
+        const eventsToAdd = events || dataSetEvents.events;
+        each(eventsToAdd, (event) => {
+          try {
+            calendarInstanceRef.current.addEvent(event);
+          } catch (e) {
+            console.warn("Failed to add event:", event, e);
+          }
+        });
       });
-    });
-  }, [dataSetEvents.events]);
-  (0, _react.useEffect)(function () {
+    },
+    [dataSetEvents.events]
+  );
+  useEffect(() => {
     if (!calendarRef.current || !show) return;
-    var calendarInstance = new _core.Calendar(calendarRef.current, _objectSpread(_objectSpread({}, calendarOptions.calendar), eventHandlers));
+    const calendarInstance = new Calendar(calendarRef.current, __spreadValues(__spreadValues({}, calendarOptions.calendar), eventHandlers));
     calendarInstanceRef.current = calendarInstance;
     setCalendarReady(true);
-    invokeCallback("beforerender", {
-      $event: {}
-    });
+    invokeCallback("beforerender", { $event: {} });
     calendarInstance.render();
-    var timeoutId = setTimeout(function () {
-      var initialView = (0, _utils.getViewType)(view, calendartype);
+    const timeoutId = setTimeout(() => {
+      const initialView = getViewType(view, calendartype);
       calendarInstance.changeView(initialView);
     }, 50);
-    return function () {
+    return () => {
       clearTimeout(timeoutId);
       if (calendarInstanceRef.current) {
         calendarInstanceRef.current.destroy();
@@ -406,161 +437,177 @@ var WmCalendar = exports.WmCalendar = /*#__PURE__*/(0, _react.forwardRef)(functi
       setCalendarReady(false);
     };
   }, [show]);
-  (0, _react.useEffect)(function () {
+  useEffect(() => {
     if (calendarReady && calendarInstanceRef.current) {
       renderEventDataSet();
     }
   }, [calendarReady, dataSetEvents.events]);
-  (0, _react.useEffect)(function () {
+  useEffect(() => {
     if (!calendarInstanceRef.current) return;
     calendarInstanceRef.current.setOption("height", calendarHeight);
-    calendarInstanceRef.current.setOption("locale", (0, _utils.getSessionLocale)());
-    calendarInstanceRef.current.setOption("selectable", selectionmode !== _utils.SELECTION_MODES.NONE);
-    if (selectionmode === _utils.SELECTION_MODES.SINGLE) {
+    calendarInstanceRef.current.setOption("locale", getSessionLocale());
+    calendarInstanceRef.current.setOption("selectable", selectionmode !== SELECTION_MODES.NONE);
+    if (selectionmode === SELECTION_MODES.SINGLE) {
       calendarInstanceRef.current.setOption("selectConstraint", {
         startTime: "00:00",
         endTime: "24:00"
       });
-    } else if (selectionmode === _utils.SELECTION_MODES.MULTIPLE) {
+    } else if (selectionmode === SELECTION_MODES.MULTIPLE) {
       calendarInstanceRef.current.setOption("selectConstraint", {});
-      calendarInstanceRef.current.setOption("selectAllow", function () {
-        return true;
-      });
+      calendarInstanceRef.current.setOption("selectAllow", () => true);
     } else {
       calendarInstanceRef.current.setOption("selectConstraint", {});
     }
-    var currentView = (0, _utils.getViewType)(view, calendartype);
-    calendarInstanceRef.current.changeView(currentView);
+    const currentView2 = getViewType(view, calendartype);
+    calendarInstanceRef.current.changeView(currentView2);
     updateCalendarHeaderOptions();
-  }, [calendarHeight, selectionmode, view, calendartype, _utils.getViewType, updateCalendarHeaderOptions]);
-  (0, _react.useEffect)(function () {
-    var handleLocaleChange = function handleLocaleChange(localeData) {
+  }, [calendarHeight, selectionmode, view, calendartype, getViewType, updateCalendarHeaderOptions]);
+  useEffect(() => {
+    const handleLocaleChange = (localeData) => {
       if (!calendarInstanceRef.current) return;
-      var buttonText = {
-        year: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_YEAR", _utils.BUTTON_TEXT.YEAR),
-        month: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_MONTH", _utils.BUTTON_TEXT.MONTH),
-        week: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_WEEK", _utils.BUTTON_TEXT.WEEK),
-        day: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_DAY", _utils.BUTTON_TEXT.DAY),
-        today: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_TODAY", _utils.BUTTON_TEXT.TODAY),
-        listYear: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_YEAR", _utils.BUTTON_TEXT.YEAR),
-        listMonth: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_MONTH", _utils.BUTTON_TEXT.MONTH),
-        listWeek: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_WEEK", _utils.BUTTON_TEXT.WEEK),
-        listDay: (0, _lodash.get)(window, "app.appLocale.LABEL_CALENDAR_DAY", _utils.BUTTON_TEXT.DAY)
+      const buttonText = {
+        year: get(window, "app.appLocale.LABEL_CALENDAR_YEAR", BUTTON_TEXT.YEAR),
+        month: get(window, "app.appLocale.LABEL_CALENDAR_MONTH", BUTTON_TEXT.MONTH),
+        week: get(window, "app.appLocale.LABEL_CALENDAR_WEEK", BUTTON_TEXT.WEEK),
+        day: get(window, "app.appLocale.LABEL_CALENDAR_DAY", BUTTON_TEXT.DAY),
+        today: get(window, "app.appLocale.LABEL_CALENDAR_TODAY", BUTTON_TEXT.TODAY),
+        listYear: get(window, "app.appLocale.LABEL_CALENDAR_YEAR", BUTTON_TEXT.YEAR),
+        listMonth: get(window, "app.appLocale.LABEL_CALENDAR_MONTH", BUTTON_TEXT.MONTH),
+        listWeek: get(window, "app.appLocale.LABEL_CALENDAR_WEEK", BUTTON_TEXT.WEEK),
+        listDay: get(window, "app.appLocale.LABEL_CALENDAR_DAY", BUTTON_TEXT.DAY)
       };
       calendarInstanceRef.current.setOption("buttonText", buttonText);
       calendarInstanceRef.current.setOption("locale", localeData.fullCalendar || "en");
       calendarInstanceRef.current.render();
     };
-    var appInstance = window.app;
+    const appInstance = window.app;
     if (appInstance && appInstance.subscribe) {
-      var unsubscribe = appInstance.subscribe("locale-changed", handleLocaleChange);
-      return function () {
+      const unsubscribe = appInstance.subscribe("locale-changed", handleLocaleChange);
+      return () => {
         if (unsubscribe) unsubscribe();
       };
     }
   }, []);
-  var selectDate = (0, _react.useCallback)(function () {
-    (0, _utils.selectDate)(calendarInstanceRef.current, datavalue);
+  const selectDate = useCallback(() => {
+    selectDateUtil(calendarInstanceRef.current, datavalue);
   }, [datavalue]);
-  var gotoDate = (0, _react.useCallback)(function () {
-    (0, _utils.gotoDate)(calendarInstanceRef.current, datavalue);
+  const gotoDate = useCallback(() => {
+    gotoDateUtil(calendarInstanceRef.current, datavalue);
   }, [datavalue]);
-  var gotoNextYear = (0, _react.useCallback)(function () {
-    (0, _utils.gotoNextYear)(calendarInstanceRef.current);
+  const gotoNextYear = useCallback(() => {
+    gotoNextYearUtil(calendarInstanceRef.current);
   }, []);
-  var gotoPrevYear = (0, _react.useCallback)(function () {
-    (0, _utils.gotoPrevYear)(calendarInstanceRef.current);
+  const gotoPrevYear = useCallback(() => {
+    gotoPrevYearUtil(calendarInstanceRef.current);
   }, []);
-  var gotoMonth = (0, _react.useCallback)(function (monthVal) {
-    (0, _utils.gotoMonth)(calendarInstanceRef.current, monthVal);
+  const gotoMonth = useCallback((monthVal) => {
+    gotoMonthUtil(calendarInstanceRef.current, monthVal);
   }, []);
-  var gotoNextMonth = (0, _react.useCallback)(function () {
-    (0, _utils.gotoNextMonth)(calendarInstanceRef.current);
+  const gotoNextMonth = useCallback(() => {
+    gotoNextMonthUtil(calendarInstanceRef.current);
   }, []);
-  var gotoPrevMonth = (0, _react.useCallback)(function () {
-    (0, _utils.gotoPrevMonth)(calendarInstanceRef.current);
+  const gotoPrevMonth = useCallback(() => {
+    gotoPrevMonthUtil(calendarInstanceRef.current);
   }, []);
-  var unselect = (0, _react.useCallback)(function () {
-    (0, _utils.unselect)(calendarInstanceRef.current);
+  const unselect = useCallback(() => {
+    unselectUtil(calendarInstanceRef.current);
   }, []);
-  var rerenderEvents = (0, _react.useCallback)(function () {
-    (0, _utils.rerenderEvents)(calendarInstanceRef.current);
+  const rerenderEvents = useCallback(() => {
+    rerenderEventsUtil(calendarInstanceRef.current);
   }, []);
-  var addEventSource = (0, _react.useCallback)(function (eventObject) {
-    (0, _utils.addEventSource)(calendarInstanceRef.current, eventObject);
+  const addEventSource = useCallback((eventObject) => {
+    addEventSourceUtil(calendarInstanceRef.current, eventObject);
   }, []);
-  var overrideDefaults = (0, _react.useCallback)(function (options) {
-    (0, _utils.overrideDefaults)(calendarInstanceRef.current, options);
+  const overrideDefaults = useCallback((options) => {
+    overrideDefaultsUtil(calendarInstanceRef.current, options);
   }, []);
-  var getDefaultDate = (0, _react.useCallback)(function () {
-    return (0, _utils.getDefaultDate)(datavalue);
+  const getDefaultDate = useCallback(() => {
+    return getDefaultDateUtil(datavalue);
   }, [datavalue]);
-  var getLib = (0, _react.useCallback)(function () {
-    return (0, _utils.getLib)();
+  const getLib = useCallback(() => {
+    return getLibUtil();
   }, []);
-  var getDefaultOptions = (0, _react.useCallback)(function () {
-    return (0, _utils.getDefaultOptions)(calendarOptions);
+  const getDefaultOptions = useCallback(() => {
+    return getDefaultOptionsUtil(calendarOptions);
   }, [calendarOptions]);
-  var applyCalendarOptions = (0, _react.useCallback)(function (operationType, argumentKey, argumentValue) {
-    (0, _utils.applyCalendarOptions)(calendarInstanceRef.current, operationType, argumentKey, argumentValue, _utils.getViewType, calendartype);
-  }, [_utils.getViewType, calendartype]);
-  (0, _react.useEffect)(function () {
-    var _props$listener;
-    if (props !== null && props !== void 0 && (_props$listener = props.listener) !== null && _props$listener !== void 0 && _props$listener.onChange) {
+  const applyCalendarOptions = useCallback(
+    (operationType, argumentKey, argumentValue) => {
+      applyCalendarOptionsUtil(
+        calendarInstanceRef.current,
+        operationType,
+        argumentKey,
+        argumentValue,
+        getViewType,
+        calendartype
+      );
+    },
+    [getViewType, calendartype]
+  );
+  useEffect(() => {
+    var _a2;
+    if ((_a2 = props == null ? void 0 : props.listener) == null ? void 0 : _a2.onChange) {
       props.listener.onChange(name, {
-        selectDate: selectDate,
-        gotoDate: gotoDate,
-        gotoMonth: gotoMonth,
-        gotoNextMonth: gotoNextMonth,
-        gotoPrevMonth: gotoPrevMonth,
-        gotoNextYear: gotoNextYear,
-        gotoPrevYear: gotoPrevYear,
-        rerenderEvents: rerenderEvents,
-        unselect: unselect,
-        addEventSource: addEventSource,
-        overrideDefaults: overrideDefaults,
-        getDefaultDate: getDefaultDate,
-        getLib: getLib,
-        getDefaultOptions: getDefaultOptions,
-        calendarOptions: calendarOptions,
-        applyCalendarOptions: applyCalendarOptions,
-        getEventMomentValue: _utils.getEventMomentValue,
-        selectedDateRange: selectedDateRange,
-        selectedEventsInRange: selectedEventsInRange,
-        currentView: currentView
+        selectDate,
+        gotoDate,
+        gotoMonth,
+        gotoNextMonth,
+        gotoPrevMonth,
+        gotoNextYear,
+        gotoPrevYear,
+        rerenderEvents,
+        unselect,
+        addEventSource,
+        overrideDefaults,
+        getDefaultDate,
+        getLib,
+        getDefaultOptions,
+        calendarOptions,
+        applyCalendarOptions,
+        getEventMomentValue,
+        selectedDateRange,
+        selectedEventsInRange,
+        currentView
       });
     }
-  }, [selectDate, gotoDate, gotoMonth, gotoNextMonth, gotoPrevMonth, gotoNextYear, gotoPrevYear, rerenderEvents, _utils.getEventMomentValue, selectedDateRange, selectedEventsInRange, currentView]);
-  var componentProps = {
-    name: name,
-    view: view,
-    calendartype: calendartype,
-    selectionmode: selectionmode,
+  }, [
+    selectDate,
+    gotoDate,
+    gotoMonth,
+    gotoNextMonth,
+    gotoPrevMonth,
+    gotoNextYear,
+    gotoPrevYear,
+    rerenderEvents,
+    getEventMomentValue,
+    selectedDateRange,
+    selectedEventsInRange,
+    currentView
+  ]);
+  const componentProps = {
+    name,
+    view,
+    calendartype,
+    selectionmode,
     tabIndex: tabindex,
-    controls: controls,
-    height: height,
-    width: width,
+    controls,
+    height,
+    width,
     "data-widget-id": props["data-widget-id"],
     "aria-label": view ? view + " view" : "month view"
   };
-  return __jsx(_material.Box, (0, _extends2["default"])({
-    hidden: (_props$hidden = props.hidden) !== null && _props$hidden !== void 0 ? _props$hidden : false,
-    className: "app-calendar wm-calendar-root"
-  }, componentProps), __jsx(_material.Box, {
-    className: props.className,
-    ref: calendarRef
-  }));
+  return /* @__PURE__ */ jsx(
+    Box,
+    __spreadProps(__spreadValues({
+      hidden: (_a = props.hidden) != null ? _a : false,
+      className: "app-calendar wm-calendar-root"
+    }, componentProps), {
+      children: /* @__PURE__ */ jsx(Box, { className: props.className, ref: calendarRef })
+    })
+  );
 });
 WmCalendar.displayName = "WmCalendar";
-
-/**
- * The WmCalendar component provides an interactive calendar with event support, day/week/month views.
- *
- * - [Playground](https://react-components.wavemaker.ai/?path=/story/input-calendar--showcase)
- *
- * - [Docs](https://react-components.wavemaker.ai/?path=/story/input-calendar--docs)
- *
- * @param props - {@link WmCalendarProps}
- */
-// @ts-expect-error this is a valid component
-var _default = exports["default"] = (0, _withBaseWrapper.withBaseWrapper)(WmCalendar);
+var calendar_default = withBaseWrapper(WmCalendar);
+export {
+  WmCalendar,
+  calendar_default as default
+};