@mailstep/design-system 0.8.26-beta.5 → 0.8.26

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

@@ -1,86 +0,0 @@
-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 { 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
-    };
-};
-export { useChangeDate };

package/ui/Blocks/Scheduler/index.js

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

package/ui/Blocks/Scheduler/styles.js

@@ -1,34 +0,0 @@
-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  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());
-export { Block, Container };

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

@@ -1,7 +0,0 @@
-var groupsHeight = 38;
-var timeIntervalWidth = 53;
-var minuteHeight = 5;
-var stepInMinutes = 15;
-var currentTimeHeight = 22;
-var currentTimeWidth = 35;
-export { currentTimeHeight, currentTimeWidth, groupsHeight, minuteHeight, stepInMinutes, timeIntervalWidth };

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

@@ -1,6 +0,0 @@
-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);
-};
-export { convertDateToTime };

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

@@ -1,9 +0,0 @@
-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();
-};
-export { convertIndexToISOString };

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

@@ -1,12 +0,0 @@
-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");
-};
-export { convertMinutesToDuration };

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

@@ -1,9 +0,0 @@
-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"
-    });
-};
-export { formatDate };

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

@@ -1,17 +0,0 @@
-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;
-};
-export { generateTimeArray };

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

@@ -1,10 +0,0 @@
-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"));
-};
-export { getClosestStep };

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

@@ -1,6 +0,0 @@
-import { convertDateToTime } from "./convertDateToTime";
-import { getMinutesFromTime } from "./getMinutesFromTime";
-var getMinutesFromString = function getMinutesFromString(date) {
-    return getMinutesFromTime(convertDateToTime(new Date(date)));
-};
-export { getMinutesFromString };

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

@@ -1,51 +0,0 @@
-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;
-};
-export { getMinutesFromTime };

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

@@ -1,10 +0,0 @@
-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;
-};
-export { isActiveTime };

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

@@ -1,5 +0,0 @@
-var isToday = function isToday(date) {
-    var today = /* @__PURE__ */ new Date();
-    return date.getDate() === today.getDate() && date.getMonth() === today.getMonth() && date.getFullYear() === today.getFullYear();
-};
-export { isToday };

package/ui/Blocks/SideMenu/MenuItem.js

