@mailstep/design-system 0.8.26-beta.1 → 0.8.26-beta.2

package/ui/packages/ui/Blocks/Popover/index.js

@@ -0,0 +1,30 @@
+import { styled as e } from "../../../../node_modules/@xstyled/styled-components/dist/index.js";
+import { require_jsx_runtime as t } from "../../../../node_modules/react/jsx-runtime.js";
+import { useClickOutside as n } from "../Modal/hooks/useClickOutside.js";
+import { Popper as r } from "../../../../node_modules/react-popper/lib/esm/Popper.js";
+import i from "../../Elements/Portal/index.js";
+import "react";
+//#region packages/ui/Blocks/Popover/index.tsx
+var a = t(), o = e.div`
+  z-index: 5;
+`, s = ({ placement: e, wrapper: t, children: s, onClose: c, parentRef: l }) => {
+	let u = n({
+		onClose: c,
+		parentRef: l
+	}), d = t || o;
+	return /* @__PURE__ */ (0, a.jsx)(i, { children: /* @__PURE__ */ (0, a.jsx)("div", {
+		ref: u,
+		children: /* @__PURE__ */ (0, a.jsx)(r, {
+			innerRef: u,
+			referenceElement: l.current,
+			placement: e,
+			children: ({ ref: e, style: t }) => /* @__PURE__ */ (0, a.jsx)(d, {
+				ref: e,
+				style: t,
+				children: s
+			})
+		})
+	}) });
+};
+//#endregion
+export { s as default };

package/ui/packages/ui/Blocks/Scheduler/Scheduler.js

@@ -0,0 +1,40 @@
+import { require_jsx_runtime as e } from "../../../../node_modules/react/jsx-runtime.js";
+import { require_lodash as t } from "../../../../node_modules/lodash/lodash.js";
+import { useToggleAndClose as n } from "../../hooks/useToggleAndClose.js";
+import { DateChanger as r } from "./components/DateChanger/index.js";
+import { Groups as i } from "./components/Groups/index.js";
+import { TimeSlots as a } from "./components/TimeSlots/index.js";
+import { useChangeDate as o } from "./hooks/useChangeDate.js";
+import { generateTimeArray as s } from "./utils/generateTimeArray.js";
+import { getClosestStep as c } from "./utils/getClosestStep.js";
+import { Block as l, Container as u } from "./styles.js";
+import { useMemo as d } from "react";
+//#region packages/ui/Blocks/Scheduler/Scheduler.tsx
+var f = t(), p = e(), m = s(), h = ({ groups: e, activeHours: t, data: s, handleSelectTimeSlot: h, handleReloadTimeSlots: g, handleTimeSlotClick: _, isLoading: v, timeSlotDefinitions: y }) => {
+	let b = d(() => (0, f.groupBy)(s, ({ groupId: e, from: t }) => `${e}-${c(t)}`), [s]), [x, S, C] = n(!1), { handlePrevDay: w, handleNextDay: T, handleChangeDate: E, date: D, isTodayDate: O } = o({
+		closeDatePicker: C,
+		handleReloadTimeSlots: g
+	});
+	return e?.length ? /* @__PURE__ */ (0, p.jsxs)(u, { children: [/* @__PURE__ */ (0, p.jsx)(r, {
+		isLoading: v,
+		isDatepickerOpen: x,
+		toggleDatepicker: S,
+		closeDatePicker: C,
+		handlePrevDay: w,
+		handleNextDay: T,
+		handleChangeDate: E,
+		date: D
+	}), /* @__PURE__ */ (0, p.jsxs)(l, { children: [/* @__PURE__ */ (0, p.jsx)(i, { groups: e }), /* @__PURE__ */ (0, p.jsx)(a, {
+		timeArray: m,
+		groups: e,
+		activeHours: t,
+		timeSlots: b,
+		handleSelectTimeSlot: v ? void 0 : h,
+		handleTimeSlotClick: v ? void 0 : _,
+		isTodayDate: O,
+		date: D,
+		timeSlotDefinitions: y
+	})] })] }) : null;
+};
+//#endregion
+export { h as Scheduler };

