@mailstep/design-system 0.1.4-beta.0 → 0.1.4-beta.1

package/build/packages/ui/Elements/Dropdown/Dropdown.js

@@ -1,20 +1,14 @@
-'use strict';
+import { __makeTemplateObject } from '../../../../node_modules/tslib/tslib.es6.js';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import styled, { th } from '@xstyled/styled-components';
 
-var tslib_es6 = require('../../../../node_modules/tslib/tslib.es6.js');
-var jsxRuntime = require('react/jsx-runtime');
-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 ArrowInnerB = styled__default.default.div(templateObject_1 || (templateObject_1 = tslib_es6.__makeTemplateObject([""], [""])));
-var ArrowInnerA = styled__default.default.div(templateObject_2 || (templateObject_2 = tslib_es6.__makeTemplateObject([""], [""])));
-var Arrow = styled__default.default.div(templateObject_3 || (templateObject_3 = tslib_es6.__makeTemplateObject(["\n  position: relative;\n  left: ", ";\n  height: 0;\n  width: 0;\n  z-index: -1;\n  ", " {\n    transform: translate(-10%, -50%);\n    width: fit-content;\n    ", " {\n      border-radius: 2px;\n      background-color: ", ";\n      width: 8px;\n      height: 8px;\n      transform: rotate(45deg);\n    }\n  }\n"], ["\n  position: relative;\n  left: ", ";\n  height: 0;\n  width: 0;\n  z-index: -1;\n  ", " {\n    transform: translate(-10%, -50%);\n    width: fit-content;\n    ", " {\n      border-radius: 2px;\n      background-color: ", ";\n      width: 8px;\n      height: 8px;\n      transform: rotate(45deg);\n    }\n  }\n"])), function (_a) {
+var ArrowInnerB = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
+var ArrowInnerA = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([""], [""])));
+var Arrow = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: relative;\n  left: ", ";\n  height: 0;\n  width: 0;\n  z-index: -1;\n  ", " {\n    transform: translate(-10%, -50%);\n    width: fit-content;\n    ", " {\n      border-radius: 2px;\n      background-color: ", ";\n      width: 8px;\n      height: 8px;\n      transform: rotate(45deg);\n    }\n  }\n"], ["\n  position: relative;\n  left: ", ";\n  height: 0;\n  width: 0;\n  z-index: -1;\n  ", " {\n    transform: translate(-10%, -50%);\n    width: fit-content;\n    ", " {\n      border-radius: 2px;\n      background-color: ", ";\n      width: 8px;\n      height: 8px;\n      transform: rotate(45deg);\n    }\n  }\n"])), function (_a) {
     var verticalShift = _a.verticalShift;
     return (verticalShift ? 'calc(50% + 70px)' : 'calc(50%)');
-}, ArrowInnerA, ArrowInnerB, styled.th.color('white'));
-var StyledDropdownWrap = styled__default.default.div(templateObject_4 || (templateObject_4 = tslib_es6.__makeTemplateObject(["\n  position: absolute;\n\n  ", "\n\n  width: fit-content;\n  height: fit-content;\n  display: block;\n  z-index: 1;\n\n  ", " {\n    display: ", ";\n  }\n"], ["\n  position: absolute;\n\n  ", "\n\n  width: fit-content;\n  height: fit-content;\n  display: block;\n  z-index: 1;\n\n  ", " {\n    display: ", ";\n  }\n"])), function (_a) {
+}, ArrowInnerA, ArrowInnerB, th.color('white'));
+var StyledDropdownWrap = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: absolute;\n\n  ", "\n\n  width: fit-content;\n  height: fit-content;\n  display: block;\n  z-index: 1;\n\n  ", " {\n    display: ", ";\n  }\n"], ["\n  position: absolute;\n\n  ", "\n\n  width: fit-content;\n  height: fit-content;\n  display: block;\n  z-index: 1;\n\n  ", " {\n    display: ", ";\n  }\n"])), function (_a) {
     var customDropdownPosition = _a.customDropdownPosition, verticalShift = _a.verticalShift;
     return customDropdownPosition
         ? customDropdownPosition
