@mailstep/design-system 0.8.26-beta.7 → 0.8.27-beta.0

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

@@ -1,76 +1,52 @@
-function _tagged_template_literal(strings, raw) {
-    if (!raw) {
-        raw = strings.slice(0);
-    }
-    return Object.freeze(Object.defineProperties(strings, {
-        raw: {
-            value: Object.freeze(raw)
-        }
-    }));
-}
-function _templateObject() {
-    var data = _tagged_template_literal([
-        "\n  position: relative;\n  overflow-y: auto;\n  flex-grow: 1;\n  width: fit-content;\n\n  -ms-overflow-style: none;\n  scrollbar-width: none;\n  scroll-behavior: smooth;\n\n  &::-webkit-scrollbar {\n    display: none;\n  }\n"
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n  background-color: ",
-        ";\n  display: flex;\n  width: fit-content;\n  border-bottom: 1px solid ",
-        ";\n"
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject2() {
-    var data = _tagged_template_literal([
-        "\n  height: ",
-        "px;\n  flex-shrink: 0;\n  min-width: 350px;\n  box-sizing: border-box;\n  position: relative;\n  background-color: ",
-        ";\n  cursor: ",
-        ";\n  border-right: 1px solid ",
-        ";\n\n  &:last-child {\n    border-right: none;\n  }\n\n  &:hover {\n    background-color: ",
-        ";\n  }\n"
-    ]);
-    _templateObject2 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject3() {
-    var data = _tagged_template_literal([
-        "\n  font-size: 12px;\n  font-weight: 500;\n  height: ",
-        "px;\n  width: ",
-        "px;\n  border-right: 1px solid ",
-        ";\n  padding: 10px;\n  min-width: ",
-        "px;\n"
-    ]);
-    _templateObject3 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-import { minuteHeight, stepInMinutes, timeIntervalWidth } from "../../utils/constants";
-import styled, { th } from "@xstyled/styled-components";
-var TimeSlotsContainer = styled.div(_templateObject());
-var TimeRow = styled.div(_templateObject1(), function(param) {
-    var disabled = param.disabled;
-    return disabled ? th.color("lightGray7") : "white";
-}, th.color("lightGray6"));
-var EmptyTimeSlot = styled.div(_templateObject2(), minuteHeight * stepInMinutes, function(param) {
-    var isSlotSelected = param.isSlotSelected;
-    return isSlotSelected ? th.color("blue20") : "";
-}, function(param) {
-    var isSlotSelected = param.isSlotSelected, activeTime = param.activeTime;
-    return isSlotSelected || !activeTime ? "default" : "pointer";
-}, th.color("lightGray6"), function(param) {
-    var isSlotSelected = param.isSlotSelected, activeTime = param.activeTime;
-    return !isSlotSelected && activeTime ? th.color("blue10") : "";
-});
-var TimeInterval = styled.div(_templateObject3(), minuteHeight * stepInMinutes, timeIntervalWidth, th.color("lightGray6"), timeIntervalWidth);
+import "../../utils/constants.js";
+import styled$1, { th } from "@xstyled/styled-components";
+//#region packages/ui/Blocks/Scheduler/components/TimeSlots/styles.ts
+const TimeSlotsContainer = styled$1.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;
+  }
+`;
+const TimeRow = styled$1.div`
+  background-color: ${({ disabled }) => disabled ? th.color("lightGray7") : "white"};
+  display: flex;
+  width: fit-content;
+  border-bottom: 1px solid ${th.color("lightGray6")};
+`;
+const EmptyTimeSlot = styled$1.div`
+  height: ${75}px;
+  flex-shrink: 0;
+  min-width: 350px;
+  box-sizing: border-box;
+  position: relative;
+  background-color: ${({ isSlotSelected }) => isSlotSelected ? th.color("blue20") : ""};
+  cursor: ${({ isSlotSelected, activeTime }) => isSlotSelected || !activeTime ? "default" : "pointer"};
+  border-right: 1px solid ${th.color("lightGray6")};
+
+  &:last-child {
+    border-right: none;
+  }
+
+  &:hover {
+    background-color: ${({ isSlotSelected, activeTime }) => !isSlotSelected && activeTime ? th.color("blue10") : ""};
+  }
+`;
+const TimeInterval = styled$1.div`
+  font-size: 12px;
+  font-weight: 500;
+  height: ${75}px;
+  width: ${53}px;
+  border-right: 1px solid ${th.color("lightGray6")};
+  padding: 10px;
+  min-width: ${53}px;
+`;
+//#endregion
 export { EmptyTimeSlot, TimeInterval, TimeRow, TimeSlotsContainer };

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

@@ -1,86 +1,35 @@
-function _array_like_to_array(arr, len) {
-    if (len == null || len > arr.length) len = arr.length;
-    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
-    return arr2;
-}
-function _array_with_holes(arr) {
-    if (Array.isArray(arr)) return arr;
-}
-function _iterable_to_array_limit(arr, i) {
-    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-    if (_i == null) return;
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-    var _s, _e;
-    try {
-        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
-            _arr.push(_s.value);
-            if (i && _arr.length === i) break;
-        }
-    } catch (err) {
-        _d = true;
-        _e = err;
-    } finally{
-        try {
-            if (!_n && _i["return"] != null) _i["return"]();
-        } finally{
-            if (_d) throw _e;
-        }
-    }
-    return _arr;
-}
-function _non_iterable_rest() {
-    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-function _sliced_to_array(arr, i) {
-    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
-}
-function _unsupported_iterable_to_array(o, minLen) {
-    if (!o) return;
-    if (typeof o === "string") return _array_like_to_array(o, minLen);
-    var n = Object.prototype.toString.call(o).slice(8, -1);
-    if (n === "Object" && o.constructor) n = o.constructor.name;
-    if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
-}
+import { isToday } from "../utils/isToday.js";
 import { useCallback, useEffect, useState } from "react";
-import { isToday } from "../utils/isToday";
-var useChangeDate = function useChangeDate(param) {
-    var closeDatePicker = param.closeDatePicker, handleReloadTimeSlots = param.handleReloadTimeSlots;
-    var _useState = _sliced_to_array(useState(/* @__PURE__ */ new Date()), 2), date = _useState[0], setDate = _useState[1];
-    var handlePrevDay = useCallback(function() {
-        var newDate = new Date(date);
-        newDate.setDate(date.getDate() - 1);
-        setDate(newDate);
-    }, [
-        date
-    ]);
-    var handleNextDay = useCallback(function() {
-        var newDate = new Date(date);
-        newDate.setDate(date.getDate() + 1);
-        setDate(newDate);
-    }, [
-        date
-    ]);
-    var handleChangeDate = useCallback(function(dateValue) {
-        var date2 = new Date(dateValue);
-        date2 && setDate(date2);
-        closeDatePicker();
-    }, []);
-    var isTodayDate = isToday(date);
-    useEffect(function() {
-        if (!handleReloadTimeSlots) return;
-        handleReloadTimeSlots(date).catch(console.error);
-    }, [
-        date
-    ]);
-    return {
-        handlePrevDay: handlePrevDay,
-        handleNextDay: handleNextDay,
-        handleChangeDate: handleChangeDate,
-        isTodayDate: isTodayDate,
-        date: date
-    };
+//#region packages/ui/Blocks/Scheduler/hooks/useChangeDate.ts
+const useChangeDate = ({ closeDatePicker, handleReloadTimeSlots }) => {
+	const [date, setDate] = useState(/* @__PURE__ */ new Date());
+	const handlePrevDay = useCallback(() => {
+		const newDate = new Date(date);
+		newDate.setDate(date.getDate() - 1);
+		setDate(newDate);
+	}, [date]);
+	const handleNextDay = useCallback(() => {
+		const newDate = new Date(date);
+		newDate.setDate(date.getDate() + 1);
+		setDate(newDate);
+	}, [date]);
+	const handleChangeDate = useCallback((dateValue) => {
+		const date = new Date(dateValue);
+		date && setDate(date);
+		closeDatePicker();
+	}, []);
+	const isTodayDate = isToday(date);
+	useEffect(() => {
+		if (!handleReloadTimeSlots) return;
+		handleReloadTimeSlots(date).catch(console.error);
+	}, [date]);
+	return {
+		handlePrevDay,
+		handleNextDay,
+		handleChangeDate,
+		isTodayDate,
+		date
+	};
 };
+//#endregion
 export { useChangeDate };

package/ui/Blocks/Scheduler/index.js

@@ -1,2 +1,2 @@
-import { Scheduler } from "./Scheduler";
+import { Scheduler } from "./Scheduler.js";
 export { Scheduler as default };

package/ui/Blocks/Scheduler/styles.js

@@ -1,34 +1,23 @@
-function _tagged_template_literal(strings, raw) {
-    if (!raw) {
-        raw = strings.slice(0);
-    }
-    return Object.freeze(Object.defineProperties(strings, {
-        raw: {
-            value: Object.freeze(raw)
-        }
-    }));
+import styled$1, { th } from "@xstyled/styled-components";
+//#region packages/ui/Blocks/Scheduler/styles.ts
+const Block = styled$1.div`
+  background-color: white;
+  color: ${th.color("typoPrimary")};
+  overflow-x: auto;
+  text-align: center;
+  display: flex;
+  flex-direction: column;
+  border: 1px solid ${th.color("lightGray6")};
+  user-select: none;
+  width: fit-content;
+  height: 100%;
 }
-function _templateObject() {
-    var data = _tagged_template_literal([
-        "\n  background-color: white;\n  color: ",
-        ";\n  overflow-x: auto;\n  text-align: center;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid ",
-        ";\n  user-select: none;\n  width: fit-content;\n  height: 100%;\n}\n"
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n  display: flex;\n  flex-direction: column;\n  overflow-y: hidden;\n  width: 100%;\n"
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-import styled, { th } from "@xstyled/styled-components";
-var Block = styled.div(_templateObject(), th.color("typoPrimary"), th.color("lightGray6"));
-var Container = styled.div(_templateObject1());
+`;
+const Container = styled$1.div`
+  display: flex;
+  flex-direction: column;
+  overflow-y: hidden;
+  width: 100%;
+`;
+//#endregion
 export { Block, Container };

package/ui/Blocks/Scheduler/types.js

@@ -0,0 +1 @@
+export {};

package/ui/Blocks/Scheduler/utils/constants.js

@@ -1,7 +1,9 @@
-var groupsHeight = 38;
-var timeIntervalWidth = 53;
-var minuteHeight = 5;
-var stepInMinutes = 15;
-var currentTimeHeight = 22;
-var currentTimeWidth = 35;
+//#region packages/ui/Blocks/Scheduler/utils/constants.ts
+const groupsHeight = 38;
+const timeIntervalWidth = 53;
+const minuteHeight = 5;
+const stepInMinutes = 15;
+const currentTimeHeight = 22;
+const currentTimeWidth = 35;
+//#endregion
 export { currentTimeHeight, currentTimeWidth, groupsHeight, minuteHeight, stepInMinutes, timeIntervalWidth };

package/ui/Blocks/Scheduler/utils/convertDateToTime.js

@@ -1,6 +1,6 @@
-var convertDateToTime = function convertDateToTime(date) {
-    var hours = String(date.getHours()).padStart(2, "0");
-    var minutes = String(date.getMinutes()).padStart(2, "0");
-    return "".concat(hours, ":").concat(minutes);
+//#region packages/ui/Blocks/Scheduler/utils/convertDateToTime.ts
+const convertDateToTime = (date) => {
+	return `${String(date.getHours()).padStart(2, "0")}:${String(date.getMinutes()).padStart(2, "0")}`;
 };
+//#endregion
 export { convertDateToTime };

package/ui/Blocks/Scheduler/utils/convertIndexToISOString.js

@@ -1,9 +1,11 @@
-import { stepInMinutes } from "./constants";
-var convertIndexToISOString = function convertIndexToISOString(index, date) {
-    var totalMinutes = stepInMinutes * index;
-    var hours = Math.floor(totalMinutes / 60);
-    var minutes = totalMinutes % 60;
-    date.setHours(hours, minutes, 0, 0);
-    return date.toISOString();
+import "./constants.js";
+//#region packages/ui/Blocks/Scheduler/utils/convertIndexToISOString.ts
+const convertIndexToISOString = (index, date) => {
+	const totalMinutes = 15 * index;
+	const hours = Math.floor(totalMinutes / 60);
+	const minutes = totalMinutes % 60;
+	date.setHours(hours, minutes, 0, 0);
+	return date.toISOString();
 };
+//#endregion
 export { convertIndexToISOString };

package/ui/Blocks/Scheduler/utils/convertMinutesToDuration.js

@@ -1,12 +1,10 @@
-var convertMinutesToDuration = function convertMinutesToDuration(minutes) {
-    var hours = Math.floor(minutes / 60);
-    var minutesLeft = minutes % 60;
-    if (!hours) {
-        return "".concat(minutesLeft, " min");
-    }
-    if (!minutesLeft) {
-        return "".concat(hours, "h");
-    }
-    return "".concat(hours, "h ").concat(minutesLeft, "m");
+//#region packages/ui/Blocks/Scheduler/utils/convertMinutesToDuration.ts
+const convertMinutesToDuration = (minutes) => {
+	const hours = Math.floor(minutes / 60);
+	const minutesLeft = minutes % 60;
+	if (!hours) return `${minutesLeft} min`;
+	if (!minutesLeft) return `${hours}h`;
+	return `${hours}h ${minutesLeft}m`;
 };
+//#endregion
 export { convertMinutesToDuration };

package/ui/Blocks/Scheduler/utils/formatDate.js

@@ -1,9 +1,8 @@
-var formatDate = function formatDate(date) {
-    var locale = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "en-GB";
-    return date.toLocaleDateString(locale, {
-        day: "2-digit",
-        month: "long",
-        year: "numeric"
-    });
-};
+//#region packages/ui/Blocks/Scheduler/utils/formatDate.ts
+const formatDate = (date, locale = "en-GB") => date.toLocaleDateString(locale, {
+	day: "2-digit",
+	month: "long",
+	year: "numeric"
+});
+//#endregion
 export { formatDate };

package/ui/Blocks/Scheduler/utils/generateTimeArray.js

@@ -1,17 +1,19 @@
-import { stepInMinutes } from "./constants";
-var generateTimeArray = function generateTimeArray() {
-    var times = [];
-    var hours = 0;
-    var minutes = 0;
-    while(hours < 24 || hours === 24 && minutes === 0){
-        var time = "".concat(String(hours).padStart(2, "0"), ":").concat(String(minutes).padStart(2, "0"));
-        times.push(time);
-        minutes += stepInMinutes;
-        if (minutes === 60) {
-            minutes = 0;
-            hours += 1;
-        }
-    }
-    return times;
+import "./constants.js";
+//#region packages/ui/Blocks/Scheduler/utils/generateTimeArray.ts
+const generateTimeArray = () => {
+	const times = [];
+	let hours = 0;
+	let minutes = 0;
+	while (hours < 24 || hours === 24 && minutes === 0) {
+		const time = `${String(hours).padStart(2, "0")}:${String(minutes).padStart(2, "0")}`;
+		times.push(time);
+		minutes += 15;
+		if (minutes === 60) {
+			minutes = 0;
+			hours += 1;
+		}
+	}
+	return times;
 };
+//#endregion
 export { generateTimeArray };

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

@@ -1,10 +1,12 @@
-import { stepInMinutes } from "./constants";
-import { getMinutesFromString } from "./getMinutesFromString";
-var getClosestStep = function getClosestStep(date) {
-    var totalMinutes = getMinutesFromString(date);
-    var closestStep = Math.round(totalMinutes / stepInMinutes) * stepInMinutes;
-    var hours = Math.floor(closestStep / 60);
-    var minutes = closestStep % 60;
-    return "".concat(String(hours).padStart(2, "0"), ":").concat(String(minutes).padStart(2, "0"));
+import "./constants.js";
+import { getMinutesFromString } from "./getMinutesFromString.js";
+//#region packages/ui/Blocks/Scheduler/utils/getClosestStep.ts
+const getClosestStep = (date) => {
+	const totalMinutes = getMinutesFromString(date);
+	const closestStep = Math.round(totalMinutes / 15) * 15;
+	const hours = Math.floor(closestStep / 60);
+	const minutes = closestStep % 60;
+	return `${String(hours).padStart(2, "0")}:${String(minutes).padStart(2, "0")}`;
 };
+//#endregion
 export { getClosestStep };

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

@@ -1,6 +1,6 @@
-import { convertDateToTime } from "./convertDateToTime";
-import { getMinutesFromTime } from "./getMinutesFromTime";
-var getMinutesFromString = function getMinutesFromString(date) {
-    return getMinutesFromTime(convertDateToTime(new Date(date)));
-};
+import { getMinutesFromTime } from "./getMinutesFromTime.js";
+import { convertDateToTime } from "./convertDateToTime.js";
+//#region packages/ui/Blocks/Scheduler/utils/getMinutesFromString.ts
+const getMinutesFromString = (date) => getMinutesFromTime(convertDateToTime(new Date(date)));
+//#endregion
 export { getMinutesFromString };

package/ui/Blocks/Scheduler/utils/getMinutesFromTime.js

@@ -1,51 +1,7 @@
-function _array_like_to_array(arr, len) {
-    if (len == null || len > arr.length) len = arr.length;
-    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
-    return arr2;
-}
-function _array_with_holes(arr) {
-    if (Array.isArray(arr)) return arr;
-}
-function _iterable_to_array_limit(arr, i) {
-    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-    if (_i == null) return;
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-    var _s, _e;
-    try {
-        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
-            _arr.push(_s.value);
-            if (i && _arr.length === i) break;
-        }
-    } catch (err) {
-        _d = true;
-        _e = err;
-    } finally{
-        try {
-            if (!_n && _i["return"] != null) _i["return"]();
-        } finally{
-            if (_d) throw _e;
-        }
-    }
-    return _arr;
-}
-function _non_iterable_rest() {
-    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-function _sliced_to_array(arr, i) {
-    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
-}
-function _unsupported_iterable_to_array(o, minLen) {
-    if (!o) return;
-    if (typeof o === "string") return _array_like_to_array(o, minLen);
-    var n = Object.prototype.toString.call(o).slice(8, -1);
-    if (n === "Object" && o.constructor) n = o.constructor.name;
-    if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
-}
-var getMinutesFromTime = function getMinutesFromTime(time) {
-    var _time_split_map = _sliced_to_array(time.split(":").map(Number), 2), hours = _time_split_map[0], minutes = _time_split_map[1];
-    return hours * 60 + minutes;
+//#region packages/ui/Blocks/Scheduler/utils/getMinutesFromTime.ts
+const getMinutesFromTime = (time) => {
+	const [hours, minutes] = time.split(":").map(Number);
+	return hours * 60 + minutes;
 };
+//#endregion
 export { getMinutesFromTime };

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

@@ -1,10 +1,11 @@
-import { getMinutesFromTime } from "./getMinutesFromTime";
-var isActiveTime = function isActiveTime(param) {
-    var activeHours = param.activeHours, time = param.time;
-    if (!activeHours) return true;
-    var startMinutes = getMinutesFromTime(activeHours.start);
-    var endMinutes = getMinutesFromTime(activeHours.end);
-    var timeInMinutes = getMinutesFromTime(time);
-    return timeInMinutes >= startMinutes && timeInMinutes <= endMinutes;
+import { getMinutesFromTime } from "./getMinutesFromTime.js";
+//#region packages/ui/Blocks/Scheduler/utils/isActiveTime.ts
+const isActiveTime = ({ activeHours, time }) => {
+	if (!activeHours) return true;
+	const startMinutes = getMinutesFromTime(activeHours.start);
+	const endMinutes = getMinutesFromTime(activeHours.end);
+	const timeInMinutes = getMinutesFromTime(time);
+	return timeInMinutes >= startMinutes && timeInMinutes <= endMinutes;
 };
+//#endregion
 export { isActiveTime };

package/ui/Blocks/Scheduler/utils/isToday.js

@@ -1,5 +1,7 @@
-var isToday = function isToday(date) {
-    var today = /* @__PURE__ */ new Date();
-    return date.getDate() === today.getDate() && date.getMonth() === today.getMonth() && date.getFullYear() === today.getFullYear();
+//#region packages/ui/Blocks/Scheduler/utils/isToday.ts
+const isToday = (date) => {
+	const today = /* @__PURE__ */ new Date();
+	return date.getDate() === today.getDate() && date.getMonth() === today.getMonth() && date.getFullYear() === today.getFullYear();
 };
+//#endregion
 export { isToday };