package/ui/packages/ui/Blocks/Scheduler/components/BookedTimeSlots/index.js

@@ -0,0 +1,33 @@
+import { __toESM as e } from "../../../../../../_virtual/_rolldown/runtime.js";
+import { x as t } from "../../../../../../node_modules/@xstyled/styled-components/dist/index.js";
+import { require_jsx_runtime as n } from "../../../../../../node_modules/react/jsx-runtime.js";
+import { require_get as r } from "../../../../../../node_modules/lodash/get.js";
+import { getMinutesFromTime as i } from "../../utils/getMinutesFromTime.js";
+import { convertDateToTime as a } from "../../utils/convertDateToTime.js";
+import { convertMinutesToDuration as o } from "../../utils/convertMinutesToDuration.js";
+import { Body as s, BookedTimeSlot as c, Header as l } from "./styles.js";
+//#region packages/ui/Blocks/Scheduler/components/BookedTimeSlots/index.tsx
+var u = /* @__PURE__ */ e(r(), 1), d = n(), f = ({ bookedTimeSlots: e, timeSlotDefinitions: n, handleTimeSlotClick: r, time: f }) => /* @__PURE__ */ (0, d.jsx)(d.Fragment, { children: e.map(({ id: e, from: p, to: m, ...h }) => {
+	let g = a(new Date(p)), _ = a(new Date(m)), v = i(g), y = i(_) - v, b = n?.count ? (0, u.default)(h, n?.count) : 0;
+	return /* @__PURE__ */ (0, d.jsxs)(c, {
+		startPoint: v - i(f) + 1,
+		heightInMinutes: y - 2,
+		onClick: r?.({
+			id: e,
+			from: p,
+			to: m,
+			...h
+		}),
+		children: [/* @__PURE__ */ (0, d.jsxs)(l, { children: [/* @__PURE__ */ (0, d.jsx)("div", { children: `${g} - ${_} (${o(y)})` }), /* @__PURE__ */ (0, d.jsxs)(t.div, {
+			display: "flex",
+			gap: "6px",
+			alignItems: "center",
+			children: [!!b && b, n?.icon]
+		})] }), /* @__PURE__ */ (0, d.jsx)(s, { children: n?.data?.map((e) => {
+			let t = (0, u.default)(h, e);
+			return /* @__PURE__ */ (0, d.jsx)("span", { children: Array.isArray(t) ? t.join(", ") : t }, `${e}-${f}`);
+		}) })]
+	}, e);
+}) });
+//#endregion
+export { f as BookedTimeSlots };

package/ui/packages/ui/Blocks/Scheduler/components/BookedTimeSlots/styles.js

@@ -0,0 +1,33 @@
+import { th as e } from "../../../../../../node_modules/@xstyled/system/dist/index.js";
+import { styled as t } from "../../../../../../node_modules/@xstyled/styled-components/dist/index.js";
+//#region packages/ui/Blocks/Scheduler/components/BookedTimeSlots/styles.ts
+var n = t.div`
+  position: absolute;
+  z-index: 1;
+  top: ${({ startPoint: e }) => `${e * 5}px`};
+  background-color: ${e.color("bgLightGray1")};
+  border-radius: 4px;
+  box-shadow: ${e.shadow("gridShadow")};
+  height: ${({ heightInMinutes: e }) => `${e * 5}px`};
+  border-left: 4px solid ${e.color("green60")};
+  padding: 10px;
+  margin-right: 10px;
+  margin-left: 6px; // -4px border
+  width: calc(100% - 16px);
+  cursor: pointer;
+  overflow-y: auto;
+  text-align: left;
+`, r = t.div`
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  height: fit-content;
+  align-items: center;
+`, i = t.div`
+  display: flex;
+  flex-direction: column;
+  margin-top: 6px;
+  gap: 6px;
+`;
+//#endregion
+export { i as Body, n as BookedTimeSlot, r as Header };

package/ui/packages/ui/Blocks/Scheduler/components/CurrentTimeMarker/hooks/useCurrentTime.js