@@ -1,196 +0,0 @@
-function _define_property(obj, key, value) {
-    if (key in obj) {
-        Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-        });
-    } else {
-        obj[key] = value;
-    }
-    return obj;
-}
-function _object_spread(target) {
-    for(var i = 1; i < arguments.length; i++){
-        var source = arguments[i] != null ? arguments[i] : {};
-        var ownKeys = Object.keys(source);
-        if (typeof Object.getOwnPropertySymbols === "function") {
-            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-            }));
-        }
-        ownKeys.forEach(function(key) {
-            _define_property(target, key, source[key]);
-        });
-    }
-    return target;
-}
-function ownKeys(object, enumerableOnly) {
-    var keys = Object.keys(object);
-    if (Object.getOwnPropertySymbols) {
-        var symbols = Object.getOwnPropertySymbols(object);
-        if (enumerableOnly) {
-            symbols = symbols.filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            });
-        }
-        keys.push.apply(keys, symbols);
-    }
-    return keys;
-}
-function _object_spread_props(target, source) {
-    source = source != null ? source : {};
-    if (Object.getOwnPropertyDescriptors) {
-        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-        ownKeys(Object(source)).forEach(function(key) {
-            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-        });
-    }
-    return target;
-}
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { memo, useCallback, useMemo, useRef } from "react";
-import { matchPath } from "react-router";
-import Icon from "../../Elements/Icon/Icon";
-import { Paragraph3, Paragraph5 } from "../../Elements/Typography/Typography";
-import SubitemTooltip from "./components/SubitemTooltip";
-import { useLeftMenuContext } from "./context/useLeftMenuContext";
-import useOutSideHover from "./hooks/useOutsideHover";
-import { ItemLinkWrap, ItemIcon, ItemDropdownArrow, SubItemsWrap, OverflowWithEllipsis, MenuItemContainer, ItemLabel, ItemsSeparator } from "./styles";
-var removeOptionalEnd = /\?$/;
-var MenuItem = function MenuItem1(param) {
-    var icon = param.icon, title = param.title, _param_link = param.link, link = _param_link === void 0 ? "" : _param_link, items = param.items, id = param.id, isSubitem = param.isSubitem, isCompact = param.isCompact, _param_lightMode = param.lightMode, lightMode = _param_lightMode === void 0 ? false : _param_lightMode, _param_separator = param.separator, separator = _param_separator === void 0 ? false : _param_separator, isLeftMenuOpen = param.isLeftMenuOpen, onCloseLeftMenu = param.onCloseLeftMenu;
-    var hasChildren = useMemo(function() {
-        return items && (items === null || items === void 0 ? void 0 : items.length) > 0;
-    }, [
-        items
-    ]);
-    var _useLeftMenuContext = useLeftMenuContext(), expandedItem = _useLeftMenuContext.expandedItem, expandItem = _useLeftMenuContext.expandItem;
-    var isExpanded = expandedItem === id;
-    var toggleChildren = useCallback(function() {
-        hasChildren && expandItem(isExpanded ? null : id !== null && id !== void 0 ? id : null);
-        !hasChildren && !lightMode && onCloseLeftMenu && onCloseLeftMenu();
-    }, [
-        hasChildren,
-        expandItem,
-        isExpanded,
-        id,
-        lightMode,
-        onCloseLeftMenu
-    ]);
-    var linkProps = useMemo(function() {
-        return link.startsWith("https://") ? {
-            to: {
-                pathname: link
-            },
-            target: "_blank"
-        } : {
-            to: link
-        };
-    }, [
-        link
-    ]);
-    var Title = isCompact ? Paragraph5 : Paragraph3;
-    var listExpandedItems = isExpanded && !isCompact;
-    var parentRef = useRef(null);
-    var _useOutSideHover = useOutSideHover({
-        parentRef: parentRef
-    }), childRef = _useOutSideHover.ref, isHovering = _useOutSideHover.isHovering, handleMouseOver = _useOutSideHover.handleMouseOver;
-    var itemLinkWrapClassName = !isSubitem ? "toplevel" : "nestedlevel";
-    if (isExpanded) {
-        itemLinkWrapClassName += " expanded";
-    }
-    if (separator) {
-        itemLinkWrapClassName += " separator";
-    }
-    var isActive = useCallback(function(match, location) {
-        var childSelected = !!(items === null || items === void 0 ? void 0 : items.find(function(item) {
-            var _item_link;
-            return ((_item_link = item.link) === null || _item_link === void 0 ? void 0 : _item_link.replace(removeOptionalEnd, "")) === location.pathname;
-        }));
-        var isActive2 = !!matchPath(location.pathname, {
-            path: match === null || match === void 0 ? void 0 : match.path
-        });
-        var partialMatch = location.pathname.startsWith(link.slice(0, -1)) && location.pathname.includes("/settings/");
-        return isActive2 || childSelected || partialMatch;
-    }, [
-        items,
-        link
-    ]);
-    return /* @__PURE__ */ jsxs(Fragment, {
-        children: [
-            separator && /* @__PURE__ */ jsx(ItemsSeparator, {}),
-            /* @__PURE__ */ jsxs(MenuItemContainer, {
-                ref: parentRef,
-                $isCompact: isCompact,
-                $lightMode: lightMode,
-                hasChildren: hasChildren,
-                isHovering: isHovering,
-                children: [
-                    /* @__PURE__ */ jsxs(ItemLinkWrap, _object_spread_props(_object_spread({}, linkProps), {
-                        onMouseOver: handleMouseOver,
-                        exact: true,
-                        activeClassName: hasChildren ? "selected" : void 0,
-                        onClick: toggleChildren,
-                        $isCompact: isCompact,
-                        className: itemLinkWrapClassName,
-                        isActive: isActive,
-                        $lightMode: lightMode,
-                        children: [
-                            /* @__PURE__ */ jsxs(ItemLabel, {
-                                $isCompact: isCompact,
-                                isSubitem: isSubitem,
-                                children: [
-                                    !isSubitem && icon && /* @__PURE__ */ jsx(ItemIcon, {
-                                        className: "mainIcon",
-                                        $isCompact: isCompact,
-                                        children: typeof icon === "string" ? /* @__PURE__ */ jsx(Icon, {
-                                            icon: icon,
-                                            fill: "none"
-                                        }) : icon
-                                    }),
-                                    /* @__PURE__ */ jsx(Title, {
-                                        variant: "semiBold",
-                                        mt: 0,
-                                        mb: 0,
-                                        textAlign: isCompact ? "center" : "left",
-                                        children: /* @__PURE__ */ jsx(OverflowWithEllipsis, {
-                                            children: title
-                                        })
-                                    })
-                                ]
-                            }),
-                            !isCompact && hasChildren && /* @__PURE__ */ jsx(ItemDropdownArrow, {
-                                icon: "goDown",
-                                $lightMode: lightMode
-                            })
-                        ]
-                    })),
-                    isHovering && isCompact && hasChildren && !listExpandedItems && /* @__PURE__ */ jsx(SubitemTooltip, {
-                        items: items,
-                        childRef: childRef,
-                        parentRef: parentRef,
-                        isLeftMenuOpen: isLeftMenuOpen,
-                        onCloseLeftMenu: onCloseLeftMenu,
-                        lightMode: lightMode
-                    })
-                ]
-            }),
-            hasChildren && listExpandedItems && /* @__PURE__ */ jsx(SubItemsWrap, {
-                children: items === null || items === void 0 ? void 0 : items.map(function(item, index) {
-                    return /* @__PURE__ */ jsx(MenuItem, _object_spread_props(_object_spread({
-                        isCompact: isCompact,
-                        lightMode: lightMode
-                    }, item), {
-                        onCloseLeftMenu: onCloseLeftMenu,
-                        isSubitem: true
-                    }), "".concat(index));
-                })
-            })
-        ]
-    });
-};
-var MenuItem_default = memo(MenuItem);
-export { MenuItem_default as default };