@@ -25,9 +19,9 @@ var StyledDropdownWrap = styled__default.default.div(templateObject_4 || (templa
 });
 var Dropdown = function (_a) {
     var show = _a.show, className = _a.className, wrapRef = _a.wrapRef, children = _a.children, showArrow = _a.showArrow, verticalShift = _a.verticalShift, customDropdownPosition = _a.customDropdownPosition;
-    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: show && (jsxRuntime.jsxs(StyledDropdownWrap, { ref: wrapRef, className: className, showArrow: showArrow, verticalShift: verticalShift, customDropdownPosition: customDropdownPosition, children: [jsxRuntime.jsx(Arrow, { verticalShift: verticalShift, children: jsxRuntime.jsx(ArrowInnerA, { children: jsxRuntime.jsx(ArrowInnerB, {}) }) }), children] })) }));
+    return (jsx(Fragment, { children: show && (jsxs(StyledDropdownWrap, { ref: wrapRef, className: className, showArrow: showArrow, verticalShift: verticalShift, customDropdownPosition: customDropdownPosition, children: [jsx(Arrow, { verticalShift: verticalShift, children: jsx(ArrowInnerA, { children: jsx(ArrowInnerB, {}) }) }), children] })) }));
 };
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
 
-module.exports = Dropdown;
+export { Dropdown as default };
 //# sourceMappingURL=Dropdown.js.map