@@ -0,0 +1,16 @@
+import { convertDateToTime as e } from "../../../utils/convertDateToTime.js";
+import { useEffect as t, useState as n } from "react";
+//#region packages/ui/Blocks/Scheduler/components/CurrentTimeMarker/hooks/useCurrentTime.ts
+var r = () => {
+	let [r, i] = n(/* @__PURE__ */ new Date());
+	return t(() => {
+		let e = setInterval(() => {
+			i(/* @__PURE__ */ new Date());
+		}, 6e4);
+		return () => {
+			clearInterval(e);
+		};
+	}, []), { time: e(r) };
+};
+//#endregion
+export { r as useCurrentTime };

package/ui/packages/ui/Blocks/Scheduler/components/CurrentTimeMarker/index.js

@@ -0,0 +1,14 @@
+import { require_jsx_runtime as e } from "../../../../../../node_modules/react/jsx-runtime.js";
+import { getMinutesFromTime as t } from "../../utils/getMinutesFromTime.js";
+import { useCurrentTime as n } from "./hooks/useCurrentTime.js";
+import { CurrentTime as r, CurrentTimeContainer as i, Line as a } from "./styles.js";
+//#region packages/ui/Blocks/Scheduler/components/CurrentTimeMarker/index.tsx
+var o = e(), s = () => {
+	let { time: e } = n();
+	return /* @__PURE__ */ (0, o.jsxs)(i, {
+		minutes: t(e),
+		children: [/* @__PURE__ */ (0, o.jsx)(r, { children: e }), /* @__PURE__ */ (0, o.jsx)(a, {})]
+	});
+};
+//#endregion
+export { s as CurrentTimeMarker };

package/ui/packages/ui/Blocks/Scheduler/components/CurrentTimeMarker/styles.js

@@ -0,0 +1,28 @@
+import { th as e } from "../../../../../../node_modules/@xstyled/system/dist/index.js";
+import { styled as t } from "../../../../../../node_modules/@xstyled/styled-components/dist/index.js";
+//#region packages/ui/Blocks/Scheduler/components/CurrentTimeMarker/styles.ts
+var n = t.div`
+  position: absolute;
+  top: ${({ minutes: e }) => `${e * 5 - 22 / 2}px`};
+  left: 0;
+  padding-left: 10px;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  height: ${22}px;
+  z-index: 1;
+`, r = t.div`
+  font-size: 10px;
+  color: white;
+  font-weight: 600;
+  background-color: ${e.color("red1")};
+  width: ${35}px;
+  padding: 5px;
+  border-radius: 14px;
+`, i = t.div`
+  background-color: ${e.color("red1")};
+  width: calc(100% - ${35}px);
+  height: 1px;
+`;
+//#endregion
+export { r as CurrentTime, n as CurrentTimeContainer, i as Line };

package/ui/packages/ui/Blocks/Scheduler/components/DateChanger/index.js

@@ -0,0 +1,48 @@
+import { x as e } from "../../../../../../node_modules/@xstyled/styled-components/dist/index.js";
+import { require_jsx_runtime as t } from "../../../../../../node_modules/react/jsx-runtime.js";
+import { ArrowDown as n } from "../../../../Elements/Icon/icons/ArrowDown.js";
+import "../../../../Elements/Icon/index.js";
+import r from "../../../../Elements/Spinner/Spinner.js";
+import { LanguageContext as i } from "../../../../ThemeProvider/ThemeProvider.js";
+import a from "../../../../Elements/DatePicker/index.js";
+import o from "../../../Popover/index.js";
+import { formatDate as s } from "../../utils/formatDate.js";
+import { ArrowContainer as c, DateChangerContainer as l } from "./styles.js";
+import { useContext as u, useRef as d } from "react";
+//#region packages/ui/Blocks/Scheduler/components/DateChanger/index.tsx
+var f = t(), p = ({ isLoading: t, date: p, handleChangeDate: m, closeDatePicker: h, handleNextDay: g, handlePrevDay: _, toggleDatepicker: v, isDatepickerOpen: y }) => {
+	let b = d(null), x = u(i);
+	return t ? /* @__PURE__ */ (0, f.jsx)(e.div, {
+		p: "6px 12px",
+		children: /* @__PURE__ */ (0, f.jsx)(r, { variant: "sm" })
+	}) : /* @__PURE__ */ (0, f.jsxs)(l, { children: [
+		/* @__PURE__ */ (0, f.jsx)(c, {
+			onClick: _,
+			rotate: 90,
+			children: /* @__PURE__ */ (0, f.jsx)(n, {})
+		}),
+		/* @__PURE__ */ (0, f.jsx)(e.span, {
+			ref: b,
+			onClick: v,
+			cursor: "pointer",
+			children: s(p, x)
+		}),
+		y && /* @__PURE__ */ (0, f.jsx)(o, {
+			parentRef: b,
+			onClose: h,
+			children: /* @__PURE__ */ (0, f.jsx)(a, {
+				value: p,
+				input: !1,
+				onChange: m,
+				isSecondDatePicker: !0
+			})
+		}),
+		/* @__PURE__ */ (0, f.jsx)(c, {
+			onClick: g,
+			rotate: -90,
+			children: /* @__PURE__ */ (0, f.jsx)(n, {})
+		})
+	] });
+};
+//#endregion
+export { p as DateChanger };

