@mailstep/design-system 0.8.26 → 0.8.27

package/ui/Blocks/Header/components/UserMenu/index.js

@@ -0,0 +1,103 @@
+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 { jsx, jsxs } from "react/jsx-runtime";
+import { useRef } from "react";
+import Avatar from "../../../../Elements/Avatar";
+import Button from "../../../../Elements/Button";
+import { useToggleAndClose } from "../../../../hooks/useToggleAndClose";
+import Popover from "../../../Popover";
+import { UserInfoBlock } from "./components/UserInfo";
+import { Trans } from "@lingui/react";
+import { useLogout } from "./hooks";
+import { DropdownContentWrap, Line, UserWrap } from "./styles";
+var UserMenu = function UserMenu(param) {
+    var user = param.user, onLogout = param.onLogout;
+    var _ref, _ref1, _ref2;
+    var _user_roles;
+    var _useToggleAndClose = _sliced_to_array(useToggleAndClose(false), 3), isDropdownOpen = _useToggleAndClose[0], toggleDropdown = _useToggleAndClose[1], closeDropdown = _useToggleAndClose[2];
+    var parentRef = useRef(null);
+    var handleLogout = useLogout({
+        closeDropdown: closeDropdown,
+        onLogout: onLogout
+    }).handleLogout;
+    return /* @__PURE__ */ jsxs(UserWrap, {
+        children: [
+            /* @__PURE__ */ jsx("div", {
+                ref: parentRef,
+                onClick: toggleDropdown,
+                children: /* @__PURE__ */ jsx(Avatar, {
+                    colorBack: isDropdownOpen ? "lightGray7" : "neutral20",
+                    size: 34
+                })
+            }),
+            isDropdownOpen && /* @__PURE__ */ jsx(Popover, {
+                parentRef: parentRef,
+                onClose: closeDropdown,
+                children: /* @__PURE__ */ jsxs(DropdownContentWrap, {
+                    children: [
+                        /* @__PURE__ */ jsx(UserInfoBlock, {
+                            userName: "".concat((_ref = user === null || user === void 0 ? void 0 : user.firstName) !== null && _ref !== void 0 ? _ref : "", " ").concat((_ref1 = user === null || user === void 0 ? void 0 : user.lastName) !== null && _ref1 !== void 0 ? _ref1 : ""),
+                            role: (_ref2 = user === null || user === void 0 ? void 0 : (_user_roles = user.roles) === null || _user_roles === void 0 ? void 0 : _user_roles[0]) !== null && _ref2 !== void 0 ? _ref2 : ""
+                        }),
+                        /* @__PURE__ */ jsx(Line, {}),
+                        /* @__PURE__ */ jsx(Button, {
+                            onClick: handleLogout,
+                            iconLeft: "logout",
+                            variant: "ghost",
+                            fullWidth: true,
+                            children: /* @__PURE__ */ jsx(Trans, {
+                                id: "logout",
+                                message: "Logout"
+                            })
+                        })
+                    ]
+                })
+            })
+        ]
+    });
+};
+export { UserMenu };

package/ui/Blocks/Header/components/UserMenu/styles.d.ts

@@ -1,3 +1,3 @@
-export declare const UserWrap: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
-export declare const DropdownContentWrap: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
-export declare const Line: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
+export declare const UserWrap: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;
+export declare const DropdownContentWrap: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;
+export declare const Line: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;

package/ui/Blocks/Header/components/UserMenu/styles.js