package/build/packages/ui/Elements/Dropdown/Dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.js","sources":["../../../../../packages/ui/Elements/Dropdown/Dropdown.tsx"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport styled from '@xstyled/styled-components';\nimport { th } from '@xstyled/styled-components';\nvar ArrowInnerB = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\"], [\"\"])));\nvar ArrowInnerA = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\"], [\"\"])));\nvar Arrow = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n  position: relative;\\n  left: \", \";\\n  height: 0;\\n  width: 0;\\n  z-index: -1;\\n  \", \" {\\n    transform: translate(-10%, -50%);\\n    width: fit-content;\\n    \", \" {\\n      border-radius: 2px;\\n      background-color: \", \";\\n      width: 8px;\\n      height: 8px;\\n      transform: rotate(45deg);\\n    }\\n  }\\n\"], [\"\\n  position: relative;\\n  left: \", \";\\n  height: 0;\\n  width: 0;\\n  z-index: -1;\\n  \", \" {\\n    transform: translate(-10%, -50%);\\n    width: fit-content;\\n    \", \" {\\n      border-radius: 2px;\\n      background-color: \", \";\\n      width: 8px;\\n      height: 8px;\\n      transform: rotate(45deg);\\n    }\\n  }\\n\"])), function (_a) {\n    var verticalShift = _a.verticalShift;\n    return (verticalShift ? 'calc(50% + 70px)' : 'calc(50%)');\n}, ArrowInnerA, ArrowInnerB, th.color('white'));\nvar StyledDropdownWrap = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject([\"\\n  position: absolute;\\n\\n  \", \"\\n\\n  width: fit-content;\\n  height: fit-content;\\n  display: block;\\n  z-index: 1;\\n\\n  \", \" {\\n    display: \", \";\\n  }\\n\"], [\"\\n  position: absolute;\\n\\n  \", \"\\n\\n  width: fit-content;\\n  height: fit-content;\\n  display: block;\\n  z-index: 1;\\n\\n  \", \" {\\n    display: \", \";\\n  }\\n\"])), function (_a) {\n    var customDropdownPosition = _a.customDropdownPosition, verticalShift = _a.verticalShift;\n    return customDropdownPosition\n        ? customDropdownPosition\n        : \"\\n      top: 100%;\\n      left: \".concat(verticalShift ? 'calc(50% - 72px)' : 'calc(50%)', \";\\n      transform: translate(-50%, 0);\\n    \");\n}, Arrow, function (_a) {\n    var showArrow = _a.showArrow;\n    return (showArrow ? 'block' : 'none');\n});\nvar Dropdown = function (_a) {\n    var show = _a.show, className = _a.className, wrapRef = _a.wrapRef, children = _a.children, showArrow = _a.showArrow, verticalShift = _a.verticalShift, customDropdownPosition = _a.customDropdownPosition;\n    return (_jsx(_Fragment, { children: show && (_jsxs(StyledDropdownWrap, { ref: wrapRef, className: className, showArrow: showArrow, verticalShift: verticalShift, customDropdownPosition: customDropdownPosition, children: [_jsx(Arrow, { verticalShift: verticalShift, children: _jsx(ArrowInnerA, { children: _jsx(ArrowInnerB, {}) }) }), children] })) }));\n};\nexport default Dropdown;\nvar templateObject_1, templateObject_2, templateObject_3, templateObject_4;\n//# sourceMappingURL=Dropdown.js.map"],"names":["styled","__makeTemplateObject","th","_jsx","_Fragment","_jsxs"],"mappings":"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"}
+{"version":3,"file":"Dropdown.js","sources":["../../../../../packages/ui/Elements/Dropdown/Dropdown.tsx"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport styled from '@xstyled/styled-components';\nimport { th } from '@xstyled/styled-components';\nvar ArrowInnerB = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\"], [\"\"])));\nvar ArrowInnerA = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\"], [\"\"])));\nvar Arrow = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n  position: relative;\\n  left: \", \";\\n  height: 0;\\n  width: 0;\\n  z-index: -1;\\n  \", \" {\\n    transform: translate(-10%, -50%);\\n    width: fit-content;\\n    \", \" {\\n      border-radius: 2px;\\n      background-color: \", \";\\n      width: 8px;\\n      height: 8px;\\n      transform: rotate(45deg);\\n    }\\n  }\\n\"], [\"\\n  position: relative;\\n  left: \", \";\\n  height: 0;\\n  width: 0;\\n  z-index: -1;\\n  \", \" {\\n    transform: translate(-10%, -50%);\\n    width: fit-content;\\n    \", \" {\\n      border-radius: 2px;\\n      background-color: \", \";\\n      width: 8px;\\n      height: 8px;\\n      transform: rotate(45deg);\\n    }\\n  }\\n\"])), function (_a) {\n    var verticalShift = _a.verticalShift;\n    return (verticalShift ? 'calc(50% + 70px)' : 'calc(50%)');\n}, ArrowInnerA, ArrowInnerB, th.color('white'));\nvar StyledDropdownWrap = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject([\"\\n  position: absolute;\\n\\n  \", \"\\n\\n  width: fit-content;\\n  height: fit-content;\\n  display: block;\\n  z-index: 1;\\n\\n  \", \" {\\n    display: \", \";\\n  }\\n\"], [\"\\n  position: absolute;\\n\\n  \", \"\\n\\n  width: fit-content;\\n  height: fit-content;\\n  display: block;\\n  z-index: 1;\\n\\n  \", \" {\\n    display: \", \";\\n  }\\n\"])), function (_a) {\n    var customDropdownPosition = _a.customDropdownPosition, verticalShift = _a.verticalShift;\n    return customDropdownPosition\n        ? customDropdownPosition\n        : \"\\n      top: 100%;\\n      left: \".concat(verticalShift ? 'calc(50% - 72px)' : 'calc(50%)', \";\\n      transform: translate(-50%, 0);\\n    \");\n}, Arrow, function (_a) {\n    var showArrow = _a.showArrow;\n    return (showArrow ? 'block' : 'none');\n});\nvar Dropdown = function (_a) {\n    var show = _a.show, className = _a.className, wrapRef = _a.wrapRef, children = _a.children, showArrow = _a.showArrow, verticalShift = _a.verticalShift, customDropdownPosition = _a.customDropdownPosition;\n    return (_jsx(_Fragment, { children: show && (_jsxs(StyledDropdownWrap, { ref: wrapRef, className: className, showArrow: showArrow, verticalShift: verticalShift, customDropdownPosition: customDropdownPosition, children: [_jsx(Arrow, { verticalShift: verticalShift, children: _jsx(ArrowInnerA, { children: _jsx(ArrowInnerB, {}) }) }), children] })) }));\n};\nexport default Dropdown;\nvar templateObject_1, templateObject_2, templateObject_3, templateObject_4;\n//# sourceMappingURL=Dropdown.js.map"],"names":["_jsx","_Fragment","_jsxs"],"mappings":";;;;AAIA,IAAI,WAAW,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;AACxG,IAAI,WAAW,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;AACxG,IAAI,KAAK,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,mCAAmC,EAAE,kDAAkD,EAAE,0EAA0E,EAAE,yDAAyD,EAAE,yFAAyF,CAAC,EAAE,CAAC,mCAAmC,EAAE,kDAAkD,EAAE,0EAA0E,EAAE,yDAAyD,EAAE,yFAAyF,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE;AAC9tB,IAAI,IAAI,aAAa,GAAG,EAAE,CAAC,aAAa,CAAC;AACzC,IAAI,QAAQ,aAAa,GAAG,kBAAkB,GAAG,WAAW,EAAE;AAC9D,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAChD,IAAI,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,+BAA+B,EAAE,2FAA2F,EAAE,mBAAmB,EAAE,UAAU,CAAC,EAAE,CAAC,+BAA+B,EAAE,2FAA2F,EAAE,mBAAmB,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE;AACnb,IAAI,IAAI,sBAAsB,GAAG,EAAE,CAAC,sBAAsB,EAAE,aAAa,GAAG,EAAE,CAAC,aAAa,CAAC;AAC7F,IAAI,OAAO,sBAAsB;AACjC,UAAU,sBAAsB;AAChC,UAAU,kCAAkC,CAAC,MAAM,CAAC,aAAa,GAAG,kBAAkB,GAAG,WAAW,EAAE,+CAA+C,CAAC,CAAC;AACvJ,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,EAAE;AACxB,IAAI,IAAI,SAAS,GAAG,EAAE,CAAC,SAAS,CAAC;AACjC,IAAI,QAAQ,SAAS,GAAG,OAAO,GAAG,MAAM,EAAE;AAC1C,CAAC,CAAC,CAAC;AACA,IAAC,QAAQ,GAAG,UAAU,EAAE,EAAE;AAC7B,IAAI,IAAI,IAAI,GAAG,EAAE,CAAC,IAAI,EAAE,SAAS,GAAG,EAAE,CAAC,SAAS,EAAE,OAAO,GAAG,EAAE,CAAC,OAAO,EAAE,QAAQ,GAAG,EAAE,CAAC,QAAQ,EAAE,SAAS,GAAG,EAAE,CAAC,SAAS,EAAE,aAAa,GAAG,EAAE,CAAC,aAAa,EAAE,sBAAsB,GAAG,EAAE,CAAC,sBAAsB,CAAC;AAC/M,IAAI,QAAQA,GAAI,CAACC,QAAS,EAAE,EAAE,QAAQ,EAAE,IAAI,KAAKC,IAAK,CAAC,kBAAkB,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,aAAa,EAAE,aAAa,EAAE,sBAAsB,EAAE,sBAAsB,EAAE,QAAQ,EAAE,CAACF,GAAI,CAAC,KAAK,EAAE,EAAE,aAAa,EAAE,aAAa,EAAE,QAAQ,EAAEA,GAAI,CAAC,WAAW,EAAE,EAAE,QAAQ,EAAEA,GAAI,CAAC,WAAW,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE;AACnW,EAAE;AAEF,IAAI,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB;;;;"}