package/ui/packages/ui/Blocks/Scheduler/components/DateChanger/styles.js

@@ -0,0 +1,22 @@
+import { styled as e } from "../../../../../../node_modules/@xstyled/styled-components/dist/index.js";
+//#region packages/ui/Blocks/Scheduler/components/DateChanger/styles.ts
+var t = e.div`
+  display: flex;
+  margin-bottom: 24px;
+  margin-top: 12px;
+  width: fit-content;
+  align-items: center;
+  column-gap: 12px;
+  font-size: 16px;
+  font-weight: 500;
+`, n = e.div`
+  display: flex;
+  height: 15px;
+  width: 15px;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transform: ${({ rotate: e }) => `rotate(${e}deg)`};
+`;
+//#endregion
+export { n as ArrowContainer, t as DateChangerContainer };

package/ui/packages/ui/Blocks/Scheduler/components/Groups/index.js

@@ -0,0 +1,9 @@
+import { require_jsx_runtime as e } from "../../../../../../node_modules/react/jsx-runtime.js";
+import { Gap as t, GroupContainer as n, GroupItem as r } from "./styles.js";
+//#region packages/ui/Blocks/Scheduler/components/Groups/index.tsx
+var i = e(), a = ({ groups: e }) => /* @__PURE__ */ (0, i.jsxs)(n, { children: [/* @__PURE__ */ (0, i.jsx)(t, {}), e?.map((t, n) => /* @__PURE__ */ (0, i.jsx)(r, {
+	groupsCount: e?.length,
+	children: t.name
+}, t.id))] });
+//#endregion
+export { a as Groups };

package/ui/packages/ui/Blocks/Scheduler/components/Groups/styles.js

@@ -0,0 +1,30 @@
+import { th as e } from "../../../../../../node_modules/@xstyled/system/dist/index.js";
+import { styled as t } from "../../../../../../node_modules/@xstyled/styled-components/dist/index.js";
+//#region packages/ui/Blocks/Scheduler/components/Groups/styles.ts
+var n = t.div`
+  height: ${38}px;
+  display: flex;
+  border-bottom: 1px solid ${e.color("lightGray6")};
+  width: fit-content;
+`, r = t.div`
+  background-color: ${({ bg: t }) => t || e.color("bgLightGray")};
+  flex-shrink: 0;
+  min-width: 350px;
+  height: 100%;
+  font-size: 14px;
+  font-weight: 600;
+  padding: 10px;
+  border-right: 1px solid ${e.color("lightGray6")};
+
+  &:last-child {
+    border-right: none;
+  }
+`, i = t.div`
+  background-color: ${e.color("bgLightGray1")};
+  height: 100%;
+  width: ${53}px;
+  min-width: ${53}px;
+  border-right: 1px solid ${e.color("lightGray6")};
+`;
+//#endregion
+export { i as Gap, n as GroupContainer, r as GroupItem };

package/ui/packages/ui/Blocks/Scheduler/components/TimeSlots/hooks/useRangeSelection.js

