@mailstep/design-system 0.1.16 → 0.1.17

package/package.json

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

package/ui/Elements/Icon/icons/BarcodeScan.js

@@ -0,0 +1,7 @@
+import { __assign } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+
+var BarcodeScan = function (props) { return (jsx("svg", __assign({ width: "24", height: "16", viewBox: "0 0 24 16", fill: "#22394E", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsx("path", { d: "M3.3 -6.10352e-05C2.80125 -6.10352e-05 2.4 0.382082 2.4 0.857082V5.71422H4.2V0.857082C4.2 0.382082 3.79875 -6.10352e-05 3.3 -6.10352e-05ZM2.4 15.1428C2.4 15.6178 2.80125 15.9999 3.3 15.9999C3.79875 15.9999 4.2 15.6178 4.2 15.1428V10.2857H2.4V15.1428ZM6 15.4285C6 15.7428 6.27 15.9999 6.6 15.9999C6.93 15.9999 7.2 15.7428 7.2 15.4285V10.2857H6V15.4285ZM8.4 15.1428C8.4 15.6178 8.80125 15.9999 9.3 15.9999C9.79875 15.9999 10.2 15.6178 10.2 15.1428V10.2857H8.4V15.1428ZM8.4 0.857082V5.71422H10.2V0.857082C10.2 0.382082 9.79875 -6.10352e-05 9.3 -6.10352e-05C8.80125 -6.10352e-05 8.4 0.382082 8.4 0.857082ZM12.6 15.1428C12.6 15.6178 13.0013 15.9999 13.5 15.9999C13.9988 15.9999 14.4 15.6178 14.4 15.1428V10.2857H12.6V15.1428ZM12.6 0.857082V5.71422H14.4V0.857082C14.4 0.382082 13.9988 -6.10352e-05 13.5 -6.10352e-05C13.0013 -6.10352e-05 12.6 0.382082 12.6 0.857082ZM17.4 15.4285C17.4 15.7428 17.67 15.9999 18 15.9999C18.33 15.9999 18.6 15.7428 18.6 15.4285V10.2857H17.4V15.4285ZM17.4 0.571368V5.71422H18.6V0.571368C18.6 0.257082 18.33 -6.10352e-05 18 -6.10352e-05C17.67 -6.10352e-05 17.4 0.257082 17.4 0.571368ZM19.8 15.1428C19.8 15.6178 20.2013 15.9999 20.7 15.9999C21.1988 15.9999 21.6 15.6178 21.6 15.1428V10.2857H19.8V15.1428ZM19.8 0.857082V5.71422H21.6V0.857082C21.6 0.382082 21.1988 -6.10352e-05 20.7 -6.10352e-05C20.2013 -6.10352e-05 19.8 0.382082 19.8 0.857082ZM6 5.71422H7.2V0.571368C7.2 0.257082 6.93 -6.10352e-05 6.6 -6.10352e-05C6.27 -6.10352e-05 6 0.257082 6 0.571368V5.71422ZM0 7.99994C0 8.47494 0.40125 8.85708 0.9 8.85708H23.1C23.5988 8.85708 24 8.47494 24 7.99994C24 7.52494 23.5988 7.1428 23.1 7.1428H0.9C0.40125 7.1428 0 7.52494 0 7.99994Z" }) }))); };
+
+export { BarcodeScan };
+//# sourceMappingURL=BarcodeScan.js.map