@@ -0,0 +1,45 @@
+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  flex-direction: row;\n  cursor: pointer;\n  align-items: center;\n"
+    ]);
+    _templateObject = function _templateObject() {
+        return data;
+    };
+    return data;
+}
+function _templateObject1() {
+    var data = _tagged_template_literal([
+        "\n  width: 295px;\n  background-color: white;\n  box-shadow: ",
+        ";\n  padding: 24px 12px 12px 12px;\n  border: 1px solid ",
+        ";\n  border-radius: 8px;\n  margin: 5px 10px 0 0;\n"
+    ]);
+    _templateObject1 = function _templateObject() {
+        return data;
+    };
+    return data;
+}
+function _templateObject2() {
+    var data = _tagged_template_literal([
+        "\n  width: 100%;\n  height: 1px;\n  background-color: ",
+        ";\n  margin: 4px 0;\n"
+    ]);
+    _templateObject2 = function _templateObject() {
+        return data;
+    };
+    return data;
+}
+import styled, { th } from "@xstyled/styled-components";
+var UserWrap = styled.div(_templateObject());
+var DropdownContentWrap = styled.div(_templateObject1(), th.shadow("dropShadow"), th.color("lightGray6"));
+var Line = styled.div(_templateObject2(), th.color("lightGray6"));
+export { DropdownContentWrap, Line, UserWrap };

package/ui/Blocks/Header/hooks/useChangeLanguage.js

@@ -0,0 +1,10 @@
+var useChangeLanguage = function useChangeLanguage(param) {
+    var onChangeLanguage = param.onChangeLanguage;
+    var handleChangeLanguage = function handleChangeLanguage(languageCode) {
+        onChangeLanguage === null || onChangeLanguage === void 0 ? void 0 : onChangeLanguage(languageCode);
+    };
+    return {
+        handleChangeLanguage: handleChangeLanguage
+    };
+};
+export { useChangeLanguage };

package/ui/Blocks/Header/index.d.ts

@@ -1,9 +1,8 @@
-import { FC } from 'react';
-import { Brand, Variant } from '../../Elements/Logo';
-import { LanguageItem } from '../LanguageSwitch';
-import { MenuItemType } from '../SideMenu/types';
-import { User } from './types';
-
+import { type FC } from 'react';
+import type { Brand, Variant } from '../../Elements/Logo';
+import { type LanguageItem } from '../LanguageSwitch';
+import type { MenuItemType } from '../SideMenu/types';
+import type { User } from './types';
 type Props = {
     homeLink: string;
     isMobileMenuOpen?: boolean;

package/ui/Blocks/Header/index.js

@@ -0,0 +1,61 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Link } from "react-router-dom";
+import Logo from "../../Elements/Logo";
+import LanguageSwitch from "../LanguageSwitch";
+import { HamburgerMenuButton } from "../SideMenu";
+import { MenuItems } from "./components/MenuItems";
+import { UserMenu } from "./components/UserMenu";
+import { useChangeLanguage } from "./hooks/useChangeLanguage";
+import { languageItems as defaultLanguageItems } from "./utils/languageItems";
+import { Container, LeftSide, RightSide, LanguageWrapper } from "./styles";
+var Header = function Header(param) {
+    var isMobileMenuOpen = param.isMobileMenuOpen, homeLink = param.homeLink, logo = param.logo, logoVariant = param.logoVariant, logoSrc = param.logoSrc, logoSrcWidth = param.logoSrcWidth, user = param.user, currentLanguage = param.currentLanguage, _param_hasUserMenu = param.hasUserMenu, hasUserMenu = _param_hasUserMenu === void 0 ? false : _param_hasUserMenu, rightMenuItems = param.rightMenuItems, showLanguageWithTitle = param.showLanguageWithTitle, languageFlagWrapBackgroundColor = param.languageFlagWrapBackgroundColor, _param_languageItems = param.languageItems, languageItems = _param_languageItems === void 0 ? defaultLanguageItems : _param_languageItems, _param_withLanguageSwitch = param.withLanguageSwitch, withLanguageSwitch = _param_withLanguageSwitch === void 0 ? true : _param_withLanguageSwitch, onOpenMobileSideMenu = param.onOpenMobileSideMenu, onChangeLanguage = param.onChangeLanguage, onLogout = param.onLogout;
+    var handleChangeLanguage = useChangeLanguage({
+        onChangeLanguage: onChangeLanguage
+    }).handleChangeLanguage;
+    return /* @__PURE__ */ jsxs(Container, {
+        children: [
+            /* @__PURE__ */ jsxs(LeftSide, {
+                children: [
+                    onOpenMobileSideMenu && /* @__PURE__ */ jsx(HamburgerMenuButton, {
+                        isLeftMenuOpen: isMobileMenuOpen,
+                        onClick: onOpenMobileSideMenu
+                    }),
+                    /* @__PURE__ */ jsx(Link, {
+                        to: homeLink,
+                        children: logoSrc ? /* @__PURE__ */ jsx("img", {
+                            src: logoSrc,
+                            alt: "logo",
+                            width: logoSrcWidth
+                        }) : logo && /* @__PURE__ */ jsx(Logo, {
+                            brand: logo,
+                            variant: logoVariant,
+                            width: "145px"
+                        })
+                    })
+                ]
+            }),
+            /* @__PURE__ */ jsxs(RightSide, {
+                children: [
+                    Array.isArray(rightMenuItems) && (rightMenuItems === null || rightMenuItems === void 0 ? void 0 : rightMenuItems.length) > 0 && /* @__PURE__ */ jsx(MenuItems, {
+                        items: rightMenuItems
+                    }),
+                    withLanguageSwitch && /* @__PURE__ */ jsx(LanguageWrapper, {
+                        children: /* @__PURE__ */ jsx(LanguageSwitch, {
+                            languageItems: languageItems,
+                            withTitle: showLanguageWithTitle,
+                            onLanguageChange: handleChangeLanguage,
+                            activeLanguage: currentLanguage,
+                            languageFlagWrapBackgroundColor: languageFlagWrapBackgroundColor
+                        })
+                    }),
+                    hasUserMenu && /* @__PURE__ */ jsx(UserMenu, {
+                        user: user,
+                        onLogout: onLogout
+                    })
+                ]
+            })
+        ]
+    });
+};
+export { Header };