@@ -0,0 +1,36 @@
+import { convertIndexToISOString as e } from "../../../utils/convertIndexToISOString.js";
+import { useCallback as t, useState as n } from "react";
+//#region packages/ui/Blocks/Scheduler/components/TimeSlots/hooks/useRangeSelection.ts
+var r = ({ handleSelectTimeSlot: r, date: i }) => {
+	let [a, o] = n(!1), [s, c] = n([]), [l, u] = n(null);
+	return {
+		handleMouseDown: t((e, t) => () => {
+			c([e]), o(!0), u(t);
+		}, []),
+		handleMouseOver: t((e) => () => {
+			a && c((t) => {
+				let n = t[0], r = t.at(-1);
+				return r && (r < e ? r + 1 !== e : r - 1 !== e) ? [e] : Array.from({ length: Math.abs(e - n) + 1 }, (t, r) => n < e ? n + r : n - r);
+			});
+		}, [a]),
+		handleMouseUp: t(() => {
+			if (o(!1), l && s?.length) {
+				let t = s[0], n = (s.at(-1) ?? 0) + 1;
+				r?.({
+					groupId: l,
+					from: e(t, i),
+					to: e(n, i)
+				});
+			}
+			u(null), c([]);
+		}, [
+			i,
+			r,
+			l,
+			s
+		]),
+		isSlotSelected: t((e, t) => t === l && s.includes(e), [s, l])
+	};
+};
+//#endregion
+export { r as useRangeSelection };

package/ui/packages/ui/Blocks/Scheduler/components/TimeSlots/index.js

@@ -0,0 +1,46 @@
+import { require_jsx_runtime as e } from "../../../../../../node_modules/react/jsx-runtime.js";
+import { isActiveTime as t } from "../../utils/isActiveTime.js";
+import { BookedTimeSlots as n } from "../BookedTimeSlots/index.js";
+import { CurrentTimeMarker as r } from "../CurrentTimeMarker/index.js";
+import { useRangeSelection as i } from "./hooks/useRangeSelection.js";
+import { useScroll as a } from "./hooks/useScroll.js";
+import { EmptyTimeSlot as o, TimeInterval as s, TimeRow as c, TimeSlotsContainer as l } from "./styles.js";
+//#region packages/ui/Blocks/Scheduler/components/TimeSlots/index.tsx
+var u = e(), d = ({ timeArray: e, groups: d, activeHours: f, timeSlots: p, handleSelectTimeSlot: m, handleTimeSlotClick: h, isTodayDate: g, date: _, timeSlotDefinitions: v }) => {
+	let { containerRef: y } = a(), { handleMouseUp: b, handleMouseDown: x, handleMouseOver: S, isSlotSelected: C } = i({
+		handleSelectTimeSlot: m,
+		date: _
+	});
+	return /* @__PURE__ */ (0, u.jsxs)(l, {
+		ref: y,
+		children: [e.map((e, r) => {
+			let i = t({
+				activeHours: f,
+				time: e
+			});
+			return /* @__PURE__ */ (0, u.jsxs)(c, {
+				disabled: !i,
+				"data-time": e,
+				children: [/* @__PURE__ */ (0, u.jsx)(s, { children: e }), d?.map((t) => {
+					let a = p?.[`${t.id}-${e}`] ?? [], s = !a.length && i;
+					return /* @__PURE__ */ (0, u.jsx)(o, {
+						groupsCount: d?.length,
+						activeTime: i,
+						isSlotSelected: s && C(r, t.id),
+						onMouseDown: s ? x(r, t.id) : void 0,
+						onMouseOver: s ? S(r) : void 0,
+						onMouseUp: s ? b : void 0,
+						children: /* @__PURE__ */ (0, u.jsx)(n, {
+							bookedTimeSlots: a,
+							timeSlotDefinitions: v,
+							time: e,
+							handleTimeSlotClick: h
+						})
+					}, t.id);
+				})]
+			}, e);
+		}), g && /* @__PURE__ */ (0, u.jsx)(r, {})]
+	});
+};
+//#endregion
+export { d as TimeSlots };

package/ui/packages/ui/Blocks/Scheduler/components/TimeSlots/styles.js