package/ui/Elements/Icon/icons/BarcodeScan.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BarcodeScan.js","sources":["../../../../../packages/ui/Elements/Icon/icons/BarcodeScan.tsx"],"sourcesContent":["import { __assign } from \"tslib\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport var BarcodeScan = function (props) { return (_jsx(\"svg\", __assign({ width: \"24\", height: \"16\", viewBox: \"0 0 24 16\", fill: \"#22394E\", xmlns: \"http://www.w3.org/2000/svg\" }, props, { children: _jsx(\"path\", { d: \"M3.3 -6.10352e-05C2.80125 -6.10352e-05 2.4 0.382082 2.4 0.857082V5.71422H4.2V0.857082C4.2 0.382082 3.79875 -6.10352e-05 3.3 -6.10352e-05ZM2.4 15.1428C2.4 15.6178 2.80125 15.9999 3.3 15.9999C3.79875 15.9999 4.2 15.6178 4.2 15.1428V10.2857H2.4V15.1428ZM6 15.4285C6 15.7428 6.27 15.9999 6.6 15.9999C6.93 15.9999 7.2 15.7428 7.2 15.4285V10.2857H6V15.4285ZM8.4 15.1428C8.4 15.6178 8.80125 15.9999 9.3 15.9999C9.79875 15.9999 10.2 15.6178 10.2 15.1428V10.2857H8.4V15.1428ZM8.4 0.857082V5.71422H10.2V0.857082C10.2 0.382082 9.79875 -6.10352e-05 9.3 -6.10352e-05C8.80125 -6.10352e-05 8.4 0.382082 8.4 0.857082ZM12.6 15.1428C12.6 15.6178 13.0013 15.9999 13.5 15.9999C13.9988 15.9999 14.4 15.6178 14.4 15.1428V10.2857H12.6V15.1428ZM12.6 0.857082V5.71422H14.4V0.857082C14.4 0.382082 13.9988 -6.10352e-05 13.5 -6.10352e-05C13.0013 -6.10352e-05 12.6 0.382082 12.6 0.857082ZM17.4 15.4285C17.4 15.7428 17.67 15.9999 18 15.9999C18.33 15.9999 18.6 15.7428 18.6 15.4285V10.2857H17.4V15.4285ZM17.4 0.571368V5.71422H18.6V0.571368C18.6 0.257082 18.33 -6.10352e-05 18 -6.10352e-05C17.67 -6.10352e-05 17.4 0.257082 17.4 0.571368ZM19.8 15.1428C19.8 15.6178 20.2013 15.9999 20.7 15.9999C21.1988 15.9999 21.6 15.6178 21.6 15.1428V10.2857H19.8V15.1428ZM19.8 0.857082V5.71422H21.6V0.857082C21.6 0.382082 21.1988 -6.10352e-05 20.7 -6.10352e-05C20.2013 -6.10352e-05 19.8 0.382082 19.8 0.857082ZM6 5.71422H7.2V0.571368C7.2 0.257082 6.93 -6.10352e-05 6.6 -6.10352e-05C6.27 -6.10352e-05 6 0.257082 6 0.571368V5.71422ZM0 7.99994C0 8.47494 0.40125 8.85708 0.9 8.85708H23.1C23.5988 8.85708 24 8.47494 24 7.99994C24 7.52494 23.5988 7.1428 23.1 7.1428H0.9C0.40125 7.1428 0 7.52494 0 7.99994Z\" }) }))); };\n//# sourceMappingURL=BarcodeScan.js.map"],"names":["_jsx"],"mappings":";;;AAEU,IAAC,WAAW,GAAG,UAAU,KAAK,EAAE,EAAE,QAAQA,GAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,4BAA4B,EAAE,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAEA,GAAI,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,snDAAsnD,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE;;;;"}

package/ui/Elements/Icon/icons/ImagePlaceholder.js