package/ui/Blocks/Header/stories/Header.stories.d.ts

@@ -1,19 +1,18 @@
-import { FC } from 'react';
-
+import type { FC } from 'react';
 declare const meta: {
     title: string;
     component: FC<{
         homeLink: string;
         isMobileMenuOpen?: boolean;
-        logo?: import('../../..').Brand;
-        logoVariant?: import('../../..').Variant;
+        logo?: import("../../..").Brand;
+        logoVariant?: import("../../..").Variant;
         logoSrc?: string;
         logoSrcWidth?: string;
-        user?: import('../types').User | null;
+        user?: import("../types").User | null;
         currentLanguage?: string;
         hasUserMenu?: boolean;
-        rightMenuItems?: import('../../SideMenu').MenuItemType[];
-        languageItems?: import('../../LanguageSwitch').LanguageItem[];
+        rightMenuItems?: import("../../SideMenu").MenuItemType[];
+        languageItems?: import("../../LanguageSwitch").LanguageItem[];
         showLanguageWithTitle?: boolean;
         languageFlagWrapBackgroundColor?: string;
         onOpenMobileSideMenu?: () => void;

package/ui/Blocks/Header/styles.d.ts

@@ -1,4 +1,4 @@
-export declare const Container: import('styled-components').StyledComponent<"header", import('@xstyled/system').Theme, {}, never>;
-export declare const LeftSide: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
-export declare const LanguageWrapper: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
-export declare const RightSide: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, {}, never>;
+export declare const Container: import("styled-components").StyledComponent<"header", import("@xstyled/system").Theme, {}, never>;
+export declare const LeftSide: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;
+export declare const LanguageWrapper: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;
+export declare const RightSide: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;

package/ui/Blocks/Header/styles.js

@@ -0,0 +1,55 @@
+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  width: 100%;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 0 8px;\n  height: ",
+        ";\n  border-bottom: 1px solid ",
+        ";\n\n  @media (min-width: 768px) {\n    padding: 0 20px;\n  }\n"
+    ]);
+    _templateObject = function _templateObject() {
+        return data;
+    };
+    return data;
+}
+function _templateObject1() {
+    var data = _tagged_template_literal([
+        "\n  display: flex;\n"
+    ]);
+    _templateObject1 = function _templateObject() {
+        return data;
+    };
+    return data;
+}
+function _templateObject2() {
+    var data = _tagged_template_literal([
+        "\n  display: flex;\n  justify-content: flex-end;\n"
+    ]);
+    _templateObject2 = function _templateObject() {
+        return data;
+    };
+    return data;
+}
+function _templateObject3() {
+    var data = _tagged_template_literal([
+        "\n  display: flex;\n  gap: 4px;\n  align-items: center;\n\n  @media (min-width: 768px) {\n    gap: 20px;\n  }\n"
+    ]);
+    _templateObject3 = function _templateObject() {
+        return data;
+    };
+    return data;
+}
+import { headerHeight } from "./utils/constants";
+import styled, { th } from "@xstyled/styled-components";
+var Container = styled.header(_templateObject(), headerHeight, th.color("lightGray7"));
+var LeftSide = styled.div(_templateObject1());
+var LanguageWrapper = styled.div(_templateObject2());
+var RightSide = styled.div(_templateObject3());
+export { Container, LanguageWrapper, LeftSide, RightSide };

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

