@mailstep/design-system 0.1.19 → 0.1.20-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mailstep/design-system",
-  "version": "0.1.19",
+  "version": "0.1.20-beta.2",
   "license": "ISC",
   "type": "module",
   "main": "./ui/index.js",

package/ui/Blocks/CornerDialog/CornerDialog.js

@@ -1,23 +1,25 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useState, useEffect } from 'react';
-import { statusToIcon, statusToColors } from './utils.js';
-import { Portal } from '../../Elements/Portal/index.js';
-import Icon from '../../Elements/Icon/Icon.js';
-import 'tslib';
-import { Container, Status, StatusText, Header, CloseBtn, Wrapper } from './styles.js';
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var utils = require('./utils.js');
+var index = require('../../Elements/Portal/index.js');
+var Icon = require('../../Elements/Icon/Icon.js');
+require('tslib');
+var styles = require('./styles.js');
 
 var CornerDialog = function (_a) {
     var title = _a.title, children = _a.children, onClose = _a.onClose, statusToTitle = _a.statusToTitle, _b = _a.isOpen, isOpen = _b === void 0 ? true : _b, _intent = _a.intent;
-    var _c = useState(false), isMounted = _c[0], setIsMounted = _c[1];
-    useEffect(function () {
+    var _c = React.useState(false), isMounted = _c[0], setIsMounted = _c[1];
+    React.useEffect(function () {
         setIsMounted(true);
     }, []);
     var intent = _intent !== null && _intent !== void 0 ? _intent : 'info';
-    var _d = statusToColors[intent], fontColor = _d.fontColor, backgroundColor = _d.backgroundColor, fill = _d.fill;
+    var _d = utils.statusToColors[intent], fontColor = _d.fontColor, backgroundColor = _d.backgroundColor, fill = _d.fill;
     if (!isOpen)
         return null;
-    return (jsx(Portal, { children: jsxs(Container, { "$mounted": isMounted, children: [jsxs(Status, { background: backgroundColor, children: [jsx(Icon, { icon: statusToIcon[intent], fill: fill }), jsx(StatusText, { fontColor: fontColor, children: statusToTitle[intent]() })] }), jsx(Header, { children: title }), jsx(CloseBtn, { onClick: onClose, children: jsx(Icon, { icon: "close", size: "25px" }) }), jsx(Wrapper, { children: children })] }) }));
+    return (jsxRuntime.jsx(index.Portal, { children: jsxRuntime.jsxs(styles.Container, { "$mounted": isMounted, children: [jsxRuntime.jsxs(styles.Status, { background: backgroundColor, children: [jsxRuntime.jsx(Icon.default, { icon: utils.statusToIcon[intent], fill: fill }), jsxRuntime.jsx(styles.StatusText, { fontColor: fontColor, children: statusToTitle[intent]() })] }), jsxRuntime.jsx(styles.Header, { children: title }), jsxRuntime.jsx(styles.CloseBtn, { onClick: onClose, children: jsxRuntime.jsx(Icon.default, { icon: "close", size: "25px" }) }), jsxRuntime.jsx(styles.Wrapper, { children: children })] }) }));
 };
 
-export { CornerDialog };
+exports.CornerDialog = CornerDialog;
 //# sourceMappingURL=CornerDialog.js.map

package/ui/Blocks/CornerDialog/CornerDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"CornerDialog.js","sources":["../../../../packages/ui/Blocks/CornerDialog/CornerDialog.tsx"],"sourcesContent":["import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { useEffect, useState } from 'react';\nimport { statusToColors, statusToIcon } from './utils';\nimport { Portal } from '../../Elements/Portal';\nimport { Icon } from '../../Elements/Icon';\nimport { Container, Header, Status, StatusText, Wrapper, CloseBtn } from './styles';\nexport var CornerDialog = function (_a) {\n    var title = _a.title, children = _a.children, onClose = _a.onClose, statusToTitle = _a.statusToTitle, _b = _a.isOpen, isOpen = _b === void 0 ? true : _b, _intent = _a.intent;\n    var _c = useState(false), isMounted = _c[0], setIsMounted = _c[1];\n    useEffect(function () {\n        setIsMounted(true);\n    }, []);\n    var intent = _intent !== null && _intent !== void 0 ? _intent : 'info';\n    var _d = statusToColors[intent], fontColor = _d.fontColor, backgroundColor = _d.backgroundColor, fill = _d.fill;\n    if (!isOpen)\n        return null;\n    return (_jsx(Portal, { children: _jsxs(Container, { \"$mounted\": isMounted, children: [_jsxs(Status, { background: backgroundColor, children: [_jsx(Icon, { icon: statusToIcon[intent], fill: fill }), _jsx(StatusText, { fontColor: fontColor, children: statusToTitle[intent]() })] }), _jsx(Header, { children: title }), _jsx(CloseBtn, { onClick: onClose, children: _jsx(Icon, { icon: \"close\", size: \"25px\" }) }), _jsx(Wrapper, { children: children })] }) }));\n};\n//# sourceMappingURL=CornerDialog.js.map"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;AAMU,IAAC,YAAY,GAAG,UAAU,EAAE,EAAE;AACxC,IAAI,IAAI,KAAK,GAAG,EAAE,CAAC,KAAK,EAAE,QAAQ,GAAG,EAAE,CAAC,QAAQ,EAAE,OAAO,GAAG,EAAE,CAAC,OAAO,EAAE,aAAa,GAAG,EAAE,CAAC,aAAa,EAAE,EAAE,GAAG,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,EAAE,KAAK,KAAK,CAAC,GAAG,IAAI,GAAG,EAAE,EAAE,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC;AAClL,IAAI,IAAI,EAAE,GAAG,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,GAAG,EAAE,CAAC,CAAC,CAAC,EAAE,YAAY,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC;AACtE,IAAI,SAAS,CAAC,YAAY;AAC1B,QAAQ,YAAY,CAAC,IAAI,CAAC,CAAC;AAC3B,KAAK,EAAE,EAAE,CAAC,CAAC;AACX,IAAI,IAAI,MAAM,GAAG,OAAO,KAAK,IAAI,IAAI,OAAO,KAAK,KAAK,CAAC,GAAG,OAAO,GAAG,MAAM,CAAC;AAC3E,IAAI,IAAI,EAAE,GAAG,cAAc,CAAC,MAAM,CAAC,EAAE,SAAS,GAAG,EAAE,CAAC,SAAS,EAAE,eAAe,GAAG,EAAE,CAAC,eAAe,EAAE,IAAI,GAAG,EAAE,CAAC,IAAI,CAAC;AACpH,IAAI,IAAI,CAAC,MAAM;AACf,QAAQ,OAAO,IAAI,CAAC;AACpB,IAAI,QAAQA,GAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAEC,IAAK,CAAC,SAAS,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,CAACA,IAAK,CAAC,MAAM,EAAE,EAAE,UAAU,EAAE,eAAe,EAAE,QAAQ,EAAE,CAACD,GAAI,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,YAAY,CAAC,MAAM,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAEA,GAAI,CAAC,UAAU,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,aAAa,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAEA,GAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAEA,GAAI,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAEA,GAAI,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,EAAEA,GAAI,CAAC,OAAO,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AAC3c;;;;"}
+{"version":3,"file":"CornerDialog.js","sources":["../../../../packages/ui/Blocks/CornerDialog/CornerDialog.tsx"],"sourcesContent":["import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { useEffect, useState } from 'react';\nimport { statusToColors, statusToIcon } from './utils';\nimport { Portal } from '../../Elements/Portal';\nimport { Icon } from '../../Elements/Icon';\nimport { Container, Header, Status, StatusText, Wrapper, CloseBtn } from './styles';\nexport var CornerDialog = function (_a) {\n    var title = _a.title, children = _a.children, onClose = _a.onClose, statusToTitle = _a.statusToTitle, _b = _a.isOpen, isOpen = _b === void 0 ? true : _b, _intent = _a.intent;\n    var _c = useState(false), isMounted = _c[0], setIsMounted = _c[1];\n    useEffect(function () {\n        setIsMounted(true);\n    }, []);\n    var intent = _intent !== null && _intent !== void 0 ? _intent : 'info';\n    var _d = statusToColors[intent], fontColor = _d.fontColor, backgroundColor = _d.backgroundColor, fill = _d.fill;\n    if (!isOpen)\n        return null;\n    return (_jsx(Portal, { children: _jsxs(Container, { \"$mounted\": isMounted, children: [_jsxs(Status, { background: backgroundColor, children: [_jsx(Icon, { icon: statusToIcon[intent], fill: fill }), _jsx(StatusText, { fontColor: fontColor, children: statusToTitle[intent]() })] }), _jsx(Header, { children: title }), _jsx(CloseBtn, { onClick: onClose, children: _jsx(Icon, { icon: \"close\", size: \"25px\" }) }), _jsx(Wrapper, { children: children })] }) }));\n};\n//# sourceMappingURL=CornerDialog.js.map"],"names":["useState","useEffect","statusToColors","_jsx","Portal","_jsxs","Container","Status","Icon","statusToIcon","StatusText","Header","CloseBtn","Wrapper"],"mappings":";;;;;;;;;;AAMU,IAAC,YAAY,GAAG,UAAU,EAAE,EAAE;AACxC,IAAI,IAAI,KAAK,GAAG,EAAE,CAAC,KAAK,EAAE,QAAQ,GAAG,EAAE,CAAC,QAAQ,EAAE,OAAO,GAAG,EAAE,CAAC,OAAO,EAAE,aAAa,GAAG,EAAE,CAAC,aAAa,EAAE,EAAE,GAAG,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,EAAE,KAAK,KAAK,CAAC,GAAG,IAAI,GAAG,EAAE,EAAE,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC;AAClL,IAAI,IAAI,EAAE,GAAGA,cAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,GAAG,EAAE,CAAC,CAAC,CAAC,EAAE,YAAY,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC;AACtE,IAAIC,eAAS,CAAC,YAAY;AAC1B,QAAQ,YAAY,CAAC,IAAI,CAAC,CAAC;AAC3B,KAAK,EAAE,EAAE,CAAC,CAAC;AACX,IAAI,IAAI,MAAM,GAAG,OAAO,KAAK,IAAI,IAAI,OAAO,KAAK,KAAK,CAAC,GAAG,OAAO,GAAG,MAAM,CAAC;AAC3E,IAAI,IAAI,EAAE,GAAGC,oBAAc,CAAC,MAAM,CAAC,EAAE,SAAS,GAAG,EAAE,CAAC,SAAS,EAAE,eAAe,GAAG,EAAE,CAAC,eAAe,EAAE,IAAI,GAAG,EAAE,CAAC,IAAI,CAAC;AACpH,IAAI,IAAI,CAAC,MAAM;AACf,QAAQ,OAAO,IAAI,CAAC;AACpB,IAAI,QAAQC,cAAI,CAACC,YAAM,EAAE,EAAE,QAAQ,EAAEC,eAAK,CAACC,gBAAS,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,CAACD,eAAK,CAACE,aAAM,EAAE,EAAE,UAAU,EAAE,eAAe,EAAE,QAAQ,EAAE,CAACJ,cAAI,CAACK,YAAI,EAAE,EAAE,IAAI,EAAEC,kBAAY,CAAC,MAAM,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAEN,cAAI,CAACO,iBAAU,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,aAAa,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAEP,cAAI,CAACQ,aAAM,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAER,cAAI,CAACS,eAAQ,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAET,cAAI,CAACK,YAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,EAAEL,cAAI,CAACU,cAAO,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AAC3c;;;;"}

package/ui/Blocks/CornerDialog/index.js

@@ -1,6 +1,10 @@
-import { CornerDialog } from './CornerDialog.js';
+'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
 
+var CornerDialog = require('./CornerDialog.js');
 
-export { CornerDialog as default };
+
+
+exports.default = CornerDialog.CornerDialog;
 //# sourceMappingURL=index.js.map

package/ui/Blocks/CornerDialog/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/ui/Blocks/CornerDialog/styles.js

@@ -1,22 +1,33 @@
-import { __makeTemplateObject } from 'tslib';
-import styled, { th } from '@xstyled/styled-components';
+'use strict';
 
-var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: fixed;\n  z-index: 10;\n  bottom: 3rem;\n  right: 3rem;\n  background: white;\n  border-radius: 12px;\n  box-shadow: cornerDialogShadow;\n  width: 400px;\n  padding: 50px 30px 30px;\n  color: typoPrimary;\n  transition: opacity 225ms linear;\n  opacity: ", ";\n"], ["\n  position: fixed;\n  z-index: 10;\n  bottom: 3rem;\n  right: 3rem;\n  background: white;\n  border-radius: 12px;\n  box-shadow: cornerDialogShadow;\n  width: 400px;\n  padding: 50px 30px 30px;\n  color: typoPrimary;\n  transition: opacity 225ms linear;\n  opacity: ", ";\n"])), function (_a) {
+var tslib = require('tslib');
+var styled = require('@xstyled/styled-components');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
+
+var Container = styled__default.default.div(templateObject_1 || (templateObject_1 = tslib.__makeTemplateObject(["\n  position: fixed;\n  z-index: 10;\n  bottom: 3rem;\n  right: 3rem;\n  background: white;\n  border-radius: 12px;\n  box-shadow: cornerDialogShadow;\n  width: 400px;\n  padding: 50px 30px 30px;\n  color: typoPrimary;\n  transition: opacity 225ms linear;\n  opacity: ", ";\n"], ["\n  position: fixed;\n  z-index: 10;\n  bottom: 3rem;\n  right: 3rem;\n  background: white;\n  border-radius: 12px;\n  box-shadow: cornerDialogShadow;\n  width: 400px;\n  padding: 50px 30px 30px;\n  color: typoPrimary;\n  transition: opacity 225ms linear;\n  opacity: ", ";\n"])), function (_a) {
     var $mounted = _a.$mounted;
     return ($mounted ? 1 : 0);
 });
-var Header = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  margin-bottom: 15px;\n  color: typoPrimary;\n  font-size: 18px;\n  font-weight: bold;\n  display: flex;\n  align-items: center;\n"], ["\n  margin-bottom: 15px;\n  color: typoPrimary;\n  font-size: 18px;\n  font-weight: bold;\n  display: flex;\n  align-items: center;\n"])));
-var Wrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  font-size: 14px;\n  font-weight: 400;\n"], ["\n  font-size: 14px;\n  font-weight: 400;\n"])));
-var Status = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: absolute;\n  left: 0;\n  top: 0;\n  padding: 6px 10px;\n  text-transform: uppercase;\n  border-radius: 12px 0 12px 0;\n  background-color: ", ";\n"], ["\n  position: absolute;\n  left: 0;\n  top: 0;\n  padding: 6px 10px;\n  text-transform: uppercase;\n  border-radius: 12px 0 12px 0;\n  background-color: ", ";\n"])), function (_a) {
+var Header = styled__default.default.div(templateObject_2 || (templateObject_2 = tslib.__makeTemplateObject(["\n  margin-bottom: 15px;\n  color: typoPrimary;\n  font-size: 18px;\n  font-weight: bold;\n  display: flex;\n  align-items: center;\n"], ["\n  margin-bottom: 15px;\n  color: typoPrimary;\n  font-size: 18px;\n  font-weight: bold;\n  display: flex;\n  align-items: center;\n"])));
+var Wrapper = styled__default.default.div(templateObject_3 || (templateObject_3 = tslib.__makeTemplateObject(["\n  font-size: 14px;\n  font-weight: 400;\n"], ["\n  font-size: 14px;\n  font-weight: 400;\n"])));
+var Status = styled__default.default.div(templateObject_4 || (templateObject_4 = tslib.__makeTemplateObject(["\n  position: absolute;\n  left: 0;\n  top: 0;\n  padding: 6px 10px;\n  text-transform: uppercase;\n  border-radius: 12px 0 12px 0;\n  background-color: ", ";\n"], ["\n  position: absolute;\n  left: 0;\n  top: 0;\n  padding: 6px 10px;\n  text-transform: uppercase;\n  border-radius: 12px 0 12px 0;\n  background-color: ", ";\n"])), function (_a) {
     var background = _a.background;
-    return th.color(background);
+    return styled.th.color(background);
 });
-var CloseBtn = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  cursor: pointer;\n  position: absolute;\n  top: 12px;\n  right: 12px;\n"], ["\n  cursor: pointer;\n  position: absolute;\n  top: 12px;\n  right: 12px;\n"])));
-var StatusText = styled.span(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: inline-block;\n  margin-left: 6px;\n  font-size: 14px;\n  font-weight: 700;\n  color: ", ";\n"], ["\n  display: inline-block;\n  margin-left: 6px;\n  font-size: 14px;\n  font-weight: 700;\n  color: ", ";\n"])), function (_a) {
+var CloseBtn = styled__default.default.div(templateObject_5 || (templateObject_5 = tslib.__makeTemplateObject(["\n  cursor: pointer;\n  position: absolute;\n  top: 12px;\n  right: 12px;\n"], ["\n  cursor: pointer;\n  position: absolute;\n  top: 12px;\n  right: 12px;\n"])));
+var StatusText = styled__default.default.span(templateObject_6 || (templateObject_6 = tslib.__makeTemplateObject(["\n  display: inline-block;\n  margin-left: 6px;\n  font-size: 14px;\n  font-weight: 700;\n  color: ", ";\n"], ["\n  display: inline-block;\n  margin-left: 6px;\n  font-size: 14px;\n  font-weight: 700;\n  color: ", ";\n"])), function (_a) {
     var fontColor = _a.fontColor;
-    return th.color(fontColor);
+    return styled.th.color(fontColor);
 });
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
 
-export { CloseBtn, Container, Header, Status, StatusText, Wrapper };
+exports.CloseBtn = CloseBtn;
+exports.Container = Container;
+exports.Header = Header;
+exports.Status = Status;
+exports.StatusText = StatusText;
+exports.Wrapper = Wrapper;
 //# sourceMappingURL=styles.js.map

package/ui/Blocks/CornerDialog/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../packages/ui/Blocks/CornerDialog/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport styled, { th } from '@xstyled/styled-components';\nexport var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n  position: fixed;\\n  z-index: 10;\\n  bottom: 3rem;\\n  right: 3rem;\\n  background: white;\\n  border-radius: 12px;\\n  box-shadow: cornerDialogShadow;\\n  width: 400px;\\n  padding: 50px 30px 30px;\\n  color: typoPrimary;\\n  transition: opacity 225ms linear;\\n  opacity: \", \";\\n\"], [\"\\n  position: fixed;\\n  z-index: 10;\\n  bottom: 3rem;\\n  right: 3rem;\\n  background: white;\\n  border-radius: 12px;\\n  box-shadow: cornerDialogShadow;\\n  width: 400px;\\n  padding: 50px 30px 30px;\\n  color: typoPrimary;\\n  transition: opacity 225ms linear;\\n  opacity: \", \";\\n\"])), function (_a) {\n    var $mounted = _a.$mounted;\n    return ($mounted ? 1 : 0);\n});\nexport var Header = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n  margin-bottom: 15px;\\n  color: typoPrimary;\\n  font-size: 18px;\\n  font-weight: bold;\\n  display: flex;\\n  align-items: center;\\n\"], [\"\\n  margin-bottom: 15px;\\n  color: typoPrimary;\\n  font-size: 18px;\\n  font-weight: bold;\\n  display: flex;\\n  align-items: center;\\n\"])));\nexport var Wrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n  font-size: 14px;\\n  font-weight: 400;\\n\"], [\"\\n  font-size: 14px;\\n  font-weight: 400;\\n\"])));\nexport var Status = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject([\"\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  padding: 6px 10px;\\n  text-transform: uppercase;\\n  border-radius: 12px 0 12px 0;\\n  background-color: \", \";\\n\"], [\"\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  padding: 6px 10px;\\n  text-transform: uppercase;\\n  border-radius: 12px 0 12px 0;\\n  background-color: \", \";\\n\"])), function (_a) {\n    var background = _a.background;\n    return th.color(background);\n});\nexport var CloseBtn = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject([\"\\n  cursor: pointer;\\n  position: absolute;\\n  top: 12px;\\n  right: 12px;\\n\"], [\"\\n  cursor: pointer;\\n  position: absolute;\\n  top: 12px;\\n  right: 12px;\\n\"])));\nexport var StatusText = styled.span(templateObject_6 || (templateObject_6 = __makeTemplateObject([\"\\n  display: inline-block;\\n  margin-left: 6px;\\n  font-size: 14px;\\n  font-weight: 700;\\n  color: \", \";\\n\"], [\"\\n  display: inline-block;\\n  margin-left: 6px;\\n  font-size: 14px;\\n  font-weight: 700;\\n  color: \", \";\\n\"])), function (_a) {\n    var fontColor = _a.fontColor;\n    return th.color(fontColor);\n});\nvar templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;\n//# sourceMappingURL=styles.js.map"],"names":[],"mappings":";;;AAEU,IAAC,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,8QAA8Q,EAAE,KAAK,CAAC,EAAE,CAAC,8QAA8Q,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE;AACjqB,IAAI,IAAI,QAAQ,GAAG,EAAE,CAAC,QAAQ,CAAC;AAC/B,IAAI,QAAQ,QAAQ,GAAG,CAAC,GAAG,CAAC,EAAE;AAC9B,CAAC,EAAE;AACO,IAAC,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,uIAAuI,CAAC,EAAE,CAAC,uIAAuI,CAAC,CAAC,CAAC,EAAE;AAC1W,IAAC,OAAO,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,6CAA6C,CAAC,EAAE,CAAC,6CAA6C,CAAC,CAAC,CAAC,EAAE;AACvL,IAAC,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,2JAA2J,EAAE,KAAK,CAAC,EAAE,CAAC,2JAA2J,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE;AACxb,IAAI,IAAI,UAAU,GAAG,EAAE,CAAC,UAAU,CAAC;AACnC,IAAI,OAAO,EAAE,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;AAChC,CAAC,EAAE;AACO,IAAC,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,6EAA6E,CAAC,EAAE,CAAC,6EAA6E,CAAC,CAAC,CAAC,EAAE;AACxP,IAAC,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,qGAAqG,EAAE,KAAK,CAAC,EAAE,CAAC,qGAAqG,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE;AACjV,IAAI,IAAI,SAAS,GAAG,EAAE,CAAC,SAAS,CAAC;AACjC,IAAI,OAAO,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;AAC/B,CAAC,EAAE;AACH,IAAI,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB;;;;"}
+{"version":3,"file":"styles.js","sources":["../../../../packages/ui/Blocks/CornerDialog/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport styled, { th } from '@xstyled/styled-components';\nexport var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n  position: fixed;\\n  z-index: 10;\\n  bottom: 3rem;\\n  right: 3rem;\\n  background: white;\\n  border-radius: 12px;\\n  box-shadow: cornerDialogShadow;\\n  width: 400px;\\n  padding: 50px 30px 30px;\\n  color: typoPrimary;\\n  transition: opacity 225ms linear;\\n  opacity: \", \";\\n\"], [\"\\n  position: fixed;\\n  z-index: 10;\\n  bottom: 3rem;\\n  right: 3rem;\\n  background: white;\\n  border-radius: 12px;\\n  box-shadow: cornerDialogShadow;\\n  width: 400px;\\n  padding: 50px 30px 30px;\\n  color: typoPrimary;\\n  transition: opacity 225ms linear;\\n  opacity: \", \";\\n\"])), function (_a) {\n    var $mounted = _a.$mounted;\n    return ($mounted ? 1 : 0);\n});\nexport var Header = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n  margin-bottom: 15px;\\n  color: typoPrimary;\\n  font-size: 18px;\\n  font-weight: bold;\\n  display: flex;\\n  align-items: center;\\n\"], [\"\\n  margin-bottom: 15px;\\n  color: typoPrimary;\\n  font-size: 18px;\\n  font-weight: bold;\\n  display: flex;\\n  align-items: center;\\n\"])));\nexport var Wrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n  font-size: 14px;\\n  font-weight: 400;\\n\"], [\"\\n  font-size: 14px;\\n  font-weight: 400;\\n\"])));\nexport var Status = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject([\"\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  padding: 6px 10px;\\n  text-transform: uppercase;\\n  border-radius: 12px 0 12px 0;\\n  background-color: \", \";\\n\"], [\"\\n  position: absolute;\\n  left: 0;\\n  top: 0;\\n  padding: 6px 10px;\\n  text-transform: uppercase;\\n  border-radius: 12px 0 12px 0;\\n  background-color: \", \";\\n\"])), function (_a) {\n    var background = _a.background;\n    return th.color(background);\n});\nexport var CloseBtn = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject([\"\\n  cursor: pointer;\\n  position: absolute;\\n  top: 12px;\\n  right: 12px;\\n\"], [\"\\n  cursor: pointer;\\n  position: absolute;\\n  top: 12px;\\n  right: 12px;\\n\"])));\nexport var StatusText = styled.span(templateObject_6 || (templateObject_6 = __makeTemplateObject([\"\\n  display: inline-block;\\n  margin-left: 6px;\\n  font-size: 14px;\\n  font-weight: 700;\\n  color: \", \";\\n\"], [\"\\n  display: inline-block;\\n  margin-left: 6px;\\n  font-size: 14px;\\n  font-weight: 700;\\n  color: \", \";\\n\"])), function (_a) {\n    var fontColor = _a.fontColor;\n    return th.color(fontColor);\n});\nvar templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;\n//# sourceMappingURL=styles.js.map"],"names":["styled","__makeTemplateObject","th"],"mappings":";;;;;;;;;AAEU,IAAC,SAAS,GAAGA,uBAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAGC,0BAAoB,CAAC,CAAC,8QAA8Q,EAAE,KAAK,CAAC,EAAE,CAAC,8QAA8Q,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE;AACjqB,IAAI,IAAI,QAAQ,GAAG,EAAE,CAAC,QAAQ,CAAC;AAC/B,IAAI,QAAQ,QAAQ,GAAG,CAAC,GAAG,CAAC,EAAE;AAC9B,CAAC,EAAE;AACO,IAAC,MAAM,GAAGD,uBAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAGC,0BAAoB,CAAC,CAAC,uIAAuI,CAAC,EAAE,CAAC,uIAAuI,CAAC,CAAC,CAAC,EAAE;AAC1W,IAAC,OAAO,GAAGD,uBAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAGC,0BAAoB,CAAC,CAAC,6CAA6C,CAAC,EAAE,CAAC,6CAA6C,CAAC,CAAC,CAAC,EAAE;AACvL,IAAC,MAAM,GAAGD,uBAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAGC,0BAAoB,CAAC,CAAC,2JAA2J,EAAE,KAAK,CAAC,EAAE,CAAC,2JAA2J,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE;AACxb,IAAI,IAAI,UAAU,GAAG,EAAE,CAAC,UAAU,CAAC;AACnC,IAAI,OAAOC,SAAE,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;AAChC,CAAC,EAAE;AACO,IAAC,QAAQ,GAAGF,uBAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAGC,0BAAoB,CAAC,CAAC,6EAA6E,CAAC,EAAE,CAAC,6EAA6E,CAAC,CAAC,CAAC,EAAE;AACxP,IAAC,UAAU,GAAGD,uBAAM,CAAC,IAAI,CAAC,gBAAgB,KAAK,gBAAgB,GAAGC,0BAAoB,CAAC,CAAC,qGAAqG,EAAE,KAAK,CAAC,EAAE,CAAC,qGAAqG,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE;AACjV,IAAI,IAAI,SAAS,GAAG,EAAE,CAAC,SAAS,CAAC;AACjC,IAAI,OAAOC,SAAE,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;AAC/B,CAAC,EAAE;AACH,IAAI,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB;;;;;;;;;"}

package/ui/Blocks/CornerDialog/utils.js

@@ -1,3 +1,5 @@
+'use strict';
+
 var statusToColors = {
     info: { fontColor: 'gray1', backgroundColor: 'lightGray7', fill: 'gray1' },
     success: { fontColor: 'white', backgroundColor: 'green', fill: 'white' },
@@ -11,5 +13,6 @@ var statusToIcon = {
     warning: 'circleTriangle',
 };
 
-export { statusToColors, statusToIcon };
+exports.statusToColors = statusToColors;
+exports.statusToIcon = statusToIcon;
 //# sourceMappingURL=utils.js.map

package/ui/Blocks/CornerDialog/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../../packages/ui/Blocks/CornerDialog/utils.ts"],"sourcesContent":["export var statusToColors = {\n    info: { fontColor: 'gray1', backgroundColor: 'lightGray7', fill: 'gray1' },\n    success: { fontColor: 'white', backgroundColor: 'green', fill: 'white' },\n    error: { fontColor: 'white', backgroundColor: 'red1', fill: 'white' },\n    warning: { fontColor: 'blue2', backgroundColor: 'yellow1', fill: 'blue2' },\n};\nexport var statusToIcon = {\n    info: 'info',\n    success: 'circleCheck',\n    error: 'circleX',\n    warning: 'circleTriangle',\n};\n//# sourceMappingURL=utils.js.map"],"names":[],"mappings":"AAAU,IAAC,cAAc,GAAG;AAC5B,IAAI,IAAI,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,EAAE,YAAY,EAAE,IAAI,EAAE,OAAO,EAAE;AAC9E,IAAI,OAAO,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE;AAC5E,IAAI,KAAK,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE;AACzE,IAAI,OAAO,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE;AAC9E,EAAE;AACQ,IAAC,YAAY,GAAG;AAC1B,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,aAAa;AAC1B,IAAI,KAAK,EAAE,SAAS;AACpB,IAAI,OAAO,EAAE,gBAAgB;AAC7B;;;;"}
+{"version":3,"file":"utils.js","sources":["../../../../packages/ui/Blocks/CornerDialog/utils.ts"],"sourcesContent":["export var statusToColors = {\n    info: { fontColor: 'gray1', backgroundColor: 'lightGray7', fill: 'gray1' },\n    success: { fontColor: 'white', backgroundColor: 'green', fill: 'white' },\n    error: { fontColor: 'white', backgroundColor: 'red1', fill: 'white' },\n    warning: { fontColor: 'blue2', backgroundColor: 'yellow1', fill: 'blue2' },\n};\nexport var statusToIcon = {\n    info: 'info',\n    success: 'circleCheck',\n    error: 'circleX',\n    warning: 'circleTriangle',\n};\n//# sourceMappingURL=utils.js.map"],"names":[],"mappings":";;AAAU,IAAC,cAAc,GAAG;AAC5B,IAAI,IAAI,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,EAAE,YAAY,EAAE,IAAI,EAAE,OAAO,EAAE;AAC9E,IAAI,OAAO,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE;AAC5E,IAAI,KAAK,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE;AACzE,IAAI,OAAO,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE;AAC9E,EAAE;AACQ,IAAC,YAAY,GAAG;AAC1B,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,aAAa;AAC1B,IAAI,KAAK,EAAE,SAAS;AACpB,IAAI,OAAO,EAAE,gBAAgB;AAC7B;;;;;"}

package/ui/Blocks/ImageList/ImageList.js

@@ -1,24 +1,26 @@
-import { __assign } from 'tslib';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useRef } from 'react';
-import { useDraggable } from 'react-use-draggable-scroll';
-import { LightBox } from '../LightBox/LightBox.js';
-import { useLightBox } from '../LightBox/hooks/useLightBox.js';
-import { AddPhoto } from './components/AddPhoto/index.js';
-import { ImageElement } from './components/ImageElement/index.js';
-import { x } from '@xstyled/styled-components';
-import { ImageListContainer } from './styles.js';
+'use strict';
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var reactUseDraggableScroll = require('react-use-draggable-scroll');
+var LightBox = require('../LightBox/LightBox.js');
+var useLightBox = require('../LightBox/hooks/useLightBox.js');
+var index = require('./components/AddPhoto/index.js');
+var index$1 = require('./components/ImageElement/index.js');
+var styled = require('@xstyled/styled-components');
+var styles = require('./styles.js');
 
 var ImageList = function (_a) {
-    var onImageUpload = _a.onImageUpload, onImageRemove = _a.onImageRemove, lightBoxAction = _a.lightBoxAction, lightBoxActionTitle = _a.lightBoxActionTitle, images = _a.images;
-    var ref = useRef();
-    var events = useDraggable(ref, { isMounted: !!(images === null || images === void 0 ? void 0 : images.length) }).events;
-    var _b = useLightBox(), isLightBoxOpen = _b.isLightBoxOpen, onCloseLightBox = _b.onCloseLightBox, onOpenLightBox = _b.onOpenLightBox, lightBoxData = _b.lightBoxData;
-    return (jsxs(x.div, { display: "flex", alignItems: "flex-end", children: [jsx(AddPhoto, { onImageUpload: onImageUpload }), images && (jsx(ImageListContainer, __assign({ ref: ref }, events, { children: images.map(function (item, index) {
+    var onImageUpload = _a.onImageUpload, onImageRemove = _a.onImageRemove, lightBoxAction = _a.lightBoxAction, lightBoxActionTitle = _a.lightBoxActionTitle, images = _a.images, isDisabled = _a.isDisabled;
+    var ref = React.useRef();
+    var events = reactUseDraggableScroll.useDraggable(ref, { isMounted: !!(images === null || images === void 0 ? void 0 : images.length) }).events;
+    var _b = useLightBox.useLightBox(), isLightBoxOpen = _b.isLightBoxOpen, onCloseLightBox = _b.onCloseLightBox, onOpenLightBox = _b.onOpenLightBox, lightBoxData = _b.lightBoxData;
+    return (jsxRuntime.jsxs(styled.x.div, { display: "flex", alignItems: "flex-end", children: [jsxRuntime.jsx(index.AddPhoto, { onImageUpload: onImageUpload, isDisabled: isDisabled }), images && (jsxRuntime.jsx(styles.ImageListContainer, tslib.__assign({ ref: ref }, events, { children: images.map(function (item, index) {
                     var _a, _b;
-                    return (jsx(ImageElement, { imageUrl: (_a = item.smallUrl) !== null && _a !== void 0 ? _a : item.url, onImageRemove: onImageRemove === null || onImageRemove === void 0 ? void 0 : onImageRemove(item.id), onOpenLightBox: onOpenLightBox(index) }, (_b = item.id) !== null && _b !== void 0 ? _b : index));
-                }) }))), jsx(LightBox, { initialSlide: lightBoxData === null || lightBoxData === void 0 ? void 0 : lightBoxData.initialSlide, isLightBoxOpen: isLightBoxOpen, onCloseLightBox: onCloseLightBox, lightBoxAction: lightBoxAction, lightBoxActionTitle: lightBoxActionTitle, images: images })] }));
+                    return (jsxRuntime.jsx(index$1.ImageElement, { imageUrl: (_a = item.smallUrl) !== null && _a !== void 0 ? _a : item.url, onImageRemove: onImageRemove === null || onImageRemove === void 0 ? void 0 : onImageRemove(item.id), onOpenLightBox: onOpenLightBox(index), isDisabled: isDisabled }, (_b = item.id) !== null && _b !== void 0 ? _b : index));
+                }) }))), jsxRuntime.jsx(LightBox.LightBox, { initialSlide: lightBoxData === null || lightBoxData === void 0 ? void 0 : lightBoxData.initialSlide, isLightBoxOpen: isLightBoxOpen, onCloseLightBox: onCloseLightBox, lightBoxAction: lightBoxAction, lightBoxActionTitle: lightBoxActionTitle, images: images })] }));
 };
 
-export { ImageList };
+exports.ImageList = ImageList;
 //# sourceMappingURL=ImageList.js.map

package/ui/Blocks/ImageList/ImageList.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageList.js","sources":["../../../../packages/ui/Blocks/ImageList/ImageList.tsx"],"sourcesContent":["import { __assign } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { useRef } from 'react';\nimport { useDraggable } from 'react-use-draggable-scroll';\nimport LightBox, { useLightBox } from '../LightBox';\nimport { AddPhoto } from './components/AddPhoto';\nimport { ImageElement } from './components/ImageElement';\nimport { x } from '@xstyled/styled-components';\nimport { ImageListContainer } from './styles';\nexport var ImageList = function (_a) {\n    var onImageUpload = _a.onImageUpload, onImageRemove = _a.onImageRemove, lightBoxAction = _a.lightBoxAction, lightBoxActionTitle = _a.lightBoxActionTitle, images = _a.images;\n    var ref = useRef();\n    var events = useDraggable(ref, { isMounted: !!(images === null || images === void 0 ? void 0 : images.length) }).events;\n    var _b = useLightBox(), isLightBoxOpen = _b.isLightBoxOpen, onCloseLightBox = _b.onCloseLightBox, onOpenLightBox = _b.onOpenLightBox, lightBoxData = _b.lightBoxData;\n    return (_jsxs(x.div, { display: \"flex\", alignItems: \"flex-end\", children: [_jsx(AddPhoto, { onImageUpload: onImageUpload }), images && (_jsx(ImageListContainer, __assign({ ref: ref }, events, { children: images.map(function (item, index) {\n                    var _a, _b;\n                    return (_jsx(ImageElement, { imageUrl: (_a = item.smallUrl) !== null && _a !== void 0 ? _a : item.url, onImageRemove: onImageRemove === null || onImageRemove === void 0 ? void 0 : onImageRemove(item.id), onOpenLightBox: onOpenLightBox(index) }, (_b = item.id) !== null && _b !== void 0 ? _b : index));\n                }) }))), _jsx(LightBox, { initialSlide: lightBoxData === null || lightBoxData === void 0 ? void 0 : lightBoxData.initialSlide, isLightBoxOpen: isLightBoxOpen, onCloseLightBox: onCloseLightBox, lightBoxAction: lightBoxAction, lightBoxActionTitle: lightBoxActionTitle, images: images })] }));\n};\n//# sourceMappingURL=ImageList.js.map"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;AASU,IAAC,SAAS,GAAG,UAAU,EAAE,EAAE;AACrC,IAAI,IAAI,aAAa,GAAG,EAAE,CAAC,aAAa,EAAE,aAAa,GAAG,EAAE,CAAC,aAAa,EAAE,cAAc,GAAG,EAAE,CAAC,cAAc,EAAE,mBAAmB,GAAG,EAAE,CAAC,mBAAmB,EAAE,MAAM,GAAG,EAAE,CAAC,MAAM,CAAC;AACjL,IAAI,IAAI,GAAG,GAAG,MAAM,EAAE,CAAC;AACvB,IAAI,IAAI,MAAM,GAAG,YAAY,CAAC,GAAG,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC;AAC5H,IAAI,IAAI,EAAE,GAAG,WAAW,EAAE,EAAE,cAAc,GAAG,EAAE,CAAC,cAAc,EAAE,eAAe,GAAG,EAAE,CAAC,eAAe,EAAE,cAAc,GAAG,EAAE,CAAC,cAAc,EAAE,YAAY,GAAG,EAAE,CAAC,YAAY,CAAC;AACzK,IAAI,QAAQA,IAAK,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,CAACC,GAAI,CAAC,QAAQ,EAAE,EAAE,aAAa,EAAE,aAAa,EAAE,CAAC,EAAE,MAAM,KAAKA,GAAI,CAAC,kBAAkB,EAAE,QAAQ,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,MAAM,CAAC,GAAG,CAAC,UAAU,IAAI,EAAE,KAAK,EAAE;AAClP,oBAAoB,IAAI,EAAE,EAAE,EAAE,CAAC;AAC/B,oBAAoB,QAAQA,GAAI,CAAC,YAAY,EAAE,EAAE,QAAQ,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,QAAQ,MAAM,IAAI,IAAI,EAAE,KAAK,KAAK,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE,aAAa,EAAE,aAAa,KAAK,IAAI,IAAI,aAAa,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,cAAc,EAAE,cAAc,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,MAAM,IAAI,IAAI,EAAE,KAAK,KAAK,CAAC,GAAG,EAAE,GAAG,KAAK,CAAC,EAAE;AACjU,iBAAiB,CAAC,EAAE,CAAC,CAAC,CAAC,EAAEA,GAAI,CAAC,QAAQ,EAAE,EAAE,YAAY,EAAE,YAAY,KAAK,IAAI,IAAI,YAAY,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,YAAY,CAAC,YAAY,EAAE,cAAc,EAAE,cAAc,EAAE,eAAe,EAAE,eAAe,EAAE,cAAc,EAAE,cAAc,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE;AAClT;;;;"}
+{"version":3,"file":"ImageList.js","sources":["../../../../packages/ui/Blocks/ImageList/ImageList.tsx"],"sourcesContent":["import { __assign } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { useRef } from 'react';\nimport { useDraggable } from 'react-use-draggable-scroll';\nimport LightBox, { useLightBox } from '../LightBox';\nimport { AddPhoto } from './components/AddPhoto';\nimport { ImageElement } from './components/ImageElement';\nimport { x } from '@xstyled/styled-components';\nimport { ImageListContainer } from './styles';\nexport var ImageList = function (_a) {\n    var onImageUpload = _a.onImageUpload, onImageRemove = _a.onImageRemove, lightBoxAction = _a.lightBoxAction, lightBoxActionTitle = _a.lightBoxActionTitle, images = _a.images, isDisabled = _a.isDisabled;\n    var ref = useRef();\n    var events = useDraggable(ref, { isMounted: !!(images === null || images === void 0 ? void 0 : images.length) }).events;\n    var _b = useLightBox(), isLightBoxOpen = _b.isLightBoxOpen, onCloseLightBox = _b.onCloseLightBox, onOpenLightBox = _b.onOpenLightBox, lightBoxData = _b.lightBoxData;\n    return (_jsxs(x.div, { display: \"flex\", alignItems: \"flex-end\", children: [_jsx(AddPhoto, { onImageUpload: onImageUpload, isDisabled: isDisabled }), images && (_jsx(ImageListContainer, __assign({ ref: ref }, events, { children: images.map(function (item, index) {\n                    var _a, _b;\n                    return (_jsx(ImageElement, { imageUrl: (_a = item.smallUrl) !== null && _a !== void 0 ? _a : item.url, onImageRemove: onImageRemove === null || onImageRemove === void 0 ? void 0 : onImageRemove(item.id), onOpenLightBox: onOpenLightBox(index), isDisabled: isDisabled }, (_b = item.id) !== null && _b !== void 0 ? _b : index));\n                }) }))), _jsx(LightBox, { initialSlide: lightBoxData === null || lightBoxData === void 0 ? void 0 : lightBoxData.initialSlide, isLightBoxOpen: isLightBoxOpen, onCloseLightBox: onCloseLightBox, lightBoxAction: lightBoxAction, lightBoxActionTitle: lightBoxActionTitle, images: images })] }));\n};\n//# sourceMappingURL=ImageList.js.map"],"names":["useRef","useDraggable","useLightBox","_jsxs","x","_jsx","AddPhoto","ImageListContainer","__assign","ImageElement","LightBox"],"mappings":";;;;;;;;;;;;;AASU,IAAC,SAAS,GAAG,UAAU,EAAE,EAAE;AACrC,IAAI,IAAI,aAAa,GAAG,EAAE,CAAC,aAAa,EAAE,aAAa,GAAG,EAAE,CAAC,aAAa,EAAE,cAAc,GAAG,EAAE,CAAC,cAAc,EAAE,mBAAmB,GAAG,EAAE,CAAC,mBAAmB,EAAE,MAAM,GAAG,EAAE,CAAC,MAAM,EAAE,UAAU,GAAG,EAAE,CAAC,UAAU,CAAC;AAC7M,IAAI,IAAI,GAAG,GAAGA,YAAM,EAAE,CAAC;AACvB,IAAI,IAAI,MAAM,GAAGC,oCAAY,CAAC,GAAG,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC;AAC5H,IAAI,IAAI,EAAE,GAAGC,uBAAW,EAAE,EAAE,cAAc,GAAG,EAAE,CAAC,cAAc,EAAE,eAAe,GAAG,EAAE,CAAC,eAAe,EAAE,cAAc,GAAG,EAAE,CAAC,cAAc,EAAE,YAAY,GAAG,EAAE,CAAC,YAAY,CAAC;AACzK,IAAI,QAAQC,eAAK,CAACC,QAAC,CAAC,GAAG,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,CAACC,cAAI,CAACC,cAAQ,EAAE,EAAE,aAAa,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,CAAC,EAAE,MAAM,KAAKD,cAAI,CAACE,yBAAkB,EAAEC,cAAQ,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,MAAM,CAAC,GAAG,CAAC,UAAU,IAAI,EAAE,KAAK,EAAE;AAC1Q,oBAAoB,IAAI,EAAE,EAAE,EAAE,CAAC;AAC/B,oBAAoB,QAAQH,cAAI,CAACI,oBAAY,EAAE,EAAE,QAAQ,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,QAAQ,MAAM,IAAI,IAAI,EAAE,KAAK,KAAK,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE,aAAa,EAAE,aAAa,KAAK,IAAI,IAAI,aAAa,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,cAAc,EAAE,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,EAAE,UAAU,EAAE,EAAE,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,MAAM,IAAI,IAAI,EAAE,KAAK,KAAK,CAAC,GAAG,EAAE,GAAG,KAAK,CAAC,EAAE;AACzV,iBAAiB,CAAC,EAAE,CAAC,CAAC,CAAC,EAAEJ,cAAI,CAACK,iBAAQ,EAAE,EAAE,YAAY,EAAE,YAAY,KAAK,IAAI,IAAI,YAAY,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,YAAY,CAAC,YAAY,EAAE,cAAc,EAAE,cAAc,EAAE,eAAe,EAAE,eAAe,EAAE,cAAc,EAAE,cAAc,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE;AAClT;;;;"}

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

@@ -1,23 +1,30 @@
-import { __awaiter, __generator } from 'tslib';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useCallback } from 'react';
-import { Container, HiddenInput } from './styles.js';
+'use strict';
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var styles = require('./styles.js');
+var AddPhoto$1 = require('../../../../Elements/Icon/icons/AddPhoto.js');
 
 var AddPhoto = function (_a) {
-    var onImageUpload = _a.onImageUpload;
-    var handleImageUpload = useCallback(function (event) {
+    var onImageUpload = _a.onImageUpload, isDisabled = _a.isDisabled;
+    var handleImageUpload = React.useCallback(function (event) {
         var _a, _b;
         if (!((_b = (_a = event.target) === null || _a === void 0 ? void 0 : _a.files) === null || _b === void 0 ? void 0 : _b[0]))
             return;
         var reader = new FileReader();
         reader.readAsDataURL(event.target.files[0]);
-        reader.onload = function () { return __awaiter(void 0, void 0, void 0, function () {
-            var _a;
-            return __generator(this, function (_b) {
-                switch (_b.label) {
-                    case 0: return [4 /*yield*/, (onImageUpload === null || onImageUpload === void 0 ? void 0 : onImageUpload({ base64: reader.result, file: (_a = event.target.files) === null || _a === void 0 ? void 0 : _a[0] }))];
+        reader.onload = function () { return tslib.__awaiter(void 0, void 0, void 0, function () {
+            var _a, _b;
+            return tslib.__generator(this, function (_c) {
+                switch (_c.label) {
+                    case 0: return [4 /*yield*/, (onImageUpload === null || onImageUpload === void 0 ? void 0 : onImageUpload({
+                            base64image: (_a = reader.result) === null || _a === void 0 ? void 0 : _a.split(',').pop(),
+                            base64WithDataDeclaration: reader.result,
+                            file: (_b = event.target.files) === null || _b === void 0 ? void 0 : _b[0],
+                        }))];
                     case 1:
-                        _b.sent();
+                        _c.sent();
                         return [2 /*return*/];
                 }
             });
@@ -25,8 +32,8 @@ var AddPhoto = function (_a) {
     }, [onImageUpload]);
     if (!onImageUpload)
         return null;
-    return (jsxs(Container, { children: [jsx(HiddenInput, { onChange: handleImageUpload, type: "file", accept: "image/*" }), jsxs("svg", { width: "36", height: "36", viewBox: "0 0 37 34", fill: "#DB2B19", xmlns: "http://www.w3.org/2000/svg", children: [jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.82792 6.14124C10.7187 5.25044 11.9269 4.75 13.1867 4.75H19C19.8745 4.75 20.5833 5.45889 20.5833 6.33333C20.5833 7.20778 19.8745 7.91667 19 7.91667H13.1867C12.7668 7.91667 12.364 8.08349 12.0671 8.38041L10.7554 9.69209C9.86461 10.5829 8.65643 11.0833 7.39665 11.0833H4.75C3.87556 11.0833 3.16667 11.7922 3.16667 12.6667V28.5C3.16667 29.3745 3.87556 30.0833 4.75 30.0833H26.9167C27.7911 30.0833 28.5 29.3745 28.5 28.5V17.4167C28.5 16.5422 29.2089 15.8333 30.0833 15.8333C30.9578 15.8333 31.6667 16.5422 31.6667 17.4167V28.5C31.6667 31.1234 29.5401 33.25 26.9167 33.25H4.75C2.12665 33.25 0 31.1234 0 28.5V12.6667C0 10.0433 2.12665 7.91667 4.75 7.91667H7.39665C7.81658 7.91667 8.21931 7.74985 8.51624 7.45292L9.82792 6.14124Z" }), jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7.9165 20.5834C7.9165 16.2112 11.4609 12.6667 15.8332 12.6667C20.2054 12.6667 23.7498 16.2112 23.7498 20.5834C23.7498 24.9556 20.2054 28.5001 15.8332 28.5001C11.4609 28.5001 7.9165 24.9556 7.9165 20.5834ZM15.8332 15.8334C13.2098 15.8334 11.0832 17.96 11.0832 20.5834C11.0832 23.2068 13.2098 25.3334 15.8332 25.3334C18.4566 25.3334 20.5832 23.2068 20.5832 20.5834C20.5832 17.96 18.4566 15.8334 15.8332 15.8334Z" }), jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M23.75 6.33333C23.75 5.45889 24.4589 4.75 25.3333 4.75H34.8333C35.7078 4.75 36.4167 5.45889 36.4167 6.33333C36.4167 7.20778 35.7078 7.91667 34.8333 7.91667H25.3333C24.4589 7.91667 23.75 7.20778 23.75 6.33333Z" }), jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M30.0833 0C30.9578 0 31.6667 0.70889 31.6667 1.58333V11.0833C31.6667 11.9578 30.9578 12.6667 30.0833 12.6667C29.2089 12.6667 28.5 11.9578 28.5 11.0833V1.58333C28.5 0.70889 29.2089 0 30.0833 0Z" })] })] }));
+    return (jsxRuntime.jsxs(styles.Container, { isDisabled: isDisabled, children: [jsxRuntime.jsx(styles.HiddenInput, { disabled: isDisabled, onChange: handleImageUpload, type: "file", accept: "image/*" }), jsxRuntime.jsx(AddPhoto$1.AddPhoto, { width: "36", height: "36" })] }));
 };
 
-export { AddPhoto };
+exports.AddPhoto = AddPhoto;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/AddPhoto/index.tsx"],"sourcesContent":["import { __awaiter, __generator } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { useCallback } from 'react';\nimport { Container, HiddenInput } from './styles';\nexport var AddPhoto = function (_a) {\n    var onImageUpload = _a.onImageUpload;\n    var handleImageUpload = useCallback(function (event) {\n        var _a, _b;\n        if (!((_b = (_a = event.target) === null || _a === void 0 ? void 0 : _a.files) === null || _b === void 0 ? void 0 : _b[0]))\n            return;\n        var reader = new FileReader();\n        reader.readAsDataURL(event.target.files[0]);\n        reader.onload = function () { return __awaiter(void 0, void 0, void 0, function () {\n            var _a;\n            return __generator(this, function (_b) {\n                switch (_b.label) {\n                    case 0: return [4 /*yield*/, (onImageUpload === null || onImageUpload === void 0 ? void 0 : onImageUpload({ base64: reader.result, file: (_a = event.target.files) === null || _a === void 0 ? void 0 : _a[0] }))];\n                    case 1:\n                        _b.sent();\n                        return [2 /*return*/];\n                }\n            });\n        }); };\n    }, [onImageUpload]);\n    if (!onImageUpload)\n        return null;\n    return (_jsxs(Container, { children: [_jsx(HiddenInput, { onChange: handleImageUpload, type: \"file\", accept: \"image/*\" }), _jsxs(\"svg\", { width: \"36\", height: \"36\", viewBox: \"0 0 37 34\", fill: \"#DB2B19\", xmlns: \"http://www.w3.org/2000/svg\", children: [_jsx(\"path\", { fillRule: \"evenodd\", clipRule: \"evenodd\", d: \"M9.82792 6.14124C10.7187 5.25044 11.9269 4.75 13.1867 4.75H19C19.8745 4.75 20.5833 5.45889 20.5833 6.33333C20.5833 7.20778 19.8745 7.91667 19 7.91667H13.1867C12.7668 7.91667 12.364 8.08349 12.0671 8.38041L10.7554 9.69209C9.86461 10.5829 8.65643 11.0833 7.39665 11.0833H4.75C3.87556 11.0833 3.16667 11.7922 3.16667 12.6667V28.5C3.16667 29.3745 3.87556 30.0833 4.75 30.0833H26.9167C27.7911 30.0833 28.5 29.3745 28.5 28.5V17.4167C28.5 16.5422 29.2089 15.8333 30.0833 15.8333C30.9578 15.8333 31.6667 16.5422 31.6667 17.4167V28.5C31.6667 31.1234 29.5401 33.25 26.9167 33.25H4.75C2.12665 33.25 0 31.1234 0 28.5V12.6667C0 10.0433 2.12665 7.91667 4.75 7.91667H7.39665C7.81658 7.91667 8.21931 7.74985 8.51624 7.45292L9.82792 6.14124Z\" }), _jsx(\"path\", { fillRule: \"evenodd\", clipRule: \"evenodd\", d: \"M7.9165 20.5834C7.9165 16.2112 11.4609 12.6667 15.8332 12.6667C20.2054 12.6667 23.7498 16.2112 23.7498 20.5834C23.7498 24.9556 20.2054 28.5001 15.8332 28.5001C11.4609 28.5001 7.9165 24.9556 7.9165 20.5834ZM15.8332 15.8334C13.2098 15.8334 11.0832 17.96 11.0832 20.5834C11.0832 23.2068 13.2098 25.3334 15.8332 25.3334C18.4566 25.3334 20.5832 23.2068 20.5832 20.5834C20.5832 17.96 18.4566 15.8334 15.8332 15.8334Z\" }), _jsx(\"path\", { fillRule: \"evenodd\", clipRule: \"evenodd\", d: \"M23.75 6.33333C23.75 5.45889 24.4589 4.75 25.3333 4.75H34.8333C35.7078 4.75 36.4167 5.45889 36.4167 6.33333C36.4167 7.20778 35.7078 7.91667 34.8333 7.91667H25.3333C24.4589 7.91667 23.75 7.20778 23.75 6.33333Z\" }), _jsx(\"path\", { fillRule: \"evenodd\", clipRule: \"evenodd\", d: \"M30.0833 0C30.9578 0 31.6667 0.70889 31.6667 1.58333V11.0833C31.6667 11.9578 30.9578 12.6667 30.0833 12.6667C29.2089 12.6667 28.5 11.9578 28.5 11.0833V1.58333C28.5 0.70889 29.2089 0 30.0833 0Z\" })] })] }));\n};\n//# sourceMappingURL=index.js.map"],"names":["_jsxs","_jsx"],"mappings":";;;;;AAIU,IAAC,QAAQ,GAAG,UAAU,EAAE,EAAE;AACpC,IAAI,IAAI,aAAa,GAAG,EAAE,CAAC,aAAa,CAAC;AACzC,IAAI,IAAI,iBAAiB,GAAG,WAAW,CAAC,UAAU,KAAK,EAAE;AACzD,QAAQ,IAAI,EAAE,EAAE,EAAE,CAAC;AACnB,QAAQ,IAAI,EAAE,CAAC,EAAE,GAAG,CAAC,EAAE,GAAG,KAAK,CAAC,MAAM,MAAM,IAAI,IAAI,EAAE,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,KAAK,MAAM,IAAI,IAAI,EAAE,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC;AAClI,YAAY,OAAO;AACnB,QAAQ,IAAI,MAAM,GAAG,IAAI,UAAU,EAAE,CAAC;AACtC,QAAQ,MAAM,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AACpD,QAAQ,MAAM,CAAC,MAAM,GAAG,YAAY,EAAE,OAAO,SAAS,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,YAAY;AAC3F,YAAY,IAAI,EAAE,CAAC;AACnB,YAAY,OAAO,WAAW,CAAC,IAAI,EAAE,UAAU,EAAE,EAAE;AACnD,gBAAgB,QAAQ,EAAE,CAAC,KAAK;AAChC,oBAAoB,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC,aAAa,aAAa,KAAK,IAAI,IAAI,aAAa,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,aAAa,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,MAAM,IAAI,IAAI,EAAE,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC;AACvO,oBAAoB,KAAK,CAAC;AAC1B,wBAAwB,EAAE,CAAC,IAAI,EAAE,CAAC;AAClC,wBAAwB,OAAO,CAAC,CAAC,YAAY,CAAC;AAC9C,iBAAiB;AACjB,aAAa,CAAC,CAAC;AACf,SAAS,CAAC,CAAC,EAAE,CAAC;AACd,KAAK,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;AACxB,IAAI,IAAI,CAAC,aAAa;AACtB,QAAQ,OAAO,IAAI,CAAC;AACpB,IAAI,QAAQA,IAAK,CAAC,SAAS,EAAE,EAAE,QAAQ,EAAE,CAACC,GAAI,CAAC,WAAW,EAAE,EAAE,QAAQ,EAAE,iBAAiB,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,EAAED,IAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,4BAA4B,EAAE,QAAQ,EAAE,CAACC,GAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAAE,stBAAstB,EAAE,CAAC,EAAEA,GAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAAE,4ZAA4Z,EAAE,CAAC,EAAEA,GAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAAE,kNAAkN,EAAE,CAAC,EAAEA,GAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAAE,kMAAkM,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE;AAClhE;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/AddPhoto/index.tsx"],"sourcesContent":["import { __awaiter, __generator } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { useCallback } from 'react';\nimport { Container, HiddenInput } from './styles';\nimport { AddPhoto as AddPhotoIcon } from '../../../../Elements/Icon/icons/AddPhoto';\nexport var AddPhoto = function (_a) {\n    var onImageUpload = _a.onImageUpload, isDisabled = _a.isDisabled;\n    var handleImageUpload = useCallback(function (event) {\n        var _a, _b;\n        if (!((_b = (_a = event.target) === null || _a === void 0 ? void 0 : _a.files) === null || _b === void 0 ? void 0 : _b[0]))\n            return;\n        var reader = new FileReader();\n        reader.readAsDataURL(event.target.files[0]);\n        reader.onload = function () { return __awaiter(void 0, void 0, void 0, function () {\n            var _a, _b;\n            return __generator(this, function (_c) {\n                switch (_c.label) {\n                    case 0: return [4 /*yield*/, (onImageUpload === null || onImageUpload === void 0 ? void 0 : onImageUpload({\n                            base64image: (_a = reader.result) === null || _a === void 0 ? void 0 : _a.split(',').pop(),\n                            base64WithDataDeclaration: reader.result,\n                            file: (_b = event.target.files) === null || _b === void 0 ? void 0 : _b[0],\n                        }))];\n                    case 1:\n                        _c.sent();\n                        return [2 /*return*/];\n                }\n            });\n        }); };\n    }, [onImageUpload]);\n    if (!onImageUpload)\n        return null;\n    return (_jsxs(Container, { isDisabled: isDisabled, children: [_jsx(HiddenInput, { disabled: isDisabled, onChange: handleImageUpload, type: \"file\", accept: \"image/*\" }), _jsx(AddPhotoIcon, { width: \"36\", height: \"36\" })] }));\n};\n//# sourceMappingURL=index.js.map"],"names":["useCallback","__awaiter","__generator","_jsxs","Container","_jsx","HiddenInput","AddPhotoIcon"],"mappings":";;;;;;;;AAKU,IAAC,QAAQ,GAAG,UAAU,EAAE,EAAE;AACpC,IAAI,IAAI,aAAa,GAAG,EAAE,CAAC,aAAa,EAAE,UAAU,GAAG,EAAE,CAAC,UAAU,CAAC;AACrE,IAAI,IAAI,iBAAiB,GAAGA,iBAAW,CAAC,UAAU,KAAK,EAAE;AACzD,QAAQ,IAAI,EAAE,EAAE,EAAE,CAAC;AACnB,QAAQ,IAAI,EAAE,CAAC,EAAE,GAAG,CAAC,EAAE,GAAG,KAAK,CAAC,MAAM,MAAM,IAAI,IAAI,EAAE,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,KAAK,MAAM,IAAI,IAAI,EAAE,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC;AAClI,YAAY,OAAO;AACnB,QAAQ,IAAI,MAAM,GAAG,IAAI,UAAU,EAAE,CAAC;AACtC,QAAQ,MAAM,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AACpD,QAAQ,MAAM,CAAC,MAAM,GAAG,YAAY,EAAE,OAAOC,eAAS,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,YAAY;AAC3F,YAAY,IAAI,EAAE,EAAE,EAAE,CAAC;AACvB,YAAY,OAAOC,iBAAW,CAAC,IAAI,EAAE,UAAU,EAAE,EAAE;AACnD,gBAAgB,QAAQ,EAAE,CAAC,KAAK;AAChC,oBAAoB,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC,aAAa,aAAa,KAAK,IAAI,IAAI,aAAa,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,aAAa,CAAC;AAC9H,4BAA4B,WAAW,EAAE,CAAC,EAAE,GAAG,MAAM,CAAC,MAAM,MAAM,IAAI,IAAI,EAAE,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE;AACtH,4BAA4B,yBAAyB,EAAE,MAAM,CAAC,MAAM;AACpE,4BAA4B,IAAI,EAAE,CAAC,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,MAAM,IAAI,IAAI,EAAE,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;AACtG,yBAAyB,CAAC,EAAE,CAAC;AAC7B,oBAAoB,KAAK,CAAC;AAC1B,wBAAwB,EAAE,CAAC,IAAI,EAAE,CAAC;AAClC,wBAAwB,OAAO,CAAC,CAAC,YAAY,CAAC;AAC9C,iBAAiB;AACjB,aAAa,CAAC,CAAC;AACf,SAAS,CAAC,CAAC,EAAE,CAAC;AACd,KAAK,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;AACxB,IAAI,IAAI,CAAC,aAAa;AACtB,QAAQ,OAAO,IAAI,CAAC;AACpB,IAAI,QAAQC,eAAK,CAACC,gBAAS,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,CAACC,cAAI,CAACC,kBAAW,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,iBAAiB,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,EAAED,cAAI,CAACE,mBAAY,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE;AACpO;;;;"}

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

@@ -1,9 +1,19 @@
-import { __makeTemplateObject } from 'tslib';
-import styled, { th } from '@xstyled/styled-components';
+'use strict';
 
-var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  flex-shrink: 0;\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"], ["\n  position: relative;\n  flex-shrink: 0;\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"])), th.radius('lg'), th.border('mediumSlim'), th.color('red1'));
-var HiddenInput = styled.input(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  opacity: 0;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n"], ["\n  opacity: 0;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n"])));
+var tslib = require('tslib');
+var styled = require('@xstyled/styled-components');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
+
+var Container = styled__default.default.div(templateObject_1 || (templateObject_1 = tslib.__makeTemplateObject(["\n  position: relative;\n  flex-shrink: 0;\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"], ["\n  position: relative;\n  flex-shrink: 0;\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"])), styled.th.radius('lg'), styled.th.border('mediumSlim'), styled.th.color('red1'), function (_a) {
+    var isDisabled = _a.isDisabled;
+    return (isDisabled ? 0.6 : 1);
+});
+var HiddenInput = styled__default.default.input(templateObject_2 || (templateObject_2 = tslib.__makeTemplateObject(["\n  opacity: 0;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n"], ["\n  opacity: 0;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n"])));
 var templateObject_1, templateObject_2;
 
-export { Container, HiddenInput };
+exports.Container = Container;
+exports.HiddenInput = HiddenInput;
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/AddPhoto/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport styled, { th } from '@xstyled/styled-components';\nexport var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n  position: relative;\\n  flex-shrink: 0;\\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\"], [\"\\n  position: relative;\\n  flex-shrink: 0;\\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\"])), th.radius('lg'), th.border('mediumSlim'), th.color('red1'));\nexport var HiddenInput = styled.input(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n  opacity: 0;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  width: 100%;\\n  height: 100%;\\n  cursor: pointer;\\n\"], [\"\\n  opacity: 0;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  width: 100%;\\n  height: 100%;\\n  cursor: pointer;\\n\"])));\nvar templateObject_1, templateObject_2;\n//# sourceMappingURL=styles.js.map"],"names":[],"mappings":";;;AAEU,IAAC,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,sHAAsH,EAAE,eAAe,EAAE,qBAAqB,EAAE,sHAAsH,CAAC,EAAE,CAAC,sHAAsH,EAAE,eAAe,EAAE,qBAAqB,EAAE,sHAAsH,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE;AACvsB,IAAC,WAAW,GAAG,MAAM,CAAC,KAAK,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,sHAAsH,CAAC,EAAE,CAAC,sHAAsH,CAAC,CAAC,CAAC,EAAE;AACzV,IAAI,gBAAgB,EAAE,gBAAgB;;;;"}
+{"version":3,"file":"styles.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/AddPhoto/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport styled, { th } from '@xstyled/styled-components';\nexport var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n  position: relative;\\n  flex-shrink: 0;\\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\"], [\"\\n  position: relative;\\n  flex-shrink: 0;\\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\"])), th.radius('lg'), th.border('mediumSlim'), th.color('red1'), function (_a) {\n    var isDisabled = _a.isDisabled;\n    return (isDisabled ? 0.6 : 1);\n});\nexport var HiddenInput = styled.input(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n  opacity: 0;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  width: 100%;\\n  height: 100%;\\n  cursor: pointer;\\n\"], [\"\\n  opacity: 0;\\n  position: absolute;\\n  top: 0;\\n  left: 0;\\n  width: 100%;\\n  height: 100%;\\n  cursor: pointer;\\n\"])));\nvar templateObject_1, templateObject_2;\n//# sourceMappingURL=styles.js.map"],"names":["styled","__makeTemplateObject","th"],"mappings":";;;;;;;;;AAEU,IAAC,SAAS,GAAGA,uBAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAGC,0BAAoB,CAAC,CAAC,sHAAsH,EAAE,eAAe,EAAE,qBAAqB,EAAE,iIAAiI,EAAE,KAAK,CAAC,EAAE,CAAC,sHAAsH,EAAE,eAAe,EAAE,qBAAqB,EAAE,iIAAiI,EAAE,KAAK,CAAC,CAAC,CAAC,EAAEC,SAAE,CAAC,MAAM,CAAC,IAAI,CAAC,EAAEA,SAAE,CAAC,MAAM,CAAC,YAAY,CAAC,EAAEA,SAAE,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,UAAU,EAAE,EAAE;AACnwB,IAAI,IAAI,UAAU,GAAG,EAAE,CAAC,UAAU,CAAC;AACnC,IAAI,QAAQ,UAAU,GAAG,GAAG,GAAG,CAAC,EAAE;AAClC,CAAC,EAAE;AACO,IAAC,WAAW,GAAGF,uBAAM,CAAC,KAAK,CAAC,gBAAgB,KAAK,gBAAgB,GAAGC,0BAAoB,CAAC,CAAC,sHAAsH,CAAC,EAAE,CAAC,sHAAsH,CAAC,CAAC,CAAC,EAAE;AACzV,IAAI,gBAAgB,EAAE,gBAAgB;;;;;"}

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

@@ -1,12 +1,14 @@
-import { jsx } from 'react/jsx-runtime';
-import Icon from '../../../../Elements/Icon/Icon.js';
-import 'tslib';
-import { Container } from './styles.js';
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var Icon = require('../../../../Elements/Icon/Icon.js');
+require('tslib');
+var styles = require('./styles.js');
 
 var CloseButton = function (_a) {
-    var onImageRemove = _a.onImageRemove;
-    return (jsx(Container, { onClick: onImageRemove, children: jsx(Icon, { icon: "close", size: "22px", fill: "red1" }) }));
+    var onImageRemove = _a.onImageRemove, isDisabled = _a.isDisabled;
+    return (jsxRuntime.jsx(styles.Container, { onClick: !isDisabled ? onImageRemove : undefined, isDisabled: isDisabled, children: jsxRuntime.jsx(Icon.default, { icon: "close", size: "22px", fill: isDisabled ? 'white' : 'red1' }) }));
 };
 
-export { CloseButton };
+exports.CloseButton = CloseButton;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/CloseButton/index.tsx"],"sourcesContent":["import { jsx as _jsx } from \"react/jsx-runtime\";\nimport { Icon } from '../../../../Elements/Icon';\nimport { Container } from './styles';\nexport var CloseButton = function (_a) {\n    var onImageRemove = _a.onImageRemove;\n    return (_jsx(Container, { onClick: onImageRemove, children: _jsx(Icon, { icon: \"close\", size: \"22px\", fill: \"red1\" }) }));\n};\n//# sourceMappingURL=index.js.map"],"names":["_jsx"],"mappings":";;;;;AAGU,IAAC,WAAW,GAAG,UAAU,EAAE,EAAE;AACvC,IAAI,IAAI,aAAa,GAAG,EAAE,CAAC,aAAa,CAAC;AACzC,IAAI,QAAQA,GAAI,CAAC,SAAS,EAAE,EAAE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAEA,GAAI,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE;AAC9H;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/CloseButton/index.tsx"],"sourcesContent":["import { jsx as _jsx } from \"react/jsx-runtime\";\nimport { Icon } from '../../../../Elements/Icon';\nimport { Container } from './styles';\nexport var CloseButton = function (_a) {\n    var onImageRemove = _a.onImageRemove, isDisabled = _a.isDisabled;\n    return (_jsx(Container, { onClick: !isDisabled ? onImageRemove : undefined, isDisabled: isDisabled, children: _jsx(Icon, { icon: \"close\", size: \"22px\", fill: isDisabled ? 'white' : 'red1' }) }));\n};\n//# sourceMappingURL=index.js.map"],"names":["_jsx","Container","Icon"],"mappings":";;;;;;;AAGU,IAAC,WAAW,GAAG,UAAU,EAAE,EAAE;AACvC,IAAI,IAAI,aAAa,GAAG,EAAE,CAAC,aAAa,EAAE,UAAU,GAAG,EAAE,CAAC,UAAU,CAAC;AACrE,IAAI,QAAQA,cAAI,CAACC,gBAAS,EAAE,EAAE,OAAO,EAAE,CAAC,UAAU,GAAG,aAAa,GAAG,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAED,cAAI,CAACE,YAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,GAAG,OAAO,GAAG,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE;AACvM;;;;"}

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

@@ -1,8 +1,17 @@
-import { __makeTemplateObject } from 'tslib';
-import styled, { th } from '@xstyled/styled-components';
+'use strict';
 
-var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 30px;\n  height: 30px;\n  background-color: ", ";\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n"], ["\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 30px;\n  height: 30px;\n  background-color: ", ";\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n"])), th.color('red20'));
+var tslib = require('tslib');
+var styled = require('@xstyled/styled-components');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
+
+var Container = styled__default.default.div(templateObject_1 || (templateObject_1 = tslib.__makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 30px;\n  height: 30px;\n  background-color: ", ";\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n"], ["\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 30px;\n  height: 30px;\n  background-color: ", ";\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n"])), function (_a) {
+    var isDisabled = _a.isDisabled;
+    return (isDisabled ? 'bgLightGray1' : 'red20');
+});
 var templateObject_1;
 
-export { Container };
+exports.Container = Container;
 //# sourceMappingURL=styles.js.map

package/ui/Blocks/ImageList/components/CloseButton/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/CloseButton/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport styled, { th } from '@xstyled/styled-components';\nexport var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n  position: absolute;\\n  top: 0;\\n  right: 0;\\n  width: 30px;\\n  height: 30px;\\n  background-color: \", \";\\n  border-radius: 50%;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  cursor: pointer;\\n\"], [\"\\n  position: absolute;\\n  top: 0;\\n  right: 0;\\n  width: 30px;\\n  height: 30px;\\n  background-color: \", \";\\n  border-radius: 50%;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  cursor: pointer;\\n\"])), th.color('red20'));\nvar templateObject_1;\n//# sourceMappingURL=styles.js.map"],"names":[],"mappings":";;;AAEU,IAAC,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,wGAAwG,EAAE,sHAAsH,CAAC,EAAE,CAAC,wGAAwG,EAAE,sHAAsH,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE;AAC5jB,IAAI,gBAAgB;;;;"}
+{"version":3,"file":"styles.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/CloseButton/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport styled from '@xstyled/styled-components';\nexport var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n  position: absolute;\\n  top: 0;\\n  right: 0;\\n  width: 30px;\\n  height: 30px;\\n  background-color: \", \";\\n  border-radius: 50%;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  cursor: pointer;\\n\"], [\"\\n  position: absolute;\\n  top: 0;\\n  right: 0;\\n  width: 30px;\\n  height: 30px;\\n  background-color: \", \";\\n  border-radius: 50%;\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  cursor: pointer;\\n\"])), function (_a) {\n    var isDisabled = _a.isDisabled;\n    return (isDisabled ? 'bgLightGray1' : 'red20');\n});\nvar templateObject_1;\n//# sourceMappingURL=styles.js.map"],"names":["styled","__makeTemplateObject"],"mappings":";;;;;;;;;AAEU,IAAC,SAAS,GAAGA,uBAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAGC,0BAAoB,CAAC,CAAC,wGAAwG,EAAE,sHAAsH,CAAC,EAAE,CAAC,wGAAwG,EAAE,sHAAsH,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE;AACvjB,IAAI,IAAI,UAAU,GAAG,EAAE,CAAC,UAAU,CAAC;AACnC,IAAI,QAAQ,UAAU,GAAG,cAAc,GAAG,OAAO,EAAE;AACnD,CAAC,EAAE;AACH,IAAI,gBAAgB;;;;"}

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

@@ -1,15 +1,17 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { Image } from './styles.js';
-import { ImageTag } from '../ImageTag/index.js';
-import { CloseButton } from '../CloseButton/index.js';
-import { x } from '@xstyled/styled-components';
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var styles = require('./styles.js');
+var index$1 = require('../ImageTag/index.js');
+var index = require('../CloseButton/index.js');
+var styled = require('@xstyled/styled-components');
 
 var ImageElement = function (_a) {
-    var label = _a.label, onImageRemove = _a.onImageRemove, onOpenLightBox = _a.onOpenLightBox, imageUrl = _a.imageUrl;
+    var label = _a.label, onImageRemove = _a.onImageRemove, isDisabled = _a.isDisabled, onOpenLightBox = _a.onOpenLightBox, imageUrl = _a.imageUrl;
     if (!imageUrl)
         return null;
-    return (jsxs(x.div, { position: "relative", pr: "15px", pt: "15px", w: "100px", children: [jsx(Image, { src: imageUrl, alt: "", width: "85px", height: "85px", onClick: onOpenLightBox }), onImageRemove && jsx(CloseButton, { onImageRemove: onImageRemove }), jsx(ImageTag, { label: label })] }));
+    return (jsxRuntime.jsxs(styled.x.div, { position: "relative", pr: "15px", pt: "15px", w: "100px", children: [jsxRuntime.jsx(styles.Image, { src: imageUrl, alt: "", width: "85px", height: "85px", onClick: onOpenLightBox }), onImageRemove && jsxRuntime.jsx(index.CloseButton, { onImageRemove: onImageRemove, isDisabled: isDisabled }), jsxRuntime.jsx(index$1.ImageTag, { label: label })] }));
 };
 
-export { ImageElement };
+exports.ImageElement = ImageElement;
 //# sourceMappingURL=index.js.map

package/ui/Blocks/ImageList/components/ImageElement/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/ImageElement/index.tsx"],"sourcesContent":["import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { Image } from './styles';\nimport { ImageTag } from '../ImageTag';\nimport { CloseButton } from '../CloseButton';\nimport { x } from '@xstyled/styled-components';\nexport var ImageElement = function (_a) {\n    var label = _a.label, onImageRemove = _a.onImageRemove, onOpenLightBox = _a.onOpenLightBox, imageUrl = _a.imageUrl;\n    if (!imageUrl)\n        return null;\n    return (_jsxs(x.div, { position: \"relative\", pr: \"15px\", pt: \"15px\", w: \"100px\", children: [_jsx(Image, { src: imageUrl, alt: \"\", width: \"85px\", height: \"85px\", onClick: onOpenLightBox }), onImageRemove && _jsx(CloseButton, { onImageRemove: onImageRemove }), _jsx(ImageTag, { label: label })] }));\n};\n//# sourceMappingURL=index.js.map"],"names":["_jsxs","_jsx"],"mappings":";;;;;;AAKU,IAAC,YAAY,GAAG,UAAU,EAAE,EAAE;AACxC,IAAI,IAAI,KAAK,GAAG,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,EAAE,CAAC,aAAa,EAAE,cAAc,GAAG,EAAE,CAAC,cAAc,EAAE,QAAQ,GAAG,EAAE,CAAC,QAAQ,CAAC;AACvH,IAAI,IAAI,CAAC,QAAQ;AACjB,QAAQ,OAAO,IAAI,CAAC;AACpB,IAAI,QAAQA,IAAK,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,CAACC,GAAI,CAAC,KAAK,EAAE,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,CAAC,EAAE,aAAa,IAAIA,GAAI,CAAC,WAAW,EAAE,EAAE,aAAa,EAAE,aAAa,EAAE,CAAC,EAAEA,GAAI,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE;AAC7S;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/ImageElement/index.tsx"],"sourcesContent":["import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { Image } from './styles';\nimport { ImageTag } from '../ImageTag';\nimport { CloseButton } from '../CloseButton';\nimport { x } from '@xstyled/styled-components';\nexport var ImageElement = function (_a) {\n    var label = _a.label, onImageRemove = _a.onImageRemove, isDisabled = _a.isDisabled, onOpenLightBox = _a.onOpenLightBox, imageUrl = _a.imageUrl;\n    if (!imageUrl)\n        return null;\n    return (_jsxs(x.div, { position: \"relative\", pr: \"15px\", pt: \"15px\", w: \"100px\", children: [_jsx(Image, { src: imageUrl, alt: \"\", width: \"85px\", height: \"85px\", onClick: onOpenLightBox }), onImageRemove && _jsx(CloseButton, { onImageRemove: onImageRemove, isDisabled: isDisabled }), _jsx(ImageTag, { label: label })] }));\n};\n//# sourceMappingURL=index.js.map"],"names":["_jsxs","x","_jsx","Image","CloseButton","ImageTag"],"mappings":";;;;;;;;AAKU,IAAC,YAAY,GAAG,UAAU,EAAE,EAAE;AACxC,IAAI,IAAI,KAAK,GAAG,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,EAAE,CAAC,aAAa,EAAE,UAAU,GAAG,EAAE,CAAC,UAAU,EAAE,cAAc,GAAG,EAAE,CAAC,cAAc,EAAE,QAAQ,GAAG,EAAE,CAAC,QAAQ,CAAC;AACnJ,IAAI,IAAI,CAAC,QAAQ;AACjB,QAAQ,OAAO,IAAI,CAAC;AACpB,IAAI,QAAQA,eAAK,CAACC,QAAC,CAAC,GAAG,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,CAACC,cAAI,CAACC,YAAK,EAAE,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,CAAC,EAAE,aAAa,IAAID,cAAI,CAACE,iBAAW,EAAE,EAAE,aAAa,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,CAAC,EAAEF,cAAI,CAACG,gBAAQ,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE;AACrU;;;;"}

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

@@ -1,9 +1,15 @@
-import { __makeTemplateObject } from 'tslib';
-import styled, { th } from '@xstyled/styled-components';
+'use strict';
 
-styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
-var Image = styled.img(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  border-radius: ", ";\n"], ["\n  border-radius: ", ";\n"])), th.radius('lg'));
+var tslib = require('tslib');
+var styled = require('@xstyled/styled-components');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
+
+styled__default.default.div(templateObject_1 || (templateObject_1 = tslib.__makeTemplateObject([""], [""])));
+var Image = styled__default.default.img(templateObject_2 || (templateObject_2 = tslib.__makeTemplateObject(["\n  border-radius: ", ";\n"], ["\n  border-radius: ", ";\n"])), styled.th.radius('lg'));
 var templateObject_1, templateObject_2;
 
-export { Image };
+exports.Image = Image;
 //# sourceMappingURL=styles.js.map

package/ui/Blocks/ImageList/components/ImageElement/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/ImageElement/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport styled, { th } from '@xstyled/styled-components';\nexport var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\"], [\"\"])));\nexport var Image = styled.img(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n  border-radius: \", \";\\n\"], [\"\\n  border-radius: \", \";\\n\"])), th.radius('lg'));\nvar templateObject_1, templateObject_2;\n//# sourceMappingURL=styles.js.map"],"names":[],"mappings":";;;AAEuB,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE;AACnG,IAAC,KAAK,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;AAC9K,IAAI,gBAAgB,EAAE,gBAAgB;;;;"}
+{"version":3,"file":"styles.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/ImageElement/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport styled, { th } from '@xstyled/styled-components';\nexport var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\"], [\"\"])));\nexport var Image = styled.img(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n  border-radius: \", \";\\n\"], [\"\\n  border-radius: \", \";\\n\"])), th.radius('lg'));\nvar templateObject_1, templateObject_2;\n//# sourceMappingURL=styles.js.map"],"names":["styled","__makeTemplateObject","th"],"mappings":";;;;;;;;;AAEuBA,uBAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAGC,0BAAoB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE;AACnG,IAAC,KAAK,GAAGD,uBAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAGC,0BAAoB,CAAC,CAAC,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,EAAE,KAAK,CAAC,CAAC,CAAC,EAAEC,SAAE,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;AAC9K,IAAI,gBAAgB,EAAE,gBAAgB;;;;"}

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

@@ -1,13 +1,15 @@
-import { jsx } from 'react/jsx-runtime';
-import Tag from '../../../../Elements/Tag/Tag.js';
-import { Container } from './styles.js';
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var Tag = require('../../../../Elements/Tag/Tag.js');
+var styles = require('./styles.js');
 
 var ImageTag = function (_a) {
     var label = _a.label;
     if (!label)
         return null;
-    return (jsx(Container, { children: jsx(Tag, { size: "small", color: "darkGreen", textColor: "white", children: jsx("b", { children: label }) }) }));
+    return (jsxRuntime.jsx(styles.Container, { children: jsxRuntime.jsx(Tag.default, { size: "small", color: "darkGreen", textColor: "white", children: jsxRuntime.jsx("b", { children: label }) }) }));
 };
 
-export { ImageTag };
+exports.ImageTag = ImageTag;
 //# sourceMappingURL=index.js.map

package/ui/Blocks/ImageList/components/ImageTag/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/ImageTag/index.tsx"],"sourcesContent":["import { jsx as _jsx } from \"react/jsx-runtime\";\nimport Tag from '../../../../Elements/Tag';\nimport { Container } from './styles';\nexport var ImageTag = function (_a) {\n    var label = _a.label;\n    if (!label)\n        return null;\n    return (_jsx(Container, { children: _jsx(Tag, { size: \"small\", color: \"darkGreen\", textColor: \"white\", children: _jsx(\"b\", { children: label }) }) }));\n};\n//# sourceMappingURL=index.js.map"],"names":["_jsx"],"mappings":";;;;AAGU,IAAC,QAAQ,GAAG,UAAU,EAAE,EAAE;AACpC,IAAI,IAAI,KAAK,GAAG,EAAE,CAAC,KAAK,CAAC;AACzB,IAAI,IAAI,CAAC,KAAK;AACd,QAAQ,OAAO,IAAI,CAAC;AACpB,IAAI,QAAQA,GAAI,CAAC,SAAS,EAAE,EAAE,QAAQ,EAAEA,GAAI,CAAC,GAAG,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAEA,GAAI,CAAC,GAAG,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AAC3J;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../../packages/ui/Blocks/ImageList/components/ImageTag/index.tsx"],"sourcesContent":["import { jsx as _jsx } from \"react/jsx-runtime\";\nimport Tag from '../../../../Elements/Tag';\nimport { Container } from './styles';\nexport var ImageTag = function (_a) {\n    var label = _a.label;\n    if (!label)\n        return null;\n    return (_jsx(Container, { children: _jsx(Tag, { size: \"small\", color: \"darkGreen\", textColor: \"white\", children: _jsx(\"b\", { children: label }) }) }));\n};\n//# sourceMappingURL=index.js.map"],"names":["_jsx","Container","Tag"],"mappings":";;;;;;AAGU,IAAC,QAAQ,GAAG,UAAU,EAAE,EAAE;AACpC,IAAI,IAAI,KAAK,GAAG,EAAE,CAAC,KAAK,CAAC;AACzB,IAAI,IAAI,CAAC,KAAK;AACd,QAAQ,OAAO,IAAI,CAAC;AACpB,IAAI,QAAQA,cAAI,CAACC,gBAAS,EAAE,EAAE,QAAQ,EAAED,cAAI,CAACE,WAAG,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAEF,cAAI,CAAC,GAAG,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AAC3J;;;;"}