package/build/packages/ui/Elements/ErrorMessage/ErrorMessage.js

@@ -1,22 +1,16 @@
-'use strict';
+import { __makeTemplateObject } from '../../../../node_modules/tslib/tslib.es6.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import styled, { css, th } from '@xstyled/styled-components';
+import Icon from '../Icon/Icon.js';
 
-var tslib_es6 = require('../../../../node_modules/tslib/tslib.es6.js');
-var jsxRuntime = require('react/jsx-runtime');
-var styled = require('@xstyled/styled-components');
-var Icon = require('../Icon/Icon.js');
-
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
-
-var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
-
-var tooltip = styled.css(templateObject_1 || (templateObject_1 = tslib_es6.__makeTemplateObject(["\n  span {\n    display: none;\n    position: absolute;\n    width: 120px;\n    background-color: red1;\n    color: white;\n    text-align: center;\n    border-radius: md;\n    padding: 1;\n    z-index: 1;\n    transition: opacity 0.3s;\n    top: 0;\n    margin-top: -4px;\n    left: 100%;\n    margin-left: 2;\n    box-shadow: tooltipBoxShadow;\n\n    :after {\n      content: '';\n      position: absolute;\n      top: 3px;\n      right: 100%;\n      border: mediumThick;\n      border-color: transparent ", " transparent transparent;\n    }\n  }\n\n  :hover {\n    cursor: pointer;\n    span {\n      display: block;\n    }\n  }\n"], ["\n  span {\n    display: none;\n    position: absolute;\n    width: 120px;\n    background-color: red1;\n    color: white;\n    text-align: center;\n    border-radius: md;\n    padding: 1;\n    z-index: 1;\n    transition: opacity 0.3s;\n    top: 0;\n    margin-top: -4px;\n    left: 100%;\n    margin-left: 2;\n    box-shadow: tooltipBoxShadow;\n\n    :after {\n      content: '';\n      position: absolute;\n      top: 3px;\n      right: 100%;\n      border: mediumThick;\n      border-color: transparent ", " transparent transparent;\n    }\n  }\n\n  :hover {\n    cursor: pointer;\n    span {\n      display: block;\n    }\n  }\n"])), styled.th.color('red1'));
-var ErrorWrap = styled__default.default.div(templateObject_2 || (templateObject_2 = tslib_es6.__makeTemplateObject(["\n  color: red1;\n  font-size: 1;\n  display: flex;\n  align-items: flex-start;\n\n  svg {\n    min-width: 13px;\n    width: 13px;\n    fill: red1;\n  }\n"], ["\n  color: red1;\n  font-size: 1;\n  display: flex;\n  align-items: flex-start;\n\n  svg {\n    min-width: 13px;\n    width: 13px;\n    fill: red1;\n  }\n"])));
-var StyledWrapper = styled__default.default.div(templateObject_3 || (templateObject_3 = tslib_es6.__makeTemplateObject(["\n  .inline {\n    margin-top: 1;\n    svg {\n      margin-right: 2;\n    }\n  }\n  .tooltip {\n    ", "\n    svg {\n      position: absolute;\n      top: 0;\n      right: 0;\n    }\n  }\n"], ["\n  .inline {\n    margin-top: 1;\n    svg {\n      margin-right: 2;\n    }\n  }\n  .tooltip {\n    ", "\n    svg {\n      position: absolute;\n      top: 0;\n      right: 0;\n    }\n  }\n"])), tooltip);
+var tooltip = css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  span {\n    display: none;\n    position: absolute;\n    width: 120px;\n    background-color: red1;\n    color: white;\n    text-align: center;\n    border-radius: md;\n    padding: 1;\n    z-index: 1;\n    transition: opacity 0.3s;\n    top: 0;\n    margin-top: -4px;\n    left: 100%;\n    margin-left: 2;\n    box-shadow: tooltipBoxShadow;\n\n    :after {\n      content: '';\n      position: absolute;\n      top: 3px;\n      right: 100%;\n      border: mediumThick;\n      border-color: transparent ", " transparent transparent;\n    }\n  }\n\n  :hover {\n    cursor: pointer;\n    span {\n      display: block;\n    }\n  }\n"], ["\n  span {\n    display: none;\n    position: absolute;\n    width: 120px;\n    background-color: red1;\n    color: white;\n    text-align: center;\n    border-radius: md;\n    padding: 1;\n    z-index: 1;\n    transition: opacity 0.3s;\n    top: 0;\n    margin-top: -4px;\n    left: 100%;\n    margin-left: 2;\n    box-shadow: tooltipBoxShadow;\n\n    :after {\n      content: '';\n      position: absolute;\n      top: 3px;\n      right: 100%;\n      border: mediumThick;\n      border-color: transparent ", " transparent transparent;\n    }\n  }\n\n  :hover {\n    cursor: pointer;\n    span {\n      display: block;\n    }\n  }\n"])), th.color('red1'));
+var ErrorWrap = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  color: red1;\n  font-size: 1;\n  display: flex;\n  align-items: flex-start;\n\n  svg {\n    min-width: 13px;\n    width: 13px;\n    fill: red1;\n  }\n"], ["\n  color: red1;\n  font-size: 1;\n  display: flex;\n  align-items: flex-start;\n\n  svg {\n    min-width: 13px;\n    width: 13px;\n    fill: red1;\n  }\n"])));
+var StyledWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  .inline {\n    margin-top: 1;\n    svg {\n      margin-right: 2;\n    }\n  }\n  .tooltip {\n    ", "\n    svg {\n      position: absolute;\n      top: 0;\n      right: 0;\n    }\n  }\n"], ["\n  .inline {\n    margin-top: 1;\n    svg {\n      margin-right: 2;\n    }\n  }\n  .tooltip {\n    ", "\n    svg {\n      position: absolute;\n      top: 0;\n      right: 0;\n    }\n  }\n"])), tooltip);
 var ErrorMessage = function (_a) {
     var children = _a.children, appearance = _a.appearance;
-    return (jsxRuntime.jsx(StyledWrapper, { children: jsxRuntime.jsxs(ErrorWrap, { className: appearance, children: [jsxRuntime.jsx(Icon.default, { icon: "danger" }), jsxRuntime.jsx("span", { children: children })] }) }));
+    return (jsx(StyledWrapper, { children: jsxs(ErrorWrap, { className: appearance, children: [jsx(Icon, { icon: "danger" }), jsx("span", { children: children })] }) }));
 };
 var templateObject_1, templateObject_2, templateObject_3;
 