@@ -0,0 +1,2 @@
+var headerHeight = "52px";
+export { headerHeight };

package/ui/Blocks/Header/utils/languageItems.d.ts

@@ -1,3 +1,2 @@
-import { LanguageItem } from '../../LanguageSwitch';
-
+import type { LanguageItem } from '../../LanguageSwitch';
 export declare const languageItems: LanguageItem[];

package/ui/Blocks/Header/utils/languageItems.js

@@ -0,0 +1,20 @@
+import { jsx } from "react/jsx-runtime";
+import { FlagCZ } from "../../../Elements/Icon/icons/FlagCZ";
+import { FlagUSA } from "../../../Elements/Icon/icons/FlagUSA";
+var languageItems = [
+    {
+        languageCode: "cs",
+        icon: /* @__PURE__ */ jsx(FlagCZ, {
+            height: "16px"
+        }),
+        title: "\u010Cesky"
+    },
+    {
+        languageCode: "en",
+        icon: /* @__PURE__ */ jsx(FlagUSA, {
+            height: "16px"
+        }),
+        title: "English"
+    }
+];
+export { languageItems };

package/ui/Blocks/HidePrint/HidePrint.d.ts

@@ -1,5 +1,4 @@
-import { default as React } from 'react';
-
+import React from 'react';
 type Props = {
     children: React.ReactNode;
 };

package/ui/Blocks/HidePrint/HidePrint.js

@@ -0,0 +1,30 @@
+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: contents;\n  @media print {\n    display: none;\n  }\n"
+    ]);
+    _templateObject = function _templateObject() {
+        return data;
+    };
+    return data;
+}
+import { jsx } from "react/jsx-runtime";
+import styled from "styled-components";
+var HideWrapper = styled.div(_templateObject());
+var HidePrint = function HidePrint(param) {
+    var children = param.children;
+    return /* @__PURE__ */ jsx(HideWrapper, {
+        children: children
+    });
+};
+var HidePrint_default = HidePrint;
+export { HidePrint_default as default };

package/ui/Blocks/ImageList/ImageList.d.ts

@@ -1,4 +1,3 @@
-import { FC } from 'react';
-import { ImageListProps } from './types';
-
+import { type FC } from 'react';
+import { type ImageListProps } from './types';
 export declare const ImageList: FC<ImageListProps>;

package/ui/Blocks/ImageList/ImageList.js