package/ui/Blocks/SideMenu/SideMenu.js

@@ -1,82 +0,0 @@
-function _define_property(obj, key, value) {
-    if (key in obj) {
-        Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-        });
-    } else {
-        obj[key] = value;
-    }
-    return obj;
-}
-function _object_spread(target) {
-    for(var i = 1; i < arguments.length; i++){
-        var source = arguments[i] != null ? arguments[i] : {};
-        var ownKeys = Object.keys(source);
-        if (typeof Object.getOwnPropertySymbols === "function") {
-            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-            }));
-        }
-        ownKeys.forEach(function(key) {
-            _define_property(target, key, source[key]);
-        });
-    }
-    return target;
-}
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useClickOutside } from "../Modal/hooks/useClickOutside";
-import FooterRow from "./components/Footer";
-import { LeftMenuProvider } from "./context/LeftMenuContext";
-import MenuItem from "./MenuItem";
-import { TopLevelWrap, ScrollWrap, BodyWrap, Overlay, Container } from "./styles";
-var SideMenu = function SideMenu(param) {
-    var menuItems = param.menuItems, isCompact = param.isCompact, setIsCompact = param.setIsCompact, isLeftMenuOpen = param.isLeftMenuOpen, onCloseLeftMenu = param.onCloseLeftMenu, _param_variant = param.variant, variant = _param_variant === void 0 ? "dark" : _param_variant, children = param.children;
-    var lightMode = variant === "light";
-    var pickerRef = useClickOutside({
-        onClose: onCloseLeftMenu
-    });
-    return /* @__PURE__ */ jsx(LeftMenuProvider, {
-        children: /* @__PURE__ */ jsxs(Container, {
-            isLeftMenuOpen: isLeftMenuOpen,
-            children: [
-                /* @__PURE__ */ jsxs(TopLevelWrap, {
-                    isCompact: isCompact,
-                    isLeftMenuOpen: isLeftMenuOpen,
-                    ref: pickerRef,
-                    lightMode: lightMode,
-                    children: [
-                        /* @__PURE__ */ jsx(ScrollWrap, {
-                            children: /* @__PURE__ */ jsxs(BodyWrap, {
-                                isCompact: isCompact,
-                                children: [
-                                    menuItems.map(function(item, index) {
-                                        var _item_id;
-                                        return /* @__PURE__ */ jsx(MenuItem, _object_spread({
-                                            isCompact: isCompact,
-                                            isLeftMenuOpen: isLeftMenuOpen,
-                                            onCloseLeftMenu: onCloseLeftMenu,
-                                            lightMode: lightMode,
-                                            separator: !!item.separator
-                                        }, item), "".concat((_item_id = item.id) !== null && _item_id !== void 0 ? _item_id : item.title, "-").concat(index));
-                                    }),
-                                    children
-                                ]
-                            })
-                        }),
-                        /* @__PURE__ */ jsx(FooterRow, {
-                            isCompact: isCompact,
-                            setIsCompact: setIsCompact,
-                            lightMode: lightMode
-                        })
-                    ]
-                }),
-                /* @__PURE__ */ jsx(Overlay, {})
-            ]
-        })
-    });
-};
-var SideMenu_default = SideMenu;
-export { SideMenu_default as default };