@@ -0,0 +1,49 @@
+import { th as e } from "../../../../../../node_modules/@xstyled/system/dist/index.js";
+import { styled as t } from "../../../../../../node_modules/@xstyled/styled-components/dist/index.js";
+//#region packages/ui/Blocks/Scheduler/components/TimeSlots/styles.ts
+var n = t.div`
+  position: relative;
+  overflow-y: auto;
+  flex-grow: 1;
+  width: fit-content;
+
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+  scroll-behavior: smooth;
+
+  &::-webkit-scrollbar {
+    display: none;
+  }
+`, r = t.div`
+  background-color: ${({ disabled: t }) => t ? e.color("lightGray7") : "white"};
+  display: flex;
+  width: fit-content;
+  border-bottom: 1px solid ${e.color("lightGray6")};
+`, i = t.div`
+  height: ${75}px;
+  flex-shrink: 0;
+  min-width: 350px;
+  box-sizing: border-box;
+  position: relative;
+  background-color: ${({ isSlotSelected: t }) => t ? e.color("blue20") : ""};
+  cursor: ${({ isSlotSelected: e, activeTime: t }) => e || !t ? "default" : "pointer"};
+  border-right: 1px solid ${e.color("lightGray6")};
+
+  &:last-child {
+    border-right: none;
+  }
+
+  &:hover {
+    background-color: ${({ isSlotSelected: t, activeTime: n }) => !t && n ? e.color("blue10") : ""};
+  }
+`, a = t.div`
+  font-size: 12px;
+  font-weight: 500;
+  height: ${75}px;
+  width: ${53}px;
+  border-right: 1px solid ${e.color("lightGray6")};
+  padding: 10px;
+  min-width: ${53}px;
+`;
+//#endregion
+export { i as EmptyTimeSlot, a as TimeInterval, r as TimeRow, n as TimeSlotsContainer };

package/ui/packages/ui/Blocks/Scheduler/hooks/useChangeDate.js

@@ -0,0 +1,26 @@
+import { isToday as e } from "../utils/isToday.js";
+import { useCallback as t, useEffect as n, useState as r } from "react";
+//#region packages/ui/Blocks/Scheduler/hooks/useChangeDate.ts
+var i = ({ closeDatePicker: i, handleReloadTimeSlots: a }) => {
+	let [o, s] = r(/* @__PURE__ */ new Date()), c = t(() => {
+		let e = new Date(o);
+		e.setDate(o.getDate() - 1), s(e);
+	}, [o]), l = t(() => {
+		let e = new Date(o);
+		e.setDate(o.getDate() + 1), s(e);
+	}, [o]), u = t((e) => {
+		let t = new Date(e);
+		t && s(t), i();
+	}, []), d = e(o);
+	return n(() => {
+		a && a(o).catch(console.error);
+	}, [o]), {
+		handlePrevDay: c,
+		handleNextDay: l,
+		handleChangeDate: u,
+		isTodayDate: d,
+		date: o
+	};
+};
+//#endregion
+export { i as useChangeDate };

package/ui/packages/ui/Blocks/Scheduler/index.js

@@ -0,0 +1 @@
+import "./Scheduler.js";

package/ui/packages/ui/Blocks/Scheduler/styles.js

@@ -0,0 +1,23 @@
+import { th as e } from "../../../../node_modules/@xstyled/system/dist/index.js";
+import { styled as t } from "../../../../node_modules/@xstyled/styled-components/dist/index.js";
+//#region packages/ui/Blocks/Scheduler/styles.ts
+var n = t.div`
+  background-color: white;
+  color: ${e.color("typoPrimary")};
+  overflow-x: auto;
+  text-align: center;
+  display: flex;
+  flex-direction: column;
+  border: 1px solid ${e.color("lightGray6")};
+  user-select: none;
+  width: fit-content;
+  height: 100%;
+}
+`, r = t.div`
+  display: flex;
+  flex-direction: column;
+  overflow-y: hidden;
+  width: 100%;
+`;
+//#endregion
+export { n as Block, r as Container };

package/ui/packages/ui/Blocks/Scheduler/utils/getClosestStep.js