@@ -0,0 +1,7 @@
+import { __assign } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+
+var ImagePlaceholder = function (props) { return (jsx("svg", __assign({ width: "18", height: "18", viewBox: "0 0 18 18", fill: "#A3B3C1", xmlns: "http://www.w3.org/2000/svg" }, props, { children: jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M16 0C17.1 0 18 0.9 18 2V16C18 17.1 17.1 18 16 18H2C0.9 18 0 17.1 0 16V2C0 0.9 0.9 0 2 0H16ZM8 13.51L5.5 10.5L2 15H16L11.5 9L8 13.51Z" }) }))); };
+
+export { ImagePlaceholder };
+//# sourceMappingURL=ImagePlaceholder.js.map

package/ui/Elements/Icon/icons/ImagePlaceholder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImagePlaceholder.js","sources":["../../../../../packages/ui/Elements/Icon/icons/ImagePlaceholder.tsx"],"sourcesContent":["import { __assign } from \"tslib\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport var ImagePlaceholder = function (props) { return (_jsx(\"svg\", __assign({ width: \"18\", height: \"18\", viewBox: \"0 0 18 18\", fill: \"#A3B3C1\", xmlns: \"http://www.w3.org/2000/svg\" }, props, { children: _jsx(\"path\", { fillRule: \"evenodd\", clipRule: \"evenodd\", d: \"M16 0C17.1 0 18 0.9 18 2V16C18 17.1 17.1 18 16 18H2C0.9 18 0 17.1 0 16V2C0 0.9 0.9 0 2 0H16ZM8 13.51L5.5 10.5L2 15H16L11.5 9L8 13.51Z\" }) }))); };\n//# sourceMappingURL=ImagePlaceholder.js.map"],"names":["_jsx"],"mappings":";;;AAEU,IAAC,gBAAgB,GAAG,UAAU,KAAK,EAAE,EAAE,QAAQA,GAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,4BAA4B,EAAE,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAEA,GAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAAE,uIAAuI,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE;;;;"}

package/ui/Elements/Icon/index.d.ts

@@ -20,5 +20,7 @@ declare const Return: FC<SvgProps>
 declare const Settings2: FC<SvgProps>
 declare const Transfer: FC<SvgProps>
 declare const Product: FC<SvgProps>
+declare const ImagePlaceholder: FC<SvgProps>
+declare const BarcodeScan: FC<SvgProps>
 
-export { Complaint, Expeditions, FlagCZ, FlagUSA, HamburgerMenu, HelpCircle1, IIcon, Income, Inventory, MenuItems, MobileCancel, Notification2, Plus1, Product, Products, Profile, Return, Settings2, Transfer, Icon as default };
+export { BarcodeScan, Complaint, Expeditions, FlagCZ, FlagUSA, HamburgerMenu, HelpCircle1, IIcon, ImagePlaceholder, Income, Inventory, MenuItems, MobileCancel, Notification2, Plus1, Product, Products, Profile, Return, Settings2, Transfer, Icon as default };

package/ui/Forms/Input/styles.js

@@ -21,7 +21,7 @@ var InputIcon = styled.div(templateObject_1 || (templateObject_1 = __makeTemplat
 });
 var IconsController = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  top: 0.2em;\n  right: 0.5em;\n"], ["\n  position: absolute;\n  top: 0.2em;\n  right: 0.5em;\n"])));
 var IconWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  svg {\n    :hover {\n      cursor: pointer;\n      color: blue2;\n    }\n  }\n"], ["\n  display: flex;\n  svg {\n    :hover {\n      cursor: pointer;\n      color: blue2;\n    }\n  }\n"])));
-var StyledInput = styled.input(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  ", ";\n  border: slim;\n  border-color: ", ";\n  box-sizing: border-box;\n  background-clip: padding-box;\n  padding-top: 0.5em;\n  padding-bottom: 0.5em;\n  padding-right: ", "em;\n  display: block;\n  width: 100%;\n  font-family: ", ";\n  font-size: 14px;\n  font-weight: medium;\n  transition: inputTransition;\n\n  ~ ", " {\n    svg {\n      stroke: lightGray3;\n    }\n  }\n\n  ::placeholder {\n    color: lightGray3;\n    opacity: 1;\n  }\n\n  :focus {\n    background-color: white;\n    border-color: blue2;\n    color: typoPrimary;\n    outline: 0;\n\n    ~ ", " {\n      svg {\n        stroke: blue2;\n      }\n    }\n  }\n  ", ";\n  :disabled,\n  :disabled:hover {\n    background-color: lightGray1;\n    border-color: lightGray3;\n    color: gray;\n  }\n\n  text-overflow: ellipsis;\n\n  -moz-appearance: textfield;\n  appearance: textfield;\n  ::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n  }\n"], ["\n  ", ";\n  border: slim;\n  border-color: ", ";\n  box-sizing: border-box;\n  background-clip: padding-box;\n  padding-top: 0.5em;\n  padding-bottom: 0.5em;\n  padding-right: ", "em;\n  display: block;\n  width: 100%;\n  font-family: ", ";\n  font-size: 14px;\n  font-weight: medium;\n  transition: inputTransition;\n\n  ~ ", " {\n    svg {\n      stroke: lightGray3;\n    }\n  }\n\n  ::placeholder {\n    color: lightGray3;\n    opacity: 1;\n  }\n\n  :focus {\n    background-color: white;\n    border-color: blue2;\n    color: typoPrimary;\n    outline: 0;\n\n    ~ ", " {\n      svg {\n        stroke: blue2;\n      }\n    }\n  }\n  ", ";\n  :disabled,\n  :disabled:hover {\n    background-color: lightGray1;\n    border-color: lightGray3;\n    color: gray;\n  }\n\n  text-overflow: ellipsis;\n\n  -moz-appearance: textfield;\n  appearance: textfield;\n  ::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n  }\n"])), system, function (_a) {
+var StyledInput = styled.input(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  ", ";\n  border: slim;\n  border-color: ", ";\n  box-sizing: border-box;\n  background-clip: padding-box;\n  padding-top: 0.5em;\n  padding-bottom: 0.5em;\n  padding-right: ", "em;\n  display: block;\n  width: 100%;\n  font-family: ", ";\n  font-size: 14px;\n  font-weight: medium;\n  transition: inputTransition;\n\n  ~ ", " {\n    svg {\n      stroke: lightGray3;\n    }\n  }\n\n  ::placeholder {\n    color: gray1;\n    opacity: 1;\n  }\n\n  :focus {\n    background-color: white;\n    border-color: blue2;\n    color: typoPrimary;\n    outline: 0;\n\n    ~ ", " {\n      svg {\n        stroke: blue2;\n      }\n    }\n  }\n  ", ";\n  :disabled,\n  :disabled:hover {\n    background-color: lightGray1;\n    border-color: lightGray3;\n    color: gray;\n  }\n\n  text-overflow: ellipsis;\n\n  -moz-appearance: textfield;\n  appearance: textfield;\n  ::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n  }\n"], ["\n  ", ";\n  border: slim;\n  border-color: ", ";\n  box-sizing: border-box;\n  background-clip: padding-box;\n  padding-top: 0.5em;\n  padding-bottom: 0.5em;\n  padding-right: ", "em;\n  display: block;\n  width: 100%;\n  font-family: ", ";\n  font-size: 14px;\n  font-weight: medium;\n  transition: inputTransition;\n\n  ~ ", " {\n    svg {\n      stroke: lightGray3;\n    }\n  }\n\n  ::placeholder {\n    color: gray1;\n    opacity: 1;\n  }\n\n  :focus {\n    background-color: white;\n    border-color: blue2;\n    color: typoPrimary;\n    outline: 0;\n\n    ~ ", " {\n      svg {\n        stroke: blue2;\n      }\n    }\n  }\n  ", ";\n  :disabled,\n  :disabled:hover {\n    background-color: lightGray1;\n    border-color: lightGray3;\n    color: gray;\n  }\n\n  text-overflow: ellipsis;\n\n  -moz-appearance: textfield;\n  appearance: textfield;\n  ::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n  }\n"])), system, function (_a) {
     var $isInvalid = _a.$isInvalid;
     return ($isInvalid ? th.color('red1') : th.color('lightGray6'));
 }, function (props) { return resolvePaddingRight(props); }, th('fonts.primary'), InputIcon, InputIcon, function (_a) {

package/ui/Forms/Input/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../packages/ui/Forms/Input/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport styled, { css, system, th } from '@xstyled/styled-components';\nvar resolvePaddingRight = function (props) {\n    var $icon = props.$icon, $iconPlacement = props.$iconPlacement, $isClearable = props.$isClearable, $hasSuffix = props.$hasSuffix;\n    var padding = 2;\n    if ($icon && $iconPlacement === 'right')\n        padding += 1;\n    if ($isClearable)\n        padding += 1;\n    if ($hasSuffix)\n        padding += 2;\n    return String(padding);\n};\nexport var InputIcon = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n  position: absolute;\\n\\n  // top: 52%; // TODO fix\\n  // transform: translateY(-50%); // TODO why does this do the overlap bug\\n  left: \", \";\\n  right: \", \";\\n\\n  svg {\\n    stroke: lightGray3;\\n    cursor: pointer;\\n  }\\n\"], [\"\\n  position: absolute;\\n\\n  // top: 52%; // TODO fix\\n  // transform: translateY(-50%); // TODO why does this do the overlap bug\\n  left: \", \";\\n  right: \", \";\\n\\n  svg {\\n    stroke: lightGray3;\\n    cursor: pointer;\\n  }\\n\"])), function (_a) {\n    var right = _a.right;\n    return (right ? 'auto' : '1em');\n}, function (_a) {\n    var right = _a.right;\n    return (right ? '0.5em' : 'auto');\n});\nexport var IconsController = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n  position: absolute;\\n  top: 0.2em;\\n  right: 0.5em;\\n\"], [\"\\n  position: absolute;\\n  top: 0.2em;\\n  right: 0.5em;\\n\"])));\nexport var IconWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n  display: flex;\\n  svg {\\n    :hover {\\n      cursor: pointer;\\n      color: blue2;\\n    }\\n  }\\n\"], [\"\\n  display: flex;\\n  svg {\\n    :hover {\\n      cursor: pointer;\\n      color: blue2;\\n    }\\n  }\\n\"])));\nexport var StyledInput = styled.input(templateObject_5 || (templateObject_5 = __makeTemplateObject([\"\\n  \", \";\\n  border: slim;\\n  border-color: \", \";\\n  box-sizing: border-box;\\n  background-clip: padding-box;\\n  padding-top: 0.5em;\\n  padding-bottom: 0.5em;\\n  padding-right: \", \"em;\\n  display: block;\\n  width: 100%;\\n  font-family: \", \";\\n  font-size: 14px;\\n  font-weight: medium;\\n  transition: inputTransition;\\n\\n  ~ \", \" {\\n    svg {\\n      stroke: lightGray3;\\n    }\\n  }\\n\\n  ::placeholder {\\n    color: lightGray3;\\n    opacity: 1;\\n  }\\n\\n  :focus {\\n    background-color: white;\\n    border-color: blue2;\\n    color: typoPrimary;\\n    outline: 0;\\n\\n    ~ \", \" {\\n      svg {\\n        stroke: blue2;\\n      }\\n    }\\n  }\\n  \", \";\\n  :disabled,\\n  :disabled:hover {\\n    background-color: lightGray1;\\n    border-color: lightGray3;\\n    color: gray;\\n  }\\n\\n  text-overflow: ellipsis;\\n\\n  -moz-appearance: textfield;\\n  appearance: textfield;\\n  ::-webkit-inner-spin-button {\\n    -webkit-appearance: none;\\n  }\\n\"], [\"\\n  \", \";\\n  border: slim;\\n  border-color: \", \";\\n  box-sizing: border-box;\\n  background-clip: padding-box;\\n  padding-top: 0.5em;\\n  padding-bottom: 0.5em;\\n  padding-right: \", \"em;\\n  display: block;\\n  width: 100%;\\n  font-family: \", \";\\n  font-size: 14px;\\n  font-weight: medium;\\n  transition: inputTransition;\\n\\n  ~ \", \" {\\n    svg {\\n      stroke: lightGray3;\\n    }\\n  }\\n\\n  ::placeholder {\\n    color: lightGray3;\\n    opacity: 1;\\n  }\\n\\n  :focus {\\n    background-color: white;\\n    border-color: blue2;\\n    color: typoPrimary;\\n    outline: 0;\\n\\n    ~ \", \" {\\n      svg {\\n        stroke: blue2;\\n      }\\n    }\\n  }\\n  \", \";\\n  :disabled,\\n  :disabled:hover {\\n    background-color: lightGray1;\\n    border-color: lightGray3;\\n    color: gray;\\n  }\\n\\n  text-overflow: ellipsis;\\n\\n  -moz-appearance: textfield;\\n  appearance: textfield;\\n  ::-webkit-inner-spin-button {\\n    -webkit-appearance: none;\\n  }\\n\"])), system, function (_a) {\n    var $isInvalid = _a.$isInvalid;\n    return ($isInvalid ? th.color('red1') : th.color('lightGray6'));\n}, function (props) { return resolvePaddingRight(props); }, th('fonts.primary'), InputIcon, InputIcon, function (_a) {\n    var big = _a.big;\n    return big\n        ? css(templateObject_4 || (templateObject_4 = __makeTemplateObject([\"\\n          font-size: 30px;\\n          color: gray;\\n          font-weight: semiBold;\\n          padding: 0 0.5rem 0 1.25rem;\\n        \"], [\"\\n          font-size: 30px;\\n          color: gray;\\n          font-weight: semiBold;\\n          padding: 0 0.5rem 0 1.25rem;\\n        \"]))) : '';\n});\nexport var InputWrap = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject([\"\\n  position: relative;\\n\"], [\"\\n  position: relative;\\n\"])));\nexport var Suffix = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject([\"\\n  position: absolute;\\n  right: 0;\\n  top: 0;\\n  font-size: 14px;\\n  font-weight: 700;\\n  height: 100%;\\n  width: 40px;\\n  padding: 2;\\n  color: typoPrimary;\\n  font-family: \", \";\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\\n  border: slim;\\n  border-top-right-radius: lg;\\n  border-bottom-right-radius: lg;\\n  border-left: none;\\n\\n  \", \";\\n\\n  input:focus ~ & {\\n    border-color: blue2;\\n  }\\n\"], [\"\\n  position: absolute;\\n  right: 0;\\n  top: 0;\\n  font-size: 14px;\\n  font-weight: 700;\\n  height: 100%;\\n  width: 40px;\\n  padding: 2;\\n  color: typoPrimary;\\n  font-family: \", \";\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\\n  border: slim;\\n  border-top-right-radius: lg;\\n  border-bottom-right-radius: lg;\\n  border-left: none;\\n\\n  \", \";\\n\\n  input:focus ~ & {\\n    border-color: blue2;\\n  }\\n\"])), th('fonts.primary'), function (_a) {\n    var $isPointer = _a.$isPointer;\n    return $isPointer\n        ? css(templateObject_7 || (templateObject_7 = __makeTemplateObject([\"\\n          cursor: pointer;\\n        \"], [\"\\n          cursor: pointer;\\n        \"]))) : '';\n});\nexport var InputRow = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject([\"\\n  position: relative;\\n  color: \", \";\\n  & > * {\\n    border-color: \", \";\\n    color: \", \";\\n  }\\n  :hover > * {\\n    border-color: \", \";\\n  }\\n  &:focus-within {\\n    color: typoPrimary;\\n  }\\n  .primary {\\n    line-height: 0;\\n    height: 38px;\\n    border-radius: lg;\\n    ~ \", \" {\\n      top: 10px;\\n    }\\n  }\\n  .grid {\\n    line-height: 1.2px;\\n    border-radius: md;\\n    ~ \", \" {\\n      top: 7px;\\n    }\\n  }\\n  .left {\\n    padding-left: \", \";\\n  }\\n  .right {\\n    padding-right: 1.4em;\\n    padding-left: 1em;\\n  }\\n\"], [\"\\n  position: relative;\\n  color: \", \";\\n  & > * {\\n    border-color: \", \";\\n    color: \", \";\\n  }\\n  :hover > * {\\n    border-color: \", \";\\n  }\\n  &:focus-within {\\n    color: typoPrimary;\\n  }\\n  .primary {\\n    line-height: 0;\\n    height: 38px;\\n    border-radius: lg;\\n    ~ \", \" {\\n      top: 10px;\\n    }\\n  }\\n  .grid {\\n    line-height: 1.2px;\\n    border-radius: md;\\n    ~ \", \" {\\n      top: 7px;\\n    }\\n  }\\n  .left {\\n    padding-left: \", \";\\n  }\\n  .right {\\n    padding-right: 1.4em;\\n    padding-left: 1em;\\n  }\\n\"])), function (_a) {\n    var $isInvalid = _a.$isInvalid;\n    return ($isInvalid ? th.color('red1') : th.color('gray'));\n}, function (_a) {\n    var $isInvalid = _a.$isInvalid;\n    return ($isInvalid ? th.color('red1') : th.color('lightGray6'));\n}, function (_a) {\n    var $isInvalid = _a.$isInvalid, hasValue = _a.hasValue;\n    return $isInvalid ? th.color('red1') : hasValue ? th.color('typoPrimary') : th.color('gray');\n}, function (_a) {\n    var disabled = _a.disabled;\n    return (disabled ? th.color('lightGray3') : th.color('gray5'));\n}, InputIcon, InputIcon, function (_a) {\n    var $icon = _a.$icon;\n    return ($icon ? '3em' : '1em');\n});\nexport var Tooltip = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject([\"\\n  span {\\n    display: none;\\n    position: absolute;\\n    width: 120px;\\n    background-color: white;\\n    color: red1;\\n    border-color: red1;\\n    border: 1px solid;\\n    text-align: center;\\n    border-radius: lg;\\n    padding: 1 3;\\n    margin: 1;\\n    z-index: 1;\\n    transition: opacity 0.3s;\\n    top: 0;\\n    left: 100%;\\n    margin-left: 2;\\n    box-shadow: tooltipBoxShadow;\\n\\n    :after {\\n      content: '';\\n      position: absolute;\\n      top: 0px;\\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: white;\\n    color: red1;\\n    border-color: red1;\\n    border: 1px solid;\\n    text-align: center;\\n    border-radius: lg;\\n    padding: 1 3;\\n    margin: 1;\\n    z-index: 1;\\n    transition: opacity 0.3s;\\n    top: 0;\\n    left: 100%;\\n    margin-left: 2;\\n    box-shadow: tooltipBoxShadow;\\n\\n    :after {\\n      content: '';\\n      position: absolute;\\n      top: 0px;\\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 templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10;\n//# sourceMappingURL=styles.js.map"],"names":[],"mappings":"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"}
+{"version":3,"file":"styles.js","sources":["../../../../packages/ui/Forms/Input/styles.ts"],"sourcesContent":["import { __makeTemplateObject } from \"tslib\";\nimport styled, { css, system, th } from '@xstyled/styled-components';\nvar resolvePaddingRight = function (props) {\n    var $icon = props.$icon, $iconPlacement = props.$iconPlacement, $isClearable = props.$isClearable, $hasSuffix = props.$hasSuffix;\n    var padding = 2;\n    if ($icon && $iconPlacement === 'right')\n        padding += 1;\n    if ($isClearable)\n        padding += 1;\n    if ($hasSuffix)\n        padding += 2;\n    return String(padding);\n};\nexport var InputIcon = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([\"\\n  position: absolute;\\n\\n  // top: 52%; // TODO fix\\n  // transform: translateY(-50%); // TODO why does this do the overlap bug\\n  left: \", \";\\n  right: \", \";\\n\\n  svg {\\n    stroke: lightGray3;\\n    cursor: pointer;\\n  }\\n\"], [\"\\n  position: absolute;\\n\\n  // top: 52%; // TODO fix\\n  // transform: translateY(-50%); // TODO why does this do the overlap bug\\n  left: \", \";\\n  right: \", \";\\n\\n  svg {\\n    stroke: lightGray3;\\n    cursor: pointer;\\n  }\\n\"])), function (_a) {\n    var right = _a.right;\n    return (right ? 'auto' : '1em');\n}, function (_a) {\n    var right = _a.right;\n    return (right ? '0.5em' : 'auto');\n});\nexport var IconsController = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject([\"\\n  position: absolute;\\n  top: 0.2em;\\n  right: 0.5em;\\n\"], [\"\\n  position: absolute;\\n  top: 0.2em;\\n  right: 0.5em;\\n\"])));\nexport var IconWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject([\"\\n  display: flex;\\n  svg {\\n    :hover {\\n      cursor: pointer;\\n      color: blue2;\\n    }\\n  }\\n\"], [\"\\n  display: flex;\\n  svg {\\n    :hover {\\n      cursor: pointer;\\n      color: blue2;\\n    }\\n  }\\n\"])));\nexport var StyledInput = styled.input(templateObject_5 || (templateObject_5 = __makeTemplateObject([\"\\n  \", \";\\n  border: slim;\\n  border-color: \", \";\\n  box-sizing: border-box;\\n  background-clip: padding-box;\\n  padding-top: 0.5em;\\n  padding-bottom: 0.5em;\\n  padding-right: \", \"em;\\n  display: block;\\n  width: 100%;\\n  font-family: \", \";\\n  font-size: 14px;\\n  font-weight: medium;\\n  transition: inputTransition;\\n\\n  ~ \", \" {\\n    svg {\\n      stroke: lightGray3;\\n    }\\n  }\\n\\n  ::placeholder {\\n    color: gray1;\\n    opacity: 1;\\n  }\\n\\n  :focus {\\n    background-color: white;\\n    border-color: blue2;\\n    color: typoPrimary;\\n    outline: 0;\\n\\n    ~ \", \" {\\n      svg {\\n        stroke: blue2;\\n      }\\n    }\\n  }\\n  \", \";\\n  :disabled,\\n  :disabled:hover {\\n    background-color: lightGray1;\\n    border-color: lightGray3;\\n    color: gray;\\n  }\\n\\n  text-overflow: ellipsis;\\n\\n  -moz-appearance: textfield;\\n  appearance: textfield;\\n  ::-webkit-inner-spin-button {\\n    -webkit-appearance: none;\\n  }\\n\"], [\"\\n  \", \";\\n  border: slim;\\n  border-color: \", \";\\n  box-sizing: border-box;\\n  background-clip: padding-box;\\n  padding-top: 0.5em;\\n  padding-bottom: 0.5em;\\n  padding-right: \", \"em;\\n  display: block;\\n  width: 100%;\\n  font-family: \", \";\\n  font-size: 14px;\\n  font-weight: medium;\\n  transition: inputTransition;\\n\\n  ~ \", \" {\\n    svg {\\n      stroke: lightGray3;\\n    }\\n  }\\n\\n  ::placeholder {\\n    color: gray1;\\n    opacity: 1;\\n  }\\n\\n  :focus {\\n    background-color: white;\\n    border-color: blue2;\\n    color: typoPrimary;\\n    outline: 0;\\n\\n    ~ \", \" {\\n      svg {\\n        stroke: blue2;\\n      }\\n    }\\n  }\\n  \", \";\\n  :disabled,\\n  :disabled:hover {\\n    background-color: lightGray1;\\n    border-color: lightGray3;\\n    color: gray;\\n  }\\n\\n  text-overflow: ellipsis;\\n\\n  -moz-appearance: textfield;\\n  appearance: textfield;\\n  ::-webkit-inner-spin-button {\\n    -webkit-appearance: none;\\n  }\\n\"])), system, function (_a) {\n    var $isInvalid = _a.$isInvalid;\n    return ($isInvalid ? th.color('red1') : th.color('lightGray6'));\n}, function (props) { return resolvePaddingRight(props); }, th('fonts.primary'), InputIcon, InputIcon, function (_a) {\n    var big = _a.big;\n    return big\n        ? css(templateObject_4 || (templateObject_4 = __makeTemplateObject([\"\\n          font-size: 30px;\\n          color: gray;\\n          font-weight: semiBold;\\n          padding: 0 0.5rem 0 1.25rem;\\n        \"], [\"\\n          font-size: 30px;\\n          color: gray;\\n          font-weight: semiBold;\\n          padding: 0 0.5rem 0 1.25rem;\\n        \"]))) : '';\n});\nexport var InputWrap = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject([\"\\n  position: relative;\\n\"], [\"\\n  position: relative;\\n\"])));\nexport var Suffix = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject([\"\\n  position: absolute;\\n  right: 0;\\n  top: 0;\\n  font-size: 14px;\\n  font-weight: 700;\\n  height: 100%;\\n  width: 40px;\\n  padding: 2;\\n  color: typoPrimary;\\n  font-family: \", \";\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\\n  border: slim;\\n  border-top-right-radius: lg;\\n  border-bottom-right-radius: lg;\\n  border-left: none;\\n\\n  \", \";\\n\\n  input:focus ~ & {\\n    border-color: blue2;\\n  }\\n\"], [\"\\n  position: absolute;\\n  right: 0;\\n  top: 0;\\n  font-size: 14px;\\n  font-weight: 700;\\n  height: 100%;\\n  width: 40px;\\n  padding: 2;\\n  color: typoPrimary;\\n  font-family: \", \";\\n  display: flex;\\n  align-items: center;\\n  justify-content: center;\\n  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\\n  border: slim;\\n  border-top-right-radius: lg;\\n  border-bottom-right-radius: lg;\\n  border-left: none;\\n\\n  \", \";\\n\\n  input:focus ~ & {\\n    border-color: blue2;\\n  }\\n\"])), th('fonts.primary'), function (_a) {\n    var $isPointer = _a.$isPointer;\n    return $isPointer\n        ? css(templateObject_7 || (templateObject_7 = __makeTemplateObject([\"\\n          cursor: pointer;\\n        \"], [\"\\n          cursor: pointer;\\n        \"]))) : '';\n});\nexport var InputRow = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject([\"\\n  position: relative;\\n  color: \", \";\\n  & > * {\\n    border-color: \", \";\\n    color: \", \";\\n  }\\n  :hover > * {\\n    border-color: \", \";\\n  }\\n  &:focus-within {\\n    color: typoPrimary;\\n  }\\n  .primary {\\n    line-height: 0;\\n    height: 38px;\\n    border-radius: lg;\\n    ~ \", \" {\\n      top: 10px;\\n    }\\n  }\\n  .grid {\\n    line-height: 1.2px;\\n    border-radius: md;\\n    ~ \", \" {\\n      top: 7px;\\n    }\\n  }\\n  .left {\\n    padding-left: \", \";\\n  }\\n  .right {\\n    padding-right: 1.4em;\\n    padding-left: 1em;\\n  }\\n\"], [\"\\n  position: relative;\\n  color: \", \";\\n  & > * {\\n    border-color: \", \";\\n    color: \", \";\\n  }\\n  :hover > * {\\n    border-color: \", \";\\n  }\\n  &:focus-within {\\n    color: typoPrimary;\\n  }\\n  .primary {\\n    line-height: 0;\\n    height: 38px;\\n    border-radius: lg;\\n    ~ \", \" {\\n      top: 10px;\\n    }\\n  }\\n  .grid {\\n    line-height: 1.2px;\\n    border-radius: md;\\n    ~ \", \" {\\n      top: 7px;\\n    }\\n  }\\n  .left {\\n    padding-left: \", \";\\n  }\\n  .right {\\n    padding-right: 1.4em;\\n    padding-left: 1em;\\n  }\\n\"])), function (_a) {\n    var $isInvalid = _a.$isInvalid;\n    return ($isInvalid ? th.color('red1') : th.color('gray'));\n}, function (_a) {\n    var $isInvalid = _a.$isInvalid;\n    return ($isInvalid ? th.color('red1') : th.color('lightGray6'));\n}, function (_a) {\n    var $isInvalid = _a.$isInvalid, hasValue = _a.hasValue;\n    return $isInvalid ? th.color('red1') : hasValue ? th.color('typoPrimary') : th.color('gray');\n}, function (_a) {\n    var disabled = _a.disabled;\n    return (disabled ? th.color('lightGray3') : th.color('gray5'));\n}, InputIcon, InputIcon, function (_a) {\n    var $icon = _a.$icon;\n    return ($icon ? '3em' : '1em');\n});\nexport var Tooltip = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject([\"\\n  span {\\n    display: none;\\n    position: absolute;\\n    width: 120px;\\n    background-color: white;\\n    color: red1;\\n    border-color: red1;\\n    border: 1px solid;\\n    text-align: center;\\n    border-radius: lg;\\n    padding: 1 3;\\n    margin: 1;\\n    z-index: 1;\\n    transition: opacity 0.3s;\\n    top: 0;\\n    left: 100%;\\n    margin-left: 2;\\n    box-shadow: tooltipBoxShadow;\\n\\n    :after {\\n      content: '';\\n      position: absolute;\\n      top: 0px;\\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: white;\\n    color: red1;\\n    border-color: red1;\\n    border: 1px solid;\\n    text-align: center;\\n    border-radius: lg;\\n    padding: 1 3;\\n    margin: 1;\\n    z-index: 1;\\n    transition: opacity 0.3s;\\n    top: 0;\\n    left: 100%;\\n    margin-left: 2;\\n    box-shadow: tooltipBoxShadow;\\n\\n    :after {\\n      content: '';\\n      position: absolute;\\n      top: 0px;\\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 templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10;\n//# sourceMappingURL=styles.js.map"],"names":[],"mappings":"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"}

package/ui/dts/Elements/Icon/icons/BarcodeScan.d.ts

@@ -0,0 +1,3 @@
+import { SvgProps } from '../types';
+import { FC } from 'react';
+export declare const BarcodeScan: FC<SvgProps>;

package/ui/dts/Elements/Icon/icons/ImagePlaceholder.d.ts

@@ -0,0 +1,3 @@
+import { SvgProps } from '../types';
+import { FC } from 'react';
+export declare const ImagePlaceholder: FC<SvgProps>;

package/ui/dts/Elements/Icon/icons/index.d.ts

@@ -16,3 +16,5 @@ export { Return } from './Return';
 export { Settings2 } from './Settings2';
 export { Transfer } from './Transfer';
 export { Product } from './Product';
+export { ImagePlaceholder } from './ImagePlaceholder';
+export { BarcodeScan } from './BarcodeScan';

package/ui/dts/Elements/Icon/index.d.ts

@@ -1,6 +1,6 @@
 import Icon from './Icon';
 export type { IconProps } from './types';
-export { FlagCZ, FlagUSA, Complaint, Expeditions, HamburgerMenu, HelpCircle1, Income, Inventory, MenuItems, MobileCancel, Notification2, Plus1, Products, Profile, Return, Settings2, Transfer, Product, } from './icons';
+export * from './icons';
 export { iconDictionary } from './Icon';
 export { Icon };
 export default Icon;

package/ui/index.d.ts

@@ -11,7 +11,7 @@ export { default as Button } from './Elements/Button/index.js';
 export { default as Card } from './Elements/Card/index.js';
 export { default as Dropdown } from './Elements/Dropdown/Dropdown.js';
 export { default as ErrorMessage } from './Elements/ErrorMessage/index.js';
-export { Complaint, Expeditions, FlagCZ, FlagUSA, HamburgerMenu, HelpCircle1, default as Icon, Income, Inventory, MenuItems, MobileCancel, Notification2, Plus1, Product, Products, Profile, Return, Settings2, Transfer } from './Elements/Icon/index.js';
+export { BarcodeScan, Complaint, Expeditions, FlagCZ, FlagUSA, HamburgerMenu, HelpCircle1, default as Icon, ImagePlaceholder, Income, Inventory, MenuItems, MobileCancel, Notification2, Plus1, Product, Products, Profile, Return, Settings2, Transfer } from './Elements/Icon/index.js';
 export { default as Image } from './Elements/Image/Image.js';
 export { FieldLabel, Label } from './Elements/Label/Label.js';
 export { default as Line } from './Elements/Line/index.js';

package/ui/index.js

@@ -35,6 +35,8 @@ export { Return } from './Elements/Icon/icons/Return.js';
 export { Settings2 } from './Elements/Icon/icons/Settings2.js';
 export { Transfer } from './Elements/Icon/icons/Transfer.js';
 export { Product } from './Elements/Icon/icons/Product.js';
+export { ImagePlaceholder } from './Elements/Icon/icons/ImagePlaceholder.js';
+export { BarcodeScan } from './Elements/Icon/icons/BarcodeScan.js';
 export { default as Image } from './Elements/Image/Image.js';
 export { FieldLabel, Label } from './Elements/Label/Label.js';
 export { default as Line } from './Elements/Line/Line.js';

package/ui/index.js.map

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