@mailstep/design-system 0.8.27 → 0.8.28

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

@@ -1,20 +1,15 @@
+import { FlagUSA } from "../../../Elements/Icon/icons/FlagUSA.js";
+import { FlagCZ } from "../../../Elements/Icon/icons/FlagCZ.js";
 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"
-    }
-];
+//#region packages/ui/Blocks/Header/utils/languageItems.tsx
+const languageItems = [{
+	languageCode: "cs",
+	icon: /* @__PURE__ */ jsx(FlagCZ, { height: "16px" }),
+	title: "Česky"
+}, {
+	languageCode: "en",
+	icon: /* @__PURE__ */ jsx(FlagUSA, { height: "16px" }),
+	title: "English"
+}];
+//#endregion
 export { languageItems };

package/ui/Blocks/HidePrint/HidePrint.js

@@ -1,30 +1,13 @@
-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 "react";
 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 };
+//#region packages/ui/Blocks/HidePrint/HidePrint.tsx
+const HideWrapper = styled.div`
+  display: contents;
+  @media print {
+    display: none;
+  }
+`;
+const HidePrint = ({ children }) => /* @__PURE__ */ jsx(HideWrapper, { children });
+//#endregion
+export { HidePrint as default };

package/ui/Blocks/ImageList/ImageList.js

@@ -1,135 +1,80 @@
-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 Icon from "../../Elements/Icon/Icon.js";
+import { useLightBox } from "../LightBox/hooks/useLightBox.js";
+import LightBox_default from "../LightBox/index.js";
+import { AddPhoto } from "./components/AddPhoto/index.js";
+import { ImageElement } from "./components/ImageElement/index.js";
+import { useControls } from "./hooks/useControls.js";
+import { useOnElementClick } from "./hooks/useOnElementClick.js";
+import { Control, ImageListContainer } from "./styles.js";
 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
-            })
-        ]
-    });
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useDraggable } from "react-use-draggable-scroll";
+//#region packages/ui/Blocks/ImageList/ImageList.tsx
+const ImageList = ({ onImageUpload, onImageRemove, onImageClick, lightBoxAction, lightBoxActionTitle, images, isDisabled, selectable, max }) => {
+	const ref = useRef(null);
+	const { events } = useDraggable(ref, { isMounted: !!images?.length });
+	const { isLightBoxOpen, onCloseLightBox, onOpenLightBox, lightBoxData } = useLightBox();
+	const { handleOnClick, selected } = useOnElementClick({
+		onImageClick,
+		onOpenLightBox,
+		selectable
+	});
+	const { hasControls, position, moveList } = useControls({
+		max,
+		total: images?.length
+	});
+	return /* @__PURE__ */ jsxs(x.div, {
+		display: "flex",
+		alignItems: "center",
+		children: [
+			/* @__PURE__ */ jsx(AddPhoto, {
+				onImageUpload,
+				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, {
+				ref,
+				...events,
+				children: images.map((item, index) => /* @__PURE__ */ jsx(ImageElement, {
+					imageUrl: item.smallUrl ?? item.url,
+					onImageRemove: onImageRemove?.(item.id),
+					onClick: handleOnClick(item, index),
+					isDisabled,
+					label: item?.label,
+					selected: index === selected,
+					visible: !max || index >= position && index < position + max
+				}, item.id ?? index))
+			}),
+			hasControls && /* @__PURE__ */ jsx(Control, {
+				onClick: moveList(1),
+				isDisabled: !!images && !!max && position >= images?.length - max,
+				hasRemove: !!onImageRemove,
+				children: /* @__PURE__ */ jsx(Icon, {
+					icon: "greaterThan",
+					size: "24px"
+				})
+			}),
+			/* @__PURE__ */ jsx(LightBox_default, {
+				initialSlide: lightBoxData?.initialSlide,
+				isLightBoxOpen,
+				onCloseLightBox,
+				lightBoxAction,
+				lightBoxActionTitle,
+				images
+			})
+		]
+	});
 };
+//#endregion
 export { ImageList };

package/ui/Blocks/ImageList/components/AddPhoto/index.js

@@ -1,185 +1,36 @@
-function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
-    try {
-        var info = gen[key](arg);
-        var value = info.value;
-    } catch (error) {
-        reject(error);
-        return;
-    }
-    if (info.done) {
-        resolve(value);
-    } else {
-        Promise.resolve(value).then(_next, _throw);
-    }
-}
-function _async_to_generator(fn) {
-    return function() {
-        var self = this, args = arguments;
-        return new Promise(function(resolve, reject) {
-            var gen = fn.apply(self, args);
-            function _next(value) {
-                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
-            }
-            function _throw(err) {
-                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
-            }
-            _next(undefined);
-        });
-    };
-}
-function _ts_generator(thisArg, body) {
-    var f, y, t, _ = {
-        label: 0,
-        sent: function() {
-            if (t[0] & 1) throw t[1];
-            return t[1];
-        },
-        trys: [],
-        ops: []
-    }, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype), d = Object.defineProperty;
-    return d(g, "next", {
-        value: verb(0)
-    }), d(g, "throw", {
-        value: verb(1)
-    }), d(g, "return", {
-        value: verb(2)
-    }), typeof Symbol === "function" && d(g, Symbol.iterator, {
-        value: function() {
-            return this;
-        }
-    }), g;
-    function verb(n) {
-        return function(v) {
-            return step([
-                n,
-                v
-            ]);
-        };
-    }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while(g && (g = 0, op[0] && (_ = 0)), _)try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [
-                op[0] & 2,
-                t.value
-            ];
-            switch(op[0]){
-                case 0:
-                case 1:
-                    t = op;
-                    break;
-                case 4:
-                    _.label++;
-                    return {
-                        value: op[1],
-                        done: false
-                    };
-                case 5:
-                    _.label++;
-                    y = op[1];
-                    op = [
-                        0
-                    ];
-                    continue;
-                case 7:
-                    op = _.ops.pop();
-                    _.trys.pop();
-                    continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
-                        _ = 0;
-                        continue;
-                    }
-                    if (op[0] === 3 && (!t || op[1] > t[0] && op[1] < t[3])) {
-                        _.label = op[1];
-                        break;
-                    }
-                    if (op[0] === 6 && _.label < t[1]) {
-                        _.label = t[1];
-                        t = op;
-                        break;
-                    }
-                    if (t && _.label < t[2]) {
-                        _.label = t[2];
-                        _.ops.push(op);
-                        break;
-                    }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop();
-                    continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) {
-            op = [
-                6,
-                e
-            ];
-            y = 0;
-        } finally{
-            f = t = 0;
-        }
-        if (op[0] & 5) throw op[1];
-        return {
-            value: op[0] ? op[1] : void 0,
-            done: true
-        };
-    }
-}
-import { jsx, jsxs } from "react/jsx-runtime";
+import { AddPhoto as AddPhoto$1 } from "../../../../Elements/Icon/icons/AddPhoto.js";
+import { Container, HiddenInput } from "./styles.js";
 import { useCallback } from "react";