@@ -0,0 +1,135 @@
+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 { jsx, jsxs } from "react/jsx-runtime";
+import { useRef } from "react";
+import { useDraggable } from "react-use-draggable-scroll";
+import Icon from "../../Elements/Icon/Icon";
+import LightBox, { useLightBox } from "../LightBox";
+import { AddPhoto } from "./components/AddPhoto";
+import { ImageElement } from "./components/ImageElement";
+import { useControls } from "./hooks/useControls";
+import { useOnElementClick } from "./hooks/useOnElementClick";
+import { x } from "@xstyled/styled-components";
+import { ImageListContainer, Control } from "./styles";
+var ImageList = function ImageList(param) {
+    var onImageUpload = param.onImageUpload, onImageRemove = param.onImageRemove, onImageClick = param.onImageClick, lightBoxAction = param.lightBoxAction, lightBoxActionTitle = param.lightBoxActionTitle, images = param.images, isDisabled = param.isDisabled, selectable = param.selectable, max = param.max;
+    var ref = useRef(null);
+    var events = useDraggable(ref, {
+        isMounted: !!(images === null || images === void 0 ? void 0 : images.length)
+    }).events;
+    var _useLightBox = useLightBox(), isLightBoxOpen = _useLightBox.isLightBoxOpen, onCloseLightBox = _useLightBox.onCloseLightBox, onOpenLightBox = _useLightBox.onOpenLightBox, lightBoxData = _useLightBox.lightBoxData;
+    var _useOnElementClick = useOnElementClick({
+        onImageClick: onImageClick,
+        onOpenLightBox: onOpenLightBox,
+        selectable: selectable
+    }), handleOnClick = _useOnElementClick.handleOnClick, selected = _useOnElementClick.selected;
+    var _useControls = useControls({
+        max: max,
+        total: images === null || images === void 0 ? void 0 : images.length
+    }), hasControls = _useControls.hasControls, position = _useControls.position, moveList = _useControls.moveList;
+    return /* @__PURE__ */ jsxs(x.div, {
+        display: "flex",
+        alignItems: "center",
+        children: [
+            /* @__PURE__ */ jsx(AddPhoto, {
+                onImageUpload: onImageUpload,
+                isDisabled: isDisabled,
+                hasRemove: !!onImageRemove
+            }),
+            hasControls && /* @__PURE__ */ jsx(Control, {
+                onClick: moveList(-1),
+                isLeft: true,
+                isDisabled: position === 0,
+                hasRemove: !!onImageRemove,
+                children: /* @__PURE__ */ jsx(Icon, {
+                    icon: "lessThen",
+                    size: "24px"
+                })
+            }),
+            images && /* @__PURE__ */ jsx(ImageListContainer, _object_spread_props(_object_spread({
+                ref: ref
+            }, events), {
+                children: images.map(function(item, index) {
+                    var _item_smallUrl, _item_id;
+                    return /* @__PURE__ */ jsx(ImageElement, {
+                        imageUrl: (_item_smallUrl = item.smallUrl) !== null && _item_smallUrl !== void 0 ? _item_smallUrl : item.url,
+                        onImageRemove: onImageRemove === null || onImageRemove === void 0 ? void 0 : onImageRemove(item.id),
+                        onClick: handleOnClick(item, index),
+                        isDisabled: isDisabled,
+                        label: item === null || item === void 0 ? void 0 : item.label,
+                        selected: index === selected,
+                        visible: !max || index >= position && index < position + max
+                    }, (_item_id = item.id) !== null && _item_id !== void 0 ? _item_id : index);
+                })
+            })),
+            hasControls && /* @__PURE__ */ jsx(Control, {
+                onClick: moveList(1),
+                isDisabled: !!images && !!max && position >= (images === null || images === void 0 ? void 0 : images.length) - max,
+                hasRemove: !!onImageRemove,
+                children: /* @__PURE__ */ jsx(Icon, {
+                    icon: "greaterThan",
+                    size: "24px"
+                })
+            }),
+            /* @__PURE__ */ jsx(LightBox, {
+                initialSlide: lightBoxData === null || lightBoxData === void 0 ? void 0 : lightBoxData.initialSlide,
+                isLightBoxOpen: isLightBoxOpen,
+                onCloseLightBox: onCloseLightBox,
+                lightBoxAction: lightBoxAction,
+                lightBoxActionTitle: lightBoxActionTitle,
+                images: images
+            })
+        ]
+    });
+};
+export { ImageList };

package/ui/Blocks/ImageList/components/AddPhoto/index.d.ts

@@ -1,6 +1,5 @@
-import { FC } from 'react';
-import { ImageUploadProps } from '../../types';
-
+import { type FC } from 'react';
+import { type ImageUploadProps } from '../../types';
 interface AddPhotoProps {
     onImageUpload?: (props: ImageUploadProps) => Promise<void>;
     isDisabled?: boolean;