package/ui/Blocks/SideMenu/components/Footer.js

@@ -1,98 +0,0 @@
-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  display: flex;\n  align-items: center;\n  height: 24px;\n  width: 100%;\n  margin-bottom: 24px;\n  justify-content: ",
-        ";\n  padding-left: ",
-        ";\n"
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n          fill: ",
-        ";\n        "
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject2() {
-    var data = _tagged_template_literal([
-        "\n  display: none;\n  @media (min-width: 1024px) {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    cursor: pointer;\n    color: ",
-        ";\n    font-size: 11px;\n    & svg {\n      transform: ",
-        ";\n      ",
-        "\n\n      & > path {\n        stroke: ",
-        ";\n      }\n    }\n  }\n"
-    ]);
-    _templateObject2 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useCallback } from "react";
-import { MenuItems } from "../../../Elements/Icon/icons/MenuItems";
-import { Paragraph4 } from "../../../Elements/Typography";
-import { Trans } from "@lingui/react";
-import styled, { css } from "@xstyled/styled-components";
-import { th } from "@xstyled/system";
-var FooterWrap = styled.div(_templateObject(), function(props) {
-    return props.isCompact ? "center" : "flex-start";
-}, function(props) {
-    return props.isCompact ? "0" : "22px";
-});
-var SizeToggle = styled.div(_templateObject2(), function(param) {
-    var $lightMode = param.$lightMode;
-    return $lightMode ? th.color("typoPrimary") : th.color("gray");
-}, function(props) {
-    return props.isCompact ? "rotate(180deg)" : "rotate(0deg)";
-}, function(param) {
-    var $lightMode = param.$lightMode;
-    return $lightMode && css(_templateObject1(), th.color("neutral20"));
-}, th.color("lightGray5"));
-var MenuFooter = function MenuFooter(param) {
-    var isCompact = param.isCompact, setIsCompact = param.setIsCompact, lightMode = param.lightMode;
-    var toggleIsCompact = useCallback(function() {
-        setIsCompact === null || setIsCompact === void 0 ? void 0 : setIsCompact(!isCompact);
-    }, [
-        setIsCompact,
-        isCompact
-    ]);
-    return /* @__PURE__ */ jsx(FooterWrap, {
-        isCompact: isCompact,
-        children: /* @__PURE__ */ jsxs(SizeToggle, {
-            onClick: toggleIsCompact,
-            isCompact: isCompact,
-            $lightMode: lightMode,
-            children: [
-                /* @__PURE__ */ jsx(MenuItems, {
-                    stroke: "none",
-                    width: "24px"
-                }),
-                !isCompact && /* @__PURE__ */ jsx(Paragraph4, {
-                    ml: 2,
-                    variant: "semiBold",
-                    children: /* @__PURE__ */ jsx(Trans, {
-                        id: "footer.collapse",
-                        message: "Collapse"
-                    })
-                })
-            ]
-        })
-    });
-};
-var Footer_default = MenuFooter;
-export { FooterWrap, SizeToggle, Footer_default as default };