@@ -0,0 +1,8 @@
+import { getMinutesFromString as e } from "./getMinutesFromString.js";
+//#region packages/ui/Blocks/Scheduler/utils/getClosestStep.ts
+var t = (t) => {
+	let n = e(t), r = Math.round(n / 15) * 15, i = Math.floor(r / 60), a = r % 60;
+	return `${String(i).padStart(2, "0")}:${String(a).padStart(2, "0")}`;
+};
+//#endregion
+export { t as getClosestStep };

package/ui/packages/ui/Blocks/Scheduler/utils/getMinutesFromString.js

@@ -0,0 +1,6 @@
+import { getMinutesFromTime as e } from "./getMinutesFromTime.js";
+import { convertDateToTime as t } from "./convertDateToTime.js";
+//#region packages/ui/Blocks/Scheduler/utils/getMinutesFromString.ts
+var n = (n) => e(t(new Date(n)));
+//#endregion
+export { n as getMinutesFromString };

package/ui/packages/ui/Blocks/Scheduler/utils/isActiveTime.js

@@ -0,0 +1,9 @@
+import { getMinutesFromTime as e } from "./getMinutesFromTime.js";
+//#region packages/ui/Blocks/Scheduler/utils/isActiveTime.ts
+var t = ({ activeHours: t, time: n }) => {
+	if (!t) return !0;
+	let r = e(t.start), i = e(t.end), a = e(n);
+	return a >= r && a <= i;
+};
+//#endregion
+export { t as isActiveTime };

package/ui/packages/ui/Blocks/SideMenu/MenuItem.js

@@ -0,0 +1,88 @@
+import { require_jsx_runtime as e } from "../../../../node_modules/react/jsx-runtime.js";
+import t from "../../Elements/Icon/Icon.js";
+import { matchPath as n } from "../../../../node_modules/react-router/esm/react-router.js";
+import { Paragraph3 as r, Paragraph5 as i } from "../../Elements/Typography/Typography.js";
+import { ItemDropdownArrow as a, ItemIcon as o, ItemLabel as s, ItemLinkWrap as c, ItemsSeparator as l, MenuItemContainer as u, OverflowWithEllipsis as d, SubItemsWrap as f } from "./styles.js";
+import p from "./components/SubitemTooltip.js";
+import { useLeftMenuContext as m } from "./context/useLeftMenuContext.js";
+import h from "./hooks/useOutsideHover.js";
+import { memo as g, useCallback as _, useMemo as v, useRef as y } from "react";
+//#region packages/ui/Blocks/SideMenu/MenuItem.tsx
+var b = e(), x = /\?$/, S = ({ icon: e, title: g, link: C = "", items: w, id: T, isSubitem: E, isCompact: D, lightMode: O = !1, separator: k = !1, isLeftMenuOpen: A, onCloseLeftMenu: j }) => {
+	let M = v(() => w && w?.length > 0, [w]), { expandedItem: N, expandItem: P } = m(), F = N === T, I = _(() => {
+		M && P(F ? null : T ?? null), !M && !O && j && j();
+	}, [
+		M,
+		P,
+		F,
+		T,
+		O,
+		j
+	]), L = v(() => C.startsWith("https://") ? {
+		to: { pathname: C },
+		target: "_blank"
+	} : { to: C }, [C]), R = D ? i : r, z = F && !D, B = y(null), { ref: V, isHovering: H, handleMouseOver: U } = h({ parentRef: B }), W = E ? "nestedlevel" : "toplevel";
+	F && (W += " expanded"), k && (W += " separator");
+	let G = _((e, t) => {
+		let r = !!w?.find((e) => e.link?.replace(x, "") === t.pathname), i = !!n(t.pathname, { path: e?.path }), a = t.pathname.startsWith(C.slice(0, -1)) && t.pathname.includes("/settings/");
+		return i || r || a;
+	}, [w, C]);
+	return /* @__PURE__ */ (0, b.jsxs)(b.Fragment, { children: [
+		k && /* @__PURE__ */ (0, b.jsx)(l, {}),
+		/* @__PURE__ */ (0, b.jsxs)(u, {
+			ref: B,
+			$isCompact: D,
+			$lightMode: O,
+			hasChildren: M,
+			isHovering: H,
+			children: [/* @__PURE__ */ (0, b.jsxs)(c, {
+				...L,
+				onMouseOver: U,
+				exact: !0,
+				activeClassName: M ? "selected" : void 0,
+				onClick: I,
+				$isCompact: D,
+				className: W,
+				isActive: G,
+				$lightMode: O,
+				children: [/* @__PURE__ */ (0, b.jsxs)(s, {
+					$isCompact: D,
+					isSubitem: E,
+					children: [!E && e && /* @__PURE__ */ (0, b.jsx)(o, {
+						className: "mainIcon",
+						$isCompact: D,
+						children: typeof e == "string" ? /* @__PURE__ */ (0, b.jsx)(t, {
+							icon: e,
+							fill: "none"
+						}) : e
+					}), /* @__PURE__ */ (0, b.jsx)(R, {
+						variant: "semiBold",
+						mt: 0,
+						mb: 0,
+						textAlign: D ? "center" : "left",
+						children: /* @__PURE__ */ (0, b.jsx)(d, { children: g })
+					})]
+				}), !D && M && /* @__PURE__ */ (0, b.jsx)(a, {
+					icon: "goDown",
+					$lightMode: O
+				})]
+			}), H && D && M && !z && /* @__PURE__ */ (0, b.jsx)(p, {
+				items: w,
+				childRef: V,
+				parentRef: B,
+				isLeftMenuOpen: A,
+				onCloseLeftMenu: j,
+				lightMode: O
+			})]
+		}),
+		M && z && /* @__PURE__ */ (0, b.jsx)(f, { children: w?.map((e, t) => /* @__PURE__ */ (0, b.jsx)(S, {
+			isCompact: D,
+			lightMode: O,
+			...e,
+			onCloseLeftMenu: j,
+			isSubitem: !0
+		}, `${t}`)) })
+	] });
+}, C = g(S);
+//#endregion
+export { C as default };