-module.exports = ErrorMessage;
+export { ErrorMessage as default };
 //# sourceMappingURL=ErrorMessage.js.map

package/build/packages/ui/Elements/ErrorMessage/ErrorMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorMessage.js","sources":["../../../../../packages/ui/Elements/ErrorMessage/ErrorMessage.tsx"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport styled, { css } from '@xstyled/styled-components';\nimport { th } from '@xstyled/styled-components';\nimport { Icon } from '../Icon';\nvar tooltip = css(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n  span {\\n    display: none;\\n    position: absolute;\\n    width: 120px;\\n    background-color: red1;\\n    color: white;\\n    text-align: center;\\n    border-radius: md;\\n    padding: 1;\\n    z-index: 1;\\n    transition: opacity 0.3s;\\n    top: 0;\\n    margin-top: -4px;\\n    left: 100%;\\n    margin-left: 2;\\n    box-shadow: tooltipBoxShadow;\\n\\n    :after {\\n      content: '';\\n      position: absolute;\\n      top: 3px;\\n      right: 100%;\\n      border: mediumThick;\\n      border-color: transparent \", \" transparent transparent;\\n    }\\n  }\\n\\n  :hover {\\n    cursor: pointer;\\n    span {\\n      display: block;\\n    }\\n  }\\n\"], [\"\\n  span {\\n    display: none;\\n    position: absolute;\\n    width: 120px;\\n    background-color: red1;\\n    color: white;\\n    text-align: center;\\n    border-radius: md;\\n    padding: 1;\\n    z-index: 1;\\n    transition: opacity 0.3s;\\n    top: 0;\\n    margin-top: -4px;\\n    left: 100%;\\n    margin-left: 2;\\n    box-shadow: tooltipBoxShadow;\\n\\n    :after {\\n      content: '';\\n      position: absolute;\\n      top: 3px;\\n      right: 100%;\\n      border: mediumThick;\\n      border-color: transparent \", \" transparent transparent;\\n    }\\n  }\\n\\n  :hover {\\n    cursor: pointer;\\n    span {\\n      display: block;\\n    }\\n  }\\n\"])), th.color('red1'));\nvar ErrorWrap = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n  color: red1;\\n  font-size: 1;\\n  display: flex;\\n  align-items: flex-start;\\n\\n  svg {\\n    min-width: 13px;\\n    width: 13px;\\n    fill: red1;\\n  }\\n\"], [\"\\n  color: red1;\\n  font-size: 1;\\n  display: flex;\\n  align-items: flex-start;\\n\\n  svg {\\n    min-width: 13px;\\n    width: 13px;\\n    fill: red1;\\n  }\\n\"])));\nvar StyledWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n  .inline {\\n    margin-top: 1;\\n    svg {\\n      margin-right: 2;\\n    }\\n  }\\n  .tooltip {\\n    \", \"\\n    svg {\\n      position: absolute;\\n      top: 0;\\n      right: 0;\\n    }\\n  }\\n\"], [\"\\n  .inline {\\n    margin-top: 1;\\n    svg {\\n      margin-right: 2;\\n    }\\n  }\\n  .tooltip {\\n    \", \"\\n    svg {\\n      position: absolute;\\n      top: 0;\\n      right: 0;\\n    }\\n  }\\n\"])), tooltip);\nvar ErrorMessage = function (_a) {\n    var children = _a.children, appearance = _a.appearance;\n    return (_jsx(StyledWrapper, { children: _jsxs(ErrorWrap, { className: appearance, children: [_jsx(Icon, { icon: \"danger\" }), _jsx(\"span\", { children: children })] }) }));\n};\nexport default ErrorMessage;\nvar templateObject_1, templateObject_2, templateObject_3;\n//# sourceMappingURL=ErrorMessage.js.map"],"names":["css","__makeTemplateObject","th","styled","_jsx","_jsxs","Icon"],"mappings":";;;;;;;;;;;AAKA,IAAI,OAAO,GAAGA,UAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAGC,8BAAoB,CAAC,CAAC,6fAA6f,EAAE,4HAA4H,CAAC,EAAE,CAAC,6fAA6f,EAAE,4HAA4H,CAAC,CAAC,CAAC,EAAEC,SAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;AACj2C,IAAI,SAAS,GAAGC,uBAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAGF,8BAAoB,CAAC,CAAC,4JAA4J,CAAC,EAAE,CAAC,4JAA4J,CAAC,CAAC,CAAC,CAAC,CAAC;AAC1Z,IAAI,aAAa,GAAGE,uBAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAGF,8BAAoB,CAAC,CAAC,sGAAsG,EAAE,sFAAsF,CAAC,EAAE,CAAC,sGAAsG,EAAE,sFAAsF,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;AACxe,IAAC,YAAY,GAAG,UAAU,EAAE,EAAE;AACjC,IAAI,IAAI,QAAQ,GAAG,EAAE,CAAC,QAAQ,EAAE,UAAU,GAAG,EAAE,CAAC,UAAU,CAAC;AAC3D,IAAI,QAAQG,cAAI,CAAC,aAAa,EAAE,EAAE,QAAQ,EAAEC,eAAK,CAAC,SAAS,EAAE,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,CAACD,cAAI,CAACE,YAAI,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,EAAEF,cAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AAC9K,EAAE;AAEF,IAAI,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB;;;;"}
+{"version":3,"file":"ErrorMessage.js","sources":["../../../../../packages/ui/Elements/ErrorMessage/ErrorMessage.tsx"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport styled, { css } from '@xstyled/styled-components';\nimport { th } from '@xstyled/styled-components';\nimport { Icon } from '../Icon';\nvar tooltip = css(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n  span {\\n    display: none;\\n    position: absolute;\\n    width: 120px;\\n    background-color: red1;\\n    color: white;\\n    text-align: center;\\n    border-radius: md;\\n    padding: 1;\\n    z-index: 1;\\n    transition: opacity 0.3s;\\n    top: 0;\\n    margin-top: -4px;\\n    left: 100%;\\n    margin-left: 2;\\n    box-shadow: tooltipBoxShadow;\\n\\n    :after {\\n      content: '';\\n      position: absolute;\\n      top: 3px;\\n      right: 100%;\\n      border: mediumThick;\\n      border-color: transparent \", \" transparent transparent;\\n    }\\n  }\\n\\n  :hover {\\n    cursor: pointer;\\n    span {\\n      display: block;\\n    }\\n  }\\n\"], [\"\\n  span {\\n    display: none;\\n    position: absolute;\\n    width: 120px;\\n    background-color: red1;\\n    color: white;\\n    text-align: center;\\n    border-radius: md;\\n    padding: 1;\\n    z-index: 1;\\n    transition: opacity 0.3s;\\n    top: 0;\\n    margin-top: -4px;\\n    left: 100%;\\n    margin-left: 2;\\n    box-shadow: tooltipBoxShadow;\\n\\n    :after {\\n      content: '';\\n      position: absolute;\\n      top: 3px;\\n      right: 100%;\\n      border: mediumThick;\\n      border-color: transparent \", \" transparent transparent;\\n    }\\n  }\\n\\n  :hover {\\n    cursor: pointer;\\n    span {\\n      display: block;\\n    }\\n  }\\n\"])), th.color('red1'));\nvar ErrorWrap = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n  color: red1;\\n  font-size: 1;\\n  display: flex;\\n  align-items: flex-start;\\n\\n  svg {\\n    min-width: 13px;\\n    width: 13px;\\n    fill: red1;\\n  }\\n\"], [\"\\n  color: red1;\\n  font-size: 1;\\n  display: flex;\\n  align-items: flex-start;\\n\\n  svg {\\n    min-width: 13px;\\n    width: 13px;\\n    fill: red1;\\n  }\\n\"])));\nvar StyledWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n  .inline {\\n    margin-top: 1;\\n    svg {\\n      margin-right: 2;\\n    }\\n  }\\n  .tooltip {\\n    \", \"\\n    svg {\\n      position: absolute;\\n      top: 0;\\n      right: 0;\\n    }\\n  }\\n\"], [\"\\n  .inline {\\n    margin-top: 1;\\n    svg {\\n      margin-right: 2;\\n    }\\n  }\\n  .tooltip {\\n    \", \"\\n    svg {\\n      position: absolute;\\n      top: 0;\\n      right: 0;\\n    }\\n  }\\n\"])), tooltip);\nvar ErrorMessage = function (_a) {\n    var children = _a.children, appearance = _a.appearance;\n    return (_jsx(StyledWrapper, { children: _jsxs(ErrorWrap, { className: appearance, children: [_jsx(Icon, { icon: \"danger\" }), _jsx(\"span\", { children: children })] }) }));\n};\nexport default ErrorMessage;\nvar templateObject_1, templateObject_2, templateObject_3;\n//# sourceMappingURL=ErrorMessage.js.map"],"names":["_jsx","_jsxs"],"mappings":";;;;;AAKA,IAAI,OAAO,GAAG,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,6fAA6f,EAAE,4HAA4H,CAAC,EAAE,CAAC,6fAA6f,EAAE,4HAA4H,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;AACj2C,IAAI,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,4JAA4J,CAAC,EAAE,CAAC,4JAA4J,CAAC,CAAC,CAAC,CAAC,CAAC;AAC1Z,IAAI,aAAa,GAAG,MAAM,CAAC,GAAG,CAAC,gBAAgB,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,CAAC,sGAAsG,EAAE,sFAAsF,CAAC,EAAE,CAAC,sGAAsG,EAAE,sFAAsF,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;AACxe,IAAC,YAAY,GAAG,UAAU,EAAE,EAAE;AACjC,IAAI,IAAI,QAAQ,GAAG,EAAE,CAAC,QAAQ,EAAE,UAAU,GAAG,EAAE,CAAC,UAAU,CAAC;AAC3D,IAAI,QAAQA,GAAI,CAAC,aAAa,EAAE,EAAE,QAAQ,EAAEC,IAAK,CAAC,SAAS,EAAE,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,CAACD,GAAI,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,EAAEA,GAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AAC9K,EAAE;AAEF,IAAI,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB;;;;"}