-import { AddPhoto as AddPhotoIcon } from "../../../../Elements/Icon/icons/AddPhoto";
-import { Container, HiddenInput } from "./styles";
-var AddPhoto = function AddPhoto(param) {
-    var onImageUpload = param.onImageUpload, isDisabled = param.isDisabled, hasRemove = param.hasRemove;
-    var handleImageUpload = useCallback(function(event) {
-        var _event_target_files, _event_target;
-        if (!((_event_target = event.target) === null || _event_target === void 0 ? void 0 : (_event_target_files = _event_target.files) === null || _event_target_files === void 0 ? void 0 : _event_target_files[0])) return;
-        var reader = new FileReader();
-        reader.readAsDataURL(event.target.files[0]);
-        reader.onload = function() {
-            return _async_to_generator(function() {
-                var _reader_result, _event_target_files;
-                return _ts_generator(this, function(_state) {
-                    switch(_state.label){
-                        case 0:
-                            return [
-                                4,
-                                onImageUpload === null || onImageUpload === void 0 ? void 0 : onImageUpload({
-                                    base64image: (_reader_result = reader.result) === null || _reader_result === void 0 ? void 0 : _reader_result.split(",").pop(),
-                                    base64WithDataDeclaration: reader.result,
-                                    file: (_event_target_files = event.target.files) === null || _event_target_files === void 0 ? void 0 : _event_target_files[0]
-                                })
-                            ];
-                        case 1:
-                            _state.sent();
-                            return [
-                                2
-                            ];
-                    }
-                });
-            })();
-        };
-    }, [
-        onImageUpload
-    ]);
-    if (!onImageUpload) return null;
-    return /* @__PURE__ */ jsxs(Container, {
-        isDisabled: isDisabled,
-        hasRemove: hasRemove,
-        children: [
-            /* @__PURE__ */ jsx(HiddenInput, {
-                disabled: isDisabled,
-                onChange: handleImageUpload,
-                type: "file",
-                accept: "image/*;capture=camera",
-                capture: "environment"
-            }),
-            /* @__PURE__ */ jsx(AddPhotoIcon, {
-                width: "36",
-                height: "36"
-            })
-        ]
-    });
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/ui/Blocks/ImageList/components/AddPhoto/index.tsx
+const AddPhoto = ({ onImageUpload, isDisabled, hasRemove }) => {
+	const handleImageUpload = useCallback((event) => {
+		if (!event.target?.files?.[0]) return;
+		const reader = new FileReader();
+		reader.readAsDataURL(event.target.files[0]);
+		reader.onload = async () => {
+			await onImageUpload?.({
+				base64image: reader.result?.split(",").pop(),
+				base64WithDataDeclaration: reader.result,
+				file: event.target.files?.[0]
+			});
+		};
+	}, [onImageUpload]);
+	if (!onImageUpload) return null;
+	return /* @__PURE__ */ jsxs(Container, {
+		isDisabled,
+		hasRemove,
+		children: [/* @__PURE__ */ jsx(HiddenInput, {
+			disabled: isDisabled,
+			onChange: handleImageUpload,
+			type: "file",
+			accept: "image/*;capture=camera",
+			capture: "environment"
+		}), /* @__PURE__ */ jsx(AddPhoto$1, {
+			width: "36",
+			height: "36"
+		})]
+	});
 };
+//#endregion
 export { AddPhoto };

package/ui/Blocks/ImageList/components/AddPhoto/styles.js

@@ -1,43 +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  position: relative;\n  flex-shrink: 0;\n  transition: all 0.2s linear;\n  height: 85px !important;\n  width: 85px !important;\n  border-radius: ",
-        ";\n  border: ",
-        ";\n  border-color: ",
-        ";\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  margin-right: 15px;\n  opacity: ",
-        ";\n  margin-top: ",
-        ";\n"
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n  opacity: 0;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n"
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-import styled, { th } from "@xstyled/styled-components";
-var Container = styled.div(_templateObject(), th.radius("lg"), th.border("mediumSlim"), th.color("red1"), function(param) {
-    var isDisabled = param.isDisabled;
-    return isDisabled ? 0.6 : 1;
-}, function(param) {
-    var hasRemove = param.hasRemove;
-    return hasRemove ? "15px" : "";
-});
-var HiddenInput = styled.input(_templateObject1());
+import styled$1, { th } from "@xstyled/styled-components";
+//#region packages/ui/Blocks/ImageList/components/AddPhoto/styles.ts
+const Container = styled$1.div`
+  position: relative;
+  flex-shrink: 0;
+  transition: all 0.2s linear;
+  height: 85px !important;
+  width: 85px !important;
+  border-radius: ${th.radius("lg")};
+  border: ${th.border("mediumSlim")};
+  border-color: ${th.color("red1")};
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+  margin-right: 15px;
+  opacity: ${({ isDisabled }) => isDisabled ? .6 : 1};
+  margin-top: ${({ hasRemove }) => hasRemove ? "15px" : ""};
+`;
+const HiddenInput = styled$1.input`
+  opacity: 0;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  cursor: pointer;
+`;
+//#endregion
 export { Container, HiddenInput };

package/ui/Blocks/ImageList/components/CloseButton/index.js

@@ -1,16 +1,18 @@
+import Icon from "../../../../Elements/Icon/Icon.js";
+import "../../../../Elements/Icon/index.js";
+import { Container } from "./styles.js";
 import { jsx } from "react/jsx-runtime";
-import { Icon } from "../../../../Elements/Icon";
-import { Container } from "./styles";
-var CloseButton = function CloseButton(param) {
-    var onImageRemove = param.onImageRemove, isDisabled = param.isDisabled;
-    return /* @__PURE__ */ jsx(Container, {
-        onClick: !isDisabled ? onImageRemove : void 0,
-        isDisabled: isDisabled,
-        children: /* @__PURE__ */ jsx(Icon, {
-            icon: "close",
-            size: "22px",
-            fill: isDisabled ? "magenta60" : "red1"
-        })
-    });
+//#region packages/ui/Blocks/ImageList/components/CloseButton/index.tsx
+const CloseButton = ({ onImageRemove, isDisabled }) => {
+	return /* @__PURE__ */ jsx(Container, {
+		onClick: !isDisabled ? onImageRemove : void 0,
+		isDisabled,
+		children: /* @__PURE__ */ jsx(Icon, {
+			icon: "close",
+			size: "22px",
+			fill: isDisabled ? "magenta60" : "red1"
+		})
+	});
 };
+//#endregion
 export { CloseButton };