package/ui/packages/ui/Blocks/SideMenu/SideMenu.js

@@ -0,0 +1,37 @@
+import { require_jsx_runtime as e } from "../../../../node_modules/react/jsx-runtime.js";
+import { useClickOutside as t } from "../Modal/hooks/useClickOutside.js";
+import n from "./components/Footer.js";
+import { LeftMenuProvider as r } from "./context/LeftMenuContext.js";
+import { BodyWrap as i, Container as a, Overlay as o, ScrollWrap as s, TopLevelWrap as c } from "./styles.js";
+import l from "./MenuItem.js";
+import "react";
+//#region packages/ui/Blocks/SideMenu/SideMenu.tsx
+var u = e(), d = ({ menuItems: e, isCompact: d, setIsCompact: f, isLeftMenuOpen: p, onCloseLeftMenu: m, variant: h = "dark", children: g }) => {
+	let _ = h === "light";
+	return /* @__PURE__ */ (0, u.jsx)(r, { children: /* @__PURE__ */ (0, u.jsxs)(a, {
+		isLeftMenuOpen: p,
+		children: [/* @__PURE__ */ (0, u.jsxs)(c, {
+			isCompact: d,
+			isLeftMenuOpen: p,
+			ref: t({ onClose: m }),
+			lightMode: _,
+			children: [/* @__PURE__ */ (0, u.jsx)(s, { children: /* @__PURE__ */ (0, u.jsxs)(i, {
+				isCompact: d,
+				children: [e.map((e, t) => /* @__PURE__ */ (0, u.jsx)(l, {
+					isCompact: d,
+					isLeftMenuOpen: p,
+					onCloseLeftMenu: m,
+					lightMode: _,
+					separator: !!e.separator,
+					...e
+				}, `${e.id ?? e.title}-${t}`)), g]
+			}) }), /* @__PURE__ */ (0, u.jsx)(n, {
+				isCompact: d,
+				setIsCompact: f,
+				lightMode: _
+			})]
+		}), /* @__PURE__ */ (0, u.jsx)(o, {})]
+	}) });
+};
+//#endregion
+export { d as default };